From 5c1962a8217f34d0fcfceb0042717b25a9961077 Mon Sep 17 00:00:00 2001
From: arne <arne@br0tkasten.de>
Date: Fri, 3 Feb 2023 21:44:36 +0100
Subject: [PATCH] add demo listing all vars of a project

---
 docs/show-vars.html | 69 +++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 69 insertions(+)
 create mode 100644 docs/show-vars.html
diff --git a/docs/show-vars.html b/docs/show-vars.html
new file mode 100644
index 0000000..aa34465
--- /dev/null
+++ b/docs/show-vars.html
@@ -0,0 +1,69 @@
+<html>
+<body>
+<input type="text" size="20" id="websocket" placeholde="websocket url" value="wss://cloudvars.br0tkasten.de">
+<input type="text" size="20" id="projectID" placeholder="project_id" value="p4-@cloud.sb3">
+<button id="read" name="read">read</button>
+
+<ul id="data"></ul>
+<script src="https://code.jquery.com/jquery-3.6.3.min.js"></script>
+<script>
+    let socket;
+    let projectID;
+    
+    $("#read").click(function() {
+      $("#data").empty();
+      projectID = $("#projectID").val();
+      socket = new WebSocket($("#websocket").val());
+
+      socket.onopen = function(e) {
+        console.log("connection established");
+        socket.send(JSON.stringify({
+          method: "handshake",
+          project_id: projectID,
+          user: "testClient"+Math.random()
+        }));
+      };
+      
+      function setVariable(name, value) {
+        console.log(`Setting variable: ${name} = ${value}`);
+        socket.send(JSON.stringify({
+          method: "set",
+          //            project_id: projectID,
+          name,
+          value
+        }));
+      };
+      
+      socket.onmessage = function(event) {
+        console.log(event.data);
+        for (const message of event.data.split("\n")) {
+            console.log(`${message}`);
+            const obj = JSON.parse(message);
+            if (obj.method === "set") {
+              obj_id = obj.name.replace(/[^0-9A-Za-z]/g,'_');
+
+              console.log(obj_id + ":" + $(`#${obj_id}`).length)
+              if($(`#${obj_id}`).length > 0) {
+                $(`#${obj_id}`).html(`<b>${obj.name}:</b> ${obj.value}`);     
+              } else {
+                $('#data').append(`<li id="${obj_id}"><b/>${obj.name}:</b>${obj.value}</li>`);
+              }
+            }
+        }
+    };
+
+    socket.onclose = function(event) {
+      if (event.wasClean) {
+        console.log(`connection closed cleanly, code=${event.code} reason=${event.reason}`);
+      } else {
+        console.log('connection died');
+      }
+    };
+    
+    socket.onerror = function(error) {
+      console.log(`[error] ${error.data}`);
+    };
+  });
+  </script>
+</body>
+</html>
\ No newline at end of file
