Skip to content

Commit ed98721

Browse files
committed
[feat] 提交第一个版本
[feat] 提交第一个版本
0 parents  commit ed98721

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

84 files changed

+5245
-0
lines changed

.editorconfig

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
# http://editorconfig.org
2+
root = true
3+
4+
[*]
5+
charset = utf-8
6+
insert_final_newline = true
7+
trim_trailing_whitespace = true
8+
9+
[{*.js,*.json,*.yml}]
10+
indent_size = 2
11+
indent_style = space

.eslintignore

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
public/*
2+
docs/*
3+
test/*
4+
scripts/*

.eslintrc.js

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
module.exports = {
2+
root: true,
3+
parserOptions: {
4+
parser: require.resolve('babel-eslint'),
5+
ecmaVersion: 2018,
6+
sourceType: 'module',
7+
},
8+
env: {
9+
es6: true,
10+
node: true,
11+
browser: true,
12+
},
13+
plugins: [],
14+
extends: ['eslint:recommended'],
15+
globals: {
16+
global: true,
17+
},
18+
rules: {
19+
'no-useless-escape': 0,
20+
'no-empty': 0,
21+
},
22+
};

.gitignore

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
# IDEs and editors
2+
.idea
3+
.project
4+
.classpath
5+
.c9/
6+
*.launch
7+
.settings/
8+
*.sublime-workspace
9+
10+
# IDE - VSCode
11+
.vscode/*
12+
!.vscode/settings.json
13+
!.vscode/tasks.json
14+
!.vscode/launch.json
15+
!.vscode/extensions.json
16+
17+
# Logs
18+
logs
19+
*.log
20+
npm-debug.log*
21+
yarn-debug.log*
22+
yarn-error.log*
23+
24+
# next.js build output
25+
.next
26+
27+
# Lerna
28+
lerna-debug.log
29+
30+
# System Files
31+
.DS_Store
32+
Thumbs.db
33+
34+
# node modules
35+
node_modules
36+
37+
# documentation
38+
build/docs/
39+
40+
package-lock.json
41+
.DS_Store
42+
source/build/
43+
static/
44+
examples/cache
45+
examples/output
46+
47+
# testing
48+
coverage/**
49+
dwt*

.npmignore

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# dependencies
2+
/node_modules
3+
4+
# testing
5+
/coverage
6+
/scripts
7+
8+
# misc
9+
.DS_Store
10+
.env.local
11+
.env.development.local
12+
.env.test.local
13+
.env.production.local
14+
.code.yml
15+
16+
npm-debug.log*
17+
yarn-debug.log*
18+
yarn-error.log*
19+
20+
/docs
21+
/test
22+
/logo
23+
/examples
24+
lib/.DS_Store

.prettierrc.js

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
module.exports = {
2+
printWidth: 100,
3+
semi: true,
4+
singleQuote: true,
5+
trailingComma: 'all',
6+
bracketSpacing: false,
7+
jsxBracketSameLine: true,
8+
arrowParens: 'avoid',
9+
insertPragma: false,
10+
tabWidth: 2,
11+
useTabs: false,
12+
};

.travis.yml

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
language: node_js
2+
node_js:
3+
- node
4+
script:
5+
- npm run travis
6+
branches:
7+
only:
8+
- master

CONTRIBUTING.md

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
# 为 FFCreator 做出贡献
2+
3+
欢迎您 [提出问题](https://github.com/tnfe/FFCreatorLite/issues)[merge requests](https://github.com/tnfe/FFCreatorLite/merge_requests), 建议您在为 FFCreator 做出贡献前先阅读以下 FFCreator 贡献指南。
4+
5+
## issues
6+
7+
我们通过 [issues](https://github.com/tnfe/FFCreatorLite/issues) 来收集问题和功能相关的需求。
8+
9+
### 首先查看已知的问题
10+
11+
在您准备提出问题以前,请先查看现有的 [issues](https://github.com/tnfe/FFCreatorLite/issues) 是否已有其他人提出过相似的功能或问题,以确保您提出的问题是有效的。
12+
13+
### 提交问题
14+
15+
问题的表述应当尽可能的详细,可以包含相关的代码块。
16+
17+
## Merge Requests
18+
19+
我们十分期待您通过 [Merge Requests](https://github.com/tnfe/FFCreatorLite/merge_requests) 让 FFCreator 变的更加完善。
20+
21+
### 分支管理
22+
23+
FFCreator 主仓库只包含 master 分支,其将作为稳定的开发分支,经过测试后会打 Tag 进行发布。
24+
25+
### Commit Message
26+
27+
我们希望您能使用`npm run commit`来提交代码,保持项目的一致性。
28+
这样可以方便生成每个版本的 Changelog,很容易地追溯历史。
29+
30+
### MR 流程
31+
32+
TNFE 团队会查看所有的 MR,我们会运行一些代码检查和测试,一经测试通过,我们会接受这次 MR,但不会立即发布外网,会有一些延迟。
33+
34+
当您准备 MR 时,请确保已经完成以下几个步骤:
35+
36+
1. 将主仓库代码 Fork 到自己名下。
37+
2. 基于 `master` 分支创建您的开发分支。
38+
3. 如果您更改了 API(s) 请更新代码及文档。
39+
4. 检查您的代码语法及格式。
40+
5. 提一个 MR 到主仓库的 `master` 分支上。
41+
42+
### 本地开发
43+
44+
首先安装相关依赖
45+
46+
```bash
47+
npm i
48+
```
49+
50+
运行 examples 下相关demo
51+
52+
```bash
53+
npm run examples
54+
```
55+
56+
使用 [npm link](https://docs.npmjs.com/cli/link.html) 进行测试
57+
58+
```bash
59+
npm link
60+
```
61+
62+
## 许可证
63+
64+
通过为 FFCreator 做出贡献,代表您同意将其版权归为 FFCreator 所有,开源协议为 [MIT LICENSE](https://opensource.org/licenses/MIT)

LICENSE

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) FFCreator authors.
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

README.md

Lines changed: 137 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,137 @@
1+
[English](./README.md) | [简体中文](./README.zh-CN.md)
2+
3+
<p align="center">
4+
<img src="https://tnfe.github.io/FFCreator/_media/logo/logo2.png" />
5+
</p>
6+
7+
<div align="center">
8+
<a href="https://www.npmjs.com/ffcreatorlite" target="_blank"><img src="https://img.shields.io/npm/v/ffcreatorlite.svg" alt="NPM Version" /></a>
9+
<a href="https://www.npmjs.com/ffcreatorlite" target="_blank"><img src="https://img.shields.io/npm/l/ffcreatorlite.svg" alt="Package License" /></a>
10+
<a href="https://travis-ci.org/github/tnfe/FFCreatorLite" target="_blank"><img src="https://travis-ci.org/tnfe/FFCreatorLite.svg?branch=master" alt="Travis CI" /></a>
11+
<a href="https://github.com/prettier/prettier" target="_blank"><img src="https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square" alt="Code Style"></a>
12+
<a href="https://github.com/tnfe/FFCreatorLite/pulls" target="_blank"><img src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg" alt="PRs"/></a>
13+
<a href="https://nodejs.org" target="_blank"><img src="https://img.shields.io/badge/node-%3E%3D%208.0.0-brightgreen.svg" alt="Node Version" /></a>
14+
</div>
15+
16+
## Overview
17+
18+
FFCreatorLite is a lightweight and flexible short video processing library based on <a href="http://nodejs.org" target="_blank">Node.js</a>. You only need to add some pictures, music or video clips, you can use it to quickly create a very exciting video album.
19+
20+
Nowadays, short video is an increasingly popular form of media communication. Like [_weishi_](https://weishi.qq.com/) and _tiktok_ is full of all kinds of wonderful short videos. So how to make users visually create video clips on the web easily and quickly. Or based on pictures Text content, dynamic batch generation of short videos is a technical problem.
21+
22+
`FFCreatorLite` is developed based on the famous video processing library `FFmpeg`, and splicing the complicated and tedious command line parameters of `FFmpeg` (this is not so easy), using `FFmpeg` various filters and features to realize animation And video clips and generate the final movie. So its processing speed is beyond your imagination, even faster than [`FFCreator`](https://github.com/tnfe/FFCreator).
23+
24+
#### For more introduction, please see [here](https://tnfe.github.io/FFCreator/#/guide/lite)
25+
26+
### Features
27+
28+
- Based on node.js development, it is very simple to use and easy to expand and develop.
29+
- Only rely on `FFmpeg`, easy to install, cross-platform, and low requirements for machine configuration.
30+
- The video processing speed is extremely fast, a 5-7 minute video only takes 1 minute.
31+
- Supports multiple elements such as pictures, sounds, video clips, and text.
32+
- Contains 70% animation effects of ʻanimate.css`, which can convert css animation to video.
33+
34+
## Useage
35+
36+
### Install npm Package
37+
38+
```javascript
39+
npm install ffcreatorlite --save
40+
```
41+
42+
Note: To run the preceding commands, Node.js and npm must be installed.
43+
44+
#### Node.js
45+
46+
```javascript
47+
const {FFCreatorCenter, FFScene, FFImage, FFText, FFCreator} = require('ffcreatorlite');
48+
49+
// create creator instance
50+
const creator = new FFCreator({
51+
cacheDir,
52+
outputDir,
53+
width: 600,
54+
height: 400,
55+
log: true,
56+
});
57+
58+
// create FFScene
59+
const scene1 = new FFScene();
60+
const scene2 = new FFScene();
61+
scene1.setBgColor('#ff0000');
62+
scene2.setBgColor('#b33771');
63+
64+
// scene1
65+
const fbg = new FFImage({path: bg1});
66+
scene1.addChild(fbg);
67+
68+
const fimg1 = new FFImage({path: img1, x: 300, y: 60});
69+
fimg1.addEffect('moveInRight', 1.5, 1.2);
70+
scene1.addChild(fimg1);
71+
72+
const text = new FFText({text: '这是第一屏', font, x: 100, y: 100});
73+
text.setColor('#ffffff');
74+
text.setBackgroundColor('#000000');
75+
text.addEffect('fadeIn', 1, 1);
76+
scene1.addChild(text);
77+
78+
scene1.setDuration(8);
79+
creator.addChild(scene1);
80+
81+
// scene2
82+
const fbg2 = new FFImage({path: bg2});
83+
scene2.addChild(fbg2);
84+
// logo
85+
const flogo = new FFImage({path: logo, x: 100, y: 100});
86+
flogo.addEffect('moveInUpBack', 1.2, 0.3);
87+
scene2.addChild(flogo);
88+
89+
scene2.setDuration(4);
90+
creator.addChild(scene2);
91+
92+
creator.addAudio(audio);
93+
creator.start();
94+
95+
creator.on('progress', e => {
96+
console.log(colors.yellow(`FFCreatorLite progress: ${(e.percent * 100) >> 0}%`));
97+
});
98+
99+
creator.on('complete', e => {
100+
console.log(
101+
colors.magenta(`FFCreatorLite completed: \n USEAGE: ${e.useage} \n PATH: ${e.output} `),
102+
);
103+
});
104+
```
105+
106+
## About `FFCreator`
107+
108+
[`FFCreator`](https://github.com/tnfe/FFCreator) is not an enhanced version of `FFCreatorLite`, in fact the two implementation principles are completely different. When you need to process a lot of video without special cool transition animation, `FFCreatorLite` may be a better choice.
109+
110+
#### Principle difference
111+
- `FFCreator` uses `opengl` to process graphics rendering and `shader` post-processing to generate transition effects, and finally uses `FFmpeg` to synthesize the video.
112+
- `FFCreatorLite` completely uses `FFmpeg` filters and other effects, splicing `FFmpeg` commands to generate animations and videos.
113+
114+
`FFCreatorLite` has 70% of the functions of [`FFCreator`](https://github.com/tnfe/FFCreator), but in some cases the processing speed is faster and the installation is extremely simple. So please choose which version of the library to use according to the actual usage.
115+
116+
#### The difference between registration points
117+
118+
The default registration point of `FFCreatorLite` is the upper left corner and cannot be modified, while the default registration point of `FFCreator` is the center and can be modified.
119+
120+
#### For a more detailed tutorial, please check [here](https://tnfe.github.io/FFCreator/#/guide/lite)
121+
122+
## Installation
123+
124+
#### Since `FFCreatorLite` only depends on `FFmpeg`, you need to install the regular version of `FFmpeg`
125+
126+
- How to Install and Use FFmpeg on CentOS [https://linuxize.com/post/how-to-install-ffmpeg-on-centos-7/](https://linuxize.com/post/how-to-install-ffmpeg-on-centos-7/)
127+
- How to Install FFmpeg on Debian [https://linuxize.com/post/how-to-install-ffmpeg-on-debian-9/](https://linuxize.com/post/how-to-install-ffmpeg-on-debian-9/)
128+
- How to Install FFmpeg on Windows [http://blog.gregzaal.com/how-to-install-ffmpeg-on-windows/](http://blog.gregzaal.com/how-to-install-ffmpeg-on-windows/)
129+
- How to Install FFmpeg on Mac OSX [https://trac.ffmpeg.org/wiki/CompilationGuide/macOS](https://trac.ffmpeg.org/wiki/CompilationGuide/macOS)
130+
131+
## Contribute
132+
133+
You are very welcome to join us in developing `FFCreatorLite`, if you want to contribute code, please read [here](./CONTRIBUTING.md).
134+
135+
## License
136+
137+
[MIT](./LICENSE)

0 commit comments

Comments
 (0)