var showVideo, hideVideo, bindSaturationHovers, unbindSaturationHovers;

jQuery(document).ready(function($) {
    var paircount = 0;
    var hideTimer = setTimeout(function() { }, 1);
    var myPlayer = null;

    hideVideo = function(obj) {
		$videoContainer = $(obj).parent().parent().parent();
		fadeSpeed = 600;
		
		$videoContainer.fadeOut(fadeSpeed); // fade video out
	
		myPlayer = null;
	
		$('img#header_img, .panel-overlay').fadeIn(fadeSpeed);
		$('img#header_img, .panel-overlay').show();
		$videoContainer.prev().prev().prev().fadeIn(fadeSpeed); // fade saturated image in
		$videoContainer.prev().prev().fadeIn(fadeSpeed); // fade desaturated image in
		$videoContainer.prev().fadeIn(fadeSpeed); // fade overlay panel in
		$videoContainer.prev().children().fadeIn(fadeSpeed); // fade overlay text and buttons in
		$videoContainer.next().fadeIn(fadeSpeed); // fade overlay in
		$('.nav-next, .nav-prev, .nav-overlay, .strip_wrapper, #pointer').fadeIn(fadeSpeed); // fade overlay controls in
		
		//bindSaturationHovers();
		
		$(document).bind('mousemove', docMovementFunction);
    };

    showVideo = function(obj) {
		$panelOverlay = $(obj).parent();
		fadeSpeed = 600;
		
		$(document).unbind('mousemove', docMovementFunction);
		
		$('img#header_img').fadeOut(fadeSpeed);
		$('img#header_img').hide();
		$panelOverlay.prev().fadeOut(fadeSpeed); // fade saturated image out
		$panelOverlay.prev().prev().fadeOut(fadeSpeed); // fade desaturated image out
		$panelOverlay.next().next().fadeOut(fadeSpeed); // fade overlay out
		$panelOverlay.fadeOut(fadeSpeed); // fade overlay text out
		$('.nav-next, .nav-prev, .nav-overlay, .strip_wrapper, #pointer').fadeOut(fadeSpeed); // fade overlay controls out
	
		$panelOverlay.next().fadeIn(fadeSpeed); // fade video in
		
		myPlayer = VideoJS.setup($panelOverlay.next().find('.video-js').get(0), {autoplay: true});
		myPlayer.play();
			
		//unbindSaturationHovers();
		
		$panelOverlay.parent().find('img').fadeOut(fadeSpeed);
		$panelOverlay.parent().find('.better_videos').fadeIn(fadeSpeed);
		
		
		
    };

    bindSaturationHovers = function() {
		$('.panel').bind(
			"mouseover",
			showSaturated
		);
	
		$('.panel').bind(
			"mouseout",
			hideSaturated
		);
	
		$('#header, .better_videos, .video, .video-js-box, .vjs-flash-fallback, #pointer, img.nav-overlay, .nav-next, .nav-prev, #primary-menu ul, #primary-menu ul li, #header_img, .filmstrip, .frame, .strip_wrapper').bind(
			"mouseover",
			showSaturated
		);
	
		$('#header, .better_videos, .video, .video-js-box, .vjs-flash-fallback, #pointer, img.nav-overlay, .nav-next, .nav-prev, #primary-menu ul, #primary-menu ul li, #header_img, .filmstrip, .frame, .strip_wrapper').bind(
			"mouseout",
			hideSaturated
		);
		};
	
		unbindSaturationHovers = function() {
		$('.panel').unbind(
			"mouseover mouseout",
			showSaturated
		);
	
		$('#header, .better_videos, .video, .video-js-box, .vjs-flash-fallback, #pointer, img.nav-overlay, .nav-next, .nav-prev, #primary-menu ul, #primary-menu ul li, #header_img, .filmstrip, .frame, .strip_wrapper').unbind(
			"mouseover mouseout",
			showSaturated
		);
    };

    function showSaturated() {
		clearTimeout(hideTimer);
		$(".desaturated.color", '.panel').fadeIn(600);
    }

    function hideSaturated() {
		clearTimeout(hideTimer);
		hideTimer = setTimeout(
			function() {
			$(".desaturated.color", '.panel').fadeOut(600);
			},
			1000
		);
    }

    /* If you want to desaturate after page loaded - use onload event
     * of image.
     */
    /*function initImage(obj) {
	obj.onload = null;
	var $newthis = $(obj);

	if ($.browser.msie) {
	    // You need this only if desaturate png with aplha channel
	    $newthis = $newthis.desaturateImgFix();
	}

	// class for easy switch between color/gray version
	$newthis.addClass("pair_" + ++paircount);
	var $cloned = $newthis.clone();
	// reset onload event on cloned object
	$cloned.get(0).onload = null;
	// add cloned after original image, we will switch between
	// original and cloned later
	$cloned.insertAfter($newthis).addClass("color").hide();
	// desaturate original
	$newthis.desaturate();
    }

    $(".desaturated").each(function() {
    	initImage(this);
    });*/
});
