update

docs/js/artplayer.js

@@ -436,6 +436,7 @@
       this.art = art;
       this.init();
       this.eventBind();
+      this.playing = false;
     }
 
     createClass(Player, [{
@@ -474,7 +475,7 @@
           _this.art.mask.show();
 
           if (_this.art.option.autoplay) {
-            var promise = $video.play();
+            var promise = _this.play();
 
             if (promise !== undefined) {
               promise.then().catch(function (err) {
@@ -484,16 +485,22 @@
           }
         });
         this.art.on('video:playing', function () {
+          _this.playing = true;
+
           _this.art.controls.hide();
 
           _this.art.mask.hide();
         });
         this.art.on('video:pause', function () {
+          _this.playing = false;
+
           _this.art.controls.show();
 
           _this.art.mask.show();
         });
         this.art.on('video:ended', function () {
+          _this.playing = false;
+
           _this.art.controls.show();
 
           _this.art.mask.show();
@@ -501,15 +508,22 @@
       }
     }, {
       key: "play",
-      value: function play() {//
+      value: function play() {
+        return this.art.refs.$video.play();
       }
     }, {
       key: "pause",
-      value: function pause() {//
+      value: function pause() {
+        return this.art.refs.$video.pause();
       }
     }, {
       key: "toggle",
-      value: function toggle() {//
+      value: function toggle() {
+        if (this.playing) {
+          this.pause();
+        } else {
+          this.play();
+        }
       }
     }, {
       key: "seek",
@@ -932,13 +946,13 @@
               switch (event.keyCode) {
                 case 39:
                   event.preventDefault();
-                  player.seek(player.currentTime + 10);
+                  player.seek(player.currentTime() + 10);
                   notice.show(i18n.get('Fast forward 10 seconds'), true);
                   break;
 
                 case 37:
                   event.preventDefault();
-                  player.seek(player.currentTime - 10);
+                  player.seek(player.currentTime() - 10);
                   notice.show(i18n.get('Rewind 10 seconds'), true);
                   break;
 
@@ -992,10 +1006,11 @@
       value: function init() {
         var _this$art = this.art,
             refs = _this$art.refs,
+            player = _this$art.player,
             proxy = _this$art.events.proxy;
         proxy(refs.$layers, 'click', function (event) {
           if (event.path[0] === refs.$layers) {
-            refs.$video.pause();
+            player.pause();
           }
         });
       }
@@ -1090,7 +1105,6 @@
       classCallCheck(this, Loading);
 
       this.art = art;
-      this.state = false;
       this.init();
     }
 
@@ -1110,13 +1124,11 @@
     }, {
       key: "hide",
       value: function hide() {
-        this.state = false;
         this.art.refs.$loading.style.display = 'none';
       }
     }, {
       key: "show",
       value: function show() {
-        this.state = true;
         this.art.refs.$loading.style.display = 'flex';
       }
     }]);
@@ -1177,13 +1189,14 @@
         var _this = this;
 
         var _this$art = this.art,
+            player = _this$art.player,
             option = _this$art.option,
             refs = _this$art.refs,
             proxy = _this$art.events.proxy;
         Icons$1.play.style.backgroundColor = option.theme;
         refs.$mask.appendChild(Icons$1.play);
         proxy(refs.$mask, 'click', function () {
-          refs.$video.play();
+          player.play();
 
           _this.hide();
         });

docs/js/artplayer.js.map

@@ -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","../../node_modules/@babel/runtime/helpers/isNativeFunction.js","../../node_modules/@babel/runtime/helpers/construct.js","../../node_modules/@babel/runtime/helpers/wrapNativeSuper.js","../../src/utils/ArtPlayerError.js","../../src/utils/index.js","../../src/utils/verification.js","../../src/config/mimeCodec.js","../../src/config/mse.js","../../src/config/video.js","../../src/config/index.js","../../node_modules/tiny-emitter/index.js","../../src/template.js","../../src/i18n.js","../../src/player.js","../../src/mse.js","../../src/controls/index.js","../../src/contextmenu.js","../../src/danmu.js","../../src/info.js","../../src/subtitle.js","../../src/events.js","../../src/hotkey.js","../../src/layers.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","../../src/icons/index.js","../../src/loading.js","../../src/notice.js","../../src/mask.js","../../src/index.js"],"sourcesContent":["function _classCallCheck(instance, Constructor) {\n  if (!(instance instanceof Constructor)) {\n    throw new TypeError(\"Cannot call a class as a function\");\n  }\n}\n\nmodule.exports = _classCallCheck;","function _defineProperties(target, props) {\n  for (var i = 0; i < props.length; i++) {\n    var descriptor = props[i];\n    descriptor.enumerable = descriptor.enumerable || false;\n    descriptor.configurable = true;\n    if (\"value\" in descriptor) descriptor.writable = true;\n    Object.defineProperty(target, descriptor.key, descriptor);\n  }\n}\n\nfunction _createClass(Constructor, protoProps, staticProps) {\n  if (protoProps) _defineProperties(Constructor.prototype, protoProps);\n  if (staticProps) _defineProperties(Constructor, staticProps);\n  return Constructor;\n}\n\nmodule.exports = _createClass;","function _typeof2(obj) { if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof2 = function _typeof2(obj) { return typeof obj; }; } else { _typeof2 = function _typeof2(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof2(obj); }\n\nfunction _typeof(obj) {\n  if (typeof Symbol === \"function\" && _typeof2(Symbol.iterator) === \"symbol\") {\n    module.exports = _typeof = function _typeof(obj) {\n      return _typeof2(obj);\n    };\n  } else {\n    module.exports = _typeof = function _typeof(obj) {\n      return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : _typeof2(obj);\n    };\n  }\n\n  return _typeof(obj);\n}\n\nmodule.exports = _typeof;","function _assertThisInitialized(self) {\n  if (self === void 0) {\n    throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n  }\n\n  return self;\n}\n\nmodule.exports = _assertThisInitialized;","var _typeof = require(\"../helpers/typeof\");\n\nvar assertThisInitialized = require(\"./assertThisInitialized\");\n\nfunction _possibleConstructorReturn(self, call) {\n  if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) {\n    return call;\n  }\n\n  return assertThisInitialized(self);\n}\n\nmodule.exports = _possibleConstructorReturn;","function _getPrototypeOf(o) {\n  module.exports = _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {\n    return o.__proto__ || Object.getPrototypeOf(o);\n  };\n  return _getPrototypeOf(o);\n}\n\nmodule.exports = _getPrototypeOf;","function _setPrototypeOf(o, p) {\n  module.exports = _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {\n    o.__proto__ = p;\n    return o;\n  };\n\n  return _setPrototypeOf(o, p);\n}\n\nmodule.exports = _setPrototypeOf;","var setPrototypeOf = require(\"./setPrototypeOf\");\n\nfunction _inherits(subClass, superClass) {\n  if (typeof superClass !== \"function\" && superClass !== null) {\n    throw new TypeError(\"Super expression must either be null or a function\");\n  }\n\n  subClass.prototype = Object.create(superClass && superClass.prototype, {\n    constructor: {\n      value: subClass,\n      writable: true,\n      configurable: true\n    }\n  });\n  if (superClass) setPrototypeOf(subClass, superClass);\n}\n\nmodule.exports = _inherits;","function _isNativeFunction(Line 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","../../node_modules/@babel/runtime/helpers/isNativeFunction.js","../../node_modules/@babel/runtime/helpers/construct.js","../../node_modules/@babel/runtime/helpers/wrapNativeSuper.js","../../src/utils/ArtPlayerError.js","../../src/utils/index.js","../../src/utils/verification.js","../../src/config/mimeCodec.js","../../src/config/mse.js","../../src/config/video.js","../../src/config/index.js","../../node_modules/tiny-emitter/index.js","../../src/template.js","../../src/i18n.js","../../src/player.js","../../src/mse.js","../../src/controls/index.js","../../src/contextmenu.js","../../src/danmu.js","../../src/info.js","../../src/subtitle.js","../../src/events.js","../../src/hotkey.js","../../src/layers.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","../../src/icons/index.js","../../src/loading.js","../../src/notice.js","../../src/mask.js","../../src/index.js"],"sourcesContent":["function _classCallCheck(instance, Constructor) {\n  if (!(instance instanceof Constructor)) {\n    throw new TypeError(\"Cannot call a class as a function\");\n  }\n}\n\nmodule.exports = _classCallCheck;","function _defineProperties(target, props) {\n  for (var i = 0; i < props.length; i++) {\n    var descriptor = props[i];\n    descriptor.enumerable = descriptor.enumerable || false;\n    descriptor.configurable = true;\n    if (\"value\" in descriptor) descriptor.writable = true;\n    Object.defineProperty(target, descriptor.key, descriptor);\n  }\n}\n\nfunction _createClass(Constructor, protoProps, staticProps) {\n  if (protoProps) _defineProperties(Constructor.prototype, protoProps);\n  if (staticProps) _defineProperties(Constructor, staticProps);\n  return Constructor;\n}\n\nmodule.exports = _createClass;","function _typeof2(obj) { if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof2 = function _typeof2(obj) { return typeof obj; }; } else { _typeof2 = function _typeof2(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof2(obj); }\n\nfunction _typeof(obj) {\n  if (typeof Symbol === \"function\" && _typeof2(Symbol.iterator) === \"symbol\") {\n    module.exports = _typeof = function _typeof(obj) {\n      return _typeof2(obj);\n    };\n  } else {\n    module.exports = _typeof = function _typeof(obj) {\n      return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : _typeof2(obj);\n    };\n  }\n\n  return _typeof(obj);\n}\n\nmodule.exports = _typeof;","function _assertThisInitialized(self) {\n  if (self === void 0) {\n    throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n  }\n\n  return self;\n}\n\nmodule.exports = _assertThisInitialized;","var _typeof = require(\"../helpers/typeof\");\n\nvar assertThisInitialized = require(\"./assertThisInitialized\");\n\nfunction _possibleConstructorReturn(self, call) {\n  if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) {\n    return call;\n  }\n\n  return assertThisInitialized(self);\n}\n\nmodule.exports = _possibleConstructorReturn;","function _getPrototypeOf(o) {\n  module.exports = _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {\n    return o.__proto__ || Object.getPrototypeOf(o);\n  };\n  return _getPrototypeOf(o);\n}\n\nmodule.exports = _getPrototypeOf;","function _setPrototypeOf(o, p) {\n  module.exports = _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {\n    o.__proto__ = p;\n    return o;\n  };\n\n  return _setPrototypeOf(o, p);\n}\n\nmodule.exports = _setPrototypeOf;","var setPrototypeOf = require(\"./setPrototypeOf\");\n\nfunction _inherits(subClass, superClass) {\n  if (typeof superClass !== \"function\" && superClass !== null) {\n    throw new TypeError(\"Super expression must either be null or a function\");\n  }\n\n  subClass.prototype = Object.create(superClass && superClass.prototype, {\n    constructor: {\n      value: subClass,\n      writable: true,\n      configurable: true\n    }\n  });\n  if (superClass) setPrototypeOf(subClass, superClass);\n}\n\nmodule.exports = _inherits;","function _isNativeFunction(Line truncated

src/hotkey.js

@@ -33,12 +33,12 @@ export default class Hotkey {
           switch (event.keyCode) {
             case 39:
               event.preventDefault();
-              player.seek(player.currentTime + 10);
+              player.seek(player.currentTime() + 10);
               notice.show(i18n.get('Fast forward 10 seconds'), true);
               break;
             case 37:
               event.preventDefault();
-              player.seek(player.currentTime - 10);
+              player.seek(player.currentTime() - 10);
               notice.show(i18n.get('Rewind 10 seconds'), true);
               break;
             case 38:

src/layers.js

@@ -8,10 +8,10 @@ export default class Layers {
   }
 
   init() {
-    const { refs, events: { proxy } } = this.art;
+    const { refs, player, events: { proxy } } = this.art;
     proxy(refs.$layers, 'click', event => {
       if (event.path[0] === refs.$layers) {
-        refs.$video.pause();
+        player.pause();
       }
     });
   }

src/loading.js

@@ -3,7 +3,6 @@ import Icons from './icons';
 export default class Loading {
   constructor(art) {
     this.art = art;
-    this.state = false;
     this.init();
   }
 
@@ -17,12 +16,10 @@ export default class Loading {
   }
 
   hide() {
-    this.state = false;
     this.art.refs.$loading.style.display = 'none';
   }
 
   show() {
-    this.state = true;
     this.art.refs.$loading.style.display = 'flex';
   }
 }

src/mask.js

@@ -8,6 +8,7 @@ export default class Mask {
 
   init() {
     const {
+      player,
       option,
       refs,
       events: { proxy }
@@ -17,7 +18,7 @@ export default class Mask {
     refs.$mask.appendChild(Icons.play);
 
     proxy(refs.$mask, 'click', () => {
-      refs.$video.play();
+      player.play();
       this.hide();
     });
   }

src/player.js

@@ -6,6 +6,7 @@ export default class Player {
     this.art = art;
     this.init();
     this.eventBind();
+    this.playing = false;
   }
 
   init() {
@@ -39,7 +40,7 @@ export default class Player {
       this.art.controls.show();
       this.art.mask.show();
       if (this.art.option.autoplay) {
-        const promise = $video.play();
+        const promise = this.play();
         if (promise !== undefined) {
           promise.then().catch(err => {
             console.warn(err);
@@ -49,31 +50,38 @@ export default class Player {
     });
 
     this.art.on('video:playing', () => {
+      this.playing = true;
       this.art.controls.hide();
       this.art.mask.hide();
     });
 
     this.art.on('video:pause', () => {
+      this.playing = false;
       this.art.controls.show();
       this.art.mask.show();
     });
 
     this.art.on('video:ended', () => {
+      this.playing = false;
       this.art.controls.show();
       this.art.mask.show();
     });
   }
 
   play() {
-    //
+    return this.art.refs.$video.play();
   }
 
   pause() {
-    //
+    return this.art.refs.$video.pause();
   }
 
   toggle() {
-    //
+    if (this.playing) {
+      this.pause();
+    } else {
+      this.play();
+    }
   }
 
   seek() {