diff --git a/src/routes/Player/Player.js b/src/routes/Player/Player.js index d5ea12de7..64596ce91 100644 --- a/src/routes/Player/Player.js +++ b/src/routes/Player/Player.js @@ -1,4 +1,5 @@ import React, { Component, Fragment } from 'react'; +import PropTypes from 'prop-types'; import Video from './Video'; import ControlBar from './ControlBar'; import styles from './styles'; @@ -13,7 +14,8 @@ class Player extends Component { paused: null, time: null, duration: null, - volume: null + volume: null, + subtitles: null }; } @@ -21,7 +23,19 @@ class Player extends Component { return nextState.paused !== this.state.paused || nextState.time !== this.state.time || nextState.duration !== this.state.duration || - nextState.volume !== this.state.volume; + nextState.volume !== this.state.volume || + nextState.subtitles !== this.state.subtitles; + } + + componentDidMount() { + this.addExtraSubtitles([ + { + id: 'id1', + url: 'https://raw.githubusercontent.com/amzn/web-app-starter-kit-for-fire-tv/master/out/mrss/assets/sample_video-en.vtt', + label: 'English (Github)', + language: 'en' + } + ]); } onEnded = () => { @@ -58,10 +72,6 @@ class Player extends Component { this.videoRef.current && this.videoRef.current.dispatch('setProp', 'paused', true); } - stop = () => { - this.videoRef.current && this.videoRef.current.dispatch('command', 'stop'); - } - setTime = (time) => { this.videoRef.current && this.videoRef.current.dispatch('setProp', 'time', time); } @@ -70,12 +80,21 @@ class Player extends Component { this.videoRef.current && this.videoRef.current.dispatch('setProp', 'volume', volume); } + addExtraSubtitles = (subtitles) => { + this.videoRef.current && this.videoRef.current.dispatch('command', 'addExtraSubtitles', subtitles); + } + + stop = () => { + this.videoRef.current && this.videoRef.current.dispatch('command', 'stop'); + } + renderVideo() { return (