embed: added reloadDelay option that determines the delay (in seconds) used for reloading when the stream is inactive

This commit is contained in:
Cat 2018-01-09 11:53:06 +01:00 committed by Thulinma
parent 14427f0167
commit dfde7828e4
2 changed files with 25 additions and 9 deletions

View file

@ -930,8 +930,25 @@ function mistPlay(streamName,options) {
if (!('type' in info) || (info.type != 'vod')) { //always show the button timer, unless its a vod if (!('type' in info) || (info.type != 'vod')) { //always show the button timer, unless its a vod
//reload timeout //reload timeout
var delay = ('type' in info ? 20 : 60); var delay = 20;
i.className = 'countdown'+delay; if (!("type" in info)) {
if ("reloadDelay" in options) {
delay = options.reloadDelay;
try {
var css = document.createElement("style");
i.appendChild(css);
css.sheet.insertRule(".countdown[data-delay=\""+delay+"\"] { animation-duration: "+delay+"s; }");
css.sheet.insertRule(".countdown[data-delay=\""+delay+"\"]:before { animation-duration: "+delay/2+"s,"+delay+"s; }");
}
catch (e) {}
}
else {
delay = 60;
}
}
i.className = 'countdown';
i.setAttribute("data-delay",delay);
err.timeOut = protoplay.timer.add(function(){ err.timeOut = protoplay.timer.add(function(){
protoplay.report({ protoplay.report({
type: 'playback', type: 'playback',

View file

@ -360,19 +360,18 @@
} }
} }
.countdown, .countdown20, .countdown60 { .countdown {
height: 1em; height: 1em;
width: 1em; width: 1em;
display: inline-block; display: inline-block;
vertical-align: bottom; vertical-align: bottom;
border-radius: 50%; border-radius: 50%;
background-image: linear-gradient(to right,#bbb 50%,#333 0); background-image: linear-gradient(to right,#bbb 50%,#333 0);
border: 1px solid black;
margin: 0 0.2em; margin: 0 0.2em;
opacity: 0; opacity: 0;
animation: appear 20s step-start 1; animation: appear 20s step-start 1;
} }
.countdown:before, .countdown20:before, .countdown60:before { .countdown:before {
content: ''; content: '';
display: block; display: block;
margin-left: 50%; margin-left: 50%;
@ -382,11 +381,11 @@
transform-origin: 0 50%; transform-origin: 0 50%;
animation: rotate 10s linear 2, bg 20s step-end 1; animation: rotate 10s linear 2, bg 20s step-end 1;
} }
.countdown60 { .countdown[data-delay=60] {
animation: appear 60s step-start 1; animation-duration: 60s;
} }
.coutndown60:before { .countdown[data-delay=60]:before {
animation: rotate 30s linear 2, bg 60s step-end 1; animation-duration: 30s, 60s;
} }
@keyframes rotate { @keyframes rotate {
to { transform: rotate(.5turn); } to { transform: rotate(.5turn); }