web ui redesign/not done

2024-12-01 21:13:10 +01:00 · 2024-12-01 21:13:10 +01:00 · 10db9ae8de
commit 10db9ae8de
parent 57ae5a68a9
24 changed files with 324 additions and 42 deletions
--- a/templates/sites/dash.html
+++ b/templates/sites/dash.html
@ -0,0 +1,96 @@
+<!DOCTYPE html>
+<html lang="de">
+<head>
+    <script>
+        let termdiv;
+        let terminput;
+        let timer;
+        let timertext;
+        const COMMAND = "command";
+
+
+        function sendcommand(contentlist) {
+            fetch("/term",{
+                method:"POST",
+                body: JSON.stringify({"content":contentlist}),
+                headers: {"Content-type":"application/json; charset=UTF-8"}
+            }).then(getterm());
+        }
+        function sendtermcommand() {
+            sendcommand([COMMAND,
+                            `terminal-command`,
+                            terminput.value]
+            );
+            terminput.value = "";
+            
+        }
+
+        function getterm() {
+            let tmpterm = "";
+            fetch("/term", { method: "GET" })
+                .then(response => response.json())
+                .then(termarray => {
+                    console.log(termarray);
+                    for (let line of termarray) {
+                        tmpterm += `${line}<br>`;
+                    }
+                    termdiv.innerHTML = tmpterm;
+                })
+                .catch(termdiv.innerHTML = 'Fehler beim Abrufen der Daten');
+        }
+        function getterminterval() {
+            timer -= 1
+            timertext.innerHTML = `Reload in ${timer} Seconds`
+            if (timer == 0) {
+                getterm()
+                timer = 5
+            }
+        }
+
+
+        function initstuff() {
+            timer = 5
+            timertext = document.getElementById("timer")
+            termdiv = document.getElementById("terminaltext");
+            terminput = document.getElementById("terminalinput");
+            getterm();
+            setInterval(getterminterval,1000)
+        }
+
+        window.onload = initstuff;
+    </script>
+    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
+    <link rel="shortcut icon" href="{{ url_for('static', filename='favicon.ico') }}">
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Terradash</title>
+</head>
+<body>
+    {{ navbar | safe }}
+    <div class="main">
+        <h1>Dash</h1>
+        <div id="dash-content">
+            <div id="buttons">
+                <button style="margin-bottom: 10px;" 
+                        class="button" 
+                        onclick="sendcommand([COMMAND,`start`]);timer=2">start</button>
+                <button style="margin-bottom: 10px; background-color: rgb(255, 0, 0);" 
+                        class="button" 
+                        onclick="sendcommand([COMMAND,`stop`]);timer=1">stop</button>
+            </div>
+            <div style="width: 100%;height: 100%;">
+                <p style="font-size: 11px;margin: 0px;margin-left: 15px;" id="timer">Reload in _ Seconds</p>
+                <div id="terminal">
+                    <div id="terminaltext"></div>
+                    <input id="terminalinput" type="text">
+                    <button
+                    style="margin-top: 15px;"
+                    class="button"
+                    onclick="sendtermcommand();
+                    terminput.value = ``">send</button>
+                </div>
+            </div>
+        </div>
+    </div> 
+</body>
+</html>