From c4b4d4e7a826061522a52042ab014b277e2a35dc Mon Sep 17 00:00:00 2001 From: Harvey Date: Thu, 28 Apr 2022 10:00:21 +0800 Subject: [PATCH] update --- .gitignore | 2 + package.json | 4 +- packages/artplayer-document/package.json | 67 ++++++---- .../package.json.lerna_backup | 42 ------ packages/artplayer/src/index.js | 2 +- .../style/{artplayer.scss => artplayer.less} | 0 .../{aspectRatio.scss => aspectRatio.less} | 0 .../style/{autoSize.scss => autoSize.less} | 0 packages/artplayer/src/style/balloon.scss | 123 ------------------ .../src/style/{bottom.scss => bottom.less} | 0 .../{contextmenu.scss => contextmenu.less} | 0 .../src/style/{danmuku.scss => danmuku.less} | 0 .../src/style/{flip.scss => flip.less} | 0 ...creenRotate.scss => fullscreenRotate.less} | 0 ...{fullscreenWeb.scss => fullscreenWeb.less} | 0 .../{hideCursor.scss => hideCursor.less} | 0 packages/artplayer/src/style/index.less | 22 ++++ packages/artplayer/src/style/index.scss | 23 ---- .../src/style/{info.scss => info.less} | 0 .../src/style/{layers.scss => layers.less} | 0 .../src/style/{loading.scss => loading.less} | 0 .../src/style/{mask.scss => mask.less} | 0 .../src/style/{mini.scss => mini.less} | 0 .../src/style/{notice.scss => notice.less} | 0 .../src/style/{plugins.scss => plugins.less} | 0 .../src/style/{poster.scss => poster.less} | 0 .../style/{selector.scss => selector.less} | 0 .../src/style/{setting.scss => setting.less} | 0 .../style/{subtitle.scss => subtitle.less} | 0 .../src/style/{video.scss => video.less} | 0 scripts/dev.js | 76 ++++++----- scripts/getProjects.js | 15 --- scripts/logger.js | 20 +-- scripts/projects.js | 8 ++ 34 files changed, 123 insertions(+), 281 deletions(-) delete mode 100644 packages/artplayer-document/package.json.lerna_backup rename packages/artplayer/src/style/{artplayer.scss => artplayer.less} (100%) rename packages/artplayer/src/style/{aspectRatio.scss => aspectRatio.less} (100%) rename packages/artplayer/src/style/{autoSize.scss => autoSize.less} (100%) delete mode 100644 packages/artplayer/src/style/balloon.scss rename packages/artplayer/src/style/{bottom.scss => bottom.less} (100%) rename packages/artplayer/src/style/{contextmenu.scss => contextmenu.less} (100%) rename packages/artplayer/src/style/{danmuku.scss => danmuku.less} (100%) rename packages/artplayer/src/style/{flip.scss => flip.less} (100%) rename packages/artplayer/src/style/{fullscreenRotate.scss => fullscreenRotate.less} (100%) rename packages/artplayer/src/style/{fullscreenWeb.scss => fullscreenWeb.less} (100%) rename packages/artplayer/src/style/{hideCursor.scss => hideCursor.less} (100%) create mode 100644 packages/artplayer/src/style/index.less delete mode 100644 packages/artplayer/src/style/index.scss rename packages/artplayer/src/style/{info.scss => info.less} (100%) rename packages/artplayer/src/style/{layers.scss => layers.less} (100%) rename packages/artplayer/src/style/{loading.scss => loading.less} (100%) rename packages/artplayer/src/style/{mask.scss => mask.less} (100%) rename packages/artplayer/src/style/{mini.scss => mini.less} (100%) rename packages/artplayer/src/style/{notice.scss => notice.less} (100%) rename packages/artplayer/src/style/{plugins.scss => plugins.less} (100%) rename packages/artplayer/src/style/{poster.scss => poster.less} (100%) rename packages/artplayer/src/style/{selector.scss => selector.less} (100%) rename packages/artplayer/src/style/{setting.scss => setting.less} (100%) rename packages/artplayer/src/style/{subtitle.scss => subtitle.less} (100%) rename packages/artplayer/src/style/{video.scss => video.less} (100%) delete mode 100644 scripts/getProjects.js create mode 100644 scripts/projects.js diff --git a/.gitignore b/.gitignore index 7a6cc959d..deefc636c 100644 --- a/.gitignore +++ b/.gitignore @@ -1,6 +1,8 @@ node_modules .vscode .DS_Store +.parcel-cache +dist *.log commit.json package-lock.json diff --git a/package.json b/package.json index edba6c324..a71744167 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,7 @@ { "name": "artplayer-packages", "version": "4.3.0", + "type": "module", "description": "ArtPlayer.js is a modern and full featured HTML5 video player", "scripts": { "bootstrap": "npx lerna bootstrap", @@ -37,6 +38,7 @@ "lerna": "^4.0.0", "mocha": "^9.2.2", "mocha-chrome": "^2.2.0", + "servor": "^4.0.2", "workbox-build": "^6.5.3" } -} \ No newline at end of file +} diff --git a/packages/artplayer-document/package.json b/packages/artplayer-document/package.json index 1ad671687..a85a3285b 100644 --- a/packages/artplayer-document/package.json +++ b/packages/artplayer-document/package.json @@ -1,29 +1,42 @@ { - "name": "artplayer-document", - "version": "1.0.0", - "dependencies": { - "@docusaurus/core": "2.0.0-beta.15", - "@docusaurus/preset-classic": "2.0.0-beta.15", - "@mdx-js/react": "^1.6.22", - "@svgr/webpack": "^6.1.0", - "clsx": "^1.1.1", - "docusaurus-lunr-search": "^2.1.15", - "file-loader": "^6.2.0", - "prism-react-renderer": "^1.2.1", - "react": "^17.0.2", - "react-dom": "^17.0.2", - "url-loader": "^4.1.1" - }, - "browserslist": { - "production": [ - ">0.5%", - "not dead", - "not op_mini all" - ], - "development": [ - "last 1 chrome version", - "last 1 firefox version", - "last 1 safari version" - ] - } + "name": "artplayer-document", + "version": "1.0.0", + "scripts": { + "docusaurus": "docusaurus", + "start": "npx docusaurus start", + "build": "npx docusaurus build && npm run copy", + "copy": "rm -rf ../../docs/document && mv build ../../docs/document", + "commit": "git add . && git commit -m \"build document\" -n", + "swizzle": "npx docusaurus swizzle", + "deploy": "npx docusaurus deploy", + "clear": "npx docusaurus clear", + "serve": "npx docusaurus serve", + "write-translations": "npx docusaurus write-translations", + "write-heading-ids": "npx docusaurus write-heading-ids" + }, + "dependencies": { + "@docusaurus/core": "2.0.0-beta.15", + "@docusaurus/preset-classic": "2.0.0-beta.15", + "@mdx-js/react": "^1.6.22", + "@svgr/webpack": "^6.1.0", + "clsx": "^1.1.1", + "docusaurus-lunr-search": "^2.1.15", + "file-loader": "^6.2.0", + "prism-react-renderer": "^1.2.1", + "react": "^17.0.2", + "react-dom": "^17.0.2", + "url-loader": "^4.1.1" + }, + "browserslist": { + "production": [ + ">0.5%", + "not dead", + "not op_mini all" + ], + "development": [ + "last 1 chrome version", + "last 1 firefox version", + "last 1 safari version" + ] + } } diff --git a/packages/artplayer-document/package.json.lerna_backup b/packages/artplayer-document/package.json.lerna_backup deleted file mode 100644 index a85a3285b..000000000 --- a/packages/artplayer-document/package.json.lerna_backup +++ /dev/null @@ -1,42 +0,0 @@ -{ - "name": "artplayer-document", - "version": "1.0.0", - "scripts": { - "docusaurus": "docusaurus", - "start": "npx docusaurus start", - "build": "npx docusaurus build && npm run copy", - "copy": "rm -rf ../../docs/document && mv build ../../docs/document", - "commit": "git add . && git commit -m \"build document\" -n", - "swizzle": "npx docusaurus swizzle", - "deploy": "npx docusaurus deploy", - "clear": "npx docusaurus clear", - "serve": "npx docusaurus serve", - "write-translations": "npx docusaurus write-translations", - "write-heading-ids": "npx docusaurus write-heading-ids" - }, - "dependencies": { - "@docusaurus/core": "2.0.0-beta.15", - "@docusaurus/preset-classic": "2.0.0-beta.15", - "@mdx-js/react": "^1.6.22", - "@svgr/webpack": "^6.1.0", - "clsx": "^1.1.1", - "docusaurus-lunr-search": "^2.1.15", - "file-loader": "^6.2.0", - "prism-react-renderer": "^1.2.1", - "react": "^17.0.2", - "react-dom": "^17.0.2", - "url-loader": "^4.1.1" - }, - "browserslist": { - "production": [ - ">0.5%", - "not dead", - "not op_mini all" - ], - "development": [ - "last 1 chrome version", - "last 1 firefox version", - "last 1 safari version" - ] - } -} diff --git a/packages/artplayer/src/index.js b/packages/artplayer/src/index.js index 18b8fcd9f..cc9b0b413 100644 --- a/packages/artplayer/src/index.js +++ b/packages/artplayer/src/index.js @@ -1,4 +1,4 @@ -import './style/index.scss'; +import './style/index.less'; import validator from 'option-validator'; import Emitter from './utils/emitter'; import * as utils from './utils'; diff --git a/packages/artplayer/src/style/artplayer.scss b/packages/artplayer/src/style/artplayer.less similarity index 100% rename from packages/artplayer/src/style/artplayer.scss rename to packages/artplayer/src/style/artplayer.less diff --git a/packages/artplayer/src/style/aspectRatio.scss b/packages/artplayer/src/style/aspectRatio.less similarity index 100% rename from packages/artplayer/src/style/aspectRatio.scss rename to packages/artplayer/src/style/aspectRatio.less diff --git a/packages/artplayer/src/style/autoSize.scss b/packages/artplayer/src/style/autoSize.less similarity index 100% rename from packages/artplayer/src/style/autoSize.scss rename to packages/artplayer/src/style/autoSize.less diff --git a/packages/artplayer/src/style/balloon.scss b/packages/artplayer/src/style/balloon.scss deleted file mode 100644 index 983f336b1..000000000 --- a/packages/artplayer/src/style/balloon.scss +++ /dev/null @@ -1,123 +0,0 @@ -// https://github.com/kazzkiq/balloon.css -// 1.0.3 - -// -// Variables -// ----------------------------------------- - -$balloon-bg: fade-out(#101010, 0.05) !default; -$balloon-base-size: 12px !default; -$balloon-arrow-size: 5px !default; -$balloon-move: 4px !default; - -// -// Mixins -// ----------------------------------------- - -@mixin arrow-down() { - width: 0; - height: 0; - border: $balloon-arrow-size solid transparent; - border-top-color: var(--balloon-color); -} - -@mixin base-effects() { - opacity: 0; - pointer-events: none; - transition: all 0.18s ease-out 0.18s; -} - -@mixin normalized-text() { - text-indent: 0; - font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', - 'Helvetica Neue', sans-serif; - font-weight: normal; - font-style: normal; - text-shadow: none; - font-size: var(--balloon-font-size); -} - -// -// Styles -// ----------------------------------------- - -:root { - --balloon-color: #{$balloon-bg}; - --balloon-font-size: #{$balloon-base-size}; - --balloon-move: #{$balloon-move}; -} - -// IE 11 button bugfix -button[aria-label] { - &[data-balloon-pos] { - overflow: visible; - } -} - -[aria-label] { - &[data-balloon-pos] { - position: relative; // alt. absolute or fixed - - // Fixing iOS Safari event issue. - // More info at: https://goo.gl/w8JF4W - cursor: pointer; - - &:after { - @include base-effects(); - @include normalized-text(); - - background: var(--balloon-color); - border-radius: 2px; - color: #fff; - content: attr(aria-label); - padding: 0.5em 1em; - position: absolute; - white-space: nowrap; - line-height: 1.2; - z-index: 10; - } - - &:before { - @include arrow-down(); - @include base-effects(); - - content: ''; - position: absolute; - z-index: 10; - } - - &:hover { - &:before, - &:after { - opacity: 1; - pointer-events: none; - } - } - - &[data-balloon-pos='up'] { - &:after { - bottom: 100%; - left: 50%; - margin-bottom: $balloon-arrow-size + 5px; - transform: translate(-50%, var(--balloon-move)); - transform-origin: top; - } - &:before { - bottom: 100%; - left: 50%; - transform: translate(-50%, var(--balloon-move)); - transform-origin: top; - } - - &:hover { - &:after { - transform: translate(-50%, 0); - } - - &:before { - transform: translate(-50%, 0); - } - } - } - } -} diff --git a/packages/artplayer/src/style/bottom.scss b/packages/artplayer/src/style/bottom.less similarity index 100% rename from packages/artplayer/src/style/bottom.scss rename to packages/artplayer/src/style/bottom.less diff --git a/packages/artplayer/src/style/contextmenu.scss b/packages/artplayer/src/style/contextmenu.less similarity index 100% rename from packages/artplayer/src/style/contextmenu.scss rename to packages/artplayer/src/style/contextmenu.less diff --git a/packages/artplayer/src/style/danmuku.scss b/packages/artplayer/src/style/danmuku.less similarity index 100% rename from packages/artplayer/src/style/danmuku.scss rename to packages/artplayer/src/style/danmuku.less diff --git a/packages/artplayer/src/style/flip.scss b/packages/artplayer/src/style/flip.less similarity index 100% rename from packages/artplayer/src/style/flip.scss rename to packages/artplayer/src/style/flip.less diff --git a/packages/artplayer/src/style/fullscreenRotate.scss b/packages/artplayer/src/style/fullscreenRotate.less similarity index 100% rename from packages/artplayer/src/style/fullscreenRotate.scss rename to packages/artplayer/src/style/fullscreenRotate.less diff --git a/packages/artplayer/src/style/fullscreenWeb.scss b/packages/artplayer/src/style/fullscreenWeb.less similarity index 100% rename from packages/artplayer/src/style/fullscreenWeb.scss rename to packages/artplayer/src/style/fullscreenWeb.less diff --git a/packages/artplayer/src/style/hideCursor.scss b/packages/artplayer/src/style/hideCursor.less similarity index 100% rename from packages/artplayer/src/style/hideCursor.scss rename to packages/artplayer/src/style/hideCursor.less diff --git a/packages/artplayer/src/style/index.less b/packages/artplayer/src/style/index.less new file mode 100644 index 000000000..a1a9df831 --- /dev/null +++ b/packages/artplayer/src/style/index.less @@ -0,0 +1,22 @@ +@import './artplayer.less'; +@import './video.less'; +@import './poster.less'; +@import './subtitle.less'; +@import './danmuku.less'; +@import './layers.less'; +@import './mask.less'; +@import './loading.less'; +@import './bottom.less'; +@import './notice.less'; +@import './contextmenu.less'; +@import './setting.less'; +@import './info.less'; +@import './hideCursor.less'; +@import './aspectRatio.less'; +@import './fullscreenWeb.less'; +@import './fullscreenRotate.less'; +@import './mini.less'; +@import './autoSize.less'; +@import './flip.less'; +@import './plugins.less'; +@import './selector.less'; \ No newline at end of file diff --git a/packages/artplayer/src/style/index.scss b/packages/artplayer/src/style/index.scss deleted file mode 100644 index 9e41a9e84..000000000 --- a/packages/artplayer/src/style/index.scss +++ /dev/null @@ -1,23 +0,0 @@ -@import './artplayer.scss'; -@import './video.scss'; -@import './poster.scss'; -@import './subtitle.scss'; -@import './danmuku.scss'; -@import './layers.scss'; -@import './mask.scss'; -@import './loading.scss'; -@import './bottom.scss'; -@import './notice.scss'; -@import './contextmenu.scss'; -@import './setting.scss'; -@import './info.scss'; -@import './hideCursor.scss'; -@import './aspectRatio.scss'; -@import './fullscreenWeb.scss'; -@import './fullscreenRotate.scss'; -@import './mini.scss'; -@import './autoSize.scss'; -@import './flip.scss'; -@import './plugins.scss'; -@import './selector.scss'; -@import './balloon.scss'; diff --git a/packages/artplayer/src/style/info.scss b/packages/artplayer/src/style/info.less similarity index 100% rename from packages/artplayer/src/style/info.scss rename to packages/artplayer/src/style/info.less diff --git a/packages/artplayer/src/style/layers.scss b/packages/artplayer/src/style/layers.less similarity index 100% rename from packages/artplayer/src/style/layers.scss rename to packages/artplayer/src/style/layers.less diff --git a/packages/artplayer/src/style/loading.scss b/packages/artplayer/src/style/loading.less similarity index 100% rename from packages/artplayer/src/style/loading.scss rename to packages/artplayer/src/style/loading.less diff --git a/packages/artplayer/src/style/mask.scss b/packages/artplayer/src/style/mask.less similarity index 100% rename from packages/artplayer/src/style/mask.scss rename to packages/artplayer/src/style/mask.less diff --git a/packages/artplayer/src/style/mini.scss b/packages/artplayer/src/style/mini.less similarity index 100% rename from packages/artplayer/src/style/mini.scss rename to packages/artplayer/src/style/mini.less diff --git a/packages/artplayer/src/style/notice.scss b/packages/artplayer/src/style/notice.less similarity index 100% rename from packages/artplayer/src/style/notice.scss rename to packages/artplayer/src/style/notice.less diff --git a/packages/artplayer/src/style/plugins.scss b/packages/artplayer/src/style/plugins.less similarity index 100% rename from packages/artplayer/src/style/plugins.scss rename to packages/artplayer/src/style/plugins.less diff --git a/packages/artplayer/src/style/poster.scss b/packages/artplayer/src/style/poster.less similarity index 100% rename from packages/artplayer/src/style/poster.scss rename to packages/artplayer/src/style/poster.less diff --git a/packages/artplayer/src/style/selector.scss b/packages/artplayer/src/style/selector.less similarity index 100% rename from packages/artplayer/src/style/selector.scss rename to packages/artplayer/src/style/selector.less diff --git a/packages/artplayer/src/style/setting.scss b/packages/artplayer/src/style/setting.less similarity index 100% rename from packages/artplayer/src/style/setting.scss rename to packages/artplayer/src/style/setting.less diff --git a/packages/artplayer/src/style/subtitle.scss b/packages/artplayer/src/style/subtitle.less similarity index 100% rename from packages/artplayer/src/style/subtitle.scss rename to packages/artplayer/src/style/subtitle.less diff --git a/packages/artplayer/src/style/video.scss b/packages/artplayer/src/style/video.less similarity index 100% rename from packages/artplayer/src/style/video.scss rename to packages/artplayer/src/style/video.less diff --git a/scripts/dev.js b/scripts/dev.js index 1c8ceabbf..c1fe7f316 100644 --- a/scripts/dev.js +++ b/scripts/dev.js @@ -1,13 +1,11 @@ -const inquirer = require('inquirer'); -const rollup = require('rollup'); -const servor = require('servor'); -const logger = require('./logger'); -const projects = require('./getProjects')(); -const creatRollupConfig = require('./creatRollupConfig'); -const openBrowser = require('servor/utils/openBrowser'); +import inquirer from 'inquirer'; +import servor from 'servor'; +import projects from './projects.js'; +import openBrowser from 'servor/utils/openBrowser.js'; +import { Parcel } from '@parcel/core'; +import { fileURLToPath } from 'url'; -async function develop(projectPath) { - const config = creatRollupConfig(projectPath); +async function develop(name) { const { url } = await servor({ root: 'docs', fallback: 'index.html', @@ -15,30 +13,35 @@ async function develop(projectPath) { port: 8081, }); openBrowser(url); - const watcher = rollup.watch(config); - watcher.on('event', (event) => { - switch (event.code) { - case 'START': - logger.log('checking rollup version...'); - break; - case 'BUNDLE_START': - logger.log(`bundling ${config.output.file}...`); - break; - case 'BUNDLE_END': - logger.success(`${config.output.file} bundled in ${event.duration}ms.`); - logger.success('Watching for changes...'); - break; - case 'END': - logger.success('finished building all bundles'); - break; - case 'ERROR': - logger.warn(`error: ${event.error}`); - break; - case 'FATAL': - logger.warn(`fatal: ${event.error}`); - break; - default: - logger.warn(`unknown event: ${event.code}`); + + const dir = projects[name]; + const bundler = new Parcel({ + entries: `${dir}/src/index.js`, + defaultConfig: '@parcel/config-default', + mode: 'development', + defaultTargetOptions: { + engines: { + browsers: ['last 1 Chrome version'], + }, + }, + env: { + NODE_ENV: 'development', + }, + additionalReporters: [ + { + packageName: '@parcel/reporter-cli', + resolveFrom: fileURLToPath(import.meta.url), + }, + ], + }); + + bundler.watch(async (error, event) => { + if (error) throw error; + if (event.type === 'buildSuccess') { + const bundles = event.bundleGraph.getBundles(); + console.log(`[${name}]`, `✨ Built ${bundles.length} bundles in ${event.buildTime}ms!`); + } else if (event.type === 'buildFailure') { + console.log(`[${name}]`, event.diagnostics); } }); } @@ -53,10 +56,5 @@ inquirer }, ]) .then((answers) => { - develop(projects[answers.project]); - }) - .catch((err) => { - logger.fatal(err); + develop(answers.project); }); - -module.exports = develop; diff --git a/scripts/getProjects.js b/scripts/getProjects.js deleted file mode 100644 index a8b4d52ae..000000000 --- a/scripts/getProjects.js +++ /dev/null @@ -1,15 +0,0 @@ -const path = require('path'); -const glob = require('glob'); - -module.exports = function getProjects() { - return glob - .sync(path.join(process.cwd(), 'packages/*')) - .filter((item) => { - return !item.includes('artplayer-document'); - }) - .reduce((result, item) => { - const name = item.split(path.sep).pop(); - result[name] = item; - return result; - }, {}); -}; diff --git a/scripts/logger.js b/scripts/logger.js index 021fbd266..9da09d94c 100644 --- a/scripts/logger.js +++ b/scripts/logger.js @@ -1,27 +1,27 @@ -const chalk = require('chalk'); -const { format } = require('util'); +import chalk from 'chalk'; +import { format } from 'util'; const prefix = 'artplayer-cli'; const sep = chalk.gray('·'); -exports.log = function log(...args) { +export function log(...args) { const msg = format.apply(format, args); console.log(chalk.white(prefix), sep, msg); -}; +} -exports.fatal = function fatal(...args) { +export function fatal(...args) { if (args[0] instanceof Error) args[0] = args[0].message.trim(); const msg = format.apply(format, args); console.error(chalk.red(prefix), sep, msg); process.exit(1); -}; +} -exports.success = function success(...args) { +export function success(...args) { const msg = format.apply(format, args); console.log(chalk.green(prefix), sep, msg); -}; +} -exports.warn = function warn(...args) { +export function warn(...args) { const msg = format.apply(format, args); console.log(chalk.yellow(prefix), sep, msg); -}; +} diff --git a/scripts/projects.js b/scripts/projects.js new file mode 100644 index 000000000..0185a6bef --- /dev/null +++ b/scripts/projects.js @@ -0,0 +1,8 @@ +import path from 'path'; +import glob from 'glob'; + +export default glob.sync(path.join(process.cwd(), 'packages/*')).reduce((result, item) => { + const name = item.split(path.sep).pop(); + result[name] = item; + return result; +}, {});