riorganizzazione files, gestione id videoplayer e videoinfo

src/VideoPlayer.js

@@ -1,5 +1,6 @@
 import React, { Component } from 'react'; // eslint-disable-line no-unused-vars
 import YouTube from 'react-youtube'; // eslint-disable-line no-unused-vars
+import { stringify } from 'querystring';
 /* eslint no-console: ["error", { allow: ["info", "error"] }] */
 
 class VideoPlayer extends Component {
@@ -14,21 +15,35 @@ class VideoPlayer extends Component {
 					autoplay: 0,
 					modestbranding: 1
 				}
-			}
+			},
+			videoId: '0J2QdDbelmY'
 		};
 	}
+	componentWillUpdate(nextProps, nextState){
+		if(nextProps.match.params.id === this.props.match.params.id){}
+		else{
+			this.setState((state, props) => { return { videoId: props.match.params.id  }});
+		}
+
+	}
+
+	componentDidMount(){
+		if(this.props.match.params.id)
+			this.setState((state, props) => { return { videoId: props.match.params.id  }});
+			
+	}
 
 	render() {
 		return (
 			<React.Fragment>
 				<YouTube
 					opts={this.state.opt}
-					videoId={
-						this.props.match.params.id ? this.props.match.params.id : '3AVWJzHvhFE' // or null
-					}
+					// this.props.match.params.id 
+					videoId={this.state.videoId} 
 					onReady={this._onReady}
 					onPlay={this._onPlay}
 					onError={this._onError}
+					onStateChange={this._onStateChange}
 					className="embed-responsive-item"
 					containerClassName="embed-responsive embed-responsive-16by9"
 				/>
@@ -40,16 +55,23 @@ class VideoPlayer extends Component {
 		// console.error(event);
 	}
 	_onPlay(event) {
-		console.info('on play',event.target.getDuration(), event);
+		// console.info('on play',event.target.getCurrentTime(), event);
+		// console.info(event.target.getApiInterface());
 		// console.warn(event.target.getDuration());
+		// console.info('go');
+		// while(event.target.getCurrentTime() < 15){}
+		// console.info(event.target.getCurrentTime());
 	}
 	_onReady(event) {
 		// access to player in all event handlers via event.target
-		//event.target.pauseVideo();
-		console.info('on ready', event);
+		// event.target.pauseVideo();
+		// console.info('on ready', event);
 		// console.warn(event);
 		// console.warn(event.target.getDuration());
 	}
+	_onStateChange(event) {
+		// console.info('statechange: ', event)
+	}
 }
 
 export default VideoPlayer;