// JavaScript Document

$(document).ready (function() {
	
	// GLOBAL VARS
	var theBinder = $("#binder");
	binderInstance = new binder;
	
	//INIT on load (no images yet)
	
		// ASSIGN NEW BINDER POSITION
		$("#nav_systems").click(function(){
			binderInstance.position = 1;
		});
		$("#nav_equipment").click(function(){
			binderInstance.position = 2;
		});
		$("#nav_hire").click(function(){
			binderInstance.position = 3;
		});
		$("#nav_songs").click(function(){
			binderInstance.position = 4;
		});
		$("#nav_studio").click(function(){
			binderInstance.position = 5;
		});
		
		
	$("#main_menu ul li").animate({
		fontSize: 19,
		lineHeight: 1.2,
	},300, function(){
		$(this).css({
			"color":"#616465"
			});
		});
		
	
	
		$("#breadcrumb").html("");						  

	
	
	/// ANIMATE MENU
	$("#main_menu ul li:first-child").animate({
		fontSize: 15,
		lineHeight: 1.2,
	}, 300, function(){
		$("a", this).addClass("lift_menu_item");
		$(this).css({
			"color":"white"
			});
		
		});
		
	loadAndSlideContent()
	
	// MAIN MENU CLICK EVENTS
	$("#main_menu ul li").click(function() {
		
		$("#main_menu ul li").animate({
			fontSize: 19,
			lineHeight: 1.2
		},300, function(){
				$("a", this).removeClass("lift_menu_item");
				$(this).css("color","#616465");
			});
		
		$(this).animate({
			fontSize: 15,
			lineHeight: 1.2
		},300, function(){
			$("a", this).addClass("lift_menu_item");
			$(this).css({
				"color":"white"
				});
			});
	
		moveBinderOpenContent();
		
		
	});
	
});

/// OBJECTS
function binder() {
	this.position;
}

/// FUNCTIONS
function moveBinderOpenContent(){
	$("#breadcrumb").fadeOut('fast');
	if (binderInstance.position==1) {
		
		$("#binder").animate({
			left: 10
			});
		loadAndSlideContent();	
	} else if (binderInstance.position==2){
		$("#binder").animate({
			left: 200
			});
		loadAndSlideContent();	
	} else if (binderInstance.position==3){
		$("#binder").animate({
			left: 400
			});
		loadAndSlideContent();	
	} else if (binderInstance.position==4){
		$("#binder").animate({
			left: 600
			});
		loadAndSlideContent();	
	} else if (binderInstance.position==5){
		$("#binder").animate({
			left: 790
			});
		loadAndSlideContent();	
	}
}


///////// OLD ///////////////////////
function loadAndSlideContent() {
	
			
	$('#content_wrapper').slideUp(750, function() {
		$('#content_wrapper').fadeOut('fast');	
		switch(binderInstance.position)
			{
			case 1:
			  	$.get("/components/karaoke_systems.php", {
					  	name: "karaoke_systems",
					  	time: "2pm"
					  },function(data){
					changeDataAndSlideDown(data);
				});
			  break;
			case 2:
			  $.get("/components/karaoke_equipment.php", {
						name: "karaoke_equipment",
						time: "2pm"
					},function(data){
					changeDataAndSlideDown(data);
				});
			  break;
			case 3:
			  $.get("/components/karaoke_hire.php", { 
						name: "karaoke_hire", 
						time: "2pm" 
					},function(data){
					changeDataAndSlideDown(data);
				} );
			  break;
			case 4:
			  $.get("/components/karaoke_songs.php", { 
						name: "karaoke_songs", 
						time: "2pm" 
					},function(data){
					changeDataAndSlideDown(data);
				} );
			  break;
			case 5:
			  $.get("/components/studio.php", { 
						name: "studio", 
						time: "2pm" 
					},function(data){
					changeDataAndSlideDown(data);
				} );
			  break;
			default:
			  $.get("/components/karaoke_systems.php", { 
						name: "karaoke_systems", 
						time: "2pm" 
					},function(data){
					changeDataAndSlideDown(data);
				} );
			}
 		 });
}

function changeDataAndSlideDown(data) {
	$("#content_wrapper").html(data);
	$('#content_wrapper').slideDown(750, function() {
		$("#breadcrumb").fadeIn('slow');
 	});	
}
function changeDataAndFadeIn(data) {
	$("#content_wrapper").html(data);
	$('#content_wrapper').fadeIn(750);	
}


///////// LOAD PAGE ///////////////////////
function loadNewPageWithFade(thisPageName, id_product, id_system, id_category, id_sub1cat, id_sub2cat, id_productimage) {
	console.info("loadNewPageWithFade called in framework.js "+thisPageName+" "+id_category);
			$('#content_wrapper').fadeOut('fast');
			$.get("/components/karaoke_"+thisPageName+".php", {
				  			name: thisPageName,
							id_product: id_product,
							id_system: id_system,
							id_category: id_category,
							id_sub1cat: id_sub1cat,
							id_sub2cat: id_sub2cat,
							id_productimage: id_productimage
						  },function(data){
						changeDataAndFadeIn(data);
			});
		
}

function loadNewPageWithCurtainDrop(thisPageName, id_product, id_system, id_category, id_sub1cat, id_sub2cat, id_productimage) {
		console.info("called in framework.js "+thisPageName+" "+id_product);
		$('#content_wrapper').slideUp(750, function() {
			$('#content_wrapper').fadeOut('fast');
			$.get("/components/karaoke_"+thisPageName+".php", {
				  			name: thisPageName,
							id_product: id_product,
							id_system: id_system,
							id_category: id_category,
							id_sub1cat: id_sub1cat,
							id_sub2cat: id_sub2cat,
							id_productimage: id_productimage
						  },function(data){
						changeDataAndSlideDown(data);
			});
		});
		moveBinder();
}

function changeDataAndSlideNewPageDown(data) {
		$("#content_wrapper").html(data);
		$('#content_wrapper').slideDown(750, function() {
			//$("#breadcrumb").fadeIn('slow');
		});	
}


///////// LOAD FRAMES ///////////////////////
function loadNewFramesForPage (thisFileURL, thisPageFrame) {
		
	$('#'+thisPageFrame).fadeOut('fast');
	$.get(thisFileURL, {
					
				  		},function(data){
							$("#"+thisPageFrame).html(data);
							$('#'+thisPageFrame).fadeIn(750);
	});
		
}



///////// MOVE BINDER ///////////////////////
function moveBinder(){
	$("#breadcrumb").fadeOut('fast');
	if (binderInstance.position==1) {
		
		$("#binder").animate({
			left: 10
			});
		loadAndSlideContent();	
	} else if (binderInstance.position==2){
		$("#binder").animate({
			left: 200
			});
		loadAndSlideContent();	
	} else if (binderInstance.position==3){
		$("#binder").animate({
			left: 400
			});
		loadAndSlideContent();	
	} else if (binderInstance.position==4){
		$("#binder").animate({
			left: 600
			});
		loadAndSlideContent();	
	} else if (binderInstance.position==5){
		$("#binder").animate({
			left: 790
			});
	
	}
}