You've already forked fm-dx-webserver
mirror of
https://github.com/KubaPro010/fm-dx-webserver.git
synced 2026-02-26 22:13:53 +01:00
console rework / af list update / font update / tuning buttons
This commit is contained in:
NoobishSVK
147
web/index.html
147
web/index.html
@@ -8,76 +8,89 @@
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<canvas id="signal-canvas" width="1024" height="200" style="margin-top: 120px;"></canvas>
|
||||
|
||||
<div class="flex-container">
|
||||
<div class="panel-75" style="height: 110px;">
|
||||
<span class="text-big" id="data-ps"></span>
|
||||
</div>
|
||||
|
||||
<div class="panel-33">
|
||||
<h2 style="padding-top: 18px;">
|
||||
<span id="data-pty" style="color: #eee;"></span>
|
||||
<span style="margin-left: 30px;" id="data-tp">TP</span>
|
||||
<span style="margin-left: 15px; color: #ff5776;" id="data-st"></span>
|
||||
</h2>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="flex-container">
|
||||
<div class="panel-33">
|
||||
<h2>PI CODE</h2>
|
||||
<span id="data-pi" class="text-big"></span>
|
||||
</div>
|
||||
|
||||
<div class="panel-33">
|
||||
<h2>FREQUENCY</h2>
|
||||
<span id="data-frequency" class="text-big"></span>
|
||||
</div>
|
||||
|
||||
<div class="panel-33">
|
||||
<h2>SIGNAL</h2>
|
||||
<span class="text-big">
|
||||
<span id="data-signal"></span>
|
||||
<span id="signal-units" class="text-medium-big">dBf</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<canvas id="signal-canvas" width="1240" height="200" style="margin-top: 80px;"></canvas>
|
||||
|
||||
<div class="flex-container">
|
||||
<div class="panel-33" style="height: 48px;">
|
||||
<audio id="myAudio" preload="none" autoplay></audio>
|
||||
<input type="range" id="volumeSlider" min="0" max="1" step="0.01" value="1">
|
||||
<div class="panel-90 no-bg">
|
||||
<div class="flex-container">
|
||||
<div class="panel-75" style="height: 110px;">
|
||||
<span class="text-big" id="data-ps"></span>
|
||||
</div>
|
||||
|
||||
<div class="panel-33">
|
||||
<h2 style="padding-top: 18px;">
|
||||
<span id="data-pty" style="color: #eee;"></span>
|
||||
<span style="margin-left: 30px;" id="data-tp">TP</span>
|
||||
<span style="margin-left: 15px; color: #ff5776;" id="data-st"></span>
|
||||
</h2>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="flex-container">
|
||||
<div class="panel-33">
|
||||
<h2>PI CODE</h2>
|
||||
<span id="data-pi" class="text-big"></span>
|
||||
</div>
|
||||
|
||||
<div class="panel-33">
|
||||
<h2>FREQUENCY</h2>
|
||||
<span id="data-frequency" class="text-big"></span>
|
||||
</div>
|
||||
|
||||
<div class="panel-33">
|
||||
<h2>SIGNAL</h2>
|
||||
<span class="text-big">
|
||||
<span id="data-signal"></span>
|
||||
<span id="signal-units" class="text-medium-big">dBf</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex-container">
|
||||
<div class="panel-33" style="height: 48px;">
|
||||
<audio id="myAudio" preload="none" autoplay></audio>
|
||||
<input type="range" id="volumeSlider" min="0" max="1" step="0.01" value="1">
|
||||
</div>
|
||||
|
||||
<div class="panel-33 flex-container flex-phone" id="tune-buttons" style="opacity: 1;">
|
||||
<!--<button id="playButton">play</button>-->
|
||||
<button id="freq-down">◀</button>
|
||||
<input type="text" id="commandinput" inputmode="numeric" placeholder="Frequency">
|
||||
<button id="freq-up">▶</button>
|
||||
</div>
|
||||
|
||||
<div class="panel-33" style="height: 48px;">
|
||||
<label class="toggleSwitch nolabel" onclick="">
|
||||
<input id="signal-units-toggle" type="checkbox"/>
|
||||
<a></a>
|
||||
<span>
|
||||
<span class="left-span">dBf</span>
|
||||
<span class="right-span">dBµV</span>
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="panel-100">
|
||||
<h2 style="margin: 0;">RADIOTEXT</h2>
|
||||
<div id="data-rt0"></div>
|
||||
<div id="data-rt1"></div>
|
||||
<div id="data-container" style="display: none;"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="panel-33" style="opacity: 1;">
|
||||
<!--<button id="playButton">play</button>-->
|
||||
<input type="text" id="commandinput" inputmode="numeric" placeholder="Frequency">
|
||||
|
||||
<div class="panel-10 no-bg">
|
||||
<div class="panel-100" style="height: 100%;">
|
||||
<h2>AF</h2>
|
||||
<div id="af-list" style="text-align: center;">
|
||||
<ul>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="panel-33" style="height: 48px;">
|
||||
<label class="toggleSwitch nolabel" onclick="">
|
||||
<input id="signal-units-toggle" type="checkbox"/>
|
||||
<a></a>
|
||||
<span>
|
||||
<span class="left-span">dBf</span>
|
||||
<span class="right-span">dBµV</span>
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="panel-100">
|
||||
<h2 style="margin: 0;">RADIOTEXT</h2>
|
||||
<div id="data-rt0"></div>
|
||||
<div id="data-rt1"></div>
|
||||
<div id="data-container" style="display: none;"></div>
|
||||
</div>
|
||||
|
||||
<div class="panel-100" style="overflow: hidden">
|
||||
<h2 style="margin: 0;">AF</h2>
|
||||
<div id="data-af" style="text-align: center;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -87,7 +100,7 @@
|
||||
<div class="modal-content">
|
||||
<span class="modal-title">Settings</span>
|
||||
<span class="close" id="closeModal"><i class="fa-solid fa-xmark"></i></span>
|
||||
|
||||
|
||||
<label for="themes" style="margin-top: 50px;"><i class="fa-solid fa-palette"></i> Theme:</label>
|
||||
<select name="themes" style="margin-bottom: 50px;" id="theme-selector">
|
||||
<option value="theme1">Blurple</option>
|
||||
|
||||
Reference in New Issue
Block a user