From 0b2f1871ef0bf1304e6e6218049a8466cbfe70ec Mon Sep 17 00:00:00 2001
From: 66945 <54561572+66945@users.noreply.github.com>
Date: Tue, 8 Mar 2022 09:15:34 -0700
Subject: [PATCH] Status light is now html instead of pure desmos

---
 .../java/frc4388/utility/DesmosClient.html    | 46 ++++++++++---------
 1 file changed, 24 insertions(+), 22 deletions(-)
diff --git a/src/main/java/frc4388/utility/DesmosClient.html b/src/main/java/frc4388/utility/DesmosClient.html
index af2a65f..a3b966a 100644
--- a/src/main/java/frc4388/utility/DesmosClient.html
+++ b/src/main/java/frc4388/utility/DesmosClient.html
@@ -2,10 +2,27 @@
 <html>
     <head>
         <script src="https://www.desmos.com/api/v1.6/calculator.js?apiKey=dcb31709b452b1cf9dc26972add0fda6"></script>
+        <style>
+            #status {
+                position: absolute;
+                right: 0;
+                bottom: 0;
+                width: 60pt;
+                height: 20pt;
+
+                background-color: rgba(0, 0, 0, .8);
+
+                font-family: Arial, Helvetica, sans-serif;
+
+                text-align: center;
+                line-height: 20pt;
+            }
+        </style>
         <title>Desmos Client</title>
     </head>
     <body>
         <div id="calculator" style="width: 100wh; height: 100vh; position: absolute; top: 0; left: 0; right: 0; bottom: 0; overflow: hidden;"></div>
+        <div id="status" style="color: #00FF00;">Active</div>
         <script>
             const EXPRESSION_TYPES = {
                 'expression': ['number', 'point', 'array'],
@@ -13,14 +30,11 @@
                 'table': ['table']
             };
 
+            let status = document.getElementById('status');
+
             let elt = document.getElementById('calculator');
             let calculator = Desmos.GraphingCalculator(elt);
 
-            let coord = {
-                x: window.innerWidth - 20,
-                y: window.innerHeight - 20
-            };
-
             let helperExpressions = {};
             let variables = [];
 
@@ -38,28 +52,16 @@
             }
 
             function handleError() {
-                let pcoord = calculator.pixelsToMath(coord);
-                calculator.setExpression({
-                    id: 'status',
-                    latex: '(' + pcoord.x + ',' + pcoord.y + ')',
-                    color: '#ff0000',
-                    pointSize: '20',
-                    secret: true
-                });
+                status.style = 'color: #FF0000;';
+                status.innerHTML = 'Offline';
 
                 console.log('Request failed');
                 setTimeout(requestVariables, 0);
             }
 
             function setVariables() {
-                let pcoord = calculator.pixelsToMath(coord);
-                calculator.setExpression({
-                    id: 'status',
-                    latex: '(' + pcoord.x + ',' + pcoord.y + ')',
-                    color: '#00ff00',
-                    pointSize: '20',
-                    secret: true
-                });
+                status.style = 'color: #00FF00;';
+                status.innerHTML = 'Active';
 
                 variables = JSON.parse(this.responseText);
 
@@ -217,4 +219,4 @@
             setTimeout(requestVariables, 0);
           </script>
     </body>
-</html>
\ No newline at end of file
+</html>
