sourcehypertextpublicaboutpassportwarp.js

documentReady(() => {
	const passport = $("#passport");

	passport.on("click", () => {
		passport.dataset.side =
			passport.dataset?.side == "inside" ? "cover" : "inside";
	});

	document.body.on("mousemove", evt => {
		const passportRect = passport.getBoundingClientRect();

		const lightX = (evt.clientX - passportRect.left) / passportRect.width;
		const lightY = (evt.clientY - passportRect.top) / passportRect.height;

		passport.style.setProperty("--light-x-raw", `${lightX}`);
		passport.style.setProperty("--light-y-raw", `${lightY}`);
	});
});