/*
	


//find when loaded

var video = document.getElementById('#example-video-element');
var timer = 0;
video.addEventListener('progress', function (e) {
    if (this.buffered.length > 0) {

        if (timer != 0) {
            clearTimeout(timer);
        }

        timer = setTimeout(function () {            
            if(parseInt(video.buffered.end() / video.duration * 100) == 100) {
                // video has loaded.... 
            };          
        }, 1500);

    }
}, false); 


var videoDuration = $html5Video.attr('duration');

var updateProgressBar = function(){
    if ($html5Video.attr('readyState')) {
        var buffered = $html5Video.attr("buffered").end(0);
        var percent = 100 * buffered / videoDuration;

        //Your code here

        //If finished buffering buffering quit calling it
        if (buffered == videoDuration) {

                clearInterval(this.watchBuffer);
        }
    }
};
var watchBuffer = setInterval(updateProgressBar, 500);


*/
	
(function($) {

	$.videoLivePlaylist = function (settings) {


	var flashReadyInterval = 500;
	var flashReadyIntervalID;

	var trackMediaDataInterval = 50;
	var trackMediaDataIntervalID;
	var windowResizeInterval = 500;//execute resize after time finish
	var previewDisplayEndTimeoutID;//for playlist controls
	var inactivityTimeout =settings.autoHideControlsDelay;//execute resize after time finish
	var inactivityTimeoutID;
	
	var flashPreview = $('#flashPreview');
	var playerWrapper = $('#playerWrapper')
	var mainWrapper = $('#mainWrapper');
	var videoMasker=$('#video_masker');
	var previewWrapper = $('#previewWrapper');
	var videoList = $('#videoList');
	var playlistControls = $('#playlistControls');
	var playlistBackward = $('#playlistBackward');
	var playlistClose = $('#playlistClose');
	var playlistForward = $('#playlistForward');
	var videoControls = $('#videoControls');
	
	var playControl = $('#playControl');
	var titleControl = $('#title_display');
	var fullscreenControl = $('#fullscreenControl');
	var currentTimeDisplay = $('#current_time_display');
	var durationDisplay = $('#duration_display');
	var volumeControl = $('#volumeControl');
	var volumeDisplay= $('#volume_display');
	var playProgressControl = $('#play_progress');
	var loadProgressControl = $('#load_progress');
	var hitProgress=$('#hit_progress');//hit for seekbar
	var playerControls = $('#playerControls');
	var playlistToggle = $('#playlistToggle');
	var infoToggle = $('#infoToggle');
	var progressControl=$('#progressControl');
	var seekbar_bg=$('#seekbar_bg');
	//info
	var infoWrapper=$('#info_wrapper');
	var infoBackground=$('#info_background');
	var infoHolder=$('#info_holder');
	var infoContent=$('#info_content');
	var siteContent=$('#content');
	var playerMain=$('#playerMain');
	var txgcvideopi1=$('.tx-gcvideo-pi1');
	var leftcontent=$('#leftcontent');
	
	
	//xml settings
	var useLivePreview;
	var previewWidth;
	var previewHeight;
	var previewItemBgColor;
	var previewBgColor;
	var mainBgColor;
	var previewItemBgRollOverColor;
	var previewItemTextRollOverColor;
	var previewUpLeftRightPadding;
	var previewDownPadding;
	var playerWidth;
	var playerHeight;
	var numberOfRowsInPlaylist;
	var numberOfColumnsInPlaylist;
	var horizontalPreviewSpacing;
	var verticalPreviewSpacing;
	var autoPlay;
	var defaultVolume;
	var startID;
	var volumeRollOverColor;
	var descriptionLeftBuffer;
	var descriptionRightBuffer;
	var descriptionTopBuffer;
	var descriptionBottomBuffer;
	var descriptionBgColor;
	var descriptionBgAlpha;
	var playlistControlsBottomValue;
	var previewThumbBgColor;
	var cacheBustePreviewVideos;
	var cacheBusteMainVideos;
	var seekbarBgColor;
	var thumbnailPreviewHeight;
				

	var previewVideoOn=false;
	var currentPreviewVideo=null;
	var currentPreviewVideoGet=null;
	
	var gridArr=[];//for box grid
	var boxArr=[];//preview box holders
	
	var vidPreviewArr=[];
	
	var vidPreviewUrlArr=[];
	var vidMainUrlArr=[];
	var vidPosterUrlArr=[];
	var vidThumbUrlArr=[];
	var videoTitleArr=[];
	var videoDescriptionArr=[];
	
	var vorbisSupport = canPlayVorbis();
	var mp4Support = canPlayMP4();
	var webMsupport = canPlayWebM();
	//console.log("vorbisSupport = " + vorbisSupport, "mp4Support = " + mp4Support, "webMsupport = " + webMsupport);
	
	var _noAdvanceControls=false;//less thumbs than rows*column in playlist
	var _startIndex;
	var _endIndex;
	var _playlistLength;
	var boxWidth;
	var boxHeight;
	var fadeInPreviewTime=500;
	var previewTransitionOn=true;//for mouse disabling playlist controls
	var playerTransitionOn=false;//player to playlist and reverse
	var playlistControlsOffOpacity;
	var currentVideo=null;
	var currentVideoGet=null;//currentVideo.get(0)
	var _aspectRatio;//0 (normal), 1(fit inside) or 2(fit outside)
	var componentSize="normal";//normal, fullscreen
	var componentMode="playlist";//player, playlist
	var videoCounter;
	var forcePause=false;
	var seekbarDown=false;
	var introHappened=false;//video inited
	var infoOpened=false;
	var playerOnOffTime=1000;//open close playlist / player
	var playlistHalfHeight;//for controls align in fullscreen
	var infoScrollExist=false;
	var infoInPosition;//info opened top position
	var autoHideControls;
	var videoStarted=false;
	var controlsToggleTime=500;
	var controlsToggleEase="easeOutCubic";
	var posterPlay;
	var poster;
	var singleVideo=false;//if single video
	var titleColor;//for preview rollout
	var volumeBgColor;
	var _lastVolume;//for mute/unmute
	var _muteOn=false;
	var videoPreloader;//preloader for main video
	var activePreviewItem=-1;	
	
	var is_chrome = /chrome/.test( navigator.userAgent.toLowerCase());
	//console.log(is_chrome);
	 
	//var is_safari = ($.browser.safari && /chrome/.test(navigator.userAgent.toLowerCase()) ) ? false : true;
	//console.log(is_safari);
	 
	 //safari - false, true
	 //chrome - true, false
	
	
	
	
	
	initAll();
	
	
	
	
	
	function initAll(){
		 
		 //xml settings
		 previewWidth = settings.previewWidth;
		 previewHeight =settings.previewHeight;
		 thumbnailPreviewHeight = settings.thumbnailPreviewHeight;
		 previewItemBgColor = settings.previewItemBgColor;
		 previewBgColor = settings.previewBgColor;
		 mainBgColor = settings.mainBgColor;
		 previewItemBgRollOverColor= settings.previewItemBgRollOverColor;
		 previewItemTextRollOverColor=settings.previewItemTextRollOverColor;
		 seekbarBgColor=settings.seekbarBgColor;
		 volumeRollOverColor=settings.volumeRollOverColor;
		 previewThumbBgColor=settings.previewThumbBgColor;
		 previewUpLeftRightPadding = settings.previewUpLeftRightPadding;
		 previewDownPadding = settings.previewDownPadding;
		 playerWidth = settings.playerWidth;
		 playerHeight = settings.playerHeight;
		 useLivePreview = settings.useLivePreview;
		 numberOfRowsInPlaylist = settings.numberOfRowsInPlaylist;
		 numberOfColumnsInPlaylist = settings.numberOfColumnsInPlaylist;
		 horizontalPreviewSpacing = settings.horizontalPreviewSpacing;
		 verticalPreviewSpacing = settings.verticalPreviewSpacing;
		 defaultVolume = settings.defaultVolume;
		 startID = settings.startID;
		 playlistControlsOffOpacity = settings.playlistControlsOffOpacity;
		 _aspectRatio = settings.videoAspectRatio;
		 descriptionBgColor = settings.descriptionBgColor;
	  	 descriptionBgAlpha = settings.descriptionBgAlpha;
		 autoHideControls=settings.autoHideControls;
		 playlistControlsBottomValue=settings.playlistControlsBottomValue;
		 cacheBustePreviewVideos = settings.cacheBustePreviewVideos;
	     cacheBusteMainVideos = settings.cacheBusteMainVideos;
	
		//autoplay for ipad, iphone
		var agent = navigator.userAgent;
		if(agent.search("iPhone") == -1 && agent.search("iPad") == -1 && agent.search("iPod") == -1) {
			 autoPlay =settings.autoPlay;
		}else {
			_autoPlay = false;
		}
		
		if(autoPlay) videoStarted=true;
		
		
		//get data
		var playlistList = videoList.find('div');
		_playlistLength = playlistList.length;
		if(_playlistLength==1) singleVideo=true;
		//console.log(_playlistLength, numberOfRowsInPlaylist * numberOfColumnsInPlaylist);
		 if(_playlistLength <= numberOfRowsInPlaylist * numberOfColumnsInPlaylist) {
			 _noAdvanceControls = true;
			 //hide prev forward playlist btns
			 playlistBackward.css('visibility', 'hidden');
			 playlistForward.css('visibility', 'hidden');
		 }
		 
	
	
		var title;
		var description;
		var thumb;
		var poster;
		var preview;
		var main;
		
		$(playlistList).each(function(){  
			
			/*
			console.log($(this).attr('title'));
			console.log($(this).find("p[title='description']").html());
			console.log($(this).find("ul[title='preview']").find("li:eq(0)").attr('title'), $(this).find("ul[title='preview']").find("li:eq(0)").html());
			console.log($(this).find("ul[title='preview']").find("li:eq(1)").attr('title'), $(this).find("ul[title='preview']").find("li:eq(1)").html());
			console.log($(this).find("ul[title='main']").find("li:eq(0)").attr('title'), $(this).find("ul[title='main']").find("li:eq(0)").html());
			console.log($(this).find("ul[title='main']").find("li:eq(1)").attr('title'), $(this).find("ul[title='main']").find("li:eq(1)").html());
			console.log($(this).find("ul[title='thumb']").find("li").attr('title'));
			console.log($(this).find("ul[title='poster']").find("li").attr('title'));
			
			console.log('\n');
			*/
			
			
			title=$(this).attr('title');
			description = $(this).find("p[title='description']").html();
			thumb=$(this).find("ul[title='thumb']").find("li").attr('title')
			poster=$(this).find("ul[title='poster']").find("li").attr('title');
			preview=new Object();
			preview.ogvUrl=$(this).find("ul[title='preview']").find("li:eq(0)").attr('title');
			preview.ogvType= $(this).find("ul[title='preview']").find("li:eq(0)").html();
			preview.mp4Url=$(this).find("ul[title='preview']").find("li:eq(1)").attr('title');
			preview.mp4Type= $(this).find("ul[title='preview']").find("li:eq(1)").html();
			main=new Object();
			main.ogvUrl=$(this).find("ul[title='main']").find("li:eq(0)").attr('title');
			main.ogvType= $(this).find("ul[title='main']").find("li:eq(0)").html();
			main.mp4Url=$(this).find("ul[title='main']").find("li:eq(1)").attr('title');
			main.mp4Type= $(this).find("ul[title='main']").find("li:eq(1)").html();
			
			
			if(description){
				 description = description.replace('&quot;', '');//remove ie7/8 fix
				 description=description.replace("\'\"", "\'");
				}
			
			
			//console.log(description);
			
			vidPreviewUrlArr.push(preview);
		    vidMainUrlArr.push(main);
			vidPosterUrlArr.push(poster);
			vidThumbUrlArr.push(thumb);
			videoTitleArr.push(title);
			videoDescriptionArr.push(description);
	
		});
		
		
		
		//console.log(!!document.createElement('video').canPlayType);
		/*if(1==2) {*/
		if(!!document.createElement('video').canPlayType){
			flashPreview.remove();//remove flash
		}else{
			
			//center flash
			flashPreview.css('width', playerWidth);
			flashPreview.css('height', playerHeight);
			txgcvideopi1.css('height', playerHeight);
			//flashPreview.css('marginLeft', -playerWidth / 2);
			//flashPreview.css('marginTop', -playerHeight /2 );
			//flashPreview.css('left', 50 + '%');
			//flashPreview.css('top', 50 + '%');
			
			//use flash player
			playerWrapper.css('display', 'none');
			flashPreview.css('display', 'block');
			flashReadyIntervalID = setInterval(checkFlashReady, flashReadyInterval);	
			return;
		}
		
		
		
		
	
		//console.log(mainWrapper.css('zIndex'), ", pw = ", previewWrapper.css('zIndex'));
		//fix for video mask overflow hidden doesnt hide video?
		//mainWrapper.css('zIndex', 1);
		//previewWrapper.css('zIndex', 2);
	
	 
		//center player
		playerWrapper.css('width', playerWidth);
		//playerWrapper.css('height', playerHeight+thumbnailPreviewHeight);
		//playerWrapper.css('marginLeft', -playerWidth / 2);
		//playerWrapper.css('marginTop', -playerHeight /2 );
	 	
	 
	   	previewWrapper.css('width', playerWidth);
		previewWrapper.css('height', thumbnailPreviewHeight);
		//previewWrapper.css('background', previewBgColor);
		
		mainWrapper.css('width', playerWidth);
		mainWrapper.css('height', playerHeight);
		mainWrapper.css('background', mainBgColor);
		
		
		videoMasker.css('overflow','hidden');
		videoMasker.css('top', 0);
		videoMasker.css('left', 0);
		videoMasker.css('width', playerWidth);
		videoMasker.css('height', playerHeight);
		//videoMasker.css('display', 'block');
		
		
		videoControls.css('top', playerHeight - parseInt(videoControls.css('height')));
		videoControls.css('width', playerWidth);
		
		
		//playlist controls
		playlistControls.css('bottom', playlistControlsBottomValue);
		
		playlistBackward.css('opacity', playlistControlsOffOpacity);
		playlistClose.css('opacity', playlistControlsOffOpacity);
		playlistForward.css('opacity', playlistControlsOffOpacity);
		
		playlistBackward.bind("click", togglePlaylistControls);
		playlistBackward.bind("mouseover", overPlaylistControls);
		playlistBackward.bind("mouseout", outPlaylistControls);
		playlistClose.bind("click", togglePlaylistControls);
		playlistClose.bind("mouseover", overPlaylistControls);
		playlistClose.bind("mouseout", outPlaylistControls);
		playlistForward.bind("click", togglePlaylistControls);
		playlistForward.bind("mouseover", overPlaylistControls);
		playlistForward.bind("mouseout", outPlaylistControls);
		
		
		playControl.bind("click", togglePlayControl);
		fullscreenControl.bind("click", toggleFullscreen);
		progressControl.bind('mousedown', mouseDownHandlerSeek);
		
		volumeControl.bind('mousedown', mouseDownHandlerVolume);
		
		//playlistToggle.bind("click", closePlayer);
		infoToggle.bind("click", toggleDescription);
	
	
		//info		
		infoBackground.css('background', descriptionBgColor);
		infoBackground.css('opacity', descriptionBgAlpha);
	
		 descriptionLeftBuffer = parseInt(infoHolder.css('left'));
		 descriptionRightBuffer= parseInt(infoHolder.css('right'));
		 descriptionTopBuffer= parseInt(infoHolder.css('top'));
		 descriptionBottomBuffer= parseInt(infoHolder.css('bottom'));
	
	
	
	
		boxWidth = parseInt(previewWidth + 2 * previewUpLeftRightPadding);
		boxHeight = parseInt(previewHeight + previewUpLeftRightPadding + previewDownPadding);
		
		
		
		
		//video preloader
		videoPreloader = $("<img></img>");
		videoPreloader.hide();
		videoPreloader.css('position', 'absolute');
		videoPreloader.css('left', getPlayerSize('w') / 2);
		videoPreloader.css('top', getPlayerSize('h') / 2);
		videoPreloader.attr('src', 'typo3conf/ext/gc_video/res/icons/loading.gif');
		videoMasker.append(videoPreloader);
		
		
		
		
		seekbar_bg.css('background', seekbarBgColor);
		seekbar_bg.css('width', getPlayerSize('w'));	
		
		
		
		
		if(!singleVideo){
		
			var img;
			var url;
			var video;
			var i=0;
			for(i; i < _playlistLength;i++){
				
				//video backgrounds with shadow
				var div = $("<div></div>");
				boxArr.push(div);
				
				div.css('display', 'none');
				div.css('opacity', 0);
				div.css('background', previewItemBgColor);
				div.css('width', boxWidth);
				div.css('height', boxHeight);
				
				$(div).addClass('previewItemBg');
		
				$(previewWrapper).append(div);
				
				
				//background div
				var videoBg_div = $("<div></div>");
				videoBg_div.css('position', 'absolute');
				videoBg_div.css('left', previewUpLeftRightPadding);
				videoBg_div.css('top', previewUpLeftRightPadding);
				videoBg_div.css('width', previewWidth);
				videoBg_div.css('height', previewHeight);
				videoBg_div.css('display', 'block');
				videoBg_div.css('background', previewThumbBgColor);
				videoBg_div.attr('title', 'videoBg');
				div.append(videoBg_div);
				
			
			
				//preview preloader
				var previewPreloader = $("<img></img>");
				previewPreloader.css('position', 'absolute');
				previewPreloader.attr('title', 'previewPreloader');
				previewPreloader.css('left', previewWidth / 2 - 8);
				previewPreloader.css('top', previewHeight / 2 - 5);
				previewPreloader.attr('src', 'typo3conf/ext/gc_video/res/icons/loading.gif');
				div.append(previewPreloader);
				
				
				
				//transparent div
				var transp_div = $("<div></div>");
				transp_div.css('opacity', 0);
				transp_div.attr('id', i);
				transp_div.css('position', 'absolute');
				transp_div.css('top', 0);
				transp_div.css('width', boxWidth);
				transp_div.css('height', boxHeight);
				transp_div.css('background', '#ff0000');
				transp_div.hover(overPreview, outPreview);
				transp_div.bind('click', clickPreview);
				
				
				//title
				var title = videoTitleArr[i];	
				var previewTitle = '<p class="previewTitle">'+title+'</p>';
				$(previewTitle).appendTo(div);
				
				
				
				//load thumbs
				img = $(new Image());
				img.attr('id', i);
				img.css('opacity', 0);
				img.css('position', 'relative');
				img.css('left', previewUpLeftRightPadding);
				img.css('top', previewUpLeftRightPadding);
				img.css('width', previewWidth);
				img.css('height', previewHeight);
				img.css('display', 'block');//fix 3px div add on
				img.attr('title', 'previewImage');
				
				img.appendTo(div);
					
				//thumbs url
				url = vidThumbUrlArr[i] +"?rand=" + (Math.random() * 99999999);
				//console.log(url);
					
				img.load(function() {
					
					var id = $(this).attr('id');
					
					if(!previewVideoOn && id != activePreviewItem){
						
						//remove preloader
						var preloader=$(boxArr[id]).find('img[title="previewPreloader"]');
						//console.log(preloader);
						$(preloader).animate({'opacity': 0},  {duration: 1000, easing: "easeOutSine"});
							
						$(this).animate({'opacity': 1},  {duration: 1000, easing: "easeOutSine"});
						
					}
					
				}).attr('src', url);
					
				img.error(function(e) {
					console.log("image load error " + e);
				});
				
				
				transp_div.appendTo(div);
					
			}





			//get title rollout color
			var title = $(div).find('p.previewTitle');
			titleColor=$(title).css('color');
			//console.log(titleColor);
		
			//get volume rollout color
			volumeBgColor=$('#volume_display').find('li').css('border-bottom-color');
			volumeBgColor = rgb2hex(volumeBgColor);
			//console.log(volumeBgColor);
				
				
				
			
			
			//check startID
			if(startID == -1){//open playlist
				
				mainWrapper.css('top', playerHeight);
				mainWrapper.css('left', 0);
				
				previewWrapper.css('top', 0);
				previewWrapper.css('left', 0);
				previewWrapper.css('display', 'block');
				
				$(previewWrapper).stop().animate({'opacity': 1}, {duration: 500, easing: "easeOutSine"});
				
			}
			else if(startID > -1){//open video
				
				componentMode = 'player';
				
				videoCounter = startID;
				if(videoCounter > _playlistLength-1) videoCounter=_playlistLength-1;
				
				//previewWrapper.css('top', -playerHeight);
				//previewWrapper.css('left', 0);
				
				mainWrapper.css('top', 0);
				mainWrapper.css('left', 0);
				mainWrapper.css('display', 'block');
				mainWrapper.stop().animate({'opacity': 1}, {duration: 500, easing: "easeOutSine"});
				
				//immediatelly enable playlist close button
				playlistClose.css('cursor', 'pointer');
				playlistClose.stop().animate({'opacity': 1}, {duration: 500, easing: "easeOutSine" });
				introHappened=true;
				
				setVideo();
				
			}
			
			
			//intro playlist
			_startIndex = 0;
			_endIndex = _startIndex + numberOfColumnsInPlaylist * numberOfRowsInPlaylist;
			if(_endIndex > _playlistLength) _endIndex = _playlistLength;//restraints
			repositionThumbs();
		
		
		}else{//single video
			
			//console.log("single video");
			
			videoCounter=0;
			previewWrapper.css('display', 'none');
			
			playlistToggle.remove();//remove open playlist
			infoToggle.css('marginTop', 0);//move up info toggle 
			introHappened=true;
			
			mainWrapper.css('top', 0);
			mainWrapper.css('left', 0);
			mainWrapper.css('display', 'block');
			mainWrapper.stop().animate({'opacity': 1}, {duration: 500, easing: "easeOutSine"});
			
			setVideo();
			
		}
		
		//controls autohide
		if(autoHideControls){
			playerWrapper.bind('mouseover', overComponent);
			playerWrapper.bind('mouseout', outComponent);
		}
		
	}

	
	/*
    canplay: fired when video ready to play but buffering not complete
    canplaythrough : fired when video ready to play and buffering complete
	*/
	
	/*
	function canplayHandler(e){
		var target = (window.event) ? e.srcElement : e.target;
		var video = $(target).get(0);
		var id=$(video).attr('id');
		console.log("canplayHandler ", id , e);
	}
	
	function canplaythroughHandler(e){//video loaded in opera
		var target = (window.event) ? e.srcElement : e.target;
		var video = $(target).get(0);
		setVideoLoaded(video);
	}
	
	function previewErrorHandler(e){
		var target = (window.event) ? e.srcElement : e.target;
		var video = $(target).get(0);
		
		 switch (video.error.code) {
		   case MEDIA_ERR_ABORTED:
			  console.log("User aborted video playback");
			  break;
		   case MEDIA_ERR_NETWORK:
			  console.log("Network error (could not read the stream)");
			  break;
		   case MEDIA_ERR_DECODE:
			  console.log("Decoding error, video is broken or the codec makes problems");
			  break;
		   case MEDIA_ERR_SRC_NOT_SUPPORTED:
			  console.log("The format is not supported");
			  break;
		 }
	}
	
	
	//http://www.chipwreck.de/blog/2010/03/01/html-5-video-dom-attributes-and-events/
	
	networkState (int): State of the network
	
	NETWORK_EMPTY (0) Not yet initialized
	NETWORK_IDLE (1) Network is not being used now (video is completely loaded for example)
	NETWORK_LOADING (2) Browser is loading data from the net
	NETWORK_LOADED (3) Data has been loaded
	NETWORK_NO_SOURCE (4) Video resource could not be found/loaded
	
	readyState (int): State of the video
	
	HAVE_NOTHING (0) No data available
	HAVE_METADATA (1) Duration and dimensions are available
	HAVE_CURRENT_DATA (2) Data for the current position is available
	HAVE_FUTURE_DATA (3) Data for the current and future position is available, so playback could start
	HAVE_ENOUGH_DATA (4) Enough data to play the whole video is available
	
	Events
	
	loadstart Browser starts loading data
	
	progress Browser loads data
	
	suspend Browser does not load data, waiting
	
	abort Data loading was aborted
	
	error An error occured
	
	emptied Data not present unexpectedly
	
	stalled Data transfer stalled
	
	play Video started playing (fired with play())
	
	pause Video has paused (fired with pause())
	
	loadedmetadata Metadata loaded
	
	loadeddata Data loaded
	
	waiting Waiting for more data
	
	playing Playback started
	
	canplay Video can be played, but possibly must stop to buffer content
	
	canplaythrough Enough data to play the whole video
	
	seeking seeking is true (browser seeks a position)
	
	seeked seeking is now false (position found)
	
	timeupdate currentTime was changed
	
	ended Video has ended
	
	ratechange Playback rate has changed
	
	durationchange Duration has changed (for streams)
	
	volumechange Volume has changed
	
	
	
	
	
	oncanplay – This event fires when a file is ready to start playing like when it has buffered enough to begin. Ideal for some alert text telling the user media is starting or ready to start to play.
    oncanplaythrough – This event is the cousin of oncanplay that fires when a file can be played all the way to the end without pausing for buffering. Useful for displaying messages that let the user know they can watch or listen to the file without interruption. It's also useful for holding play until the file has fully buffered if that is important to your project.
    ondurationchange – This event fires when the length of media changes. For example, say you offer two different mixes of a song which are different lengths. When the user changes between files you may also need to change something like a custom progress bar.
    onemptied – This one fires when something bad happens and the file is suddenly unavailable like when the user's ISP unexpectedly disconnects.
    onended – This event fires when the media end is reached. A useful event for messages like "thanks for listening".
    onerror – As you would expect this event fires when an error occurs as the file is being loaded. Once the file is loaded other events like onemptied pretty much takes over handling errors and interruptions.
    onloadeddata – This fires when the media data is loaded. It follows the onloadedmetadata event below assuming no errors occur.
    onloadedmetadata – This event occurs when meta data like dimensions and duration are loaded. This is basically the second step of loading the file and is useful for projects where you may be doing something like a custom progress bar.
    onloadstart – This event would then be the first step in the initial loading process. It fires just as the file begins to load before anything is actually loaded. This is a good time to post a message that the file is loading.
    onpause – This event fires when the media is paused either by the user or programmatically. 
	onplay – This event fires when the media is ready to start playing. This is the first of two events that fire when media is tasked to play.
    onplaying – This event fires when the media actually has started playing. This is the second of the two events that fire when media is tasked to play.
    onprogress – This event occurs when the browser is in the process of getting the media data. It's an event that spans some of the other more precise events like onloadeddata.
    onratechange – This event fires each time the playback rate changes like when a user switches to a slow motion or fast forward mode.
    onreadystatechange – This event fires each time the ready state changes. The ready state basically tracks the state of the media data. For example, it can have a value of HAVE_METADATA which occurs when the duration of the media can be determined. If you are thinking this seems like an event that spans other events like onloadedmetadata you would be correct. Though the onreadystatechange attribute changing to HAVE_METADATA is not precisely the same as the onloadedmetadata event, the events could be used interchangeably in most circumstances. You can read more about readystate in the HTML5 Working Draft.
    onseeked – This event fires when the seeking attribute is set to false indicating that seeking has ended. Seeking is basically the act of moving the p-laying position forward and backward like when the user drags the progress bar pointer forward to fast forward to a particular point within the media.
    onseeking – This event fires when the seeking attribute is set to true indicating that seeking is active. This event will only fire if seeking lasts for more than just an instant.
    onstalled – This event fires when the browser is unable to fetch the media data for whatever reason. This is an event that is most helpful for handling connection interruptions that occur during buffering.
    onsuspend – This event is very similar to onstalled and fires when the fetching the media data is stopped before it is completely loaded. Sometimes this is due to connection issues while other times it might be user intervention. Whatever the case it allows the developer to prompt the user to try again or perform some other action.
    ontimeupdate – This event fires when the playing position has changed like when the user fast forwards to a different point in the media.
    onvolumechange – This event fires each time the volume is changed which includes setting the volume to mute.
    onwaiting – The event fires when the media has paused but is expected to resume like when the media pauses to buffer more data.

	
	
	
	
	

	function previewProgressHandler(e){
		
		var target = (window.event) ? e.srcElement : e.target;
		var video = $(target).get(0);
	
		try{
			var buffered = $(video).attr("buffered").end(0);
		}catch(error){}
		var videoDuration = video.duration;
		
		//console.log(buffered, videoDuration);
		//console.log(e, buffered / videoDuration);

		if(!isNaN(buffered)){
			if(buffered == videoDuration){//video loaded
				setVideoLoaded(video);
			}
		}
	}
	
	function setVideoLoaded(video){
		$(video).unbind("progress", previewProgressHandler);
		$(video).unbind("canplaythrough", canplaythroughHandler);
		
		//remove preloader
		var id = $(video).attr('id');
		var preloader=$(boxArr[id]).find('img.preloader');
		//console.log(preloader);
		$(preloader).remove();
		
		console.log("video downloaded ", id);
		
		$(video).attr('title', 'loaded');
		
		$(video).animate({'opacity': 1},  {duration: 1000, easing: "easeOutSine", complete: function(){
			
			//console.log(video.currentTime);
			
			//video.play();
			//video.pause();
			//video.currentTime=0;
		}});
	}
	*/

	//******************* playlist
	
	function repositionThumbs() {
		
		var start = _startIndex;//take a reference because we mustnt change _startIndex and _endIndex 
		var end = _endIndex;
		
		var numThumbsToShow = _endIndex - _startIndex;
		//console.log("numThumbsToShow = " + numThumbsToShow);
		
		var w = 0;
		var h = 0;
		var d = 0;
		var columns = numberOfColumnsInPlaylist;
		
		if(numThumbsToShow == numberOfColumnsInPlaylist * numberOfRowsInPlaylist){//more items than full grid
			
			//calculate width of the visible thumbs
			if(_playlistLength >= numberOfColumnsInPlaylist * numberOfRowsInPlaylist){//max width
				w = numberOfColumnsInPlaylist * boxWidth + (numberOfColumnsInPlaylist - 1) * horizontalPreviewSpacing;
			}else{
				d = Math.ceil(_playlistLength / numberOfRowsInPlaylist);///get number of columns
				w = d * boxWidth + (d - 1) * horizontalPreviewSpacing;
			}
			
			//calculate height of the visible thumbs
			if(_playlistLength >= numberOfRowsInPlaylist){//max height
				h = numberOfRowsInPlaylist * boxHeight + (numberOfRowsInPlaylist - 1) * verticalPreviewSpacing;
			}else{
				h = _playlistLength * boxHeight + (_playlistLength - 1) * verticalPreviewSpacing;
			}
			
		}
		else if(numThumbsToShow < numberOfColumnsInPlaylist * numberOfRowsInPlaylist){//less items than full grid
	
			//calculate width of the visible thumbs
			d = Math.ceil(numThumbsToShow / numberOfRowsInPlaylist);///get number of columns
			w = d * boxWidth + (d - 1) * horizontalPreviewSpacing;
			
			//console.log(numThumbsToShow,numberOfRowsInPlaylist);//4,3
			
			//calculate height of the visible thumbs
			if(numThumbsToShow >= numberOfRowsInPlaylist){//max height
				
				if(numberOfRowsInPlaylist >numberOfColumnsInPlaylist ){
					//console.log(1);
					h = numberOfColumnsInPlaylist * boxHeight + (numberOfColumnsInPlaylist - 1) * verticalPreviewSpacing;
				}
				else if(numberOfRowsInPlaylist < numberOfColumnsInPlaylist ){
					//console.log(2);
					h = numberOfRowsInPlaylist * boxHeight + (numberOfRowsInPlaylist - 1) * verticalPreviewSpacing;
				}
				else{
					//console.log(3);
					h = numberOfRowsInPlaylist * boxHeight + (numberOfRowsInPlaylist - 1) * verticalPreviewSpacing;
				}
				//h = numberOfRowsInPlaylist * boxHeight + (numberOfRowsInPlaylist - 1) * verticalPreviewSpacing;
			}else{
				//console.log(4);
				h = numThumbsToShow * boxHeight + (numThumbsToShow - 1) * verticalPreviewSpacing;
			}
			
			columns = d;
				
		}
		
		playlistHalfHeight = h/2;
		
		//position playlist
		//console.log(w,h);
		
		//find offset for the grid since we cant center it all, because we dont have a holder div for the thumbs
		var left = Math.ceil(getPlayerSize('w') /2  - w / 2);
		var top = Math.ceil(getPlayerSize('h') / 2 - h / 2);
		
		//columns, rows, xSpacing, ySpacing, xPadding, yPadding, xOffset, yOffset, leftToRight
		gridArr=createGrid(columns,numberOfRowsInPlaylist,boxWidth, boxHeight,horizontalPreviewSpacing,verticalPreviewSpacing,left,top,true);
		//console.log(gridArr);
		
		positionPreviews();
		displayPreviews();
		
	}
	
	function positionPreviews() {
		
		var start = _startIndex;//take a reference because we mustnt change _startIndex and _endIndex 
		var end = _endIndex;
		var i = 0;
		var div;
		
		for(i; i < start; i++ ){//put all invisible at 0 place (we need to do this because of the stage align, not let them float around)
			div=boxArr[i];
			div.css('left', 0);
			div.css('top', 0);
		}
		
		var j = 0;//because grid arr only goes from 0 to visible columns * rows (not more)
		
		for(start; start < end; start++ ){//the ones that will be visible
			div=boxArr[start];
			div.css('left', gridArr[j].x);
			//div.css('top', gridArr[j].y);
			div.css('top', 0);
			j++;
		}
		
		for(end; end < _playlistLength; end++ ){//put all invisible at 0 place
			div=boxArr[end];
			div.css('left', 0);
			div.css('top', 0);
		}
	}
	
	function displayPreviews() {
		
		var d = 0;//delay must go from 0 everytime
		var div;
		var delayVal = 50;
		
		var i = _startIndex;//take a reference because we mustnt change _startIndex and _endIndex 
		var j = _endIndex;
		
		for(i; i < j; i++ ){
			div = boxArr[i];//take a reference
			div.css('opacity', 0);
			div.css('display', 'block');
			
			$(div).delay(d * delayVal).animate({'opacity': 1}, {duration: fadeInPreviewTime, easing: "easeOutSine"});
			
			d++;//increase delay
		}
		
		//delayed call for tween end
		 if(previewDisplayEndTimeoutID) clearTimeout(previewDisplayEndTimeoutID);
		previewDisplayEndTimeoutID = setTimeout ( endPreviewDisplay, fadeInPreviewTime + (_endIndex - _startIndex) * delayVal );
		
	}
	
	function hidePreviews(hide) {
		
		var i = _startIndex;//take a reference because we mustnt change _startIndex and _endIndex 
		var j = _endIndex;
		//trace(_startIndex,_endIndex );
		
		var div;
		var video;
		
		for(i; i < j; i++){
			if(hide){//hide playlist boxes
				div = boxArr[i];//take a reference
				div.css('display', 'none');
				div.css('opacity', 0);
			}
		}
	}
	
	function endPreviewDisplay() {
		 if(previewDisplayEndTimeoutID) clearTimeout(previewDisplayEndTimeoutID);
		 //console.log("endPreviewDisplay");
		
		if(!_noAdvanceControls) {
			
			var time=300;
			
			//check controls
			playlistBackward.attr('title', '');//reset
			playlistForward.attr('title', '');
			
			//hide prev button on first media, and next button on last media
			if(_startIndex == 0) {
				playlistBackward.attr('title', 'hidden');
			}
			if(_endIndex == _playlistLength){
				playlistForward.attr('title', 'hidden');
			}
			
			//then show them
			if(playlistBackward.attr('title') != 'hidden'){
				playlistBackward.css('cursor', 'pointer');
				playlistBackward.stop().animate({'opacity': 1}, {duration: time, easing: "easeOutSine"});
			}
			
			if(playlistForward.attr('title') != 'hidden'){
				playlistForward.css('cursor', 'pointer');
				playlistForward.stop().animate({'opacity': 1},  {duration: time, easing: "easeOutSine"});
			}
			
			if(introHappened){
				playlistClose.css('cursor', 'pointer');
				$(playlistClose).stop().animate({'opacity': 1}, {duration: time, easing: "easeOutSine", complete: enablePlaylistControls });
			}else{
				setTimeout(enablePlaylistControls, time);
			}
			
		}
		
	}
	
	function hidePlaylistNavigation() {//hide playlist navigation buttons
		if(_noAdvanceControls) return;
		
		//disable controls
		playlistBackward.css('cursor', 'default');
		playlistClose.css('cursor', 'default');
		playlistForward.css('cursor', 'default');
		playlistBackward.stop().animate({'opacity': playlistControlsOffOpacity}, {duration: 300, easing: "easeOutSine"});
		playlistClose.stop().animate({'opacity': playlistControlsOffOpacity}, {duration: 300, easing: "easeOutSine"});
		playlistForward.stop().animate({'opacity': playlistControlsOffOpacity}, {duration: 300, easing: "easeOutSine"});
		
	}
	
	function enablePlaylistControls() {
		//console.log('enablePlaylistControls');
		previewTransitionOn=false;
	}
	
	
	//****************
	
	function togglePlaylistControls(e) {
		//console.log("togglePlaylistControls ", previewTransitionOn, $(target).attr('id'), $(target).attr('title') == 'hidden');
		e.stopPropagation();
		if(previewTransitionOn) return;
		previewTransitionOn = true;
		
		var target = (window.event) ? e.srcElement : e.target;
		
		//console.log($(target).attr('title'));
		
		if($(target).attr('title') == 'hidden') return;//mouse disabled
		var id = $(target).attr('id');
		
		
		if(id == "playlistBackward"){
				
			hidePlaylistNavigation();
			hidePreviews(true);
			//set new playlist indexes
			_endIndex = _startIndex;
			_startIndex = _endIndex - (numberOfColumnsInPlaylist * numberOfRowsInPlaylist);
			if(_startIndex < 0) _startIndex = 0;//restraints
				
			repositionThumbs();	
			
		}
		else if(id == "playlistForward"){
			
			hidePlaylistNavigation();
			hidePreviews(true);
			//set new playlist indexes
			_startIndex = _endIndex;
			_endIndex = _startIndex + (numberOfColumnsInPlaylist * numberOfRowsInPlaylist);
			if(_endIndex > _playlistLength) _endIndex = _playlistLength;//restraints
				
			repositionThumbs();	
				
		}
		else if(id == "playlistClose"){
			
			if(!introHappened) return;
			togglePlaylist('off');
				
		}
			
		return false;
		
	}
	
	function overPlaylistControls(e) {
		//e.stopPropagation();
		if(previewTransitionOn) return;
		//return false;
	}
	
	function outPlaylistControls(e) {
		//e.stopPropagation();
		if(previewTransitionOn) return;
		//return false;
	}
	
	//********************
	
	function previewEndHandler(e){
		var target = (window.event) ? e.srcElement : e.target;
		var video = $(target).get(0);
		//console.log("previewEndHandler ", $(video).attr('id'));
		video.currentTime = 0;//rewind
	}
	
	function canplayHandler(e){
		//console.log('canplayHandler');
		
		var target = (window.event) ? e.srcElement : e.target;
		var video = $(target).get(0);
		var id=$(video).attr('id');
		//console.log("canplayHandler ", id);
		
		var boxHolder=boxArr[id];
		
		//hide preloader
		var previewPreloader=$(boxHolder).find('img[title="previewPreloader"]');
		$(previewPreloader).stop().animate({'opacity': 0}, {duration: 300, easing: "easeOutSine"});
		
		//show video
		$(currentPreviewVideo).stop().animate({'opacity': 1}, {duration: 300, easing: "easeOutSine"});
		currentPreviewVideoGet.play();
		
	}
	
	function disposeVideo(){
		if(currentPreviewVideo){
			//remove last preview
			if(currentPreviewVideoGet){
				currentPreviewVideoGet.pause();
				$(currentPreviewVideoGet).unbind("ended", previewEndHandler);
				$(currentPreviewVideoGet).unbind("canplay", canplayHandler);
				currentPreviewVideoGet=null;
			}
			currentPreviewVideo.find('source').attr('src', '');//remove src attribute
			currentPreviewVideo.remove();
			currentPreviewVideo=null;
			
			//console.log("disposeVideo ", currentPreviewVideo,currentPreviewVideoGet);
		}
	}
	

	function overPreview(e){
		//console.log("overPreview");
		//e.stopPropagation();
		
		var target = (window.event) ? e.srcElement : e.target;
		var id = target.id;
		var boxHolder=boxArr[id];
		
		activePreviewItem=id;
		
		if(useLivePreview){
			
			previewVideoOn = true;
		
			disposeVideo();
		
			//hide image
			var previewImage=$(boxHolder).find('img[title="previewImage"]');
			if(previewImage) $(previewImage).stop().animate({'opacity': 0}, {duration: 300, easing: "easeOutSine"});
			
			//show preloader
			var previewPreloader=$(boxHolder).find('img[title="previewPreloader"]');
			$(previewPreloader).stop().animate({'opacity': 1}, {duration: 300, easing: "easeOutSine"});
			
			var videoBg=$(boxHolder).find('div[title="videoBg"]');
			
			//load video and listen for canplay
			currentPreviewVideo = $("<video />", {
				width: previewWidth,
				height: previewHeight,
				preload: 'auto'
			});
			
			//find video support
			if(mp4Support){
				var source = $("<source />", {
					src: cacheBustePreviewVideos ? vidPreviewUrlArr[id].mp4Url+"?rand=" + (Math.random() * 99999999) : vidPreviewUrlArr[id].mp4Url,
					//src:'video/preview/big_buck_bunny.mp4',
					type: vidPreviewUrlArr[id].mp4Type
				}).appendTo(currentPreviewVideo);
			}
			else if(vorbisSupport){
				var source = $("<source />", {
					src: cacheBustePreviewVideos ? vidPreviewUrlArr[id].ogvUrl+"?rand=" + (Math.random() * 99999999) : vidPreviewUrlArr[id].ogvUrl,
					//src:'video/preview/big_buck_bunny.ogv',
					type: vidPreviewUrlArr[id].ogvType
				}).appendTo(currentPreviewVideo);
			}
			
			currentPreviewVideo.css('opacity', 0);//hide
			currentPreviewVideo.attr('id', id);
			currentPreviewVideo.css('position', 'absolute');
			currentPreviewVideo.css('left', 0);
			currentPreviewVideo.css('top', 0);
			
			currentPreviewVideo.appendTo(videoBg);
			currentPreviewVideoGet = currentPreviewVideo.get(0);
			$(currentPreviewVideoGet).bind("ended", previewEndHandler);
			$(currentPreviewVideoGet).bind("canplay", canplayHandler);
			//$(currentPreviewVideoGet).bind("canplaythrough", canplaythroughHandler);
		
		
		}
		
		
		//rollover effect
		$(boxHolder).css('background', previewItemBgRollOverColor);
		
		var title = $(boxHolder).find('p.previewTitle');
		$(title).css('color', previewItemTextRollOverColor);
		
		return false;
		
	}
	
	function outPreview(e){
		//e.stopPropagation();
		//console.log("outPreview");
		
		var target = (window.event) ? e.srcElement : e.target;
		var id = target.id;
		var boxHolder=boxArr[id];
		
		if(useLivePreview){
		
			disposeVideo();
			
			//hide preloader
			var previewPreloader=$(boxHolder).find('img[title="previewPreloader"]');
			$(previewPreloader).stop().animate({'opacity': 0}, {duration: 300, easing: "easeOutSine"});
			
			//show image
			var previewImage=$(boxArr[id]).find('img[title="previewImage"]');
			if(previewImage) $(previewImage).stop().animate({'opacity': 1}, {duration: 300, easing: "easeOutSine"});
		
			previewVideoOn = false;
		
		}
		
		//rollover effect
		$(boxHolder).css('background', previewItemBgColor);
		
		//var titleColor=$('.previewTitle').css('color');//get title color
		var title = $(boxHolder).find('p.previewTitle');
		$(title).css('color', titleColor);
		
		return false;
	}
	
	function clickPreview(e){
		e.stopPropagation();
		//console.log("outPreview");
		var target = (window.event) ? e.srcElement : e.target;
		var id = target.id;
		var boxHolder=boxArr[id];
		
		if(useLivePreview){
		
			disposeVideo();
			
			//hide preloader
			var previewPreloader=$(boxHolder).find('img[title="previewPreloader"]');
			$(previewPreloader).stop().animate({'opacity': 0}, {duration: 300, easing: "easeOutSine"});
			
			//show image
			var previewImage=$(boxArr[id]).find('img[title="previewImage"]');
			if(previewImage) $(previewImage).stop().animate({'opacity': 1}, {duration: 300, easing: "easeOutSine"});
			
			previewVideoOn = false;
		
		}
		
		if(target.id == videoCounter){
			togglePlaylist('off');
			//console.log('clicked playing video');
			return false;
		}
		
		videoCounter = target.id;
		
		
		togglePlaylist('off');
		removePoster();
		setVideo();
		
		return false;
	}
	
	//***************
	
	function togglePlaylist(direction){
		
		if(playerTransitionOn) return;
		playerTransitionOn = true;
		
		if(direction == "off"){
			
			if(!introHappened){
				$(mainWrapper).css('opacity', 1);
				//enable playlist close btn
				playlistClose.css('cursor', 'pointer');
				$(playlistClose).stop().animate({'opacity': 1}, {duration: 500, easing: "easeOutSine" });
				introHappened=true;
			}
			
			//$(mainWrapper).css('top', getPlayerSize('h'));
			$(mainWrapper).css('display', 'block');//show player
			
			//$(previewWrapper).stop().animate({'top': - getPlayerSize('h')}, {duration: playerOnOffTime, easing: "easeOutQuint"});
			//$(mainWrapper).stop().animate({'top': 0}, {duration: playerOnOffTime, easing: "easeOutQuint", complete: playerOn});
			
		}
		else if(direction == "on"){
			
			//$(previewWrapper).css('top', -getPlayerSize('h'));
			$(previewWrapper).css('opacity', 1);
			$(previewWrapper).css('display', 'block');//show playlist
			
			$(mainWrapper).stop().animate({'top': getPlayerSize('h')}, {duration: playerOnOffTime, easing: "easeOutQuint"});
			$(previewWrapper).stop().animate({'top': 0}, {duration: playerOnOffTime, easing: "easeOutQuint", complete: playerOff});
			
		}
		
	}
	
	function playerOn(){
		//console.log("playerOn");
		//$(previewWrapper).css('display', 'none');
		componentMode = 'player';
		playerTransitionOn = false;
		
		/*
		close playlist with close button, play video if it was paused, 
		also, click on the thumb that plays, close playlist as well and returns to playing video.
		*/
		 if(videoStarted && forcePause) {
			 forcePause=false;
			 currentVideoGet.play();  
			 $(playControl).find('img').attr('src', 'typo3conf/ext/gc_video/res/icons/pause.png');
		 }
	
		if(autoHideControls) setControlsAutohide('on');
		
		overComponent();
		 
	}
	
	function setControlsAutohide(mode){
		//console.log("setControlsAutohide ", mode, videoStarted, componentSize);
		
		if(mode=='on'){
		
			if(videoStarted && componentSize=="fullscreen"){
				 if(inactivityTimeoutID) clearTimeout(inactivityTimeoutID);
				 inactivityTimeoutID = setTimeout(inactivityIntervalOn, inactivityTimeout);
				 playerWrapper.bind('mousemove', mouseActive);
			}
		
		}else{//off
			if(inactivityTimeoutID) clearTimeout(inactivityTimeoutID);
			playerWrapper.unbind('mousemove', mouseActive);
		}
		
	}
	
	function playerOff(){
		$(mainWrapper).css('display', 'none');
		componentMode = 'playlist';
		playerTransitionOn = false;
		
		if(autoHideControls) setControlsAutohide('off');
		
	}
	
	function closePlayer(e){
	
		//pause video
		 if(!currentVideoGet.paused) {
			currentVideoGet.pause();  
			$(playControl).find('img').attr('src', 'typo3conf/ext/gc_video/res/icons/play.png');
			forcePause=true;
		 }
		 
		 enablePlaylistControls();
		 
		 //close player
		 togglePlaylist('on');
	
		return false;
	}
	
	//****************
	
	function inactivityIntervalOn(){
		//console.log("inactivityIntervalOn");
		if(inactivityTimeoutID) clearTimeout(inactivityTimeoutID);
		
		//hide controls
		if(videoStarted && componentSize == 'fullscreen'){
			$(playerControls).stop().animate({'opacity': 0}, {duration: controlsToggleTime, easing: controlsToggleEase});
			$(videoControls).stop().animate({'opacity': 0}, {duration: controlsToggleTime, easing: controlsToggleEase});
		}
	}
	
	function mouseActive(){
		
		if(inactivityTimeoutID) clearTimeout(inactivityTimeoutID);
		
		if(videoStarted && componentSize == 'fullscreen'){
			$(playerControls).stop().animate({'opacity': 1}, {duration: controlsToggleTime, easing: controlsToggleEase});
			$(videoControls).stop().animate({'opacity': 1}, {duration: controlsToggleTime, easing: controlsToggleEase});
			inactivityTimeoutID = setTimeout(inactivityIntervalOn, inactivityTimeout);
		}
		
	}
	
	
	//***********


	function setVideo(){
		
		//stop video if playing
		if(currentVideo){
			if(trackMediaDataIntervalID) clearInterval(trackMediaDataIntervalID);
			var currentVideoGet = currentVideo.get(0);
			currentVideoGet.pause();
			$(currentVideoGet).unbind("ended", mainEndHandler);
			$(currentVideoGet).unbind("loadedmetadata", videoMetadata);
			$(currentVideoGet).unbind("canplaythrough", canplaythroughHandlerMain);
			//$(currentVideoGet).unbind("canplay", canplayHandlerMain);
			$(currentVideoGet).unbind("play", playHandlerMain);
			$(currentVideoGet).unbind("pause", pauseHandlerMain);
			$(currentVideoGet).unbind("volumechange", volumechangeHandlerMain);//for mute
			$(currentVideoGet).unbind("waiting",waitingHandlerMain);
			$(currentVideoGet).unbind("playing", playingHandlerMain);
			$(currentVideo).remove();
			currentVideo.find('source').attr('src', '');//remove src attribute
			currentVideo = null;
			currentVideoGet=null;
			forcePause=false;
			infoClosed();
		}
		$(videoPreloader).hide();
		
		videoStarted = false;
		
		//check info if exist
		var desc = videoDescriptionArr[videoCounter];
		//console.log(desc);
		if(!desc){//no info
			//console.log('no info');
			$(infoToggle).animate({'opacity': 0},  {duration: 500, easing: "easeOutSine", complete: function(){
				infoToggle.css('display', 'none');
			}});
		}else{
			infoToggle.css('display', 'block');
			$(infoToggle).animate({'opacity': 1},  {duration: 500, easing: "easeOutSine"});
		}
		
		//set title
		$(titleControl).html(videoTitleArr[videoCounter]);
		
		
		//check autoplay
		var preload;
		if(autoPlay){
			preload = 'auto';
		}else{
			preload = 'metadata';
			//load poster
			
			//hide video controls
			playerControls.css('display', 'none');
			videoControls.css('display', 'none');
			playerControls.css('opacity', 0);
			videoControls.css('opacity', 0);
			
			poster = new Image();
			$(poster).css('opacity', 0);
			$(poster).css('position', 'absolute');
			$(poster).css('display', 'block');
			$(poster).appendTo(videoMasker);
			
			//poster preloader
			var posterPreloader = $("<img></img>");
			posterPreloader.css('position', 'absolute');
			posterPreloader.attr('title', 'posterPreloader');
			posterPreloader.css('left', getPlayerSize('w') / 2);
			posterPreloader.css('top', getPlayerSize('h') / 2);
			posterPreloader.attr('src', 'typo3conf/ext/gc_video/res/icons/loading.gif');
			$(videoMasker).append(posterPreloader);
	
			var url = vidPosterUrlArr[videoCounter]+"?rand=" + (Math.random() * 99999999);
				
			$(poster).load(function() {
				
				//remove preloader
				var preloader=$(videoMasker).find('img[title="posterPreloader"]');
				//console.log(preloader);
				$(preloader).remove();
				
				setPosterSize($(poster).width(), $(poster).height());
				//console.log($(poster).width(), $(poster).height());
				$(poster).animate({'opacity': 1},  {duration: 1000, easing: "easeOutSine"});
				
				//poster play
				posterPlay = $("<img></img>");
				posterPlay.attr('class', 'posterPlay');
				posterPlay.css('left', getPlayerSize('w') / 2 - 33);
				posterPlay.css('top', getPlayerSize('h') / 2 - 33);
				posterPlay.attr('src', 'typo3conf/ext/gc_video/res/icons/poster_play.png');
				$(posterPlay).bind("click", toggleAutoplay);
				$(videoMasker).append(posterPlay);
				
			}).attr('src', url);
			
			$(poster).error(function(e) {
				console.log("poster load error " + e);
			});
		
		}
			
		currentVideo = $("<video />", {
			preload: preload
		});
		
		$(currentVideo).css('position', 'absolute');
		$(currentVideo).css('opacity', 0);
		
		//if(autoPlay) getMainVideoSrc();//if autoplay off set video src after we click play
		getMainVideoSrc();
		
		$(currentVideo).prependTo(videoMasker);
		
		
		
		currentVideoGet = currentVideo.get(0);
		$(currentVideoGet).bind("ended", mainEndHandler);
		$(currentVideoGet).bind("loadedmetadata", videoMetadata);
		$(currentVideoGet).bind("canplaythrough", canplaythroughHandlerMain);
		//$(currentVideoGet).bind("canplay", canplayHandlerMain);
		$(currentVideoGet).bind("play", playHandlerMain);
		$(currentVideoGet).bind("pause", pauseHandlerMain);
		$(currentVideoGet).bind("volumechange", volumechangeHandlerMain);//for mute
		$(currentVideoGet).bind("waiting",waitingHandlerMain);
		$(currentVideoGet).bind("playing", playingHandlerMain);
		
		
		
	}
	
	function waitingHandlerMain(e){//show preloader
		//console.log('waitingHandlerMain');
		if(!currentVideoGet.paused) $(videoPreloader).show();
	}
	
	function playingHandlerMain(e){//hide preloader
		//console.log('playingHandlerMain');
		$(videoPreloader).hide();
	}
	
	function getMainVideoSrc(){
		//find video support
		
		if(mp4Support){
			var source = $("<source />", {
				src: cacheBusteMainVideos ? vidMainUrlArr[videoCounter].mp4Url +"?rand=" + (Math.random() * 99999999) : vidMainUrlArr[videoCounter].mp4Url,
				type: vidMainUrlArr[videoCounter].mp4Type
			}).appendTo(currentVideo);
		}
		else if(vorbisSupport){
			var source = $("<source />", {
				src: cacheBusteMainVideos ? vidMainUrlArr[videoCounter].ogvUrl +"?rand=" + (Math.random() * 99999999) : vidMainUrlArr[videoCounter].ogvUrl,
				type: vidMainUrlArr[videoCounter].ogvType
			}).appendTo(currentVideo);
		}
	}
	
	
	function pauseHandlerMain(e){
		//console.log('pauseHandlerMain');
		 if(currentVideoGet.paused) {
			if(trackMediaDataIntervalID) clearInterval(trackMediaDataIntervalID);
			  $(playControl).find('img').attr('src', 'typo3conf/ext/gc_video/res/icons/play.png');
		}
	}
	
	function playHandlerMain(e){
		//console.log('playHandlerMain');
		 if(!currentVideoGet.paused){
			  if(trackMediaDataIntervalID) clearInterval(trackMediaDataIntervalID);
			  trackMediaDataIntervalID = setInterval(trackMediaData, trackMediaDataInterval);
			  $(playControl).find('img').attr('src', 'typo3conf/ext/gc_video/res/icons/pause.png');
		 }
	}
	
	function volumechangeHandlerMain(e){
		//console.log('volumechangeHandlerMain');
		
		if(currentVideoGet.muted){//video muted
			//console.log("currentVideoGet.volume = ", currentVideoGet.volume);
			_lastVolume=currentVideoGet.volume;
			_muteOn=true;
			updateVolumeDisplay(0);
		}else{
			
			if(_muteOn){
				//console.log("_lastVolume = ", _lastVolume);
				_muteOn=false;
				currentVideoGet.volume=_lastVolume;
				updateVolumeDisplay();
			}
			
		}
	}
	
	function loadedDataHandlerMain(e){
		//console.log('loadedDataHandlerMain ', e);
	}
	
	function toggleAutoplay(){
		
		$(poster).unbind("click", toggleAutoplay);
		
		 getMainVideoSrc();
		
		//remove poster and big play
		$(poster).stop().animate({'opacity': 0}, {duration: 500, easing: "easeOutSine"});
		$(posterPlay).stop().animate({'opacity': 0}, {duration: 500, easing: "easeOutSine", complete: removePoster});
		
		
		
		//show video
		$(currentVideo).stop().animate({'opacity': 1}, {duration: 500, easing: "easeOutSine"});
		togglePlayControl();
		videoStarted = true;
		
		currentVideoGet.volume = defaultVolume;
		updateVolumeDisplay();
		
		//show video controls
		playerControls.css('opacity', 0);
		videoControls.css('opacity', 0);
		playerControls.css('display', 'block');
		videoControls.css('display', 'block');
		$(playerControls).stop().animate({'opacity': 1}, {duration: 500, easing: "easeOutSine"});
		$(videoControls).stop().animate({'opacity': 1}, {duration: 500, easing: "easeOutSine"});
		
	}
	
	function removePoster(){
		//console.log("removePoster");
		$(poster).remove();
		$(posterPlay).remove();
	}
	
	function mainEndHandler(){//pause on beginning
		//console.log('mainEndHandler');
		$(videoPreloader).hide();
		currentVideoGet.currentTime = 0;//rewind
		togglePlayControl();
		//
		$(playProgressControl).css('width', 0);	
		$(hitProgress).css('width', 0);	
	}
	
	function videoMetadata(e){
		//console.log("videoMetadata ");
		//console.log(currentVideoGet.duration, currentVideoGet.videoWidth, currentVideoGet.videoHeight);
		resizeMedia();
		if(autoPlay){
			currentVideo.stop().animate({'opacity': 1}, {duration: 500, easing: "easeOutSine"});
			 togglePlayControl();
			 videoStarted = true;
			 
			 currentVideoGet.volume = defaultVolume;
			 updateVolumeDisplay();
			 
		}
	}
	
	
	function togglePlayControl(){
		//console.log("togglePlayControl");
		
		currentVideoGet = currentVideo.get(0);
		 if (currentVideoGet.paused) {
			 currentVideoGet.play();
			  if(trackMediaDataIntervalID) clearInterval(trackMediaDataIntervalID);
			  trackMediaDataIntervalID = setInterval(trackMediaData, trackMediaDataInterval);
			  playControl.find('img').attr('src', 'typo3conf/ext/gc_video/res/icons/pause.png');
		 } else {
			 if(trackMediaDataIntervalID) clearInterval(trackMediaDataIntervalID);
			  currentVideoGet.pause();
			  playControl.find('img').attr('src', 'typo3conf/ext/gc_video/res/icons/play.png');
			  videoPreloader.hide();
		 }
		 return false;
	}
	
	function canplayHandlerMain(e){
		//console.log("canplayHandlerMain ", e);
	}
	
	function canplaythroughHandlerMain(e){//for opera, when video loads make loadbar full width
		//console.log("canplaythroughHandlerMain ", e);
	
		$(currentVideoGet).unbind("canplaythrough", canplaythroughHandlerMain);
		
		try{
			var buffered = $(currentVideoGet).attr("buffered").end(0);
		}catch(error){}
		
		if(buffered == undefined){
			//console.log('canplaythroughHandlerMain');
			//$(loadProgressControl).css('width', getPlayerSize('w'));	
		}
	}
	
	function trackMediaData(){
		if(seekbarDown) return;
		 
		 //play progress
	  	$(playProgressControl).css('width', (currentVideoGet.currentTime / currentVideoGet.duration) * getPlayerSize('w'));	
	  
	    //load progress
		try{
			var buffered = $(currentVideoGet).attr("buffered").end(0);
		}catch(error){}
        var percent = buffered / currentVideoGet.duration;
		
		//console.log(percent);
		
		if(!isNaN(percent)){//opera has no buffered 
			//console.log("1............");
			$(hitProgress).css('width', percent * getPlayerSize('w'));	
			$(loadProgressControl).css('width', percent * getPlayerSize('w'));	
		}else{
			//console.log("2............");
			$(hitProgress).css('width', (currentVideoGet.currentTime / currentVideoGet.duration) * getPlayerSize('w'));	///when no load progress make it as play progress
			
			//console.log(currentVideoGet.readyState);
			if(currentVideoGet.readyState == 4){//for opera
				//$(loadProgressControl).css('width', getPlayerSize('w'));
			}
			
		}
	  
	  	//time
		 currentTimeDisplay.html(formatCurrentTime(currentVideoGet.currentTime));
	 	 if(currentVideoGet.duration) durationDisplay.html(formatDuration(currentVideoGet.duration));
		 
	}
	 
	function formatCurrentTime(seconds) {
		seconds = Math.round(seconds);
	    minutes = Math.floor(seconds / 60);
	    minutes = (minutes >= 10) ? minutes : "0" + minutes;
	    seconds = Math.floor(seconds % 60);
	    seconds = (seconds >= 10) ? seconds : "0" + seconds;
		return minutes + ":" + seconds;
	}
	
	function formatDuration(seconds) {
		seconds = Math.round(seconds);
	    minutes = Math.floor(seconds / 60);
	    minutes = (minutes >= 10) ? minutes : "0" + minutes;
	    seconds = Math.floor(seconds % 60);
	    seconds = (seconds >= 10) ? seconds : "0" + seconds;
		return " | " + minutes + ":" + seconds;
	}
	
	function toggleFullscreen() {
		if(componentSize== "normal"){
			componentSize= "fullscreen";
			previewWrapper.css('display', 'none');
			if(autoHideControls) setControlsAutohide('on');
		}else{
			componentSize="normal";
			previewWrapper.css('display', 'block');
			if(autoHideControls) setControlsAutohide('off');
		}
		resizeComponent();	
		return false;
	}
	
	function resizeComponent(){
		seekbarDown=true;
		
		//playerControls.css('display', 'none');
		//videoControls.css('display', 'none');
		
		if(componentSize== "fullscreen"){
			
			playerWrapper.css('width', getDocumentWidth());
			playerWrapper.css('height', getDocumentHeight());
			playerWrapper.css('left', 0);
			playerWrapper.css('top', 0);
			playerWrapper.css('marginLeft', 0);
			playerWrapper.css('marginTop', 0);
			
			/*siteContent.css('position','absolute');
			siteContent.css('top',0);
			siteContent.css('left',0);*/
			//Seitenspezifischer Teil
			playerMain.addClass('fullscreen');
			siteContent.addClass('fullscreen');
			txgcvideopi1.addClass('fullscreen');
			leftcontent.addClass('fullscreen');
			
			mainWrapper.css('width', getDocumentWidth());
			mainWrapper.css('height', getDocumentHeight());
			
			//previewWrapper.css('width', getDocumentWidth());
			//previewWrapper.css('height', getDocumentHeight());
			repositionThumbs();
				
			videoMasker.css('top', 0);
			videoMasker.css('left', 0);
			videoMasker.css('width', getDocumentWidth());
			videoMasker.css('height', getDocumentHeight());
			
			resizeMedia();
			
			playlistControls.css('bottom', Math.ceil(getDocumentHeight() / 2 - playlistHalfHeight - 40));
			
			playerControls.css('right', 0);
			playerControls.css('top', 0);
			
			videoControls.css('top', getDocumentHeight() - parseInt(videoControls.css('height')));
			videoControls.css('width', getDocumentWidth());
			
		}else{
			
			playerWrapper.css('width', playerWidth);
			if(singleVideo)
				{
					previewWrapper.css('display','none');
					playerWrapper.css('height', playerHeight);
				}
			else
				{
					playerWrapper.css('height', playerHeight+thumbnailPreviewHeight+15);
				}
			
			//playerWrapper.css('marginLeft', -playerWidth / 2);
			//playerWrapper.css('marginTop', -playerHeight /2 );
			//playerWrapper.css('left', 50 + '%');
			//playerWrapper.css('top', 50 + '%');
			
			mainWrapper.css('width', playerWidth);
			mainWrapper.css('height', playerHeight);
			
			/*siteContent.css('position','relative');
			siteContent.css('top','none');
			siteContent.css('left','none');*/
			
			//playerMain.css('position','relative'); //Main
			
			previewWrapper.css('width', playerWidth);
			previewWrapper.css('height', thumbnailPreviewHeight);
			repositionThumbs();
			
						//Seitenspezifischer Teil
			playerMain.removeClass('fullscreen');
			siteContent.removeClass('fullscreen');
			txgcvideopi1.removeClass('fullscreen');
			leftcontent.removeClass('fullscreen');
			
			videoMasker.css('top', 0);
			videoMasker.css('left', 0);
			videoMasker.css('width', playerWidth);
			videoMasker.css('height', playerHeight);
			
			resizeMedia();
			
			playlistControls.css('bottom', playlistControlsBottomValue);
			
			playerControls.css('right', 0);
			playerControls.css('top', 0);
			
			videoControls.css('top', playerHeight - parseInt(videoControls.css('height')));
			videoControls.css('width', playerWidth);
			
		}
		
		$(seekbar_bg).css('width', getPlayerSize('w'));	
		
		videoPreloader.css('left', getPlayerSize('w') / 2);
		videoPreloader.css('top', getPlayerSize('h') / 2);
		
		if(infoOpened) resizeDescription();
		
		seekbarDown=false;
		
		trackMediaData();
		
		//opera fix
		try{
			var buffered = $(currentVideoGet).attr("buffered").end(0);
			if(buffered == undefined){
				$(loadProgressControl).css('width', getPlayerSize('w'));	
			}
		}catch(error){}
		
		playerControls.css('display', 'block');
		videoControls.css('display', 'block');
	}
	
	//************* seekbar
	
	function mouseDownHandlerSeek(){
		seekbarDown=true;
		
		  forcePause=false;
		  if(!currentVideoGet.paused) {
				currentVideoGet.pause();  
				forcePause=true;
		  }
		  
		//blockTextSelection();
		 
		 $(document).bind('mousemove', mouseMoveHandlerSeek);
		 $(document).bind('mouseup', mouseUpHandlerSeek);
		 progressControl.bind('mouseup', mouseMoveHandlerSeek);
		
		return false;
		
	}
	
	function mouseMoveHandlerSeek(e){
		setPlayProgress(e.pageX);
	}
	
	function mouseUpHandlerSeek(e){
		
		 $(document).unbind('mousemove', mouseMoveHandlerSeek);
		 $(document).unbind('mouseup', mouseUpHandlerSeek);
		 progressControl.unbind('mouseup', mouseMoveHandlerSeek);
		
		//unblockTextSelection();
		
		if (forcePause) {
			forcePause=false;
		    currentVideoGet.play();
		}
	
		seekbarDown=false;
		
		return false;
		
	}
	
	function setPlayProgress(x) {
		
		 var newPercent = Math.max(0, Math.min(1, (x - progressControl.offset().left) / getPlayerSize('w')));
		//console.log(newPercent);
		
		  currentVideoGet.currentTime = newPercent * currentVideoGet.duration;
		  
		  //progress bar
		  $(playProgressControl).css('width', (currentVideoGet.currentTime / currentVideoGet.duration) * getPlayerSize('w'));	
	  
	  	//time
		 currentTimeDisplay.html(formatCurrentTime(currentVideoGet.currentTime));
	 	 if(currentVideoGet.duration) durationDisplay.html(formatDuration(currentVideoGet.duration));
		  
	}
	
	/*
	function blockSelection(){
		  document.body.focus();
		  document.onselectstart = function () { return false; };
	}
	 
	function unblockSelection(){
		  document.onselectstart = function () { return true; };
	}
	*/
	
	//*************** volume
	
	function mouseDownHandlerVolume(e){
		
		 $(document).bind('mousemove', mouseMoveHandlerVolume);
		 $(document).bind('mouseup', mouseUpHandlerVolume);
		 volumeControl.bind('mouseup', mouseMoveHandlerVolume);
		
		currentVideoGet.muted=false;//reset mute
		_muteOn=false;
		
		return false;
		
	}
	
	function mouseMoveHandlerVolume(e){
		setVolume(e.pageX);
	}
	
	function mouseUpHandlerVolume(e){
		  $(document).unbind('mousemove', mouseMoveHandlerVolume);
		 $(document).unbind('mouseup', mouseUpHandlerVolume);
		 volumeControl.unbind('mouseup', mouseMoveHandlerVolume);
		
		return false;
		
	}
	
	function setVolume(x) {
		  var newVol = (x -  $(volumeDisplay).offset().left) /  23;///23=width of the volume bars
		// console.log(newVol, $(volumeDisplay).find('ul').css('width'));
		  
		  if (newVol > 1) {
			newVol = 1;
		  } else if (newVol < 0) {
			newVol = 0;
		  }
		  
		  currentVideoGet.volume = newVol;
		  updateVolumeDisplay();
	}

	function updateVolumeDisplay(value){
		
		  currentVideoGet = currentVideo.get(0);
		  var volumeBarsLen = $(volumeDisplay).children().size();
		  var volNum;
		  
		 // console.log(value);
		  if(typeof value  == "undefined"){
			  volNum = Math.floor(currentVideoGet.volume * volumeBarsLen);
		  }else{
			  volNum = Math.floor(value * volumeBarsLen);
		  }
		  
		  var volumeBar;
		  
		  for(var i=0; i<volumeBarsLen; i++) {
			
			volumeBar = $(volumeDisplay).children()[i];
			//console.log(volumeBar);
			
			if (i < volNum) {
			   $(volumeBar).css('borderColor', volumeRollOverColor);
			} else {
			   $(volumeBar).css('borderColor', volumeBgColor);
			}
		  }
	}
		
	//***************** description
	
	function toggleDescription(e) {
		
		if(!is_chrome){
		
			if(!infoOpened){
				
				infoHolder.css('width', getPlayerSize('w') - descriptionLeftBuffer - descriptionRightBuffer);
				
				var desc = videoDescriptionArr[videoCounter];
				infoContent.html(desc);//set info
				
				infoWrapper.css('opacity', 0);
				infoWrapper.css('display', 'block');
				
				infoScrollExist=false;//reset
				if(infoContent.height() > getPlayerSize('h') - descriptionTopBuffer - descriptionBottomBuffer){
					infoScrollExist=true;
				}
				
				setDescription();
				
				infoWrapper.css('opacity', 1);
				$(infoWrapper).stop().animate({'top': infoInPosition}, {duration: 800, easing: "easeOutQuint"});
				if(infoScrollExist) infoWrapper.bind("mousemove", mouseMoveHandlerInfo);
				infoOpened = true;
				
			}else{
				$(infoWrapper).stop().animate({'top': getPlayerSize('h')}, {duration: 800, easing: "easeOutQuint", complete: infoClosed});
				infoOpened = false;
			}
		
		}else{
			
			if(!infoOpened){
				
				infoHolder.css('width', getPlayerSize('w') - descriptionLeftBuffer - descriptionRightBuffer);
				
				var desc = videoDescriptionArr[videoCounter];
				infoContent.html(desc);//set info
				
				infoWrapper.css('opacity', 0);
				infoWrapper.css('display', 'block');
				
				infoScrollExist=false;//reset
				if(infoContent.height() > getPlayerSize('h') - descriptionTopBuffer - descriptionBottomBuffer){
					infoScrollExist=true;
				}
				
				setDescription();
				
				infoWrapper.css('top', infoInPosition);
				$(infoWrapper).stop().animate({'opacity': 1}, {duration: 800, easing: "easeOutQuint"});
				if(infoScrollExist) infoWrapper.bind("mousemove", mouseMoveHandlerInfo);
				infoOpened = true;
				
			}else{
				$(infoWrapper).stop().animate({'opacity': 0}, {duration: 800, easing: "easeOutQuint", complete: infoClosed});
				infoOpened = false;
			}
			
		}
		
		return false;
	}
	
	function infoClosed() {
		infoWrapper.css('display', 'none');
		infoWrapper.unbind("mousemove", mouseMoveHandlerInfo);
		infoOpened = false;
	}
	
	function mouseMoveHandlerInfo(e) {
		var mouseY=(e.pageY - infoHolder.offset().top);
		var newY = (infoHolder.height() - infoContent.height()) * mouseY / infoHolder.height();
		infoContent.css('top', newY);
	}
	
	function setDescription() {
		
		infoBackground.css('width', getPlayerSize('w'));
		
		infoWrapper.css('top', getPlayerSize('h'));
		
		infoContent.css('top', 0);//reset from scroll
		
		if(infoScrollExist){//more description than fits
		
			infoBackground.css('height', getPlayerSize('h'));
			infoHolder.css('height', getPlayerSize('h') - descriptionTopBuffer - descriptionBottomBuffer);
			
			infoInPosition = 0;
			
		}else{
			var descTextHeight = infoContent.height();
			//console.log("less text ", descTextHeight);
			
			infoBackground.css('height', descTextHeight + descriptionTopBuffer + descriptionBottomBuffer);
			infoHolder.css('height', descTextHeight);
			
			infoInPosition = getPlayerSize('h') - (descTextHeight + descriptionTopBuffer + descriptionBottomBuffer);
			
		}
		
	}
	
	function resizeDescription() {
		
		infoBackground.css('width', getPlayerSize('w'));
		
		infoHolder.css('width', getPlayerSize('w') - descriptionLeftBuffer - descriptionRightBuffer);
		
		infoContent.css('top', 0);//reset from scroll
		
		infoScrollExist=false;//reset
		if(infoContent.height() > getPlayerSize('h') - descriptionTopBuffer - descriptionBottomBuffer){
			infoScrollExist=true;
		}
		
		if(infoScrollExist){//more description than fits
		
			infoBackground.css('height', getPlayerSize('h'));
			infoHolder.css('height', getPlayerSize('h') - descriptionTopBuffer - descriptionBottomBuffer);
			
			infoWrapper.css('top', 0);
			
			infoWrapper.bind("mousemove", mouseMoveHandlerInfo);
			
		}else{
			
			var descTextHeight = infoContent.height();
			
			infoBackground.css('height', descTextHeight + descriptionTopBuffer + descriptionBottomBuffer);
			infoHolder.css('height', descTextHeight);
			
			infoWrapper.css('top', getPlayerSize('h') - (descTextHeight + descriptionTopBuffer + descriptionBottomBuffer));
			
		}
		
	}
	
	//*******************
	
	function overComponent() {
		if(videoStarted && componentSize=="normal" && componentMode == 'player'){
			$(playerControls).stop().animate({'opacity': 1}, {duration: controlsToggleTime, easing: controlsToggleEase});
			$(videoControls).stop().animate({'opacity': 1}, {duration: controlsToggleTime, easing: controlsToggleEase});
			
			if(infoOpened){
				$(infoWrapper).stop().animate({'opacity': 1}, {duration: controlsToggleTime, easing: controlsToggleEase});
			}
			
		}
	}
	
	function outComponent() {
		if(videoStarted &&  componentSize=="normal" && componentMode == 'player'){
			$(playerControls).stop().animate({'opacity': 0}, {duration: controlsToggleTime, easing: controlsToggleEase});
			$(videoControls).stop().animate({'opacity': 0}, {duration: controlsToggleTime, easing: controlsToggleEase});
			
			if(infoOpened){
				$(infoWrapper).stop().animate({'opacity': 0}, {duration: controlsToggleTime, easing: controlsToggleEase});
			}
			
		}
	}
	
	//**************** video size
	
	function getPlayerSize(type) {
		if(type == "w"){//width
			return componentSize == "normal" ? playerWidth : getDocumentWidth();
		}else{//height
			return componentSize == "normal" ? playerHeight : getDocumentHeight();
		}
	}
	
	 function resizeMedia() {
		 
		var o, x, y;
		 
		if(_aspectRatio == 0) {//normal media dimensions
			var currentVideoGet = currentVideo.get(0);
			$(currentVideo).css('width', currentVideoGet.videoWidth);
			$(currentVideo).css('height', currentVideoGet.videoHeight);
		}
		else if(_aspectRatio == 1) {//fitscreen
			o = retrieveObjectRatio(true);
			
			$(currentVideo).css('width', o.width);
			$(currentVideo).css('height', o.height);
			
			x = (getPlayerSize('w') - o.width) / 2;
			y = (getPlayerSize('h') - o.height) / 2;
			//console.log(x, y);
			
			$(currentVideo).css('left', x);
			$(currentVideo).css('top', y);
			
		}
		else if(_aspectRatio == 2) {//fullscreen
			o = retrieveObjectRatio(false);
			
			$(currentVideo).css('width', o.width);
			$(currentVideo).css('height', o.height);
			
			x = (getPlayerSize('w') - o.width) / 2;
			y = (getPlayerSize('h') - o.height) / 2;
			//console.log(x, y);
			
			$(currentVideo).css('left', x);
			$(currentVideo).css('top', y);
		}
		
		//console.log($(currentVideo).css('width'), $(currentVideo).css('height'), $(currentVideo).css('left'), $(currentVideo).css('top'));
	}

	 function retrieveObjectRatio( _fitScreen, _paddingX, _paddingY ) {
		 
		if(!_paddingX) _paddingX=0;
		if(!_paddingY) _paddingY=0;
	 
		var currentVideoGet = currentVideo.get(0);
		var targetWidth = currentVideoGet.videoWidth;
		var targetHeight = currentVideoGet.videoHeight;
	 
		var o = new Object();
		
		var destinationRatio = (getPlayerSize('w') - _paddingX) / (getPlayerSize('h') - _paddingY);
		var targetRatio = targetWidth / targetHeight;

		if (targetRatio < destinationRatio) {
			if (!_fitScreen) {//fullscreen
				o.height = ((getPlayerSize('w') - _paddingX) /targetWidth) * targetHeight;
				o.width = (getPlayerSize('w') - _paddingX);
			} else {//fitscreen
				o.width = ((getPlayerSize('h') - _paddingY) / targetHeight) *targetWidth;
				o.height = (getPlayerSize('h') - _paddingY);
			}
		} else if (targetRatio > destinationRatio) {
			if (_fitScreen) {//fitscreen
				o.height = ((getPlayerSize('w') - _paddingX) /targetWidth) * targetHeight;
				o.width = (getPlayerSize('w') - _paddingX);
			} else {//fullscreen
				o.width = ((getPlayerSize('h') - _paddingY) / targetHeight) *targetWidth;
				o.height = (getPlayerSize('h') - _paddingY);
			}
		} else {//fitscreen & fullscreen
			o.width = (getPlayerSize('w') - _paddingX);
			o.height = (getPlayerSize('h') - _paddingY);
		}
		
		return o;
	}
	
	function setPosterSize(w, h) {
		 
		var o, x, y;
		 
		if(_aspectRatio == 0) {//normal media dimensions
			
		}
		else if(_aspectRatio == 1) {//fitscreen
			o = retrievePosterRatio(true, w, h);
			
			$(poster).css('width', o.width);
			$(poster).css('height', o.height);
			
			x = (getPlayerSize('w') - o.width) / 2;
			y = (getPlayerSize('h') - o.height) / 2;
			//console.log(x, y);
			
			$(poster).css('left', x);
			$(poster).css('top', y);
			
		}
		else if(_aspectRatio == 2) {//fullscreen
			o = retrievePosterRatio(false, w, h);
			
			$(poster).css('width', o.width);
			$(poster).css('height', o.height);
			
			x = (getPlayerSize('w') - o.width) / 2;
			y = (getPlayerSize('h') - o.height) / 2;
			//console.log(x, y);
			
			$(poster).css('left', x);
			$(poster).css('top', y);
		}
	}
	
	 function retrievePosterRatio( _fitScreen, w, h ) {
	 
		var _paddingX=0;
		var _paddingY=0;
	 
		var targetWidth = w;
		var targetHeight = h;
	 
		var o = new Object();
		
		var destinationRatio = (getPlayerSize('w')) / (getPlayerSize('h') - _paddingY);
		var targetRatio = targetWidth / targetHeight;

		if (targetRatio < destinationRatio) {
			if (!_fitScreen) {//fullscreen
				o.height = ((getPlayerSize('w') - _paddingX) /targetWidth) * targetHeight;
				o.width = (getPlayerSize('w') - _paddingX);
			} else {//fitscreen
				o.width = ((getPlayerSize('h') - _paddingY) / targetHeight) *targetWidth;
				o.height = (getPlayerSize('h') - _paddingY);
			}
		} else if (targetRatio > destinationRatio) {
			if (_fitScreen) {//fitscreen
				o.height = ((getPlayerSize('w') - _paddingX) /targetWidth) * targetHeight;
				o.width = (getPlayerSize('w') - _paddingX);
			} else {//fullscreen
				o.width = ((getPlayerSize('h') - _paddingY) / targetHeight) *targetWidth;
				o.height = (getPlayerSize('h') - _paddingY);
			}
		} else {//fitscreen & fullscreen
			o.width = (getPlayerSize('w') - _paddingX);
			o.height = (getPlayerSize('h') - _paddingY);
		}
		
		return o;
	}
	
		
	//***************
	
	
	function canPlayVorbis() {
		var v = document.createElement('video');
		return !!(v.canPlayType && v.canPlayType('video/ogg; codecs="theora, vorbis"').replace(/no/, ''));
	}
	
	function canPlayMP4() {
		var v = document.createElement('video');
		return !!(v.canPlayType && v.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"').replace(/no/, ''));
	}
	
	function canPlayWebM() {
		var v = document.createElement('video');
		return !!(v.canPlayType && v.canPlayType('video/webm; codecs="vp8, vorbis"').replace(/no/, ''));
	}

		
		
		
		
		
		
		
		
			/**
		 * Creates the grid and returns an array of points with x and y values based on passed parameters.
		 * The leftToRight addition was contributed by Skye Giordano.
		 * 
		 * @param columns An integer representing the number of columns to be created in the grid
		 * @param rows An integer representing the number of rows to be created in the grid
		 * @param xSpacing An integer representing the spacing between columns
		 * @param ySpacing An integer representing the spacing between rows
		 * @param xPadding An integer representing the padding between each column
		 * @param yPadding An integer representing the padding between each row
		 * @param leftToRight An optional boolean that creates the grid from left-to-right or top-to-bottom (default: true)
		 * 
		 * @return Array
		 */

		function createGrid(columns, rows, xSpacing, ySpacing, xPadding, yPadding, xOffset, yOffset, leftToRight) {
			
			var arr = new Array();
			var pointObj;
			var row;
			var col;
			var num = (columns * rows);

			for (var i = 0; i < num; i++) {
				pointObj = new Object();

				if (leftToRight) {
					row = (i % columns);
					col = Math.floor((i / columns));

					pointObj.x = (row * (xSpacing + xPadding)) + xOffset;
					pointObj.y = (col * (ySpacing + yPadding)) + yOffset;

				} else {
					row = (i % rows);
					col = Math.floor((i / rows));

					pointObj.x = (col * (xSpacing +xPadding)) + xOffset;
					pointObj.y = (row * (ySpacing + yPadding)) + yOffset;

				}
				arr.push(pointObj);
			}
			return arr;
		}
		
		
		//****************
		
		function rgb2hex(rgb) {
			 if (  rgb.search("rgb") == -1 ) {
				  return rgb;
			 } else {
				  rgb = rgb.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+))?\)$/);
				  function hex(x) {
					   return ("0" + parseInt(x).toString(16)).slice(-2);
				  }
				  return "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]); 
			 }
		}
		
		function getDocumentWidth(){
			return Math.max(
				//$(document).width(),
				$(window).width(),
				/* For opera: */
				document.documentElement.clientWidth
			);
		};	
		
		function getDocumentHeight(){
			return Math.max(
				$(window).height(),
				/* For opera: */
				document.documentElement.clientHeight
			);
		};
	
	
	
		//browser resize
		$(window).resize(function() {
			 
			 clearTimeout(this.id);
			 this.id = setTimeout(doneResizing, windowResizeInterval);
		});
		
		function doneResizing(){
			//console.log("doneResizing");
			if(componentSize== "fullscreen") resizeComponent();	
		};
	
	
	
		function checkFlashReady(){
			if(getFlashMovie("flashPreview").setData != undefined){
				if(flashReadyIntervalID) clearInterval(flashReadyIntervalID);
				try {
					getFlashMovie('flashPreview').setData(settings, vidPreviewUrlArr, vidMainUrlArr, vidPosterUrlArr, vidThumbUrlArr, videoTitleArr, videoDescriptionArr);//pass data to flash
				}catch(er){};
			}
		 }
 
		function getFlashMovie(name) {
			return (navigator.appName.indexOf("Microsoft") != -1) ? window[name] : document[name];
		}

	
	}
	
})(jQuery);