mirror of
https://github.com/zhw2590582/ArtPlayer.git
synced 2026-10-08 19:06:15 -08:00
简化player接口
This commit is contained in:
Harvey Zack committed
1 parent
1b69b28ba1
commit
52b6693da2
41 files changed
+624
-690
No files matched your search
@@ -0,0 +1,6 @@
|
||||
# Browsers that we support
|
||||
|
||||
last 1 version
|
||||
> 1%
|
||||
maintained node versions
|
||||
not dead
|
||||
+19
-30
@@ -857,42 +857,31 @@ Player core function
|
||||
|
||||
| propertie | type | Description |
|
||||
| ---------------------- | ---------- | ------------------------------------------------------------------------------------------------- |
|
||||
| `aspectRatioState` | `String` | Return the current value of aspect ratio |
|
||||
| `aspectRatio` | `Function` | Set aspect ratio, Currently only accepts three values：`default`, `4:3`, `16:9` |
|
||||
| `aspectRatioRemove` | `Function` | Remove aspect ratio |
|
||||
| `aspectRatioReset` | `Function` | Recalculate the aspect ratio |
|
||||
| `autoSizeState` | `Boolean` | Return the current state of auto size |
|
||||
| `autoSize` | `Function` | Set auto size |
|
||||
| `autoSizeRemove` | `Function` | Remove the auto size |
|
||||
| `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 |
|
||||
| `autoSize` | `Boolean` | Set auto size |
|
||||
| `currentTime` | `Number` | `Getter` and `Setter` of the current time |
|
||||
| `duration` | `Number` | `Getter` of the duration |
|
||||
| `flipState` | `String` | Return the current state of flip |
|
||||
| `flip` | `Function` | Set flip, Currently only accepts three values：`normal`, `horizontal`, `vertical` |
|
||||
| `flipRemove` | `Function` | Remove the flip |
|
||||
| `fullscreenState` | `Boolean` | Return the current state of fullscreen |
|
||||
| `fullscreenEnabled` | `Function` | Enable fullscreen |
|
||||
| `fullscreenExit` | `Function` | Exit fullscreen |
|
||||
| `fullscreenToggle` | `Function` | Toggle fullscreen |
|
||||
| `fullscreenWebState` | `Boolean` | Return the current state of web fullscreen |
|
||||
| `fullscreenWebEnabled` | `Function` | Enable web fullscreen |
|
||||
| `fullscreenWebExit` | `Function` | Exit web fullscreen |
|
||||
| `fullscreenWebToggle` | `Function` | Toggle web fullscreen |
|
||||
| `flip` | `String` | Set flip, Currently only accepts three values：`normal`, `horizontal`, `vertical` and `false` |
|
||||
| `fullscreen` | `Boolean` | Enable or disable fullscreen |
|
||||
| `fullscreenToggle` | `Boolean` | Toggle fullscreen |
|
||||
| `fullscreenWeb` | `Boolean` | Enable or disable web fullscreen |
|
||||
| `fullscreenWebToggle` | `Boolean` | Toggle web fullscreen |
|
||||
| `loaded` | `Number` | Return the proportion of the load |
|
||||
| `pause` | `Function` | Pause playback |
|
||||
| `pipState` | `Boolean` | Return the current state of pip |
|
||||
| `pipEnabled` | `Function` | Enable pip |
|
||||
| `pipExit` | `Function` | Exit pip |
|
||||
| `pipToggle` | `Function` | Toggle pip |
|
||||
| `playbackRateState` | `String` | Return the current state of playback rate |
|
||||
| `playbackRate` | `Function` | Set playbackRate, Currently only accepts three values：`0.5`, `0.75`, `1.0`, `1.25`, `1.5`, `2.0` |
|
||||
| `playbackRateRemove` | `Function` | Remove the playback rate |
|
||||
| `playbackRateReset` | `Function` | Recalculate the playback rate |
|
||||
| `pause` | `Boolean` | Pause playback |
|
||||
| `pip` | `Boolean` | Enable or disable pip |
|
||||
| `pipToggle` | `Boolean` | Toggle pip |
|
||||
| `playbackRate` | `String` | Set playbackRate, Currently only accepts three values：`0.5`, `0.75`, `1.0`, `1.25`, `1.5`, `2.0` |
|
||||
| `playbackRateReset` | `Boolean` | Recalculate the playback rate |
|
||||
| `played` | `Number` | Return the proportion of the played |
|
||||
| `playing` | `Boolean` | Return to playing state |
|
||||
| `play` | `Boolean` | Start playback |
|
||||
| `screenshot` | `Function` | Download a screenshot of current time |
|
||||
| `seek` | `Function` | Set the current time |
|
||||
| `seek` | `Number` | Set the current time |
|
||||
| `switchQuality` | `Function` | Switch quality |
|
||||
| `toggle` | `Function` | Toggle play and pause |
|
||||
| `switchUrl` | `Function` | Switch video url |
|
||||
| `toggle` | `Boolean` | Toggle play and pause |
|
||||
| `volume` | `Number` | `Getter` and `Setter` of the current volume |
|
||||
| `muted` | `Boolean` | `Getter` and `Setter` of the muted |
|
||||
|
||||
@@ -906,7 +895,7 @@ var art = new Artplayer({
|
||||
});
|
||||
|
||||
art.once('video:canplay', () => {
|
||||
art.player.seek(5);
|
||||
art.player.seek = 5;
|
||||
art.player.screenshot();
|
||||
});
|
||||
```
|
||||
|
||||
@@ -579,7 +579,7 @@
|
||||
danmu.$ref.innerText = danmu.text;
|
||||
danmu.$ref.style.color = danmu.color;
|
||||
danmu.$ref.style.border = danmu.border ? "1px solid ".concat(danmu.color) : 'none';
|
||||
danmu.$restTime = _this2.option.synchronousPlayback && player.playbackRateState ? _this2.option.speed / Number(player.playbackRateState) : _this2.option.speed;
|
||||
danmu.$restTime = _this2.option.synchronousPlayback && player.playbackRate ? _this2.option.speed / Number(player.playbackRate) : _this2.option.speed;
|
||||
danmu.$lastStartTime = Date.now();
|
||||
var danmuWidth = getRect(danmu.$ref, 'width');
|
||||
var danmuTop = getDanmuTop(_this2, danmu);
|
||||
@@ -625,7 +625,7 @@
|
||||
key: "start",
|
||||
value: function start() {
|
||||
this.isStop = false;
|
||||
this["continue"]();
|
||||
this.continue();
|
||||
this.update();
|
||||
this.art.emit('artplayerPluginDanmuku:start');
|
||||
}
|
||||
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"file":"artplayer-plugin-danmuku.js","sources":["../../node_modules/@babel/runtime/helpers/defineProperty.js","../../node_modules/@babel/runtime/helpers/objectSpread.js","../../node_modules/@babel/runtime/helpers/classCallCheck.js","../../node_modules/@babel/runtime/helpers/createClass.js","../../packages/artplayer-plugin-danmuku/src/i18n.js","../../packages/artplayer-plugin-danmuku/src/setting.js","../../packages/artplayer-plugin-danmuku/src/utils.js","../../node_modules/@babel/runtime/helpers/arrayWithHoles.js","../../node_modules/@babel/runtime/helpers/iterableToArrayLimit.js","../../node_modules/@babel/runtime/helpers/nonIterableRest.js","../../node_modules/@babel/runtime/helpers/slicedToArray.js","../../packages/artplayer-plugin-danmuku/src/bilibili.js","../../packages/artplayer-plugin-danmuku/src/getDanmuTop.js","../../packages/artplayer-plugin-danmuku/src/danmuku.js","../../packages/artplayer-plugin-danmuku/src/index.js"],"sourcesContent":["function _defineProperty(obj, key, value) {\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n\n return obj;\n}\n\nmodule.exports = _defineProperty;","var defineProperty = require(\"./defineProperty\");\n\nfunction _objectSpread(target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i] != null ? arguments[i] : {};\n var ownKeys = Object.keys(source);\n\n if (typeof Object.getOwnPropertySymbols === 'function') {\n ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {\n return Object.getOwnPropertyDescriptor(source, sym).enumerable;\n }));\n }\n\n ownKeys.forEach(function (key) {\n defineProperty(target, key, source[key]);\n });\n }\n\n return target;\n}\n\nmodule.exports = _objectSpread;","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;","export default {\n 'zh-cn': {\n 'Danmu opacity': '弹幕透明度',\n 'Danmu speed': '弹幕速度',\n 'Danmu size': '弹幕大小',\n 'Danmu text cannot be empty': '弹幕文本不能为空',\n 'The length of the danmu does not exceed': '弹幕文本字数不能超过',\n 'Danmu speed synchronous playback multiple': '弹幕速度同步播放倍数',\n },\n 'zh-tw': {\n 'Danmu opacity': '彈幕透明度',\n 'Danmu speed': '彈幕速度',\n 'Danmu size': '弹幕大小',\n 'Danmu text cannot be empty': '彈幕文本不能為空',\n 'The length of the danmu does not exceed': '彈幕文本字數不能超過',\n 'Danmu speed synchronous playback multiple': '彈幕速度同步播放倍數',\n },\n};","export function opacity(art) {\n const {\n i18n,\n events: { proxy },\n } = art;\n\n return {\n name: 'danmuku-opacity',\n index: 10,\n html: `\n <div class=\"art-setting-header\">\n ${i18n.get('Danmu opacity')}: <span class=\"art-value\">100</span>%\n </div>\n <div class=\"art-setting-range\">\n <input type=\"range\" value=\"1\" min=\"0.1\" max=\"1\" step=\"0.1\">\n </div>\n `,\n mounted: $setting => {\n const $range = $setting.querySelector('input[type=range]');\n const $value = $setting.querySelector('.art-value');\n proxy($range, 'change', () => {\n const { value } = $range;\n $value.innerText = Number(value) * 100;\n\n art.plugins.artplayerPluginDanmuku.config({\n opacity: Number(value),\n });\n });\n\n art.on('artplayerPluginDanmuku:config', config => {\n if ($range.value !== config.opacity) {\n $range.value = config.opacity;\n $value.innerText = config.opacity * 100;\n }\n });\n },\n };\n}\n\nexport function size(art) {\n const {\n i18n,\n events: { proxy },\n } = art;\n\n return {\n name: 'danmuku-size',\n index: 11,\n hLine truncated
|
||||
{"version":3,"file":"artplayer-plugin-danmuku.js","sources":["../../node_modules/@babel/runtime/helpers/defineProperty.js","../../node_modules/@babel/runtime/helpers/objectSpread.js","../../node_modules/@babel/runtime/helpers/classCallCheck.js","../../node_modules/@babel/runtime/helpers/createClass.js","../../packages/artplayer-plugin-danmuku/src/i18n.js","../../packages/artplayer-plugin-danmuku/src/setting.js","../../packages/artplayer-plugin-danmuku/src/utils.js","../../node_modules/@babel/runtime/helpers/arrayWithHoles.js","../../node_modules/@babel/runtime/helpers/iterableToArrayLimit.js","../../node_modules/@babel/runtime/helpers/nonIterableRest.js","../../node_modules/@babel/runtime/helpers/slicedToArray.js","../../packages/artplayer-plugin-danmuku/src/bilibili.js","../../packages/artplayer-plugin-danmuku/src/getDanmuTop.js","../../packages/artplayer-plugin-danmuku/src/danmuku.js","../../packages/artplayer-plugin-danmuku/src/index.js"],"sourcesContent":["function _defineProperty(obj, key, value) {\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n\n return obj;\n}\n\nmodule.exports = _defineProperty;","var defineProperty = require(\"./defineProperty\");\n\nfunction _objectSpread(target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i] != null ? arguments[i] : {};\n var ownKeys = Object.keys(source);\n\n if (typeof Object.getOwnPropertySymbols === 'function') {\n ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {\n return Object.getOwnPropertyDescriptor(source, sym).enumerable;\n }));\n }\n\n ownKeys.forEach(function (key) {\n defineProperty(target, key, source[key]);\n });\n }\n\n return target;\n}\n\nmodule.exports = _objectSpread;","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;","export default {\n 'zh-cn': {\n 'Danmu opacity': '弹幕透明度',\n 'Danmu speed': '弹幕速度',\n 'Danmu size': '弹幕大小',\n 'Danmu text cannot be empty': '弹幕文本不能为空',\n 'The length of the danmu does not exceed': '弹幕文本字数不能超过',\n 'Danmu speed synchronous playback multiple': '弹幕速度同步播放倍数',\n },\n 'zh-tw': {\n 'Danmu opacity': '彈幕透明度',\n 'Danmu speed': '彈幕速度',\n 'Danmu size': '弹幕大小',\n 'Danmu text cannot be empty': '彈幕文本不能為空',\n 'The length of the danmu does not exceed': '彈幕文本字數不能超過',\n 'Danmu speed synchronous playback multiple': '彈幕速度同步播放倍數',\n },\n};","export function opacity(art) {\n const {\n i18n,\n events: { proxy },\n } = art;\n\n return {\n name: 'danmuku-opacity',\n index: 10,\n html: `\n <div class=\"art-setting-header\">\n ${i18n.get('Danmu opacity')}: <span class=\"art-value\">100</span>%\n </div>\n <div class=\"art-setting-range\">\n <input type=\"range\" value=\"1\" min=\"0.1\" max=\"1\" step=\"0.1\">\n </div>\n `,\n mounted: $setting => {\n const $range = $setting.querySelector('input[type=range]');\n const $value = $setting.querySelector('.art-value');\n proxy($range, 'change', () => {\n const { value } = $range;\n $value.innerText = Number(value) * 100;\n\n art.plugins.artplayerPluginDanmuku.config({\n opacity: Number(value),\n });\n });\n\n art.on('artplayerPluginDanmuku:config', config => {\n if ($range.value !== config.opacity) {\n $range.value = config.opacity;\n $value.innerText = config.opacity * 100;\n }\n });\n },\n };\n}\n\nexport function size(art) {\n const {\n i18n,\n events: { proxy },\n } = art;\n\n return {\n name: 'danmuku-size',\n index: 11,\n hLine truncated
|
||||
@@ -1,20 +1,20 @@
|
||||
.artplayer-video-player{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;margin:0 auto;z-index:10;width:100%;height:100%;outline:0;zoom:1;font-family:Roboto,Arial,Helvetica,sans-serif;color:#eee;text-align:left;direction:ltr;font-size:14px;line-height:1.3;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);-ms-touch-action:manipulation;touch-action:manipulation;-ms-high-contrast-adjust:none}.artplayer-video-player *{margin:0;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box}.artplayer-video-player .art-icon{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;line-height:1.5}.artplayer-video-player .art-icon svg{fill:#fff}
|
||||
.artplayer-video-player{display:flex;position:relative;margin:0 auto;z-index:10;width:100%;height:100%;outline:0;zoom:1;font-family:Roboto,Arial,Helvetica,sans-serif;color:#eee;text-align:left;direction:ltr;font-size:14px;line-height:1.3;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);touch-action:manipulation;-ms-high-contrast-adjust:none}.artplayer-video-player *{margin:0;padding:0;box-sizing:border-box}.artplayer-video-player .art-icon{display:inline-flex;justify-content:center;align-items:center;line-height:1.5}.artplayer-video-player .art-icon svg{fill:#fff}
|
||||
.artplayer-video-player .artplayer-video{position:absolute;z-index:10;left:0;top:0;right:0;bottom:0;width:100%;height:100%;background-color:#000;cursor:pointer}
|
||||
.artplayer-video-player .artplayer-subtitle{position:absolute;z-index:20;bottom:40px;width:100%;padding:0 20px;text-align:center;color:#fff;font-size:20px;pointer-events:none;text-shadow:.5px .5px .5px rgba(0,0,0,.5)}.artplayer-video-player .artplayer-subtitle p{margin:5px 0}.artplayer-video-player.artplayer-subtitle-hide .artplayer-subtitle{display:none}
|
||||
.artplayer-video-player .artplayer-danmuku{position:absolute;z-index:30;left:0;top:0;right:0;bottom:0;width:100%;height:100%;overflow:hidden;pointer-events:none}
|
||||
.artplayer-video-player .artplayer-layers{position:absolute;z-index:40;left:0;top:0;right:0;bottom:0;width:100%;height:100%;overflow:hidden;pointer-events:none}.artplayer-video-player .artplayer-layers .art-layer{pointer-events:auto}.artplayer-video-player.artplayer-layers-hide .artplayer-layers{display:none}
|
||||
.artplayer-video-player .artplayer-mask{display:none;z-index:50;left:0;top:0;right:0;bottom:0;width:100%;height:100%;overflow:hidden;pointer-events:none}.artplayer-video-player .artplayer-mask,.artplayer-video-player .artplayer-mask .art-state{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:absolute}.artplayer-video-player .artplayer-mask .art-state{right:30px;bottom:55px;width:60px;height:60px;opacity:.6}.artplayer-video-player.artplayer-mask-show .artplayer-mask,.artplayer-video-player .artplayer-mask .art-state{display:-webkit-box;display:-ms-flexbox;display:flex}
|
||||
.artplayer-video-player .artplayer-loading{display:none;position:absolute;z-index:70;left:0;top:0;right:0;bottom:0;width:100%;height:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;pointer-events:none}.artplayer-video-player.artplayer-loading-show .artplayer-loading{display:-webkit-box;display:-ms-flexbox;display:flex}
|
||||
.artplayer-video-player .artplayer-bottom{position:absolute;z-index:60;left:0;right:0;bottom:0;height:100px;padding:60px 10px 0;opacity:0;visibility:hidden;-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out;pointer-events:none;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAADGCAYAAAAT+OqFAAAAdklEQVQoz42QQQ7AIAgEF/T/D+kbq/RWAlnQyyazA4aoAB4FsBSA/bFjuF1EOL7VbrIrBuusmrt4ZZORfb6ehbWdnRHEIiITaEUKa5EJqUakRSaEYBJSCY2dEstQY7AuxahwXFrvZmWl2rh4JZ07z9dLtesfNj5q0FU3A5ObbwAAAABJRU5ErkJggg==) repeat-x bottom}.artplayer-video-player .artplayer-bottom .artplayer-progress{position:relative;pointer-events:auto}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress{position:relative;height:5px;padding:1px 0;cursor:pointer}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress .art-control-progress-inner{position:relative;height:100%;background:hsla(0,0%,100%,.2)}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress .art-control-progress-inner .art-progress-loaded{position:absolute;z-index:10;left:0;top:0;right:0;bottom:0;height:100%;width:0;background:hsla(0,0%,100%,.4)}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress .art-control-progress-inner .art-progress-played{position:absolute;z-index:20;left:0;top:0;right:0;bottom:0;height:100%;width:0}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress .art-control-progress-inner .art-progress-highlight{position:absolute;z-index:30;left:0;top:0;right:0;bottom:0;height:0}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress .art-control-progress-inner .art-progress-highlight span{display:inline-block;position:absolute;left:0;top:0;width:7px;height:3px;background:#fff;border-radius:3px}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress .art-control-progress-inner .art-progress-indicator{display:none;position:absolute;z-index:40;top:-5px;left:-6.5px;width:13px;height:13px;border-radius:50%}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress .art-control-progress-inner .art-progress-indicator.art-show-indicator{display:block}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress .art-control-progress-inner .art-progress-tip{display:none;position:absolute;z-index:50;top:-25px;left:0;height:20px;padding:0 5px;line-height:20px;color:#fff;font-size:12px;text-align:center;background:rgba(0,0,0,.7);border-radius:3px;font-weight:700;white-space:nowrap}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress:hover .art-progress-indicator,.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress:hover .art-progress-tip{display:block}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-thumbnails{display:none;position:absolute;bottom:8px;left:0;pointer-events:none;background-color:rgba(0,0,0,.7)}.artplayer-video-player .artplayer-bottom .artplayer-controls{position:relative;pointer-events:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;height:36px}.artplayer-video-player .artplayer-bottom .artplayer-controls .artplayer-controls-left,.artplayer-video-player .artplayer-bottom .artplayer-controls .artplayer-controls-right{display:-webkit-box;display:-ms-flexbox;display:flex}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control{opacity:.9;font-size:12px;height:36px;min-width:36px;line-height:36px;text-align:center;cursor:pointer}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control .art-icon{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;float:left;height:36px;width:36px}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control:hover{opacity:1}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-volume .art-volume-panel{position:relative;float:left;width:0;height:100%;-webkit-transition:margin .2s cubic-bezier(.4,0,1,1),width .2s cubic-bezier(.4,0,1,1);transition:margin .2s cubic-bezier(.4,0,1,1),width .2s cubic-bezier(.4,0,1,1);overflow:hidden}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-volume .art-volume-panel .art-volume-slider-handle{position:absolute;top:50%;left:0;width:12px;height:12px;border-radius:12px;margin-top:-6px;background:#fff}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-volume .art-volume-panel .art-volume-slider-handle:before{left:-54px;background:#fff}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-volume .art-volume-panel .art-volume-slider-hanLine truncated
|
||||
.artplayer-video-player .artplayer-notice{display:none;font-size:14px;position:absolute;z-index:80;left:0;top:0;padding:10px;width:100%;pointer-events:none}.artplayer-video-player .artplayer-notice .artplayer-notice-inner{display:inline-block;padding:5px 10px;color:#fff;background:rgba(0,0,0,.6);border-radius:3px}.artplayer-video-player.artplayer-notice-show .artplayer-notice{display:-webkit-box;display:-ms-flexbox;display:flex}
|
||||
.artplayer-video-player .artplayer-contextmenu{display:none;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;position:absolute;z-index:120;left:0;top:0;min-width:200px;padding:5px 0;background:rgba(0,0,0,.8);border-radius:3px}.artplayer-video-player .artplayer-contextmenu .art-contextmenu{cursor:pointer;font-size:13px;display:block;color:#fff;padding:7px 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 0 2px rgba(0,0,0,.5);border-bottom:1px solid hsla(0,0%,100%,.1)}.artplayer-video-player .artplayer-contextmenu .art-contextmenu a{color:#fff;text-decoration:none}.artplayer-video-player .artplayer-contextmenu .art-contextmenu span{display:inline-block;padding:0 7px}.artplayer-video-player .artplayer-contextmenu .art-contextmenu span.current,.artplayer-video-player .artplayer-contextmenu .art-contextmenu span:hover{color:#00c9ff}.artplayer-video-player .artplayer-contextmenu .art-contextmenu:hover{background-color:hsla(0,0%,100%,.1)}.artplayer-video-player .artplayer-contextmenu .art-contextmenu:last-child{border-bottom:none}.artplayer-video-player.artplayer-contextmenu-show .artplayer-contextmenu{display:-webkit-box;display:-ms-flexbox;display:flex}
|
||||
.artplayer-video-player .artplayer-setting{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:absolute;z-index:90;left:0;top:0;height:100%;width:100%;opacity:0;visibility:hidden;pointer-events:none;overflow:hidden}.artplayer-video-player .artplayer-setting .artplayer-setting-inner{position:absolute;top:0;right:-300px;bottom:0;width:300px;height:100%;font-size:12px;background:rgba(0,0,0,.8);-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out;overflow:auto}.artplayer-video-player .artplayer-setting .artplayer-setting-inner .artplayer-setting-body{overflow-y:auto;width:100%;height:100%}.artplayer-video-player .artplayer-setting .artplayer-setting-inner .artplayer-setting-body .art-setting{border-bottom:1px solid hsla(0,0%,100%,.1);padding:10px 15px}.artplayer-video-player .artplayer-setting .artplayer-setting-inner .artplayer-setting-body .art-setting .art-setting-header{margin-bottom:5px}.artplayer-video-player .artplayer-setting .art-setting-radio{display:-webkit-box;display:-ms-flexbox;display:flex}.artplayer-video-player .artplayer-setting .art-setting-radio .art-radio-item{-webkit-box-flex:1;-ms-flex:1;flex:1;padding:0 2px}.artplayer-video-player .artplayer-setting .art-setting-radio .art-radio-item button{height:22px;width:100%;border:none;outline:none;color:#fff;background:hsla(0,0%,100%,.2);border-radius:2px}.artplayer-video-player .artplayer-setting .art-setting-radio .art-radio-item.current button{background-color:#00a1d6}.artplayer-video-player .artplayer-setting .art-setting-range input{width:100%;height:3px;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:hsla(0,0%,100%,.5)}.artplayer-video-player .artplayer-setting .art-setting-checkbox input{height:14px;width:14px;margin-right:5px}.artplayer-video-player.artplayer-setting-show .artplayer-setting{opacity:1;visibility:visible;pointer-events:auto}.artplayer-video-player.artplayer-setting-show .artplayer-setting .artplayer-setting-inner{right:0}
|
||||
.artplayer-video-player .artplayer-info{display:none;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;position:absolute;left:10px;top:10px;z-index:100;width:350px;min-height:150px;padding:10px;color:#fff;font-size:12px;font-family:Noto Sans CJK SC DemiLight,Roboto,Segoe UI,Tahoma,Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased;background:rgba(0,0,0,.7)}.artplayer-video-player .artplayer-info .art-info-item{display:-webkit-box;display:-ms-flexbox;display:flex;margin-bottom:5px}.artplayer-video-player .artplayer-info .art-info-item .art-info-title{width:100px;text-align:right}.artplayer-video-player .artplayer-info .art-info-item .art-info-content{-webkit-box-flex:1;-ms-flex:1;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:5px}.artplayer-video-player .artplayer-info .artplayer-info-close{position:absolute;top:5px;right:5px;cursor:pointer}.artplayer-video-player.artplayer-info-show .artplayer-info{display:-webkit-box;display:-ms-flexbox;display:flex}
|
||||
.artplayer-video-player .artplayer-mask{display:none;align-items:center;justify-content:center;position:absolute;z-index:50;left:0;top:0;right:0;bottom:0;width:100%;height:100%;overflow:hidden;pointer-events:none}.artplayer-video-player .artplayer-mask .art-state{display:flex;justify-content:center;align-items:center;position:absolute;right:30px;bottom:55px;width:60px;height:60px;opacity:.6}.artplayer-video-player.artplayer-mask-show .artplayer-mask{display:flex}
|
||||
.artplayer-video-player .artplayer-loading{display:none;position:absolute;z-index:70;left:0;top:0;right:0;bottom:0;width:100%;height:100%;align-items:center;justify-content:center;pointer-events:none}.artplayer-video-player.artplayer-loading-show .artplayer-loading{display:flex}
|
||||
.artplayer-video-player .artplayer-bottom{position:absolute;z-index:60;left:0;right:0;bottom:0;height:100px;padding:60px 10px 0;opacity:0;visibility:hidden;transition:all .2s ease-in-out;pointer-events:none;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAADGCAYAAAAT+OqFAAAAdklEQVQoz42QQQ7AIAgEF/T/D+kbq/RWAlnQyyazA4aoAB4FsBSA/bFjuF1EOL7VbrIrBuusmrt4ZZORfb6ehbWdnRHEIiITaEUKa5EJqUakRSaEYBJSCY2dEstQY7AuxahwXFrvZmWl2rh4JZ07z9dLtesfNj5q0FU3A5ObbwAAAABJRU5ErkJggg==) repeat-x bottom}.artplayer-video-player .artplayer-bottom .artplayer-progress{position:relative;pointer-events:auto}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress{position:relative;height:5px;padding:1px 0;cursor:pointer}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress .art-control-progress-inner{position:relative;height:100%;background:hsla(0,0%,100%,.2)}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress .art-control-progress-inner .art-progress-loaded{position:absolute;z-index:10;left:0;top:0;right:0;bottom:0;height:100%;width:0;background:hsla(0,0%,100%,.4)}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress .art-control-progress-inner .art-progress-played{position:absolute;z-index:20;left:0;top:0;right:0;bottom:0;height:100%;width:0}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress .art-control-progress-inner .art-progress-highlight{position:absolute;z-index:30;left:0;top:0;right:0;bottom:0;height:0}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress .art-control-progress-inner .art-progress-highlight span{display:inline-block;position:absolute;left:0;top:0;width:7px;height:3px;background:#fff;border-radius:3px}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress .art-control-progress-inner .art-progress-indicator{display:none;position:absolute;z-index:40;top:-5px;left:-6.5px;width:13px;height:13px;border-radius:50%}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress .art-control-progress-inner .art-progress-indicator.art-show-indicator{display:block}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress .art-control-progress-inner .art-progress-tip{display:none;position:absolute;z-index:50;top:-25px;left:0;height:20px;padding:0 5px;line-height:20px;color:#fff;font-size:12px;text-align:center;background:rgba(0,0,0,.7);border-radius:3px;font-weight:700;white-space:nowrap}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress:hover .art-progress-indicator,.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-progress:hover .art-progress-tip{display:block}.artplayer-video-player .artplayer-bottom .artplayer-progress .art-control-thumbnails{display:none;position:absolute;bottom:8px;left:0;pointer-events:none;background-color:rgba(0,0,0,.7)}.artplayer-video-player .artplayer-bottom .artplayer-controls{position:relative;pointer-events:auto;display:flex;align-items:center;justify-content:space-between;height:36px}.artplayer-video-player .artplayer-bottom .artplayer-controls .artplayer-controls-left,.artplayer-video-player .artplayer-bottom .artplayer-controls .artplayer-controls-right{display:flex}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control{opacity:.9;font-size:12px;height:36px;min-width:36px;line-height:36px;text-align:center;cursor:pointer}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control .art-icon{display:flex;align-items:center;justify-content:center;float:left;height:36px;width:36px}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control:hover{opacity:1}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-volume .art-volume-panel{position:relative;float:left;width:0;height:100%;transition:margin .2s cubic-bezier(.4,0,1,1),width .2s cubic-bezier(.4,0,1,1);overflow:hidden}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-volume .art-volume-panel .art-volume-slider-handle{position:absolute;top:50%;left:0;width:12px;height:12px;border-radius:12px;margin-top:-6px;background:#fff}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-volume .art-volume-panel .art-volume-slider-handle:before{left:-54px;background:#fff}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-volume .art-volume-panel .art-volume-slider-handle:after{left:6px;background:hsla(0,0%,100%,.2)}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-volume .art-volume-panel .art-volume-slider-handle:after,.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-volume .art-volume-panel .art-volume-slider-handle:before{content:"";position:absolute;display:block;top:50%;height:3px;margin-top:-2px;width:60px}.artplayer-video-player .artLine truncated
|
||||
.artplayer-video-player .artplayer-notice{display:none;font-size:14px;position:absolute;z-index:80;left:0;top:0;padding:10px;width:100%;pointer-events:none}.artplayer-video-player .artplayer-notice .artplayer-notice-inner{display:inline-block;padding:5px 10px;color:#fff;background:rgba(0,0,0,.6);border-radius:3px}.artplayer-video-player.artplayer-notice-show .artplayer-notice{display:flex}
|
||||
.artplayer-video-player .artplayer-contextmenu{display:none;flex-direction:column;position:absolute;z-index:120;left:0;top:0;min-width:200px;padding:5px 0;background:rgba(0,0,0,.8);border-radius:3px}.artplayer-video-player .artplayer-contextmenu .art-contextmenu{cursor:pointer;font-size:13px;display:block;color:#fff;padding:7px 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 0 2px rgba(0,0,0,.5);border-bottom:1px solid hsla(0,0%,100%,.1)}.artplayer-video-player .artplayer-contextmenu .art-contextmenu a{color:#fff;text-decoration:none}.artplayer-video-player .artplayer-contextmenu .art-contextmenu span{display:inline-block;padding:0 7px}.artplayer-video-player .artplayer-contextmenu .art-contextmenu span.current,.artplayer-video-player .artplayer-contextmenu .art-contextmenu span:hover{color:#00c9ff}.artplayer-video-player .artplayer-contextmenu .art-contextmenu:hover{background-color:hsla(0,0%,100%,.1)}.artplayer-video-player .artplayer-contextmenu .art-contextmenu:last-child{border-bottom:none}.artplayer-video-player.artplayer-contextmenu-show .artplayer-contextmenu{display:flex}
|
||||
.artplayer-video-player .artplayer-setting{display:flex;align-items:center;justify-content:center;position:absolute;z-index:90;left:0;top:0;height:100%;width:100%;opacity:0;visibility:hidden;pointer-events:none;overflow:hidden}.artplayer-video-player .artplayer-setting .artplayer-setting-inner{position:absolute;top:0;right:-300px;bottom:0;width:300px;height:100%;font-size:12px;background:rgba(0,0,0,.8);transition:all .2s ease-in-out;overflow:auto}.artplayer-video-player .artplayer-setting .artplayer-setting-inner .artplayer-setting-body{overflow-y:auto;width:100%;height:100%}.artplayer-video-player .artplayer-setting .artplayer-setting-inner .artplayer-setting-body .art-setting{border-bottom:1px solid hsla(0,0%,100%,.1);padding:10px 15px}.artplayer-video-player .artplayer-setting .artplayer-setting-inner .artplayer-setting-body .art-setting .art-setting-header{margin-bottom:5px}.artplayer-video-player .artplayer-setting .art-setting-radio{display:flex}.artplayer-video-player .artplayer-setting .art-setting-radio .art-radio-item{flex:1;padding:0 2px}.artplayer-video-player .artplayer-setting .art-setting-radio .art-radio-item button{height:22px;width:100%;border:none;outline:none;color:#fff;background:hsla(0,0%,100%,.2);border-radius:2px}.artplayer-video-player .artplayer-setting .art-setting-radio .art-radio-item.current button{background-color:#00a1d6}.artplayer-video-player .artplayer-setting .art-setting-range input{width:100%;height:3px;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:hsla(0,0%,100%,.5)}.artplayer-video-player .artplayer-setting .art-setting-checkbox input{height:14px;width:14px;margin-right:5px}.artplayer-video-player.artplayer-setting-show .artplayer-setting{opacity:1;visibility:visible;pointer-events:auto}.artplayer-video-player.artplayer-setting-show .artplayer-setting .artplayer-setting-inner{right:0}
|
||||
.artplayer-video-player .artplayer-info{display:none;flex-direction:column;position:absolute;left:10px;top:10px;z-index:100;width:350px;min-height:150px;padding:10px;color:#fff;font-size:12px;font-family:Noto Sans CJK SC DemiLight,Roboto,Segoe UI,Tahoma,Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased;background:rgba(0,0,0,.7)}.artplayer-video-player .artplayer-info .art-info-item{display:flex;margin-bottom:5px}.artplayer-video-player .artplayer-info .art-info-item .art-info-title{width:100px;text-align:right}.artplayer-video-player .artplayer-info .art-info-item .art-info-content{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:5px}.artplayer-video-player .artplayer-info .artplayer-info-close{position:absolute;top:5px;right:5px;cursor:pointer}.artplayer-video-player.artplayer-info-show .artplayer-info{display:flex}
|
||||
.artplayer-video-player.artplayer-hide-cursor *{cursor:none!important}
|
||||
.artplayer-video-player[data-aspect-ratio] video{-webkit-box-sizing:content-box;box-sizing:content-box;-o-object-fit:fill;object-fit:fill}
|
||||
.artplayer-video-player[data-aspect-ratio] video{box-sizing:content-box;-o-object-fit:fill;object-fit:fill}
|
||||
.artplayer-video-player.artplayer-web-fullscreen{position:fixed;z-index:9999;width:100%;height:100%;left:0;top:0;right:0;bottom:0}
|
||||
.artplayer-video-player .artplayer-pip-header{display:none;position:absolute;z-index:110;left:0;top:0;right:0;height:35px;line-height:35px;color:#fff;background:rgba(0,0,0,.5);-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;opacity:0;visibility:hidden;-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.artplayer-video-player .artplayer-pip-header .artplayer-pip-title{-webkit-box-flex:1;-ms-flex:1;flex:1;padding:0 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:move}.artplayer-video-player .artplayer-pip-header .artplayer-pip-close{width:35px;text-align:center;font-size:22px;cursor:pointer}.artplayer-video-player.is-dragging{opacity:.7}.artplayer-video-player.artplayer-pip{position:fixed;z-index:9999;width:400px;height:225px;-webkit-box-shadow:0 2px 5px 0 rgba(0,0,0,.16),0 3px 6px 0 rgba(0,0,0,.2);box-shadow:0 2px 5px 0 rgba(0,0,0,.16),0 3px 6px 0 rgba(0,0,0,.2)}.artplayer-video-player.artplayer-pip .artplayer-pip-header{display:-webkit-box;display:-ms-flexbox;display:flex}.artplayer-video-player.artplayer-pip.artplayer-hover .artplayer-pip-header{opacity:1;visibility:visible}.artplayer-video-player.artplayer-pip .artplayer-mask .art-state{position:static}.artplayer-video-player.artplayer-pip .artplayer-bottom,.artplayer-video-player.artplayer-pip .artplayer-contextmenu,.artplayer-video-player.artplayer-pip .artplayer-danmu,.artplayer-video-player.artplayer-pip .artplayer-info,.artplayer-video-player.artplayer-pip .artplayer-layers,.artplayer-video-player.artplayer-pip .artplayer-notice,.artplayer-video-player.artplayer-pip .artplayer-setting,.artplayer-video-player.artplayer-pip .artplayer-subtitle{display:none!important}
|
||||
.artplayer-auto-size{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}
|
||||
.artplayer-video-player[data-flip=horizontal] .artplayer-video{-webkit-transform:scaleX(-1);transform:scaleX(-1)}.artplayer-video-player[data-flip=vertical] .artplayer-video{-webkit-transform:scaleY(-1);transform:scaleY(-1)}
|
||||
button[data-balloon]{overflow:visible}[data-balloon]{position:relative;cursor:pointer}[data-balloon]:after{font-family:sans-serif!important;font-weight:400!important;font-style:normal!important;text-shadow:none!important;font-size:12px!important;background:rgba(17,17,17,.9);border-radius:4px;color:#fff;content:attr(data-balloon);padding:.5em 1em;white-space:nowrap}[data-balloon]:after,[data-balloon]:before{filter:alpha(opactiy=0);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";-moz-opacity:0;-khtml-opacity:0;opacity:0;pointer-events:none;-webkit-transition:all .18s ease-out .18s;transition:all .18s ease-out .18s;position:absolute;z-index:10}[data-balloon]:before{background:no-repeat url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='12'%3E%3Cpath fill='rgba(17,17,17,0.9)' d='M2.658 0h32.004c-6 0-11.627 12.002-16.002 12.002C14.285 12.002 8.594 0 2.658 0z'/%3E%3C/svg%3E");background-size:100% auto;width:18px;height:6px;content:""}[data-balloon]:hover:after,[data-balloon]:hover:before,[data-balloon][data-balloon-visible]:after,[data-balloon][data-balloon-visible]:before{filter:alpha(opactiy=100);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";-moz-opacity:1;-khtml-opacity:1;opacity:1;pointer-events:auto}[data-balloon].font-awesome:after{font-family:FontAwesome}[data-balloon][data-balloon-break]:after{white-space:pre}[data-balloon][data-balloon-blunt]:after,[data-balloon][data-balloon-blunt]:before{-webkit-transition:none;transition:none}[data-balloon][data-balloon-pos=up]:after{margin-bottom:11px}[data-balloon][data-balloon-pos=up]:after,[data-balloon][data-balloon-pos=up]:before{bottom:100%;left:50%;-webkit-transform:translate(-50%,10px);transform:translate(-50%,10px);-webkit-transform-origin:top;transform-origin:top}[data-balloon][data-balloon-pos=up]:before{margin-bottom:5px}[data-balloon][data-balloon-pos=up]:hover:after,[data-balloon][data-balloon-pos=up]:hover:before,[data-balloon][data-balloon-pos=up][data-balloon-visible]:after,[data-balloon][data-balloon-pos=up][data-balloon-visible]:before{-webkit-transform:translate(-50%);transform:translate(-50%)}[data-balloon][data-balloon-pos=up-left]:after{left:0;margin-bottom:11px}[data-balloon][data-balloon-pos=up-left]:after,[data-balloon][data-balloon-pos=up-left]:before{bottom:100%;-webkit-transform:translateY(10px);transform:translateY(10px);-webkit-transform-origin:top;transform-origin:top}[data-balloon][data-balloon-pos=up-left]:before{left:5px;margin-bottom:5px}[data-balloon][data-balloon-pos=up-left]:hover:after,[data-balloon][data-balloon-pos=up-left]:hover:before,[data-balloon][data-balloon-pos=up-left][data-balloon-visible]:after,[data-balloon][data-balloon-pos=up-left][data-balloon-visible]:before{-webkit-transform:translate(0);transform:translate(0)}[data-balloon][data-balloon-pos=up-right]:after{right:0;margin-bottom:11px}[data-balloon][data-balloon-pos=up-right]:after,[data-balloon][data-balloon-pos=up-right]:before{bottom:100%;-webkit-transform:translateY(10px);transform:translateY(10px);-webkit-transform-origin:top;transform-origin:top}[data-balloon][data-balloon-pos=up-right]:before{right:5px;margin-bottom:5px}[data-balloon][data-balloon-pos=up-right]:hover:after,[data-balloon][data-balloon-pos=up-right]:hover:before,[data-balloon][data-balloon-pos=up-right][data-balloon-visible]:after,[data-balloon][data-balloon-pos=up-right][data-balloon-visible]:before{-webkit-transform:translate(0);transform:translate(0)}[data-balloon][data-balloon-pos=down]:after{margin-top:11px}[data-balloon][data-balloon-pos=down]:after,[data-balloon][data-balloon-pos=down]:before{left:50%;top:100%;-webkit-transform:translate(-50%,-10px);transform:translate(-50%,-10px)}[data-balloon][data-balloon-pos=down]:before{background:no-repeat url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='12'%3E%3Cpath fill='rgba(17,17,17,0.9)' d='M33.342 12H1.338c6 0 11.627-12.002 16.002-12.002C21.715-.002 27.406 12 33.342 12z'/%3E%3C/svg%3E");background-size:100% auto;width:18px;height:6px;margin-top:5px}[data-balloon][data-balloon-pos=down]:hover:after,[data-balloon][data-balloon-pos=down]:hover:before,[data-balloon][data-balloon-pos=down][data-balloon-visible]:after,[data-balloon][data-balloon-pos=down][data-balloon-visible]:before{-webkit-transform:translate(-50%);transform:translate(-50%)}[data-balloon][data-balloon-pos=down-left]:after{left:0;margin-top:11px;top:100%;-webkit-transform:translateY(-10px);transform:translateY(-10px)}[data-balloon][data-balloon-pos=down-left]:before{background:no-repeat url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='12'%3E%3Cpath fill='rgba(17,17,17,0.9)' d='M33.342 12H1.338c6 0 11.627-12.002 16.002-12.002C21.715-.002 27.406 12 33.342 12z'/%3E%3C/svg%3E");background-size:100% auto;width:18px;height:6px;left:5px;margin-top:5px;top:100%;-webkit-transform:translateY(-10px);tranLine truncated
|
||||
.artplayer-video-player .artplayer-pip-header{display:none;position:absolute;z-index:110;left:0;top:0;right:0;height:35px;line-height:35px;color:#fff;background:rgba(0,0,0,.5);align-items:center;justify-content:space-between;opacity:0;visibility:hidden;transition:all .2s ease-in-out}.artplayer-video-player .artplayer-pip-header .artplayer-pip-title{flex:1;padding:0 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:move}.artplayer-video-player .artplayer-pip-header .artplayer-pip-close{width:35px;text-align:center;font-size:22px;cursor:pointer}.artplayer-video-player.is-dragging{opacity:.7}.artplayer-video-player.artplayer-pip{position:fixed;z-index:9999;width:400px;height:225px;box-shadow:0 2px 5px 0 rgba(0,0,0,.16),0 3px 6px 0 rgba(0,0,0,.2)}.artplayer-video-player.artplayer-pip .artplayer-pip-header{display:flex}.artplayer-video-player.artplayer-pip.artplayer-hover .artplayer-pip-header{opacity:1;visibility:visible}.artplayer-video-player.artplayer-pip .artplayer-mask .art-state{position:static}.artplayer-video-player.artplayer-pip .artplayer-bottom,.artplayer-video-player.artplayer-pip .artplayer-contextmenu,.artplayer-video-player.artplayer-pip .artplayer-danmu,.artplayer-video-player.artplayer-pip .artplayer-info,.artplayer-video-player.artplayer-pip .artplayer-layers,.artplayer-video-player.artplayer-pip .artplayer-notice,.artplayer-video-player.artplayer-pip .artplayer-setting,.artplayer-video-player.artplayer-pip .artplayer-subtitle{display:none!important}
|
||||
.artplayer-auto-size{display:flex;align-items:center;justify-content:center}
|
||||
.artplayer-video-player[data-flip=horizontal] .artplayer-video{transform:scaleX(-1)}.artplayer-video-player[data-flip=vertical] .artplayer-video{transform:scaleY(-1)}
|
||||
button[data-balloon]{overflow:visible}[data-balloon]{position:relative;cursor:pointer}[data-balloon]:after{filter:alpha(opactiy=0);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";-moz-opacity:0;-khtml-opacity:0;opacity:0;pointer-events:none;transition:all .18s ease-out .18s;font-family:sans-serif!important;font-weight:400!important;font-style:normal!important;text-shadow:none!important;font-size:12px!important;background:rgba(17,17,17,.9);border-radius:4px;color:#fff;content:attr(data-balloon);padding:.5em 1em;position:absolute;white-space:nowrap;z-index:10}[data-balloon]:before{background:no-repeat url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='12'%3E%3Cpath fill='rgba(17,17,17,0.9)' d='M2.658 0h32.004c-6 0-11.627 12.002-16.002 12.002C14.285 12.002 8.594 0 2.658 0z'/%3E%3C/svg%3E");background-size:100% auto;width:18px;height:6px;filter:alpha(opactiy=0);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";-moz-opacity:0;-khtml-opacity:0;opacity:0;pointer-events:none;transition:all .18s ease-out .18s;content:"";position:absolute;z-index:10}[data-balloon]:hover:after,[data-balloon]:hover:before,[data-balloon][data-balloon-visible]:after,[data-balloon][data-balloon-visible]:before{filter:alpha(opactiy=100);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";-moz-opacity:1;-khtml-opacity:1;opacity:1;pointer-events:auto}[data-balloon].font-awesome:after{font-family:FontAwesome}[data-balloon][data-balloon-break]:after{white-space:pre}[data-balloon][data-balloon-blunt]:after,[data-balloon][data-balloon-blunt]:before{transition:none}[data-balloon][data-balloon-pos=up]:after{bottom:100%;left:50%;margin-bottom:11px;transform:translate(-50%,10px);transform-origin:top}[data-balloon][data-balloon-pos=up]:before{bottom:100%;left:50%;margin-bottom:5px;transform:translate(-50%,10px);transform-origin:top}[data-balloon][data-balloon-pos=up]:hover:after,[data-balloon][data-balloon-pos=up][data-balloon-visible]:after{transform:translate(-50%)}[data-balloon][data-balloon-pos=up]:hover:before,[data-balloon][data-balloon-pos=up][data-balloon-visible]:before{transform:translate(-50%)}[data-balloon][data-balloon-pos=up-left]:after{bottom:100%;left:0;margin-bottom:11px;transform:translateY(10px);transform-origin:top}[data-balloon][data-balloon-pos=up-left]:before{bottom:100%;left:5px;margin-bottom:5px;transform:translateY(10px);transform-origin:top}[data-balloon][data-balloon-pos=up-left]:hover:after,[data-balloon][data-balloon-pos=up-left][data-balloon-visible]:after{transform:translate(0)}[data-balloon][data-balloon-pos=up-left]:hover:before,[data-balloon][data-balloon-pos=up-left][data-balloon-visible]:before{transform:translate(0)}[data-balloon][data-balloon-pos=up-right]:after{bottom:100%;right:0;margin-bottom:11px;transform:translateY(10px);transform-origin:top}[data-balloon][data-balloon-pos=up-right]:before{bottom:100%;right:5px;margin-bottom:5px;transform:translateY(10px);transform-origin:top}[data-balloon][data-balloon-pos=up-right]:hover:after,[data-balloon][data-balloon-pos=up-right][data-balloon-visible]:after{transform:translate(0)}[data-balloon][data-balloon-pos=up-right]:hover:before,[data-balloon][data-balloon-pos=up-right][data-balloon-visible]:before{transform:translate(0)}[data-balloon][data-balloon-pos=down]:after{left:50%;margin-top:11px;top:100%;transform:translate(-50%,-10px)}[data-balloon][data-balloon-pos=down]:before{background:no-repeat url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='12'%3E%3Cpath fill='rgba(17,17,17,0.9)' d='M33.342 12H1.338c6 0 11.627-12.002 16.002-12.002C21.715-.002 27.406 12 33.342 12z'/%3E%3C/svg%3E");background-size:100% auto;width:18px;height:6px;left:50%;margin-top:5px;top:100%;transform:translate(-50%,-10px)}[data-balloon][data-balloon-pos=down]:hover:after,[data-balloon][data-balloon-pos=down][data-balloon-visible]:after{transform:translate(-50%)}[data-balloon][data-balloon-pos=down]:hover:before,[data-balloon][data-balloon-pos=down][data-balloon-visible]:before{transform:translate(-50%)}[data-balloon][data-balloon-pos=down-left]:after{left:0;margin-top:11px;top:100%;transform:translateY(-10px)}[data-balloon][data-balloon-pos=down-left]:before{background:no-repeat url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='12'%3E%3Cpath fill='rgba(17,17,17,0.9)' d='M33.342 12H1.338c6 0 11.627-12.002 16.002-12.002C21.715-.002 27.406 12 33.342 12z'/%3E%3C/svg%3E");background-size:100% auto;width:18px;height:6px;left:5px;margin-top:5px;top:100%;transform:translateY(-10px)}[data-balloon][data-balloon-pos=down-left]:hover:after,[data-balloon][data-balloon-pos=down-left][data-balloon-visible]:after{transform:translate(0)}[data-balloon][data-balloon-pos=down-left]:hover:before,[data-balloon][data-balloon-pos=down-left][data-balloon-visible]:before{transform:translate(0)}[data-balloon][data-balloon-pos=dowLine truncated
|
||||
/*# sourceMappingURL=artplayer.css.map */
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"sources":["artplayer.scss","video.scss","subtitle.scss","danmuku.scss","layers.scss","mask.scss","loading.scss","bottom.scss","notice.scss","contextmenu.scss","setting.scss","info.scss","hideCursor.scss","aspectRatio.scss","fullscreenWeb.scss","pip.scss","autoSize.scss","flip.scss","balloon.min.css"],"names":[],"mappings":"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 truncated
|
||||
{"version":3,"sources":["artplayer.scss","video.scss","subtitle.scss","danmuku.scss","layers.scss","mask.scss","loading.scss","bottom.scss","notice.scss","contextmenu.scss","setting.scss","info.scss","hideCursor.scss","aspectRatio.scss","fullscreenWeb.scss","pip.scss","autoSize.scss","flip.scss","balloon.min.css"],"names":[],"mappings":"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 truncated
|
||||
+281
-316
@@ -1890,7 +1890,7 @@
|
||||
quality: {
|
||||
type: 'array',
|
||||
child: {
|
||||
"default": 'boolean',
|
||||
default: 'boolean',
|
||||
name: 'string',
|
||||
url: 'string'
|
||||
}
|
||||
@@ -2303,7 +2303,7 @@
|
||||
var reconnectTime = 0;
|
||||
var maxReconnectTime = 5;
|
||||
proxy($video, 'click', function () {
|
||||
player.toggle();
|
||||
player.toggle = true;
|
||||
});
|
||||
config.video.events.forEach(function (eventName) {
|
||||
proxy($video, eventName, function (event) {
|
||||
@@ -2329,8 +2329,8 @@
|
||||
art.mask.show();
|
||||
|
||||
if (option.loop) {
|
||||
player.seek(0);
|
||||
player.play();
|
||||
player.seek = 0;
|
||||
player.play = true;
|
||||
}
|
||||
});
|
||||
art.on('video:error', function () {
|
||||
@@ -2354,7 +2354,7 @@
|
||||
|
||||
art.on('video:loadedmetadata', function () {
|
||||
if (option.autoSize) {
|
||||
player.autoSize();
|
||||
player.autoSize = true;
|
||||
}
|
||||
});
|
||||
art.on('video:loadstart', function () {
|
||||
@@ -2400,26 +2400,30 @@
|
||||
notice = art.notice,
|
||||
mutex = art.option.mutex;
|
||||
Object.defineProperty(player, 'play', {
|
||||
value: function value() {
|
||||
var promise = $video.play();
|
||||
set: function set(value) {
|
||||
if (value) {
|
||||
var promise = $video.play();
|
||||
|
||||
if (promise !== undefined) {
|
||||
promise.then()["catch"](function (err) {
|
||||
notice.show(err, true, 3000);
|
||||
console.warn(err);
|
||||
});
|
||||
if (promise !== undefined) {
|
||||
promise.then().catch(function (err) {
|
||||
notice.show(err, true, 3000);
|
||||
console.warn(err);
|
||||
});
|
||||
}
|
||||
|
||||
if (mutex) {
|
||||
art.constructor.instances.filter(function (item) {
|
||||
return item !== art;
|
||||
}).forEach(function (item) {
|
||||
item.player.pause = true;
|
||||
});
|
||||
}
|
||||
|
||||
notice.show(i18n.get('Play'));
|
||||
art.emit('play');
|
||||
} else {
|
||||
player.pause = true;
|
||||
}
|
||||
|
||||
if (mutex) {
|
||||
art.constructor.instances.filter(function (item) {
|
||||
return item !== art;
|
||||
}).forEach(function (item) {
|
||||
return item.player.pause();
|
||||
});
|
||||
}
|
||||
|
||||
notice.show(i18n.get('Play'));
|
||||
art.emit('play');
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -2429,21 +2433,30 @@
|
||||
i18n = art.i18n,
|
||||
notice = art.notice;
|
||||
Object.defineProperty(player, 'pause', {
|
||||
value: function value() {
|
||||
$video.pause();
|
||||
notice.show(i18n.get('Pause'));
|
||||
art.emit('pause');
|
||||
get: function get() {
|
||||
return $video.paused;
|
||||
},
|
||||
set: function set(value) {
|
||||
if (value) {
|
||||
$video.pause();
|
||||
notice.show(i18n.get('Pause'));
|
||||
art.emit('pause');
|
||||
} else {
|
||||
player.play = true;
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function toggleMix(art, player) {
|
||||
Object.defineProperty(player, 'toggle', {
|
||||
value: function value() {
|
||||
if (player.playing) {
|
||||
player.pause();
|
||||
} else {
|
||||
player.play();
|
||||
set: function set(value) {
|
||||
if (value) {
|
||||
if (player.playing) {
|
||||
player.pause = true;
|
||||
} else {
|
||||
player.play = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -2452,7 +2465,7 @@
|
||||
function seekMix(art, player) {
|
||||
var notice = art.notice;
|
||||
Object.defineProperty(player, 'seek', {
|
||||
value: function value(time) {
|
||||
set: function set(time) {
|
||||
player.currentTime = time;
|
||||
notice.show("".concat(secondToTime(time), " / ").concat(secondToTime(player.duration)));
|
||||
art.emit('seek', time);
|
||||
@@ -2523,14 +2536,14 @@
|
||||
playing = player.playing;
|
||||
return player.attachUrl(url).then(function () {
|
||||
option.url = url;
|
||||
player.playbackRateRemove();
|
||||
player.aspectRatioRemove();
|
||||
player.playbackRate = false;
|
||||
player.aspectRatio = false;
|
||||
art.once('video:canplay', function () {
|
||||
player.currentTime = currentTime;
|
||||
});
|
||||
|
||||
if (playing) {
|
||||
player.play();
|
||||
player.play = true;
|
||||
}
|
||||
|
||||
notice.show("".concat(i18n.get('Switch video'), ": ").concat(name));
|
||||
@@ -2549,12 +2562,12 @@
|
||||
var playing = player.playing;
|
||||
return player.attachUrl(url).then(function () {
|
||||
option.url = url;
|
||||
player.playbackRateRemove();
|
||||
player.aspectRatioRemove();
|
||||
player.playbackRate = false;
|
||||
player.aspectRatio = false;
|
||||
player.currentTime = 0;
|
||||
|
||||
if (playing) {
|
||||
player.play();
|
||||
player.play = true;
|
||||
}
|
||||
|
||||
notice.show("".concat(i18n.get('Switch video'), ": ").concat(name));
|
||||
@@ -2573,42 +2586,39 @@
|
||||
$player = _art$template.$player,
|
||||
i18n = art.i18n,
|
||||
notice = art.notice;
|
||||
Object.defineProperty(player, 'playbackRateState', {
|
||||
Object.defineProperty(player, 'playbackRate', {
|
||||
get: function get() {
|
||||
return $player.dataset.playbackRate;
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'playbackRate', {
|
||||
value: function value(rate) {
|
||||
var rateList = [0.5, 0.75, 1.0, 1.25, 1.5, 1.75, 2.0];
|
||||
errorHandle(rateList.includes(rate), "'playbackRate' only accept ".concat(rateList.toString(), " as parameters"));
|
||||
},
|
||||
set: function set(rate) {
|
||||
if (rate) {
|
||||
var rateList = [0.5, 0.75, 1.0, 1.25, 1.5, 1.75, 2.0];
|
||||
errorHandle(rateList.includes(rate), "'playbackRate' only accept ".concat(rateList.toString(), " as parameters"));
|
||||
|
||||
if (rate === $player.dataset.playbackRate) {
|
||||
return;
|
||||
}
|
||||
if (rate === $player.dataset.playbackRate) {
|
||||
return;
|
||||
}
|
||||
|
||||
$video.playbackRate = rate;
|
||||
$player.dataset.playbackRate = rate;
|
||||
notice.show("".concat(i18n.get('Rate'), ": ").concat(rate === 1.0 ? i18n.get('Normal') : "".concat(rate, "x")));
|
||||
art.emit('playbackRateChange', rate);
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'playbackRateRemove', {
|
||||
value: function value() {
|
||||
if (player.playbackRateState) {
|
||||
player.playbackRate(1);
|
||||
$video.playbackRate = rate;
|
||||
$player.dataset.playbackRate = rate;
|
||||
notice.show("".concat(i18n.get('Rate'), ": ").concat(rate === 1.0 ? i18n.get('Normal') : "".concat(rate, "x")));
|
||||
art.emit('playbackRateChange', rate);
|
||||
} else if (player.playbackRate) {
|
||||
player.playbackRate = 1;
|
||||
delete $player.dataset.playbackRate;
|
||||
art.emit('playbackRateRemove');
|
||||
}
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'playbackRateReset', {
|
||||
value: function value() {
|
||||
var playbackRate = $player.dataset.playbackRate;
|
||||
set: function set(value) {
|
||||
if (value) {
|
||||
var playbackRate = $player.dataset.playbackRate;
|
||||
|
||||
if (playbackRate) {
|
||||
player.playbackRate(Number(playbackRate));
|
||||
art.emit('playbackRateReset');
|
||||
if (playbackRate) {
|
||||
player.playbackRate = Number(playbackRate);
|
||||
art.emit('playbackRateReset');
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -2620,49 +2630,44 @@
|
||||
$player = _art$template.$player,
|
||||
i18n = art.i18n,
|
||||
notice = art.notice;
|
||||
Object.defineProperty(player, 'aspectRatioState', {
|
||||
Object.defineProperty(player, 'aspectRatio', {
|
||||
get: function get() {
|
||||
return $player.dataset.aspectRatio || '';
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'aspectRatio', {
|
||||
value: function value(ratio) {
|
||||
var ratioList = ['default', '4:3', '16:9'];
|
||||
errorHandle(ratioList.includes(ratio), "'aspectRatio' only accept ".concat(ratioList.toString(), " as parameters"));
|
||||
},
|
||||
set: function set(ratio) {
|
||||
if (ratio) {
|
||||
var ratioList = ['default', '4:3', '16:9'];
|
||||
errorHandle(ratioList.includes(ratio), "'aspectRatio' only accept ".concat(ratioList.toString(), " as parameters"));
|
||||
|
||||
if (ratio === 'default') {
|
||||
player.aspectRatioRemove();
|
||||
} else {
|
||||
var ratioArray = ratio.split(':');
|
||||
var videoWidth = $video.videoWidth,
|
||||
videoHeight = $video.videoHeight;
|
||||
var clientWidth = $player.clientWidth,
|
||||
clientHeight = $player.clientHeight;
|
||||
var videoRatio = videoWidth / videoHeight;
|
||||
var setupRatio = ratioArray[0] / ratioArray[1];
|
||||
|
||||
if (videoRatio > setupRatio) {
|
||||
var percentage = setupRatio * videoHeight / videoWidth;
|
||||
setStyle($video, 'width', "".concat(percentage * 100, "%"));
|
||||
setStyle($video, 'height', '100%');
|
||||
setStyle($video, 'padding', "0 ".concat((clientWidth - clientWidth * percentage) / 2, "px"));
|
||||
if (ratio === 'default') {
|
||||
player.aspectRatio = false;
|
||||
} else {
|
||||
var _percentage = videoWidth / setupRatio / videoHeight;
|
||||
var ratioArray = ratio.split(':');
|
||||
var videoWidth = $video.videoWidth,
|
||||
videoHeight = $video.videoHeight;
|
||||
var clientWidth = $player.clientWidth,
|
||||
clientHeight = $player.clientHeight;
|
||||
var videoRatio = videoWidth / videoHeight;
|
||||
var setupRatio = ratioArray[0] / ratioArray[1];
|
||||
|
||||
setStyle($video, 'width', '100%');
|
||||
setStyle($video, 'height', "".concat(_percentage * 100, "%"));
|
||||
setStyle($video, 'padding', "".concat((clientHeight - clientHeight * _percentage) / 2, "px 0"));
|
||||
if (videoRatio > setupRatio) {
|
||||
var percentage = setupRatio * videoHeight / videoWidth;
|
||||
setStyle($video, 'width', "".concat(percentage * 100, "%"));
|
||||
setStyle($video, 'height', '100%');
|
||||
setStyle($video, 'padding', "0 ".concat((clientWidth - clientWidth * percentage) / 2, "px"));
|
||||
} else {
|
||||
var _percentage = videoWidth / setupRatio / videoHeight;
|
||||
|
||||
setStyle($video, 'width', '100%');
|
||||
setStyle($video, 'height', "".concat(_percentage * 100, "%"));
|
||||
setStyle($video, 'padding', "".concat((clientHeight - clientHeight * _percentage) / 2, "px 0"));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
$player.dataset.aspectRatio = ratio;
|
||||
notice.show("".concat(i18n.get('Aspect ratio'), ": ").concat(ratio === 'default' ? i18n.get('Default') : ratio));
|
||||
art.emit('aspectRatioChange', ratio);
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'aspectRatioRemove', {
|
||||
value: function value() {
|
||||
if (player.aspectRatioState) {
|
||||
$player.dataset.aspectRatio = ratio;
|
||||
notice.show("".concat(i18n.get('Aspect ratio'), ": ").concat(ratio === 'default' ? i18n.get('Default') : ratio));
|
||||
art.emit('aspectRatioChange', ratio);
|
||||
} else if (player.aspectRatio) {
|
||||
setStyle($video, 'width', null);
|
||||
setStyle($video, 'height', null);
|
||||
setStyle($video, 'padding', null);
|
||||
@@ -2672,11 +2677,9 @@
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'aspectRatioReset', {
|
||||
value: function value() {
|
||||
var aspectRatio = $player.dataset.aspectRatio;
|
||||
|
||||
if (aspectRatio) {
|
||||
player.aspectRatio(aspectRatio);
|
||||
set: function set(value) {
|
||||
if (value && player.aspectRatio) {
|
||||
player.aspectRatio = player.aspectRatio;
|
||||
art.emit('aspectRatioReset');
|
||||
}
|
||||
}
|
||||
@@ -2948,49 +2951,38 @@
|
||||
screenfullError();
|
||||
}
|
||||
|
||||
Object.defineProperty(player, 'fullscreenState', {
|
||||
Object.defineProperty(player, 'fullscreen', {
|
||||
get: function get() {
|
||||
return screenfull.isFullscreen;
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'fullscreenEnabled', {
|
||||
value: function value() {
|
||||
if (screenfull.enabled) {
|
||||
if (!player.fullscreenState) {
|
||||
player.fullscreenWebExit();
|
||||
screenfull.request($player).then(function () {
|
||||
$player.classList.add('artplayer-fullscreen');
|
||||
player.aspectRatioReset();
|
||||
art.emit('fullscreen:enabled');
|
||||
});
|
||||
},
|
||||
set: function set(value) {
|
||||
if (value) {
|
||||
if (player.fullscreenWeb) {
|
||||
player.fullscreenWeb = false;
|
||||
}
|
||||
|
||||
screenfull.request($player).then(function () {
|
||||
$player.classList.add('artplayer-fullscreen');
|
||||
player.aspectRatioReset = true;
|
||||
art.emit('fullscreen:enabled');
|
||||
});
|
||||
} else {
|
||||
screenfullError();
|
||||
}
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'fullscreenExit', {
|
||||
value: function value() {
|
||||
if (screenfull.enabled) {
|
||||
if (player.fullscreenState) {
|
||||
player.fullscreenWebExit();
|
||||
screenfull.exit().then(function () {
|
||||
$player.classList.remove('artplayer-fullscreen');
|
||||
player.aspectRatioReset();
|
||||
art.emit('fullscreen:exit');
|
||||
});
|
||||
if (player.fullscreenWeb) {
|
||||
player.fullscreenWeb = false;
|
||||
}
|
||||
} else {
|
||||
screenfullError();
|
||||
|
||||
screenfull.exit().then(function () {
|
||||
$player.classList.remove('artplayer-fullscreen');
|
||||
player.aspectRatioReset = true;
|
||||
art.emit('fullscreen:exit');
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'fullscreenToggle', {
|
||||
value: function value() {
|
||||
if (player.fullscreenState) {
|
||||
player.fullscreenExit();
|
||||
} else {
|
||||
player.fullscreenEnabled();
|
||||
set: function set(value) {
|
||||
if (value) {
|
||||
player.fullscreen = !player.fullscreen;
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -2998,38 +2990,34 @@
|
||||
|
||||
function fullscreenWebMix(art, player) {
|
||||
var $player = art.template.$player;
|
||||
Object.defineProperty(player, 'fullscreenWebState', {
|
||||
Object.defineProperty(player, 'fullscreenWeb', {
|
||||
get: function get() {
|
||||
return $player.classList.contains('artplayer-web-fullscreen');
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'fullscreenWebEnabled', {
|
||||
value: function value() {
|
||||
if (player.fullscreenState) {
|
||||
player.fullscreenExit();
|
||||
}
|
||||
},
|
||||
set: function set(value) {
|
||||
if (value) {
|
||||
if (player.fullscreen) {
|
||||
player.fullscreen = false;
|
||||
}
|
||||
|
||||
$player.classList.add('artplayer-web-fullscreen');
|
||||
player.aspectRatioReset = true;
|
||||
art.emit('fullscreenWeb:enabled');
|
||||
} else {
|
||||
if (player.fullscreen) {
|
||||
player.fullscreen = false;
|
||||
}
|
||||
|
||||
$player.classList.add('artplayer-web-fullscreen');
|
||||
player.aspectRatioReset();
|
||||
art.emit('fullscreenWeb:enabled');
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'fullscreenWebExit', {
|
||||
value: function value() {
|
||||
if (player.fullscreenWebState) {
|
||||
player.fullscreenExit();
|
||||
$player.classList.remove('artplayer-web-fullscreen');
|
||||
player.aspectRatioReset();
|
||||
player.aspectRatioReset = true;
|
||||
art.emit('fullscreenWeb:exit');
|
||||
}
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'fullscreenWebToggle', {
|
||||
value: function value() {
|
||||
if (player.fullscreenWebState) {
|
||||
player.fullscreenWebExit();
|
||||
} else {
|
||||
player.fullscreenWebEnabled();
|
||||
set: function set(value) {
|
||||
if (value) {
|
||||
player.fullscreenWeb = !player.fullscreenWeb;
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -3040,25 +3028,22 @@
|
||||
$video = art.template.$video,
|
||||
proxy = art.events.proxy;
|
||||
$video.disablePictureInPicture = false;
|
||||
Object.defineProperty(player, 'pipState', {
|
||||
Object.defineProperty(player, 'pip', {
|
||||
get: function get() {
|
||||
return document.pictureInPictureElement;
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'pipEnabled', {
|
||||
value: function value() {
|
||||
$video.requestPictureInPicture()["catch"](function (error) {
|
||||
notice.show(error, true, 3000);
|
||||
console.warn(error);
|
||||
});
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'pipExit', {
|
||||
value: function value() {
|
||||
document.exitPictureInPicture()["catch"](function (error) {
|
||||
notice.show(error, true, 3000);
|
||||
console.warn(error);
|
||||
});
|
||||
},
|
||||
set: function set(value) {
|
||||
if (value) {
|
||||
$video.requestPictureInPicture().catch(function (error) {
|
||||
notice.show(error, true, 3000);
|
||||
console.warn(error);
|
||||
});
|
||||
} else {
|
||||
document.exitPictureInPicture().catch(function (error) {
|
||||
notice.show(error, true, 3000);
|
||||
console.warn(error);
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
proxy($video, 'enterpictureinpicture', function () {
|
||||
@@ -3068,8 +3053,8 @@
|
||||
art.emit('pipExit');
|
||||
});
|
||||
art.on('destroy', function () {
|
||||
if (player.pipState) {
|
||||
player.pipExit();
|
||||
if (player.pip) {
|
||||
player.pip = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -3077,21 +3062,18 @@
|
||||
function webkitPip(art, player) {
|
||||
var $video = art.template.$video;
|
||||
$video.webkitSetPresentationMode('inline');
|
||||
Object.defineProperty(player, 'pipState', {
|
||||
Object.defineProperty(player, 'pip', {
|
||||
get: function get() {
|
||||
return $video.webkitPresentationMode === 'picture-in-picture';
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'pipEnabled', {
|
||||
value: function value() {
|
||||
$video.webkitSetPresentationMode('picture-in-picture');
|
||||
art.emit('pipEnabled');
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'pipExit', {
|
||||
value: function value() {
|
||||
$video.webkitSetPresentationMode('inline');
|
||||
art.emit('pipExit');
|
||||
},
|
||||
set: function set(value) {
|
||||
if (value) {
|
||||
$video.webkitSetPresentationMode('picture-in-picture');
|
||||
art.emit('pipEnabled');
|
||||
} else {
|
||||
$video.webkitSetPresentationMode('inline');
|
||||
art.emit('pipExit');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -3108,52 +3090,47 @@
|
||||
proxy = _art$events.proxy;
|
||||
var cachePos = null;
|
||||
var draggie = null;
|
||||
Object.defineProperty(player, 'pipState', {
|
||||
Object.defineProperty(player, 'pip', {
|
||||
get: function get() {
|
||||
return $player.classList.contains('artplayer-pip');
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'pipEnabled', {
|
||||
value: function value() {
|
||||
if (player.autoSizeState) {
|
||||
player.autoSizeRemove();
|
||||
}
|
||||
},
|
||||
set: function set(value) {
|
||||
if (value) {
|
||||
if (player.autoSize) {
|
||||
player.autoSize = false;
|
||||
}
|
||||
|
||||
if (!draggie) {
|
||||
draggie = new draggabilly($player, {
|
||||
handle: '.artplayer-pip-header'
|
||||
});
|
||||
append($pipTitle, option.title || i18n.get('Mini player'));
|
||||
proxy($pipClose, 'click', function () {
|
||||
player.pipExit();
|
||||
});
|
||||
destroyEvents.push(function () {
|
||||
draggie.destroy();
|
||||
});
|
||||
} else if (cachePos && cachePos.x !== 0 && cachePos.y !== 0) {
|
||||
setStyle($player, 'left', "".concat(cachePos.x, "px"));
|
||||
setStyle($player, 'top', "".concat(cachePos.y, "px"));
|
||||
}
|
||||
if (!draggie) {
|
||||
draggie = new draggabilly($player, {
|
||||
handle: '.artplayer-pip-header'
|
||||
});
|
||||
append($pipTitle, option.title || i18n.get('Mini player'));
|
||||
proxy($pipClose, 'click', function () {
|
||||
player.pip = false;
|
||||
});
|
||||
destroyEvents.push(function () {
|
||||
draggie.destroy();
|
||||
});
|
||||
} else if (cachePos && cachePos.x !== 0 && cachePos.y !== 0) {
|
||||
setStyle($player, 'left', "".concat(cachePos.x, "px"));
|
||||
setStyle($player, 'top', "".concat(cachePos.y, "px"));
|
||||
}
|
||||
|
||||
$player.classList.add('artplayer-pip');
|
||||
player.fullscreenExit();
|
||||
player.fullscreenWebExit();
|
||||
player.aspectRatioRemove();
|
||||
player.playbackRateRemove();
|
||||
art.emit('pipEnabled');
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'pipExit', {
|
||||
value: function value() {
|
||||
if (player.pipState) {
|
||||
$player.classList.add('artplayer-pip');
|
||||
player.fullscreen = false;
|
||||
player.fullscreenWeb = false;
|
||||
player.aspectRatio = false;
|
||||
player.playbackRate = false;
|
||||
art.emit('pipEnabled');
|
||||
} else if (player.pip) {
|
||||
$player.classList.remove('artplayer-pip');
|
||||
cachePos = draggie.position;
|
||||
setStyle($player, 'left', null);
|
||||
setStyle($player, 'top', null);
|
||||
player.fullscreenExit();
|
||||
player.fullscreenWebExit();
|
||||
player.aspectRatioRemove();
|
||||
player.playbackRateRemove();
|
||||
player.fullscreen = false;
|
||||
player.fullscreenWeb = false;
|
||||
player.aspectRatio = false;
|
||||
player.playbackRate = false;
|
||||
art.emit('pipExit');
|
||||
}
|
||||
}
|
||||
@@ -3172,11 +3149,9 @@
|
||||
}
|
||||
|
||||
Object.defineProperty(player, 'pipToggle', {
|
||||
value: function value() {
|
||||
if (player.pipState) {
|
||||
player.pipExit();
|
||||
} else {
|
||||
player.pipEnabled();
|
||||
set: function set(value) {
|
||||
if (value) {
|
||||
player.pip = !player.pip;
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -3213,44 +3188,41 @@
|
||||
$container = _art$template.$container,
|
||||
$player = _art$template.$player,
|
||||
$video = _art$template.$video;
|
||||
Object.defineProperty(player, 'autoSizeState', {
|
||||
Object.defineProperty(player, 'autoSize', {
|
||||
get: function get() {
|
||||
return $container.classList.contains('artplayer-auto-size');
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'autoSize', {
|
||||
value: function value() {
|
||||
var videoWidth = $video.videoWidth,
|
||||
videoHeight = $video.videoHeight;
|
||||
},
|
||||
set: function set(value) {
|
||||
if (value) {
|
||||
var videoWidth = $video.videoWidth,
|
||||
videoHeight = $video.videoHeight;
|
||||
|
||||
var _$container$getBoundi = $container.getBoundingClientRect(),
|
||||
width = _$container$getBoundi.width,
|
||||
height = _$container$getBoundi.height;
|
||||
var _$container$getBoundi = $container.getBoundingClientRect(),
|
||||
width = _$container$getBoundi.width,
|
||||
height = _$container$getBoundi.height;
|
||||
|
||||
var videoRatio = videoWidth / videoHeight;
|
||||
var containerRatio = width / height;
|
||||
$container.classList.add('artplayer-auto-size');
|
||||
var videoRatio = videoWidth / videoHeight;
|
||||
var containerRatio = width / height;
|
||||
$container.classList.add('artplayer-auto-size');
|
||||
|
||||
if (containerRatio > videoRatio) {
|
||||
var percentage = height * videoRatio / width * 100;
|
||||
setStyle($player, 'width', "".concat(percentage, "%"));
|
||||
setStyle($player, 'height', '100%');
|
||||
if (containerRatio > videoRatio) {
|
||||
var percentage = height * videoRatio / width * 100;
|
||||
setStyle($player, 'width', "".concat(percentage, "%"));
|
||||
setStyle($player, 'height', '100%');
|
||||
} else {
|
||||
var _percentage = width / videoRatio / height * 100;
|
||||
|
||||
setStyle($player, 'width', '100%');
|
||||
setStyle($player, 'height', "".concat(_percentage, "%"));
|
||||
}
|
||||
|
||||
art.emit('autoSizeChange');
|
||||
} else {
|
||||
var _percentage = width / videoRatio / height * 100;
|
||||
|
||||
setStyle($player, 'width', '100%');
|
||||
setStyle($player, 'height', "".concat(_percentage, "%"));
|
||||
$container.classList.remove('artplayer-auto-size');
|
||||
setStyle($player, 'width', null);
|
||||
setStyle($player, 'height', null);
|
||||
art.emit('autoSizeRemove');
|
||||
}
|
||||
|
||||
art.emit('autoSizeChange');
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'autoSizeRemove', {
|
||||
value: function value() {
|
||||
$container.classList.remove('artplayer-auto-size');
|
||||
setStyle($player, 'width', null);
|
||||
setStyle($player, 'height', null);
|
||||
art.emit('autoSizeRemove');
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -3281,23 +3253,20 @@
|
||||
}
|
||||
|
||||
function flipMix(art, player) {
|
||||
Object.defineProperty(player, 'flipState', {
|
||||
Object.defineProperty(player, 'flip', {
|
||||
get: function get() {
|
||||
return art.template.$player.dataset.flip;
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'flip', {
|
||||
value: function value(flip) {
|
||||
var flipList = ['normal', 'horizontal', 'vertical'];
|
||||
errorHandle(flipList.includes(flip), "'flip' only accept ".concat(flipList.toString(), " as parameters"));
|
||||
art.template.$player.dataset.flip = flip;
|
||||
art.emit('flipChange', flip);
|
||||
}
|
||||
});
|
||||
Object.defineProperty(player, 'flipRemove', {
|
||||
value: function value() {
|
||||
delete art.template.$player.dataset.flip;
|
||||
art.emit('flipRemove');
|
||||
},
|
||||
set: function set(flip) {
|
||||
if (flip) {
|
||||
var flipList = ['normal', 'horizontal', 'vertical'];
|
||||
errorHandle(flipList.includes(flip), "'flip' only accept ".concat(flipList.toString(), " as parameters"));
|
||||
art.template.$player.dataset.flip = flip;
|
||||
art.emit('flipChange', flip);
|
||||
} else {
|
||||
delete art.template.$player.dataset.flip;
|
||||
art.emit('flipRemove');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -3449,7 +3418,7 @@
|
||||
var $fullscreen = append($control, icons.fullscreen);
|
||||
tooltip($fullscreen, i18n.get('Fullscreen'));
|
||||
proxy($control, 'click', function () {
|
||||
player.fullscreenToggle();
|
||||
player.fullscreenToggle = true;
|
||||
});
|
||||
art.on('fullscreen:enabled', function () {
|
||||
setStyle($fullscreen, 'opacity', '0.8');
|
||||
@@ -3475,7 +3444,7 @@
|
||||
var $fullscreenWeb = append($control, icons.fullscreenWeb);
|
||||
tooltip($fullscreenWeb, i18n.get('Web fullscreen'));
|
||||
proxy($control, 'click', function () {
|
||||
player.fullscreenWebToggle();
|
||||
player.fullscreenWebToggle = true;
|
||||
});
|
||||
art.on('fullscreenWeb:enabled', function () {
|
||||
setStyle($fullscreenWeb, 'opacity', '0.8');
|
||||
@@ -3501,7 +3470,7 @@
|
||||
var $pip = append($control, icons.pip);
|
||||
tooltip($pip, i18n.get('Mini player'));
|
||||
proxy($control, 'click', function () {
|
||||
player.pipEnabled();
|
||||
player.pip = true;
|
||||
});
|
||||
}
|
||||
});
|
||||
@@ -3521,10 +3490,10 @@
|
||||
tooltip($play, i18n.get('Play'));
|
||||
tooltip($pause, i18n.get('Pause'));
|
||||
proxy($play, 'click', function () {
|
||||
player.play();
|
||||
player.play = true;
|
||||
});
|
||||
proxy($pause, 'click', function () {
|
||||
player.pause();
|
||||
player.pause = true;
|
||||
});
|
||||
|
||||
function showPlay() {
|
||||
@@ -3667,7 +3636,7 @@
|
||||
percentage = _getPosFromEvent3.percentage;
|
||||
|
||||
setBar('played', percentage);
|
||||
player.seek(second);
|
||||
player.seek = second;
|
||||
}
|
||||
});
|
||||
proxy($indicator, 'mousedown', function () {
|
||||
@@ -3681,7 +3650,7 @@
|
||||
|
||||
$indicator.classList.add('art-show-indicator');
|
||||
setBar('played', percentage);
|
||||
player.seek(second);
|
||||
player.seek = second;
|
||||
}
|
||||
});
|
||||
proxy(document, 'mouseup', function () {
|
||||
@@ -3781,7 +3750,7 @@
|
||||
// TODO...
|
||||
var panelWidth = getStyle($volumePanel, 'width') || 60;
|
||||
var handleWidth = getStyle($volumeHandle, 'width');
|
||||
var width = handleWidth / 2 + (panelWidth - handleWidth) * percentage - handleWidth / 2;
|
||||
var width = (panelWidth - handleWidth) * percentage;
|
||||
setStyle($volume, 'display', 'flex');
|
||||
setStyle($volumeClose, 'display', 'none');
|
||||
setStyle($volumeHandle, 'left', "".concat(width, "px"));
|
||||
@@ -3934,7 +3903,7 @@
|
||||
player = art.player;
|
||||
var playIndex = -1;
|
||||
var defaultQuality = option.quality.find(function (item) {
|
||||
return item["default"];
|
||||
return item.default;
|
||||
}) || option.quality[0];
|
||||
playIndex = option.quality.indexOf(defaultQuality);
|
||||
var $qualityName = append($control, "<div class=\"art-quality-name\">".concat(defaultQuality.name, "</div>"));
|
||||
@@ -4119,7 +4088,7 @@
|
||||
var rate = target.dataset.rate;
|
||||
|
||||
if (rate) {
|
||||
player.playbackRate(Number(rate));
|
||||
player.playbackRate = Number(rate);
|
||||
art.contextmenu.hide();
|
||||
}
|
||||
},
|
||||
@@ -4149,7 +4118,7 @@
|
||||
var ratio = target.dataset.ratio;
|
||||
|
||||
if (ratio) {
|
||||
player.aspectRatio(ratio);
|
||||
player.aspectRatio = ratio;
|
||||
art.contextmenu.hide();
|
||||
}
|
||||
},
|
||||
@@ -4501,7 +4470,7 @@
|
||||
|
||||
if (!$track) {
|
||||
var $newTrack = document.createElement('track');
|
||||
$newTrack["default"] = true;
|
||||
$newTrack.default = true;
|
||||
$newTrack.kind = 'metadata';
|
||||
$video.appendChild($newTrack);
|
||||
this.art.template.$track = $newTrack;
|
||||
@@ -4553,7 +4522,7 @@
|
||||
}
|
||||
|
||||
return vttUrl;
|
||||
})["catch"](function (err) {
|
||||
}).catch(function (err) {
|
||||
notice.show(err);
|
||||
console.warn(err);
|
||||
});
|
||||
@@ -4632,7 +4601,7 @@
|
||||
$player.classList.remove('artplayer-hide-cursor');
|
||||
art.controls.show();
|
||||
|
||||
if (!art.player.pipState && player.playing && event.target === $video) {
|
||||
if (!art.player.pip && player.playing && event.target === $video) {
|
||||
autoHide();
|
||||
}
|
||||
});
|
||||
@@ -4900,14 +4869,14 @@
|
||||
$player = art.template.$player;
|
||||
var resizeObserver = new ResizeObserver_2(function () {
|
||||
if (option.autoSize) {
|
||||
if (!art.player.fullscreenState && !art.player.fullscreenWebState && !art.player.pipState) {
|
||||
art.player.autoSize();
|
||||
if (!art.player.fullscreen && !art.player.fullscreenWeb && !art.player.pip) {
|
||||
art.player.autoSize = true;
|
||||
} else {
|
||||
art.player.autoSizeRemove();
|
||||
art.player.autoSize = false;
|
||||
}
|
||||
}
|
||||
|
||||
art.player.aspectRatioReset();
|
||||
art.player.aspectRatioReset = true;
|
||||
art.emit('resize', $player);
|
||||
});
|
||||
resizeObserver.observe($player);
|
||||
@@ -5019,21 +4988,21 @@
|
||||
this.art = art;
|
||||
this.keys = {};
|
||||
this.add(27, function () {
|
||||
if (art.player.fullscreenWebState) {
|
||||
art.player.fullscreenWebExit();
|
||||
if (art.player.fullscreenWeb) {
|
||||
art.player.fullscreenWeb = false;
|
||||
}
|
||||
});
|
||||
this.add(32, function () {
|
||||
art.player.toggle();
|
||||
art.player.toggle = true;
|
||||
});
|
||||
this.add(37, function () {
|
||||
art.player.seek(art.player.currentTime - 10);
|
||||
art.player.seek = art.player.currentTime - 10;
|
||||
});
|
||||
this.add(38, function () {
|
||||
art.player.volume += 0.05;
|
||||
});
|
||||
this.add(39, function () {
|
||||
art.player.seek(art.player.currentTime + 10);
|
||||
art.player.seek = art.player.currentTime + 10;
|
||||
});
|
||||
this.add(40, function () {
|
||||
art.player.volume -= 0.05;
|
||||
@@ -5311,7 +5280,7 @@
|
||||
var value = event.target.dataset.value;
|
||||
|
||||
if (value) {
|
||||
player.flip(value);
|
||||
player.flip = value;
|
||||
}
|
||||
},
|
||||
mounted: function mounted($setting) {
|
||||
@@ -5336,7 +5305,7 @@
|
||||
var value = event.target.dataset.value;
|
||||
|
||||
if (value) {
|
||||
player.aspectRatio(value);
|
||||
player.aspectRatio = value;
|
||||
}
|
||||
},
|
||||
mounted: function mounted($setting) {
|
||||
@@ -5364,7 +5333,7 @@
|
||||
proxy($range, 'change', function () {
|
||||
var value = $range.value;
|
||||
$value.innerText = value;
|
||||
player.playbackRate(Number(value));
|
||||
player.playbackRate = Number(value);
|
||||
});
|
||||
art.on('playbackRateChange', function (rate) {
|
||||
if ($range.value !== rate) {
|
||||
@@ -5621,8 +5590,8 @@
|
||||
|
||||
if (canPlayType === 'maybe' || canPlayType === 'probably') {
|
||||
var url = URL.createObjectURL(file);
|
||||
player.playbackRateRemove();
|
||||
player.aspectRatioRemove();
|
||||
player.playbackRate = false;
|
||||
player.aspectRatio = false;
|
||||
template.$video.src = url;
|
||||
sleep(1000).then(function () {
|
||||
player.currentTime = 0;
|
||||
@@ -5854,11 +5823,7 @@
|
||||
key: "destroy",
|
||||
value: function destroy() {
|
||||
var removeHtml = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
||||
|
||||
if (this.events) {
|
||||
this.events.destroy();
|
||||
}
|
||||
|
||||
this.events.destroy();
|
||||
this.template.destroy(removeHtml);
|
||||
Artplayer.instances.splice(Artplayer.instances.indexOf(this), 1);
|
||||
this.isDestroy = true;
|
||||
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"file":"artplayer.js","sources":["../../node_modules/@babel/runtime/helpers/classCallCheck.js","../../node_modules/@babel/runtime/helpers/createClass.js","../../node_modules/@babel/runtime/helpers/typeof.js","../../node_modules/@babel/runtime/helpers/assertThisInitialized.js","../../node_modules/@babel/runtime/helpers/possibleConstructorReturn.js","../../node_modules/@babel/runtime/helpers/getPrototypeOf.js","../../node_modules/@babel/runtime/helpers/setPrototypeOf.js","../../node_modules/@babel/runtime/helpers/inherits.js","../../packages/artplayer/node_modules/tiny-emitter/index.js","../../packages/artplayer/node_modules/get-size/get-size.js","../../packages/artplayer/node_modules/ev-emitter/ev-emitter.js","../../packages/artplayer/node_modules/unipointer/unipointer.js","../../packages/artplayer/node_modules/unidragger/unidragger.js","../../packages/artplayer/node_modules/draggabilly/draggabilly.js","../../packages/artplayer/node_modules/option-validator/dist/option-validator.js","../../node_modules/@babel/runtime/helpers/arrayWithoutHoles.js","../../node_modules/@babel/runtime/helpers/iterableToArray.js","../../node_modules/@babel/runtime/helpers/nonIterableSpread.js","../../node_modules/@babel/runtime/helpers/toConsumableArray.js","../../node_modules/@babel/runtime/helpers/isNativeFunction.js","../../node_modules/@babel/runtime/helpers/construct.js","../../node_modules/@babel/runtime/helpers/wrapNativeSuper.js","../../packages/artplayer/src/utils/ArtPlayerError.js","../../packages/artplayer/src/utils/index.js","../../packages/artplayer/src/scheme/index.js","../../packages/artplayer/src/config/mimeCodec.js","../../packages/artplayer/src/config/mse.js","../../packages/artplayer/src/config/video.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/attachUrlMix.js","../../packages/artplayer/src/player/attrInit.js","../../packages/artplayer/src/player/eventInit.js","../../packages/artplayer/src/player/playMix.js","../../packages/artplayer/src/player/pauseMin.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","../../packages/artplayer/src/utils/component.js","../../node_modules/@babel/runtime/helpers/defineProperty.js","../../node_modules/@babel/runtime/helpers/objectSpread.js","../../packages/artplayer/src/controls/fullscreen.js","../../packages/artplayer/src/controls/fullscreenWeb.js","../../packages/artplayer/src/controls/pip.js","../../packages/artplayer/src/controls/playAndPause.js","../../packages/artplayer/src/controls/progress.js","../../packages/artplayer/src/controls/subtitle.js","../../packages/artplayer/src/controls/time.js","../../packages/artplayer/src/controls/volume.js","../../packages/artplayer/src/controls/setting.js","../../packages/artplayer/src/controls/thumbnails.js","../../packages/artplayer/src/controls/screenshot.js","../../packages/artplayer/src/controls/quality.js","../../packages/artplayer/src/controls/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","../../node_modules/@babel/runtime/helpers/arrayWithHoles.js","../../node_modules/@babel/runtime/helpers/iterableToArrayLimit.js","../../node_modules/@babel/runtime/helpers/nonIterableRest.js","../../node_modules/@babel/runtime/helpers/slicedToArray.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/node_modules/resize-observer/lib/ContentRect.js","../../packages/artpLine truncated
|
||||
{"version":3,"file":"artplayer.js","sources":["../../node_modules/@babel/runtime/helpers/classCallCheck.js","../../node_modules/@babel/runtime/helpers/createClass.js","../../node_modules/@babel/runtime/helpers/typeof.js","../../node_modules/@babel/runtime/helpers/assertThisInitialized.js","../../node_modules/@babel/runtime/helpers/possibleConstructorReturn.js","../../node_modules/@babel/runtime/helpers/getPrototypeOf.js","../../node_modules/@babel/runtime/helpers/setPrototypeOf.js","../../node_modules/@babel/runtime/helpers/inherits.js","../../packages/artplayer/node_modules/tiny-emitter/index.js","../../packages/artplayer/node_modules/get-size/get-size.js","../../packages/artplayer/node_modules/ev-emitter/ev-emitter.js","../../packages/artplayer/node_modules/unipointer/unipointer.js","../../packages/artplayer/node_modules/unidragger/unidragger.js","../../packages/artplayer/node_modules/draggabilly/draggabilly.js","../../packages/artplayer/node_modules/option-validator/dist/option-validator.js","../../node_modules/@babel/runtime/helpers/arrayWithoutHoles.js","../../node_modules/@babel/runtime/helpers/iterableToArray.js","../../node_modules/@babel/runtime/helpers/nonIterableSpread.js","../../node_modules/@babel/runtime/helpers/toConsumableArray.js","../../node_modules/@babel/runtime/helpers/isNativeFunction.js","../../node_modules/@babel/runtime/helpers/construct.js","../../node_modules/@babel/runtime/helpers/wrapNativeSuper.js","../../packages/artplayer/src/utils/ArtPlayerError.js","../../packages/artplayer/src/utils/index.js","../../packages/artplayer/src/scheme/index.js","../../packages/artplayer/src/config/mimeCodec.js","../../packages/artplayer/src/config/mse.js","../../packages/artplayer/src/config/video.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/attachUrlMix.js","../../packages/artplayer/src/player/attrInit.js","../../packages/artplayer/src/player/eventInit.js","../../packages/artplayer/src/player/playMix.js","../../packages/artplayer/src/player/pauseMin.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","../../packages/artplayer/src/utils/component.js","../../node_modules/@babel/runtime/helpers/defineProperty.js","../../node_modules/@babel/runtime/helpers/objectSpread.js","../../packages/artplayer/src/controls/fullscreen.js","../../packages/artplayer/src/controls/fullscreenWeb.js","../../packages/artplayer/src/controls/pip.js","../../packages/artplayer/src/controls/playAndPause.js","../../packages/artplayer/src/controls/progress.js","../../packages/artplayer/src/controls/subtitle.js","../../packages/artplayer/src/controls/time.js","../../packages/artplayer/src/controls/volume.js","../../packages/artplayer/src/controls/setting.js","../../packages/artplayer/src/controls/thumbnails.js","../../packages/artplayer/src/controls/screenshot.js","../../packages/artplayer/src/controls/quality.js","../../packages/artplayer/src/controls/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","../../node_modules/@babel/runtime/helpers/arrayWithHoles.js","../../node_modules/@babel/runtime/helpers/iterableToArrayLimit.js","../../node_modules/@babel/runtime/helpers/nonIterableRest.js","../../node_modules/@babel/runtime/helpers/slicedToArray.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/node_modules/resize-observer/lib/ContentRect.js","../../packages/artpLine truncated
|
||||
+10
-10
@@ -29,12 +29,12 @@
|
||||
},
|
||||
"homepage": "https://github.com/zhw2590582/ArtPlayer#readme",
|
||||
"dependencies": {
|
||||
"@babel/core": "^7.4.4",
|
||||
"@babel/core": "^7.4.5",
|
||||
"@babel/plugin-external-helpers": "^7.2.0",
|
||||
"@babel/plugin-transform-runtime": "^7.4.4",
|
||||
"@babel/preset-env": "^7.4.4",
|
||||
"@babel/runtime": "^7.4.4",
|
||||
"autoprefixer": "^9.5.1",
|
||||
"@babel/preset-env": "^7.4.5",
|
||||
"@babel/runtime": "^7.4.5",
|
||||
"autoprefixer": "^9.6.0",
|
||||
"babel-eslint": "^10.0.1",
|
||||
"browser-env": "^3.2.6",
|
||||
"chai": "^4.2.0",
|
||||
@@ -45,20 +45,20 @@
|
||||
"del": "^4.1.1",
|
||||
"eslint": "^5.16.0",
|
||||
"eslint-config-airbnb-base": "^13.1.0",
|
||||
"eslint-config-prettier": "^4.2.0",
|
||||
"eslint-plugin-import": "^2.17.2",
|
||||
"glob": "^7.1.3",
|
||||
"eslint-config-prettier": "^4.3.0",
|
||||
"eslint-plugin-import": "^2.17.3",
|
||||
"glob": "^7.1.4",
|
||||
"inquirer": "^6.3.1",
|
||||
"lerna": "^3.13.4",
|
||||
"lerna": "^3.14.1",
|
||||
"mocha": "^6.1.4",
|
||||
"mocha-chrome": "^2.0.0",
|
||||
"node-sass": "^4.12.0",
|
||||
"rollup": "^1.11.3",
|
||||
"rollup": "^1.14.2",
|
||||
"rollup-plugin-babel": "^4.3.2",
|
||||
"rollup-plugin-commonjs": "^10.0.0",
|
||||
"rollup-plugin-eslint": "^6.0.0",
|
||||
"rollup-plugin-json": "^4.0.0",
|
||||
"rollup-plugin-node-resolve": "^5.0.0",
|
||||
"rollup-plugin-node-resolve": "^5.0.1",
|
||||
"rollup-plugin-postcss": "^2.0.3",
|
||||
"rollup-plugin-replace": "^2.2.0",
|
||||
"rollup-plugin-svgo": "^1.0.2",
|
||||
|
||||
@@ -166,8 +166,8 @@ export default class Danmuku {
|
||||
danmu.$ref.style.color = danmu.color;
|
||||
danmu.$ref.style.border = danmu.border ? `1px solid ${danmu.color}` : 'none';
|
||||
danmu.$restTime =
|
||||
this.option.synchronousPlayback && player.playbackRateState
|
||||
? this.option.speed / Number(player.playbackRateState)
|
||||
this.option.synchronousPlayback && player.playbackRate
|
||||
? this.option.speed / Number(player.playbackRate)
|
||||
: this.option.speed;
|
||||
danmu.$lastStartTime = Date.now();
|
||||
const danmuWidth = getRect(danmu.$ref, 'width');
|
||||
|
||||
@@ -77,7 +77,9 @@ function artplayerPluginPlaylist(list) {
|
||||
|
||||
art.on('video:ended', () => {
|
||||
nextVideo().then(() => {
|
||||
sleep(1000).then(player.play);
|
||||
sleep(1000).then(() => {
|
||||
player.play = true;
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
@@ -15,7 +15,7 @@ export default function aspectRatio(menuOption) {
|
||||
const { target } = event;
|
||||
const { ratio } = target.dataset;
|
||||
if (ratio) {
|
||||
player.aspectRatio(ratio);
|
||||
player.aspectRatio = ratio;
|
||||
art.contextmenu.hide();
|
||||
}
|
||||
},
|
||||
|
||||
@@ -18,7 +18,7 @@ export default function playbackRate(menuOption) {
|
||||
const { target } = event;
|
||||
const { rate } = target.dataset;
|
||||
if (rate) {
|
||||
player.playbackRate(Number(rate));
|
||||
player.playbackRate = Number(rate);
|
||||
art.contextmenu.hide();
|
||||
}
|
||||
},
|
||||
|
||||
@@ -15,7 +15,7 @@ export default function fullscreen(controlOption) {
|
||||
tooltip($fullscreen, i18n.get('Fullscreen'));
|
||||
|
||||
proxy($control, 'click', () => {
|
||||
player.fullscreenToggle();
|
||||
player.fullscreenToggle = true;
|
||||
});
|
||||
|
||||
art.on('fullscreen:enabled', () => {
|
||||
|
||||
@@ -15,7 +15,7 @@ export default function fullscreenWeb(controlOption) {
|
||||
tooltip($fullscreenWeb, i18n.get('Web fullscreen'));
|
||||
|
||||
proxy($control, 'click', () => {
|
||||
player.fullscreenWebToggle();
|
||||
player.fullscreenWebToggle = true;
|
||||
});
|
||||
|
||||
art.on('fullscreenWeb:enabled', () => {
|
||||
|
||||
@@ -13,7 +13,7 @@ export default function pip(controlOption) {
|
||||
const $pip = append($control, icons.pip);
|
||||
tooltip($pip, i18n.get('Mini player'));
|
||||
proxy($control, 'click', () => {
|
||||
player.pipEnabled();
|
||||
player.pip = true;
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
@@ -17,11 +17,11 @@ export default function playAndPause(controlOption) {
|
||||
tooltip($pause, i18n.get('Pause'));
|
||||
|
||||
proxy($play, 'click', () => {
|
||||
player.play();
|
||||
player.play = true;
|
||||
});
|
||||
|
||||
proxy($pause, 'click', () => {
|
||||
player.pause();
|
||||
player.pause = true;
|
||||
});
|
||||
|
||||
function showPlay() {
|
||||
|
||||
@@ -121,7 +121,7 @@ export default function progress(controlOption) {
|
||||
if (event.target !== $indicator) {
|
||||
const { second, percentage } = getPosFromEvent(art, event);
|
||||
setBar('played', percentage);
|
||||
player.seek(second);
|
||||
player.seek = second;
|
||||
}
|
||||
});
|
||||
|
||||
@@ -134,7 +134,7 @@ export default function progress(controlOption) {
|
||||
const { second, percentage } = getPosFromEvent(art, event);
|
||||
$indicator.classList.add('art-show-indicator');
|
||||
setBar('played', percentage);
|
||||
player.seek(second);
|
||||
player.seek = second;
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@@ -22,7 +22,7 @@ export default function mousemoveInitInit(art, events) {
|
||||
autoHide.clearTimeout();
|
||||
$player.classList.remove('artplayer-hide-cursor');
|
||||
art.controls.show();
|
||||
if (!art.player.pipState && player.playing && event.target === $video) {
|
||||
if (!art.player.pip && player.playing && event.target === $video) {
|
||||
autoHide();
|
||||
}
|
||||
});
|
||||
|
||||
@@ -8,13 +8,13 @@ export default function resizeInit(art, events) {
|
||||
|
||||
const resizeObserver = new ResizeObserver(() => {
|
||||
if (option.autoSize) {
|
||||
if (!art.player.fullscreenState && !art.player.fullscreenWebState && !art.player.pipState) {
|
||||
art.player.autoSize();
|
||||
if (!art.player.fullscreen && !art.player.fullscreenWeb && !art.player.pip) {
|
||||
art.player.autoSize = true;
|
||||
} else {
|
||||
art.player.autoSizeRemove();
|
||||
art.player.autoSize = false;
|
||||
}
|
||||
}
|
||||
art.player.aspectRatioReset();
|
||||
art.player.aspectRatioReset = true;
|
||||
art.emit('resize', $player);
|
||||
});
|
||||
resizeObserver.observe($player);
|
||||
|
||||
@@ -4,17 +4,17 @@ export default class Hotkey {
|
||||
this.keys = {};
|
||||
|
||||
this.add(27, () => {
|
||||
if (art.player.fullscreenWebState) {
|
||||
art.player.fullscreenWebExit();
|
||||
if (art.player.fullscreenWeb) {
|
||||
art.player.fullscreenWeb = false;
|
||||
}
|
||||
});
|
||||
|
||||
this.add(32, () => {
|
||||
art.player.toggle();
|
||||
art.player.toggle = true;
|
||||
});
|
||||
|
||||
this.add(37, () => {
|
||||
art.player.seek(art.player.currentTime - 10);
|
||||
art.player.seek = art.player.currentTime - 10;
|
||||
});
|
||||
|
||||
this.add(38, () => {
|
||||
@@ -22,7 +22,7 @@ export default class Hotkey {
|
||||
});
|
||||
|
||||
this.add(39, () => {
|
||||
art.player.seek(art.player.currentTime + 10);
|
||||
art.player.seek = art.player.currentTime + 10;
|
||||
});
|
||||
|
||||
this.add(40, () => {
|
||||
|
||||
@@ -7,45 +7,43 @@ export default function aspectRatioMix(art, player) {
|
||||
notice,
|
||||
} = art;
|
||||
|
||||
Object.defineProperty(player, 'aspectRatioState', {
|
||||
get: () => $player.dataset.aspectRatio || '',
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'aspectRatio', {
|
||||
value: ratio => {
|
||||
const ratioList = ['default', '4:3', '16:9'];
|
||||
errorHandle(ratioList.includes(ratio), `'aspectRatio' only accept ${ratioList.toString()} as parameters`);
|
||||
|
||||
if (ratio === 'default') {
|
||||
player.aspectRatioRemove();
|
||||
} else {
|
||||
const ratioArray = ratio.split(':');
|
||||
const { videoWidth, videoHeight } = $video;
|
||||
const { clientWidth, clientHeight } = $player;
|
||||
const videoRatio = videoWidth / videoHeight;
|
||||
const setupRatio = ratioArray[0] / ratioArray[1];
|
||||
if (videoRatio > setupRatio) {
|
||||
const percentage = (setupRatio * videoHeight) / videoWidth;
|
||||
setStyle($video, 'width', `${percentage * 100}%`);
|
||||
setStyle($video, 'height', '100%');
|
||||
setStyle($video, 'padding', `0 ${(clientWidth - clientWidth * percentage) / 2}px`);
|
||||
} else {
|
||||
const percentage = videoWidth / setupRatio / videoHeight;
|
||||
setStyle($video, 'width', '100%');
|
||||
setStyle($video, 'height', `${percentage * 100}%`);
|
||||
setStyle($video, 'padding', `${(clientHeight - clientHeight * percentage) / 2}px 0`);
|
||||
}
|
||||
}
|
||||
|
||||
$player.dataset.aspectRatio = ratio;
|
||||
notice.show(`${i18n.get('Aspect ratio')}: ${ratio === 'default' ? i18n.get('Default') : ratio}`);
|
||||
art.emit('aspectRatioChange', ratio);
|
||||
get() {
|
||||
return $player.dataset.aspectRatio || '';
|
||||
},
|
||||
});
|
||||
set(ratio) {
|
||||
if (ratio) {
|
||||
const ratioList = ['default', '4:3', '16:9'];
|
||||
errorHandle(
|
||||
ratioList.includes(ratio),
|
||||
`'aspectRatio' only accept ${ratioList.toString()} as parameters`,
|
||||
);
|
||||
|
||||
Object.defineProperty(player, 'aspectRatioRemove', {
|
||||
value: () => {
|
||||
if (player.aspectRatioState) {
|
||||
if (ratio === 'default') {
|
||||
player.aspectRatio = false;
|
||||
} else {
|
||||
const ratioArray = ratio.split(':');
|
||||
const { videoWidth, videoHeight } = $video;
|
||||
const { clientWidth, clientHeight } = $player;
|
||||
const videoRatio = videoWidth / videoHeight;
|
||||
const setupRatio = ratioArray[0] / ratioArray[1];
|
||||
if (videoRatio > setupRatio) {
|
||||
const percentage = (setupRatio * videoHeight) / videoWidth;
|
||||
setStyle($video, 'width', `${percentage * 100}%`);
|
||||
setStyle($video, 'height', '100%');
|
||||
setStyle($video, 'padding', `0 ${(clientWidth - clientWidth * percentage) / 2}px`);
|
||||
} else {
|
||||
const percentage = videoWidth / setupRatio / videoHeight;
|
||||
setStyle($video, 'width', '100%');
|
||||
setStyle($video, 'height', `${percentage * 100}%`);
|
||||
setStyle($video, 'padding', `${(clientHeight - clientHeight * percentage) / 2}px 0`);
|
||||
}
|
||||
}
|
||||
|
||||
$player.dataset.aspectRatio = ratio;
|
||||
notice.show(`${i18n.get('Aspect ratio')}: ${ratio === 'default' ? i18n.get('Default') : ratio}`);
|
||||
art.emit('aspectRatioChange', ratio);
|
||||
} else if (player.aspectRatio) {
|
||||
setStyle($video, 'width', null);
|
||||
setStyle($video, 'height', null);
|
||||
setStyle($video, 'padding', null);
|
||||
@@ -56,10 +54,9 @@ export default function aspectRatioMix(art, player) {
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'aspectRatioReset', {
|
||||
value: () => {
|
||||
const { aspectRatio } = $player.dataset;
|
||||
if (aspectRatio) {
|
||||
player.aspectRatio(aspectRatio);
|
||||
set(value) {
|
||||
if (value && player.aspectRatio) {
|
||||
player.aspectRatio = player.aspectRatio;
|
||||
art.emit('aspectRatioReset');
|
||||
}
|
||||
},
|
||||
|
||||
@@ -5,36 +5,33 @@ export default function resizeMix(art, player) {
|
||||
template: { $container, $player, $video },
|
||||
} = art;
|
||||
|
||||
Object.defineProperty(player, 'autoSizeState', {
|
||||
get: () => $container.classList.contains('artplayer-auto-size'),
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'autoSize', {
|
||||
value: () => {
|
||||
const { videoWidth, videoHeight } = $video;
|
||||
const { width, height } = $container.getBoundingClientRect();
|
||||
const videoRatio = videoWidth / videoHeight;
|
||||
const containerRatio = width / height;
|
||||
$container.classList.add('artplayer-auto-size');
|
||||
if (containerRatio > videoRatio) {
|
||||
const percentage = ((height * videoRatio) / width) * 100;
|
||||
setStyle($player, 'width', `${percentage}%`);
|
||||
setStyle($player, 'height', '100%');
|
||||
} else {
|
||||
const percentage = (width / videoRatio / height) * 100;
|
||||
setStyle($player, 'width', '100%');
|
||||
setStyle($player, 'height', `${percentage}%`);
|
||||
}
|
||||
art.emit('autoSizeChange');
|
||||
get() {
|
||||
return $container.classList.contains('artplayer-auto-size');
|
||||
},
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'autoSizeRemove', {
|
||||
value: () => {
|
||||
$container.classList.remove('artplayer-auto-size');
|
||||
setStyle($player, 'width', null);
|
||||
setStyle($player, 'height', null);
|
||||
art.emit('autoSizeRemove');
|
||||
set(value) {
|
||||
if (value) {
|
||||
const { videoWidth, videoHeight } = $video;
|
||||
const { width, height } = $container.getBoundingClientRect();
|
||||
const videoRatio = videoWidth / videoHeight;
|
||||
const containerRatio = width / height;
|
||||
$container.classList.add('artplayer-auto-size');
|
||||
if (containerRatio > videoRatio) {
|
||||
const percentage = ((height * videoRatio) / width) * 100;
|
||||
setStyle($player, 'width', `${percentage}%`);
|
||||
setStyle($player, 'height', '100%');
|
||||
} else {
|
||||
const percentage = (width / videoRatio / height) * 100;
|
||||
setStyle($player, 'width', '100%');
|
||||
setStyle($player, 'height', `${percentage}%`);
|
||||
}
|
||||
art.emit('autoSizeChange');
|
||||
} else {
|
||||
$container.classList.remove('artplayer-auto-size');
|
||||
setStyle($player, 'width', null);
|
||||
setStyle($player, 'height', null);
|
||||
art.emit('autoSizeRemove');
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
@@ -14,7 +14,7 @@ export default function eventInit(art, player) {
|
||||
const maxReconnectTime = 5;
|
||||
|
||||
proxy($video, 'click', () => {
|
||||
player.toggle();
|
||||
player.toggle = true;
|
||||
});
|
||||
|
||||
config.video.events.forEach(eventName => {
|
||||
@@ -50,8 +50,8 @@ export default function eventInit(art, player) {
|
||||
art.controls.show();
|
||||
art.mask.show();
|
||||
if (option.loop) {
|
||||
player.seek(0);
|
||||
player.play();
|
||||
player.seek = 0;
|
||||
player.play = true;
|
||||
}
|
||||
});
|
||||
|
||||
@@ -79,7 +79,7 @@ export default function eventInit(art, player) {
|
||||
|
||||
art.on('video:loadedmetadata', () => {
|
||||
if (option.autoSize) {
|
||||
player.autoSize();
|
||||
player.autoSize = true;
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@@ -1,23 +1,20 @@
|
||||
import { errorHandle } from '../utils';
|
||||
|
||||
export default function flipMix(art, player) {
|
||||
Object.defineProperty(player, 'flipState', {
|
||||
get: () => art.template.$player.dataset.flip,
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'flip', {
|
||||
value: flip => {
|
||||
const flipList = ['normal', 'horizontal', 'vertical'];
|
||||
errorHandle(flipList.includes(flip), `'flip' only accept ${flipList.toString()} as parameters`);
|
||||
art.template.$player.dataset.flip = flip;
|
||||
art.emit('flipChange', flip);
|
||||
get() {
|
||||
return art.template.$player.dataset.flip;
|
||||
},
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'flipRemove', {
|
||||
value: () => {
|
||||
delete art.template.$player.dataset.flip;
|
||||
art.emit('flipRemove');
|
||||
set(flip) {
|
||||
if (flip) {
|
||||
const flipList = ['normal', 'horizontal', 'vertical'];
|
||||
errorHandle(flipList.includes(flip), `'flip' only accept ${flipList.toString()} as parameters`);
|
||||
art.template.$player.dataset.flip = flip;
|
||||
art.emit('flipChange', flip);
|
||||
} else {
|
||||
delete art.template.$player.dataset.flip;
|
||||
art.emit('flipRemove');
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
@@ -27,50 +27,37 @@ export default function fullscreenMix(art, player) {
|
||||
screenfullError();
|
||||
}
|
||||
|
||||
Object.defineProperty(player, 'fullscreenState', {
|
||||
get: () => screenfull.isFullscreen,
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'fullscreenEnabled', {
|
||||
value: () => {
|
||||
if (screenfull.enabled) {
|
||||
if (!player.fullscreenState) {
|
||||
player.fullscreenWebExit();
|
||||
screenfull.request($player).then(() => {
|
||||
$player.classList.add('artplayer-fullscreen');
|
||||
player.aspectRatioReset();
|
||||
art.emit('fullscreen:enabled');
|
||||
});
|
||||
}
|
||||
} else {
|
||||
screenfullError();
|
||||
}
|
||||
Object.defineProperty(player, 'fullscreen', {
|
||||
get() {
|
||||
return screenfull.isFullscreen;
|
||||
},
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'fullscreenExit', {
|
||||
value: () => {
|
||||
if (screenfull.enabled) {
|
||||
if (player.fullscreenState) {
|
||||
player.fullscreenWebExit();
|
||||
screenfull.exit().then(() => {
|
||||
$player.classList.remove('artplayer-fullscreen');
|
||||
player.aspectRatioReset();
|
||||
art.emit('fullscreen:exit');
|
||||
});
|
||||
set(value) {
|
||||
if (value) {
|
||||
if (player.fullscreenWeb) {
|
||||
player.fullscreenWeb = false;
|
||||
}
|
||||
screenfull.request($player).then(() => {
|
||||
$player.classList.add('artplayer-fullscreen');
|
||||
player.aspectRatioReset = true;
|
||||
art.emit('fullscreen:enabled');
|
||||
});
|
||||
} else {
|
||||
screenfullError();
|
||||
if (player.fullscreenWeb) {
|
||||
player.fullscreenWeb = false;
|
||||
}
|
||||
screenfull.exit().then(() => {
|
||||
$player.classList.remove('artplayer-fullscreen');
|
||||
player.aspectRatioReset = true;
|
||||
art.emit('fullscreen:exit');
|
||||
});
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'fullscreenToggle', {
|
||||
value: () => {
|
||||
if (player.fullscreenState) {
|
||||
player.fullscreenExit();
|
||||
} else {
|
||||
player.fullscreenEnabled();
|
||||
set(value) {
|
||||
if (value) {
|
||||
player.fullscreen = !player.fullscreen;
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
@@ -3,38 +3,33 @@ export default function fullscreenWebMix(art, player) {
|
||||
template: { $player },
|
||||
} = art;
|
||||
|
||||
Object.defineProperty(player, 'fullscreenWebState', {
|
||||
get: () => $player.classList.contains('artplayer-web-fullscreen'),
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'fullscreenWebEnabled', {
|
||||
value: () => {
|
||||
if (player.fullscreenState) {
|
||||
player.fullscreenExit();
|
||||
}
|
||||
$player.classList.add('artplayer-web-fullscreen');
|
||||
player.aspectRatioReset();
|
||||
art.emit('fullscreenWeb:enabled');
|
||||
Object.defineProperty(player, 'fullscreenWeb', {
|
||||
get() {
|
||||
return $player.classList.contains('artplayer-web-fullscreen');
|
||||
},
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'fullscreenWebExit', {
|
||||
value: () => {
|
||||
if (player.fullscreenWebState) {
|
||||
player.fullscreenExit();
|
||||
set(value) {
|
||||
if (value) {
|
||||
if (player.fullscreen) {
|
||||
player.fullscreen = false;
|
||||
}
|
||||
$player.classList.add('artplayer-web-fullscreen');
|
||||
player.aspectRatioReset = true;
|
||||
art.emit('fullscreenWeb:enabled');
|
||||
} else {
|
||||
if (player.fullscreen) {
|
||||
player.fullscreen = false;
|
||||
}
|
||||
$player.classList.remove('artplayer-web-fullscreen');
|
||||
player.aspectRatioReset();
|
||||
player.aspectRatioReset = true;
|
||||
art.emit('fullscreenWeb:exit');
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'fullscreenWebToggle', {
|
||||
value: () => {
|
||||
if (player.fullscreenWebState) {
|
||||
player.fullscreenWebExit();
|
||||
} else {
|
||||
player.fullscreenWebEnabled();
|
||||
set(value) {
|
||||
if (value) {
|
||||
player.fullscreenWeb = !player.fullscreenWeb;
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
@@ -6,10 +6,17 @@ export default function pauseMin(art, player) {
|
||||
} = art;
|
||||
|
||||
Object.defineProperty(player, 'pause', {
|
||||
value: () => {
|
||||
$video.pause();
|
||||
notice.show(i18n.get('Pause'));
|
||||
art.emit('pause');
|
||||
get() {
|
||||
return $video.paused;
|
||||
},
|
||||
set(value) {
|
||||
if (value) {
|
||||
$video.pause();
|
||||
notice.show(i18n.get('Pause'));
|
||||
art.emit('pause');
|
||||
} else {
|
||||
player.play = true;
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
@@ -10,25 +10,22 @@ function nativePip(art, player) {
|
||||
|
||||
$video.disablePictureInPicture = false;
|
||||
|
||||
Object.defineProperty(player, 'pipState', {
|
||||
get: () => document.pictureInPictureElement,
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'pipEnabled', {
|
||||
value: () => {
|
||||
$video.requestPictureInPicture().catch(error => {
|
||||
notice.show(error, true, 3000);
|
||||
console.warn(error);
|
||||
});
|
||||
Object.defineProperty(player, 'pip', {
|
||||
get() {
|
||||
return document.pictureInPictureElement;
|
||||
},
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'pipExit', {
|
||||
value: () => {
|
||||
document.exitPictureInPicture().catch(error => {
|
||||
notice.show(error, true, 3000);
|
||||
console.warn(error);
|
||||
});
|
||||
set(value) {
|
||||
if (value) {
|
||||
$video.requestPictureInPicture().catch(error => {
|
||||
notice.show(error, true, 3000);
|
||||
console.warn(error);
|
||||
});
|
||||
} else {
|
||||
document.exitPictureInPicture().catch(error => {
|
||||
notice.show(error, true, 3000);
|
||||
console.warn(error);
|
||||
});
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
@@ -41,8 +38,8 @@ function nativePip(art, player) {
|
||||
});
|
||||
|
||||
art.on('destroy', () => {
|
||||
if (player.pipState) {
|
||||
player.pipExit();
|
||||
if (player.pip) {
|
||||
player.pip = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -52,21 +49,18 @@ function webkitPip(art, player) {
|
||||
|
||||
$video.webkitSetPresentationMode('inline');
|
||||
|
||||
Object.defineProperty(player, 'pipState', {
|
||||
get: () => $video.webkitPresentationMode === 'picture-in-picture',
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'pipEnabled', {
|
||||
value: () => {
|
||||
$video.webkitSetPresentationMode('picture-in-picture');
|
||||
art.emit('pipEnabled');
|
||||
Object.defineProperty(player, 'pip', {
|
||||
get() {
|
||||
return $video.webkitPresentationMode === 'picture-in-picture';
|
||||
},
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'pipExit', {
|
||||
value: () => {
|
||||
$video.webkitSetPresentationMode('inline');
|
||||
art.emit('pipExit');
|
||||
set(value) {
|
||||
if (value) {
|
||||
$video.webkitSetPresentationMode('picture-in-picture');
|
||||
art.emit('pipEnabled');
|
||||
} else {
|
||||
$video.webkitSetPresentationMode('inline');
|
||||
art.emit('pipExit');
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
@@ -81,55 +75,50 @@ function customPip(art, player) {
|
||||
let cachePos = null;
|
||||
let draggie = null;
|
||||
|
||||
Object.defineProperty(player, 'pipState', {
|
||||
get: () => $player.classList.contains('artplayer-pip'),
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'pipEnabled', {
|
||||
value: () => {
|
||||
if (player.autoSizeState) {
|
||||
player.autoSizeRemove();
|
||||
}
|
||||
|
||||
if (!draggie) {
|
||||
draggie = new Draggabilly($player, {
|
||||
handle: '.artplayer-pip-header',
|
||||
});
|
||||
|
||||
append($pipTitle, option.title || i18n.get('Mini player'));
|
||||
|
||||
proxy($pipClose, 'click', () => {
|
||||
player.pipExit();
|
||||
});
|
||||
|
||||
destroyEvents.push(() => {
|
||||
draggie.destroy();
|
||||
});
|
||||
} else if (cachePos && cachePos.x !== 0 && cachePos.y !== 0) {
|
||||
setStyle($player, 'left', `${cachePos.x}px`);
|
||||
setStyle($player, 'top', `${cachePos.y}px`);
|
||||
}
|
||||
|
||||
$player.classList.add('artplayer-pip');
|
||||
player.fullscreenExit();
|
||||
player.fullscreenWebExit();
|
||||
player.aspectRatioRemove();
|
||||
player.playbackRateRemove();
|
||||
art.emit('pipEnabled');
|
||||
Object.defineProperty(player, 'pip', {
|
||||
get() {
|
||||
return $player.classList.contains('artplayer-pip');
|
||||
},
|
||||
});
|
||||
set(value) {
|
||||
if (value) {
|
||||
if (player.autoSize) {
|
||||
player.autoSize = false;
|
||||
}
|
||||
|
||||
Object.defineProperty(player, 'pipExit', {
|
||||
value: () => {
|
||||
if (player.pipState) {
|
||||
if (!draggie) {
|
||||
draggie = new Draggabilly($player, {
|
||||
handle: '.artplayer-pip-header',
|
||||
});
|
||||
|
||||
append($pipTitle, option.title || i18n.get('Mini player'));
|
||||
|
||||
proxy($pipClose, 'click', () => {
|
||||
player.pip = false;
|
||||
});
|
||||
|
||||
destroyEvents.push(() => {
|
||||
draggie.destroy();
|
||||
});
|
||||
} else if (cachePos && cachePos.x !== 0 && cachePos.y !== 0) {
|
||||
setStyle($player, 'left', `${cachePos.x}px`);
|
||||
setStyle($player, 'top', `${cachePos.y}px`);
|
||||
}
|
||||
|
||||
$player.classList.add('artplayer-pip');
|
||||
player.fullscreen = false;
|
||||
player.fullscreenWeb = false;
|
||||
player.aspectRatio = false;
|
||||
player.playbackRate = false;
|
||||
art.emit('pipEnabled');
|
||||
} else if (player.pip) {
|
||||
$player.classList.remove('artplayer-pip');
|
||||
cachePos = draggie.position;
|
||||
setStyle($player, 'left', null);
|
||||
setStyle($player, 'top', null);
|
||||
player.fullscreenExit();
|
||||
player.fullscreenWebExit();
|
||||
player.aspectRatioRemove();
|
||||
player.playbackRateRemove();
|
||||
player.fullscreen = false;
|
||||
player.fullscreenWeb = false;
|
||||
player.aspectRatio = false;
|
||||
player.playbackRate = false;
|
||||
art.emit('pipExit');
|
||||
}
|
||||
},
|
||||
@@ -147,11 +136,9 @@ export default function pipMix(art, player) {
|
||||
}
|
||||
|
||||
Object.defineProperty(player, 'pipToggle', {
|
||||
value: () => {
|
||||
if (player.pipState) {
|
||||
player.pipExit();
|
||||
} else {
|
||||
player.pipEnabled();
|
||||
set(value) {
|
||||
if (value) {
|
||||
player.pip = !player.pip;
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
@@ -7,21 +7,29 @@ export default function playMix(art, player) {
|
||||
} = art;
|
||||
|
||||
Object.defineProperty(player, 'play', {
|
||||
value: () => {
|
||||
const promise = $video.play();
|
||||
if (promise !== undefined) {
|
||||
promise.then().catch(err => {
|
||||
notice.show(err, true, 3000);
|
||||
console.warn(err);
|
||||
});
|
||||
}
|
||||
set(value) {
|
||||
if (value) {
|
||||
const promise = $video.play();
|
||||
if (promise !== undefined) {
|
||||
promise.then().catch(err => {
|
||||
notice.show(err, true, 3000);
|
||||
console.warn(err);
|
||||
});
|
||||
}
|
||||
|
||||
if (mutex) {
|
||||
art.constructor.instances.filter(item => item !== art).forEach(item => item.player.pause());
|
||||
}
|
||||
if (mutex) {
|
||||
art.constructor.instances
|
||||
.filter(item => item !== art)
|
||||
.forEach(item => {
|
||||
item.player.pause = true;
|
||||
});
|
||||
}
|
||||
|
||||
notice.show(i18n.get('Play'));
|
||||
art.emit('play');
|
||||
notice.show(i18n.get('Play'));
|
||||
art.emit('play');
|
||||
} else {
|
||||
player.pause = true;
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
@@ -7,30 +7,25 @@ export default function playbackRateMix(art, player) {
|
||||
notice,
|
||||
} = art;
|
||||
|
||||
Object.defineProperty(player, 'playbackRateState', {
|
||||
get: () => $player.dataset.playbackRate,
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'playbackRate', {
|
||||
value: rate => {
|
||||
const rateList = [0.5, 0.75, 1.0, 1.25, 1.5, 1.75, 2.0];
|
||||
errorHandle(rateList.includes(rate), `'playbackRate' only accept ${rateList.toString()} as parameters`);
|
||||
|
||||
if (rate === $player.dataset.playbackRate) {
|
||||
return;
|
||||
}
|
||||
|
||||
$video.playbackRate = rate;
|
||||
$player.dataset.playbackRate = rate;
|
||||
notice.show(`${i18n.get('Rate')}: ${rate === 1.0 ? i18n.get('Normal') : `${rate}x`}`);
|
||||
art.emit('playbackRateChange', rate);
|
||||
get() {
|
||||
return $player.dataset.playbackRate;
|
||||
},
|
||||
});
|
||||
set(rate) {
|
||||
if (rate) {
|
||||
const rateList = [0.5, 0.75, 1.0, 1.25, 1.5, 1.75, 2.0];
|
||||
errorHandle(rateList.includes(rate), `'playbackRate' only accept ${rateList.toString()} as parameters`);
|
||||
|
||||
Object.defineProperty(player, 'playbackRateRemove', {
|
||||
value: () => {
|
||||
if (player.playbackRateState) {
|
||||
player.playbackRate(1);
|
||||
if (rate === $player.dataset.playbackRate) {
|
||||
return;
|
||||
}
|
||||
|
||||
$video.playbackRate = rate;
|
||||
$player.dataset.playbackRate = rate;
|
||||
notice.show(`${i18n.get('Rate')}: ${rate === 1.0 ? i18n.get('Normal') : `${rate}x`}`);
|
||||
art.emit('playbackRateChange', rate);
|
||||
} else if (player.playbackRate) {
|
||||
player.playbackRate = 1;
|
||||
delete $player.dataset.playbackRate;
|
||||
art.emit('playbackRateRemove');
|
||||
}
|
||||
@@ -38,11 +33,13 @@ export default function playbackRateMix(art, player) {
|
||||
});
|
||||
|
||||
Object.defineProperty(player, 'playbackRateReset', {
|
||||
value: () => {
|
||||
const { playbackRate } = $player.dataset;
|
||||
if (playbackRate) {
|
||||
player.playbackRate(Number(playbackRate));
|
||||
art.emit('playbackRateReset');
|
||||
set(value) {
|
||||
if (value) {
|
||||
const { playbackRate } = $player.dataset;
|
||||
if (playbackRate) {
|
||||
player.playbackRate = Number(playbackRate);
|
||||
art.emit('playbackRateReset');
|
||||
}
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
@@ -4,7 +4,7 @@ export default function seekMix(art, player) {
|
||||
const { notice } = art;
|
||||
|
||||
Object.defineProperty(player, 'seek', {
|
||||
value: time => {
|
||||
set(time) {
|
||||
player.currentTime = time;
|
||||
notice.show(`${secondToTime(time)} / ${secondToTime(player.duration)}`);
|
||||
art.emit('seek', time);
|
||||
|
||||
@@ -7,13 +7,13 @@ export default function switchMix(art, player) {
|
||||
const { currentTime, playing } = player;
|
||||
return player.attachUrl(url).then(() => {
|
||||
option.url = url;
|
||||
player.playbackRateRemove();
|
||||
player.aspectRatioRemove();
|
||||
player.playbackRate = false;
|
||||
player.aspectRatio = false;
|
||||
art.once('video:canplay', () => {
|
||||
player.currentTime = currentTime;
|
||||
});
|
||||
if (playing) {
|
||||
player.play();
|
||||
player.play = true;
|
||||
}
|
||||
notice.show(`${i18n.get('Switch video')}: ${name}`);
|
||||
art.emit('switch', url);
|
||||
@@ -29,11 +29,11 @@ export default function switchMix(art, player) {
|
||||
const { playing } = player;
|
||||
return player.attachUrl(url).then(() => {
|
||||
option.url = url;
|
||||
player.playbackRateRemove();
|
||||
player.aspectRatioRemove();
|
||||
player.playbackRate = false;
|
||||
player.aspectRatio = false;
|
||||
player.currentTime = 0;
|
||||
if (playing) {
|
||||
player.play();
|
||||
player.play = true;
|
||||
}
|
||||
notice.show(`${i18n.get('Switch video')}: ${name}`);
|
||||
art.emit('switch', url);
|
||||
|
||||
@@ -1,10 +1,12 @@
|
||||
export default function toggleMix(art, player) {
|
||||
Object.defineProperty(player, 'toggle', {
|
||||
value: () => {
|
||||
if (player.playing) {
|
||||
player.pause();
|
||||
} else {
|
||||
player.play();
|
||||
set(value) {
|
||||
if (value) {
|
||||
if (player.playing) {
|
||||
player.pause = true;
|
||||
} else {
|
||||
player.play = true;
|
||||
}
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
@@ -25,8 +25,8 @@ export default function localPreview(art) {
|
||||
const canPlayType = template.$video.canPlayType(file.type);
|
||||
if (canPlayType === 'maybe' || canPlayType === 'probably') {
|
||||
const url = URL.createObjectURL(file);
|
||||
player.playbackRateRemove();
|
||||
player.aspectRatioRemove();
|
||||
player.playbackRate = false;
|
||||
player.aspectRatio = false;
|
||||
template.$video.src = url;
|
||||
sleep(1000).then(() => {
|
||||
player.currentTime = 0;
|
||||
|
||||
@@ -22,7 +22,7 @@ export default function aspectRatio(settingOption) {
|
||||
click: event => {
|
||||
const { value } = event.target.dataset;
|
||||
if (value) {
|
||||
player.aspectRatio(value);
|
||||
player.aspectRatio = value;
|
||||
}
|
||||
},
|
||||
mounted: $setting => {
|
||||
|
||||
@@ -22,7 +22,7 @@ export default function flip(settingOption) {
|
||||
click: event => {
|
||||
const { value } = event.target.dataset;
|
||||
if (value) {
|
||||
player.flip(value);
|
||||
player.flip = value;
|
||||
}
|
||||
},
|
||||
mounted: $setting => {
|
||||
|
||||
@@ -21,7 +21,7 @@ export default function playbackRate(settingOption) {
|
||||
proxy($range, 'change', () => {
|
||||
const { value } = $range;
|
||||
$value.innerText = value;
|
||||
player.playbackRate(Number(value));
|
||||
player.playbackRate = Number(value);
|
||||
});
|
||||
|
||||
art.on('playbackRateChange', rate => {
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
{
|
||||
"include": ["src"],
|
||||
"include": ["types"],
|
||||
"compilerOptions": {
|
||||
"lib": ["es2015"],
|
||||
"strict": true
|
||||
|
||||
+1
-1
@@ -3,7 +3,7 @@ export default class Artplayer {
|
||||
/**
|
||||
* Selector or a dom element (required)
|
||||
*/
|
||||
container: string | Element;
|
||||
container: string;
|
||||
|
||||
/**
|
||||
* Video url or a function that returns a promise value of url (required)
|
||||
|
||||
@@ -45,9 +45,7 @@ module.exports = function creatRollupConfig(projectPath) {
|
||||
}),
|
||||
postcss({
|
||||
plugins: [
|
||||
autoprefixer({
|
||||
browsers: ['last 2 versions'],
|
||||
}),
|
||||
autoprefixer(),
|
||||
cssnano({
|
||||
preset: 'default',
|
||||
}),
|
||||
|
||||
Reference in new issue
Block a user