// JavaScript Document
$(function () {

	var transitionSPeed = 750;
	var selected = 1;
	function initImageButtons(){
			for(var i=1;i<=12;i++){
				jQuery('#imgButton'+i).data('id',i);
				jQuery('#imgButton'+i).css('cursor','pointer');			
			}
			enableImageButtonCLick();
	}
		
	function updateHighlight(){
		for(var i=1;i<=12;i++){
				if(selected==i){
					jQuery('#imgButton'+i).addClass('imageNavButtonSelected');	
					jQuery('#decription'+i).css('display','block');
				} else if(jQuery('#imgButton'+i).hasClass('imageNavButtonSelected')){
					jQuery('#imgButton'+i).removeClass('imageNavButtonSelected')
					jQuery('#decription'+i).css('display','none');
				}
		}
	}	
	function enableImageButtonCLick(){
			for(var i=1;i<=12;i++){
				jQuery('#imgButton'+i).click(function(){
						disableImageButtonCLick();
						selected = $(this).data('id');
						updateHighlight()
						jQuery("#portfolioImage2").attr('src','images/port/image'+$(this).data('id')+'.jpg');
						jQuery(".imageHolder2").animate({ "opacity": 1 }, transitionSPeed,function(){
							jQuery("#portfolioImage").attr('src',jQuery("#portfolioImage2").attr('src'));
							jQuery(".imageHolder2").css('opacity',0);
							enableImageButtonCLick()
							
						});
				});
			}
		}
		
	function disableImageButtonCLick(){
			for(var i=1;i<=12;i++){
				jQuery('#imgButton'+i).unbind('click')
			}
	}
		
	updateHighlight()		
	initImageButtons();

});