// Initialize Mr. DOM -- draggable footer
$(document).ready(function() {
	//TODO:
	// set up the document for JS users -- the static code should be set for full display for JS-disabled browsers. :)
	//$('#drawer').css('height', 50);
	//$('#drawer').css('footerbounds', -541);
	
	// the drag handler
	$('#drawer').draggable(
		{
			axis: 'y',
			handle: 'h2',
			scroll: false,
			drag: function(event, ui) 
			{ 
				// callback function for drag event on this element
				
				// these are the configs
				var maxDrawer = 620;
				var minHeight = 50;
		
				// init
				var drawerHeight = minHeight;
		
				// check bounds, both height of drawer and position in 
				if(drawerHeight > maxDrawer) { 
					drawerHeight = maxDrawer;
				}
				if(drawerHeight < minHeight) {
					drawerHeight = minHeight; 
				}
				if(ui.position.top < -(maxDrawer)) {
					ui.position.top = -(maxDrawer); 
				}
				if(ui.position.top >= -(minHeight)) {
					ui.position.top = -(minHeight);
				}
				
				// the gem
				drawerHeight = -(ui.position.top);

				// adjust element
				$('#drawer').css('height', drawerHeight);
//				console.log("drawerHeight: " + drawerHeight, "position.top: " + ui.position.top);
			},
			stop: function(event, ui)
			{
				// callback function for release of drag event on this element -- bounce it, baby!

				// these are the configs
				var animDuration = 1000;
				var percentConsideredComplete = 85;
				var maxDrawer = 620;
				var minHeight = 50;

				if(ui.position.top > (- (maxDrawer * (percentConsideredComplete / 100))))
				{
					// if we're not up high enough, drop it like it's hot
					$('#drawer').animate(
						{	
							height: minHeight,
							top: -(minHeight)
						},
						{	
							duration: animDuration,
							specialEasing: 
							{
								height: 'easeOutBounce',
								top: 'easeOutBounce'
							}
						}// end animate
					); // end animate
				}
				else
				{
					// animate up quickly to the top if we're almost, but not quite there yet
					$('#drawer').animate(
						{	
							height: maxDrawer,
							top: -(maxDrawer)
						},
						{	
							duration: (animDuration * (1 - (percentConsideredComplete / 100)))
						}// end animate
					); // end animate
				} // end percentcomplete
			} // end stop
		}// end draggable
	); // end draggable

}); // end document.ready