add env vars for configuring onion and I2P urls

Signed-off-by: ngn <ngn@ngn.tf>

app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "website",
-  "version": "6.1",
+  "version": "6.2",
   "private": true,
   "scripts": {
     "dev": "vite dev",

app/src/lib/api.js

@@ -1,9 +1,9 @@
-import { urljoin } from "$lib/util.js";
+import { urljoin, env_url } from "$lib/util.js";
 
 const api_version = "v1";
-const api_url = urljoin(import.meta.env.WEBSITE_API_URL, api_version);
 
 function api_urljoin(path = null, query = {}) {
+  let api_url = urljoin(env_url("API"), api_version);
   return urljoin(api_url, path, query);
 }
 

app/src/lib/doc.js

@@ -1,4 +1,4 @@
-import { urljoin } from "$lib/util.js";
+import { urljoin, env_url } from "$lib/util.js";
 
 function doc_urljoin(path = null, query = {}) {
   return urljoin(import.meta.env.WEBSITE_DOC_URL, path, query);

app/src/lib/footer.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { urljoin, color, date_from_ts } from "$lib/util.js";
+  import { app_url, color, date_from_ts } from "$lib/util.js";
   import { api_get_metrics } from "$lib/api.js";
   import Link from "$lib/link.svelte";
 
@@ -20,15 +20,11 @@
     </span>
     <span>/</span>
     <span>
-      <Link link={urljoin(import.meta.env.WEBSITE_APP_URL, "doc/license")} bold={true}
+      <Link link={app_url("/doc/license")} bold={true}>{$_("footer.license")}</Link>
-        >{$_("footer.license")}</Link
-      >
     </span>
     <span>/</span>
     <span>
-      <Link link={urljoin(import.meta.env.WEBSITE_APP_URL, "doc/privacy")} bold={true}
+      <Link link={app_url("/doc/privacy")} bold={true}>{$_("footer.privacy")}</Link>
-        >{$_("footer.privacy")}</Link
-      >
     </span>
   </div>
   <span class="counter">

app/src/lib/util.js

@@ -1,4 +1,6 @@
 import { locale_from_browser } from "$lib/locale.js";
+import { browser } from "$app/environment";
+import { page } from "$app/state";
 
 const colors = [
   "yellow",
@@ -19,7 +21,7 @@ function color() {
 }
 
 function click() {
-  let audio = new Audio("/click.wav");
+  let audio = new Audio("/assets/click.wav");
   audio.play();
 }
 
@@ -39,8 +41,18 @@ function urljoin(url, path = null, query = {}) {
   return url.href;
 }
 
+function env_url(prefix) {
+  let host = "";
+
+  if (browser) host = window.location.hostname;
+
+  if (host.endsWith(".onion")) return import.meta.env["WEBSITE_" + prefix + "_URL_ONION"];
+  else if (host.endsWith(".i2p")) return import.meta.env["WEBSITE_" + prefix + "_URL_I2P"];
+  else return import.meta.env["WEBSITE_" + prefix + "_URL_CLEAR"];
+}
+
 function app_url(path = null, query = {}) {
-  return urljoin(import.meta.env.WEBSITE_APP_URL, path, query);
+  return urljoin(env_url("APP"), path, query);
 }
 
 function time_from_ts(ts) {
@@ -68,4 +80,4 @@ function date_from_ts(ts) {
   }).format(new Date(ts * 1000));
 }
 
-export { color, click, urljoin, app_url, time_from_ts, date_from_ts };
+export { color, click, urljoin, env_url, app_url, time_from_ts, date_from_ts };

app/src/routes/+layout.svelte

@@ -21,7 +21,7 @@
 </main>
 
 <style>
-  @import "/global.css";
+  @import "/css/global.css";
 
   main {
     display: flex;

app/src/routes/doc/[name]/+page.svelte

@@ -37,7 +37,7 @@
 {/if}
 
 <style>
-  @import "/markdown.css";
+  @import "/css/markdown.css";
 
   main {
     padding: 50px;

app/static/css/font.css

@@ -6,5 +6,5 @@
   font-style: normal;
   font-weight: 300;
   font-display: swap;
-  src: url("/ubuntu.woff2") format("woff2");
+  src: url("/assets/ubuntu.woff2") format("woff2");
 }

app/static/css/global.css

@@ -31,7 +31,8 @@
     rgba(20, 20, 20, 0.3) 0px 18px 36px -18px inset;
 
   --text-shadow: 3px 2px 8px rgba(50, 50, 50, 0.8);
-  --background: linear-gradient(rgba(11, 11, 11, 0.808), rgba(1, 1, 1, 0.96)), url("/banner.png");
+  --background: linear-gradient(rgba(11, 11, 11, 0.808), rgba(1, 1, 1, 0.96)),
+    url("/assets/banner.png");
   --profile-size: 220px;
 }
 

app/vite.config.js

@@ -3,21 +3,44 @@ import { defineConfig } from "vite";
 import { fileURLToPath } from "url";
 import { readFileSync } from "fs";
 
+function env_from(prefix, object) {
+  for (const [key, value] of Object.entries(object)) {
+    let type = typeof value;
+    let name = prefix + "_" + key.toUpperCase();
+
+    switch (type) {
+      case "object":
+        env_from(name, value);
+        break;
+
+      case "string":
+        if (process.env[name] === undefined) process.env[name] = value;
+        break;
+    }
+  }
+}
+
 const default_env = {
-  REPORT_URL: "https://github.com/ngn13/website/issues",
+  source_url: "https://git.ngn.tf/ngn/website",
-  SOURCE_URL: "https://github.com/ngn13/website",
+  report_url: "https://git.ngn.tf/ngn/website/issues",
-  APP_URL: "http://localhost:7001",
+  doc_url: "http://localhost:7003",
-  API_URL: "http://localhost:7002",
+  app_url: {
-  DOC_URL: "http://localhost:7003",
+    clear: "http://localhost:7001",
+    onion: "",
+    i2p: "",
+  },
+  api_url: {
+    clear: "http://localhost:7002",
+    onion: "",
+    i2p: "",
+  },
 };
 
-const file = fileURLToPath(new URL("package.json", import.meta.url));
+const package_file = fileURLToPath(new URL("package.json", import.meta.url));
-const json = readFileSync(file, "utf8");
+const package_json = readFileSync(package_file, "utf8");
-const pkg = JSON.parse(json);
+const package_data = JSON.parse(package_json);
 
-for (let env in default_env) {
+env_from("WEBSITE", default_env);
-  if (process.env["WEBSITE_" + env] === undefined) process.env["WEBSITE_" + env] = default_env[env];
-}
 
 export default defineConfig({
   plugins: [sveltekit()],
@@ -31,6 +54,6 @@ export default defineConfig({
     strictPort: true,
   },
   define: {
-    pkg: pkg,
+    pkg: package_data,
   },
 });