$(function(){
	//Transition you want :)
		var easing_type = 'easeOutBounce';
		//The default height for the dock (on mouse out)
		var default_dock_height = '20';
		//Expanded height, the height of the dock on mouse over, you have to set it in CSS
		var expanded_dock_height = $('#footer').height();
		//Fake body height
		var body_height = $(window).height() - default_dock_height;
		//Body width
		var body_width = $(window).width();
		//Set the size of #fake_body
		$('.bdwrapper').height(body_height).css('padding','0');
		//Set the CSS attribute for #dock
		$('#footer').css({'height': default_dock_height, 'position':'absolute', 'top': body_height });
		//In case the user resize the browser, we will need to recalculate the height and top for #fake_body and #dock
		$(window).resize(function () {
			//Grab the updated height/top
			updated_height = $(window).height() - default_dock_height;
			updated_width = $(window).width();
			//Set the updated height for #fake_body and top for #dock
			$('.bdwrapper').height(updated_height);		
			$('#footer').css({'top': updated_height });
			//$('#dock').css({'left': updated_width });
		});
		//The main event for the dock bottom menu
		$('#footer').mouseover(function () {
			//Recalculate expanded height (always get the latest height), in case user has resized the window
			expanded_height = $(window).height() - expanded_dock_height;
			//Animate the height change, set the height to expanded_dock_height and set the top value as well
			$(this).animate({'height':expanded_dock_height,'top': expanded_height},{queue:false, duration:800, easing: easing_type});
		}).mouseout(function () {
			//Recalculate default body height (always get the latest height), in case user has resized the window
			body_height = $(window).height() - default_dock_height;
			//Animate the height change, set the height to default_dock-height and set the top value as well
			$(this).animate({'height':default_dock_height,'top': body_height},{queue:false, duration:800, easing: easing_type});
		}).mouseover().mouseout();
		
	$('.scroll-pane').jScrollPane();
});