initial
This commit is contained in:
zbatte committed
commit
9883323161
17470 files changed
+4470592
No files matched your search
File diff suppressed because it is too large.
Load diff
@@ -0,0 +1,12 @@
|
||||
/*!
|
||||
* MediaElement.js
|
||||
* http://www.mediaelementjs.com/
|
||||
*
|
||||
* Wrapper that mimics native HTML5 MediaElement (audio and video)
|
||||
* using a variety of technologies (pure JavaScript, Flash, iframe)
|
||||
*
|
||||
* Copyright 2010-2017, John Dyer (http://j.hn/)
|
||||
* License: MIT
|
||||
*
|
||||
*/
|
||||
!function r(a,s,l){function d(n,e){if(!s[n]){if(!a[n]){var t="function"==typeof require&&require;if(!e&&t)return t(n,!0);if(u)return u(n,!0);var o=new Error("Cannot find module '"+n+"'");throw o.code="MODULE_NOT_FOUND",o}var i=s[n]={exports:{}};a[n][0].call(i.exports,function(e){var t=a[n][1][e];return d(t||e)},i,i.exports,r,a,s,l)}return s[n].exports}for(var u="function"==typeof require&&require,e=0;e<l.length;e++)d(l[e]);return d}({1:[function(e,t,n){},{}],2:[function(i,r,e){(function(e){var t,n=void 0!==e?e:"undefined"!=typeof window?window:{},o=i(1);"undefined"!=typeof document?t=document:(t=n["__GLOBAL_DOCUMENT_CACHE@4"])||(t=n["__GLOBAL_DOCUMENT_CACHE@4"]=o),r.exports=t}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{1:1}],3:[function(e,n,t){(function(e){var t;t="undefined"!=typeof window?window:void 0!==e?e:"undefined"!=typeof self?self:{},n.exports=t}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{}],4:[function(e,n,t){!function(e){var t=setTimeout;function o(){}function r(e){if("object"!=typeof this)throw new TypeError("Promises must be constructed via new");if("function"!=typeof e)throw new TypeError("not a function");this._state=0,this._handled=!1,this._value=void 0,this._deferreds=[],d(e,this)}function i(n,o){for(;3===n._state;)n=n._value;0!==n._state?(n._handled=!0,r._immediateFn(function(){var e=1===n._state?o.onFulfilled:o.onRejected;if(null!==e){var t;try{t=e(n._value)}catch(e){return void s(o.promise,e)}a(o.promise,t)}else(1===n._state?a:s)(o.promise,n._value)})):n._deferreds.push(o)}function a(t,e){try{if(e===t)throw new TypeError("A promise cannot be resolved with itself.");if(e&&("object"==typeof e||"function"==typeof e)){var n=e.then;if(e instanceof r)return t._state=3,t._value=e,void l(t);if("function"==typeof n)return void d((o=n,i=e,function(){o.apply(i,arguments)}),t)}t._state=1,t._value=e,l(t)}catch(e){s(t,e)}var o,i}function s(e,t){e._state=2,e._value=t,l(e)}function l(e){2===e._state&&0===e._deferreds.length&&r._immediateFn(function(){e._handled||r._unhandledRejectionFn(e._value)});for(var t=0,n=e._deferreds.length;t<n;t++)i(e,e._deferreds[t]);e._deferreds=null}function d(e,t){var n=!1;try{e(function(e){n||(n=!0,a(t,e))},function(e){n||(n=!0,s(t,e))})}catch(e){if(n)return;n=!0,s(t,e)}}r.prototype.catch=function(e){return this.then(null,e)},r.prototype.then=function(e,t){var n=new this.constructor(o);return i(this,new function(e,t,n){this.onFulfilled="function"==typeof e?e:null,this.onRejected="function"==typeof t?t:null,this.promise=n}(e,t,n)),n},r.all=function(e){var s=Array.prototype.slice.call(e);return new r(function(o,i){if(0===s.length)return o([]);var r=s.length;function a(t,e){try{if(e&&("object"==typeof e||"function"==typeof e)){var n=e.then;if("function"==typeof n)return void n.call(e,function(e){a(t,e)},i)}s[t]=e,0==--r&&o(s)}catch(e){i(e)}}for(var e=0;e<s.length;e++)a(e,s[e])})},r.resolve=function(t){return t&&"object"==typeof t&&t.constructor===r?t:new r(function(e){e(t)})},r.reject=function(n){return new r(function(e,t){t(n)})},r.race=function(i){return new r(function(e,t){for(var n=0,o=i.length;n<o;n++)i[n].then(e,t)})},r._immediateFn="function"==typeof setImmediate&&function(e){setImmediate(e)}||function(e){t(e,0)},r._unhandledRejectionFn=function(e){"undefined"!=typeof console&&console&&console.warn("Possible Unhandled Promise Rejection:",e)},r._setImmediateFn=function(e){r._immediateFn=e},r._setUnhandledRejectionFn=function(e){r._unhandledRejectionFn=e},void 0!==n&&n.exports?n.exports=r:e.Promise||(e.Promise=r)}(this)},{}],5:[function(e,t,n){"use strict";Object.defineProperty(n,"__esModule",{value:!0});var o,a="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},i=e(7),r=(o=i)&&o.__esModule?o:{default:o},s=e(15),l=e(27);var d={lang:"en",en:s.EN,language:function(){for(var e=arguments.length,t=Array(e),n=0;n<e;n++)t[n]=arguments[n];if(null!=t&&t.length){if("string"!=typeof t[0])throw new TypeError("Language code must be a string value");if(!/^[a-z]{2,3}((\-|_)[a-z]{2})?$/i.test(t[0]))throw new TypeError("Language code must have format 2-3 letters and. optionally, hyphen, underscore followed by 2 more letters");d.lang=t[0],void 0===d[t[0]]?(t[1]=null!==t[1]&&void 0!==t[1]&&"object"===a(t[1])?t[1]:{},d[t[0]]=(0,l.isObjectEmpty)(t[1])?s.EN:t[1]):null!==t[1]&&void 0!==t[1]&&"object"===a(t[1])&&(d[t[0]]=t[1])}return d.lang},t:function(e){var t=1<arguments.length&&void 0!==arguments[1]?arguments[1]:null;if("string"==typeof e&&e.length){var n=void 0,o=void 0,i=d.language(),r=function(e,t,n){return"object"!==(void 0===e?"undefined":a(e))||"number"!=typeof t||"number"!=typeof n?e:[function(){return arguments.length<=1?void 0:arguments[1]},function(){return 1===(arguments.length<=0?void 0:argLine truncated
|
||||
@@ -0,0 +1,84 @@
|
||||
/* global console, MediaElementPlayer, mejs */
|
||||
(function ( window, $ ) {
|
||||
// Reintegrate `plugins` since they don't exist in MEJS anymore; it won't affect anything in the player
|
||||
if (mejs.plugins === undefined) {
|
||||
mejs.plugins = {};
|
||||
mejs.plugins.silverlight = [];
|
||||
mejs.plugins.silverlight.push({
|
||||
types: []
|
||||
});
|
||||
}
|
||||
|
||||
// Inclusion of old `HtmlMediaElementShim` if it doesn't exist
|
||||
mejs.HtmlMediaElementShim = mejs.HtmlMediaElementShim || {
|
||||
getTypeFromFile: mejs.Utils.getTypeFromFile
|
||||
};
|
||||
|
||||
// Add missing global variables for backward compatibility
|
||||
if (mejs.MediaFeatures === undefined) {
|
||||
mejs.MediaFeatures = mejs.Features;
|
||||
}
|
||||
if (mejs.Utility === undefined) {
|
||||
mejs.Utility = mejs.Utils;
|
||||
}
|
||||
|
||||
/**
|
||||
* Create missing variables and have default `classPrefix` overridden to avoid issues.
|
||||
*
|
||||
* `media` is now a fake wrapper needed to simplify manipulation of various media types,
|
||||
* so in order to access the `video` or `audio` tag, use `media.originalNode` or `player.node`;
|
||||
* `player.container` used to be jQuery but now is a HTML element, and many elements inside
|
||||
* the player rely on it being a HTML now, so its conversion is difficult; however, a
|
||||
* `player.$container` new variable has been added to be used as jQuery object
|
||||
*/
|
||||
var init = MediaElementPlayer.prototype.init;
|
||||
MediaElementPlayer.prototype.init = function () {
|
||||
this.options.classPrefix = 'mejs-';
|
||||
this.$media = this.$node = $( this.node );
|
||||
init.call( this );
|
||||
};
|
||||
|
||||
var ready = MediaElementPlayer.prototype._meReady;
|
||||
MediaElementPlayer.prototype._meReady = function () {
|
||||
this.container = $( this.container) ;
|
||||
this.controls = $( this.controls );
|
||||
this.layers = $( this.layers );
|
||||
ready.apply( this, arguments );
|
||||
};
|
||||
|
||||
// Override method so certain elements can be called with jQuery
|
||||
MediaElementPlayer.prototype.getElement = function ( el ) {
|
||||
return $ !== undefined && el instanceof $ ? el[0] : el;
|
||||
};
|
||||
|
||||
// Add jQuery ONLY to most of custom features' arguments for backward compatibility; default features rely 100%
|
||||
// on the arguments being HTML elements to work properly
|
||||
MediaElementPlayer.prototype.buildfeatures = function ( player, controls, layers, media ) {
|
||||
var defaultFeatures = [
|
||||
'playpause',
|
||||
'current',
|
||||
'progress',
|
||||
'duration',
|
||||
'tracks',
|
||||
'volume',
|
||||
'fullscreen'
|
||||
];
|
||||
for (var i = 0, total = this.options.features.length; i < total; i++) {
|
||||
var feature = this.options.features[i];
|
||||
if (this['build' + feature]) {
|
||||
try {
|
||||
// Use jQuery for non-default features
|
||||
if (defaultFeatures.indexOf(feature) === -1) {
|
||||
this['build' + feature]( player, $(controls), $(layers), media );
|
||||
} else {
|
||||
this['build' + feature]( player, controls, layers, media );
|
||||
}
|
||||
|
||||
} catch (e) {
|
||||
console.error( 'error building ' + feature, e );
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
})( window, jQuery );
|
||||
@@ -0,0 +1 @@
|
||||
!function(a){void 0===mejs.plugins&&(mejs.plugins={},mejs.plugins.silverlight=[],mejs.plugins.silverlight.push({types:[]})),mejs.HtmlMediaElementShim=mejs.HtmlMediaElementShim||{getTypeFromFile:mejs.Utils.getTypeFromFile},void 0===mejs.MediaFeatures&&(mejs.MediaFeatures=mejs.Features),void 0===mejs.Utility&&(mejs.Utility=mejs.Utils);var e=MediaElementPlayer.prototype.init,t=(MediaElementPlayer.prototype.init=function(){this.options.classPrefix="mejs-",this.$media=this.$node=a(this.node),e.call(this)},MediaElementPlayer.prototype._meReady);MediaElementPlayer.prototype._meReady=function(){this.container=a(this.container),this.controls=a(this.controls),this.layers=a(this.layers),t.apply(this,arguments)},MediaElementPlayer.prototype.getElement=function(e){return void 0!==a&&e instanceof a?e[0]:e},MediaElementPlayer.prototype.buildfeatures=function(e,t,i,s){for(var l=["playpause","current","progress","duration","tracks","volume","fullscreen"],r=0,n=this.options.features.length;r<n;r++){var o=this.options.features[r];if(this["build"+o])try{-1===l.indexOf(o)?this["build"+o](e,a(t),a(i),s):this["build"+o](e,t,i,s)}catch(e){console.error("error building "+o,e)}}}}((window,jQuery));
|
||||
File diff suppressed because it is too large.
Load diff
+12
@@ -0,0 +1,12 @@
|
||||
/*!
|
||||
* MediaElement.js
|
||||
* http://www.mediaelementjs.com/
|
||||
*
|
||||
* Wrapper that mimics native HTML5 MediaElement (audio and video)
|
||||
* using a variety of technologies (pure JavaScript, Flash, iframe)
|
||||
*
|
||||
* Copyright 2010-2017, John Dyer (http://j.hn/)
|
||||
* License: MIT
|
||||
*
|
||||
*/
|
||||
!function i(o,l,s){function d(n,e){if(!l[n]){if(!o[n]){var t="function"==typeof require&&require;if(!e&&t)return t(n,!0);if(u)return u(n,!0);var r=new Error("Cannot find module '"+n+"'");throw r.code="MODULE_NOT_FOUND",r}var a=l[n]={exports:{}};o[n][0].call(a.exports,function(e){var t=o[n][1][e];return d(t||e)},a,a.exports,i,o,l,s)}return l[n].exports}for(var u="function"==typeof require&&require,e=0;e<s.length;e++)d(s[e]);return d}({1:[function(e,t,n){},{}],2:[function(a,i,e){(function(e){var t,n=void 0!==e?e:"undefined"!=typeof window?window:{},r=a(1);"undefined"!=typeof document?t=document:(t=n["__GLOBAL_DOCUMENT_CACHE@4"])||(t=n["__GLOBAL_DOCUMENT_CACHE@4"]=r),i.exports=t}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{1:1}],3:[function(e,n,t){(function(e){var t;t="undefined"!=typeof window?window:void 0!==e?e:"undefined"!=typeof self?self:{},n.exports=t}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{}],4:[function(e,n,t){!function(e){var t=setTimeout;function r(){}function i(e){if("object"!=typeof this)throw new TypeError("Promises must be constructed via new");if("function"!=typeof e)throw new TypeError("not a function");this._state=0,this._handled=!1,this._value=void 0,this._deferreds=[],d(e,this)}function a(n,r){for(;3===n._state;)n=n._value;0!==n._state?(n._handled=!0,i._immediateFn(function(){var e=1===n._state?r.onFulfilled:r.onRejected;if(null!==e){var t;try{t=e(n._value)}catch(e){return void l(r.promise,e)}o(r.promise,t)}else(1===n._state?o:l)(r.promise,n._value)})):n._deferreds.push(r)}function o(t,e){try{if(e===t)throw new TypeError("A promise cannot be resolved with itself.");if(e&&("object"==typeof e||"function"==typeof e)){var n=e.then;if(e instanceof i)return t._state=3,t._value=e,void s(t);if("function"==typeof n)return void d((r=n,a=e,function(){r.apply(a,arguments)}),t)}t._state=1,t._value=e,s(t)}catch(e){l(t,e)}var r,a}function l(e,t){e._state=2,e._value=t,s(e)}function s(e){2===e._state&&0===e._deferreds.length&&i._immediateFn(function(){e._handled||i._unhandledRejectionFn(e._value)});for(var t=0,n=e._deferreds.length;t<n;t++)a(e,e._deferreds[t]);e._deferreds=null}function d(e,t){var n=!1;try{e(function(e){n||(n=!0,o(t,e))},function(e){n||(n=!0,l(t,e))})}catch(e){if(n)return;n=!0,l(t,e)}}i.prototype.catch=function(e){return this.then(null,e)},i.prototype.then=function(e,t){var n=new this.constructor(r);return a(this,new function(e,t,n){this.onFulfilled="function"==typeof e?e:null,this.onRejected="function"==typeof t?t:null,this.promise=n}(e,t,n)),n},i.all=function(e){var l=Array.prototype.slice.call(e);return new i(function(r,a){if(0===l.length)return r([]);var i=l.length;function o(t,e){try{if(e&&("object"==typeof e||"function"==typeof e)){var n=e.then;if("function"==typeof n)return void n.call(e,function(e){o(t,e)},a)}l[t]=e,0==--i&&r(l)}catch(e){a(e)}}for(var e=0;e<l.length;e++)o(e,l[e])})},i.resolve=function(t){return t&&"object"==typeof t&&t.constructor===i?t:new i(function(e){e(t)})},i.reject=function(n){return new i(function(e,t){t(n)})},i.race=function(a){return new i(function(e,t){for(var n=0,r=a.length;n<r;n++)a[n].then(e,t)})},i._immediateFn="function"==typeof setImmediate&&function(e){setImmediate(e)}||function(e){t(e,0)},i._unhandledRejectionFn=function(e){"undefined"!=typeof console&&console&&console.warn("Possible Unhandled Promise Rejection:",e)},i._setImmediateFn=function(e){i._immediateFn=e},i._setUnhandledRejectionFn=function(e){i._unhandledRejectionFn=e},void 0!==n&&n.exports?n.exports=i:e.Promise||(e.Promise=i)}(this)},{}],5:[function(e,t,n){"use strict";Object.defineProperty(n,"__esModule",{value:!0});var r,o="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},a=e(7),i=(r=a)&&r.__esModule?r:{default:r},l=e(9),s=e(18);var d={lang:"en",en:l.EN,language:function(){for(var e=arguments.length,t=Array(e),n=0;n<e;n++)t[n]=arguments[n];if(null!=t&&t.length){if("string"!=typeof t[0])throw new TypeError("Language code must be a string value");if(!/^[a-z]{2,3}((\-|_)[a-z]{2})?$/i.test(t[0]))throw new TypeError("Language code must have format 2-3 letters and. optionally, hyphen, underscore followed by 2 more letters");d.lang=t[0],void 0===d[t[0]]?(t[1]=null!==t[1]&&void 0!==t[1]&&"object"===o(t[1])?t[1]:{},d[t[0]]=(0,s.isObjectEmpty)(t[1])?l.EN:t[1]):null!==t[1]&&void 0!==t[1]&&"object"===o(t[1])&&(d[t[0]]=t[1])}return d.lang},t:function(e){var t=1<arguments.length&&void 0!==arguments[1]?arguments[1]:null;if("string"==typeof e&&e.length){var n=void 0,r=void 0,a=d.language(),i=function(e,t,n){return"object"!==(void 0===e?"undefined":o(e))||"number"!=typeof t||"number"!=typeof n?e:[function(){return arguments.length<=1?void 0:arguments[1]},function(){return 1===(arguments.length<=0?void 0:arguLine truncated
|
||||
@@ -0,0 +1,774 @@
|
||||
/* Accessibility: hide screen reader texts (and prefer "top" for RTL languages).
|
||||
Reference: http://blog.rrwd.nl/2015/04/04/the-screen-reader-text-class-why-and-how/ */
|
||||
.mejs-offscreen {
|
||||
border: 0;
|
||||
clip: rect( 1px, 1px, 1px, 1px );
|
||||
-webkit-clip-path: inset( 50% );
|
||||
clip-path: inset( 50% );
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
word-wrap: normal;
|
||||
}
|
||||
|
||||
.mejs-container {
|
||||
background: #000;
|
||||
box-sizing: border-box;
|
||||
font-family: 'Helvetica', Arial, serif;
|
||||
position: relative;
|
||||
text-align: left;
|
||||
text-indent: 0;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.mejs-container * {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* Hide native play button and control bar from iOS to favor plugin button */
|
||||
.mejs-container video::-webkit-media-controls,
|
||||
.mejs-container video::-webkit-media-controls-panel,
|
||||
.mejs-container video::-webkit-media-controls-panel-container,
|
||||
.mejs-container video::-webkit-media-controls-start-playback-button {
|
||||
-webkit-appearance: none;
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.mejs-fill-container,
|
||||
.mejs-fill-container .mejs-container {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs-fill-container {
|
||||
background: transparent;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mejs-container:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.mejs-iframe-overlay {
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs-embed,
|
||||
.mejs-embed body {
|
||||
background: #000;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs-fullscreen {
|
||||
overflow: hidden !important;
|
||||
}
|
||||
|
||||
.mejs-container-fullscreen {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
overflow: hidden;
|
||||
position: fixed;
|
||||
right: 0;
|
||||
top: 0;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.mejs-container-fullscreen .mejs-mediaelement,
|
||||
.mejs-container-fullscreen video {
|
||||
height: 100% !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
/* Start: LAYERS */
|
||||
.mejs-background {
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.mejs-mediaelement {
|
||||
height: 100%;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.mejs-poster {
|
||||
background-position: 50% 50%;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
:root .mejs-poster-img {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.mejs-poster-img {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.mejs-overlay {
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.mejs-layer {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.mejs-overlay-play {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mejs-overlay-button {
|
||||
background: url('mejs-controls.svg') no-repeat;
|
||||
background-position: 0 -39px;
|
||||
height: 80px;
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
.mejs-overlay:hover > .mejs-overlay-button {
|
||||
background-position: -80px -39px;
|
||||
}
|
||||
|
||||
.mejs-overlay-loading {
|
||||
height: 80px;
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
.mejs-overlay-loading-bg-img {
|
||||
-webkit-animation: mejs-loading-spinner 1s linear infinite;
|
||||
animation: mejs-loading-spinner 1s linear infinite;
|
||||
background: transparent url('mejs-controls.svg') -160px -40px no-repeat;
|
||||
display: block;
|
||||
height: 80px;
|
||||
width: 80px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
@-webkit-keyframes mejs-loading-spinner {
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes mejs-loading-spinner {
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
/* End: LAYERS */
|
||||
|
||||
/* Start: CONTROL BAR */
|
||||
.mejs-controls {
|
||||
bottom: 0;
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
height: 40px;
|
||||
left: 0;
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
padding: 0 10px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.mejs-controls:not([style*='display: none']) {
|
||||
background: rgba(255, 0, 0, 0.7);
|
||||
background: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.35));
|
||||
background: linear-gradient(transparent, rgba(0, 0, 0, 0.35));
|
||||
}
|
||||
|
||||
.mejs-button,
|
||||
.mejs-time,
|
||||
.mejs-time-rail {
|
||||
font-size: 10px;
|
||||
height: 40px;
|
||||
line-height: 10px;
|
||||
margin: 0;
|
||||
width: 32px;
|
||||
}
|
||||
|
||||
.mejs-button > button {
|
||||
background: transparent url('mejs-controls.svg');
|
||||
border: 0;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
font-size: 0;
|
||||
height: 20px;
|
||||
line-height: 0;
|
||||
margin: 10px 6px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
text-decoration: none;
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
/* :focus for accessibility */
|
||||
.mejs-button > button:focus {
|
||||
outline: dotted 1px #999;
|
||||
}
|
||||
|
||||
.mejs-container-keyboard-inactive a,
|
||||
.mejs-container-keyboard-inactive a:focus,
|
||||
.mejs-container-keyboard-inactive button,
|
||||
.mejs-container-keyboard-inactive button:focus,
|
||||
.mejs-container-keyboard-inactive [role=slider],
|
||||
.mejs-container-keyboard-inactive [role=slider]:focus {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
/* End: CONTROL BAR */
|
||||
|
||||
/* Start: Time (Current / Duration) */
|
||||
.mejs-time {
|
||||
box-sizing: content-box;
|
||||
color: #fff;
|
||||
font-size: 11px;
|
||||
font-weight: bold;
|
||||
height: 24px;
|
||||
overflow: hidden;
|
||||
padding: 16px 6px 0;
|
||||
text-align: center;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
/* End: Time (Current / Duration) */
|
||||
|
||||
/* Start: Play/Pause/Stop */
|
||||
.mejs-play > button {
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
.mejs-pause > button {
|
||||
background-position: -20px 0;
|
||||
}
|
||||
|
||||
.mejs-replay > button {
|
||||
background-position: -160px 0;
|
||||
}
|
||||
|
||||
/* End: Play/Pause/Stop */
|
||||
|
||||
/* Start: Progress Bar */
|
||||
.mejs-time-rail {
|
||||
direction: ltr;
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex-grow: 1;
|
||||
-ms-flex-positive: 1;
|
||||
flex-grow: 1;
|
||||
height: 40px;
|
||||
margin: 0 10px;
|
||||
padding-top: 10px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mejs-time-total,
|
||||
.mejs-time-buffering,
|
||||
.mejs-time-loaded,
|
||||
.mejs-time-current,
|
||||
.mejs-time-float,
|
||||
.mejs-time-hovered,
|
||||
.mejs-time-float-current,
|
||||
.mejs-time-float-corner,
|
||||
.mejs-time-marker {
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
height: 10px;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.mejs-time-total {
|
||||
background: rgba(255, 255, 255, 0.3);
|
||||
margin: 5px 0 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs-time-buffering {
|
||||
-webkit-animation: buffering-stripes 2s linear infinite;
|
||||
animation: buffering-stripes 2s linear infinite;
|
||||
background: -webkit-linear-gradient(135deg, rgba(255, 255, 255, 0.4) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.4) 75%, transparent 75%, transparent);
|
||||
background: linear-gradient(-45deg, rgba(255, 255, 255, 0.4) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.4) 75%, transparent 75%, transparent);
|
||||
background-size: 15px 15px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@-webkit-keyframes buffering-stripes {
|
||||
from {
|
||||
background-position: 0 0;
|
||||
}
|
||||
to {
|
||||
background-position: 30px 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes buffering-stripes {
|
||||
from {
|
||||
background-position: 0 0;
|
||||
}
|
||||
to {
|
||||
background-position: 30px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.mejs-time-loaded {
|
||||
background: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.mejs-time-current,
|
||||
.mejs-time-handle-content {
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
|
||||
.mejs-time-hovered {
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.mejs-time-hovered.negative {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.mejs-time-current,
|
||||
.mejs-time-buffering,
|
||||
.mejs-time-loaded,
|
||||
.mejs-time-hovered {
|
||||
left: 0;
|
||||
-webkit-transform: scaleX(0);
|
||||
-ms-transform: scaleX(0);
|
||||
transform: scaleX(0);
|
||||
-webkit-transform-origin: 0 0;
|
||||
-ms-transform-origin: 0 0;
|
||||
transform-origin: 0 0;
|
||||
-webkit-transition: 0.15s ease-in all;
|
||||
transition: 0.15s ease-in all;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs-time-buffering {
|
||||
-webkit-transform: scaleX(1);
|
||||
-ms-transform: scaleX(1);
|
||||
transform: scaleX(1);
|
||||
}
|
||||
|
||||
.mejs-time-hovered {
|
||||
-webkit-transition: height 0.1s cubic-bezier(0.44, 0, 1, 1);
|
||||
transition: height 0.1s cubic-bezier(0.44, 0, 1, 1);
|
||||
}
|
||||
|
||||
.mejs-time-hovered.no-hover {
|
||||
-webkit-transform: scaleX(0) !important;
|
||||
-ms-transform: scaleX(0) !important;
|
||||
transform: scaleX(0) !important;
|
||||
}
|
||||
|
||||
.mejs-time-handle,
|
||||
.mejs-time-handle-content {
|
||||
border: 4px solid transparent;
|
||||
cursor: pointer;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
-webkit-transform: translateX(0);
|
||||
-ms-transform: translateX(0);
|
||||
transform: translateX(0);
|
||||
z-index: 11;
|
||||
}
|
||||
|
||||
.mejs-time-handle-content {
|
||||
border: 4px solid rgba(255, 255, 255, 0.9);
|
||||
border-radius: 50%;
|
||||
height: 10px;
|
||||
left: -7px;
|
||||
top: -4px;
|
||||
-webkit-transform: scale(0);
|
||||
-ms-transform: scale(0);
|
||||
transform: scale(0);
|
||||
width: 10px;
|
||||
}
|
||||
|
||||
.mejs-time-rail:hover .mejs-time-handle-content,
|
||||
.mejs-time-rail .mejs-time-handle-content:focus,
|
||||
.mejs-time-rail .mejs-time-handle-content:active {
|
||||
-webkit-transform: scale(1);
|
||||
-ms-transform: scale(1);
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
.mejs-time-float {
|
||||
background: #eee;
|
||||
border: solid 1px #333;
|
||||
bottom: 100%;
|
||||
color: #111;
|
||||
display: none;
|
||||
height: 17px;
|
||||
margin-bottom: 9px;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
-webkit-transform: translateX(-50%);
|
||||
-ms-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
width: 36px;
|
||||
}
|
||||
|
||||
.mejs-time-float-current {
|
||||
display: block;
|
||||
left: 0;
|
||||
margin: 2px;
|
||||
text-align: center;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.mejs-time-float-corner {
|
||||
border: solid 5px #eee;
|
||||
border-color: #eee transparent transparent;
|
||||
border-radius: 0;
|
||||
display: block;
|
||||
height: 0;
|
||||
left: 50%;
|
||||
line-height: 0;
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
-webkit-transform: translateX(-50%);
|
||||
-ms-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.mejs-long-video .mejs-time-float {
|
||||
margin-left: -23px;
|
||||
width: 64px;
|
||||
}
|
||||
|
||||
.mejs-long-video .mejs-time-float-current {
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.mejs-broadcast {
|
||||
color: #fff;
|
||||
height: 10px;
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* End: Progress Bar */
|
||||
|
||||
/* Start: Fullscreen */
|
||||
.mejs-fullscreen-button > button {
|
||||
background-position: -80px 0;
|
||||
}
|
||||
|
||||
.mejs-unfullscreen > button {
|
||||
background-position: -100px 0;
|
||||
}
|
||||
|
||||
/* End: Fullscreen */
|
||||
|
||||
/* Start: Mute/Volume */
|
||||
.mejs-mute > button {
|
||||
background-position: -60px 0;
|
||||
}
|
||||
|
||||
.mejs-unmute > button {
|
||||
background-position: -40px 0;
|
||||
}
|
||||
|
||||
.mejs-volume-button {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mejs-volume-button > .mejs-volume-slider {
|
||||
-webkit-backface-visibility: hidden;
|
||||
background: rgba(50, 50, 50, 0.7);
|
||||
border-radius: 0;
|
||||
bottom: 100%;
|
||||
display: none;
|
||||
height: 115px;
|
||||
left: 50%;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
-webkit-transform: translateX(-50%);
|
||||
-ms-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
width: 25px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.mejs-volume-button:hover {
|
||||
border-radius: 0 0 4px 4px;
|
||||
}
|
||||
|
||||
.mejs-volume-total {
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
height: 100px;
|
||||
left: 50%;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
-webkit-transform: translateX(-50%);
|
||||
-ms-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
width: 2px;
|
||||
}
|
||||
|
||||
.mejs-volume-current {
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
left: 0;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs-volume-handle {
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
border-radius: 1px;
|
||||
cursor: ns-resize;
|
||||
height: 6px;
|
||||
left: 50%;
|
||||
position: absolute;
|
||||
-webkit-transform: translateX(-50%);
|
||||
-ms-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
.mejs-horizontal-volume-slider {
|
||||
display: block;
|
||||
height: 36px;
|
||||
position: relative;
|
||||
vertical-align: middle;
|
||||
width: 56px;
|
||||
}
|
||||
|
||||
.mejs-horizontal-volume-total {
|
||||
background: rgba(50, 50, 50, 0.8);
|
||||
border-radius: 2px;
|
||||
font-size: 1px;
|
||||
height: 8px;
|
||||
left: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
width: 50px;
|
||||
}
|
||||
|
||||
.mejs-horizontal-volume-current {
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
border-radius: 2px;
|
||||
font-size: 1px;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs-horizontal-volume-handle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* End: Mute/Volume */
|
||||
|
||||
/* Start: Track (Captions and Chapters) */
|
||||
.mejs-captions-button,
|
||||
.mejs-chapters-button {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mejs-captions-button > button {
|
||||
background-position: -140px 0;
|
||||
}
|
||||
|
||||
.mejs-chapters-button > button {
|
||||
background-position: -180px 0;
|
||||
}
|
||||
|
||||
.mejs-captions-button > .mejs-captions-selector,
|
||||
.mejs-chapters-button > .mejs-chapters-selector {
|
||||
background: rgba(50, 50, 50, 0.7);
|
||||
border: solid 1px transparent;
|
||||
border-radius: 0;
|
||||
bottom: 100%;
|
||||
margin-right: -43px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
right: 50%;
|
||||
visibility: visible;
|
||||
width: 86px;
|
||||
}
|
||||
|
||||
.mejs-chapters-button > .mejs-chapters-selector {
|
||||
margin-right: -55px;
|
||||
width: 110px;
|
||||
}
|
||||
|
||||
.mejs-captions-selector-list,
|
||||
.mejs-chapters-selector-list {
|
||||
list-style-type: none !important;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.mejs-captions-selector-list-item,
|
||||
.mejs-chapters-selector-list-item {
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
list-style-type: none !important;
|
||||
margin: 0 0 6px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.mejs-captions-selector-list-item:hover,
|
||||
.mejs-chapters-selector-list-item:hover {
|
||||
background-color: rgb(200, 200, 200) !important;
|
||||
background-color: rgba(255, 255, 255, 0.4) !important;
|
||||
}
|
||||
|
||||
.mejs-captions-selector-input,
|
||||
.mejs-chapters-selector-input {
|
||||
clear: both;
|
||||
float: left;
|
||||
left: -1000px;
|
||||
margin: 3px 3px 0 5px;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.mejs-captions-selector-label,
|
||||
.mejs-chapters-selector-label {
|
||||
cursor: pointer;
|
||||
float: left;
|
||||
font-size: 10px;
|
||||
line-height: 15px;
|
||||
padding: 4px 10px 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs-captions-selected,
|
||||
.mejs-chapters-selected {
|
||||
color: rgba(33, 248, 248, 1);
|
||||
}
|
||||
|
||||
.mejs-captions-translations {
|
||||
font-size: 10px;
|
||||
margin: 0 0 5px;
|
||||
}
|
||||
|
||||
.mejs-captions-layer {
|
||||
bottom: 0;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
left: 0;
|
||||
line-height: 20px;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.mejs-captions-layer a {
|
||||
color: #fff;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.mejs-captions-layer[lang=ar] {
|
||||
font-size: 20px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.mejs-captions-position {
|
||||
bottom: 15px;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs-captions-position-hover {
|
||||
bottom: 35px;
|
||||
}
|
||||
|
||||
.mejs-captions-text,
|
||||
.mejs-captions-text * {
|
||||
background: rgba(20, 20, 20, 0.5);
|
||||
box-shadow: 5px 0 0 rgba(20, 20, 20, 0.5), -5px 0 0 rgba(20, 20, 20, 0.5);
|
||||
padding: 0;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.mejs-container.mejs-hide-cues video::-webkit-media-text-track-container {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* End: Track (Captions and Chapters) */
|
||||
|
||||
/* Start: Error */
|
||||
.mejs-overlay-error {
|
||||
position: relative;
|
||||
}
|
||||
.mejs-overlay-error > img {
|
||||
left: 0;
|
||||
max-width: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
.mejs-cannotplay,
|
||||
.mejs-cannotplay a {
|
||||
color: #fff;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
.mejs-cannotplay {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mejs-cannotplay p,
|
||||
.mejs-cannotplay a {
|
||||
display: inline-block;
|
||||
padding: 0 15px;
|
||||
width: 100%;
|
||||
}
|
||||
/* End: Error */
|
||||
@@ -0,0 +1 @@
|
||||
.mejs-offscreen{border:0;clip:rect(1px,1px,1px,1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal}.mejs-container{background:#000;font-family:Helvetica,Arial,serif;position:relative;text-align:left;text-indent:0;vertical-align:top}.mejs-container,.mejs-container *{box-sizing:border-box}.mejs-container video::-webkit-media-controls,.mejs-container video::-webkit-media-controls-panel,.mejs-container video::-webkit-media-controls-panel-container,.mejs-container video::-webkit-media-controls-start-playback-button{-webkit-appearance:none;display:none!important}.mejs-fill-container,.mejs-fill-container .mejs-container{height:100%;width:100%}.mejs-fill-container{background:transparent;margin:0 auto;overflow:hidden;position:relative}.mejs-container:focus{outline:none}.mejs-iframe-overlay{height:100%;position:absolute;width:100%}.mejs-embed,.mejs-embed body{background:#000;height:100%;margin:0;overflow:hidden;padding:0;width:100%}.mejs-fullscreen{overflow:hidden!important}.mejs-container-fullscreen{bottom:0;left:0;overflow:hidden;position:fixed;right:0;top:0;z-index:1000}.mejs-container-fullscreen .mejs-mediaelement,.mejs-container-fullscreen video{height:100%!important;width:100%!important}.mejs-background,.mejs-mediaelement{left:0;position:absolute;top:0}.mejs-mediaelement{height:100%;width:100%;z-index:0}.mejs-poster{background-position:50% 50%;background-repeat:no-repeat;background-size:cover;left:0;position:absolute;top:0;z-index:1}:root .mejs-poster-img{display:none}.mejs-poster-img{border:0;padding:0}.mejs-overlay{-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;left:0;position:absolute;top:0}.mejs-layer{z-index:1}.mejs-overlay-play{cursor:pointer}.mejs-overlay-button{background:url(mejs-controls.svg) no-repeat;background-position:0 -39px;height:80px;width:80px}.mejs-overlay:hover>.mejs-overlay-button{background-position:-80px -39px}.mejs-overlay-loading{height:80px;width:80px}.mejs-overlay-loading-bg-img{-webkit-animation:a 1s linear infinite;animation:a 1s linear infinite;background:transparent url(mejs-controls.svg) -160px -40px no-repeat;display:block;height:80px;width:80px;z-index:1}@-webkit-keyframes a{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes a{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.mejs-controls{bottom:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;height:40px;left:0;list-style-type:none;margin:0;padding:0 10px;position:absolute;width:100%;z-index:3}.mejs-controls:not([style*="display: none"]){background:rgba(255,0,0,.7);background:-webkit-linear-gradient(transparent,rgba(0,0,0,.35));background:linear-gradient(transparent,rgba(0,0,0,.35))}.mejs-button,.mejs-time,.mejs-time-rail{font-size:10px;height:40px;line-height:10px;margin:0;width:32px}.mejs-button>button{background:transparent url(mejs-controls.svg);border:0;cursor:pointer;display:block;font-size:0;height:20px;line-height:0;margin:10px 6px;overflow:hidden;padding:0;position:absolute;text-decoration:none;width:20px}.mejs-button>button:focus{outline:1px dotted #999}.mejs-container-keyboard-inactive [role=slider],.mejs-container-keyboard-inactive [role=slider]:focus,.mejs-container-keyboard-inactive a,.mejs-container-keyboard-inactive a:focus,.mejs-container-keyboard-inactive button,.mejs-container-keyboard-inactive button:focus{outline:0}.mejs-time{box-sizing:content-box;color:#fff;font-size:11px;font-weight:700;height:24px;overflow:hidden;padding:16px 6px 0;text-align:center;width:auto}.mejs-play>button{background-position:0 0}.mejs-pause>button{background-position:-20px 0}.mejs-replay>button{background-position:-160px 0}.mejs-time-rail{direction:ltr;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;height:40px;margin:0 10px;padding-top:10px;position:relative}.mejs-time-buffering,.mejs-time-current,.mejs-time-float,.mejs-time-float-corner,.mejs-time-float-current,.mejs-time-hovered,.mejs-time-loaded,.mejs-time-marker,.mejs-time-total{border-radius:2px;cursor:pointer;display:block;height:10px;position:absolute}.mejs-time-total{background:hsla(0,0%,100%,.3);margin:5px 0 0;width:100%}.mejs-time-buffering{-webkit-animation:b 2s linear infinite;animation:b 2s linear infinite;background:-webkit-linear-gradient(135deg,hsla(0,0%,100%,.4) 25%,transparent 0,transparent 50%,hsla(0,0%,100%,.4) 0,hsla(0,0%,100%,.4) 75%,transparent 0,transparent);background:linear-gradient(-45deg,hsla(0,0%,100%,.4) 25%,transparent 0,transparent 50%,hsla(0,0%,100%,.4) 0,hsla(0,0%,100%,.4) 75%,transparent 0,transparent);background-size:15px 15px;width:100%}@-webkit-keyframes b{0%{background-position:0 0}to{background-position:30px 0}}@keyframes b{0%{background-position:Line truncated
|
||||
@@ -0,0 +1,774 @@
|
||||
/* Accessibility: hide screen reader texts (and prefer "top" for RTL languages).
|
||||
Reference: http://blog.rrwd.nl/2015/04/04/the-screen-reader-text-class-why-and-how/ */
|
||||
.mejs__offscreen {
|
||||
border: 0;
|
||||
clip: rect( 1px, 1px, 1px, 1px );
|
||||
-webkit-clip-path: inset( 50% );
|
||||
clip-path: inset( 50% );
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
word-wrap: normal;
|
||||
}
|
||||
|
||||
.mejs__container {
|
||||
background: #000;
|
||||
box-sizing: border-box;
|
||||
font-family: 'Helvetica', Arial, serif;
|
||||
position: relative;
|
||||
text-align: left;
|
||||
text-indent: 0;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.mejs__container * {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* Hide native play button and control bar from iOS to favor plugin button */
|
||||
.mejs__container video::-webkit-media-controls,
|
||||
.mejs__container video::-webkit-media-controls-panel,
|
||||
.mejs__container video::-webkit-media-controls-panel-container,
|
||||
.mejs__container video::-webkit-media-controls-start-playback-button {
|
||||
-webkit-appearance: none;
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.mejs__fill-container,
|
||||
.mejs__fill-container .mejs__container {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs__fill-container {
|
||||
background: transparent;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mejs__container:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.mejs__iframe-overlay {
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs__embed,
|
||||
.mejs__embed body {
|
||||
background: #000;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs__fullscreen {
|
||||
overflow: hidden !important;
|
||||
}
|
||||
|
||||
.mejs__container-fullscreen {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
overflow: hidden;
|
||||
position: fixed;
|
||||
right: 0;
|
||||
top: 0;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.mejs__container-fullscreen .mejs__mediaelement,
|
||||
.mejs__container-fullscreen video {
|
||||
height: 100% !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
/* Start: LAYERS */
|
||||
.mejs__background {
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.mejs__mediaelement {
|
||||
height: 100%;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.mejs__poster {
|
||||
background-position: 50% 50%;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
:root .mejs__poster-img {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.mejs__poster-img {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.mejs__overlay {
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.mejs__layer {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.mejs__overlay-play {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mejs__overlay-button {
|
||||
background: url('mejs-controls.svg') no-repeat;
|
||||
background-position: 0 -39px;
|
||||
height: 80px;
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
.mejs__overlay:hover > .mejs__overlay-button {
|
||||
background-position: -80px -39px;
|
||||
}
|
||||
|
||||
.mejs__overlay-loading {
|
||||
height: 80px;
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
.mejs__overlay-loading-bg-img {
|
||||
-webkit-animation: mejs__loading-spinner 1s linear infinite;
|
||||
animation: mejs__loading-spinner 1s linear infinite;
|
||||
background: transparent url('mejs-controls.svg') -160px -40px no-repeat;
|
||||
display: block;
|
||||
height: 80px;
|
||||
width: 80px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
@-webkit-keyframes mejs__loading-spinner {
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes mejs__loading-spinner {
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
/* End: LAYERS */
|
||||
|
||||
/* Start: CONTROL BAR */
|
||||
.mejs__controls {
|
||||
bottom: 0;
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
height: 40px;
|
||||
left: 0;
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
padding: 0 10px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.mejs__controls:not([style*='display: none']) {
|
||||
background: rgba(255, 0, 0, 0.7);
|
||||
background: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.35));
|
||||
background: linear-gradient(transparent, rgba(0, 0, 0, 0.35));
|
||||
}
|
||||
|
||||
.mejs__button,
|
||||
.mejs__time,
|
||||
.mejs__time-rail {
|
||||
font-size: 10px;
|
||||
height: 40px;
|
||||
line-height: 10px;
|
||||
margin: 0;
|
||||
width: 32px;
|
||||
}
|
||||
|
||||
.mejs__button > button {
|
||||
background: transparent url('mejs-controls.svg');
|
||||
border: 0;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
font-size: 0;
|
||||
height: 20px;
|
||||
line-height: 0;
|
||||
margin: 10px 6px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
text-decoration: none;
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
/* :focus for accessibility */
|
||||
.mejs__button > button:focus {
|
||||
outline: dotted 1px #999;
|
||||
}
|
||||
|
||||
.mejs__container-keyboard-inactive a,
|
||||
.mejs__container-keyboard-inactive a:focus,
|
||||
.mejs__container-keyboard-inactive button,
|
||||
.mejs__container-keyboard-inactive button:focus,
|
||||
.mejs__container-keyboard-inactive [role=slider],
|
||||
.mejs__container-keyboard-inactive [role=slider]:focus {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
/* End: CONTROL BAR */
|
||||
|
||||
/* Start: Time (Current / Duration) */
|
||||
.mejs__time {
|
||||
box-sizing: content-box;
|
||||
color: #fff;
|
||||
font-size: 11px;
|
||||
font-weight: bold;
|
||||
height: 24px;
|
||||
overflow: hidden;
|
||||
padding: 16px 6px 0;
|
||||
text-align: center;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
/* End: Time (Current / Duration) */
|
||||
|
||||
/* Start: Play/Pause/Stop */
|
||||
.mejs__play > button {
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
.mejs__pause > button {
|
||||
background-position: -20px 0;
|
||||
}
|
||||
|
||||
.mejs__replay > button {
|
||||
background-position: -160px 0;
|
||||
}
|
||||
|
||||
/* End: Play/Pause/Stop */
|
||||
|
||||
/* Start: Progress Bar */
|
||||
.mejs__time-rail {
|
||||
direction: ltr;
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex-grow: 1;
|
||||
-ms-flex-positive: 1;
|
||||
flex-grow: 1;
|
||||
height: 40px;
|
||||
margin: 0 10px;
|
||||
padding-top: 10px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mejs__time-total,
|
||||
.mejs__time-buffering,
|
||||
.mejs__time-loaded,
|
||||
.mejs__time-current,
|
||||
.mejs__time-float,
|
||||
.mejs__time-hovered,
|
||||
.mejs__time-float-current,
|
||||
.mejs__time-float-corner,
|
||||
.mejs__time-marker {
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
height: 10px;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.mejs__time-total {
|
||||
background: rgba(255, 255, 255, 0.3);
|
||||
margin: 5px 0 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs__time-buffering {
|
||||
-webkit-animation: buffering-stripes 2s linear infinite;
|
||||
animation: buffering-stripes 2s linear infinite;
|
||||
background: -webkit-linear-gradient(135deg, rgba(255, 255, 255, 0.4) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.4) 75%, transparent 75%, transparent);
|
||||
background: linear-gradient(-45deg, rgba(255, 255, 255, 0.4) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.4) 75%, transparent 75%, transparent);
|
||||
background-size: 15px 15px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@-webkit-keyframes buffering-stripes {
|
||||
from {
|
||||
background-position: 0 0;
|
||||
}
|
||||
to {
|
||||
background-position: 30px 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes buffering-stripes {
|
||||
from {
|
||||
background-position: 0 0;
|
||||
}
|
||||
to {
|
||||
background-position: 30px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.mejs__time-loaded {
|
||||
background: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.mejs__time-current,
|
||||
.mejs__time-handle-content {
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
|
||||
.mejs__time-hovered {
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.mejs__time-hovered.negative {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.mejs__time-current,
|
||||
.mejs__time-buffering,
|
||||
.mejs__time-loaded,
|
||||
.mejs__time-hovered {
|
||||
left: 0;
|
||||
-webkit-transform: scaleX(0);
|
||||
-ms-transform: scaleX(0);
|
||||
transform: scaleX(0);
|
||||
-webkit-transform-origin: 0 0;
|
||||
-ms-transform-origin: 0 0;
|
||||
transform-origin: 0 0;
|
||||
-webkit-transition: 0.15s ease-in all;
|
||||
transition: 0.15s ease-in all;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs__time-buffering {
|
||||
-webkit-transform: scaleX(1);
|
||||
-ms-transform: scaleX(1);
|
||||
transform: scaleX(1);
|
||||
}
|
||||
|
||||
.mejs__time-hovered {
|
||||
-webkit-transition: height 0.1s cubic-bezier(0.44, 0, 1, 1);
|
||||
transition: height 0.1s cubic-bezier(0.44, 0, 1, 1);
|
||||
}
|
||||
|
||||
.mejs__time-hovered.no-hover {
|
||||
-webkit-transform: scaleX(0) !important;
|
||||
-ms-transform: scaleX(0) !important;
|
||||
transform: scaleX(0) !important;
|
||||
}
|
||||
|
||||
.mejs__time-handle,
|
||||
.mejs__time-handle-content {
|
||||
border: 4px solid transparent;
|
||||
cursor: pointer;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
-webkit-transform: translateX(0);
|
||||
-ms-transform: translateX(0);
|
||||
transform: translateX(0);
|
||||
z-index: 11;
|
||||
}
|
||||
|
||||
.mejs__time-handle-content {
|
||||
border: 4px solid rgba(255, 255, 255, 0.9);
|
||||
border-radius: 50%;
|
||||
height: 10px;
|
||||
left: -7px;
|
||||
top: -4px;
|
||||
-webkit-transform: scale(0);
|
||||
-ms-transform: scale(0);
|
||||
transform: scale(0);
|
||||
width: 10px;
|
||||
}
|
||||
|
||||
.mejs__time-rail:hover .mejs__time-handle-content,
|
||||
.mejs__time-rail .mejs__time-handle-content:focus,
|
||||
.mejs__time-rail .mejs__time-handle-content:active {
|
||||
-webkit-transform: scale(1);
|
||||
-ms-transform: scale(1);
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
.mejs__time-float {
|
||||
background: #eee;
|
||||
border: solid 1px #333;
|
||||
bottom: 100%;
|
||||
color: #111;
|
||||
display: none;
|
||||
height: 17px;
|
||||
margin-bottom: 9px;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
-webkit-transform: translateX(-50%);
|
||||
-ms-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
width: 36px;
|
||||
}
|
||||
|
||||
.mejs__time-float-current {
|
||||
display: block;
|
||||
left: 0;
|
||||
margin: 2px;
|
||||
text-align: center;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.mejs__time-float-corner {
|
||||
border: solid 5px #eee;
|
||||
border-color: #eee transparent transparent;
|
||||
border-radius: 0;
|
||||
display: block;
|
||||
height: 0;
|
||||
left: 50%;
|
||||
line-height: 0;
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
-webkit-transform: translateX(-50%);
|
||||
-ms-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.mejs__long-video .mejs__time-float {
|
||||
margin-left: -23px;
|
||||
width: 64px;
|
||||
}
|
||||
|
||||
.mejs__long-video .mejs__time-float-current {
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.mejs__broadcast {
|
||||
color: #fff;
|
||||
height: 10px;
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* End: Progress Bar */
|
||||
|
||||
/* Start: Fullscreen */
|
||||
.mejs__fullscreen-button > button {
|
||||
background-position: -80px 0;
|
||||
}
|
||||
|
||||
.mejs__unfullscreen > button {
|
||||
background-position: -100px 0;
|
||||
}
|
||||
|
||||
/* End: Fullscreen */
|
||||
|
||||
/* Start: Mute/Volume */
|
||||
.mejs__mute > button {
|
||||
background-position: -60px 0;
|
||||
}
|
||||
|
||||
.mejs__unmute > button {
|
||||
background-position: -40px 0;
|
||||
}
|
||||
|
||||
.mejs__volume-button {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mejs__volume-button > .mejs__volume-slider {
|
||||
-webkit-backface-visibility: hidden;
|
||||
background: rgba(50, 50, 50, 0.7);
|
||||
border-radius: 0;
|
||||
bottom: 100%;
|
||||
display: none;
|
||||
height: 115px;
|
||||
left: 50%;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
-webkit-transform: translateX(-50%);
|
||||
-ms-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
width: 25px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.mejs__volume-button:hover {
|
||||
border-radius: 0 0 4px 4px;
|
||||
}
|
||||
|
||||
.mejs__volume-total {
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
height: 100px;
|
||||
left: 50%;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
-webkit-transform: translateX(-50%);
|
||||
-ms-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
width: 2px;
|
||||
}
|
||||
|
||||
.mejs__volume-current {
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
left: 0;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs__volume-handle {
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
border-radius: 1px;
|
||||
cursor: ns-resize;
|
||||
height: 6px;
|
||||
left: 50%;
|
||||
position: absolute;
|
||||
-webkit-transform: translateX(-50%);
|
||||
-ms-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
.mejs__horizontal-volume-slider {
|
||||
display: block;
|
||||
height: 36px;
|
||||
position: relative;
|
||||
vertical-align: middle;
|
||||
width: 56px;
|
||||
}
|
||||
|
||||
.mejs__horizontal-volume-total {
|
||||
background: rgba(50, 50, 50, 0.8);
|
||||
border-radius: 2px;
|
||||
font-size: 1px;
|
||||
height: 8px;
|
||||
left: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
width: 50px;
|
||||
}
|
||||
|
||||
.mejs__horizontal-volume-current {
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
border-radius: 2px;
|
||||
font-size: 1px;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs__horizontal-volume-handle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* End: Mute/Volume */
|
||||
|
||||
/* Start: Track (Captions and Chapters) */
|
||||
.mejs__captions-button,
|
||||
.mejs__chapters-button {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mejs__captions-button > button {
|
||||
background-position: -140px 0;
|
||||
}
|
||||
|
||||
.mejs__chapters-button > button {
|
||||
background-position: -180px 0;
|
||||
}
|
||||
|
||||
.mejs__captions-button > .mejs__captions-selector,
|
||||
.mejs__chapters-button > .mejs__chapters-selector {
|
||||
background: rgba(50, 50, 50, 0.7);
|
||||
border: solid 1px transparent;
|
||||
border-radius: 0;
|
||||
bottom: 100%;
|
||||
margin-right: -43px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
right: 50%;
|
||||
visibility: visible;
|
||||
width: 86px;
|
||||
}
|
||||
|
||||
.mejs__chapters-button > .mejs__chapters-selector {
|
||||
margin-right: -55px;
|
||||
width: 110px;
|
||||
}
|
||||
|
||||
.mejs__captions-selector-list,
|
||||
.mejs__chapters-selector-list {
|
||||
list-style-type: none !important;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.mejs__captions-selector-list-item,
|
||||
.mejs__chapters-selector-list-item {
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
list-style-type: none !important;
|
||||
margin: 0 0 6px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.mejs__captions-selector-list-item:hover,
|
||||
.mejs__chapters-selector-list-item:hover {
|
||||
background-color: rgb(200, 200, 200) !important;
|
||||
background-color: rgba(255, 255, 255, 0.4) !important;
|
||||
}
|
||||
|
||||
.mejs__captions-selector-input,
|
||||
.mejs__chapters-selector-input {
|
||||
clear: both;
|
||||
float: left;
|
||||
left: -1000px;
|
||||
margin: 3px 3px 0 5px;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.mejs__captions-selector-label,
|
||||
.mejs__chapters-selector-label {
|
||||
cursor: pointer;
|
||||
float: left;
|
||||
font-size: 10px;
|
||||
line-height: 15px;
|
||||
padding: 4px 10px 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs__captions-selected,
|
||||
.mejs__chapters-selected {
|
||||
color: rgba(33, 248, 248, 1);
|
||||
}
|
||||
|
||||
.mejs__captions-translations {
|
||||
font-size: 10px;
|
||||
margin: 0 0 5px;
|
||||
}
|
||||
|
||||
.mejs__captions-layer {
|
||||
bottom: 0;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
left: 0;
|
||||
line-height: 20px;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.mejs__captions-layer a {
|
||||
color: #fff;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.mejs__captions-layer[lang=ar] {
|
||||
font-size: 20px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.mejs__captions-position {
|
||||
bottom: 15px;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mejs__captions-position-hover {
|
||||
bottom: 35px;
|
||||
}
|
||||
|
||||
.mejs__captions-text,
|
||||
.mejs__captions-text * {
|
||||
background: rgba(20, 20, 20, 0.5);
|
||||
box-shadow: 5px 0 0 rgba(20, 20, 20, 0.5), -5px 0 0 rgba(20, 20, 20, 0.5);
|
||||
padding: 0;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.mejs__container.mejs__hide-cues video::-webkit-media-text-track-container {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* End: Track (Captions and Chapters) */
|
||||
|
||||
/* Start: Error */
|
||||
.mejs__overlay-error {
|
||||
position: relative;
|
||||
}
|
||||
.mejs__overlay-error > img {
|
||||
left: 0;
|
||||
max-width: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
.mejs__cannotplay,
|
||||
.mejs__cannotplay a {
|
||||
color: #fff;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
.mejs__cannotplay {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mejs__cannotplay p,
|
||||
.mejs__cannotplay a {
|
||||
display: inline-block;
|
||||
padding: 0 15px;
|
||||
width: 100%;
|
||||
}
|
||||
/* End: Error */
|
||||
@@ -0,0 +1 @@
|
||||
.mejs__offscreen{border:0;clip:rect(1px,1px,1px,1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal}.mejs__container{background:#000;font-family:Helvetica,Arial,serif;position:relative;text-align:left;text-indent:0;vertical-align:top}.mejs__container,.mejs__container *{box-sizing:border-box}.mejs__container video::-webkit-media-controls,.mejs__container video::-webkit-media-controls-panel,.mejs__container video::-webkit-media-controls-panel-container,.mejs__container video::-webkit-media-controls-start-playback-button{-webkit-appearance:none;display:none!important}.mejs__fill-container,.mejs__fill-container .mejs__container{height:100%;width:100%}.mejs__fill-container{background:transparent;margin:0 auto;overflow:hidden;position:relative}.mejs__container:focus{outline:none}.mejs__iframe-overlay{height:100%;position:absolute;width:100%}.mejs__embed,.mejs__embed body{background:#000;height:100%;margin:0;overflow:hidden;padding:0;width:100%}.mejs__fullscreen{overflow:hidden!important}.mejs__container-fullscreen{bottom:0;left:0;overflow:hidden;position:fixed;right:0;top:0;z-index:1000}.mejs__container-fullscreen .mejs__mediaelement,.mejs__container-fullscreen video{height:100%!important;width:100%!important}.mejs__background,.mejs__mediaelement{left:0;position:absolute;top:0}.mejs__mediaelement{height:100%;width:100%;z-index:0}.mejs__poster{background-position:50% 50%;background-repeat:no-repeat;background-size:cover;left:0;position:absolute;top:0;z-index:1}:root .mejs__poster-img{display:none}.mejs__poster-img{border:0;padding:0}.mejs__overlay{-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;left:0;position:absolute;top:0}.mejs__layer{z-index:1}.mejs__overlay-play{cursor:pointer}.mejs__overlay-button{background:url(mejs-controls.svg) no-repeat;background-position:0 -39px;height:80px;width:80px}.mejs__overlay:hover>.mejs__overlay-button{background-position:-80px -39px}.mejs__overlay-loading{height:80px;width:80px}.mejs__overlay-loading-bg-img{-webkit-animation:a 1s linear infinite;animation:a 1s linear infinite;background:transparent url(mejs-controls.svg) -160px -40px no-repeat;display:block;height:80px;width:80px;z-index:1}@-webkit-keyframes a{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes a{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.mejs__controls{bottom:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;height:40px;left:0;list-style-type:none;margin:0;padding:0 10px;position:absolute;width:100%;z-index:3}.mejs__controls:not([style*="display: none"]){background:rgba(255,0,0,.7);background:-webkit-linear-gradient(transparent,rgba(0,0,0,.35));background:linear-gradient(transparent,rgba(0,0,0,.35))}.mejs__button,.mejs__time,.mejs__time-rail{font-size:10px;height:40px;line-height:10px;margin:0;width:32px}.mejs__button>button{background:transparent url(mejs-controls.svg);border:0;cursor:pointer;display:block;font-size:0;height:20px;line-height:0;margin:10px 6px;overflow:hidden;padding:0;position:absolute;text-decoration:none;width:20px}.mejs__button>button:focus{outline:1px dotted #999}.mejs__container-keyboard-inactive [role=slider],.mejs__container-keyboard-inactive [role=slider]:focus,.mejs__container-keyboard-inactive a,.mejs__container-keyboard-inactive a:focus,.mejs__container-keyboard-inactive button,.mejs__container-keyboard-inactive button:focus{outline:0}.mejs__time{box-sizing:content-box;color:#fff;font-size:11px;font-weight:700;height:24px;overflow:hidden;padding:16px 6px 0;text-align:center;width:auto}.mejs__play>button{background-position:0 0}.mejs__pause>button{background-position:-20px 0}.mejs__replay>button{background-position:-160px 0}.mejs__time-rail{direction:ltr;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;height:40px;margin:0 10px;padding-top:10px;position:relative}.mejs__time-buffering,.mejs__time-current,.mejs__time-float,.mejs__time-float-corner,.mejs__time-float-current,.mejs__time-hovered,.mejs__time-loaded,.mejs__time-marker,.mejs__time-total{border-radius:2px;cursor:pointer;display:block;height:10px;position:absolute}.mejs__time-total{background:hsla(0,0%,100%,.3);margin:5px 0 0;width:100%}.mejs__time-buffering{-webkit-animation:b 2s linear infinite;animation:b 2s linear infinite;background:-webkit-linear-gradient(135deg,hsla(0,0%,100%,.4) 25%,transparent 0,transparent 50%,hsla(0,0%,100%,.4) 0,hsla(0,0%,100%,.4) 75%,transparent 0,transparent);background:linear-gradient(-45deg,hsla(0,0%,100%,.4) 25%,transparent 0,transparent 50%,hsla(0,0%,100%,.4) 0,hsla(0,0%,100%,.4) 75%,transparent 0,transparent);background-size:15px 15px;width:100%}@-webkit-keyframes b{0%{background-position:0 0}to{Line truncated
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 2.8 KiB |
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="120" viewBox="0 0 400 120"><style>.st0{fill:#FFFFFF;width:16px;height:16px} .st1{fill:none;stroke:#FFFFFF;stroke-width:1.5;stroke-linecap:round;} .st2{fill:none;stroke:#FFFFFF;stroke-width:2;stroke-linecap:round;} .st3{fill:none;stroke:#FFFFFF;} .st4{fill:#231F20;} .st5{opacity:0.75;fill:none;stroke:#FFFFFF;stroke-width:5;enable-background:new;} .st6{fill:none;stroke:#FFFFFF;stroke-width:5;} .st7{opacity:0.4;fill:#FFFFFF;enable-background:new;} .st8{opacity:0.6;fill:#FFFFFF;enable-background:new;} .st9{opacity:0.8;fill:#FFFFFF;enable-background:new;} .st10{opacity:0.9;fill:#FFFFFF;enable-background:new;} .st11{opacity:0.3;fill:#FFFFFF;enable-background:new;} .st12{opacity:0.5;fill:#FFFFFF;enable-background:new;} .st13{opacity:0.7;fill:#FFFFFF;enable-background:new;}</style><path class="st0" d="M16.5 8.5c.3.1.4.5.2.8-.1.1-.1.2-.2.2l-11.4 7c-.5.3-.8.1-.8-.5V2c0-.5.4-.8.8-.5l11.4 7z"/><path class="st0" d="M24 1h2.2c.6 0 1 .4 1 1v14c0 .6-.4 1-1 1H24c-.6 0-1-.4-1-1V2c0-.5.4-1 1-1zm9.8 0H36c.6 0 1 .4 1 1v14c0 .6-.4 1-1 1h-2.2c-.6 0-1-.4-1-1V2c0-.5.4-1 1-1z"/><path class="st0" d="M81 1.4c0-.6.4-1 1-1h5.4c.6 0 .7.3.3.7l-6 6c-.4.4-.7.3-.7-.3V1.4zm0 15.8c0 .6.4 1 1 1h5.4c.6 0 .7-.3.3-.7l-6-6c-.4-.4-.7-.3-.7.3v5.4zM98.8 1.4c0-.6-.4-1-1-1h-5.4c-.6 0-.7.3-.3.7l6 6c.4.4.7.3.7-.3V1.4zm0 15.8c0 .6-.4 1-1 1h-5.4c-.6 0-.7-.3-.3-.7l6-6c.4-.4.7-.3.7.3v5.4z"/><path class="st0" d="M112.7 5c0 .6.4 1 1 1h4.1c.6 0 .7-.3.3-.7L113.4.6c-.4-.4-.7-.3-.7.3V5zm-7.1 1c.6 0 1-.4 1-1V.9c0-.6-.3-.7-.7-.3l-4.7 4.7c-.4.4-.3.7.3.7h4.1zm1 7.1c0-.6-.4-1-1-1h-4.1c-.6 0-.7.3-.3.7l4.7 4.7c.4.4.7.3.7-.3v-4.1zm7.1-1c-.6 0-1 .4-1 1v4.1c0 .5.3.7.7.3l4.7-4.7c.4-.4.3-.7-.3-.7h-4.1z"/><path class="st0" d="M67 5.8c-.5.4-1.2.6-1.8.6H62c-.6 0-1 .4-1 1v5.7c0 .6.4 1 1 1h4.2c.3.2.5.4.8.6l3.5 2.6c.4.3.8.1.8-.4V3.5c0-.5-.4-.7-.8-.4L67 5.8z"/><path class="st1" d="M73.9 2.5s3.9-.8 3.9 7.7-3.9 7.8-3.9 7.8"/><path class="st1" d="M72.6 6.4s2.6-.4 2.6 3.8-2.6 3.9-2.6 3.9"/><path class="st0" d="M47 5.8c-.5.4-1.2.6-1.8.6H42c-.6 0-1 .4-1 1v5.7c0 .6.4 1 1 1h4.2c.3.2.5.4.8.6l3.5 2.6c.4.3.8.1.8-.4V3.5c0-.5-.4-.7-.8-.4L47 5.8z"/><path class="st2" d="M52.8 7l5.4 5.4m-5.4 0L58.2 7"/><path class="st3" d="M128.7 8.6c-6.2-4.2-6.5 7.8 0 3.9m6.5-3.9c-6.2-4.2-6.5 7.8 0 3.9"/><path class="st0" d="M122.2 3.4h15.7v13.1h-15.7V3.4zM120.8 2v15.7h18.3V2h-18.3z"/><path class="st0" d="M143.2 3h14c1.1 0 2 .9 2 2v10c0 1.1-.9 2-2 2h-14c-1.1 0-2-.9-2-2V5c0-1.1.9-2 2-2z"/><path class="st4" d="M146.4 13.8c-.8 0-1.6-.4-2.1-1-1.1-1.4-1-3.4.1-4.8.5-.6 2-1.7 4.6.2l-.6.8c-1.4-1-2.6-1.1-3.3-.3-.8 1-.8 2.4-.1 3.5.7.9 1.9.8 3.4-.1l.5.9c-.7.5-1.6.7-2.5.8zm7.5 0c-.8 0-1.6-.4-2.1-1-1.1-1.4-1-3.4.1-4.8.5-.6 2-1.7 4.6.2l-.5.8c-1.4-1-2.6-1.1-3.3-.3-.8 1-.8 2.4-.1 3.5.7.9 1.9.8 3.4-.1l.5.9c-.8.5-1.7.7-2.6.8z"/><path class="st0" d="M60.3 77c.6.2.8.8.6 1.4-.1.3-.3.5-.6.6L30 96.5c-1 .6-1.7.1-1.7-1v-35c0-1.1.8-1.5 1.7-1L60.3 77z"/><path class="st5" d="M2.5 79c0-20.7 16.8-37.5 37.5-37.5S77.5 58.3 77.5 79 60.7 116.5 40 116.5 2.5 99.7 2.5 79z"/><path class="st0" d="M140.3 77c.6.2.8.8.6 1.4-.1.3-.3.5-.6.6L110 96.5c-1 .6-1.7.1-1.7-1v-35c0-1.1.8-1.5 1.7-1L140.3 77z"/><path class="st6" d="M82.5 79c0-20.7 16.8-37.5 37.5-37.5s37.5 16.8 37.5 37.5-16.8 37.5-37.5 37.5S82.5 99.7 82.5 79z"/><circle class="st0" cx="201.9" cy="47.1" r="8.1"/><circle class="st7" cx="233.9" cy="79" r="5"/><circle class="st8" cx="201.9" cy="110.9" r="6"/><circle class="st9" cx="170.1" cy="79" r="7"/><circle class="st10" cx="178.2" cy="56.3" r="7.5"/><circle class="st11" cx="226.3" cy="56.1" r="4.5"/><circle class="st12" cx="225.8" cy="102.8" r="5.5"/><circle class="st13" cx="178.2" cy="102.8" r="6.5"/><path class="st0" d="M178 9.4c0 .4-.4.7-.9.7-.1 0-.2 0-.2-.1L172 8.2c-.5-.2-.6-.6-.1-.8l6.2-3.6c.5-.3.8-.1.7.5l-.8 5.1z"/><path class="st0" d="M169.4 15.9c-1 0-2-.2-2.9-.7-2-1-3.2-3-3.2-5.2.1-3.4 2.9-6 6.3-6 2.5.1 4.8 1.7 5.6 4.1l.1-.1 2.1 1.1c-.6-4.4-4.7-7.5-9.1-6.9-3.9.6-6.9 3.9-7 7.9 0 2.9 1.7 5.6 4.3 7 1.2.6 2.5.9 3.8 1 2.6 0 5-1.2 6.6-3.3l-1.8-.9c-1.2 1.2-3 2-4.8 2z"/><path class="st0" d="M183.4 3.2c.8 0 1.5.7 1.5 1.5s-.7 1.5-1.5 1.5-1.5-.7-1.5-1.5c0-.9.7-1.5 1.5-1.5zm5.1 0h8.5c.9 0 1.5.7 1.5 1.5s-.7 1.5-1.5 1.5h-8.5c-.9 0-1.5-.7-1.5-1.5-.1-.9.6-1.5 1.5-1.5zm-5.1 5c.8 0 1.5.7 1.5 1.5s-.7 1.5-1.5 1.5-1.5-.7-1.5-1.5c0-.9.7-1.5 1.5-1.5zm5.1 0h8.5c.9 0 1.5.7 1.5 1.5s-.7 1.5-1.5 1.5h-8.5c-.9 0-1.5-.7-1.5-1.5-.1-.9.6-1.5 1.5-1.5zm-5.1 5c.8 0 1.5.7 1.5 1.5s-.7 1.5-1.5 1.5-1.5-.7-1.5-1.5c0-.9.7-1.5 1.5-1.5zm5.1 0h8.5c.9 0 1.5.7 1.5 1.5s-.7 1.5-1.5 1.5h-8.5c-.9 0-1.5-.7-1.5-1.5-.1-.9.6-1.5 1.5-1.5z"/></svg>
|
||||
|
After Width: | Height: | Size: 4.5 KiB |
@@ -0,0 +1,432 @@
|
||||
/*!
|
||||
* MediaElement.js
|
||||
* http://www.mediaelementjs.com/
|
||||
*
|
||||
* Wrapper that mimics native HTML5 MediaElement (audio and video)
|
||||
* using a variety of technologies (pure JavaScript, Flash, iframe)
|
||||
*
|
||||
* Copyright 2010-2017, John Dyer (http://j.hn/)
|
||||
* License: MIT
|
||||
*
|
||||
*/(function(){function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s}return e})()({1:[function(_dereq_,module,exports){
|
||||
'use strict';
|
||||
|
||||
var VimeoApi = {
|
||||
|
||||
promise: null,
|
||||
|
||||
load: function load(settings) {
|
||||
|
||||
if (typeof Vimeo !== 'undefined') {
|
||||
VimeoApi._createPlayer(settings);
|
||||
} else {
|
||||
VimeoApi.promise = VimeoApi.promise || mejs.Utils.loadScript('https://player.vimeo.com/api/player.js');
|
||||
VimeoApi.promise.then(function () {
|
||||
VimeoApi._createPlayer(settings);
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
_createPlayer: function _createPlayer(settings) {
|
||||
var player = new Vimeo.Player(settings.iframe);
|
||||
window['__ready__' + settings.id](player);
|
||||
},
|
||||
|
||||
getVimeoId: function getVimeoId(url) {
|
||||
if (url == null) {
|
||||
return null;
|
||||
}
|
||||
|
||||
var parts = url.split('?');
|
||||
url = parts[0];
|
||||
|
||||
var playerLinkMatch = url.match(/https:\/\/player.vimeo.com\/video\/(\d+)$/);
|
||||
if (playerLinkMatch) {
|
||||
return parseInt(playerLinkMatch[1], 10);
|
||||
}
|
||||
|
||||
var vimeoLinkMatch = url.match(/https:\/\/vimeo.com\/(\d+)$/);
|
||||
if (vimeoLinkMatch) {
|
||||
return parseInt(vimeoLinkMatch[1], 10);
|
||||
}
|
||||
|
||||
var privateVimeoLinkMatch = url.match(/https:\/\/vimeo.com\/(\d+)\/\w+$/);
|
||||
if (privateVimeoLinkMatch) {
|
||||
return parseInt(privateVimeoLinkMatch[1], 10);
|
||||
}
|
||||
|
||||
return NaN;
|
||||
}
|
||||
};
|
||||
|
||||
var vimeoIframeRenderer = {
|
||||
|
||||
name: 'vimeo_iframe',
|
||||
options: {
|
||||
prefix: 'vimeo_iframe'
|
||||
},
|
||||
|
||||
canPlayType: function canPlayType(type) {
|
||||
return ~['video/vimeo', 'video/x-vimeo'].indexOf(type.toLowerCase());
|
||||
},
|
||||
|
||||
create: function create(mediaElement, options, mediaFiles) {
|
||||
var apiStack = [],
|
||||
vimeo = {},
|
||||
readyState = 4;
|
||||
|
||||
var paused = true,
|
||||
volume = 1,
|
||||
oldVolume = volume,
|
||||
currentTime = 0,
|
||||
bufferedTime = 0,
|
||||
ended = false,
|
||||
duration = 0,
|
||||
vimeoPlayer = null,
|
||||
url = '';
|
||||
|
||||
vimeo.options = options;
|
||||
vimeo.id = mediaElement.id + '_' + options.prefix;
|
||||
vimeo.mediaElement = mediaElement;
|
||||
|
||||
var errorHandler = function errorHandler(error) {
|
||||
mediaElement.generateError('Code ' + error.name + ': ' + error.message, mediaFiles);
|
||||
};
|
||||
|
||||
var props = mejs.html5media.properties,
|
||||
assignGettersSetters = function assignGettersSetters(propName) {
|
||||
|
||||
var capName = '' + propName.substring(0, 1).toUpperCase() + propName.substring(1);
|
||||
|
||||
vimeo['get' + capName] = function () {
|
||||
if (vimeoPlayer !== null) {
|
||||
var value = null;
|
||||
|
||||
switch (propName) {
|
||||
case 'currentTime':
|
||||
return currentTime;
|
||||
case 'duration':
|
||||
return duration;
|
||||
case 'volume':
|
||||
return volume;
|
||||
case 'muted':
|
||||
return volume === 0;
|
||||
case 'paused':
|
||||
return paused;
|
||||
case 'ended':
|
||||
return ended;
|
||||
case 'src':
|
||||
vimeoPlayer.getVideoUrl().then(function (_url) {
|
||||
url = _url;
|
||||
}).catch(function (error) {
|
||||
return errorHandler(error);
|
||||
});
|
||||
return url;
|
||||
case 'buffered':
|
||||
return {
|
||||
start: function start() {
|
||||
return 0;
|
||||
},
|
||||
end: function end() {
|
||||
return bufferedTime * duration;
|
||||
},
|
||||
length: 1
|
||||
};
|
||||
case 'readyState':
|
||||
return readyState;
|
||||
}
|
||||
return value;
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
};
|
||||
|
||||
vimeo['set' + capName] = function (value) {
|
||||
if (vimeoPlayer !== null) {
|
||||
switch (propName) {
|
||||
case 'src':
|
||||
var _url2 = typeof value === 'string' ? value : value[0].src,
|
||||
videoId = VimeoApi.getVimeoId(_url2);
|
||||
|
||||
vimeoPlayer.loadVideo(videoId).then(function () {
|
||||
if (mediaElement.originalNode.autoplay) {
|
||||
vimeoPlayer.play();
|
||||
}
|
||||
}).catch(function (error) {
|
||||
return errorHandler(error);
|
||||
});
|
||||
break;
|
||||
case 'currentTime':
|
||||
vimeoPlayer.setCurrentTime(value).then(function () {
|
||||
currentTime = value;
|
||||
setTimeout(function () {
|
||||
var event = mejs.Utils.createEvent('timeupdate', vimeo);
|
||||
mediaElement.dispatchEvent(event);
|
||||
}, 50);
|
||||
}).catch(function (error) {
|
||||
return errorHandler(error);
|
||||
});
|
||||
break;
|
||||
case 'volume':
|
||||
vimeoPlayer.setVolume(value).then(function () {
|
||||
volume = value;
|
||||
oldVolume = volume;
|
||||
setTimeout(function () {
|
||||
var event = mejs.Utils.createEvent('volumechange', vimeo);
|
||||
mediaElement.dispatchEvent(event);
|
||||
}, 50);
|
||||
}).catch(function (error) {
|
||||
return errorHandler(error);
|
||||
});
|
||||
break;
|
||||
case 'loop':
|
||||
vimeoPlayer.setLoop(value).catch(function (error) {
|
||||
return errorHandler(error);
|
||||
});
|
||||
break;
|
||||
case 'muted':
|
||||
if (value) {
|
||||
vimeoPlayer.setVolume(0).then(function () {
|
||||
volume = 0;
|
||||
setTimeout(function () {
|
||||
var event = mejs.Utils.createEvent('volumechange', vimeo);
|
||||
mediaElement.dispatchEvent(event);
|
||||
}, 50);
|
||||
}).catch(function (error) {
|
||||
return errorHandler(error);
|
||||
});
|
||||
} else {
|
||||
vimeoPlayer.setVolume(oldVolume).then(function () {
|
||||
volume = oldVolume;
|
||||
setTimeout(function () {
|
||||
var event = mejs.Utils.createEvent('volumechange', vimeo);
|
||||
mediaElement.dispatchEvent(event);
|
||||
}, 50);
|
||||
}).catch(function (error) {
|
||||
return errorHandler(error);
|
||||
});
|
||||
}
|
||||
break;
|
||||
case 'readyState':
|
||||
var event = mejs.Utils.createEvent('canplay', vimeo);
|
||||
mediaElement.dispatchEvent(event);
|
||||
break;
|
||||
default:
|
||||
|
||||
break;
|
||||
}
|
||||
} else {
|
||||
apiStack.push({ type: 'set', propName: propName, value: value });
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
for (var i = 0, total = props.length; i < total; i++) {
|
||||
assignGettersSetters(props[i]);
|
||||
}
|
||||
|
||||
var methods = mejs.html5media.methods,
|
||||
assignMethods = function assignMethods(methodName) {
|
||||
vimeo[methodName] = function () {
|
||||
if (vimeoPlayer !== null) {
|
||||
switch (methodName) {
|
||||
case 'play':
|
||||
paused = false;
|
||||
return vimeoPlayer.play();
|
||||
case 'pause':
|
||||
paused = true;
|
||||
return vimeoPlayer.pause();
|
||||
case 'load':
|
||||
return null;
|
||||
}
|
||||
} else {
|
||||
apiStack.push({ type: 'call', methodName: methodName });
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
for (var _i = 0, _total = methods.length; _i < _total; _i++) {
|
||||
assignMethods(methods[_i]);
|
||||
}
|
||||
|
||||
window['__ready__' + vimeo.id] = function (_vimeoPlayer) {
|
||||
|
||||
mediaElement.vimeoPlayer = vimeoPlayer = _vimeoPlayer;
|
||||
|
||||
if (apiStack.length) {
|
||||
for (var _i2 = 0, _total2 = apiStack.length; _i2 < _total2; _i2++) {
|
||||
var stackItem = apiStack[_i2];
|
||||
|
||||
if (stackItem.type === 'set') {
|
||||
var propName = stackItem.propName,
|
||||
capName = '' + propName.substring(0, 1).toUpperCase() + propName.substring(1);
|
||||
|
||||
vimeo['set' + capName](stackItem.value);
|
||||
} else if (stackItem.type === 'call') {
|
||||
vimeo[stackItem.methodName]();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (mediaElement.originalNode.muted) {
|
||||
vimeoPlayer.setVolume(0);
|
||||
volume = 0;
|
||||
}
|
||||
|
||||
var vimeoIframe = document.getElementById(vimeo.id);
|
||||
var events = void 0;
|
||||
|
||||
events = ['mouseover', 'mouseout'];
|
||||
|
||||
var assignEvents = function assignEvents(e) {
|
||||
var event = mejs.Utils.createEvent(e.type, vimeo);
|
||||
mediaElement.dispatchEvent(event);
|
||||
};
|
||||
|
||||
for (var _i3 = 0, _total3 = events.length; _i3 < _total3; _i3++) {
|
||||
vimeoIframe.addEventListener(events[_i3], assignEvents, false);
|
||||
}
|
||||
|
||||
vimeoPlayer.on('loaded', function () {
|
||||
vimeoPlayer.getDuration().then(function (loadProgress) {
|
||||
duration = loadProgress;
|
||||
if (duration > 0) {
|
||||
bufferedTime = duration * loadProgress;
|
||||
if (mediaElement.originalNode.autoplay) {
|
||||
paused = false;
|
||||
ended = false;
|
||||
var event = mejs.Utils.createEvent('play', vimeo);
|
||||
mediaElement.dispatchEvent(event);
|
||||
}
|
||||
}
|
||||
}).catch(function (error) {
|
||||
errorHandler(error, vimeo);
|
||||
});
|
||||
});
|
||||
vimeoPlayer.on('progress', function () {
|
||||
vimeoPlayer.getDuration().then(function (loadProgress) {
|
||||
duration = loadProgress;
|
||||
|
||||
if (duration > 0) {
|
||||
bufferedTime = duration * loadProgress;
|
||||
if (mediaElement.originalNode.autoplay) {
|
||||
var initEvent = mejs.Utils.createEvent('play', vimeo);
|
||||
mediaElement.dispatchEvent(initEvent);
|
||||
|
||||
var playingEvent = mejs.Utils.createEvent('playing', vimeo);
|
||||
mediaElement.dispatchEvent(playingEvent);
|
||||
}
|
||||
}
|
||||
|
||||
var event = mejs.Utils.createEvent('progress', vimeo);
|
||||
mediaElement.dispatchEvent(event);
|
||||
}).catch(function (error) {
|
||||
return errorHandler(error);
|
||||
});
|
||||
});
|
||||
vimeoPlayer.on('timeupdate', function () {
|
||||
vimeoPlayer.getCurrentTime().then(function (seconds) {
|
||||
currentTime = seconds;
|
||||
var event = mejs.Utils.createEvent('timeupdate', vimeo);
|
||||
mediaElement.dispatchEvent(event);
|
||||
}).catch(function (error) {
|
||||
return errorHandler(error);
|
||||
});
|
||||
});
|
||||
vimeoPlayer.on('play', function () {
|
||||
paused = false;
|
||||
ended = false;
|
||||
var event = mejs.Utils.createEvent('play', vimeo);
|
||||
mediaElement.dispatchEvent(event);
|
||||
|
||||
var playingEvent = mejs.Utils.createEvent('playing', vimeo);
|
||||
mediaElement.dispatchEvent(playingEvent);
|
||||
});
|
||||
vimeoPlayer.on('pause', function () {
|
||||
paused = true;
|
||||
ended = false;
|
||||
|
||||
var event = mejs.Utils.createEvent('pause', vimeo);
|
||||
mediaElement.dispatchEvent(event);
|
||||
});
|
||||
vimeoPlayer.on('ended', function () {
|
||||
paused = false;
|
||||
ended = true;
|
||||
|
||||
var event = mejs.Utils.createEvent('ended', vimeo);
|
||||
mediaElement.dispatchEvent(event);
|
||||
});
|
||||
|
||||
events = ['rendererready', 'loadedmetadata', 'loadeddata', 'canplay'];
|
||||
|
||||
for (var _i4 = 0, _total4 = events.length; _i4 < _total4; _i4++) {
|
||||
var event = mejs.Utils.createEvent(events[_i4], vimeo);
|
||||
mediaElement.dispatchEvent(event);
|
||||
}
|
||||
};
|
||||
|
||||
var height = mediaElement.originalNode.height,
|
||||
width = mediaElement.originalNode.width,
|
||||
vimeoContainer = document.createElement('iframe'),
|
||||
standardUrl = 'https://player.vimeo.com/video/' + VimeoApi.getVimeoId(mediaFiles[0].src);
|
||||
|
||||
var queryArgs = ~mediaFiles[0].src.indexOf('?') ? '?' + mediaFiles[0].src.slice(mediaFiles[0].src.indexOf('?') + 1) : '';
|
||||
var args = [];
|
||||
|
||||
if (mediaElement.originalNode.autoplay && queryArgs.indexOf('autoplay') === -1) {
|
||||
args.push('autoplay=1');
|
||||
}
|
||||
if (mediaElement.originalNode.loop && queryArgs.indexOf('loop') === -1) {
|
||||
args.push('loop=1');
|
||||
}
|
||||
|
||||
queryArgs = '' + queryArgs + (queryArgs ? '&' : '?') + args.join('&');
|
||||
|
||||
vimeoContainer.setAttribute('id', vimeo.id);
|
||||
vimeoContainer.setAttribute('width', width);
|
||||
vimeoContainer.setAttribute('height', height);
|
||||
vimeoContainer.setAttribute('frameBorder', '0');
|
||||
vimeoContainer.setAttribute('src', '' + standardUrl + queryArgs);
|
||||
vimeoContainer.setAttribute('webkitallowfullscreen', 'true');
|
||||
vimeoContainer.setAttribute('mozallowfullscreen', 'true');
|
||||
vimeoContainer.setAttribute('allowfullscreen', 'true');
|
||||
vimeoContainer.setAttribute('allow', 'autoplay');
|
||||
|
||||
mediaElement.originalNode.parentNode.insertBefore(vimeoContainer, mediaElement.originalNode);
|
||||
mediaElement.originalNode.style.display = 'none';
|
||||
|
||||
VimeoApi.load({
|
||||
iframe: vimeoContainer,
|
||||
id: vimeo.id
|
||||
});
|
||||
|
||||
vimeo.hide = function () {
|
||||
vimeo.pause();
|
||||
if (vimeoPlayer) {
|
||||
vimeoContainer.style.display = 'none';
|
||||
}
|
||||
};
|
||||
vimeo.setSize = function (width, height) {
|
||||
vimeoContainer.setAttribute('width', width);
|
||||
vimeoContainer.setAttribute('height', height);
|
||||
};
|
||||
vimeo.show = function () {
|
||||
if (vimeoPlayer) {
|
||||
vimeoContainer.style.display = '';
|
||||
}
|
||||
};
|
||||
|
||||
vimeo.destroy = function () {};
|
||||
|
||||
return vimeo;
|
||||
}
|
||||
};
|
||||
|
||||
mejs.Utils.typeChecks.push(function (url) {
|
||||
return (/(\/\/player\.vimeo|vimeo\.com)/i.test(url) ? 'video/x-vimeo' : null
|
||||
);
|
||||
});
|
||||
|
||||
mejs.Renderers.add(vimeoIframeRenderer);
|
||||
|
||||
},{}]},{},[1]);
|
||||
@@ -0,0 +1,12 @@
|
||||
/*!
|
||||
* MediaElement.js
|
||||
* http://www.mediaelementjs.com/
|
||||
*
|
||||
* Wrapper that mimics native HTML5 MediaElement (audio and video)
|
||||
* using a variety of technologies (pure JavaScript, Flash, iframe)
|
||||
*
|
||||
* Copyright 2010-2017, John Dyer (http://j.hn/)
|
||||
* License: MIT
|
||||
*
|
||||
*/
|
||||
!function a(o,s,u){function c(n,e){if(!s[n]){if(!o[n]){var t="function"==typeof require&&require;if(!e&&t)return t(n,!0);if(l)return l(n,!0);var r=new Error("Cannot find module '"+n+"'");throw r.code="MODULE_NOT_FOUND",r}var i=s[n]={exports:{}};o[n][0].call(i.exports,function(e){var t=o[n][1][e];return c(t||e)},i,i.exports,a,o,s,u)}return s[n].exports}for(var l="function"==typeof require&&require,e=0;e<u.length;e++)c(u[e]);return c}({1:[function(e,t,n){"use strict";var T={promise:null,load:function(e){"undefined"!=typeof Vimeo?T._createPlayer(e):(T.promise=T.promise||mejs.Utils.loadScript("https://player.vimeo.com/api/player.js"),T.promise.then(function(){T._createPlayer(e)}))},_createPlayer:function(e){var t=new Vimeo.Player(e.iframe);window["__ready__"+e.id](t)},getVimeoId:function(e){if(null==e)return null;var t=(e=e.split("?")[0]).match(/https:\/\/player.vimeo.com\/video\/(\d+)$/);if(t)return parseInt(t[1],10);var n=e.match(/https:\/\/vimeo.com\/(\d+)$/);if(n)return parseInt(n[1],10);var r=e.match(/https:\/\/vimeo.com\/(\d+)\/\w+$/);return r?parseInt(r[1],10):NaN}},r={name:"vimeo_iframe",options:{prefix:"vimeo_iframe"},canPlayType:function(e){return~["video/vimeo","video/x-vimeo"].indexOf(e.toLowerCase())},create:function(f,e,t){var v=[],h={},y=!0,g=1,a=g,E=0,j=0,U=!1,b=0,w=null,n="";h.options=e,h.id=f.id+"_"+e.prefix,h.mediaElement=f;for(var N=function(e){f.generateError("Code "+e.name+": "+e.message,t)},r=mejs.html5media.properties,i=function(i){var e=""+i.substring(0,1).toUpperCase()+i.substring(1);h["get"+e]=function(){if(null!==w){switch(i){case"currentTime":return E;case"duration":return b;case"volume":return g;case"muted":return 0===g;case"paused":return y;case"ended":return U;case"src":return w.getVideoUrl().then(function(e){n=e}).catch(function(e){return N(e)}),n;case"buffered":return{start:function(){return 0},end:function(){return j*b},length:1};case"readyState":return 4}return null}return null},h["set"+e]=function(e){if(null!==w)switch(i){case"src":var t="string"==typeof e?e:e[0].src,n=T.getVimeoId(t);w.loadVideo(n).then(function(){f.originalNode.autoplay&&w.play()}).catch(function(e){return N(e)});break;case"currentTime":w.setCurrentTime(e).then(function(){E=e,setTimeout(function(){var e=mejs.Utils.createEvent("timeupdate",h);f.dispatchEvent(e)},50)}).catch(function(e){return N(e)});break;case"volume":w.setVolume(e).then(function(){a=g=e,setTimeout(function(){var e=mejs.Utils.createEvent("volumechange",h);f.dispatchEvent(e)},50)}).catch(function(e){return N(e)});break;case"loop":w.setLoop(e).catch(function(e){return N(e)});break;case"muted":e?w.setVolume(0).then(function(){g=0,setTimeout(function(){var e=mejs.Utils.createEvent("volumechange",h);f.dispatchEvent(e)},50)}).catch(function(e){return N(e)}):w.setVolume(a).then(function(){g=a,setTimeout(function(){var e=mejs.Utils.createEvent("volumechange",h);f.dispatchEvent(e)},50)}).catch(function(e){return N(e)});break;case"readyState":var r=mejs.Utils.createEvent("canplay",h);f.dispatchEvent(r)}else v.push({type:"set",propName:i,value:e})}},o=0,s=r.length;o<s;o++)i(r[o]);for(var u=mejs.html5media.methods,c=function(e){h[e]=function(){if(null!==w)switch(e){case"play":return y=!1,w.play();case"pause":return y=!0,w.pause();case"load":return null}else v.push({type:"call",methodName:e})}},l=0,d=u.length;l<d;l++)c(u[l]);window["__ready__"+h.id]=function(e){if(f.vimeoPlayer=w=e,v.length)for(var t=0,n=v.length;t<n;t++){var r=v[t];if("set"===r.type){var i=r.propName,a=""+i.substring(0,1).toUpperCase()+i.substring(1);h["set"+a](r.value)}else"call"===r.type&&h[r.methodName]()}f.originalNode.muted&&(w.setVolume(0),g=0);for(var o=document.getElementById(h.id),s=void 0,u=function(e){var t=mejs.Utils.createEvent(e.type,h);f.dispatchEvent(t)},c=0,l=(s=["mouseover","mouseout"]).length;c<l;c++)o.addEventListener(s[c],u,!1);w.on("loaded",function(){w.getDuration().then(function(e){if(0<(b=e)&&(j=b*e,f.originalNode.autoplay)){U=y=!1;var t=mejs.Utils.createEvent("play",h);f.dispatchEvent(t)}}).catch(function(e){N(e)})}),w.on("progress",function(){w.getDuration().then(function(e){if(0<(b=e)&&(j=b*e,f.originalNode.autoplay)){var t=mejs.Utils.createEvent("play",h);f.dispatchEvent(t);var n=mejs.Utils.createEvent("playing",h);f.dispatchEvent(n)}var r=mejs.Utils.createEvent("progress",h);f.dispatchEvent(r)}).catch(function(e){return N(e)})}),w.on("timeupdate",function(){w.getCurrentTime().then(function(e){E=e;var t=mejs.Utils.createEvent("timeupdate",h);f.dispatchEvent(t)}).catch(function(e){return N(e)})}),w.on("play",function(){U=y=!1;var e=mejs.Utils.createEvent("play",h);f.dispatchEvent(e);var t=mejs.Utils.createEvent("playing",h);f.dispatchEvent(t)}),w.on("pause",function(){y=!0,U=!1;var e=mejs.Utils.createEvent("pause",h);f.dispatchEvent(e)}),w.on("ended",function(){y=!1,U=!0;var e=mejs.Utils.createEvent("ended",h);f.dispatchEvent(e)});for(var d=0,p=(s=["rendererready","loadedmetadata","loadeddata","canplay"]).length;d<p;d++){var m=mejs.Utils.createEvent(s[d],h)Line truncated
|
||||
@@ -0,0 +1,293 @@
|
||||
.mejs-container {
|
||||
clear: both;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.mejs-container * {
|
||||
font-family: Helvetica, Arial;
|
||||
}
|
||||
|
||||
.mejs-container,
|
||||
.mejs-embed,
|
||||
.mejs-embed body,
|
||||
.mejs-container .mejs-controls {
|
||||
background: #222;
|
||||
}
|
||||
|
||||
.mejs-time {
|
||||
font-weight: normal;
|
||||
word-wrap: normal;
|
||||
}
|
||||
|
||||
.mejs-controls a.mejs-horizontal-volume-slider {
|
||||
display: table;
|
||||
}
|
||||
|
||||
.mejs-controls .mejs-time-rail .mejs-time-loaded,
|
||||
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.mejs-controls .mejs-time-rail .mejs-time-current {
|
||||
background: #0073aa;
|
||||
}
|
||||
|
||||
.mejs-controls .mejs-time-rail .mejs-time-total,
|
||||
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {
|
||||
background: rgba(255, 255, 255, .33);
|
||||
}
|
||||
|
||||
.mejs-controls .mejs-time-rail span,
|
||||
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total,
|
||||
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.mejs-overlay-loading {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
/* Override theme styles that may conflict with controls. */
|
||||
.mejs-controls button:hover {
|
||||
border: none;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.me-cannotplay {
|
||||
width: auto !important;
|
||||
}
|
||||
|
||||
.media-embed-details .wp-audio-shortcode {
|
||||
display: inline-block;
|
||||
max-width: 400px;
|
||||
}
|
||||
|
||||
.audio-details .embed-media-settings {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.media-embed-details .embed-media-settings .setting span:not(.button-group) {
|
||||
max-width: 400px; /* Back-compat for pre-5.3 */
|
||||
width: auto; /* Back-compat for pre-5.3 */
|
||||
}
|
||||
|
||||
.media-embed-details .embed-media-settings .checkbox-setting span {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.media-embed-details .embed-media-settings {
|
||||
padding-top: 0;
|
||||
top: 28px;
|
||||
}
|
||||
|
||||
.media-embed-details .instructions {
|
||||
padding: 16px 0;
|
||||
max-width: 600px;
|
||||
}
|
||||
|
||||
.media-embed-details .setting p,
|
||||
.media-embed-details .setting .remove-setting {
|
||||
color: #a00;
|
||||
font-size: 10px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.media-embed-details .setting .remove-setting {
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.media-embed-details .setting a:hover {
|
||||
color: #dc3232;
|
||||
}
|
||||
|
||||
.media-embed-details .embed-media-settings .checkbox-setting {
|
||||
float: none;
|
||||
margin: 0 0 10px;
|
||||
}
|
||||
|
||||
.wp-video {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.wp_attachment_holder .wp-video,
|
||||
.wp_attachment_holder .wp-audio-shortcode {
|
||||
margin-top: 18px;
|
||||
}
|
||||
|
||||
video.wp-video-shortcode,
|
||||
.wp-video-shortcode video {
|
||||
max-width: 100%;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.video-details .wp-video-holder {
|
||||
width: 100%;
|
||||
max-width: 640px;
|
||||
}
|
||||
|
||||
.wp-playlist {
|
||||
border: 1px solid #ccc;
|
||||
padding: 10px;
|
||||
margin: 12px 0 18px;
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.wp-admin .wp-playlist {
|
||||
margin: 0 0 18px;
|
||||
}
|
||||
|
||||
.wp-playlist video {
|
||||
display: inline-block;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.wp-playlist audio {
|
||||
display: none;
|
||||
max-width: 100%;
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
.wp-playlist .mejs-container {
|
||||
margin: 0;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.wp-playlist .mejs-controls .mejs-button button {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.wp-playlist-light {
|
||||
background: #fff;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.wp-playlist-dark {
|
||||
color: #fff;
|
||||
background: #000;
|
||||
}
|
||||
|
||||
.wp-playlist-caption {
|
||||
display: block;
|
||||
max-width: 88%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.wp-playlist-item .wp-playlist-caption {
|
||||
text-decoration: none;
|
||||
color: #000;
|
||||
max-width: -webkit-calc(100% - 40px);
|
||||
max-width: calc(100% - 40px);
|
||||
}
|
||||
|
||||
.wp-playlist-item-meta {
|
||||
display: block;
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.wp-playlist-item-title {
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.wp-playlist-item-album {
|
||||
font-style: italic;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.wp-playlist-item-artist {
|
||||
font-size: 12px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.wp-playlist-item-length {
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
top: 0;
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.rtl .wp-playlist-item-length {
|
||||
left: 3px;
|
||||
right: auto;
|
||||
}
|
||||
|
||||
.wp-playlist-tracks {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.wp-playlist-item {
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
padding: 0 3px;
|
||||
border-bottom: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.wp-playlist-item:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.wp-playlist-light .wp-playlist-caption {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.wp-playlist-dark .wp-playlist-caption {
|
||||
color: #ddd;
|
||||
}
|
||||
|
||||
.wp-playlist-playing {
|
||||
font-weight: bold;
|
||||
background: #f7f7f7;
|
||||
}
|
||||
|
||||
.wp-playlist-light .wp-playlist-playing {
|
||||
background: #fff;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.wp-playlist-dark .wp-playlist-playing {
|
||||
background: #000;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.wp-playlist-current-item {
|
||||
overflow: hidden;
|
||||
margin-bottom: 10px;
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.wp-playlist .wp-playlist-current-item img {
|
||||
float: left;
|
||||
max-width: 60px;
|
||||
height: auto;
|
||||
margin-right: 10px;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.rtl .wp-playlist .wp-playlist-current-item img {
|
||||
float: right;
|
||||
margin-left: 10px;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.wp-playlist-current-item .wp-playlist-item-title,
|
||||
.wp-playlist-current-item .wp-playlist-item-artist {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.wp-audio-playlist .me-cannotplay span {
|
||||
padding: 5px 15px;
|
||||
}
|
||||
@@ -0,0 +1,100 @@
|
||||
/* global _wpmejsSettings, mejsL10n */
|
||||
(function( window, $ ) {
|
||||
|
||||
window.wp = window.wp || {};
|
||||
|
||||
function wpMediaElement() {
|
||||
var settings = {};
|
||||
|
||||
/**
|
||||
* Initialize media elements.
|
||||
*
|
||||
* Ensures media elements that have already been initialized won't be
|
||||
* processed again.
|
||||
*
|
||||
* @memberOf wp.mediaelement
|
||||
*
|
||||
* @since 4.4.0
|
||||
*
|
||||
* @return {void}
|
||||
*/
|
||||
function initialize() {
|
||||
var selectors = [];
|
||||
|
||||
if ( typeof _wpmejsSettings !== 'undefined' ) {
|
||||
settings = $.extend( true, {}, _wpmejsSettings );
|
||||
}
|
||||
settings.classPrefix = 'mejs-';
|
||||
settings.success = settings.success || function ( mejs ) {
|
||||
var autoplay, loop;
|
||||
|
||||
if ( mejs.rendererName && -1 !== mejs.rendererName.indexOf( 'flash' ) ) {
|
||||
autoplay = mejs.attributes.autoplay && 'false' !== mejs.attributes.autoplay;
|
||||
loop = mejs.attributes.loop && 'false' !== mejs.attributes.loop;
|
||||
|
||||
if ( autoplay ) {
|
||||
mejs.addEventListener( 'canplay', function() {
|
||||
mejs.play();
|
||||
}, false );
|
||||
}
|
||||
|
||||
if ( loop ) {
|
||||
mejs.addEventListener( 'ended', function() {
|
||||
mejs.play();
|
||||
}, false );
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Custom error handler.
|
||||
*
|
||||
* Sets up a custom error handler in case a video render fails, and provides a download
|
||||
* link as the fallback.
|
||||
*
|
||||
* @since 4.9.3
|
||||
*
|
||||
* @param {object} media The wrapper that mimics all the native events/properties/methods for all renderers.
|
||||
* @param {object} node The original HTML video, audio, or iframe tag where the media was loaded.
|
||||
* @return {string}
|
||||
*/
|
||||
settings.customError = function ( media, node ) {
|
||||
// Make sure we only fall back to a download link for flash files.
|
||||
if ( -1 !== media.rendererName.indexOf( 'flash' ) || -1 !== media.rendererName.indexOf( 'flv' ) ) {
|
||||
return '<a href="' + node.src + '">' + mejsL10n.strings['mejs.download-file'] + '</a>';
|
||||
}
|
||||
};
|
||||
|
||||
if ( 'undefined' === typeof settings.videoShortcodeLibrary || 'mediaelement' === settings.videoShortcodeLibrary ) {
|
||||
selectors.push( '.wp-video-shortcode' );
|
||||
}
|
||||
if ( 'undefined' === typeof settings.audioShortcodeLibrary || 'mediaelement' === settings.audioShortcodeLibrary ) {
|
||||
selectors.push( '.wp-audio-shortcode' );
|
||||
}
|
||||
if ( ! selectors.length ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Only initialize new media elements.
|
||||
$( selectors.join( ', ' ) )
|
||||
.not( '.mejs-container' )
|
||||
.filter(function () {
|
||||
return ! $( this ).parent().hasClass( 'mejs-mediaelement' );
|
||||
})
|
||||
.mediaelementplayer( settings );
|
||||
}
|
||||
|
||||
return {
|
||||
initialize: initialize
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* @namespace wp.mediaelement
|
||||
* @memberOf wp
|
||||
*/
|
||||
window.wp.mediaelement = new wpMediaElement();
|
||||
|
||||
$( window.wp.mediaelement.initialize );
|
||||
|
||||
})( window, jQuery );
|
||||
@@ -0,0 +1 @@
|
||||
.mejs-container{clear:both;max-width:100%}.mejs-container *{font-family:Helvetica,Arial}.mejs-container,.mejs-container .mejs-controls,.mejs-embed,.mejs-embed body{background:#222}.mejs-time{font-weight:400;word-wrap:normal}.mejs-controls a.mejs-horizontal-volume-slider{display:table}.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current,.mejs-controls .mejs-time-rail .mejs-time-loaded{background:#fff}.mejs-controls .mejs-time-rail .mejs-time-current{background:#0073aa}.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total,.mejs-controls .mejs-time-rail .mejs-time-total{background:rgba(255,255,255,.33)}.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current,.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total,.mejs-controls .mejs-time-rail span{border-radius:0}.mejs-overlay-loading{background:0 0}.mejs-controls button:hover{border:none;-webkit-box-shadow:none;box-shadow:none}.me-cannotplay{width:auto!important}.media-embed-details .wp-audio-shortcode{display:inline-block;max-width:400px}.audio-details .embed-media-settings{overflow:visible}.media-embed-details .embed-media-settings .setting span:not(.button-group){max-width:400px;width:auto}.media-embed-details .embed-media-settings .checkbox-setting span{display:inline-block}.media-embed-details .embed-media-settings{padding-top:0;top:28px}.media-embed-details .instructions{padding:16px 0;max-width:600px}.media-embed-details .setting .remove-setting,.media-embed-details .setting p{color:#a00;font-size:10px;text-transform:uppercase}.media-embed-details .setting .remove-setting{padding:5px 0}.media-embed-details .setting a:hover{color:#dc3232}.media-embed-details .embed-media-settings .checkbox-setting{float:none;margin:0 0 10px}.wp-video{max-width:100%;height:auto}.wp_attachment_holder .wp-audio-shortcode,.wp_attachment_holder .wp-video{margin-top:18px}.wp-video-shortcode video,video.wp-video-shortcode{max-width:100%;display:inline-block}.video-details .wp-video-holder{width:100%;max-width:640px}.wp-playlist{border:1px solid #ccc;padding:10px;margin:12px 0 18px;font-size:14px;line-height:1.5}.wp-admin .wp-playlist{margin:0 0 18px}.wp-playlist video{display:inline-block;max-width:100%}.wp-playlist audio{display:none;max-width:100%;width:400px}.wp-playlist .mejs-container{margin:0;max-width:100%}.wp-playlist .mejs-controls .mejs-button button{outline:0}.wp-playlist-light{background:#fff;color:#000}.wp-playlist-dark{color:#fff;background:#000}.wp-playlist-caption{display:block;max-width:88%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;line-height:1.5}.wp-playlist-item .wp-playlist-caption{text-decoration:none;color:#000;max-width:-webkit-calc(100% - 40px);max-width:calc(100% - 40px)}.wp-playlist-item-meta{display:block;font-size:14px;line-height:1.5}.wp-playlist-item-title{font-size:14px;line-height:1.5}.wp-playlist-item-album{font-style:italic;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wp-playlist-item-artist{font-size:12px;text-transform:uppercase}.wp-playlist-item-length{position:absolute;right:3px;top:0;font-size:14px;line-height:1.5}.rtl .wp-playlist-item-length{left:3px;right:auto}.wp-playlist-tracks{margin-top:10px}.wp-playlist-item{position:relative;cursor:pointer;padding:0 3px;border-bottom:1px solid #ccc}.wp-playlist-item:last-child{border-bottom:0}.wp-playlist-light .wp-playlist-caption{color:#333}.wp-playlist-dark .wp-playlist-caption{color:#ddd}.wp-playlist-playing{font-weight:700;background:#f7f7f7}.wp-playlist-light .wp-playlist-playing{background:#fff;color:#000}.wp-playlist-dark .wp-playlist-playing{background:#000;color:#fff}.wp-playlist-current-item{overflow:hidden;margin-bottom:10px;height:60px}.wp-playlist .wp-playlist-current-item img{float:left;max-width:60px;height:auto;margin-right:10px;padding:0;border:0}.rtl .wp-playlist .wp-playlist-current-item img{float:right;margin-left:10px;margin-right:0}.wp-playlist-current-item .wp-playlist-item-artist,.wp-playlist-current-item .wp-playlist-item-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wp-audio-playlist .me-cannotplay span{padding:5px 15px}
|
||||
@@ -0,0 +1 @@
|
||||
!function(e,n){e.wp=e.wp||{},e.wp.mediaelement=new function(){var t={};return{initialize:function(){var e=[];(t="undefined"!=typeof _wpmejsSettings?n.extend(!0,{},_wpmejsSettings):t).classPrefix="mejs-",t.success=t.success||function(e){var t,n;e.rendererName&&-1!==e.rendererName.indexOf("flash")&&(t=e.attributes.autoplay&&"false"!==e.attributes.autoplay,n=e.attributes.loop&&"false"!==e.attributes.loop,t&&e.addEventListener("canplay",function(){e.play()},!1),n)&&e.addEventListener("ended",function(){e.play()},!1)},t.customError=function(e,t){if(-1!==e.rendererName.indexOf("flash")||-1!==e.rendererName.indexOf("flv"))return'<a href="'+t.src+'">'+mejsL10n.strings["mejs.download-file"]+"</a>"},void 0!==t.videoShortcodeLibrary&&"mediaelement"!==t.videoShortcodeLibrary||e.push(".wp-video-shortcode"),void 0!==t.audioShortcodeLibrary&&"mediaelement"!==t.audioShortcodeLibrary||e.push(".wp-audio-shortcode"),e.length&&n(e.join(", ")).not(".mejs-container").filter(function(){return!n(this).parent().hasClass("mejs-mediaelement")}).mediaelementplayer(t)}}},n(e.wp.mediaelement.initialize)}(window,jQuery);
|
||||
@@ -0,0 +1,205 @@
|
||||
/* global _wpmejsSettings, MediaElementPlayer */
|
||||
|
||||
(function ($, _, Backbone) {
|
||||
'use strict';
|
||||
|
||||
/** @namespace wp */
|
||||
window.wp = window.wp || {};
|
||||
|
||||
var WPPlaylistView = Backbone.View.extend(/** @lends WPPlaylistView.prototype */{
|
||||
/**
|
||||
* @constructs
|
||||
*
|
||||
* @param {Object} options The options to create this playlist view with.
|
||||
* @param {Object} options.metadata The metadata
|
||||
*/
|
||||
initialize : function (options) {
|
||||
this.index = 0;
|
||||
this.settings = {};
|
||||
this.data = options.metadata || $.parseJSON( this.$('script.wp-playlist-script').html() );
|
||||
this.playerNode = this.$( this.data.type );
|
||||
|
||||
this.tracks = new Backbone.Collection( this.data.tracks );
|
||||
this.current = this.tracks.first();
|
||||
|
||||
if ( 'audio' === this.data.type ) {
|
||||
this.currentTemplate = wp.template( 'wp-playlist-current-item' );
|
||||
this.currentNode = this.$( '.wp-playlist-current-item' );
|
||||
}
|
||||
|
||||
this.renderCurrent();
|
||||
|
||||
if ( this.data.tracklist ) {
|
||||
this.itemTemplate = wp.template( 'wp-playlist-item' );
|
||||
this.playingClass = 'wp-playlist-playing';
|
||||
this.renderTracks();
|
||||
}
|
||||
|
||||
this.playerNode.attr( 'src', this.current.get( 'src' ) );
|
||||
|
||||
_.bindAll( this, 'bindPlayer', 'bindResetPlayer', 'setPlayer', 'ended', 'clickTrack' );
|
||||
|
||||
if ( ! _.isUndefined( window._wpmejsSettings ) ) {
|
||||
this.settings = _.clone( _wpmejsSettings );
|
||||
}
|
||||
this.settings.success = this.bindPlayer;
|
||||
this.setPlayer();
|
||||
},
|
||||
|
||||
bindPlayer : function (mejs) {
|
||||
this.mejs = mejs;
|
||||
this.mejs.addEventListener( 'ended', this.ended );
|
||||
},
|
||||
|
||||
bindResetPlayer : function (mejs) {
|
||||
this.bindPlayer( mejs );
|
||||
this.playCurrentSrc();
|
||||
},
|
||||
|
||||
setPlayer: function (force) {
|
||||
if ( this.player ) {
|
||||
this.player.pause();
|
||||
this.player.remove();
|
||||
this.playerNode = this.$( this.data.type );
|
||||
}
|
||||
|
||||
if (force) {
|
||||
this.playerNode.attr( 'src', this.current.get( 'src' ) );
|
||||
this.settings.success = this.bindResetPlayer;
|
||||
}
|
||||
|
||||
// This is also our bridge to the outside world.
|
||||
this.player = new MediaElementPlayer( this.playerNode.get(0), this.settings );
|
||||
},
|
||||
|
||||
playCurrentSrc : function () {
|
||||
this.renderCurrent();
|
||||
this.mejs.setSrc( this.playerNode.attr( 'src' ) );
|
||||
this.mejs.load();
|
||||
this.mejs.play();
|
||||
},
|
||||
|
||||
renderCurrent : function () {
|
||||
var dimensions, defaultImage = 'wp-includes/images/media/video.svg';
|
||||
if ( 'video' === this.data.type ) {
|
||||
if ( this.data.images && this.current.get( 'image' ) && -1 === this.current.get( 'image' ).src.indexOf( defaultImage ) ) {
|
||||
this.playerNode.attr( 'poster', this.current.get( 'image' ).src );
|
||||
}
|
||||
dimensions = this.current.get( 'dimensions' );
|
||||
if ( dimensions && dimensions.resized ) {
|
||||
this.playerNode.attr( dimensions.resized );
|
||||
}
|
||||
} else {
|
||||
if ( ! this.data.images ) {
|
||||
this.current.set( 'image', false );
|
||||
}
|
||||
this.currentNode.html( this.currentTemplate( this.current.toJSON() ) );
|
||||
}
|
||||
},
|
||||
|
||||
renderTracks : function () {
|
||||
var self = this, i = 1, tracklist = $( '<div class="wp-playlist-tracks"></div>' );
|
||||
this.tracks.each(function (model) {
|
||||
if ( ! self.data.images ) {
|
||||
model.set( 'image', false );
|
||||
}
|
||||
model.set( 'artists', self.data.artists );
|
||||
model.set( 'index', self.data.tracknumbers ? i : false );
|
||||
tracklist.append( self.itemTemplate( model.toJSON() ) );
|
||||
i += 1;
|
||||
});
|
||||
this.$el.append( tracklist );
|
||||
|
||||
this.$( '.wp-playlist-item' ).eq(0).addClass( this.playingClass );
|
||||
},
|
||||
|
||||
events : {
|
||||
'click .wp-playlist-item' : 'clickTrack',
|
||||
'click .wp-playlist-next' : 'next',
|
||||
'click .wp-playlist-prev' : 'prev'
|
||||
},
|
||||
|
||||
clickTrack : function (e) {
|
||||
e.preventDefault();
|
||||
|
||||
this.index = this.$( '.wp-playlist-item' ).index( e.currentTarget );
|
||||
this.setCurrent();
|
||||
},
|
||||
|
||||
ended : function () {
|
||||
if ( this.index + 1 < this.tracks.length ) {
|
||||
this.next();
|
||||
} else {
|
||||
this.index = 0;
|
||||
this.setCurrent();
|
||||
}
|
||||
},
|
||||
|
||||
next : function () {
|
||||
this.index = this.index + 1 >= this.tracks.length ? 0 : this.index + 1;
|
||||
this.setCurrent();
|
||||
},
|
||||
|
||||
prev : function () {
|
||||
this.index = this.index - 1 < 0 ? this.tracks.length - 1 : this.index - 1;
|
||||
this.setCurrent();
|
||||
},
|
||||
|
||||
loadCurrent : function () {
|
||||
var last = this.playerNode.attr( 'src' ) && this.playerNode.attr( 'src' ).split('.').pop(),
|
||||
current = this.current.get( 'src' ).split('.').pop();
|
||||
|
||||
this.mejs && this.mejs.pause();
|
||||
|
||||
if ( last !== current ) {
|
||||
this.setPlayer( true );
|
||||
} else {
|
||||
this.playerNode.attr( 'src', this.current.get( 'src' ) );
|
||||
this.playCurrentSrc();
|
||||
}
|
||||
},
|
||||
|
||||
setCurrent : function () {
|
||||
this.current = this.tracks.at( this.index );
|
||||
|
||||
if ( this.data.tracklist ) {
|
||||
this.$( '.wp-playlist-item' )
|
||||
.removeClass( this.playingClass )
|
||||
.eq( this.index )
|
||||
.addClass( this.playingClass );
|
||||
}
|
||||
|
||||
this.loadCurrent();
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* Initialize media playlists in the document.
|
||||
*
|
||||
* Only initializes new playlists not previously-initialized.
|
||||
*
|
||||
* @since 4.9.3
|
||||
* @return {void}
|
||||
*/
|
||||
function initialize() {
|
||||
$( '.wp-playlist:not(:has(.mejs-container))' ).each( function() {
|
||||
new WPPlaylistView( { el: this } );
|
||||
} );
|
||||
}
|
||||
|
||||
/**
|
||||
* Expose the API publicly on window.wp.playlist.
|
||||
*
|
||||
* @namespace wp.playlist
|
||||
* @since 4.9.3
|
||||
* @type {object}
|
||||
*/
|
||||
window.wp.playlist = {
|
||||
initialize: initialize
|
||||
};
|
||||
|
||||
$( document ).ready( initialize );
|
||||
|
||||
window.WPPlaylistView = WPPlaylistView;
|
||||
|
||||
}(jQuery, _, Backbone));
|
||||
@@ -0,0 +1 @@
|
||||
!function(r,e,i){"use strict";window.wp=window.wp||{};var t=i.View.extend({initialize:function(t){this.index=0,this.settings={},this.data=t.metadata||r.parseJSON(this.$("script.wp-playlist-script").html()),this.playerNode=this.$(this.data.type),this.tracks=new i.Collection(this.data.tracks),this.current=this.tracks.first(),"audio"===this.data.type&&(this.currentTemplate=wp.template("wp-playlist-current-item"),this.currentNode=this.$(".wp-playlist-current-item")),this.renderCurrent(),this.data.tracklist&&(this.itemTemplate=wp.template("wp-playlist-item"),this.playingClass="wp-playlist-playing",this.renderTracks()),this.playerNode.attr("src",this.current.get("src")),e.bindAll(this,"bindPlayer","bindResetPlayer","setPlayer","ended","clickTrack"),e.isUndefined(window._wpmejsSettings)||(this.settings=e.clone(_wpmejsSettings)),this.settings.success=this.bindPlayer,this.setPlayer()},bindPlayer:function(t){this.mejs=t,this.mejs.addEventListener("ended",this.ended)},bindResetPlayer:function(t){this.bindPlayer(t),this.playCurrentSrc()},setPlayer:function(t){this.player&&(this.player.pause(),this.player.remove(),this.playerNode=this.$(this.data.type)),t&&(this.playerNode.attr("src",this.current.get("src")),this.settings.success=this.bindResetPlayer),this.player=new MediaElementPlayer(this.playerNode.get(0),this.settings)},playCurrentSrc:function(){this.renderCurrent(),this.mejs.setSrc(this.playerNode.attr("src")),this.mejs.load(),this.mejs.play()},renderCurrent:function(){var t;"video"===this.data.type?(this.data.images&&this.current.get("image")&&-1===this.current.get("image").src.indexOf("wp-includes/images/media/video.svg")&&this.playerNode.attr("poster",this.current.get("image").src),(t=this.current.get("dimensions"))&&t.resized&&this.playerNode.attr(t.resized)):(this.data.images||this.current.set("image",!1),this.currentNode.html(this.currentTemplate(this.current.toJSON())))},renderTracks:function(){var e=this,i=1,s=r('<div class="wp-playlist-tracks"></div>');this.tracks.each(function(t){e.data.images||t.set("image",!1),t.set("artists",e.data.artists),t.set("index",!!e.data.tracknumbers&&i),s.append(e.itemTemplate(t.toJSON())),i+=1}),this.$el.append(s),this.$(".wp-playlist-item").eq(0).addClass(this.playingClass)},events:{"click .wp-playlist-item":"clickTrack","click .wp-playlist-next":"next","click .wp-playlist-prev":"prev"},clickTrack:function(t){t.preventDefault(),this.index=this.$(".wp-playlist-item").index(t.currentTarget),this.setCurrent()},ended:function(){this.index+1<this.tracks.length?this.next():(this.index=0,this.setCurrent())},next:function(){this.index=this.index+1>=this.tracks.length?0:this.index+1,this.setCurrent()},prev:function(){this.index=this.index-1<0?this.tracks.length-1:this.index-1,this.setCurrent()},loadCurrent:function(){var t=this.playerNode.attr("src")&&this.playerNode.attr("src").split(".").pop(),e=this.current.get("src").split(".").pop();this.mejs&&this.mejs.pause(),t!==e?this.setPlayer(!0):(this.playerNode.attr("src",this.current.get("src")),this.playCurrentSrc())},setCurrent:function(){this.current=this.tracks.at(this.index),this.data.tracklist&&this.$(".wp-playlist-item").removeClass(this.playingClass).eq(this.index).addClass(this.playingClass),this.loadCurrent()}});function s(){r(".wp-playlist:not(:has(.mejs-container))").each(function(){new t({el:this})})}window.wp.playlist={initialize:s},r(document).ready(s),window.WPPlaylistView=t}(jQuery,_,Backbone);
|
||||
Reference in new issue
Block a user