diff --git a/public/generic_globe.png b/public/generic_globe.png new file mode 100644 index 0000000..79b56da Binary files /dev/null and b/public/generic_globe.png differ diff --git a/src/components/iframe/IframeHeader.tsx b/src/components/iframe/IframeHeader.tsx index 125048e..835de1d 100644 --- a/src/components/iframe/IframeHeader.tsx +++ b/src/components/iframe/IframeHeader.tsx @@ -1,4 +1,4 @@ -import { useState } from "preact/hooks"; +import { useState, useEffect } from "preact/hooks"; import { useTranslation } from "react-i18next"; import { Link } from "preact-router"; import { RiPictureInPictureExitFill, RiFullscreenFill } from "react-icons/ri"; @@ -19,6 +19,33 @@ export function IframeHeader(props: { url: string }) { const { t } = useTranslation(); const [showPopout, setShowPopout] = useState(false); const [showFullScreen, setFullScreen] = useState(false); + const [proxiedTitle, setProxiedTitle] = useState(""); + const [proxiedFavicon, setProxiedFavicon] = useState("/generic_globe.png"); + + useEffect(() => { + const intervalFunction = () => { + let proxyFrame: ProxyFrame | null = document.getElementById( + "iframe" + ) as ProxyFrame; + if (proxyFrame) { + let faviconLink = + proxyFrame.contentDocument.querySelector("link[rel*='icon']"); + if (faviconLink) { + setProxiedFavicon(faviconLink.href); + } else { + setProxiedFavicon("/generic_globe.png"); + } + setProxiedTitle(proxyFrame.contentDocument.title); + } else { + console.log( + "ehhh this aint supposed to happen. no proxied iframe found." + ); + } + }; + + const intervalId = setInterval(intervalFunction, 1000); + return () => clearInterval(intervalId); + }, []); if (showPopout) { window.location.replace(props.url); @@ -32,20 +59,15 @@ export function IframeHeader(props: { url: string }) { id="iframeNav" className="flex h-16 flex-row items-center justify-between gap-3 bg-navbar-color px-4" > - +
- Nebula Logo -

- {" "} - {t("header.title")}{" "} + +

+ {proxiedTitle ? proxiedTitle : "Loading..."}

- -
+
+ {/*
{ @@ -73,7 +95,7 @@ export function IframeHeader(props: { url: string }) { proxyFrame.contentWindow.history.forward(); }} /> -
+
*/}