diff --git a/README.md b/README.md index 0e3cefd..17bb68c 100644 --- a/README.md +++ b/README.md @@ -87,6 +87,7 @@ Prop | Description | Default `className` | Pass in a `className` to set on the root element `style` | Add [inline styles](https://facebook.github.io/react/tips/inline-styles.html) to the root element `progressFrequency` | The time between `onProgress` callbacks, in milliseconds | `1000` +`playsinline` | Applies the `playsinline` attribute where supported | `false` #### Callback props diff --git a/src/players/FilePlayer.js b/src/players/FilePlayer.js index 0507aac..8de60e1 100644 --- a/src/players/FilePlayer.js +++ b/src/players/FilePlayer.js @@ -10,7 +10,7 @@ export default class FilePlayer extends Base { return true } componentDidMount () { - const { onPause, onEnded, onError } = this.props + const { playsinline, onPause, onEnded, onError } = this.props this.player.addEventListener('canplay', this.onReady) this.player.addEventListener('play', this.onPlay) this.player.addEventListener('pause', () => { @@ -20,7 +20,10 @@ export default class FilePlayer extends Base { }) this.player.addEventListener('ended', onEnded) this.player.addEventListener('error', onError) - this.player.setAttribute('webkit-playsinline', '') + if (playsinline) { + this.player.setAttribute('playsinline', '') + this.player.setAttribute('webkit-playsinline', '') + } super.componentDidMount() } componentWillUnmount () { diff --git a/src/players/YouTube.js b/src/players/YouTube.js index 86c8023..bca57bd 100644 --- a/src/players/YouTube.js +++ b/src/players/YouTube.js @@ -46,7 +46,7 @@ export default class YouTube extends Base { }) } load (url) { - const { controls, youtubeConfig, onError } = this.props + const { playsinline, controls, youtubeConfig, onError } = this.props const id = url && url.match(MATCH_URL)[1] if (this.isReady) { this.player.cueVideoById({ @@ -70,6 +70,7 @@ export default class YouTube extends Base { controls: controls ? 1 : 0, start: parseStartTime(url), origin: window.location.origin, + playsinline: playsinline, ...youtubeConfig.playerVars }, events: { diff --git a/src/props.js b/src/props.js index 64ee850..ef43f06 100644 --- a/src/props.js +++ b/src/props.js @@ -15,6 +15,7 @@ export const propTypes = { className: string, style: object, progressFrequency: number, + playsinline: bool, soundcloudConfig: shape({ clientId: string, showArtwork: bool @@ -51,6 +52,7 @@ export const defaultProps = { height: 360, hidden: false, progressFrequency: 1000, + playsinline: false, soundcloudConfig: { clientId: 'e8b6f84fbcad14c301ca1355cae1dea2', showArtwork: true