var Pages = {
	home: {
		images: [
			"images/home/img-1.jpg",
			"images/home/img-2.jpg",
			"images/home/img-3.jpg",
			"images/home/img-4.jpg",
			"images/home/img-5.jpg",
			"images/home/img-6.jpg",
			"images/home/img-7.jpg",
			"images/home/img-8.jpg"
		]
	},
	instructor: {
		images: [
			"images/instructor/img-1.jpg",
			"images/instructor/img-2.jpg",
			"images/instructor/img-3.jpg",
			"images/instructor/img-4.jpg",
			"images/instructor/img-5.jpg",
			"images/instructor/img-6.jpg",
			"images/instructor/img-7.jpg",
			"images/instructor/img-8.jpg",
			"images/instructor/img-10.jpg",
			"images/instructor/img-11.jpg",
			"images/instructor/img-12.jpg"
		]			
	},
	kids: {
		images: [
			"images/kids/img-1.jpg",
			"images/kids/img-2.jpg",
			"images/kids/img-3.jpg",
			"images/kids/img-4.jpg",
			"images/kids/img-5.jpg",
			"images/kids/img-6.jpg"
		]			
	},
	schedule: {
		action: function(){
			$('html, body').animate({scrollTop: $("#footer").offset().top}, 500);
		}
	},
	fees: {
		noImageOverlay: true
	},
	qa: {
		images: [
			"images/qa/img-1.jpg"
		]
	},
	gallery: {
		noImageOverlay: true
	},
	merchandise: {
		noImageOverlay: true
	},
	location: {
		noImageOverlay: true
	},
	links: {
		images: [
				"images/links/img-1.jpg"
			]
	},
	contact: {
		action: function(){
			$('html, body').animate({scrollTop: $("#footer").offset().top}, 500);
		}
	}
};

function selectMenuItem(which)
{
	var $mi = $("#menu-" + which);
	var direction = $mi.index() > $("#menu li.selected").index() ? -1 : 1;
	if ($mi.length > 0)
	{
		var page = Pages[which];
		if ($.isFunction(page.action))
		{
			page.action();
		}
		else
		{
			var body = $("#page-" + which);
			if (body.length > 0)
			{
				var placeholder = page.noImageOverlay ? '' : '<div class="bodyImagePlaceholder"></div>';
				var html = '<div class="content new">' + placeholder + body.html() + '</div>';
				var title = '<div class="title new" style="background-image: url(images/title-' + which + '.png);" />';
				var width = $("#contentArea").width();
				
				// this is not the first content page we've loaded
				if ($('#contentArea .new').length > 0)
				{
					$('#contentArea .new, #title .new').removeClass('new').addClass('old');
					var padding = $("#contentArea .old").css("paddingLeft").stripUnit() + $("#contentArea .old").css("paddingRight").stripUnit();

					// make a nice animation transition
					$("#contentArea .old").animate(
						{ left: (width * direction) }, 
						{ 
							duration: 500, 
							queue: false, 
							complete: function() { $(this).remove(); }
						}
					);
					
					$(html).appendTo("#contentArea")
						.css({
							top: 0,
							left: (width * -direction),
							width: width - padding
						})
						.animate(
							{ left: 0 }, 
							{ 
								duration: 500, 
								queue: false
							}
						);
						
					$("#title .old").animate(
						{ opacity: 0 }, 
						{ 
							duration: 500, 
							queue: false, 
							complete: function() { $(this).remove(); }
						}
					);
					
					$(title).appendTo("#title")
						.css({
							opacity: 0
						})
						.animate(
							{ opacity: 1 }, 
							{ 
								duration: 500, 
								queue: false
							}
						);
				}
				else
				{
					$(html)
						.appendTo("#contentArea")
						.css({
								top: 0,
								left: 0,
								width: width - 60
							});
					$(title).appendTo("#title");
				}
				
				$("#menu li.selected").removeClass("selected");
				$mi.addClass("selected");
				if (page.noImageOverlay) $("#mainImage").slideUp(); 
				else 
				{							
					slideShow(10000, which);
					$("#mainImage").slideDown();					
				}
			}
		}
	}
}

$(document).ready(function() {
	selectMenuItem("home");	
	
	// the iframe Google Map doesn't work in Safari/Chrome because of some
	// weird cross-domain error... just put an image instaed.
	if ($.browser.webkit)
	{
		$("#map").html('<a class="maplink" href="http://maps.google.com/maps?f=q&amp;source=embed&amp;hl=en&amp;geocode=&amp;q=7601+E.+Gray+Road,+Suite+C++Scottsdale,+AZ+85260&amp;sll=33.670099,-112.05956&amp;sspn=0.207439,0.426407&amp;ie=UTF8&amp;hq=&amp;hnear=7601+E+Gray+Rd,+Scottsdale,+Maricopa,+Arizona+85260&amp;ll=33.62434,-111.901588&amp;spn=0.060749,0.109863&amp;z=13&amp;iwloc=A"><img src="images/map.jpg" class="contentImg" /></a>');
	}
		
	$("#menu li").bind("click", function() {
		selectMenuItem($(this).attr("id").replace("menu-", ""));
	});
	
	// preload pics in cache so they show up quickly for the slideshow
	for (var page in Pages)
	{
		if (page.images && page.images.length > 0)
		{
			for (var i = 0; i < page.images.length; i++)
				$("#pages").append('<img src="' + page.images[i] + '" />').ready(function() { $(this).remove(); });
		}
	}
});

function showLocation()
{
	selectMenuItem('location');
	 $('html, body').animate({scrollTop:0}, 500);
}

String.prototype.stripUnit = function()
{
	var val = this.toString();
	if (val == null || val == undefined || val == '' || val == 'auto') return val;

	re = new RegExp('(px|pt|em|\%|auto)', "g");
	var num = val.replace(re, '');
	if (num == "") num = '0';
	return parseInt(num);
};
		
function slideShow(speed, pageName) 
{				
	var current = $("#mainImage").data("currentSlideShow");
	if (current != pageName && $("#mainImage").data(current + "Timer"))
	{
		clearInterval($("#mainImage").data(current + "Timer"));
		$("#mainImage").removeData(current + "Timer");
	}
	
	gallery(pageName);
	
	var page = Pages[pageName];
	if (page && page.images && page.images.length > 1) 
	{
		if (speed < 1500) speed = 1500;
		
		//Call the gallery function to run the slideshow	
		var timer = setInterval('gallery("' + pageName + '")',speed);
		
		$("#mainImage").data("currentSlideShow", pageName);
		$("#mainImage").data(pageName + "Timer", timer);
	}
	
}

function gallery(pageName) 
{
	var page = Pages[pageName];
	
	if (page && page.images) 
	{
		var img = '<div class="mainImage new" style="background-image: url([file]);" />';
		
		if ($("#mainImage .new").length > 0)
		{
			$('#mainImage .new').removeClass('new').addClass('old');
			var index = $('#mainImage').data(pageName + "Index");
			index = (index != null) ? index : -1;
			
			index++;
			if (index > page.images.length - 1) index = 0;
			
			img = img.replace("[file]", page.images[index]);

			$("#mainImage").data(pageName + "Index", index);
			
			$("#mainImage .old").animate(
				{ opacity: 0 }, 
				{ 
					duration: 1500, 
					queue: false, 
					complete: function() { $(this).remove(); }
				}
			);
			
			$(img).appendTo("#mainImage")
				.css({
					opacity: 0
				})
				.animate(
					{ opacity: 1 }, 
					{ 
						duration: 1500, 
						queue: false
					}
				);						
		}
		else
		{
			img = img.replace("[file]", page.images[0]);
			$("#mainImage").html(img).data(pageName + "Index", 0);
		}
	}
}