about blank mode

This commit is contained in:
rift 2023-12-27 18:44:35 -06:00
parent 4f8f18f0ff
commit bc73f5d3f3
4 changed files with 56 additions and 45 deletions

18
src/AboutBlank.tsx Normal file
View file

@ -0,0 +1,18 @@
import { LoadSuspense } from "./LoadSuspense";
export function AboutBlank(props: { url: string }) {
var newWindow = window.open("about:blank");
var iframe = document.createElement("iframe");
iframe.src = window.location.origin + props.url;
iframe.style.width = "100%";
iframe.style.height = "100%";
iframe.style.border = "none";
iframe.style.overflow = "hidden";
newWindow.document.body.appendChild(iframe);
window.location.replace("https://google.com");
return (
<div>
<LoadSuspense />
</div>
);
}

View file

@ -2,7 +2,12 @@ import { useState } from "preact/hooks";
import { useTranslation } from "react-i18next";
import { Link } from "preact-router";
import { RiPictureInPictureExitFill, RiFullscreenFill } from "react-icons/ri";
import { IoCodeSlashSharp,IoChevronBackSharp,IoChevronForwardSharp, IoReloadSharp } from "react-icons/io5";
import {
IoCodeSlashSharp,
IoChevronBackSharp,
IoChevronForwardSharp,
IoReloadSharp
} from "react-icons/io5";
import { FaXmark } from "react-icons/fa6";
interface ProxyFrame extends HTMLElement {
@ -25,7 +30,7 @@ export function IframeHeader(props: { url: string }) {
return (
<div
id="iframeNav"
className="flex h-16 flex-row items-center justify-between bg-navbar-color px-4 gap-3"
className="flex h-16 flex-row items-center justify-between gap-3 bg-navbar-color px-4"
>
<Link href="/" class="w-1/8">
<div className="flex flex-row items-center">
@ -40,29 +45,35 @@ export function IframeHeader(props: { url: string }) {
</h1>
</div>
</Link>
<div className="gap-3 mr-4 flex flex-row items-center justify-end">
<IoChevronBackSharp
className="duration-0500 h-6 w-6 cursor-pointer text-navbar-text-color transition-all hover:scale-110 hover:brightness-125"
onClick={() => {
const proxyFrame: ProxyFrame | null = document.getElementById("iframe") as ProxyFrame;
proxyFrame.contentWindow.history.back();
}}
/>
<IoReloadSharp
className="duration-0500 h-6 w-6 cursor-pointer text-navbar-text-color transition-all hover:rotate-[360deg] hover:scale-110 hover:brightness-125"
onClick={() => {
const proxyFrame: ProxyFrame | null = document.getElementById("iframe") as ProxyFrame;
proxyFrame.contentWindow.location.reload();
}}
/>
<IoChevronForwardSharp
<div className="mr-4 flex flex-row items-center justify-end gap-3">
<IoChevronBackSharp
className="duration-0500 h-6 w-6 cursor-pointer text-navbar-text-color transition-all hover:scale-110 hover:brightness-125"
onClick={() => {
const proxyFrame: ProxyFrame | null = document.getElementById("iframe") as ProxyFrame;
const proxyFrame: ProxyFrame | null = document.getElementById(
"iframe"
) as ProxyFrame;
proxyFrame.contentWindow.history.back();
}}
/>
<IoReloadSharp
className="duration-0500 h-6 w-6 cursor-pointer text-navbar-text-color transition-all hover:rotate-[360deg] hover:scale-110 hover:brightness-125"
onClick={() => {
const proxyFrame: ProxyFrame | null = document.getElementById(
"iframe"
) as ProxyFrame;
proxyFrame.contentWindow.location.reload();
}}
/>
<IoChevronForwardSharp
className="duration-0500 h-6 w-6 cursor-pointer text-navbar-text-color transition-all hover:scale-110 hover:brightness-125"
onClick={() => {
const proxyFrame: ProxyFrame | null = document.getElementById(
"iframe"
) as ProxyFrame;
proxyFrame.contentWindow.history.forward();
}}
/>
</div>
/>
</div>
<div id="navItems" class="w-1/8">
<div className="mr-4 flex flex-row items-center justify-end gap-3">
<IoCodeSlashSharp

View file

@ -81,28 +81,9 @@ export function ProxyFrame(props: { url: string }) {
window.location.href = ProxiedUrl; // This is the hackiest workaround in the history of hacky workarounds
}
} else if (proxyMode == "aboutblank") {
const newWindow = window.open("about:blank", "_blank");
const newDocument = newWindow.document.open();
newDocument.write(`
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
body, html
{
margin: 0; padding: 0; height: 100%; overflow: hidden;
}
</style>
</head>
<body>
<iframe style="border: none; width: 100%; height: 100vh;" src="${
window.location.origin + ProxiedUrl
}"></iframe>
</body>
</html>
`);
newDocument.close();
window.location.replace("/");
if (!(ProxiedUrl == undefined)) {
window.location.href = "/ab/" + encodeURIComponent(ProxiedUrl);
}
}
if (!ProxiedUrl == undefined) {
window.location.href = ProxiedUrl;

View file

@ -4,7 +4,7 @@ import { NotFound } from "./pages/_404.jsx";
import { DiscordPage } from "./pages/discord.jsx";
import { ProxyFrame } from "./pages/ProxyFrame.js";
import { Settings } from "./pages/Settings/index.js";
import { AboutBlank } from "./AboutBlank";
import "./style.css";
import "./themes/main.css";
import "./i18n";
@ -17,6 +17,7 @@ export default function Routes() {
<Route path="/discord" component={DiscordPage} />
<Route path="/go/:url" component={ProxyFrame} />
<Route path="/settings" component={Settings} />
<Route path="/ab/:url" component={AboutBlank} />
<Route default component={NotFound} />
</Router>
</LocationProvider>