-
Notifications
You must be signed in to change notification settings - Fork 0
/
template.html
135 lines (123 loc) · 4.27 KB
/
template.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
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<!DOCTYPE html>
<html>
<head>
<style>
button {
float: right;
}
table {
border-collapse: collapse;
width: 100%;
}
th, td {
padding: 8px;
text-align: center;
border-bottom: 1px solid #ddd;
}
tr:hover{background-color:#f5f5f5}
</style>
<script language="javascript" type="text/javascript">
var refresh = true;
var sendMessage;
var wsUri = "ws://localhost:8080/ws";
var websocket;
function switchButtons() {
var stop_button = document.getElementById("stopRefresh");
if(stop_button.style.display == "none") {
stop_button.style.display="";
} else {
stop_button.style.display="none";
}
var set_button = document.getElementById("setRefresh");
if(set_button.style.display == "none") {
set_button.style.display="";
} else {
set_button.style.display="none";
}
}
function setRefresh() {
sendMessage = setInterval(function(){doSend("");}, 1000);
switchButtons();
refresh = true;
}
function stopRefresh() {
clearInterval(sendMessage);
switchButtons();
refresh = false;
}
function init() {
myWebSocket();
}
function myWebSocket() {
websocket = new WebSocket(wsUri);
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 onClose(evt) {
clearInterval(sendMessage);
init();
}
function onError(evt) {;}
function onOpen(evt) {
sendMessage = setInterval(function(){doSend("interval");}, 1000);
}
function onMessage(evt) {
if (evt.data != "") {
writeToScreen(evt.data);
}
}
function doSend(message) {
websocket.send(message);
}
function writeToScreen(message) {
document.getElementById('receiving').innerHTML = message + document.getElementById('receiving').innerHTML;
}
window.addEventListener("load", init, false);
</script>
<script>
function reverseDisplay() {
// get hidden data elements and make them display
var x = document.getElementsByClassName("hidden");
var i;
for (i = 0; i < x.length; i++) {
if(x[i].style.display == "none") {
x[i].style.display="";
} else {
x[i].style.display="none";
}
}
}
</script>
</head>
<body>
<button id="exit" onclick="window.location.href='/exit'">Shutdown Server</button>
<button id="stopRefresh" onclick="stopRefresh();" style="display: none;">Stop Refreshing</button>
<button id="setRefresh" onclick="setRefresh();" style="display: none;">Resume Refreshing</button>
<button id="showhide" onclick="reverseDisplay();" >Show / Hidden</button><br />
<form method="POST">
<table>
<tr>
<th width="80px">Important</th>
<th width="80px">Useless</th>
<th>Data</th>
</tr>
<!--CONTENT-->
</table>
<table id="receiving">
</table>
<p style="text-align: center;">
<input type="submit">
</p>
</form>
</body>
</html>