RevelaNetwork/Revelav3
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Formatting

Browse source
This commit is contained in:
MotorTruck1221 2024-03-06 01:19:16 -07:00
parent 69823802f5
commit 8f531aff11
No known key found for this signature in database
GPG key ID: 06901A625432AC21
14 changed files with 568 additions and 541 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

80
Checkfailed.html
View file

@ -1,40 +1,40 @@
<!doctype html> <!doctype html>
<html> <html>
<head> <head>
<title>Welcome to nginx!</title> <title>Welcome to nginx!</title>
<style> <style>
html { html {
color-scheme: light dark; color-scheme: light dark;
} }
body { body {
width: 35em; width: 35em;
margin: 0 auto; margin: 0 auto;
font-family: Tahoma, Verdana, Arial, sans-serif; font-family: Tahoma, Verdana, Arial, sans-serif;
} }
</style> </style>
</head> </head>
<body> <body>
<h1>Welcome to nginx!</h1> <h1>Welcome to nginx!</h1>
<p> <p>
If you see this page, the nginx web server is successfully installed and If you see this page, the nginx web server is successfully installed and
working. Further configuration is required. If you are expecting another working. Further configuration is required. If you are expecting another
page, please check your network or page, please check your network or
<a href="/" id="rcheck"><b>Refresh this page</b></a> <a href="/" id="rcheck"><b>Refresh this page</b></a>
</p> </p>
<p> <p>
For online documentation and support please refer to For online documentation and support please refer to
<a href="http://nginx.org/">nginx.org</a>.<br /> <a href="http://nginx.org/">nginx.org</a>.<br />
Commercial support is available at Commercial support is available at
<a href="http://nginx.com/">nginx.com</a>. <a href="http://nginx.com/">nginx.com</a>.
</p> </p>
<p><em>Thank you for using nginx.</em></p> <p><em>Thank you for using nginx.</em></p>
<script> <script>
if (!localStorage["auth"] && new URL(document.all.rcheck.href).password) { if (!localStorage["auth"] && new URL(document.all.rcheck.href).password) {
window.location.reload(); window.location.reload();
localStorage["auth"] = 1; localStorage["auth"] = 1;
} }
</script> </script>
</body> </body>
</html> </html>

124
package.json
View file

@ -1,62 +1,62 @@
{ {
"name": "nebula", "name": "nebula",
"private": true, "private": true,
"type": "module", "type": "module",
"scripts": { "scripts": {
"dev": "concurrently \"vite\" \"bare-server-node --port 8080\"", "dev": "concurrently \"vite\" \"bare-server-node --port 8080\"",
"build": "vite build", "build": "vite build",
"bstart": "npm run build && tsx server.ts", "bstart": "npm run build && tsx server.ts",
"start": "tsx server.ts", "start": "tsx server.ts",
"preview": "vite preview", "preview": "vite preview",
"format": "prettier --write ." "format": "prettier --write ."
}, },
"dependencies": { "dependencies": {
"@fastify/compress": "^6.5.0", "@fastify/compress": "^6.5.0",
"@fastify/cookie": "^9.3.1", "@fastify/cookie": "^9.3.1",
"@fastify/static": "^6.12.0", "@fastify/static": "^6.12.0",
"@mercuryworkshop/bare-mux": "^1.0.4", "@mercuryworkshop/bare-mux": "^1.0.4",
"@mercuryworkshop/epoxy-transport": "^1.0.2", "@mercuryworkshop/epoxy-transport": "^1.0.2",
"@nebula-services/bare-server-node": "2.0.1-patch.1", "@nebula-services/bare-server-node": "2.0.1-patch.1",
"@nebula-services/dynamic": "0.7.2-patch.2", "@nebula-services/dynamic": "0.7.2-patch.2",
"@titaniumnetwork-dev/ultraviolet": "^3.0.0", "@titaniumnetwork-dev/ultraviolet": "^3.0.0",
"@types/express": "^4.17.21", "@types/express": "^4.17.21",
"chalk": "^5.3.0", "chalk": "^5.3.0",
"classnames": "^2.5.1", "classnames": "^2.5.1",
"compression": "^1.7.4", "compression": "^1.7.4",
"cookie-parser": "^1.4.6", "cookie-parser": "^1.4.6",
"crypto-js": "^4.2.0", "crypto-js": "^4.2.0",
"express": "^4.18.3", "express": "^4.18.3",
"fastify": "^4.26.2", "fastify": "^4.26.2",
"framer-motion": "^10.18.0", "framer-motion": "^10.18.0",
"i18next": "^23.10.0", "i18next": "^23.10.0",
"i18next-browser-languagedetector": "^7.2.0", "i18next-browser-languagedetector": "^7.2.0",
"localforage": "^1.10.0", "localforage": "^1.10.0",
"million": "^2.6.4", "million": "^2.6.4",
"preact": "^10.19.6", "preact": "^10.19.6",
"preact-iso": "^2.4.0", "preact-iso": "^2.4.0",
"preact-render-to-string": "^6.4.0", "preact-render-to-string": "^6.4.0",
"preact-router": "^4.1.2", "preact-router": "^4.1.2",
"rammerhead": "https://github.com/NebulaServices/rammerhead/releases/download/rammerhead-1.2.41-nebula.8/rammerhead-1.2.41-nebula.7.tgz", "rammerhead": "https://github.com/NebulaServices/rammerhead/releases/download/rammerhead-1.2.41-nebula.8/rammerhead-1.2.41-nebula.7.tgz",
"react-helmet": "^6.1.0", "react-helmet": "^6.1.0",
"react-i18next": "^13.5.0", "react-i18next": "^13.5.0",
"react-icons": "^4.12.0", "react-icons": "^4.12.0",
"react-toastify": "^9.1.3", "react-toastify": "^9.1.3",
"tsx": "^4.7.1", "tsx": "^4.7.1",
"wisp-server-node": "^1.0.1", "wisp-server-node": "^1.0.1",
"ws": "^8.16.0" "ws": "^8.16.0"
}, },
"devDependencies": { "devDependencies": {
"@preact/preset-vite": "^2.8.1", "@preact/preset-vite": "^2.8.1",
"autoprefixer": "^10.4.18", "autoprefixer": "^10.4.18",
"concurrently": "^8.2.2", "concurrently": "^8.2.2",
"eslint": "^8.57.0", "eslint": "^8.57.0",
"eslint-config-preact": "^1.3.0", "eslint-config-preact": "^1.3.0",
"postcss": "^8.4.35", "postcss": "^8.4.35",
"prettier": "^3.2.5", "prettier": "^3.2.5",
"prettier-plugin-tailwindcss": "^0.5.11", "prettier-plugin-tailwindcss": "^0.5.11",
"tailwindcss": "^3.4.1", "tailwindcss": "^3.4.1",
"typescript": "^5.3.3", "typescript": "^5.3.3",
"vite": "^5.1.4", "vite": "^5.1.4",
"vite-plugin-static-copy": "^1.0.1" "vite-plugin-static-copy": "^1.0.1"
} }
} }

5
server.ts
View file

@ -158,9 +158,8 @@ server.on("upgrade", (req: Request, socket: Socket, head: Head) => {
bare.routeUpgrade(req, socket, head); bare.routeUpgrade(req, socket, head);
} else if (shouldRouteRh(req)) { } else if (shouldRouteRh(req)) {
routeRhUpgrade(req, socket, head); routeRhUpgrade(req, socket, head);
} } else if (req.url.endsWith("/wisp/")) {
else if (req.url.endsWith("/wisp/")) { wisp.routeRequest(req, socket, head);
wisp.routeRequest(req, socket, head);
} }
}); });

176
src/components/Meta.tsx
View file

@ -1,88 +1,88 @@
import { Helmet } from "react-helmet"; import { Helmet } from "react-helmet";
export default function Meta() { export default function Meta() {
return ( return (
<Helmet> <Helmet>
<meta name="googlebot" content="index, follow, snippet" /> <meta name="googlebot" content="index, follow, snippet" />
<link rel="canonical" href="https://nebulaproxy.io/" /> <link rel="canonical" href="https://nebulaproxy.io/" />
<meta <meta
name="keywords" name="keywords"
content="proxy, web proxy, unblock websites, unblock chromebook, free web proxy, proxy list, proxy sites, un block chromebook, online proxy, proxy server, proxysite, proxy youtube, bypass securly, bypass iboss, bypass lightspeed filter, chromebooks, titanium network, unblock youtube, youtube proxy, unblocked youtube, youtube unblocked" content="proxy, web proxy, unblock websites, unblock chromebook, free web proxy, proxy list, proxy sites, un block chromebook, online proxy, proxy server, proxysite, proxy youtube, bypass securly, bypass iboss, bypass lightspeed filter, chromebooks, titanium network, unblock youtube, youtube proxy, unblocked youtube, youtube unblocked"
/> />
<meta <meta
name="description" name="description"
content="NebulaWeb is an official flagship of Nebula Services and Nebula Developer Labs. NebulaWeb is a stunning, sleek, and functional web-proxy with support for thousands of popular sites. With NebulaWeb, the sky is the limit." content="NebulaWeb is an official flagship of Nebula Services and Nebula Developer Labs. NebulaWeb is a stunning, sleek, and functional web-proxy with support for thousands of popular sites. With NebulaWeb, the sky is the limit."
/> />
<meta property="og:site_name" content="Nebula" /> <meta property="og:site_name" content="Nebula" />
<meta property="og:url" content="https://nebulaproxy.io/" /> <meta property="og:url" content="https://nebulaproxy.io/" />
<meta property="og:title" content="Nebula" /> <meta property="og:title" content="Nebula" />
<meta property="og:image" content="/logo.png" /> <meta property="og:image" content="/logo.png" />
<meta property="og:image:secure_url" content="/logo.png" /> <meta property="og:image:secure_url" content="/logo.png" />
<meta property="og:type" content="website" /> <meta property="og:type" content="website" />
<meta name="color-scheme" content="light dark" /> <meta name="color-scheme" content="light dark" />
<meta property="og:title" content="Nebula" /> <meta property="og:title" content="Nebula" />
<meta <meta
content="A stunning and sleak web proxy frontend with support for hundreds of popular sites." content="A stunning and sleak web proxy frontend with support for hundreds of popular sites."
property="og:description" property="og:description"
/> />
<meta name="theme-color" content="#191724" /> <meta name="theme-color" content="#191724" />
<script type="application/ld+json"> <script type="application/ld+json">
{` {`
{ {
"@context": "https://schema.org", "@context": "https://schema.org",
"@type": "Organization", "@type": "Organization",
"name": "Nebula", "name": "Nebula",
"url": "https://nebulaproxy.io", "url": "https://nebulaproxy.io",
"sameAs": [ "sameAs": [
"https://github.com/NebulaServices", "https://github.com/NebulaServices",
"https://nebulaproxy.io" "https://nebulaproxy.io"
] ]
} }
`} `}
</script> </script>
<script type="application/ld+json"> <script type="application/ld+json">
{` {`
{ {
"@context": "https://schema.org", "@context": "https://schema.org",
"@type": "FAQPage", "@type": "FAQPage",
"mainEntity": [{ "mainEntity": [{
"@type": "Question", "@type": "Question",
"name": "How do I get more links?", "name": "How do I get more links?",
"acceptedAnswer": { "acceptedAnswer": {
"@type": "Answer", "@type": "Answer",
"text": "You can more links by joining our discord server at discord.gg/unblocker" "text": "You can more links by joining our discord server at discord.gg/unblocker"
} }
}, { }, {
"@type": "Question", "@type": "Question",
"name": "How can I self host Nebula?", "name": "How can I self host Nebula?",
"acceptedAnswer": { "acceptedAnswer": {
"@type": "Answer", "@type": "Answer",
"text": "Instructions for self hosting Nebula can be found at our GitHub repository." "text": "Instructions for self hosting Nebula can be found at our GitHub repository."
} }
}, { }, {
"@type": "Question", "@type": "Question",
"name": "What sites can I unblock with Nebula?", "name": "What sites can I unblock with Nebula?",
"acceptedAnswer": { "acceptedAnswer": {
"@type": "Answer", "@type": "Answer",
"text": "With Nebula you can access sites such as Discord, Spotify, YouTube and other game sites!" "text": "With Nebula you can access sites such as Discord, Spotify, YouTube and other game sites!"
} }
}, { }, {
"@type": "Question", "@type": "Question",
"name": "Does Nebula hide my search history?", "name": "Does Nebula hide my search history?",
"acceptedAnswer": { "acceptedAnswer": {
"@type": "Answer", "@type": "Answer",
"text": "Yes! Change your Tab appearance in Settings and make the tab look like another site!." "text": "Yes! Change your Tab appearance in Settings and make the tab look like another site!."
} }
}, { }, {
"@type": "Question", "@type": "Question",
"name": "Is Nebula open-source?", "name": "Is Nebula open-source?",
"acceptedAnswer": { "acceptedAnswer": {
"@type": "Answer", "@type": "Answer",
"text": "Yes! Check out our GitHub where you can deploy or host your own instance of Nebula." "text": "Yes! Check out our GitHub where you can deploy or host your own instance of Nebula."
} }
}] }]
} }
`} `}
</script> </script>
</Helmet> </Helmet>
); );
} }

8
src/pages/Faq.css
View file

@ -1,4 +1,4 @@
.highlighted { .highlighted {
background-color: var(--navbar-text-color); background-color: var(--navbar-text-color);
transition: background-color 1s ease; transition: background-color 1s ease;
} }

102
src/pages/Faq.tsx
View file

@ -1,51 +1,51 @@
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { HeaderRoute } from "../components/HeaderRoute"; import { HeaderRoute } from "../components/HeaderRoute";
import CloakedHead from "../util/CloakedHead"; import CloakedHead from "../util/CloakedHead";
import { useEffect } from "preact/hooks"; import { useEffect } from "preact/hooks";
import "./Faq.css"; import "./Faq.css";
export function Faq() { export function Faq() {
const { t } = useTranslation(); const { t } = useTranslation();
const faqData = t("faq", { returnObjects: true }); const faqData = t("faq", { returnObjects: true });
useEffect(() => { useEffect(() => {
const hash = window.location.hash.substring(1); const hash = window.location.hash.substring(1);
if (hash) { if (hash) {
const highlightedDiv = document.getElementById(hash); const highlightedDiv = document.getElementById(hash);
if (highlightedDiv) { if (highlightedDiv) {
highlightedDiv.classList.add("highlighted"); highlightedDiv.classList.add("highlighted");
} }
} }
}, []); }, []);
return ( return (
<HeaderRoute> <HeaderRoute>
<CloakedHead <CloakedHead
originalTitle={t("titles.discord")} originalTitle={t("titles.discord")}
originalFavicon="/logo.png" originalFavicon="/logo.png"
/> />
<div class="p-10"> <div class="p-10">
{Object.values(faqData).map((item, index) => ( {Object.values(faqData).map((item, index) => (
<div key={index} className="py-3"> <div key={index} className="py-3">
<p className="text-4xl" id={(index + 1).toString()}> <p className="text-4xl" id={(index + 1).toString()}>
{item.q} {item.q}
</p> </p>
<div class="flex flex-row"> <div class="flex flex-row">
<p className="text-lg"> <p className="text-lg">
{item.a}{" "} {item.a}{" "}
{item.h && ( {item.h && (
<a href={item.hR} class="underline"> <a href={item.hR} class="underline">
{item.h} {item.h}
</a> </a>
)} )}
</p> </p>
</div> </div>
</div> </div>
))} ))}
</div> </div>
</HeaderRoute> </HeaderRoute>
); );
} }

58
src/pages/Settings/BareTest.tsx
View file

@ -1,29 +1,29 @@
export function BareTest(bareUrl) { export function BareTest(bareUrl) {
const headers = new Headers({ const headers = new Headers({
"x-bare-url": "https://www.google.com", "x-bare-url": "https://www.google.com",
"X-Bare-Headers": JSON.stringify({ "X-Bare-Headers": JSON.stringify({
Accept: Accept:
"text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9" "text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9"
}) })
}); });
return fetch(bareUrl, { return fetch(bareUrl, {
method: "GET", method: "GET",
headers: headers headers: headers
}) })
.then((response) => { .then((response) => {
if ( if (
response.headers.get("x-bare-status") === "200" || response.headers.get("x-bare-status") === "200" ||
response.headers.get("x-bare-status") === "302" response.headers.get("x-bare-status") === "302"
) { ) {
return true; return true;
} else { } else {
// the site is a real site but doesn't act like a bare server // the site is a real site but doesn't act like a bare server
return false; return false;
} }
}) })
.catch((error) => { .catch((error) => {
// incase the site doesn't exist // incase the site doesn't exist
return false; return false;
}); });
} }

2
src/pages/Settings/Dropdown.tsx
View file

@ -9,7 +9,7 @@ interface Option {
const Dropdown = ({ const Dropdown = ({
storageKey, storageKey,
options, options,
refresh, refresh
}: { }: {
storageKey: string; storageKey: string;
options: Option[]; options: Option[];

42
src/pages/Settings/Proxy.tsx
View file

@ -29,11 +29,12 @@ const Proxy = ({ id, active }) => {
{ id: "https://bing.com/search?q=%s", label: "Bing" } { id: "https://bing.com/search?q=%s", label: "Bing" }
]; ];
const wispUrl = (location.protocol === "https:" ? "wss://" : "ws://") + location.host + "/wisp/"; const wispUrl =
(location.protocol === "https:" ? "wss://" : "ws://") +
location.host +
"/wisp/";
//libcurl can be added here when it's stable //libcurl can be added here when it's stable
const transports = [ const transports = [{ id: "epoxy", label: "Epoxy" }];
{ id: "epoxy", label: "Epoxy" }
];
return ( return (
<motion.div <motion.div
@ -93,22 +94,27 @@ const Proxy = ({ id, active }) => {
<BareInput placeholder="/bare/" storageKey="bare" /> <BareInput placeholder="/bare/" storageKey="bare" />
</div> </div>
<div className="flex h-64 w-80 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-2 text-center"> <div className="flex h-64 w-80 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-2 text-center">
<div className="p-2 text-3xl font-bold text-input-text"> <div className="p-2 text-3xl font-bold text-input-text">
Wisp Server Wisp Server
</div> </div>
<div className="text-md p-4 font-bold text-input-text"> <div className="text-md p-4 font-bold text-input-text">
Enter the url of a Wisp server Enter the url of a Wisp server
</div> </div>
<WispInput placeholder={wispUrl} /> <WispInput placeholder={wispUrl} />
</div> </div>
<div className="flex h-64 w-80 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-2 text-center"> <div className="flex h-64 w-80 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-2 text-center">
<div className="p-2 text-3xl font-bold text-input-text"> <div className="p-2 text-3xl font-bold text-input-text">
Transport Transport
</div> </div>
<div className="text-md p-4 font-bold text-input-text"> <div className="text-md p-4 font-bold text-input-text">
Select the transport to use Select the transport to use
</div> </div>
<Dropdown storageKey="transport" options={transports} refresh={false} onChange={(value) => changeTransport(value, wispUrl)} /> <Dropdown
storageKey="transport"
options={transports}
refresh={false}
onChange={(value) => changeTransport(value, wispUrl)}
/>
</div> </div>
<div className="flex h-96 w-96 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-2 text-center"> <div className="flex h-96 w-96 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-2 text-center">
<div className="p-2 text-3xl font-bold text-input-text"> <div className="p-2 text-3xl font-bold text-input-text">

280
src/pages/Settings/ProxyInput.tsx
View file

@ -1,140 +1,140 @@
import { useState, useEffect } from "preact/hooks"; import { useState, useEffect } from "preact/hooks";
import { set } from "../../util/IDB"; import { set } from "../../util/IDB";
import { uninstallServiceWorkers } from "../../util/SWHelper"; import { uninstallServiceWorkers } from "../../util/SWHelper";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { ToastContainer, toast } from "react-toastify"; import { ToastContainer, toast } from "react-toastify";
interface BareInputProps { interface BareInputProps {
placeholder: string; placeholder: string;
storageKey: string; storageKey: string;
} }
function ProxyInput(props: BareInputProps) { function ProxyInput(props: BareInputProps) {
const { t } = useTranslation(); const { t } = useTranslation();
const bareServer = localStorage.getItem("bare") || "/bare/"; const bareServer = localStorage.getItem("bare") || "/bare/";
const HTTPProxy = localStorage.getItem("HTTPProxy") || ""; const HTTPProxy = localStorage.getItem("HTTPProxy") || "";
const [inputValue, setInputValue] = useState(HTTPProxy); const [inputValue, setInputValue] = useState(HTTPProxy);
function resetProxy() { function resetProxy() {
set("HTTPProxy", ""); set("HTTPProxy", "");
localStorage.setItem("HTTPProxy", ""); localStorage.setItem("HTTPProxy", "");
uninstallServiceWorkers(); uninstallServiceWorkers();
window.location.reload(); window.location.reload();
} }
function validateUrl(url: string) { function validateUrl(url: string) {
let finalUrl = url; let finalUrl = url;
if (url === null || url === undefined || url === "") { if (url === null || url === undefined || url === "") {
finalUrl = ""; finalUrl = "";
return finalUrl; return finalUrl;
} }
return finalUrl; return finalUrl;
} }
function handleChange() { function handleChange() {
const proxyUrl = validateUrl( const proxyUrl = validateUrl(
(document.getElementById("pinput") as HTMLInputElement).value (document.getElementById("pinput") as HTMLInputElement).value
); );
if (!(proxyUrl === "")) { if (!(proxyUrl === "")) {
const [proxyIP, proxyPort] = proxyUrl.split(":"); const [proxyIP, proxyPort] = proxyUrl.split(":");
fetch(bareServer) fetch(bareServer)
.then((response) => response.json()) .then((response) => response.json())
.then((jsonResponse) => { .then((jsonResponse) => {
if (jsonResponse.hasOwnProperty("HTTPProxy")) { if (jsonResponse.hasOwnProperty("HTTPProxy")) {
const headers = new Headers({ const headers = new Headers({
"x-bare-url": "https://www.google.com", "x-bare-url": "https://www.google.com",
"X-Bare-Headers": JSON.stringify({ "X-Bare-Headers": JSON.stringify({
Accept: Accept:
"text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9" "text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9"
}), }),
"x-bare-proxy-ip": proxyIP, "x-bare-proxy-ip": proxyIP,
"x-bare-proxy-port": proxyPort "x-bare-proxy-port": proxyPort
}); });
return fetch(bareServer + "v3/", { return fetch(bareServer + "v3/", {
method: "GET", method: "GET",
headers: headers headers: headers
}) })
.then((response) => { .then((response) => {
if ( if (
response.headers.get("x-bare-status") === "200" || response.headers.get("x-bare-status") === "200" ||
response.headers.get("x-bare-status") === "302" response.headers.get("x-bare-status") === "302"
) { ) {
// Success! // Success!
set("HTTPProxy", proxyUrl); set("HTTPProxy", proxyUrl);
localStorage.setItem("HTTPProxy", proxyUrl); localStorage.setItem("HTTPProxy", proxyUrl);
uninstallServiceWorkers(); uninstallServiceWorkers();
window.location.reload(); window.location.reload();
return true; return true;
} else { } else {
( (
document.getElementById("pinput") as HTMLInputElement document.getElementById("pinput") as HTMLInputElement
).value = localStorage.getItem("HTTPProxy") || ""; ).value = localStorage.getItem("HTTPProxy") || "";
toast(t("settings.httpProxy.badProxy"), { toast(t("settings.httpProxy.badProxy"), {
type: "error" type: "error"
}); });
} }
}) })
.catch((error) => { .catch((error) => {
(document.getElementById("pinput") as HTMLInputElement).value = (document.getElementById("pinput") as HTMLInputElement).value =
localStorage.getItem("HTTPProxy") || ""; localStorage.getItem("HTTPProxy") || "";
toast(t("settings.httpProxy.badProxy"), { toast(t("settings.httpProxy.badProxy"), {
type: "error" type: "error"
}); });
}); });
} else { } else {
(document.getElementById("pinput") as HTMLInputElement).value = (document.getElementById("pinput") as HTMLInputElement).value =
localStorage.getItem("HTTPProxy") || ""; localStorage.getItem("HTTPProxy") || "";
toast(t("settings.httpProxy.badBare"), { toast(t("settings.httpProxy.badBare"), {
type: "error" type: "error"
}); });
} }
}) })
.catch((error) => console.error("Error:", error)); .catch((error) => console.error("Error:", error));
} else { } else {
// reset UV config to have no proxy // reset UV config to have no proxy
set("HTTPProxy", ""); set("HTTPProxy", "");
localStorage.setItem("HTTPProxy", ""); localStorage.setItem("HTTPProxy", "");
uninstallServiceWorkers(); uninstallServiceWorkers();
window.location.reload(); window.location.reload();
} }
} }
return ( return (
<div> <div>
<ToastContainer position="bottom-right" theme="dark" /> <ToastContainer position="bottom-right" theme="dark" />
<div className="flex flex-col items-center"> <div className="flex flex-col items-center">
<input <input
type="text" type="text"
placeholder={props.placeholder} placeholder={props.placeholder}
value={inputValue} value={inputValue}
onKeyPress={(event) => { onKeyPress={(event) => {
if (event.key === "Enter") { if (event.key === "Enter") {
handleChange(); handleChange();
} }
}} }}
id="pinput" id="pinput"
className="font-roboto flex h-14 w-56 flex-row rounded-2xl border border-input-border-color bg-input p-4 text-center text-sm text-input-text" className="font-roboto flex h-14 w-56 flex-row rounded-2xl border border-input-border-color bg-input p-4 text-center text-sm text-input-text"
/> />
<div class="flex flex-row gap-4"> <div class="flex flex-row gap-4">
<div <div
className="font-roboto mt-2 flex h-4 w-36 cursor-pointer flex-row items-center justify-center rounded-xl border border-input-border-color bg-input p-5 text-center text-lg text-input-text" className="font-roboto mt-2 flex h-4 w-36 cursor-pointer flex-row items-center justify-center rounded-xl border border-input-border-color bg-input p-5 text-center text-lg text-input-text"
onClick={handleChange} onClick={handleChange}
> >
{t("settings.bare.select")} {t("settings.bare.select")}
</div> </div>
<div <div
className="font-roboto mt-2 flex h-4 w-36 cursor-pointer flex-row items-center justify-center rounded-xl border border-input-border-color bg-input p-5 text-center text-lg text-input-text" className="font-roboto mt-2 flex h-4 w-36 cursor-pointer flex-row items-center justify-center rounded-xl border border-input-border-color bg-input p-5 text-center text-lg text-input-text"
onClick={resetProxy} onClick={resetProxy}
> >
{t("settings.httpProxy.reset")} {t("settings.httpProxy.reset")}
</div> </div>
</div> </div>
</div> </div>
</div> </div>
); );
} }
export default ProxyInput; export default ProxyInput;

124
src/pages/Settings/WispInput.tsx
View file

@ -1,58 +1,66 @@
import { useState, useEffect } from "preact/hooks"; import { useState, useEffect } from "preact/hooks";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { changeTransport } from "../../util/transports"; import { changeTransport } from "../../util/transports";
import { ToastContainer, toast } from "react-toastify"; import { ToastContainer, toast } from "react-toastify";
interface WispInputProps { interface WispInputProps {
placeholder: string; placeholder: string;
} }
function WispInput(props: WispInputProps) { function WispInput(props: WispInputProps) {
const { t } = useTranslation(); const { t } = useTranslation();
const value = localStorage.getItem("wispUrl") || (location.protocol === "https:" ? "wss://" : "ws://") + location.host + "/wisp/"; const value =
const [inputValue, setInputValue] = useState(value); localStorage.getItem("wispUrl") ||
function validateUrl(url: string) { (location.protocol === "https:" ? "wss://" : "ws://") +
let finalUrl = url; location.host +
if (finalUrl.startsWith("http://")) { "/wisp/";
finalUrl = finalUrl.replace("http://", "ws://"); const [inputValue, setInputValue] = useState(value);
} else if (finalUrl.startsWith("https://")) { function validateUrl(url: string) {
finalUrl = finalUrl.replace("https://", "wss://"); let finalUrl = url;
} if (finalUrl.startsWith("http://")) {
else if (finalUrl === "" || finalUrl === null || finalUrl === undefined) { finalUrl = finalUrl.replace("http://", "ws://");
finalUrl = (location.protocol === "https:" ? "wss://" : "ws://") + location.host + "/wisp/"; } else if (finalUrl.startsWith("https://")) {
} finalUrl = finalUrl.replace("https://", "wss://");
return finalUrl; } else if (finalUrl === "" || finalUrl === null || finalUrl === undefined) {
} finalUrl =
function handleChange() { (location.protocol === "https:" ? "wss://" : "ws://") +
const url = validateUrl((document.getElementById("wispinput") as HTMLInputElement).value); location.host +
localStorage.setItem("wispUrl", url); "/wisp/";
changeTransport(localStorage.getItem("transport") || "epoxy", url); }
} return finalUrl;
return ( }
<div> function handleChange() {
<ToastContainer position="bottom-right" theme="dark" /> const url = validateUrl(
<div className="flex flex-col items-center"> (document.getElementById("wispinput") as HTMLInputElement).value
<input );
type="text" localStorage.setItem("wispUrl", url);
placeholder={props.placeholder} changeTransport(localStorage.getItem("transport") || "epoxy", url);
value={inputValue} }
onKeyPress={(event) => { return (
if (event.key === "Enter") { <div>
handleChange(); <ToastContainer position="bottom-right" theme="dark" />
} <div className="flex flex-col items-center">
}} <input
id="wispinput" type="text"
className="font-roboto flex h-14 w-56 flex-row rounded-2xl border border-input-border-color bg-input p-4 text-center text-xl text-input-text" placeholder={props.placeholder}
/> value={inputValue}
<div onKeyPress={(event) => {
className="font-roboto mt-2 flex h-4 w-36 cursor-pointer flex-row items-center justify-center rounded-xl border border-input-border-color bg-input p-5 text-center text-lg text-input-text" if (event.key === "Enter") {
onClick={handleChange} handleChange();
> }
Select }}
</div> id="wispinput"
</div> className="font-roboto flex h-14 w-56 flex-row rounded-2xl border border-input-border-color bg-input p-4 text-center text-xl text-input-text"
</div> />
); <div
} className="font-roboto mt-2 flex h-4 w-36 cursor-pointer flex-row items-center justify-center rounded-xl border border-input-border-color bg-input p-5 text-center text-lg text-input-text"
onClick={handleChange}
export default WispInput; >
Select
</div>
</div>
</div>
);
}
export default WispInput;

6
src/pages/config.json
View file

@ -1,3 +1,3 @@
{ {
"prod": false "prod": false
} }

94
src/util/transports.ts
View file

@ -1,40 +1,54 @@
import { SetTransport, registerRemoteListener } from "@mercuryworkshop/bare-mux"; import {
SetTransport,
registerRemoteListener
declare global { } from "@mercuryworkshop/bare-mux";
interface Window {
BareMux: any; declare global {
p: any; interface Window {
} BareMux: any;
} p: any;
}
function changeTransport(transport: string, wispUrl: string) { }
switch (transport) {
case "epoxy": function changeTransport(transport: string, wispUrl: string) {
localStorage.setItem("transport", "epoxy"); switch (transport) {
SetTransport("EpxMod.EpoxyClient", { wisp: wispUrl }); case "epoxy":
break; localStorage.setItem("transport", "epoxy");
//libcurl when supported can be easily added here SetTransport("EpxMod.EpoxyClient", { wisp: wispUrl });
//and stuff like bare-as-module3 COULD also be added break;
default: //libcurl when supported can be easily added here
SetTransport("EpxMod.EpoxyClient", { wisp: wispUrl }); //and stuff like bare-as-module3 COULD also be added
break; default:
} SetTransport("EpxMod.EpoxyClient", { wisp: wispUrl });
} break;
}
function getTransport() { }
return localStorage.getItem("transport") || "epoxy";
} function getTransport() {
return localStorage.getItem("transport") || "epoxy";
function restartTransport() { }
changeTransport(getTransport(), localStorage.getItem("wispUrl") || (location.protocol === "https:" ? "wss://" : "ws://") + location.host + "/wisp/");
} function restartTransport() {
changeTransport(
//restart transport every minute getTransport(),
setInterval(restartTransport, 60000); //60000ms = 60s = 1m localStorage.getItem("wispUrl") ||
(location.protocol === "https:" ? "wss://" : "ws://") +
const wispUrl = (location.protocol === "https:" ? "wss://" : "ws://") + location.host + "/wisp/"; location.host +
registerRemoteListener(navigator.serviceWorker.controller!); "/wisp/"
changeTransport(localStorage.getItem("transport") || "epoxy", localStorage.getItem("wispUrl") || wispUrl); );
}
export { changeTransport, getTransport };
//restart transport every minute
setInterval(restartTransport, 60000); //60000ms = 60s = 1m
const wispUrl =
(location.protocol === "https:" ? "wss://" : "ws://") +
location.host +
"/wisp/";
registerRemoteListener(navigator.serviceWorker.controller!);
changeTransport(
localStorage.getItem("transport") || "epoxy",
localStorage.getItem("wispUrl") || wispUrl
);
export { changeTransport, getTransport };

8
vite.config.ts
View file

@ -25,10 +25,10 @@ export default defineConfig({
// overwrite: false // overwrite: false
//}, //},
{ {
//include ALL files types //include ALL files types
src: `${epoxyPath}/**/*`, src: `${epoxyPath}/**/*`,
dest: "epoxy", dest: "epoxy",
overwrite: false overwrite: false
}, },
{ {
// .replace fixes weird paths on Windows // .replace fixes weird paths on Windows