$(document).ready(function(){
   // all the code goes here! including functions!!!
   
	//References
	var sections = $("#menu li");
	var products = $("#products li");
	var products_content = $("#products_content");
	var loading = $("#loading");
	var content = $("#content");
	loading.hide(); 
	products_content.load("products.php #section_box"); // Load product box
	
	//Manage click events
	sections.click(function(){
		//show the loading bar
		showLoading();
		
		//load se<b style="color: black; background-color: rgb(160, 255, 255);">l</b>ected section
		switch(this.id){
			case "commercial":
				content.show('slow');
				content.load("video.php #section_commercial", hideLoading);
				break;
			case "drpat":
				content.show('slow');
				content.load("video.php #section_drpat", hideLoading);
				break;
			case "testimony":
				content.show('slow');
				content.load("video.php #section_testimony", hideLoading);
				break;
			default:
				//hide loading bar if there is no selected section
				hideLoading();
				break;
		}
	});
	
	products.hover(
	
	function(){
		//Over
		products_content.html("");
		switch(this.id){
			case "book":
				//products_content.html("");
				products_content.load("products.php #section_book");				
				break;
			case "cd":
				//products_content.html("");
				products_content.load("products.php #section_cd");
				break;
			case "dvd":
				//products_content.html("");
				products_content.load("products.php #section_dvd");
				break;
			default:
			//products_content.html("");
			//products_content.load("products.php #section_box");
			break;
		}
	},
	
	function(){
		//Out
		//products_content.fadeOut(100);
		//products_content.fadeOut();products_content.html("");
		//products_content.load("products.php #section_box",showBox); // Load product box	
		//products_content.fadein(500);
	}
	);

	
	//Show default
	function showBox() {
		products_content.load("products.php #section_box"); // Load product box		
	}
	
	//show loading bar
	function showLoading(){
		loading
			.css({visibility:"visible"})
			.css({opacity:"1"})
			.css({display:"block"})
		;
	}
	//hide loading bar
	function hideLoading(){
		loading.fadeTo(1000, 0);
		content.slideDown();
	};
	
});