var upSpeed = 175;
var downSpeed = 175;


var hoverDelegate = function(){ 

      var myTop = $(this).offset().top;
      var myLeft = $(this).offset().left+169;
  
      $(this).children("ul").css({top:myTop,left:myLeft});
      $(this).children("ul").slideDown(150);
    
    };
    
    var hoverDelegateNav = function(){ 
  
      var myTop = 30;
      var myLeft = $(this).position().left;
      
      $(this).children("ul").css({top:myTop,left:myLeft});
      $(this).children("ul").slideDown(150);
    
    };
    
    var hoverDelegateSub = function(){ 
  
      var myTop = $(this).offset().top-200;
      var myLeft = $(this).width();
      
      $(this).children("ul").css({top:0,left:myLeft});
      $(this).children("ul").slideDown(150);
    
    };
    
var closeDelegate = function(){ 
        $(this).children("ul").fadeOut(200);
    };

    $(document).ready(function() {
        /*
        // Calculate the correct position for sub menus below INACTIVE menu items
        $('#nav > li').each(function() { $(this).children("ul").css({top:$(this).offset().top+27}); });

  // Calculate the correct position for sub menus below INACTIVE menu items
        $('#sectors > li[class!=on]').each(function() { $(this).children("ul").css({left:$(this).offset().left+171}); });

  // Calculate the correct position for sub menus below ACTIVE menu items
        $('#sectors > li[class=on]').each(function() { $(this).children("ul").css({left:$(this).offset().left+165}); });
        */

        // Make the whole thing clickable
        $('#sectors > li > a').each(function() {
            var t = $(this);
            var p = t.parent();
            p.addClass("hand");
            p.click(function() { window.location.href = t.attr('href'); });
        });

        // Place our images inside divs so the monochrome can be blended
        $('#sectors > li.off > a > img').each(function() {

            $(this).wrap("<div class='mono'></div>");
            var divvy = $(this).parent();

            // Use the same image for the div's background, but remove the word 'mono'
            divvy.css("background-image", "url(" + $(this).attr("src").replace("_off", "_on") + ")");

        });

        /*


// Place our images inside divs so the monochrome can be blended
        $('#sectors[class!=allsector] > li[class!=on] > a > img').each(function() {
  
    $(this).wrap("<div></div>");
        var divvy = $(this).parent();
    
    // Use the same image for the div's background, but remove the word 'mono'
        divvy.css("background-image","url("+$(this).attr("src").replace("mono","")+")");

});




// Place our images inside divs so the monochrome can be blended
        $('#sectors > li.off > a > img').each(function() {


var divvy = $(this);
        // Use the same image for the div's background, but remove the word 'mono'
        divvy.attr("src", "/content/images/monoThinfarm.png");

});
*/


        // Pre-pend a bullet to each second level list item
        $('.menu ul a').each(function() { $(this).prepend("&bull; "); });

/*
        // Append an ellipsis to any menu with a sub menu
        $('.menu li > a').each(function() {
            if ($(this).next().is("ul")) { $(this).append("&hellip; "); }
        });
*/

        // Handle hovering over the first level #nav items
        $('#nav > li:has(a)').hover(function() {
            $(this).stop().animate({ "color": "#000000" }, upSpeed, hoverDelegateNav);
            $(this).children("a").stop().animate({ "backgroundColor": "#F7D00E", "color": "#000000" }, upSpeed);

        }, function() {
            $(this).stop().animate({ "color": "#FFFFFF" }, downSpeed, closeDelegate);
            $(this).children("a").stop().animate({ "backgroundColor": "#000000", "color": "#FFFFFF" }, upSpeed);
        });


        /* 
        // Handle hovering over the second level #nav items
        $('.menu ul > li').each(function() {

    

        if( $(this).contents().is("ul")) { 

    $(this).hover(function() {
        $(this).stop().animate({"backgroundColor": "#000000"}, upSpeed, hoverDelegateSub);
      
    },function() {
        $(this).stop().animate({ "backgroundColor": "#F7D00E" }, downSpeed, closeDelegate);

    });
        } else {
        $(this).hover(function() {
        $(this).stop().animate({ "backgroundColor": "#000000" }, upSpeed);
      
    },function() {
        $(this).stop().animate({ "backgroundColor": "#F7D00E" }, downSpeed);

    });

  }
  
        });*/

        // Handle hovering over the first level items
        $('#sectors > li.off').hover(function() {
            $(this).stop().animate({ "margin-left": "16px", "backgroundColor": "#ffffff" }, upSpeed, hoverDelegate);

            $(this).children("a").stop().animate({ "color": "#0000ff" }, upSpeed);
            $(this).children("a").children("div").children("img").stop().animate({ "opacity": 0.3 }, upSpeed + 175);

        }, function() {
            $(this).stop().animate({ "margin-left": "0px", "backgroundColor": "#eeeeee" }, downSpeed, closeDelegate);

            $(this).children("a").stop().animate({ "color": "#222299" }, downSpeed);
            $(this).children("a").children("div").children("img").stop().animate({ "opacity": 1 }, downSpeed + 75);
            //$(this).children("ul").animate({"opacity": 0.5}, 1000, closeDelegate);

        });


        // Handle hovering over an activated menu (it does't move as far)
        $('#sectors > li.on').hover(function() {
            //$(this).children("a").children("img").animate({"opacity": 1}, upSpeed, "linear", hoverDelegate);
            $(this).stop().animate({ "margin-left": "16px" }, upSpeed, hoverDelegate);
            //$(this).children("a").stop().animate({ "color": "#0000ff" }, upSpeed);
            //$(this).children("a").children("img").animate({"opacity": 0.6}, upSpeed, hoverDelegate);

            //$(this).animate({"width": "176px", "backgroundColor": "#f4f4f4"}, upSpeed
        }, function() {
            $(this).stop().animate({ "margin-left": "7px" }, downSpeed, closeDelegate);
            //$(this).children("a").stop().animate({ "color": "#4444aa" }, downSpeed);
            //$(this).children("a").children("img").animate({"opacity": 1}, 150);
        });

        /*// Handle hovering over second level items
        $('#sectors ul a').hover(function() {
        $(this).animate({"backgroundColor": "#ffffff"}, upSpeed);
        },function() {
        $(this).animate({"backgroundColor": "#000000"}, upSpeed);
        });*/

    });

