update

docs/index.html

@@ -26,7 +26,8 @@
     <script src="./js/artplayer.js"></script>
     <script>
         var player = new Artplayer({
-            container: '.artplayer-app',
+            container: '',
+            // container: '.artplayer-app',
             url: './video/one-more-time-one-more-chance.mp4',
             poster: './img/one-more-time-one-more-chance.jpg',
             subtitle: {

docs/js/artplayer.js

@@ -350,6 +350,10 @@
 
 	      returnValue = toConsumableArray(returnValue).concat(toConsumableArray(source));
 	    } else if (isObject(source)) {
+	      if (source instanceof Element) {
+	        return source;
+	      }
+
 	      for (var key in source) {
 	        if (source.hasOwnProperty(key)) {
 	          var value = source[key];
@@ -391,10 +395,32 @@
 	  });
 	}
 
+	var validElement = function validElement(key, value, type, path) {
+	  var handle = false;
+	  var msg = "".concat(path.join('.'), ".").concat(key, " require 'string' or 'Element' type, but got '").concat(type, "'");
+
+	  if (type === 'string') {
+	    if (type.trim() === '') {
+	      handle = false;
+	      msg = "".concat(path.join('.'), ".").concat(key, " can not be empty'");
+	    } else {
+	      handle = true;
+	    }
+	  }
+
+	  if (value instanceof Element) {
+	    handle = true;
+	  }
+
+	  return {
+	    handle: handle,
+	    msg: msg
+	  };
+	};
+
 	var scheme = {
 	  container: {
-	    type: 'string',
-	    required: true
+	    validator: validElement
 	  },
 	  url: {
 	    type: 'string',
@@ -448,7 +474,7 @@
 	        type: 'number'
 	      },
 	      html: {
-	        type: 'string'
+	        validator: validElement
 	      },
 	      style: {
 	        type: 'object'
@@ -462,7 +488,7 @@
 	        type: 'string'
 	      },
 	      html: {
-	        type: 'string'
+	        validator: validElement
 	      },
 	      click: {
 	        type: 'function'
@@ -528,28 +554,37 @@
 	  var param = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : scheme;
 	  var path = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : ['option'];
 	  Object.keys(option).some(function (key) {
-	    if (!param[key]) {
+	    var paramObj = param[key];
+
+	    if (!paramObj) {
 	      return true;
 	    }
 
 	    var value = option[key];
 	    var type = getType(value);
-	    var requiredType = param[key].type;
-	    var isRequired = param[key].required;
-	    var requiredChild = param[key].child;
+	    var paramType = paramObj.type;
+	    var paramRequired = paramObj.required;
+	    var paramChild = paramObj.child;
+	    var paramValidator = paramObj.validator;
 
-	    if (type === 'object' && requiredChild) {
-	      validOption(value, requiredChild, path.concat(key));
+	    if (type === 'object' && paramChild) {
+	      validOption(value, paramChild, path.concat(key));
 	    }
 
-	    if (type === 'array' && requiredChild) {
+	    if (type === 'array' && paramChild) {
 	      value.forEach(function (item, index) {
-	        validOption(item, requiredChild, path.concat("".concat(key, "[").concat(index, "]")));
+	        validOption(item, paramChild, path.concat("".concat(key, "[").concat(index, "]")));
 	      });
 	    }
 
-	    errorHandle(!isRequired || value, "'".concat(path.join('.'), ".").concat(key, "' is required"));
-	    errorHandle(requiredType === type, "'".concat(path.join('.'), ".").concat(key, "' require '").concat(requiredType, "' type, but got '").concat(type, "'"));
+	    if (paramValidator) {
+	      var result = paramValidator(key, value, type, path);
+	      errorHandle(result.handle, result.msg);
+	    } else {
+	      errorHandle(!paramRequired || value, "'".concat(path.join('.'), ".").concat(key, "' is required"));
+	      errorHandle(paramType === type, "'".concat(path.join('.'), ".").concat(key, "' require '").concat(paramType, "' type, but got '").concat(type, "'"));
+	    }
+
 	    return false;
 	  });
 	}

docs/js/artplayer.js.map

@@ -1 +1 @@
-{"version":3,"file":"artplayer.js","sources":["../../node_modules/@babel/runtime/helpers/setPrototypeOf.js","../../node_modules/@babel/runtime/helpers/construct.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/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/inherits.js","../../node_modules/@babel/runtime/helpers/defineProperty.js","../../node_modules/@babel/runtime/helpers/objectSpread.js","../../node_modules/@babel/runtime/helpers/isNativeFunction.js","../../node_modules/@babel/runtime/helpers/wrapNativeSuper.js","../../src/utils/index.js","../../src/verification/scheme.js","../../src/verification/index.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/controls/danmu.js","../../src/controls/fullscreen.js","../../src/controls/pip.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/controls/playAndPause.js","../../src/controls/progress.js","../../src/controls/subtitle.js","../../src/controls/time.js","../../src/controls/volume.js","../../src/controls/setting.js","../../src/controls/thumbnails.js","../../src/controls/screenshot.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","../../src/loading.js","../../src/notice.js","../../src/mask.js","../../src/index.js"],"sourcesContent":["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 isNativeReflectConstruct() {\n  if (typeof Reflect === \"undefined\" || !Reflect.construct) return false;\n  if (Reflect.construct.sham) return false;\n  if (typeof Proxy === \"function\") return true;\n\n  try {\n    Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));\n    return true;\n  } catch (e) {\n    return false;\n  }\n}\n\nfunction _construct(Parent, args, Class) {\n  if (isNativeReflectConstruct()) {\n    module.exports = _construct = Reflect.construct;\n  } else {\n    module.exports = _construct = function _construct(Parent, args, Class) {\n      var a = [null];\n      a.push.apply(a, args);\n      var Constructor = Function.bind.apply(Parent, a);\n      var instance = new Constructor();\n      if (Class) setPrototypeOf(instance, Class.prototype);\n      return instance;\n    };\n  }\n\n  return _construct.apply(null, arguments);\n}\n\nmodule.exports = _construct;","function _arrayWithoutHoles(arr) {\n  if (Array.isArray(arr)) {\n    for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) {\n      arr2[i] = arr[i];\n    }\n\n    return arr2;\n  }\n}\n\nmodule.exports = _arrayWithoutHoles;","function _iterableToArray(iter) {\n  if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === \"[object Arguments]\") return Array.from(iter);\n}\n\nmodule.exports = _iterableToArray;","function _nonIterableSpread() {\n  throw new TypeError(\"Invalid attempt to spread non-iterable instance\");\n}\n\nmodule.exports = _nonIterableSpread;","var arrayWithoutHoles = require(\"./arrayWithoutHoles\");\n\nvar iterableToArray = require(\"./iterableToArray\");\n\nvar nonIterableSpread = require(\"./nonIterableSpread\");\n\nfunction _toConsumableArray(arr) {\n  return arrayWithoutHoles(arr) || iterableToArray(arr) || nonIterableSpread();\n}\n\nmodule.exports = _toConsumableArray;","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) descriptorLine truncated
+{"version":3,"file":"artplayer.js","sources":["../../node_modules/@babel/runtime/helpers/setPrototypeOf.js","../../node_modules/@babel/runtime/helpers/construct.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/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/inherits.js","../../node_modules/@babel/runtime/helpers/defineProperty.js","../../node_modules/@babel/runtime/helpers/objectSpread.js","../../node_modules/@babel/runtime/helpers/isNativeFunction.js","../../node_modules/@babel/runtime/helpers/wrapNativeSuper.js","../../src/utils/index.js","../../src/verification/scheme.js","../../src/verification/index.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/controls/danmu.js","../../src/controls/fullscreen.js","../../src/controls/pip.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/controls/playAndPause.js","../../src/controls/progress.js","../../src/controls/subtitle.js","../../src/controls/time.js","../../src/controls/volume.js","../../src/controls/setting.js","../../src/controls/thumbnails.js","../../src/controls/screenshot.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","../../src/loading.js","../../src/notice.js","../../src/mask.js","../../src/index.js"],"sourcesContent":["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 isNativeReflectConstruct() {\n  if (typeof Reflect === \"undefined\" || !Reflect.construct) return false;\n  if (Reflect.construct.sham) return false;\n  if (typeof Proxy === \"function\") return true;\n\n  try {\n    Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));\n    return true;\n  } catch (e) {\n    return false;\n  }\n}\n\nfunction _construct(Parent, args, Class) {\n  if (isNativeReflectConstruct()) {\n    module.exports = _construct = Reflect.construct;\n  } else {\n    module.exports = _construct = function _construct(Parent, args, Class) {\n      var a = [null];\n      a.push.apply(a, args);\n      var Constructor = Function.bind.apply(Parent, a);\n      var instance = new Constructor();\n      if (Class) setPrototypeOf(instance, Class.prototype);\n      return instance;\n    };\n  }\n\n  return _construct.apply(null, arguments);\n}\n\nmodule.exports = _construct;","function _arrayWithoutHoles(arr) {\n  if (Array.isArray(arr)) {\n    for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) {\n      arr2[i] = arr[i];\n    }\n\n    return arr2;\n  }\n}\n\nmodule.exports = _arrayWithoutHoles;","function _iterableToArray(iter) {\n  if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === \"[object Arguments]\") return Array.from(iter);\n}\n\nmodule.exports = _iterableToArray;","function _nonIterableSpread() {\n  throw new TypeError(\"Invalid attempt to spread non-iterable instance\");\n}\n\nmodule.exports = _nonIterableSpread;","var arrayWithoutHoles = require(\"./arrayWithoutHoles\");\n\nvar iterableToArray = require(\"./iterableToArray\");\n\nvar nonIterableSpread = require(\"./nonIterableSpread\");\n\nfunction _toConsumableArray(arr) {\n  return arrayWithoutHoles(arr) || iterableToArray(arr) || nonIterableSpread();\n}\n\nmodule.exports = _toConsumableArray;","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) descriptorLine truncated

src/utils/index.js

@@ -69,6 +69,9 @@ export function deepMerge(...sources) {
       }
       returnValue = [...returnValue, ...source];
     } else if (isObject(source)) {
+      if (source instanceof Element) {
+        return source;
+      }
       for (const key in source) {
         if (source.hasOwnProperty(key)) {
           let value = source[key];

src/verification/index.js

@@ -3,28 +3,37 @@ import scheme from './scheme';
 
 export default function validOption(option, param = scheme, path = ['option']) {
   Object.keys(option).some(key => {
-    if (!param[key]) {
+    const paramObj = param[key];
+
+    if (!paramObj) {
       return true;
     }
 
     const value = option[key];
     const type = getType(value);
-    const requiredType = param[key].type;
-    const isRequired = param[key].required;
-    const requiredChild = param[key].child;
+    const paramType = paramObj.type;
+    const paramRequired = paramObj.required;
+    const paramChild = paramObj.child;
+    const paramValidator = paramObj.validator;
 
-    if (type === 'object' && requiredChild) {
-      validOption(value, requiredChild, path.concat(key));
+    if (type === 'object' && paramChild) {
+      validOption(value, paramChild, path.concat(key));
     }
 
-    if (type === 'array' && requiredChild) {
+    if (type === 'array' && paramChild) {
       value.forEach((item, index) => {
-        validOption(item, requiredChild, path.concat(`${key}[${index}]`));
+        validOption(item, paramChild, path.concat(`${key}[${index}]`));
       });
     }
 
-    errorHandle(!isRequired || value, `'${path.join('.')}.${key}' is required`);
-    errorHandle(requiredType === type, `'${path.join('.')}.${key}' require '${requiredType}' type, but got '${type}'`);
+    if (paramValidator) {
+      const result = paramValidator(key, value, type, path);
+      errorHandle(result.handle, result.msg);
+    } else {
+      errorHandle(!paramRequired || value, `'${path.join('.')}.${key}' is required`);
+      errorHandle(paramType === type, `'${path.join('.')}.${key}' require '${paramType}' type, but got '${type}'`);
+    }
+
     return false;
   });
 }

src/verification/scheme.js

@@ -1,7 +1,29 @@
+const validElement = (key, value, type, path) => {
+  let handle = false;
+  let msg = `${path.join('.')}.${key} require 'string' or 'Element' type, but got '${type}'`;
+
+  if (type === 'string') {
+    if (type.trim() === '') {
+      handle = false;
+      msg = `${path.join('.')}.${key} can not be empty'`;
+    } else {
+      handle = true;
+    }
+  }
+
+  if (value instanceof Element) {
+    handle = true;
+  }
+
+  return {
+    handle: handle,
+    msg: msg
+  };
+};
+
 export default {
   container: {
-    type: 'string',
-    required: true
+    validator: validElement
   },
   url: {
     type: 'string',
@@ -55,7 +77,7 @@ export default {
         type: 'number'
       },
       html: {
-        type: 'string'
+        validator: validElement
       },
       style: {
         type: 'object'
@@ -69,7 +91,7 @@ export default {
         type: 'string'
       },
       html: {
-        type: 'string'
+        validator: validElement
       },
       click: {
         type: 'function'