| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104 |
- <html>
- <head>
- <title>WebSocketServer</title>
- <script type="text/javascript">
- var ws;
- function log(msg, color)
- {
- var div = document.getElementById("output");
- div.innerHTML = div.innerHTML + "<pre style='color:" + color + "'>" + msg + "</pre>";
- }
-
- function WebSocketOpen()
- {
- if ("WebSocket" in window)
- {
- ws = new WebSocket("ws://localhost:9980/ws");
- ws.onopen = function()
- {
- ws.send("Hello, world!");
- log("WebSocket opened.", "green");
- };
-
- ws.onmessage = function(evt)
- {
- var arr = evt.data.split(",");
- if (arr.length >= 4)
- {
- log("Data: " + evt.data, "green");
- updateTable(arr[0], arr[1], arr[2], arr[3]);
- }
- else
- log("Unknown message received: " + evt.data, "red");
- };
-
- ws.onclose = function()
- {
- log("WebSocket closed.", "red");
- }
- }
- else
- {
- log("This browser does not support WebSockets.", "red");
- }
- }
-
- function WebSocketSend(msg)
- {
- ws.send("hello");
- }
-
- function WebSocketClose()
- {
- ws.close();
- }
-
- function updateTable(id, name, address, age)
- {
- var table = document.getElementById("dataTable");
-
-
- if (table.rows.length > 1)
- {
- for (r = 1; r < table.rows.length; r++)
- {
- if (table.rows[r].cells[0].innerHTML == id)
- {
- table.rows[r].cells[1].innerHTML = name;
- table.rows[r].cells[2].innerHTML = address;
- table.rows[r].cells[3].innerHTML = age;
- return;
- }
- }
- }
-
- var row = table.insertRow(table.rows.length);
-
- var cell1 = row.insertCell(0);
- cell1.innerHTML = id;
-
- var cell2 = row.insertCell(1);
- cell2.innerHTML = name;
-
- var cell3 = row.insertCell(2);
- cell3.innerHTML = address;
-
- var cell4 = row.insertCell(3);
- cell4.innerHTML = age;
- }
- </script>
- </head>
- <body onload="WebSocketOpen()">
- <h1>Web Notifier Example</h1>
- <!--
- <p><a href="javascript:WebSocketOpen()">Open WebSocket</a></p>
- <p><a href="javascript:WebSocketClose()">Close WebSocket</a></p>
- <p><a href="javascript:WebSocketSend('hello')">Send Echo</a></p>
- -->
- <table id="dataTable" width="350px" border="1">
- <tr> <th>ID</th> <th>Name</th> <th>Address</th> <th>Age</th></tr>
- </table>
- <div id="output"></div>
- </body>
- </html>
|