wsgateway: clear locations on wsocket open

[loctrkd.git] / webdemo / index.html

diff --git a/webdemo/index.html b/webdemo/index.html
index b857360c160b6866aa7f23757f3ed0a5f6fec7a9..8ef95011ec5792a5ff0ea389b90e92dfb34a595f 100644 (file)
--- a/webdemo/index.html
+++ b/webdemo/index.html
@@ -10,10 +10,11 @@
        const urlParams = new URLSearchParams(window.location.search);
        const qimei = urlParams.get("imei");
 
-       const ourl = new URL(window.location);
-       const wsproto = ourl.protocol === "https" ? "wss" : "ws";
-       const wshost = ourl.hostname ? ourl.hostname : "localhost";
-       const wsport = ourl.port ? ourl.port : 5049;
+       const wsproto = window.location.protocol === "https" ? "wss" : "ws";
+       const wshost = window.location.hostname ? window.location.hostname
+                                               : "localhost";
+       const wsport = window.location.port ? window.location.port : 5049;
+       const limei = window.location.pathname.substring(1)
 
        const imeis = new Set();
        const locations = new Array();
@@ -43,9 +44,12 @@
                send = document.getElementById("send");
                clear = document.getElementById("clear");
                subslist = document.getElementById("subslist");
+               devstatus = document.getElementById("devstatus");
                tstamp = document.getElementById("tstamp");
                if (qimei) {
                        imei.value = qimei;
+               } else if (limei) {
+                       imei.value = limei;
                }
                open_ws();
        }
@@ -134,6 +138,10 @@
                markers.addMarker(new OpenLayers.Marker(lonLat, icon));
                map.setCenter(lonLat, 14);
        }
+       function display_status(msg) {
+               console.log("status " + JSON.stringify(msg));
+               devstatus.innerHTML = "BAT: " + msg.battery;
+       }
 
        function open_ws() {
                wsurl = new URL("ws://localhost/");
@@ -153,11 +161,18 @@
                imei.disabled = false;
                send.disabled = false;
                clear.disabled = false;
+               locations.splice(0);
                sendIMEI();
        }
        function ws_onmessage(event) {
                console.log("message " + event.data);
-               set_marker(JSON.parse(event.data));
+               msg = JSON.parse(event.data);
+               if (msg.type === "location") {
+                       set_marker(msg);
+               } else if (msg.type === "status") {
+                       display_status(msg);
+               }
+
        }
        function ws_onerror(event) {
                console.log("error " + event);
@@ -214,14 +229,17 @@
                <input type="button" id="clear" name="clear" value="Clear"
                 onclick="sendIMEI(true)" disabled>
                <span id="subslist"></span>
-               <span id="tstamp" style="float:right"></span>
+               <span style="float:right">
+                       | <span id="devstatus"></span>
+                       | <span id="tstamp"></span>
+               </span>
        </div>
        <div style="width:100%; height:97%" id="map"></div>
        <div style="width:100%; height:1%">
                <span id="sts"></span>
                <span id="about" style="float:right">
-                       <a href="http://www.average.org/gps303/">
-                               http://www.average.org/gps303/</a>
+                       <a href="http://www.average.org/loctrkd/">
+                               http://www.average.org/loctrkd/</a>
                </span>
        </div>
 </body>