diff --git a/README.md b/README.md
index f019eb9..20402a4 100644
--- a/README.md
+++ b/README.md
@@ -126,7 +126,7 @@ Settings for each player live under different keys:
Key | Options
--- | -------
-`youtube` | `playerVars`: Override the [default player vars](https://developers.google.com/youtube/player_parameters?playerVersion=HTML5)
`embedOptions`: Override the [default embed options](https://developers.google.com/youtube/iframe_api_reference#Loading_a_Video_Player)
+`youtube` | `playerVars`: Override the [default player vars](https://developers.google.com/youtube/player_parameters?playerVersion=HTML5)
`embedOptions`: Override the [default embed options](https://developers.google.com/youtube/iframe_api_reference#Loading_a_Video_Player)
`onUnstarted`: Called when state changes to `unstarted` (usually when video fails to autoplay)
`facebook` | `appId`: Your own [Facebook app ID](https://developers.facebook.com/docs/apps/register#app-id)
`version`: Facebook SDK version
`playerId`: Override player ID for consistent server-side rendering (use with [`react-uid`](https://github.com/thearnica/react-uid))
`soundcloud` | `options`: Override the [default player options](https://developers.soundcloud.com/docs/api/html5-widget#params)
`vimeo` | `playerOptions`: Override the [default params](https://developer.vimeo.com/player/sdk/embed)
diff --git a/index.d.ts b/index.d.ts
index 0e8832a..703fb3a 100644
--- a/index.d.ts
+++ b/index.d.ts
@@ -20,6 +20,7 @@ export interface SoundCloudConfig {
export interface YouTubeConfig {
playerVars?: Object;
embedOptions?: Object;
+ onUnstarted?(): void;
}
export interface FacebookConfig {
diff --git a/src/players/YouTube.js b/src/players/YouTube.js
index 612f14a..af67324 100644
--- a/src/players/YouTube.js
+++ b/src/players/YouTube.js
@@ -85,9 +85,11 @@ export default class YouTube extends Component {
}, onError)
}
- onStateChange = ({ data }) => {
- const { onPlay, onPause, onBuffer, onBufferEnd, onEnded, onReady, loop, config: { playerVars } } = this.props
- const { PLAYING, PAUSED, BUFFERING, ENDED, CUED } = window[SDK_GLOBAL].PlayerState
+ onStateChange = (event) => {
+ const { data } = event
+ const { onPlay, onPause, onBuffer, onBufferEnd, onEnded, onReady, loop, config: { playerVars, onUnstarted } } = this.props
+ const { UNSTARTED, PLAYING, PAUSED, BUFFERING, ENDED, CUED } = window[SDK_GLOBAL].PlayerState
+ if (data === UNSTARTED) onUnstarted()
if (data === PLAYING) {
onPlay()
onBufferEnd()
diff --git a/src/props.js b/src/props.js
index 1cdd47e..e313273 100644
--- a/src/props.js
+++ b/src/props.js
@@ -29,7 +29,8 @@ export const propTypes = {
}),
youtube: shape({
playerVars: object,
- embedOptions: object
+ embedOptions: object,
+ onUnstarted: func
}),
facebook: shape({
appId: string,
@@ -82,6 +83,8 @@ export const propTypes = {
onDisablePIP: func
}
+const noop = () => {}
+
export const defaultProps = {
playing: false,
loop: false,
@@ -117,7 +120,8 @@ export const defaultProps = {
iv_load_policy: 3,
modestbranding: 1
},
- embedOptions: {}
+ embedOptions: {},
+ onUnstarted: noop
},
facebook: {
appId: '1309697205772819',
@@ -165,17 +169,17 @@ export const defaultProps = {
options: {}
}
},
- onReady: function () {},
- onStart: function () {},
- onPlay: function () {},
- onPause: function () {},
- onBuffer: function () {},
- onBufferEnd: function () {},
- onEnded: function () {},
- onError: function () {},
- onDuration: function () {},
- onSeek: function () {},
- onProgress: function () {},
- onEnablePIP: function () {},
- onDisablePIP: function () {}
+ onReady: noop,
+ onStart: noop,
+ onPlay: noop,
+ onPause: noop,
+ onBuffer: noop,
+ onBufferEnd: noop,
+ onEnded: noop,
+ onError: noop,
+ onDuration: noop,
+ onSeek: noop,
+ onProgress: noop,
+ onEnablePIP: noop,
+ onDisablePIP: noop
}