From 45c0ded88c866e7ea01f436df686b1e227504b77 Mon Sep 17 00:00:00 2001 From: Chrysa Papadopoulou Date: Wed, 1 Feb 2017 19:16:39 +0200 Subject: [PATCH] Loop functionality --- demo/src/js/main.js | 2 +- dist/plyr.js | 4 +- readme.md | 8 +- src/js/plyr.js | 199 ++++++++++++++++++++++++++++++++++++++++++-- 4 files changed, 203 insertions(+), 10 deletions(-) diff --git a/demo/src/js/main.js b/demo/src/js/main.js index c7e88511..3fe0b488 100644 --- a/demo/src/js/main.js +++ b/demo/src/js/main.js @@ -21,7 +21,7 @@ captions: { defaultActive: true }, - controls: ['play', 'speed-up', 'speed-down', 'progress', 'volume', 'captions', 'settings', 'fullscreen', 'fast-forward'] + controls: ['play', 'progress', 'volume', 'captions', 'settings', 'fullscreen', 'fast-forward'] }); plyr.loadSprite('dist/demo.svg'); diff --git a/dist/plyr.js b/dist/plyr.js index cb603b40..abdfbac0 100644 --- a/dist/plyr.js +++ b/dist/plyr.js @@ -1,2 +1,2 @@ -!function(e,t){"use strict";"object"==typeof module&&"object"==typeof module.exports?module.exports=t(e,document):"function"==typeof define&&define.amd?define([],function(){return t(e,document)}):e.plyr=t(e,document)}("undefined"!=typeof window?window:this,function(e,t){"use strict";function n(){var e,n,a,r=navigator.userAgent,s=navigator.appName,i=""+parseFloat(navigator.appVersion),o=parseInt(navigator.appVersion,10),l=!1,u=!1,c=!1,p=!1;return navigator.appVersion.indexOf("Windows NT")!==-1&&navigator.appVersion.indexOf("rv:11")!==-1?(l=!0,s="IE",i="11"):(n=r.indexOf("MSIE"))!==-1?(l=!0,s="IE",i=r.substring(n+5)):(n=r.indexOf("Chrome"))!==-1?(c=!0,s="Chrome",i=r.substring(n+7)):(n=r.indexOf("Safari"))!==-1?(p=!0,s="Safari",i=r.substring(n+7),(n=r.indexOf("Version"))!==-1&&(i=r.substring(n+8))):(n=r.indexOf("Firefox"))!==-1?(u=!0,s="Firefox",i=r.substring(n+8)):(e=r.lastIndexOf(" ")+1)<(n=r.lastIndexOf("/"))&&(s=r.substring(e,n),i=r.substring(n+1),s.toLowerCase()===s.toUpperCase()&&(s=navigator.appName)),(a=i.indexOf(";"))!==-1&&(i=i.substring(0,a)),(a=i.indexOf(" "))!==-1&&(i=i.substring(0,a)),o=parseInt(""+i,10),isNaN(o)&&(i=""+parseFloat(navigator.appVersion),o=parseInt(navigator.appVersion,10)),{name:s,version:o,isIE:l,isFirefox:u,isChrome:c,isSafari:p,isIos:/(iPad|iPhone|iPod)/g.test(navigator.platform),isTouch:"ontouchstart"in t.documentElement}}function a(e){if(!t.querySelectorAll('script[src="'+e+'"]').length){var n=t.createElement("script");n.src=e;var a=t.getElementsByTagName("script")[0];a.parentNode.insertBefore(n,a)}}function r(e,t){return Array.prototype.indexOf&&e.indexOf(t)!==-1}function s(e,t,n){return e.replace(new RegExp(t.replace(/([.*+?\^=!:${}()|\[\]\/\\])/g,"\\$1"),"g"),n)}function i(e,t){e.length||(e=[e]);for(var n=e.length-1;n>=0;n--){var a=n>0?t.cloneNode(!0):t,r=e[n],s=r.parentNode,i=r.nextSibling;return a.appendChild(r),i?s.insertBefore(a,i):s.appendChild(a),a}}function o(e){e&&e.parentNode.removeChild(e)}function l(e,t){e.insertBefore(t,e.firstChild)}function u(e,t){for(var n in t)e.setAttribute(n,N.boolean(t[n])&&t[n]?"":t[n])}function c(e,n,a){var r=t.createElement(e);u(r,a),l(n,r)}function p(e){return e.replace(".","")}function d(e,t,n){if(e)if(e.classList)e.classList[n?"add":"remove"](t);else{var a=(" "+e.className+" ").replace(/\s+/g," ").replace(" "+t+" ","");e.className=a+(n?" "+t:"")}}function m(e,t){return!!e&&(e.classList?e.classList.contains(t):new RegExp("(\\s|^)"+t+"(\\s|$)").test(e.className))}function f(e,n){var a=Element.prototype,r=a.matches||a.webkitMatchesSelector||a.mozMatchesSelector||a.msMatchesSelector||function(e){return[].indexOf.call(t.querySelectorAll(e),this)!==-1};return r.call(e,n)}function y(e,t,n,a,r){g(e,t,function(t){n&&n.apply(e,[t]),a.apply(e,[t])},r)}function b(e,t,n,a,r){var s=t.split(" ");if(N.boolean(r)||(r=!1),e instanceof NodeList)for(var i=0;i','',''+E.i18n.play+"",""),e.push('
'),r(E.controls,"restart")&&e.push('"),r(E.controls,"rewind")&&e.push('"),r(E.controls,"play")&&e.push('",'"),r(E.controls,"fast-forward")&&e.push('"),r(E.controls,"progress")&&(e.push('','','','','',"0% "+E.i18n.buffered,""),E.tooltips.seek&&e.push('00:00'),e.push("")),r(E.controls,"current-time")&&e.push('',''+E.i18n.currentTime+"",'00:00',""),r(E.controls,"duration")&&e.push('',''+E.i18n.duration+"",'00:00',""),r(E.controls,"mute")&&e.push('"),r(E.controls,"volume")&&e.push('','",'','',""),r(E.controls,"captions")&&e.push('"),r(E.controls,"settings")&&e.push('
','",'","
"),r(E.controls,"pip")&&q.pip&&e.push('"),r(E.controls,"airplay")&&q.airplay&&e.push('"),r(E.controls,"fullscreen")&&e.push('"),e.push("
"),e.join("")}function R(e,t){function n(e){var t="";switch(e){case"hd2160":t="4K";break;case"hd1440":t="WQHD";break;case"hd1080":t="HD";break;case"hd720":t="HD"}return t.length?['',''+t+"",""].join(""):""}function a(e){switch(e){case"hd2160":return"2160P";case"hd1440":return"1440P";case"hd1080":return"1080P";case"hd720":return"720P";case"large":return"480P";case"medium":return"360P";case"small":return"240P";default:return"Auto"}}if(!N.object($e.quality)&&($e.quality={available:e,current:t},N.array(e)&&e.length)){var r=e.filter(function(e){return["tiny","small"].indexOf(e)===-1}),s=r.map(function(e){return["
  • ",'","
    • "].join("")});s.unshift(['
  • ','","
    • "].join("")),console.warn(s)}}function D(){if($e.supported.full&&("audio"!==$e.type||E.fullscreen.allowAudio)&&E.fullscreen.enabled){var e=q.fullscreen;e||E.fullscreen.fallback&&!K()?(Ge((e?"Native":"Fallback")+" fullscreen enabled"),d($e.container,E.classes.fullscreen.enabled,!0)):Ge("Fullscreen not supported and fallback disabled"),$e.buttons&&$e.buttons.fullscreen&&_($e.buttons.fullscreen,!1),Q()}}function V(e){N.event(e)&&(e=e.target),e.activeCues[0]&&"text"in e.activeCues[0]?W(e.activeCues[0].getCueAsHTML()):W()}function H(){if("video"===$e.type){U(E.selectors.captions)||$e.videoContainer.insertAdjacentHTML("afterbegin",'
    '),$e.usingTextTracks=!1,$e.media.textTracks&&($e.usingTextTracks=!0);var e=[],t="";if($e.media.childNodes.forEach(function(t){"track"===t.nodeName.toLowerCase()&&("captions"!==t.kind&&"subtitles"!==t.kind||e.push(t.getAttribute("src")))}),$e.captionExists=!0,0===e.length?($e.captionExists=!1,Ge("No caption track found")):E.captions.selectedIndex+1>e.length?($e.captionExists=!1,Ge("Caption index out of bound")):(t=e[E.captions.selectedIndex],Ge("Caption track found; URI: "+t)),$e.captionExists){var n=$e.media.textTracks;if([].forEach.call(n,function(e){v(e,"cuechange",V),e.mode="hidden"}),B($e),($e.browser.isIE&&$e.browser.version>=10||$e.browser.isFirefox&&$e.browser.version>=31)&&(Ge("Detected browser with known TextTrack issues - using manual fallback"),$e.usingTextTracks=!1),$e.usingTextTracks){Ge("TextTracks supported");var a=n[E.captions.selectedIndex];"captions"!==a.kind&&"subtitles"!==a.kind||(g(a,"cuechange",V),a.activeCues&&a.activeCues.length>0&&V(a))}else if(Ge("TextTracks not supported so rendering captions manually"),$e.currentCaption="",$e.captions=[],""!==t){var r=new XMLHttpRequest;r.onreadystatechange=function(){if(4===r.readyState)if(200===r.status){var e=r.responseText,t="\r\n";e.indexOf(t+t)===-1&&(t=e.indexOf("\r\r")!==-1?"\r":"\n");var n=e.split(t+t);$e.captions=n.map(function(e){var n=e.split(t),a=0;return n[a].indexOf(":")!==-1&&(a=1),[n[a],n[a+1]]}),$e.captions.shift(),Ge("Successfully loaded the caption file via AJAX")}else Ze(E.logPrefix+"There was a problem loading the caption file via AJAX")},r.open("get",t,!0),r.send()}}else d($e.container,E.classes.captions.enabled)}}function W(e){var n=U(E.selectors.captions),a=t.createElement("span");n.innerHTML="",N.undefined(e)&&(e=""),N.string(e)?a.innerHTML=e.trim():a.appendChild(e),n.appendChild(a);n.offsetHeight}function Y(e){function t(e,t){var n=[];n=e.split(" --> ");for(var a=0;a$e.captions.length-1){$e.subcount=$e.captions.length-1;break}$e.media.currentTime.toFixed(1)>=n($e.captions[$e.subcount][0])&&$e.media.currentTime.toFixed(1)<=a($e.captions[$e.subcount][0])?($e.currentCaption=$e.captions[$e.subcount][1],W($e.currentCaption)):W()}}function B(){if($e.buttons.captions){d($e.container,E.classes.captions.enabled,!0);var e=$e.storage.captionsEnabled;N.boolean(e)||(e=E.captions.defaultActive),e&&(d($e.container,E.classes.captions.active,!0),_($e.buttons.captions,!0))}}function X(e){return $e.container.querySelectorAll(e)}function U(e){return X(e)[0]}function K(){try{return e.self!==e.top}catch(e){return!0}}function Q(){function e(e){9===e.which&&$e.isFullscreen&&(e.target!==a||e.shiftKey?e.target===n&&e.shiftKey&&(e.preventDefault(),a.focus()):(e.preventDefault(),n.focus()))}var t=X("input:not([disabled]), button:not([disabled])"),n=t[0],a=t[t.length-1];g($e.container,"keydown",e)}function $(e,t){if(N.string(t))c(e,$e.media,{src:t});else if(t.constructor===Array)for(var n=t.length-1;n>=0;n--)c(e,$e.media,t[n])}function J(){if(E.loadSprite){var e=L();e.absolute?(Ge("AJAX loading absolute SVG sprite"+($e.browser.isIE?" (due to IE)":"")),S(e.url,"sprite-plyr")):Ge("Sprite will be used as external resource directly")}var n=E.html;Ge("Injecting custom controls"),n||(n=j()),n=s(n,"{seektime}",E.seekTime),n=s(n,"{speed}",z()),n=s(n,"{lang}","English"),$e.id=Math.floor(1e4*Math.random()),n=s(n,"{id}",$e.id);var a;if(N.string(E.selectors.controls.container)&&(a=t.querySelector(E.selectors.controls.container)),N.htmlElement(a)||(a=$e.container),a.insertAdjacentHTML("beforeend",n),E.tooltips.controls)for(var r=X([E.selectors.controls.wrapper," ",E.selectors.labels," .",E.classes.hidden].join("")),i=r.length-1;i>=0;i--){var o=r[i];d(o,E.classes.hidden,!1),d(o,E.classes.tooltip,!0)}}function z(){return E.currentSpeed.toFixed(1).toString().replace(".0","")+"×"}function G(){try{return $e.controls=U(E.selectors.controls.wrapper),$e.buttons={seek:U(E.selectors.buttons.seek),play:X(E.selectors.buttons.play),pause:U(E.selectors.buttons.pause),restart:U(E.selectors.buttons.restart),rewind:U(E.selectors.buttons.rewind),forward:U(E.selectors.buttons.forward),fullscreen:U(E.selectors.buttons.fullscreen),settings:U(E.selectors.buttons.settings),pip:U(E.selectors.buttons.pip),speed:t.querySelectorAll(E.selectors.buttons.speed)},$e.buttons.mute=U(E.selectors.buttons.mute),$e.buttons.captions=U(E.selectors.buttons.captions),$e.progress={container:U(E.selectors.progress.container)},$e.progress.buffer=function(){var e=U(E.selectors.progress.buffer);return{bar:e,text:N.htmlElement(e)&&e.getElementsByTagName("span")[0]}}(),$e.progress.played=U(E.selectors.progress.played),$e.progress.tooltip=$e.progress.container&&$e.progress.container.querySelector("."+E.classes.tooltip),$e.volume={input:U(E.selectors.volume.input),display:U(E.selectors.volume.display)},$e.duration=U(E.selectors.duration),$e.currentTime=U(E.selectors.currentTime),$e.seekTime=X(E.selectors.seekTime),!0}catch(e){return Ze("It looks like there is a problem with your controls HTML",e),ee(!0),!1}}function Z(){d($e.container,E.selectors.container.replace(".",""),$e.supported.full)}function ee(e){e&&r(E.types.html5,$e.type)?$e.media.setAttribute("controls",""):$e.media.removeAttribute("controls")}function te(e){var t=E.i18n.play;if(N.string(E.title)&&E.title.length&&(t+=", "+E.title,$e.container.setAttribute("aria-label",E.title)),$e.supported.full&&$e.buttons.play)for(var n=$e.buttons.play.length-1;n>=0;n--)$e.buttons.play[n].setAttribute("aria-label",t);N.htmlElement(e)&&e.setAttribute("title",E.i18n.frameTitle.replace("{title}",E.title))}function ne(){var t=null;$e.storage={},q.storage&&E.storage.enabled&&(e.localStorage.removeItem("plyr-volume"),t=e.localStorage.getItem(E.storage.key),t&&(/^\d+(\.\d+)?$/.test(t)?ae({volume:parseFloat(t)}):$e.storage=JSON.parse(t)))}function ae(t){q.storage&&E.storage.enabled&&(x($e.storage,t),e.localStorage.setItem(E.storage.key,JSON.stringify($e.storage)))}function re(){if(!$e.media)return void Ze("No media element found!");if($e.supported.full&&(d($e.container,E.classes.type.replace("{0}",$e.type),!0),r(E.types.embed,$e.type)&&d($e.container,E.classes.type.replace("{0}","video"),!0),d($e.container,E.classes.pip.enabled,q.pip),d($e.container,E.classes.stopped,E.autoplay),d($e.container,E.classes.isIos,$e.browser.isIos),d($e.container,E.classes.isTouch,$e.browser.isTouch),"video"===$e.type)){var e=t.createElement("div");e.setAttribute("class",E.classes.videoWrapper),i($e.media,e),$e.videoContainer=e}r(E.types.embed,$e.type)&&se()}function se(){var n,r=t.createElement("div"),s=$e.type+"-"+Math.floor(1e4*Math.random());switch($e.type){case"youtube":n=w($e.embedId);break;case"vimeo":n=T($e.embedId);break;default:n=$e.embedId}for(var i=X('[id^="'+$e.type+'-"]'),l=i.length-1;l>=0;l--)o(i[l]);if(d($e.media,E.classes.videoWrapper,!0),d($e.media,E.classes.embedWrapper,!0),"youtube"===$e.type)$e.media.appendChild(r),r.setAttribute("id",s),N.object(e.YT)?oe(n,r):(a(E.urls.youtube.api),e.onYouTubeReadyCallbacks=e.onYouTubeReadyCallbacks||[],e.onYouTubeReadyCallbacks.push(function(){oe(n,r)}),e.onYouTubeIframeAPIReady=function(){e.onYouTubeReadyCallbacks.forEach(function(e){e()})});else if("vimeo"===$e.type)if($e.supported.full?$e.media.appendChild(r):r=$e.media,r.setAttribute("id",s),N.object(e.Vimeo))le(n,r);else{a(E.urls.vimeo.api);var c=e.setInterval(function(){N.object(e.Vimeo)&&(e.clearInterval(c),le(n,r))},50)}else if("soundcloud"===$e.type){var p=t.createElement("iframe");p.loaded=!1,g(p,"load",function(){p.loaded=!0}),u(p,{src:"https://w.soundcloud.com/player/?url=https://api.soundcloud.com/tracks/"+n,id:s}),r.appendChild(p),$e.media.appendChild(r),e.SC||a(E.urls.soundcloud.api);var m=e.setInterval(function(){e.SC&&p.loaded&&(e.clearInterval(m),ue.call(p))},50)}}function ie(){$e.supported.full&&(Ue(),Ke()),te(U("iframe"))}function oe(t,n){$e.embed=new e.YT.Player(n.id,{videoId:t,playerVars:{autoplay:E.autoplay?1:0,controls:$e.supported.full?0:1,rel:0,showinfo:0,iv_load_policy:3,cc_load_policy:E.captions.defaultActive?1:0,cc_lang_pref:"en",wmode:"transparent",modestbranding:1,disablekb:1,origin:"*"},events:{onError:function(e){A($e.container,"error",!0,{code:e.data,embed:e.target})},onPlaybackQualityChange:function(e){var t=e.target,n=t.getPlaybackQuality();console.warn(n)},onReady:function(t){var n=t.target;$e.media.play=function(){n.playVideo(),$e.media.paused=!1},$e.media.pause=function(){n.pauseVideo(),$e.media.paused=!0},$e.media.stop=function(){n.stopVideo(),$e.media.paused=!0},$e.media.duration=n.getDuration(),$e.media.paused=!0,$e.media.currentTime=0,$e.media.muted=n.isMuted();var a=n.getPlaybackRate(),r=n.getAvailablePlaybackRates();console.warn(a,r),E.title=n.getVideoData().title,$e.supported.full&&$e.media.querySelector("iframe").setAttribute("tabindex","-1"),ie(),A($e.media,"timeupdate"),A($e.media,"durationchange"),e.clearInterval(Je.buffering),Je.buffering=e.setInterval(function(){$e.media.buffered=n.getVideoLoadedFraction(),(null===$e.media.lastBuffered||$e.media.lastBuffered<$e.media.buffered)&&A($e.media,"progress"),$e.media.lastBuffered=$e.media.buffered,1===$e.media.buffered&&(e.clearInterval(Je.buffering),A($e.media,"canplaythrough"))},200)},onStateChange:function(t){var n=t.target;switch(e.clearInterval(Je.playing),t.data){case 0:$e.media.paused=!0,A($e.media,"ended");break;case 1:$e.media.paused=!1,$e.media.seeking&&A($e.media,"seeked"),$e.media.seeking=!1,A($e.media,"play"),A($e.media,"playing"),Je.playing=e.setInterval(function(){$e.media.currentTime=n.getCurrentTime(),A($e.media,"timeupdate")},100),$e.media.duration!==n.getDuration()&&($e.media.duration=n.getDuration(),A($e.media,"durationchange"));var a=n.getAvailableQualityLevels(),r=n.getPlaybackQuality();R(a,r);break;case 2:$e.media.paused=!0,A($e.media,"pause")}A($e.container,"statechange",!1,{code:t.data})}}})}function le(t,n){$e.embed=new e.Vimeo.Player(n,{id:parseInt(t),loop:E.loop,autoplay:E.autoplay,byline:!1,portrait:!1,title:!1}),$e.media.play=function(){$e.embed.play(),$e.media.paused=!1},$e.media.pause=function(){$e.embed.pause(),$e.media.paused=!0},$e.media.stop=function(){$e.embed.stop(),$e.media.paused=!0},$e.media.paused=!0,$e.media.currentTime=0,ie(),$e.embed.getCurrentTime().then(function(e){$e.media.currentTime=e,A($e.media,"timeupdate")}),$e.embed.getDuration().then(function(e){$e.media.duration=e,A($e.media,"durationchange")}),$e.embed.on("loaded",function(){N.htmlElement($e.embed.element)&&$e.supported.full&&$e.embed.element.setAttribute("tabindex","-1")}),$e.embed.on("play",function(){$e.media.paused=!1,A($e.media,"play"),A($e.media,"playing")}),$e.embed.on("pause",function(){$e.media.paused=!0,A($e.media,"pause")}),$e.embed.on("timeupdate",function(e){$e.media.seeking=!1,$e.media.currentTime=e.seconds,A($e.media,"timeupdate")}),$e.embed.on("progress",function(e){$e.media.buffered=e.percent,A($e.media,"progress"),1===parseInt(e.percent)&&A($e.media,"canplaythrough")}),$e.embed.on("seeked",function(){$e.media.seeking=!1,A($e.media,"seeked"),A($e.media,"play")}),$e.embed.on("ended",function(){$e.media.paused=!0,A($e.media,"ended")})}function ue(){$e.embed=e.SC.Widget(this),$e.embed.bind(e.SC.Widget.Events.READY,function(){$e.media.play=function(){$e.embed.play(),$e.media.paused=!1},$e.media.pause=function(){$e.embed.pause(),$e.media.paused=!0},$e.media.stop=function(){$e.embed.seekTo(0),$e.embed.pause(),$e.media.paused=!0},$e.media.paused=!0,$e.media.currentTime=0,$e.embed.getDuration(function(e){$e.media.duration=e/1e3,ie()}),$e.embed.getPosition(function(e){$e.media.currentTime=e,A($e.media,"timeupdate")}),$e.embed.bind(e.SC.Widget.Events.PLAY,function(){$e.media.paused=!1,A($e.media,"play"),A($e.media,"playing")}),$e.embed.bind(e.SC.Widget.Events.PAUSE,function(){$e.media.paused=!0,A($e.media,"pause")}),$e.embed.bind(e.SC.Widget.Events.PLAY_PROGRESS,function(e){$e.media.seeking=!1,$e.media.currentTime=e.currentPosition/1e3,A($e.media,"timeupdate")}),$e.embed.bind(e.SC.Widget.Events.LOAD_PROGRESS,function(e){$e.media.buffered=e.loadProgress,A($e.media,"progress"),1===parseInt(e.loadProgress)&&A($e.media,"canplaythrough")}),$e.embed.bind(e.SC.Widget.Events.FINISH,function(){$e.media.paused=!0,A($e.media,"ended")})})}function ce(){"play"in $e.media&&$e.media.play()}function pe(){"pause"in $e.media&&$e.media.pause()}function de(e){return N.boolean(e)||(e=$e.media.paused),e?ce():pe(),e}function me(e){if(N.undefined(e)&&(e=$e.storage.speed||E.defaultSpeed),!N.array(E.speeds))return void Ze("Invalid speeds format");if(!N.number(e)){var n=E.speeds.indexOf(E.currentSpeed);if(n!==-1){var a=n+1;a>=E.speeds.length&&(a=0),e=E.speeds[a]}else e=E.defaultSpeed}E.currentSpeed=e,$e.media.playbackRate=e,ae({speed:e}),t.querySelector('[data-menu="speed"]').innerHTML=z()}function fe(e){N.number(e)||(e=E.seekTime),be($e.media.currentTime-e)}function ye(e){N.number(e)||(e=E.seekTime),be($e.media.currentTime+e)}function be(e){var t=0,n=$e.media.paused,a=ge();N.number(e)?t=e:N.event(e)&&r(["input","change"],e.type)&&(t=e.target.value/e.target.max*a),t<0?t=0:t>a&&(t=a),Oe(t);try{$e.media.currentTime=t.toFixed(4)}catch(e){}if(r(E.types.embed,$e.type)){switch($e.type){case"youtube":$e.embed.seekTo(t);break;case"vimeo":$e.embed.setCurrentTime(t.toFixed(0));break;case"soundcloud":$e.embed.seekTo(1e3*t)}n&&pe(),A($e.media,"timeupdate"),$e.media.seeking=!0,A($e.media,"seeking")}Ge("Seeking to "+$e.media.currentTime+" seconds"),Y(t)}function ge(){var e=parseInt(E.duration),t=0;return null===$e.media.duration||isNaN($e.media.duration)||(t=$e.media.duration),isNaN(e)?t:e}function ve(){d($e.container,E.classes.playing,!$e.media.paused),d($e.container,E.classes.stopped,$e.media.paused),je($e.media.paused)}function he(){P={x:e.pageXOffset||0,y:e.pageYOffset||0}}function _e(){e.scrollTo(P.x,P.y)}function ke(e){var n=q.fullscreen;if(n){if(!e||e.type!==I.eventType)return I.isFullScreen($e.container)?I.cancelFullScreen():(he(),I.requestFullScreen($e.container)),void($e.isFullscreen=I.isFullScreen($e.container));$e.isFullscreen=I.isFullScreen($e.container)}else $e.isFullscreen=!$e.isFullscreen,t.body.style.overflow=$e.isFullscreen?"hidden":"";d($e.container,E.classes.fullscreen.active,$e.isFullscreen),Q($e.isFullscreen),$e.buttons&&$e.buttons.fullscreen&&_($e.buttons.fullscreen,$e.isFullscreen),A($e.container,$e.isFullscreen?"enterfullscreen":"exitfullscreen",!0),!$e.isFullscreen&&n&&_e()}function xe(e){if(N.boolean(e)||(e=!$e.media.muted),_($e.buttons.mute,e),$e.media.muted=e,0===$e.media.volume&&we(E.volume),r(E.types.embed,$e.type)){switch($e.type){case"youtube":$e.embed[$e.media.muted?"mute":"unMute"]();break;case"vimeo":case"soundcloud":$e.embed.setVolume($e.media.muted?0:parseFloat(E.volume/E.volumeMax))}A($e.media,"volumechange")}}function we(e){var t=E.volumeMax,n=E.volumeMin;if(N.undefined(e)&&(e=$e.storage.volume),(null===e||isNaN(e))&&(e=E.volume),e>t&&(e=t),e0&&xe()}function Te(e){var t=$e.media.muted?0:$e.media.volume*E.volumeMax;N.number(e)||(e=E.volumeStep),we(t+e)}function Ee(e){var t=$e.media.muted?0:$e.media.volume*E.volumeMax;N.number(e)||(e=E.volumeStep),we(t-e)}function Se(){var e=$e.media.muted?0:$e.media.volume*E.volumeMax;$e.supported.full&&($e.volume.input&&($e.volume.input.value=e),$e.volume.display&&($e.volume.display.value=e)),ae({volume:e}),d($e.container,E.classes.muted,0===e),$e.supported.full&&$e.buttons.mute&&_($e.buttons.mute,0===e)}function Ce(e){$e.supported.full&&$e.buttons.captions&&(N.boolean(e)||(e=$e.container.className.indexOf(E.classes.captions.active)===-1),$e.captionsEnabled=e,_($e.buttons.captions,$e.captionsEnabled),d($e.container,E.classes.captions.active,$e.captionsEnabled),A($e.container,$e.captionsEnabled?"captionsenabled":"captionsdisabled",!0),ae({captionsEnabled:$e.captionsEnabled}))}function Ae(e){E.captions.selectedIndex=e,W(),H()}function Fe(e){var t="waiting"===e.type;clearTimeout(Je.loading),Je.loading=setTimeout(function(){d($e.container,E.classes.loading,t),je(t)},t?250:0)}function Ie(e){if($e.supported.full){var t=$e.progress.played,n=0,a=ge();if(e)switch(e.type){case"timeupdate":case"seeking":if($e.controls.pressed)return;n=k($e.media.currentTime,a),"timeupdate"===e.type&&$e.buttons.seek&&($e.buttons.seek.value=n);break;case"playing":case"progress":t=$e.progress.buffer,n=function(){var e=$e.media.buffered;return e&&e.length?k(e.end(0),a):N.number(e)?100*e:0}()}Pe(t,n)}}function Pe(e,t){if($e.supported.full){if(N.undefined(t)&&(t=0),N.undefined(e)){if(!$e.progress||!$e.progress.buffer)return;e=$e.progress.buffer; -}N.htmlElement(e)?e.value=t:e&&(e.bar&&(e.bar.value=t),e.text&&(e.text.innerHTML=t))}}function Me(e,t){if(t){isNaN(e)&&(e=0),$e.secs=parseInt(e%60),$e.mins=parseInt(e/60%60),$e.hours=parseInt(e/60/60%60);var n=parseInt(ge()/60/60%60)>0;$e.secs=("0"+$e.secs).slice(-2),$e.mins=("0"+$e.mins).slice(-2),t.innerHTML=(n?$e.hours+":":"")+$e.mins+":"+$e.secs}}function Ne(){if($e.supported.full){var e=ge()||0;!$e.duration&&E.displayDuration&&$e.media.paused&&Me(e,$e.currentTime),$e.duration&&Me(e,$e.duration),Le()}}function qe(e){Me($e.media.currentTime,$e.currentTime),e&&"timeupdate"===e.type&&$e.media.seeking||Ie(e)}function Oe(e){N.number(e)||(e=0);var t=ge(),n=k(e,t);$e.progress&&$e.progress.played&&($e.progress.played.value=n),$e.buttons&&$e.buttons.seek&&($e.buttons.seek.value=n)}function Le(e){var t=ge();if(E.tooltips.seek&&$e.progress.container&&0!==t){var n=$e.progress.container.getBoundingClientRect(),a=0,s=E.classes.tooltip+"--visible";if(e)a=100/n.width*(e.pageX-n.left);else{if(!m($e.progress.tooltip,s))return;a=$e.progress.tooltip.style.left.replace("%","")}a<0?a=0:a>100&&(a=100),Me(t/100*a,$e.progress.tooltip),$e.progress.tooltip.style.left=a+"%",e&&r(["mouseenter","mouseleave"],e.type)&&d($e.progress.tooltip,s,"mouseenter"===e.type)}}function je(t){if(E.hideControls&&"audio"!==$e.type){var n=0,a=!1,s=t,i=m($e.container,E.classes.loading);if(N.boolean(t)||(t&&t.type?(a="enterfullscreen"===t.type,s=r(["mousemove","touchstart","mouseenter","focus"],t.type),r(["mousemove","touchmove"],t.type)&&(n=2e3),"focus"===t.type&&(n=3e3)):s=m($e.container,E.classes.hideControls)),e.clearTimeout(Je.hover),s||$e.media.paused||i){if(d($e.container,E.classes.hideControls,!1),$e.media.paused||i)return;$e.browser.isTouch&&(n=3e3)}s&&$e.media.paused||(Je.hover=e.setTimeout(function(){(!$e.controls.pressed&&!$e.controls.hover||a)&&d($e.container,E.classes.hideControls,!0)},n))}}function Re(e){if(!N.undefined(e))return void De(e);var t;switch($e.type){case"youtube":t=$e.embed.getVideoUrl();break;case"vimeo":$e.embed.getVideoUrl.then(function(e){t=e});break;case"soundcloud":$e.embed.getCurrentSound(function(e){t=e.permalink_url});break;default:t=$e.media.currentSrc}return t||""}function De(e){function n(){if($e.embed=null,o($e.media),"video"===$e.type&&$e.videoContainer&&o($e.videoContainer),$e.container&&$e.container.removeAttribute("class"),"type"in e&&($e.type=e.type,"video"===$e.type)){var n=e.sources[0];"type"in n&&r(E.types.embed,n.type)&&($e.type=n.type)}switch($e.supported=C($e.type),$e.type){case"video":$e.media=t.createElement("video");break;case"audio":$e.media=t.createElement("audio");break;case"youtube":case"vimeo":case"soundcloud":$e.media=t.createElement("div"),$e.embedId=e.sources[0].src}l($e.container,$e.media),N.boolean(e.autoplay)&&(E.autoplay=e.autoplay),r(E.types.html5,$e.type)&&(E.crossorigin&&$e.media.setAttribute("crossorigin",""),E.autoplay&&$e.media.setAttribute("autoplay",""),"poster"in e&&$e.media.setAttribute("poster",e.poster),E.loop&&$e.media.setAttribute("loop","")),d($e.container,E.classes.fullscreen.active,$e.isFullscreen),d($e.container,E.classes.captions.active,$e.captionsEnabled),Z(),r(E.types.html5,$e.type)&&$("source",e.sources),re(),r(E.types.html5,$e.type)&&("tracks"in e&&$("track",e.tracks),$e.media.load()),(r(E.types.html5,$e.type)||r(E.types.embed,$e.type)&&!$e.supported.full)&&(Ue(),Ke()),E.title=e.title,te()}return N.object(e)&&"sources"in e&&e.sources.length?(d($e.container,E.classes.ready,!1),pe(),Oe(),Pe(),Ye(),void Be(n,!1)):void Ze("Invalid source format")}function Ve(e){"video"===$e.type&&$e.media.setAttribute("poster",e)}function He(){function n(){var e=de(),t=$e.buttons[e?"play":"pause"],n=$e.buttons[e?"pause":"play"];if(n=n&&n.length>1?n[n.length-1]:n[0]){var a=m(t,E.classes.tabFocus);setTimeout(function(){n.focus(),a&&(d(t,E.classes.tabFocus,!1),d(n,E.classes.tabFocus,!0))},100)}}function a(){var e=t.activeElement;return e=e&&e!==t.body?t.querySelector(":focus"):null}function s(e){return e.keyCode?e.keyCode:e.which}function i(e){for(var t in $e.buttons){var n=$e.buttons[t];if(N.nodeList(n))for(var a=0;a0)&&(t?Ee(n):Te(n)),(e.deltaY>0||e.deltaX<0)&&(t?Te(n):Ee(n))})}function We(){if(g($e.media,"timeupdate seeking",qe),g($e.media,"timeupdate",Y),g($e.media,"durationchange loadedmetadata",Ne),g($e.media,"ended",function(){"video"===$e.type&&E.showPosterOnEnd&&("video"===$e.type&&W(),be(),$e.media.load())}),g($e.media,"progress playing",Ie),g($e.media,"volumechange",Se),g($e.media,"play pause ended",ve),g($e.media,"waiting canplay seeked",Fe),E.clickToPlay&&"audio"!==$e.type){var e=U("."+E.classes.videoWrapper);if(!e)return;e.style.cursor="pointer",g(e,"click",function(){E.hideControls&&$e.browser.isTouch&&!$e.media.paused||($e.media.paused?ce():$e.media.ended?(be(),ce()):pe())})}E.disableContextMenu&&g($e.media,"contextmenu",function(e){e.preventDefault()}),g($e.media,E.events.concat(["keyup","keydown"]).join(" "),function(e){A($e.container,e.type,!0)})}function Ye(){if(r(E.types.html5,$e.type)){for(var e=$e.media.querySelectorAll("source"),t=0;t=0;n--){var a=n>0?t.cloneNode(!0):t,o=e[n],r=o.parentNode,l=o.nextSibling;return a.appendChild(o),l?r.insertBefore(a,l):r.appendChild(a),a}}function s(e){e&&e.parentNode.removeChild(e)}function i(e,t){e.insertBefore(t,e.firstChild)}function u(e,t){for(var n in t)e.setAttribute(n,M.boolean(t[n])&&t[n]?"":t[n])}function c(e,n,a){var o=t.createElement(e);u(o,a),i(n,o)}function p(e){return e.replace(".","")}function d(e,t,n){if(e)if(e.classList)e.classList[n?"add":"remove"](t);else{var a=(" "+e.className+" ").replace(/\s+/g," ").replace(" "+t+" ","");e.className=a+(n?" "+t:"")}}function m(e,t){return!!e&&(e.classList?e.classList.contains(t):new RegExp("(\\s|^)"+t+"(\\s|$)").test(e.className))}function y(e,n){var a=Element.prototype,o=a.matches||a.webkitMatchesSelector||a.mozMatchesSelector||a.msMatchesSelector||function(e){return[].indexOf.call(t.querySelectorAll(e),this)!==-1};return o.call(e,n)}function f(e,t,n,a,o){g(e,t,function(t){n&&n.apply(e,[t]),a.apply(e,[t])},o)}function b(e,t,n,a,o){var r=t.split(" ");if(M.boolean(o)||(o=!1),e instanceof NodeList)for(var l=0;l','',''+S.i18n.play+"",""),e.push('
    '),o(S.controls,"restart")&&e.push('"),o(S.controls,"rewind")&&e.push('"),o(S.controls,"play")&&e.push('",'"),o(S.controls,"fast-forward")&&e.push('"),o(S.controls,"progress")&&(e.push('','','','','',"0% "+S.i18n.buffered,""),S.tooltips.seek&&e.push('00:00'),e.push("")),o(S.controls,"current-time")&&e.push('',''+S.i18n.currentTime+"",'00:00',""),o(S.controls,"duration")&&e.push('',''+S.i18n.duration+"",'00:00',""),o(S.controls,"mute")&&e.push('"),o(S.controls,"volume")&&e.push('','",'','',""),o(S.controls,"captions")&&e.push('"),o(S.controls,"settings")&&e.push('
    ','",'","
    "),o(S.controls,"pip")&&N.pip&&e.push('"),o(S.controls,"airplay")&&N.airplay&&e.push('"),o(S.controls,"fullscreen")&&e.push('"),e.push("
    "),e.join("")}function R(e,t){function n(e){var t="";switch(e){case"hd2160":t="4K";break;case"hd1440":t="WQHD";break;case"hd1080":t="HD";break;case"hd720":t="HD"}return t.length?['',''+t+"",""].join(""):""}function a(e){switch(e){case"hd2160":return"2160P";case"hd1440":return"1440P";case"hd1080":return"1080P";case"hd720":return"720P";case"large":return"480P";case"medium":return"360P";case"small":return"240P";default:return"Auto"}}if(!M.object(Je.quality)&&(Je.quality={available:e,current:t},M.array(e)&&e.length)){var o=e.filter(function(e){return["tiny","small"].indexOf(e)===-1}),r=o.map(function(e){return["
  • ",'","
    • "].join("")});r.unshift(['
  • ','","
    • "].join("")),console.warn(r)}}function D(){if(Je.supported.full&&("audio"!==Je.type||S.fullscreen.allowAudio)&&S.fullscreen.enabled){var e=N.fullscreen;e||S.fullscreen.fallback&&!K()?(Ze((e?"Native":"Fallback")+" fullscreen enabled"),d(Je.container,S.classes.fullscreen.enabled,!0)):Ze("Fullscreen not supported and fallback disabled"),Je.buttons&&Je.buttons.fullscreen&&_(Je.buttons.fullscreen,!1),Q()}}function H(e){M.event(e)&&(e=e.target),e.activeCues[0]&&"text"in e.activeCues[0]?W(e.activeCues[0].getCueAsHTML()):W()}function V(){if("video"===Je.type){U(S.selectors.captions)||Je.videoContainer.insertAdjacentHTML("afterbegin",'
    '),Je.usingTextTracks=!1,Je.media.textTracks&&(Je.usingTextTracks=!0);var e=[],t="";if(Je.media.childNodes.forEach(function(t){"track"===t.nodeName.toLowerCase()&&("captions"!==t.kind&&"subtitles"!==t.kind||e.push(t.getAttribute("src")))}),Je.captionExists=!0,0===e.length?(Je.captionExists=!1,Ze("No caption track found")):S.captions.selectedIndex+1>e.length?(Je.captionExists=!1,Ze("Caption index out of bound")):(t=e[S.captions.selectedIndex],Ze("Caption track found; URI: "+t)),Je.captionExists){var n=Je.media.textTracks;if([].forEach.call(n,function(e){v(e,"cuechange",H),e.mode="hidden"}),B(Je),(Je.browser.isIE&&Je.browser.version>=10||Je.browser.isFirefox&&Je.browser.version>=31)&&(Ze("Detected browser with known TextTrack issues - using manual fallback"),Je.usingTextTracks=!1),Je.usingTextTracks){Ze("TextTracks supported");var a=n[S.captions.selectedIndex];"captions"!==a.kind&&"subtitles"!==a.kind||(g(a,"cuechange",H),a.activeCues&&a.activeCues.length>0&&H(a))}else if(Ze("TextTracks not supported so rendering captions manually"),Je.currentCaption="",Je.captions=[],""!==t){var o=new XMLHttpRequest;o.onreadystatechange=function(){if(4===o.readyState)if(200===o.status){var e=o.responseText,t="\r\n";e.indexOf(t+t)===-1&&(t=e.indexOf("\r\r")!==-1?"\r":"\n");var n=e.split(t+t);Je.captions=n.map(function(e){var n=e.split(t),a=0;return n[a].indexOf(":")!==-1&&(a=1),[n[a],n[a+1]]}),Je.captions.shift(),Ze("Successfully loaded the caption file via AJAX")}else et(S.logPrefix+"There was a problem loading the caption file via AJAX")},o.open("get",t,!0),o.send()}}else d(Je.container,S.classes.captions.enabled)}}function W(e){var n=U(S.selectors.captions),a=t.createElement("span");n.innerHTML="",M.undefined(e)&&(e=""),M.string(e)?a.innerHTML=e.trim():a.appendChild(e),n.appendChild(a);n.offsetHeight}function Y(e){function t(e,t){var n=[];n=e.split(" --> ");for(var a=0;aJe.captions.length-1){Je.subcount=Je.captions.length-1;break}Je.media.currentTime.toFixed(1)>=n(Je.captions[Je.subcount][0])&&Je.media.currentTime.toFixed(1)<=a(Je.captions[Je.subcount][0])?(Je.currentCaption=Je.captions[Je.subcount][1],W(Je.currentCaption)):W()}}function B(){if(Je.buttons.captions){d(Je.container,S.classes.captions.enabled,!0);var e=Je.storage.captionsEnabled;M.boolean(e)||(e=S.captions.defaultActive),e&&(d(Je.container,S.classes.captions.active,!0),_(Je.buttons.captions,!0))}}function X(e){return Je.container.querySelectorAll(e)}function U(e){return X(e)[0]}function K(){try{return e.self!==e.top}catch(e){return!0}}function Q(){function e(e){9===e.which&&Je.isFullscreen&&(e.target!==a||e.shiftKey?e.target===n&&e.shiftKey&&(e.preventDefault(),a.focus()):(e.preventDefault(),n.focus()))}var t=X("input:not([disabled]), button:not([disabled])"),n=t[0],a=t[t.length-1];g(Je.container,"keydown",e)}function $(e,t){if(M.string(t))c(e,Je.media,{src:t});else if(t.constructor===Array)for(var n=t.length-1;n>=0;n--)c(e,Je.media,t[n])}function J(){if(S.loadSprite){var e=O();e.absolute?(Ze("AJAX loading absolute SVG sprite"+(Je.browser.isIE?" (due to IE)":"")),E(e.url,"sprite-plyr")):Ze("Sprite will be used as external resource directly")}var n=S.html;Ze("Injecting custom controls"),n||(n=j()),n=r(n,"{seektime}",S.seekTime),n=r(n,"{speed}",z()),n=r(n,"{lang}","English"),Je.id=Math.floor(1e4*Math.random()),n=r(n,"{id}",Je.id);var a;if(M.string(S.selectors.controls.container)&&(a=t.querySelector(S.selectors.controls.container)),M.htmlElement(a)||(a=Je.container),a.insertAdjacentHTML("beforeend",n),S.tooltips.controls)for(var o=X([S.selectors.controls.wrapper," ",S.selectors.labels," .",S.classes.hidden].join("")),l=o.length-1;l>=0;l--){var s=o[l];d(s,S.classes.hidden,!1),d(s,S.classes.tooltip,!0)}}function z(){return S.currentSpeed.toFixed(1).toString().replace(".0","")+"×"}function G(){try{return Je.controls=U(S.selectors.controls.wrapper),Je.buttons={seek:U(S.selectors.buttons.seek),play:X(S.selectors.buttons.play),pause:U(S.selectors.buttons.pause),restart:U(S.selectors.buttons.restart),rewind:U(S.selectors.buttons.rewind),forward:U(S.selectors.buttons.forward),fullscreen:U(S.selectors.buttons.fullscreen),settings:U(S.selectors.buttons.settings),pip:U(S.selectors.buttons.pip),speed:t.querySelectorAll(S.selectors.buttons.speed),loopin:t.querySelectorAll(S.selectors.buttons.loopin),loopout:t.querySelectorAll(S.selectors.buttons.loopout),loopall:t.querySelectorAll(S.selectors.buttons.loopall),loopclear:t.querySelectorAll(S.selectors.buttons.loopclear)},Je.buttons.mute=U(S.selectors.buttons.mute),Je.buttons.captions=U(S.selectors.buttons.captions),Je.progress={container:U(S.selectors.progress.container)},Je.progress.buffer=function(){var e=U(S.selectors.progress.buffer);return{bar:e,text:M.htmlElement(e)&&e.getElementsByTagName("span")[0]}}(),Je.progress.played=U(S.selectors.progress.played),Je.progress.tooltip=Je.progress.container&&Je.progress.container.querySelector("."+S.classes.tooltip),Je.volume={input:U(S.selectors.volume.input),display:U(S.selectors.volume.display)},Je.duration=U(S.selectors.duration),Je.currentTime=U(S.selectors.currentTime),Je.seekTime=X(S.selectors.seekTime),!0}catch(e){return et("It looks like there is a problem with your controls HTML",e),ee(!0),!1}}function Z(){d(Je.container,S.selectors.container.replace(".",""),Je.supported.full)}function ee(e){e&&o(S.types.html5,Je.type)?Je.media.setAttribute("controls",""):Je.media.removeAttribute("controls")}function te(e){var t=S.i18n.play;if(M.string(S.title)&&S.title.length&&(t+=", "+S.title,Je.container.setAttribute("aria-label",S.title)),Je.supported.full&&Je.buttons.play)for(var n=Je.buttons.play.length-1;n>=0;n--)Je.buttons.play[n].setAttribute("aria-label",t);M.htmlElement(e)&&e.setAttribute("title",S.i18n.frameTitle.replace("{title}",S.title))}function ne(){var t=null;Je.storage={},N.storage&&S.storage.enabled&&(e.localStorage.removeItem("plyr-volume"),t=e.localStorage.getItem(S.storage.key),t&&(/^\d+(\.\d+)?$/.test(t)?ae({volume:parseFloat(t)}):Je.storage=JSON.parse(t)))}function ae(t){N.storage&&S.storage.enabled&&(x(Je.storage,t),e.localStorage.setItem(S.storage.key,JSON.stringify(Je.storage)))}function oe(){if(!Je.media)return void et("No media element found!");if(Je.supported.full&&(d(Je.container,S.classes.type.replace("{0}",Je.type),!0),o(S.types.embed,Je.type)&&d(Je.container,S.classes.type.replace("{0}","video"),!0),d(Je.container,S.classes.pip.enabled,N.pip),d(Je.container,S.classes.stopped,S.autoplay),d(Je.container,S.classes.isIos,Je.browser.isIos),d(Je.container,S.classes.isTouch,Je.browser.isTouch),"video"===Je.type)){var e=t.createElement("div");e.setAttribute("class",S.classes.videoWrapper),l(Je.media,e),Je.videoContainer=e}o(S.types.embed,Je.type)&&re()}function re(){var n,o=t.createElement("div"),r=Je.type+"-"+Math.floor(1e4*Math.random());switch(Je.type){case"youtube":n=w(Je.embedId);break;case"vimeo":n=T(Je.embedId);break;default:n=Je.embedId}for(var l=X('[id^="'+Je.type+'-"]'),i=l.length-1;i>=0;i--)s(l[i]);if(d(Je.media,S.classes.videoWrapper,!0),d(Je.media,S.classes.embedWrapper,!0),"youtube"===Je.type)Je.media.appendChild(o),o.setAttribute("id",r),M.object(e.YT)?se(n,o):(a(S.urls.youtube.api),e.onYouTubeReadyCallbacks=e.onYouTubeReadyCallbacks||[],e.onYouTubeReadyCallbacks.push(function(){se(n,o)}),e.onYouTubeIframeAPIReady=function(){e.onYouTubeReadyCallbacks.forEach(function(e){e()})});else if("vimeo"===Je.type)if(Je.supported.full?Je.media.appendChild(o):o=Je.media,o.setAttribute("id",r),M.object(e.Vimeo))ie(n,o);else{a(S.urls.vimeo.api);var c=e.setInterval(function(){M.object(e.Vimeo)&&(e.clearInterval(c),ie(n,o))},50)}else if("soundcloud"===Je.type){var p=t.createElement("iframe");p.loaded=!1,g(p,"load",function(){p.loaded=!0}),u(p,{src:"https://w.soundcloud.com/player/?url=https://api.soundcloud.com/tracks/"+n,id:r}),o.appendChild(p),Je.media.appendChild(o),e.SC||a(S.urls.soundcloud.api);var m=e.setInterval(function(){e.SC&&p.loaded&&(e.clearInterval(m),ue.call(p))},50)}}function le(){Je.supported.full&&(Ke(),Qe()),te(U("iframe"))}function se(t,n){Je.embed=new e.YT.Player(n.id,{videoId:t,playerVars:{autoplay:S.autoplay?1:0,controls:Je.supported.full?0:1,rel:0,showinfo:0,iv_load_policy:3,cc_load_policy:S.captions.defaultActive?1:0,cc_lang_pref:"en",wmode:"transparent",modestbranding:1,disablekb:1,origin:"*"},events:{onError:function(e){C(Je.container,"error",!0,{code:e.data,embed:e.target})},onPlaybackQualityChange:function(e){var t=e.target,n=t.getPlaybackQuality();console.warn(n)},onReady:function(t){var n=t.target;Je.media.play=function(){n.playVideo(),Je.media.paused=!1},Je.media.pause=function(){n.pauseVideo(),Je.media.paused=!0},Je.media.stop=function(){n.stopVideo(),Je.media.paused=!0},Je.media.duration=n.getDuration(),Je.media.paused=!0,Je.media.currentTime=0,Je.media.muted=n.isMuted();var a=n.getPlaybackRate(),o=n.getAvailablePlaybackRates();console.warn(a,o),S.title=n.getVideoData().title,Je.supported.full&&Je.media.querySelector("iframe").setAttribute("tabindex","-1"),le(),C(Je.media,"timeupdate"),C(Je.media,"durationchange"),e.clearInterval(ze.buffering),ze.buffering=e.setInterval(function(){Je.media.buffered=n.getVideoLoadedFraction(),(null===Je.media.lastBuffered||Je.media.lastBuffered=n)return;S.loopout=n;break;case"loopall":S.loopin=0,S.loopout=Je.media.duration-2;break;default:S.loopin=0,S.loopout=null}S.loop=M.number(S.loopin)&&M.number(S.loopout);var a=Me(S.loopin,t.querySelector('[data-loop__value="loopin"]')),o=M.number(S.loopout)?Me(S.loopout,t.querySelector('[data-loop__value="loopout"]')):null;S.loop?t.querySelector('[data-menu="loop"]').innerHTML=a+" - "+o:t.querySelector('[data-menu="loop"]').innerHTML=S.i18n.loopclear}function ye(e){if(M.undefined(e)&&(e=Je.storage.speed||S.defaultSpeed),!M.array(S.speeds))return void et("Invalid speeds format");if(!M.number(e)){var n=S.speeds.indexOf(S.currentSpeed);if(n!==-1){var a=n+1;a>=S.speeds.length&&(a=0),e=S.speeds[a]}else e=S.defaultSpeed}S.currentSpeed=e,Je.media.playbackRate=e,ae({speed:e}),t.querySelector('[data-menu="speed"]').innerHTML=z()}function fe(e){M.number(e)||(e=S.seekTime),ge(Je.media.currentTime-e)}function be(e){M.number(e)||(e=S.seekTime),ge(Je.media.currentTime+e)}function ge(e){var t=0,n=Je.media.paused,a=ve();M.number(e)?t=e:M.event(e)&&o(["input","change"],e.type)&&(t=e.target.value/e.target.max*a),t<0?t=0:t>a&&(t=a),Oe(t);try{Je.media.currentTime=t.toFixed(4)}catch(e){}if(o(S.types.embed,Je.type)){switch(Je.type){case"youtube":Je.embed.seekTo(t);break;case"vimeo":Je.embed.setCurrentTime(t.toFixed(0));break;case"soundcloud":Je.embed.seekTo(1e3*t)}n&&pe(),C(Je.media,"timeupdate"),Je.media.seeking=!0,C(Je.media,"seeking")}Ze("Seeking to "+Je.media.currentTime+" seconds"),Y(t)}function ve(){var e=parseInt(S.duration),t=0;return null===Je.media.duration||isNaN(Je.media.duration)||(t=Je.media.duration),isNaN(e)?t:e}function he(){d(Je.container,S.classes.playing,!Je.media.paused),d(Je.container,S.classes.stopped,Je.media.paused),Re(Je.media.paused)}function _e(){P={x:e.pageXOffset||0,y:e.pageYOffset||0}}function ke(){e.scrollTo(P.x,P.y)}function xe(e){var n=N.fullscreen;if(n){if(!e||e.type!==I.eventType)return I.isFullScreen(Je.container)?I.cancelFullScreen():(_e(),I.requestFullScreen(Je.container)),void(Je.isFullscreen=I.isFullScreen(Je.container));Je.isFullscreen=I.isFullScreen(Je.container)}else Je.isFullscreen=!Je.isFullscreen,t.body.style.overflow=Je.isFullscreen?"hidden":"";d(Je.container,S.classes.fullscreen.active,Je.isFullscreen),Q(Je.isFullscreen),Je.buttons&&Je.buttons.fullscreen&&_(Je.buttons.fullscreen,Je.isFullscreen),C(Je.container,Je.isFullscreen?"enterfullscreen":"exitfullscreen",!0),!Je.isFullscreen&&n&&ke()}function we(e){if(M.boolean(e)||(e=!Je.media.muted),_(Je.buttons.mute,e),Je.media.muted=e,0===Je.media.volume&&Te(S.volume),o(S.types.embed,Je.type)){switch(Je.type){case"youtube":Je.embed[Je.media.muted?"mute":"unMute"]();break;case"vimeo":case"soundcloud":Je.embed.setVolume(Je.media.muted?0:parseFloat(S.volume/S.volumeMax)); +}C(Je.media,"volumechange")}}function Te(e){var t=S.volumeMax,n=S.volumeMin;if(M.undefined(e)&&(e=Je.storage.volume),(null===e||isNaN(e))&&(e=S.volume),e>t&&(e=t),e0&&we()}function Se(e){var t=Je.media.muted?0:Je.media.volume*S.volumeMax;M.number(e)||(e=S.volumeStep),Te(t+e)}function Ee(e){var t=Je.media.muted?0:Je.media.volume*S.volumeMax;M.number(e)||(e=S.volumeStep),Te(t-e)}function Ae(){var e=Je.media.muted?0:Je.media.volume*S.volumeMax;Je.supported.full&&(Je.volume.input&&(Je.volume.input.value=e),Je.volume.display&&(Je.volume.display.value=e)),ae({volume:e}),d(Je.container,S.classes.muted,0===e),Je.supported.full&&Je.buttons.mute&&_(Je.buttons.mute,0===e)}function Ce(e){Je.supported.full&&Je.buttons.captions&&(M.boolean(e)||(e=Je.container.className.indexOf(S.classes.captions.active)===-1),Je.captionsEnabled=e,_(Je.buttons.captions,Je.captionsEnabled),d(Je.container,S.classes.captions.active,Je.captionsEnabled),C(Je.container,Je.captionsEnabled?"captionsenabled":"captionsdisabled",!0),ae({captionsEnabled:Je.captionsEnabled}))}function Fe(e){S.captions.selectedIndex=e,W(),V()}function Ie(e){var t="waiting"===e.type;clearTimeout(ze.loading),ze.loading=setTimeout(function(){d(Je.container,S.classes.loading,t),Re(t)},t?250:0)}function Pe(e){if(Je.supported.full){var t=Je.progress.played,n=0,a=ve();if(e)switch(e.type){case"timeupdate":case"seeking":if(Je.controls.pressed)return;n=k(Je.media.currentTime,a),"timeupdate"===e.type&&Je.buttons.seek&&(Je.buttons.seek.value=n);break;case"playing":case"progress":t=Je.progress.buffer,n=function(){var e=Je.media.buffered;return e&&e.length?k(e.end(0),a):M.number(e)?100*e:0}()}M.number(S.loopin)&&M.number(S.loopout)&&Je.media.currentTime>=S.loopout&&ge(S.loopin),qe(t,n)}}function qe(e,t){if(Je.supported.full){if(M.undefined(t)&&(t=0),M.undefined(e)){if(!Je.progress||!Je.progress.buffer)return;e=Je.progress.buffer}M.htmlElement(e)?e.value=t:e&&(e.bar&&(e.bar.value=t),e.text&&(e.text.innerHTML=t))}}function Me(e,t){if(t){isNaN(e)&&(e=0),Je.secs=parseInt(e%60),Je.mins=parseInt(e/60%60),Je.hours=parseInt(e/60/60%60);var n=parseInt(ve()/60/60%60)>0;Je.secs=("0"+Je.secs).slice(-2),Je.mins=("0"+Je.mins).slice(-2);var a=(n?Je.hours+":":"")+Je.mins+":"+Je.secs;return t.innerHTML=a,a}}function Ne(){if(Je.supported.full){var e=ve()||0;!Je.duration&&S.displayDuration&&Je.media.paused&&Me(e,Je.currentTime),Je.duration&&Me(e,Je.duration),je()}}function Le(e){Me(Je.media.currentTime,Je.currentTime),e&&"timeupdate"===e.type&&Je.media.seeking||Pe(e)}function Oe(e){M.number(e)||(e=0);var t=ve(),n=k(e,t);Je.progress&&Je.progress.played&&(Je.progress.played.value=n),Je.buttons&&Je.buttons.seek&&(Je.buttons.seek.value=n)}function je(e){var t=ve();if(S.tooltips.seek&&Je.progress.container&&0!==t){var n=Je.progress.container.getBoundingClientRect(),a=0,r=S.classes.tooltip+"--visible";if(e)a=100/n.width*(e.pageX-n.left);else{if(!m(Je.progress.tooltip,r))return;a=Je.progress.tooltip.style.left.replace("%","")}a<0?a=0:a>100&&(a=100),Me(t/100*a,Je.progress.tooltip),Je.progress.tooltip.style.left=a+"%",e&&o(["mouseenter","mouseleave"],e.type)&&d(Je.progress.tooltip,r,"mouseenter"===e.type)}}function Re(t){if(S.hideControls&&"audio"!==Je.type){var n=0,a=!1,r=t,l=m(Je.container,S.classes.loading);if(M.boolean(t)||(t&&t.type?(a="enterfullscreen"===t.type,r=o(["mousemove","touchstart","mouseenter","focus"],t.type),o(["mousemove","touchmove"],t.type)&&(n=2e3),"focus"===t.type&&(n=3e3)):r=m(Je.container,S.classes.hideControls)),e.clearTimeout(ze.hover),r||Je.media.paused||l){if(d(Je.container,S.classes.hideControls,!1),Je.media.paused||l)return;Je.browser.isTouch&&(n=3e3)}r&&Je.media.paused||(ze.hover=e.setTimeout(function(){(!Je.controls.pressed&&!Je.controls.hover||a)&&d(Je.container,S.classes.hideControls,!0)},n))}}function De(e){if(!M.undefined(e))return void He(e);var t;switch(Je.type){case"youtube":t=Je.embed.getVideoUrl();break;case"vimeo":Je.embed.getVideoUrl.then(function(e){t=e});break;case"soundcloud":Je.embed.getCurrentSound(function(e){t=e.permalink_url});break;default:t=Je.media.currentSrc}return t||""}function He(e){function n(){if(Je.embed=null,s(Je.media),"video"===Je.type&&Je.videoContainer&&s(Je.videoContainer),Je.container&&Je.container.removeAttribute("class"),"type"in e&&(Je.type=e.type,"video"===Je.type)){var n=e.sources[0];"type"in n&&o(S.types.embed,n.type)&&(Je.type=n.type)}switch(Je.supported=A(Je.type),Je.type){case"video":Je.media=t.createElement("video");break;case"audio":Je.media=t.createElement("audio");break;case"youtube":case"vimeo":case"soundcloud":Je.media=t.createElement("div"),Je.embedId=e.sources[0].src}i(Je.container,Je.media),M.boolean(e.autoplay)&&(S.autoplay=e.autoplay),o(S.types.html5,Je.type)&&(S.crossorigin&&Je.media.setAttribute("crossorigin",""),S.autoplay&&Je.media.setAttribute("autoplay",""),"poster"in e&&Je.media.setAttribute("poster",e.poster),S.loop&&Je.media.setAttribute("loop","")),d(Je.container,S.classes.fullscreen.active,Je.isFullscreen),d(Je.container,S.classes.captions.active,Je.captionsEnabled),Z(),o(S.types.html5,Je.type)&&$("source",e.sources),oe(),o(S.types.html5,Je.type)&&("tracks"in e&&$("track",e.tracks),Je.media.load()),(o(S.types.html5,Je.type)||o(S.types.embed,Je.type)&&!Je.supported.full)&&(Ke(),Qe()),S.title=e.title,te()}return M.object(e)&&"sources"in e&&e.sources.length?(d(Je.container,S.classes.ready,!1),pe(),Oe(),qe(),Be(),void Xe(n,!1)):void et("Invalid source format")}function Ve(e){"video"===Je.type&&Je.media.setAttribute("poster",e)}function We(){function n(){var e=de(),t=Je.buttons[e?"play":"pause"],n=Je.buttons[e?"pause":"play"];if(n=n&&n.length>1?n[n.length-1]:n[0]){var a=m(t,S.classes.tabFocus);setTimeout(function(){n.focus(),a&&(d(t,S.classes.tabFocus,!1),d(n,S.classes.tabFocus,!0))},100)}}function a(){var e=t.activeElement;return e=e&&e!==t.body?t.querySelector(":focus"):null}function r(e){return e.keyCode?e.keyCode:e.which}function l(e){for(var t in Je.buttons){var n=Je.buttons[t];if(M.nodeList(n))for(var a=0;a0)&&(t?Ee(n):Se(n)),(e.deltaY>0||e.deltaX<0)&&(t?Se(n):Ee(n))})}function Ye(){if(g(Je.media,"timeupdate seeking",Le),g(Je.media,"timeupdate",Y),g(Je.media,"durationchange loadedmetadata",Ne),g(Je.media,"ended",function(){"video"===Je.type&&S.showPosterOnEnd&&("video"===Je.type&&W(),ge(),Je.media.load())}),g(Je.media,"progress playing",Pe),g(Je.media,"volumechange",Ae),g(Je.media,"play pause ended",he),g(Je.media,"waiting canplay seeked",Ie),S.clickToPlay&&"audio"!==Je.type){var e=U("."+S.classes.videoWrapper);if(!e)return;e.style.cursor="pointer",g(e,"click",function(){S.hideControls&&Je.browser.isTouch&&!Je.media.paused||(Je.media.paused?ce():Je.media.ended?(ge(),ce()):pe())})}S.disableContextMenu&&g(Je.media,"contextmenu",function(e){e.preventDefault()}),g(Je.media,S.events.concat(["keyup","keydown"]).join(" "),function(e){C(Je.container,e.type,!0)})}function Be(){if(o(S.types.html5,Je.type)){for(var e=Je.media.querySelectorAll("source"),t=0;t controls Array - ['play-large', 'play', 'speed-up', 'progress', 'current-time', 'mute', 'volume', 'captions', 'fullscreen'] + ['play-large', 'play', 'progress', 'current-time', 'mute', 'volume', 'captions', 'fullscreen'] Toggle which control elements you would like to display when using the default controls html. If you specify a html option, this is redundant. The default value is to display everything. @@ -402,6 +402,12 @@ Note the single quotes encapsulating the JSON and double quotes on the object ke [1.0, 1.5, 2.0, 0.5] Playback speed list. + + loops + Array + [Loop All, Loop in, Loop out, No Loop] + Playback loop list. + diff --git a/src/js/plyr.js b/src/js/plyr.js index 346bfb7e..3b849d4f 100644 --- a/src/js/plyr.js +++ b/src/js/plyr.js @@ -38,6 +38,8 @@ debug: false, autoplay: false, loop: false, + loopin: 0, + loopout: null, seekTime: 10, volume: 10, volumeMin: 0, @@ -86,7 +88,11 @@ settings: '[data-plyr="settings"]', pip: '[data-plyr="pip"]', airplay: '[data-plyr="airplay"]', - speed: '[data-plyr="speed"]' + speed: '[data-plyr="speed"]', + loopin: '[data-plyr="loopin"]', + loopout: '[data-plyr="loopout"]', + loopall: '[data-plyr="loopall"]', + loopclear: '[data-plyr="loopclear"]', }, volume: { input: '[data-plyr="volume"]', @@ -163,7 +169,12 @@ captions: 'Captions', settings: 'Settings', speed: 'Speed', - quality: 'Quality' + quality: 'Quality', + loop: 'Loop', + loopin: 'Loop in', + loopout: 'Loop out', + loopall: 'Loop all', + loopclear: 'No Loop', }, types: { embed: ['youtube', 'vimeo', 'soundcloud'], @@ -193,7 +204,11 @@ volume: null, captions: null, fullscreen: null, - speed: null + speed: null, + loopin: null, + loopout: null, + loopall: null, + loopclear: null }, // Events to watch on HTML5 media elements events: ['ready', 'ended', 'progress', 'stalled', 'playing', 'waiting', 'canplay', 'canplaythrough', 'loadstart', 'loadeddata', 'loadedmetadata', 'timeupdate', 'volumechange', 'play', 'pause', 'error', 'seeking', 'seeked', 'emptied'], @@ -997,6 +1012,12 @@ 'Auto', '', '', + '
  • ', + '', + '
    • ', '', '', '', + '', '', '', '' @@ -1278,6 +1331,35 @@ } } + // Setup Loop + function setupLoop() { + if (!plyr.supported.full) { + return; + } + + if ((plyr.type !== 'audio' || config.fullscreen.allowAudio) && config.fullscreen.enabled) { + // Check for native support + var nativeSupport = support.fullscreen; + + if (nativeSupport || (config.fullscreen.fallback && !inFrame())) { + log((nativeSupport ? 'Native' : 'Fallback') + ' fullscreen enabled'); + + // Add styling hook + toggleClass(plyr.container, config.classes.fullscreen.enabled, true); + } else { + log('Fullscreen not supported and fallback disabled'); + } + + // Toggle state + if (plyr.buttons && plyr.buttons.fullscreen) { + toggleState(plyr.buttons.fullscreen, false); + } + + // Setup focus trap + focusTrap(); + } + } + // Display active caption if it contains text function setActiveCue(track) { // Get the track from the event if needed @@ -1715,7 +1797,11 @@ fullscreen: getElement(config.selectors.buttons.fullscreen), settings: getElement(config.selectors.buttons.settings), pip: getElement(config.selectors.buttons.pip), - speed: document.querySelectorAll(config.selectors.buttons.speed) + speed: document.querySelectorAll(config.selectors.buttons.speed), + loopin: document.querySelectorAll(config.selectors.buttons.loopin), + loopout: document.querySelectorAll(config.selectors.buttons.loopout), + loopall: document.querySelectorAll(config.selectors.buttons.loopall), + loopclear: document.querySelectorAll(config.selectors.buttons.loopclear) }; // Inputs @@ -2410,6 +2496,50 @@ return toggle; } + // Toggle loop + function toggleLoop(toggle) { + if (['loopin', 'loopout', 'loopall'].indexOf(toggle) === -1) { + toggle = 'loopclear'; + } + + var currentTime = Number(plyr.media.currentTime); + + switch(toggle) { + case 'loopin': + if (config.loopout && config.loopout <= currentTime) { + config.loopout = null; + } + config.loopin = currentTime; + break; + case 'loopout': + if (config.loopin >= currentTime) { + return; + } + config.loopout = currentTime; + break; + case 'loopall': + config.loopin = 0; + config.loopout = plyr.media.duration - 2; + break; + default: + config.loopin = 0; + config.loopout = null; + break; + } + + //check if can loop + config.loop = is.number(config.loopin) && is.number(config.loopout); + + var loopin = updateTimeDisplay(config.loopin, document.querySelector('[data-loop__value="loopin"]')); + var loopout = is.number(config.loopout) ? updateTimeDisplay(config.loopout, document.querySelector('[data-loop__value="loopout"]')) : null; + if (config.loop) { + document.querySelector('[data-menu="loop"]').innerHTML = loopin + ' - ' + loopout; + } else { + document.querySelector('[data-menu="loop"]').innerHTML = config.i18n.loopclear; + } + + } + // Speed-up function setSpeed(speed) { // Load speed from storage or default value @@ -2776,6 +2906,36 @@ } } + + // Update volume UI and storage + function updateLoop() { + // Get the current volume + var volume = plyr.media.muted ? 0 : (plyr.media.volume * config.volumeMax); + + // Update the if present + if (plyr.supported.full) { + if (plyr.volume.input) { + plyr.volume.input.value = volume; + } + if (plyr.volume.display) { + plyr.volume.display.value = volume; + } + } + + // Update the volume in storage + updateStorage({ + volume: volume + }); + + // Toggle class if muted + toggleClass(plyr.container, config.classes.muted, (volume === 0)); + + // Update checkbox for mute state + if (plyr.supported.full && plyr.buttons.mute) { + toggleState(plyr.buttons.mute, (volume === 0)); + } + } + // Toggle captions function toggleCaptions(show) { // If there's no full support, or there's no caption toggle @@ -2885,7 +3045,10 @@ } } - // Set values + if (is.number(config.loopin) && is.number(config.loopout) && plyr.media.currentTime >= config.loopout) { + seek(config.loopin); + } + setProgress(progress, value); } @@ -2945,8 +3108,10 @@ plyr.secs = ('0' + plyr.secs).slice(-2); plyr.mins = ('0' + plyr.mins).slice(-2); + var txt = (displayHours ? plyr.hours + ':' : '') + plyr.mins + ':' + plyr.secs; // Render - element.innerHTML = (displayHours ? plyr.hours + ':' : '') + plyr.mins + ':' + plyr.secs; + element.innerHTML = txt; + return txt; } // Show the duration on metadataloaded @@ -3577,6 +3742,20 @@ // Fullscreen proxy(plyr.buttons.fullscreen, 'click', config.listeners.fullscreen, toggleFullscreen); + // Loop + proxy(plyr.buttons.loopall, 'click', config.listeners.loopall, function () { + toggleLoop('loopall'); + }); + proxy(plyr.buttons.loopin, 'click', config.listeners.loopin, function(){ + toggleLoop('loopin'); + }); + proxy(plyr.buttons.loopout, 'click', config.listeners.loopout, function () { + toggleLoop('loopout'); + }); + proxy(plyr.buttons.loopclear, 'click', config.listeners.loopclear, function () { + toggleLoop('loopclear'); + }); + // Handle user exiting fullscreen by escaping etc if (support.fullscreen) { on(document, fullscreen.eventType, toggleFullscreen); @@ -4019,6 +4198,10 @@ // Set playback speed setSpeed(); + + // Set loop + toggleLoop(); + // Reset time display timeUpdate(); @@ -4061,12 +4244,16 @@ isPaused: function() { return plyr.media.paused; }, + isLooping: function() { + return config.loopin && config.loopout; + }, on: function(event, callback) { on(plyr.container, event, callback); return this; }, play: play, pause: pause, + loop: toggleLoop, stop: function() { pause(); seek();