video

src/components/video/index.js

@@ -25,7 +25,7 @@ class Video extends Component {
     state = {
         title: '',
         courseId: null,
-        video_catalog: [],
+        videoList: [],
         datum: [],
         currentVideoSrc: '',
         activeIndex: 0,
@@ -42,8 +42,9 @@ class Video extends Component {
         this.setState({
             courseId: this.courseID
         })
-        this.getVideoCatalog()
+        this.getVideoList()
         this.getDatumCatalog()
+
     }
 
     initializePlayer = () => {
@@ -54,10 +55,13 @@ class Video extends Component {
             bigPlayButton: true,
             textTrackDisplay: false,
             posterImage: false,
-            errorDisplay: false
+            errorDisplay: false,
+            playbackRates: ['0.75', '1', '1.5', '2']
         })
         this.player.enableTouchActivity()
-
+        this.player.on('useractive', function () {
+            console.log('active');
+        })
     }
 
     componentWillUnmount() {
@@ -69,7 +73,7 @@ class Video extends Component {
 
     handleClick = index => {
         if (this.hasAuth()) {
-            this.setPlayerSrc(this.state.video_catalog[index]['play_url'])
+            this.setPlayerSrc(this.state.videoList[index]['play_url'])
             this.playVideo()
         }
         this.setState({
@@ -78,7 +82,7 @@ class Video extends Component {
     }
 
 
-    getVideoCatalog = () => {
+    getVideoList = () => {
         http.get(`${api.home}/m/course/play/${this.courseID}`)
             .then(res => {
                 const data = res.data
@@ -86,7 +90,7 @@ class Video extends Component {
 
                     this.setState(
                         state => ({
-                            video_catalog: data.data['lessons'],
+                            videoList: data.data['lessons'],
                             currentVideoSrc: data.data['lessons'][state.activeIndex]['play_url'],
                             course: data.data.course,
                             courseId: data.data.course['course_id'],
@@ -149,8 +153,8 @@ class Video extends Component {
     }
 
     lessonAvailable = () => {
-        const {video_catalog, activeIndex} = this.state
-        return video_catalog[activeIndex]['video_size'] !== 0
+        const {videoList, activeIndex} = this.state
+        return videoList[activeIndex]['video_size'] !== 0
     }
 
     getCoursePrice = () => {
@@ -166,16 +170,16 @@ class Video extends Component {
     }
 
     playWithAuth = () => {
-        const {video_catalog, activeIndex} = this.state
+        const {videoList, activeIndex} = this.state
 
         if (this.hasAuth()) {
-            this.setPlayerSrc(video_catalog[activeIndex]['play_url'])
+            this.setPlayerSrc(videoList[activeIndex]['play_url'])
         }
     }
 
     hasAuth = (index) => {
-        const {course, video_catalog, activeIndex} = this.state
-        let lesson = video_catalog[activeIndex]
+        const {course, videoList, activeIndex} = this.state
+        let lesson = videoList[activeIndex]
         if (!lesson['is_free']) {
             if (course['is_audition']) {
                 this.setState({
@@ -205,7 +209,7 @@ class Video extends Component {
 
     render() {
         let {match, location} = this.props
-        const {video_catalog, activeIndex, isAuth, salePrice} = this.state
+        const {videoList, activeIndex, isAuth, salePrice} = this.state
         return (
             <div className='play'>
                 <HeaderBar title={this.state.title} arrow={true}/>
@@ -221,7 +225,7 @@ class Video extends Component {
                                     <div className='btns'>
                                         <button type='button' className='purchase-class'>¥{salePrice} 购买课程</button>
                                         <button type='button'
-                                                className='purchase-episode'>¥{video_catalog.length && video_catalog[activeIndex]['class_price']} 购买单集
+                                                className='purchase-episode'>¥{videoList.length && videoList[activeIndex]['class_price']} 购买单集
                                         </button>
                                     </div>
                                 </div>
@@ -252,7 +256,7 @@ class Video extends Component {
                         return <VideoCatalog
                             activeIndex={this.state.activeIndex}
                             handleClick={this.handleClick}
-                            videoCatalog={this.state.video_catalog}
+                            videoCatalog={this.state.videoList}
                             {...props}/>
                     }}/>
                     <Route path={`${match.path}/datum`} render={props => {