Merge pull request #66 from hughfenghen/feat/cut

Feat/cut
bilibili · Mar 31, 2024 · 92e77fa · 92e77fa
2 parents d9744d5 + 66dbade
commit 92e77fa
Show file tree

Hide file tree

Showing 53 changed files with 4,585 additions and 549 deletions.
diff --git a/.github/commit-convention.md b/.github/commit-convention.md
@@ -1,91 +1,91 @@
-## Git Commit Message Convention
-
-> This is adapted from [Angular's commit convention](https://github.com/conventional-changelog/conventional-changelog/tree/master/packages/conventional-changelog-angular).
-
-#### TL;DR:
-
-Messages must be matched by the following regex:
-
-```js
-/^(revert: )?(feat|fix|docs|dx|style|refactor|perf|test|workflow|build|ci|chore|types|wip)(\(.+\))?: .+/;
-```
-
-#### Examples
-
-Appears under "Features" header, `av-canvas` subheader:
-
-```
-feat(av-canvas): add 'video-sprite' feature
-```
-
-Appears under "Bug Fixes" header, `event-tool` subheader, with a link to issue #00:
-
-```
-fix(event-tool): clear listeners on listener interface
-
-close #00
-```
-
-Appears under "Performance Improvements" header, and under "Breaking Changes" with the breaking change explanation:
-
-```
-perf(av-cliper): improve performance by utilizing WebGL
-
-BREAKING CHANGE: The performance enhancement now relies on WebGL.
-```
-
-The following commit and commit `667ecc1` do not appear in the changelog if they are under the same release. If not, the revert commit appears under the "Reverts" header.
-
-```
-revert: feat(av-canvas): add 'video-sprite' feature
-
-This reverts commit 667ecc1654a317a13331b17617d973392f415f02.
-```
-
-### Full Message Format
-
-A commit message consists of a **header**, **body** and **footer**. The header has a **type**, **scope** and **subject**:
-
-```
-<type>(<scope>): <subject>
-<BLANK LINE>
-<body>
-<BLANK LINE>
-<footer>
-```
-
-The **header** is mandatory and the **scope** of the header is optional.
-
-### Revert
-
-If the commit reverts a previous commit, it should begin with `revert: `, followed by the header of the reverted commit. In the body, it should say: `This reverts commit <hash>.`, where the hash is the SHA of the commit being reverted.
-
-### Type
-
-If the prefix is `feat`, `fix` or `perf`, it will appear in the changelog. However, if there is any [BREAKING CHANGE](#footer), the commit will always appear in the changelog.
-
-Other prefixes are up to your discretion. Suggested prefixes are `docs`, `chore`, `style`, `refactor`, and `test` for non-changelog related tasks.
-
-### Scope
-
-The scope could be anything specifying the place of the commit change. For example `av-canvas`, `av-cliper`, `av-recorder`, `base-sprite`, `dom-utils` etc...
-
-### Subject
-
-The subject contains a succinct description of the change:
-
-- use the imperative, present tense: "change" not "changed" nor "changes"
-- don't capitalize the first letter
-- no dot (.) at the end
-
-### Body
-
-Just as in the **subject**, use the imperative, present tense: "change" not "changed" nor "changes".
-The body should include the motivation for the change and contrast this with previous behavior.
-
-### Footer
-
-The footer should contain any information about **Breaking Changes** and is also the place to
-reference GitHub issues that this commit **Closes**.
-
-**Breaking Changes** should start with the word `BREAKING CHANGE:` with a space or two newlines. The rest of the commit message is then used for this.
+## Git Commit Message Convention
+
+> This is adapted from [Angular's commit convention](https://github.com/conventional-changelog/conventional-changelog/tree/master/packages/conventional-changelog-angular).
+
+#### TL;DR:
+
+Messages must be matched by the following regex:
+
+```js
+/^(revert: )?(feat|fix|docs|dx|style|refactor|perf|test|workflow|build|ci|chore|types|wip)(\(.+\))?: .+/;
+```
+
+#### Examples
+
+Appears under "Features" header, `av-canvas` subheader:
+
+```
+feat(av-canvas): add 'video-sprite' feature
+```
+
+Appears under "Bug Fixes" header, `event-tool` subheader, with a link to issue #00:
+
+```
+fix(event-tool): clear listeners on listener interface
+
+close #00
+```
+
+Appears under "Performance Improvements" header, and under "Breaking Changes" with the breaking change explanation:
+
+```
+perf(av-cliper): improve performance by utilizing WebGL
+
+BREAKING CHANGE: The performance enhancement now relies on WebGL.
+```
+
+The following commit and commit `667ecc1` do not appear in the changelog if they are under the same release. If not, the revert commit appears under the "Reverts" header.
+
+```
+revert: feat(av-canvas): add 'video-sprite' feature
+
+This reverts commit 667ecc1654a317a13331b17617d973392f415f02.
+```
+
+### Full Message Format
+
+A commit message consists of a **header**, **body** and **footer**. The header has a **type**, **scope** and **subject**:
+
+```
+<type>(<scope>): <subject>
+<BLANK LINE>
+<body>
+<BLANK LINE>
+<footer>
+```
+
+The **header** is mandatory and the **scope** of the header is optional.
+
+### Revert
+
+If the commit reverts a previous commit, it should begin with `revert: `, followed by the header of the reverted commit. In the body, it should say: `This reverts commit <hash>.`, where the hash is the SHA of the commit being reverted.
+
+### Type
+
+If the prefix is `feat`, `fix` or `perf`, it will appear in the changelog. However, if there is any [BREAKING CHANGE](#footer), the commit will always appear in the changelog.
+
+Other prefixes are up to your discretion. Suggested prefixes are `docs`, `chore`, `style`, `refactor`, and `test` for non-changelog related tasks.
+
+### Scope
+
+The scope could be anything specifying the place of the commit change. For example `av-canvas`, `av-cliper`, `av-recorder`, `base-sprite`, `dom-utils` etc...
+
+### Subject
+
+The subject contains a succinct description of the change:
+
+- use the imperative, present tense: "change" not "changed" nor "changes"
+- don't capitalize the first letter
+- no dot (.) at the end
+
+### Body
+
+Just as in the **subject**, use the imperative, present tense: "change" not "changed" nor "changes".
+The body should include the motivation for the change and contrast this with previous behavior.
+
+### Footer
+
+The footer should contain any information about **Breaking Changes** and is also the place to
+reference GitHub issues that this commit **Closes**.
+
+**Breaking Changes** should start with the word `BREAKING CHANGE:` with a space or two newlines. The rest of the commit message is then used for this.
diff --git a/README.md b/README.md
@@ -96,7 +96,7 @@ This repo uses lerna + yarn to manage packages.
 
 ## Sponsor 赞助
 
-如果该项目对你有帮助，扫描二维码请作者喝奶茶 ：）   
+如果该项目对你有帮助，扫描二维码请作者喝奶茶 ：）  
 If this project has been helpful to you, please scan the QR code to treat the author to a milk tea ：）
 
 <img src="https://github.com/hughfenghen/WebAV/assets/3307051/4b25836a-3f85-4160-b0bf-6c8360fad9a4" width=200 />

diff --git a/doc-site/.dumirc.ts b/doc-site/.dumirc.ts
@@ -1,6 +1,25 @@
 import { defineConfig } from 'dumi';
+import path from 'path';
 
 export default defineConfig({
+  plugins: ['@umijs/plugins/dist/tailwindcss'],
+  tailwindcss: {}, //在umi中，表示启用该插件
+  alias: {
+    '@webav/av-cliper': path.resolve(
+      __dirname,
+      '../packages/av-cliper/src/index.ts',
+    ),
+    // av-recorder 使用 vite 的 import worker，umi 不兼容
+    // '@webav/av-recorder': path.resolve(
+    //   __dirname,
+    //   '../packages/av-recorder/src/av-recorder.ts',
+    // ),
+    '@webav/av-canvas': path.resolve(
+      __dirname,
+      '../packages/av-canvas/src/index.ts',
+    ),
+  },
+
   analytics: { ga_v2: 'G-MC335K4KV6' },
   themeConfig: {
     name: 'WebAV',
@@ -9,7 +28,7 @@ export default defineConfig({
       github: 'https://github.com/hughfenghen/WebAV',
     },
     footer:
-      '碰到问题请去 <a href="https://github.com/hughfenghen/WebAV/issues/">WebAV Issues</a> 中反馈 <br/> <a class="github-button" href="https://github.com/hughfenghen/WebAV" data-color-scheme="no-preference: light; light: light; dark: dark;" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star hughfenghen/WebAV on GitHub">Star</a>',
+      '<div>碰到问题请去 <a href="https://github.com/hughfenghen/WebAV/issues/">WebAV Issues</a> 中反馈</div><div class="flex" style="justify-content: center;"><a class="github-button" href="https://github.com/hughfenghen/WebAV" data-color-scheme="no-preference: light; light: light; dark: dark;" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star hughfenghen/WebAV on GitHub">Star</a></div>',
   },
   ...(process.env.NODE_ENV === 'development'
     ? {

diff --git a/doc-site/docs/demo/1_3-decode-image.md b/doc-site/docs/demo/1_3-decode-image.md
@@ -4,6 +4,10 @@ group: 解码
 order: 3
 ---
 
-# 解码图片
+# 解码动图
+
+动图有多种格式，最古老常见的是 `gif`；  
+动图是由多个静态图片帧组成的，可使用浏览器 API `ImageDecoder` 解码；  
+或使用 `decodeImg` (`import { decodeImg } from '@webav/av-cliper'`) 一次获取所有图片帧。
 
 <code src="./decode-image.tsx"></code>
diff --git a/doc-site/docs/demo/1_4-mp4-previewer.md b/doc-site/docs/demo/1_4-mp4-previewer.md
diff --git a/doc-site/docs/demo/2_1-concat-video.md b/doc-site/docs/demo/2_1-concat-video.md
@@ -2,7 +2,7 @@
 nav: DEMO
 group:
   title: 合成
-  order: 2
+  order: 3
 
 order: 1
 ---

diff --git a/doc-site/docs/demo/2_5-video-compsite-and-concat.md b/doc-site/docs/demo/2_5-video-compsite-and-concat.md
@@ -6,7 +6,7 @@ group:
 order: 5
 ---
 
-# 视频合成再拼接
+# 合成再拼接
 
 代码处理过程：
 

diff --git a/doc-site/docs/demo/2_6-custom-clip.md b/doc-site/docs/demo/2_6-custom-clip.md
@@ -6,7 +6,7 @@ group:
 order: 6
 ---
 
-# 自定义资源
+# 自定义素材
 
 使用 canvas 实现一个倒计时 Clip，快速生成视频文件；  
 基于同样原理，适应于需要将 canvas 内容（比如 动画）**快速**保存为视频文件的场景。

diff --git a/doc-site/docs/demo/3_1-chromakey-image.md b/doc-site/docs/demo/3_1-chromakey-image.md
@@ -2,7 +2,7 @@
 nav: DEMO
 group:
   title: 绿幕抠图
-  order: 3
+  order: 4
 
 order: 1
 ---

diff --git a/doc-site/docs/demo/4_1-recorder-usermedia.md b/doc-site/docs/demo/4_1-recorder-usermedia.md
@@ -2,7 +2,7 @@
 nav: DEMO
 group:
   title: 视频录制
-  order: 4
+  order: 5
 
 order: 1
 ---

diff --git a/doc-site/docs/demo/5_1-link.md b/doc-site/docs/demo/5_1-link.md
@@ -2,7 +2,7 @@
 nav: DEMO
 group:
   title: 其它
-  order: 5
+  order: 6
 
 order: 1
 ---