diff options
author | Sam <me@sampotts.me> | 2016-04-25 20:05:01 +1000 |
---|---|---|
committer | Sam <me@sampotts.me> | 2016-04-25 20:05:01 +1000 |
commit | 833d3ac36f5190c88dcbf09229a9da14996f0607 (patch) | |
tree | fc99c64612f5efdc3fa221f470519ecfc2ddb411 | |
parent | fdaeecbb068e993d871e761dbf6bee24c4ac1880 (diff) | |
download | plyr-833d3ac36f5190c88dcbf09229a9da14996f0607.tar.lz plyr-833d3ac36f5190c88dcbf09229a9da14996f0607.tar.xz plyr-833d3ac36f5190c88dcbf09229a9da14996f0607.zip |
Tweaks
-rw-r--r-- | dist/plyr.css | 2 | ||||
-rw-r--r-- | dist/plyr.js | 4 | ||||
-rw-r--r-- | dist/sprite.svg | 2 | ||||
-rw-r--r-- | docs/dist/docs.svg | 1 | ||||
-rw-r--r-- | src/js/plyr.js | 15 | ||||
-rw-r--r-- | src/less/plyr.less | 877 |
6 files changed, 452 insertions, 449 deletions
diff --git a/dist/plyr.css b/dist/plyr.css index d8a5c452..b75d6e2a 100644 --- a/dist/plyr.css +++ b/dist/plyr.css @@ -1 +1 @@ -.plyr__tooltip,.plyr__video-embed.plyr iframe{pointer-events:none}.plyr--playing .plyr__play-large,.plyr__tooltip{visibility:hidden;opacity:0}@-webkit-keyframes plyr-progress{to{background-position:25px 0}}@keyframes plyr-progress{to{background-position:25px 0}}.plyr{position:relative;max-width:100%;min-width:290px;font-family:Avenir,"Avenir Next","Helvetica Neue","Segoe UI",Helvetica,Arial,sans-serif}.plyr,.plyr *,.plyr ::after,.plyr ::before{box-sizing:border-box}.plyr a,.plyr button,.plyr input,.plyr label{-ms-touch-action:manipulation;touch-action:manipulation}.plyr__sr-only{position:absolute!important;clip:rect(1px,1px,1px,1px);padding:0!important;border:0!important;height:1px!important;width:1px!important;overflow:hidden}.plyr__video-wrapper{position:relative;background:#000;border-radius:inherit}.plyr audio,.plyr video{width:100%;height:auto;vertical-align:middle;border-radius:inherit}.plyr__video-embed{padding-bottom:56.25%;height:0;overflow:hidden;border-radius:inherit}.plyr__video-embed iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.plyr__video-embed>div{position:relative;padding-bottom:200%;-webkit-transform:translateY(-35.95%);transform:translateY(-35.95%)}.plyr video::-webkit-media-text-track-container{display:none}.plyr__captions{display:none;position:absolute;bottom:0;left:0;width:100%;padding:20px 20px 80px;color:#fff;font-size:20px;text-align:center;font-weight:400}.plyr__captions span{border-radius:2px;padding:3px 10px;background:rgba(0,0,0,.85)}.plyr__captions span:empty{display:none}@media (min-width:768px){.plyr__captions{font-size:24px}}.plyr--captions-active .plyr__captions{display:block}.plyr--fullscreen-active .plyr__captions{font-size:32px}.plyr input[type=range]{display:block;height:16px;width:100%;margin:0;padding:0;vertical-align:middle;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;border:none;background:0 0}.plyr input[type=range]::-webkit-slider-runnable-track{height:8px;background:rgba(255,255,255,.25);border:0;border-radius:4px;-webkit-user-select:none;user-select:none}.plyr input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;margin-top:-4px;position:relative;height:16px;width:16px;background:#fff;border:2px solid transparent;border-radius:100%;transition:background .2s ease,border .2s ease,-webkit-transform .2s ease;transition:background .2s ease,border .2s ease,transform .2s ease;transition:background .2s ease,border .2s ease,transform .2s ease,-webkit-transform .2s ease;box-shadow:0 1px 1px rgba(0,0,0,.15);box-sizing:border-box}.plyr input[type=range]::-moz-range-track{height:8px;background:rgba(255,255,255,.25);border:0;border-radius:4px;-moz-user-select:none;user-select:none}.plyr input[type=range]::-moz-range-thumb{position:relative;height:16px;width:16px;background:#fff;border:2px solid transparent;border-radius:100%;transition:background .2s ease,border .2s ease,-webkit-transform .2s ease;transition:background .2s ease,border .2s ease,transform .2s ease;transition:background .2s ease,border .2s ease,transform .2s ease,-webkit-transform .2s ease;box-shadow:0 1px 1px rgba(0,0,0,.15);box-sizing:border-box}.plyr input[type=range]::-ms-track{height:8px;background:0 0;border:0;color:transparent}.plyr input[type=range]::-ms-fill-lower,.plyr input[type=range]::-ms-fill-upper{height:8px;background:rgba(255,255,255,.25);border:0;border-radius:4px;-ms-user-select:none;user-select:none}.plyr input[type=range]::-ms-thumb{position:relative;height:16px;width:16px;background:#fff;border:2px solid transparent;border-radius:100%;transition:background .2s ease,border .2s ease,-webkit-transform .2s ease;transition:background .2s ease,border .2s ease,transform .2s ease;transition:background .2s ease,border .2s ease,transform .2s ease,-webkit-transform .2s ease;box-shadow:0 1px 1px rgba(0,0,0,.15);box-sizing:border-box;margin-top:0}.plyr input[type=range]::-ms-tooltip{display:none}.plyr input[type=range]:focus{outline:0}.plyr input[type=range]::-moz-focus-outer{border:0}.plyr input[type=range].tab-focus:focus{outline:rgba(255,255,255,.5) dotted 1px;outline-offset:3px}.plyr input[type=range]:active::-webkit-slider-thumb{background:#3498DB;border-color:#fff;-webkit-transform:scale(1.25);transform:scale(1.25)}.plyr input[type=range]:active::-moz-range-thumb{background:#3498DB;border-color:#fff;transform:scale(1.25)}.plyr input[type=range]:active::-ms-thumb{background:#3498DB;border-color:#fff;transform:scale(1.25)}.plyr__play-large{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);padding:10px;background:#3498DB;border:4px solid #fff;border-radius:100%;color:#fff}.plyr__play-large svg{position:relative;left:2px;width:20px;height:20px;display:block;fill:currentColor}.plyr__play-large:focus{outline:rgba(255,255,255,.5) dotted 1px}.plyr__controls,.plyr__play-large{transition:visibility .3s ease,opacity .3s ease}.plyr__controls{position:absolute;left:0;right:0;bottom:0;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;padding:50px 10px 10px;background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.25));border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;line-height:1;text-align:center}.plyr__controls .plyr__progress,.plyr__controls .plyr__time,.plyr__controls .plyr__volume[type=range],.plyr__controls>button{margin-left:10px}.plyr__controls .plyr__progress::first-child,.plyr__controls .plyr__time::first-child,.plyr__controls .plyr__volume[type=range]::first-child,.plyr__controls [data-plyr=mute],.plyr__controls>button::first-child{margin-left:0}.plyr__controls button{position:relative;display:inline-block;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;vertical-align:middle;padding:5px 10px;border:0;background:0 0;border-radius:3px;cursor:pointer;color:#fff;transition:background .3s ease,color .3s ease,opacity .3s ease}.plyr__controls button svg{width:18px;height:18px;display:block;fill:currentColor}.plyr--playing .plyr__controls [data-plyr=play],.plyr__controls .icon--captions-on,.plyr__controls .icon--exit-fullscreen,.plyr__controls .icon--muted,.plyr__controls [data-plyr=pause]{display:none}.plyr__controls button.tab-focus:focus,.plyr__controls button:hover{background:#3498DB;color:#fff}.plyr__controls button:focus{outline:0}.plyr__tooltip{position:absolute;z-index:2;bottom:100%;margin-bottom:10px;padding:5px 7.5px;background:#000;box-shadow:0 0 5px rgba(0,0,0,.1),0 0 0 1px rgba(0,0,0,.1);border-radius:3px;color:#fff;font-size:14px;line-height:1.3;-webkit-transform:translate(-50%,10px) scale(.8);transform:translate(-50%,10px) scale(.8);-webkit-transform-origin:50% 100%;transform-origin:50% 100%;transition:opacity .2s .1s ease,visibility .3s ease,-webkit-transform .2s .1s ease;transition:transform .2s .1s ease,opacity .2s .1s ease,visibility .3s ease;transition:transform .2s .1s ease,opacity .2s .1s ease,visibility .3s ease,-webkit-transform .2s .1s ease}.plyr__tooltip::after,.plyr__tooltip::before{content:'';position:absolute;width:0;height:0;top:100%;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.plyr__tooltip::after{bottom:-6px;border-right:5px solid transparent;border-top:5px solid rgba(0,0,0,.2);border-left:5px solid transparent;z-index:1}.plyr__tooltip::before{bottom:-4px;border-right:4px solid transparent;border-top:4px solid #000;border-left:4px solid transparent;z-index:2}.plyr button.tab-focus:focus .plyr__tooltip,.plyr button:hover .plyr__tooltip,.plyr__tooltip--visible{visibility:visible;opacity:1;-webkit-transform:translate(-50%,0) scale(1);transform:translate(-50%,0) scale(1)}.plyr button:hover .plyr__tooltip{z-index:3}.plyr__progress{position:relative;-webkit-flex:1;-ms-flex:1;flex:1}.plyr__progress input[type=range]{position:relative;z-index:2}.plyr__progress input[type=range]::-webkit-slider-runnable-track{background:0 0}.plyr__progress input[type=range]::-moz-range-track{background:0 0}.plyr__progress input[type=range]::-ms-fill-lower,.plyr__progress input[type=range]::-ms-fill-upper{background:0 0}.plyr__progress--buffer[value],.plyr__progress--played[value]{position:absolute;left:0;top:50%;width:100%;height:8px;margin:-4px 0 0;padding:0;vertical-align:top;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;border-radius:100px}.plyr__progress--buffer[value]::-webkit-progress-bar,.plyr__progress--played[value]::-webkit-progress-bar{background:0 0}.plyr__progress--buffer[value]::-webkit-progress-value,.plyr__progress--played[value]::-webkit-progress-value{background:currentColor;border-radius:100px;min-width:8px}.plyr__progress--buffer[value]::-moz-progress-bar,.plyr__progress--played[value]::-moz-progress-bar{background:currentColor;border-radius:100px;min-width:8px}.plyr__progress--buffer[value]::-ms-fill,.plyr__progress--played[value]::-ms-fill{border-radius:100px}.plyr__progress--played[value]{z-index:1;color:#3498DB;background:0 0}.plyr__progress--played[value]::-webkit-progress-value{background:currentColor;min-width:8px;border-top-right-radius:0;border-bottom-right-radius:0}.plyr__progress--played[value]::-moz-progress-bar{background:currentColor;min-width:8px;border-top-right-radius:0;border-bottom-right-radius:0}.plyr__progress--played[value]::-ms-fill{min-width:8px;border-top-right-radius:0;border-bottom-right-radius:0}.plyr__progress--buffer[value]{color:rgba(255,255,255,.25);background:rgba(255,255,255,.25)}.plyr__progress--buffer[value]::-webkit-progress-value{transition:width .2s ease}.plyr__progress--buffer[value]::-moz-progress-bar{transition:width .2s ease}.plyr__progress--buffer[value]::-ms-fill{transition:width .2s ease}.plyr__progress .plyr__tooltip{left:0}.plyr--loading .plyr__progress--buffer{-webkit-animation:plyr-progress 1s linear infinite;animation:plyr-progress 1s linear infinite;background-size:25px 25px;background-repeat:repeat-x;background-color:rgba(255,255,255,.25);background-image:linear-gradient(-45deg,rgba(0,0,0,.15) 25%,transparent 25%,transparent 50%,rgba(0,0,0,.15) 50%,rgba(0,0,0,.15) 75%,transparent 75%,transparent);color:transparent}.plyr--playing .plyr__controls [data-plyr=pause],.plyr__time{display:inline-block}.plyr__time{vertical-align:middle;color:#fff;font-size:14px;line-height:.95}.plyr__time+.plyr__time{display:none}@media (min-width:560px){.plyr__time+.plyr__time{display:inline-block}}.plyr__time+.plyr__time::before{content:'\2044';margin-right:10px}.plyr__volume[type=range]{max-width:100px}.plyr--is-ios .plyr__volume,.plyr--is-ios [data-plyr=mute],.plyr--is-ios.plyr--audio .plyr__controls--right{display:none}.plyr--is-ios.plyr--audio .plyr__controls--left{float:none}.plyr--audio .plyr__controls{padding-top:20px}.plyr--audio .plyr__progress{bottom:auto;top:0;background:#fff}.plyr--fullscreen-active,.plyr.plyr--fullscreen{position:fixed;top:0;left:0;right:0;bottom:0;height:100%;width:100%;z-index:10000000;background:#000}.plyr--fullscreen-active video,.plyr.plyr--fullscreen video{height:100%}.plyr--fullscreen-active .plyr__video-wrapper,.plyr.plyr--fullscreen .plyr__video-wrapper{height:100%;width:100%}.plyr--fullscreen-active .plyr__controls,.plyr.plyr--fullscreen .plyr__controls{position:absolute;bottom:0;left:0;right:0}.plyr.plyr--hide-controls .plyr__controls{opacity:0;visibility:hidden}.plyr--captions-active .plyr__controls .icon--captions-on,.plyr--fullscreen-active .icon--exit-fullscreen,.plyr--muted .plyr__controls .icon--muted{display:block}.plyr [data-plyr=captions],.plyr [data-plyr=fullscreen],.plyr--captions-active .plyr__controls .icon--captions-on+svg,.plyr--fullscreen-active .icon--exit-fullscreen+svg,.plyr--muted .plyr__controls .icon--muted+svg{display:none}.plyr--captions-enabled [data-plyr=captions],.plyr--fullscreen-enabled [data-plyr=fullscreen]{display:inline-block}
\ No newline at end of file +.plyr.plyr__video-embed iframe,.plyr__tooltip{pointer-events:none}.plyr--hide-controls .plyr__controls,.plyr--playing .plyr__play-large,.plyr__tooltip{visibility:hidden;opacity:0}@-webkit-keyframes plyr-progress{to{background-position:25px 0}}@keyframes plyr-progress{to{background-position:25px 0}}.plyr{position:relative;max-width:100%;min-width:290px;font-family:Avenir,"Avenir Next","Helvetica Neue","Segoe UI",Helvetica,Arial,sans-serif}.plyr,.plyr *,.plyr ::after,.plyr ::before{box-sizing:border-box}.plyr a,.plyr button,.plyr input,.plyr label{-ms-touch-action:manipulation;touch-action:manipulation}.plyr audio,.plyr video{width:100%;height:auto;vertical-align:middle;border-radius:inherit}.plyr input[type=range]{display:block;height:16px;width:100%;margin:0;padding:0;vertical-align:middle;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;border:none;background:0 0}.plyr input[type=range]::-webkit-slider-runnable-track{height:8px;background:rgba(255,255,255,.25);border:0;border-radius:4px;-webkit-user-select:none;user-select:none}.plyr input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;margin-top:-4px;position:relative;height:16px;width:16px;background:#fff;border:2px solid transparent;border-radius:100%;transition:background .2s ease,border .2s ease,-webkit-transform .2s ease;transition:background .2s ease,border .2s ease,transform .2s ease;transition:background .2s ease,border .2s ease,transform .2s ease,-webkit-transform .2s ease;box-shadow:0 1px 1px rgba(0,0,0,.15);box-sizing:border-box}.plyr input[type=range]::-moz-range-track{height:8px;background:rgba(255,255,255,.25);border:0;border-radius:4px;-moz-user-select:none;user-select:none}.plyr input[type=range]::-moz-range-thumb{position:relative;height:16px;width:16px;background:#fff;border:2px solid transparent;border-radius:100%;transition:background .2s ease,border .2s ease,-webkit-transform .2s ease;transition:background .2s ease,border .2s ease,transform .2s ease;transition:background .2s ease,border .2s ease,transform .2s ease,-webkit-transform .2s ease;box-shadow:0 1px 1px rgba(0,0,0,.15);box-sizing:border-box}.plyr input[type=range]::-ms-track{height:8px;background:0 0;border:0;color:transparent}.plyr input[type=range]::-ms-fill-lower,.plyr input[type=range]::-ms-fill-upper{height:8px;background:rgba(255,255,255,.25);border:0;border-radius:4px;-ms-user-select:none;user-select:none}.plyr input[type=range]::-ms-thumb{position:relative;height:16px;width:16px;background:#fff;border:2px solid transparent;border-radius:100%;transition:background .2s ease,border .2s ease,-webkit-transform .2s ease;transition:background .2s ease,border .2s ease,transform .2s ease;transition:background .2s ease,border .2s ease,transform .2s ease,-webkit-transform .2s ease;box-shadow:0 1px 1px rgba(0,0,0,.15);box-sizing:border-box;margin-top:0}.plyr input[type=range]::-ms-tooltip{display:none}.plyr input[type=range]:focus{outline:0}.plyr input[type=range]::-moz-focus-outer{border:0}.plyr input[type=range].tab-focus:focus{outline:rgba(255,255,255,.5) dotted 1px;outline-offset:3px}.plyr input[type=range]:active::-webkit-slider-thumb{background:#3498DB;border-color:#fff;-webkit-transform:scale(1.25);transform:scale(1.25)}.plyr input[type=range]:active::-moz-range-thumb{background:#3498DB;border-color:#fff;transform:scale(1.25)}.plyr input[type=range]:active::-ms-thumb{background:#3498DB;border-color:#fff;transform:scale(1.25)}.plyr__sr-only{position:absolute!important;clip:rect(1px,1px,1px,1px);padding:0!important;border:0!important;height:1px!important;width:1px!important;overflow:hidden}.plyr__video-wrapper{position:relative;background:#000;border-radius:inherit}.plyr__video-embed{padding-bottom:56.25%;height:0;overflow:hidden;border-radius:inherit}.plyr__video-embed iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.plyr__video-embed>div{position:relative;padding-bottom:200%;-webkit-transform:translateY(-35.95%);transform:translateY(-35.95%)}.plyr__captions,.plyr__controls{position:absolute;left:0;bottom:0;text-align:center}.plyr video::-webkit-media-text-track-container{display:none}.plyr__captions{display:none;width:100%;padding:20px 20px 80px;color:#fff;font-size:20px;font-weight:400}.plyr__captions span{border-radius:2px;padding:3px 10px;background:rgba(0,0,0,.85)}.plyr__captions span:empty{display:none}@media (min-width:768px){.plyr__captions{font-size:24px}}.plyr--captions-active __captions{display:block}.plyr--fullscreen-active __captions{font-size:32px}.plyr__controls,.plyr__play-large{transition:visibility .3s ease,opacity .3s ease}.plyr__controls{right:0;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;padding:50px 10px 10px;background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.5));border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;line-height:1}.plyr__controls .plyr__progress,.plyr__controls .plyr__time,.plyr__controls .plyr__volume[type=range],.plyr__controls>button{margin-left:10px}.plyr__controls .plyr__progress::first-child,.plyr__controls .plyr__time::first-child,.plyr__controls .plyr__volume[type=range]::first-child,.plyr__controls [data-plyr=mute],.plyr__controls>button::first-child{margin-left:0}.plyr__controls button{position:relative;display:inline-block;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;vertical-align:middle;padding:5px 10px;border:0;background:0 0;border-radius:3px;cursor:pointer;color:#fff;transition:background .3s ease,color .3s ease,opacity .3s ease}.plyr__controls button.tab-focus:focus,.plyr__controls button:hover,.plyr__play-large{background:#3498DB;color:#fff}.plyr__controls button svg{width:18px;height:18px;display:block;fill:currentColor}.plyr__controls button:focus{outline:0}.plyr__controls .icon--captions-on,.plyr__controls .icon--exit-fullscreen,.plyr__controls .icon--muted{display:none}.plyr__play-large{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);padding:10px;border:4px solid #fff;border-radius:100%}.plyr__play-large svg{position:relative;left:2px;width:20px;height:20px;display:block;fill:currentColor}.plyr__play-large:focus{outline:rgba(255,255,255,.5) dotted 1px}.plyr--playing .plyr__controls [data-plyr=play],.plyr__controls [data-plyr=pause]{display:none}.plyr--playing .plyr__controls [data-plyr=pause]{display:inline-block}.plyr--captions-active .plyr__controls .icon--captions-on,.plyr--fullscreen-active .icon--exit-fullscreen,.plyr--muted .plyr__controls .icon--muted{display:block}.plyr--captions-active .plyr__controls .icon--captions-on+svg,.plyr--fullscreen-active .icon--exit-fullscreen+svg,.plyr--muted .plyr__controls .icon--muted+svg,[data-plyr=captions],[data-plyr=fullscreen]{display:none}.plyr--captions-enabled [data-plyr=captions],.plyr--fullscreen-enabled [data-plyr=fullscreen],.plyr__time{display:inline-block}.plyr__tooltip{position:absolute;z-index:2;bottom:100%;margin-bottom:10px;padding:5px 7.5px;background:#000;box-shadow:0 0 5px rgba(0,0,0,.1),0 0 0 1px rgba(0,0,0,.1);border-radius:3px;color:#fff;font-size:14px;line-height:1.3;-webkit-transform:translate(-50%,10px) scale(.8);transform:translate(-50%,10px) scale(.8);-webkit-transform-origin:50% 100%;transform-origin:50% 100%;transition:opacity .2s .1s ease,visibility .3s ease,-webkit-transform .2s .1s ease;transition:transform .2s .1s ease,opacity .2s .1s ease,visibility .3s ease;transition:transform .2s .1s ease,opacity .2s .1s ease,visibility .3s ease,-webkit-transform .2s .1s ease}.plyr__tooltip::before{content:'';position:absolute;width:0;height:0;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);bottom:-4px;border-right:4px solid transparent;border-top:4px solid #000;border-left:4px solid transparent;z-index:2}.plyr button.tab-focus:focus .plyr__tooltip,.plyr button:hover .plyr__tooltip,.plyr__tooltip--visible{visibility:visible;opacity:1;-webkit-transform:translate(-50%,0) scale(1);transform:translate(-50%,0) scale(1)}.plyr button:hover .plyr__tooltip{z-index:3}.plyr__progress{position:relative;-webkit-flex:1;-ms-flex:1;flex:1}.plyr__progress input[type=range]{position:relative;z-index:2}.plyr__progress input[type=range]::-webkit-slider-runnable-track{background:0 0}.plyr__progress input[type=range]::-moz-range-track{background:0 0}.plyr__progress input[type=range]::-ms-fill-lower,.plyr__progress input[type=range]::-ms-fill-upper{background:0 0}.plyr__progress .plyr__tooltip{left:0}.plyr__progress--buffer[value],.plyr__progress--played[value]{position:absolute;left:0;top:50%;width:100%;height:8px;margin:-4px 0 0;padding:0;vertical-align:top;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;border-radius:100px}.plyr__progress--buffer[value]::-webkit-progress-bar,.plyr__progress--played[value]::-webkit-progress-bar{background:0 0}.plyr__progress--buffer[value]::-webkit-progress-value,.plyr__progress--played[value]::-webkit-progress-value{background:currentColor;border-radius:100px;min-width:8px}.plyr__progress--buffer[value]::-moz-progress-bar,.plyr__progress--played[value]::-moz-progress-bar{background:currentColor;border-radius:100px;min-width:8px}.plyr__progress--buffer[value]::-ms-fill,.plyr__progress--played[value]::-ms-fill{border-radius:100px}.plyr__progress--played[value]{z-index:1;color:#3498DB;background:0 0}.plyr__progress--played[value]::-webkit-progress-value{background:currentColor;min-width:8px;border-top-right-radius:0;border-bottom-right-radius:0}.plyr__progress--played[value]::-moz-progress-bar{background:currentColor;min-width:8px;border-top-right-radius:0;border-bottom-right-radius:0}.plyr__progress--played[value]::-ms-fill{min-width:8px;border-top-right-radius:0;border-bottom-right-radius:0}.plyr__progress--buffer[value]{color:rgba(255,255,255,.25);background:rgba(255,255,255,.25)}.plyr__progress--buffer[value]::-webkit-progress-value{transition:width .2s ease}.plyr__progress--buffer[value]::-moz-progress-bar{transition:width .2s ease}.plyr__progress--buffer[value]::-ms-fill{transition:width .2s ease}.plyr--loading .plyr__progress--buffer{-webkit-animation:plyr-progress 1s linear infinite;animation:plyr-progress 1s linear infinite;background-size:25px 25px;background-repeat:repeat-x;background-color:rgba(255,255,255,.25);background-image:linear-gradient(-45deg,rgba(0,0,0,.15) 25%,transparent 25%,transparent 50%,rgba(0,0,0,.15) 50%,rgba(0,0,0,.15) 75%,transparent 75%,transparent);color:transparent}.plyr__time{vertical-align:middle;color:#fff;font-size:14px;line-height:.95}.plyr__time+.plyr__time{display:none}@media (min-width:560px){.plyr__time+.plyr__time{display:inline-block}}.plyr__time+.plyr__time::before{content:'\2044';margin-right:10px}.plyr__volume[type=range]{max-width:100px}.plyr--is-ios .plyr__volume,.plyr--is-ios [data-plyr=mute],.plyr--is-ios.plyr--audio .plyr__controls--right{display:none}.plyr--is-ios.plyr--audio .plyr__controls--left{float:none}.plyr--audio .plyr__controls{padding-top:20px}.plyr--audio .plyr__progress{bottom:auto;top:0;background:#fff}.plyr--fullscreen,.plyr--fullscreen-active{position:fixed;top:0;left:0;right:0;bottom:0;height:100%;width:100%;z-index:10000000;background:#000}.plyr--fullscreen video,.plyr--fullscreen-active video{height:100%}.plyr--fullscreen .plyr__video-wrapper,.plyr--fullscreen-active .plyr__video-wrapper{height:100%;width:100%}.plyr--fullscreen .plyr__controls,.plyr--fullscreen-active .plyr__controls{position:absolute;bottom:0;left:0;right:0}
\ No newline at end of file diff --git a/dist/plyr.js b/dist/plyr.js index d70a36d8..d61b277c 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(null,function(){t(e,document)}):e.plyr=t(e,document)}("undefined"!=typeof window?window:this,function(e,t){"use strict";function n(){var e,n,r,a=navigator.userAgent,s=navigator.appName,o=""+parseFloat(navigator.appVersion),i=parseInt(navigator.appVersion,10);return-1!==navigator.appVersion.indexOf("Windows NT")&&-1!==navigator.appVersion.indexOf("rv:11")?(s="IE",o="11;"):-1!==(n=a.indexOf("MSIE"))?(s="IE",o=a.substring(n+5)):-1!==(n=a.indexOf("Chrome"))?(s="Chrome",o=a.substring(n+7)):-1!==(n=a.indexOf("Safari"))?(s="Safari",o=a.substring(n+7),-1!==(n=a.indexOf("Version"))&&(o=a.substring(n+8))):-1!==(n=a.indexOf("Firefox"))?(s="Firefox",o=a.substring(n+8)):(e=a.lastIndexOf(" ")+1)<(n=a.lastIndexOf("/"))&&(s=a.substring(e,n),o=a.substring(n+1),s.toLowerCase()==s.toUpperCase()&&(s=navigator.appName)),-1!==(r=o.indexOf(";"))&&(o=o.substring(0,r)),-1!==(r=o.indexOf(" "))&&(o=o.substring(0,r)),i=parseInt(""+o,10),isNaN(i)&&(o=""+parseFloat(navigator.appVersion),i=parseInt(navigator.appVersion,10)),{name:s,version:i,ios:/(iPad|iPhone|iPod)/g.test(navigator.platform),touch:"ontouchstart"in t.documentElement}}function r(e,t){var n=e.media;if("video"==e.type)switch(t){case"video/webm":return!(!n.canPlayType||!n.canPlayType('video/webm; codecs="vp8, vorbis"').replace(/no/,""));case"video/mp4":return!(!n.canPlayType||!n.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"').replace(/no/,""));case"video/ogg":return!(!n.canPlayType||!n.canPlayType('video/ogg; codecs="theora"').replace(/no/,""))}else if("audio"==e.type)switch(t){case"audio/mpeg":return!(!n.canPlayType||!n.canPlayType("audio/mpeg;").replace(/no/,""));case"audio/ogg":return!(!n.canPlayType||!n.canPlayType('audio/ogg; codecs="vorbis"').replace(/no/,""));case"audio/wav":return!(!n.canPlayType||!n.canPlayType('audio/wav; codecs="1"').replace(/no/,""))}return!1}function a(e){if(!t.querySelectorAll('script[src="'+e+'"]').length){var n=t.createElement("script");n.src=e;var r=t.getElementsByTagName("script")[0];r.parentNode.insertBefore(n,r)}}function s(e,t){return Array.prototype.indexOf&&-1!=e.indexOf(t)}function o(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 r=n>0?t.cloneNode(!0):t,a=e[n],s=a.parentNode,o=a.nextSibling;r.appendChild(a),o?s.insertBefore(r,o):s.appendChild(r)}}function l(e){for(var t=e.parentNode;e.firstChild;)t.insertBefore(e.firstChild,e);t.removeChild(e)}function u(e){e&&e.parentNode.removeChild(e)}function c(e,t){e.insertBefore(t,e.firstChild)}function p(e,t){for(var n in t)e.setAttribute(n,"boolean"==typeof t[n]&&t[n]?"":t[n])}function d(e,n,r){var a=t.createElement(e);p(a,r),c(n,a)}function f(e){return e.replace(".","")}function m(e,t,n){if(e)if(e.classList)e.classList[n?"add":"remove"](t);else{var r=(" "+e.className+" ").replace(/\s+/g," ").replace(" "+t+" ","");e.className=r+(n?" "+t:"")}}function y(e,t){return e?e.classList?e.classList.contains(t):new RegExp("(\\s|^)"+t+"(\\s|$)").test(e.className):!1}function b(e,t,n){var r;return function(){function a(){n||e.apply(s,o),r=null}var s=this,o=arguments;r?clearTimeout(r):n&&e.apply(s,o),r=setTimeout(a,t||100)}}function v(e,t,n){e&&k(e,t,n,!0)}function g(e,t,n){e&&k(e,t,n,!1)}function h(e,t,n,r){v(e,t,function(t){n&&n.apply(e,[t]),r.apply(e,[t])})}function k(e,t,n,r){var a=t.split(" ");if(e instanceof NodeList)for(var s=0;s<e.length;s++)e[s]instanceof Node&&k(e[s],arguments[1],arguments[2],arguments[3]);else for(var o=0;o<a.length;o++)e[r?"addEventListener":"removeEventListener"](a[o],n,!1)}function w(e,t,n){if(e&&t){var r=new CustomEvent(t,n);e.dispatchEvent(r)}}function x(e,t){return e?(t="boolean"==typeof t?t:!e.getAttribute("aria-pressed"),e.setAttribute("aria-pressed",t),t):void 0}function T(e,t){return 0===e||0===t||isNaN(e)||isNaN(t)?0:(e/t*100).toFixed(2)}function _(){var e=arguments;if(e.length){if(1==e.lenth)return e[0];for(var t=Array.prototype.shift.call(e),n=e.length,r=0;n>r;r++){var a=e[r];for(var s in a)a[s]&&a[s].constructor&&a[s].constructor===Object?(t[s]=t[s]||{},_(t[s],a[s])):t[s]=a[s]}return t}}function F(){var e={supportsFullScreen:!1,isFullScreen:function(){return!1},requestFullScreen:function(){},cancelFullScreen:function(){},fullScreenEventName:"",element:null,prefix:""},n="webkit moz o ms khtml".split(" ");if("undefined"!=typeof t.cancelFullScreen)e.supportsFullScreen=!0;else for(var r=0,a=n.length;a>r;r++){if(e.prefix=n[r],"undefined"!=typeof t[e.prefix+"CancelFullScreen"]){e.supportsFullScreen=!0;break}if("undefined"!=typeof t.msExitFullscreen&&t.msFullscreenEnabled){e.prefix="ms",e.supportsFullScreen=!0;break}}return e.supportsFullScreen&&(e.fullScreenEventName="ms"==e.prefix?"MSFullscreenChange":e.prefix+"fullscreenchange",e.isFullScreen=function(e){switch("undefined"==typeof e&&(e=t.body),this.prefix){case"":return t.fullscreenElement==e;case"moz":return t.mozFullScreenElement==e;default:return t[this.prefix+"FullscreenElement"]==e}},e.requestFullScreen=function(e){return"undefined"==typeof e&&(e=t.body),""===this.prefix?e.requestFullScreen():e[this.prefix+("ms"==this.prefix?"RequestFullscreen":"RequestFullScreen")]()},e.cancelFullScreen=function(){return""===this.prefix?t.cancelFullScreen():t[this.prefix+("ms"==this.prefix?"ExitFullscreen":"CancelFullScreen")]()},e.element=function(){return""===this.prefix?t.fullscreenElement:t[this.prefix+"FullscreenElement"]}),e}function C(){var t={supported:function(){if(!("localStorage"in e))return!1;try{e.localStorage.setItem("___test","OK");var t=e.localStorage.getItem("___test");return e.localStorage.removeItem("___test"),"OK"===t}catch(n){return!1}return!1}()};return t}function E(k,_){function E(t,n){_.debug&&e.console&&console[n?"warn":"log"](t)}function N(){var e=[];return s(_.controls,"play-large")&&e.push('<button type="button" data-plyr="play" class="plyr__play-large">','<svg><use xlink:href="#'+_.iconPrefix+'-play" /></svg>','<span class="plyr__sr-only">'+_.i18n.play+"</span>","</button>"),e.push('<div class="plyr__controls">'),s(_.controls,"restart")&&e.push('<button type="button" data-plyr="restart">','<svg><use xlink:href="#'+_.iconPrefix+'-restart" /></svg>','<span class="plyr__sr-only">'+_.i18n.restart+"</span>","</button>"),s(_.controls,"rewind")&&e.push('<button type="button" data-plyr="rewind">','<svg><use xlink:href="#'+_.iconPrefix+'-rewind" /></svg>','<span class="plyr__sr-only">'+_.i18n.rewind+"</span>","</button>"),s(_.controls,"play")&&e.push('<button type="button" data-plyr="play">','<svg><use xlink:href="#'+_.iconPrefix+'-play" /></svg>','<span class="plyr__sr-only">'+_.i18n.play+"</span>","</button>",'<button type="button" data-plyr="pause">','<svg><use xlink:href="#'+_.iconPrefix+'-pause" /></svg>','<span class="plyr__sr-only">'+_.i18n.pause+"</span>","</button>"),s(_.controls,"fast-forward")&&e.push('<button type="button" data-plyr="fast-forward">','<svg><use xlink:href="#'+_.iconPrefix+'-fast-forward" /></svg>','<span class="plyr__sr-only">'+_.i18n.forward+"</span>","</button>"),s(_.controls,"progress")&&(e.push('<span class="plyr__progress">','<label for="seek{id}" class="plyr__sr-only">Seek</label>','<input id="seek{id}" class="plyr__progress--seek" type="range" min="0" max="100" step="0.1" value="0" data-plyr="seek">','<progress class="plyr__progress--played" max="100" value="0">',"<span>0</span>% "+_.i18n.played,"</progress>",'<progress class="plyr__progress--buffer" max="100" value="0">',"<span>0</span>% "+_.i18n.buffered,"</progress>"),_.tooltips.seek&&e.push('<span class="plyr__tooltip">00:00</span>'),e.push("</span>")),s(_.controls,"current-time")&&e.push('<span class="plyr__time">','<span class="plyr__sr-only">'+_.i18n.currentTime+"</span>",'<span class="plyr__time--current">00:00</span>',"</span>"),s(_.controls,"duration")&&e.push('<span class="plyr__time">','<span class="plyr__sr-only">'+_.i18n.duration+"</span>",'<span class="plyr__time--duration">00:00</span>',"</span>"),s(_.controls,"mute")&&e.push('<button type="button" data-plyr="mute">','<svg class="icon--muted"><use xlink:href="#'+_.iconPrefix+'-muted" /></svg>','<svg><use xlink:href="#'+_.iconPrefix+'-volume" /></svg>','<span class="plyr__sr-only">'+_.i18n.toggleMute+"</span>","</button>"),s(_.controls,"volume")&&e.push('<label for="volume{id}" class="plyr__sr-only">'+_.i18n.volume+"</label>",'<input id="volume{id}" class="plyr__volume" type="range" min="0" max="10" value="5" data-plyr="volume">'),s(_.controls,"captions")&&e.push('<button type="button" data-plyr="captions">','<svg class="icon--captions-on"><use xlink:href="#'+_.iconPrefix+'-captions-on" /></svg>','<svg><use xlink:href="#'+_.iconPrefix+'-captions-off" /></svg>','<span class="plyr__sr-only">'+_.i18n.toggleCaptions+"</span>","</button>"),s(_.controls,"fullscreen")&&e.push('<button type="button" data-plyr="fullscreen">','<svg class="icon--exit-fullscreen"><use xlink:href="#'+_.iconPrefix+'-exit-fullscreen" /></svg>','<svg><use xlink:href="#'+_.iconPrefix+'-enter-fullscreen" /></svg>','<span class="plyr__sr-only">'+_.i18n.toggleFullscreen+"</span>","</button>"),e.push("</div>"),e.join("")}function I(){if(Ee.supported.full&&("audio"!=Ee.type||_.fullscreen.allowAudio)&&_.fullscreen.enabled){var e=S.supportsFullScreen;e||_.fullscreen.fallback&&!R()?(E((e?"Native":"Fallback")+" fullscreen enabled"),m(Ee.container,_.classes.fullscreen.enabled,!0)):E("Fullscreen not supported and fallback disabled"),x(Ee.buttons.fullscreen,!1),j()}}function P(){if("video"===Ee.type){q(_.selectors.captions)||Ee.videoContainer.insertAdjacentHTML("afterbegin",'<div class="'+f(_.selectors.captions)+'"></div>'),Ee.usingTextTracks=!1,Ee.media.textTracks&&(Ee.usingTextTracks=!0);for(var e,t="",n=Ee.media.childNodes,r=0;r<n.length;r++)"track"===n[r].nodeName.toLowerCase()&&(e=n[r].kind,("captions"===e||"subtitles"===e)&&(t=n[r].getAttribute("src")));if(Ee.captionExists=!0,""===t?(Ee.captionExists=!1,E("No caption track found")):E("Caption track found; URI: "+t),Ee.captionExists){for(var a=Ee.media.textTracks,s=0;s<a.length;s++)a[s].mode="hidden";if(O(Ee),("IE"===Ee.browser.name&&Ee.browser.version>=10||"Firefox"===Ee.browser.name&&Ee.browser.version>=31)&&(E("Detected browser with known TextTrack issues - using manual fallback"),Ee.usingTextTracks=!1),Ee.usingTextTracks){E("TextTracks supported");for(var o=0;o<a.length;o++){var i=a[o];("captions"===i.kind||"subtitles"===i.kind)&&v(i,"cuechange",function(){this.activeCues[0]&&"text"in this.activeCues[0]?M(this.activeCues[0].getCueAsHTML()):M()})}}else if(E("TextTracks not supported so rendering captions manually"),Ee.currentCaption="",Ee.captions=[],""!==t){var l=new XMLHttpRequest;l.onreadystatechange=function(){if(4===l.readyState)if(200===l.status){var e,t=[],n=l.responseText;t=n.split("\n\n");for(var r=0;r<t.length;r++){e=t[r],Ee.captions[r]=[];var a=e.split("\n"),s=0;-1===a[s].indexOf(":")&&(s=1),Ee.captions[r]=[a[s],a[s+1]]}Ee.captions.shift(),E("Successfully loaded the caption file via AJAX")}else E("There was a problem loading the caption file via AJAX",!0)},l.open("get",t,!0),l.send()}}else m(Ee.container,_.classes.captions.enabled)}}function M(e){var n=q(_.selectors.captions),r=t.createElement("span");n.innerHTML="","undefined"==typeof e&&(e=""),"string"==typeof e?r.innerHTML=e.trim():r.appendChild(e),n.appendChild(r);n.offsetHeight}function L(e){function t(e,t){var n=[];n=e.split(" --> ");for(var r=0;r<n.length;r++)n[r]=n[r].replace(/(\d+:\d+:\d+\.\d+).*/,"$1");return a(n[t])}function n(e){return t(e,0)}function r(e){return t(e,1)}function a(e){if(null===e||void 0===e)return 0;var t,n=[],r=[];return n=e.split(","),r=n[0].split(":"),t=Math.floor(60*r[0]*60)+Math.floor(60*r[1])+Math.floor(r[2])}if(!Ee.usingTextTracks&&"video"===Ee.type&&Ee.supported.full&&(Ee.subcount=0,e="number"==typeof e?e:Ee.media.currentTime,Ee.captions[Ee.subcount])){for(;r(Ee.captions[Ee.subcount][0])<e.toFixed(1);)if(Ee.subcount++,Ee.subcount>Ee.captions.length-1){Ee.subcount=Ee.captions.length-1;break}Ee.media.currentTime.toFixed(1)>=n(Ee.captions[Ee.subcount][0])&&Ee.media.currentTime.toFixed(1)<=r(Ee.captions[Ee.subcount][0])?(Ee.currentCaption=Ee.captions[Ee.subcount][1],M(Ee.currentCaption)):M()}}function O(){Ee.buttons.captions&&(m(Ee.container,_.classes.captions.enabled,!0),_.captions.defaultActive&&(m(Ee.container,_.classes.captions.active,!0),x(Ee.buttons.captions,!0)))}function V(e){return Ee.container.querySelectorAll(e)}function q(e){return V(e)[0]}function R(){try{return e.self!==e.top}catch(t){return!0}}function j(){function e(e){9===e.which&&Ee.isFullscreen&&(e.target!==r||e.shiftKey?e.target===n&&e.shiftKey&&(e.preventDefault(),r.focus()):(e.preventDefault(),n.focus()))}var t=V("input:not([disabled]), button:not([disabled])"),n=t[0],r=t[t.length-1];v(Ee.container,"keydown",e)}function H(e,t){if("string"==typeof t)d(e,Ee.media,{src:t});else if(t.constructor===Array)for(var n=t.length-1;n>=0;n--)d(e,Ee.media,t[n])}function D(){var e=_.html;E("Injecting custom controls"),e||(e=N()),e=o(e,"{seektime}",_.seekTime),e=o(e,"{id}",Math.floor(1e4*Math.random()));var n;if(null!==_.selectors.controls.container&&(n=_.selectors.controls.container,"string"==typeof selector&&(n=t.querySelector(n))),n instanceof HTMLElement||(n=Ee.container),n.insertAdjacentHTML("beforeend",e),_.tooltips.controls)for(var r=V([_.selectors.controls.wrapper," ",_.selectors.labels," .",_.classes.hidden].join("")),a=r.length-1;a>=0;a--){var s=r[a];m(s,_.classes.hidden,!1),m(s,_.classes.tooltip,!0)}}function B(){try{return Ee.controls=q(_.selectors.controls.wrapper),Ee.buttons={},Ee.buttons.seek=q(_.selectors.buttons.seek),Ee.buttons.play=V(_.selectors.buttons.play),Ee.buttons.pause=q(_.selectors.buttons.pause),Ee.buttons.restart=q(_.selectors.buttons.restart),Ee.buttons.rewind=q(_.selectors.buttons.rewind),Ee.buttons.forward=q(_.selectors.buttons.forward),Ee.buttons.fullscreen=q(_.selectors.buttons.fullscreen),Ee.buttons.volume=q(_.selectors.buttons.volume),Ee.buttons.mute=q(_.selectors.buttons.mute),Ee.buttons.captions=q(_.selectors.buttons.captions),Ee.checkboxes=V('[type="checkbox"]'),Ee.progress={},Ee.progress.container=q(_.selectors.progress.container),Ee.progress.buffer={},Ee.progress.buffer.bar=q(_.selectors.progress.buffer),Ee.progress.buffer.text=Ee.progress.buffer.bar&&Ee.progress.buffer.bar.getElementsByTagName("span")[0],Ee.progress.played={},Ee.progress.played.bar=q(_.selectors.progress.played),Ee.progress.played.text=Ee.progress.played.bar&&Ee.progress.played.bar.getElementsByTagName("span")[0],Ee.progress.tooltip=Ee.progress.container&&Ee.progress.container.querySelector("."+_.classes.tooltip),Ee.volume=q(_.selectors.buttons.volume),Ee.duration=q(_.selectors.duration),Ee.currentTime=q(_.selectors.currentTime),Ee.seekTime=V(_.selectors.seekTime),!0}catch(e){return E("It looks like there is a problem with your controls html",!0),$(!0),!1}}function Y(){m(Ee.container,_.selectors.container.replace(".",""),Ee.supported.full)}function $(e){e?Ee.media.setAttribute("controls",""):Ee.media.removeAttribute("controls")}function W(e){var t=_.i18n.play;if("undefined"!=typeof _.title&&_.title.length&&(t+=", "+_.title),Ee.supported.full&&Ee.buttons.play)for(var n=Ee.buttons.play.length-1;n>=0;n--)Ee.buttons.play[n].setAttribute("aria-label",t);e instanceof HTMLElement&&e.setAttribute("title",_.i18n.frameTitle.replace("{title}",_.title))}function z(){if(!Ee.media)return E("No audio or video element found",!0),!1;if(Ee.supported.full&&(m(Ee.container,_.classes.type.replace("{0}",Ee.type),!0),m(Ee.container,_.classes.stopped,_.autoplay),m(Ee.container,_.classes.isIos,Ee.browser.ios),m(Ee.container,_.classes.isTouch,Ee.browser.touch),"video"===Ee.type)){var e=t.createElement("div");e.setAttribute("class",_.classes.videoWrapper),i(Ee.media,e),Ee.videoContainer=e}s(_.types.embed,Ee.type)&&(K(),Ee.embedId=null)}function K(){for(var n=t.createElement("div"),r=Ee.embedId,s=Ee.type+"-"+Math.floor(1e4*Math.random()),o=V('[id^="'+Ee.type+'-"]'),i=o.length-1;i>=0;i--)u(o[i]);if(m(Ee.media,_.classes.videoWrapper,!0),m(Ee.media,_.classes.embedWrapper,!0),"youtube"===Ee.type)Ee.media.appendChild(n),n.setAttribute("id",s),"object"==typeof YT?X(r,n):(a(_.urls.youtube.api),e.onYouTubeReadyCallbacks=e.onYouTubeReadyCallbacks||[],e.onYouTubeReadyCallbacks.push(function(){X(r,n)}),e.onYouTubeIframeAPIReady=function(){e.onYouTubeReadyCallbacks.forEach(function(e){e()})});else if("vimeo"===Ee.type){var l=t.createElement("iframe");l.loaded=!1,v(l,"load",function(){l.loaded=!0}),p(l,{src:"https://player.vimeo.com/video/"+r+"?player_id="+s+"&api=1&badge=0&byline=0&portrait=0&title=0",id:s,webkitallowfullscreen:"",mozallowfullscreen:"",allowfullscreen:"",frameborder:0}),Ee.supported.full?(n.appendChild(l),Ee.media.appendChild(n)):Ee.media.appendChild(l),"$f"in e||a(_.urls.vimeo.api);var c=e.setInterval(function(){"$f"in e&&l.loaded&&(e.clearInterval(c),J.call(l))},50)}}function U(){Ee.container.plyr.embed=Ee.embed,Ce(),W(q("iframe"))}function X(t,n){"timer"in Ee||(Ee.timer={}),Ee.embed=new YT.Player(n.id,{videoId:t,playerVars:{autoplay:_.autoplay?1:0,controls:Ee.supported.full?0:1,rel:0,showinfo:0,iv_load_policy:3,cc_load_policy:_.captions.defaultActive?1:0,cc_lang_pref:"en",wmode:"transparent",modestbranding:1,disablekb:1,origin:"*"},events:{onReady:function(t){var n=t.target;Ee.media.play=function(){n.playVideo(),Ee.media.paused=!1},Ee.media.pause=function(){n.pauseVideo(),Ee.media.paused=!0},Ee.media.stop=function(){n.stopVideo(),Ee.media.paused=!0},Ee.media.duration=n.getDuration(),Ee.media.paused=!0,Ee.media.currentTime=n.getCurrentTime(),Ee.media.muted=n.isMuted(),_.title=n.getVideoData().title,w(Ee.media,"timeupdate"),e.clearInterval(Ee.timer.buffering),Ee.timer.buffering=e.setInterval(function(){Ee.media.buffered=n.getVideoLoadedFraction(),w(Ee.media,"progress"),1===Ee.media.buffered&&(e.clearInterval(Ee.timer.buffering),w(Ee.media,"canplaythrough"))},200),U(),me()},onStateChange:function(t){var n=t.target;switch(e.clearInterval(Ee.timer.playing),t.data){case 0:Ee.media.paused=!0,w(Ee.media,"ended");break;case 1:Ee.media.paused=!1,Ee.media.seeking=!1,w(Ee.media,"play"),w(Ee.media,"playing"),Ee.timer.playing=e.setInterval(function(){Ee.media.currentTime=n.getCurrentTime(),w(Ee.media,"timeupdate")},100);break;case 2:Ee.media.paused=!0,w(Ee.media,"pause")}}}})}function J(){Ee.embed=$f(this),Ee.embed.addEvent("ready",function(){Ee.media.play=function(){Ee.embed.api("play"),Ee.media.paused=!1},Ee.media.pause=function(){Ee.embed.api("pause"),Ee.media.paused=!0},Ee.media.stop=function(){Ee.embed.api("stop"),Ee.media.paused=!0},Ee.media.paused=!0,Ee.media.currentTime=0,U(),Ee.embed.api("getCurrentTime",function(e){Ee.media.currentTime=e,w(Ee.media,"timeupdate")}),Ee.embed.api("getDuration",function(e){Ee.media.duration=e,me()}),Ee.embed.addEvent("play",function(){Ee.media.paused=!1,w(Ee.media,"play"),w(Ee.media,"playing")}),Ee.embed.addEvent("pause",function(){Ee.media.paused=!0,w(Ee.media,"pause")}),Ee.embed.addEvent("playProgress",function(e){Ee.media.seeking=!1,Ee.media.currentTime=e.seconds,w(Ee.media,"timeupdate")}),Ee.embed.addEvent("loadProgress",function(e){Ee.media.buffered=e.percent,w(Ee.media,"progress"),1===parseInt(e.percent)&&w(Ee.media,"canplaythrough")}),Ee.embed.addEvent("finish",function(){Ee.media.paused=!0,w(Ee.media,"ended")}),_.autoplay&&Ee.embed.api("play")})}function G(){"play"in Ee.media&&Ee.media.play()}function Q(){"pause"in Ee.media&&Ee.media.pause()}function Z(e){e===!0?G():e===!1?Q():Ee.media[Ee.media.paused?"play":"pause"]()}function ee(e){"number"!=typeof e&&(e=_.seekTime),ne(Ee.media.currentTime-e)}function te(e){"number"!=typeof e&&(e=_.seekTime),ne(Ee.media.currentTime+e)}function ne(e){var t=0,n=Ee.media.paused,r=re();"number"==typeof e?t=e:"object"!=typeof e||"input"!==e.type&&"change"!==e.type||(t=e.target.value/e.target.max*r),0>t?t=0:t>r&&(t=r);try{Ee.media.currentTime=t.toFixed(1)}catch(a){}if(s(_.types.embed,Ee.type)){switch(Ee.type){case"youtube":Ee.embed.seekTo(t);break;case"vimeo":Ee.embed.api("seekTo",t.toFixed(0))}n&&Q(),w(Ee.media,"timeupdate"),Ee.media.seeking=!0}E("Seeking to "+Ee.media.currentTime+" seconds"),L(t)}function re(){var e=parseInt(_.duration);return isNaN(e)?Ee.media.duration:e}function ae(){m(Ee.container,_.classes.playing,!Ee.media.paused),m(Ee.container,_.classes.stopped,Ee.media.paused),ve(Ee.media.paused)}function se(e){var n=S.supportsFullScreen;e&&e.type===S.fullScreenEventName?Ee.isFullscreen=S.isFullScreen(Ee.container):n?(S.isFullScreen(Ee.container)?S.cancelFullScreen():S.requestFullScreen(Ee.container),Ee.isFullscreen=S.isFullScreen(Ee.container)):(Ee.isFullscreen=!Ee.isFullscreen,Ee.isFullscreen?(v(t,"keyup",oe),t.body.style.overflow="hidden"):(g(t,"keyup",oe),t.body.style.overflow="")),m(Ee.container,_.classes.fullscreen.active,Ee.isFullscreen),Ee.isFullscreen?Ee.container.setAttribute("tabindex","-1"):Ee.container.removeAttribute("tabindex"),j(Ee.isFullscreen),x(Ee.buttons.fullscreen,Ee.isFullscreen),ve(!1),w(Ee.container,Ee.isFullscreen?"enterfullscreen":"exitfullscreen")}function oe(e){27===(e.which||e.charCode||e.keyCode)&&Ee.isFullscreen&&se()}function ie(e){if("boolean"!=typeof e&&(e=!Ee.media.muted),x(Ee.buttons.mute,e),Ee.media.muted=e,s(_.types.embed,Ee.type)){switch(Ee.type){case"youtube":Ee.embed[Ee.media.muted?"mute":"unMute"]();break;case"vimeo":Ee.embed.api("setVolume",Ee.media.muted?0:parseFloat(_.volume/10))}w(Ee.media,"volumechange")}}function le(t){if("undefined"==typeof t&&(t=_.volume,_.storage.enabled&&C().supported&&(t=e.localStorage.getItem(_.storage.key),e.localStorage.removeItem("plyr-volume"))),(null===t||isNaN(t))&&(t=_.volume),t>10&&(t=10),0>t&&(t=0),Ee.media.volume=parseFloat(t/10),_.volume=t,s(_.types.embed,Ee.type)){switch(Ee.type){case"youtube":Ee.embed.setVolume(100*Ee.media.volume);break;case"vimeo":Ee.embed.api("setVolume",Ee.media.volume)}w(Ee.media,"volumechange")}Ee.media.muted&&t>0&&ie()}function ue(){var t=Ee.media.muted?0:10*Ee.media.volume;Ee.supported.full&&Ee.volume&&(Ee.volume.value=t),_.storage.enabled&&C().supported&&!isNaN(t)&&e.localStorage.setItem(_.storage.key,t),m(Ee.container,_.classes.muted,0===t),Ee.supported.full&&Ee.buttons.mute&&x(Ee.buttons.mute,0===t)}function ce(e){Ee.supported.full&&Ee.buttons.captions&&("boolean"!=typeof e&&(e=-1===Ee.container.className.indexOf(_.classes.captions.active)),Ee.captionsEnabled=e,x(Ee.buttons.captions,Ee.captionsEnabled),m(Ee.container,_.classes.captions.active,Ee.captionsEnabled),w(Ee.container,Ee.captionsEnabled?"captionsenabled":"captionsdisabled"))}function pe(e){var t="waiting"===e.type;clearTimeout(Ee.timers.loading),Ee.timers.loading=setTimeout(function(){m(Ee.container,_.classes.loading,t)},t?250:0)}function de(e){var t=Ee.progress.played.bar,n=Ee.progress.played.text,r=0,a=re();if(e)switch(e.type){case"timeupdate":case"seeking":r=T(Ee.media.currentTime,a),"timeupdate"==e.type&&Ee.buttons.seek&&(Ee.buttons.seek.value=r);break;case"change":case"input":r=e.target.value;break;case"playing":case"progress":t=Ee.progress.buffer.bar,n=Ee.progress.buffer.text,r=function(){var e=Ee.media.buffered;return e&&e.length?T(e.end(0),a):"number"==typeof e?100*e:0}()}t&&(t.value=r),n&&(n.innerHTML=r)}function fe(e,t){if(t){isNaN(e)&&(e=0),Ee.secs=parseInt(e%60),Ee.mins=parseInt(e/60%60),Ee.hours=parseInt(e/60/60%60);var n=parseInt(re()/60/60%60)>0;Ee.secs=("0"+Ee.secs).slice(-2),Ee.mins=("0"+Ee.mins).slice(-2),t.innerHTML=(n?Ee.hours+":":"")+Ee.mins+":"+Ee.secs}}function me(){if(Ee.supported.full){var e=re()||0;!Ee.duration&&_.displayDuration&&Ee.media.paused&&fe(e,Ee.currentTime),Ee.duration&&fe(e,Ee.duration),be()}}function ye(e){fe(Ee.media.currentTime,Ee.currentTime),e&&"timeupdate"==e.type&&Ee.media.seeking||de(e)}function be(e){if(_.tooltips.seek&&!Ee.browser.touch){var t=Ee.progress.container.getBoundingClientRect(),n=0,r=_.classes.tooltip+"--visible";if(e)n=100/t.width*(e.pageX-t.left);else{if(!y(Ee.progress.tooltip,r))return;n=Ee.progress.tooltip.style.left.replace("%","")}0>n?n=0:n>100&&(n=100),fe(re()/100*n,Ee.progress.tooltip),Ee.progress.tooltip.style.left=n+"%",e&&s(["mouseenter","mouseleave"],e.type)&&m(Ee.progress.tooltip,r,"mouseenter"===e.type)}}function ve(t){if(_.hideControls){var n=!1;"boolean"!=typeof t&&(t&&t.type?(n="mousemove"===t.type,t=s(["mousemove","mouseenter"],t.type)):t=!1),e.clearTimeout(Ee.timers.hover),t&&m(Ee.container,_.classes.hideControls,!1),t!==!1&&Ee.media.paused||(Ee.timers.hover=e.setTimeout(function(){Ee.controls.active||m(Ee.container,_.classes.hideControls,!0)},n?2e3:500))}}function ge(e){if("undefined"!=typeof e)return void he(e);var t;switch(Ee.type){case"youtube":t=Ee.embed.getVideoUrl();break;case"vimeo":Ee.embed.api("getVideoUrl",function(e){t=e});break;default:t=Ee.media.currentSrc}return t||""}function he(n){if(!("undefined"!=typeof n&&"sources"in n&&n.sources.length))return void E("Invalid source format",!0);if(Q(),"youtube"===Ee.type?(Ee.embed.destroy(),e.clearInterval(Ee.timer.buffering),e.clearInterval(Ee.timer.playing)):"video"===Ee.type&&Ee.videoContainer&&u(Ee.videoContainer),Ee.embed=null,Te(),u(Ee.media),"type"in n&&(Ee.type=n.type,"video"===Ee.type)){var r=n.sources[0];"type"in r&&s(_.types.embed,r.type)&&(Ee.type=r.type)}switch(Ee.supported=A.supported(Ee.type),Ee.type){case"video":Ee.media=t.createElement("video");break;case"audio":Ee.media=t.createElement("audio");break;case"youtube":case"vimeo":Ee.media=t.createElement("div"),Ee.embedId=n.sources[0].src}c(Ee.container,Ee.media),"undefined"!=typeof n.autoplay&&(_.autoplay=n.autoplay),s(_.types.html5,Ee.type)&&(_.crossorigin&&Ee.media.setAttribute("crossorigin",""),_.autoplay&&Ee.media.setAttribute("autoplay",""),"poster"in n&&Ee.media.setAttribute("poster",n.poster),_.loop&&Ee.media.setAttribute("loop","")),Ee.container.className=Ee.originalClassName,m(Ee.container,_.classes.fullscreen.active,Ee.isFullscreen),m(Ee.container,_.classes.captions.active,Ee.captionsEnabled),Y(),s(_.types.html5,Ee.type)&&H("source",n.sources),z(),s(_.types.html5,Ee.type)&&("tracks"in n&&H("track",n.tracks),Ee.media.load(),Ce(),me()),_.title=n.title,W(),Ee.container.plyr.media=Ee.media}function ke(e){"video"===Ee.type&&Ee.media.setAttribute("poster",e)}function we(){function n(){var e=Ee.media.paused;e?G():Q();var t=Ee.buttons[e?"play":"pause"],n=Ee.buttons[e?"pause":"play"];if(n){var r=y(t,_.classes.tabFocus);setTimeout(function(){n.focus(),r&&(m(t,_.classes.tabFocus,!1),m(n,_.classes.tabFocus,!0))},100)}}function r(){var e=t.activeElement;e&&e!=t.body?t.querySelector&&(e=t.querySelector(":focus")):e=null;for(var n in Ee.buttons){var r=Ee.buttons[n];m(r,_.classes.tabFocus,r===e)}}var a="IE"==Ee.browser.name?"change":"input";v(e,"keyup",function(e){var t=e.keyCode?e.keyCode:e.which;9==t&&r()}),v(t.body,"click",function(){m(q("."+_.classes.tabFocus),_.classes.tabFocus,!1)});for(var s in Ee.buttons){var o=Ee.buttons[s];v(o,"blur",function(){m(o,"tab-focus",!1)})}h(Ee.buttons.play,"click",_.listeners.play,n),h(Ee.buttons.pause,"click",_.listeners.pause,n),h(Ee.buttons.restart,"click",_.listeners.restart,ne),h(Ee.buttons.rewind,"click",_.listeners.rewind,ee),h(Ee.buttons.forward,"click",_.listeners.forward,te),h(Ee.buttons.seek,a,_.listeners.seek,ne),h(Ee.volume,a,_.listeners.volume,function(){le(Ee.volume.value)}),h(Ee.buttons.mute,"click",_.listeners.mute,ie),h(Ee.buttons.fullscreen,"click",_.listeners.fullscreen,se),S.supportsFullScreen&&v(t,S.fullScreenEventName,se),v(Ee.buttons.captions,"click",ce),v(Ee.progress.container,"mouseenter mouseleave mousemove",be),_.hideControls&&(v(Ee.container,"mouseenter mouseleave",ve),v(Ee.container,"mousemove",b(ve,500,!0)),v(Ee.controls,"mouseenter mouseleave",function(e){Ee.controls.active="mouseenter"===e.type}))}function xe(){v(Ee.media,"timeupdate seeking",ye),v(Ee.media,"timeupdate",L),v(Ee.media,"durationchange loadedmetadata",me),v(Ee.media,"ended",function(){"video"===Ee.type&&M(),ae()}),v(Ee.media,"progress playing",de),v(Ee.media,"volumechange",ue),v(Ee.media,"play pause",ae),v(Ee.media,"waiting canplay seeked",pe),_.clickToPlay&&(Ee.videoContainer.style.cursor="pointer",v(Ee.media,"click",function(){Ee.media.paused?G():Ee.media.ended?(ne(),G()):Q()})),v(Ee.media,_.events.join(" "),function(e){w(Ee.container,e.type)})}function Te(){if(s(_.types.html5,Ee.type)){Ee.media.setAttribute("src","");for(var e=Ee.media.querySelectorAll("source"),t=0;t<e.length;t++)u(e[t]);Ee.media.load(),E("Cancelled network requests for old media")}}function _e(){if(!Ee.init)return null;if(Ee.container.setAttribute("class",f(_.selectors.container)),Ee.init=!1,u(q(_.selectors.controls.wrapper)),"youtube"===Ee.type)return void Ee.embed.destroy();"video"===Ee.type&&(u(q(_.selectors.captions)),l(Ee.videoContainer)),$(!0);var e=Ee.media.cloneNode(!0);Ee.media.parentNode.replaceChild(e,Ee.media)}function Fe(){if(Ee.init)return null;S=F(),Ee.browser=n(),Ee.media=Ee.container.querySelectorAll("audio, video, div")[0],Ee.originalClassName=Ee.container.className;var e=Ee.media.tagName.toLowerCase();if("div"===e?(Ee.type=Ee.media.getAttribute("data-type"),Ee.embedId=Ee.media.getAttribute("data-video-id"),Ee.media.removeAttribute("data-type"),Ee.media.removeAttribute("data-video-id")):(Ee.type=e,_.crossorigin=null!==Ee.media.getAttribute("crossorigin"),_.autoplay=_.autoplay||null!==Ee.media.getAttribute("autoplay"),_.loop=_.loop||null!==Ee.media.getAttribute("loop")),Ee.supported=A.supported(Ee.type),Y(),!Ee.supported.basic)return!1;if(E(Ee.browser.name+" "+Ee.browser.version),z(),s(_.types.html5,Ee.type)){if(!Ee.supported.full)return void(Ee.init=!0);Ce(),W(),_.autoplay&&G()}Ee.init=!0}function Ce(){if(!Ee.supported.full)return E("No full support for this media type ("+Ee.type+")",!0),u(q(_.selectors.controls.wrapper)),void $(!0);var e=!V(_.selectors.controls.wrapper).length;e&&D(),B()&&(e&&we(),xe(),$(),I(),P(),le(),ue(),ye(),ae(),me(),w(Ee.container,"ready"))}var Ee=this;return Ee.container=k,Ee.timers={},E(_),Fe(),Ee.init?{media:Ee.media,play:G,pause:Q,restart:ne,rewind:ee,forward:te,seek:ne,source:ge,poster:ke,setVolume:le,togglePlay:Z,toggleMute:ie,toggleCaptions:ce,toggleFullscreen:se,isFullscreen:function(){return Ee.isFullscreen||!1},support:function(e){return r(Ee,e)},destroy:_e,restore:Fe}:{}}var S,A={},N={enabled:!0,debug:!1,autoplay:!1,loop:!1,seekTime:10,volume:5,duration:null,displayDuration:!0,iconPrefix:"icon",clickToPlay:!0,hideControls:!0,tooltips:{controls:!1,seek:!0},selectors:{container:".plyr",controls:{container:null,wrapper:".plyr__controls"},labels:"[data-plyr]",buttons:{seek:'[data-plyr="seek"]',play:'[data-plyr="play"]',pause:'[data-plyr="pause"]',restart:'[data-plyr="restart"]',rewind:'[data-plyr="rewind"]',forward:'[data-plyr="fast-forward"]',mute:'[data-plyr="mute"]',volume:'[data-plyr="volume"]',captions:'[data-plyr="captions"]',fullscreen:'[data-plyr="fullscreen"]'},progress:{container:".plyr__progress",buffer:".plyr__progress--buffer",played:".plyr__progress--played"},captions:".plyr__captions",currentTime:".plyr__time--current",duration:".plyr__time--duration"},classes:{videoWrapper:"plyr__video-wrapper",embedWrapper:"plyr__video-embed",type:"plyr--{0}",stopped:"plyr--stopped",playing:"plyr--playing",muted:"plyr--muted",loading:"plyr--loading",hover:"plyr--hover",tooltip:"plyr__tooltip",hidden:"plyr__sr-only",hideControls:"plyr--hide-controls",isIos:"plyr--is-ios",isTouch:"plyr--is-touch",captions:{enabled:"plyr--captions-enabled",active:"plyr--captions-active"},fullscreen:{enabled:"plyr--fullscreen-enabled",active:"plyr--fullscreen-active"},tabFocus:"tab-focus"},captions:{defaultActive:!1},fullscreen:{enabled:!0,fallback:!0,allowAudio:!1},storage:{enabled:!0,key:"plyr"},controls:["play-large","play","progress","current-time","mute","volume","captions","fullscreen"],i18n:{restart:"Restart",rewind:"Rewind {seektime} secs", -play:"Play",pause:"Pause",forward:"Forward {seektime} secs",played:"played",buffered:"buffered",currentTime:"Current time",duration:"Duration",volume:"Volume",toggleMute:"Toggle Mute",toggleCaptions:"Toggle Captions",toggleFullscreen:"Toggle Fullscreen",frameTitle:"Player for {title}"},types:{embed:["youtube","vimeo"],html5:["video","audio"]},urls:{vimeo:{api:"https://cdn.plyr.io/froogaloop/1.0.1/plyr.froogaloop.js"},youtube:{api:"https://www.youtube.com/iframe_api"}},listeners:{seek:null,play:null,pause:null,restart:null,rewind:null,forward:null,mute:null,volume:null,captions:null,fullscreen:null},events:["ended","progress","stalled","playing","waiting","canplay","canplaythrough","loadstart","loadeddata","loadedmetadata","timeupdate","volumechange","play","pause","error","seeking","emptied"]};return A.supported=function(e){var r,a,s=n(),o="IE"===s.name&&s.version<=9,i=/iPhone|iPod/i.test(navigator.userAgent),l=!!t.createElement("audio").canPlayType,u=!!t.createElement("video").canPlayType;switch(e){case"video":r=u,a=r&&!o&&!i;break;case"audio":r=l,a=r&&!o;break;case"vimeo":case"youtube":r=!0,a=!o&&!i;break;default:r=l&&u,a=r&&!o}return{basic:r,full:a}},A.setup=function(e,n){var r=[];if("string"==typeof e?e=t.querySelectorAll(e):e instanceof HTMLElement?e=[e]:e instanceof NodeList||"string"==typeof e||("undefined"==typeof n&&"object"==typeof e&&(n=e),e=t.querySelectorAll(N.selectors.container)),!A.supported().basic||!e.length)return!1;for(var a=0;a<e.length;a++){var s=e[a];if("undefined"==typeof s.plyr){var o=_(N,n,JSON.parse(s.getAttribute("data-plyr")));if(!o.enabled)return;var i=new E(s,o);s.plyr=Object.keys(i).length?i:!1,w(s,"setup",{plyr:s.plyr})}r.push(s.plyr)}return r},A}),function(){function e(e,t){t=t||{bubbles:!1,cancelable:!1,detail:void 0};var n=document.createEvent("CustomEvent");return n.initCustomEvent(e,t.bubbles,t.cancelable,t.detail),n}return"function"==typeof window.CustomEvent?!1:(e.prototype=window.Event.prototype,void(window.CustomEvent=e))}();
\ No newline at end of file +!function(e,t){"use strict";"object"==typeof module&&"object"==typeof module.exports?module.exports=t(e,document):"function"==typeof define&&define.amd?define(null,function(){t(e,document)}):e.plyr=t(e,document)}("undefined"!=typeof window?window:this,function(e,t){"use strict";function n(){var e,n,r,a=navigator.userAgent,s=navigator.appName,o=""+parseFloat(navigator.appVersion),i=parseInt(navigator.appVersion,10);return-1!==navigator.appVersion.indexOf("Windows NT")&&-1!==navigator.appVersion.indexOf("rv:11")?(s="IE",o="11;"):-1!==(n=a.indexOf("MSIE"))?(s="IE",o=a.substring(n+5)):-1!==(n=a.indexOf("Chrome"))?(s="Chrome",o=a.substring(n+7)):-1!==(n=a.indexOf("Safari"))?(s="Safari",o=a.substring(n+7),-1!==(n=a.indexOf("Version"))&&(o=a.substring(n+8))):-1!==(n=a.indexOf("Firefox"))?(s="Firefox",o=a.substring(n+8)):(e=a.lastIndexOf(" ")+1)<(n=a.lastIndexOf("/"))&&(s=a.substring(e,n),o=a.substring(n+1),s.toLowerCase()==s.toUpperCase()&&(s=navigator.appName)),-1!==(r=o.indexOf(";"))&&(o=o.substring(0,r)),-1!==(r=o.indexOf(" "))&&(o=o.substring(0,r)),i=parseInt(""+o,10),isNaN(i)&&(o=""+parseFloat(navigator.appVersion),i=parseInt(navigator.appVersion,10)),{name:s,version:i,ios:/(iPad|iPhone|iPod)/g.test(navigator.platform),touch:"ontouchstart"in t.documentElement}}function r(e,t){var n=e.media;if("video"==e.type)switch(t){case"video/webm":return!(!n.canPlayType||!n.canPlayType('video/webm; codecs="vp8, vorbis"').replace(/no/,""));case"video/mp4":return!(!n.canPlayType||!n.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"').replace(/no/,""));case"video/ogg":return!(!n.canPlayType||!n.canPlayType('video/ogg; codecs="theora"').replace(/no/,""))}else if("audio"==e.type)switch(t){case"audio/mpeg":return!(!n.canPlayType||!n.canPlayType("audio/mpeg;").replace(/no/,""));case"audio/ogg":return!(!n.canPlayType||!n.canPlayType('audio/ogg; codecs="vorbis"').replace(/no/,""));case"audio/wav":return!(!n.canPlayType||!n.canPlayType('audio/wav; codecs="1"').replace(/no/,""))}return!1}function a(e){if(!t.querySelectorAll('script[src="'+e+'"]').length){var n=t.createElement("script");n.src=e;var r=t.getElementsByTagName("script")[0];r.parentNode.insertBefore(n,r)}}function s(e,t){return Array.prototype.indexOf&&-1!=e.indexOf(t)}function o(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 r=n>0?t.cloneNode(!0):t,a=e[n],s=a.parentNode,o=a.nextSibling;r.appendChild(a),o?s.insertBefore(r,o):s.appendChild(r)}}function l(e){for(var t=e.parentNode;e.firstChild;)t.insertBefore(e.firstChild,e);t.removeChild(e)}function u(e){e&&e.parentNode.removeChild(e)}function c(e,t){e.insertBefore(t,e.firstChild)}function p(e,t){for(var n in t)e.setAttribute(n,"boolean"==typeof t[n]&&t[n]?"":t[n])}function d(e,n,r){var a=t.createElement(e);p(a,r),c(n,a)}function f(e){return e.replace(".","")}function m(e,t,n){if(e)if(e.classList)e.classList[n?"add":"remove"](t);else{var r=(" "+e.className+" ").replace(/\s+/g," ").replace(" "+t+" ","");e.className=r+(n?" "+t:"")}}function y(e,t){return e?e.classList?e.classList.contains(t):new RegExp("(\\s|^)"+t+"(\\s|$)").test(e.className):!1}function b(e,t,n){var r;return function(){function a(){n||e.apply(s,o),r=null}var s=this,o=arguments;r?clearTimeout(r):n&&e.apply(s,o),r=setTimeout(a,t||100)}}function v(e,t,n){e&&k(e,t,n,!0)}function g(e,t,n){e&&k(e,t,n,!1)}function h(e,t,n,r){v(e,t,function(t){n&&n.apply(e,[t]),r.apply(e,[t])})}function k(e,t,n,r){var a=t.split(" ");if(e instanceof NodeList)for(var s=0;s<e.length;s++)e[s]instanceof Node&&k(e[s],arguments[1],arguments[2],arguments[3]);else for(var o=0;o<a.length;o++)e[r?"addEventListener":"removeEventListener"](a[o],n,!1)}function w(e,t,n){if(e&&t){var r=new CustomEvent(t,n);e.dispatchEvent(r)}}function x(e,t){return e?(t="boolean"==typeof t?t:!e.getAttribute("aria-pressed"),e.setAttribute("aria-pressed",t),t):void 0}function T(e,t){return 0===e||0===t||isNaN(e)||isNaN(t)?0:(e/t*100).toFixed(2)}function _(){var e=arguments;if(e.length){if(1==e.lenth)return e[0];for(var t=Array.prototype.shift.call(e),n=e.length,r=0;n>r;r++){var a=e[r];for(var s in a)a[s]&&a[s].constructor&&a[s].constructor===Object?(t[s]=t[s]||{},_(t[s],a[s])):t[s]=a[s]}return t}}function F(){var e={supportsFullScreen:!1,isFullScreen:function(){return!1},requestFullScreen:function(){},cancelFullScreen:function(){},fullScreenEventName:"",element:null,prefix:""},n="webkit moz o ms khtml".split(" ");if("undefined"!=typeof t.cancelFullScreen)e.supportsFullScreen=!0;else for(var r=0,a=n.length;a>r;r++){if(e.prefix=n[r],"undefined"!=typeof t[e.prefix+"CancelFullScreen"]){e.supportsFullScreen=!0;break}if("undefined"!=typeof t.msExitFullscreen&&t.msFullscreenEnabled){e.prefix="ms",e.supportsFullScreen=!0;break}}return e.supportsFullScreen&&(e.fullScreenEventName="ms"==e.prefix?"MSFullscreenChange":e.prefix+"fullscreenchange",e.isFullScreen=function(e){switch("undefined"==typeof e&&(e=t.body),this.prefix){case"":return t.fullscreenElement==e;case"moz":return t.mozFullScreenElement==e;default:return t[this.prefix+"FullscreenElement"]==e}},e.requestFullScreen=function(e){return"undefined"==typeof e&&(e=t.body),""===this.prefix?e.requestFullScreen():e[this.prefix+("ms"==this.prefix?"RequestFullscreen":"RequestFullScreen")]()},e.cancelFullScreen=function(){return""===this.prefix?t.cancelFullScreen():t[this.prefix+("ms"==this.prefix?"ExitFullscreen":"CancelFullScreen")]()},e.element=function(){return""===this.prefix?t.fullscreenElement:t[this.prefix+"FullscreenElement"]}),e}function C(){var t={supported:function(){if(!("localStorage"in e))return!1;try{e.localStorage.setItem("___test","OK");var t=e.localStorage.getItem("___test");return e.localStorage.removeItem("___test"),"OK"===t}catch(n){return!1}return!1}()};return t}function E(k,_){function E(t,n){_.debug&&e.console&&console[n?"warn":"log"](t)}function N(){var e=[];return s(_.controls,"play-large")&&e.push('<button type="button" data-plyr="play" class="plyr__play-large">','<svg><use xlink:href="#'+_.iconPrefix+'-play" /></svg>','<span class="plyr__sr-only">'+_.i18n.play+"</span>","</button>"),e.push('<div class="plyr__controls">'),s(_.controls,"restart")&&e.push('<button type="button" data-plyr="restart">','<svg><use xlink:href="#'+_.iconPrefix+'-restart" /></svg>','<span class="plyr__sr-only">'+_.i18n.restart+"</span>","</button>"),s(_.controls,"rewind")&&e.push('<button type="button" data-plyr="rewind">','<svg><use xlink:href="#'+_.iconPrefix+'-rewind" /></svg>','<span class="plyr__sr-only">'+_.i18n.rewind+"</span>","</button>"),s(_.controls,"play")&&e.push('<button type="button" data-plyr="play">','<svg><use xlink:href="#'+_.iconPrefix+'-play" /></svg>','<span class="plyr__sr-only">'+_.i18n.play+"</span>","</button>",'<button type="button" data-plyr="pause">','<svg><use xlink:href="#'+_.iconPrefix+'-pause" /></svg>','<span class="plyr__sr-only">'+_.i18n.pause+"</span>","</button>"),s(_.controls,"fast-forward")&&e.push('<button type="button" data-plyr="fast-forward">','<svg><use xlink:href="#'+_.iconPrefix+'-fast-forward" /></svg>','<span class="plyr__sr-only">'+_.i18n.forward+"</span>","</button>"),s(_.controls,"progress")&&(e.push('<span class="plyr__progress">','<label for="seek{id}" class="plyr__sr-only">Seek</label>','<input id="seek{id}" class="plyr__progress--seek" type="range" min="0" max="100" step="0.1" value="0" data-plyr="seek">','<progress class="plyr__progress--played" max="100" value="0">',"<span>0</span>% "+_.i18n.played,"</progress>",'<progress class="plyr__progress--buffer" max="100" value="0">',"<span>0</span>% "+_.i18n.buffered,"</progress>"),_.tooltips.seek&&e.push('<span class="plyr__tooltip">00:00</span>'),e.push("</span>")),s(_.controls,"current-time")&&e.push('<span class="plyr__time">','<span class="plyr__sr-only">'+_.i18n.currentTime+"</span>",'<span class="plyr__time--current">00:00</span>',"</span>"),s(_.controls,"duration")&&e.push('<span class="plyr__time">','<span class="plyr__sr-only">'+_.i18n.duration+"</span>",'<span class="plyr__time--duration">00:00</span>',"</span>"),s(_.controls,"mute")&&e.push('<button type="button" data-plyr="mute">','<svg class="icon--muted"><use xlink:href="#'+_.iconPrefix+'-muted" /></svg>','<svg><use xlink:href="#'+_.iconPrefix+'-volume" /></svg>','<span class="plyr__sr-only">'+_.i18n.toggleMute+"</span>","</button>"),s(_.controls,"volume")&&e.push('<label for="volume{id}" class="plyr__sr-only">'+_.i18n.volume+"</label>",'<input id="volume{id}" class="plyr__volume" type="range" min="0" max="10" value="5" data-plyr="volume">'),s(_.controls,"captions")&&e.push('<button type="button" data-plyr="captions">','<svg class="icon--captions-on"><use xlink:href="#'+_.iconPrefix+'-captions-on" /></svg>','<svg><use xlink:href="#'+_.iconPrefix+'-captions-off" /></svg>','<span class="plyr__sr-only">'+_.i18n.toggleCaptions+"</span>","</button>"),s(_.controls,"fullscreen")&&e.push('<button type="button" data-plyr="fullscreen">','<svg class="icon--exit-fullscreen"><use xlink:href="#'+_.iconPrefix+'-exit-fullscreen" /></svg>','<svg><use xlink:href="#'+_.iconPrefix+'-enter-fullscreen" /></svg>','<span class="plyr__sr-only">'+_.i18n.toggleFullscreen+"</span>","</button>"),e.push("</div>"),e.join("")}function I(){if(Ee.supported.full&&("audio"!=Ee.type||_.fullscreen.allowAudio)&&_.fullscreen.enabled){var e=S.supportsFullScreen;e||_.fullscreen.fallback&&!R()?(E((e?"Native":"Fallback")+" fullscreen enabled"),m(Ee.container,_.classes.fullscreen.enabled,!0)):E("Fullscreen not supported and fallback disabled"),x(Ee.buttons.fullscreen,!1),j()}}function P(){if("video"===Ee.type){q(_.selectors.captions)||Ee.videoContainer.insertAdjacentHTML("afterbegin",'<div class="'+f(_.selectors.captions)+'"></div>'),Ee.usingTextTracks=!1,Ee.media.textTracks&&(Ee.usingTextTracks=!0);for(var e,t="",n=Ee.media.childNodes,r=0;r<n.length;r++)"track"===n[r].nodeName.toLowerCase()&&(e=n[r].kind,("captions"===e||"subtitles"===e)&&(t=n[r].getAttribute("src")));if(Ee.captionExists=!0,""===t?(Ee.captionExists=!1,E("No caption track found")):E("Caption track found; URI: "+t),Ee.captionExists){for(var a=Ee.media.textTracks,s=0;s<a.length;s++)a[s].mode="hidden";if(O(Ee),("IE"===Ee.browser.name&&Ee.browser.version>=10||"Firefox"===Ee.browser.name&&Ee.browser.version>=31)&&(E("Detected browser with known TextTrack issues - using manual fallback"),Ee.usingTextTracks=!1),Ee.usingTextTracks){E("TextTracks supported");for(var o=0;o<a.length;o++){var i=a[o];("captions"===i.kind||"subtitles"===i.kind)&&v(i,"cuechange",function(){this.activeCues[0]&&"text"in this.activeCues[0]?M(this.activeCues[0].getCueAsHTML()):M()})}}else if(E("TextTracks not supported so rendering captions manually"),Ee.currentCaption="",Ee.captions=[],""!==t){var l=new XMLHttpRequest;l.onreadystatechange=function(){if(4===l.readyState)if(200===l.status){var e,t=[],n=l.responseText;t=n.split("\n\n");for(var r=0;r<t.length;r++){e=t[r],Ee.captions[r]=[];var a=e.split("\n"),s=0;-1===a[s].indexOf(":")&&(s=1),Ee.captions[r]=[a[s],a[s+1]]}Ee.captions.shift(),E("Successfully loaded the caption file via AJAX")}else E("There was a problem loading the caption file via AJAX",!0)},l.open("get",t,!0),l.send()}}else m(Ee.container,_.classes.captions.enabled)}}function M(e){var n=q(_.selectors.captions),r=t.createElement("span");n.innerHTML="","undefined"==typeof e&&(e=""),"string"==typeof e?r.innerHTML=e.trim():r.appendChild(e),n.appendChild(r);n.offsetHeight}function L(e){function t(e,t){var n=[];n=e.split(" --> ");for(var r=0;r<n.length;r++)n[r]=n[r].replace(/(\d+:\d+:\d+\.\d+).*/,"$1");return a(n[t])}function n(e){return t(e,0)}function r(e){return t(e,1)}function a(e){if(null===e||void 0===e)return 0;var t,n=[],r=[];return n=e.split(","),r=n[0].split(":"),t=Math.floor(60*r[0]*60)+Math.floor(60*r[1])+Math.floor(r[2])}if(!Ee.usingTextTracks&&"video"===Ee.type&&Ee.supported.full&&(Ee.subcount=0,e="number"==typeof e?e:Ee.media.currentTime,Ee.captions[Ee.subcount])){for(;r(Ee.captions[Ee.subcount][0])<e.toFixed(1);)if(Ee.subcount++,Ee.subcount>Ee.captions.length-1){Ee.subcount=Ee.captions.length-1;break}Ee.media.currentTime.toFixed(1)>=n(Ee.captions[Ee.subcount][0])&&Ee.media.currentTime.toFixed(1)<=r(Ee.captions[Ee.subcount][0])?(Ee.currentCaption=Ee.captions[Ee.subcount][1],M(Ee.currentCaption)):M()}}function O(){Ee.buttons.captions&&(m(Ee.container,_.classes.captions.enabled,!0),_.captions.defaultActive&&(m(Ee.container,_.classes.captions.active,!0),x(Ee.buttons.captions,!0)))}function V(e){return Ee.container.querySelectorAll(e)}function q(e){return V(e)[0]}function R(){try{return e.self!==e.top}catch(t){return!0}}function j(){function e(e){9===e.which&&Ee.isFullscreen&&(e.target!==r||e.shiftKey?e.target===n&&e.shiftKey&&(e.preventDefault(),r.focus()):(e.preventDefault(),n.focus()))}var t=V("input:not([disabled]), button:not([disabled])"),n=t[0],r=t[t.length-1];v(Ee.container,"keydown",e)}function H(e,t){if("string"==typeof t)d(e,Ee.media,{src:t});else if(t.constructor===Array)for(var n=t.length-1;n>=0;n--)d(e,Ee.media,t[n])}function D(){var e=_.html;E("Injecting custom controls"),e||(e=N()),e=o(e,"{seektime}",_.seekTime),e=o(e,"{id}",Math.floor(1e4*Math.random()));var n;if(null!==_.selectors.controls.container&&(n=_.selectors.controls.container,"string"==typeof selector&&(n=t.querySelector(n))),n instanceof HTMLElement||(n=Ee.container),n.insertAdjacentHTML("beforeend",e),_.tooltips.controls)for(var r=V([_.selectors.controls.wrapper," ",_.selectors.labels," .",_.classes.hidden].join("")),a=r.length-1;a>=0;a--){var s=r[a];m(s,_.classes.hidden,!1),m(s,_.classes.tooltip,!0)}}function B(){try{return Ee.controls=q(_.selectors.controls.wrapper),Ee.buttons={},Ee.buttons.seek=q(_.selectors.buttons.seek),Ee.buttons.play=V(_.selectors.buttons.play),Ee.buttons.pause=q(_.selectors.buttons.pause),Ee.buttons.restart=q(_.selectors.buttons.restart),Ee.buttons.rewind=q(_.selectors.buttons.rewind),Ee.buttons.forward=q(_.selectors.buttons.forward),Ee.buttons.fullscreen=q(_.selectors.buttons.fullscreen),Ee.buttons.volume=q(_.selectors.buttons.volume),Ee.buttons.mute=q(_.selectors.buttons.mute),Ee.buttons.captions=q(_.selectors.buttons.captions),Ee.checkboxes=V('[type="checkbox"]'),Ee.progress={},Ee.progress.container=q(_.selectors.progress.container),Ee.progress.buffer={},Ee.progress.buffer.bar=q(_.selectors.progress.buffer),Ee.progress.buffer.text=Ee.progress.buffer.bar&&Ee.progress.buffer.bar.getElementsByTagName("span")[0],Ee.progress.played={},Ee.progress.played.bar=q(_.selectors.progress.played),Ee.progress.played.text=Ee.progress.played.bar&&Ee.progress.played.bar.getElementsByTagName("span")[0],Ee.progress.tooltip=Ee.progress.container&&Ee.progress.container.querySelector("."+_.classes.tooltip),Ee.volume=q(_.selectors.buttons.volume),Ee.duration=q(_.selectors.duration),Ee.currentTime=q(_.selectors.currentTime),Ee.seekTime=V(_.selectors.seekTime),!0}catch(e){return E("It looks like there is a problem with your controls html",!0),$(!0),!1}}function Y(){m(Ee.container,_.selectors.container.replace(".",""),Ee.supported.full)}function $(e){e?Ee.media.setAttribute("controls",""):Ee.media.removeAttribute("controls")}function W(e){var t=_.i18n.play;if("undefined"!=typeof _.title&&_.title.length&&(t+=", "+_.title),Ee.supported.full&&Ee.buttons.play)for(var n=Ee.buttons.play.length-1;n>=0;n--)Ee.buttons.play[n].setAttribute("aria-label",t);e instanceof HTMLElement&&e.setAttribute("title",_.i18n.frameTitle.replace("{title}",_.title))}function z(){if(!Ee.media)return E("No audio or video element found",!0),!1;if(Ee.supported.full&&(m(Ee.container,_.classes.type.replace("{0}",Ee.type),!0),m(Ee.container,_.classes.stopped,_.autoplay),m(Ee.container,_.classes.isIos,Ee.browser.ios),m(Ee.container,_.classes.isTouch,Ee.browser.touch),"video"===Ee.type)){var e=t.createElement("div");e.setAttribute("class",_.classes.videoWrapper),i(Ee.media,e),Ee.videoContainer=e}s(_.types.embed,Ee.type)&&(K(),Ee.embedId=null)}function K(){for(var n=t.createElement("div"),r=Ee.embedId,s=Ee.type+"-"+Math.floor(1e4*Math.random()),o=V('[id^="'+Ee.type+'-"]'),i=o.length-1;i>=0;i--)u(o[i]);if(m(Ee.media,_.classes.videoWrapper,!0),m(Ee.media,_.classes.embedWrapper,!0),"youtube"===Ee.type)Ee.media.appendChild(n),n.setAttribute("id",s),"object"==typeof YT?X(r,n):(a(_.urls.youtube.api),e.onYouTubeReadyCallbacks=e.onYouTubeReadyCallbacks||[],e.onYouTubeReadyCallbacks.push(function(){X(r,n)}),e.onYouTubeIframeAPIReady=function(){e.onYouTubeReadyCallbacks.forEach(function(e){e()})});else if("vimeo"===Ee.type){var l=t.createElement("iframe");l.loaded=!1,v(l,"load",function(){l.loaded=!0}),p(l,{src:"https://player.vimeo.com/video/"+r+"?player_id="+s+"&api=1&badge=0&byline=0&portrait=0&title=0",id:s,webkitallowfullscreen:"",mozallowfullscreen:"",allowfullscreen:"",frameborder:0}),Ee.supported.full?(n.appendChild(l),Ee.media.appendChild(n)):Ee.media.appendChild(l),"$f"in e||a(_.urls.vimeo.api);var c=e.setInterval(function(){"$f"in e&&l.loaded&&(e.clearInterval(c),J.call(l))},50)}}function U(){Ee.container.plyr.embed=Ee.embed,Ce(),W(q("iframe"))}function X(t,n){"timer"in Ee||(Ee.timer={}),Ee.embed=new YT.Player(n.id,{videoId:t,playerVars:{autoplay:_.autoplay?1:0,controls:Ee.supported.full?0:1,rel:0,showinfo:0,iv_load_policy:3,cc_load_policy:_.captions.defaultActive?1:0,cc_lang_pref:"en",wmode:"transparent",modestbranding:1,disablekb:1,origin:"*"},events:{onReady:function(t){var n=t.target;Ee.media.play=function(){n.playVideo(),Ee.media.paused=!1},Ee.media.pause=function(){n.pauseVideo(),Ee.media.paused=!0},Ee.media.stop=function(){n.stopVideo(),Ee.media.paused=!0},Ee.media.duration=n.getDuration(),Ee.media.paused=!0,Ee.media.currentTime=n.getCurrentTime(),Ee.media.muted=n.isMuted(),_.title=n.getVideoData().title,w(Ee.media,"timeupdate"),e.clearInterval(Ee.timer.buffering),Ee.timer.buffering=e.setInterval(function(){Ee.media.buffered=n.getVideoLoadedFraction(),w(Ee.media,"progress"),1===Ee.media.buffered&&(e.clearInterval(Ee.timer.buffering),w(Ee.media,"canplaythrough"))},200),U(),me()},onStateChange:function(t){var n=t.target;switch(e.clearInterval(Ee.timer.playing),t.data){case 0:Ee.media.paused=!0,w(Ee.media,"ended");break;case 1:Ee.media.paused=!1,Ee.media.seeking=!1,w(Ee.media,"play"),w(Ee.media,"playing"),Ee.timer.playing=e.setInterval(function(){Ee.media.currentTime=n.getCurrentTime(),w(Ee.media,"timeupdate")},100);break;case 2:Ee.media.paused=!0,w(Ee.media,"pause")}}}})}function J(){Ee.embed=$f(this),Ee.embed.addEvent("ready",function(){Ee.media.play=function(){Ee.embed.api("play"),Ee.media.paused=!1},Ee.media.pause=function(){Ee.embed.api("pause"),Ee.media.paused=!0},Ee.media.stop=function(){Ee.embed.api("stop"),Ee.media.paused=!0},Ee.media.paused=!0,Ee.media.currentTime=0,U(),Ee.embed.api("getCurrentTime",function(e){Ee.media.currentTime=e,w(Ee.media,"timeupdate")}),Ee.embed.api("getDuration",function(e){Ee.media.duration=e,me()}),Ee.embed.addEvent("play",function(){Ee.media.paused=!1,w(Ee.media,"play"),w(Ee.media,"playing")}),Ee.embed.addEvent("pause",function(){Ee.media.paused=!0,w(Ee.media,"pause")}),Ee.embed.addEvent("playProgress",function(e){Ee.media.seeking=!1,Ee.media.currentTime=e.seconds,w(Ee.media,"timeupdate")}),Ee.embed.addEvent("loadProgress",function(e){Ee.media.buffered=e.percent,w(Ee.media,"progress"),1===parseInt(e.percent)&&w(Ee.media,"canplaythrough")}),Ee.embed.addEvent("finish",function(){Ee.media.paused=!0,w(Ee.media,"ended")}),_.autoplay&&Ee.embed.api("play")})}function G(){"play"in Ee.media&&Ee.media.play()}function Q(){"pause"in Ee.media&&Ee.media.pause()}function Z(e){e===!0?G():e===!1?Q():Ee.media[Ee.media.paused?"play":"pause"]()}function ee(e){"number"!=typeof e&&(e=_.seekTime),ne(Ee.media.currentTime-e)}function te(e){"number"!=typeof e&&(e=_.seekTime),ne(Ee.media.currentTime+e)}function ne(e){var t=0,n=Ee.media.paused,r=re();"number"==typeof e?t=e:"object"!=typeof e||"input"!==e.type&&"change"!==e.type||(t=e.target.value/e.target.max*r),0>t?t=0:t>r&&(t=r);try{Ee.media.currentTime=t.toFixed(1)}catch(a){}if(s(_.types.embed,Ee.type)){switch(Ee.type){case"youtube":Ee.embed.seekTo(t);break;case"vimeo":Ee.embed.api("seekTo",t.toFixed(0))}n&&Q(),w(Ee.media,"timeupdate"),Ee.media.seeking=!0}E("Seeking to "+Ee.media.currentTime+" seconds"),L(t)}function re(){var e=parseInt(_.duration);return isNaN(e)?Ee.media.duration:e}function ae(){m(Ee.container,_.classes.playing,!Ee.media.paused),m(Ee.container,_.classes.stopped,Ee.media.paused),ve(Ee.media.paused)}function se(e){var n=S.supportsFullScreen;e&&e.type===S.fullScreenEventName?Ee.isFullscreen=S.isFullScreen(Ee.container):n?(S.isFullScreen(Ee.container)?S.cancelFullScreen():S.requestFullScreen(Ee.container),Ee.isFullscreen=S.isFullScreen(Ee.container)):(Ee.isFullscreen=!Ee.isFullscreen,Ee.isFullscreen?(v(t,"keyup",oe),t.body.style.overflow="hidden"):(g(t,"keyup",oe),t.body.style.overflow="")),m(Ee.container,_.classes.fullscreen.active,Ee.isFullscreen),Ee.isFullscreen?Ee.container.setAttribute("tabindex","-1"):Ee.container.removeAttribute("tabindex"),j(Ee.isFullscreen),x(Ee.buttons.fullscreen,Ee.isFullscreen),ve(!1),w(Ee.container,Ee.isFullscreen?"enterfullscreen":"exitfullscreen")}function oe(e){27===(e.which||e.charCode||e.keyCode)&&Ee.isFullscreen&&se()}function ie(e){if("boolean"!=typeof e&&(e=!Ee.media.muted),x(Ee.buttons.mute,e),Ee.media.muted=e,s(_.types.embed,Ee.type)){switch(Ee.type){case"youtube":Ee.embed[Ee.media.muted?"mute":"unMute"]();break;case"vimeo":Ee.embed.api("setVolume",Ee.media.muted?0:parseFloat(_.volume/10))}w(Ee.media,"volumechange")}}function le(t){if("undefined"==typeof t&&(t=_.volume,_.storage.enabled&&C().supported&&(t=e.localStorage.getItem(_.storage.key),e.localStorage.removeItem("plyr-volume"))),(null===t||isNaN(t))&&(t=_.volume),t>10&&(t=10),0>t&&(t=0),Ee.media.volume=parseFloat(t/10),_.volume=t,s(_.types.embed,Ee.type)){switch(Ee.type){case"youtube":Ee.embed.setVolume(100*Ee.media.volume);break;case"vimeo":Ee.embed.api("setVolume",Ee.media.volume)}w(Ee.media,"volumechange")}Ee.media.muted&&t>0&&ie()}function ue(){var t=Ee.media.muted?0:10*Ee.media.volume;Ee.supported.full&&Ee.volume&&(Ee.volume.value=t),_.storage.enabled&&C().supported&&!isNaN(t)&&e.localStorage.setItem(_.storage.key,t),m(Ee.container,_.classes.muted,0===t),Ee.supported.full&&Ee.buttons.mute&&x(Ee.buttons.mute,0===t)}function ce(e){Ee.supported.full&&Ee.buttons.captions&&("boolean"!=typeof e&&(e=-1===Ee.container.className.indexOf(_.classes.captions.active)),Ee.captionsEnabled=e,x(Ee.buttons.captions,Ee.captionsEnabled),m(Ee.container,_.classes.captions.active,Ee.captionsEnabled),w(Ee.container,Ee.captionsEnabled?"captionsenabled":"captionsdisabled"))}function pe(e){var t="waiting"===e.type;clearTimeout(Ee.timers.loading),Ee.timers.loading=setTimeout(function(){m(Ee.container,_.classes.loading,t)},t?250:0)}function de(e){var t=Ee.progress.played.bar,n=Ee.progress.played.text,r=0,a=re();if(e)switch(e.type){case"timeupdate":case"seeking":r=T(Ee.media.currentTime,a),"timeupdate"==e.type&&Ee.buttons.seek&&(Ee.buttons.seek.value=r);break;case"change":case"input":r=e.target.value;break;case"playing":case"progress":t=Ee.progress.buffer.bar,n=Ee.progress.buffer.text,r=function(){var e=Ee.media.buffered;return e&&e.length?T(e.end(0),a):"number"==typeof e?100*e:0}()}t&&(t.value=r),n&&(n.innerHTML=r)}function fe(e,t){if(t){isNaN(e)&&(e=0),Ee.secs=parseInt(e%60),Ee.mins=parseInt(e/60%60),Ee.hours=parseInt(e/60/60%60);var n=parseInt(re()/60/60%60)>0;Ee.secs=("0"+Ee.secs).slice(-2),Ee.mins=("0"+Ee.mins).slice(-2),t.innerHTML=(n?Ee.hours+":":"")+Ee.mins+":"+Ee.secs}}function me(){if(Ee.supported.full){var e=re()||0;!Ee.duration&&_.displayDuration&&Ee.media.paused&&fe(e,Ee.currentTime),Ee.duration&&fe(e,Ee.duration),be()}}function ye(e){fe(Ee.media.currentTime,Ee.currentTime),e&&"timeupdate"==e.type&&Ee.media.seeking||de(e)}function be(e){if(_.tooltips.seek&&!Ee.browser.touch){var t=Ee.progress.container.getBoundingClientRect(),n=0,r=_.classes.tooltip+"--visible";if(e)n=100/t.width*(e.pageX-t.left);else{if(!y(Ee.progress.tooltip,r))return;n=Ee.progress.tooltip.style.left.replace("%","")}0>n?n=0:n>100&&(n=100),fe(re()/100*n,Ee.progress.tooltip),Ee.progress.tooltip.style.left=n+"%",e&&s(["mouseenter","mouseleave"],e.type)&&m(Ee.progress.tooltip,r,"mouseenter"===e.type)}}function ve(t){if(_.hideControls){var n=!1;"boolean"!=typeof t&&(t&&t.type?(n="mousemove"===t.type,t=s(["mousemove","mouseenter"],t.type)):t=!1),e.clearTimeout(Ee.timers.hover),(t||Ee.media.paused)&&m(Ee.container,_.classes.hideControls,!1),Ee.media.paused||t!==!1&&Ee.media.paused||(Ee.timers.hover=e.setTimeout(function(){Ee.controls.active||m(Ee.container,_.classes.hideControls,!0)},n?2e3:0))}}function ge(e){if("undefined"!=typeof e)return void he(e);var t;switch(Ee.type){case"youtube":t=Ee.embed.getVideoUrl();break;case"vimeo":Ee.embed.api("getVideoUrl",function(e){t=e});break;default:t=Ee.media.currentSrc}return t||""}function he(n){if(!("undefined"!=typeof n&&"sources"in n&&n.sources.length))return void E("Invalid source format",!0);if(Q(),Ee.buttons.seek&&(Ee.buttons.seek.value=0),"youtube"===Ee.type?(Ee.embed.destroy(),e.clearInterval(Ee.timer.buffering),e.clearInterval(Ee.timer.playing)):"video"===Ee.type&&Ee.videoContainer&&u(Ee.videoContainer),Ee.embed=null,Te(),u(Ee.media),"type"in n&&(Ee.type=n.type,"video"===Ee.type)){var r=n.sources[0];"type"in r&&s(_.types.embed,r.type)&&(Ee.type=r.type)}switch(Ee.supported=A.supported(Ee.type),Ee.type){case"video":Ee.media=t.createElement("video");break;case"audio":Ee.media=t.createElement("audio");break;case"youtube":case"vimeo":Ee.media=t.createElement("div"),Ee.embedId=n.sources[0].src}c(Ee.container,Ee.media),"undefined"!=typeof n.autoplay&&(_.autoplay=n.autoplay),s(_.types.html5,Ee.type)&&(_.crossorigin&&Ee.media.setAttribute("crossorigin",""),_.autoplay&&Ee.media.setAttribute("autoplay",""),"poster"in n&&Ee.media.setAttribute("poster",n.poster),_.loop&&Ee.media.setAttribute("loop","")),Ee.container.className=Ee.originalClassName,m(Ee.container,_.classes.fullscreen.active,Ee.isFullscreen),m(Ee.container,_.classes.captions.active,Ee.captionsEnabled),Y(),s(_.types.html5,Ee.type)&&H("source",n.sources),z(),s(_.types.html5,Ee.type)&&("tracks"in n&&H("track",n.tracks),Ee.media.load(),Ce(),me()),_.title=n.title,W(),Ee.container.plyr.media=Ee.media}function ke(e){"video"===Ee.type&&Ee.media.setAttribute("poster",e)}function we(){function n(){var e=Ee.media.paused;e?G():Q();var t=Ee.buttons[e?"play":"pause"],n=Ee.buttons[e?"pause":"play"];if(n){var r=y(t,_.classes.tabFocus);setTimeout(function(){n.focus(),r&&(m(t,_.classes.tabFocus,!1),m(n,_.classes.tabFocus,!0))},100)}}function r(){var e=t.activeElement;e&&e!=t.body?t.querySelector&&(e=t.querySelector(":focus")):e=null;for(var n in Ee.buttons){var r=Ee.buttons[n];m(r,_.classes.tabFocus,r===e)}}var a="IE"==Ee.browser.name?"change":"input";v(e,"keyup",function(e){var t=e.keyCode?e.keyCode:e.which;9==t&&r()}),v(t.body,"click",function(){m(q("."+_.classes.tabFocus),_.classes.tabFocus,!1)});for(var s in Ee.buttons){var o=Ee.buttons[s];v(o,"blur",function(){m(o,"tab-focus",!1)})}h(Ee.buttons.play,"click",_.listeners.play,n),h(Ee.buttons.pause,"click",_.listeners.pause,n),h(Ee.buttons.restart,"click",_.listeners.restart,ne),h(Ee.buttons.rewind,"click",_.listeners.rewind,ee),h(Ee.buttons.forward,"click",_.listeners.forward,te),h(Ee.buttons.seek,a,_.listeners.seek,ne),h(Ee.volume,a,_.listeners.volume,function(){le(Ee.volume.value)}),h(Ee.buttons.mute,"click",_.listeners.mute,ie),h(Ee.buttons.fullscreen,"click",_.listeners.fullscreen,se),S.supportsFullScreen&&v(t,S.fullScreenEventName,se),v(Ee.buttons.captions,"click",ce),v(Ee.progress.container,"mouseenter mouseleave mousemove",be),_.hideControls&&(v(Ee.container,"mouseenter mouseleave",ve),v(Ee.container,"mousemove",b(ve,500,!0)),v(Ee.controls,"mouseenter mouseleave",function(e){Ee.controls.active="mouseenter"===e.type}))}function xe(){v(Ee.media,"timeupdate seeking",ye),v(Ee.media,"timeupdate",L),v(Ee.media,"durationchange loadedmetadata",me),v(Ee.media,"ended",function(){"video"===Ee.type&&M(),ae()}),v(Ee.media,"progress playing",de),v(Ee.media,"volumechange",ue),v(Ee.media,"play pause",ae),v(Ee.media,"waiting canplay seeked",pe),_.clickToPlay&&(Ee.videoContainer.style.cursor="pointer",v(Ee.media,"click",function(){Ee.media.paused?G():Ee.media.ended?(ne(),G()):Q()})),v(Ee.media,_.events.join(" "),function(e){w(Ee.container,e.type)})}function Te(){if(s(_.types.html5,Ee.type)){Ee.media.setAttribute("src","");for(var e=Ee.media.querySelectorAll("source"),t=0;t<e.length;t++)u(e[t]);Ee.media.load(),E("Cancelled network requests for old media")}}function _e(){if(!Ee.init)return null;if(Ee.container.setAttribute("class",f(_.selectors.container)),Ee.init=!1,u(q(_.selectors.controls.wrapper)),"youtube"===Ee.type)return void Ee.embed.destroy();"video"===Ee.type&&(u(q(_.selectors.captions)),l(Ee.videoContainer)),$(!0);var e=Ee.media.cloneNode(!0);Ee.media.parentNode.replaceChild(e,Ee.media)}function Fe(){if(Ee.init)return null;S=F(),Ee.browser=n(),Ee.media=Ee.container.querySelectorAll("audio, video, div")[0],Ee.originalClassName=Ee.container.className;var e=Ee.media.tagName.toLowerCase();if("div"===e?(Ee.type=Ee.media.getAttribute("data-type"),Ee.embedId=Ee.media.getAttribute("data-video-id"),Ee.media.removeAttribute("data-type"),Ee.media.removeAttribute("data-video-id")):(Ee.type=e,_.crossorigin=null!==Ee.media.getAttribute("crossorigin"),_.autoplay=_.autoplay||null!==Ee.media.getAttribute("autoplay"),_.loop=_.loop||null!==Ee.media.getAttribute("loop")),Ee.supported=A.supported(Ee.type),Y(),!Ee.supported.basic)return!1;if(E(Ee.browser.name+" "+Ee.browser.version),z(),s(_.types.html5,Ee.type)){if(!Ee.supported.full)return void(Ee.init=!0);Ce(),W(),_.autoplay&&G()}Ee.init=!0}function Ce(){if(!Ee.supported.full)return E("No full support for this media type ("+Ee.type+")",!0),u(q(_.selectors.controls.wrapper)),void $(!0);var e=!V(_.selectors.controls.wrapper).length;e&&D(),B()&&(e&&we(),xe(),$(),I(),P(),le(),ue(),ye(),ae(),me(),w(Ee.container,"ready"))}var Ee=this;return Ee.container=k,Ee.timers={},E(_),Fe(),Ee.init?{media:Ee.media,play:G,pause:Q,restart:ne,rewind:ee,forward:te,seek:ne,source:ge,poster:ke,setVolume:le,togglePlay:Z,toggleMute:ie,toggleCaptions:ce,toggleFullscreen:se,isFullscreen:function(){return Ee.isFullscreen||!1},support:function(e){return r(Ee,e)},destroy:_e,restore:Fe}:{}}var S,A={},N={enabled:!0,debug:!1,autoplay:!1,loop:!1,seekTime:10,volume:5,duration:null,displayDuration:!0,iconPrefix:"icon",clickToPlay:!0,hideControls:!0,tooltips:{controls:!1,seek:!0},selectors:{container:".plyr",controls:{container:null,wrapper:".plyr__controls"},labels:"[data-plyr]",buttons:{seek:'[data-plyr="seek"]',play:'[data-plyr="play"]',pause:'[data-plyr="pause"]',restart:'[data-plyr="restart"]',rewind:'[data-plyr="rewind"]',forward:'[data-plyr="fast-forward"]',mute:'[data-plyr="mute"]',volume:'[data-plyr="volume"]',captions:'[data-plyr="captions"]',fullscreen:'[data-plyr="fullscreen"]'},progress:{container:".plyr__progress",buffer:".plyr__progress--buffer",played:".plyr__progress--played"},captions:".plyr__captions",currentTime:".plyr__time--current",duration:".plyr__time--duration"},classes:{videoWrapper:"plyr__video-wrapper",embedWrapper:"plyr__video-embed",type:"plyr--{0}",stopped:"plyr--stopped",playing:"plyr--playing",muted:"plyr--muted",loading:"plyr--loading",hover:"plyr--hover",tooltip:"plyr__tooltip",hidden:"plyr__sr-only",hideControls:"plyr--hide-controls",isIos:"plyr--is-ios",isTouch:"plyr--is-touch",captions:{enabled:"plyr--captions-enabled",active:"plyr--captions-active"},fullscreen:{enabled:"plyr--fullscreen-enabled",active:"plyr--fullscreen-active"},tabFocus:"tab-focus"},captions:{defaultActive:!1},fullscreen:{enabled:!0,fallback:!0,allowAudio:!1},storage:{enabled:!0,key:"plyr"},controls:["play-large","play","progress","current-time","mute","volume","captions","fullscreen"], +i18n:{restart:"Restart",rewind:"Rewind {seektime} secs",play:"Play",pause:"Pause",forward:"Forward {seektime} secs",played:"played",buffered:"buffered",currentTime:"Current time",duration:"Duration",volume:"Volume",toggleMute:"Toggle Mute",toggleCaptions:"Toggle Captions",toggleFullscreen:"Toggle Fullscreen",frameTitle:"Player for {title}"},types:{embed:["youtube","vimeo"],html5:["video","audio"]},urls:{vimeo:{api:"https://cdn.plyr.io/froogaloop/1.0.1/plyr.froogaloop.js"},youtube:{api:"https://www.youtube.com/iframe_api"}},listeners:{seek:null,play:null,pause:null,restart:null,rewind:null,forward:null,mute:null,volume:null,captions:null,fullscreen:null},events:["ended","progress","stalled","playing","waiting","canplay","canplaythrough","loadstart","loadeddata","loadedmetadata","timeupdate","volumechange","play","pause","error","seeking","emptied"]};return A.supported=function(e){var r,a,s=n(),o="IE"===s.name&&s.version<=9,i=/iPhone|iPod/i.test(navigator.userAgent),l=!!t.createElement("audio").canPlayType,u=!!t.createElement("video").canPlayType;switch(e){case"video":r=u,a=r&&!o&&!i;break;case"audio":r=l,a=r&&!o;break;case"vimeo":case"youtube":r=!0,a=!o&&!i;break;default:r=l&&u,a=r&&!o}return{basic:r,full:a}},A.setup=function(e,n){var r=[];if("string"==typeof e?e=t.querySelectorAll(e):e instanceof HTMLElement?e=[e]:e instanceof NodeList||"string"==typeof e||("undefined"==typeof n&&"object"==typeof e&&(n=e),e=t.querySelectorAll(N.selectors.container)),!A.supported().basic||!e.length)return!1;for(var a=0;a<e.length;a++){var s=e[a];if("undefined"==typeof s.plyr){var o=_(N,n,JSON.parse(s.getAttribute("data-plyr")));if(!o.enabled)return;var i=new E(s,o);s.plyr=Object.keys(i).length?i:!1,w(s,"setup",{plyr:s.plyr})}r.push(s.plyr)}return r},A}),function(){function e(e,t){t=t||{bubbles:!1,cancelable:!1,detail:void 0};var n=document.createEvent("CustomEvent");return n.initCustomEvent(e,t.bubbles,t.cancelable,t.detail),n}return"function"==typeof window.CustomEvent?!1:(e.prototype=window.Event.prototype,void(window.CustomEvent=e))}();
\ No newline at end of file diff --git a/dist/sprite.svg b/dist/sprite.svg index 96063e44..2b4cfc5a 100644 --- a/dist/sprite.svg +++ b/dist/sprite.svg @@ -1 +1 @@ -<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg"><symbol id="icon-captions-off" viewBox="0 0 18 18"><path d="M1 2c-.552 0-1 .448-1 1v12c0 .552.448 1 1 1h16c.552 0 1-.448 1-1V3c0-.552-.448-1-1-1H1zm1 12V4h14v10H2z"/></symbol><symbol id="icon-captions-on" viewBox="0 0 18 18"><path d="M1 2c-.552 0-1 .448-1 1v12c0 .552.448 1 1 1h16c.552 0 1-.448 1-1V3c0-.552-.448-1-1-1H1zm1 12V4h14v10H2z"/><path d="M3 11h3v2H3zM12 11h3v2h-3zM7 11h4v2H7z"/></symbol><symbol id="icon-enter-fullscreen" viewBox="0 0 18 18"><path d="M10.3 9.7c.7.677 1.4 0 1.4 0L16 5.4V10h2V3c0-.6-.4-1-1-1h-7v2h4.6l-4.3 4.3s-.7.723 0 1.4z"/><path d="M7 2v2H2v10h14v-1h2v2c0 .6-.4 1-1 1H1c-.6 0-1-.4-1-1V3c0-.6.4-1 1-1h6z"/></symbol><symbol id="icon-exit-fullscreen" viewBox="0 0 18 18"><path d="M7.7 8.3c-.7-.677-1.4 0-1.4 0L2 12.6V8H0v7c0 .6.4 1 1 1h7v-2H3.4l4.3-4.3s.7-.723 0-1.4z"/><path d="M11 16v-2h5V4H2v1H0V3c0-.6.4-1 1-1h16c.6 0 1 .4 1 1v12c0 .6-.4 1-1 1h-6z"/></symbol><symbol id="icon-fast-forward" viewBox="0 0 16 16"><path d="M7 6.4L0 1v14l7-5.4V15l9-7-9-7"/></symbol><symbol id="icon-muted" viewBox="0 0 18 18"><path d="M9.214 2c-.11 0-.225.032-.334.1L4.832 4.91C4.75 4.97 4.65 5 4.55 5H.995C.446 5 0 5.448 0 6v6c0 .552.446 1 .996 1H4.55c.1 0 .2.03.282.09L8.88 15.9c.11.068.223.1.334.1.392 0 .747-.4.747-.95V2.95c0-.55-.354-.95-.746-.95zM7.97 12.834L5.58 11.177c-.166-.115-.364-.178-.566-.178H2.49c-.274 0-.497-.225-.497-.5v-3c0-.277.223-.5.498-.5h2.526c.202 0 .4-.063.566-.18L7.97 5.165v7.67zM14.934 8.8c-.086-1.75-1.514-2.992-2.507-3.65-.47-.312-1.094-.122-1.325.408l-.038.086c-.188.43-.045.94.336 1.194.706.473 1.586 1.247 1.624 2.065.032.676-.553 1.468-1.663 2.27-.397.288-.528.84-.284 1.275l.042.075c.266.475.866.624 1.3.312 1.74-1.25 2.586-2.606 2.516-4.037z"/><path d="M13.957 9.2c.086 1.747 1.514 2.99 2.507 3.648.47.312 1.094.122 1.325-.408l.037-.086c.188-.43.045-.94-.336-1.194-.705-.473-1.585-1.247-1.623-2.065-.032-.676.553-1.468 1.663-2.27.398-.288.53-.84.285-1.275l-.042-.075c-.266-.475-.866-.624-1.3-.312-1.74 1.25-2.586 2.606-2.516 4.037z"/></symbol><symbol id="icon-pause" viewBox="0 0 16 16"><path d="M5 1H2c-.6 0-1 .4-1 1v12c0 .6.4 1 1 1h3c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zM14 1h-3c-.6 0-1 .4-1 1v12c0 .6.4 1 1 1h3c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1z"/></symbol><symbol id="icon-play" viewBox="0 0 16 16"><path d="M13.6 7.2l-10-7C2.9-.3 2 .2 2 1v14c0 .8.9 1.3 1.6.8l10-7c.5-.4.5-1.2 0-1.6z"/></symbol><symbol id="icon-restart" viewBox="0 0 16 16"><path d="M7.7 1.2l.7 6.4 2.1-2.1c1.9 1.9 1.9 5.1 0 7-.9 1-2.2 1.5-3.5 1.5-1.3 0-2.6-.5-3.5-1.5-1.9-1.9-1.9-5.1 0-7 .6-.6 1.4-1.1 2.3-1.3l-.6-1.9C4 2.6 2.9 3.2 2 4.1-.7 6.8-.7 11.2 2 14c1.3 1.3 3.1 2 4.9 2 1.9 0 3.6-.7 4.9-2 2.7-2.7 2.7-7.1 0-9.9L14 1.9l-6.3-.7z"/></symbol><symbol id="icon-rewind" viewBox="0 0 16 16"><path d="M9 1L0 8l9 7V9.6l7 5.4V1L9 6.4"/></symbol><symbol id="icon-volume" viewBox="0 0 18 18"><path d="M10.214 2c-.11 0-.225.032-.334.1L5.832 4.91C5.75 4.97 5.65 5 5.55 5H1.995C1.446 5 1 5.448 1 6v6c0 .552.446 1 .996 1H5.55c.1 0 .2.03.282.09L9.88 15.9c.11.068.223.1.334.1.392 0 .747-.4.747-.95V2.95c0-.55-.354-.95-.746-.95zM8.97 12.834L6.58 11.177c-.166-.115-.364-.178-.566-.178H3.49c-.274 0-.497-.225-.497-.5v-3c0-.277.223-.5.498-.5h2.526c.202 0 .4-.063.566-.18L8.97 5.165v7.67zM16.934 8.8c-.086-1.75-1.514-2.992-2.507-3.65-.47-.312-1.094-.122-1.325.408l-.038.086c-.188.43-.045.94.336 1.194.706.473 1.586 1.247 1.624 2.065.032.676-.553 1.468-1.663 2.27-.397.288-.528.84-.284 1.275l.042.075c.266.475.866.624 1.3.312 1.74-1.25 2.586-2.606 2.516-4.037z"/></symbol><symbol id="ui-16px-1_settings-gear-65" viewBox="0 0 16 16"><path d="M15.135 6.784c-1.303-.326-1.92-1.818-1.23-2.97.322-.535.225-.997-.094-1.315l-.31-.31c-.317-.32-.78-.416-1.315-.095-1.152.69-2.644.073-2.97-1.23C9.066.258 8.67 0 8.22 0h-.44c-.45 0-.844.258-.996.865-.326 1.303-1.818 1.92-2.97 1.23-.535-.322-.998-.225-1.316.093l-.31.31c-.318.318-.415.78-.093 1.317.69 1.152.073 2.644-1.23 2.97C.26 6.934 0 7.33 0 7.78v.44c0 .45.258.844.865.996 1.303.326 1.92 1.818 1.23 2.97-.322.535-.225.997.094 1.315l.31.31c.318.32.78.416 1.315.095 1.152-.69 2.644-.073 2.97 1.23.15.607.546.865.996.865h.44c.45 0 .844-.258.996-.865.326-1.303 1.818-1.92 2.97-1.23.534.32.996.225 1.315-.094l.31-.31c.32-.317.416-.78.095-1.315-.69-1.152-.073-2.644 1.23-2.97.607-.15.865-.546.865-.996v-.44c0-.45-.26-.845-.865-.996zM8 11c-1.657 0-3-1.343-3-3s1.343-3 3-3 3 1.343 3 3-1.343 3-3 3z"/></symbol><symbol id="ui-16px-2_enlarge-57" viewBox="0 0 16 16"><path d="M2 2h4V0H0v6h2M10 2h4v4h2V0h-6M14 14h-4v2h6v-6h-2M6 14H2v-4H0v6h6M4 6h8v4H4z"/></symbol></svg>
\ No newline at end of file +<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg"><symbol id="icon-captions-off" viewBox="0 0 18 18"><path d="M1 2c-.552 0-1 .448-1 1v12c0 .552.448 1 1 1h16c.552 0 1-.448 1-1V3c0-.552-.448-1-1-1H1zm1 12V4h14v10H2z"/></symbol><symbol id="icon-captions-on" viewBox="0 0 18 18"><path d="M1 2c-.552 0-1 .448-1 1v12c0 .552.448 1 1 1h16c.552 0 1-.448 1-1V3c0-.552-.448-1-1-1H1zm1 12V4h14v10H2z"/><path d="M3 11h3v2H3zM12 11h3v2h-3zM7 11h4v2H7z"/></symbol><symbol id="icon-enter-fullscreen" viewBox="0 0 18 18"><path d="M10.3 9.7c.7.677 1.4 0 1.4 0L16 5.4V10h2V3c0-.6-.4-1-1-1h-7v2h4.6l-4.3 4.3s-.7.723 0 1.4z"/><path d="M7 2v2H2v10h14v-1h2v2c0 .6-.4 1-1 1H1c-.6 0-1-.4-1-1V3c0-.6.4-1 1-1h6z"/></symbol><symbol id="icon-exit-fullscreen" viewBox="0 0 18 18"><path d="M7.7 8.3c-.7-.677-1.4 0-1.4 0L2 12.6V8H0v7c0 .6.4 1 1 1h7v-2H3.4l4.3-4.3s.7-.723 0-1.4z"/><path d="M11 16v-2h5V4H2v1H0V3c0-.6.4-1 1-1h16c.6 0 1 .4 1 1v12c0 .6-.4 1-1 1h-6z"/></symbol><symbol id="icon-fast-forward" viewBox="0 0 16 16"><path d="M7 6.4L0 1v14l7-5.4V15l9-7-9-7"/></symbol><symbol id="icon-muted" viewBox="0 0 18 18"><path d="M9.214 2c-.11 0-.225.032-.334.1L4.832 4.91C4.75 4.97 4.65 5 4.55 5H.995C.446 5 0 5.448 0 6v6c0 .552.446 1 .996 1H4.55c.1 0 .2.03.282.09L8.88 15.9c.11.068.223.1.334.1.392 0 .747-.4.747-.95V2.95c0-.55-.354-.95-.746-.95zM7.97 12.834L5.58 11.177c-.166-.115-.364-.178-.566-.178H2.49c-.274 0-.497-.225-.497-.5v-3c0-.277.223-.5.498-.5h2.526c.202 0 .4-.063.566-.18L7.97 5.165v7.67zM14.934 8.8c-.086-1.75-1.514-2.992-2.507-3.65-.47-.312-1.094-.122-1.325.408l-.038.086c-.188.43-.045.94.336 1.194.706.473 1.586 1.247 1.624 2.065.032.676-.553 1.468-1.663 2.27-.397.288-.528.84-.284 1.275l.042.075c.266.475.866.624 1.3.312 1.74-1.25 2.586-2.606 2.516-4.037z"/><path d="M13.957 9.2c.086 1.747 1.514 2.99 2.507 3.648.47.312 1.094.122 1.325-.408l.037-.086c.188-.43.045-.94-.336-1.194-.705-.473-1.585-1.247-1.623-2.065-.032-.676.553-1.468 1.663-2.27.398-.288.53-.84.285-1.275l-.042-.075c-.266-.475-.866-.624-1.3-.312-1.74 1.25-2.586 2.606-2.516 4.037z"/></symbol><symbol id="icon-pause" viewBox="0 0 16 16"><path d="M5 1H2c-.6 0-1 .4-1 1v12c0 .6.4 1 1 1h3c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zM14 1h-3c-.6 0-1 .4-1 1v12c0 .6.4 1 1 1h3c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1z"/></symbol><symbol id="icon-play" viewBox="0 0 16 16"><path d="M13.6 7.2l-10-7C2.9-.3 2 .2 2 1v14c0 .8.9 1.3 1.6.8l10-7c.5-.4.5-1.2 0-1.6z"/></symbol><symbol id="icon-restart" viewBox="0 0 16 16"><path d="M7.7 1.2l.7 6.4 2.1-2.1c1.9 1.9 1.9 5.1 0 7-.9 1-2.2 1.5-3.5 1.5-1.3 0-2.6-.5-3.5-1.5-1.9-1.9-1.9-5.1 0-7 .6-.6 1.4-1.1 2.3-1.3l-.6-1.9C4 2.6 2.9 3.2 2 4.1-.7 6.8-.7 11.2 2 14c1.3 1.3 3.1 2 4.9 2 1.9 0 3.6-.7 4.9-2 2.7-2.7 2.7-7.1 0-9.9L14 1.9l-6.3-.7z"/></symbol><symbol id="icon-rewind" viewBox="0 0 16 16"><path d="M9 1L0 8l9 7V9.6l7 5.4V1L9 6.4"/></symbol><symbol id="icon-volume" viewBox="0 0 18 18"><path d="M10.214 2c-.11 0-.225.032-.334.1L5.832 4.91C5.75 4.97 5.65 5 5.55 5H1.995C1.446 5 1 5.448 1 6v6c0 .552.446 1 .996 1H5.55c.1 0 .2.03.282.09L9.88 15.9c.11.068.223.1.334.1.392 0 .747-.4.747-.95V2.95c0-.55-.354-.95-.746-.95zM8.97 12.834L6.58 11.177c-.166-.115-.364-.178-.566-.178H3.49c-.274 0-.497-.225-.497-.5v-3c0-.277.223-.5.498-.5h2.526c.202 0 .4-.063.566-.18L8.97 5.165v7.67zM16.934 8.8c-.086-1.75-1.514-2.992-2.507-3.65-.47-.312-1.094-.122-1.325.408l-.038.086c-.188.43-.045.94.336 1.194.706.473 1.586 1.247 1.624 2.065.032.676-.553 1.468-1.663 2.27-.397.288-.528.84-.284 1.275l.042.075c.266.475.866.624 1.3.312 1.74-1.25 2.586-2.606 2.516-4.037z"/></symbol></svg>
\ No newline at end of file diff --git a/docs/dist/docs.svg b/docs/dist/docs.svg index e69de29b..6f09b44b 100644 --- a/docs/dist/docs.svg +++ b/docs/dist/docs.svg @@ -0,0 +1 @@ +<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg"><symbol id="icon-github" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M8 .2c-4.4 0-8 3.6-8 8 0 3.5 2.3 6.5 5.5 7.6.4.1.5-.2.5-.4V14c-2.2.5-2.7-1-2.7-1-.4-.9-.9-1.2-.9-1.2-.7-.5.1-.5.1-.5.8.1 1.2.8 1.2.8.7 1.3 1.9.9 2.3.7.1-.5.3-.9.5-1.1-1.8-.2-3.6-.9-3.6-4 0-.9.3-1.6.8-2.1-.1-.2-.4-1 .1-2.1 0 0 .7-.2 2.2.8.6-.2 1.3-.3 2-.3s1.4.1 2 .3c1.5-1 2.2-.8 2.2-.8.4 1.1.2 1.9.1 2.1.5.6.8 1.3.8 2.1 0 3.1-1.9 3.7-3.7 3.9.3.4.6.9.6 1.6v2.2c0 .2.1.5.6.4 3.2-1.1 5.5-4.1 5.5-7.6-.1-4.4-3.7-8-8.1-8z"/></symbol><symbol id="icon-twitter" viewBox="0 0 16 16"><title>Twitter</title><path d="M16 3c-.6.3-1.2.4-1.9.5.7-.4 1.2-1 1.4-1.8-.6.4-1.3.6-2.1.8-.6-.6-1.5-1-2.4-1-1.7 0-3.2 1.5-3.2 3.3 0 .3 0 .5.1.7-2.7-.1-5.2-1.4-6.8-3.4-.3.5-.4 1-.4 1.7 0 1.1.6 2.1 1.5 2.7-.5 0-1-.2-1.5-.4C.7 7.7 1.8 9 3.3 9.3c-.3.1-.6.1-.9.1-.2 0-.4 0-.6-.1.4 1.3 1.6 2.3 3.1 2.3-1.1.9-2.5 1.4-4.1 1.4H0c1.5.9 3.2 1.5 5 1.5 6 0 9.3-5 9.3-9.3v-.4C15 4.3 15.6 3.7 16 3z"/></symbol><symbol id="icon-vimeo" viewBox="0 0 16 16"><path d="M16 4.3c-.1 1.6-1.2 3.7-3.3 6.4-2.2 2.8-4 4.2-5.5 4.2-.9 0-1.7-.9-2.4-2.6C4 9.9 3.4 5 2 5c-.1 0-.5.3-1.2.8l-.8-1c.8-.7 3.5-3.4 4.7-3.5 1.2-.1 2 .7 2.3 2.5.3 2 .8 6.1 1.8 6.1.9 0 2.5-3.4 2.6-4 .1-.9-.3-1.9-2.3-1.1.8-2.6 2.3-3.8 4.5-3.8 1.7.1 2.5 1.2 2.4 3.3z"/></symbol><symbol id="icon-youtube" viewBox="0 0 16 16"><path d="M15.8 4.8c-.2-1.3-.8-2.2-2.2-2.4C11.4 2 8 2 8 2s-3.4 0-5.6.4C1 2.6.3 3.5.2 4.8 0 6.1 0 8 0 8s0 1.9.2 3.2c.2 1.3.8 2.2 2.2 2.4C4.6 14 8 14 8 14s3.4 0 5.6-.4c1.4-.3 2-1.1 2.2-2.4C16 9.9 16 8 16 8s0-1.9-.2-3.2zM6 11V5l5 3-5 3z"/></symbol></svg>
\ No newline at end of file diff --git a/src/js/plyr.js b/src/js/plyr.js index 5c9e329e..57ce0147 100644 --- a/src/js/plyr.js +++ b/src/js/plyr.js @@ -2188,7 +2188,6 @@ if(typeof toggle !== "boolean") { if(toggle && toggle.type) { isMouseMove = toggle.type === 'mousemove'; - toggle = _inArray(['mousemove','mouseenter'], toggle.type); } else { @@ -2200,10 +2199,15 @@ window.clearTimeout(plyr.timers.hover); // If the mouse is not over the controls, set a timeout to hide them - if(toggle) { + if(toggle || plyr.media.paused) { _toggleClass(plyr.container, config.classes.hideControls, false); } + // Always show controls when paused + if(plyr.media.paused) { + return; + } + // If toggle is false or if we're playing (regardless of toggle), then // set the timer to hide the controls if(toggle === false || !plyr.media.paused) { @@ -2214,7 +2218,7 @@ } _toggleClass(plyr.container, config.classes.hideControls, true); - }, isMouseMove ? 2000 : 500); + }, isMouseMove ? 2000 : 0); } } @@ -2258,6 +2262,11 @@ // Pause playback _pause(); + // Set seek input to 0 + if(plyr.buttons.seek) { + plyr.buttons.seek.value = 0; + } + // Clean up YouTube stuff if (plyr.type === 'youtube') { // Destroy the embed instance diff --git a/src/less/plyr.less b/src/less/plyr.less index 50a530c9..854ec28a 100644 --- a/src/less/plyr.less +++ b/src/less/plyr.less @@ -130,24 +130,7 @@ touch-action: manipulation; } - // Screen reader only elements - &__sr-only { - position: absolute !important; - clip: rect(1px, 1px, 1px, 1px); - padding: 0 !important; - border: 0 !important; - height: 1px !important; - width: 1px !important; - overflow: hidden; - } - - // For video - &__video-wrapper { - position: relative; - background: #000; - border-radius: inherit; - //overflow: hidden; - } + // Media elements video, audio { width: 100%; @@ -156,75 +139,7 @@ border-radius: inherit; } - // Container for embeds - &__video-embed { - padding-bottom: 56.25%; /* 16:9 */ - height: 0; - overflow: hidden; - border-radius: inherit; - - iframe { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - border: 0; - user-select: none; - } - - // Vimeo hack - > div { - position: relative; - padding-bottom: 200%; - transform: translateY(-35.95%); - } - - // To allow mouse events to be captured if full support - &.plyr iframe { - pointer-events: none; - } - } - - // Captions - - // Hide default captions - video::-webkit-media-text-track-container { - display: none; - } - &__captions { - display: none; - position: absolute; - bottom: 0; - left: 0; - width: 100%; - padding: (@plyr-control-spacing * 2) (@plyr-control-spacing * 2) (@plyr-control-spacing * 8); - color: #fff; - font-size: @plyr-font-size-captions-base; - text-align: center; - font-weight: 400; - - span { - border-radius: 2px; - padding: floor(@plyr-control-spacing / 3) @plyr-control-spacing; - background: fade(#000, 85%); - } - span:empty { - display: none; - } - - @media (min-width: @plyr-bp-captions-large) { - font-size: @plyr-font-size-captions-medium; - } - } - &--captions-active &__captions { - display: block; - } - &--fullscreen-active &__captions { - font-size: @plyr-font-size-captions-large; - } - - // Common + // Range inputs // Specificity is for bootstrap compatibility input[type='range'] { display: block; @@ -307,412 +222,490 @@ } } } +} - // Large play button - &__play-large { +// Screen reader only elements +.plyr__sr-only { + position: absolute !important; + clip: rect(1px, 1px, 1px, 1px); + padding: 0 !important; + border: 0 !important; + height: 1px !important; + width: 1px !important; + overflow: hidden; +} + +// Video +.plyr__video-wrapper { + position: relative; + background: #000; + border-radius: inherit; +} + +// Container for embeds +.plyr__video-embed { + padding-bottom: 56.25%; /* 16:9 */ + height: 0; + overflow: hidden; + border-radius: inherit; + + iframe { position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - padding: @plyr-control-spacing; - background: @plyr-control-bg-hover; - border: 4px solid @plyr-control-color; - border-radius: 100%; + top: 0; + left: 0; + width: 100%; + height: 100%; + border: 0; + user-select: none; + } + + // Vimeo hack + > div { + position: relative; + padding-bottom: 200%; + transform: translateY(-35.95%); + } +} +// To allow mouse events to be captured if full support +.plyr.plyr__video-embed iframe { + pointer-events: none; +} + +// Captions +// -------------------------------------------------------------- +// Hide default captions +.plyr video::-webkit-media-text-track-container { + display: none; +} +.plyr__captions { + display: none; + position: absolute; + bottom: 0; + left: 0; + width: 100%; + padding: (@plyr-control-spacing * 2) (@plyr-control-spacing * 2) (@plyr-control-spacing * 8); + color: #fff; + font-size: @plyr-font-size-captions-base; + text-align: center; + font-weight: 400; + + span { + border-radius: 2px; + padding: floor(@plyr-control-spacing / 3) @plyr-control-spacing; + background: fade(#000, 85%); + } + span:empty { + display: none; + } + + @media (min-width: @plyr-bp-captions-large) { + font-size: @plyr-font-size-captions-medium; + } +} +.plyr--captions-active &__captions { + display: block; +} +.plyr--fullscreen-active &__captions { + font-size: @plyr-font-size-captions-large; +} + +// Controls +// -------------------------------------------------------------- +// Shared +.plyr__controls, +.plyr__play-large { + transition: visibility .3s ease, opacity .3s ease; +} + +// Playback controls +.plyr__controls { + position: absolute; + left: 0; + right: 0; + bottom: 0; + display: flex; + align-items: center; + padding: (@plyr-control-spacing * 5) @plyr-control-spacing @plyr-control-spacing; + + background: linear-gradient(fade(@plyr-controls-bg, 0%), fade(@plyr-controls-bg, 50%)); + border-bottom-left-radius: inherit; + border-bottom-right-radius: inherit; + + line-height: 1; + text-align: center; + + // Spacing + > button, + .plyr__progress, + .plyr__time, + .plyr__volume[type="range"] { + margin-left: @plyr-control-spacing; + + &::first-child { + margin-left: 0; + } + } + [data-plyr="mute"] { + margin-left: 0; + } + + // Buttons + button { + position: relative; + display: inline-block; + flex-shrink: 0; + vertical-align: middle; + padding: (@plyr-control-spacing / 2) @plyr-control-spacing; + border: 0; + background: transparent; + border-radius: 3px; + cursor: pointer; color: @plyr-control-color; + transition: background .3s ease, color .3s ease, opacity .3s ease; svg { - position: relative; - left: 2px; - width: 20px; - height: 20px; + width: 18px; + height: 18px; display: block; fill: currentColor; } + // Hover and tab focus + &.tab-focus:focus, + &:hover { + background: @plyr-control-bg-hover; + color: @plyr-control-color-hover; + } + // Default focus &:focus { - outline: 1px dotted fade(@plyr-control-color, 50%); + outline: 0; } } - // Shared - &__controls, - &__play-large { - transition: visibility .3s ease, opacity .3s ease; + // Hide toggle icons by default + .icon--exit-fullscreen, + .icon--muted, + .icon--captions-on { + display: none; } - &--playing &__play-large { - visibility: hidden; - opacity: 0; +} + +// Large play button +.plyr__play-large { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + padding: @plyr-control-spacing; + background: @plyr-control-bg-hover; + border: 4px solid @plyr-control-color; + border-radius: 100%; + color: @plyr-control-color; + + svg { + position: relative; + left: 2px; + width: 20px; + height: 20px; + display: block; + fill: currentColor; } - // Playback controls - &__controls { - position: absolute; - left: 0; - right: 0; - bottom: 0; - display: flex; - align-items: center; - padding: (@plyr-control-spacing * 5) @plyr-control-spacing @plyr-control-spacing; - - background: linear-gradient(fade(@plyr-controls-bg, 0%), fade(@plyr-controls-bg, 25%)); - border-bottom-left-radius: inherit; - border-bottom-right-radius: inherit; - - line-height: 1; - text-align: center; - - // Spacing - > button, - .plyr__progress, - .plyr__time, - .plyr__volume[type="range"] { - margin-left: @plyr-control-spacing; - - &::first-child { - margin-left: 0; - } - } - [data-plyr="mute"] { - margin-left: 0; - } + &:focus { + outline: 1px dotted fade(@plyr-control-color, 50%); + } +} - // Buttons - button { - position: relative; - display: inline-block; - flex-shrink: 0; - vertical-align: middle; - padding: (@plyr-control-spacing / 2) @plyr-control-spacing; - border: 0; - background: transparent; - border-radius: 3px; - cursor: pointer; - color: @plyr-control-color; - transition: background .3s ease, color .3s ease, opacity .3s ease; - - svg { - width: 18px; - height: 18px; - display: block; - fill: currentColor; - } +// States +.plyr__controls [data-plyr='pause'], +.plyr--playing .plyr__controls [data-plyr='play'] { + display: none; +} +.plyr--playing .plyr__controls [data-plyr='pause'] { + display: inline-block; +} - // Hover and tab focus - &.tab-focus:focus, - &:hover { - background: @plyr-control-bg-hover; - color: @plyr-control-color-hover; - } - // Default focus - &:focus { - outline: 0; - } - } +// Hide controls +&.plyr--hide-controls .plyr__controls, +.plyr--playing .plyr__play-large { + visibility: hidden; + opacity: 0; +} - // Hide toggle icons by default - .icon--exit-fullscreen, - .icon--muted, - .icon--captions-on { - display: none; - } +// Change icons on state change +.plyr--fullscreen-active .icon--exit-fullscreen, +.plyr--muted .plyr__controls .icon--muted, +.plyr--captions-active .plyr__controls .icon--captions-on { + display: block; + + & + svg { + display: none; } +} - // Tooltips - &__tooltip { - visibility: hidden; +// Some options are hidden by default +[data-plyr='captions'], +[data-plyr='fullscreen'] { + display: none; +} +.plyr--captions-enabled [data-plyr='captions'], +.plyr--fullscreen-enabled [data-plyr='fullscreen'] { + display: inline-block; +} + +// Tooltips +// -------------------------------------------------------------- +.plyr__tooltip { + visibility: hidden; + position: absolute; + z-index: 2; + bottom: 100%; + margin-bottom: (@plyr-tooltip-padding * 2); + padding: @plyr-tooltip-padding (@plyr-tooltip-padding * 1.5); + pointer-events: none; + + opacity: 0; + background: @plyr-tooltip-bg; + box-shadow: @plyr-tooltip-shadow; + border-radius: @plyr-tooltip-radius; + + color: @plyr-tooltip-color; + font-size: @plyr-font-size-small; + line-height: 1.3; + + transform: translate(-50%, 10px) scale(.8); + transform-origin: 50% 100%; + transition: transform .2s .1s ease, opacity .2s .1s ease, visibility .3s ease; + + // Arrows + &::before { + content: ''; position: absolute; + width: 0; + height: 0; + left: 50%; + transform: translateX(-50%); + } + // The background triangle + &::before { + bottom: -@plyr-tooltip-arrow-size; + border-right: @plyr-tooltip-arrow-size solid transparent; + border-top: @plyr-tooltip-arrow-size solid @plyr-tooltip-bg; + border-left: @plyr-tooltip-arrow-size solid transparent; z-index: 2; - bottom: 100%; - margin-bottom: (@plyr-tooltip-padding * 2); - padding: @plyr-tooltip-padding (@plyr-tooltip-padding * 1.5); - pointer-events: none; - - opacity: 0; - background: @plyr-tooltip-bg; - box-shadow: @plyr-tooltip-shadow; - border-radius: @plyr-tooltip-radius; - - color: @plyr-tooltip-color; - font-size: @plyr-font-size-small; - line-height: 1.3; - - transform: translate(-50%, 10px) scale(.8); - transform-origin: 50% 100%; - transition: transform .2s .1s ease, opacity .2s .1s ease, visibility .3s ease; - - // Arrows - &::after, - &::before { - content: ''; - position: absolute; - width: 0; - height: 0; - top: 100%; - left: 50%; - transform: translateX(-50%); - } - // The border triangle - &::after { - @plyr-border-arrow-size: (@plyr-tooltip-arrow-size + (@plyr-tooltip-border-width * 1)); - bottom: -(@plyr-border-arrow-size + @plyr-tooltip-border-width); - border-right: @plyr-border-arrow-size solid transparent; - border-top: @plyr-border-arrow-size solid @plyr-tooltip-arrow-border-color; - border-left: @plyr-border-arrow-size solid transparent; - z-index: 1; - } - // The background triangle - &::before { - bottom: -@plyr-tooltip-arrow-size; - border-right: @plyr-tooltip-arrow-size solid transparent; - border-top: @plyr-tooltip-arrow-size solid @plyr-tooltip-bg; - border-left: @plyr-tooltip-arrow-size solid transparent; - z-index: 2; - } } - button:hover .plyr__tooltip, - button.tab-focus:focus .plyr__tooltip, - &__tooltip--visible { - visibility: visible; - opacity: 1; - transform: translate(-50%, 0) scale(1); - } - button:hover .plyr__tooltip { - z-index: 3; - } - - // Playback progress - // <progress> element - &__progress { - position: relative; - flex: 1; +} +.plyr button:hover .plyr__tooltip, +.plyr button.tab-focus:focus .plyr__tooltip, +.plyr__tooltip--visible { + visibility: visible; + opacity: 1; + transform: translate(-50%, 0) scale(1); +} +.plyr button:hover .plyr__tooltip { + z-index: 3; +} - input[type="range"] { - position: relative; - z-index: 2; +// Playback progress +// -------------------------------------------------------------- +// <progress> element +.plyr__progress { + position: relative; + flex: 1; - &::-webkit-slider-runnable-track { - background: transparent; - } - &::-moz-range-track { - background: transparent; - } - &::-ms-fill-lower, - &::-ms-fill-upper { - background: transparent; - } - } + input[type="range"] { + position: relative; + z-index: 2; - &--buffer[value], - &--played[value] { - position: absolute; - left: 0; - top: 50%; - width: 100%; - height: @range-track-height; - margin: -(@range-track-height / 2) 0 0; - padding: 0; - vertical-align: top; - appearance: none; - border: none; - border-radius: 100px; - - &::-webkit-progress-bar { - background: transparent; - } - &::-webkit-progress-value { - background: currentColor; - border-radius: 100px; - min-width: @range-track-height; - } - &::-moz-progress-bar { - background: currentColor; - border-radius: 100px; - min-width: @range-track-height; - } - &::-ms-fill { - border-radius: 100px; - } + &::-webkit-slider-runnable-track { + background: transparent; } - &--played[value] { - z-index: 1; - color: @plyr-progress-playing-bg; + &::-moz-range-track { background: transparent; - - &::-webkit-progress-value { - background: currentColor; - min-width: @range-track-height; - border-top-right-radius: 0; - border-bottom-right-radius: 0; - } - &::-moz-progress-bar { - background: currentColor; - min-width: @range-track-height; - border-top-right-radius: 0; - border-bottom-right-radius: 0; - } - &::-ms-fill { - min-width: @range-track-height; - border-top-right-radius: 0; - border-bottom-right-radius: 0; - } } - &--buffer[value] { - color: @plyr-progress-buffered-bg; - background: @range-track-bg; - - &::-webkit-progress-value { - transition: width .2s ease; - } - &::-moz-progress-bar { - transition: width .2s ease; - } - &::-ms-fill { - transition: width .2s ease; - } + &::-ms-fill-lower, + &::-ms-fill-upper { + background: transparent; } + } - // Seek tooltip to show time - .plyr__tooltip { - left: 0; - } + // Seek tooltip to show time + .plyr__tooltip { + left: 0; } +} - // Loading state - &--loading .plyr__progress--buffer { - animation: plyr-progress 1s linear infinite; - background-size: @plyr-progress-loading-size @plyr-progress-loading-size; - background-repeat: repeat-x; - background-color: @plyr-progress-buffered-bg; - background-image: linear-gradient( - -45deg, - @plyr-progress-loading-bg 25%, - transparent 25%, - transparent 50%, - @plyr-progress-loading-bg 50%, - @plyr-progress-loading-bg 75%, - transparent 75%, - transparent); - color: transparent; - } - - // States - &__controls [data-plyr='pause'], - &--playing .plyr__controls [data-plyr='play'] { - display: none; +.plyr__progress--buffer[value], +.plyr__progress--played[value] { + position: absolute; + left: 0; + top: 50%; + width: 100%; + height: @range-track-height; + margin: -(@range-track-height / 2) 0 0; + padding: 0; + vertical-align: top; + appearance: none; + border: none; + border-radius: 100px; + + &::-webkit-progress-bar { + background: transparent; } - &--playing .plyr__controls [data-plyr='pause'] { - display: inline-block; + &::-webkit-progress-value { + background: currentColor; + border-radius: 100px; + min-width: @range-track-height; + } + &::-moz-progress-bar { + background: currentColor; + border-radius: 100px; + min-width: @range-track-height; + } + &::-ms-fill { + border-radius: 100px; } +} +.plyr__progress--played[value] { + z-index: 1; + color: @plyr-progress-playing-bg; + background: transparent; + + &::-webkit-progress-value { + background: currentColor; + min-width: @range-track-height; + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } + &::-moz-progress-bar { + background: currentColor; + min-width: @range-track-height; + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } + &::-ms-fill { + min-width: @range-track-height; + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } +} +.plyr__progress--buffer[value] { + color: @plyr-progress-buffered-bg; + background: @range-track-bg; - // plyr time - &__time { - display: inline-block; - vertical-align: middle; - color: @plyr-control-color; - font-size: @plyr-font-size-small; - line-height: .95; + &::-webkit-progress-value { + transition: width .2s ease; } + &::-moz-progress-bar { + transition: width .2s ease; + } + &::-ms-fill { + transition: width .2s ease; + } +} - // Media duration hidden on small screens - &__time + &__time { - display: none; +// Loading state +.plyr--loading .plyr__progress--buffer { + animation: plyr-progress 1s linear infinite; + background-size: @plyr-progress-loading-size @plyr-progress-loading-size; + background-repeat: repeat-x; + background-color: @plyr-progress-buffered-bg; + background-image: linear-gradient( + -45deg, + @plyr-progress-loading-bg 25%, + transparent 25%, + transparent 50%, + @plyr-progress-loading-bg 50%, + @plyr-progress-loading-bg 75%, + transparent 75%, + transparent); + color: transparent; +} - @media (min-width: @plyr-bp-control-split) { - display: inline-block; - } - // Add a slash in before - &::before { - content: '\2044'; - margin-right: @plyr-control-spacing; - } - } +// Time +// -------------------------------------------------------------- +.plyr__time { + display: inline-block; + vertical-align: middle; + color: @plyr-control-color; + font-size: @plyr-font-size-small; + line-height: .95; +} - // Volume control - // <input[type='range']> element - // Specificity is for bootstrap compatibility - &__volume[type='range'] { - max-width: 100px; - } +// Media duration hidden on small screens +.plyr__time + .plyr__time { + display: none; - // Hide sound controls on iOS - // It's not supported to change volume using JavaScript: - // https://developer.apple.com/library/safari/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html - &--is-ios &__volume, - &--is-ios [data-plyr='mute'], - &--is-ios.plyr--audio &__controls--right { - display: none; - } - // Center buttons so it looks less odd - &--is-ios.plyr--audio &__controls--left { - float: none; + @media (min-width: @plyr-bp-control-split) { + display: inline-block; } - // Audio specific styles - // Position the progress within the container - &--audio .plyr__controls { - padding-top: (@plyr-control-spacing * 2); - } - &--audio .plyr__progress { - bottom: auto; - top: 0; - background: #fff; + // Add a slash in before + &::before { + content: '\2044'; + margin-right: @plyr-control-spacing; } +} - // Full screen mode - &.plyr--fullscreen, - &--fullscreen-active { - position: fixed; - top: 0; - left: 0; - right: 0; - bottom: 0; - height: 100%; - width: 100%; - z-index: 10000000; - background: #000; - - video { - height: 100%; - } - .plyr__video-wrapper { - height: 100%; - width: 100%; - } - .plyr__controls { - position: absolute; - bottom: 0; - left: 0; - right: 0; - } - } +// Volume +// -------------------------------------------------------------- +// <input[type='range']> element +// Specificity is for bootstrap compatibility +.plyr__volume[type='range'] { + max-width: 100px; +} - // Hide controls when playing in full screen - &.plyr--hide-controls { - .plyr__controls { - opacity: 0; - visibility: hidden; - } - } +// Hide sound controls on iOS +// It's not supported to change volume using JavaScript: +// https://developer.apple.com/library/safari/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html +.plyr--is-ios .plyr__volume, +.plyr--is-ios [data-plyr='mute'], +.plyr--is-ios.plyr--audio .plyr__controls--right { + display: none; +} +// Center buttons so it looks less odd +.plyr--is-ios.plyr--audio .plyr__controls--left { + float: none; +} - // Change icons on state change - &--fullscreen-active .icon--exit-fullscreen, - &--muted .plyr__controls .icon--muted, - &--captions-active .plyr__controls .icon--captions-on { - display: block; +// Audio +// -------------------------------------------------------------- +// Position the progress within the container +.plyr--audio .plyr__controls { + padding-top: (@plyr-control-spacing * 2); +} +.plyr--audio .plyr__progress { + bottom: auto; + top: 0; + background: #fff; +} - & + svg { - display: none; - } +// Fullscreen +// -------------------------------------------------------------- +.plyr--fullscreen, +.plyr--fullscreen-active { + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + height: 100%; + width: 100%; + z-index: 10000000; + background: #000; + + video { + height: 100%; } - - // Some options are hidden by default - [data-plyr='captions'], - [data-plyr='fullscreen'] { - display: none; + .plyr__video-wrapper { + height: 100%; + width: 100%; } - &--captions-enabled [data-plyr='captions'], - &--fullscreen-enabled [data-plyr='fullscreen'] { - display: inline-block; + .plyr__controls { + position: absolute; + bottom: 0; + left: 0; + right: 0; } } |