jQuery(document).ready(function(){
	
	jQuery('a.colorbox').fancybox({
		'titlePosition'  : 'inside'
	});
	

	jQuery('.innerFrame').html('<img class="firstImage" src="'+jQuery('ul.thumblist li:first-child a.default').attr('href')+'" />');
	//jQuery('.clientInfo').html(jQuery('ul.thumblist li:first-child a.default img').attr('rel'));
	if(jQuery('ul.thumblist li:first-child a.default img').attr("src")){
		set_client_info(jQuery('ul.thumblist li:first-child a.default img').attr('rel'));
		jQuery('ul.thumblist li a:first-child').css({"border":"1px solid #fffc00"});	
		jQuery('ul.portfolioTabs li:first-child').addClass('active')		
	}

	jQuery('.thumblist a.frame').live("click", function(e){
		var rel = jQuery(this).find("img").attr("rel");
		rel = rel.split("|");
		if(rel[1].length > 1)
		{
			jQuery('.innerFrame').append('<a href="http://'+rel[1]+'" target="_blank" class="imgageLink"><img class="secondImage" src="'+jQuery(this).attr('href')+'" /></a>');
		}
		else {
			jQuery('.innerFrame').append('<img class="secondImage" src="'+jQuery(this).attr('href')+'" />');			
		}
		jQuery('.firstImage').animate({marginLeft : '-613px'}, function(){
			jQuery(this).parent('a').remove();
			jQuery(this).remove();
			});
		
		jQuery('.innerFrame img').removeClass('secondImage').addClass('firstImage');
		set_client_info(jQuery(this).find('img').attr('rel'));
		//jQuery('.clientInfo').html(jQuery(this).attr('title'));	
		jQuery('.thumblist a').css({"border":"1px solid #466A02"});
		jQuery(this).css({"border":"1px solid #fffc00"});
		e.preventDefault;
		return false;
	});

	jQuery(".site").live("click", function(){
		window.open("http:\\"+jQuery(this).text())
	})
	
	jQuery('.next').live('click', function(){
		jQuery('.thumblist').each(function(){
			var $this = jQuery(this),
			$children = $this.children("li");

			var $first = $children.eq(0), //grab first element (top item)
			$next, //initalize variable to hold the next item
			length = $children.length, //determine length of the array
			index = 0; //initialize an index variable

			for(var i = 0; i <= length; i++)
			{
				if($children.eq(i).css("z-index") == 2)
				{
					$first = $children.eq(i);
					index = i;
				}
			}
			//determine if your at the end of the array
			//if so, set index to the first item
			//otherwise, increment to the next index
			if (!$children.eq(index+1).length) { index = 0; }
			else { index++; }
			 
			//grab the next item
			$next = $children.eq(index);

			//set z-index for the next item so that it is, one above all other elements
			//but one under the top item
			$next.css({ 'z-index': 1 });
			 
			//fade the top item out, revealing the next item
			$first.fadeTo('slow', 0, function() {

			//then just set the z-index to the lower level
			//and fade it back in
			$first.css({ 'z-index' : 0 }).fadeTo(0,1);
			 
			//set the next, now the top, item to the top level
			$next.css({ 'z-index' : 2 });
			 
			//make the new top item, $first
			$first = $next;
			});
		});
		return false;
	});

	jQuery('.pev').live('click', function(){
		jQuery('.thumblist').each(function(){
			var $this = jQuery(this),
			$children = $this.children("li");
			
			var $first = $children.eq(0), //grab first element (top item)
			$next, //initalize variable to hold the next item
			length = $children.length, //determine length of the array
			index = length; //initialize an index variable

			for(var i = 0; i <= length; i++)
			{
				if($children.eq(i).css("z-index") == 2)
				{
					$first = $children.eq(i);
					index = i;
				}
			}
			
			//determine if your at the end of the array
			//if so, set index to the first item
			//otherwise, increment to the next index
			if (!$children.eq(index-1).length) { index = length-1; }
			else { index--; }

			//grab the next item
			$next = $children.eq(index);

			//set z-index for the next item so that it is, one above all other elements
			//but one under the top item
			$next.css({ 'z-index': 1 });
			 
			//fade the top item out, revealing the next item
			$first.fadeTo('slow', 0, function() {

			//then just set the z-index to the lower level
			//and fade it back in
			$first.css({ 'z-index' : 0 }).fadeTo(0,1);
			 
			//set the next, now the top, item to the top level
			$next.css({ 'z-index' : 2 });
			 
			//make the new top item, $first
			$first = $next;
			});
		});
		return false;
	});

	function set_client_info(rel){
		if(rel.length > 2){
		var client = rel.split('|');
		var site = client[1].replace("http://", '');
		var info = "Client: <span>"+ client[0]+"</span><br />";
		if(site.length > 1)
		{			if(site.indexOf("href") != -1) {							info += "Site: "+site+"<br />";						} else {
			info += "Site: <a href=\"http://"+site+"\" target=\"_blank\"><span>"+site+"</span></a><br />";						}			
			if (client[2].length > 2){
				info += "Services Provided: <span>"+client[2]+"</span>";
			}
		}
		else if (client[2].length > 2){
			info += "Services Provided: <span>"+client[2]+"</span>";
		}
		
		jQuery(".clientInfo").html(info);
		}
	}

	jQuery(".portfolioTabs a").click(function(){
		var $this = jQuery(this);
		jQuery(".portWrap .loading").fadeIn("slow");
		jQuery(".portWrap").load(jQuery(this).attr("href")+" .load",function(){
			jQuery('.thumblist a').each(function()
			{
				if(jQuery(this).attr('href') != '#'){
					pic1= new Image(614,403); 
					pic1.src=jQuery(this).attr('href');
				}
			});
			jQuery('a.colorbox').fancybox({
				'titlePosition'  : 'inside'
			});
			jQuery('.innerFrame').html('<img class="firstImage" src="'+jQuery('ul.thumblist li:first-child a.default').attr('href')+'" />');
			set_client_info(jQuery('ul.thumblist li:first-child a.default img').attr('rel'));	
			jQuery('ul.thumblist li a:first-child').css({"border":"1px solid #fffc00"});
			jQuery('ul.portfolioTabs li').removeClass('active');	
			$this.parent().addClass('active');
			jQuery(".portWrap .loading").fadeOut("slow");
		});
		return false;
	});

	jQuery('.thumblist a').each(function()
	{
		if(jQuery(this).attr('href') != '#'){
			pic1= new Image(614,403); 
			pic1.src=jQuery(this).attr('href');
		}
	});
});