/
connection.html
91 lines (66 loc) · 2.95 KB
/
connection.html
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
86
87
88
89
90
91
<html>
<head>
<script src="integ/comm.js"></script>
<script src="integ/md5.js"></script>
<script src="integ/base64.js"></script>
<script src="integ/jnrWebsocket.js"></script>
</head>
<body>
<!-- the connection status -->
<pre id="status"> </pre>
<!-- buttons to control the connection -->
<button id="connect-button" onclick="connect_button_click()">Connect</button>
<button id="close-button" onclick="close_button_click()" disabled="disabled">Close</button>
<!-- the javascript -->
<script>
const connect_button = document.getElementById('connect-button');
const close_button = document.getElementById('close-button');
// gets called to update the status element with text and a new color
function updateStatus(text, color) {
var statusElement = document.getElementById('status');
statusElement.innerText = text;
statusElement.style.color = color;
}
// gets called when the user clicks the connect button. we should disable the connect
// button so the user cant press it again until the connection is closed
function connect_button_click() {
updateStatus(`Connecting to ${ip}...`, 'black');
jnrwebsocket.connect('ws://' + ip);
connect_button.disabled = true;
}
// gets called when the user clicks the close button. we should disable the close
// button so the user cant press it again until the connection is opened
function close_button_click() {
updateStatus(`Closing...`, 'black');
jnrwebsocket.close();
close_button.disabled = true;
}
//
// get the ip address from the url. if one is not specifed then prompt the user for it
let params = (new URL(document.location)).searchParams;
let ip = params.get("ip");
if (!ip) ip = prompt("Please enter the target IP Address");
//
// define our websocket object
const jnrwebsocket = new JnrWebsocket();
//
// add a listener that gets called when the connection is opened. once the connection is
// opened we will enable the close button
jnrwebsocket.addEventListener('onOpened', () => {
updateStatus('Connected!', 'green');
close_button.disabled = false;
});
//
// add a listener that gets called when the connection gets closed. once the connection
// is closed then we can re-enable the connect button
jnrwebsocket.addEventListener('onClosed', () => {
updateStatus('Closed!', 'red');
connect_button.disabled = false;
});
// add a listener that will be raised if there is an error with the websocket connection
jnrwebsocket.onError = (error) => {
updateStatus(`websocket connection has thrown an error: ${error}`, 'red');
};
</script>
</body>
</html>