import { PlacementMeta } from './placements/placements.models';
import { iFrameScript, IframeType } from 'dot-utils';

// @ts-ignore
const $ = window.jQuery || window.$;

$(document).ready(() => {
	const widgets = Array.from(document.querySelectorAll('[data-dot-widget-placement]'));

	if (!widgets?.length) {
		return null;
	}

	const safeJsonParse = (str: string) => {
		try {
			return JSON.parse(str);
		} catch (e) {
			return null;
		}
	};

	widgets.forEach((el) => {
		const placementDataString = el.getAttribute('data-dot-widget-placement');
		const placementData: PlacementMeta = safeJsonParse(placementDataString as string);

		if (!placementData) {
			return;
		}

		const widgetId = placementData.widget_id[0];
		const format = placementData.format[0].split(',') as IframeType[];

		format.forEach((type) => {
			const widgetHtml = iFrameScript(widgetId, type);
			$(widgetHtml).insertAfter(el);
		});
	});
});