diff options
Diffstat (limited to 'ui')
| -rw-r--r-- | ui/css/style.css | 7 | ||||
| -rw-r--r-- | ui/index.html | 18 | ||||
| -rw-r--r-- | ui/js/api.js | 6 | ||||
| -rw-r--r-- | ui/websocket_input.json | 3 |
4 files changed, 10 insertions, 24 deletions
diff --git a/ui/css/style.css b/ui/css/style.css index f0c63e8..ca35786 100644 --- a/ui/css/style.css +++ b/ui/css/style.css @@ -100,10 +100,15 @@ ul { display: flex; flex-direction: row; align-items: center; /* Align squares to the center horizontally */ + gap: 8px; +} + +.bottom-right p { + margin: 8px; } .canvas-square { border: 5px solid black; - width: calc(20% - 5px); + flex-grow: 1; height: calc(40% - 5px); background-color: #ccc; position: relative; diff --git a/ui/index.html b/ui/index.html index 3d93944..98cd44d 100644 --- a/ui/index.html +++ b/ui/index.html @@ -17,7 +17,7 @@ <button disabled value="true" id="lfvReadyBtn" onclick="api.msg.send.start(this)">start LFVs</button> </div> </dialog> - <script>document.getElementById("setupDialog").showModal()</script> + <!-- <script>document.getElementById("setupDialog").showModal()</script> --> <dialog id="sosDialog"> <h1 class="blink">SOS!!!</h1> <div class="padtop"> @@ -108,25 +108,13 @@ <!-- <div class="traffic-light"></div> <div class="barrier"></div> --> <div>Autos: <span id="zone1CarsValue">??</span></div> - <div>Gem.S.: <span id="zone1SpeedValue">??</span> km/h</div> + <!-- <div>Gem.S.: <span id="zone1SpeedValue">??</span> km/h</div> --> </div> </div> <div class="canvas-square" id="myCanvas2"> <div class="inner-content"> <div>Autos: <span id="zone2CarsValue">??</span></div> - <div>Gem.S.: <span id="zone2SpeedValue">??</span> km/h</div> - </div> - </div> - <div class="canvas-square" id="myCanvas3"> - <div class="inner-content"> - <div>Autos: <span id="zone3CarsValue">??</span></div> - <div>Gem.S.: <span id="zone3SpeedValue">??</span> km/h</div> - </div> - </div> - <div class="canvas-square" id="myCanvas4"> - <div class="inner-content"> - <div>Autos: <span id="zone4CarsValue">??</span></div> - <div>Gem.S.: <span id="zone4SpeedValue">??</span> km/h</div> + <!-- <div>Gem.S.: <span id="zone2SpeedValue">??</span> km/h</div> --> </div> </div> <p>End</p> diff --git a/ui/js/api.js b/ui/js/api.js index bc7803d..d8c527b 100644 --- a/ui/js/api.js +++ b/ui/js/api.js @@ -118,12 +118,6 @@ const api = { matrix: msg => api.update.matrix(msg.state), photocell: msg => api.update.photocell(msg.on), cctv: msg => api.update.cctv(msg.on), - snelheidAutoPerZone: msg => api.update.carSpeed([ - msg.snelHedenToegang.average(), - msg.snelHedeningang.average(), - msg.snelHedencentrale.average(), - msg.snelHedenverlating.average(), - ]), autoPerZone: msg => api.update.carCount(msg.autos), sosBericht: msg => api.update.notifications(msg), lfvReady: msg => api.update.lfvReady(msg), diff --git a/ui/websocket_input.json b/ui/websocket_input.json index abddf82..5feee41 100644 --- a/ui/websocket_input.json +++ b/ui/websocket_input.json @@ -1,3 +1,2 @@ -{ "type": "snelheidAutoPerZone", "snelHedenToegang": [ 20, 30, 40, 100 ], "snelHedeningang": [ 20, 30 ], "snelHedencentrale": [ 20, 30, 20, 100 ], "snelHedenverlating": [ 20, 30, 40 ] } -{ "type": "autoPerZone", "autos": [ 40, 22, 2, 13 ] } +{ "type": "autoPerZone", "autos": [ 40, 22 ] } { "type": "sosBericht", "statusSOS": true, "storingBericht": "storing door een gesprongen leiding" } |