1 files changed, 117 insertions, 0 deletions
diff --git a/src/civetweb/test/websocket.xhtml b/src/civetweb/test/websocket.xhtml
new file mode 100644
index 00000000..3e0828f1
--- /dev/null
+++ b/src/civetweb/test/websocket.xhtml
@@ -0,0 +1,117 @@
+<!DOCTYPE HTML>
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+  <meta charset="UTF-8"></meta>
+  <title>Websocket test</title>
+  <style type="text/css" media="screen">
+    body { background:#eee; margin:0 }
+    .main {
+      display:block; border:1px solid #ccc; position:absolute;
+      top:5%; left:5%; width:90%; height:90%; background:#fff;
+    }
+  </style>
+</head>
+<body>
+  <script type="text/javascript"><![CDATA[
+
+    var connection;
+    var websock_text_field;
+    var hand_hour;
+    var hand_min;
+
+    function queryStringElem(name, idx) {
+      if (typeof(queryStringElem_Table) != "object") {
+        queryStringElem_Table = {};
+        window.location.search.slice(1).split('&').forEach(
+          function(keyValuePair) {
+            keyValuePair = keyValuePair.split('=');
+            if (typeof(queryStringElem_Table[keyValuePair[0]]) != "object") {
+              queryStringElem_Table[keyValuePair[0]] = [];
+            }
+            var idx = queryStringElem_Table[keyValuePair[0]].length+1;
+            queryStringElem_Table[keyValuePair[0]][idx] = keyValuePair[1] || '';
+          }
+        );
+      }
+      idx = idx || 1;
+      if (queryStringElem_Table[name]) {
+        return queryStringElem_Table[name][idx];
+      }
+      return null;
+    }
+
+    function webSockKeepAlive() {
+      if (keepAlive) {
+        connection.send('client still alive');
+        console.log('send keep alive')
+        setTimeout("webSockKeepAlive()", 10000);
+      }
+    }
+
+    function load() {
+      var wsproto = (location.protocol === 'https:') ? "wss:" : "ws:";
+      connection = new WebSocket(wsproto + "//" + window.location.host + "/websocket.lua");
+      websock_text_field = document.getElementById('websock_text_field');
+      hand_min = document.getElementById('hand_min');
+      hand_hour = document.getElementById('hand_hour');
+
+      var ka = queryStringElem("keepAlive");
+      if (ka) {
+        ka = ka.toLowerCase();
+        use_keepAlive = (ka!="false") && (ka!="f") && (ka!="no") && (ka!="n") && (ka!=0);
+      } else {
+        use_keepAlive = true;
+      }
+
+      connection.onopen = function () {
+        keepAlive = use_keepAlive;
+        webSockKeepAlive();
+      };
+
+      // Log errors
+      connection.onerror = function (error) {
+        keepAlive = false;
+        alert("WebSocket error");
+        connection.close();
+      };
+
+      // Log messages from the server
+      connection.onmessage = function (e) {
+        var lCmd = e.data.substring(0,3);
+        if (lCmd == "-->") {
+          console.log(e.data);
+          var lDirection = Number(e.data.substring(5));
+          if (e.data[3] == 'h') {
+            hand_hour.setAttribute("transform", "rotate(" + lDirection + " 800 600)");
+          }
+          if (e.data[3] == 'm') {
+            hand_min.setAttribute("transform", "rotate(" + lDirection + " 800 600)");
+          }
+        } else {
+          websock_text_field.textContent = e.data;
+        }
+      };
+
+      console.log("load");
+    }
+
+  ]]></script>
+
+<svg class="main"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:svg="http://www.w3.org/2000/svg"
+  version="1.1"
+  xmlns:xlink="http://www.w3.org/1999/xlink"
+  viewBox="0 0 1600 1200" preserveAspectRatio="xMinYMin meet"
+  onload="load()"
+  >
+
+  <circle id="line_a" cx="800" cy="600" r="500" style="stroke:rgb(255,0,0); stroke-width:5; fill:rgb(200,200,200)"/>
+  <polygon points="800,200 900,300 850,300 850,600 750,600 750,300 700,300" style="fill:rgb(100,0,0)" transform="rotate(0,800,600)" id="hand_hour"/>
+  <polygon points="800,100 840,200 820,200 820,600 780,600 780,200 760,200" style="fill:rgb(0,100,0)" transform="rotate(0,800,600)" id="hand_min"/>
+  <text id="websock_text_field" x="800" y="600" text-anchor="middle" font-size="50px" fill="red">No websocket connection yet</text>
+
+</svg>
+
+</body>
+</html>