var gXML;
var INIT_X = 0;
var scrollCount = 0;
var maxScrollIncrements = 0;
var barWidth = 0;
var DISPLAY_WIDTH = 820;
var INIT_FLAG = true;
var currMM = "";
var currItem = "";

function showPanel (pnl) {
	var showPanel = document.getElementById(pnl);
	hideAllPanels();
	var showPanel = "#"+pnl;
	highlight(pnl,"top");
	$(showPanel).css({top: "-500px"});
	$(showPanel).animate({top:"0px"}, "slow", "easeOutQuad");
	$('#image').animate({opacity:0.3});
}
function toggleDetails () {
	$('#copy').toggle();
}
function hideAllPanels () {
	$("#hello_link").addClass("off").removeClass("on");
	$("#contact_link").addClass("off").removeClass("on");
	var helloPos = $("#hello").offset().top;
	var contactPos = $("#contact").offset().top;
	//alert(helloPos);
	if (helloPos == 120) {
		$("#hello").animate({top:"-500px"}, "slow", "easeOutQuad");
	}
	if (contactPos == 120) {
		$("#contact").animate({top:"-500px"}, "slow", "easeOutQuad");
	}
	var imgOpac = $('#image').css("opacity");
	//alert (imgOpac);
	if (imgOpac == 0.3) {
		$('#image').animate({opacity:1.0});
	}
}
function launchBlog () {
	window.open("http://www.rylanderdesign.com/blog/");
}
function scrollPhoto (dir) {
	if (dir == "left") {
		if ((scrollCount - 1) != -1) {
			scrollCount = scrollCount - 1;
			$("#image").animate( { left:"+=820px" }, { easing:"easeOutQuad", duration: "slow" } );
			$("#arrow_right").css({visibility:"visible"});
		}
	} else if (dir == "right") {
		if ((scrollCount + 1) != maxScrollIncrements) {
			scrollCount = scrollCount + 1;
			$("#image").animate( { left:"-=820px" }, { easing:"easeOutQuad", duration: "slow" } );
			$("#arrow_left").css({visibility:"visible"});
		}
	}
	
	if ((scrollCount - 1) == -1) {
		$("#arrow_left").css({visibility:"hidden"});
	}
	if ((scrollCount + 1) == maxScrollIncrements) {
		$("#arrow_right").css({visibility:"hidden"});
	}
	var barX = INIT_X + (barWidth * scrollCount);
	var bulletStr = "";
	for (var i=0; i < maxScrollIncrements; i++) {
		if (i == scrollCount) {
			bulletStr += "<img src='imgs/bullet_on.gif' width='20' height='20' alt='' />";
		} else {
			bulletStr += "<img src='imgs/bullet_off.gif' width='20' height='20' alt='' />";
		}
	}
	$("#bullet_nav").html(bulletStr);
}
function initScrolling () {
	currentWidth = $("#image img").attr("width");
	maxScrollIncrements = Math.floor(currentWidth / DISPLAY_WIDTH);
	barWidth = 0;
	barWidth = Math.floor(DISPLAY_WIDTH / maxScrollIncrements);
	if (currentWidth > DISPLAY_WIDTH) {
		$("#arrow_right").css({visibility:"visible"});
		$("#arrow_left").css({visibility:"hidden"});
	}
	var bulletStr = "<img src='imgs/bullet_on.gif' width='20' height='20' alt='' />";
	for (var i=1; i < maxScrollIncrements; i++) {
		bulletStr += "<img src='imgs/bullet_off.gif' width='20' height='20' alt='' />";
	}
	$("#bullet_nav").html(bulletStr);
}
function highlight (itm, type) {
	if (type == "main") {
		$('#main_menu li a').each(function(i) {
			if ($(this).attr("id") == itm) {
				$(this).addClass("on").removeClass("off");
			} else {
				$(this).addClass("off").removeClass("on");
			}
		});
	}
	if (type == "sub") {
		$('#sub_menu li a').each(function(i) {
			if ($(this).attr("id") == itm) {
				$(this).addClass("on").removeClass("off");
			} else {
				$(this).addClass("off").removeClass("on")
			}
		});
	}
	if (type == "top") {
		if (itm == "hello") {
			$("#hello_link").addClass("on").removeClass("off");
			$("#contact_link").addClass("off").removeClass("on");
		} else {
			$("#hello_link").addClass("off").removeClass("on");
			$("#contact_link").addClass("on").removeClass("off");
		}
	}
}
$.fn.image = function(src, f){ 
	return this.each(function(){ 
		var i = new Image(); 
		i.src = src; 
		i.onload = f; 
		this.appendChild(i);
	}); 
} 
function loadItem (itm) {
	var text;
	var image;
	hideAllPanels();
	$("#copy").hide();
	$("#preloading").show();
	$.address.value(currMM + "/" + itm);
	$('#image').css({opacity:0});
	$('data projects project',gXML).each(function (i) {
		var subName = $(this).attr("name");
		var convertedName = unescape(itm);
		if (subName == convertedName) {
			text = $(this).find("copy").text();
			photo = "imgs/work/" + $(this).find("image").text();
			$("#image img").remove();
			$("#image").image(photo,function(){
				$("#image").css({left: "200px"});
				$("#image").animate({left:"0px", opacity:1.0}, "slow", "easeOutQuad");
				$("#preloading").hide();
				initScrolling();
			});
		}
	});
	scrollCount = 0;
	$("#copy").html(text);
	highlight(itm, "sub");
}
function loadSubMenu (mmID) {
	$("#sub_menu").hide();
	$("#preloading").show();
	var outputStr = "<ul>";
	var menuArr = new Array();
	if (INIT_FLAG) {
		INIT_FLAG = false;
	} else {
		currItem = "";
	}
	$('data projects project',gXML).each(function (i) {
		var subType = $(this).attr("type");
		var typesArr = new Array();
		typesArr = subType.split(",");
		for (var i=0; i < typesArr.length; i++) {
			var tempType = typesArr[i];
			if (tempType.charAt(0) == mmID) {
				menuArr.push($(this));
				
			}
		}
	});
	// sort featured menu (f1, f2, f3, ...)
	if (mmID == "f") {
		menuArr.sort(function(a,b) {
			var aArr = $(a).attr("type").split(",");
			var bArr = $(b).attr("type").split(",");
			for (var i=0; i < aArr.length; i++) {
				var firstChar = aArr[i];
				if (firstChar.charAt(0) == 'f') {
					var at = parseInt(aArr[i].substring(1));
				}
			}
			for (var i=0; i < bArr.length; i++) {
				var firstChar = bArr[i];
				if (firstChar.charAt(0) == 'f') {
					var bt = parseInt(bArr[i].substring(1));
				}
			}
			return at - bt;
		});
	}
	
	for (var i=0; i < menuArr.length; i++) {
		
		var subName = menuArr[i].attr("name");
				var convertedName = escape(subName);
				outputStr += "<li><a id='"+convertedName+"' onclick=loadItem('"+convertedName+"')>"+subName+"</a></li>";
				if (currItem == "") {
					currItem = convertedName;
				}
	
	}
				
	outputStr += "</ul>";
	$("#sub_menu").html(outputStr);
	$("#sub_menu").fadeIn("slow");
	currMM = mmID;
	highlight(currMM, "main");
	$.address.value(currMM + "/" + currItem);
	loadItem(currItem);
}
function buildMainMenu () {
	$("#work_link").css( {color:'#6dcff6'} );
	var outputStr = "<ul>";
	$('data work_menu item',gXML).each(function (i) {
		var mmItemID = $(this).attr("id");
		var mmName = $(this).text();
		outputStr += "<li><a id='"+mmItemID+"' onclick=loadSubMenu('"+mmItemID+"')>"+mmName+"</a></li>";
		
	});
	outputStr += "</ul>";
	$("#main_menu").html(outputStr);
	$("#main_menu").fadeIn("slow");
	var deepLink = $.address.value();
	var linkPairs = deepLink.split("/");
	currMM = linkPairs[1];
	currItem = escape(linkPairs[2]);
	currMM = (currMM == "") ? 'f' : currMM ;
	currItem = (currItem == "undefined") ? "" : currItem;
	loadSubMenu(currMM);
}
function loadXML() {
	$("#main_menu").hide();
	$.ajax({
		type: "GET",
		url: "work.xml",
		dataType: "xml",
		success: function (xml){
			gXML = xml;
			buildMainMenu ();
		}
	});
}