diff --git a/example/src/IframePage.tsx b/example/src/IframePage.tsx
index f08194e9..936fdf2f 100644
--- a/example/src/IframePage.tsx
+++ b/example/src/IframePage.tsx
@@ -24,6 +24,10 @@ export default function IframePage() {
dispatchMessage(firstVideoWindow, ACTIONS.PLAYER.PAUSE)
})
+ document.getElementById('jsPlayFirst').addEventListener('click', () => {
+ dispatchMessage(firstVideoWindow, ACTIONS.PLAYER.PLAY)
+ })
+
document.getElementById('jsSeekFirst').addEventListener('click', () => {
const currentTime = Number(document.getElementById('time').value)
dispatchMessage(firstVideoWindow, ACTIONS.PLAYER.TIME_UPDATE, {
@@ -37,6 +41,14 @@ export default function IframePage() {
dispatchMessage(firstVideoWindow, ACTIONS.PLAYER.SHOW_CONTROLLER)
})
+ document
+ .getElementById('jsSetVolumeFirst')
+ .addEventListener('click', () => {
+ dispatchMessage(firstVideoWindow, ACTIONS.PLAYER.SET_VOLUME, {
+ volume: 0,
+ })
+ })
+
return () => {
disposer.unsubscribe()
}
@@ -45,10 +57,11 @@ export default function IframePage() {
return (
<>
本页面可以测试播放器在 iframe 中的效果,还可以测试跨窗口消息接口
- 场景 1:向一个视频发出暂停指令
+ 场景 1:向一个视频发出暂停 / 播放指令
场景 2:一个视频开始播放时,暂停其他视频
场景 3:手动 seek
场景 4:显示进度条
+ 场景 5:设置视频的音量
@@ -57,12 +70,16 @@ export default function IframePage() {
+
+
+
-
+
+
>
)
}
diff --git a/packages/griffith-message/README-zh-Hans.md b/packages/griffith-message/README-zh-Hans.md
index 2d3b9241..f450e789 100644
--- a/packages/griffith-message/README-zh-Hans.md
+++ b/packages/griffith-message/README-zh-Hans.md
@@ -100,9 +100,9 @@ dispatchMessage(targetWindow, messageName, data)
| `messageName` | 说明 | `data` | 状态 |
| --------------------------------- | -------------------- | ------------------------------------------------- | ------ |
-| `ACTIONS.PLAYER.PLAY` | 播放 | `{applyOnFullScreen: boolean}` 是否应用于全屏视频 | TODO |
+| `ACTIONS.PLAYER.PLAY` | 播放 | `{applyOnFullScreen: boolean}` 是否应用于全屏视频 | 已支持 |
| `ACTIONS.PLAYER.PAUSE` | 暂停 | 同上 | 已支持 |
-| `ACTIONS.PLAYER.SET_VOLUME` | 设置音量 | `{volume: number}` 音量值,0 到 1 | TODO |
+| `ACTIONS.PLAYER.SET_VOLUME` | 设置音量 | `{volume: number}` 音量值,0 到 1 | 已支持 |
| `ACTIONS.PLAYER.ENTER_FULLSCREEN` | 进入全屏 | 无 | 已支持 |
| `ACTIONS.PLAYER.EXIT_FULLSCREEN` | 退出全屏 | 无 | 已支持 |
| `ACTIONS.PLAYER.TIME_UPDATE` | 设置视频播放进度 | `{currentTime: number} 设置视频当前的进度` | 已支持 |
diff --git a/packages/griffith-message/README.md b/packages/griffith-message/README.md
index 39a6e2a5..09aec871 100644
--- a/packages/griffith-message/README.md
+++ b/packages/griffith-message/README.md
@@ -100,9 +100,9 @@ Event sent to the player
| `messageName` | Description | `data` | Status |
| --------------------------------- | ---------------- | ----------------------------------------------------------- | --------- |
-| `ACTIONS.PLAYER.PLAY` | Play | `{applyOnFullScreen: boolean}` Applied to full screen video | TODO |
+| `ACTIONS.PLAYER.PLAY` | Play | `{applyOnFullScreen: boolean}` Applied to full screen video | SUPPORTED |
| `ACTIONS.PLAYER.PAUSE` | Pause | Applied to full screen video | SUPPORTED |
-| `ACTIONS.PLAYER.SET_VOLUME` | Set the volume | `{volume: number}` Volume value from 0 to 1 | TODO |
+| `ACTIONS.PLAYER.SET_VOLUME` | Set the volume | `{volume: number}` Volume value from 0 to 1 | SUPPORTED |
| `ACTIONS.PLAYER.ENTER_FULLSCREEN` | Enter fullScreen | null | SUPPORTED |
| `ACTIONS.PLAYER.EXIT_FULLSCREEN` | Exit fullscreen | null | SUPPORTED |
| `ACTIONS.PLAYER.TIME_UPDATE` | Set current time | `{currentTime: number} Set the currentTime` | SUPPORTED |
diff --git a/packages/griffith/src/components/Player/Player.js b/packages/griffith/src/components/Player/Player.js
index d8e5739c..90ff575f 100644
--- a/packages/griffith/src/components/Player/Player.js
+++ b/packages/griffith/src/components/Player/Player.js
@@ -117,6 +117,9 @@ class Player extends Component {
ACTIONS.PLAYER.SHOW_CONTROLLER,
this.handleShowController
),
+ this.props.subscribeAction(ACTIONS.PLAYER.SET_VOLUME, ({volume}) =>
+ this.handleVideoVolumeChange(volume)
+ ),
]
if (this.videoRef.current.root) {