remove elements if new tab

README.md

@@ -55,9 +55,9 @@ air dev
 
 ## TODO
 
+- implement templating for every one of the frontend files
 - implement functionality to clear and clean cache
-- implement fetching in intervals
+- host this website on a demo page
-    - host this website on a demo page
 - implement ctl
 - implement autocomplete with a nice go backend and fast communication. Since it all runs locally nobody should have privacy concerns NEEDS TO BE ABLE TO TOGGLED OFF FOR DEMO PAGE
 

demo.toml

@@ -0,0 +1,17 @@
+[Server]
+Port = 1312
+
+[DiyHrt]
+FetchIntervals = 60
+
+[Template]
+ActiveCard = "listings"
+PageTitle = "TransfemStartpage demo"
+HeaderPhrases = [
+    "GirlJuice.Inject();",
+    "You.Cute = true;",
+    "You.Gay = true;",
+    "Nazi.Punch();",
+    "Dolls.GiveGuns();",
+    "Firefox > Chrome"
+]

frontend/assets/style.css

@@ -49,16 +49,6 @@ body {
     color: black;
 }
 
-@media (max-height: 300px) {
-    .search-grid {
-        grid-template-rows: 4em;
-    }
-
-    .search-logo {
-        display: none;
-    }
-}
-
 .cards {
     height: 100%;
     width: 100%;
@@ -70,6 +60,20 @@ body {
     overflow: auto;
 }
 
+@media (max-height: 500px) {
+    .search-grid {
+        grid-template-rows: 4em;
+    }
+
+    .search-logo {
+        display: none;
+    }
+
+    .cards {
+        display: none;
+    }
+}
+
 .card {
     background-color: rgba(255, 255, 255, 0.5);
     width: 10em;
@@ -97,7 +101,6 @@ body {
     margin: 0;
 }
 
-
 .card-image {
     height: 100%;
     aspect-ratio: 1/1;

frontend/scripts/search.js

@@ -4,90 +4,94 @@ const form = document.getElementById("search-form");
 const input = document.getElementById("search-input");
 
 // https://stackoverflow.com/a/3809435/16804841
-const expression = /https?:\/\/(www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_\+.~#?&//=]*)/gi;
+const expression =
+  /https?:\/\/(www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_\+.~#?&//=]*)/gi;
 const urlRegex = new RegExp(expression);
 
 const searchEngines = {
-    "g": {
+  g: {
-        action: "https://www.google.com/search",
+    action: "https://www.google.com/search",
-        name: "q",
+    name: "q",
-    },
+  },
-    "d": {
+  d: {
-        action: "https://duckduckgo.com/",
+    action: "https://duckduckgo.com/",
-        name: "q",
+    name: "q",
-    },
+  },
-    "y": {
+  y: {
-        action: "https://yandex.com/search/",
+    action: "https://www.youtube.com/results",
-        name: "text",
+    name: "search_query",
-    },
+  },
-    "lure": {
+  ya: {
-        action: "https://lure.sh/pkgs",
+    action: "https://yandex.com/search/",
-        name: "q",
+    name: "text",
-    },
+  },
+  lure: {
+    action: "https://lure.sh/pkgs",
+    name: "q",
+  },
 };
 
-const translationPrefixes = [
+const translationPrefixes = ["t", "translation"];
-    "t",
-    "translation",
-]
-
 
 function getDeepLUrl(s) {
-    const parts = s.split("-")
+  const parts = s.split("-");
-    if (parts.length != 3) {
+  if (parts.length != 3) {
-        return undefined
+    return undefined;
-    }
+  }
 
-    return `https://www.deepl.com/en/translator?/#${encodeURIComponent(parts[0].trim())}/${encodeURIComponent(parts[1].trim())}/${encodeURIComponent(parts[2].trim())}`;
+  return `https://www.deepl.com/en/translator?/#${encodeURIComponent(
+    parts[0].trim()
+  )}/${encodeURIComponent(parts[1].trim())}/${encodeURIComponent(
+    parts[2].trim()
+  )}`;
 }
 
+form.addEventListener("submit", (event) => {
+  event.preventDefault();
 
-form.addEventListener("submit", event => {
+  s = input.value;
-    event.preventDefault();
 
-    s = input.value;
+  // check if url
+  if (s.match(urlRegex)) {
+    window.open(s, "_self");
+    return;
+  }
 
-    // check if url
+  // deepl translations
-    if (s.match(urlRegex)) {
+  let doTranslation = false;
-        window.open(s, "_self");
+  for (const value of translationPrefixes) {
-        return
+    const prefix = `!${value} `;
+    if (s.startsWith(prefix)) {
+      doTranslation = true;
+      s = s.slice(prefix.length); // Remove the !{key} prefix
+      break;
     }
+  }
 
-    // deepl translations
+  if (doTranslation) {
-    let doTranslation = false;
+    const url = getDeepLUrl(s);
-    for (const value of translationPrefixes) {
+    if (url) {
-        const prefix = `!${value} `;
+      window.open(url.toString(), "_self");
-        if (s.startsWith(prefix)) {
+      return;
-            doTranslation = true;
-            s = s.slice(prefix.length); // Remove the !{key} prefix
-            break;
-        }
     }
+  }
 
-    if (doTranslation) {
+  // Check if the string starts with ! followed by a key from searchEngines
-        const url = getDeepLUrl(s);
+  let selectedEngine = {
-        if (url) {
+    action: form.getAttribute("action"),
-            window.open(url.toString(), "_self");
+    name: input.getAttribute("name"),
-            return;
+  };
-        }
+
+  for (const [key, value] of Object.entries(searchEngines)) {
+    const prefix = `!${key} `;
+    if (s.startsWith(prefix)) {
+      selectedEngine = value;
+      s = s.slice(prefix.length); // Remove the !{key} prefix
+      break;
     }
+  }
 
-    // Check if the string starts with ! followed by a key from searchEngines
+  const url = new URL(selectedEngine.action);
-    let selectedEngine = {
+  url.searchParams.set(selectedEngine.name, s.trim());
-        action: form.getAttribute("action"),
+  window.open(url.toString(), "_self");
-        name: input.getAttribute("name"),
-    };
-
-    for (const [key, value] of Object.entries(searchEngines)) {
-        const prefix = `!${key} `;
-        if (s.startsWith(prefix)) {
-            selectedEngine = value;
-            s = s.slice(prefix.length); // Remove the !{key} prefix
-            break;
-        }
-    }
-
-    const url = new URL(selectedEngine.action);
-    url.searchParams.set(selectedEngine.name, s.trim());
-    window.open(url.toString(), "_self");
 });