135 lines
4.6 KiB
HTML
135 lines
4.6 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<title>Data Over Audio</title>
|
|
<link rel="stylesheet" type="text/css" href="style.css" />
|
|
<script src="index.js" type="module" type="text/javascript"></script>
|
|
</head>
|
|
|
|
<body>
|
|
<h1>Data Over Audio</h1>
|
|
<div class="panels" id="panel-container">
|
|
<div class="chart">
|
|
<h2>Channel Graph</h2>
|
|
<div>
|
|
<canvas id="received-channel-graph" width="800" height="300"></canvas>
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<h2>Packetization Configuration</h2>
|
|
<div>
|
|
Maximum Data: <span id="packetization-max-bytes"></span><br>
|
|
Maximum Packets: <span id="packetization-max-packets"></span><br>
|
|
Maximum Duration: <span id="packetization-max-duration"></span><br>
|
|
<h4>Speed</h4>
|
|
Packetization: <span id="packetization-speed-bits-per-second"></span><br>
|
|
Data Only: <span id="packetization-speed-effective-bits-per-second"></span><br>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<h2>Packet Configuration</h2>
|
|
<div>
|
|
Bytes per packet: <span id="bytes-per-packet"></span><br>
|
|
Bits per Packet: <span id="bits-per-packet"></span><br>
|
|
<h4>Encoding</h4>
|
|
Packet Encoding: <span id="packet-encoding"></span><br>
|
|
Bits per block: <span id="packet-encoding-bits-per-block"></span><br>
|
|
Blocks per packet: <span id="packet-encoding-block-count"></span><br>
|
|
Encoding bits per Packet: <span id="packet-encoding-bit-count"></span><br>
|
|
<h4>Utilization</h4>
|
|
Data Bits per Packet: <span id="packet-data-bit-count"></span><br>
|
|
Unused bits per packet: <span id="packet-unused-bit-count"></span><br>
|
|
<h4>Segments</h4>
|
|
Segments Per Packet: <span id="segments-per-packet"></span><br>
|
|
Bits per segment: <span id="bits-per-segment">N/A</span><br />
|
|
Last segment unused bits: <span id="last-segment-unused-bit-count"></span><br>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<h2>Data</h2>
|
|
<div>
|
|
Original Bytes: <span id="original-byte-count"></span><br>
|
|
Packetization Bytes: <span id="packetization-byte-count"></span><br>
|
|
Packetization Bits: <span id="packetization-bit-count"></span><br>
|
|
Packet Count: <span id="packet-count"></span><br>
|
|
Total Segments: <span id="total-segments"></span><br>
|
|
<h3>Transfer Time</h3>
|
|
Per Segment: <span id="segment-transfer-duration"></span><br>
|
|
Per Packet: <span id="packet-transfer-duration"></span><br>
|
|
Total: <span id="data-transfer-duration"></span><br>
|
|
<h3>Utilization</h3>
|
|
Unused bits in last packet: <span id="last-packet-unused-bit-count"></span><br>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<h2>Original Data to send</h2>
|
|
<div>
|
|
<div class="raw-data" id="sent-data"></div><br />
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<h2>Encoded packets to send</h2>
|
|
<div>
|
|
<div class="raw-data" id="error-correcting-data"></div>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<h2>Decoded</h2>
|
|
<div>
|
|
Bytes: <span id="received-packet-original-bytes">N/A</span><br>
|
|
Length CRC: <span id="received-packet-original-bytes-crc">N/A</span><br>
|
|
Data CRC: <span id="received-packet-original-data-crc">N/A</span><br>
|
|
<h4>Errors</h4>
|
|
Encoded Segments: <span id="received-raw-bits-error-percent">N/A</span>%<br>
|
|
Encoded Packets: <span id="received-encoded-bits-error-percent">N/A</span>%<br>
|
|
Decoded Packets: <span id="received-decoded-bits-error-percent">N/A</span>%<br />
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<h2>Encoded Packets Received</h2>
|
|
<div>
|
|
<div class="raw-data" id="received-encoded-bits"></div><br />
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<h2>Decoded Packets Received</h2>
|
|
<div>
|
|
<div class="raw-data" id="received-decoded-bits"></div><br />
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<h2>Selected</h2>
|
|
<div>
|
|
Channel: <span id="selected-channel">N/A</span><br>
|
|
Segment: <span id="selected-segment">N/A</span><br>
|
|
Bit: <span id="selected-bit">N/A</span><br>
|
|
<div id="selected-samples"></div>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<h2>Audio Spectrum</h2>
|
|
<div>
|
|
Frequency Resolution: <span id="frequency-resolution">N/A</span><br>
|
|
Frequency Count: <span id="frequency-count">N/A</span><br>
|
|
Sample Rate: <span id="audio-context-sample-rate">N/A</span> per second.<br />
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<h2>Receiving</h2>
|
|
<div>
|
|
Samples Per Bit: <span id="samples-per-bit">0</span><br>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<h2>Channel Tuning</h2>
|
|
<div>
|
|
<canvas id="channel-frequency-graph" width="160" height="160"></canvas>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</body>
|
|
|
|
</html> |