/** @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();

	/* 36065 COG Sep 16 2010 - Fixed shadow table border issue in IE */
	try {
		var check =  Selector.findChildElements(node, $A(arguments));
	}
	catch (e) {
		var check = Selector.findChildElements(node, ['.shadow_table_inner'], ['*']);
	}

	return check;
	/* 36065 COG Sep 16 2010 - Fixed shadow table border issue in IE */
}

/* 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?email='+emailInputNode.value;	
                        document.location.href='/cms/promotions/email_signup_thanks.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';
};

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, skuId) {
    if ( ! productId.toString().match(/^PROD/) ) {
        productId = "PROD" + productId;
    }
    
    if ( ! categoryId.toString().match(/^CAT/) ) {
        categoryId = "CAT" + categoryId;
    }
    
    skuId = skuId || '';
    
    if ( skuId && ! skuId.toString().match(/^SKU/) ) {
        skuId = "SKU" + skuId;
    }
    
    // TODO: add sku subsets to quick_view.render
    el.productView.quickshopById(categoryId, productId, [], undefined, skuId);
}

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 skuIds;
    if (ids = btn.getAttribute("skuIds")) {
        skuIds = ids.split(",");
    } else {
        skuIds = [];
    }

    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();
        
        if ( ! productId.toString().match(/^PROD/) ) {
            productId = "PROD" + productId;
        }
        
        if ( ! categoryId.toString().match(/^CAT/) ) {
            categoryId = "CAT" + categoryId;
        }
        
        if (skuIds.length) {
            for (var i = 0; i < skuIds.length; i++) {
               if (! skuIds[i].toString().match(/^SKU/)) {
                   skuIds[i] = "SKU" + skuIds[i];
               } 
            }
        }
        el.productView.quickshopById(categoryId, productId, skuIds, evt.target);
    });
        
    // 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");
    
    var skuIds;
    if (ids = span.getAttribute("skuIds")) {
        skuIds = ids.split(",");
    } else {
        skuIds = [];
    }
    
    // need category/product id to call a quickview
    if (!productId || !categoryId) {
        return;    
    }
    
    span.observe("click", function(evt) {
        if (skuIds.length) {
            for (var i = 0; i < skuIds.length; i++) {
               if (! skuIds[i].toString().match(/^SKU/)) {
                   skuIds[i] = "SKU" + skuIds[i];
               } 
            }
        }
        
        el.productView.quickshopById(categoryId, productId, skuIds);
    });    
}

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"});
    });
         
    Event.observe(gp, "click", function(evt) {
        var target = evt.target;
        if (target.hasClassName('quickshop-btn')) {
            return;
        }
        
        Event.stop(evt);
        btn.simulate('click');
    });
    
    if (generic.env.isIE) {
        gp.style.backgroundImage = "url(/images/btn/btn_trans.gif)";
    }
    
    gp.setStyle({ cursor: 'pointer' });
    
    /* 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;
    }
}

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();
    });

};

el.page.contact_cs = {
    init: function() {
        var elm = document.getElementById("contact_cs");
        if (elm == undefined) return;
        if (elm.className == "") elm.className = "contact_cs_btn";
        elm.onmouseover = function() {
            this.className += " over";
        }
        elm.onmouseout = function() {
            this.className = this.className.replace(" over","");
        }
    }
};

el.page.tracking_add_ons = {
	init: function() {
		if(($$('iframe[name="google_conversion_frame"]')[0])){
			($$('iframe[name="google_conversion_frame"]')[0]).setStyle({position: 'absolute', left: '-1000px'});
		}
	}
};

el.page.facebookShare = function(args) {
    var cat   = args.categoryId;
    var prod  = args.productId;
    var img   = args.image;
    var url   = args.url;
    var title = args.title || '';
    var desc  = args.description || '';
    
    if ( ! cat.toString().match(/^CAT/) ) {
        cat = "CAT" + cat;
    }
    
    if ( ! prod.toString().match(/^PROD/) ) {
        prod = "PROD" + prod;
    }
    
    var parts = url.split('#');
    
    var tmplurl = [
        'http://www.esteelauder.com/product/facebook.tmpl?CATEGORY_ID=',
        cat,
        '&PRODUCT_ID=',
        prod,
        '&title=',
        encodeURIComponent(title),
        '&image=',
        encodeURIComponent(img),
        '&description=',
        encodeURIComponent(desc),
        '&refresh_url=',
        parts[0]
    ].join('');

    if ( parts[1] ) {
        tmplurl += encodeURIComponent( '#' + parts[1]);
    }

    var result = [
        "http://www.facebook.com/sharer.php?u=",
        encodeURIComponent(tmplurl)
    ].join('');
    
    return result;
}

el.page.loadLiveChatButtons = function() {
    // Create an image object for the livechat button.
    // We want to do this asap because this image sometimes takes a while to load
    // due to the logic and roundtrip time to query the liveperson server.
    // I put this in this file due to its dependence on the above uri object.
    var uri = window.location;
    var uri_protocol = uri.protocol;
    var URL_DOMAIN = uri.protocol + "//" + uri.host;
    var timestamp = Number(new Date());
    
    var liveChatButtonImageObj = new Image();
    liveChatButtonImageObj.src = uri_protocol+'//service.liveperson.net/hc/24631554/?cmd=repstate&site=24631554&channel=web&&ver=1&imageUrl='+URL_DOMAIN+'/images/liveperson/product&skill=EL%20Germany&timestamp='+timestamp;
    liveChatButtonImageObj.name="hcIcon";
    liveChatButtonImageObj.style.border="0";
        
    // Load any livechat links with the button above
	$$('a.livechatlink').each(function(el){
		if ( el.empty() ) {
			var img = new Image();
			if (el.id == 'livechatlinkrenutriv') {
			    img.src = uri_protocol+'//service.liveperson.net/hc/24631554/?cmd=repstate&site=24631554&channel=web&&ver=1&imageUrl='+URL_DOMAIN+'/images/liveperson/renutriv&skill=EL%20Russia&timestamp='+timestamp;
			} else if (el.id == 'livechatlinkcategory') {
			    img.src = uri_protocol+'//service.liveperson.net/hc/24631554/?cmd=repstate&site=24631554&channel=web&&ver=1&imageUrl='+URL_DOMAIN+'/images/liveperson/category&skill=EL%20Russia&timestamp='+timestamp;
			} else if (el.id == 'livechatlinkspp') {
			    img.src = uri_protocol+'//service.liveperson.net/hc/24631554/?cmd=repstate&site=24631554&channel=web&&ver=1&imageUrl='+URL_DOMAIN+'/images/liveperson/spp&skill=EL%20Russia&timestamp='+timestamp;
			    img.style.paddingLeft = "3px";
			} else {
			    img.src = uri_protocol+'//service.liveperson.net/hc/24631554/?cmd=repstate&site=24631554&channel=web&&ver=1&imageUrl='+URL_DOMAIN+'/images/liveperson/product&skill=EL%20Russia&timestamp='+timestamp;
			}
			img.name = liveChatButtonImageObj.name;
			img.style.border = liveChatButtonImageObj.style.border;
			el.update(img);
		}
	});
};

/* 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();    
    
    // LivePerson Logic
    el.page.loadLiveChatButtons();
    
    el.page.contact_cs.init();          // contact customer service - IE mouseover
	
	el.page.tracking_add_ons.init();	//google tracking iframe and 1 pixels images affecting layout...
});


function init() {
	if (arguments.callee.done) return;
	arguments.callee.done = true;
	var li_ = document.getElementsByTagName('LI');
	var leng = li_.length;
	for ($i = 0; i < leng; i++) {
		if (li_[i].getElementsByTagName('a')) {
			href_ = li_[i].innerHTML + "";
			iO = href_.indexOf('/holiday_gift_guide_09/index.tmpl');
			if ((iO + 1)&&(li_[i].localName == "li")&&(iO < 20)) {
				li_[i].hidden = true;
			}
		}
	}
}

// ff, opera
if (document.addEventListener) {
	document.addEventListener("DOMContentLoaded", init, false);
}

// ie
/*@cc_on @*/
/*@if (@_win32)
document.write("<script id=__ie_onload defer src=javascript:void(0)>");
document.write("<\/script>");
var script = document.getElementById("__ie_onload");
script.onreadystatechange = function() {
		if (this.readyState == "complete") {
				init();
		}
};
/*@end @*/

// safari
if (/WebKit/i.test(navigator.userAgent)) {
	var _timer = setInterval(function() {
		if (/loaded|complete/.test(document.readyState)) {
			clearInterval(_timer);
			delete _timer;
			init();
		}
	}, 10);
}
// others
window.onload = init;