more fallback fixes

This commit is contained in:
Sören Oesterwind 2022-03-10 20:55:23 +01:00
parent 4156786b27
commit c0cfc04fef
5 changed files with 86 additions and 30 deletions

View File

@ -44,15 +44,13 @@ currentState = {
textColors: {}, textColors: {},
srvTime: 0, srvTime: 0,
enableColoredText: true, enableColoredText: true,
debug: false debug: false,
sessionToken: Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15),
}; };
const dataToBeWritten = {}; const dataToBeWritten = {};
currentState = Object.assign({}, currentState, loadedData); currentState = Object.assign({}, currentState, loadedData);
console.log(currentState)
currentState.textColors = currentState.colorSegments currentState.textColors = currentState.colorSegments
@ -80,7 +78,7 @@ function updatedData() {
currentState.srvTime = new Date().getTime() currentState.srvTime = new Date().getTime()
wsServer.broadcast(JSON.stringify(currentState)); wsServer.broadcast(JSON.stringify(currentState));
clearTimeout(updatey); clearTimeout(updatey);
setTimeout(updatedData, 5000); setTimeout(updatedData, 5000 );
} }
console.log("Preparing routes..."); console.log("Preparing routes...");
@ -105,6 +103,26 @@ app.get("/api/v1/data", function (req, res) {
res.json(currentState); res.json(currentState);
}); });
app.get("/api/v1/system", function (req, res) {
const systemData = {
uptime: process.uptime(),
memoryUsage: process.memoryUsage(),
cpuUsage: process.cpuUsage(),
platform: process.platform,
arch: process.arch,
nodeVersion: process.version,
nodePath: process.execPath,
nodeArgv: process.argv,
nodeExecArgv: process.execArgv,
nodeCwd: process.cwd(),
nodeEnv: process.env,
nodeConfig: process.config,
nodeTitle: process.title,
}
res.json(systemData);
});
app.get("/api/v1/set/mode", function (req, res) { app.get("/api/v1/set/mode", function (req, res) {
currentState.mode = req.query.mode; currentState.mode = req.query.mode;
updatedData() updatedData()

View File

@ -1,9 +1,10 @@
function convertTimeOffset(){ function convertTimeOffset() {
selTime = new Date().getTime() + document.getElementById('time2').valueAsNumber selTime = new Date().getTime() + document.getElementById('time2').valueAsNumber
document.getElementById("time").value = selTime document.getElementById("time").value = selTime
} }
function convertColorSegments(elementId) { function convertColorSegments(elementId) {
const raw = document.getElementById(elementId); const raw = document.getElementById(elementId);
console.log(raw) console.log(raw)
@ -36,6 +37,16 @@ $(document).ready(function () {
} }
} }
saveOption("/api/v1/system", function systemInfo(event) {
const dataSystem = JSON.parse(event.originalTarget.response)
document.getElementById("nodejsVers").innerHTML = dataSystem.nodeVersion
const tree2 = jsonview.create(dataSystem);
jsonview.render(tree2, document.getElementById("systemInfo"));
jsonview.expand(tree2);
// console.log(dataSystem)
})
$("#addRow").click(function (event) { $("#addRow").click(function (event) {
$("#colors1").append( $("#colors1").append(
'<tr>' + '<tr>' +
@ -45,7 +56,7 @@ $(document).ready(function () {
'</tr>' '</tr>'
); );
$('.colorPicky').colorpicker(); $('.colorPicky').colorpicker();
}); });
$("#addRow2").click(function (event) { $("#addRow2").click(function (event) {
@ -61,11 +72,11 @@ $(document).ready(function () {
$("#copyColors").click(function CopyTextColors(event) { $("#copyColors").click(function CopyTextColors(event) {
event.target.innerHTML = '<div class="spinner-border-sm spinner-border"></div>' event.target.innerHTML = '<div class="spinner-border-sm spinner-border"></div>'
saveOption("/api/v1/set/text/colors?copy=true", function finishCopyColors(event){ saveOption("/api/v1/set/text/colors?copy=true", function finishCopyColors(event) {
setTimeout(function(){ setTimeout(function () {
document.getElementById("copyColors").innerHTML = "Copy from progressbar colors" document.getElementById("copyColors").innerHTML = "Copy from progressbar colors"
}, 500) }, 500)
}) })
}); });
@ -96,7 +107,10 @@ $(document).ready(function () {
</td></tr>' </td></tr>'
const jsonResult = JSON.parse(xmlHttp.response) const jsonResult = JSON.parse(xmlHttp.response)
document.getElementById("responeSnippet").innerHTML = JSON.stringify(jsonResult) //.innerHTML = JSON.stringify(jsonResult, null, 4)
const tree = jsonview.create(jsonResult);
jsonview.render(tree, document.getElementById("responeSnippet"));
jsonview.expand(tree);
// Restore mode radio // Restore mode radio
const currentModeInt = modes.indexOf(jsonResult.mode); const currentModeInt = modes.indexOf(jsonResult.mode);
$("#btnradio" + (currentModeInt + 1))[0].checked = true $("#btnradio" + (currentModeInt + 1))[0].checked = true

1
static/js/jsonview.js Normal file

File diff suppressed because one or more lines are too long

View File

@ -6,7 +6,8 @@ websocketFailed = false
recoveryAttempts = 0; recoveryAttempts = 0;
let socket = new ReconnectingWebSocket("ws://localhost:" + location.port); let socket = new ReconnectingWebSocket("ws://localhost:" + location.port);
let ackdSessionToken = false
let isFirstPacket = true
socket.onopen = function (e) { socket.onopen = function (e) {
// alert("[open] Connection established"); // alert("[open] Connection established");
@ -16,8 +17,27 @@ socket.onopen = function (e) {
socket.onmessage = function (event) { socket.onmessage = function (event) {
// alert(`[message] Data received from server: ${event.data}`); // alert(`[message] Data received from server: ${event.data}`);
dataFame = JSON.parse(event.data); let inData = JSON.parse(event.data)
timeDiff = new Date().getTime() - dataFame.srvTime if (isFirstPacket) {
isFirstPacket = false
dataFame = JSON.parse(event.data);
timeDiff = new Date().getTime() - dataFame.srvTime
} else {
if (inData.sessionToken == dataFame.sessionToken) {
dataFame = JSON.parse(event.data);
timeDiff = new Date().getTime() - dataFame.srvTime
} else {
if (ackdSessionToken == false) {
ackdSessionToken = true
if (confirm("Session token mismatch, reload the page?")) {
location.reload();
}
}
}
}
}; };
socket.onclose = function (event) { socket.onclose = function (event) {
@ -49,7 +69,7 @@ socket.onclose = function (event) {
}; };
socket.onerror = function (error) { socket.onerror = function (error) {
alert(`[error] ${error.message}`); // alert(`[error] ${error.message}`);
}; };
allowFullscreen = true allowFullscreen = true
@ -154,17 +174,17 @@ function handleUpdate() {
if (!isSlowed) { if (!isSlowed) {
console.error("Server timeout") console.error("Server timeout")
clearInterval(updateInter) // clearInterval(updateInter)
updateInter = setInterval(handleUpdate, 900) // updateInter = setInterval(handleUpdate, 900)
document.getElementById("warningBanner").style.display = "block" document.getElementById("warningBanner").style.display = "block"
isSlowed = true isSlowed = true
recoInter = setInterval(handleRecovery, 10000) // recoInter = setInterval(handleRecovery, 10000)
} }
} else { } else {
if (isSlowed) { if (isSlowed) {
clearInterval(updateInter) //clearInterval(updateInter)
clearInterval(recoInter) //clearInterval(recoInter)
updateInter = setInterval(handleUpdate, 2) //updateInter = setInterval(handleUpdate, 2)
document.getElementById("warningBanner").style.display = "none" document.getElementById("warningBanner").style.display = "none"
isSlowed = false isSlowed = false
} }

View File

@ -342,7 +342,7 @@
<label for="progBarShow">Show progressbar:</label> <label for="progBarShow">Show progressbar:</label>
<input type="checkbox" name="progBarShow" id="progBarShow"><br> <input type="checkbox" name="progBarShow" id="progBarShow"><br>
<details> <details>
<summary>Progressbar Colors</summary> <summary>Progressbar Colors</summary>
<p> <p>
@ -357,7 +357,7 @@
<th class="text-center">Remove</th> <th class="text-center">Remove</th>
</tr> </tr>
</thead> </thead>
</tbody> </tbody>
</table> </table>
</div> </div>
@ -380,7 +380,7 @@
<th class="text-center">Remove</th> <th class="text-center">Remove</th>
</tr> </tr>
</thead> </thead>
</tbody> </tbody>
</table> </table>
</div> </div>
<button type="button" class="btn btn-outline-success" id="copyColors">Copy from progressbar <button type="button" class="btn btn-outline-success" id="copyColors">Copy from progressbar
@ -399,7 +399,7 @@
</page> </page>
<page id="debug" class="pageC hidden flex-fill"> <page id="debug" class="pageC hidden flex-fill overflow-auto">
<h1>Debug page</h1> <h1>Debug page</h1>
<div class="alert alert-warning" role="alert"> <div class="alert alert-warning" role="alert">
<h4 class="alert-heading">Attention</h4> <h4 class="alert-heading">Attention</h4>
@ -414,7 +414,7 @@
<button type="button" class="btn btn-outline-success" id="applyDebug">Apply settings</button> <button type="button" class="btn btn-outline-success" id="applyDebug">Apply settings</button>
<br><br> <br><br>
<h3>Raw server reponse</h3> <h3>Raw server reponse</h3>
<code id="responeSnippet" style="width: 40%; display: inline-block;"> <code id="responeSnippet" style="width: 40%; display: inline-block;" class="overflow-auto">
</code> </code>
@ -424,15 +424,18 @@
</div> </div>
</page> </page>
<page id="about" class="pageC hidden flex-fill"> <page id="about" class="pageC hidden flex-fill overflow-auto">
<h1>About</h1> <h1>About</h1>
Version: 1.0.0<br> Version: 1.0.0<br>
NodeJS Version: UNKNOWN<br> NodeJS Version: <i id="nodejsVers"></i><br>
Express Version: UNKNOWN<br> <code id="systemInfo" class="overflow-auto">
</code>
</page> </page>
</pages> </pages>
</main> </main>
<script src="/js/interface.js"> </script> <script type="text/javascript" src="js/jsonview.js"></script>
<script type="text/javascript" src="/js/interface.js"> </script>
</body> </body>