function do_dropdown (box) {
	// We would do an ajax query to get the sub categories
	$.get("/static_pages/ajax_get_child_categories",
		function(data){
			var position = $(box).position();
			
			// Create a dropdown container
			var dropdown = $('<div />').addClass('dropdown').css('display', 'none').css('z-index', '999');
			
			// Add some text
			var p = $('<p />').append(document.createTextNode('Sub Categories'));
			$(dropdown).append(p);
			
			// Add the categories
			var ul = $('<ul />');
			
			$(data).each(function(index, element) {
				var a = $('<a />').html(element.name).attr('href', '/category/' + element.uri_segment);
				ul.append($('<li />').append(a));
			});
			
			$(dropdown).append(ul);
			
			// Set left position
			$(dropdown).css('left', position.left+10 + 'px');
			
			// Set top position
			$(dropdown).css('top', position.top+135 + 'px');
			
			// Append it to the page
			$('#product_boxes').append(dropdown);
			
			// Slide it open
			$(dropdown).slideDown(100);
			
			// Unbind the old events
			$('#product_boxes div.box').unbind('mouseenter');
			$('#product_boxes div.box').unbind('mouseexit');
			
			// Bind new special events
			
			// count down to close and rebind all, BUT mouseover on dropdown resets counter?
			
			
			// Roll off event to close it
			$(dropdown).bind('mouseleave', function () {
				$(this).slideUp(100);
				$(this).remove();
				
				// Rebind events
				full_hover_bind();
			});
			
		}, 
		"json"
	);
}

function full_hover_bind () {
	$('#product_boxes div.box').hover(
		function () {
			// Slide new one in
			$('p.description', this).slideDown(100);
			/*
			// Check for and load any subcats
			if ($(this).hasClass('subcats') == true) {
				var box = $(this);
				do_dropdown(box);
			}
			*/
		},
		function () {
			// We need to make sure that no subcat boxes are still in the area first
			$('p.description', this).slideUp(100);
		}
	);
}

$(document).ready(function () {
	full_hover_bind();
	
	$('#product_boxes div.box').click(function (e) {
		var inner 	= $(this).children();
		var wrapper	= $(inner).children();
		var name	= $(wrapper).children();
		var a		= $(name).children();
		var uri 	= $(a).attr('href');
		if (uri != '#') {
			window.location = uri;
		}
	});
});