
/* Menu
   ================================================= */

MsContent = {};

MsContent.init = function() {

	MsContent.content = $('#columns');
	MsContent.content.originalWidth = MsContent.content.width();

	MsContent.button = $('#content-text-bar-toggle');

	MsContent.state = "shown";
}

MsContent.toggle = function()
{

	if (MsContent.state == "shown") {

		// expand
		MsContent.content.animate(
					{ width: "0"},
					500,
					function() {
						MsContent.content.hide();
						MsContent.state = "hidden";
						MsContent.button.addClass("hidden");
					});

	} else {

		MsContent.content.animate(
				{ width: MsContent.content.originalWidth},
				500,
				function() {
					MsContent.content.show();
					MsContent.state = "shown";
					MsContent.button.removeClass("hidden");
				});
	}



}


/* Background Images
================================================= */

var MsBackgroundImages = {
		images: [],
		currentIndex: 0
};

MsBackgroundImages.init = function()
{
	this.imageContainer = $('#content-photo-holder');
}

MsBackgroundImages.addImage = function()
{
	for (var i = 0; i < arguments.length; i++)
	{
		var img = $("<img>");

		img.load(function() {
			$(this).attr("loaded",true);
		});

		img.attr("src", arguments[i]);
		this.images.push(img);
	}
}

MsBackgroundImages.prev = function()
{
	if (this.fading) {
		return;
	}

	this.currentIndex--;
	if (this.currentIndex <= -1) {
		this.currentIndex = this.images.length-1;
	}
	this.switchImage();
}

MsBackgroundImages.next = function()
{
	if (this.fading) {
		return;
	}

	this.currentIndex++;
	if (this.currentIndex >= this.images.length) {
		this.currentIndex = 0;
	}
	this.switchImage();
}

MsBackgroundImages.switchImage = function()
{
	if (this.images.length > 1) {
		this.imageContainer.fadeOut(1000, function() {
			MsBackgroundImages.fading = true;
			MsBackgroundImages.fadeIn();
			});
	}
}

MsBackgroundImages.fadeIn = function()
{
	if (this.fading == true) {

		if (this.images[this.currentIndex].attr("loaded")) {

			// remove existing image
			this.imageContainer.find("img").remove();

			// add new image
			this.imageContainer.append(this.images[this.currentIndex]);

			// fade the container in
			this.imageContainer.fadeIn(1500, function() {
				MsBackgroundImages.fading = false;
				if (MsBackgroundImages.auto_fade) {
					MsBackgroundImages.timeoutTillNext();
				}				
			});
			
		} else {
			// try again in 100ms
			setTimeout(function() { MsBackgroundImages.fadeIn(); }, 100);
		}
	}
}

MsBackgroundImages.timeoutTillNext = function()
{
	setTimeout(function() {
		MsBackgroundImages.next();
	}, 5000);	

}

MsBackgroundImages.setAutoFade = function()
{	
	this.auto_fade = true;
	this.timeoutTillNext();
}


/* Swap in subcontent
================================================= */

var MsSubContent = {};

MsSubContent.init = function()
{
	this.faded = false;
	this.loaded = false;
	this.content = $('#sub-content');
	this.htmlData = null;
}

MsSubContent.switchHtml = function(elem, url, guid)
{
	if (this.faded || this.loaded) {
		return false;
	}

	if (this.content === undefined) {
		return false;
	}


	$('#column1 .list a').removeClass("current");
	$(elem).addClass("current");

	this.content.fadeOut(500, function() {
		MsSubContent.faded = true;
		MsSubContent.fadeIn();
		});

	$.get(url, { guid: guid }, function (data) {
		MsSubContent.htmlData = data;
		MsSubContent.loaded = true;
		MsSubContent.fadeIn();
		});
}

MsSubContent.fadeIn = function()
{
	if (this.faded && this.loaded) {

		this.content.html(MsSubContent.htmlData);

		this.htmlData = false;
		this.content.fadeIn(500, function() {
			MsSubContent.faded = false;
			MsSubContent.loaded = false;
			});
	}
}



/* Pre-load Images
================================================= */
var ImagePreload = {};
ImagePreload.preloadImages = function()
{
	for (var i = 0; i < arguments.length; i++)
	{
		if (arguments[i] instanceof Array) {
			for (var j = 0; j < arguments[i].length; j++)
			{
				jQuery("<img>").attr("src", arguments[i][j]);
			}
		} else {
			jQuery("<img>").attr("src", arguments[i]);
		}
	}
}

//load the initial background image
$(document).ready(function() {
	MsContent.init();
	MsSubContent.init();
	MsBackgroundImages.init();
	$('#scrolling').jScrollPane();
});

