var supports_video	=	true; // This variable is to check whether video tag events is supported by browser.
var video1	=	"videos/first";
var video2	=	"videos/second";
//var video2	=	"videos/movie";

var playing	=	2;

$(document).ready(function(){
	$("#video1Id").click(function(){
		playVideo(1);
	});
	$("#video2Id").click(function(){
		playVideo(2);
	});
	$("#playBtn").click(function(){
		playVideo(1);
	});
	if(isIphoneOnly==1){
		//playVideo(1);
	}
	
});



function playVideo(videoId) {
  if((videoId==0)&&(playing==2)){ // Check whether second video is completed
  	videoFinished();
  }else{	// This will execute on fistvideo completed/User clicks on any video
  	  document.getElementById("initialArea").style.display="none";
  	  if(videoId==0){
		 videoId	=	2;
	  }
	  
	  if(isIphoneOnly==0){
		  videoLoading();
		  var video = document.getElementById('myVideo');
		  var videoTmp	=	video1;
		  if(videoId==1){
				videoTmp	=	video1;
		  }else if(videoId==2){
				videoTmp	=	video2;
		  }
		  
		  video.setAttribute('src', videoTmp+".mp4");
		  if(isIphone!=1){
				video.setAttribute('src', videoTmp+".ogv");
		  }
		  video.play();
	  }else{
		  readyToPlay();
		  
		  var visVideo	=	"myVideoIPhone1";
		  var inVisVideo	=	"myVideoIPhone2";
		  
		  if(videoId==1){
			  visVideo	=	"myVideoIPhone1";
		  	  inVisVideo	=	"myVideoIPhone2";	  
		  }else{
			  visVideo	=	"myVideoIPhone2";
		  	  inVisVideo	=	"myVideoIPhone1";
		  }
		  
		  document.getElementById(visVideo).style.display="block";
		  document.getElementById(inVisVideo).style.display="none";		
		  
		  var videoIPhone = document.getElementById(visVideo);
		  //videoIPhone.play();
	  }
	  
	  playing	=	videoId;
		
	  if(videoId==1){
			document.getElementById("video2Id").setAttribute("class", "secondNonPlaying");
			document.getElementById("video1Id").setAttribute("class", "firstPlaying");
	  }else if(videoId==2){
			document.getElementById("video2Id").setAttribute("class", "secondPlaying");
			document.getElementById("video1Id").setAttribute("class", "firstNonPlaying");
	  }
  }

}

function playNxtVideo(){
	playVideo(0);
}

function videoFinished(){
	document.getElementById("initialArea").style.display="block";
	document.getElementById("videoArea").style.display="none";
}

function readyToPlay(){ // Video is ready for play
	document.getElementById("contentArea").style.display="none";
	document.getElementById("videoArea").style.display="block";
}

function videoLoading(){ // Video is loading..... Showing load button
	document.getElementById("contentArea").style.display="block";
	document.getElementById("videoArea").style.display="none";
}

window.onload=function() {
	  if (supports_video) {
		    if(isIphoneOnly==0){
				var video = document.getElementById('myVideo'); // not sure how IE8 gets to this line, but it does
				// Event on first video completed. This is used to switch to second video when the first video is completed
				if (video && video.addEventListener) video.addEventListener('ended',playNxtVideo, false);
				//else playSecond(); // IE8 peculiarity.
				
				// Event to show loading button before video loads
				if (video && video.addEventListener) video.addEventListener('canplay',readyToPlay,false);
			}else{
				var video = document.getElementById('myVideoIPhone1'); // not sure how IE8 gets to this line, but it does
			}

	  }

}