var mouseX = 0;
var mouseY = 0;
      $().mousemove( function(e) {
		  mouseX = e.pageX;
		  mouseY = e.pageY;
      });

jQuery(document).ready(function(){
	jQuery(".dropper").click(function(){
		var pThis = this;
		
		if(isAlreadyDropped(pThis)){

			$("#dropMenu .dropped").find("li").each(function(i) {
				//$(this).hide();
			});

			$("#dropMenu .dropped").find("h1").each(function(i) {
				//$(this).hide();
			});

			jQuery("#dropMenu .dropped").slideToggle("slow").removeClass("dropped");
			return;
		}
		var prev = jQuery("#dropMenu .dropped").slideToggle(function(){ 
									  
			showMenu(pThis);
		});
		
		if(prev[0] == null){
			showMenu(this);
		}else{
			prev.find("li").each(function(i) {
				//$(this).hide();
			});

			prev.find("h1").each(function(i) {
				//$(this).hide();
			});


			prev.removeClass("dropped");
		}
	});
});

function checkForMouse(dropped){
	if(!dropped.hasClass("dropped")){
		return;
	}
	if(mouseX > (dropped.offset().left + dropped.width()) || mouseX < dropped.offset().left ||
		mouseY > (dropped.offset().top + dropped.height()) || mouseY < dropped.offset().top){
		
		jQuery(dropped).slideToggle().removeClass("dropped");
	}else{		
		setTimeout(function(){checkForMouse(dropped);}, 2000);
	}
}

function showMenu(clicked){
	var ref = jQuery(clicked).attr("class");
	ref = ref.substr(ref.indexOf("dp-") + 3);
	//var dropped = jQuery("#dropMenu #drop" + ref).addClass("dropped").fadeIn();			
	

	$("#dropMenu #drop" + ref).find("li").each(function(i) {
		//$(this).hide();
		//$(this).css({ 'color' : "#f6f6f6"});
		//$(this).css({ 'display' : "none"});
		//$(this).css({ 'visibility' : "hidden"});
		//$(this).css({ 'opacity' : "0"});
	});
	$("#dropMenu #drop" + ref).find("h1").each(function(i) {
		//$(this).hide();
		//$(this).css({ 'visibility' : "hidden"});
		//$(this).css({ 'opacity' : "0"});		
	});

	var dropped = jQuery("#dropMenu #drop" + ref).addClass("dropped").slideToggle("200");

	
	$("#dropMenu #drop" + ref).find("li").each(function(i) {
		//$(this).animate({opacity: 1.0}, 400).fadeIn();
		//$(this).animate({opacity: 1.0}, 4000).css({ 'visibility' : "visible"});		
		/*
		setTimeout(function() {
							$("#dropMenu #drop" + ref).css({ 'visibility' : "visible"});
							}, 2000);
		*/
	});
	


	$("#dropMenu #drop" + ref).find("h1").each(function(i) {
		//$(this).animate({opacity: 1.0}, 400).fadeIn();
	});

	setTimeout(function(){checkForMouse(dropped);}, 3800);
}

function isAlreadyDropped(clicked){
	var ref = jQuery(clicked).attr("class");
	ref = ref.substr(ref.indexOf("dp-") + 3);
	
	return jQuery("#dropMenu #drop" + ref).hasClass("dropped");
}