joachim
/
openwebrx-clone
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

improve autoplay interface

This commit is contained in:
Jakob Ketterl 2019-11-01 16:58:36 +01:00
parent d49fff65e4
commit 9163f3d30e
3 changed files with 24 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
htdocs/css/openwebrx.css
View File

@ -645,7 +645,7 @@ img.openwebrx-mirror-img
font-family: 'expletus-sans-medium'; font-family: 'expletus-sans-medium';
} }
#openwebrx-big-grey #openwebrx-autoplay-overlay
{ {
position: fixed; position: fixed;
width: 100%; width: 100%;
@ -657,9 +657,6 @@ img.openwebrx-mirror-img
left: 0; left: 0;
top: 0; top: 0;
z-index: 1001; z-index: 1001;
display: none;
vertical-align: middle;
text-align: center;
color: white; color: white;
font-weight: bold; font-weight: bold;
font-size: 20pt; font-size: 20pt;
@ -667,11 +664,19 @@ img.openwebrx-mirror-img
transition: opacity 0.3s linear; transition: opacity 0.3s linear;
} }
#openwebrx-big-grey img #openwebrx-autoplay-overlay img
{ {
width: 150px; width: 150px;
} }
#openwebrx-autoplay-overlay .overlay-content {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
text-align: center;
}
#openwebrx-digimode-canvas-container #openwebrx-digimode-canvas-container
{ {
/*margin: -10px -10px 10px -10px;*/ /*margin: -10px -10px 10px -10px;*/

8
htdocs/index.html
View File

@ -214,10 +214,10 @@
</div> </div>
</div> </div>
</div> </div>
<div id="openwebrx-big-grey" onclick="playButtonClick();"> <div id="openwebrx-autoplay-overlay" xstyle="display:none;">
<div id="openwebrx-play-button-text"> <div class="overlay-content">
<img id="openwebrx-play-button" src="static/gfx/openwebrx-play-button.png" /> <img id="openwebrx-play-button" src="static/gfx/openwebrx-play-button.png" />
<br /><br />Start OpenWebRX <div>Start OpenWebRX</div>
</div> </div>
</div> </div>
<div id="openwebrx-dialog-bookmark" class="openwebrx-dialog" style="display:none;"> <div id="openwebrx-dialog-bookmark" class="openwebrx-dialog" style="display:none;">

21
htdocs/openwebrx.js
View File

@ -1422,7 +1422,7 @@ function divlog(what, is_error) {
was_error |= is_error; was_error |= is_error;
if (is_error) { if (is_error) {
what = "<span class=\"webrx-error\">" + what + "</span>"; what = "<span class=\"webrx-error\">" + what + "</span>";
if (e("openwebrx-panel-log").openwebrxHidden) toggle_panel("openwebrx-panel-log"); //show panel if any error is present toggle_panel("openwebrx-panel-log", true); //show panel if any error is present
} }
e("openwebrx-debugdiv").innerHTML += what + "<br />"; e("openwebrx-debugdiv").innerHTML += what + "<br />";
var nano = $('.nano'); var nano = $('.nano');
@ -1474,9 +1474,7 @@ function onAudioStart(success, apiType){
//hide log panel in a second (if user has not hidden it yet) //hide log panel in a second (if user has not hidden it yet)
window.setTimeout(function () { window.setTimeout(function () {
if (typeof e("openwebrx-panel-log").openwebrxHidden === "undefined" && !was_error) { toggle_panel("openwebrx-panel-log", !!was_error);
toggle_panel("openwebrx-panel-log");
}
}, 2000); }, 2000);
//Synchronise volume with slider //Synchronise volume with slider
@ -1918,10 +1916,10 @@ var audioEngine;
function openwebrx_init() { function openwebrx_init() {
audioEngine = new AudioEngine(audio_buffer_maximal_length_sec, audioReporter); audioEngine = new AudioEngine(audio_buffer_maximal_length_sec, audioReporter);
$overlay = $('#openwebrx-autoplay-overlay');
$overlay.on('click', playButtonClick);
if (!audioEngine.isAllowed()) { if (!audioEngine.isAllowed()) {
e("openwebrx-big-grey").style.display = "table-cell"; $overlay.show();
var opb = e("openwebrx-play-button-text");
opb.style.marginTop = (window.innerHeight / 2 - opb.clientHeight / 2).toString() + "px";
} else { } else {
audioEngine.start(onAudioStart); audioEngine.start(onAudioStart);
} }
@ -1973,10 +1971,11 @@ function update_dmr_timeslot_filtering() {
function playButtonClick() { function playButtonClick() {
//On iOS, we can only start audio from a click or touch event. //On iOS, we can only start audio from a click or touch event.
audioEngine.start(onAudioStart); audioEngine.start(onAudioStart);
e("openwebrx-big-grey").style.opacity = 0; $overlay = $('#openwebrx-autoplay-overlay');
window.setTimeout(function () { $overlay.css('opacity', 0);
e("openwebrx-big-grey").style.display = "none"; $overlay.on('transitionend', function() {
}, 1100); $overlay.hide();
});
} }
var rt = function (s, n) { var rt = function (s, n) {