$(document).ready(function(){
	//References
	var sections = $("#keylink li");
	var loading = $("#loading");
	var content = $("#steps");
	
	//Manage click events
	sections.click(function(){
		//show the loading bar
		showLoading();
		//load selected section
		switch(this.id){
			case "cal1":
				content.slideUp();
				content.load("../steps.html #test", hideLoading);
				content.slideDown();
				break;
			case "12sky":
				content.slideUp();
				content.load("../steps.html #12sky1", hideLoading);
				content.slideDown();
				break;
			case "shaiya":
				content.slideUp();
				content.load("../steps.html #shaiya1", hideLoading);
				content.slideDown();
				break;
			case "domo":
				content.slideUp();
				content.load("../steps.html #domo1", hideLoading);
				content.slideDown();
				break;
			case "projecttorque":
				content.slideUp();
				content.load("../steps.html #projecttorque1", hideLoading);
				content.slideDown();
				break;
			case "lastchaos":
				content.slideUp();
				content.load("../steps.html #lastchaos1", hideLoading);
				content.slideDown();
				break;
			case "megaten":
				content.slideUp();
				content.load("../steps.html #megaten1", hideLoading);
				content.slideDown();
				break;
			case "flyff":
				content.slideUp();
				content.load("../steps.html #flyff1", hideLoading);
				content.slideDown();
				break;
			case "rappelz":
				content.slideUp();
				content.load("../steps.html #rappelz1", hideLoading);
				content.slideDown();
				break;
			case "pistory":
				content.slideUp();
				content.load("../steps.html #pistory1", hideLoading);
				content.slideDown();
				break;
			case "dreamlords":
				content.slideUp();
				content.load("../steps.html #dreamlords1", hideLoading);
				content.slideDown();
				break;
			case "corum-online":
				content.slideUp();
				content.load("../steps.html #corum-online1", hideLoading);
				content.slideDown();
				break;
			case "upshift-strikeracer":
				content.slideUp();
				content.load("../steps.html #upshift-strikeracer1", hideLoading);
				content.slideDown();
				break;
			case "godswar-online":
				content.slideUp();
				content.load("../steps.html #godswar-online1", hideLoading);
				content.slideDown();
				break;
			case "saga-online":
				content.slideUp();
				content.load("../steps.html #saga-online1", hideLoading);
				content.slideDown();
				break;
			case "stoneage2":
				content.slideUp();
				content.load("../steps.html #stoneage21", hideLoading);
				content.slideDown();
				break;
			case "turfbattles":
				content.slideUp();
				content.load("../steps.html #turfbattles1", hideLoading);
				content.slideDown();
				break;
			case "wonderland":
				content.slideUp();
				content.load("../steps.html #wonderland1", hideLoading);
				content.slideDown();
				break;
			case "angelsonline":
				content.slideUp();
				content.load("../steps.html #angelsonline1", hideLoading);
				content.slideDown();
				break;
			case "talesofpirates":
				content.slideUp();
				content.load("../steps.html #talesofpirates1", hideLoading);
				content.slideDown();
				break;
			case "voyagecentury":
				content.slideUp();
				content.load("../steps.html #voyagecentury1", hideLoading);
				content.slideDown();
				break;
			case "lordsofevil":
				content.slideUp();
				content.load("../steps.html #lordsofevil1", hideLoading);
				content.slideDown();
				break;
			case "legacyofholycastle":
				content.slideUp();
				content.load("../steps.html #legacyofholycastle1", hideLoading);
				content.slideDown();
				break;
			case "talesrunner":
				content.slideUp();
				content.load("../steps.html #talesrunner1", hideLoading);
				content.slideDown();
				break;
			case "9dragons":
				content.slideUp();
				content.load("../steps.html #9dragons1", hideLoading);
				content.slideDown();
				break;
			case "bots":
				content.slideUp();
				content.load("../steps.html #bots1", hideLoading);
				content.slideDown();
				break;
			case "dance-online":
				content.slideUp();
				content.load("../steps.html #dance-online1", hideLoading);
				content.slideDown();
				break;
			case "ponystars":
				content.slideUp();
				content.load("../steps.html #ponystars1", hideLoading);
				content.slideDown();
				break;
			case "ranchstars":
				content.slideUp();
				content.load("../steps.html #ranchstars1", hideLoading);
				content.slideDown();
				break;
			case "ageoflore":
				content.slideUp();
				content.load("../steps.html #ageoflore1", hideLoading);
				content.slideDown();
				break;
			case "mydivadoll":
				content.slideUp();
				content.load("../steps.html #mydivadoll1", hideLoading);
				content.slideDown();
				break;
			case "galaxyonline":
				content.slideUp();
				content.load("../steps.html #galaxyonline1", hideLoading);
				content.slideDown();
				break;
			case "spellborn":
				content.slideUp();
				content.load("../steps.html #spellborn1", hideLoading);
				content.slideDown();
				break;
			case "banishland":
				content.slideUp();
				content.load("../steps.html #banishland1", hideLoading);
				content.slideDown();
				break;
			case "lunaonline":
				content.slideUp();
				content.load("../steps.html #lunaonline1", hideLoading);
				content.slideDown();
				break;
			case "12sky2":
				content.slideUp();
				content.load("../steps.html #12sky21", hideLoading);
				content.slideDown();
				break;
			case "crossfire":
				content.slideUp();
				content.load("../steps.html #crossfire1", hideLoading);
				content.slideDown();
				break;
			case "darkorbit":
				content.slideUp();
				content.load("../steps.html #darkorbit1", hideLoading);
				content.slideDown();
				break;
			case "gladius2":
				content.slideUp();
				content.load("../steps.html #gladius21", hideLoading);
				content.slideDown();
				break;
			case "mafia1930":
				content.slideUp();
				content.load("../steps.html #mafia19301", hideLoading);
				content.slideDown();
				break;
			case "deepolis":
				content.slideUp();
				content.load("../steps.html #deepolis1", hideLoading);
				content.slideDown();
				break;
			case "asdastory":
				content.slideUp();
				content.load("../steps.html #asdastory1", hideLoading);
				content.slideDown();
				break;
			case "mlbdugoutheroes":
				content.slideUp();
				content.load("../steps.html #mlbdugoutheroes1", hideLoading);
				content.slideDown();
				break;
			case "dragonsky":
				content.slideUp();
				content.load("../steps.html #dragonsky1", hideLoading);
				content.slideDown();
				break;
			case "wolfteam":
				content.slideUp();
				content.load("../steps.html #wolfteam1", hideLoading);
				content.slideDown();
				break;
			case "thehunter":
				content.slideUp();
				content.load("../steps.html #thehunter1", hideLoading);
				content.slideDown();
				break;
			case "eartheternal":
				content.slideUp();
				content.load("../steps.html #eartheternal1", hideLoading);
				content.slideDown();
				break;
			case "poxnora":
				content.slideUp();
				content.load("../steps.html #poxnora1", hideLoading);
				content.slideDown();
				break;
			case "legendsofzork":
				content.slideUp();
				content.load("../steps.html #legendsofzork1", hideLoading);
				content.slideDown();
				break;
			case "utopiakingdoms":
				content.slideUp();
				content.load("../steps.html #utopiakingdoms1", hideLoading);
				content.slideDown();
				break;
			case "fiesta":
				content.slideUp();
				content.load("../steps.html #fiesta1", hideLoading);
				content.slideDown();
				break;
			case "projectpowder":
				content.slideUp();
				content.load("../steps.html #projectpowder1", hideLoading);
				content.slideDown();
				break;
			case "windslayer":
				content.slideUp();
				content.load("../steps.html #windslayer1", hideLoading);
				content.slideDown();
				break;
			case "hattrick":
				content.slideUp();
				content.load("../steps.html #hattrick1", hideLoading);
				content.slideDown();
				break;
			case "parabellum":
				content.slideUp();
				content.load("../steps.html #parabellum1", hideLoading);
				content.slideDown();
				break;
			case "onverse":
				content.slideUp();
				content.load("../steps.html #onverse1", hideLoading);
				content.slideDown();
				break;
			case "monatoesprit":
				content.slideUp();
				content.load("../steps.html #monatoesprit1", hideLoading);
				content.slideDown();
				break;
			case "battleswarm":
				content.slideUp();
				content.load("../steps.html #battleswarm1", hideLoading);
				content.slideDown();
				break;
			default:
				//hide loading bar if there is no selected section
				hideLoading();
				break;
		}
	});

	//show loading bar
	function showLoading(){
		loading
			.css({visibility:"visible"})
			.css({opacity:"1"})
			.css({display:"block"})
		;
	}
	//hide loading bar
	function hideLoading(){
		loading.fadeTo(1000, 0);
	};
});