diff --git a/.editorconfig b/.editorconfig index 1754d11f3..b395779b9 100644 --- a/.editorconfig +++ b/.editorconfig @@ -1,14 +1,10 @@ -# http://editorconfig.org/ +# See editorconfig.org root = true [*] charset = utf-8 end_of_line = lf -indent_size = 2 +indent_size = 4 indent_style = space insert_final_newline = true -trim_trailing_whitespace = true - -[{**/{actual,fixtures,expected,templates}/**,*.md}] -trim_trailing_whitespace = false -insert_final_newline = false \ No newline at end of file +trim_trailing_whitespace = true \ No newline at end of file diff --git a/.eslintrc b/.eslintrc index cc575c10f..b7be0cbc3 100644 --- a/.eslintrc +++ b/.eslintrc @@ -1,216 +1,35 @@ { - "root": true, - "parserOptions": { - "ecmaVersion": 2018, - "sourceType": "module", - "ecmaFeatures": { - "jsx": true, - "globalReturn": true, - "impliedStrict": true - } - }, + "parser": "babel-eslint", + "extends": ["airbnb-base", "prettier"], "env": { - "es6": true, - "amd": true, - "node": true, - "mocha": true, - "worker": true, - "jquery": true, - "browser": true, - "commonjs": true, - "serviceworker": true, - "shared-node-browser": true + "browser": true, + "es6": true + }, + "globals": { + "Artplayer": false, + "jQuery": false }, "rules": { - "no-await-in-loop": 2, - "no-compare-neg-zero": 2, - "no-cond-assign": 2, - "no-console": 0, - "no-constant-condition": [2, { "checkLoops": false }], - "no-debugger": 2, - "no-dupe-args": 2, - "no-dupe-keys": 2, - "no-duplicate-case": 2, - "no-empty": 1, - "no-empty-character-class": 2, - "no-ex-assign": 2, - "no-extra-boolean-cast": 2, - "no-extra-parens": 2, - "no-extra-semi": 2, - "no-func-assign": 2, - "no-inner-declarations": 2, - "no-invalid-regexp": 2, - "no-irregular-whitespace": 2, - "no-obj-calls": 2, - "no-regex-spaces": 1, - "no-sparse-arrays": 2, - "no-template-curly-in-string": 2, - "no-unexpected-multiline": 2, - "no-unreachable": 2, - "no-unsafe-finally": 2, - "no-unsafe-negation": 2, - "use-isnan": 2, - "valid-jsdoc": [2, { "requireReturn": false }], - "valid-typeof": 2, - - "accessor-pairs": 1, - "array-callback-return": 1, - "block-scoped-var": 1, - "class-methods-use-this": 0, - "curly": 1, - "default-case": 1, - "dot-location": [1, "property"], - "eqeqeq": [1, "smart"], - "guard-for-in": 1, - "no-alert": 2, - "no-caller": 1, - "no-div-regex": 1, - "no-else-return": 1, - "no-empty-function": 1, - "no-empty-pattern": 1, - "no-eq-null": 1, - "no-eval": 0, - "no-extend-native": 2, - "no-extra-bind": 1, - "no-extra-label": 1, - "no-fallthrough": 1, - "no-floating-decimal": 1, - "no-global-assign": 2, - "no-implicit-coercion": 1, - "no-implied-eval": 2, - "no-invalid-this": 1, - "no-iterator": 2, - "no-labels": 1, - "no-lone-blocks": 1, - "no-loop-func": 2, - "no-multi-spaces": 1, - "no-multi-str": 1, - "no-new-func": 0, - "no-new-wrappers": 1, - "no-octal": 1, - "no-octal-escape": 1, - "no-param-reassign": 1, - "no-proto": 1, - "no-redeclare": 1, - "no-return-assign": 1, - "no-return-await": 1, - "no-script-url": 2, - "no-self-assign": 1, - "no-self-compare": 1, - "no-sequences": 1, - "no-throw-literal": 1, - "no-unmodified-loop-condition": 1, - "no-unused-expressions": 0, - "no-unused-labels": 1, - "no-useless-call": 1, - "no-useless-concat": 1, - "no-useless-escape": 1, - "no-useless-return": 1, - "no-void": 1, - "no-with": 2, - "prefer-promise-reject-errors": 1, - "require-await": 2, - "vars-on-top": 1, - "wrap-iife": [1, "any"], - "yoda": 2, - - "strict": 2, - - "no-catch-shadow": 2, - "no-delete-var": 2, - "no-label-var": 2, - "no-shadow": 2, - "no-shadow-restricted-names": 2, - "no-undef": 2, - "no-undef-init": 2, - "no-undefined": 0, - "no-unused-vars": 2, - "no-use-before-define": 2, - - "callback-return": 0, - "global-require": 1, - "handle-callback-err": 1, - "no-mixed-requires": [1, { "allowCall": true }], - "no-new-require": 2, - "no-path-concat": 2, - "no-process-env": 0, - "no-process-exit": 2, - - "array-bracket-spacing": 1, - "block-spacing": 1, - "brace-style": 1, - "camelcase": 1, - "capitalized-comments": 0, - "comma-dangle": 1, - "comma-spacing": 1, - "comma-style": 1, - "computed-property-spacing": 1, - "consistent-this": [1, "that", "self"], - "eol-last": 1, - "func-call-spacing": 1, - "func-names": 1, - "indent": [1, 2, { "SwitchCase": 1 }], - "key-spacing": 1, - "keyword-spacing": 1, - "linebreak-style": 1, - "lines-around-comment": 1, - "new-cap": 0, - "new-parens": 1, - "no-array-constructor": 1, - "no-continue": 1, - "no-inline-comments": 1, - "no-mixed-spaces-and-tabs": 2, - "no-multi-assign": 1, - "no-multiple-empty-lines": 1, - "no-negated-condition": 0, - "no-nested-ternary": 2, - "no-new-object": 1, - "no-tabs": 2, - "no-trailing-spaces": 1, - "no-unneeded-ternary": 1, - "no-whitespace-before-property": 1, - "object-curly-spacing": 0, - "object-property-newline": [1, { "allowMultiplePropertiesPerLine": true }], - "one-var": [1, "never"], - "operator-assignment": 1, - "operator-linebreak": 1, - "padded-blocks": 0, - "quotes": [1, "single"], - "require-jsdoc": 0, - "semi": 1, - "semi-spacing": 1, - "space-before-blocks": 1, - "space-before-function-paren": [1, "never"], - "space-in-parens": 1, - "space-infix-ops": 1, - "space-unary-ops": [1, { "words": true, "nonwords": false }], - "spaced-comment": [1, "always"], - "wrap-regex": 1, - - "arrow-body-style": 1, - "arrow-parens": 0, - "arrow-spacing": 1, - "constructor-super": 2, - "generator-star-spacing": 1, - "no-class-assign": 2, - "no-confusing-arrow": 0, - "no-const-assign": 2, - "no-dupe-class-members": 2, - "no-duplicate-imports": 2, - "no-new-symbol": 1, - "no-this-before-super": 2, - "no-useless-computed-key": 1, - "no-useless-constructor": 1, - "no-useless-rename": 1, - "no-var": 1, - "prefer-const": 1, - "prefer-destructuring": 1, - "prefer-spread": 0, - "prefer-template": 1, - "require-yield": 2, - "rest-spread-spacing": 1, - "symbol-description": 2, - "template-curly-spacing": 1, - "yield-star-spacing": 1 + "import/no-cycle": 1, + "no-const-assign": 1, + "no-shadow": 0, + "no-this-before-super": 1, + "no-undef": 1, + "no-unreachable": 1, + "no-unused-vars": 1, + "constructor-super": 1, + "valid-typeof": 1, + "indent": [2, 4, { "SwitchCase": 1 }], + "quotes": [2, "single", "avoid-escape"], + "semi": [2, "always"], + "eqeqeq": [2, "always"], + "one-var": [2, "never"], + "comma-dangle": [2, "always-multiline"], + "spaced-comment": [2, "always"], + "no-restricted-globals": 2, + "no-param-reassign": [2, { "props": false }] + }, + "parserOptions": { + "sourceType": "module" } -} +} \ No newline at end of file diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 000000000..179595d48 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,7 @@ +{ + "useTabs": false, + "tabWidth": 4, + "singleQuote": true, + "trailingComma": "all", + "printWidth": 120 +} \ No newline at end of file diff --git a/.travis.yml b/.travis.yml index 833d09d14..6a14c3fdc 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,3 +1,10 @@ language: node_js + node_js: - stable + +before_script: + - npm install + +script: + - npm run lint \ No newline at end of file diff --git a/changelog.md b/changelog.md new file mode 100644 index 000000000..e69de29bb diff --git a/package.json b/package.json index 814e99d1c..beb76f7a0 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,10 @@ "description": "ArtPlayer is a modern HTML5 video player", "scripts": { "bootstrap": "lerna bootstrap", - "publish": "lerna publish" + "publish": "lerna publish", + "build": "lerna run build", + "test": "lerna run test", + "lint": "eslint packages/*/src" }, "repository": { "type": "git", @@ -21,6 +24,11 @@ }, "homepage": "https://github.com/zhw2590582/ArtPlayer#readme", "devDependencies": { + "babel-eslint": "^10.0.1", + "eslint": "^5.9.0", + "eslint-config-airbnb-base": "^13.1.0", + "eslint-config-prettier": "^3.3.0", + "eslint-plugin-import": "^2.14.0", "lerna": "^3.4.3" } } diff --git a/packages/artplayer-plugin-danmu/dist/artplayer-plugin-danmu.css b/packages/artplayer-plugin-danmu/dist/artplayer-plugin-danmu.css new file mode 100644 index 000000000..21f9dd122 --- /dev/null +++ b/packages/artplayer-plugin-danmu/dist/artplayer-plugin-danmu.css @@ -0,0 +1 @@ +.artplayerPluginDanmu{display:flex} \ No newline at end of file diff --git a/packages/artplayer-plugin-danmu/dist/artplayer-plugin-danmu.js b/packages/artplayer-plugin-danmu/dist/artplayer-plugin-danmu.js new file mode 100644 index 000000000..afaec7112 --- /dev/null +++ b/packages/artplayer-plugin-danmu/dist/artplayer-plugin-danmu.js @@ -0,0 +1,8 @@ +/*! + * artplayer-plugin-danmu.js v1.0.2 + * Github: https://github.com/zhw2590582/ArtPlayer#readme + * (c) 2017-2018 Harvey Zack + * Released under the MIT License. + */ + +!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports):"function"==typeof define&&define.amd?define(["exports"],n):n(e["artplayer-plugin-danmu"]={})}(this,function(e){"use strict";var n=function(e,n){if(!(e instanceof n))throw new TypeError("Cannot call a class as a function")},t=function e(){n(this,e),console.log(this)};window.ArtplayerPluginDanmu=t,e.default=t,Object.defineProperty(e,"__esModule",{value:!0})}); diff --git a/packages/artplayer-plugin-danmu/src/index.js b/packages/artplayer-plugin-danmu/src/index.js index a99f4b572..48cd9f700 100644 --- a/packages/artplayer-plugin-danmu/src/index.js +++ b/packages/artplayer-plugin-danmu/src/index.js @@ -1,9 +1,9 @@ import './style/index.scss'; class ArtplayerPluginDanmu { - constructor() { - console.log(this); - } + constructor() { + console.log(this); + } } window.ArtplayerPluginDanmu = ArtplayerPluginDanmu; diff --git a/packages/artplayer/dist/artplayer.css b/packages/artplayer/dist/artplayer.css index 674453d84..fb0ee20b7 100644 --- a/packages/artplayer/dist/artplayer.css +++ b/packages/artplayer/dist/artplayer.css @@ -1,15 +1,15 @@ +.artplayer-video-player{position:relative;width:100%;height:100%;overflow:hidden;outline:0;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 *{box-sizing:border-box}.artplayer-video-player .art-icon{display:inline-block;line-height:1.5}.artplayer-video-player .art-icon svg{fill:#fff} .artplayer-video-player .artplayer-subtitle{position:absolute;z-index:20;bottom:40px;width:100%;padding:0 20px;text-align:center;color:#fff;text-shadow:.5px .5px .5px rgba(0,0,0,.5);font-size:20px;pointer-events:none}.artplayer-video-player .artplayer-subtitle p{margin:5px 0} .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;outline:0;cursor:pointer} -.artplayer-video-player{position:relative;width:100%;height:100%;overflow:hidden;outline:0;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 *{box-sizing:border-box}.artplayer-video-player .art-icon{display:inline-block;line-height:1.5}.artplayer-video-player .art-icon svg{fill:#fff} .artplayer-video-player .artplayer-layers{position:absolute;z-index:30;left:0;top:0;right:0;bottom:0;width:100%;height:100%;pointer-events:none}.artplayer-video-player .artplayer-layers .art-layer{pointer-events:all} .artplayer-video-player .artplayer-mask{display:none;position:absolute;z-index:40;left:0;top:0;right:0;bottom:0;width:100%;height:100%;pointer-events:none}.artplayer-video-player .artplayer-mask .art-icon-playBig{position:absolute;right:30px;bottom:65px;opacity:.6} .artplayer-video-player .artplayer-loading{display:none;position:absolute;z-index:60;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-bottom{position:absolute;z-index:50;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:all}.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}.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:all;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;line-height:36px;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 .artplayer-bottom .artplayer-controls .art-control-volume .art-volume-panel.art-volume-panel-hover{width:60px}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-time{padding:0 10px}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-quality{position:relative;z-index:30;padding:0 10px}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-quality .art-qualitys{display:none;position:absolute;left:-15px;bottom:35px;width:100px;padding:5px 0;text-align:center;color:#fff;background:rgba(0,0,0,.7);border-radius:3px}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-quality .art-qualitys .art-quality-item{height:30px;line-height:30px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 0 2px rgba(0,0,0,.5)}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-quality .art-qualitys .art-quality-item:hover{background-color:hsla(0,0%,100%,.1)}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-quality.art-quality-hover .art-qualitys{display:block}.artplayer-video-player.artplayer-controls-show .artplayer-bottom,.artplayer-video-player.artplayer-hover .artplayer-bottom{opacity:1;visibility:visible}.artplayer-video-player.artplayer-destroy .art-progress-indicator,.artplayer-video-player.artplayer-destroy .art-progress-tip,.artplayer-video-player.artplayer-error .art-progress-indicator,.artplayer-video-player.artplayer-error .art-progress-tip{display:none!important} .artplayer-video-player .artplayer-notice{display:none;font-size:14px;position:absolute;z-index:70;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-bottom{position:absolute;z-index:50;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:all}.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}.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:all;display:flex;align-items:center;justify-content:space-between;height:36px}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control{opacity:.9;float:left;font-size:12px;height:36px;line-height:36px;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 .artplayer-bottom .artplayer-controls .art-control-volume .art-volume-panel.art-volume-panel-hover{width:60px}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-time{padding:0 10px}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-quality{position:relative;z-index:30;padding:0 10px}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-quality .art-qualitys{display:none;position:absolute;left:-15px;bottom:35px;width:100px;padding:5px 0;text-align:center;color:#fff;background:rgba(0,0,0,.7);border-radius:3px}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-quality .art-qualitys .art-quality-item{height:30px;line-height:30px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 0 2px rgba(0,0,0,.5)}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-quality .art-qualitys .art-quality-item:hover{background-color:hsla(0,0%,100%,.1)}.artplayer-video-player .artplayer-bottom .artplayer-controls .art-control-quality.art-quality-hover .art-qualitys{display:block}.artplayer-video-player.artplayer-controls-show .artplayer-bottom,.artplayer-video-player.artplayer-hover .artplayer-bottom{opacity:1;visibility:visible}.artplayer-video-player.artplayer-destroy .art-progress-indicator,.artplayer-video-player.artplayer-destroy .art-progress-tip,.artplayer-video-player.artplayer-error .art-progress-indicator,.artplayer-video-player.artplayer-error .art-progress-tip{display:none!important} .artplayer-video-player .artplayer-contextmenu{display:none;position:absolute;z-index:110;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-setting{display:none;position:absolute;z-index:80;left:0;top:0;height:100%;width:100%;align-items:center;justify-content:center;pointer-events:none}.artplayer-video-player .artplayer-setting .artplayer-setting-inner{position:relative;width:300px;height:250px;font-size:12px;background:rgba(0,0,0,.8);border-radius:3px;pointer-events:all;overflow:hidden}.artplayer-video-player .artplayer-setting .artplayer-setting-inner .artplayer-setting-body{overflow-x:hidden;overflow-y:auto;width:315px;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:12px 35px 12px 20px}.artplayer-video-player .artplayer-setting .artplayer-setting-inner .artplayer-setting-body .art-setting .art-setting-header{color:#fff;margin-bottom:10px}.artplayer-video-player .artplayer-setting .artplayer-setting-inner .artplayer-setting-body .art-setting .art-setting-body{color:hsla(0,0%,100%,.8)}.artplayer-video-player .artplayer-setting .artplayer-setting-inner .artplayer-setting-close{position:absolute;top:0;right:0;width:20px;height:20px;line-height:20px;text-align:center;color:hsla(0,0%,100%,.8);background:rgba(0,0,0,.5);font-size:20px;cursor:pointer}.artplayer-video-player .artplayer-setting .art-setting-btns{display:flex}.artplayer-video-player .artplayer-setting .art-setting-btns .art-setting-btn{flex:1;padding:0 4px;margin-left:-4px}.artplayer-video-player .artplayer-setting .art-setting-btns .art-setting-btn span{display:block;height:20px;line-height:20px;text-align:center;color:#fff;background:hsla(0,0%,100%,.3);border-radius:2px;cursor:pointer}.artplayer-video-player .artplayer-setting .art-setting-btns .art-setting-btn.current span,.artplayer-video-player .artplayer-setting .art-setting-btns .art-setting-btn:hover span{color:#fff;background:#00a1d6} .artplayer-video-player.artplayer-hide-cursor *{cursor:none!important} .artplayer-video-player .artplayer-info{display:none;position:absolute;left:10px;top:10px;z-index:90;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;padding-left:5px}.artplayer-video-player .artplayer-info .artplayer-info-close{position:absolute;top:5px;right:5px;cursor:pointer} +.artplayer-video-player .artplayer-setting{display:none;position:absolute;z-index:80;left:0;top:0;height:100%;width:100%;align-items:center;justify-content:center;pointer-events:none}.artplayer-video-player .artplayer-setting .artplayer-setting-inner{position:relative;width:300px;height:250px;font-size:12px;background:rgba(0,0,0,.8);border-radius:3px;pointer-events:all;overflow:hidden}.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:12px 20px}.artplayer-video-player .artplayer-setting .artplayer-setting-inner .artplayer-setting-body .art-setting .art-setting-header{color:#fff;margin-bottom:10px}.artplayer-video-player .artplayer-setting .artplayer-setting-inner .artplayer-setting-body .art-setting .art-setting-body{color:hsla(0,0%,100%,.8)}.artplayer-video-player .artplayer-setting .artplayer-setting-inner .artplayer-setting-close{position:absolute;top:0;right:0;width:20px;height:20px;line-height:20px;text-align:center;color:hsla(0,0%,100%,.8);background:rgba(0,0,0,.5);font-size:20px;cursor:pointer}.artplayer-video-player .artplayer-setting .art-setting-btns{display:flex;margin-left:-4px;margin-right:-4px}.artplayer-video-player .artplayer-setting .art-setting-btns .art-setting-btn{flex:1;padding:0 4px}.artplayer-video-player .artplayer-setting .art-setting-btns .art-setting-btn span{display:block;height:20px;line-height:20px;text-align:center;color:#fff;background:hsla(0,0%,100%,.3);border-radius:2px;cursor:pointer}.artplayer-video-player .artplayer-setting .art-setting-btns .art-setting-btn.current span,.artplayer-video-player .artplayer-setting .art-setting-btns .art-setting-btn:hover span{color:#fff;background:#00a1d6} .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:100;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;right:20px;bottom:20px;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{align-items:center;justify-content:center}.artplayer-video-player.artplayer-pip .artplayer-mask .art-icon-playBig{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} diff --git a/packages/artplayer/dist/artplayer.js b/packages/artplayer/dist/artplayer.js index b34cb6c70..5f4a986ae 100644 --- a/packages/artplayer/dist/artplayer.js +++ b/packages/artplayer/dist/artplayer.js @@ -5,4 +5,4 @@ * Released under the MIT License. */ -!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t.artplayer={})}(this,function(t){"use strict";var Ut=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")};function i(t,e){for(var n=0;n=Number(n)});return r?r.insertAdjacentElement("beforebegin",e):Qt(t,e),e}function Xt(t,e,n){return t.style[e]=n,t}function k(e,n){return Object.keys(n).forEach(function(t){Xt(e,t,n[t])}),e}function E(t,e){var n=!(2\n \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
×
\n
\n
\n
\n
\n
[x]
\n
\n
\n
\n
×
\n
\n
\n \n ',n.$player=n.$container.querySelector(".artplayer-video-player"),n.$video=n.$container.querySelector(".artplayer-video"),n.$subtitle=n.$container.querySelector(".artplayer-subtitle"),n.$bottom=n.$container.querySelector(".artplayer-bottom"),n.$progress=n.$container.querySelector(".artplayer-progress"),n.$controls=n.$container.querySelector(".artplayer-controls"),n.$controlsLeft=n.$container.querySelector(".artplayer-controls-left"),n.$controlsRight=n.$container.querySelector(".artplayer-controls-right"),n.$layers=n.$container.querySelector(".artplayer-layers"),n.$loading=n.$container.querySelector(".artplayer-loading"),n.$notice=n.$container.querySelector(".artplayer-notice"),n.$noticeInner=n.$container.querySelector(".artplayer-notice-inner"),n.$mask=n.$container.querySelector(".artplayer-mask"),n.$setting=n.$container.querySelector(".artplayer-setting"),n.$settingInner=n.$container.querySelector(".artplayer-setting-inner"),n.$settingBody=n.$container.querySelector(".artplayer-setting-body"),n.$settingClose=n.$container.querySelector(".artplayer-setting-close"),n.$info=n.$container.querySelector(".artplayer-info"),n.$infoPanel=n.$container.querySelector(".artplayer-info-panel"),n.$infoClose=n.$container.querySelector(".artplayer-info-close"),n.$pipHeader=n.$container.querySelector(".artplayer-pip-header"),n.$pipTitle=n.$container.querySelector(".artplayer-pip-title"),n.$pipClose=n.$container.querySelector(".artplayer-pip-close"),n.$contextmenu=n.$container.querySelector(".artplayer-contextmenu")},D={"zh-cn":{"About author":"关于作者","Video info":"视频统计信息",Close:"关闭","Video load failed":"视频加载失败",Volume:"音量",Play:"播放",Pause:"暂停",Rate:"速度",Mute:"静音",Flip:"视频翻转",Horizontal:"水平",Vertical:"垂直",Reconnect:"重新连接","Hide subtitle":"隐藏字幕","Show subtitle":"显示字幕","Hide danmu":"隐藏弹幕","Show danmu":"显示弹幕","Show setting":"显示设置","Hide setting":"隐藏设置",Screenshot:"截图","Play speed":"播放速度","Aspect ratio":"画面比例",Default:"默认",Normal:"正常","Switch video":"切换","Switch subtitle":"切换字幕",Fullscreen:"全屏","Exit fullscreen":"退出全屏","Web fullscreen":"网页全屏","Exit web fullscreen":"退出网页全屏","Mini player":"迷你播放器"},"zh-tw":{"About author":"關於作者","Video info":"影片統計訊息",Close:"關閉","Video load failed":"影片載入失敗",Volume:"音量",Play:"播放",Pause:"暫停",Rate:"速度",Mute:"靜音",Flip:"影片翻轉",Horizontal:"水平",Vertical:"垂直",Reconnect:"重新連接","Hide subtitle":"隱藏字幕","Show subtitle":"顯示字幕","Show setting":"顯示设置","Hide setting":"隱藏设置","Hide danmu":"隱藏彈幕","Show danmu":"顯示彈幕",Screenshot:"截圖","Play speed":"播放速度","Aspect ratio":"畫面比例",Default:"默認",Normal:"正常","Switch video":"切換","Switch subtitle":"切換字幕",Fullscreen:"全屏","Exit fullscreen":"退出全屏","Web fullscreen":"網頁全屏","Exit web fullscreen":"退出網頁全屏","Mini player":"迷你播放器"}},H=function(){function n(t){var e=t.option;Ut(this,n),this.option=e,this.init()}return r(n,[{key:"init",value:function(){this.language=D[this.option.lang.toLowerCase()]||{}}},{key:"get",value:function(t){return this.language[t]||t}},{key:"update",value:function(t){D=t(D),this.init()}}]),n}();function te(n,t){var i=n.option,r=n.notice,o=n.refs.$video;Object.defineProperty(t,"screenshot",{value:function(){var t=o.crossOrigin;try{o.crossOrigin="anonymous";var e=function(){var t=document.createElement("canvas");t.width=o.videoWidth,t.height=o.videoHeight,t.getContext("2d").drawImage(o,0,0);var e=t.toDataURL("image/png"),n=document.createElement("a");return Xt(n,"display","none"),n.href=e,n.download="".concat(i.title||"artplayer","_").concat(Zt(o.currentTime),".png"),document.body.appendChild(n),n.click(),document.body.removeChild(n),e}();n.emit("screenshot",e)}catch(t){r.show(t),console.warn(t)}finally{o.crossOrigin=t}}})}var ee=n(function(t){var o,e,n,i,r,a;o="undefined"!=typeof window&&void 0!==window.document?window.document:{},e=t.exports,n="undefined"!=typeof Element&&"ALLOW_KEYBOARD_INPUT"in Element,i=function(){for(var t,e=[["requestFullscreen","exitFullscreen","fullscreenElement","fullscreenEnabled","fullscreenchange","fullscreenerror"],["webkitRequestFullscreen","webkitExitFullscreen","webkitFullscreenElement","webkitFullscreenEnabled","webkitfullscreenchange","webkitfullscreenerror"],["webkitRequestFullScreen","webkitCancelFullScreen","webkitCurrentFullScreenElement","webkitCancelFullScreen","webkitfullscreenchange","webkitfullscreenerror"],["mozRequestFullScreen","mozCancelFullScreen","mozFullScreenElement","mozFullScreenEnabled","mozfullscreenchange","mozfullscreenerror"],["msRequestFullscreen","msExitFullscreen","msFullscreenElement","msFullscreenEnabled","MSFullscreenChange","MSFullscreenError"]],n=0,i=e.length,r={};n