var dockOpen = false;
var currentSlideBox;
	
$(function(){	
		$('.slidingdock .buttons a').click(function(){
			var slideBoxClass =$(this).attr('rel');	

			$('.buttons a').removeClass('border');
			$('.buttons a').removeClass('selected');
			openSlidingDock(slideBoxClass, $(this).attr('class'));

			
			
		});
		
		$('html').click(function() {
			closeSlidingDock();
		});
		
		$('.slidingdock').click(function(event){
			 event.stopPropagation();
		});		
	});
	
	function openSlidingDock(slideBoxClass, button){
		//alert('button:' + button);
			
			var targetSlideBox = $('.'+slideBoxClass);
			var targetHeight = targetSlideBox.height();
			$('.buttons a').addClass('border');
			$('.buttons a').removeClass('selected');
			$('a.'+button).addClass('selected');		
			$('a.'+button).removeClass('border');
			if(dockOpen){	
				if(targetSlideBox.attr('class') != currentSlideBox.attr('class')){
					targetSlideBox.fadeIn();
					currentSlideBox.fadeOut();
					targetSlideBox.css('top', 0);
					$('.hiddenitemscontainer').animate( { height:targetHeight}, { queue:false, duration:500 }  )
					currentSlideBox = targetSlideBox;
				}else{
					closeSlidingDock();						
				}
			}else{	
				$('.hiddenitemscontainer').css('height', 0);						
				targetSlideBox.css('top', 0-targetHeight);
				targetSlideBox.show();
				targetSlideBox.animate( { top:0}, { queue:false, duration:500 }  )
				$('.hiddenitemscontainer').animate( { height:targetHeight}, { queue:false, duration:500 }  )
				currentSlideBox = targetSlideBox;
				dockOpen = true;
			}	
	}
	
	function closeSlidingDock(){		
		if(dockOpen){
			var targetHeight = currentSlideBox.height();
			dockOpen = false;		
			currentSlideBox.show();
			currentSlideBox.animate( { top:0-targetHeight}, { queue:false, duration:500 }  );
			$('.hiddenitemscontainer').animate( { height:0}, { queue:false, duration:500 }  );
			$('.buttons a').removeClass('border');
			$('.buttons a').removeClass('selected');
			currentSlideBox = null;
		}
	}