$(document).ready(function(){
    
////////////////////////////////////
////////////////////////////////////
// Settings
////////////////////////////////////

// width of columns inside mega dropdown. Does NOT set the width. This is used to calculate the appropriate width for the dropdown containers.
var mega_dropdown_col_width = 210;
// defines the element, such as table or div that is the outer edge of the template. Replace #wrapper with id or class of element.
var mega_template_container = $("#h-nav");
// enter a comma separated list of category type foreign ids corresponding to the category types whose mega menu should be aligned left with no auto center.
var no_auto_center = [20];
// enter a comma separated list of category type foreign ids corresponding to the category types whose mega menu should be aligned right.
var align_right = ["mega_5"];

////////////////////////////////////
////////////////////////////////////
// End Settings
////////////////////////////////////

var mega_template_container_width = $(mega_template_container).width();

// add class names to top level li's so that later statements can use class names to properly align dropdowns
// no_auto_center
$(".mega").each(function(){
    var curr_id = $(this).attr("id");
    //curr_id = parseInt(curr_id);
// $.inArray(4,data)
var no_auto_center_test = $.inArray(curr_id, no_auto_center);
    if(no_auto_center_test != -1) {
        $(this).addClass("no_auto_center");
    }
   // console.log("curr_id: " + curr_id + ", align_right: " + align_right);
var align_right_test = $.inArray(curr_id, align_right);
    if(align_right_test != -1) {
        $(this).addClass("mega_right_align");
    }
});


// set width of .mega_content dropdowns in horizontal nav
$("#mega_menu .mega_content").each(function(){
    $this = $(this);
    var curr_number_of_columns = $this.find("div").length;
    var curr_mega_content_width = (curr_number_of_columns * mega_dropdown_col_width);
    if(curr_number_of_columns == 1){curr_mega_content_width = curr_mega_content_width - 10;}
    curr_mega_content_width = curr_mega_content_width + "px";
    $this.css("width",curr_mega_content_width);
    // give left border to first column
    $this.find("div:first").css("","");
        $this.find("div:first").css("padding-left","10px");
});

existing_template_position = $(mega_template_container).offset();
existing_template_left_margin = existing_template_position.left;
$(".mega").each(function(){
    $this = $(this);
    // if browser is ie6, add iframe beneath dropdown so that it appears over select boxes
    
/*  if($.browser.msie && $.browser.version=="6.0") {
        var ie6_iframe = "<iframe class='mega_cover_select' />";
        $(this).prepend(ie6_iframe);
        var mega_height_to_match = $(this).height;
        $(".mega_cover_select").css("height",mega_height_to_match);
    }
*/
    var curr_mega_content_width = $this.find(".mega_content").width();
    // if dropdown is greater than half of screen width, then place in center
    if(curr_mega_content_width >= mega_template_container_width/2 ){
        var desired_left_value = (mega_template_container_width - curr_mega_content_width)/2;
        var existing_position = $this.offset();
        var existing_left_position = existing_position.left;
        var existing_left_inside_template_position = existing_left_position - existing_template_left_margin;
        var left_position_adjustment = ((existing_left_inside_template_position - desired_left_value) * -1) + "px";
        // dont' center the dropdown if it's too close to the edge
        if($this.hasClass("mega_right_align") == false && $this.hasClass("no_auto_center") == false){
            $this.find(".mega_content").css("left",left_position_adjustment);
        } 
        // desired_left_value > existing_left_inside_template_position
    }
    
// assign right position to dropdown so that it stays on screen
    if($this.hasClass("mega_right_align")) {
            // get width of mega_content
            var curr_mega_width = $this.outerWidth();
            
            
            if(curr_mega_content_width < 498 || existing_left_inside_template_position > $this.width()){
                var curr_left_value = -1 * (curr_mega_content_width - curr_mega_width + 2);
                // assign CSS left property to mega content
                $this.find(".mega_content").css({
                    "left":"auto",
                    "right": 0
                    });
                
               // console.log("curr_mega_content_width: " + curr_mega_content_width + ", curr_mega_width: " + curr_mega_width + ", existing_left_inside_template_position: " + existing_left_inside_template_position + ", curr_left_value: " + curr_left_value)

            } //if
        } // if
    } //function
); // each

// change class on hover to cause dropdown
$(".mega").hover(
        function(){
            $(this).addClass("hovering");
            $(this).find("a:first").css("background-color","#f4f2f0");
            $(this).find("a:first").css("color","#a3c4b8");},
        function(){
            $(this).removeClass("hovering"); 
            $(this).find("a:first").css("background-color","#cdded8")
            $(this).find("a:first").css("color","#a6a699");}
);
// remove bg image from last link
$(".mega:last").css("background-image","none");

// add custom content to mega dropdown

$("#mega_1 div").eq(0).prepend("<a id='before_you_begin' href='http://www.betsywhite.com/wedding-stationery-1-ct.htm'>Before You Begin</a>");
$("#mega_1 div div").css("padding-top",0);

$("#mega_2 div").eq(0).prepend("<a id='before_you_begin' href='http://www.betsywhite.com/wedding-logos-2-ct.htm'>Before You Begin</a>");
$("#mega_2 div div").css("padding-top",0);

}); // ready