orientation-utils.js (1455B)
1 /** 2 * 3 * @param {object} options 4 * @param {string} options.src - The iframe src 5 * @param {Window} options.context - The browsing context in which the iframe will be created 6 * @param {string} options.sandbox - The sandbox attribute for the iframe 7 * @returns 8 */ 9 export async function attachIframe(options = {}) { 10 const { src, context, sandbox, allowFullscreen } = { 11 ...{ 12 src: "about:blank", 13 context: self, 14 allowFullscreen: true, 15 sandbox: null, 16 }, 17 ...options, 18 }; 19 const iframe = context.document.createElement("iframe"); 20 if (sandbox !== null) iframe.sandbox = sandbox; 21 iframe.allowFullscreen = allowFullscreen; 22 await new Promise((resolve) => { 23 iframe.onload = resolve; 24 iframe.src = src; 25 context.document.body.appendChild(iframe); 26 }); 27 return iframe; 28 } 29 30 export function getOppositeOrientation() { 31 return screen.orientation.type.startsWith("portrait") 32 ? "landscape" 33 : "portrait"; 34 } 35 36 export function makeCleanup(options = {}) { 37 const { 38 iframe, 39 initialOrientation = screen.orientation?.type.split(/-/)[0] 40 } = options; 41 42 return async () => { 43 if (iframe) { 44 iframe.remove(); 45 } 46 47 if (initialOrientation) { 48 try { 49 await screen.orientation.lock(initialOrientation); 50 } catch {} 51 } 52 screen.orientation.unlock(); 53 requestAnimationFrame(async () => { 54 try { 55 await document.exitFullscreen(); 56 } catch {} 57 }); 58 }; 59 }