var generic = generic || {};
var el = el || {};

// resource bundling

el.globalnav = {
	emailInputNode : null,
	emailContainerNode : null,
	emailFormNode : null,
	emailSubmitNode : null,
	emailProgressNode : null,
	initEmailSignup : function() {
		emailContainerNode = $$("div.email-signup-container")[0];
		if (!emailContainerNode) {
			return null;
		}
		emailFormNode = emailContainerNode.select("form")[0];
		emailSubmitNode = emailContainerNode.select("input.input-image")[0];
		emailProgressNode = emailContainerNode.select("span.progress")[0];
		emailInputNode = emailContainerNode.select("input.email-signup")[0];
		emailFormNode.observe("submit", function(submitEvt) {
			submitEvt.preventDefault();
			emailSubmitNode.addClassName("hidden");
			emailProgressNode.removeClassName("hidden");
			var params = emailFormNode.serialize(true);
			generic.jsonrpc.fetch({
				method : 'rpc.form',
				params: [params],
				onSuccess:function(jsonRpcResponse) {
					emailProgressNode.addClassName("hidden");
					emailSubmitNode.removeClassName("hidden");
					var d = jsonRpcResponse.getData();
				    var rb = generic.rb('language');
				    var msg = rb.get("email_signup_text");
					generic.showErrors([{text: msg, displayMode: "message"}]);
				},
				onFailure: function(jsonRpcResponse){
					var errorObjectsArray = jsonRpcResponse.getMessages();
					generic.showErrors(errorObjectsArray);
					emailProgressNode.addClassName("hidden");
					emailSubmitNode.removeClassName("hidden");
				}
			});
		});
	}
};

/* Ported from MICA EL menu handling code*/
el.globalnav.siblingColumns = {
    init: function() {
        var colset = $$(".sibling_cols");
        for (var i=0; i<colset.length; i++) {
            this.create_layout_table(colset[i]);
        }
    },
    
    create_layout_table: function(container) {
        var nodes = container.childNodes;
        if (!nodes) return false;

        var table = document.createElement("table");
        table.className = "sibling_table";
        var table_body = document.createElement("tbody");
        var table_row =  document.createElement("tr");

        for (var i=0; i<nodes.length; i++) {
            if (nodes[i].nodeType == 1) { /* is element */
                var table_cell = this.create_layout_cell(nodes[i]);
                table_cell.className = "sibling_cell";
                nodes = container.childNodes;
                i--;
                table_row.appendChild(table_cell);
            }
        }
        table_row.lastChild.className  += " sibling_col_last";
        table_row.firstChild.className += " sibling_col_first";

        table_body.appendChild(table_row);
        table.appendChild(table_body);      
        container.appendChild(table);

        return true;
    },
    
    create_layout_cell: function(node) {
        var table_cell =  document.createElement("td");
        table_cell.appendChild(node);
        return table_cell;
    }
};

el.globalnav.listenersInstalled = false;
el.globalnav.offersDropdownPendingOrVisible = false;

el.globalnav.browser_is_mac = navigator.userAgent.toLowerCase().indexOf("mac") != -1;
el.globalnav.browser_is_chrome = navigator.userAgent.toLowerCase().indexOf("chrome") != -1;
el.globalnav.browser_is_safari = (navigator.userAgent.toLowerCase().indexOf("safari") != -1 && !el.globalnav.browser_is_chrome) ? true : false;

el.globalnav.menuNav = {
    init: function() {
        nav_items = $$("#globalnav .section_item");
        if (nav_items == undefined) return;

        for (i=0; i<nav_items.length; i++) {
            this.center_drop_pane( nav_items[i] );

            if (i == 1) {
                this.add_anim(nav_items[i], nav_items[i].select(".menu_pane")[0]);
            }

            /* add numbering if relevent */
            if (nav_items[i].parentNode.className.match("progress_nav")) {
                nav_items[i].className += (" progress_nav_" + (i+1));
                continue;
            }

            // only install mouseover listeners if we are IE lt 7
            // -or- safari :: added for drop-menu positioning - safari can't calculate offsetWidth at load time
            if (!(document.all&&document.getElementById&&!el.globalnav.browser_is_mac) && !(el.globalnav.browser_is_safari)) continue;
            nav_items[i].idx = i;
			el.globalnav.listenersInstalled = true;
            this.install_listeners(nav_items[i]);
        }
    },
    
    center_drop_pane: function( elm ) {
        
        var amt = -0.5; 
		//55899 - COG June 28 2010 - Drop down exceeds main stage - fixed
        if( elm.id == 'globalnav_cat631' ) {
            amt = -0.22;
        } else if( elm.id == 'globalnav_cat681' ) {
            amt = -0.33;
        } else if( elm.id == 'globalnav_whats_new' ) {
            amt = 0.0;
        }

        var menu_item = elm.select(".menu_item")[0];
        var menu_item_width = menu_item.offsetWidth;

        var drop_pane = elm.select(".menu_pane")[0];
        if (drop_pane == undefined) return;
        var drop_pane_width = drop_pane.offsetWidth;

        drop_pane.style.left = Math.floor(((drop_pane_width - menu_item_width) * amt)) + "px";
        this.add_anim(elm, drop_pane);
    },

    add_anim: function(elm, drop_pane) {
        if (elm == undefined || drop_pane == undefined) return;
        drop_pane.id = elm.id + "_menu_pane";
        elm.observe('mouseover', function(e) {
            el.globalnav.menuPaneAnim.start();
        });
        
        elm.observe('mouseout', function(e) {
            el.globalnav.menuPaneAnim.end();
        });
    },
    
    install_listeners: function(elm) {
        if (!(elm.className.match("has_menu_pane"))) return;
        var self = this;

        elm.observe('mouseover', function(e) {
            this.className+=" over has_menu_pane_over";
            self.center_drop_pane( elm );
        });
        
        elm.observe('mouseout', function(e) {
            this.className = this.className.replace(" over",""); 
            this.className = this.className.replace(" has_menu_pane_over","");
        });
    }
}

el.globalnav.menuPaneAnim = {
    start: function(e) {
        // TODO: Implement animation for global nav dropdown 
        // promo pane
        return;
    },
    end: function(e) {
        // TODO: ""
        return;
    }
}

el.globalnav.offersPane = {
    display: function(){
        // Use previously set left value for IE; set to zero for other browsers
        var left_value = (el.globalnav.listenersInstalled && !el.globalnav.browser_is_safari) 
                       ? $$("#globalnav_special_offers .menu_pane")[0].style.left 
                       : '0'
                       ;
        
        // Safari needs to be centered manually
        if (el.globalnav.browser_is_safari) $("globalnav_special_offers_menu_pane").setStyle({left:'-110px'});

        // Set the left value                
        var specoff_menu_pane = $$("#globalnav_special_offers .menu_pane_layer").first();
        specoff_menu_pane.setStyle({
            display:'none',
            top: '30px',
            left: left_value,
            position: 'relative'     
        });
        
        // fade in the pane
        specoff_menu_pane.appear({ duration: .8 });
        
        // set .menu_item element to mimic hover
        $$("#globalnav_special_offers .menu_item")[0].addClassName('auto_dropdown');
        
        // set .globalnav_over element to mimic hover
        $$("#globalnav_special_offers .globalnav_over")[0].addClassName('auto_dropdown_image');
        $$("#globalnav_special_offers .globalnav_over")[0].removeClassName('globalnav_over');
        
        // set .globalnav_default element to mimic hover
        $$("#globalnav_special_offers .globalnav_default")[0].setStyle({ display:'none' });
    },
    hide: function(){
        var fade_duration = .8
        
        // left_value needed for IE - unset for other browsers
        var left_value = el.globalnav.listenersInstalled ? $$("#globalnav_special_offers .menu_pane")[0].style.left : '';
        
        var specoff_menu_pane = $$("#globalnav_special_offers .menu_pane_layer").first();
        specoff_menu_pane.fade({ duration: fade_duration });
        setTimeout(function() {
            specoff_menu_pane.setStyle({ display:"",top:"", left:left_value ,position:""})
        }, (fade_duration*1000)+250); 
        
        // unset .menu_item element to mimic hover
        $$("#globalnav_special_offers .menu_item")[0].removeClassName('auto_dropdown');
        
        // unset .globalnav_over element to mimic hover
        $$("#globalnav_special_offers .auto_dropdown_image")[0].addClassName('globalnav_over');
        $$("#globalnav_special_offers .auto_dropdown_image")[0].removeClassName('auto_dropdown_image');
        
        // unset .globalnav_default element to mimic hover
        $$("#globalnav_special_offers .globalnav_default")[0].setStyle({ display:'' });
    }
}

/* /Ported from MICA EL menu handling code*/

document.observe("dom:loaded", function() {
    // setup user
    var userParams = {};
    userParams.pageDataKey = 'globalnav.user';
    generic.user.getUser(userParams);

    // setup cart
    var cartParams = {};
    cartParams.pageDataKey = 'globalnav.cart';
    generic.checkout.cart.getCart(cartParams);
    // TODO
    //el.globalnav.initEmailSignup();
    
    el.globalnav.siblingColumns.init();
    el.globalnav.menuNav.init();
	
	if (!generic.cookie("viewed_offers_shade")) {
        el.globalnav.offersDropdownPendingOrVisible = true;
        setTimeout(function () {
            el.globalnav.offersPane.display();
            generic.cookie("viewed_offers_shade",1, {path:"/", exp: 1});
        }, 3000);
        setTimeout('el.globalnav.offersPane.hide()', 8000);    
    }
    
});

document.observe("cart:countsUpdated", function(){
    console.log( "cart:countsUpdated event caught" );
    var cartCount = generic.checkout.cart.getTotalItems()
    // Fix me
    if(cartCount > 1){ 
        var item_key = 'Produkte';
    }else{
        var item_key = 'Produkt';
    }
    $('shoppingbag_count').update(cartCount);
    $('item_cart_key').update(item_key);
});

// assumes user:loaded event exists
document.observe("user:updated", function(){
    console.log( "user:updated event caught" );
    // update any user-dependent display
});