mirror of
				https://github.com/kevinveenbirkenbach/homepage.veen.world.git
				synced 2025-11-04 09:27:58 +00:00 
			
		
		
		
	Added correct iframe size loading
This commit is contained in:
		@@ -43,32 +43,8 @@ function openIframe(url) {
 | 
				
			|||||||
    window.history.pushState({ iframe: url }, '', newUrl.toString());
 | 
					    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)
 | 
					    // Restore the original content of the main element (removing the iframe)
 | 
				
			||||||
    mainElement.innerHTML = originalContent;
 | 
					    mainElement.innerHTML = originalContent;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@@ -79,12 +55,12 @@ document.addEventListener("DOMContentLoaded", function () {
 | 
				
			|||||||
        mainElement.removeAttribute("style");
 | 
					        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")) {
 | 
					    if (container && container.classList.contains("container-fluid")) {
 | 
				
			||||||
        container.classList.replace("container-fluid", "container");
 | 
					        container.classList.replace("container-fluid", "container");
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
            // Optionally show the custom scrollbar again
 | 
					    // Show the custom scrollbar again
 | 
				
			||||||
    if (customScrollbar) {
 | 
					    if (customScrollbar) {
 | 
				
			||||||
        customScrollbar.style.display = "";
 | 
					        customScrollbar.style.display = "";
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
@@ -94,14 +70,37 @@ document.addEventListener("DOMContentLoaded", function () {
 | 
				
			|||||||
        adjustScrollContainerHeight();
 | 
					        adjustScrollContainerHeight();
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
            // Also update the URL to remove the iframe param
 | 
					    // Update the URL to remove the iframe param
 | 
				
			||||||
    const newUrl = new URL(window.location);
 | 
					    const newUrl = new URL(window.location);
 | 
				
			||||||
    newUrl.searchParams.delete("iframe");
 | 
					    newUrl.searchParams.delete("iframe");
 | 
				
			||||||
    window.history.pushState({}, '', newUrl.toString());
 | 
					    window.history.pushState({}, '', newUrl.toString());
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					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);
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    // Adjust iframe height on window resize (optional, to keep it responsive)
 | 
					    // Responsive resize: adjust iframe height when window resizes
 | 
				
			||||||
    window.addEventListener("resize", function () {
 | 
					    window.addEventListener("resize", function () {
 | 
				
			||||||
        const iframe = mainElement.querySelector("iframe");
 | 
					        const iframe = mainElement.querySelector("iframe");
 | 
				
			||||||
        if (iframe) {
 | 
					        if (iframe) {
 | 
				
			||||||
@@ -109,23 +108,24 @@ 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 initialParams = new URLSearchParams(window.location.search);
 | 
				
			||||||
        const iframeUrl = initialParams.get('iframe');
 | 
					        const iframeUrl = initialParams.get('iframe');
 | 
				
			||||||
        if (iframeUrl) {
 | 
					        if (iframeUrl) {
 | 
				
			||||||
            openIframe(iframeUrl);
 | 
					            openIframe(iframeUrl);
 | 
				
			||||||
        }
 | 
					        }
 | 
				
			||||||
 | 
					    });
 | 
				
			||||||
});
 | 
					});
 | 
				
			||||||
 | 
					
 | 
				
			||||||
// Handle browser back/forward navigation
 | 
					// Handle browser back/forward navigation
 | 
				
			||||||
window.addEventListener('popstate', function(event) {
 | 
					window.addEventListener('popstate', function (event) {
 | 
				
			||||||
    const url = new URL(window.location);
 | 
					    const url = new URL(window.location);
 | 
				
			||||||
    const iframeUrl = url.searchParams.get('iframe');
 | 
					    const iframeUrl = url.searchParams.get('iframe');
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    if (iframeUrl) {
 | 
					    if (iframeUrl) {
 | 
				
			||||||
        openIframe(iframeUrl);
 | 
					        openIframe(iframeUrl);
 | 
				
			||||||
    } else {
 | 
					    } else {
 | 
				
			||||||
        // Simulate click on H1 to restore original state
 | 
					 | 
				
			||||||
        const headerH1 = document.querySelector("header h1");
 | 
					        const headerH1 = document.querySelector("header h1");
 | 
				
			||||||
        if (headerH1) headerH1.click();
 | 
					        if (headerH1) headerH1.click();
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user