From c1c2a0cb471065e67c5b13c9338b85c06d1f01f2 Mon Sep 17 00:00:00 2001
From: grey <pnh@thegreydiamond.de>
Date: Thu, 24 Feb 2022 20:17:24 +0100
Subject: [PATCH] added presets the the crude interface

---
 README.MD                 |  8 ++++
 index.js                  | 32 ++++++++++-----
 static/js/interface.js    |  4 +-
 static/js/script.js       | 13 +++----
 templates/adminPanel.html | 82 ++++++++++++++++++++++++++-------------
 5 files changed, 92 insertions(+), 47 deletions(-)
 create mode 100644 README.MD

diff --git a/README.MD b/README.MD
new file mode 100644
index 0000000..064bc2d
--- /dev/null
+++ b/README.MD
@@ -0,0 +1,8 @@
+# openCountdown
+
+# ToDo
+- [X] Pausing functions
+- [X] Presets
+- [ ] Progress bar
+- [ ] time on countdown page
+- [ ] one-way messaging
\ No newline at end of file
diff --git a/index.js b/index.js
index e8bd322..9c009ec 100644
--- a/index.js
+++ b/index.js
@@ -18,9 +18,11 @@ app.use(
 currentState = {
   mode: "clock",
   countdownGoal: new Date().getTime(),
-  changed: true,
   showMilliSeconds: true,
-  defaultFullScreen: true
+  defaultFullScreen: true,
+  timeAmountInital: 0,
+  timerRunState: true,
+  pauseMoment: 0
 };
 
 app.get("/", function (req, res) {
@@ -28,13 +30,6 @@ app.get("/", function (req, res) {
   res.send(data);
 });
 
-app.post("/", function (req, res) {
-  console.log(req.body);
-  currentState.mode = req.body.mode;
-  currentState.countdownGoal = req.body.countdownGoal;
-  res.send("OK");
-});
-
 app.get("/timer", function (req, res) {
   const data = fs.readFileSync("templates/timerPage.html", "utf8");
   res.send(data);
@@ -60,9 +55,26 @@ app.get("/api/v1/set/timerGoal", function (req, res) {
 });
 
 app.get("/api/v1/set/addMillisToTimer", function (req, res) {
-  console.log(req.query.time)
+  currentState.timeAmountInital = req.query.time;
   currentState.countdownGoal = new Date().getTime() + parseInt(req.query.time)
   res.json({ status: "ok" });
 });
 
+app.get("/api/v1/ctrl/timer/pause", function (req, res) {
+  currentState.timerRunState = false;
+  currentState.pauseMoment = new Date().getTime();
+  res.json({ status: "ok" });
+});
+
+app.get("/api/v1/ctrl/timer/play", function (req, res) {
+  currentState.timerRunState = true
+  currentState.countdownGoal += new Date().getTime() - currentState.pauseMoment;
+  res.json({ status: "ok" });
+});
+
+app.get("/api/v1/ctrl/timer/restart", function (req, res) {
+  currentState.countdownGoal = new Date().getTime() + parseInt(currentState.timeAmountInital)
+  res.json({ status: "ok" });
+});
+
 app.listen(3005);
diff --git a/static/js/interface.js b/static/js/interface.js
index a3ea68e..5b0a466 100644
--- a/static/js/interface.js
+++ b/static/js/interface.js
@@ -3,6 +3,6 @@ function convertTimeOffset(){
     document.getElementById("time").value = selTime
 }
 
-function updateHiddenForm(){
-    document.getElementById("time").value = document.getElementById('time2').valueAsNumber
+function updateHiddenForm2(){
+    document.getElementById("time4").value = document.getElementById('time3').value
 }
\ No newline at end of file
diff --git a/static/js/script.js b/static/js/script.js
index 088625a..f865928 100644
--- a/static/js/script.js
+++ b/static/js/script.js
@@ -60,13 +60,12 @@ function handleUpdate() {
     document.getElementById("testImg").style.display = "none";
 
   } else if (data.mode == "timer") {
-    const now = new Date()
-    const diff = data.countdownGoal - now.getTime()
-
-
-    
-    document.getElementById("timer").innerHTML = msToTime(diff, data);
-    document.getElementById("testImg").style.display = "none";
+    if(data.timerRunState){
+      const now = new Date()
+      const diff = data.countdownGoal - now.getTime()
+      document.getElementById("timer").innerHTML = msToTime(diff, data);
+      document.getElementById("testImg").style.display = "none";
+    }
 
   } else if (data.mode == "black") {
     document.getElementById("timer").innerHTML = "";
diff --git a/templates/adminPanel.html b/templates/adminPanel.html
index 7606dea..51e6927 100644
--- a/templates/adminPanel.html
+++ b/templates/adminPanel.html
@@ -3,47 +3,73 @@
 <html lang="en">
 
 <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
 
-    <title>openCountdown - Admin</title>
-    <meta name="description" content="openCountdown">
-    <meta name="author" content="TheGreydiamond">
+  <title>openCountdown - Admin</title>
+  <meta name="description" content="openCountdown">
+  <meta name="author" content="TheGreydiamond">
 
-    <link rel="stylesheet" href="css/styles.css?v=1.1">
+  <link rel="stylesheet" href="css/styles.css?v=1.1">
 </head>
 
 <body>
 
 
-<form action="/api/v1/set/mode" target="hiddenFrame">
+  <form action="/api/v1/set/mode" target="hiddenFrame">
     <select id="mode" name="mode">
-        <option value="timer">Timer</option>
-        <option value="clock">Clock</option>
-        <option value="black">Black</option>
-        <option value="test">Test</option>
-      </select>
+      <option value="timer">Timer</option>
+      <option value="clock">Clock</option>
+      <option value="black">Black</option>
+      <option value="test">Test</option>
+    </select>
     <button type="submit">Submit</button>
-</form>
-<br>
-<form action="/api/v1/set/showMillis" target="hiddenFrame">
-  <select id="show" name="show">
-    <option value="true">Enable Milliseconds</option>
-    <option value="false">Disable Milliseconds</option>
-  </select>
-  <button type="submit">Submit</button>
-</form>
+  </form>
+  <br>
+  <form action="/api/v1/set/showMillis" target="hiddenFrame">
+    <select id="show" name="show">
+      <option value="true">Enable Milliseconds</option>
+      <option value="false">Disable Milliseconds</option>
+    </select>
+    <button type="submit">Submit</button>
+  </form>
 
-<form action="/api/v1/set/addMillisToTimer" target="hiddenFrame">
-  <input type="time" step="0.001" name="time2" id="time2" onchange="updateHiddenForm()"></input>
-  <input type="hidden" step="0.001" name="time" id="time"></input>
-  <button type="submit">Submit</button>
-</form>
+  <form action="/api/v1/set/addMillisToTimer" target="hiddenFrame">
+    <input type="time" step="0.001" name="time2" id="time2" onchange="updateHiddenForm()"></input>
+    <input type="hidden" step="0.001" name="time" id="time"></input>
+    <button type="submit">Submit</button>
+  </form>
 
-<iframe name="hiddenFrame" style="display: none"></iframe>
+  <form action="/api/v1/set/addMillisToTimer" target="hiddenFrame">
+    <select id="time" name="time" onchange="">
+      <option value="300000">00:05:00</option>
+      <option value="600000">00:10:00</option>
+      <option value="900000">00:15:00</option>
+      <option value="1200000">00:20:00</option>
+      <option value="1500000">00:25:00</option>
+      <option value="1800000">00:30:00</option>
+      <option value="2100000">00:35:00</option>
+      <option value="2400000">00:40:00</option>
+      <option value="2700000">00:45:00</option>
+    </select>
+    <button type="submit">Submit</button>
+  </form>
+
+  <form action="/api/v1/ctrl/timer/play" target="hiddenFrame">
+    <button type="submit">Play</button>
+  </form>
+  <form action="/api/v1/ctrl/timer/pause" target="hiddenFrame">
+    <button type="submit">Pause</button>
+  </form>
+  <form action="/api/v1/ctrl/timer/restart" target="hiddenFrame">
+    <button type="submit">Restart</button>
+  </form>
+
+  <iframe name="hiddenFrame" style="display: none"></iframe>
 
 
-<iframe src="/timer?smaller=true" height="80%" width="80%"> </iframe>
+  <iframe src="/timer?smaller=true" height="80%" width="80%"> </iframe>
 </body>
 <script src="js/interface.js"></script>
+
 </html>
\ No newline at end of file