New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Volume Slider and Mute Button #20

Merged
merged 2 commits into from Feb 13, 2016
Jump to file or symbol
Failed to load files and symbols.
+180 −6
Diff settings

Always

Just for now

View
@@ -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>
View
@@ -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%;
}
View
@@ -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)
{