Skip to content

Commit

Permalink
docs: update readme (#4)
Browse files Browse the repository at this point in the history
* docs: update readme
  • Loading branch information
xiaoyuhen authored Mar 22, 2019
1 parent e6811cf commit 1e1b16c
Show file tree
Hide file tree
Showing 6 changed files with 55 additions and 62 deletions.
30 changes: 11 additions & 19 deletions .github/ISSUE_TEMPLATE/feature.md
Original file line number Diff line number Diff line change
@@ -1,30 +1,22 @@
---
name: 🐛 Bug report
about: Create a report to help us improve
name: 🚀 Feature Proposal
about: Submit a proposal for a new feature
---

## 🐛 Bug Report
<!-- Love jest-puppeteer? Please consider supporting our collective: 👉 https://opencollective.com/jest-puppeteer/donate -->

A clear and concise description of what the bug is.
## 🚀 Feature Proposal

## To Reproduce
A clear and concise description of what the feature is.

Steps to reproduce the behavior:
## Motivation

## Expected behavior
Please outline the motivation for the proposal.

A clear and concise description of what you expected to happen.
## Example

## Link to repl or repo (highly encouraged)
Please provide an example for how this feature would be used.

Please provide a minimal repository on GitHub.
## Pitch

Issues without a reproduction link are likely to stall.

## Run `npx envinfo --system --binaries --npmPackages griffith --markdown --clipboard`

Paste the results here:

```bash

```
Why does this feature belong in the SVGR ecosystem?
12 changes: 6 additions & 6 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<h1 align="center">
<img src="https://zhstatic.zhihu.com/cfe/griffith/griffith-banner.png" height="200" width="200"/>
<p align="center" style="font-size: 0.5em">React-based web video player</p>
<p align="center" style="font-size: 0.5em">A React-based web video player</p>
</h1>

English | [简体中文](./README-zh_CN.md)
Expand All @@ -11,9 +11,9 @@ English | [简体中文](./README-zh_CN.md)
<img src="https://zhstatic.zhihu.com/cfe/griffith/player.png"/>
</p>

- **Streaming:** griffith makes streaming easy. Whether your video format is mp4 or hls, griffith can use Media Source Extension (MSE) for segment loading.
- **Extensibility:** griffith makes it simple to support video features in React apps. It also supports the UMD (Universal Module Definition) patterns for use directly in the browser if your application is not based on React.
- **Reliability:** griffith has been widely used in the web and mobile web of zhihu.
- **Streaming:** Griffith makes streaming easy. Whether your video format is mp4 or hls, Griffith can use Media Source Extension (MSE) for segment loading.
- **Extensibility:** Griffith makes it simple to support video features in React apps. It also supports the UMD (Universal Module Definition) patterns for use directly in the browser if your application is not based on React.
- **Reliability:** Griffith has been widely used in the web and mobile web of zhihu.

## Usage

Expand Down Expand Up @@ -65,7 +65,7 @@ Griffith.createPlayer(element).render({sources})

## Project Structure

Griffith is a monorepo and use [Yarn workspace](https://yarnpkg.com/lang/en/docs/workspaces/) and [monorepo](https://github.com/lerna/lerna).
Griffith is a monorepo and use [Yarn workspace](https://yarnpkg.com/lang/en/docs/workspaces/) and [Lerna](https://github.com/lerna/lerna).

### Core

Expand Down Expand Up @@ -113,7 +113,7 @@ Read below to learn how you can take part in improving griffith.

### [Contributing Guide](./CONTRIBUTING.md)

Read our [contributing guide](./CONTRIBUTING.md) to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to griffith.
Read our [contributing guide](./CONTRIBUTING.md) to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to Griffith.

### Contributor

Expand Down
10 changes: 5 additions & 5 deletions packages/griffith-message/README-zh_CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,11 +22,11 @@ const {subscribeMessage, dispatchMessage} = createMessageHelper(
)
```

| Name | Type | Description |
| -------------- | ----------------- | ---------------------------------------------------------------------------------------- |
| `id` | `string | number` | 唯一标识,每条消息都会带上这个 id,接收方可以用来验证。 |
| `targetOrigin` | `object` | 传出消息时的 targetOrigin 参数。另外,如果不为空,会检查传入消息的 origin 是否与之相同。 |
| `validateId` | `boolean` | 如果为 true 会检查传入消息的 id 是否与第一个参数的 id 相同。 |
| Name | Type | Description |
| -------------- | ------------------ | ---------------------------------------------------------------------------------------- |
| `id` | `string \| number` | 唯一标识,每条消息都会带上这个 id,接收方可以用来验证。 |
| `targetOrigin` | `object` | 传出消息时的 targetOrigin 参数。另外,如果不为空,会检查传入消息的 origin 是否与之相同。 |
| `validateId` | `boolean` | 如果为 true 会检查传入消息的 id 是否与第一个参数的 id 相同。 |

#### `subscribeMessage`

Expand Down
10 changes: 5 additions & 5 deletions packages/griffith-message/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,11 +22,11 @@ const {subscribeMessage, dispatchMessage} = createMessageHelper(
)
```

| Name | Type | Description |
| ------------ | ----------------- | ----------------------------------------------------------------------------------------------------------------------------------- |
| id | `string | number` | Unique identifier, each message will contain this id, the receiver can be used to verify. |
| targetOrigin | `object` | The targetOrigin parameter when sending a message. If it is not empty, it will check if the origin of the sent message is the same. |
| validateId | `boolean` | Will check if the id of the incoming message is the same as the id of the first parameter. |
| Name | Type | Description |
| ------------ | ------------------ | ----------------------------------------------------------------------------------------------------------------------------------- |
| id | `string \| number` | Unique identifier, each message will contain this id, the receiver can be used to verify. |
| targetOrigin | `object` | The targetOrigin parameter when sending a message. If it is not empty, it will check if the origin of the sent message is the same. |
| validateId | `boolean` | Will check if the id of the incoming message is the same as the id of the first parameter. |

#### subscribeMessage

Expand Down
26 changes: 13 additions & 13 deletions packages/griffith/README-zh_CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,19 +18,19 @@ render(<Player {...props} />)

### `props`

| 字段 | 类型 | 默认值 | 说明 |
| --------------------- | ------------------------------------------------------ | ----------- | ------------------------------------------ |
| `id` | `string` | | 播放器实例唯一标识 |
| `title` | `string` | | 视频标题 |
| `cover` | `string` | | 视频封面图片 URL |
| `duration` | `number` | | 初始视频时长。在视频元数据载入后使用实际值 |
| `sources` | `sources` | | 视频播放数据。具体见下, |
| `standalone` | `boolean` | `false` | 是否启用 standalone 模式 |
| `onBeforePlay` | `function` | `void` | 视频播放之前回调函数 |
| `shouldObserveResize` | `boolean` | `false` | 是否监听窗口 resize |
| `initialObjectFit` | `'fill' | 'contain' | 'cover' | 'none' | 'scale-down'` | `'contain'` | object-fit 参数 |
| `useMSE` | `boolean` | `false` | 是否启用 MSE |
| `locale` | `'en'|'zh_cn'` | `'en'` | 界面语言 |
| 字段 | 类型 | 默认值 | 说明 |
| --------------------- | ------------------------------------------------- | --------- | ------------------------------------------ |
| `id` | `string` | | 播放器实例唯一标识 |
| `title` | `string` | | 视频标题 |
| `cover` | `string` | | 视频封面图片 URL |
| `duration` | `number` | | 初始视频时长。在视频元数据载入后使用实际值 |
| `sources` | `sources` | | 视频播放数据。具体见下, |
| `standalone` | `boolean` | `false` | 是否启用 standalone 模式 |
| `onBeforePlay` | `function` | `void` | 视频播放之前回调函数 |
| `shouldObserveResize` | `boolean` | `false` | 是否监听窗口 resize |
| `initialObjectFit` | `fill \| \contain \| cover \| none \| scale-down` | `contain` | object-fit 参数 |
| `useMSE` | `boolean` | `false` | 是否启用 MSE |
| `locale` | `en \| zh_cn` | `en` | 界面语言 |

`sources` 字段:

Expand Down
29 changes: 15 additions & 14 deletions packages/griffith/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,8 @@ English | [简体中文](./README-zh_CN.md)
```bash
yarn add griffith
yarn add hls.js
# Griffith uses hls.js to play m3u8 format video. If you don't want to install hls.js, please ref the build part.
# Griffith uses hls.js to play m3u8 format video.
# If you don't want to install hls.js, please ref the build part.
```

```js
Expand All @@ -18,19 +19,19 @@ render(<Player {...props} />)

### `Props`

| Name | Type | Default | Description |
| --------------------- | ------------------------------------------------------ | ----------- | ------------------------------------------------------------------------ |
| `id` | `string` | | Unique identifier of the player instance |
| `title` | `string` | | Video title |
| `cover` | `string` | | Video cover image |
| `duration` | `number` | | Initial video duration. Use actual values after video metadata is loaded |
| `sources` | `sources` | | Video playback data |
| `standalone` | `boolean` | `false` | Enable standalone mode |
| `onBeforePlay` | `function` | `void` | Callback function before video playback |
| `shouldObserveResize` | `boolean` | `false` | Listen to the window resize |
| `initialObjectFit` | `'fill' | 'contain' | 'cover' | 'none' | 'scale-down'` | `'contain'` | object-fit |
| `useMSE` | `boolean` | `false` | Enable Media Source Extensions™ |
| `locale` | `'en'|'zh_cn'` | `'en'` | UI Locale |
| Name | Type | Default | Description |
| --------------------- | ------------------------------------------------ | --------- | ------------------------------------------------------------------------ |
| `id` | `string` | | Unique identifier of the player instance |
| `title` | `string` | | Video title |
| `cover` | `string` | | Video cover image |
| `duration` | `number` | | Initial video duration. Use actual values after video metadata is loaded |
| `sources` | `sources` | | Video playback data |
| `standalone` | `boolean` | `false` | Enable standalone mode |
| `onBeforePlay` | `function` | `void` | Callback function before video playback |
| `shouldObserveResize` | `boolean` | `false` | Listen to the window resize |
| `initialObjectFit` | `fill \| contain \| cover \| none \| scale-down` | `contain` | object-fit |
| `useMSE` | `boolean` | `false` | Enable Media Source Extensions™ |
| `locale` | `en \| zh_cn` | `en` | UI Locale |

`sources`:

Expand Down

0 comments on commit 1e1b16c

Please sign in to comment.