mirror of
https://github.com/bcomsugi/VSS_Rally_V3.git
synced 2026-01-09 09:52:38 +07:00
109 lines
5.0 KiB
HTML
109 lines
5.0 KiB
HTML
<!DOCTYPE HTML><html><head>
|
|
<title>Rally TerraTrip v1 Calibration</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%/wscal");
|
|
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);
|
|
var data = JSON.parse(event.data);
|
|
document.getElementById("currenttime").innerHTML = data.curTime;
|
|
document.getElementById("currenttrack").innerHTML = data.curTrip;
|
|
document.getElementById("counter").innerHTML = data.counter+";"+data.counter2;
|
|
document.getElementById("speed").innerHTML = data.curTripSpeed;
|
|
document.getElementById("caldist").innerHTML = data.caldist;
|
|
document.getElementById("calman").innerHTML = data.calman;
|
|
document.getElementById("calkm").innerHTML = data.calkm;
|
|
document.getElementById("calmeter").innerHTML = data.calmeter;
|
|
document.getElementById("calval").innerHTML = data.calval;
|
|
};
|
|
</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"><h5><span id="counter">12345</span></h5></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 Distance (<span id="caldist">9</span> Km)-></h3></div>
|
|
<div class="col text-start"><h3>
|
|
|
|
<input type="number" step="any" maxlength="2" required oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);"
|
|
id="setdistance" name="setdistance" size="4">
|
|
<button class="btn btn-primary mb-2 fw-bold" onclick="setDistance()">SET</button>
|
|
</h3></div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col text-end"><h3>Set Calibration Manually (<span id="calman">110000</span>)-></h3></div>
|
|
<div class="col text-start"><h3>
|
|
|
|
<input type="number" step="any" maxlength="6" required oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);"
|
|
size="3" id="setcalibration" name="setcalibration">
|
|
<button class="btn btn-primary mb-2 fw-bold" onclick="setCalibration()">SET</button>
|
|
</h3></div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col text-end"><h4>
|
|
<button ondblclick="startCalibration()" type="button" class="btn btn-primary mb-2 me-md-4">Start Calibration</button>
|
|
<button ondblclick="stopCalibration()" type="button" class="btn btn-primary mb-2 me-md-4">Stop Calibration</button></h4>
|
|
</div>
|
|
<div class="col"><h3>
|
|
<span id="calkm">00.000</span>Km</h3>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col text-end me-md-4"><h3>1 meter=<span id="calmeter">123.456</span></h3></div>
|
|
<div class="col"><h3><span id="calval">123456</span> Calibration Value</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 setDistance(e){
|
|
const setDis = document.getElementById("setdistance").value;
|
|
var full_data='{"setcaldis":'+setDis+'}';
|
|
console.log(full_data);
|
|
ws.send(full_data);
|
|
}
|
|
function setCalibration(e){
|
|
const setCal = document.getElementById("setcalibration").value;
|
|
var full_data='{"setcaldisman":'+setCal+'}';
|
|
console.log(full_data);
|
|
ws.send(full_data);
|
|
}
|
|
function startCalibration(e){
|
|
ws.send('{"calstart":1}');
|
|
console.log("calstart->1");
|
|
}
|
|
function stopCalibration(e){
|
|
ws.send('{"calstart":0}');
|
|
console.log("calstart->0");
|
|
}
|
|
</script>
|
|
</body></html> |