Add config.facebook.attributes

Fixes cookpete/react-player#1071

README.md

@@ -140,7 +140,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)<br />`embedOptions`: Override the [default embed options](https://developers.google.com/youtube/iframe_api_reference#Loading_a_Video_Player)<br />`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)<br />`version`: Facebook SDK version<br />`playerId`: Override player ID for consistent server-side rendering (use with [`react-uid`](https://github.com/thearnica/react-uid))
+`facebook` | `appId`: Your own [Facebook app ID](https://developers.facebook.com/docs/apps/register#app-id)<br />`version`: Facebook SDK version<br />`playerId`: Override player ID for consistent server-side rendering (use with [`react-uid`](https://github.com/thearnica/react-uid))<br />`attributes`: Extra data attributes to pass to the `fb-video` element
 `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)
 `wistia` | `options`: Override the [default player options](https://wistia.com/doc/embed-options#options_list)<br />`playerId`: Override player ID for consistent server-side rendering (use with [`react-uid`](https://github.com/thearnica/react-uid))

src/players/Facebook.js

@@ -99,6 +99,7 @@ export default class Facebook extends Component {
   }
 
   render () {
+    const { attributes } = this.props.config
     const style = {
       width: '100%',
       height: '100%'
@@ -112,6 +113,7 @@ export default class Facebook extends Component {
         data-autoplay={this.props.playing ? 'true' : 'false'}
         data-allowfullscreen='true'
         data-controls={this.props.controls ? 'true' : 'false'}
+        {...attributes}
       />
     )
   }

src/props.js

@@ -36,7 +36,8 @@ export const propTypes = {
     facebook: shape({
       appId: string,
       version: string,
-      playerId: string
+      playerId: string,
+      attributes: object
     }),
     dailymotion: shape({
       params: object
@@ -131,7 +132,8 @@ export const defaultProps = {
     facebook: {
       appId: '1309697205772819',
       version: 'v3.3',
-      playerId: null
+      playerId: null,
+      attributes: {}
     },
     dailymotion: {
       params: {