".concat(t,"
")})).join(""),this.art.emit("subtitle:update",this.activeCue.text))}},{key:"switch",value:function(t,e,n){var r=this,i=this.art,o=i.i18n,a=i.notice;return this.init(t,n).then((function(t){return e&&(a.show="".concat(o.get("Switch subtitle"),": ").concat(e)),r.art.emit("subtitle:switch",t),t}))}},{key:"init",value:function(t,e){var n=this,r=this.art,i=r.notice,o=r.template,a=o.$subtitle,c=o.$track;return fetch(t).then((function(t){return t.text()})).then((function(r){switch(n.art.emit("subtitle:load",t),e||D(t)){case"srt":return R($(r));case"ass":return R(C(r));case"vtt":return R(r);default:return t}})).then((function(t){return a.innerHTML="",n.url===t?t:(URL.revokeObjectURL(n.url),c.src=t,t)})).catch((function(t){throw i.show=t,n.art.emit("subtitle:err",t),t}))}},{key:"url",get:function(){return this.art.template.$track.src}},{key:"textTrack",get:function(){return this.art.template.$video.textTracks[0]}},{key:"activeCue",get:function(){return this.textTrack.activeCues[0]}}]),r}(ct);var Zt=function(){function e(n){var r=this;t(this,e),this.destroyEvents=[],this.proxy=this.proxy.bind(this),this.hover=this.hover.bind(this),this.loadImg=this.loadImg.bind(this),n.whitelist.state&&n.on("ready",(function(){!function(t,e){var n=t.template.$player;e.proxy(document,["click","contextmenu"],(function(e){e.composedPath().indexOf(n)>-1?(t.isFocus=!0,t.emit("focus")):(t.isFocus=!1,t.emit("blur"))}))}(n,r),function(t,e){var n=t.template.$player;e.hover(n,(function(){h(n,"art-hover"),t.emit("hoverenter")}),(function(){y(n,"art-hover"),t.emit("hoverleave")}))}(n,r),function(t,e){var n=t.template,r=n.$player,i=n.$video,o=t.player,a=t.controls,c=N((function(){h(r,"art-hide-cursor"),y(r,"art-hover"),a.show=!1}),3e3);t.on("hoverleave",(function(){o.playing&&c()})),e.proxy(r,"mousemove",(function(e){c.clearTimeout(),y(r,"art-hide-cursor"),a.show=!0,!o.pip&&o.playing&&e.target===i&&c(),t.emit("mousemove")}))}(n,r),function(t,e){var n=t.option,r=t.player,i=t.template.$player,o=document.createElement("object");o.setAttribute("aria-hidden","true"),o.setAttribute("tabindex",-1),o.type="text/html",o.data="about:blank";var a=r.width,c=r.height,u=I((function(){r.width===a&&r.height===c||(a=r.width,c=r.height,n.autoSize&&(r.fullscreen||r.fullscreenWeb||r.pip?r.autoSize=!1:r.autoSize=!0),r.aspectRatioReset=!0,t.emit("resize",{width:r.width,height:r.height}))}),500);e.proxy(o,"load",(function(){e.proxy(o.contentDocument.defaultView,"resize",u)})),i.appendChild(o)}(n,r)}))}return n(e,[{key:"proxy",value:function(t,e,n){var r=this,i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};if(Array.isArray(e))return e.map((function(e){return r.proxy(t,e,n,i)}));t.addEventListener(e,n,i);var o=function(){return t.removeEventListener(e,n,i)};return this.destroyEvents.push(o),o}},{key:"hover",value:function(t,e,n){e&&this.proxy(t,"mouseenter",e),n&&this.proxy(t,"mouseleave",n)}},{key:"loadImg",value:function(t){var e=this;return new Promise((function(n,r){var i;if(t instanceof HTMLImageElement)i=t;else{if("string"!=typeof t)return r(t);(i=new Image).src=t}return i.complete?n(i):(e.proxy(i,"load",(function(){return n(i)})),e.proxy(i,"error",(function(){return r(i)})),t)}))}},{key:"destroy",value:function(){this.destroyEvents.forEach((function(t){return t()}))}}]),e}(),Yt=function(){function e(n){var r=this;t(this,e),this.keys={};var i=n.option,o=n.player,a=n.events.proxy;i.hotkey&&n.on("ready",(function(){r.add(27,(function(){o.fullscreenWeb&&(o.fullscreenWeb=!1)})),r.add(32,(function(){o.toggle=!0})),r.add(37,(function(){o.seek=o.currentTime-5})),r.add(38,(function(){o.volume+=.1})),r.add(39,(function(){o.seek=o.currentTime+5})),r.add(40,(function(){o.volume-=.1})),a(window,"keydown",(function(t){if(n.isFocus){var e=document.activeElement.tagName.toUpperCase(),i=document.activeElement.getAttribute("contenteditable");if("INPUT"!==e&&"TEXTAREA"!==e&&""!==i&&"true"!==i){var o=r.keys[t.keyCode];o&&(t.preventDefault(),o.forEach((function(t){return t()})),n.emit("hotkey",t))}}}))}))}return n(e,[{key:"add",value:function(t,e){this.keys[t]?this.keys[t].push(e):this.keys[t]=[e]}}]),e}(),Jt=function(e){function n(e){var r;return t(this,n),(r=a(this,c(n).call(this,e))).$parent=e.template.$layer,e.on("ready",(function(){e.option.layers.forEach((function(t){r.add(t)}))})),r}return s(n,e),n}(ct),Gt=function(e){function n(e){var r;return t(this,n),r=a(this,c(n).call(this,e)),m(e.template.$loading,e.icons.loading),r}return s(n,e),n}(ct),Qt=function(){function e(n){t(this,e),this.art=n,this.time=2e3,this.timer=null}return n(e,[{key:"show",set:function(t){var e=this.art.template,n=e.$player,r=e.$noticeInner;r.innerText=t instanceof Error?t.message.trim():t,h(n,"art-notice-show"),clearTimeout(this.timer),this.timer=setTimeout((function(){r.innerText="",y(n,"art-notice-show")}),this.time)}}]),e}(),Kt=function(e){function n(e){var r;return t(this,n),r=a(this,c(n).call(this,e)),m(e.template.$state,e.icons.state),r}return s(n,e),n}(ct);function te(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);e&&(r=r.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,r)}return n}var ee=function e(n){var r=this;t(this,e);var i=function(t){for(var e=1;e".concat(t,"
")})).join(""),this.art.emit("subtitle:update",this.activeCue.text))}},{key:"switch",value:function(t,e,n){var r=this,i=this.art,o=i.i18n,a=i.notice;return this.init(t,n).then((function(t){return e&&(a.show="".concat(o.get("Switch subtitle"),": ").concat(e)),r.art.emit("subtitle:switch",t),t}))}},{key:"init",value:function(t,e){var n=this,r=this.art,i=r.notice,o=r.template,a=o.$subtitle,c=o.$track;return fetch(t).then((function(t){return t.text()})).then((function(r){switch(n.art.emit("subtitle:load",t),e||D(t)){case"srt":return R($(r));case"ass":return R(C(r));case"vtt":return R(r);default:return t}})).then((function(t){return a.innerHTML="",n.url===t?t:(URL.revokeObjectURL(n.url),c.src=t,t)})).catch((function(t){throw i.show=t,n.art.emit("subtitle:err",t),t}))}},{key:"url",get:function(){return this.art.template.$track.src}},{key:"textTrack",get:function(){return this.art.template.$video.textTracks[0]}},{key:"activeCue",get:function(){return this.textTrack.activeCues[0]}}]),r}(ct);var Zt=function(){function e(n){var r=this;t(this,e),this.destroyEvents=[],this.proxy=this.proxy.bind(this),this.hover=this.hover.bind(this),this.loadImg=this.loadImg.bind(this),n.whitelist.state&&n.on("ready",(function(){!function(t,e){var n=t.template.$player;e.proxy(document,["click","contextmenu"],(function(e){e.composedPath().indexOf(n)>-1?(t.isFocus=!0,t.emit("focus")):(t.isFocus=!1,t.emit("blur"))}))}(n,r),function(t,e){var n=t.template.$player;e.hover(n,(function(){h(n,"art-hover"),t.emit("hoverenter")}),(function(){y(n,"art-hover"),t.emit("hoverleave")}))}(n,r),function(t,e){var n=t.template,r=n.$player,i=n.$video,o=t.player,a=t.controls,c=N((function(){h(r,"art-hide-cursor"),y(r,"art-hover"),a.show=!1}),3e3);t.on("hoverleave",(function(){o.playing&&c()})),e.proxy(r,"mousemove",(function(e){c.clearTimeout(),y(r,"art-hide-cursor"),a.show=!0,!o.pip&&o.playing&&e.target===i&&c(),t.emit("mousemove")}))}(n,r),function(t,e){var n=t.option,r=t.player,i=t.template.$player,o=document.createElement("object");o.setAttribute("aria-hidden","true"),o.setAttribute("tabindex",-1),o.type="text/html",o.data="about:blank";var a=r.width,c=r.height,u=I((function(){r.width===a&&r.height===c||(a=r.width,c=r.height,n.autoSize&&(r.fullscreen||r.fullscreenWeb||r.pip?r.autoSize=!1:r.autoSize=!0),r.aspectRatioReset=!0,t.emit("resize",{width:r.width,height:r.height}))}),500);e.proxy(o,"load",(function(){e.proxy(o.contentDocument.defaultView,"resize",u)})),i.appendChild(o)}(n,r)}))}return n(e,[{key:"proxy",value:function(t,e,n){var r=this,i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};if(Array.isArray(e))return e.map((function(e){return r.proxy(t,e,n,i)}));t.addEventListener(e,n,i);var o=function(){return t.removeEventListener(e,n,i)};return this.destroyEvents.push(o),o}},{key:"hover",value:function(t,e,n){e&&this.proxy(t,"mouseenter",e),n&&this.proxy(t,"mouseleave",n)}},{key:"loadImg",value:function(t){var e=this;return new Promise((function(n,r){var i;if(t instanceof HTMLImageElement)i=t;else{if("string"!=typeof t)return r(t);(i=new Image).src=t}return i.complete?n(i):(e.proxy(i,"load",(function(){return n(i)})),e.proxy(i,"error",(function(){return r(i)})),t)}))}},{key:"destroy",value:function(){this.destroyEvents.forEach((function(t){return t()}))}}]),e}(),Yt=function(){function e(n){var r=this;t(this,e),this.keys={};var i=n.option,o=n.player,a=n.events.proxy;i.hotkey&&n.on("ready",(function(){r.add(27,(function(){o.fullscreenWeb&&(o.fullscreenWeb=!1)})),r.add(32,(function(){o.toggle=!0})),r.add(37,(function(){o.seek=o.currentTime-5})),r.add(38,(function(){o.volume+=.1})),r.add(39,(function(){o.seek=o.currentTime+5})),r.add(40,(function(){o.volume-=.1})),a(window,"keydown",(function(t){if(n.isFocus){var e=document.activeElement.tagName.toUpperCase(),i=document.activeElement.getAttribute("contenteditable");if("INPUT"!==e&&"TEXTAREA"!==e&&""!==i&&"true"!==i){var o=r.keys[t.keyCode];o&&(t.preventDefault(),o.forEach((function(t){return t()})),n.emit("hotkey",t))}}}))}))}return n(e,[{key:"add",value:function(t,e){this.keys[t]?this.keys[t].push(e):this.keys[t]=[e]}}]),e}(),Jt=function(e){function n(e){var r;return t(this,n),(r=a(this,c(n).call(this,e))).$parent=e.template.$layer,e.on("ready",(function(){e.option.layers.forEach((function(t){r.add(t)}))})),r}return s(n,e),n}(ct),Gt=function(e){function n(e){var r;return t(this,n),r=a(this,c(n).call(this,e)),m(e.template.$loading,e.icons.loading),r}return s(n,e),n}(ct),Qt=function(){function e(n){t(this,e),this.art=n,this.time=2e3,this.timer=null}return n(e,[{key:"show",set:function(t){var e=this.art.template,n=e.$player,r=e.$noticeInner;r.innerText=t instanceof Error?t.message.trim():t,h(n,"art-notice-show"),clearTimeout(this.timer),this.timer=setTimeout((function(){r.innerText="",y(n,"art-notice-show")}),this.time)}}]),e}(),Kt=function(e){function n(e){var r;return t(this,n),r=a(this,c(n).call(this,e)),m(e.template.$state,e.icons.state),r}return s(n,e),n}(ct);function te(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);e&&(r=r.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,r)}return n}var ee=function e(n){var r=this;t(this,e);var i=function(t){for(var e=1;e
`,
- style: {
- position: 'absolute',
- top: '20px',
- right: '20px',
- opacity: '.9',
- },
-});
-```
-
## contextmenu
- Type: `Array`
@@ -917,26 +895,6 @@ var art = new Artplayer({
});
```
-Or you can add it dynamically after instantiation:
-
-[Run Code](/Configuration.contextmenu)
-
-```js
-var url = 'https://zhw2590582.github.io/assets-cdn';
-var art = new Artplayer({
- container: '.artplayer-app',
- url: url + '/video/one-more-time-one-more-chance-480p.mp4',
-});
-
-art.contextmenu.add({
- html: 'Custom menu',
- click: function(contextmenu) {
- console.info('You clicked on the custom menu');
- contextmenu.show = false;
- },
-});
-```
-
## controls
- Type: `Array`
@@ -978,29 +936,6 @@ var art = new Artplayer({
});
```
-Or you can add it dynamically after instantiation:
-
-[Run Code](/Configuration.controls)
-
-```js
-var url = 'https://zhw2590582.github.io/assets-cdn';
-var art = new Artplayer({
- container: '.artplayer-app',
- url: url + '/video/one-more-time-one-more-chance-480p.mp4',
-});
-
-art.controls.add({
- name: 'myController',
- position: 'right',
- index: 10,
- html: 'myController',
- tooltip: 'This is my controller',
- click: function() {
- console.log('myController');
- },
-});
-```
-
## plugins
- Type: `Array`
@@ -1035,43 +970,16 @@ var art = new Artplayer({
art.plugins.myPlugin.doSomething();
```
-Or you can add it dynamically after instantiation:
-
-[Run Code](/Configuration.plugins)
-
-```js
-var url = 'https://zhw2590582.github.io/assets-cdn';
-var art = new Artplayer({
- container: '.artplayer-app',
- url: url + '/video/one-more-time-one-more-chance-480p.mp4',
-});
-
-art.plugins.add(function myPlugin(art) {
- // Do something you like here.
- // You can also return an object for external calls.
- console.info('myPlugin running...');
- return {
- // This exposes plugin properties or methods for others to use. Like:
- something: 'something',
- doSomething: function() {
- console.info('Do something here...');
- },
- };
-});
-
-// Call plugin from the outside
-art.plugins.myPlugin.something === 'something';
-art.plugins.myPlugin.doSomething();
-```
-
# Instance properties
## Instance
-| propertie | type | Description |
-| --------- | ---------- | ------------------------------------------------ |
-| `isFocus` | `Boolean` | Return to focus state |
-| `destroy` | `Function` | Destroy instance, will not remove dom by default |
+| propertie | type | Description |
+| ----------- | ---------- | ------------------------------------------------ |
+| `isFocus` | `Boolean` | Return the focus state |
+| `isDestroy` | `Boolean` | Return the destroy state |
+| `option` | `Object` | Return the merge option |
+| `destroy` | `Function` | Destroy instance, will not remove dom by default |
[Run Code](/Properties.instance)
@@ -1083,7 +991,8 @@ var art = new Artplayer({
});
console.log('isFocus', art.isFocus);
-console.log('isPlaying', art.isPlaying);
+console.log('isDestroy', art.isDestroy);
+console.log('option', art.option);
setTimeout(function() {
// remove dom
@@ -1110,7 +1019,7 @@ art.seek === art.player.seek;
| --------------------- | ---------- | ------------------------------------------------------------------------------------------------- |
| `aspectRatio` | `String` | Set aspect ratio, Currently only accepts three values:`default`, `4:3`, `16:9` and `false` |
| `aspectRatioReset` | `Boolean` | Recalculate the aspect ratio |
-| `attachUrl` | `Function` | Replace play address |
+| `url` | `String` | `Getter` and `Setter` of the video url |
| `autoSize` | `Boolean` | Set auto size |
| `currentTime` | `Number` | `Getter` and `Setter` of the current time |
| `duration` | `Number` | `Getter` of the duration |
@@ -1130,7 +1039,7 @@ art.seek === art.player.seek;
| `play` | `Boolean` | Start playback |
| `screenshot` | `Function` | Download a screenshot of current time |
| `seek` | `Number` | Set the current time |
-| `switchQuality` | `Function` | Switch quality |
+| `switchQuality` | `Function` | Switch video quality |
| `switchUrl` | `Function` | Switch video url |
| `toggle` | `Boolean` | Toggle play and pause |
| `volume` | `Number` | `Getter` and `Setter` of the current volume |
@@ -1427,12 +1336,23 @@ var art = new Artplayer({
| --------- | -------- | ------------ |
| `show` | `setter` | Show or hide |
-```js
-// Show the loading
-art.loading.show = true;
+[Run Code](/Properties.loading)
-// Hide the loading
-art.loading.show = false;
+```js
+var url = 'https://zhw2590582.github.io/assets-cdn';
+var art = new Artplayer({
+ container: '.artplayer-app',
+ url: url + '/video/one-more-time-one-more-chance-480p.mp4',
+});
+
+art.on('ready', function() {
+ // Show the loading
+ art.loading.show = true;
+ setTimeout(function() {
+ // Hide the loading
+ art.loading.show = false;
+ }, 5000);
+});
```
## mask
@@ -1443,12 +1363,23 @@ art.loading.show = false;
| --------- | -------- | ------------ |
| `show` | `setter` | Show or hide |
-```js
-// Show the mask
-art.mask.show = true;
+[Run Code](/Properties.mask)
-// Hide the mask
-art.mask.show = false;
+```js
+var url = 'https://zhw2590582.github.io/assets-cdn';
+var art = new Artplayer({
+ container: '.artplayer-app',
+ url: url + '/video/one-more-time-one-more-chance-480p.mp4',
+});
+
+art.on('ready', function() {
+ // Show the mask
+ art.mask.show = true;
+ setTimeout(function() {
+ // Hide the mask
+ art.mask.show = false;
+ }, 5000);
+});
```
## setting
@@ -1472,16 +1403,20 @@ var art = new Artplayer({
setting: true,
});
-art.setting.add({
- html: 'Your Setting',
- name: 'yourSetting',
+art.on('ready', function() {
+ // Add a setting
+ art.setting.add({
+ html: 'Your Setting',
+ name: 'yourSetting',
+ });
+
+ // Show the setting
+ art.setting.show = true;
+ setTimeout(function() {
+ // Hide the setting
+ art.setting.show = false;
+ }, 5000);
});
-
-// Show the setting
-art.setting.show = true;
-
-// Hide the setting
-art.setting.show = false;
```
## plugins
@@ -1548,41 +1483,37 @@ art.on('ready', function(args) {
## Instance
-| Event | Description | Parameter |
-| ---------------------- | --------------------------------------- | ------------------- |
-| `ready` | When the video can be played | `undefined` |
-| `play` | When the video play | `undefined` |
-| `pause` | When the video pause | `undefined` |
-| `seek` | When the video seek | Video current time |
-| `volume` | When the video volume change | Video volume value |
-| `destroy` | When the instance is destroyed | `undefined` |
-| `focus` | When the player gets focus | `undefined` |
-| `blur` | When the player loses focus | `undefined` |
-| `hoverenter` | When the mouse is moved into the player | `undefined` |
-| `hoverleave` | When the mouse is moved out the player | `undefined` |
-| `resize` | When the player resize | Player size |
-| `mousemove` | When the mouse moves over the player | `undefined` |
-| `aspectRatioChange` | When aspect ratio change | Aspect ratio |
-| `aspectRatioRemove` | When aspect ratio remove | `undefined` |
-| `aspectRatioReset` | When aspect ratio reset | `undefined` |
-| `customType` | After triggering CustomType | Type name |
-| `attachUrl` | After the video url change | Video url |
-| `autoSizeChange` | When the player auto size change | Player size |
-| `autoSizeRemove` | When the player auto size remove | `undefined` |
-| `flipChange` | When the player flip change | Flip name |
-| `flipRemove` | When the player flip remove | `undefined` |
-| `fullscreenChange` | When the full screen status change | Whether full screen |
-| `fullscreenEnabled` | When entering full screen | `undefined` |
-| `fullscreenExit` | When exiting full screen | `undefined` |
-| `fullscreenWebEnabled` | When entering web full screen | `undefined` |
-| `fullscreenWebExit` | When exiting web full screen | `undefined` |
-| `pipEnabled` | When entering picture in picture | `undefined` |
-| `pipExit` | When exiting picture in picture | `undefined` |
-| `playbackRateChange` | When playback rate change | Playback rate |
-| `playbackRateRemove` | When playback rate remove | `undefined` |
-| `playbackRateReset` | When playback rate reset | `undefined` |
-| `screenshot` | When a screenshot occurs | Image data uri |
-| `switch` | When switching video url | Video url |
+| Event | Description | Parameter |
+| --------------------- | --------------------------------------- | ----------------------- |
+| `ready` | When the video can be played | `undefined` |
+| `play` | When the video play | `undefined` |
+| `pause` | When the video pause | `undefined` |
+| `seek` | When the video seek | Video current time |
+| `volume` | When the video volume change | Video volume value |
+| `destroy` | When the instance is destroyed | `undefined` |
+| `focus` | When the player gets focus | `undefined` |
+| `blur` | When the player loses focus | `undefined` |
+| `hoverenter` | When the mouse is moved into the player | `undefined` |
+| `hoverleave` | When the mouse is moved out the player | `undefined` |
+| `resize` | When the player resize | Player size |
+| `mousemove` | When the mouse moves over the player | `undefined` |
+| `aspectRatioChange` | When aspect ratio change | Aspect ratio |
+| `aspectRatioRemove` | When aspect ratio remove | `undefined` |
+| `aspectRatioReset` | When aspect ratio reset | `undefined` |
+| `customType` | After triggering CustomType | Type name |
+| `urlChange` | After the video url change | Video url |
+| `autoSizeChange` | When the player auto size change | Player size |
+| `autoSizeRemove` | When the player auto size remove | `undefined` |
+| `flipChange` | When the player flip change | Flip name |
+| `flipRemove` | When the player flip remove | `undefined` |
+| `fullscreenChange` | When the full screen status change | Whether full screen |
+| `fullscreenWebChange` | When entering web full screen | Whether web full screen |
+| `pipChange` | When entering picture in picture | Whether in pip |
+| `playbackRateChange` | When playback rate change | Playback rate |
+| `playbackRateRemove` | When playback rate remove | `undefined` |
+| `playbackRateReset` | When playback rate reset | `undefined` |
+| `screenshot` | When a screenshot occurs | Image data uri |
+| `switch` | When switching video url | Video url |
## Video (Native event)
diff --git a/docs/uncompiled/artplayer.js b/docs/uncompiled/artplayer.js
index e111af8c7..1c9439f0f 100644
--- a/docs/uncompiled/artplayer.js
+++ b/docs/uncompiled/artplayer.js
@@ -656,7 +656,6 @@
miniProgressBar: 'boolean',
localVideo: 'boolean',
localSubtitle: 'boolean',
- autoPip: 'boolean',
networkMonitor: 'boolean',
plugins: ['function'],
whitelist: ['string|function|regexp'],
@@ -997,9 +996,11 @@
var typeCallback = customType[typeName];
if (typeName && typeCallback) {
- art.loading.show = true;
- typeCallback.call(art, $video, url, art);
- art.emit('customType', typeName);
+ sleep().then(function () {
+ art.loading.show = true;
+ typeCallback.call(art, $video, url, art);
+ art.emit('customType', typeName);
+ });
} else {
$video.src = url;
art.option.url = url;
diff --git a/docs/uncompiled/artplayer.js.map b/docs/uncompiled/artplayer.js.map
index 846b75ff3..fb83afb0b 100644
--- a/docs/uncompiled/artplayer.js.map
+++ b/docs/uncompiled/artplayer.js.map
@@ -1 +1 @@
-{"version":3,"file":"artplayer.js","sources":["../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/classCallCheck.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/createClass.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/typeof.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/assertThisInitialized.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/possibleConstructorReturn.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/getPrototypeOf.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/setPrototypeOf.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/inherits.js","../../packages/artplayer/node_modules/option-validator/dist/option-validator.js","../../packages/artplayer/src/utils/emitter.js","../../packages/artplayer/src/utils/dom.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/isNativeFunction.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/construct.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/wrapNativeSuper.js","../../packages/artplayer/src/utils/error.js","../../packages/artplayer/src/utils/subtitle.js","../../packages/artplayer/src/utils/file.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/arrayWithoutHoles.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/iterableToArray.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/nonIterableSpread.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/toConsumableArray.js","../../packages/artplayer/src/utils/property.js","../../packages/artplayer/src/utils/time.js","../../packages/artplayer/src/utils/format.js","../../packages/artplayer/src/scheme/index.js","../../packages/artplayer/src/config/index.js","../../packages/artplayer/src/whitelist.js","../../packages/artplayer/src/template.js","../../packages/artplayer/src/i18n/index.js","../../packages/artplayer/src/player/urlMix.js","../../packages/artplayer/src/player/attrInit.js","../../packages/artplayer/src/player/eventInit.js","../../packages/artplayer/src/player/playMix.js","../../packages/artplayer/src/player/pauseMix.js","../../packages/artplayer/src/player/toggleMix.js","../../packages/artplayer/src/player/seekMix.js","../../packages/artplayer/src/player/volumeMix.js","../../packages/artplayer/src/player/currentTimeMix.js","../../packages/artplayer/src/player/durationMix.js","../../packages/artplayer/src/player/switchMix.js","../../packages/artplayer/src/player/playbackRateMix.js","../../packages/artplayer/src/player/aspectRatioMix.js","../../packages/artplayer/src/player/screenshotMix.js","../../packages/artplayer/node_modules/screenfull/dist/screenfull.js","../../packages/artplayer/src/player/fullscreenMix.js","../../packages/artplayer/src/player/fullscreenWebMix.js","../../packages/artplayer/src/player/pipMix.js","../../packages/artplayer/src/player/loadedMix.js","../../packages/artplayer/src/player/playedMix.js","../../packages/artplayer/src/player/playingMix.js","../../packages/artplayer/src/player/autoSizeMix.js","../../packages/artplayer/src/player/rectMix.js","../../packages/artplayer/src/player/flipMix.js","../../packages/artplayer/src/player/index.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/superPropBase.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/get.js","../../packages/artplayer/src/utils/component.js","../../node_modules/_@babel_runtime@7.7.4@@babel/runtime/helpers/defineProperty.js","../../packages/artplayer/src/control/fullscreen.js","../../packages/artplayer/src/control/fullscreenWeb.js","../../packages/artplayer/src/control/pip.js","../../packages/artplayer/src/control/playAndPause.js","../../packages/artplayer/src/control/progress.js","../../packages/artplayer/src/control/subtitle.js","../../packages/artplayer/src/control/time.js","../../packages/artplayer/src/control/volume.js","../../packages/artplayer/src/control/setting.js","../../packages/artplayer/src/control/thumbnails.js","../../packages/artplayer/src/control/screenshot.js","../../packages/artplayer/src/control/quality.js","../../packages/artplayer/src/control/index.js","../../packages/artplayer/src/contextmenu/playbackRate.js","../../packages/artplayer/src/contextmenu/aspectRatio.js","../../packages/artplayer/src/contextmenu/info.js","../../packages/artplayer/src/contextmenu/version.js","../../packages/artplayer/src/contextmenu/close.js","../../packages/artplayer/src/contextmenu/index.js","../../packages/artplayer/src/info.js","../../packages/artplayer/src/subtitle.js","../../packages/artplayer/src/events/clickInit.js","../../packages/artplayer/src/events/hoverInit.js","../../packages/artplayer/src/events/mousemoveInit.js","../../packages/artplayer/src/events/resizeInit.js","../../packages/artplayer/src/events/index.js","../../packages/artplayer/src/hotkey.js","../../packages/artplayer/src/layer.js","../../packages/artplayer/src/loading.js","../../packages/artplayer/src/notice.js","../../packages/artplayer/src/mask.js","../../packages/artplayer/src/icons/index.js","../../packages/artplayer/src/setting/flip.js","../../packages/artplayer/src/setting/aspectRatio.js","../../packages/artplayer/src/setting/playbackRate.js","../../packages/artplayer/src/setting/index.js","../../packages/artplayer/src/storage.js","../../packages/artplayer/src/plugins/subtitleOffset.js","../../packages/artplayer/src/plugins/localVideo.js","../../packages/artplayer/src/plugins/localSubtitle.js","../../packages/artplayer/src/plugins/miniProgressBar.js","../../packages/artplayer/src/plugins/networkMonitor.js","../../packages/artplayer/src/plugins/index.js","../../packages/artplayer/src/mobile.js","../../packages/artplayer/src/index.js"],"sourcesContent":["function _classCallCheck(instance, Constructor) {\n if (!(instance instanceof Constructor)) {\n throw new TypeError(\"Cannot call a class as a function\");\n }\n}\n\nmodule.exports = _classCallCheck;","function _defineProperties(target, props) {\n for (var i = 0; i < props.length; i++) {\n var descriptor = props[i];\n descriptor.enumerable = descriptor.enumerable || false;\n descriptor.configurable = true;\n if (\"value\" in descriptor) descriptor.writable = true;\n Object.defineProperty(target, descriptor.key, descriptor);\n }\n}\n\nfunction _createClass(Constructor, protoProps, staticProps) {\n if (protoProps) _defineProperties(Constructor.prototype, protoProps);\n if (staticProps) _defineProperties(Constructor, staticProps);\n return Constructor;\n}\n\nmodule.exports = _createClass;","function _typeof2(obj) { if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof2 = function _typeof2(obj) { return typeof obj; }; } else { _typeof2 = function _typeof2(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof2(obj); }\n\nfunction _typeof(obj) {\n if (typeof Symbol === \"function\" && _typeof2(Symbol.iterator) === \"symbol\") {\n module.exports = _typeof = function _typeof(obj) {\n return _typeof2(obj);\n };\n } else {\n module.exports = _typeof = function _typeof(obj) {\n return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : _typeof2(obj);\n };\n }\n\n return _typeof(obj);\n}\n\nmodule.exports = _typeof;","function _assertThisInitialized(self) {\n if (self === void 0) {\n throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n }\n\n return self;\n}\n\nmodule.exports = _assertThisInitialized;","var _typeof = require(\"../helpers/typeof\");\n\nvar assertThisInitialized = require(\"./assertThisInitialized\");\n\nfunction _possibleConstructorReturn(self, call) {\n if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) {\n return call;\n }\n\n return assertThisInitialized(self);\n}\n\nmodule.exports = _possibleConstructorReturn;","function _getPrototypeOf(o) {\n module.exports = _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {\n return o.__proto__ || Object.getPrototypeOf(o);\n };\n return _getPrototypeOf(o);\n}\n\nmodule.exports = _getPrototypeOf;","function _setPrototypeOf(o, p) {\n module.exports = _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {\n o.__proto__ = p;\n return o;\n };\n\n return _setPrototypeOf(o, p);\n}\n\nmodule.exports = _setPrototypeOf;","var setPrototypeOf = require(\"./setPrototypeOf\");\n\nfunction _inherits(subClass, superClass) {\n if (typeof superClass !== \"function\" && superClass !== null) {\n throw new TypeError(\"Super expression must either be null or a function\");\n }\n\n subClass.prototype = Object.create(superClass && superClass.prototype, {\n constructor: {\n value: subClass,\n writable: true,\n configurable: true\n }\n });\n if (superClass) setPrototypeOf(subClass, superClass);\n}\n\nmodule.exports = _inherits;","!function(r,t){\"object\"==typeof exports&&\"undefined\"!=typeof module?module.exports=t():\"function\"==typeof define&&define.amd?define(t):r.optionValidator=t()}(this,function(){\"use strict\";function e(r){return(e=\"function\"==typeof Symbol&&\"symbol\"==typeof Symbol.iterator?function(r){return typeof r}:function(r){return r&&\"function\"==typeof Symbol&&r.constructor===Symbol&&r!==Symbol.prototype?\"symbol\":typeof r})(r)}var n=Object.prototype.toString,c=function(r){if(void 0===r)return\"undefined\";if(null===r)return\"null\";var t=e(r);if(\"boolean\"===t)return\"boolean\";if(\"string\"===t)return\"string\";if(\"number\"===t)return\"number\";if(\"symbol\"===t)return\"symbol\";if(\"function\"===t)return function(r){return\"GeneratorFunction\"===o(r)}(r)?\"generatorfunction\":\"function\";if(function(r){return Array.isArray?Array.isArray(r):r instanceof Array}(r))return\"array\";if(function(r){if(r.constructor&&\"function\"==typeof r.constructor.isBuffer)return r.constructor.isBuffer(r);return!1}(r))return\"buffer\";if(function(r){try{if(\"number\"==typeof r.length&&\"function\"==typeof r.callee)return!0}catch(r){if(-1!==r.message.indexOf(\"callee\"))return!0}return!1}(r))return\"arguments\";if(function(r){return r instanceof Date||\"function\"==typeof r.toDateString&&\"function\"==typeof r.getDate&&\"function\"==typeof r.setDate}(r))return\"date\";if(function(r){return r instanceof Error||\"string\"==typeof r.message&&r.constructor&&\"number\"==typeof r.constructor.stackTraceLimit}(r))return\"error\";if(function(r){return r instanceof RegExp||\"string\"==typeof r.flags&&\"boolean\"==typeof r.ignoreCase&&\"boolean\"==typeof r.multiline&&\"boolean\"==typeof r.global}(r))return\"regexp\";switch(o(r)){case\"Symbol\":return\"symbol\";case\"Promise\":return\"promise\";case\"WeakMap\":return\"weakmap\";case\"WeakSet\":return\"weakset\";case\"Map\":return\"map\";case\"Set\":return\"set\";case\"Int8Array\":return\"int8array\";case\"Uint8Array\":return\"uint8array\";case\"Uint8ClampedArray\":return\"uint8clampedarray\";case\"Int16Array\":return\"int16array\";case\"Uint16Array\":return\"uint16array\";case\"Int32Array\":return\"int32array\";case\"Uint32Array\":return\"uint32array\";case\"Float32Array\":return\"float32array\";case\"Float64Array\":return\"float64array\"}if(function(r){return\"function\"==typeof r.throw&&\"function\"==typeof r.return&&\"function\"==typeof r.next}(r))return\"generator\";switch(t=n.call(r)){case\"[object Object]\":return\"object\";case\"[object Map Iterator]\":return\"mapiterator\";case\"[object Set Iterator]\":return\"setiterator\";case\"[object String Iterator]\":return\"stringiterator\";case\"[object Array Iterator]\":return\"arrayiterator\"}return t.slice(8,-1).toLowerCase().replace(/\\s/g,\"\")};function o(r){return r.constructor?r.constructor.name:null}function f(r,t){var e=2${item}
`)\n .join('');\n this.art.emit('subtitle:update', this.activeCue.text);\n }\n }\n\n switch(url, name, ext) {\n const { i18n, notice } = this.art;\n return this.init(url, ext).then(subUrl => {\n if (name) {\n notice.show = `${i18n.get('Switch subtitle')}: ${name}`;\n }\n this.art.emit('subtitle:switch', subUrl);\n return subUrl;\n });\n }\n\n init(url, ext) {\n const {\n notice,\n template: { $subtitle, $track },\n } = this.art;\n\n return fetch(url)\n .then(response => {\n return response.text();\n })\n .then(text => {\n this.art.emit('subtitle:load', url);\n switch (ext || getExt(url)) {\n case 'srt':\n return vttToBlob(srtToVtt(text));\n case 'ass':\n return vttToBlob(assToVtt(text));\n case 'vtt':\n return vttToBlob(text);\n default:\n return url;\n }\n })\n .then(subUrl => {\n $subtitle.innerHTML = '';\n if (this.url === subUrl) return subUrl;\n URL.revokeObjectURL(this.url);\n $track.src = subUrl;\n return subUrl;\n })\n .catch(err => {\n notice.show = err;\n this.art.emit('subtitle:err', err);\n throw err;\n });\n }\n}\n","export default function clickInit(art, events) {\n const { $player } = art.template;\n events.proxy(document, ['click', 'contextmenu'], event => {\n if (event.composedPath().indexOf($player) > -1) {\n art.isFocus = true;\n art.emit('focus');\n } else {\n art.isFocus = false;\n art.emit('blur');\n }\n });\n}\n","import { addClass, removeClass } from '../utils';\n\nexport default function hoverInit(art, events) {\n const { $player } = art.template;\n events.hover(\n $player,\n () => {\n addClass($player, 'art-hover');\n art.emit('hoverenter');\n },\n () => {\n removeClass($player, 'art-hover');\n art.emit('hoverleave');\n },\n );\n}\n","import { debounce, addClass, removeClass } from '../utils';\n\nexport default function mousemoveInitInit(art, events) {\n const {\n template: { $player, $video },\n player,\n controls,\n } = art;\n\n const autoHide = debounce(() => {\n addClass($player, 'art-hide-cursor');\n removeClass($player, 'art-hover');\n controls.show = false;\n }, 3000);\n\n art.on('hoverleave', () => {\n if (player.playing) {\n autoHide();\n }\n });\n\n events.proxy($player, 'mousemove', event => {\n autoHide.clearTimeout();\n removeClass($player, 'art-hide-cursor');\n controls.show = true;\n if (!player.pip && player.playing && event.target === $video) {\n autoHide();\n }\n art.emit('mousemove');\n });\n}\n","import { throttle } from '../utils';\n\nexport default function resizeInit(art, events) {\n const {\n option,\n player,\n template: { $player },\n } = art;\n\n const object = document.createElement('object');\n object.setAttribute('aria-hidden', 'true');\n object.setAttribute('tabindex', -1);\n object.type = 'text/html';\n object.data = 'about:blank';\n let playerWidth = player.width;\n let playerHeight = player.height;\n const resizeFn = throttle(() => {\n if (player.width !== playerWidth || player.height !== playerHeight) {\n playerWidth = player.width;\n playerHeight = player.height;\n if (option.autoSize) {\n if (!player.fullscreen && !player.fullscreenWeb && !player.pip) {\n player.autoSize = true;\n } else {\n player.autoSize = false;\n }\n }\n player.aspectRatioReset = true;\n art.emit('resize', {\n width: player.width,\n height: player.height,\n });\n }\n }, 500);\n\n events.proxy(object, 'load', () => {\n events.proxy(object.contentDocument.defaultView, 'resize', resizeFn);\n });\n\n $player.appendChild(object);\n}\n","import clickInit from './clickInit';\nimport hoverInit from './hoverInit';\nimport mousemoveInit from './mousemoveInit';\nimport resizeInit from './resizeInit';\n\nexport default class Events {\n constructor(art) {\n this.destroyEvents = [];\n this.proxy = this.proxy.bind(this);\n this.hover = this.hover.bind(this);\n this.loadImg = this.loadImg.bind(this);\n\n if (art.whitelist.state) {\n art.on('ready', () => {\n clickInit(art, this);\n hoverInit(art, this);\n mousemoveInit(art, this);\n resizeInit(art, this);\n });\n }\n }\n\n proxy(target, name, callback, option = {}) {\n if (Array.isArray(name)) {\n return name.map(item => this.proxy(target, item, callback, option));\n }\n\n target.addEventListener(name, callback, option);\n const destroy = () => target.removeEventListener(name, callback, option);\n this.destroyEvents.push(destroy);\n return destroy;\n }\n\n hover(target, mouseenter, mouseleave) {\n if (mouseenter) {\n this.proxy(target, 'mouseenter', mouseenter);\n }\n if (mouseleave) {\n this.proxy(target, 'mouseleave', mouseleave);\n }\n }\n\n loadImg(img) {\n return new Promise((resolve, reject) => {\n let image;\n\n if (img instanceof HTMLImageElement) {\n image = img;\n } else if (typeof img === 'string') {\n image = new Image();\n image.src = img;\n } else {\n return reject(img);\n }\n\n if (image.complete) {\n return resolve(image);\n }\n\n this.proxy(image, 'load', () => resolve(image));\n this.proxy(image, 'error', () => reject(image));\n\n return img;\n });\n }\n\n destroy() {\n this.destroyEvents.forEach(event => event());\n }\n}\n","export default class Hotkey {\n constructor(art) {\n this.keys = {};\n\n const {\n option,\n player,\n events: { proxy },\n } = art;\n\n if (option.hotkey) {\n art.on('ready', () => {\n this.add(27, () => {\n if (player.fullscreenWeb) {\n player.fullscreenWeb = false;\n }\n });\n\n this.add(32, () => {\n player.toggle = true;\n });\n\n this.add(37, () => {\n player.seek = player.currentTime - 5;\n });\n\n this.add(38, () => {\n player.volume += 0.1;\n });\n\n this.add(39, () => {\n player.seek = player.currentTime + 5;\n });\n\n this.add(40, () => {\n player.volume -= 0.1;\n });\n\n proxy(window, 'keydown', event => {\n if (art.isFocus) {\n const tag = document.activeElement.tagName.toUpperCase();\n const editable = document.activeElement.getAttribute('contenteditable');\n if (tag !== 'INPUT' && tag !== 'TEXTAREA' && editable !== '' && editable !== 'true') {\n const events = this.keys[event.keyCode];\n if (events) {\n event.preventDefault();\n events.forEach(fn => fn());\n art.emit('hotkey', event);\n }\n }\n }\n });\n });\n }\n }\n\n add(key, event) {\n if (this.keys[key]) {\n this.keys[key].push(event);\n } else {\n this.keys[key] = [event];\n }\n }\n}\n","import Component from './utils/component';\n\nexport default class Layer extends Component {\n constructor(art) {\n super(art);\n this.$parent = art.template.$layer;\n art.on('ready', () => {\n art.option.layers.forEach(item => {\n this.add(item);\n });\n });\n }\n}\n","import { append } from './utils';\nimport Component from './utils/component';\n\nexport default class Loading extends Component {\n constructor(art) {\n super(art);\n append(art.template.$loading, art.icons.loading);\n }\n}\n","import { addClass, removeClass } from './utils';\n\nexport default class Notice {\n constructor(art) {\n this.art = art;\n this.time = 2000;\n this.timer = null;\n }\n\n set show(msg) {\n const { $player, $noticeInner } = this.art.template;\n $noticeInner.innerText = msg instanceof Error ? msg.message.trim() : msg;\n addClass($player, 'art-notice-show');\n clearTimeout(this.timer);\n this.timer = setTimeout(() => {\n $noticeInner.innerText = '';\n removeClass($player, 'art-notice-show');\n }, this.time);\n }\n}\n","import { append } from './utils';\nimport Component from './utils/component';\n\nexport default class Mask extends Component {\n constructor(art) {\n super(art);\n append(art.template.$state, art.icons.state);\n }\n}\n","import { append } from '../utils';\nimport loading from './loading.svg';\nimport state from './state.svg';\nimport play from './play.svg';\nimport pause from './pause.svg';\nimport volume from './volume.svg';\nimport volumeClose from './volume-close.svg';\nimport subtitle from './subtitle.svg';\nimport screenshot from './screenshot.svg';\nimport setting from './setting.svg';\nimport fullscreen from './fullscreen.svg';\nimport fullscreenWeb from './fullscreen-web.svg';\nimport pip from './pip.svg';\n\nexport default class Icons {\n constructor(art) {\n const icons = {\n loading,\n state,\n play,\n pause,\n volume,\n volumeClose,\n subtitle,\n screenshot,\n setting,\n fullscreen,\n fullscreenWeb,\n pip,\n ...art.option.icons,\n };\n\n Object.keys(icons).forEach(key => {\n const icon = document.createElement('i');\n icon.classList.add('art-icon');\n icon.classList.add(`art-icon-${key}`);\n append(icon, icons[key]);\n this[key] = icon;\n });\n }\n}\n","import { inverseClass, queryAll } from '../utils';\n\nexport default function flip(option) {\n return art => {\n const { i18n, player } = art;\n return {\n ...option,\n html: `\n${item}
`)\n .join('');\n this.art.emit('subtitle:update', this.activeCue.text);\n }\n }\n\n switch(url, name, ext) {\n const { i18n, notice } = this.art;\n return this.init(url, ext).then(subUrl => {\n if (name) {\n notice.show = `${i18n.get('Switch subtitle')}: ${name}`;\n }\n this.art.emit('subtitle:switch', subUrl);\n return subUrl;\n });\n }\n\n init(url, ext) {\n const {\n notice,\n template: { $subtitle, $track },\n } = this.art;\n\n return fetch(url)\n .then(response => {\n return response.text();\n })\n .then(text => {\n this.art.emit('subtitle:load', url);\n switch (ext || getExt(url)) {\n case 'srt':\n return vttToBlob(srtToVtt(text));\n case 'ass':\n return vttToBlob(assToVtt(text));\n case 'vtt':\n return vttToBlob(text);\n default:\n return url;\n }\n })\n .then(subUrl => {\n $subtitle.innerHTML = '';\n if (this.url === subUrl) return subUrl;\n URL.revokeObjectURL(this.url);\n $track.src = subUrl;\n return subUrl;\n })\n .catch(err => {\n notice.show = err;\n this.art.emit('subtitle:err', err);\n throw err;\n });\n }\n}\n","export default function clickInit(art, events) {\n const { $player } = art.template;\n events.proxy(document, ['click', 'contextmenu'], event => {\n if (event.composedPath().indexOf($player) > -1) {\n art.isFocus = true;\n art.emit('focus');\n } else {\n art.isFocus = false;\n art.emit('blur');\n }\n });\n}\n","import { addClass, removeClass } from '../utils';\n\nexport default function hoverInit(art, events) {\n const { $player } = art.template;\n events.hover(\n $player,\n () => {\n addClass($player, 'art-hover');\n art.emit('hoverenter');\n },\n () => {\n removeClass($player, 'art-hover');\n art.emit('hoverleave');\n },\n );\n}\n","import { debounce, addClass, removeClass } from '../utils';\n\nexport default function mousemoveInitInit(art, events) {\n const {\n template: { $player, $video },\n player,\n controls,\n } = art;\n\n const autoHide = debounce(() => {\n addClass($player, 'art-hide-cursor');\n removeClass($player, 'art-hover');\n controls.show = false;\n }, 3000);\n\n art.on('hoverleave', () => {\n if (player.playing) {\n autoHide();\n }\n });\n\n events.proxy($player, 'mousemove', event => {\n autoHide.clearTimeout();\n removeClass($player, 'art-hide-cursor');\n controls.show = true;\n if (!player.pip && player.playing && event.target === $video) {\n autoHide();\n }\n art.emit('mousemove');\n });\n}\n","import { throttle } from '../utils';\n\nexport default function resizeInit(art, events) {\n const {\n option,\n player,\n template: { $player },\n } = art;\n\n const object = document.createElement('object');\n object.setAttribute('aria-hidden', 'true');\n object.setAttribute('tabindex', -1);\n object.type = 'text/html';\n object.data = 'about:blank';\n let playerWidth = player.width;\n let playerHeight = player.height;\n const resizeFn = throttle(() => {\n if (player.width !== playerWidth || player.height !== playerHeight) {\n playerWidth = player.width;\n playerHeight = player.height;\n if (option.autoSize) {\n if (!player.fullscreen && !player.fullscreenWeb && !player.pip) {\n player.autoSize = true;\n } else {\n player.autoSize = false;\n }\n }\n player.aspectRatioReset = true;\n art.emit('resize', {\n width: player.width,\n height: player.height,\n });\n }\n }, 500);\n\n events.proxy(object, 'load', () => {\n events.proxy(object.contentDocument.defaultView, 'resize', resizeFn);\n });\n\n $player.appendChild(object);\n}\n","import clickInit from './clickInit';\nimport hoverInit from './hoverInit';\nimport mousemoveInit from './mousemoveInit';\nimport resizeInit from './resizeInit';\n\nexport default class Events {\n constructor(art) {\n this.destroyEvents = [];\n this.proxy = this.proxy.bind(this);\n this.hover = this.hover.bind(this);\n this.loadImg = this.loadImg.bind(this);\n\n if (art.whitelist.state) {\n art.on('ready', () => {\n clickInit(art, this);\n hoverInit(art, this);\n mousemoveInit(art, this);\n resizeInit(art, this);\n });\n }\n }\n\n proxy(target, name, callback, option = {}) {\n if (Array.isArray(name)) {\n return name.map(item => this.proxy(target, item, callback, option));\n }\n\n target.addEventListener(name, callback, option);\n const destroy = () => target.removeEventListener(name, callback, option);\n this.destroyEvents.push(destroy);\n return destroy;\n }\n\n hover(target, mouseenter, mouseleave) {\n if (mouseenter) {\n this.proxy(target, 'mouseenter', mouseenter);\n }\n if (mouseleave) {\n this.proxy(target, 'mouseleave', mouseleave);\n }\n }\n\n loadImg(img) {\n return new Promise((resolve, reject) => {\n let image;\n\n if (img instanceof HTMLImageElement) {\n image = img;\n } else if (typeof img === 'string') {\n image = new Image();\n image.src = img;\n } else {\n return reject(img);\n }\n\n if (image.complete) {\n return resolve(image);\n }\n\n this.proxy(image, 'load', () => resolve(image));\n this.proxy(image, 'error', () => reject(image));\n\n return img;\n });\n }\n\n destroy() {\n this.destroyEvents.forEach(event => event());\n }\n}\n","export default class Hotkey {\n constructor(art) {\n this.keys = {};\n\n const {\n option,\n player,\n events: { proxy },\n } = art;\n\n if (option.hotkey) {\n art.on('ready', () => {\n this.add(27, () => {\n if (player.fullscreenWeb) {\n player.fullscreenWeb = false;\n }\n });\n\n this.add(32, () => {\n player.toggle = true;\n });\n\n this.add(37, () => {\n player.seek = player.currentTime - 5;\n });\n\n this.add(38, () => {\n player.volume += 0.1;\n });\n\n this.add(39, () => {\n player.seek = player.currentTime + 5;\n });\n\n this.add(40, () => {\n player.volume -= 0.1;\n });\n\n proxy(window, 'keydown', event => {\n if (art.isFocus) {\n const tag = document.activeElement.tagName.toUpperCase();\n const editable = document.activeElement.getAttribute('contenteditable');\n if (tag !== 'INPUT' && tag !== 'TEXTAREA' && editable !== '' && editable !== 'true') {\n const events = this.keys[event.keyCode];\n if (events) {\n event.preventDefault();\n events.forEach(fn => fn());\n art.emit('hotkey', event);\n }\n }\n }\n });\n });\n }\n }\n\n add(key, event) {\n if (this.keys[key]) {\n this.keys[key].push(event);\n } else {\n this.keys[key] = [event];\n }\n }\n}\n","import Component from './utils/component';\n\nexport default class Layer extends Component {\n constructor(art) {\n super(art);\n this.$parent = art.template.$layer;\n art.on('ready', () => {\n art.option.layers.forEach(item => {\n this.add(item);\n });\n });\n }\n}\n","import { append } from './utils';\nimport Component from './utils/component';\n\nexport default class Loading extends Component {\n constructor(art) {\n super(art);\n append(art.template.$loading, art.icons.loading);\n }\n}\n","import { addClass, removeClass } from './utils';\n\nexport default class Notice {\n constructor(art) {\n this.art = art;\n this.time = 2000;\n this.timer = null;\n }\n\n set show(msg) {\n const { $player, $noticeInner } = this.art.template;\n $noticeInner.innerText = msg instanceof Error ? msg.message.trim() : msg;\n addClass($player, 'art-notice-show');\n clearTimeout(this.timer);\n this.timer = setTimeout(() => {\n $noticeInner.innerText = '';\n removeClass($player, 'art-notice-show');\n }, this.time);\n }\n}\n","import { append } from './utils';\nimport Component from './utils/component';\n\nexport default class Mask extends Component {\n constructor(art) {\n super(art);\n append(art.template.$state, art.icons.state);\n }\n}\n","import { append } from '../utils';\nimport loading from './loading.svg';\nimport state from './state.svg';\nimport play from './play.svg';\nimport pause from './pause.svg';\nimport volume from './volume.svg';\nimport volumeClose from './volume-close.svg';\nimport subtitle from './subtitle.svg';\nimport screenshot from './screenshot.svg';\nimport setting from './setting.svg';\nimport fullscreen from './fullscreen.svg';\nimport fullscreenWeb from './fullscreen-web.svg';\nimport pip from './pip.svg';\n\nexport default class Icons {\n constructor(art) {\n const icons = {\n loading,\n state,\n play,\n pause,\n volume,\n volumeClose,\n subtitle,\n screenshot,\n setting,\n fullscreen,\n fullscreenWeb,\n pip,\n ...art.option.icons,\n };\n\n Object.keys(icons).forEach(key => {\n const icon = document.createElement('i');\n icon.classList.add('art-icon');\n icon.classList.add(`art-icon-${key}`);\n append(icon, icons[key]);\n this[key] = icon;\n });\n }\n}\n","import { inverseClass, queryAll } from '../utils';\n\nexport default function flip(option) {\n return art => {\n const { i18n, player } = art;\n return {\n ...option,\n html: `\n".concat(t,"
")})).join(""),this.art.emit("subtitle:update",this.activeCue.text))}},{key:"switch",value:function(t,e,n){var r=this,i=this.art,o=i.i18n,a=i.notice;return this.init(t,n).then((function(t){return e&&(a.show="".concat(o.get("Switch subtitle"),": ").concat(e)),r.art.emit("subtitle:switch",t),t}))}},{key:"init",value:function(t,e){var n=this,r=this.art,i=r.notice,o=r.template,a=o.$subtitle,c=o.$track;return fetch(t).then((function(t){return t.text()})).then((function(r){switch(n.art.emit("subtitle:load",t),e||D(t)){case"srt":return R($(r));case"ass":return R(C(r));case"vtt":return R(r);default:return t}})).then((function(t){return a.innerHTML="",n.url===t?t:(URL.revokeObjectURL(n.url),c.src=t,t)})).catch((function(t){throw i.show=t,n.art.emit("subtitle:err",t),t}))}},{key:"url",get:function(){return this.art.template.$track.src}},{key:"textTrack",get:function(){return this.art.template.$video.textTracks[0]}},{key:"activeCue",get:function(){return this.textTrack.activeCues[0]}}]),r}(ct);var Zt=function(){function e(n){var r=this;t(this,e),this.destroyEvents=[],this.proxy=this.proxy.bind(this),this.hover=this.hover.bind(this),this.loadImg=this.loadImg.bind(this),n.whitelist.state&&n.on("ready",(function(){!function(t,e){var n=t.template.$player;e.proxy(document,["click","contextmenu"],(function(e){e.composedPath().indexOf(n)>-1?(t.isFocus=!0,t.emit("focus")):(t.isFocus=!1,t.emit("blur"))}))}(n,r),function(t,e){var n=t.template.$player;e.hover(n,(function(){h(n,"art-hover"),t.emit("hoverenter")}),(function(){y(n,"art-hover"),t.emit("hoverleave")}))}(n,r),function(t,e){var n=t.template,r=n.$player,i=n.$video,o=t.player,a=t.controls,c=N((function(){h(r,"art-hide-cursor"),y(r,"art-hover"),a.show=!1}),3e3);t.on("hoverleave",(function(){o.playing&&c()})),e.proxy(r,"mousemove",(function(e){c.clearTimeout(),y(r,"art-hide-cursor"),a.show=!0,!o.pip&&o.playing&&e.target===i&&c(),t.emit("mousemove")}))}(n,r),function(t,e){var n=t.option,r=t.player,i=t.template.$player,o=document.createElement("object");o.setAttribute("aria-hidden","true"),o.setAttribute("tabindex",-1),o.type="text/html",o.data="about:blank";var a=r.width,c=r.height,u=I((function(){r.width===a&&r.height===c||(a=r.width,c=r.height,n.autoSize&&(r.fullscreen||r.fullscreenWeb||r.pip?r.autoSize=!1:r.autoSize=!0),r.aspectRatioReset=!0,t.emit("resize",{width:r.width,height:r.height}))}),500);e.proxy(o,"load",(function(){e.proxy(o.contentDocument.defaultView,"resize",u)})),i.appendChild(o)}(n,r)}))}return n(e,[{key:"proxy",value:function(t,e,n){var r=this,i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};if(Array.isArray(e))return e.map((function(e){return r.proxy(t,e,n,i)}));t.addEventListener(e,n,i);var o=function(){return t.removeEventListener(e,n,i)};return this.destroyEvents.push(o),o}},{key:"hover",value:function(t,e,n){e&&this.proxy(t,"mouseenter",e),n&&this.proxy(t,"mouseleave",n)}},{key:"loadImg",value:function(t){var e=this;return new Promise((function(n,r){var i;if(t instanceof HTMLImageElement)i=t;else{if("string"!=typeof t)return r(t);(i=new Image).src=t}return i.complete?n(i):(e.proxy(i,"load",(function(){return n(i)})),e.proxy(i,"error",(function(){return r(i)})),t)}))}},{key:"destroy",value:function(){this.destroyEvents.forEach((function(t){return t()}))}}]),e}(),Yt=function(){function e(n){var r=this;t(this,e),this.keys={};var i=n.option,o=n.player,a=n.events.proxy;i.hotkey&&n.on("ready",(function(){r.add(27,(function(){o.fullscreenWeb&&(o.fullscreenWeb=!1)})),r.add(32,(function(){o.toggle=!0})),r.add(37,(function(){o.seek=o.currentTime-5})),r.add(38,(function(){o.volume+=.1})),r.add(39,(function(){o.seek=o.currentTime+5})),r.add(40,(function(){o.volume-=.1})),a(window,"keydown",(function(t){if(n.isFocus){var e=document.activeElement.tagName.toUpperCase(),i=document.activeElement.getAttribute("contenteditable");if("INPUT"!==e&&"TEXTAREA"!==e&&""!==i&&"true"!==i){var o=r.keys[t.keyCode];o&&(t.preventDefault(),o.forEach((function(t){return t()})),n.emit("hotkey",t))}}}))}))}return n(e,[{key:"add",value:function(t,e){this.keys[t]?this.keys[t].push(e):this.keys[t]=[e]}}]),e}(),Jt=function(e){function n(e){var r;return t(this,n),(r=a(this,c(n).call(this,e))).$parent=e.template.$layer,e.on("ready",(function(){e.option.layers.forEach((function(t){r.add(t)}))})),r}return s(n,e),n}(ct),Gt=function(e){function n(e){var r;return t(this,n),r=a(this,c(n).call(this,e)),m(e.template.$loading,e.icons.loading),r}return s(n,e),n}(ct),Qt=function(){function e(n){t(this,e),this.art=n,this.time=2e3,this.timer=null}return n(e,[{key:"show",set:function(t){var e=this.art.template,n=e.$player,r=e.$noticeInner;r.innerText=t instanceof Error?t.message.trim():t,h(n,"art-notice-show"),clearTimeout(this.timer),this.timer=setTimeout((function(){r.innerText="",y(n,"art-notice-show")}),this.time)}}]),e}(),Kt=function(e){function n(e){var r;return t(this,n),r=a(this,c(n).call(this,e)),m(e.template.$state,e.icons.state),r}return s(n,e),n}(ct);function te(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);e&&(r=r.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,r)}return n}var ee=function e(n){var r=this;t(this,e);var i=function(t){for(var e=1;e".concat(t,"
")})).join(""),this.art.emit("subtitle:update",this.activeCue.text))}},{key:"switch",value:function(t,e,n){var r=this,i=this.art,o=i.i18n,a=i.notice;return this.init(t,n).then((function(t){return e&&(a.show="".concat(o.get("Switch subtitle"),": ").concat(e)),r.art.emit("subtitle:switch",t),t}))}},{key:"init",value:function(t,e){var n=this,r=this.art,i=r.notice,o=r.template,a=o.$subtitle,c=o.$track;return fetch(t).then((function(t){return t.text()})).then((function(r){switch(n.art.emit("subtitle:load",t),e||D(t)){case"srt":return R($(r));case"ass":return R(C(r));case"vtt":return R(r);default:return t}})).then((function(t){return a.innerHTML="",n.url===t?t:(URL.revokeObjectURL(n.url),c.src=t,t)})).catch((function(t){throw i.show=t,n.art.emit("subtitle:err",t),t}))}},{key:"url",get:function(){return this.art.template.$track.src}},{key:"textTrack",get:function(){return this.art.template.$video.textTracks[0]}},{key:"activeCue",get:function(){return this.textTrack.activeCues[0]}}]),r}(ct);var Zt=function(){function e(n){var r=this;t(this,e),this.destroyEvents=[],this.proxy=this.proxy.bind(this),this.hover=this.hover.bind(this),this.loadImg=this.loadImg.bind(this),n.whitelist.state&&n.on("ready",(function(){!function(t,e){var n=t.template.$player;e.proxy(document,["click","contextmenu"],(function(e){e.composedPath().indexOf(n)>-1?(t.isFocus=!0,t.emit("focus")):(t.isFocus=!1,t.emit("blur"))}))}(n,r),function(t,e){var n=t.template.$player;e.hover(n,(function(){h(n,"art-hover"),t.emit("hoverenter")}),(function(){y(n,"art-hover"),t.emit("hoverleave")}))}(n,r),function(t,e){var n=t.template,r=n.$player,i=n.$video,o=t.player,a=t.controls,c=N((function(){h(r,"art-hide-cursor"),y(r,"art-hover"),a.show=!1}),3e3);t.on("hoverleave",(function(){o.playing&&c()})),e.proxy(r,"mousemove",(function(e){c.clearTimeout(),y(r,"art-hide-cursor"),a.show=!0,!o.pip&&o.playing&&e.target===i&&c(),t.emit("mousemove")}))}(n,r),function(t,e){var n=t.option,r=t.player,i=t.template.$player,o=document.createElement("object");o.setAttribute("aria-hidden","true"),o.setAttribute("tabindex",-1),o.type="text/html",o.data="about:blank";var a=r.width,c=r.height,u=I((function(){r.width===a&&r.height===c||(a=r.width,c=r.height,n.autoSize&&(r.fullscreen||r.fullscreenWeb||r.pip?r.autoSize=!1:r.autoSize=!0),r.aspectRatioReset=!0,t.emit("resize",{width:r.width,height:r.height}))}),500);e.proxy(o,"load",(function(){e.proxy(o.contentDocument.defaultView,"resize",u)})),i.appendChild(o)}(n,r)}))}return n(e,[{key:"proxy",value:function(t,e,n){var r=this,i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};if(Array.isArray(e))return e.map((function(e){return r.proxy(t,e,n,i)}));t.addEventListener(e,n,i);var o=function(){return t.removeEventListener(e,n,i)};return this.destroyEvents.push(o),o}},{key:"hover",value:function(t,e,n){e&&this.proxy(t,"mouseenter",e),n&&this.proxy(t,"mouseleave",n)}},{key:"loadImg",value:function(t){var e=this;return new Promise((function(n,r){var i;if(t instanceof HTMLImageElement)i=t;else{if("string"!=typeof t)return r(t);(i=new Image).src=t}return i.complete?n(i):(e.proxy(i,"load",(function(){return n(i)})),e.proxy(i,"error",(function(){return r(i)})),t)}))}},{key:"destroy",value:function(){this.destroyEvents.forEach((function(t){return t()}))}}]),e}(),Yt=function(){function e(n){var r=this;t(this,e),this.keys={};var i=n.option,o=n.player,a=n.events.proxy;i.hotkey&&n.on("ready",(function(){r.add(27,(function(){o.fullscreenWeb&&(o.fullscreenWeb=!1)})),r.add(32,(function(){o.toggle=!0})),r.add(37,(function(){o.seek=o.currentTime-5})),r.add(38,(function(){o.volume+=.1})),r.add(39,(function(){o.seek=o.currentTime+5})),r.add(40,(function(){o.volume-=.1})),a(window,"keydown",(function(t){if(n.isFocus){var e=document.activeElement.tagName.toUpperCase(),i=document.activeElement.getAttribute("contenteditable");if("INPUT"!==e&&"TEXTAREA"!==e&&""!==i&&"true"!==i){var o=r.keys[t.keyCode];o&&(t.preventDefault(),o.forEach((function(t){return t()})),n.emit("hotkey",t))}}}))}))}return n(e,[{key:"add",value:function(t,e){this.keys[t]?this.keys[t].push(e):this.keys[t]=[e]}}]),e}(),Jt=function(e){function n(e){var r;return t(this,n),(r=a(this,c(n).call(this,e))).$parent=e.template.$layer,e.on("ready",(function(){e.option.layers.forEach((function(t){r.add(t)}))})),r}return s(n,e),n}(ct),Gt=function(e){function n(e){var r;return t(this,n),r=a(this,c(n).call(this,e)),m(e.template.$loading,e.icons.loading),r}return s(n,e),n}(ct),Qt=function(){function e(n){t(this,e),this.art=n,this.time=2e3,this.timer=null}return n(e,[{key:"show",set:function(t){var e=this.art.template,n=e.$player,r=e.$noticeInner;r.innerText=t instanceof Error?t.message.trim():t,h(n,"art-notice-show"),clearTimeout(this.timer),this.timer=setTimeout((function(){r.innerText="",y(n,"art-notice-show")}),this.time)}}]),e}(),Kt=function(e){function n(e){var r;return t(this,n),r=a(this,c(n).call(this,e)),m(e.template.$state,e.icons.state),r}return s(n,e),n}(ct);function te(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);e&&(r=r.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,r)}return n}var ee=function e(n){var r=this;t(this,e);var i=function(t){for(var e=1;e
`,
- style: {
- position: 'absolute',
- top: '20px',
- right: '20px',
- opacity: '.9',
- },
-});
-
- });
-
-
it(`Configuration.contextmenu`, function() {
var url = 'https://zhw2590582.github.io/assets-cdn';
@@ -591,25 +558,6 @@ var art = new Artplayer({
});
- it(`Configuration.contextmenu`, function() {
-
-var url = 'https://zhw2590582.github.io/assets-cdn';
-var art = new Artplayer({
- container: '.artplayer-app',
- url: url + '/video/one-more-time-one-more-chance-480p.mp4',
-});
-
-art.contextmenu.add({
- html: 'Custom menu',
- click: function(contextmenu) {
- console.info('You clicked on the custom menu');
- contextmenu.show = false;
- },
-});
-
- });
-
-
it(`Configuration.controls`, function() {
var url = 'https://zhw2590582.github.io/assets-cdn';
@@ -633,28 +581,6 @@ var art = new Artplayer({
});
- it(`Configuration.controls`, function() {
-
-var url = 'https://zhw2590582.github.io/assets-cdn';
-var art = new Artplayer({
- container: '.artplayer-app',
- url: url + '/video/one-more-time-one-more-chance-480p.mp4',
-});
-
-art.controls.add({
- name: 'myController',
- position: 'right',
- index: 10,
- html: 'myController',
- tooltip: 'This is my controller',
- click: function() {
- console.log('myController');
- },
-});
-
- });
-
-
it(`Configuration.plugins`, function() {
var url = 'https://zhw2590582.github.io/assets-cdn';
@@ -683,34 +609,6 @@ art.plugins.myPlugin.doSomething();
});
- it(`Configuration.plugins`, function() {
-
-var url = 'https://zhw2590582.github.io/assets-cdn';
-var art = new Artplayer({
- container: '.artplayer-app',
- url: url + '/video/one-more-time-one-more-chance-480p.mp4',
-});
-
-art.plugins.add(function myPlugin(art) {
- // Do something you like here.
- // You can also return an object for external calls.
- console.info('myPlugin running...');
- return {
- // This exposes plugin properties or methods for others to use. Like:
- something: 'something',
- doSomething: function() {
- console.info('Do something here...');
- },
- };
-});
-
-// Call plugin from the outside
-art.plugins.myPlugin.something === 'something';
-art.plugins.myPlugin.doSomething();
-
- });
-
-
it(`Properties.instance`, function() {
var url = 'https://zhw2590582.github.io/assets-cdn';
@@ -720,7 +618,8 @@ var art = new Artplayer({
});
console.log('isFocus', art.isFocus);
-console.log('isPlaying', art.isPlaying);
+console.log('isDestroy', art.isDestroy);
+console.log('option', art.option);
setTimeout(function() {
// remove dom
@@ -913,6 +812,46 @@ var art = new Artplayer({
});
+ it(`Properties.loading`, function() {
+
+var url = 'https://zhw2590582.github.io/assets-cdn';
+var art = new Artplayer({
+ container: '.artplayer-app',
+ url: url + '/video/one-more-time-one-more-chance-480p.mp4',
+});
+
+art.on('ready', function() {
+ // Show the loading
+ art.loading.show = true;
+ setTimeout(function() {
+ // Hide the loading
+ art.loading.show = false;
+ }, 5000);
+});
+
+ });
+
+
+ it(`Properties.mask`, function() {
+
+var url = 'https://zhw2590582.github.io/assets-cdn';
+var art = new Artplayer({
+ container: '.artplayer-app',
+ url: url + '/video/one-more-time-one-more-chance-480p.mp4',
+});
+
+art.on('ready', function() {
+ // Show the mask
+ art.mask.show = true;
+ setTimeout(function() {
+ // Hide the mask
+ art.mask.show = false;
+ }, 5000);
+});
+
+ });
+
+
it(`Properties.setting`, function() {
var url = 'https://zhw2590582.github.io/assets-cdn';
@@ -922,17 +861,21 @@ var art = new Artplayer({
setting: true,
});
-art.setting.add({
- html: 'Your Setting',
- name: 'yourSetting',
+art.on('ready', function() {
+ // Add a setting
+ art.setting.add({
+ html: 'Your Setting',
+ name: 'yourSetting',
+ });
+
+ // Show the setting
+ art.setting.show = true;
+ setTimeout(function() {
+ // Hide the setting
+ art.setting.show = false;
+ }, 5000);
});
-// Show the setting
-art.setting.show = true;
-
-// Hide the setting
-art.setting.show = false;
-
});