$(document).ready(function() {
	initThemeMenu();

	$("#theme-menu .menuitem").hover(
		function(){
			makeActive(this);
		},
		function(){
			makeInactive(this);
		}
	);
	
	$("#theme-menu .navLeft").click(function(){
		if ( $(this).hasClass('active') ) thememenu_slideRight();
	});
	$("#theme-menu .navRight").click(function(){
		if ( $(this).hasClass('active') ) thememenu_slideLeft();
	});
	
});

var thememenu_showing = false;
var thememenu_sliding = false;
var thememenu_firstItem = 0;
var thememenu_visibleItems = 5;
var thememenu_menuitemCount = 0;
var thememenu_menuitemWidth = 130;
var hideTimer = 0;
var showTimer = 0;
var firstShow = true;
var mouseOverSite = false;
var mouseOverThemeMenu = false;
var mouseOverNoThemeMenuBlock = false;

function initThemeMenu(){
	thememenu_menuitemCount = $("#theme-menu .menuitem").length;
	thememenu_menuitemWidth = $("#theme-menu .menuitem").width()+1;
	
	$("#theme-menu .menuitem .image").css('opacity', 0.3);	
	$("#theme-menu .menuitem.active .image").css('opacity', 1);	
	
	//Make sure the active theme is centered
	if ( $("#theme-menu .menuitem.active").length ){
		var indexActive = $("#theme-menu .menuitem.active").index();
		if ( indexActive>2 ){
			for ( i=0; i<(indexActive-2); i++ ) thememenu_slideLeft(0);
		}else if ( indexActive<2 ){
			for ( i=0; i<(2-indexActive); i++ ) thememenu_slideRight(0);
		}
	}
	
	//If we're not in a theme start the animation
	if ( !$("body").hasClass('theme') ){
		startThemeHighlightingAnimation();
	}
	
	//If the visitor uses a touchscreen, always show the theme-menu
	if ( isTouchScreen ) {
		showThemeMenu();
	}else {
		$("#header .header-top").hover(function(){
			mouseOverThemeMenu = true;
			mouseOverSite = true;
			if (!$("body.theme").length) {
				clearTimeout(hideTimer);
				showThemeMenu();
				firstShow = false;
			}
		}, function(){
			mouseOverThemeMenu = false;
			if (mouseOverSite) 
				hideTimer = setTimeout(hideThemeMenu, 250);
		});
	}
	
	$("body").hover(
		function(){
			mouseOverSite = true;
			if ( !mouseOverThemeMenu ) hideTimer = setTimeout(hideThemeMenu, 250);
		},
		function(){
			mouseOverSite = false;
		}
	);
	
	$("#no-theme-menu-block").hover(
		function(){
			mouseOverNoThemeMenuBlock = true;
		},
		function(){
			mouseOverNoThemeMenuBlock = false;
		}
	);

	
	//Show it on startup
	if ( showThemeMenuOnLoad ) setTimeout(showThemeMenuOnce, 1000);
}

var themeHighlightingAnimationTimer = null;
var highlightedItemIndex = -1;

function startThemeHighlightingAnimation(){
	highlightedItemIndex = thememenu_firstItem;
	themeHighlightingAnimationTimer = setTimeout(themeHighlightItem, 1500);
}

function stopHighlightingAnimation(){
	if ( themeHighlightingAnimationTimer ) clearTimeout(themeHighlightingAnimationTimer);
	$("#theme-menu .menuitem").not('.active').removeClass('hover').children('.raster').css('height', 5);
}

function themeHighlightItem(){
	if ( thememenu_showing ) return; 
	
	var item = $("#theme-menu .menuitem").eq(highlightedItemIndex);
	
	if ( !$(item).hasClass('active') ){
		$(item).addClass('hover');
		$('.raster', item).animate({height:15},300).delay(1000).animate({height:5},300, function(){
			$(item).removeClass('hover')

			//start next highlight
			highlightedItemIndex++;
			if ( highlightedItemIndex >= (thememenu_firstItem+thememenu_visibleItems) ) highlightedItemIndex = thememenu_firstItem;
			themeHighlightingAnimationTimer = setTimeout(themeHighlightItem, 1500);
		});
	}
}

function showThemeMenuOnce(){
	showThemeMenu();
	hideTimer = setTimeout(hideThemeMenu, 2000);
}

function showThemeMenu(){
	if ( !thememenu_showing && !mouseOverNoThemeMenuBlock ) {
		thememenu_showing = true;
		if (hideTimer) 
			clearTimeout(hideTimer);
		if (showTimer) 
			clearTimeout(showTimer);
		stopHighlightingAnimation();
		$(".theme-menu-holder").stop();
		$(".theme-menu-holder").animate({
			'height': $("#theme-menu").height()
		}, 1000, "easeOutExpo");
	}
}

function hideThemeMenu(){
	if ( $("body.theme").length ) return; //Never hide on a theme page
	
	if ( thememenu_showing && mouseOverSite && !isTouchScreen ) {
		$(".theme-menu-holder").stop();
		$(".theme-menu-holder").animate({
			'height': 12
		}, 1000, "easeOutExpo", function(){
			startThemeHighlightingAnimation();
		});
		thememenu_showing = false;
	}
	hideTimer = 0;
}

var removeFirstMenuItem = false;
function thememenu_slideLeft(animation_time){
	if ( thememenu_sliding ) return;
	thememenu_sliding = true;
	
	if ( animation_time==undefined ) animation_time=200;
	
	//Stop current animations
	$("#theme-menu .slider").stop();
	
	//If there is no element on the right, we copy the first element over there
	if ( thememenu_firstItem+thememenu_visibleItems >= thememenu_menuitemCount ) {
		//make space for the new element
		$("#theme-menu .slider").width($("#theme-menu .slider").width()+thememenu_menuitemWidth);
		$("#theme-menu .slider").append($("#theme-menu .slider .menuitem:first").clone(true));
		removeFirstMenuItem = true;
	}
	
	var newLeft = -(thememenu_firstItem+1)*thememenu_menuitemWidth;
	thememenu_firstItem++;
	$("#theme-menu .slider").animate({left:newLeft},animation_time, function(){
		if ( removeFirstMenuItem ){
			$("#theme-menu .slider .menuitem:first").remove();
			thememenu_firstItem--;
			$("#theme-menu .slider").css('left', -thememenu_firstItem*thememenu_menuitemWidth).width($("#theme-menu .slider").width()-thememenu_menuitemWidth);
			removeFirstMenuItem = false;
		}
		thememenu_sliding = false;
	});
}

var removeLastMenuItem = false;
function thememenu_slideRight(animation_time){
	if ( thememenu_sliding ) return;
	thememenu_sliding = true;
	
	if ( animation_time==undefined ) animation_time=200;
	
	//Stop current animations
	$("#theme-menu .slider").stop();
	
	//If there is no element on the Left, we copy the last element over there
	if ( thememenu_firstItem<=0 ) {
		thememenu_firstItem++;
		//make space for the new element
		$("#theme-menu .slider").width($("#theme-menu .slider").width()+thememenu_menuitemWidth).css('left', -thememenu_firstItem*thememenu_menuitemWidth);
		$("#theme-menu .slider").prepend($("#theme-menu .slider .menuitem:last").clone(true));
		removeLastMenuItem = true;
	}
	
	var newLeft = -(thememenu_firstItem-1)*thememenu_menuitemWidth;
	thememenu_firstItem--;
	$("#theme-menu .slider").animate({left:newLeft},animation_time, function(){
		if ( removeLastMenuItem ){
			$("#theme-menu .slider .menuitem:last").remove();
			$("#theme-menu .slider").width($("#theme-menu .slider").width()-thememenu_menuitemWidth);
			removeLastMenuItem = false;
		}
		thememenu_sliding = false;
	});
}

function makeActive(item){
	if ( $(item).hasClass('active') ) return;

	$(item).addClass('hover');
	//Stop current animation
	$('.image,.raster', item).stop();
	//Start new animation
	$('.image', item).animate({paddingTop: 0,opacity:1},200);
	$('.raster', item).animate({height:15},200);
}


function makeInactive(item){
	if ( $(item).hasClass('active') ) return;

	$(item).removeClass('hover');
	//Stop current animation
	$('.image,.raster', item).stop();
	//Start new animation
	$('.image', item).animate({paddingTop: 5,opacity:0.3},200);
	$('.raster', item).animate({height:5},200);
}



