Status light is now html instead of pure desmos

This commit is contained in:
66945
2022-03-08 09:15:34 -07:00
committed by GitHub
parent 0d627016db
commit 0b2f1871ef
+24 -22
View File
@@ -2,10 +2,27 @@
<html> <html>
<head> <head>
<script src="https://www.desmos.com/api/v1.6/calculator.js?apiKey=dcb31709b452b1cf9dc26972add0fda6"></script> <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> <title>Desmos Client</title>
</head> </head>
<body> <body>
<div id="calculator" style="width: 100wh; height: 100vh; position: absolute; top: 0; left: 0; right: 0; bottom: 0; overflow: hidden;"></div> <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> <script>
const EXPRESSION_TYPES = { const EXPRESSION_TYPES = {
'expression': ['number', 'point', 'array'], 'expression': ['number', 'point', 'array'],
@@ -13,14 +30,11 @@
'table': ['table'] 'table': ['table']
}; };
let status = document.getElementById('status');
let elt = document.getElementById('calculator'); let elt = document.getElementById('calculator');
let calculator = Desmos.GraphingCalculator(elt); let calculator = Desmos.GraphingCalculator(elt);
let coord = {
x: window.innerWidth - 20,
y: window.innerHeight - 20
};
let helperExpressions = {}; let helperExpressions = {};
let variables = []; let variables = [];
@@ -38,28 +52,16 @@
} }
function handleError() { function handleError() {
let pcoord = calculator.pixelsToMath(coord); status.style = 'color: #FF0000;';
calculator.setExpression({ status.innerHTML = 'Offline';
id: 'status',
latex: '(' + pcoord.x + ',' + pcoord.y + ')',
color: '#ff0000',
pointSize: '20',
secret: true
});
console.log('Request failed'); console.log('Request failed');
setTimeout(requestVariables, 0); setTimeout(requestVariables, 0);
} }
function setVariables() { function setVariables() {
let pcoord = calculator.pixelsToMath(coord); status.style = 'color: #00FF00;';
calculator.setExpression({ status.innerHTML = 'Active';
id: 'status',
latex: '(' + pcoord.x + ',' + pcoord.y + ')',
color: '#00ff00',
pointSize: '20',
secret: true
});
variables = JSON.parse(this.responseText); variables = JSON.parse(this.responseText);
@@ -217,4 +219,4 @@
setTimeout(requestVariables, 0); setTimeout(requestVariables, 0);
</script> </script>
</body> </body>
</html> </html>