144 lines
4.6 KiB
HTML
144 lines
4.6 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<title>Fastclock</title>
|
|
<link href="main.css" rel="stylesheet" type="text/css" />
|
|
<link rel="manifest" href="manifest.json">
|
|
<script type="text/javascript">
|
|
|
|
function ajaxGet(url, responseCallback) {
|
|
var xh = new XMLHttpRequest();
|
|
xh.onreadystatechange = function () {
|
|
if (xh.readyState == 4) {
|
|
if (xh.status == 200) {
|
|
var result = JSON.parse(xh.responseText);
|
|
responseCallback(result);
|
|
}
|
|
}
|
|
};
|
|
xh.open("GET", url, true);
|
|
xh.send(null);
|
|
};
|
|
|
|
function showMessage(s) {
|
|
var displayMessageId = document.getElementById("displayMessageId");
|
|
displayMessageId.innerHTML = "<pre>" + s + "</pre>";
|
|
}
|
|
|
|
function handleFwdClockResponse(result) {
|
|
var led = document.getElementById("led");
|
|
var msg = "";
|
|
if (result.result == "OK") {
|
|
led.src = "led-on.png";
|
|
var clockName = document.getElementById("clockNameId");
|
|
clockName.html = result.clockName;
|
|
msg = result.real_hours + ":" + result.real_minutes + " " + result.real_seconds + "<br>";
|
|
} else {
|
|
led.src = "led-off.png";
|
|
}
|
|
showMessage(msg + JSON.stringify(result, null, 2));
|
|
};
|
|
|
|
function fwdClock() {
|
|
ajaxGet("/fwd", handleFwdClockResponse);
|
|
};
|
|
|
|
function handleClockStatusResponse(result) {
|
|
//showMessage(JSON.stringify(result));
|
|
document.getElementById("clockNameId").textContent = result.clockName;
|
|
document.getElementById("realTimeId").textContent = result.real_hours + ":" + result.real_minutes + " " + result.real_seconds;
|
|
document.getElementById("modelTimeId").textContent = result.model_hours + ":" + result.model_minutes + " " + result.model_seconds;
|
|
|
|
};
|
|
|
|
function getClockStatus() {
|
|
ajaxGet("/clock", handleClockStatusResponse);
|
|
setTimeout(function() {
|
|
getClockStatus();
|
|
}, 400);
|
|
};
|
|
|
|
function handleSetDisplayedTimeResponse(result) {
|
|
showMessage(JSON.stringify(result, null, 2));
|
|
};
|
|
|
|
function setDisplayedTime() {
|
|
var hoursInput = document.getElementById("displayedHoursInputId");
|
|
var minutesInput = document.getElementById("displayedMinutesInputId");
|
|
ajaxGet("/setDT?h=" + hoursInput.value + "&m=" + minutesInput.value, handleSetDisplayedTimeResponse);
|
|
}
|
|
|
|
function handleChangeClockResponse(result) {
|
|
showMessage(JSON.stringify(result, null, 2));
|
|
};
|
|
|
|
function setClockToModel() {
|
|
ajaxGet("/clock/model", handleChangeClockResponse);
|
|
}
|
|
|
|
function setClockToReal() {
|
|
ajaxGet("/clock/real", handleChangeClockResponse);
|
|
}
|
|
|
|
function handleTriggerSWUpdateCheck(result) {
|
|
showMessage(JSON.stringify(result, null, 2));
|
|
};
|
|
|
|
function triggerSWUpdateCheck() {
|
|
ajaxGet("/sys/swupdate", handleTriggerSWUpdateCheck);
|
|
}
|
|
|
|
function handleTriggerReboot(result) {
|
|
showMessage(JSON.stringify(result, null, 2));
|
|
};
|
|
|
|
function triggerReboot() {
|
|
ajaxGet("/sys/reboot", handleTriggerReboot);
|
|
}
|
|
|
|
function onBodyLoad() {
|
|
var button = document.getElementById("button");
|
|
button.onmousedown = function(event) {
|
|
event.stopPropagation();
|
|
event.preventDefault();
|
|
button.src = "btn-do.png";
|
|
fwdClock();
|
|
navigator.vibrate(20);
|
|
};
|
|
button.onmouseup = function() {
|
|
setTimeout(function() {
|
|
button.src = "btn.png";
|
|
}, 400);
|
|
};
|
|
setTimeout(function() {
|
|
getClockStatus();
|
|
}, 400);
|
|
};
|
|
</script>
|
|
</head>
|
|
|
|
<body id="index" onload="onBodyLoad()">
|
|
<div class="hdr"><img src="fremoei.gif"></div>
|
|
<div><label>Clock name: </label><span id="clockNameId"></span></div>
|
|
<div><label>Real time (h:m): </label><span id="realTimeId"></span></div>
|
|
<div><label>Model time (h:m): </label><span id="modelTimeId"></span></div>
|
|
<div>
|
|
<input type="number" min="0" max="23" id="displayedHoursInputId">:
|
|
<input type="number" min="0" max="59" id="displayedMinutesInputId">
|
|
<button onclick="setDisplayedTime()">Adjust to actual time</button>
|
|
</div>
|
|
<div>
|
|
<button onClick="setClockToModel()">Model time</button>
|
|
<button onClick="setClockToReal()">Real time</button>
|
|
<button onClick="triggerSWUpdateCheck()">Check SW Update</button>
|
|
<button onClick="triggerReboot()">Reboot</button>
|
|
</div>
|
|
<div id="displayMessageId" class="logmsg"></div>
|
|
<div class="btn_cnt"><img id="led" src="led-off.png"><a href="#"><img id="button" src="btn.png"></a></div>
|
|
</body>
|
|
|
|
</html>
|