<script>
	import "../app.css";
	import {onMount} from "svelte";

	// A function that gets the current window size and posts it to the parent window
	function postWindowSize() {
		const payload = {
			type: 'window_size',
			height: document.querySelector('.library-card').offsetHeight,
			src: window.location.href,
		}
		window.parent.postMessage({ payload }, "*");
	}

	onMount(function() {
		window.removeEventListener('resize', postWindowSize);
		window.addEventListener('resize', postWindowSize);
		window.removeEventListener('load', postWindowSize)
		window.addEventListener('load', postWindowSize)
		document.removeEventListener('DOMContentLoaded', postWindowSize);
		document.addEventListener('DOMContentLoaded', postWindowSize);
		postWindowSize()
	})

	// if (typeof window !== 'undefined') {
	// 	console.log("REGISTER LISTENER")
	// 	window.removeEventListener('resize', postWindowSize);
	// 	window.addEventListener('resize', postWindowSize);
	// 	window.removeEventListener('load', postWindowSize)
	// 	window.addEventListener('load', postWindowSize)
	// 	document.removeEventListener('DOMContentLoaded', postWindowSize);
	// 	document.addEventListener('DOMContentLoaded', postWindowSize);
	// }
</script>

<slot />