esp32-nmea2000-obp60/web/index.html

126 lines
4.1 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" src="index.js"></script>
<script type="text/javascript" src="md5.js"></script>
<link rel="stylesheet" href="index.css">
</head>
<body>
<div class="main">
<h1 id="headline">NMEA 2000 Gateway </h1>
<div class="row">
<span class="label">connected</span>
<span class="value" id="connected"></span>
</div>
<div id="tabs">
<div class="tab active" data-page="statusPage">Status</div>
<div class="tab" data-page="configPage">Config</div>
<div class="tab" data-page="xdrPage">XDR</div>
<div class="tab" data-page="dashboardPage">Data</div>
</div>
<div id="statusPage" class="tabPage">
<div id="statusPageContent">
<div class="row">
<span class="label">VERSION</span>
<span class="value" id="version">---</span>
<button class="infoButton" id="converterInfo">?</button>
</div>
<div class="row even">
<span class="label">Access Point IP</span>
<span class="value" id="apIp">---</span>
</div>
<div class="row ">
<span class="label">wifi client connected</span>
<span class="value" id="wifiConnected">---</span>
</div>
<div class="row even">
<span class="label">wifi client IP</span>
<span class="value" id="clientIP">---</span>
</div>
<div class="row">
<span class="label"># TCP clients</span>
<span class="value" id="numClients">---</span>
</div>
</div>
<button id="reset">Reset</button>
</div>
<div class="configForm tabPage hidden" id="configPage" >
<div class="buttons">
<button id="resetForm">ReloadConfig</button>
<button id="changeConfig">Save&Restart</button>
<button id="factoryReset">FactoryReset</button>
</div>
<div class="configFormRows">
</div>
</div>
<div class="configForm tabPage hidden" id="xdrPage" >
<div class="buttons">
<button id="resetForm">ReloadConfig</button>
<button id="changeConfig">Save&Restart</button>
<button id="loadUnassigned">Show Unmapped</button>
<button id="exportXdr">Export</button>
<button id="importXdr">Import</button>
</div>
<div class="configFormRows">
</div>
</div>
<div class="tabPage hidden" id="dashboardPage">
</div>
</div>
<div class="overlayContainer hidden" id="overlayContainer">
<div id="overlay">
<div id="overlayContent">
AHA
</div>
<div class="overlayButtons">
<button id="hideOverlay">Close</button>
</div>
</div>
</div>
<div id="xdrHelp" class="hidden">
<h1>XDR Help</h1>
<p>You can configure the mapping of various NMEA2000 entities to XDR records.</p>
<p>To set up such a mapping you select the category, the source of data
(if the category has different sources) and the field (if the category has multiple fields).</p>
<p>You have to provide the name of the transducer for the XDR record.</p>
<p>Many of the NMEA2000 messages have an instance id (0..255) to allow
for different sources of the data. You need to decide how do you want to
map such IDs to XDR records.
</p>
<ul>
<li>IGNORE: the instance id will be ignored</li>
<li>AUTO: the instance will be appended to the transducer name: #123</li>
<li>SINGLE: just map exactlly one instance to this transducer name</li>
</ul>
<p>You can also decide if you want a both way mapping, i.e. also map
received XDR records back to NMEA 2000.
</p>
<p>Once you create a mapping the system will show an example of the
generated XDR records (and the accepted ones).
</p>
<p>To ease the set up the system will track received NMEA2000 data
that it currently does not map.
With clicking <span class="txtShowUnmapped">"Show Unmapped"</span> you bring up such a list and for each
found mapping there is a "+" button that will allow you to create a mapping
for this record.
</p>
<p>The set of handled PGNs that can be mapped to XDR records can be found
in the documentation.
</p>
</div>
<div class="hidden">
<a id="downloadXdr"></a>
</div>
</body>
</html>