Merge pull request #20 from Gnoxter/master
Volume Slider and Mute Button
This commit is contained in:
András Retzler
commit
3632c53985
@ -72,16 +72,23 @@
|
||||
<!-- add canvas here by javascript -->
|
||||
</div>
|
||||
<div id="openwebrx-panels-container">
|
||||
<div class="openwebrx-panel" id="openwebrx-panel-receiver" data-panel-name="client-params" data-panel-pos="right" data-panel-order="0" data-panel-size="215,70">
|
||||
<div class="openwebrx-panel" id="openwebrx-panel-receiver" data-panel-name="client-params" data-panel-pos="right" data-panel-order="0" data-panel-size="215,115">
|
||||
<div id="webrx-actual-freq">---.--- MHz</div>
|
||||
<div id="webrx-mouse-freq">---.--- MHz</div>
|
||||
<!--<div class="openwebrx-button" onclick="ws.send('SET mod=wfm');" >WFM</div>-->
|
||||
<div class="openwebrx-button" onclick="demodulator_analog_replace('nfm');">FM</div>
|
||||
<div class="openwebrx-button" onclick="demodulator_analog_replace('am');">AM</div>
|
||||
<div class="openwebrx-button" onclick="demodulator_analog_replace('am');">AM</div>
|
||||
<div class="openwebrx-button" onclick="demodulator_analog_replace('lsb');">LSB</div>
|
||||
<div class="openwebrx-button" onclick="demodulator_analog_replace('usb');">USB</div>
|
||||
<div class="openwebrx-button" onclick="demodulator_analog_replace('cw');">CW</div>
|
||||
|
||||
<div>Volume:
|
||||
<input id="openwebrx-panel-volume" type="range" min="0" max="150" value="50" step="1" onchange="updateVolume()" oninput="updateVolume()">
|
||||
</div>
|
||||
<div id="openwebrx-mute-off" class="openwebrx-button" onclick="toggleMute()">Mute</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="openwebrx-panel" id="openwebrx-panel-log" data-panel-name="debug" data-panel-pos="left" data-panel-order="1" data-panel-size="619,142">
|
||||
<div class="openwebrx-panel-inner" id="openwebrx-log-scroll">
|
||||
<div id="openwebrx-client-log-title">OpenWebRX (beta) client log<span style="color: #ff5900;"></span> </strong><span id="openwebrx-problems"></span></div>
|
||||
|
||||
@ -23,11 +23,128 @@ html, body
|
||||
{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
height: 100%;
|
||||
font-family: "DejaVu Sans", Verdana, Geneva, sans-serif;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
input
|
||||
{
|
||||
vertical-align:middle;
|
||||
}
|
||||
|
||||
input[type=range]
|
||||
{
|
||||
-webkit-appearance: none;
|
||||
margin: 10px 0;
|
||||
width: 100%;
|
||||
}
|
||||
input[type=range]:focus
|
||||
{
|
||||
outline: none;
|
||||
}
|
||||
|
||||
input[type=range]::-webkit-slider-runnable-track
|
||||
{
|
||||
width: 100%;
|
||||
height: 7px;
|
||||
cursor: pointer;
|
||||
animate: 0.2s;
|
||||
box-shadow: 0px 0px 0px #000000;
|
||||
background: #B6B6B6;
|
||||
border-radius: 11px;
|
||||
border: 1px solid #8A8A8A;
|
||||
}
|
||||
|
||||
input[type=range]::-webkit-slider-thumb
|
||||
{
|
||||
box-shadow: 1px 1px 1px #828282;
|
||||
border: 1px solid #8A8A8A;
|
||||
height: 24px;
|
||||
width: 7px;
|
||||
border-radius: 0px;
|
||||
background: #FFFFFF;
|
||||
cursor: pointer;
|
||||
-webkit-appearance: none;
|
||||
margin-top: -9.5px;
|
||||
}
|
||||
|
||||
input[type=range]:focus::-webkit-slider-runnable-track
|
||||
{
|
||||
background: #B6B6B6;
|
||||
}
|
||||
|
||||
input[type=range]::-moz-range-track
|
||||
{
|
||||
width: 100%;
|
||||
height: 7px;
|
||||
cursor: pointer;
|
||||
animate: 0.2s;
|
||||
box-shadow: 0px 0px 0px #000000;
|
||||
background: #B6B6B6;
|
||||
border-radius: 11px;
|
||||
border: 1px solid #8A8A8A;
|
||||
}
|
||||
|
||||
input[type=range]::-moz-range-thumb
|
||||
{
|
||||
box-shadow: 1px 1px 1px #828282;
|
||||
border: 1px solid #8A8A8A;
|
||||
height: 24px;
|
||||
width: 7px;
|
||||
border-radius: 0px;
|
||||
background: #FFFFFF;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
input[type=range]::-ms-track
|
||||
{
|
||||
width: 100%;
|
||||
height: 7px;
|
||||
cursor: pointer;
|
||||
animate: 0.2s;
|
||||
background: transparent;
|
||||
border-color: transparent;
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
input[type=range]::-ms-fill-lower
|
||||
{
|
||||
background: #B6B6B6;
|
||||
border: 1px solid #8A8A8A;
|
||||
border-radius: 22px;
|
||||
box-shadow: 0px 0px 0px #000000;
|
||||
}
|
||||
|
||||
input[type=range]::-ms-fill-upper
|
||||
{
|
||||
background: #B6B6B6;
|
||||
border: 1px solid #8A8A8A;
|
||||
border-radius: 22px;
|
||||
box-shadow: 0px 0px 0px #000000;
|
||||
}
|
||||
|
||||
input[type=range]::-ms-thumb
|
||||
{
|
||||
box-shadow: 1px 1px 1px #828282;
|
||||
border: 1px solid #8A8A8A;
|
||||
height: 24px;
|
||||
width: 7px;
|
||||
border-radius: 0px;
|
||||
background: #FFFFFF;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
input[type=range]:focus::-ms-fill-lower
|
||||
{
|
||||
background: #B6B6B6;
|
||||
}
|
||||
|
||||
input[type=range]:focus::-ms-fill-upper
|
||||
{
|
||||
background: #B6B6B6;
|
||||
}
|
||||
|
||||
#webrx-top-container
|
||||
{
|
||||
position: relative;
|
||||
@ -539,3 +656,22 @@ html, body
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#openwebrx-panel-receiver
|
||||
{
|
||||
width:110px;
|
||||
}
|
||||
|
||||
#openwebrx-mute-on
|
||||
{
|
||||
color: lime;
|
||||
}
|
||||
|
||||
#openwebrx-mute-off
|
||||
{
|
||||
color: white;
|
||||
}
|
||||
|
||||
#openwebrx-panel-volume
|
||||
{
|
||||
width:70%;
|
||||
}
|
||||
|
||||
@ -118,6 +118,31 @@ function style_value(of_what,which)
|
||||
else if (window.getComputedStyle) return document.defaultView.getComputedStyle(of_what,null).getPropertyValue(which);
|
||||
}
|
||||
|
||||
function setVolume(str)
|
||||
{
|
||||
volume = mute ? 0 : parseFloat(str)/100;
|
||||
}
|
||||
|
||||
function updateVolume()
|
||||
{
|
||||
setVolume(e("openwebrx-panel-volume").value);
|
||||
}
|
||||
|
||||
function toggleMute()
|
||||
{
|
||||
if (mute) {
|
||||
mute = false;
|
||||
e("openwebrx-mute-on").id="openwebrx-mute-off";
|
||||
} else {
|
||||
mute = true;
|
||||
e("openwebrx-mute-off").id="openwebrx-mute-on"
|
||||
}
|
||||
|
||||
updateVolume();
|
||||
}
|
||||
|
||||
|
||||
|
||||
// ========================================================
|
||||
// ================= ANIMATION ROUTINES =================
|
||||
// ========================================================
|
||||
@ -1119,6 +1144,8 @@ function divlog(what, is_error)
|
||||
|
||||
var audio_context;
|
||||
var audio_initialized=0;
|
||||
var volume;
|
||||
var mute = false;
|
||||
|
||||
var audio_received = Array();
|
||||
var audio_buffer_index = 0;
|
||||
@ -1156,9 +1183,9 @@ function audio_prepare(data)
|
||||
//audio_rebuffer.push(sdrjs.ConvertI16_F(data));//no resampling
|
||||
//audio_rebuffer.push(audio_resampler.process(sdrjs.ConvertI16_F(data)));//resampling without ADPCM
|
||||
if(audio_compression=="none")
|
||||
audio_rebuffer.push(audio_resampler.process(gain_ff(0.9,sdrjs.ConvertI16_F(data))));//resampling without ADPCM
|
||||
audio_rebuffer.push(audio_resampler.process(gain_ff(volume,sdrjs.ConvertI16_F(data))));//resampling without ADPCM
|
||||
else if(audio_compression=="adpcm")
|
||||
audio_rebuffer.push(audio_resampler.process(gain_ff(0.9,sdrjs.ConvertI16_F(audio_codec.decode(data))))); //resampling & ADPCM
|
||||
audio_rebuffer.push(audio_resampler.process(gain_ff(volume,sdrjs.ConvertI16_F(audio_codec.decode(data))))); //resampling & ADPCM
|
||||
else return;
|
||||
|
||||
//console.log("prepare",data.length,audio_rebuffer.remaining());
|
||||
@ -1699,6 +1726,9 @@ function openwebrx_init()
|
||||
window.setTimeout(function(){window.setInterval(debug_audio,1000);},1000);
|
||||
window.addEventListener("resize",openwebrx_resize);
|
||||
check_top_bar_congestion();
|
||||
|
||||
//Synchronise volume with slider
|
||||
updateVolume();
|
||||
}
|
||||
|
||||
/*
|
||||
@ -1808,13 +1838,14 @@ function place_panels()
|
||||
if (c.dataset.panelPos=="left") { left_col.push(c); }
|
||||
else if(c.dataset.panelPos=="right") { right_col.push(c); }
|
||||
c.style.width=newSize[0]+"px";
|
||||
c.style.height=newSize[1]+"px";
|
||||
//c.style.height=newSize[1]+"px";
|
||||
if(!c.openwebrxPanelTransparent) c.style.margin=panel_margin.toString()+"px";
|
||||
else c.style.marginLeft=panel_margin.toString()+"px";
|
||||
c.openwebrxPanelWidth=parseInt(newSize[0]);
|
||||
c.openwebrxPanelHeight=parseInt(newSize[1]);
|
||||
}
|
||||
}
|
||||
|
||||
y=hoffset; //was y=0 before hoffset
|
||||
while(left_col.length>0)
|
||||
{
|
||||
|
||||
Loading…
Reference in New Issue
Block a user