diff --git a/src/ReactPlayer.js b/src/ReactPlayer.js
index db2fbfcd..9ed8a586 100644
--- a/src/ReactPlayer.js
+++ b/src/ReactPlayer.js
@@ -79,7 +79,7 @@ export default class ReactPlayer extends Component {
}
renderPlayers () {
// Build array of players to render based on URL and preload config
- const { url, youtubeConfig, vimeoConfig } = this.props
+ const { url, youtubeConfig, vimeoConfig, dailymotionConfig } = this.props
const players = []
if (YouTube.canPlay(url)) {
players.push(YouTube)
@@ -108,6 +108,9 @@ export default class ReactPlayer extends Component {
if (!Vimeo.canPlay(url) && vimeoConfig.preload) {
players.push(Vimeo)
}
+ if (!DailyMotion.canPlay(url) && dailymotionConfig.preload) {
+ players.push(DailyMotion)
+ }
return players.map(this.renderPlayer)
}
ref = player => {
@@ -115,7 +118,7 @@ export default class ReactPlayer extends Component {
}
renderPlayer = Player => {
const active = Player.canPlay(this.props.url)
- const { youtubeConfig, vimeoConfig, ...activeProps } = this.props
+ const { youtubeConfig, vimeoConfig, dailymotionConfig, ...activeProps } = this.props
const props = active ? { ...activeProps, ref: this.ref } : {}
// Only youtube and vimeo config passed to
// inactive players due to preload behaviour
@@ -124,6 +127,7 @@ export default class ReactPlayer extends Component {
key={Player.displayName}
youtubeConfig={youtubeConfig}
vimeoConfig={vimeoConfig}
+ dailymotionConfig={dailymotionConfig}
{...props}
/>
)
diff --git a/src/demo/App.js b/src/demo/App.js
index 92d50932..e2f006e0 100644
--- a/src/demo/App.js
+++ b/src/demo/App.js
@@ -168,13 +168,6 @@ export default class App extends Component {
{this.renderLoadButton('https://www.youtube.com/watch?v=jNgP6d9HraI', 'Test B')}
-
- DailyMotion |
-
- {this.renderLoadButton('http://www.dailymotion.com/video/x522udb', 'Test A')}
- {this.renderLoadButton('http://www.dailymotion.com/video/x2hzs96_feast-2015-oscar-winning-short-movie-full-length-hd_shortfilms', 'Test B')}
- |
-
SoundCloud |
@@ -217,6 +210,13 @@ export default class App extends Component {
{this.renderLoadButton('https://home.wistia.com/medias/29b0fbf547', 'Test B')}
|
+
+ DailyMotion |
+
+ {this.renderLoadButton('http://www.dailymotion.com/video/x26m1j4_wildlife_animals', 'Test A')}
+ {this.renderLoadButton('http://www.dailymotion.com/video/x26ezj5', 'Test B')}
+ |
+
Files |
diff --git a/src/players/DailyMotion.js b/src/players/DailyMotion.js
index 6f626b27..e2efc051 100644
--- a/src/players/DailyMotion.js
+++ b/src/players/DailyMotion.js
@@ -45,24 +45,14 @@ export default class DailyMotion extends Base {
})
})
}
-
parseId (url) {
- if (url) {
- const m = url.match(MATCH_URL)
- if (m !== null) {
- if (m[4] !== undefined) {
- return m[4]
- }
- return m[2]
- }
- }
- return null
+ const m = url.match(MATCH_URL)
+ return m[4] || m[2]
}
-
load (url) {
const { controls, dailymotionConfig, onError, playing } = this.props
const id = this.parseId(url)
- if (this.isReady) {
+ if (this.player) {
this.player.load(id, {
start: parseStartTime(url),
autoplay: playing
@@ -75,8 +65,8 @@ export default class DailyMotion extends Base {
}
this.loadingSDK = true
this.getSDK().then(DM => {
- // eslint-disable-next-line new-cap
- this.player = new DM.player(this.container, {
+ const Player = DM.player
+ this.player = new Player(this.container, {
width: '100%',
height: '100%',
video: id,
@@ -84,9 +74,9 @@ export default class DailyMotion extends Base {
...DEFAULT_PLAYER_VARS,
controls: controls,
autoplay: this.props.playing,
- ...dailymotionConfig.params,
start: parseStartTime(url),
- origin: window.location.origin
+ origin: window.location.origin,
+ ...dailymotionConfig.params
},
events: {
apiready: () => {
@@ -108,7 +98,6 @@ export default class DailyMotion extends Base {
const duration = this.getDuration()
onDuration(duration)
}
-
onEnded = () => {
const { loop, onEnded } = this.props
if (loop) {
@@ -125,9 +114,7 @@ export default class DailyMotion extends Base {
this.player.pause()
}
stop () {
- if (!this.isReady || !this.player.pause) return
- this.player.pause()
- this.onEnded()
+ // Nothing to do
}
seekTo (fraction) {
super.seekTo(fraction)
@@ -138,6 +125,9 @@ export default class DailyMotion extends Base {
if (!this.isReady || !this.player.setVolume) return
this.player.setVolume(fraction)
}
+ setPlaybackRate () {
+ return null
+ }
getDuration () {
if (!this.isReady || !this.player.duration) return null
return this.player.duration
@@ -147,8 +137,8 @@ export default class DailyMotion extends Base {
return this.player.currentTime / this.getDuration()
}
getFractionLoaded () {
- if (!this.isReady || !this.player.bufferedTime) return null
- return this.player.bufferedTime
+ if (!this.isReady || !this.getDuration() || !this.player.bufferedTime) return null
+ return this.player.bufferedTime / this.getDuration()
}
ref = container => {
this.container = container
@@ -157,6 +147,7 @@ export default class DailyMotion extends Base {
const style = {
width: '100%',
height: '100%',
+ backgroundColor: 'black',
display: this.props.url ? 'block' : 'none'
}
return (
|