Setup configuration server and html files & assets

2025-10-29 17:40:25 +00:00 · 2023-07-31 13:39:05 +02:00
parent 412ae296d8
commit 4458c3729f
3 changed files with 417 additions and 0 deletions
--- a/src/setup/success.html
+++ b/src/setup/success.html
@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <meta
+      name="viewport"
+      content="width=device-width,initial-scale=1,maximum-scale=1"
+    />
+    <title></title>
+    
+    <link rel="stylesheet" type="text/css" href="./styles.css"  />
+  </head>
+
+  <body>
+    <h1>Sucessfully updated!</h1>
+
+    <p>
+      Settings successfully save to controller. Disable setup mode switch and
+      reboot.
+    </p>
+
+    <div class="bottom-content">
+      <p style="display: none">
+        Rebooting in <span id="countdown">5</span> seconds
+      </p>
+      <button id="reboot">Reboot device</button>
+    </div>
+  </body>
+
+  <script>
+    function countDownAndSubmitReboot() {
+      countdownElement.parentElement.style.display = "block";
+
+      let count = Number(countdownElement.innerText);
+      const id = setInterval(() => {
+        count = count - 1;
+        countdownElement.innerText = count;
+        if (count === 0) {
+          clearTimeout(id);
+
+          fetch('/reboot', { method: 'POST' })
+            .then(console.log)
+        }
+      }, 1000);
+    }
+
+    const countdownElement = document.getElementById("countdown");
+    const rebootBtn = document.getElementById("reboot");
+
+    rebootBtn.addEventListener("click", countDownAndSubmitReboot);
+  </script>
+
+  <style>
+    .bottom-content {
+      margin-top: auto;
+      width: 100%;
+    }
+
+    .bottom-content p {
+      text-align: center;
+    }
+
+    button {
+      background-color: #1a202e;
+      color: white;
+      padding: 0.75rem;
+      text-align: center;
+      vertical-align: middle;
+      width: 100%;
+      border-radius: 0.8rem;
+      border: none;
+      font-size: 1.1rem;
+      cursor: pointer;
+      text-transform: uppercase;
+    }
+  </style>
+</html>