Added correct iframe size loading

app/static/js/iframe.js

@@ -43,32 +43,8 @@ function openIframe(url) {
     window.history.pushState({ iframe: url }, '', newUrl.toString());
 }
 
-document.addEventListener("DOMContentLoaded", function () {
+// Function to restore the original main content and style
-    // Initialize global variables
+function restoreOriginal() {
-    mainElement = document.querySelector("main");
-    originalContent = mainElement.innerHTML;
-    originalMainStyle = mainElement.getAttribute("style"); // might be null if no inline style exists
-
-    container = document.querySelector(".container");
-    customScrollbar = document.getElementById("custom-scrollbar");
-
-    // Get all links that should open in an iframe
-    const links = document.querySelectorAll(".iframe-link");
-
-    // Add click event listener to each iframe link
-    links.forEach(link => {
-        link.addEventListener("click", function (event) {
-            event.preventDefault(); // Prevent default link behavior
-            const url = this.getAttribute("href");
-            openIframe(url);
-        });
-    });
-
-    // Add click event listener to header h1 to restore the original main content and style
-    const headerH1 = document.querySelector("header h1");
-    if (headerH1) {
-        headerH1.style.cursor = "pointer";
-        headerH1.addEventListener("click", function () {
     // Restore the original content of the main element (removing the iframe)
     mainElement.innerHTML = originalContent;
 
@@ -79,12 +55,12 @@ document.addEventListener("DOMContentLoaded", function () {
         mainElement.removeAttribute("style");
     }
 
-            // Optionally revert the container class back to "container" if needed
+    // Revert the container class back to "container" if needed
     if (container && container.classList.contains("container-fluid")) {
         container.classList.replace("container-fluid", "container");
     }
 
-            // Optionally show the custom scrollbar again
+    // Show the custom scrollbar again
     if (customScrollbar) {
         customScrollbar.style.display = "";
     }
@@ -94,14 +70,37 @@ document.addEventListener("DOMContentLoaded", function () {
         adjustScrollContainerHeight();
     }
 
-            // Also update the URL to remove the iframe param
+    // Update the URL to remove the iframe param
     const newUrl = new URL(window.location);
     newUrl.searchParams.delete("iframe");
     window.history.pushState({}, '', newUrl.toString());
-        });
 }
 
-    // Adjust iframe height on window resize (optional, to keep it responsive)
+document.addEventListener("DOMContentLoaded", function () {
+    // Initialize global variables
+    mainElement = document.querySelector("main");
+    originalContent = mainElement.innerHTML;
+    originalMainStyle = mainElement.getAttribute("style"); // might be null if no inline style exists
+
+    container = document.querySelector(".container");
+    customScrollbar = document.getElementById("custom-scrollbar");
+
+    // Set up click handlers for iframe links
+    document.querySelectorAll(".iframe-link").forEach(link => {
+        link.addEventListener("click", function (event) {
+            event.preventDefault(); // Prevent default link behavior
+            openIframe(this.href);
+        });
+    });
+
+    // Set up click handler on header h1 to restore original state
+    const headerH1 = document.querySelector("header h1");
+    if (headerH1) {
+        headerH1.style.cursor = "pointer";
+        headerH1.addEventListener("click", restoreOriginal);
+    }
+
+    // Responsive resize: adjust iframe height when window resizes
     window.addEventListener("resize", function () {
         const iframe = mainElement.querySelector("iframe");
         if (iframe) {
@@ -109,13 +108,15 @@ document.addEventListener("DOMContentLoaded", function () {
         }
     });
 
-    // On initial load: check if URL has iframe parameter
+    // Wait until all resources are loaded before doing the initial iframe check
+    window.addEventListener("load", function () {
         const initialParams = new URLSearchParams(window.location.search);
         const iframeUrl = initialParams.get('iframe');
         if (iframeUrl) {
             openIframe(iframeUrl);
         }
     });
+});
 
 // Handle browser back/forward navigation
 window.addEventListener('popstate', function (event) {
@@ -125,7 +126,6 @@ window.addEventListener('popstate', function(event) {
     if (iframeUrl) {
         openIframe(iframeUrl);
     } else {
-        // Simulate click on H1 to restore original state
         const headerH1 = document.querySelector("header h1");
         if (headerH1) headerH1.click();
     }