(function($) {
	$.fn.vp1_html5_Video = function(options) {
		//fullscreen vars
		//video
		var videoIsFullScreen=false;
	    var videoOrigWidth;
		var videoOrigHeight;
		var videoOrigPosition;
		var videoOrigLeft;
		var videoOrigRight;
		//video container
	    var videoContainerOrigWidth;
		var videoContainerOrigHeight;		
		var videoContainerOrigPosition;
		var videoContainerOrigLeft;
		var videoContainerOrigRight;
		//controllers
		var videoControllersOrigPosition;
		var videoControllersOrigBottom;
		//info
		var infoBoxAdjust=40;
		var infoBoxOrigPosition;
		
		//timer
		var curTime;
		var totalTime;		
		
		// the skins		
		var skins = {
			skin: 'futuristicElectricBlue',
			initialVolume:1,
			showInfo: true,
			seekBarAdjust:255,
			movieTitle: '',
			movieDesc: ''
		};
		var options = $.extend(skins, options);

		return this.each(function() {
			var $vp1_html5_Video = $(this);
			
			//the controllers
			var $video_wrap = $('<div></div>').addClass('vp1_html5').addClass(options.skin);
			var $vp1_html5_controls = $('<div class="VideoControls"><a class="VideoRewind" title="Rewind"></a><a class="VideoPlay" title="Play/Pause"></a><div class="VideoBuffer"></div><div class="VideoSeek"></div><a class="VideoInfoBut" title="Info"></a><div class="VideoTimer">00:00</div><div class="VolumeAll"><div class="VolumeSlider"></div><a class="VolumeButton" title="Mute/Unmute"></a></div><a class="VideoFullScreen" title="FullScreen"></a></div> <div class="VideoInfoBox"><div class="scrollbar"><div class="track"><div class="thumb"><div class="end"></div></div></div></div></div>');						
			$vp1_html5_Video.wrap($video_wrap);
			$vp1_html5_Video.after($vp1_html5_controls);
			
			//the elements
			var $vp1_html5_container = $vp1_html5_Video.parent('.vp1_html5');
			var $vp1_html5_controls = $('.VideoControls', $vp1_html5_container);
			var $vp1_html5_info_box = $('.VideoInfoBox', $vp1_html5_container);
			var $vp1_html5_rewind_btn = $('.VideoRewind', $vp1_html5_container);
			var $vp1_html5_play_btn = $('.VideoPlay', $vp1_html5_container);
			var $vp1_html5_video_buffer = $('.VideoBuffer', $vp1_html5_container);
			var $vp1_html5_video_seek = $('.VideoSeek', $vp1_html5_container);
			var $vp1_html5_info_btn = $('.VideoInfoBut', $vp1_html5_container);
			if (!options.showInfo)
				$vp1_html5_info_btn.addClass("hideElement");
			var $vp1_html5_video_timer = $('.VideoTimer', $vp1_html5_container);
			var $vp1_html5_volumeAll = $('.VolumeAll', $vp1_html5_container);
			var $vp1_html5_volume = $('.VolumeSlider', $vp1_html5_container);
			var $vp1_html5_volume_btn = $('.VolumeButton', $vp1_html5_container);
			var $vp1_html5_fullscreen_btn = $('.VideoFullScreen', $vp1_html5_container);
			
			//set seekbar width
			$vp1_html5_video_seek.css( 'width', $vp1_html5_Video[0].offsetWidth-options.seekBarAdjust + 'px');
			$vp1_html5_video_buffer.css( 'width', $vp1_html5_video_seek.css( 'width'));
			
			//set info box
			$vp1_html5_info_box.css( 'width', $vp1_html5_Video[0].offsetWidth-infoBoxAdjust + 'px');
			$vp1_html5_info_box.html( '<p class="movieTitle">'+options.movieTitle+'</p><p class="movieDesc">'+options.movieDesc+'</p>');
			
			
			$vp1_html5_controls.hide(); // the controls are still hidden
			
			/* rewind */
			$vp1_html5_rewind_btn.click(function() {
				$vp1_html5_Video.attr("currentTime",0);
				$vp1_html5_Video[0].play();				
			});
			/* play/pause*/			
			var vp1_html5_PlayPause = function() {
				if($vp1_html5_Video.attr('paused') == false) {
					$vp1_html5_Video[0].pause();					
				} else {					
					$vp1_html5_Video[0].play();				
				}
			};
			
			$vp1_html5_play_btn.click(vp1_html5_PlayPause);
			$vp1_html5_Video.click(vp1_html5_PlayPause);
			
			$vp1_html5_Video.bind('play', function() {
				$vp1_html5_play_btn.addClass('VideoPause');
			});
			
			$vp1_html5_Video.bind('pause', function() {
				$vp1_html5_play_btn.removeClass('VideoPause');
			});
			
			$vp1_html5_Video.bind('ended', function() {
				$vp1_html5_play_btn.removeClass('VideoPause');
			});
		
			
			
			//show controllers on mouser over / hide controllers on mouse out
			$vp1_html5_container.mouseover(function() {
				$vp1_html5_controls.show();
			});
			$vp1_html5_container.mouseout(function() {
				if ($vp1_html5_volumeAll.css('height').substring(0, $vp1_html5_volumeAll.css('height').length-2) < 120) {
					$vp1_html5_controls.hide();
				}
			});		
			//play/pause using spacebar
			$vp1_html5_container.keydown(function(evt) {
    			if (evt.keyCode == 32) 
					vp1_html5_PlayPause();
    		});	
			//fullscreen
			var fullScreenOn = function(){
			  videoIsFullScreen = true;
			  //change button
			  $vp1_html5_fullscreen_btn.removeClass('VideoFullScreen');
			  $vp1_html5_fullscreen_btn.addClass('VideoFullScreenIn');
			  //preserve original/nonFullScreen values
			  videoOrigWidth = $vp1_html5_Video[0].offsetWidth;
			  videoOrigHeight = $vp1_html5_Video[0].offsetHeight;
			  videoOrigPosition = $vp1_html5_Video.css( 'position');
			  videoOrigLeft = $vp1_html5_Video.css( 'left');
			  videoOrigRight = $vp1_html5_Video.css( 'right');
			  
			  videoContainerOrigWidth = $vp1_html5_container[0].offsetWidth;
			  videoContainerOrigHeight = $vp1_html5_container[0].offsetHeight;		  
			  videoContainerOrigPosition = $vp1_html5_container.css( 'position');
			  videoContainerOrigLeft = $vp1_html5_container.css( 'left');
			  videoContainerOrigRight = $vp1_html5_container.css( 'right');
			  videoControllersOrigPosition = $vp1_html5_controls.css( 'position');
			  videoControllersOrigBottom = $vp1_html5_controls.css( 'bottom');
			  
			  infoBoxOrigPosition=$vp1_html5_info_box.css( 'position');

			  
			  $("body").css("overflow", "hidden");
			  $(".vp1_html5").css('display','none');
			  $vp1_html5_container.css('display','block');

			  //video
			  $vp1_html5_Video.css( 'position', 'fixed' );
			  $vp1_html5_Video.css( 'width', window.innerWidth + "px" );
			  $vp1_html5_Video.css( 'height', window.innerHeight + "px" );
			  $vp1_html5_Video.css( 'top', 0 );			  
			  $vp1_html5_Video.css( 'left', 0 );
			  //container
			  $vp1_html5_container.css( 'position', 'absolute' );
			  //$vp1_html5_container.css( 'width', window.innerWidth + "px" );
			  //$vp1_html5_container.css( 'height', window.innerWidth + "px" );
			  $vp1_html5_container.css( 'width', "100%" );
			  $vp1_html5_container.css( 'height', "20000px" );			  
			  $vp1_html5_container.css( 'top', 0 );			  
			  $vp1_html5_container.css( 'left', 0 );
			  //controller
			  $vp1_html5_controls.css( 'position', 'fixed');
			  $vp1_html5_controls.css( 'bottom', videoControllersOrigBottom);
			  $vp1_html5_video_seek.css( 'width', window.innerWidth-options.seekBarAdjust + 'px');
			  $vp1_html5_video_buffer.css( 'width', $vp1_html5_video_seek.css( 'width'));
			  //info box
			  $vp1_html5_info_box.css( 'width', window.innerWidth-infoBoxAdjust + 'px');
			  $vp1_html5_info_box.css( 'position', 'fixed');
			  

			}	
			var fullScreenOff = function(){
			  videoIsFullScreen = false;
			  
			  //change button
			  $vp1_html5_fullscreen_btn.removeClass('VideoFullScreenIn');
			  $vp1_html5_fullscreen_btn.addClass('VideoFullScreen');			  
			  
			  $("body").css("overflow", "auto");
			  $(".vp1_html5").css('display','block');
			  
			  //video
			  $vp1_html5_Video.css( 'position', videoOrigPosition );
			  $vp1_html5_Video.css( 'width', videoOrigWidth + "px" );
			  $vp1_html5_Video.css( 'height', videoOrigHeight + "px" );
			  $vp1_html5_Video.css( 'top', videoOrigLeft );			  
			  $vp1_html5_Video.css( 'left', videoOrigRight );
			  //container
			  $vp1_html5_container.css( 'position', videoContainerOrigPosition );
			  $vp1_html5_container.css( 'width', videoContainerOrigWidth + "px" );
			  $vp1_html5_container.css( 'height', videoContainerOrigHeight + "px" );
			  $vp1_html5_container.css( 'top', videoContainerOrigLeft );			  
			  $vp1_html5_container.css( 'left', videoContainerOrigRight );
			  //controllers
			  $vp1_html5_controls.css( 'position', videoControllersOrigPosition);
			  $vp1_html5_controls.css( 'bottom', videoControllersOrigBottom);
			  $vp1_html5_video_seek.css( 'width', $vp1_html5_Video[0].offsetWidth-options.seekBarAdjust + 'px');
			  $vp1_html5_video_buffer.css( 'width', $vp1_html5_video_seek.css( 'width'));
			  //info box
			  $vp1_html5_info_box.css( 'width', videoContainerOrigWidth-infoBoxAdjust + 'px');
			  $vp1_html5_info_box.css( 'position', infoBoxOrigPosition);
			  
			}
			


			var handleFullScreen = function(){
				if (!videoIsFullScreen) {
					fullScreenOn();
				} else {
					fullScreenOff();
				}
			}
			
			$vp1_html5_container.dblclick(function() {
			  handleFullScreen();
			});			
			
			$vp1_html5_fullscreen_btn.click(function() {
			  handleFullScreen();
			});			
			
			
			// timer mouse over
			var is_overTimer=false;
			$vp1_html5_video_timer.mouseover(function() {
				is_overTimer=true;
				curTime = $vp1_html5_Video.attr('currentTime');
				totalTime = $vp1_html5_Video.attr('duration');					
				$vp1_html5_video_timer.text('-'+vp1_html5_FormatTime(totalTime-curTime));
			});	
			$vp1_html5_video_timer.mouseout(function() {
				is_overTimer=false;
				curTime = $vp1_html5_Video.attr('currentTime');
				totalTime = $vp1_html5_Video.attr('duration');					
				$vp1_html5_video_timer.text(vp1_html5_FormatTime(curTime));
			});				

			

			
			var is_seeking=false;			
			var generate_seekBar = function() {
				if($vp1_html5_Video.attr('readyState')) {
					totalTime = $vp1_html5_Video.attr('duration');
					$vp1_html5_video_seek.slider({
						value: 0,
						step: 0.01,
						orientation: "horizontal",
						range: "min",
						max: totalTime,
						animate: true,					
						slide: function(){							
							is_seeking = true;
						},
						stop:function(e,ui){
							is_seeking = false;						
							$vp1_html5_Video.attr("currentTime",ui.value);
						}
					});
					
					
					var bufferedTime=0;
					$vp1_html5_video_buffer.progressbar({ 
						value: bufferedTime
					});
					
					$vp1_html5_Video.bind('progress', function() {
						//alert($vp1_html5_Video.attr("buffered").end($vp1_html5_Video.attr("buffered").length-1));
						bufferedTime = $vp1_html5_Video.attr("buffered").end($vp1_html5_Video.attr("buffered").length-1); 
						//alert (bufferedTime);
						if (bufferedTime>0) {
							$vp1_html5_video_buffer.progressbar({ value: bufferedTime*$vp1_html5_video_buffer.css( 'width' ).substring(0, $vp1_html5_video_buffer.css( 'width' ).length-2)/totalTime });
						}
					});						

					$vp1_html5_controls.show();
				} else {
					setTimeout(generate_seekBar, 200);
				}
			};

			generate_seekBar();
		
			var vp1_html5_FormatTime=function(seconds){
				var m=Math.floor(seconds/60)<10?"0"+Math.floor(seconds/60):Math.floor(seconds/60);
				var s=Math.floor(seconds-(m*60))<10?"0"+Math.floor(seconds-(m*60)):Math.floor(seconds-(m*60));
				return m+":"+s;
			};
			
			var seekUpdate = function() {
				curTime = $vp1_html5_Video.attr('currentTime');
				totalTime = $vp1_html5_Video.attr('duration');
				if(!is_seeking) $vp1_html5_video_seek.slider('value', curTime);
				if (!is_overTimer)
					$vp1_html5_video_timer.text(vp1_html5_FormatTime(curTime));
				else
					$vp1_html5_video_timer.text('-'+vp1_html5_FormatTime(totalTime-curTime));
			};
			
			$vp1_html5_Video.bind('timeupdate', seekUpdate);
			
			//info
			//var $vp1_html5_info_btn = $('.VideoInfoBut', $vp1_html5_container);
			$vp1_html5_info_btn.click(function() {
				if (options.skin=="giant") {
					if ($vp1_html5_info_box.css("display")=="none")
						$vp1_html5_info_box.fadeIn();
					else
						$vp1_html5_info_box.fadeOut();	
				} else { 
					$vp1_html5_info_box.slideToggle(300);
				}
			});
	
		
			
			var vp1_html5_VolumeValue = 1;
			$vp1_html5_volume.slider({
				value: options.initialVolume,
				orientation: "vertical",
				range: "min",
				max: 1,
				step: 0.05,
				animate: true,
				slide:function(e,ui){
						$vp1_html5_Video.attr('muted',false);
						vp1_html5_VolumeValue = ui.value;
						$vp1_html5_Video.attr('volume',ui.value);
					}
			});
			$vp1_html5_Video.attr('volume',options.initialVolume);
			
			var muteVolume = function() {
				if($vp1_html5_Video.attr('muted')==true) {
					$vp1_html5_Video.attr('muted', false);
					$vp1_html5_volume.slider('value', vp1_html5_VolumeValue);
					
					$vp1_html5_volume_btn.removeClass('VolumeButtonMute');
					$vp1_html5_volume_btn.addClass('VolumeButton');					
				} else {
					$vp1_html5_Video.attr('muted', true);
					$vp1_html5_volume.slider('value', '0');
					
					$vp1_html5_volume_btn.removeClass('VolumeButton');
					$vp1_html5_volume_btn.addClass('VolumeButtonMute');
				};
			};
			
			$vp1_html5_volume_btn.click(muteVolume);
			
			$vp1_html5_Video.removeAttr('controls');
			
		});
	};

	//
	// plugin skins
	//
	$.fn.vp1_html5_Video.skins = {		
	};

})(jQuery);

