]> rtime.felk.cvut.cz Git - coffee/mt-apps.git/commitdiff
new index.html stable
authorJiří Matěják <jiri.matejak@fel.cvut.cz>
Fri, 18 May 2018 00:47:07 +0000 (02:47 +0200)
committerJiří Matěják <jiri.matejak@fel.cvut.cz>
Fri, 18 May 2018 00:47:07 +0000 (02:47 +0200)
html/index.html

index 2af8965bbbd6c08e304a2a554ff153a1ac78bf3c..2a7b3973f49e87f1df4146b553e8ab76e528c12d 100644 (file)
@@ -1,50 +1,61 @@
 <!doctype html>
 <html>
-<title>Websocket example</title>
-<script type="text/javascript" src="//172.30.0.180:5000/js/main.js" async></script>
+<title>Merica Terminal</title>
+<script type="text/javascript" src="//dejvice.merica.cz:5000/js" async></script>
 <script>
     var socket = new WebSocket(
         "ws://" + document.domain + ':' + location.port,
         "merica-terminal-protocol"
     );
 
-    function update(id, msg) {
-        document.getElementById(id).innerHTML = msg;
+    function updateLocal(msg) {
+        document.getElementById("localJSON").innerHTML = msg;
     }
 
     socket.onopen = function() {
         console.log("socket open");
-        update("text", "open");
+        updateLocal("socket open");
     }
 
     socket.onclose = function() {
-        console.log("socket close");
-        update("text", "closed");
+        console.log("socket closed");
+        updateLocal("socket closed");
     }
 
-    socket.onmessage = function(json) {
-        var msg = JSON.parse(json.data);
+    socket.onmessage = function(msg) {
+        updateLocal(msg.data);
+        if (typeof updateRemote === "function") {
+            updateRemote(msg.data);
+        } else {
+            if (localStorage) {
+                var now = Date.now();
+                localStorage.setItem(now, msg.data);
+                console.log(now + ": " + msg.data);
+            }
+        }
+    }
 
-        update("json", "json: " + JSON.stringify(msg))
+    function printLocalStorage() {
+        var output = "";
+        if (localStorage) {
+            if (localStorage.length) {
+                for (var i = 0; i < localStorage.length; i++) {
+                    output += localStorage.key(i) + ': ' + localStorage.getItem(localStorage.key(i)) + '<br>';
+                }
+            } else {
+                output += "nobody here anymore!";
+            }
+        } else {
+            output += "localStorage not supported";
+        }
 
-        switch(msg.type) {
-            case "empty":
-                update("text","");
-                break;
-            case "rfid":
-                update("text",
-                    "uid: " + msg.uid + "<br>" +
-                    "card type: " + msg.card_type + "<br>" +
-                    "uid size: " + msg.size + " bytes<br>" +
-                    "sak: " + msg.sak
-                );
-                break;
-            case "keys":
-                update("text",
-                    "key: " + msg.key
-                );
+        updateLocal(output);
+    }
+
+    function clearLocalStorage() {
+        if (localStorage) {
+            localStorage.clear();
         }
-        updateRemote(msg);
     }
 
     function sendReset() {
 
 <body>
 
-<button onclick="sendReset()">reset</button>
-<span style="display:inline-block; width: 20pt;"></span>
-<button onclick="sendClose()">close</button>
-
-<p id="time">time.is
-    <a href="https://time.is/" id="time_is_link" rel="nofollow"></a>
-    <span id="Czechia_z721"></span>
-    <script src="//widget.time.is/t.js"></script>
-    <script>time_is_widget.init({Czechia_z721:{}});</script>
-</p>
-
-<p id="json"></p>
-<p id="text"></p>
-<div id="remote"></div>
+<div id="local">
+    <center>
+    <h1>Merica Terminal</h1>
+    <button onclick="sendReset()">reset</button>
+    <span style="display:inline-block; width: 20pt;"></span>
+    <button onclick="sendClose()">close</button>
+    <span style="display:inline-block; width: 20pt;"></span>
+    <button onclick="printLocalStorage()">storage</button>
+    <span style="display:inline-block; width: 20pt;"></span>
+    <button onclick="clearLocalStorage()">clear</button>
+    <p id="localJSON">no data received</p>
+    </center>
+</div>
+<hr>
+<div id="remote"><center>all alone in a danger zone...</center></div>
 
 </body>
 </html>