Browse code

reorg_20202027

Gandolf authored on 10/27/2020 20:25:34
Showing 1 changed files
1 1
deleted file mode 100644
... ...
@@ -1,323 +0,0 @@
1
-<!DOCTYPE html>
2
-<!-- Courtesy ruler for editing this file
3
-12345678901234567890123456789012345678901234567890123456789012345678901234567890
4
-<html>
5
-<head>
6
-<title>Node Signal</title>
7
-<meta charset="UTF-8">
8
-<meta name="viewport" content="width=device-width, initial-scale=1.0">
9
-<style>
10
-body {
11
-    background-image: url("static/chalk.jpg");
12
-}
13
-h2 {
14
-    font: bold 24px arial, sans-serif;
15
-}
16
-h3 {
17
-    font: bold 18px arial, sans-serif;
18
-}
19
-h4 {
20
-    font: bold 16px arial, sans-serif;
21
-}
22
-.mainContainer {
23
-    width: 750px;
24
-    text-align: center;
25
-    margin: auto;
26
-    /*border: 1px solid black;*/
27
-}
28
-.datetime {
29
-    font: bold 22px arial, sans-serif;
30
-    padding: 0px;
31
-}
32
-.rowContainer {
33
-    display: table;
34
-    width: 100%;
35
-}
36
-.currentDataCell {
37
-    width: 50%;
38
-    padding: 10px;
39
-    font: bold 20px arial, sans-serif;
40
-    text-align: center;
41
-    display: table-cell;
42
-    vertical-align: middle;
43
-}
44
-.dataItems {
45
-    padding: 2px;
46
-    text-align: left;
47
-    line-height: 130%;
48
-    display: inline-block;
49
-    vertical-align: middle;
50
-}
51
-.chartContainer {
52
-    padding: 2px;
53
-}
54
-img.chart {
55
-    width:100%;
56
-}
57
-.notes {
58
-    font: 17px arial, sans-serif;
59
-    text-align: left;
60
-    padding: 10px;
61
-}
62
-span.chartSelector {
63
-    margin: auto;
64
-}
65
-ul.selectorElement {
66
-    list-style-type: none;
67
-    margin: 10px;
68
-    padding: 0;
69
-    overflow: hidden;
70
-    background-color: #bbb;
71
-    text-align: center;
72
-}
73
-li.selectorElement {
74
-    display: inline-block;
75
-    font: bold 18px arial, sans-serif;
76
-    color: black;
77
-}
78
-span.selectorElement:hover {
79
-    background-color: #333;
80
-    cursor: pointer;
81
-    color: white;
82
-}
83
-span.selectorElement {
84
-    display: inline-block;
85
-    padding: 8px 12px;
86
-}
87
-#iframe_a {
88
-    border:none;
89
-    width:100%;
90
-    height:450px;
91
-}
92
-</style>
93
-</head>
94
-
95
-<body onload="main()">
96
-
97
-<div class="mainContainer">
98
-<h2><a href="https://github.com/fractalxaos/ham/tree/master/arednsig" 
99
-  style="text-decoration:none" target="_new">
100
-KA7JLO AREDN<sup>&#174;</sup> Node Signal</a></h2>
101
-<h3>Last Updated</h3>
102
-<div class="datetime">
103
-<span id="date"></span>
104
-&nbsp;&nbsp;
105
-<span id="time"></span>
106
-</div>
107
-
108
-<div class="rowContainer">
109
-<div class="currentDataCell">
110
-<div class="dataItems" style="text-align: center;">
111
-Status: <span id="status"></span><br>
112
-Data updates every: <span id="period"></span> minutes
113
-</div>
114
-
115
-</div>
116
-</div>
117
-
118
-<span class="chartSelectors">
119
-<ul class="selectorElement">
120
-<li class="selectorElement">Select charts:</li>
121
-<li class="selectorElement"><span class="selectorElement"
122
- onclick="setChartPeriod(1)">24 hours</span></li>
123
-<li class="selectorElement"><span class="selectorElement"
124
- onclick="setChartPeriod(2)">4 weeks</span></li>
125
-<li class="selectorElement"><span class="selectorElement"
126
- onclick="setChartPeriod(3)">12 months</span></li>
127
-<li class="selectorElement"><span class="selectorElement"
128
- onclick="setChartPeriod(0)">Custom…</span></li>
129
-</ul>
130
-</span>
131
-
132
-<div class="rowContainer" id="customChartsContainer" style="display:none;">
133
-<div class="currentDataCell">
134
-<form id="fmDateSelector" action="arednsig.php" method="post"
135
- target="iframe_a">
136
-<label for="beginDate">Begin Date: </label>
137
-<input id="beginDate" name="beginDate" type="date" value="mm/dd/yyyy" />
138
-<label for="endDate">End Date: </label>
139
-<input id="endDate" name="endDate" type="date" value="mm/dd/yyyy" />
140
-<br><br>
141
-<input type="button" onclick="getCustomCharts()" value="Get Charts">
142
-</form>
143
-<span id="errorMsg"></span><br>
144
-<iframe id="iframe_a" name="iframe_a"></iframe>
145
-</div>
146
-</div>
147
-
148
-<br>
149
-
150
-<div class="rowContainer" id="stockChartsContainer">
151
-<div class="chartContainer">
152
-<img class="chart" id="signalChart">
153
-</div>
154
-<div class="chartContainer">
155
-<img class="chart" id="snrChart">
156
-</div>
157
-</div>
158
-
159
-<div class="notes">
160
-<b>NOTES:</b>
161
-<ul>
162
-<li>Aredn Node Signal software available at
163
-<a href="https://github.com/fractalxaos/ham/tree/master/arednsig"
164
- target="_new">
165
-<i>Github.com</i></a>.</li>
166
-<li>Project sponsored by 
167
-<a href="https://willamettevalleymesh.net" TARGET="_NEW">
168
-<i>Willamette Valley Mesh Network</i></a>, Salem, Oregon.</li>
169
-<li>For more information about the amateur radio emergency
170
- data network (AREDN) see official web site at
171
- <a href="http://www.arednmesh.org" target="_blank">
172
-www.arednmesh.org</a>.</li>
173
-</ul>
174
-</div>
175
-</div>
176
-<br>
177
-
178
-<script>
179
-
180
-/* Global constants */
181
-
182
-var nodeDataUrl = "dynamic/nodeOnline.js";
183
-
184
-/* Global DOM objects */
185
-
186
-// Chart elements
187
-var signalChart = document.getElementById("signalChart");
188
-var snrChart = document.getElementById("snrChart");
189
-
190
-// Text elements
191
-var dateElmt = document.getElementById("date");    
192
-var timeElmt = document.getElementById("time"); 
193
-var statusElmt = document.getElementById("status");
194
-var periodElmt = document.getElementById("period");
195
-
196
-// Document elements
197
-var customChartsContainer = document.getElementById("customChartsContainer");
198
-var stockChartsContainer = document.getElementById("stockChartsContainer");
199
-var fmDateSelector = document.getElementById("fmDateSelector");
200
-var errorMsg = document.getElementById("errorMsg");
201
-
202
-/* Global objects */
203
-
204
-var httpRequest = new XMLHttpRequest();
205
-
206
-/* Global variables */
207
-
208
-var chartPeriod = 1;
209
-var chartRefreshRate = 0; // chart refresh rate in minutes
210
-
211
-function main() {
212
-    /* Register call back function to process http requests */
213
-    httpRequest.onreadystatechange = function() {
214
-        if (httpRequest.readyState == 4 && httpRequest.status == 200) {
215
-            var dataArray = JSON.parse(httpRequest.responseText);
216
-            displayData(dataArray[0]);
217
-        } else if (httpRequest.readyState == 4 && httpRequest.status == 404) {
218
-            displayOfflineStatus();
219
-        }
220
-    };
221
-    httpRequest.ontimeout = function(e) {
222
-        displayOfflineStatus();
223
-    };
224
-
225
-    initializeDateSelector();
226
-    getNodeData();
227
-    getNodeCharts();
228
-}
229
-
230
-function getNodeData() {
231
-    httpRequest.open("GET", nodeDataUrl, true);
232
-    httpRequest.timeout = 3000;
233
-    httpRequest.send();
234
-}
235
-
236
-function setChartPeriod(n) {
237
-    chartPeriod = n;
238
-    if (n == 0) {
239
-        customChartsContainer.style.display = "block";
240
-        stockChartsContainer.style.display = "none";
241
-    } else {
242
-        customChartsContainer.style.display = "none";
243
-        stockChartsContainer.style.display = "block";
244
-    getNodeCharts();   
245
-    }
246
-}
247
-
248
-function getNodeCharts() {
249
-    var d = new Date;
250
-    var pfx;
251
-
252
-    switch(chartPeriod) {
253
-        case 1:
254
-            pfx = "24hr_";
255
-            break;
256
-        case 2:
257
-            pfx = "4wk_";
258
-            break;
259
-       case 3:
260
-            pfx = "12m_";
261
-            break;
262
-    }
263
-    signalChart.src = "dynamic/" + pfx + "signal.png?ver=" + d.getTime();
264
-    snrChart.src = "dynamic/" + pfx + "snr.png?ver=" + d.getTime();
265
-}
266
-
267
-function displayData(dataItem) {
268
-    var timeStamp, date, time, hourminute;
269
-    var localDateObj,localTimeZone;
270
-
271
-    timeStamp = dataItem.date;
272
-    date = timeStamp.split(" ")[0];
273
-    time = timeStamp.split(" ")[1];
274
-    hourminute = time.split(":")[0] + ":" + time.split(":")[1];
275
-    localDate = new Date();
276
-    localTimeZone = localDate.getTimezoneOffset() / 60;
277
-    dateElmt.innerHTML = date;    
278
-    timeElmt.innerHTML = hourminute +
279
-                         "  <small>(GMT+" + localTimeZone + ")</small>";    
280
-     
281
-    statusElmt.innerHTML = "Online";
282
-    statusElmt.style.color = "green";
283
-
284
-    chartRefreshRate = dataItem.period;
285
-    periodElmt.innerHTML = chartRefreshRate;
286
-    setInterval(getNodeData, 60000 * chartRefreshRate);
287
-    setInterval(getNodeCharts, 60000 * chartRefreshRate);
288
-}
289
-
290
-function displayOfflineStatus() {
291
-    var d = new Date();
292
-    localTimeZone = d.getTimezoneOffset() / 60;
293
-    dateElmt.innerHTML = (d.getMonth() + 1) + "/" + d.getDate() + "/" +
294
-                          d.getFullYear();    
295
-    timeElmt.innerHTML = d.getHours() + ":" + d.getMinutes() +
296
-                         "  <small>(GMT+" + localTimeZone + ")</small>";
297
-    periodElmt.innerHTML = "?";    
298
-    statusElmt.innerHTML = "offline";    
299
-    statusElmt.style.color = "red";
300
-}
301
-
302
-function initializeDateSelector() {
303
-    var d = new Date();
304
-
305
-    var dEnd = new Date(d.getFullYear(),
306
-               d.getMonth(), d.getDate() - 0);
307
-
308
-    var dBegin = new Date(d.getFullYear(),
309
-               d.getMonth(), d.getDate() - 1);
310
-
311
-    document.getElementById("beginDate").valueAsDate = dBegin;
312
-    document.getElementById("endDate").valueAsDate = dEnd;
313
-}
314
-
315
-function getCustomCharts() {
316
-    fmDateSelector.submit();
317
-}
318
-</script>
319
-
320
-</body>
321
-</html>
322
-
Browse code

add version for FW v3.20

Gandolf authored on 10/03/2020 23:02:19
Showing 1 changed files
1 1
new file mode 100644
... ...
@@ -0,0 +1,323 @@
1
+<!DOCTYPE html>
2
+<!-- Courtesy ruler for editing this file
3
+12345678901234567890123456789012345678901234567890123456789012345678901234567890
4
+-->
5
+<html>
6
+<head>
7
+<title>Node Signal</title>
8
+<meta charset="UTF-8">
9
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
10
+<style>
11
+body {
12
+    background-image: url("static/chalk.jpg");
13
+}
14
+h2 {
15
+    font: bold 24px arial, sans-serif;
16
+}
17
+h3 {
18
+    font: bold 18px arial, sans-serif;
19
+}
20
+h4 {
21
+    font: bold 16px arial, sans-serif;
22
+}
23
+.mainContainer {
24
+    width: 750px;
25
+    text-align: center;
26
+    margin: auto;
27
+    /*border: 1px solid black;*/
28
+}
29
+.datetime {
30
+    font: bold 22px arial, sans-serif;
31
+    padding: 0px;
32
+}
33
+.rowContainer {
34
+    display: table;
35
+    width: 100%;
36
+}
37
+.currentDataCell {
38
+    width: 50%;
39
+    padding: 10px;
40
+    font: bold 20px arial, sans-serif;
41
+    text-align: center;
42
+    display: table-cell;
43
+    vertical-align: middle;
44
+}
45
+.dataItems {
46
+    padding: 2px;
47
+    text-align: left;
48
+    line-height: 130%;
49
+    display: inline-block;
50
+    vertical-align: middle;
51
+}
52
+.chartContainer {
53
+    padding: 2px;
54
+}
55
+img.chart {
56
+    width:100%;
57
+}
58
+.notes {
59
+    font: 17px arial, sans-serif;
60
+    text-align: left;
61
+    padding: 10px;
62
+}
63
+span.chartSelector {
64
+    margin: auto;
65
+}
66
+ul.selectorElement {
67
+    list-style-type: none;
68
+    margin: 10px;
69
+    padding: 0;
70
+    overflow: hidden;
71
+    background-color: #bbb;
72
+    text-align: center;
73
+}
74
+li.selectorElement {
75
+    display: inline-block;
76
+    font: bold 18px arial, sans-serif;
77
+    color: black;
78
+}
79
+span.selectorElement:hover {
80
+    background-color: #333;
81
+    cursor: pointer;
82
+    color: white;
83
+}
84
+span.selectorElement {
85
+    display: inline-block;
86
+    padding: 8px 12px;
87
+}
88
+#iframe_a {
89
+    border:none;
90
+    width:100%;
91
+    height:450px;
92
+}
93
+</style>
94
+</head>
95
+
96
+<body onload="main()">
97
+
98
+<div class="mainContainer">
99
+<h2><a href="https://github.com/fractalxaos/ham/tree/master/arednsig" 
100
+  style="text-decoration:none" target="_new">
101
+KA7JLO AREDN<sup>&#174;</sup> Node Signal</a></h2>
102
+<h3>Last Updated</h3>
103
+<div class="datetime">
104
+<span id="date"></span>
105
+&nbsp;&nbsp;
106
+<span id="time"></span>
107
+</div>
108
+
109
+<div class="rowContainer">
110
+<div class="currentDataCell">
111
+<div class="dataItems" style="text-align: center;">
112
+Status: <span id="status"></span><br>
113
+Data updates every: <span id="period"></span> minutes
114
+</div>
115
+
116
+</div>
117
+</div>
118
+
119
+<span class="chartSelectors">
120
+<ul class="selectorElement">
121
+<li class="selectorElement">Select charts:</li>
122
+<li class="selectorElement"><span class="selectorElement"
123
+ onclick="setChartPeriod(1)">24 hours</span></li>
124
+<li class="selectorElement"><span class="selectorElement"
125
+ onclick="setChartPeriod(2)">4 weeks</span></li>
126
+<li class="selectorElement"><span class="selectorElement"
127
+ onclick="setChartPeriod(3)">12 months</span></li>
128
+<li class="selectorElement"><span class="selectorElement"
129
+ onclick="setChartPeriod(0)">Custom…</span></li>
130
+</ul>
131
+</span>
132
+
133
+<div class="rowContainer" id="customChartsContainer" style="display:none;">
134
+<div class="currentDataCell">
135
+<form id="fmDateSelector" action="arednsig.php" method="post"
136
+ target="iframe_a">
137
+<label for="beginDate">Begin Date: </label>
138
+<input id="beginDate" name="beginDate" type="date" value="mm/dd/yyyy" />
139
+<label for="endDate">End Date: </label>
140
+<input id="endDate" name="endDate" type="date" value="mm/dd/yyyy" />
141
+<br><br>
142
+<input type="button" onclick="getCustomCharts()" value="Get Charts">
143
+</form>
144
+<span id="errorMsg"></span><br>
145
+<iframe id="iframe_a" name="iframe_a"></iframe>
146
+</div>
147
+</div>
148
+
149
+<br>
150
+
151
+<div class="rowContainer" id="stockChartsContainer">
152
+<div class="chartContainer">
153
+<img class="chart" id="signalChart">
154
+</div>
155
+<div class="chartContainer">
156
+<img class="chart" id="snrChart">
157
+</div>
158
+</div>
159
+
160
+<div class="notes">
161
+<b>NOTES:</b>
162
+<ul>
163
+<li>Aredn Node Signal software available at
164
+<a href="https://github.com/fractalxaos/ham/tree/master/arednsig"
165
+ target="_new">
166
+<i>Github.com</i></a>.</li>
167
+<li>Project sponsored by 
168
+<a href="https://willamettevalleymesh.net" TARGET="_NEW">
169
+<i>Willamette Valley Mesh Network</i></a>, Salem, Oregon.</li>
170
+<li>For more information about the amateur radio emergency
171
+ data network (AREDN) see official web site at
172
+ <a href="http://www.arednmesh.org" target="_blank">
173
+www.arednmesh.org</a>.</li>
174
+</ul>
175
+</div>
176
+</div>
177
+<br>
178
+
179
+<script>
180
+
181
+/* Global constants */
182
+
183
+var nodeDataUrl = "dynamic/nodeOnline.js";
184
+
185
+/* Global DOM objects */
186
+
187
+// Chart elements
188
+var signalChart = document.getElementById("signalChart");
189
+var snrChart = document.getElementById("snrChart");
190
+
191
+// Text elements
192
+var dateElmt = document.getElementById("date");    
193
+var timeElmt = document.getElementById("time"); 
194
+var statusElmt = document.getElementById("status");
195
+var periodElmt = document.getElementById("period");
196
+
197
+// Document elements
198
+var customChartsContainer = document.getElementById("customChartsContainer");
199
+var stockChartsContainer = document.getElementById("stockChartsContainer");
200
+var fmDateSelector = document.getElementById("fmDateSelector");
201
+var errorMsg = document.getElementById("errorMsg");
202
+
203
+/* Global objects */
204
+
205
+var httpRequest = new XMLHttpRequest();
206
+
207
+/* Global variables */
208
+
209
+var chartPeriod = 1;
210
+var chartRefreshRate = 0; // chart refresh rate in minutes
211
+
212
+function main() {
213
+    /* Register call back function to process http requests */
214
+    httpRequest.onreadystatechange = function() {
215
+        if (httpRequest.readyState == 4 && httpRequest.status == 200) {
216
+            var dataArray = JSON.parse(httpRequest.responseText);
217
+            displayData(dataArray[0]);
218
+        } else if (httpRequest.readyState == 4 && httpRequest.status == 404) {
219
+            displayOfflineStatus();
220
+        }
221
+    };
222
+    httpRequest.ontimeout = function(e) {
223
+        displayOfflineStatus();
224
+    };
225
+
226
+    initializeDateSelector();
227
+    getNodeData();
228
+    getNodeCharts();
229
+}
230
+
231
+function getNodeData() {
232
+    httpRequest.open("GET", nodeDataUrl, true);
233
+    httpRequest.timeout = 3000;
234
+    httpRequest.send();
235
+}
236
+
237
+function setChartPeriod(n) {
238
+    chartPeriod = n;
239
+    if (n == 0) {
240
+        customChartsContainer.style.display = "block";
241
+        stockChartsContainer.style.display = "none";
242
+    } else {
243
+        customChartsContainer.style.display = "none";
244
+        stockChartsContainer.style.display = "block";
245
+    getNodeCharts();   
246
+    }
247
+}
248
+
249
+function getNodeCharts() {
250
+    var d = new Date;
251
+    var pfx;
252
+
253
+    switch(chartPeriod) {
254
+        case 1:
255
+            pfx = "24hr_";
256
+            break;
257
+        case 2:
258
+            pfx = "4wk_";
259
+            break;
260
+       case 3:
261
+            pfx = "12m_";
262
+            break;
263
+    }
264
+    signalChart.src = "dynamic/" + pfx + "signal.png?ver=" + d.getTime();
265
+    snrChart.src = "dynamic/" + pfx + "snr.png?ver=" + d.getTime();
266
+}
267
+
268
+function displayData(dataItem) {
269
+    var timeStamp, date, time, hourminute;
270
+    var localDateObj,localTimeZone;
271
+
272
+    timeStamp = dataItem.date;
273
+    date = timeStamp.split(" ")[0];
274
+    time = timeStamp.split(" ")[1];
275
+    hourminute = time.split(":")[0] + ":" + time.split(":")[1];
276
+    localDate = new Date();
277
+    localTimeZone = localDate.getTimezoneOffset() / 60;
278
+    dateElmt.innerHTML = date;    
279
+    timeElmt.innerHTML = hourminute +
280
+                         "  <small>(GMT+" + localTimeZone + ")</small>";    
281
+     
282
+    statusElmt.innerHTML = "Online";
283
+    statusElmt.style.color = "green";
284
+
285
+    chartRefreshRate = dataItem.period;
286
+    periodElmt.innerHTML = chartRefreshRate;
287
+    setInterval(getNodeData, 60000 * chartRefreshRate);
288
+    setInterval(getNodeCharts, 60000 * chartRefreshRate);
289
+}
290
+
291
+function displayOfflineStatus() {
292
+    var d = new Date();
293
+    localTimeZone = d.getTimezoneOffset() / 60;
294
+    dateElmt.innerHTML = (d.getMonth() + 1) + "/" + d.getDate() + "/" +
295
+                          d.getFullYear();    
296
+    timeElmt.innerHTML = d.getHours() + ":" + d.getMinutes() +
297
+                         "  <small>(GMT+" + localTimeZone + ")</small>";
298
+    periodElmt.innerHTML = "?";    
299
+    statusElmt.innerHTML = "offline";    
300
+    statusElmt.style.color = "red";
301
+}
302
+
303
+function initializeDateSelector() {
304
+    var d = new Date();
305
+
306
+    var dEnd = new Date(d.getFullYear(),
307
+               d.getMonth(), d.getDate() - 0);
308
+
309
+    var dBegin = new Date(d.getFullYear(),
310
+               d.getMonth(), d.getDate() - 1);
311
+
312
+    document.getElementById("beginDate").valueAsDate = dBegin;
313
+    document.getElementById("endDate").valueAsDate = dEnd;
314
+}
315
+
316
+function getCustomCharts() {
317
+    fmDateSelector.submit();
318
+}
319
+</script>
320
+
321
+</body>
322
+</html>
323
+
Browse code

remove old versions

Gandolf authored on 10/03/2020 23:00:21
Showing 1 changed files
1 1
deleted file mode 100644
... ...
@@ -1,323 +0,0 @@
1
-<!DOCTYPE html>
2
-<!-- Courtesy ruler for editing this file
3
-12345678901234567890123456789012345678901234567890123456789012345678901234567890
4
-<html>
5
-<head>
6
-<title>Node Signal</title>
7
-<meta charset="UTF-8">
8
-<meta name="viewport" content="width=device-width, initial-scale=1.0">
9
-<style>
10
-body {
11
-    background-image: url("static/chalk.jpg");
12
-}
13
-h2 {
14
-    font: bold 24px arial, sans-serif;
15
-}
16
-h3 {
17
-    font: bold 18px arial, sans-serif;
18
-}
19
-h4 {
20
-    font: bold 16px arial, sans-serif;
21
-}
22
-.mainContainer {
23
-    width: 750px;
24
-    text-align: center;
25
-    margin: auto;
26
-    /*border: 1px solid black;*/
27
-}
28
-.datetime {
29
-    font: bold 22px arial, sans-serif;
30
-    padding: 0px;
31
-}
32
-.rowContainer {
33
-    display: table;
34
-    width: 100%;
35
-}
36
-.currentDataCell {
37
-    width: 50%;
38
-    padding: 10px;
39
-    font: bold 20px arial, sans-serif;
40
-    text-align: center;
41
-    display: table-cell;
42
-    vertical-align: middle;
43
-}
44
-.dataItems {
45
-    padding: 2px;
46
-    text-align: left;
47
-    line-height: 130%;
48
-    display: inline-block;
49
-    vertical-align: middle;
50
-}
51
-.chartContainer {
52
-    padding: 2px;
53
-}
54
-img.chart {
55
-    width:100%;
56
-}
57
-.notes {
58
-    font: 17px arial, sans-serif;
59
-    text-align: left;
60
-    padding: 10px;
61
-}
62
-span.chartSelector {
63
-    margin: auto;
64
-}
65
-ul.selectorElement {
66
-    list-style-type: none;
67
-    margin: 10px;
68
-    padding: 0;
69
-    overflow: hidden;
70
-    background-color: #bbb;
71
-    text-align: center;
72
-}
73
-li.selectorElement {
74
-    display: inline-block;
75
-    font: bold 18px arial, sans-serif;
76
-    color: black;
77
-}
78
-span.selectorElement:hover {
79
-    background-color: #333;
80
-    cursor: pointer;
81
-    color: white;
82
-}
83
-span.selectorElement {
84
-    display: inline-block;
85
-    padding: 8px 12px;
86
-}
87
-#iframe_a {
88
-    border:none;
89
-    width:100%;
90
-    height:450px;
91
-}
92
-</style>
93
-</head>
94
-
95
-<body onload="main()">
96
-
97
-<div class="mainContainer">
98
-<h2><a href="https://github.com/fractalxaos/ham/tree/master/arednsig" 
99
-  style="text-decoration:none" target="_new">
100
-KA7JLO AREDN<sup>&#174;</sup> Node Signal</a></h2>
101
-<h3>Last Updated</h3>
102
-<div class="datetime">
103
-<span id="date"></span>
104
-&nbsp;&nbsp;
105
-<span id="time"></span>
106
-</div>
107
-
108
-<div class="rowContainer">
109
-<div class="currentDataCell">
110
-<div class="dataItems" style="text-align: center;">
111
-Status: <span id="status"></span><br>
112
-Data updates every: <span id="period"></span> minutes
113
-</div>
114
-
115
-</div>
116
-</div>
117
-
118
-<span class="chartSelectors">
119
-<ul class="selectorElement">
120
-<li class="selectorElement">Select charts:</li>
121
-<li class="selectorElement"><span class="selectorElement"
122
- onclick="setChartPeriod(1)">24 hours</span></li>
123
-<li class="selectorElement"><span class="selectorElement"
124
- onclick="setChartPeriod(2)">4 weeks</span></li>
125
-<li class="selectorElement"><span class="selectorElement"
126
- onclick="setChartPeriod(3)">12 months</span></li>
127
-<li class="selectorElement"><span class="selectorElement"
128
- onclick="setChartPeriod(0)">Custom…</span></li>
129
-</ul>
130
-</span>
131
-
132
-<div class="rowContainer" id="customChartsContainer" style="display:none;">
133
-<div class="currentDataCell">
134
-<form id="fmDateSelector" action="arednsig.php" method="post"
135
- target="iframe_a">
136
-<label for="beginDate">Begin Date: </label>
137
-<input id="beginDate" name="beginDate" type="date" value="mm/dd/yyyy" />
138
-<label for="endDate">End Date: </label>
139
-<input id="endDate" name="endDate" type="date" value="mm/dd/yyyy" />
140
-<br><br>
141
-<input type="button" onclick="getCustomCharts()" value="Get Charts">
142
-</form>
143
-<span id="errorMsg"></span><br>
144
-<iframe id="iframe_a" name="iframe_a"></iframe>
145
-</div>
146
-</div>
147
-
148
-<br>
149
-
150
-<div class="rowContainer" id="stockChartsContainer">
151
-<div class="chartContainer">
152
-<img class="chart" id="signalChart">
153
-</div>
154
-<div class="chartContainer">
155
-<img class="chart" id="snrChart">
156
-</div>
157
-</div>
158
-
159
-<div class="notes">
160
-<b>NOTES:</b>
161
-<ul>
162
-<li>Aredn Node Signal software available at
163
-<a href="https://github.com/fractalxaos/ham/tree/master/arednsig"
164
- target="_new">
165
-<i>Github.com</i></a>.</li>
166
-<li>Project sponsored by 
167
-<a href="https://willamettevalleymesh.net" TARGET="_NEW">
168
-<i>Willamette Valley Mesh Network</i></a>, Salem, Oregon.</li>
169
-<li>For more information about the amateur radio emergency
170
- data network (AREDN) see official web site at
171
- <a href="http://www.arednmesh.org" target="_blank">
172
-www.arednmesh.org</a>.</li>
173
-</ul>
174
-</div>
175
-</div>
176
-<br>
177
-
178
-<script>
179
-
180
-/* Global constants */
181
-
182
-var nodeDataUrl = "dynamic/nodeOnline.js";
183
-
184
-/* Global DOM objects */
185
-
186
-// Chart elements
187
-var signalChart = document.getElementById("signalChart");
188
-var snrChart = document.getElementById("snrChart");
189
-
190
-// Text elements
191
-var dateElmt = document.getElementById("date");    
192
-var timeElmt = document.getElementById("time"); 
193
-var statusElmt = document.getElementById("status");
194
-var periodElmt = document.getElementById("period");
195
-
196
-// Document elements
197
-var customChartsContainer = document.getElementById("customChartsContainer");
198
-var stockChartsContainer = document.getElementById("stockChartsContainer");
199
-var fmDateSelector = document.getElementById("fmDateSelector");
200
-var errorMsg = document.getElementById("errorMsg");
201
-
202
-/* Global objects */
203
-
204
-var httpRequest = new XMLHttpRequest();
205
-
206
-/* Global variables */
207
-
208
-var chartPeriod = 1;
209
-var chartRefreshRate = 0; // chart refresh rate in minutes
210
-
211
-function main() {
212
-    /* Register call back function to process http requests */
213
-    httpRequest.onreadystatechange = function() {
214
-        if (httpRequest.readyState == 4 && httpRequest.status == 200) {
215
-            var dataArray = JSON.parse(httpRequest.responseText);
216
-            displayData(dataArray[0]);
217
-        } else if (httpRequest.readyState == 4 && httpRequest.status == 404) {
218
-            displayOfflineStatus();
219
-        }
220
-    };
221
-    httpRequest.ontimeout = function(e) {
222
-        displayOfflineStatus();
223
-    };
224
-
225
-    initializeDateSelector();
226
-    getNodeData();
227
-    getNodeCharts();
228
-}
229
-
230
-function getNodeData() {
231
-    httpRequest.open("GET", nodeDataUrl, true);
232
-    httpRequest.timeout = 3000;
233
-    httpRequest.send();
234
-}
235
-
236
-function setChartPeriod(n) {
237
-    chartPeriod = n;
238
-    if (n == 0) {
239
-        customChartsContainer.style.display = "block";
240
-        stockChartsContainer.style.display = "none";
241
-    } else {
242
-        customChartsContainer.style.display = "none";
243
-        stockChartsContainer.style.display = "block";
244
-    getNodeCharts();   
245
-    }
246
-}
247
-
248
-function getNodeCharts() {
249
-    var d = new Date;
250
-    var pfx;
251
-
252
-    switch(chartPeriod) {
253
-        case 1:
254
-            pfx = "24hr_";
255
-            break;
256
-        case 2:
257
-            pfx = "4wk_";
258
-            break;
259
-       case 3:
260
-            pfx = "12m_";
261
-            break;
262
-    }
263
-    signalChart.src = "dynamic/" + pfx + "signal.png?ver=" + d.getTime();
264
-    snrChart.src = "dynamic/" + pfx + "snr.png?ver=" + d.getTime();
265
-}
266
-
267
-function displayData(dataItem) {
268
-    var timeStamp, date, time, hourminute;
269
-    var localDateObj,localTimeZone;
270
-
271
-    timeStamp = dataItem.date;
272
-    date = timeStamp.split(" ")[0];
273
-    time = timeStamp.split(" ")[1];
274
-    hourminute = time.split(":")[0] + ":" + time.split(":")[1];
275
-    localDate = new Date();
276
-    localTimeZone = localDate.getTimezoneOffset() / 60;
277
-    dateElmt.innerHTML = date;    
278
-    timeElmt.innerHTML = hourminute +
279
-                         "  <small>(GMT+" + localTimeZone + ")</small>";    
280
-     
281
-    statusElmt.innerHTML = "Online";
282
-    statusElmt.style.color = "green";
283
-
284
-    chartRefreshRate = dataItem.period;
285
-    periodElmt.innerHTML = chartRefreshRate;
286
-    setInterval(getNodeData, 60000 * chartRefreshRate);
287
-    setInterval(getNodeCharts, 60000 * chartRefreshRate);
288
-}
289
-
290
-function displayOfflineStatus() {
291
-    var d = new Date();
292
-    localTimeZone = d.getTimezoneOffset() / 60;
293
-    dateElmt.innerHTML = (d.getMonth() + 1) + "/" + d.getDate() + "/" +
294
-                          d.getFullYear();    
295
-    timeElmt.innerHTML = d.getHours() + ":" + d.getMinutes() +
296
-                         "  <small>(GMT+" + localTimeZone + ")</small>";
297
-    periodElmt.innerHTML = "?";    
298
-    statusElmt.innerHTML = "offline";    
299
-    statusElmt.style.color = "red";
300
-}
301
-
302
-function initializeDateSelector() {
303
-    var d = new Date();
304
-
305
-    var dEnd = new Date(d.getFullYear(),
306
-               d.getMonth(), d.getDate() - 0);
307
-
308
-    var dBegin = new Date(d.getFullYear(),
309
-               d.getMonth(), d.getDate() - 1);
310
-
311
-    document.getElementById("beginDate").valueAsDate = dBegin;
312
-    document.getElementById("endDate").valueAsDate = dEnd;
313
-}
314
-
315
-function getCustomCharts() {
316
-    fmDateSelector.submit();
317
-}
318
-</script>
319
-
320
-</body>
321
-</html>
322
-
Browse code

support for Aredn firmware version 3.20.3.0

gandolf authored on 03/31/2020 18:07:19
Showing 1 changed files
1 1
new file mode 100644
... ...
@@ -0,0 +1,323 @@
1
+<!DOCTYPE html>
2
+<!-- Courtesy ruler for editing this file
3
+12345678901234567890123456789012345678901234567890123456789012345678901234567890
4
+-->
5
+<html>
6
+<head>
7
+<title>Node Signal</title>
8
+<meta charset="UTF-8">
9
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
10
+<style>
11
+body {
12
+    background-image: url("static/chalk.jpg");
13
+}
14
+h2 {
15
+    font: bold 24px arial, sans-serif;
16
+}
17
+h3 {
18
+    font: bold 18px arial, sans-serif;
19
+}
20
+h4 {
21
+    font: bold 16px arial, sans-serif;
22
+}
23
+.mainContainer {
24
+    width: 750px;
25
+    text-align: center;
26
+    margin: auto;
27
+    /*border: 1px solid black;*/
28
+}
29
+.datetime {
30
+    font: bold 22px arial, sans-serif;
31
+    padding: 0px;
32
+}
33
+.rowContainer {
34
+    display: table;
35
+    width: 100%;
36
+}
37
+.currentDataCell {
38
+    width: 50%;
39
+    padding: 10px;
40
+    font: bold 20px arial, sans-serif;
41
+    text-align: center;
42
+    display: table-cell;
43
+    vertical-align: middle;
44
+}
45
+.dataItems {
46
+    padding: 2px;
47
+    text-align: left;
48
+    line-height: 130%;
49
+    display: inline-block;
50
+    vertical-align: middle;
51
+}
52
+.chartContainer {
53
+    padding: 2px;
54
+}
55
+img.chart {
56
+    width:100%;
57
+}
58
+.notes {
59
+    font: 17px arial, sans-serif;
60
+    text-align: left;
61
+    padding: 10px;
62
+}
63
+span.chartSelector {
64
+    margin: auto;
65
+}
66
+ul.selectorElement {
67
+    list-style-type: none;
68
+    margin: 10px;
69
+    padding: 0;
70
+    overflow: hidden;
71
+    background-color: #bbb;
72
+    text-align: center;
73
+}
74
+li.selectorElement {
75
+    display: inline-block;
76
+    font: bold 18px arial, sans-serif;
77
+    color: black;
78
+}
79
+span.selectorElement:hover {
80
+    background-color: #333;
81
+    cursor: pointer;
82
+    color: white;
83
+}
84
+span.selectorElement {
85
+    display: inline-block;
86
+    padding: 8px 12px;
87
+}
88
+#iframe_a {
89
+    border:none;
90
+    width:100%;
91
+    height:450px;
92
+}
93
+</style>
94
+</head>
95
+
96
+<body onload="main()">
97
+
98
+<div class="mainContainer">
99
+<h2><a href="https://github.com/fractalxaos/ham/tree/master/arednsig" 
100
+  style="text-decoration:none" target="_new">
101
+KA7JLO AREDN<sup>&#174;</sup> Node Signal</a></h2>
102
+<h3>Last Updated</h3>
103
+<div class="datetime">
104
+<span id="date"></span>
105
+&nbsp;&nbsp;
106
+<span id="time"></span>
107
+</div>
108
+
109
+<div class="rowContainer">
110
+<div class="currentDataCell">
111
+<div class="dataItems" style="text-align: center;">
112
+Status: <span id="status"></span><br>
113
+Data updates every: <span id="period"></span> minutes
114
+</div>
115
+
116
+</div>
117
+</div>
118
+
119
+<span class="chartSelectors">
120
+<ul class="selectorElement">
121
+<li class="selectorElement">Select charts:</li>
122
+<li class="selectorElement"><span class="selectorElement"
123
+ onclick="setChartPeriod(1)">24 hours</span></li>
124
+<li class="selectorElement"><span class="selectorElement"
125
+ onclick="setChartPeriod(2)">4 weeks</span></li>
126
+<li class="selectorElement"><span class="selectorElement"
127
+ onclick="setChartPeriod(3)">12 months</span></li>
128
+<li class="selectorElement"><span class="selectorElement"
129
+ onclick="setChartPeriod(0)">Custom…</span></li>
130
+</ul>
131
+</span>
132
+
133
+<div class="rowContainer" id="customChartsContainer" style="display:none;">
134
+<div class="currentDataCell">
135
+<form id="fmDateSelector" action="arednsig.php" method="post"
136
+ target="iframe_a">
137
+<label for="beginDate">Begin Date: </label>
138
+<input id="beginDate" name="beginDate" type="date" value="mm/dd/yyyy" />
139
+<label for="endDate">End Date: </label>
140
+<input id="endDate" name="endDate" type="date" value="mm/dd/yyyy" />
141
+<br><br>
142
+<input type="button" onclick="getCustomCharts()" value="Get Charts">
143
+</form>
144
+<span id="errorMsg"></span><br>
145
+<iframe id="iframe_a" name="iframe_a"></iframe>
146
+</div>
147
+</div>
148
+
149
+<br>
150
+
151
+<div class="rowContainer" id="stockChartsContainer">
152
+<div class="chartContainer">
153
+<img class="chart" id="signalChart">
154
+</div>
155
+<div class="chartContainer">
156
+<img class="chart" id="snrChart">
157
+</div>
158
+</div>
159
+
160
+<div class="notes">
161
+<b>NOTES:</b>
162
+<ul>
163
+<li>Aredn Node Signal software available at
164
+<a href="https://github.com/fractalxaos/ham/tree/master/arednsig"
165
+ target="_new">
166
+<i>Github.com</i></a>.</li>
167
+<li>Project sponsored by 
168
+<a href="https://willamettevalleymesh.net" TARGET="_NEW">
169
+<i>Willamette Valley Mesh Network</i></a>, Salem, Oregon.</li>
170
+<li>For more information about the amateur radio emergency
171
+ data network (AREDN) see official web site at
172
+ <a href="http://www.arednmesh.org" target="_blank">
173
+www.arednmesh.org</a>.</li>
174
+</ul>
175
+</div>
176
+</div>
177
+<br>
178
+
179
+<script>
180
+
181
+/* Global constants */
182
+
183
+var nodeDataUrl = "dynamic/nodeOnline.js";
184
+
185
+/* Global DOM objects */
186
+
187
+// Chart elements
188
+var signalChart = document.getElementById("signalChart");
189
+var snrChart = document.getElementById("snrChart");
190
+
191
+// Text elements
192
+var dateElmt = document.getElementById("date");    
193
+var timeElmt = document.getElementById("time"); 
194
+var statusElmt = document.getElementById("status");
195
+var periodElmt = document.getElementById("period");
196
+
197
+// Document elements
198
+var customChartsContainer = document.getElementById("customChartsContainer");
199
+var stockChartsContainer = document.getElementById("stockChartsContainer");
200
+var fmDateSelector = document.getElementById("fmDateSelector");
201
+var errorMsg = document.getElementById("errorMsg");
202
+
203
+/* Global objects */
204
+
205
+var httpRequest = new XMLHttpRequest();
206
+
207
+/* Global variables */
208
+
209
+var chartPeriod = 1;
210
+var chartRefreshRate = 0; // chart refresh rate in minutes
211
+
212
+function main() {
213
+    /* Register call back function to process http requests */
214
+    httpRequest.onreadystatechange = function() {
215
+        if (httpRequest.readyState == 4 && httpRequest.status == 200) {
216
+            var dataArray = JSON.parse(httpRequest.responseText);
217
+            displayData(dataArray[0]);
218
+        } else if (httpRequest.readyState == 4 && httpRequest.status == 404) {
219
+            displayOfflineStatus();
220
+        }
221
+    };
222
+    httpRequest.ontimeout = function(e) {
223
+        displayOfflineStatus();
224
+    };
225
+
226
+    initializeDateSelector();
227
+    getNodeData();
228
+    getNodeCharts();
229
+}
230
+
231
+function getNodeData() {
232
+    httpRequest.open("GET", nodeDataUrl, true);
233
+    httpRequest.timeout = 3000;
234
+    httpRequest.send();
235
+}
236
+
237
+function setChartPeriod(n) {
238
+    chartPeriod = n;
239
+    if (n == 0) {
240
+        customChartsContainer.style.display = "block";
241
+        stockChartsContainer.style.display = "none";
242
+    } else {
243
+        customChartsContainer.style.display = "none";
244
+        stockChartsContainer.style.display = "block";
245
+    getNodeCharts();   
246
+    }
247
+}
248
+
249
+function getNodeCharts() {
250
+    var d = new Date;
251
+    var pfx;
252
+
253
+    switch(chartPeriod) {
254
+        case 1:
255
+            pfx = "24hr_";
256
+            break;
257
+        case 2:
258
+            pfx = "4wk_";
259
+            break;
260
+       case 3:
261
+            pfx = "12m_";
262
+            break;
263
+    }
264
+    signalChart.src = "dynamic/" + pfx + "signal.png?ver=" + d.getTime();
265
+    snrChart.src = "dynamic/" + pfx + "snr.png?ver=" + d.getTime();
266
+}
267
+
268
+function displayData(dataItem) {
269
+    var timeStamp, date, time, hourminute;
270
+    var localDateObj,localTimeZone;
271
+
272
+    timeStamp = dataItem.date;
273
+    date = timeStamp.split(" ")[0];
274
+    time = timeStamp.split(" ")[1];
275
+    hourminute = time.split(":")[0] + ":" + time.split(":")[1];
276
+    localDate = new Date();
277
+    localTimeZone = localDate.getTimezoneOffset() / 60;
278
+    dateElmt.innerHTML = date;    
279
+    timeElmt.innerHTML = hourminute +
280
+                         "  <small>(GMT+" + localTimeZone + ")</small>";    
281
+     
282
+    statusElmt.innerHTML = "Online";
283
+    statusElmt.style.color = "green";
284
+
285
+    chartRefreshRate = dataItem.period;
286
+    periodElmt.innerHTML = chartRefreshRate;
287
+    setInterval(getNodeData, 60000 * chartRefreshRate);
288
+    setInterval(getNodeCharts, 60000 * chartRefreshRate);
289
+}
290
+
291
+function displayOfflineStatus() {
292
+    var d = new Date();
293
+    localTimeZone = d.getTimezoneOffset() / 60;
294
+    dateElmt.innerHTML = (d.getMonth() + 1) + "/" + d.getDate() + "/" +
295
+                          d.getFullYear();    
296
+    timeElmt.innerHTML = d.getHours() + ":" + d.getMinutes() +
297
+                         "  <small>(GMT+" + localTimeZone + ")</small>";
298
+    periodElmt.innerHTML = "?";    
299
+    statusElmt.innerHTML = "offline";    
300
+    statusElmt.style.color = "red";
301
+}
302
+
303
+function initializeDateSelector() {
304
+    var d = new Date();
305
+
306
+    var dEnd = new Date(d.getFullYear(),
307
+               d.getMonth(), d.getDate() - 0);
308
+
309
+    var dBegin = new Date(d.getFullYear(),
310
+               d.getMonth(), d.getDate() - 1);
311
+
312
+    document.getElementById("beginDate").valueAsDate = dBegin;
313
+    document.getElementById("endDate").valueAsDate = dEnd;
314
+}
315
+
316
+function getCustomCharts() {
317
+    fmDateSelector.submit();
318
+}
319
+</script>
320
+
321
+</body>
322
+</html>
323
+
Browse code

fix version numbers

gandolf authored on 03/31/2020 18:04:12
Showing 1 changed files
1 1
deleted file mode 100644
... ...
@@ -1,323 +0,0 @@
1
-<!DOCTYPE html>
2
-<!-- Courtesy ruler for editing this file
3
-12345678901234567890123456789012345678901234567890123456789012345678901234567890
4
-<html>
5
-<head>
6
-<title>Node Signal</title>
7
-<meta charset="UTF-8">
8
-<meta name="viewport" content="width=device-width, initial-scale=1.0">
9
-<style>
10
-body {
11
-    background-image: url("static/chalk.jpg");
12
-}
13
-h2 {
14
-    font: bold 24px arial, sans-serif;
15
-}
16
-h3 {
17
-    font: bold 18px arial, sans-serif;
18
-}
19
-h4 {
20
-    font: bold 16px arial, sans-serif;
21
-}
22
-.mainContainer {
23
-    width: 750px;
24
-    text-align: center;
25
-    margin: auto;
26
-    /*border: 1px solid black;*/
27
-}
28
-.datetime {
29
-    font: bold 22px arial, sans-serif;
30
-    padding: 0px;
31
-}
32
-.rowContainer {
33
-    display: table;
34
-    width: 100%;
35
-}
36
-.currentDataCell {
37
-    width: 50%;
38
-    padding: 10px;
39
-    font: bold 20px arial, sans-serif;
40
-    text-align: center;
41
-    display: table-cell;
42
-    vertical-align: middle;
43
-}
44
-.dataItems {
45
-    padding: 2px;
46
-    text-align: left;
47
-    line-height: 130%;
48
-    display: inline-block;
49
-    vertical-align: middle;
50
-}
51
-.chartContainer {
52
-    padding: 2px;
53
-}
54
-img.chart {
55
-    width:100%;
56
-}
57
-.notes {
58
-    font: 17px arial, sans-serif;
59
-    text-align: left;
60
-    padding: 10px;
61
-}
62
-span.chartSelector {
63
-    margin: auto;
64
-}
65
-ul.selectorElement {
66
-    list-style-type: none;
67
-    margin: 10px;
68
-    padding: 0;
69
-    overflow: hidden;
70
-    background-color: #bbb;
71
-    text-align: center;
72
-}
73
-li.selectorElement {
74
-    display: inline-block;
75
-    font: bold 18px arial, sans-serif;
76
-    color: black;
77
-}
78
-span.selectorElement:hover {
79
-    background-color: #333;
80
-    cursor: pointer;
81
-    color: white;
82
-}
83
-span.selectorElement {
84
-    display: inline-block;
85
-    padding: 8px 12px;
86
-}
87
-#iframe_a {
88
-    border:none;
89
-    width:100%;
90
-    height:450px;
91
-}
92
-</style>
93
-</head>
94
-
95
-<body onload="main()">
96
-
97
-<div class="mainContainer">
98
-<h2><a href="https://github.com/fractalxaos/ham/tree/master/arednsig" 
99
-  style="text-decoration:none" target="_new">
100
-KA7JLO AREDN<sup>&#174;</sup> Node Signal</a></h2>
101
-<h3>Last Updated</h3>
102
-<div class="datetime">
103
-<span id="date"></span>
104
-&nbsp;&nbsp;
105
-<span id="time"></span>
106
-</div>
107
-
108
-<div class="rowContainer">
109
-<div class="currentDataCell">
110
-<div class="dataItems" style="text-align: center;">
111
-Status: <span id="status"></span><br>
112
-Data updates every: <span id="period"></span> minutes
113
-</div>
114
-
115
-</div>
116
-</div>
117
-
118
-<span class="chartSelectors">
119
-<ul class="selectorElement">
120
-<li class="selectorElement">Select charts:</li>
121
-<li class="selectorElement"><span class="selectorElement"
122
- onclick="setChartPeriod(1)">24 hours</span></li>
123
-<li class="selectorElement"><span class="selectorElement"
124
- onclick="setChartPeriod(2)">4 weeks</span></li>
125
-<li class="selectorElement"><span class="selectorElement"
126
- onclick="setChartPeriod(3)">12 months</span></li>
127
-<li class="selectorElement"><span class="selectorElement"
128
- onclick="setChartPeriod(0)">Custom…</span></li>
129
-</ul>
130
-</span>
131
-
132
-<div class="rowContainer" id="customChartsContainer" style="display:none;">
133
-<div class="currentDataCell">
134
-<form id="fmDateSelector" action="arednsig.php" method="post"
135
- target="iframe_a">
136
-<label for="beginDate">Begin Date: </label>
137
-<input id="beginDate" name="beginDate" type="date" value="mm/dd/yyyy" />
138
-<label for="endDate">End Date: </label>
139
-<input id="endDate" name="endDate" type="date" value="mm/dd/yyyy" />
140
-<br><br>
141
-<input type="button" onclick="getCustomCharts()" value="Get Charts">
142
-</form>
143
-<span id="errorMsg"></span><br>
144
-<iframe id="iframe_a" name="iframe_a"></iframe>
145
-</div>
146
-</div>
147
-
148
-<br>
149
-
150
-<div class="rowContainer" id="stockChartsContainer">
151
-<div class="chartContainer">
152
-<img class="chart" id="signalChart">
153
-</div>
154
-<div class="chartContainer">
155
-<img class="chart" id="snrChart">
156
-</div>
157
-</div>
158
-
159
-<div class="notes">
160
-<b>NOTES:</b>
161
-<ul>
162
-<li>Aredn Node Signal software available at
163
-<a href="https://github.com/fractalxaos/ham/tree/master/arednsig"
164
- target="_new">
165
-<i>Github.com</i></a>.</li>
166
-<li>Project sponsored by 
167
-<a href="https://willamettevalleymesh.net" TARGET="_NEW">
168
-<i>Willamette Valley Mesh Network</i></a>, Salem, Oregon.</li>
169
-<li>For more information about the amateur radio emergency
170
- data network (AREDN) see official web site at
171
- <a href="http://www.arednmesh.org" target="_blank">
172
-www.arednmesh.org</a>.</li>
173
-</ul>
174
-</div>
175
-</div>
176
-<br>
177
-
178
-<script>
179
-
180
-/* Global constants */
181
-
182
-var nodeDataUrl = "dynamic/nodeOnline.js";
183
-
184
-/* Global DOM objects */
185
-
186
-// Chart elements
187
-var signalChart = document.getElementById("signalChart");
188
-var snrChart = document.getElementById("snrChart");
189
-
190
-// Text elements
191
-var dateElmt = document.getElementById("date");    
192
-var timeElmt = document.getElementById("time"); 
193
-var statusElmt = document.getElementById("status");
194
-var periodElmt = document.getElementById("period");
195
-
196
-// Document elements
197
-var customChartsContainer = document.getElementById("customChartsContainer");
198
-var stockChartsContainer = document.getElementById("stockChartsContainer");
199
-var fmDateSelector = document.getElementById("fmDateSelector");
200
-var errorMsg = document.getElementById("errorMsg");
201
-
202
-/* Global objects */
203
-
204
-var httpRequest = new XMLHttpRequest();
205
-
206
-/* Global variables */
207
-
208
-var chartPeriod = 1;
209
-var chartRefreshRate = 0; // chart refresh rate in minutes
210
-
211
-function main() {
212
-    /* Register call back function to process http requests */
213
-    httpRequest.onreadystatechange = function() {
214
-        if (httpRequest.readyState == 4 && httpRequest.status == 200) {
215
-            var dataArray = JSON.parse(httpRequest.responseText);
216
-            displayData(dataArray[0]);
217
-        } else if (httpRequest.readyState == 4 && httpRequest.status == 404) {
218
-            displayOfflineStatus();
219
-        }
220
-    };
221
-    httpRequest.ontimeout = function(e) {
222
-        displayOfflineStatus();
223
-    };
224
-
225
-    initializeDateSelector();
226
-    getNodeData();
227
-    getNodeCharts();
228
-}
229
-
230
-function getNodeData() {
231
-    httpRequest.open("GET", nodeDataUrl, true);
232
-    httpRequest.timeout = 3000;
233
-    httpRequest.send();
234
-}
235
-
236
-function setChartPeriod(n) {
237
-    chartPeriod = n;
238
-    if (n == 0) {
239
-        customChartsContainer.style.display = "block";
240
-        stockChartsContainer.style.display = "none";
241
-    } else {
242
-        customChartsContainer.style.display = "none";
243
-        stockChartsContainer.style.display = "block";
244
-    getNodeCharts();   
245
-    }
246
-}
247
-
248
-function getNodeCharts() {
249
-    var d = new Date;
250
-    var pfx;
251
-
252
-    switch(chartPeriod) {
253
-        case 1:
254
-            pfx = "24hr_";
255
-            break;
256
-        case 2:
257
-            pfx = "4wk_";
258
-            break;
259
-       case 3:
260
-            pfx = "12m_";
261
-            break;
262
-    }
263
-    signalChart.src = "dynamic/" + pfx + "signal.png?ver=" + d.getTime();
264
-    snrChart.src = "dynamic/" + pfx + "snr.png?ver=" + d.getTime();
265
-}
266
-
267
-function displayData(dataItem) {
268
-    var timeStamp, date, time, hourminute;
269
-    var localDateObj,localTimeZone;
270
-
271
-    timeStamp = dataItem.date;
272
-    date = timeStamp.split(" ")[0];
273
-    time = timeStamp.split(" ")[1];
274
-    hourminute = time.split(":")[0] + ":" + time.split(":")[1];
275
-    localDate = new Date();
276
-    localTimeZone = localDate.getTimezoneOffset() / 60;
277
-    dateElmt.innerHTML = date;    
278
-    timeElmt.innerHTML = hourminute +
279
-                         "  <small>(GMT+" + localTimeZone + ")</small>";    
280
-     
281
-    statusElmt.innerHTML = "Online";
282
-    statusElmt.style.color = "green";
283
-
284
-    chartRefreshRate = dataItem.period;
285
-    periodElmt.innerHTML = chartRefreshRate;
286
-    setInterval(getNodeData, 60000 * chartRefreshRate);
287
-    setInterval(getNodeCharts, 60000 * chartRefreshRate);
288
-}
289
-
290
-function displayOfflineStatus() {
291
-    var d = new Date();
292
-    localTimeZone = d.getTimezoneOffset() / 60;
293
-    dateElmt.innerHTML = (d.getMonth() + 1) + "/" + d.getDate() + "/" +
294
-                          d.getFullYear();    
295
-    timeElmt.innerHTML = d.getHours() + ":" + d.getMinutes() +
296
-                         "  <small>(GMT+" + localTimeZone + ")</small>";
297
-    periodElmt.innerHTML = "?";    
298
-    statusElmt.innerHTML = "offline";    
299
-    statusElmt.style.color = "red";
300
-}
301
-
302
-function initializeDateSelector() {
303
-    var d = new Date();
304
-
305
-    var dEnd = new Date(d.getFullYear(),
306
-               d.getMonth(), d.getDate() - 0);
307
-
308
-    var dBegin = new Date(d.getFullYear(),
309
-               d.getMonth(), d.getDate() - 1);
310
-
311
-    document.getElementById("beginDate").valueAsDate = dBegin;
312
-    document.getElementById("endDate").valueAsDate = dEnd;
313
-}
314
-
315
-function getCustomCharts() {
316
-    fmDateSelector.submit();
317
-}
318
-</script>
319
-
320
-</body>
321
-</html>
322
-
Browse code

support for Aredn FW v3.19.3.0

gandolf authored on 03/31/2020 17:38:41
Showing 1 changed files
1 1
new file mode 100644
... ...
@@ -0,0 +1,323 @@
1
+<!DOCTYPE html>
2
+<!-- Courtesy ruler for editing this file
3
+12345678901234567890123456789012345678901234567890123456789012345678901234567890
4
+-->
5
+<html>
6
+<head>
7
+<title>Node Signal</title>
8
+<meta charset="UTF-8">
9
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
10
+<style>
11
+body {
12
+    background-image: url("static/chalk.jpg");
13
+}
14
+h2 {
15
+    font: bold 24px arial, sans-serif;
16
+}
17
+h3 {
18
+    font: bold 18px arial, sans-serif;
19
+}
20
+h4 {
21
+    font: bold 16px arial, sans-serif;
22
+}
23
+.mainContainer {
24
+    width: 750px;
25
+    text-align: center;
26
+    margin: auto;
27
+    /*border: 1px solid black;*/
28
+}
29
+.datetime {
30
+    font: bold 22px arial, sans-serif;
31
+    padding: 0px;
32
+}
33
+.rowContainer {
34
+    display: table;
35
+    width: 100%;
36
+}
37
+.currentDataCell {
38
+    width: 50%;
39
+    padding: 10px;
40
+    font: bold 20px arial, sans-serif;
41
+    text-align: center;
42
+    display: table-cell;
43
+    vertical-align: middle;
44
+}
45
+.dataItems {
46
+    padding: 2px;
47
+    text-align: left;
48
+    line-height: 130%;
49
+    display: inline-block;
50
+    vertical-align: middle;
51
+}
52
+.chartContainer {
53
+    padding: 2px;
54
+}
55
+img.chart {
56
+    width:100%;
57
+}
58
+.notes {
59
+    font: 17px arial, sans-serif;
60
+    text-align: left;
61
+    padding: 10px;
62
+}
63
+span.chartSelector {
64
+    margin: auto;
65
+}
66
+ul.selectorElement {
67
+    list-style-type: none;
68
+    margin: 10px;
69
+    padding: 0;
70
+    overflow: hidden;
71
+    background-color: #bbb;
72
+    text-align: center;
73
+}
74
+li.selectorElement {
75
+    display: inline-block;
76
+    font: bold 18px arial, sans-serif;
77
+    color: black;
78
+}
79
+span.selectorElement:hover {
80
+    background-color: #333;
81
+    cursor: pointer;
82
+    color: white;
83
+}
84
+span.selectorElement {
85
+    display: inline-block;
86
+    padding: 8px 12px;
87
+}
88
+#iframe_a {
89
+    border:none;
90
+    width:100%;
91
+    height:450px;
92
+}
93
+</style>
94
+</head>
95
+
96
+<body onload="main()">
97
+
98
+<div class="mainContainer">
99
+<h2><a href="https://github.com/fractalxaos/ham/tree/master/arednsig" 
100
+  style="text-decoration:none" target="_new">
101
+KA7JLO AREDN<sup>&#174;</sup> Node Signal</a></h2>
102
+<h3>Last Updated</h3>
103
+<div class="datetime">
104
+<span id="date"></span>
105
+&nbsp;&nbsp;
106
+<span id="time"></span>
107
+</div>
108
+
109
+<div class="rowContainer">
110
+<div class="currentDataCell">
111
+<div class="dataItems" style="text-align: center;">
112
+Status: <span id="status"></span><br>
113
+Data updates every: <span id="period"></span> minutes
114
+</div>
115
+
116
+</div>
117
+</div>
118
+
119
+<span class="chartSelectors">
120
+<ul class="selectorElement">
121
+<li class="selectorElement">Select charts:</li>
122
+<li class="selectorElement"><span class="selectorElement"
123
+ onclick="setChartPeriod(1)">24 hours</span></li>
124
+<li class="selectorElement"><span class="selectorElement"
125
+ onclick="setChartPeriod(2)">4 weeks</span></li>
126
+<li class="selectorElement"><span class="selectorElement"
127
+ onclick="setChartPeriod(3)">12 months</span></li>
128
+<li class="selectorElement"><span class="selectorElement"
129
+ onclick="setChartPeriod(0)">Custom…</span></li>
130
+</ul>
131
+</span>
132
+
133
+<div class="rowContainer" id="customChartsContainer" style="display:none;">
134
+<div class="currentDataCell">
135
+<form id="fmDateSelector" action="arednsig.php" method="post"
136
+ target="iframe_a">
137
+<label for="beginDate">Begin Date: </label>
138
+<input id="beginDate" name="beginDate" type="date" value="mm/dd/yyyy" />
139
+<label for="endDate">End Date: </label>
140
+<input id="endDate" name="endDate" type="date" value="mm/dd/yyyy" />
141
+<br><br>
142
+<input type="button" onclick="getCustomCharts()" value="Get Charts">
143
+</form>
144
+<span id="errorMsg"></span><br>
145
+<iframe id="iframe_a" name="iframe_a"></iframe>
146
+</div>
147
+</div>
148
+
149
+<br>
150
+
151
+<div class="rowContainer" id="stockChartsContainer">
152
+<div class="chartContainer">
153
+<img class="chart" id="signalChart">
154
+</div>
155
+<div class="chartContainer">
156
+<img class="chart" id="snrChart">
157
+</div>
158
+</div>
159
+
160
+<div class="notes">
161
+<b>NOTES:</b>
162
+<ul>
163
+<li>Aredn Node Signal software available at
164
+<a href="https://github.com/fractalxaos/ham/tree/master/arednsig"
165
+ target="_new">
166
+<i>Github.com</i></a>.</li>
167
+<li>Project sponsored by 
168
+<a href="https://willamettevalleymesh.net" TARGET="_NEW">
169
+<i>Willamette Valley Mesh Network</i></a>, Salem, Oregon.</li>
170
+<li>For more information about the amateur radio emergency
171
+ data network (AREDN) see official web site at
172
+ <a href="http://www.arednmesh.org" target="_blank">
173
+www.arednmesh.org</a>.</li>
174
+</ul>
175
+</div>
176
+</div>
177
+<br>
178
+
179
+<script>
180
+
181
+/* Global constants */
182
+
183
+var nodeDataUrl = "dynamic/nodeOnline.js";
184
+
185
+/* Global DOM objects */
186
+
187
+// Chart elements
188
+var signalChart = document.getElementById("signalChart");
189
+var snrChart = document.getElementById("snrChart");
190
+
191
+// Text elements
192
+var dateElmt = document.getElementById("date");    
193
+var timeElmt = document.getElementById("time"); 
194
+var statusElmt = document.getElementById("status");
195
+var periodElmt = document.getElementById("period");
196
+
197
+// Document elements
198
+var customChartsContainer = document.getElementById("customChartsContainer");
199
+var stockChartsContainer = document.getElementById("stockChartsContainer");
200
+var fmDateSelector = document.getElementById("fmDateSelector");
201
+var errorMsg = document.getElementById("errorMsg");
202
+
203
+/* Global objects */
204
+
205
+var httpRequest = new XMLHttpRequest();
206
+
207
+/* Global variables */
208
+
209
+var chartPeriod = 1;
210
+var chartRefreshRate = 0; // chart refresh rate in minutes
211
+
212
+function main() {
213
+    /* Register call back function to process http requests */
214
+    httpRequest.onreadystatechange = function() {
215
+        if (httpRequest.readyState == 4 && httpRequest.status == 200) {
216
+            var dataArray = JSON.parse(httpRequest.responseText);
217
+            displayData(dataArray[0]);
218
+        } else if (httpRequest.readyState == 4 && httpRequest.status == 404) {
219
+            displayOfflineStatus();
220
+        }
221
+    };
222
+    httpRequest.ontimeout = function(e) {
223
+        displayOfflineStatus();
224
+    };
225
+
226
+    initializeDateSelector();
227
+    getNodeData();
228
+    getNodeCharts();
229
+}
230
+
231
+function getNodeData() {
232
+    httpRequest.open("GET", nodeDataUrl, true);
233
+    httpRequest.timeout = 3000;
234
+    httpRequest.send();
235
+}
236
+
237
+function setChartPeriod(n) {
238
+    chartPeriod = n;
239
+    if (n == 0) {
240
+        customChartsContainer.style.display = "block";
241
+        stockChartsContainer.style.display = "none";
242
+    } else {
243
+        customChartsContainer.style.display = "none";
244
+        stockChartsContainer.style.display = "block";
245
+    getNodeCharts();   
246
+    }
247
+}
248
+
249
+function getNodeCharts() {
250
+    var d = new Date;
251
+    var pfx;
252
+
253
+    switch(chartPeriod) {
254
+        case 1:
255
+            pfx = "24hr_";
256
+            break;
257
+        case 2:
258
+            pfx = "4wk_";
259
+            break;
260
+       case 3:
261
+            pfx = "12m_";
262
+            break;
263
+    }
264
+    signalChart.src = "dynamic/" + pfx + "signal.png?ver=" + d.getTime();
265
+    snrChart.src = "dynamic/" + pfx + "snr.png?ver=" + d.getTime();
266
+}
267
+
268
+function displayData(dataItem) {
269
+    var timeStamp, date, time, hourminute;
270
+    var localDateObj,localTimeZone;
271
+
272
+    timeStamp = dataItem.date;
273
+    date = timeStamp.split(" ")[0];
274
+    time = timeStamp.split(" ")[1];
275
+    hourminute = time.split(":")[0] + ":" + time.split(":")[1];
276
+    localDate = new Date();
277
+    localTimeZone = localDate.getTimezoneOffset() / 60;
278
+    dateElmt.innerHTML = date;    
279
+    timeElmt.innerHTML = hourminute +
280
+                         "  <small>(GMT+" + localTimeZone + ")</small>";    
281
+     
282
+    statusElmt.innerHTML = "Online";
283
+    statusElmt.style.color = "green";
284
+
285
+    chartRefreshRate = dataItem.period;
286
+    periodElmt.innerHTML = chartRefreshRate;
287
+    setInterval(getNodeData, 60000 * chartRefreshRate);
288
+    setInterval(getNodeCharts, 60000 * chartRefreshRate);
289
+}
290
+
291
+function displayOfflineStatus() {
292
+    var d = new Date();
293
+    localTimeZone = d.getTimezoneOffset() / 60;
294
+    dateElmt.innerHTML = (d.getMonth() + 1) + "/" + d.getDate() + "/" +
295
+                          d.getFullYear();    
296
+    timeElmt.innerHTML = d.getHours() + ":" + d.getMinutes() +
297
+                         "  <small>(GMT+" + localTimeZone + ")</small>";
298
+    periodElmt.innerHTML = "?";    
299
+    statusElmt.innerHTML = "offline";    
300
+    statusElmt.style.color = "red";
301
+}
302
+
303
+function initializeDateSelector() {
304
+    var d = new Date();
305
+
306
+    var dEnd = new Date(d.getFullYear(),
307
+               d.getMonth(), d.getDate() - 0);
308
+
309
+    var dBegin = new Date(d.getFullYear(),
310
+               d.getMonth(), d.getDate() - 1);
311
+
312
+    document.getElementById("beginDate").valueAsDate = dBegin;
313
+    document.getElementById("endDate").valueAsDate = dEnd;
314
+}
315
+
316
+function getCustomCharts() {
317
+    fmDateSelector.submit();
318
+}
319
+</script>
320
+
321
+</body>
322
+</html>
323
+