V5.2.1 - Added 404 Page, Updated Tabs

UseInterstellar · May 13, 2024 · 08ae7a8 · 08ae7a8
1 parent caac8ee
commit 08ae7a8
Show file tree

Hide file tree

Showing 12 changed files with 146 additions and 127 deletions.
diff --git a/index.js b/index.js
@@ -55,16 +55,19 @@ const fetchData = async (req, res, next, baseUrls) => {
     if (data) {
       res.end(Buffer.from(data))
     } else {
-      res.status(404).send()
+      res.status(404).sendFile(path.join(__dirname, "static", "404.html"))
     }
   } catch (error) {
     console.error(`Error fetching ${req.url}:`, error)
-    res.status(500).send()
+    next(error)
   }
 }
+app.use((req, res, next) => {
+  res.status(404).sendFile(path.join(__dirname, "static", "404.html"))
+})
 app.use((err, req, res, next) => {
   console.error(err.stack)
-  res.status(500).send()
+  res.status(500).sendFile(path.join(__dirname, "static", "404.html"))
 })
 server.on("request", (req, res) => {
   if (bareServer.shouldRoute(req)) {

diff --git a/static/404.html b/static/404.html
@@ -0,0 +1,29 @@
+<!doctype html>
+<html lang="en">
+   <head>
+      <meta charset="UTF-8" />
+      <meta name="referrer" content="no-referrer" />
+      <meta http-equiv="X-Content-Type-Options" content="nosniff" />
+      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+      <link rel="shortcut icon" id="tab-favicon" href="favicon.png" />
+      <title id="tab-title">Home</title>
+      <link rel="stylesheet" href="/assets/styles/main.css?v=10" />
+      <link rel="stylesheet" href="/assets/styles/global.css?v=8" />
+      <script src="https://kit.fontawesome.com/1237c86ba0.js" crossorigin="anonymous"></script>
+   </head>
+   <body>
+      <div class="fixed-nav-bar"></div>
+      <div class="main error">
+         <h1>404</h1>
+         <h3>Page not found.</h3>
+         <p>Keep getting this error? Report it down below.</p>
+         <button class="one" type="button" onclick="window.location.href = '/';">Go Back Home</button>
+         <button class="two" type="button" onclick="window.location.href = 'https://discord.gg/interstellar'">Join our Discord (Direct)</button>
+         <button class="three" type="button" onclick="go('https://discord.gg/interstellar')">Join our Discord (Proxied)</button>
+      </div>
+   </body>
+   <script src="assets/scripts/i.js?V=42"></script>
+   <script src="./assets/-/bundle.js?v=5-5-2024"></script>
+   <script src="./assets/-/config.js?v=5-5-2024"></script>
+   <script src="assets/scripts/m.js?v=54"></script>
+</html>
diff --git a/static/apps.html b/static/apps.html
@@ -10,7 +10,7 @@
     <script src="./assets/-/bundle.js?v=5-5-2024"></script>
     <script src="./assets/-/config.js?v=5-5-2024"></script>
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link rel="stylesheet" href="/assets/styles/main.css?v=8" />
+    <link rel="stylesheet" href="/assets/styles/main.css?v=10" />
     <link rel="stylesheet" href="/assets/styles/global.css?v=8" />
     <script src="/assets/scripts/m.js?v=54"></script>
     <script src="/assets/scripts/i.js?V=42"></script>
@@ -21,7 +21,7 @@
     <div class="fixed-nav-bar"></div>
     <div class="input-container">
       <input type="text" id="searchbarbottom" onkeyup="search_bar()" placeholder="Search" />
-      <select id="category" name="category" onchange="show_category()">
+      <select title="Category" id="category" name="category" onchange="show_category()">
         <option value="all">All</option>
         <option value="android">Android Emulator</option>
         <option value="social">Social</option>

diff --git a/static/assets/scripts/ta.js b/static/assets/scripts/ta.js
@@ -286,22 +286,21 @@ function goForward() {
   }
 }
 // Remove Nav
-document.addEventListener("fullscreenchange", function () {
-  const isFullscreen = Boolean(document.fullscreenElement)
-  document.body.classList.toggle("fullscreen", isFullscreen)
-})
 document.addEventListener("DOMContentLoaded", function () {
-  var navIcon = document.getElementById("nav-icon")
-  var navBar = document.getElementById("right-side-nav")
-  const activeIframe = document.querySelector("#iframe-container iframe.active")
-  console.log(navIcon)
-  navIcon.addEventListener("click", function () {
-    var isOpen = navBar.classList.toggle("hidden")
-    this.classList.toggle("open")
-    if (isOpen) {
-      activeIframe.style.top = "5%"
+  var TB = document.getElementById("tabs-button")
+  var NB = document.getElementById("right-side-nav")
+  TB.addEventListener("click", function () {
+    var activeIframe = document.querySelector("#iframe-container iframe.active")
+    if (NB.style.display === "none") {
+      NB.style.display = ""
+      activeIframe.style.top = "10%"
+      TB.querySelector("i").classList.remove("fa-magnifying-glass-plus")
+      TB.querySelector("i").classList.add("fa-magnifying-glass-minus")
     } else {
-      activeIframe.style.top = "13%"
+      NB.style.display = "none"
+      activeIframe.style.top = "5%"
+      TB.querySelector("i").classList.remove("fa-magnifying-glass-minus")
+      TB.querySelector("i").classList.add("fa-magnifying-glass-plus")
     }
   })
 })

diff --git a/static/assets/styles/fr.css b/static/assets/styles/fr.css
@@ -11,21 +11,6 @@ body {
   color: white;
 }
 
-iframe {
-  display: block;
-  border: none;
-  height: calc(100% - 3em);
-  width: 100vw;
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  top: 3em;
-  overflow-y: scroll;
-  overflow-x: hidden;
-  background: white;
-}
-
 .nav {
   padding: 1rem;
   transition: transform 0.5s ease;
@@ -249,81 +234,3 @@ iframe {
   left: 0;
   top: 10%;
 }
-
-/* Credits to https://codepen.io/designcouch/pen/ExvwPY for the hamburger animations */
-#nav-icon {
-  width: 20px;
-  position: fixed;
-  bottom: 5%;
-  left: 10px;
-  -webkit-transform: rotate(0deg);
-  -moz-transform: rotate(0deg);
-  -o-transform: rotate(0deg);
-  transform: rotate(0deg);
-  -webkit-transition: 0.5s ease-in-out;
-  -moz-transition: 0.5s ease-in-out;
-  -o-transition: 0.5s ease-in-out;
-  transition: 0.5s ease-in-out;
-  cursor: pointer;
-  z-index: 9999;
-}
-
-#nav-icon span {
-  display: block;
-  position: absolute;
-  height: 5px;
-  width: 100%;
-  background: var(--main);
-  border-radius: 9px;
-  opacity: 1;
-  left: 0;
-  -webkit-transform: rotate(0deg);
-  -moz-transform: rotate(0deg);
-  -o-transform: rotate(0deg);
-  transform: rotate(0deg);
-  -webkit-transition: 0.25s ease-in-out;
-  -moz-transition: 0.25s ease-in-out;
-  -o-transition: 0.25s ease-in-out;
-  transition: 0.25s ease-in-out;
-  cursor: pointer;
-  box-shadow: 0 0 0 1px white;
-}
-
-#nav-icon span:nth-child(1) {
-  top: 0px;
-}
-
-#nav-icon span:nth-child(2) {
-  top: 8px;
-}
-
-#nav-icon span:nth-child(3) {
-  top: 16px;
-}
-
-#nav-icon.open span:nth-child(1) {
-  top: 8px;
-  -webkit-transform: rotate(135deg);
-  -moz-transform: rotate(135deg);
-  -o-transform: rotate(135deg);
-  transform: rotate(135deg);
-}
-
-#nav-icon.open span:nth-child(2) {
-  opacity: 0;
-  left: -30px;
-}
-
-#nav-icon.open span:nth-child(3) {
-  top: 8px;
-  -webkit-transform: rotate(-135deg);
-  -moz-transform: rotate(-135deg);
-  -o-transform: rotate(-135deg);
-  transform: rotate(-135deg);
-}
-
-#right-side-nav.hidden {
-  display: none;
-}
-
-/* Credits to https://codepen.io/designcouch/pen/ExvwPY for the hamburger animations */
diff --git a/static/assets/styles/main.css b/static/assets/styles/main.css
@@ -1,4 +1,4 @@
-@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;600;800&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;800&display=swap");
 @import url("https://fonts.googleapis.com/css2?family=Poppins&display=swap");
 
 body {
@@ -348,7 +348,7 @@ select {
 .main {
   letter-spacing: 0px;
   font-family: "Inter", sans-serif;
-  width: 100%;
+  width: 99%;
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -358,6 +358,89 @@ select {
   z-index: 99;
 }
 
+.error {
+  color: white;
+  font-family: "Inter", sans-serif;
+  font-weight: 900;
+  top: 15%;
+  text-align: center;
+}
+
+.error h1 {
+  font-size: 10vw;
+  margin: 0 auto -2vw auto;
+  background: linear-gradient(150deg, #746eff 0%, #ff00bb 51%, #746eff 100%);
+  -webkit-background-clip: text;
+  -moz-background-clip: text;
+  background-clip: text;
+  color: transparent;
+}
+
+.error h3 {
+  font-size: 4vw;
+  margin-bottom: auto;
+  margin-top: auto;
+  font-weight: 600;
+}
+
+.error p {
+  font-size: 2vw;
+  font-weight: 700;
+  margin-top: 0.5%;
+  margin-bottom: 1%;
+  color: var(--text-dark);
+}
+
+.error button {
+  padding: 15px;
+  border-radius: 5px;
+  background: var(--block-buttons);
+  color: inherit;
+  font-size: 24px;
+  border: 2px solid var(--block-buttons);
+  outline: none;
+  margin-bottom: 10px;
+  cursor: pointer;
+}
+
+.error .one:hover {
+  color: #ef6e78;
+  border: 2px solid #ef6e78;
+  background: transparent;
+}
+
+.error .two:hover {
+  color: #ef996e;
+  border: 2px solid #ef996e;
+  background: transparent;
+}
+
+.error .three:hover {
+  color: #ef6ee4;
+  border: 2px solid #ef6ee4;
+  background: transparent;
+}
+
+@media (max-width: 768px) {
+  .error h1 {
+    font-size: 12vw;
+  }
+
+  .error h3 {
+    font-size: 5vw;
+  }
+
+  .error p {
+    font-size: 3vw;
+    margin-top: 5px;
+    margin-bottom: 5px;
+  }
+
+  .error button {
+    font-size: 16px;
+  }
+}
+
 #particles-js {
   position: absolute;
   width: 100%;

diff --git a/static/games.html b/static/games.html
@@ -8,7 +8,7 @@
     <link rel="shortcut icon" id="tab-favicon" href="favicon.png" />
     <title id="tab-title">Home</title>
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link rel="stylesheet" href="/assets/styles/main.css?v=8" />
+    <link rel="stylesheet" href="/assets/styles/main.css?v=10" />
     <link rel="stylesheet" href="/assets/styles/global.css?v=8" />
     <script src="/assets/scripts/i.js?V=42"></script>
     <script src="/assets/scripts/ap.js?v=90"></script>

diff --git a/static/index.html b/static/index.html
@@ -7,7 +7,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <link rel="shortcut icon" id="tab-favicon" href="favicon.png" />
     <title id="tab-title">Home</title>
-    <link rel="stylesheet" href="/assets/styles/main.css?v=8" />
+    <link rel="stylesheet" href="/assets/styles/main.css?v=10" />
     <link rel="stylesheet" href="/assets/styles/global.css?v=8" />
   </head>
   <body class="center" onload="SplashT">

diff --git a/static/privacy.html b/static/privacy.html
@@ -8,7 +8,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <link rel="shortcut icon" id="tab-favicon" href="favicon.png" />
     <title id="tab-title">Home</title>
-    <link rel="stylesheet" href="/assets/styles/main.css?v=8" />
+    <link rel="stylesheet" href="/assets/styles/main.css?v=10" />
     <link rel="stylesheet" href="/assets/styles/global.css?v=8" />
     <script src="https://kit.fontawesome.com/1237c86ba0.js" crossorigin="anonymous"></script>
   </head>

diff --git a/static/settings.html b/static/settings.html
@@ -8,7 +8,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <link rel="shortcut icon" id="tab-favicon" href="favicon.png" />
     <title id="tab-title">Home</title>
-    <link rel="stylesheet" href="/assets/styles/main.css?v=8" />
+    <link rel="stylesheet" href="/assets/styles/main.css?v=10" />
     <link rel="stylesheet" href="/assets/styles/settings.css?v=5" />
     <link rel="stylesheet" href="/assets/styles/global.css?v=8" />
     <script src="https://kit.fontawesome.com/1237c86ba0.js" crossorigin="anonymous"></script>

diff --git a/static/tabs.html b/static/tabs.html
@@ -8,19 +8,14 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <link rel="shortcut icon" id="tab-favicon" href="favicon.png" />
     <title id="tab-title">Home</title>
-    <link rel="stylesheet" href="assets/styles/fr.css?v=20" />
+    <link rel="stylesheet" href="assets/styles/fr.css?v=26" />
     <link rel="stylesheet" href="/assets/styles/global.css?v=8" />
     <script src="https://kit.fontawesome.com/1237c86ba0.js" crossorigin="anonymous"></script>
     <script>
       window.addEventListener("resize", navigator.keyboard.lock(["Escape"]))
     </script>
   </head>
   <body>
-    <div id="nav-icon">
-      <span></span>
-      <span></span>
-      <span></span>
-    </div>
     <nav class="nav" id="right-side-nav">
       <ul id="tab-list"></ul>
       <button title="add-tab" id="add-tab"><i class="fa-solid fa-plus"></i></button>
@@ -49,16 +44,19 @@
             <i class="fa-solid fa-expand"></i>
           </button>
           <button title="Window Popout" id="popout-button" class="nav-button nav-btn-right" onclick="popout()">
-            <i class="fa-solid fa-solid fa-window-restore"></i>
+            <i class="fa-solid fa-up-right-from-square"></i>
           </button>
           <button title="Inspect" id="eruda-button" class="nav-button nav-btn-right" onclick="erudaToggle()">
             <i class="fa-solid fa-code"></i>
           </button>
+          <button title="Tabs" id="tabs-button" class="nav-button nav-btn-right">
+            <i class="fa-solid fa-magnifying-glass-minus"></i>
+          </button>
         </div>
       </div>
     </div>
     <div class="iframe-container" id="iframe-container"></div>
-    <script src="assets/scripts/ta.js?v=30"></script>
+    <script src="assets/scripts/ta.js?v=34"></script>
     <script src="/assets/scripts/m.js?v=54"></script>
     <script src="./assets/-/bundle.js?v=5-5-2024"></script>
     <script src="./assets/-/config.js?v=5-5-2024"></script>