var loader = new Image();
loader.src = 'Styles/layout/images/wrapper/loading.gif';
$(document).ready( function () {

	// ##############################################################################
	// Prevents Work title wrapping #################################################
	$("#workList li a").each(function(){
		// Replace spaces with  
		var newText = $(this).text().replace(/ /g, " ");
		///$(this).replaceWith('<a href="#">' + newText + '</a>');
		$(this).html(newText);
	});
	
	// ##############################################################################
	// Accordian work menu control ##################################################
	
	// By default, no item is selected 
	var targetSelected = false;
	var speed = 250;
	// When item is clicked
	$("#workList li a.item").click(function () {
		// If the item is .selected
		if ( $(this).hasClass("selected") ) {
			//alert("this is the active item");
			$(this).next(".view").slideUp(speed, function () {
				resizeWrapper();
				resetItem();
			});
			// Removes clearing for the expanded item
			//$(this).parent().removeClass('clearBoth');
			// Removes class 'selected' from item
			$(this).removeClass("selected");
			
			targetSelected = false;

		} else {
			// Set target node
			var target = $(this);
			
			if (targetSelected == false) {
				// If there is no item selected open
				target.next(".view").slideDown(speed, function () {
					if ($.browser.msie){
						resizeWrapper();
					}
					if(target.next('.view').find('img').length == 0){
						 target.next('.view').prepend(images[target.parent().attr('id')]);
					}
					preloadKids(target.siblings('.view').children('.itemView'));
				});				
				targetSelected = true;
			} else {
				// Otherwise close the current item. 
				// When it's closed remove selected and open new item
				$("#workList li a.selected").each(function(){
					$(this).next(".view").slideUp(speed, function () {
						target.next(".view").slideDown(speed, function () {
							if ($.browser.msie){
								resizeWrapper();
							}
							if(target.next('.view').find('img').length == 0){
								 target.next('.view').prepend(images[target.parent().attr('id')]);
							}
							preloadKids(target.siblings('.view').children('.itemView'));
						});

				        
						resetItem();
					});
					// Removes clearing for the expanded item
					//$(this).parent().removeClass('clearBoth');
					// Removes class 'selected' from item
					$(this).removeClass("selected");
				});
			}
			// Add class 'selected' to item
			$(this).addClass("selected");
			// Clears for the expanded item
			//$(this).parent().addClass('clearBoth');
		}
	});
	
	// ##############################################################################
	// Item view control ############################################################
	$('.showItem').click(function () {
		$('.showItem').removeClass('selected');
		$(this).addClass('selected');
		
		var itemNum = $(this).text();
		//alert(typeof itemNum);
		$('.itemView').fadeOut(speed+300);
		$('.item'+itemNum).fadeIn(speed+300);
		if ($.browser.mozilla || $.browser.safari){
			fadeOutAbstract();
		}
	});
	
	// ##############################################################################
	// Work menu abstract pane ######################################################
	
	// Open .abstract
	$('.showAbstract').click(function () {
		if($(this).hasClass('selected')) {
			fadeOutAbstract()
		} else {
			$('.abstract').fadeIn(speed);
			$(this).addClass('selected');
		}
	});
	// Close .abstract
	$('.abstract .close').click(function () {
		fadeOutAbstract()
	});
	
	// fades it out
	function fadeOutAbstract() {
		$('.abstract').fadeOut(speed);
		$('.showAbstract').removeClass('selected');
	}
	// hides
	function resetItem() {
		$('.abstract').hide();
		$('.showAbstract').removeClass('selected');
		$('.itemView').hide();
		$('.item1').show();
	}
	
	// ##############################################################################
	// Adds scrolling to IE if #workList is too Tall: ###############################
	
	function resizeWrapper() {
		var viewSize = getViewportSize();
		var viewHeight = (viewSize[1] - 64);
		var viewWidth = (viewSize[0] - 64);
		
		// Adjust for height
		if($('#workList').height() > viewHeight){
			$('#wrapper').css({height: ($('#workList').height() + 64)});
			
		} else {
			$('#wrapper').css({height: '100%'});
		}
		// Adjust for width
		if($('#workList').width() > viewWidth){
			$('#wrapper').css({width: ($('#workList').width())});
		} else {
			$('#wrapper').css({width: 'auto'});
		}
	}
	
	// ##############################################################################
	// Window re-sizing control ( IE ) #####################################################
	if ($.browser.msie){
		resizeWrapper();
		window.g_prevSize = getViewportSize();
		setInterval(resize, 1000);
	}
	
	function resize() {
		var currentSize = getViewportSize();
		if (currentSize[0] != g_prevSize[0] || currentSize[1] != g_prevSize[1]) {
			g_prevSize = currentSize;
			resizeWrapper();
		}
	}
	
	// ##############################################################################
	// #profile and #contact widget controls ########################################
	$("#openContact").click(function () {
		$("#contact").fadeIn(speed);
		$("#profile").fadeOut(speed);
		
		$("#openContact").addClass('selected');
		$("#openProfile").removeClass('selected');
		
		if ($.browser.mozilla){
			var msgHeight = 95;
			$('#message').css({height: msgHeight});
			$('#message').css({maxHeight: msgHeight});
		}
    });
	$("#openProfile").click(function () {
		$("#profile").fadeIn(speed);
		$("#contact").fadeOut(speed);
		
		$("#openProfile").addClass('selected');
		$("#openContact").removeClass('selected');
    });
	$(".closeWidget").click(function () {
		$("#profile").fadeOut(speed);
		$("#contact").fadeOut(speed);
		
		$("#openProfile").removeClass('selected');
		$("#openContact").removeClass('selected');
    });

	// ##############################################################################
	// Contact form controls ########################################################
	$(':text, textarea').focus(function(){
		var f = $(this).get(0);
		if($(this).val() == f.defaultValue){
			$(this).val('');
		}
	})
	$(':text, textarea').blur(function(){
		var f = $(this).get(0);
		if($(this).val() == ''){
			$(this).val(f.defaultValue);
		}
	});
});

// ##############################################################################
// Gets the size of the viewable area of the browser ############################
function getViewportSize() {
	var size = [0, 0];
	if (typeof window.innerWidth != 'undefined') {
		size = [ window.innerWidth, window.innerHeight ];
	}
	else if (typeof	document.documentElement != 'undefined' && typeof document.documentElement.clientWidth != 'undefined' && document.documentElement.clientWidth != 0) {
		size = [ document.documentElement.clientWidth, document.documentElement.clientHeight ];
	}
	else {
		size = [ document.getElementsByTagName('body')[0].clientWidth, document.getElementsByTagName('body')[0].clientHeight ];
	}
	
	return size;				
}

//Removes the loading icon when an image has been loaded
function preloadKids(kids){
	if($.browser.opera){
		$('.showItem').removeClass('loading');
		$('.item1').fadeIn(500);
	} else {
		kids.each(function(){
			var that = $(this);
	        var img = that.get(0);
			
	        if(!img.complete){
	            that.load(function(){
	                that.siblings('.viewNav').find('.show'+img.className.substring(13, 14)).removeClass('loading');
				});
				if(that.hasClass('item1')) {
					$('.item1').fadeIn(600);
				}
	        } else {
				that.siblings('.viewNav').find('.show'+img.className.substring(13, 14)).removeClass('loading');
	        }
	    });
	}		
}

/*function grow() {
	var p = document.createElement('p');
	p.appendChild(document.createTextNode('This is a paragraph'));
	document.body.appendChild(p);
}*/

/*
	// Function for resizing #wrapper to full height w/ scroll
	function sizeContainer(){
		if(!$.browser.msie) {
			var h = $(window).height();
			$("#container").css({height: h});
		}
		$("#header").text($(window).height());
	}
	$( window ).wresize( sizeContainer ); 
	
	sizeContainer();
	//$(window).resize(function(){
		//sizeContainer();
	//});
*/


/*
	// Your browser is IE6 or less and it sucks alert
	if ($.browser.msie && $.browser.version < 7) {
	   //$(".copyright").append('<br /><small>Ever think of upgrading your browser to <a href="#" title="Download IE7">Internet Explorer 7</a> or <a href="#" title="Download Firefox">Firefox</a>?</small>');
	}
*/