aboutsummaryrefslogtreecommitdiffstats
path: root/examples/websocket/priv/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'examples/websocket/priv/index.html')
-rw-r--r--examples/websocket/priv/index.html112
1 files changed, 112 insertions, 0 deletions
diff --git a/examples/websocket/priv/index.html b/examples/websocket/priv/index.html
new file mode 100644
index 0000000..5bc7f15
--- /dev/null
+++ b/examples/websocket/priv/index.html
@@ -0,0 +1,112 @@
+<html>
+ <head>
+ <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
+ <title>Websocket client</title>
+ <script src="/static/jquery.min.js"></script>
+ <script type="text/javascript">
+
+ var websocket;
+ $(document).ready(init);
+
+ function init() {
+ if(!("WebSocket" in window)){
+ $('#status').append('<p><span style="color: red;">websockets are not supported </span></p>');
+ $("#navigation").hide();
+ } else {
+ $('#status').append('<p><span style="color: green;">websockets are supported </span></p>');
+ connect();
+ };
+ $("#connected").hide();
+ $("#content").hide();
+ };
+
+ function connect()
+ {
+ wsHost = $("#server").val()
+ websocket = new WebSocket(wsHost);
+ showScreen('<b>Connecting to: ' + wsHost + '</b>');
+ websocket.onopen = function(evt) { onOpen(evt) };
+ websocket.onclose = function(evt) { onClose(evt) };
+ websocket.onmessage = function(evt) { onMessage(evt) };
+ websocket.onerror = function(evt) { onError(evt) };
+ };
+
+ function disconnect() {
+ websocket.close();
+ };
+
+ function toggle_connection(){
+ if(websocket.readyState == websocket.OPEN){
+ disconnect();
+ } else {
+ connect();
+ };
+ };
+
+ function sendTxt() {
+ if(websocket.readyState == websocket.OPEN){
+ txt = $("#send_txt").val();
+ websocket.send(txt);
+ showScreen('sending: ' + txt);
+ } else {
+ showScreen('websocket is not connected');
+ };
+ };
+
+ function onOpen(evt) {
+ showScreen('<span style="color: green;">CONNECTED </span>');
+ $("#connected").fadeIn('slow');
+ $("#content").fadeIn('slow');
+ };
+
+ function onClose(evt) {
+ showScreen('<span style="color: red;">DISCONNECTED </span>');
+ };
+
+ function onMessage(evt) {
+ showScreen('<span style="color: blue;">RESPONSE: ' + evt.data+ '</span>');
+ };
+
+ function onError(evt) {
+ showScreen('<span style="color: red;">ERROR: ' + evt.data+ '</span>');
+ };
+
+ function showScreen(txt) {
+ $('#output').prepend('<p>' + txt + '</p>');
+ };
+
+ function clearScreen()
+ {
+ $('#output').html("");
+ };
+ </script>
+ </head>
+
+ <body>
+ <div id="header">
+ <h1>Websocket client</h1>
+ <div id="status"></div>
+ </div>
+
+
+ <div id="navigation">
+
+ <p id="connecting">
+ <input type='text' id="server" value="ws://localhost:8080/websocket"></input>
+ <button type="button" onclick="toggle_connection()">connection</button>
+ </p>
+ <div id="connected">
+ <p>
+ <input type='text' id="send_txt" value=></input>
+ <button type="button" onclick="sendTxt();">send</button>
+ </p>
+ </div>
+
+ <div id="content">
+ <button id="clear" onclick="clearScreen()" >Clear text</button>
+ <div id="output"></div>
+ </div>
+
+ </div>
+ </body>
+</html>