// CascadeMenu
// Version 1.0

/*
   + Usage example:

     Body code:

     <div class="menu">
      <ul>
       <li style="width: 70px;"><a href="home.php">home</a></li>
       <li class="cascade_menu" id="catalogue_menu" style="width: 125px;" hover="catalogue_menu_hover"><a href="catalogue.php"><?=CATALOGUE;?></a></li>
       <li><a href="brands.php">brands</a></li>
       <li><a href="store.php">store</a></li>
       <li><a href="news.php">news</a></li>
       <li><a href="team.php">team</a></li>
       <li style="width: 120px;"><a href="contact.php">contact</a></li>
      </ul>
     </div>
     <div class="sub_cascade_menu" id="sub_catalogue_menu">
      <div class="sub_cascade_menu_column">
       <div class="sub_cascade_menu_item"><a href="">item 1</a></div>
       <div class="sub_cascade_menu_item"><a href="">item 2</a></div>
      </div>
     </div>

     Css code:

     .catalogue_menu_hover {
             background-color: #f00;
     }
 */

var cascade_timeout = 0;
var cascade_closetimer = 0;

// Used to force a class on a menu item when the mouse pointer leave it

var cascade_hover_class = null;

function cascade_closeMenu(menu_id) {
	if(cascade_hover_class != null)
		$("#" + menu_id).removeClass(cascade_hover_class);

        $("#sub_" + menu_id).stop(true, false).animate({'opacity' : '0'},
		100, 
		function() {
			$("#sub_" + menu_id).css({'display' : 'none'});
		}
	);
}

function cascade_startTimer(menu_id) {
        cascade_closetimer = window.setTimeout("cascade_closeMenu('" + menu_id + "')", cascade_timeout);
}

function cascade_stopTimer() {
        if(cascade_closetimer) {
                window.clearTimeout(cascade_closetimer);
                cascade_closetimer = null;
        }
}

// Ready

$(document).ready(function($) {
        $(".sub_cascade_menu")
                .css({"opacity": "0", 
			"display" : "none"})
                .mouseenter(function() {
                        cascade_stopTimer();
                })
                .mouseleave(function() {
			var obj_id = $(this).attr("id");
			var menu_obj_id = obj_id.substr(4);

                        if($('#' + obj_id).css("opacity") == 1)
                                cascade_startTimer(menu_obj_id);
                });

        $('.cascade_menu')
                .mouseenter(function() {
			var obj_id = $(this).attr("id");
			
                        if($('#sub_' + obj_id).css("opacity") == 1) 
                        	cascade_stopTimer();
			else {
                        	$('#sub_' + obj_id).stop(true, false).animate({'opacity': '1'}, 
					100, 
					function() {
						$('#sub_' + obj_id).css({'display' : 'block'});
					}
				);
			}
                })
                .mouseleave(function() {
			if($(this).attr("hover") != null) {
				cascade_hover_class = $(this).attr("hover");
				$(this).addClass(cascade_hover_class);
			}

			var obj_id = $(this).attr("id");
                        cascade_startTimer(obj_id);
                });
});