VSS_Rally_V3/data/settime.html
2022-05-12 21:24:28 +07:00

87 lines
3.9 KiB
HTML

<!DOCTYPE HTML><html><head>
<title>Rally TerraTrip v1 Set Main Time</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<!--
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
-->
<link href="bootstrap.css" rel="stylesheet">
<script type = "text/javascript">
const ws = new WebSocket("ws://%serveripaddress%/wssettime");
ws.onopen = function() {
console.log("WebSocket Connected");
if(document.getElementById("mainTime").classList.contains("bg-danger")){
document.getElementById("mainTime").classList.remove("bg-danger")
}
};
ws.onclose = function() {
// alert("WS Connection Closed");
if(!document.getElementById("mainTime").classList.contains("bg-danger")){
document.getElementById("mainTime").classList.add("bg-danger")
}
};
ws.onmessage = function(event) {
// console.log(event.data);
if (IsJsonString(event.data)){
var data = JSON.parse(event.data);
if (data.NTPTime=="N/A") document.getElementById("btnNTP").disabled = true;
else document.getElementById("btnNTP").disabled = false;
document.getElementById("counter").innerHTML = data.counter+";"+data.counter2;
document.getElementById("currenttrack").innerHTML = data.curTrip;
document.getElementById("currenttime").innerHTML = data.curTime;
document.getElementById("speed").innerHTML = data.curTripSpeed;
document.getElementById("ntptime").innerHTML = data.NTPTime;
// document.getElementById("calman").innerHTML = data.calman;
// document.getElementById("calkm").innerHTML = data.calkm;
// document.getElementById("calmeter").innerHTML = data.calmeter;
// document.getElementById("calval").innerHTML = data.calval;
} else console.log(event.data);
};
function IsJsonString(str) {
try {
JSON.parse(str);
} catch (e) {
return false;
}
return true;
}
</script>
</head><body>
<!--
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
-->
<script src="bootstrap.bundle.min.js"></script>
<div class=" bg-secondary text-white">
<div class="row">
<div class="col-2 mt-1"><h6><span id="counter">12345</span></h6></div>
<div class="col-3 mt-1"><h2>TRIP <span id="currenttrack">A</span></h2></div>
<div class="col mt-1 text-center" id="mainTime"><h2>Time: <span id="currenttime">00:00:00</span></h2></div>
<div class="col-3 mt-1 text-end"><h2><span id="speed">123.4</span>Km/h</h2></div>
<hr>
</div>
<!--//Calibration Menu-->
<div class="row">
<div class="col text-end"><h3>Set Time (NTP Time:<span id="ntptime">9</span>)-></h3></div>
<div class="col text-start"><h3>
<input type="time" step="any" maxlength="6" required oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);"
id="settime" name="settime" size="4">
<button class="btn btn-primary mb-2 fw-bold" onclick="setTime(0)">SET Time</button>
<button id="btnNTP" class="btn btn-primary mb-2 fw-bold" onclick="setTime(1)">Use NTP</button>
</h3></div>
</div>
<button ondblclick="location.href='/menu';" class="btn btn-primary fw-bold btn-sm mt-2 mb-2 ms-3">Back to Menu</button>
</div>
<script>
function setTime(e){
let setTime;
if (e) setTime = "NTP";
else setTime = document.getElementById("settime").value;
var full_data='{"setTime":"'+setTime+'"}';
console.log(full_data);
ws.send(full_data);
}
</script>
</body></html>