first commit
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 5.7 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 51 KiB |
|
After Width: | Height: | Size: 88 KiB |
|
After Width: | Height: | Size: 49 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 1.0 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 207 KiB |
|
After Width: | Height: | Size: 224 KiB |
|
After Width: | Height: | Size: 6.6 KiB |
|
After Width: | Height: | Size: 55 KiB |
@@ -0,0 +1,200 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Universal Hamradio Remote by F4HTB</title>
|
||||
<link rel="stylesheet" type="text/css" href="style.css">
|
||||
</head>
|
||||
</head>
|
||||
<body onload="bodyload();">
|
||||
|
||||
<a href="#fermer" id="ombre-body"></a>
|
||||
<div id="pop-upspinner">
|
||||
<img alt="" src="img/spinner.gif">
|
||||
<p id="socketsate"><center>Wait For connection....</center></p>
|
||||
</div>
|
||||
|
||||
<div id="div-princ">
|
||||
<img onclick="powertogle();" id="button_power" alt="Click to connect or disconnect interface" src="img/poweroff.png">
|
||||
|
||||
<form id="RX-GAIN_control">
|
||||
AF GAIN:<input oninput="AudioRX_SetGAIN();setCookie('C_af', this.value, 180);" onchange="AudioRX_SetGAIN();setCookie('C_af', this.value, 180);" value="250" step="5" type="range" id="C_af" name="volume" min="0" max="1000">
|
||||
</form>
|
||||
|
||||
<div id="Rxmeters">
|
||||
<div id="Rxinstant">
|
||||
<div class="label">RX volume:</div>
|
||||
<meter low="10" high="70" max="100" value="0"></meter>
|
||||
<div class="value"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<form id="TX-GAIN_control">
|
||||
MIC GAIN:<input oninput="AudioTX_SetGAIN(this.value/100);setCookie('C_mg', this.value, 180);" onchange="AudioTX_SetGAIN(this.value/100);setCookie('C_mg', this.value, 180);" value="50" step="5" type="range" id="C_mg" name="volume" min="0" max="200">
|
||||
</form>
|
||||
|
||||
<div id="Txmeters">
|
||||
<div id="Txinstant">
|
||||
<div class="label">TX volume:</div>
|
||||
<meter low="10" high="50" max="100" value="0"></meter>
|
||||
<div class="value"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="div-freq">
|
||||
<ul id="freq_but">
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="cmhz" v=100000000>▲</li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="dmhz" v=10000000>▲</li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="umhz" v=1000000>▲</li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();"> </li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="ckhz" v=100000>▲</li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="dkhz" v=10000>▲</li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="ukhz" v=1000>▲</li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();"> </li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="chz" v=100>▲</li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="dhz" v=10>▲</li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="uhz" v=1>▲</li>
|
||||
</ul>
|
||||
<ul ondblclick="changeinputfreqstyle(event);document.getElementById('freq_disp_input_text').focus();document.getElementById('freq_disp_input_text').select();" id="freq_disp" onwheel="freq_digit_scroll()">
|
||||
<input onkeypress="changeinputfreqstyle(event);" onkeydown="validateNumber(event);"/ id="freq_disp_input_text" type="text" minlength="4" maxlength="8" size="10">
|
||||
<li class="freq_digit" onmouseenter="select_digit();" onmouseleave="clear_select_digit();" id="cmhz" v=100000000>0</li>
|
||||
<li class="freq_digit" onmouseenter="select_digit();" onmouseleave="clear_select_digit();" id="dmhz" v=10000000>0</li>
|
||||
<li class="freq_digit" onmouseenter="select_digit();" onmouseleave="clear_select_digit();" id="umhz" v=1000000>0</li>
|
||||
<li class="freq_digit">.</li>
|
||||
<li class="freq_digit" onmouseenter="select_digit();" onmouseleave="clear_select_digit();" id="ckhz" v=100000>0</li>
|
||||
<li class="freq_digit" onmouseenter="select_digit();" onmouseleave="clear_select_digit();" id="dkhz" v=10000>0</li>
|
||||
<li class="freq_digit" onmouseenter="select_digit();" onmouseleave="clear_select_digit();" id="ukhz" v=1000>0</li>
|
||||
<li class="freq_digit">.</li>
|
||||
<li class="freq_digit" onmouseenter="select_digit();" onmouseleave="clear_select_digit();" id="chz" v=100>0</li>
|
||||
<li class="freq_digit" onmouseenter="select_digit();" onmouseleave="clear_select_digit();" id="dhz" v=10>0</li>
|
||||
<li class="freq_digit" onmouseenter="select_digit();" onmouseleave="clear_select_digit();" id="uhz" v=1>0</li>
|
||||
</ul>
|
||||
<ul id="freq_but">
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="cmhz" v=-100000000>▼</li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="dmhz" v=-10000000>▼</li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="umhz" v=-1000000>▼</li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();"> </li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="ckhz" v=-100000>▼</li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="dkhz" v=-10000>▼</li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="ukhz" v=-1000>▼</li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" > </li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="chz" v=-100>▼</li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="dhz" v=-10>▼</li>
|
||||
<li onmousedown="button_pressed();rotatefreq();" onmouseup="button_unpressed();" class="button_unpressed" digit="uhz" v=-1>▼</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div id="div-bandshortcut">
|
||||
<ul id="band_but">
|
||||
<li onmousedown="button_pressed();recall_hambands();" onmouseup="button_unpressed();" class="button_unpressed" v="001845500">160m</li>
|
||||
<li onmousedown="button_pressed();recall_hambands();" onmouseup="button_unpressed();" class="button_unpressed" v="003692500">80m</li>
|
||||
<li onmousedown="button_pressed();recall_hambands();" onmouseup="button_unpressed();" class="button_unpressed" v="007092500">40m</li>
|
||||
<li onmousedown="button_pressed();recall_hambands();" onmouseup="button_unpressed();" class="button_unpressed" v="010140000">30m</li>
|
||||
<li onmousedown="button_pressed();recall_hambands();" onmouseup="button_unpressed();" class="button_unpressed" v="014127500">20m</li>
|
||||
<li onmousedown="button_pressed();recall_hambands();" onmouseup="button_unpressed();" class="button_unpressed" v="018132500">17m</li>
|
||||
<li onmousedown="button_pressed();recall_hambands();" onmouseup="button_unpressed();" class="button_unpressed" v="021287500">15m</li>
|
||||
<li onmousedown="button_pressed();recall_hambands();" onmouseup="button_unpressed();" class="button_unpressed" v="027085000">11m</li>
|
||||
<li onmousedown="button_pressed();recall_hambands();" onmouseup="button_unpressed();" class="button_unpressed" v="024952500">12m</li>
|
||||
<li onmousedown="button_pressed();recall_hambands();" onmouseup="button_unpressed();" class="button_unpressed" v="028362500">10m</li>
|
||||
<li onmousedown="button_pressed();recall_hambands();" onmouseup="button_unpressed();" class="button_unpressed" v="050202500">6m</li>
|
||||
<li onmousedown="button_pressed();recall_hambands();" onmouseup="button_unpressed();" class="button_unpressed" v="070202500">4m</li>
|
||||
<li onmousedown="button_pressed();recall_hambands();" onmouseup="button_unpressed();" class="button_unpressed" v="144300000">2m</li>
|
||||
<li onmousedown="button_pressed();recall_hambands();" onmouseup="button_unpressed();" class="button_unpressed" v="432200000">70cm</li>
|
||||
<li onmousedown="button_pressed();recall_hambands();" onmouseup="button_unpressed();" class="button_unpressed" v="010000000">WWW</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div id="div-filtershortcut">
|
||||
<ul id="band_but">
|
||||
<li onclick="if(poweron)togle_li();setaudiofilter();" class="button_pressed" lichecked="" fq="0" fg="0" ft="highshelf" frq="22000">None</li>
|
||||
<li onclick="if(poweron)togle_li();setaudiofilter();" class="button_unpressed" fq="0" fg="-20" ft="highshelf" frq="4400">LP 4.4k</li>
|
||||
<li onclick="if(poweron)togle_li();setaudiofilter();" class="button_unpressed" fq="0" fg="-20" ft="highshelf" frq="3300">LP 3.3k</li>
|
||||
<li onclick="if(poweron)togle_li();setaudiofilter();" class="button_unpressed" fq="0" fg="-20" ft="highshelf" frq="2700">LP 2.7k</li>
|
||||
<li onclick="if(poweron)togle_li();setaudiofilter();" class="button_unpressed" fq="0" fg="-20" ft="highshelf" frq="2100">LP 2.1k</li>
|
||||
<li onclick="if(poweron)togle_li();setaudiofilter();" class="button_unpressed" fq="0" fg="-20" ft="highshelf" frq="1000">LP 1.0k</li>
|
||||
<li onclick="if(poweron)togle_li();setaudiofilter();" class="button_unpressed" fq="50" fg="-100" ft="bandpass" frq="300">BP 300Hz</li>
|
||||
<li onclick="if(poweron)togle_li();setaudiofilter();" class="button_unpressed" fq="50" fg="-100" ft="bandpass" frq="500">BP 500Hz</li>
|
||||
<li onclick="if(poweron)togle_li();setaudiofilter();" class="button_unpressed" fq="50" fg="-100" ft="bandpass" frq="800">BP 800Hz</li>
|
||||
<li onclick="if(poweron)togle_li();setaudiofilter();" class="button_unpressed" fq="50" fg="-100" ft="bandpass" frq="1000">BP 1kHz</li>
|
||||
<li onclick="if(poweron)togle_li();setaudiofilter();" class="button_unpressed" id="custom_filter_click" fq="0" fg="0" ft="highshelf" frq="22000">BP click</li>
|
||||
<li onclick="if(poweron)togle_li();document.getElementById('div-customfilter').style.display = 'block';" class="button_unpressed" fq="0" fg="0" ft="highshelf" frq="22000">Custom</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div id="div-customfilter">
|
||||
filter_type:<select id="customfilter_T">
|
||||
<option >--Please choose a filter type--</option>
|
||||
<option value="lowpass">lowpass</option>
|
||||
<option value="highpass">highpass</option>
|
||||
<option value="bandpass">bandpass</option>
|
||||
<option value="lowshelf">lowshelf</option>
|
||||
<option value="highshelf">highshelf</option>
|
||||
<option value="peaking">peaking</option>
|
||||
<option value="notch">notch</option>
|
||||
<option value="allpass">allpass</option>
|
||||
</select><br>
|
||||
Freq:<input type="text" id="customfilter_F" value="click to FFT to set">hz<br>
|
||||
Q Factor:<input type ="text" id="customfilter_Q" value="50"><br>
|
||||
Gain:<input type ="text" id="customfilter_G" value="50"><br>
|
||||
<input value="ok" type ="button" onclick="document.getElementById('div-customfilter').style.display = 'none';setcustomaudiofilter();">
|
||||
</div>
|
||||
|
||||
|
||||
<form id="SQUELCH_control">
|
||||
SQL:<input oninput="if(poweron)drawRXSmeter();setCookie('SQUELCH', this.value, 180);" onchange="if(poweron)drawRXSmeter();setCookie('SQUELCH', this.value, 180);" value="0" step="5" type="range" id="SQUELCH" name="SQUELCH" min="0" max="100">
|
||||
</form>
|
||||
|
||||
<form id="personalfrequency">
|
||||
<label>Personal Freqs</label>
|
||||
<select id="selectpersonalfrequency">
|
||||
</select>
|
||||
<label onclick="recall_freqfromcokkies();">recall</label>
|
||||
<label onclick="delete_freqfromcokkies();"> delete</label>
|
||||
<label onclick="save_freqtocokkies();"> save</label>
|
||||
</form>
|
||||
|
||||
<canvas class="visualizer" id="canBFSPC" width="1024" ></canvas>
|
||||
<canvas class="visualizer" id="canBFFFT" width="2048" ></canvas>
|
||||
<input class="slider-wrapper slider-wrapper_floor" value="0" step="5" type="range" id="canBFFFT_scale_floor" min="-100" max="100">
|
||||
<input class="slider-wrapper slider-wrapper_multdb" value="0" step="5" type="range" id="canBFFFT_scale_multdb" min="-100" max="100">
|
||||
<input class="slider-wrapper slider-wrapper_start" value="0" step="5" type="range" id="canBFFFT_scale_start" min="-200" max="200">
|
||||
<input class="slider-wrapper slider-wrapper_multhz" value="0" step="5" type="range" id="canBFFFT_scale_multhz" min="-200" max="200">
|
||||
<label id="canvasBFFFT_coord"></label>
|
||||
|
||||
<label id="callsign"></label>
|
||||
|
||||
<div id="div-conf"><a href="/CONFIG" target="_UHRRconfig"><img src="img/config.png"></a></div>
|
||||
<div id="div-panfft"><a onclick="panfft = window.open( this.href, 'UHRRpanfft', 'width=1000, height=1000, menubar=no, toolbar=no, location=no, resizable=yes, scrollbars=no, status=no, dependent=yes'); return false;" href="/panfft.html" target="_UHRRpanfft"><img src="img/panfft.png"></a></div>
|
||||
|
||||
<canvas id="canRXsmeter" width=250 height=50 ></canvas>
|
||||
|
||||
<div id="div-smeterdigitRX">S9+40dB</div>
|
||||
<div id="div-mode_menu">
|
||||
<ul>
|
||||
<li onclick="togle_li();sendTRXmode();" class="button_mode button_pressed" lichecked="">USB</li>
|
||||
<li onclick="togle_li();sendTRXmode();" class="button_mode button_unpressed">LSB</li>
|
||||
<li onclick="togle_li();sendTRXmode();" class="button_mode button_unpressed">CW</li>
|
||||
<li onclick="togle_li();sendTRXmode();" class="button_mode button_unpressed">AM</li>
|
||||
<li onclick="togle_li();sendTRXmode();" class="button_mode button_unpressed">FM</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div id="div-TX">
|
||||
<span onmousedown="TXtogle('True');" onmouseup="TXtogle('False');" class="button_unpressed" id="TX-record">TX</span>
|
||||
<span onclick="TXtogle();" class="button_unpressed" id="TX-record-lock">TX Lock</span>
|
||||
<form id="TX-record_record_opus">
|
||||
<input type="checkbox" id="encode" class=none alt="Encode TX with opus codec">Encode TX</input><br>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div id="div-scoketscontrols">
|
||||
<p id="indwsAudioTX"><img src="img/critsred.png">wsTX</p>
|
||||
<p id="indwsAudioRX"><img src="img/critsred.png">wsRX</p>
|
||||
<p id="indwsControlTRX"><img src="img/critsred.png">wsCtrl</p>
|
||||
</div>
|
||||
|
||||
<div id="div-latencymeter">latency:∞</div>
|
||||
|
||||
</div>
|
||||
<script src="controls.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,78 @@
|
||||
body {
|
||||
color: white;
|
||||
font:normal bold 14px tahoma;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
padding:0px;
|
||||
margin:0px;
|
||||
}
|
||||
|
||||
#div-sp
|
||||
{
|
||||
position:relative;
|
||||
width:100%;
|
||||
height:45%;
|
||||
padding:0px;
|
||||
margin:0px;
|
||||
}
|
||||
|
||||
.cansp{
|
||||
width:100%;
|
||||
height:100%;
|
||||
float:center;
|
||||
background-color:black;
|
||||
}
|
||||
|
||||
#div-wf
|
||||
{
|
||||
position:relative;
|
||||
width:100%;
|
||||
height:45%;
|
||||
padding:0px;
|
||||
margin:0px;
|
||||
}
|
||||
|
||||
.canwf{
|
||||
width:100%;
|
||||
height:100%;
|
||||
background:#00007f;
|
||||
background-color:bleu;
|
||||
}
|
||||
|
||||
#div-ctrl
|
||||
{
|
||||
display: inline-flex;
|
||||
background-color:#171717;
|
||||
position:fixed;
|
||||
width:100%;
|
||||
height:10%;
|
||||
padding:0px;
|
||||
margin:0px;
|
||||
left: 0%;
|
||||
align-items: center; /* Vertical */
|
||||
}
|
||||
|
||||
.ctrl_visual{
|
||||
margin: 0px 10px 0px 10px;
|
||||
}
|
||||
|
||||
#div-scoketscontrols
|
||||
{
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
#div-scoketscontrols > img
|
||||
{
|
||||
margin-right:5px;
|
||||
width:25px;
|
||||
height:25px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@@ -0,0 +1,32 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>FFT Universal Hamradio Remote by F4HTB</title>
|
||||
<link rel="stylesheet" type="text/css" href="panfft.css">
|
||||
</head>
|
||||
<body onload="bodyload();">
|
||||
<div id="div-princ">
|
||||
|
||||
<div id="div-sp">
|
||||
<canvas id="cansp" class="cansp" width="4096" height="256"></canvas>
|
||||
</div>
|
||||
|
||||
<div id="div-wf">
|
||||
<canvas id="canwf" class="canwf" width="4096" height="256"></canvas>
|
||||
</div>
|
||||
|
||||
<div id="div-ctrl">
|
||||
Center Frequency:<div class="ctrl_visual" id="div-CenterFrequency"></div>|
|
||||
SampleRate:<div class="ctrl_visual" id="div-SampleRate"></div>|
|
||||
FFT resolution:<div class="ctrl_visual" id="div-FFtResolution"></div>|
|
||||
Mouse Frequency:<div class="ctrl_visual" id="div-mouseFrequency"></div>|
|
||||
Windows Zoom:<div class="ctrl_visual" id="div-WindowsZoom">100%</div>|
|
||||
Spectrogram dynamic: <input oninput="set_FFT_Viso_Dynamic(this.value);" onchange="set_FFT_Viso_Dynamic(this.value);" value="60" step="5" type="range" name="FFT_Viso_Dynamic" min="20" max="120">
|
||||
Spectrogram min: <input oninput="set_FFT_Viso_min(this.value);" onchange="set_FFT_Viso_min(this.value);" value="-180" step="5" type="range" name="FFT_Viso_min" min="-200" max="30">
|
||||
</div>
|
||||
|
||||
<div id="div-scoketscontrols"><img src="img/critsred.png">wsFFT</div>
|
||||
</div>
|
||||
<script src="panfft.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,245 @@
|
||||
var canvas_width_SP=document.getElementById("cansp").width;
|
||||
var canvas_height_SP=document.getElementById("cansp").height;
|
||||
var canvas_width_WF=document.getElementById("canwf").width;
|
||||
var canvas_height_WF=document.getElementById("canwf").height;
|
||||
var wshFFT = "";
|
||||
var zoom_FFT=100;
|
||||
var samplerate = "960000";
|
||||
var FFTSIZE = 4096;
|
||||
var localcenterfrequency=0;
|
||||
var freqmouse=0;
|
||||
|
||||
var FFT_Viso_Dynamic=50
|
||||
var FFT_Viso_min=-180
|
||||
|
||||
|
||||
const visual_CenterFrequency = document.getElementById("div-CenterFrequency");
|
||||
const visual_SampleRate = document.getElementById("div-SampleRate");
|
||||
const visual_FFtResolution = document.getElementById("div-FFtResolution");
|
||||
const visual_freq = document.getElementById("div-mouseFrequency");
|
||||
const visual_WindowsZoom = document.getElementById("div-WindowsZoom");
|
||||
|
||||
const canvasSP = document.getElementById("cansp");
|
||||
const canvasWF = document.getElementById("canwf")
|
||||
|
||||
function bodyload(){
|
||||
initFFT();
|
||||
startFFT();
|
||||
}
|
||||
|
||||
function set_FFT_Viso_Dynamic(v){FFT_Viso_Dynamic=v;}
|
||||
function set_FFT_Viso_min(v){FFT_Viso_min=v;}
|
||||
|
||||
|
||||
|
||||
|
||||
function startFFT(){
|
||||
document.getElementById("div-scoketscontrols").innerHTML='<img src="img/critsgrey.png">wsFFT';
|
||||
wshFFT = new WebSocket( 'wss://' + window.location.href.split( '/' )[2] + '/WSpanFFT' );
|
||||
wshFFT.onopen = appendwshFFTOpen;
|
||||
wshFFT.onmessage = init_showFFT;
|
||||
wshFFT.onerror = appendwshFFTError;
|
||||
wshFFT.onclose = appendwshFFTclose;
|
||||
}
|
||||
|
||||
function appendwshFFTclose(){
|
||||
document.getElementById("div-scoketscontrols").innerHTML='<img src="img/critsred.png">wsFFT';
|
||||
}
|
||||
|
||||
function appendwshFFTOpen(){
|
||||
document.getElementById("div-scoketscontrols").innerHTML='<img src="img/critsgreen.png">wsFFT';
|
||||
wshFFT.send("init");
|
||||
}
|
||||
|
||||
function appendwshFFTError(err){
|
||||
document.getElementById("div-scoketscontrols").innerHTML='<img src="img/critsred.png">wsFFT';
|
||||
wshFFT.close();
|
||||
startFFT();
|
||||
}
|
||||
|
||||
function stopFFT(){
|
||||
wshFFT.close();
|
||||
initFFT();
|
||||
}
|
||||
|
||||
function initFFT(){
|
||||
initCanvas("cansp");
|
||||
initCanvas("canwf");
|
||||
}
|
||||
|
||||
var globmsg = "";
|
||||
|
||||
|
||||
|
||||
function init_showFFT( msg ){
|
||||
datas = msg.data.split(':');
|
||||
if(datas[0] == "fftsr"){
|
||||
samplerate=datas[1];
|
||||
}
|
||||
else if(datas[0] == "fftsz"){
|
||||
FFTSIZE=parseInt(datas[1]);
|
||||
canvasSP.width=parseInt(FFTSIZE);
|
||||
canvasWF.width=parseInt(FFTSIZE);
|
||||
var canvas_width_SP=document.getElementById("cansp").width;
|
||||
var canvas_height_SP=document.getElementById("cansp").height;
|
||||
var canvas_width_WF=document.getElementById("canwf").width;
|
||||
var canvas_height_WF=document.getElementById("canwf").height;
|
||||
}
|
||||
else if(datas[0] == "fftst"){
|
||||
visual_SampleRate.innerHTML = samplerate+"sps";
|
||||
visual_FFtResolution.innerHTML=samplerate/FFTSIZE+"hz/px";
|
||||
wshFFT.send("ready");
|
||||
window.opener.ControlTRX_getFreq();
|
||||
wshFFT.binaryType = 'arraybuffer';
|
||||
wshFFT.onmessage = showFFT;
|
||||
}
|
||||
}
|
||||
|
||||
function showFFT( msg ){
|
||||
var buffer = new Uint8Array(msg.data);
|
||||
let FFTdata = buffer.subarray(0, FFTSIZE);
|
||||
FFTdata_scale_min = ((buffer[FFTSIZE] << 8) + (buffer[FFTSIZE+1]))-65280;
|
||||
FFTdata_scale_max= ((buffer[FFTSIZE+2] << 8) + (buffer[FFTSIZE+3]))-65280;
|
||||
|
||||
min_Factor=FFTdata_scale_min-FFT_Viso_min;
|
||||
max_Factor=(FFTdata_scale_max-FFTdata_scale_min)/FFT_Viso_Dynamic;
|
||||
|
||||
SetImageDataWF(FFTdata,min_Factor,max_Factor);
|
||||
SetImageDataSP(FFTdata,min_Factor,max_Factor);
|
||||
}
|
||||
|
||||
|
||||
const ctxSP = canvasSP.getContext("2d");// imgObjSP = ctxSP.createImageData(canvasSP.width, canvas_height);
|
||||
const midle_SP = canvas_width_SP*2;
|
||||
|
||||
function SetImageDataSP(datas,scale_min,scale_max) {
|
||||
imgObjSP = new ImageData(canvasSP.width, canvas_height_SP);
|
||||
let i = 0;
|
||||
for(let Line = 0; Line < canvas_height_SP; Line++){
|
||||
i = 4*(Line * canvas_width_SP);
|
||||
y = canvas_height_SP - Line;
|
||||
for (let px = 0; px < canvas_width_SP; px++) {
|
||||
let dat = (datas[px]*scale_max + scale_min);
|
||||
if(y <= dat){
|
||||
//imgObjSP.data[i] = 0; // red
|
||||
imgObjSP.data[++i] = 215; // green
|
||||
imgObjSP.data[++i] = 233; // blue
|
||||
imgObjSP.data[++i] = 255; // alpha
|
||||
++i;
|
||||
}
|
||||
else{i += 4 ;}
|
||||
}
|
||||
i -= midle_SP ;
|
||||
//imgObjSP.data[i] = 0; // red
|
||||
imgObjSP.data[++i] = 255; // green
|
||||
imgObjSP.data[++i] = 0; // blue
|
||||
imgObjSP.data[++i] = 255; // alpha
|
||||
}
|
||||
ctxSP.putImageData(imgObjSP, 0, 0);
|
||||
}
|
||||
|
||||
const ctxWF = canvasWF.getContext("2d"),imgObjWF = ctxWF.createImageData(canvasWF.width, 1);
|
||||
//const colMap = [[0,0,0,255],[40,0,0,255],[56,0,4,255],[61,0,9,255],[64,0,12,255],[66,0,14,255],[69,0,17,255],[73,0,20,255],[74,0,22,255],[78,0,25,255],[79,0,27,255],[83,0,30,255],[85,0,31,255],[86,0,33,255],[90,0,36,255],[91,0,38,255],[93,0,39,255],[95,0,41,255],[96,0,43,255],[100,0,46,255],[102,0,47,255],[103,0,49,255],[105,0,51,255],[107,0,52,255],[108,0,54,255],[110,0,55,255],[112,0,57,255],[112,0,57,255],[113,0,58,255],[115,0,60,255],[117,0,62,255],[119,0,63,255],[120,0,65,255],[122,0,66,255],[124,0,68,255],[125,0,70,255],[127,0,71,255],[129,0,73,255],[129,0,73,255],[130,0,74,255],[132,0,76,255],[134,0,78,255],[136,0,79,255],[137,0,81,255],[139,0,82,255],[141,0,84,255],[142,0,86,255],[144,0,87,255],[146,0,89,255],[147,0,90,255],[149,0,92,255],[151,0,94,255],[151,0,94,255],[153,0,95,255],[154,0,97,255],[156,0,98,255],[158,0,100,255],[159,0,102,255],[161,0,103,255],[163,0,105,255],[164,0,106,255],[166,0,108,255],[168,0,109,255],[170,0,111,255],[171,0,113,255],[173,0,114,255],[175,0,116,255],[176,0,117,255],[178,0,119,255],[180,0,121,255],[180,0,121,255],[181,0,122,255],[183,0,124,255],[185,0,125,255],[187,0,127,255],[188,0,129,255],[190,0,130,255],[192,0,132,255],[193,0,133,255],[195,0,135,255],[197,0,137,255],[198,0,138,255],[200,0,140,255],[202,0,141,255],[204,0,143,255],[204,0,143,255],[205,0,145,255],[207,0,146,255],[209,0,148,255],[210,0,149,255],[212,0,151,255],[214,0,153,255],[215,0,154,255],[217,0,156,255],[219,0,157,255],[221,0,159,255],[222,0,160,255],[222,0,160,255],[224,0,162,255],[226,0,164,255],[227,0,165,255],[229,0,167,255],[231,0,168,255],[232,0,170,255],[234,0,172,255],[236,0,173,255],[238,0,175,255],[238,0,175,255],[239,0,176,255],[241,0,178,255],[243,0,180,255],[244,0,181,255],[246,0,183,255],[248,2,184,255],[249,4,186,255],[249,4,186,255],[249,4,186,255],[251,6,188,255],[251,6,188,255],[253,9,189,255],[253,9,189,255],[255,11,191,255],[255,11,191,255],[255,13,192,255],[255,13,192,255],[255,13,192,255],[255,16,194,255],[255,18,196,255],[255,20,197,255],[255,20,197,255],[255,23,199,255],[255,25,200,255],[255,27,202,255],[255,30,204,255],[255,32,205,255],[255,34,207,255],[255,37,208,255],[255,37,208,255],[255,39,210,255],[255,41,211,255],[255,44,213,255],[255,46,215,255],[255,48,216,255],[255,51,218,255],[255,53,219,255],[255,53,219,255],[255,55,221,255],[255,57,223,255],[255,60,224,255],[255,62,226,255],[255,64,227,255],[255,67,229,255],[255,67,229,255],[255,69,231,255],[255,71,232,255],[255,74,234,255],[255,76,235,255],[255,78,237,255],[255,81,239,255],[255,81,239,255],[255,83,240,255],[255,85,242,255],[255,88,243,255],[255,90,245,255],[255,92,247,255],[255,95,248,255],[255,95,248,255],[255,97,250,255],[255,99,251,255],[255,102,253,255],[255,104,255,255],[255,106,255,255],[255,106,255,255],[255,108,255,255],[255,111,255,255],[255,113,255,255],[255,115,255,255],[255,115,255,255],[255,118,255,255],[255,120,255,255],[255,122,255,255],[255,122,255,255],[255,125,255,255],[255,127,255,255],[255,129,255,255],[255,129,255,255],[255,132,255,255],[255,134,255,255],[255,136,255,255],[255,136,255,255],[255,139,255,255],[255,141,255,255],[255,143,255,255],[255,143,255,255],[255,146,255,255],[255,148,255,255],[255,150,255,255],[255,150,255,255],[255,153,255,255],[255,155,255,255],[255,155,255,255],[255,157,255,255],[255,159,255,255],[255,159,255,255],[255,162,255,255],[255,164,255,255],[255,164,255,255],[255,166,255,255],[255,169,255,255],[255,171,255,255],[255,171,255,255],[255,173,255,255],[255,176,255,255],[255,176,255,255],[255,178,255,255],[255,180,255,255],[255,180,255,255],[255,183,255,255],[255,185,255,255],[255,185,255,255],[255,187,255,255],[255,190,255,255],[255,190,255,255],[255,192,255,255],[255,194,255,255],[255,197,255,255],[255,197,255,255],[255,199,255,255],[255,201,255,255],[255,204,255,255],[255,204,255,255],[255,206,255,255],[255,208,255,255],[255,210,255,255],[255,210,255,255],[255,213,255,255],[255,215,255,255],[255,217,255,255],[255,217,255,255],[255,220,255,255],[255,222,255,255],[255,224,255,255],[255,227,255,255],[255,229,255,255],[255,229,255,255],[255,231,255,255],[255,234,255,255],[255,236,255,255],[255,238,255,255],[255,241,255,255],[255,243,255,255],[255,243,255,255],[255,245,255,255],[255,248,255,255],[255,250,255,255],[255,255,255,255]];
|
||||
const colMap = [[0,0,127,255],[0,0,131,255],[0,0,135,255],[0,0,139,255],[0,0,143,255],[0,0,147,255],[0,0,151,255],[0,0,155,255],[0,0,159,255],[0,0,163,255],[0,0,167,255],[0,0,171,255],[0,0,175,255],[0,0,179,255],[0,0,183,255],[0,0,187,255],[0,0,191,255],[0,0,195,255],[0,0,199,255],[0,0,203,255],[0,0,207,255],[0,0,211,255],[0,0,215,255],[0,0,219,255],[0,0,223,255],[0,0,227,255],[0,0,231,255],[0,0,235,255],[0,0,239,255],[0,0,243,255],[0,0,247,255],[0,0,251,255],[0,0,255,255],[0,4,255,255],[0,8,255,255],[0,12,255,255],[0,16,255,255],[0,20,255,255],[0,24,255,255],[0,28,255,255],[0,32,255,255],[0,36,255,255],[0,40,255,255],[0,44,255,255],[0,48,255,255],[0,52,255,255],[0,56,255,255],[0,60,255,255],[0,64,255,255],[0,68,255,255],[0,72,255,255],[0,76,255,255],[0,80,255,255],[0,84,255,255],[0,88,255,255],[0,92,255,255],[0,96,255,255],[0,100,255,255],[0,104,255,255],[0,108,255,255],[0,112,255,255],[0,116,255,255],[0,120,255,255],[0,124,255,255],[0,128,255,255],[0,132,255,255],[0,136,255,255],[0,140,255,255],[0,144,255,255],[0,148,255,255],[0,152,255,255],[0,156,255,255],[0,160,255,255],[0,164,255,255],[0,168,255,255],[0,172,255,255],[0,176,255,255],[0,180,255,255],[0,184,255,255],[0,188,255,255],[0,192,255,255],[0,196,255,255],[0,200,255,255],[0,204,255,255],[0,208,255,255],[0,212,255,255],[0,216,255,255],[0,220,255,255],[0,224,255,255],[0,228,255,255],[0,232,255,255],[0,236,255,255],[0,240,255,255],[0,244,255,255],[0,248,255,255],[0,252,255,255],[1,255,253,255],[5,255,249,255],[9,255,245,255],[13,255,241,255],[17,255,237,255],[21,255,233,255],[25,255,229,255],[29,255,225,255],[33,255,221,255],[37,255,217,255],[41,255,213,255],[45,255,209,255],[49,255,205,255],[53,255,201,255],[57,255,197,255],[61,255,193,255],[65,255,189,255],[69,255,185,255],[73,255,181,255],[77,255,177,255],[81,255,173,255],[85,255,169,255],[89,255,165,255],[93,255,161,255],[97,255,157,255],[101,255,153,255],[105,255,149,255],[109,255,145,255],[113,255,141,255],[117,255,137,255],[121,255,133,255],[125,255,129,255],[129,255,125,255],[133,255,121,255],[137,255,117,255],[141,255,113,255],[145,255,109,255],[149,255,105,255],[153,255,101,255],[157,255,97,255],[161,255,93,255],[165,255,89,255],[169,255,85,255],[173,255,81,255],[177,255,77,255],[181,255,73,255],[185,255,69,255],[189,255,65,255],[193,255,61,255],[197,255,57,255],[201,255,53,255],[205,255,49,255],[209,255,45,255],[213,255,41,255],[217,255,37,255],[221,255,33,255],[225,255,29,255],[229,255,25,255],[233,255,21,255],[237,255,17,255],[241,255,13,255],[245,255,9,255],[249,255,5,255],[253,255,1,255],[255,252,0,255],[255,248,0,255],[255,244,0,255],[255,240,0,255],[255,236,0,255],[255,232,0,255],[255,228,0,255],[255,224,0,255],[255,220,0,255],[255,216,0,255],[255,212,0,255],[255,208,0,255],[255,204,0,255],[255,200,0,255],[255,196,0,255],[255,192,0,255],[255,188,0,255],[255,184,0,255],[255,180,0,255],[255,176,0,255],[255,172,0,255],[255,168,0,255],[255,164,0,255],[255,160,0,255],[255,156,0,255],[255,152,0,255],[255,148,0,255],[255,144,0,255],[255,140,0,255],[255,136,0,255],[255,132,0,255],[255,128,0,255],[255,124,0,255],[255,120,0,255],[255,116,0,255],[255,112,0,255],[255,108,0,255],[255,104,0,255],[255,100,0,255],[255,96,0,255],[255,92,0,255],[255,88,0,255],[255,84,0,255],[255,80,0,255],[255,76,0,255],[255,72,0,255],[255,68,0,255],[255,64,0,255],[255,60,0,255],[255,56,0,255],[255,52,0,255],[255,48,0,255],[255,44,0,255],[255,40,0,255],[255,36,0,255],[255,32,0,255],[255,28,0,255],[255,24,0,255],[255,20,0,255],[255,16,0,255],[255,12,0,255],[255,8,0,255],[255,4,0,255],[255,0,0,255],[251,0,0,255],[247,0,0,255],[243,0,0,255],[239,0,0,255],[235,0,0,255],[231,0,0,255],[227,0,0,255],[223,0,0,255],[219,0,0,255],[215,0,0,255],[211,0,0,255],[207,0,0,255],[203,0,0,255],[199,0,0,255],[195,0,0,255],[191,0,0,255],[187,0,0,255],[183,0,0,255],[179,0,0,255],[175,0,0,255],[171,0,0,255],[167,0,0,255],[163,0,0,255],[159,0,0,255],[155,0,0,255],[151,0,0,255],[147,0,0,255],[143,0,0,255],[139,0,0,255],[135,0,0,255],[131,0,0,255],[127,0,0,255]];
|
||||
const midle_WF = canvas_width_WF*2;
|
||||
|
||||
function SetImageDataWF(datas,scale_min,scale_max) {
|
||||
var canvasBuffer = document.createElement("canvas");
|
||||
canvasBuffer.width = canvas_width_WF;
|
||||
canvasBuffer.height = canvas_height_WF;
|
||||
var ctxBuffer = canvasBuffer.getContext("2d");
|
||||
|
||||
ctxBuffer.clearRect(0,0,canvas_width_WF,canvas_height_WF); //clear buffer
|
||||
ctxBuffer.drawImage(canvasWF,0,0); //store display data in buffer
|
||||
ctxWF.clearRect(0,0,canvas_width_WF,canvas_height_WF); //clear display
|
||||
ctxWF.drawImage(canvasBuffer,0,1); //copy buffer to display
|
||||
|
||||
|
||||
var px=0;
|
||||
var i=0;
|
||||
for (px = 0; px < canvas_width_WF; px++) {
|
||||
i = 4*px;
|
||||
|
||||
let dat = Math.floor(datas[px]*scale_max + scale_min);
|
||||
|
||||
if(dat<0){dat=0;}
|
||||
if(dat>255){dat=255;}
|
||||
|
||||
// let rgba = colMap[datas[px]]; // lookup color rgba values
|
||||
imgObjWF.data[i] = colMap[dat][0]; // red
|
||||
imgObjWF.data[i+1] = colMap[dat][1]; // green
|
||||
imgObjWF.data[i+2] = colMap[dat][2]; // blue
|
||||
imgObjWF.data[i+3] = colMap[dat][3]; // alpha
|
||||
}
|
||||
|
||||
imgObjWF.data[midle_WF] = 0;
|
||||
imgObjWF.data[midle_WF+1] = 255;
|
||||
imgObjWF.data[midle_WF+2] = 0;
|
||||
imgObjWF.data[midle_WF+3] = 255;
|
||||
|
||||
ctxWF.putImageData(imgObjWF, 0, 0);
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
function initCanvas(cvsIDwf) {
|
||||
var canvas = document.getElementById(cvsIDwf);
|
||||
var ctx = canvas.getContext("2d");
|
||||
ctx.fillStyle = "black";
|
||||
ctx.fillRect(0, 0, canvas.width, canvas.height);
|
||||
|
||||
canvas.addEventListener('wheel', (event) => {
|
||||
set_FFT_zoom();
|
||||
event.stopImmediatePropagation(); // WORKED!!
|
||||
}, false)
|
||||
|
||||
canvas.addEventListener('mousemove', showOnmouseInfo, false);
|
||||
|
||||
canvas.addEventListener('mouseout', function(event) {visual_freq.innerHTML="∞hz";}, false);
|
||||
|
||||
canvas.addEventListener('click', function() {window.opener.sendTRXfreq(freqmouse);}, false);
|
||||
|
||||
}
|
||||
|
||||
|
||||
function showOnmouseInfo(event) {
|
||||
var rect = this.getBoundingClientRect()
|
||||
var scaleX = this.width / rect.width; // relationship bitmap vs. element for X
|
||||
var hzperpixel=samplerate/this.width;
|
||||
// console.log(this.width);
|
||||
// console.log(rect.width);
|
||||
|
||||
hz=((window.scrollX+event.clientX)*scaleX*hzperpixel)-(samplerate/2);
|
||||
freqmouse=window.opener.TRXfrequency+hz;
|
||||
//var scale_hz = Math.exp(parseInt(document.getElementById("canBFFFT_scale_multhz").value)/100);
|
||||
// var start = (parseInt(document.getElementById("canBFFFT_scale_start").value)*Audio_analyser.frequencyBinCount/100)*scale_hz;
|
||||
|
||||
// scaleY = canvas.height / rect.height; // relationship bitmap vs. element for Y
|
||||
// var scale_mult = Math.exp(parseInt(document.getElementById("canBFFFT_scale_multdb").value)/100);
|
||||
// var scale_floor = parseInt(document.getElementById("canBFFFT_scale_floor").value);
|
||||
|
||||
// console.log(parseInt(((((evt.clientX - rect.left)/(scale_hz*scale_hz) * scaleX ) - (start/scale_hz))* (AudioRX_sampleRate/2))/canvasBFFFT.width) + 'hz ,-' + parseInt(((evt.clientY - rect.top) * scaleY)/(scale_mult) + (scale_floor))+'dB');
|
||||
//console.log(scaleX);
|
||||
//console.log(window.opener.TRXfrequency);
|
||||
//console.log(event.clientX);
|
||||
visual_freq.innerHTML=Math.floor(freqmouse)+"hz";
|
||||
}
|
||||
|
||||
|
||||
function set_FFT_zoom() {
|
||||
if(event.deltaY>0){
|
||||
if(zoom_FFT >= 150){zoom_FFT/=1.5;}
|
||||
}else{
|
||||
zoom_FFT*=1.5;
|
||||
}
|
||||
visual_WindowsZoom.innerHTML=canvasWF.style.width = canvasSP.style.width = zoom_FFT + "%";
|
||||
window.scroll((window.screen.width*(zoom_FFT/100)/2)-window.screen.width/2, 0);
|
||||
visual_FFtResolution.innerHTML=Math.floor(samplerate/FFTSIZE/(zoom_FFT/100))+"hz/px";
|
||||
}
|
||||
|
||||
|
||||
function setcenterfrequency (freq){
|
||||
localcenterfrequency=freq;
|
||||
visual_CenterFrequency.innerHTML=localcenterfrequency+"hz";;
|
||||
}
|
||||
@@ -0,0 +1,639 @@
|
||||
body {
|
||||
color: white;
|
||||
font:normal bold 14px tahoma;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
/* overflow: hidden; */
|
||||
}
|
||||
|
||||
#ombre-body{
|
||||
display: none;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(0,0,0,0.7);
|
||||
z-index: 1000;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
#pop-upspinner{
|
||||
display: none;
|
||||
position: fixed;
|
||||
left: calc(50% - 100px);
|
||||
top: 50%;
|
||||
z-index: 2000;
|
||||
cursor: default;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#div-princ {
|
||||
margin: 20px auto;
|
||||
width: 1800px;
|
||||
height: 860px;
|
||||
background-color:#171717;
|
||||
box-shadow:5px 5px 5px 5px rgba(0, 0, 0, 0.5),0px 0px 0px 0px rgba(255, 255, 255, 0.5) inset;
|
||||
border-radius: 30px 30px 30px 30px ;
|
||||
position:relative
|
||||
}
|
||||
|
||||
#button_power
|
||||
{
|
||||
position:absolute;
|
||||
left:105px;
|
||||
top:105px;
|
||||
width:150px;
|
||||
height:150px;
|
||||
}
|
||||
|
||||
.button_pressed{
|
||||
box-shadow:0px 2px 2px 0px rgba(0, 0, 0, 0.5) inset,0px 2px 2px 0px rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.button_unpressed{
|
||||
box-shadow:0px 2px 2px 0px rgba(0, 0, 0, 0.5),0px 2px 2px 0px rgba(255, 255, 255, 0.5) inset;
|
||||
}
|
||||
|
||||
.button_white{
|
||||
color: #e0e0e0;
|
||||
background: #a5cd4e;
|
||||
}
|
||||
|
||||
.button_green {
|
||||
color: #7FFF00;
|
||||
text-shadow: 0 0 10px #6a6767, 0 0 20px #444, 0 0 30px #515151, 0 0 40px #FFFAFC, 0 0 70px #3AFF11, 0 0 80px #45FF11, 0 0 100px #4F4F4F, 0 0 150px #18FF11;
|
||||
}
|
||||
|
||||
.button_red {
|
||||
color: #ff3a3a;
|
||||
background: #a5cd4e;
|
||||
}
|
||||
|
||||
.button_blue {
|
||||
color: #176fff;
|
||||
background: #70c9e3;
|
||||
}
|
||||
|
||||
#callsign{
|
||||
position:absolute;
|
||||
left: 1450px;
|
||||
top:20px;
|
||||
height:80px;
|
||||
width:300px;
|
||||
font: normal bold 25px tahoma;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
#callsign > a > img{
|
||||
height:25px;
|
||||
width:25px;
|
||||
}
|
||||
|
||||
#personalfrequency
|
||||
{
|
||||
position:absolute;
|
||||
left: 1450px;
|
||||
top:420px;
|
||||
height:110px;
|
||||
width:300px;
|
||||
font: normal bold 25px tahoma;
|
||||
text-align:center;
|
||||
margin:0px;
|
||||
padding:0px;
|
||||
}
|
||||
|
||||
#personalfrequency > select
|
||||
{
|
||||
width:300px;
|
||||
font: normal bold 25px tahoma;
|
||||
}
|
||||
|
||||
#div-bandshortcut
|
||||
{
|
||||
position:absolute;
|
||||
left: 1450px;
|
||||
top:250px;
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
#div-bandshortcut > ul
|
||||
{
|
||||
padding:0;
|
||||
margin:0px;
|
||||
width:300px;
|
||||
}
|
||||
|
||||
#div-bandshortcut > ul > li {
|
||||
display: inline-block;
|
||||
font:normal bold 25px tahoma;
|
||||
text-align:center;
|
||||
width:32%;
|
||||
}
|
||||
|
||||
#div-customfilter
|
||||
{
|
||||
position:absolute;
|
||||
left: 425px;
|
||||
top:600px;
|
||||
width: 450px;
|
||||
height:200px;
|
||||
display:none;
|
||||
z-index:100;
|
||||
background-color:#171717;
|
||||
}
|
||||
|
||||
#div-filtershortcut
|
||||
{
|
||||
position:absolute;
|
||||
left: 425px;
|
||||
top:600px;
|
||||
width: 450px;
|
||||
height:200px;
|
||||
}
|
||||
|
||||
#div-filtershortcut > ul
|
||||
{
|
||||
padding:0;
|
||||
width: 450px;
|
||||
height:200px;
|
||||
margin:0px;
|
||||
padding:0px;
|
||||
}
|
||||
|
||||
#div-filtershortcut > ul > li {
|
||||
display: inline-block;
|
||||
font:normal bold 25px tahoma;
|
||||
text-align:center;
|
||||
width:32%;
|
||||
}
|
||||
|
||||
|
||||
#div-freq
|
||||
{
|
||||
position:absolute;
|
||||
left: 425px;
|
||||
top:80px;
|
||||
height: 200px;
|
||||
width:450px;
|
||||
}
|
||||
|
||||
#div-freq > ul > li {
|
||||
display: inline-block;
|
||||
font:normal bold 37px tahoma;
|
||||
text-align:center;
|
||||
width:8%;
|
||||
}
|
||||
|
||||
#freq_disp{
|
||||
border-radius: 5px 5px 5px 5px ;
|
||||
box-shadow:0px 2px 2px 0px rgba(0, 0, 0, 0.5) inset,0px 2px 2px 0px rgba(255, 255, 255, 0.5);
|
||||
background-color: black;
|
||||
width:450px;
|
||||
padding-top:5px;
|
||||
padding-left:0px;
|
||||
margin-top:10px;
|
||||
margin-bottom:10px;
|
||||
height: 60px;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
#freq_disp > ul > li {
|
||||
display: inline-block;
|
||||
font:normal bold 14px tahoma;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
#freq_disp > ul > li:before{
|
||||
content: '';
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#freq_disp_input_text{
|
||||
content: '';
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
height: 100%;
|
||||
width:100%;
|
||||
font:normal bold 45px tahoma;
|
||||
text-align:center;
|
||||
display:none;
|
||||
}
|
||||
|
||||
#freq_but{
|
||||
width:450px;
|
||||
margin:0;
|
||||
padding-left:0px;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
#freq_but > ul > li {
|
||||
display: inline-block;
|
||||
font:normal bold 14px tahoma;
|
||||
text-align:center;
|
||||
margin-top:5px;
|
||||
margin-bottom:5px;
|
||||
width:8%;
|
||||
}
|
||||
|
||||
#freq_but > ul > li:before{
|
||||
content: '';
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
height: 100%;
|
||||
margin-top:5px;
|
||||
margin-bottom:5px;
|
||||
width:8%;
|
||||
}
|
||||
|
||||
#div-scoketscontrols
|
||||
{
|
||||
position:absolute;
|
||||
left: 1100px;
|
||||
top:800px;
|
||||
width: 580px;
|
||||
}
|
||||
|
||||
#div-scoketscontrols > p
|
||||
{
|
||||
display: inline-block;
|
||||
font:normal bold 25px tahoma;
|
||||
text-align:center;
|
||||
margin-right:10px;
|
||||
}
|
||||
|
||||
#div-scoketscontrols > p > img
|
||||
{
|
||||
margin-right:5px;
|
||||
width:25px;
|
||||
height:25px;
|
||||
}
|
||||
|
||||
#div-conf
|
||||
{
|
||||
position:absolute;
|
||||
left: 1750px;
|
||||
top:20px;
|
||||
width: 580px;
|
||||
}
|
||||
|
||||
#div-conf > a > img
|
||||
{
|
||||
margin-right:5px;
|
||||
width:25px;
|
||||
height:25px;
|
||||
}
|
||||
|
||||
#div-panfft
|
||||
{
|
||||
position:absolute;
|
||||
left: 1750px;
|
||||
top:55px;
|
||||
width: 580px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#div-panfft > a > img
|
||||
{
|
||||
margin-right:5px;
|
||||
width:25px;
|
||||
height:25px;
|
||||
}
|
||||
|
||||
#div-latencymeter
|
||||
{
|
||||
font:normal bold 25px tahoma;
|
||||
position:absolute;
|
||||
left:1600px;
|
||||
top:825px;
|
||||
}
|
||||
|
||||
#div-latencymeter > img
|
||||
{
|
||||
margin-right:5px;
|
||||
width:25px;
|
||||
height:25px;
|
||||
}
|
||||
|
||||
#RX-GAIN_control
|
||||
{
|
||||
width:300px;
|
||||
height:140px;
|
||||
position:absolute;
|
||||
left:50px;
|
||||
top:300px;
|
||||
font:normal bold 25px tahoma;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
div#Txmeters > div {
|
||||
text-align:center;
|
||||
width:300px;
|
||||
position:absolute;
|
||||
left: 50px;
|
||||
top:600px;
|
||||
font:normal bold 25px tahoma;
|
||||
}
|
||||
|
||||
div#Txmeters div.label {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
div#Txmeters div.value {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
div#Rxmeters > div {
|
||||
text-align:center;
|
||||
width:300px;
|
||||
position:absolute;
|
||||
left: 50px;
|
||||
top:380px;
|
||||
font:normal bold 25px tahoma;
|
||||
}
|
||||
|
||||
div#Rxmeters div.label {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
div#Rxmeters div.value {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#TX-GAIN_control
|
||||
{
|
||||
width:300px;
|
||||
height:140px;
|
||||
position:absolute;
|
||||
left:50px;
|
||||
top:530px;
|
||||
font:normal bold 25px tahoma;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
#div-TX{
|
||||
position:absolute;
|
||||
left:1450px;
|
||||
top:590px;
|
||||
width: 300px;
|
||||
height: 200px;
|
||||
}
|
||||
#TX-record
|
||||
{
|
||||
text-align:center;
|
||||
font:normal bold 90px tahoma;
|
||||
height:140px;
|
||||
width:100%;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#TX-record_record_opus
|
||||
{
|
||||
font:normal bold 10px tahoma;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
#TX-record-lock
|
||||
{
|
||||
text-align:center;
|
||||
font:normal bold 25px tahoma;
|
||||
height:50px;
|
||||
width:100%;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#record_opus
|
||||
{
|
||||
text-align:center;
|
||||
width:200px;
|
||||
height:170px;
|
||||
width:100%;
|
||||
}
|
||||
|
||||
#canBFSPC{
|
||||
position:absolute;
|
||||
left:425px;
|
||||
top:320px;
|
||||
width:450px;
|
||||
height:250px;
|
||||
background:black;
|
||||
background-color:black;
|
||||
border-radius: 5px 5px 5px 5px;
|
||||
box-shadow:0px 2px 2px 0px rgba(0, 0, 0, 0.5) inset,0px 2px 2px 0px rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
#canBFFFT{
|
||||
position:absolute;
|
||||
left:950px;
|
||||
top:320px;
|
||||
width:450px;
|
||||
height:250px;
|
||||
background:black;
|
||||
background-color:black;
|
||||
border-radius: 5px 5px 5px 5px;
|
||||
box-shadow:0px 2px 2px 0px rgba(0, 0, 0, 1) inset,0px 2px 2px 0px rgba(255, 255, 255, 1);
|
||||
}
|
||||
.slider-wrapper{
|
||||
-webkit-appearance: none;
|
||||
height: 0px;
|
||||
border-radius: 5px;
|
||||
outline: none;
|
||||
opacity: 0.4;
|
||||
-webkit-transition: .2s;
|
||||
transition: opacity .2s;
|
||||
background: #FF0000;
|
||||
}
|
||||
|
||||
.slider-wrapper:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.slider-wrapper:hover::-moz-range-thumb{
|
||||
opacity: 1;
|
||||
height: 10px;
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
.slider-wrapper::-webkit-slider-thumb{
|
||||
background: #FF0000;
|
||||
}
|
||||
|
||||
.slider-wrapper::-moz-range-thumb{
|
||||
background: #FF0000;
|
||||
height: 4px;
|
||||
width: 4px;
|
||||
}
|
||||
|
||||
.slider-wrapper_floor{
|
||||
width: 250px;
|
||||
height: 0px;
|
||||
margin: 0;
|
||||
transform-origin: 75px 75px;
|
||||
transform: rotate(-90deg);
|
||||
position:absolute;
|
||||
left: 940px;
|
||||
top: 420px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.slider-wrapper_multdb{
|
||||
width: 250px;
|
||||
height: 0px;
|
||||
margin: 0;
|
||||
transform-origin: 75px 75px;
|
||||
transform: rotate(+90deg);
|
||||
position:absolute;
|
||||
left: 1260px;
|
||||
top: 320px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.slider-wrapper_start{
|
||||
width: 450px;
|
||||
height: 0px;
|
||||
margin: 0;
|
||||
transform-origin: 75px 75px;
|
||||
transform: rotate(+180deg);
|
||||
position:absolute;
|
||||
left: 1250px;
|
||||
top: 430px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.slider-wrapper_multhz{
|
||||
width: 450px;
|
||||
height: 0px;
|
||||
margin: 0;
|
||||
position:absolute;
|
||||
left: 950px;
|
||||
top: 310px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
#canvasBFFFT_coord{
|
||||
position:absolute;
|
||||
top:600px;
|
||||
left:950px;
|
||||
z-index: 4;
|
||||
display: none;
|
||||
margin:0px;
|
||||
padding:0px;
|
||||
}
|
||||
|
||||
#div-mode_menu
|
||||
{
|
||||
position:absolute;
|
||||
left: 950px;
|
||||
top:80px;
|
||||
width: 450px;
|
||||
height:200px;
|
||||
}
|
||||
|
||||
#div-mode_menu > ul
|
||||
{
|
||||
padding:0;
|
||||
margin:0;
|
||||
width:450px;
|
||||
height:200px;
|
||||
}
|
||||
|
||||
#div-mode_menu > ul > li {
|
||||
display: inline-block;
|
||||
font: normal bold 45px tahoma;
|
||||
}
|
||||
|
||||
#div-mode_menu > ul > li:before{
|
||||
content: '';
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.button_mode{
|
||||
width:222px;
|
||||
height: 65px;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
|
||||
#canRXsmeter{
|
||||
position:absolute;
|
||||
left:1475px;
|
||||
top:80px;
|
||||
width:250px;
|
||||
height:50px;
|
||||
background:black;
|
||||
background-color:black;
|
||||
border-radius: 5px 5px 5px 5px;
|
||||
box-shadow:0px 2px 2px 0px rgba(0, 0, 0, 0.5) inset,0px 2px 2px 0px rgba(255, 255, 255, 0.5);
|
||||
background: url(img/smeter.png) no-repeat center center
|
||||
}
|
||||
|
||||
#div-smeterdigitRX
|
||||
{
|
||||
position:absolute;
|
||||
left:1475px;
|
||||
top:140px;
|
||||
text-align:center;
|
||||
font: normal bold 25px tahoma;
|
||||
width: 250px;
|
||||
}
|
||||
|
||||
#SQUELCH_control
|
||||
{
|
||||
margin:0px;
|
||||
padding:0px;
|
||||
width:300px;
|
||||
height:70px;
|
||||
position:absolute;
|
||||
left:1450px;
|
||||
top:180px;
|
||||
font:normal bold 25px tahoma;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
/* @group Blink */
|
||||
.blink {
|
||||
-webkit-animation: blink .75s linear infinite;
|
||||
-moz-animation: blink .75s linear infinite;
|
||||
-ms-animation: blink .75s linear infinite;
|
||||
-o-animation: blink .75s linear infinite;
|
||||
animation: blink .75s linear infinite;
|
||||
}
|
||||
@-webkit-keyframes blink {
|
||||
0% { opacity: 1; }
|
||||
50% { opacity: 1; }
|
||||
50.01% { opacity: 0; }
|
||||
100% { opacity: 0; }
|
||||
}
|
||||
@-moz-keyframes blink {
|
||||
0% { opacity: 1; }
|
||||
50% { opacity: 1; }
|
||||
50.01% { opacity: 0; }
|
||||
100% { opacity: 0; }
|
||||
}
|
||||
@-ms-keyframes blink {
|
||||
0% { opacity: 1; }
|
||||
50% { opacity: 1; }
|
||||
50.01% { opacity: 0; }
|
||||
100% { opacity: 0; }
|
||||
}
|
||||
@-o-keyframes blink {
|
||||
0% { opacity: 1; }
|
||||
50% { opacity: 1; }
|
||||
50.01% { opacity: 0; }
|
||||
100% { opacity: 0; }
|
||||
}
|
||||
@keyframes blink {
|
||||
0% { opacity: 1; }
|
||||
50% { opacity: 1; }
|
||||
50.01% { opacity: 0; }
|
||||
100% { opacity: 0; }
|
||||
}
|
||||
/* @end */
|
||||