diff --git a/htdocs/index.wrx b/htdocs/index.wrx index b993692..65efe8a 100644 --- a/htdocs/index.wrx +++ b/htdocs/index.wrx @@ -72,16 +72,23 @@
-
+
---.--- MHz
---.--- MHz
FM
-
AM
+
AM
LSB
USB
CW
+ +
Volume: + +
+
Mute
+
+
OpenWebRX (beta) client log
diff --git a/htdocs/openwebrx.css b/htdocs/openwebrx.css index b3dc9b4..1511f41 100644 --- a/htdocs/openwebrx.css +++ b/htdocs/openwebrx.css @@ -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%; +} diff --git a/htdocs/openwebrx.js b/htdocs/openwebrx.js index 1deeaf7..02540ed 100644 --- a/htdocs/openwebrx.js +++ b/htdocs/openwebrx.js @@ -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) {