|
1 <!DOCTYPE html> |
|
2 <html> |
|
3 <head> |
|
4 <link rel="icon" href="data:;base64,="> |
|
5 <script type="text/javascript"> |
|
6 var sock = null; |
|
7 var ellog = null; |
|
8 |
|
9 window.onload = function() { |
|
10 |
|
11 ellog = document.getElementById('log'); |
|
12 |
|
13 var wsuri; |
|
14 if (window.location.protocol === "file:") { |
|
15 wsuri = "ws://127.0.0.1:8090/annot"; |
|
16 } else { |
|
17 wsuri = "ws://" + window.location.hostname + ":8090/annot"; |
|
18 } |
|
19 wsuri = wsuri + "?event=test" |
|
20 |
|
21 if ("WebSocket" in window) { |
|
22 sock = new WebSocket(wsuri); |
|
23 } else if ("MozWebSocket" in window) { |
|
24 sock = new MozWebSocket(wsuri); |
|
25 } else { |
|
26 log("Browser does not support WebSocket!"); |
|
27 window.location = "http://autobahn.ws/unsupportedbrowser"; |
|
28 } |
|
29 |
|
30 if (sock) { |
|
31 sock.onopen = function() { |
|
32 log("Connected to " + wsuri); |
|
33 } |
|
34 |
|
35 sock.onclose = function(e) { |
|
36 log("Connection closed (wasClean = " + e.wasClean + ", code = " + e.code + ", reason = '" + e.reason + "')"); |
|
37 sock = null; |
|
38 } |
|
39 |
|
40 sock.onmessage = function(e) { |
|
41 log("Got message: " + e.data); |
|
42 } |
|
43 } |
|
44 }; |
|
45 |
|
46 function send() { |
|
47 var msg = document.getElementById('message').value; |
|
48 if (sock) { |
|
49 new_annot = { |
|
50 categories : [msg], |
|
51 user : "admin" |
|
52 } |
|
53 sock.send(JSON.stringify(new_annot)); |
|
54 log("Sent: " + JSON.stringify(new_annot)); |
|
55 } else { |
|
56 log("Not connected."); |
|
57 } |
|
58 }; |
|
59 |
|
60 function log(m) { |
|
61 ellog.innerHTML += m + '\n'; |
|
62 ellog.scrollTop = ellog.scrollHeight; |
|
63 }; |
|
64 </script> |
|
65 </head> |
|
66 <body> |
|
67 <h1>OSC websocket Test</h1> |
|
68 <noscript>You must enable JavaScript</noscript> |
|
69 <form> |
|
70 <p>Message: <input id="message" type="text" size="50" maxlength="50" value="Hello, world!"></p> |
|
71 </form> |
|
72 <button onclick='send();'>Send Message</button> |
|
73 <pre id="log" style="height: 20em; overflow-y: scroll; background-color: #faa;"></pre> |
|
74 </body> |
|
75 </html> |