diff options
| -rw-r--r-- | ui/index.html | 33 | ||||
| -rw-r--r-- | ui/js/api.js | 12 |
2 files changed, 26 insertions, 19 deletions
diff --git a/ui/index.html b/ui/index.html index ac379f7..2af3cd2 100644 --- a/ui/index.html +++ b/ui/index.html @@ -39,20 +39,6 @@ </div> </li> <li class="list-item"> - <span id="cctvValue" class="dot"></span> CCTV - <div class="buttons"> - <button value="preset1" onclick="api.msg.send.cctv(this)">Preset 1</button> - <button value="preset2" onclick="api.msg.send.cctv(this)">Preset 2</button> - <button value="preset3" onclick="api.msg.send.cctv(this)">Preset 3</button> - <button value="preset4" onclick="api.msg.send.cctv(this)">Preset 4</button> - <button value="preset5" onclick="api.msg.send.cctv(this)">Preset 5</button> - <button value="preset6" onclick="api.msg.send.cctv(this)">Preset 6</button> - <button value="preset7" onclick="api.msg.send.cctv(this)">Preset 7</button> - <button value="preset8" onclick="api.msg.send.cctv(this)">Preset 8</button> - <button value="preset9" onclick="api.msg.send.cctv(this)">Preset 9</button> - </div> - </li> - <li class="list-item"> <span id="barrierValue" class="dot"></span> Slagboom <div class="buttons"> <button value="true" onclick="api.msg.send.barrier(this)">Open</button> @@ -90,12 +76,31 @@ </div> </details> + <details open> + <summary>CCTV Presets</summary> + <div> + Huidige preset: <span id="cctvPresetValue">??</span> + </div> + <div class="buttons"> + <button value="preset1" onclick="api.msg.send.cctv(this)">Preset 1</button> + <button value="preset2" onclick="api.msg.send.cctv(this)">Preset 2</button> + <button value="preset3" onclick="api.msg.send.cctv(this)">Preset 3</button> + <button value="preset4" onclick="api.msg.send.cctv(this)">Preset 4</button> + <button value="preset5" onclick="api.msg.send.cctv(this)">Preset 5</button> + <button value="preset6" onclick="api.msg.send.cctv(this)">Preset 6</button> + <button value="preset7" onclick="api.msg.send.cctv(this)">Preset 7</button> + <button value="preset8" onclick="api.msg.send.cctv(this)">Preset 8</button> + <button value="preset9" onclick="api.msg.send.cctv(this)">Preset 9</button> + </div> + </details> + <details> <summary>WebSocket Demo</summary> <div class="websocket_demo"> <button onclick="api.msg.send.helloWorld()">Hello World!</button> </div> </details> + </div> <div class="section notifications" id="sectionNotifications"> diff --git a/ui/js/api.js b/ui/js/api.js index d8c527b..647cbd6 100644 --- a/ui/js/api.js +++ b/ui/js/api.js @@ -27,7 +27,9 @@ const api = { }, matrix: state => document.getElementById("matrixValue").value = state, photocell: on => setPolkaDot(document.getElementById("photocellValue"), on), - cctv: on => setPolkaDot(document.getElementById("cctvValue"), on), + cctv: preset => { + document.getElementById("cctvPresetValue").innerText = preset; + }, carSpeed: speed => { for (let i = 0; i < 4; i++) document.getElementById(`zone${i+1}SpeedValue`).innerText = speed[i]; @@ -96,9 +98,9 @@ const api = { api.update.photocell(on); }, cctv: el => { - var on = el.value == "true"; - send({ type: 'cctv', on }); - api.update.cctv(on); + var preset = el.value; + send({ type: 'cctv', preset }); + api.update.cctv(preset); }, sos: el => { var statusSOS = el.value == "true"; @@ -117,7 +119,7 @@ const api = { lights: msg => api.update.lights(msg.value), matrix: msg => api.update.matrix(msg.state), photocell: msg => api.update.photocell(msg.on), - cctv: msg => api.update.cctv(msg.on), + cctv: msg => api.update.cctv(msg.preset), autoPerZone: msg => api.update.carCount(msg.autos), sosBericht: msg => api.update.notifications(msg), lfvReady: msg => api.update.lfvReady(msg), |