openmodemconfigutil/public/index.html

437 lines
14 KiB
HTML

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Python App Test</title>
<link rel="stylesheet" type="text/css" href="./semantic/semantic.min.css">
<link rel="stylesheet" type="text/css" href="./semantic/range.css">
<link rel="stylesheet" type="text/css" href="./fontawesome/css/all.css">
<script type='text/javascript' src='./jquery.js'></script>
<script type='text/javascript' src="./semantic/semantic.min.js"></script>
<script type='text/javascript' src="./semantic/range.js"></script>
<script type='text/javascript' src='./raphael.min.js'></script>
<link rel='stylesheet' href='./style.css'/>
<script type='text/javascript' src='./main.js'></script>
</head>
<body>
<div class="ui dimmer" id="ind_connecting">
<div class="ui loader"></div>
</div>
<div class="ui dimmer" id="crypt_loader">
<div class="ui text loader">Initialising cryptography...<br/><br/><small>If this takes a long time, move your mouse or hit some keys to generate more entropy</small></div>
</div>
<div class="ui styled fullwidth accordion" id="configutil">
<div class="title active">
<i class="dropdown icon"></i>
<i class="fas fa-plug"></i>&nbsp;&nbsp;Connection
<span class="rightfloated">
<i class="fas fa-circle disconnected" id="ind_disconnected"></i>
<i class="fas fa-circle connected" id="ind_connected"></i>
</span>
</div>
<div class="content active" id="tab_connection">
<p class="transition visible" style="display: block !important;">
<div class="ui grid">
<!-- Serial Port selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
Port
</div>
</div>
<div class="eight wide column">
<select class="ui fullwidth dropdown" id="serialports">
</select>
</div>
<!-- Serial Baudrate selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
Serial Baud Rate
</div>
</div>
<div class="eight wide column">
<select class="ui fullwidth dropdown" id="connectbaudrate">
<option value="1200">1200</option>
<option value="2400">2400</option>
<option value="4800">4800</option>
<option value="9600">9600</option>
<option value="14400">14400</option>
<option value="19200">19200</option>
<option value="28800">28800</option>
<option value="38400">38400</option>
<option value="57600">57600</option>
<option value="76800">76800</option>
<option value="115200" selected>115200</option>
<option value="230400">230400</option>
</select>
</div>
<div class="sixteen wide column">
<div class="ui teal fullwidth button" tabindex="0" id="connectbutton">
Connect
</div>
<div class="ui red fullwidth button" tabindex="0" id="disconnectbutton">
Disconnect
</div>
</div>
</div>
</p>
</div>
<div class="title">
<i class="dropdown icon"></i>
<i class="fas fa-cog"></i>&nbsp;&nbsp;Modem Settings
</div>
<div class="content" id="tab_settings">
<p class="transition hidden">
<div class="ui grid">
<!-- Modem mode selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
Mode
</div>
</div>
<div class="eight wide column">
<select class="ui fullwidth dropdown disabled" id="s_modem_mode">
<option value="Unknown" selected>Unknown</option>
<option value="AFSK300">AFSK300</option>
<option value="AFSK1200">AFSK1200</option>
<option value="AFSK2400">AFSK2400</option>
</select>
</div>
<!-- Preamble selection -->
<div class="eight wide column">
<div class="ui fullwidth label">
Preamble
</div>
</div>
<div class="eight wide column">
<div class="ui right labeled fullwidth input">
<input type="text" placeholder="" id="f_preamble">
<div class="ui basic label">
ms
</div>
</div>
</div>
<!-- Tail selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
Tail
</div>
</div>
<div class="eight wide column">
<div class="ui right labeled fullwidth input">
<input type="text" placeholder="" id="f_tail">
<div class="ui basic label">
ms
</div>
</div>
</div>
<!-- Slot Time selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
CSMA Slot Time
</div>
</div>
<div class="eight wide column">
<div class="ui right labeled fullwidth input">
<input type="text" placeholder="" id="f_slottime">
<div class="ui basic label">
ms
</div>
</div>
</div>
<!-- P selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
CSMA Persistence
</div>
</div>
<div class="two wide column norightpadding">
<div class="ui fullwidth input">
<input type="text" placeholder="" id="f_p">
</div>
</div>
<div class="six wide column noleftpadding">
<div class="ui range" id="p-selection"></div>
</div>
<!-- LED Intensity selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
LED Intensity
</div>
</div>
<div class="eight wide column">
<div class="ui range" id="led-selection"></div>
</div>
<!-- GPS mode selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
GPS Mode
</div>
</div>
<div class="eight wide column">
<select class="ui fullwidth dropdown" id="s_gpsmode">
<option value="1">Autodetect</option>
<option value="0" selected>Disabled</option>
<option value="2">Required</option>
</select>
</div>
<!-- GPS mode selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
Bluetooth LE Mode
</div>
</div>
<div class="eight wide column">
<select class="ui fullwidth dropdown" id="s_bluetoothmode">
<option value="1">Autodetect</option>
<option value="0" selected>Disabled</option>
<option value="2">Required</option>
</select>
</div>
<!-- Serial Baudrate mode selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
Serial Baudrate
</div>
</div>
<div class="eight wide column">
<select class="ui fullwidth dropdown" id="s_baudrate">
<option value="1" selected>1200</option>
<option value="2">2400</option>
<option value="3">4800</option>
<option value="4">9600</option>
<option value="5">14400</option>
<option value="6">19200</option>
<option value="7">28800</option>
<option value="8">38400</option>
<option value="9">57600</option>
<option value="10">76800</option>
<option value="11">115200</option>
<option value="12">230400</option>
</select>
</div>
<!-- Pass All selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
Pass All Packets
</div>
</div>
<div class="eight wide column">
<div class="ui rightfloated toggle checkbox" id="c_passall">
<input type="checkbox" name="passall">
</div>
</div>
<!-- Log to SD selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
Log Packets to SD
</div>
</div>
<div class="eight wide column">
<div class="ui rightfloated toggle checkbox" id="c_logtosd">
<input type="checkbox" name="logtosd">
</div>
</div>
<div class="sixteen wide column">
<div class="ui teal fullwidth disabled button savebutton" tabindex="0">
Save Configuration
</div>
</div>
</div>
</p>
</div>
<div class="title">
<i class="dropdown icon"></i>
<i class="fas fa-volume"></i>&nbsp;&nbsp;Audio
</div>
<div class="audiosection content" id="tab_audio">
<p class="transition hidden">
<div class="ui grid">
<!-- Input Gain selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
Input Gain
</div>
</div>
<div class="eight wide column">
<div class="ui range" id="ingain-selection"></div>
</div>
<!-- Output Gain selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
Output Gain
</div>
</div>
<div class="eight wide column">
<div class="ui range" id="outgain-selection"></div>
</div>
<div class="sixteen wide column">
<div id="inputgraph">
</div>
</div>
<div class="sixteen wide column">
<div class="ui teal fullwidth disabled button savebutton" tabindex="0">
Save Configuration
</div>
</div>
</div>
</p>
</div>
<div class="title">
<i class="dropdown icon"></i>
<i class="fas fa-lock-alt"></i>&nbsp;&nbsp;Cryptography
</div>
<div class="content" id="tab_crypto">
<p class="transition hidden">
<div class="ui grid">
<!-- SD selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
OpenModem SD Card
</div>
</div>
<div class="eight wide column">
<select class="ui fullwidth dropdown" id="s_volumes">
<option value="none" selected>None</option>
</select>
</div>
<!-- Encryption enabled selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
AES-128 Encryption
</div>
</div>
<div class="eight wide column">
<div class="ui rightfloated disabled toggle checkbox" id="c_aes128">
<input type="checkbox" name="aesenable">
</div>
</div>
<!-- Key selection-->
<div class="eight wide column">
<div class="ui fullwidth label">
Private Key
</div>
</div>
<div class="four wide column" id="keygenerate">
<div class="ui disabled teal fullwidth button" tabindex="0">
Generate
</div>
</div>
<div class="four wide column" id="keyload">
<input type="file" (change)="fileEvent($event)" class="inputfile" id="keyfileinput" />
<label for="keyfileinput" class="ui disabled teal fullwidth button">
Load
</label>
<!--
<div class="ui disabled teal fullwidth button" tabindex="0">
Load
</div>
-->
</div>
<div class="eight wide column" id="keyisready">
<div class="ui green disabled fullwidth button" tabindex="0">
AES-128 Key Installed
</div>
</div>
<!-- Entropy selection-->
<!--
<div class="eight wide column">
<div class="ui fullwidth label">
Entropy Source
</div>
</div>
<div class="eight wide column">
<div class="ui teal fullwidth button" tabindex="0">
Install
</div>
</div>
-->
</div>
</p>
</div>
<div class="title">
<i class="dropdown icon"></i>
<i class="fas fa-info-circle"></i>&nbsp;&nbsp;About
</div>
<div class="content" id="tab_about">
<p class="transition hidden">
The source code for this utility is available at the OpenModem page on <a href="https://unsigned.io/" target="_blank">unsigned.io</a>. The following open source components have been used in this utility:
<ul class="licenses">
<li><a href="https://pywebview.flowrl.com" target="_blank">pywebview</a>&nbsp;<span class="license"><a href="https://github.com/r0x0r/pywebview/blob/master/LICENSE.md" target="_blank">BSD 3-Clause</a></span></li>
<li><a href="https://github.com/Semantic-Org/Semantic-UI" target="_blank">Semantic UI</a>&nbsp;<span class="license"><a href="https://github.com/Semantic-Org/Semantic-UI/blob/master/LICENSE.md" target="_blank">MIT</a></span></li>
<li><a href="https://github.com/tyleryasaka/semantic-ui-range" target="_blank">Semantic UI Range</a>&nbsp;<span class="license"><a href="https://github.com/tyleryasaka/semantic-ui-range/blob/master/LICENSE" target="_blank">MIT</a></span></li>
<li><a href="http://dmitrybaranovskiy.github.io/raphael/" target="_blank">Raphaël</a>&nbsp;<span class="license"><a href="https://github.com/DmitryBaranovskiy/raphael/blob/master/license.txt" target="_blank">MIT</a></span></li>
<li><a href="https://fontawesome.com/" target="_blank">FontAwesome</a>&nbsp;<span class="license"><a href="https://fontawesome.com/license" target="_blank">FontAwesome Pro</a></span></li>
<li><a href="https://github.com/giampaolo/psutil" target="_blank">psutil</a>&nbsp;<span class="license"><a href="https://github.com/giampaolo/psutil/blob/master/LICENSE" target="_blank">BSD</a></span></li>
</ul>
</p>
</div>
</div>
</body>
</html>