From b2798a8c8a29e60e13cd39f8b7e9926889a95138 Mon Sep 17 00:00:00 2001
From: Sem van der Hoeven <semmer99@gmail.com>
Date: Tue, 30 May 2023 11:53:56 +0200
Subject: [PATCH] button mouseup

---
 api/public/css/stylesheet.css |  2 +-
 api/views/index.ejs           | 30 +++++++++++++++++++++---------
 2 files changed, 22 insertions(+), 10 deletions(-)

diff --git a/api/public/css/stylesheet.css b/api/public/css/stylesheet.css
index ecb9792f..f1433cb8 100644
--- a/api/public/css/stylesheet.css
+++ b/api/public/css/stylesheet.css
@@ -50,7 +50,7 @@ body {
     float: right;
 }
 
-#button_stop {
+#button_estop {
     background-color: red;
     color: white;
 }
\ No newline at end of file
diff --git a/api/views/index.ejs b/api/views/index.ejs
index 092e67b2..b7cd8301 100644
--- a/api/views/index.ejs
+++ b/api/views/index.ejs
@@ -28,15 +28,16 @@
             <div id="controls">
                 <h2>Controls</h2>
                 <div id="buttons">
-                    <button id="button_turnleft" onclick="turn_left()">Turn left</button>
-                    <button id="button_turnright" onclick="turn_right()">Turn right</button>
-                    <button id="button_up" onclick="up()">Up</button>
-                    <button id="button_down" onclick="down()">Down</button>
-                    <button id="button_forward" onclick="forward()">Forward</button>
-                    <button id="button_backward" onclick="backward()">Backward</button>
-                    <button id="button_left" onclick="left()">Left</button>
-                    <button id="button_right" onclick="right()">Right</button>
-                    <button id="button_stop" onclick="stop()"><strong>Emergency Stop</strong></button>
+                    <button class="movebutton" id="button_turnleft" onclick="turn_left()">Turn left</button>
+                    <button class="movebutton" id="button_turnright" onclick="turn_right()">Turn right</button>
+                    <button class="movebutton" id="button_up" onclick="up()">Up</button>
+                    <button class="movebutton" id="button_down" onclick="down()">Down</button>
+                    <button class="movebutton" id="button_forward" onclick="forward()">Forward</button>
+                    <button class="movebutton" id="button_backward" onclick="backward()">Backward</button>
+                    <button class="movebutton" id="button_left" onclick="left()">Left</button>
+                    <button class="movebutton" id="button_right" onclick="right()">Right</button>
+                    <button id="button_stop" onclick="stop()">Stop</button>
+                    <button id="button_estop" onclick="estop()"><strong>Emergency Stop</strong></button>
 
                 </div>
             </div>
@@ -58,6 +59,12 @@
 
 <script>
     var update_status = setInterval(update_status, 1000);
+    var buttons = document.getElementsByClassName("movebutton");
+    for (var i = 0; i < buttons.length; i++) {
+        buttons[i].addEventListener("mouseup", function () {
+            console.log("mouseup");
+        });
+    }
 
     function update_status() {
         // {"battery_percentage": 100.0, "cpu_usage": 0.0, "armed": false, "control_mode": "attitude", "route_setpoint": 0}}
@@ -124,6 +131,11 @@
     }
     function stop() {
         console.log("stop");
+        send_move_request(JSON.stringify({ "up_down": 0.0 ,"forward_backward": 0.0, "left_right": 0.0, "turn_left_right": 0.0}));
+    }
+
+    function estop() {
+        console.log("estop");
     }
 
     function take_picture() {