Blame view

3rdparty/websocketpp-0.8.2/examples/telemetry_server/index.html 1.95 KB
73ef4ff3   Hu Chunming   提交三方库
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
  <!doctype html>
  <html>
  <head>
  <title>WebSocket++ Telemetry Client</title>
  </head>
  <body>
  
  <script type="text/javascript">
  var ws;
  var url;
  
  function connect() {
  	url = document.getElementById("server_url").value;
  	
  	if ("WebSocket" in window) {
  		ws = new WebSocket(url);
  	} else if ("MozWebSocket" in window) {
  		ws = new MozWebSocket(url);
  	} else {
  		document.getElementById("messages").innerHTML += "This Browser does not support WebSockets<br />";
  		return;
  	}
  	ws.onopen = function(e) {
  		document.getElementById("messages").innerHTML += "Client: A connection to "+ws.url+" has been opened.<br />";
  		
  		document.getElementById("server_url").disabled = true;
  		document.getElementById("toggle_connect").innerHTML = "Disconnect";
  	};
  	
  	ws.onerror = function(e) {
  		document.getElementById("messages").innerHTML += "Client: An error occured, see console log for more details.<br />";
  		console.log(e);
  	};
  	
  	ws.onclose = function(e) {
  		document.getElementById("messages").innerHTML += "Client: The connection to "+url+" was closed. ["+e.code+(e.reason != "" ? ","+e.reason : "")+"]<br />";
  	    cleanup_disconnect();
  	};
  	
  	ws.onmessage = function(e) {
  		document.getElementById("messages").innerHTML += "Server: "+e.data+"<br />";
  	};
  }
  
  function disconnect() {
  	ws.close();
  	cleanup_disconnect();
  }
  
  function cleanup_disconnect() {
      document.getElementById("server_url").disabled = false;
  	document.getElementById("toggle_connect").innerHTML = "Connect";
  }
  
  function toggle_connect() {
  	if (document.getElementById("server_url").disabled === false) {
  		connect();
  	} else {
  		disconnect();
  	}
  }
  </script>
  
  <style>
  body,html {
  	margin: 0px;
  	padding: 0px;
  }
  #controls {
  	float:right;
  	background-color: #999;
  }
  
  </style>
  
  <div id="controls">
  	<div id="server">
  	<input type="text" name="server_url" id="server_url" value="ws://localhost:9002" /><br />
  	<button id="toggle_connect" onclick="toggle_connect();">Connect</button>
  	</div>
  </div>
  <div id="messages"></div>
  
  </body>
  </html>