https://rooms.xyz/js-common/html-widget.js

1// HTML widget functions.
2
3// If not null, then we have a widget open and that's the iframe element.
4let curIframe = null;
5
6export function openHtmlWidget(url, x, y, width, height) {
7  if (curIframe) closeHtmlWidget();
8  curIframe = document.createElement("iframe");
9  curIframe.src = url;
10  curIframe.style.border = "none";
11  positionHtmlWidget(x, y, width, height);
12  document.body.appendChild(curIframe);
13  console.log(`Opened HTML widget iframe at (${x}, ${y}) size ${width}x${height}`);
14}
15
16export function positionHtmlWidget(x, y, width, height) {
17  console.log(`Repositioning HTML widget iframe to (${x}, ${y}) size ${width}x${height}`);
18  curIframe.style.position = "absolute";
19  curIframe.style.top = y + "px";
20  curIframe.style.left = x + "px";
21  curIframe.style.width = width + "px";
22  curIframe.style.height = height + "px";
23  curIframe.style.zIndex = "2147483647";
24}
25
26export function closeHtmlWidget() {
27  if (!curIframe) return;
28  document.body.removeChild(curIframe);
29  curIframe = null;
30  console.log(`Closed HTML widget iframe`);
31}
32
33// Handle window resize - remove focus from iframe and return focus to window
34window.addEventListener('resize', function() {
35  if (curIframe) {
36    // Remove focus from the iframe
37    curIframe.blur();
38    // Return focus to the window
39    window.focus();
40    console.log('Window resized - removed focus from iframe and returned focus to window');
41  }
42});
43
44window.things = window.things || {};
45window.things.closeHtmlWidget = closeHtmlWidget;
46window.things.openHtmlWidget = openHtmlWidget;
47window.things.positionHtmlWidget = positionHtmlWidget;