/** @namespace global namespace for all JS code on esteelauder.com site */
var el = el || {};

/** @namespace namespace for page-specific JS code */
el.page = {};

el.urlRoot = window.location.protocol + "//" + window.location.hostname;

// Limit the scope of a DOM node search to a 
// specific node. It's like $$() only the second 
// arg is a node so the whole document doesn't have to 
// be searched. Also useful if the node you want to search/find
// is not in the DOM yet
// el.query(".css_selector", DOMNode)
el.query = function() {
    var node = $A(arguments).pop();
    return Selector.findChildElements(node, $A(arguments));
}

/* For email signup */

// rewrite to use brx jp common libraries
el.page.initEmailSignup = function() {
		var emailInputNode = null;
		var emailContainerNode = null;
		var emailFormNode = null;
		var emailSubmitNode = null;
		var emailProgressNode = null;
		emailContainerNode = $$("div.email-signup-container");
		if (!emailContainerNode) {
			return null;
		}
		/*emailContainerNode.each(function(formEle) {
			var emailFormNode = formEle.select("form")[0];
			//var emailSubmitNode = formEle.select("input.input-image")[0];
			var emailProgressNode = formEle.select("span.progress")[0];
			var emailInputNode = formEle.select("input.email-signup")[0];
			var errorContainerNode = formEle.select(".error_messages")[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");
						document.location.href='/account/email_signup/thankyou.tmpl';	
						//generic.showErrors([{text: msg, displayMode: "message"}]);

					},
					onFailure: function(jsonRpcResponse){
						var errorObjectsArray = jsonRpcResponse.getMessages();
						generic.showErrors(errorObjectsArray,errorContainerNode);
						emailProgressNode.addClassName("hidden");
						emailSubmitNode.removeClassName("hidden");
					}
				});
			});
		});*/
	};

var popup_timeout;

el.page.show_signup = function() {
    if (popup_timeout){ clearTimeout(popup_timeout) }
    $('email_sign_up_popover_div').style.display='block';
	//alert ($('email_sign_up_popover_div').style.display);
};

el.page.hide_signup = function() {
    popup_timeout = setTimeout( function(){ 
        $('email_sign_up_popover_div').style.display='none';   
        $('email_sign_up_popover_error_div').style.display='none';
    }, 1000);
};
/* /For email signup */

var quick_view = {};
quick_view.render = function(categoryId, productId) {
    if ( ! productId.toString().match(/^PROD/) ) {
        productId = "PROD" + productId;
    }

    if ( ! categoryId.toString().match(/^CAT/) ) {
        categoryId = "CAT" + categoryId;
    }
        
    el.productView.quickshopById(categoryId, productId);
}

el.page.quickshop = function() {
    $$('.quickshop-btn-init').each(function(btn) {
        el.page.quickshop.hookup(btn);
    });
    
    $$('.quickshop-btn-hide').each(function(btn) {
        var parent = btn.parentNode;
        $(parent).setStyle({"display" : "none"});
    });
    
    // text modules
    $$('.quickshop-txt-init').each(function(span) {
        el.page.quickshop.hookupText(span);
    });
}

el.page.quickshop.hookup = function(btn) {
    var productId = btn.getAttribute("productId");
    var categoryId = btn.getAttribute("categoryId");
    var disable = parseInt(btn.getAttribute("disable") || "0");
    var gp = btn.parentNode.parentNode;
    if ((!productId || !categoryId) || disable) {
        // don't try to hook up the button if
        // we can't get a category/product id
         
        // if there is no button, allow link to be
        // enabled
        if (gp && btn.hasClassName("quick-shop-mouseover") && !disable) {
            $(gp).setStyle({"display":"none"});
        } else if (btn.hasClassName("quick-shop-mouseover")) {
            el.page.quickshop.handle_mouseover(btn,gp);
        }
        
        return;
    }
        
    btn.observe("click", function(evt) {
        evt.preventDefault();
        el.productView.quickshopById(categoryId, productId);
    });
        
    // handle quick-shop mouseovers
    if (btn.hasClassName("quick-shop-mouseover")) {
        el.page.quickshop.handle_mouseover(btn,gp);
    }
}

el.page.quickshop.hookupText = function(span) {
    var productId = span.getAttribute("productId");
    var categoryId = span.getAttribute("categoryId");
    // need category/product id to call a quickview
    if (!productId || !categoryId) {
        return;    
    }
    
    span.observe("click", function(evt) {
        el.productView.quickshopById(categoryId, productId);
    });    
}

el.page.quickshop.handle_mouseover = function(btn,gp) {
    Event.observe(gp, "mouseover", function(evt) {
        btn.setStyle({"display": "block"});
    });
            
    Event.observe(gp, "mouseout", function(evt) {
        btn.setStyle({"display": "none"});
    });
           
    if (generic.env.isIE) {
        gp.style.backgroundImage = "url(/images/btn/btn_trans.gif)";
    }
            
    /* NOTE: Don't forget to add a 'position' attribute to your
     * button. Otherwise setting top and left is meaningless
     */
    var button_height = 22;
    var button_width = 84;
    var container_height = parseInt(gp.style.height.replace("px", ""));
    var container_width  = parseInt(gp.style.width.replace("px", ""));
    btn.style.top = ((container_height / 2) - (button_height / 2)) + "px";
    btn.style.left = ((container_width / 2) - (button_width / 2))+ "px";
}

el.page.shadowBox = {
    shadowTable: null,
    init: function(args) {
        var elm = (args.className) ?
            $$("."+ args.className)
            :
            $$(".shadow_container")
        ;
        
        this.shadowTable = this.shadowTable || this.create_shadow_table();
        
        var self = this;
        
        elm.each(function(container) {
            self.attachShadow(container);
        });
    },
    
    attachShadow: function(node) {
        var shadow = this.shadowTable.cloneNode(true);
        shadow.inner = el.query(".shadow_table_inner", shadow)[0];
           
        if (node.id != undefined && node.id.length > 0) {
            shadow.inner.className += " "+shadow.inner.className+"_for_"+node.id;
        }
            
        while (node.childNodes.length > 0) {
            shadow.inner.appendChild(node.childNodes[0]);
        }
           
        node.appendChild(shadow);
    },
    
    create_shadow_table: function() {
        var cnr_tl =  document.createElement("td");
        var cnr_tr =  document.createElement("td");
        var cnr_br =  document.createElement("td");
        var cnr_bl =  document.createElement("td");
        var bdr_t =  document.createElement("td");
        var bdr_r =  document.createElement("td");
        var bdr_b =  document.createElement("td");
        var bdr_l =  document.createElement("td");
        var bdr_l =  document.createElement("td");
        var shadow_table_inner = document.createElement("td");
        
        cnr_tl.className = "cnr_tl";
        cnr_tr.className =  "cnr_tr";
        cnr_br.className =  "cnr_br";
        cnr_bl.className =  "cnr_bl";
        bdr_t.className =  "bdr_t";
        bdr_r.className =  "bdr_r";
        bdr_b.className =  "bdr_b";
        bdr_l.className =  "bdr_l";
        shadow_table_inner.className = "shadow_table_inner";
        
        var row_top =  document.createElement("tr");
        var row_mid =  document.createElement("tr");
        var row_bot =  document.createElement("tr");
        
        row_top.className =  "shd_row_top";
        row_mid.className =  "shd_row_mid";
        row_bot.className =  "shd_row_bot";

        var tableBody = document.createElement("tbody");
        var shadowTable = document.createElement("table");
        shadowTable.className = "shadow_table";

        row_top.appendChild(cnr_tl);
        row_top.appendChild(bdr_t);
        row_top.appendChild(cnr_tr);
        
        row_mid.appendChild(bdr_l);
        row_mid.appendChild(shadow_table_inner);
        row_mid.appendChild(bdr_r);
        
        row_bot.appendChild(cnr_bl);
        row_bot.appendChild(bdr_b);
        row_bot.appendChild(cnr_br);
        
        tableBody.appendChild(row_top);
        tableBody.appendChild(row_mid);
        tableBody.appendChild(row_bot);
        
        shadowTable.appendChild(tableBody);
        
        return shadowTable;
    }
}
// 62204, 62641, 62633, 62634, 62635 COG 27 OCT 2010 - Fixed Alignment Issue on MPP Page 
Element.addMethods({
  pngHack: function(el){
    var el = $(el);
    if (!generic.env.isIE6) return el;
    var gif = '/images/common/s.gif';
    if ((el.match('img')) && (el.src.include('png'))){
      var alphaImgSrc  = el.src;
      var sizingMethod = 'image';
      el.src = gif;
    } else if (el.getStyle('backgroundImage').include('png')){
      var bgc = el.getStyle('backgroundColor') || '';
      var alphaImgSrc = el.getStyle('backgroundImage').gsub(/url\(|\)|'|"/, '');
      var sizingMethod = 'crop';
      el.setStyle({ background: [bgc, ' url(', gif, ') no-repeat'].join('') });
    } else {
      return el;
    }
    el.runtimeStyle.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="#{al}",sizingMethod="#{sz}")'.interpolate({ al: alphaImgSrc, sz: sizingMethod });
    return el;
  }
});

el.page.pngFix = function(rootNode) {
    // TODO: Narrow this down to IE6 when generic code is in place
    // Need to do nodes with background image pngs
    
	 if (!generic.env.isIE6) return false;
	//alert(rootNode);
    var root = rootNode || $(document.body);
    root.select("img").each(function(img) {
        $(img).pngHack();
    });

 };

/* add page events */
document.observe("dom:loaded", function() {
    el.page.shadowBox.init({});
    el.page.initEmailSignup();
    // TODO: Not working yet
    el.page.pngFix();
    
    // scan page for quickshops
    el.page.quickshop();
});
// 62204, 62641, 62633, 62634, 62635 COG 27 OCT 2010 - Fixed Alignment Issue on MPP Page