WebUI-System copied from ChainLube
This commit is contained in:
279
data/index.htm
Normal file
279
data/index.htm
Normal file
@@ -0,0 +1,279 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>%DEVICE_NAME%</title>
|
||||
<meta http-equiv="content-type" content="text/html;charset=UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" href="static/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="static/css/custom.css">
|
||||
<script src="static/js/jquery-3.3.1.min.js"></script>
|
||||
<script src="static/js/bootstrap.bundle.min.js"></script>
|
||||
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="static/img/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="static/img/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="static/img/favicon-16x16.png">
|
||||
<link rel="manifest" href="static/img/site.webmanifest">
|
||||
<link rel="mask-icon" href="static/img/safari-pinned-tab.svg" color="#111111">
|
||||
<link rel="shortcut icon" href="static/img/favicon.ico">
|
||||
<meta name="msapplication-TileColor" content="#111111">
|
||||
<meta name="msapplication-config" content="static/img/browserconfig.xml">
|
||||
<meta name="theme-color" content="#111111">
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-expand-sm navbar-dark bg-dark">
|
||||
|
||||
<a class="navbar-brand" href="#">
|
||||
<img src="static/img/logo.png" width="30" height="30" class="d-inline-block align-top" alt="">
|
||||
%DEVICE_NAME%</a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup"
|
||||
aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
|
||||
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
|
||||
<ul class="navbar-nav nav ms-2 align-items-end">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" href="#tab_home" data-toggle="tab">Home</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#tab_settings" data-toggle="tab">Settings</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="jumbotron text-center">
|
||||
<p class="p-4">
|
||||
<img src="static/img/logo.png">
|
||||
</p>
|
||||
<h3>%DEVICE_NAME%</h3>
|
||||
</div>
|
||||
|
||||
<main role="main" class="container">
|
||||
|
||||
<!-- Tabs Content -->
|
||||
<div class="tab-content">
|
||||
<!-- Div Tab Home-->
|
||||
<div class="tab-pane fade show active" id="tab_home" role="tabpanel">
|
||||
<div class="container-fluid pb-5">
|
||||
<h4>Akku</h4>
|
||||
<div class="progress">
|
||||
<div class="progress-bar text-light" role="progressbar" aria-valuenow="%BAT_REMAIN_CAPACITY%" aria-valuemin="0"
|
||||
aria-valuemax="100" style="width: %BAT_REMAIN_CAPACITY%%">
|
||||
%BAT_REMAIN_CAPACITY%% / %BAT_VOLTAGE% V
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container-fluid pb-5">
|
||||
<h4>Fraktionen</h4>
|
||||
<div class="table-responsive">
|
||||
<table class="table text-light text-center">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Fraktion</td>
|
||||
<th scope="col">Zeit</td>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="align-items-center justify-content-center" scope="col">
|
||||
<a href="#">
|
||||
<img src="static/img/logo_fac1.png" class="img-responsive" alt="" />
|
||||
<div class="desc">
|
||||
<p class="desc_content">%NAME_FAC_1%</p>
|
||||
</div>
|
||||
</a>
|
||||
</td>
|
||||
<td class="align-items-center justify-content-center" scope="col">%POINTS_FAC_1%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="align-items-center justify-content-center" scope="col">
|
||||
<a href="#">
|
||||
<img src="static/img/logo_fac2.png" class="img-responsive" alt="" />
|
||||
<div class="desc">
|
||||
<p class="desc_content">%NAME_FAC_2%</p>
|
||||
</div>
|
||||
</a>
|
||||
</td>
|
||||
<td class="align-items-center justify-content-center" scope="col">%POINTS_FAC_2%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="align-items-center justify-content-center" scope="col">
|
||||
<a href="#">
|
||||
<img src="static/img/logo_fac3.png" class="img-responsive" alt="" />
|
||||
<div class="desc">
|
||||
<p class="desc_content">%NAME_FAC_3%</p>
|
||||
</div>
|
||||
</a>
|
||||
</td>
|
||||
<td class="align-items-center justify-content-center" scope="col">%POINTS_FAC_3%</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container-fluid pb-5" %SHOW_DTC_TABLE%>
|
||||
<h4>Fehlercodes</h4>
|
||||
<table class="table text-light">
|
||||
<tbody>
|
||||
<tr>
|
||||
<th class="col-md-4" scope="col">Timestamp</td>
|
||||
<th class="col-md-4" scope="col">DTC</td>
|
||||
<th class="col-md-4" scope="col">active</td>
|
||||
</tr>
|
||||
%DTC_TABLE%
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Div Tab Home-->
|
||||
<!-- Div Tab Settings-->
|
||||
<div class="tab-pane fade" id="tab_settings" role="tabpanel">
|
||||
<h3>Erfassung Wegstrecke</h3>
|
||||
<hr>
|
||||
<p>
|
||||
<form action="\post.htm" method="POST" class="form-horizontal">
|
||||
<div class="form-group">
|
||||
<label for="sourceselect" class="control-label col-xs-5">Wegstrecke Quelle</label>
|
||||
<div class="col-xs-7">
|
||||
<select id="sourceselect" name="sourceselect" class="select form-control">
|
||||
%SOURCE_SELECT_OPTIONS%
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group row">
|
||||
<div class="col-xs-offset-5 col-xs-7">
|
||||
<button name="sourcesave" type="submit" class="btn btn-primary">Übernehmen</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</p>
|
||||
<div class="alert alert-warning">
|
||||
<strong>Achtung!</strong><br>
|
||||
Bei Änderung der Wegstrecken-Quelle wird der CAN-Oiler neu gestartet.
|
||||
Dadurch wird die WiFi-Verbindung getrennt und muss neu aufgebaut werden.
|
||||
</div>
|
||||
<!-- Div Source:Impulse Settings-->
|
||||
<div %SHOW_IMPULSE_SETTINGS%>
|
||||
<h4>Einstellungen Impuls</h4>
|
||||
<p>
|
||||
<form action="\post.htm" method="POST" class="form-horizontal">
|
||||
<div class="form-group">
|
||||
<label for="tirewidth" class="control-label col-xs-5">Reifenbreite</label>
|
||||
<div class="col-xs-7">
|
||||
<div class="input-group">
|
||||
<input id="tirewidth" name="tirewidth" type="text" required="required" class="form-control"
|
||||
value="%TIRE_WIDTH_MM%">
|
||||
<div class="input-group-addon">mm</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="tireratio" class="control-label col-xs-5">Höhe/Breite-Verhältniss</label>
|
||||
<div class="col-xs-7">
|
||||
<div class="input-group">
|
||||
<input id="tireratio" name="tireratio" type="text" required="required" class="form-control"
|
||||
value="%TIRE_RATIO%">
|
||||
<div class="input-group-addon"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="tiredia" class="control-label col-xs-5">Felgendurchmesser</label>
|
||||
<div class="col-xs-7">
|
||||
<div class="input-group">
|
||||
<input id="tiredia" name="tiredia" type="text" required="required" class="form-control"
|
||||
value="%RIM_DIAMETER%">
|
||||
<div class="input-group-addon">"</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="pulserev" class="control-label col-xs-5">Pulse pro Umdrehung</label>
|
||||
<div class="col-xs-7">
|
||||
<div class="input-group">
|
||||
<input id="pulserev" name="pulserev" type="text" required="required" class="form-control"
|
||||
value="%PULSE_PER_REV%">
|
||||
<div class="input-group-addon"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group row">
|
||||
<div class="col-xs-offset-5 col-xs-7">
|
||||
<button name="pulsesave" type="submit" class="btn btn-primary">Speichern</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</p>
|
||||
</div>
|
||||
<!-- Div Source:Impulse Settings-->
|
||||
<!-- Div Source:CAN Settings-->
|
||||
<div %SHOW_CAN_SETTINGS%>
|
||||
<h4>Einstellungen CAN-Bus</h4>
|
||||
<p>
|
||||
<form action="\post.htm" method="POST" class="form-horizontal">
|
||||
<div class="form-group">
|
||||
<label for="cansource" class="control-label col-xs-5">Model</label>
|
||||
<div class="col-xs-7">
|
||||
<select id="cansource" name="cansource" class="select form-control">
|
||||
%CANSOURCE_SELECT_OPTIONS%
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group row">
|
||||
<div class="col-xs-offset-5 col-xs-7">
|
||||
<button name="cansave" type="submit" class="btn btn-primary">Speichern</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</p>
|
||||
</div>
|
||||
<!-- Div Source:CAN Settings-->
|
||||
<!-- Div Source:GPS Settings-->
|
||||
<div %SHOW_GPS_SETTINGS%>
|
||||
<h4>Einstellungen GPS</h4>
|
||||
<p>
|
||||
<form action="\post.htm" method="POST" class="form-horizontal">
|
||||
<div class="form-group">
|
||||
<label for="gpsbaud" class="control-label col-xs-5">Baudrate</label>
|
||||
<div class="col-xs-7">
|
||||
<select id="gpsbaud" name="gpsbaud" class="select form-control">
|
||||
%GPSBAUD_SELECT_OPTIONS%
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group row">
|
||||
<div class="col-xs-offset-5 col-xs-7">
|
||||
<button name="gpssave" type="submit" class="btn btn-primary">Speichern</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</p>
|
||||
</div>
|
||||
<!-- Div Source:GPS Settings-->
|
||||
</div>
|
||||
<!-- Div Tab Settings-->
|
||||
</div>
|
||||
<!-- Tabs Content -->
|
||||
</main>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="navbar-default navbar-fixed-bottom">
|
||||
<!-- Copyright -->
|
||||
<div class="footer-copyright text-center py-3">
|
||||
© 2022 Copyright:
|
||||
<a class="text-reset fw-bold" href="https://hiabuto.de/">Hiabuto AS-Defence Systems</a>
|
||||
</div>
|
||||
<!-- Copyright -->
|
||||
</footer>
|
||||
<!-- Footer -->
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user