Skip to content

Commit

Permalink
docs: ✏️ update readme
Browse files Browse the repository at this point in the history
  • Loading branch information
@gemxx
gemxx committed Apr 19, 2023
1 parent e1e8cf0 commit bed4165
Show file tree
Hide file tree
Showing 3 changed files with 45 additions and 94 deletions.
43 changes: 13 additions & 30 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ it can be staged loading for that does not support streaming mp4. This means sea

1. Install

```
```bash
$ npm install xgplayer
```

Expand Down Expand Up @@ -52,45 +52,28 @@ it can be staged loading for that does not support streaming mp4. This means sea

### Plugins

xgplayer provides more plugins. Plugins are divided into two categories: one is self-starting, and another inherits the player's core class named xgplayer. In principle, the officially provided plug-ins are self-starting and the packaged third-party libraries are inherited. Some feature plug-ins themselves can provide a downgrade scenario that suggests a self-start approach, or an inheritance approach if not. The player supports custom plugins for more content viewing [plugins](http://h5player.bytedance.com/en/plugins/)
The following is how to use a self-starting plug-in：
```js
import Player from 'xgplayer';
import 'xgplayer-mp4';
const player = new Player({
id: 'video',
url: '//abc.com/test.mp4'
})
```

<code>xgplayer-mp4</code>plugin is self-starting, It loads mp4 video itself, parses mp4 format, implements custom loading, buffering, seamless switching, and so on. it will automatically downgrade devices that do not support [MSE](https://www.w3.org/TR/media-source/). [details](http://h5player.bytedance.com/en/plugins/#xgplayer-mp4)



### Mobile Support

xgplayer supports mobile terminal, but android device brand and system are numerous, there are much compatibility problems, the player provides whitelist mechanism to ensure the perfect operation in mobile terminal. [whitelist](http://h5player.bytedance.com/en/config/#whitelist)

xgplayer provides more plugins and supports custom plugins, for more content viewing [plugins](http://h5player.bytedance.com/en/plugins/). There are many built-in plugins in the player, if you need to close specific plugins, you can disable them by [ignores](https://h5player.bytedance.com/config/#ignores) configuration


### Dev

For debugging, we provide the example video resource which size is large in github. You can clone the whole git repository which includes codes and example videos with 'git clone --recurse-submodules -j8'. With 'git clone' you will pull only codes of xgplayer and its plugins.
In order to debug by developers, we provide demos code in the fixtures directory of the repo. The player uses yarn for package management, and it only takes a few simple steps to start debugging in the repo

```
$ git clone --recurse-submodules -j8 [email protected]:bytedance/xgplayer.git # OR git clone [email protected]:bytedance/xgplayer.git
```bash
$ cd xgplayer
$ npm install
$ npm run dev
$ yarn
$ yarn dev:xgplayer
```

please visit [http://localhost:9090/examples/index.html](http://localhost:9090/examples/index.html)
To debug other plugins, please refer to the scripts command provided in package.json in the root directory of the repo, such as:

```bash
$ yarn dev:hls
$ yarn dev:flv
$ yarn dev:mp4
```

### Agreement
### License

Welcome to use xgplayer! Please read the following terms carefully. Using xgplayer means that you accept and agree to the terms.
1. Xgplayer is licensed under the [MIT](http://opensource.org/licenses/MIT) License. You comply with its obligations by default.
Expand Down
41 changes: 13 additions & 28 deletions README.zh-CN.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@

1. 安装

```
```bash
$ npm install xgplayer
```

Expand Down Expand Up @@ -56,41 +56,26 @@

### 插件

西瓜播放器提供了较多的插件，插件分两类：一部分是自启动的，一部分是继承播放器核心类 xgplayer 的。原则上官方提供插件都是自启动的，封装的第三方类库都是继承方式。有些功能插件本身能提供降级方案建议使用自启动方式，否则建议使用继承方式。播放器支持自定义插件，更多内容查看 [插件](http://h5player.bytedance.com/plugins/)
对于自启动的插件使用方法如下：
```js
import Player from 'xgplayer'
import 'xgplayer-mp4'
let player = new Player({
id: 'video',
url: '//abc.com/test.mp4'
})
```

<code>xgplayer-mp4</code>插件就是自启动的，它会自己加载 mp4 视频、解析 mp4 格式，实现自定义加载、缓冲、无缝切换等[详情]((http://h5player.bytedance.com/plugins/#xgplayer-mp4))。对于不支持 [MSE](https://www.w3.org/TR/media-source/) 的设备自动降级。
西瓜播放器提供了较多的插件，并支持自定义插件，更多内容查看 [插件](http://h5player.bytedance.com/plugins/)。播放器内有不少内置插件，如果需要关闭某些插件可以通过 [ignores](https://h5player.bytedance.com/config/#ignores) 配置禁用


### Mobile Support
### 开发调试

西瓜播放器支持移动端，不过安卓设备品牌和系统众多，兼容性问题很多，播放器提供白名单机制保证在移动端完美的运行。[白名单机制](http://h5player.bytedance.com/config/#%E7%99%BD%E5%90%8D%E5%8D%95)
为了方便开发者调试，我们在仓库 fixtures 目录内提供了示例代码。播放器使用 yarn 进行包管理，只需简单几步即可开始在仓库内启动调试


### Dev

为了方便开发者调试，我们提供了示例视频资源。示例文件较大，可使用 git clone --recurse-submodules -j8 命令完整拉取源码和示例文件；如果你只对源码感兴趣可以使用 git clone 命令仅拉取源码部分。

```
$ git clone --recurse-submodules -j8 [email protected]:bytedance/xgplayer.git # 或者：git clone [email protected]:bytedance/xgplayer.git
```bash
$ cd xgplayer
$ npm install
$ npm run dev
$ yarn
$ yarn dev:xgplayer
```

访问 [http://localhost:9090/examples/index.html](http://localhost:9090/examples/index.html)
其它插件启动，请参考仓库根目录内 package.json 提供 scripts 命令，比如：

```bash
$ yarn dev:hls
$ yarn dev:flv
$ yarn dev:mp4
```

### 使用协议

Expand Down
55 changes: 19 additions & 36 deletions packages/xgplayer/README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,6 @@
<a href="https://www.npmjs.com/package/xgplayer" target="_blank">
<img src="https://img.shields.io/npm/v/xgplayer.svg" alt="npm">
</a>
<a href="https://www.npmjs.com/package/xgplayer">
<img src="https://img.shields.io/npm/dm/xgplaer.svg" alg="download">
</a>
<a href="https://www.npmjs.com/package/xgplayer" target="_blank">
<img src="https://img.shields.io/npm/l/xgplayer.svg" alt="license">
</a>
Expand All @@ -19,14 +16,14 @@

### Introduction

xgplayer is a web video player library. it has designed a separate, detachable UI component based on the principle that everything is componentized. More importantly, it is not only flexible in the UI layer, but also bold in its functionality: it gets rid of video loading, buffering, and format support for video dependence. Especially on mp4
it can be staged loading for that does not support streaming mp4. This means seamless switching with clarity, load control, and video savings. It also integrates on-demand and live support for FLV, HLS, and dash. [Document](http://h5player.bytedance.com/)
xgplayer is a web video player library. It has designed a separate, detachable UI component based on the principle that everything is componentized. More importantly, it is not only flexible in the UI layer, but also bold in its functionality: it gets rid of video loading, buffering, and format support for video dependence. Especially on mp4
it can be staged loading for that does not support streaming mp4. This means seamless switching with clarity, load control, and video savings. It also integrates on-demand and live support for FLV, HLS, and dash. [Document](http://h5player.bytedance.com/en/)

### Start

1. Install

```
```bash
$ npm install xgplayer
```

Expand All @@ -48,51 +45,37 @@ it can be staged loading for that does not support streaming mp4. This means sea
})
```

This is the easiest way to configure the player,then it runs with video. For more advanced content, see the plug-in section or documentation. [more config](http://h5player.bytedance.com/config.html)
This is the easiest way to configure the player, then it runs with video. For more advanced content, see the plug-in section or documentation. [more config](http://h5player.bytedance.com/en/config/)




### Plugins

xgplayer provides more plugins, plugins are divided into two categories: one is self-starting, and another inherits the player's core class named xgplayer. In principle, the officially provided plug-ins are self-starting and the packaged third-party libraries are inherited. Some feature plug-ins themselves can provide a downgrade scenario that suggests a self-start approach, or an inheritance approach if not. The player supports custom plugins for more content viewing [plugins](http://h5player.bytedance.com/)
The following is how to use a self-starting plug-in：
```js
import Player from 'xgplayer';
import 'xgplyaer-mp4';
const player = new Player({
id: 'video',
url: '//abc.com/test.mp4'
})
```

<code>xgplayer-mp4</code>plugin is self-starting, It loads mp4 video itself, parses mp4 format, implements custom loading, buffering, seamless switching, and so on. it will automatically downgrade devices that do not support [MSE](https://www.w3.org/TR/media-source/). [details](http://h5player.bytedance.com/plugins/#xgplayer-mp4)



### Mobile Support

xgplayer supports mobile terminal, but android device brand and system are numerous, there are much compatibility problems, the player provides whitelist mechanism to ensure the perfect operation in mobile terminal. [whitelist](http://h5player.bytedance.com/config/#%E7%99%BD%E5%90%8D%E5%8D%95)

xgplayer provides more plugins and supports custom plugins, for more content viewing [plugins](http://h5player.bytedance.com/en/plugins/). There are many built-in plugins in the player, if you need to close specific plugins, you can disable them by [ignores](https://h5player.bytedance.com/config/#ignores) configuration


### Dev

For debugging, we provide the example video resource which size is large in github. You can clone the whole git repository which includes codes and example videos with 'git clone --recurse-submodules -j8'. With 'git clone' you will pull only codes of xgplayer and its plugins.
In order to debug by developers, we provide demos code in the fixtures directory of the repo. The player uses yarn for package management, and it only takes a few simple steps to start debugging in the repo

```
$ git clone --recurse-submodules -j8 [email protected]:bytedance/xgplayer.git # OR git clone [email protected]:bytedance/xgplayer.git
```bash
$ cd xgplayer
$ npm install
$ npm run dev
$ yarn
$ yarn dev:xgplayer
```

please visit [http://localhost:9090/examples/index.html](http://localhost:9090/examples/index.html)
To debug other plugins, please refer to the scripts command provided in package.json in the root directory of the repo, such as:

```bash
$ yarn dev:hls
$ yarn dev:flv
$ yarn dev:mp4
```

### License

[MIT](http://opensource.org/licenses/MIT)
Welcome to use xgplayer! Please read the following terms carefully. Using xgplayer means that you accept and agree to the terms.
1. Xgplayer is licensed under the [MIT](http://opensource.org/licenses/MIT) License. You comply with its obligations by default.
2. By default, you authorize us to place your logo in xgplayer website, which using xgplayer.
If you have any problem, please let us know.

0 comments on commit bed4165

Please sign in to comment.