esp32-nmea2000-obp60/web/index.html

74 lines
1.5 KiB
HTML

<!DOCTYPE html>
<html><head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8">
<title>NMEA 2000 Gateway</title>
<script type="text/javascript">
function reset(){
fetch('/api/reset');
alert("Board reset triggered, reconnect WLAN if necessary");
}
function update(){
fetch('/api/status')
.then(function(resp){
return resp.json()
})
.then(function(jsonData){
for (let k in jsonData){
let el=document.getElementById(k);
if (el) el.textContent=jsonData[k];
}
})
}
window.setInterval(update,1000);
</script>
<style type="text/css">
#wrap
{
text-align: center;
vertical-align: middle;
max-width: 900px;
margin:0 auto;
background:#dcd;
border-radius: 10px;
padding:10px; /*innen*/
}
span.label {
width: 10em;
display: inline-block;
opacity: 0.6;
}
.row {
margin: 0.5em;
}
</style>
</head>
<body>
<div class="main">
<h1>NMEA 2000 Gateway </h1>
<div class="row">
<span class="label">VERSION</span>
<span class="value" id="version">---</span>
</div>
<div class="row">
<span class="label"># CAN messages</span>
<span class="value" id="numcan">---</span>
</div>
<div class="row">
<span class="label">wifi client connected</span>
<span class="value" id="wifiConnected">---</span>
</div>
<div class="row">
<span class="label">wifi client IP</span>
<span class="value" id="clientIP">---</span>
</div>
<button id="reset" onclick="reset();">Reset</button>
</div>
</body>
</html>