var startingPoint_fys;
var currentHairSwatch;
var clickedHairSwatch;
var currentOtherProducts;
var scrollMax;
// Find Your Shade Functions
function intiFindYourShade() {
	startingPoint_fys = Number(YAHOO.util.Dom.getXY('hairshadesbox')[0]);
	scrollMax = -63*(YAHOO.util.Dom.getChildren('hairshadesbox').length-4);
	var b = document.getElementById('back_fys');
	var n = document.getElementById('next_fys');
	b.onclick = function(){ motionFindYourShade('back'); }
	n.onclick = function(){ motionFindYourShade('next'); }
}
function positionFindYourShade(){
	var x = Number(YAHOO.util.Dom.getXY('hairshadesbox')[0]);
	var s = x - startingPoint_fys;	
	if(s <= scrollMax){
		return false;
	} else if(s <= -1 ) {
		return false;
	} else {
		return true;
	}
}
function motionFindYourShade(dir) {
	var x = Number(YAHOO.util.Dom.getXY('hairshadesbox')[0]);
	var s = x - startingPoint_fys;
	// Time of the Animation
	var time = 1;
	// Type of Animation
	animType = YAHOO.util.Easing.backBoth;
	if(dir == 'next' && s >= scrollMax){
		var a = new YAHOO.util.Motion('hairshadesbox', {points: { by: [-186, 0]}}, time, animType);

		a.onComplete.subscribe( function(){ positionFindYourShade(); } );
		a.animate();
	} else if(dir == 'back' && s < 0){
		var a = new YAHOO.util.Motion('hairshadesbox', {points: { by: [186, 0]}}, time, animType);

		a.onComplete.subscribe( function(){ positionFindYourShade(); } );
		a.animate();
	}
}
function findYourShadeSubmitToStep(nStep) {
	oForm = document.processStepRequest;
	oForm.action = "step" + nStep + ".jsp";
	oForm.submit();
}
function rollSwatchListImg(o){
	var newsrc;
	var image = o.getElementsByTagName('img')[0];
	var src = image.src;
	var ftype = src.substring(src.lastIndexOf('.'), src.length);
	if(/_on/.test(src)) {
		newsrc = src.replace('_on','');
	}else{
		newsrc = src.replace(ftype, '_on'+ftype);
	}
	image.src = newsrc;
}
function swapRollImages(el, swatchName){
	var images = document.getElementById(el).getElementsByTagName('img');
	for (i=0;i<images.length;i++){
		var tempSRC = images[i].src;
		var tempFTYPE = tempSRC.substring(tempSRC.lastIndexOf('.'), tempSRC.length);
		var newsrc;
		if(/_on/.test(tempSRC) && tempSRC.indexOf(swatchName + '.jpg') == -1) {
			newsrc = tempSRC.replace('_on','');
			images[i].src = newsrc;
		}
		else if(tempSRC.indexOf(swatchName + '.jpg') > -1 && !(/_on/.test(tempSRC))) {
			newsrc = tempSRC.replace(tempFTYPE, '_on'+tempFTYPE);
			images[i].src = newsrc;
		}
	}
}
function intiSwatchList(el,func){
	var list = document.getElementById(el).getElementsByTagName('li');
	for(i=0;i<list.length;i++){
		var link = list[i].getElementsByTagName('a');
		//link[0].onmouseover = function() { rollSwatchListImg(this); }
		//link[0].onmouseout = function() { rollSwatchListImg(this); }	
		link[0].onclick = function() { func(el,this); }
	}
}
function intiShadePaletteSwatchList(el,func){
	var list = document.getElementById(el).getElementsByTagName('li');
	for(i=0;i<list.length;i++){
		var link = list[i].getElementsByTagName('a');
		link[0].onmouseover = function() { rollSwatchInfoOn(this); }
		link[0].onmouseout = function() { rollSwatchInfoOff(this); }	
		link[0].onclick = function() { func(el,this); }
		
	}
	clickedHairSwatch=currentHairSwatch;
}		
function intiRTUShadePaletteSwatchList(el,func){
	var list = document.getElementById(el).getElementsByTagName('li');
	for(i=0;i<list.length;i++){
		var link = list[i].getElementsByTagName('a');
		link[0].onmouseover = function() { rollRTUSwatchInfoOn(this); }
		link[0].onmouseout = function() { rollRTUSwatchInfoOff(this); }	
		link[0].onclick = function() { func(el,this); }
	}
	clickedHairSwatch=currentHairSwatch;
}
function setShadeImage(el,nm){
	var image = document.getElementById(el);
	var imageSRC = image.src;
	var tempFTYPE = imageSRC.substring(imageSRC.lastIndexOf('.'), imageSRC.length);
	var tempFNAME = imageSRC.substring(imageSRC.lastIndexOf('/'), imageSRC.length);
	var newPath = imageSRC.replace(tempFNAME,'');
	newPath = newPath + "/swatch_med_" + nm + ".jpg";
	image.src = newPath;
}
function showProductInfo(el){
	var newEl = YAHOO.util.Dom.getElementsByClassName(el, 'div');
	var oldEl = (currentHairSwatch)? currentHairSwatch : undefined ;
	YAHOO.util.Dom.replaceClass(oldEl,'show','hide');
	YAHOO.util.Dom.replaceClass(newEl[0],'hide','show');
	currentHairSwatch = newEl[0];
}
// Shade Finder Step 1 Functions
function clickedSwatchStep1(el,obj){
	var image = obj.getElementsByTagName('img')[0];
	var cn = image.className;
	var hc = cn.replace('swatch ','');
	document.processStepRequest.frmStep1GenericShade.value = hc;
	swapRollImages(el, hc);
	setShadeImage('currentcolor-swt',hc);
}
// Shade Finder Step 4 Functions
function clickedSwatchStep4(el,obj){
	swapRollImages(el);
	var image = obj.getElementsByTagName('img')[0];
	var cl = image.className;
	var newci = cl.replace('swatch ','');
	swapRollImages(el, newci);
	setShadeImage('desiredcolor-swt',newci);
	showProductInfo(newci);
	callCII(image);
}
function setCurrentProductStep4(cName){
	var desired = document.getElementById('desiredcolor-swt');
	var products = YAHOO.util.Dom.getElementsByClassName(cName, 'div');
	YAHOO.util.Dom.replaceClass(products[0],'hide','show');
	currentHairSwatch = products[0];
}
// Shade Palette Functions
function clickedSwatchPalette(el,obj){
	
	swapRollImages(el);
	var image = obj.getElementsByTagName('img')[0];
	var cl = image.className;
	var newci = cl.replace('swatch ','');
	var swatchId = newci.substring(2,newci.length);
	
	//clickedHairSwatch = newci;
	swapRollImages(el, swatchId);
	setShadePaletteFader(newci);
	callCII(image);
}
function setShadePaletteFader(el){
	var newEl = el;
	var oldEl = currentHairSwatch;
//	alert(el + ":" + currentHairSwatch);
	YAHOO.util.Dom.replaceClass(oldEl,'show','hide');
	YAHOO.util.Dom.replaceClass(newEl,'hide','show');
	currentHairSwatch = newEl;
 	fixAlphaPngBox(newEl);
}
//
function intiProductSwatchHideShow(el,func)
{
	var list = document.getElementById(el).getElementsByTagName('li');
	for(i=0;i<list.length;i++){
		var link = list[i].getElementsByTagName('a');	
		link[0].onclick = function() { func(el,this); }
	}
}//
function productHideShow(el,obj)
{
	var el_arr = YAHOO.util.Dom.getElementsByClassName  ( el , 'div' , 'productinfo' );
	var oldEl = (currentHairSwatch)? currentHairSwatch : undefined ;
	var image = obj.getElementsByTagName('img')[0];
	YAHOO.util.Dom.replaceClass(oldEl,'show','hide');
	YAHOO.util.Dom.replaceClass(obj.className,'hide','show');
	currentHairSwatch = obj.className;
	swapRollImages(el);
	rollSwatchListImg(obj);	
	callCII(image);
}
// Adds back bu
function rollSwatchInfoOn(el){
	var image = el.getElementsByTagName('img')[0];
	var cl = image.className;
	var newci = cl.replace('swatch ','');
	var newEl = newci;
	var oldEl = currentHairSwatch;
	setOtherProducts(newci); 
	
	YAHOO.util.Dom.replaceClass(oldEl,'show','hide');
	YAHOO.util.Dom.replaceClass(newEl,'hide','show');
 	fixAlphaPngBox(newEl);
}
function rollSwatchInfoOff(el){
	var image = el.getElementsByTagName('img')[0];
	var cl = image.className;
	var newci = cl.replace('swatch ','');
	var currentEl = newci;
	var oldEl = currentHairSwatch;
	setOtherProducts(oldEl); 
	
	YAHOO.util.Dom.replaceClass(currentEl,'show','hide');
	YAHOO.util.Dom.replaceClass(oldEl,'hide','show');
}
// Root Touch-Up specific
function rollRTUSwatchInfoOn(el){
	var image = el.getElementsByTagName('img')[0];
	var cl = image.className;
	var newci = cl.replace('swatch ','');
	var newEl = newci;
	var oldEl = currentHairSwatch;
	setOtherProducts(newci); 
	
	YAHOO.util.Dom.replaceClass(oldEl,'show','hide');
	YAHOO.util.Dom.replaceClass(newEl,'hide','show');
}
function rollRTUSwatchInfoOff(el){
	var image = el.getElementsByTagName('img')[0];
	var cl = image.className;
	var newci = cl.replace('swatch ','');
	var currentEl = newci;
	var oldEl = currentHairSwatch;
	setOtherProducts(oldEl); 
	
	YAHOO.util.Dom.replaceClass(currentEl,'show','hide');
	YAHOO.util.Dom.replaceClass(oldEl,'hide','show');
}
// Adds back button functionality to any anchor tag that has the ID 'historyback'
function sethistoryBackButton(){
	var backButton;
	if(document.getElementById('historyback')){
		backButton = document.getElementById('historyback')
	} else {
		return false;
	}
	backButton.onclick = function(){ history.back(); alert('Back');}
	return true;
	
}
//Adds Print functionality to any anchor tag that has the class print attached to it.
function setPrintButtons(){
	var a = YAHOO.util.Dom.getElementsByClassName('print','a');
	for (i=0;i<a.length;i++){
		a[i].onclick = function(){ window.print(); };
	}
}
//Null function
function doNothing(){
}
function clickedSwatchPaletteRTU(el,obj){ 
	clickedSwatchPalette(el,obj); 
	var image = obj.getElementsByTagName('img')[0]; 
	var cl = image.className; 
	var newci = cl.replace('swatch ',''); 
	setOtherProducts(newci); 
	setShadePaletteFader(newci); 
} 

function setOtherProducts(cls){ 
	var el = YAHOO.util.Dom.getElementsByClassName ( cls , 'div' , 'otherproductslist' ); 
	if(YAHOO.util.Dom.hasClass(el, cls)){ 
	var newEl = el[0]; 
	var oldEl = currentOtherProducts; 
	YAHOO.util.Dom.replaceClass(oldEl,'show','hide'); 
	YAHOO.util.Dom.replaceClass(newEl,'hide','show'); 
	currentOtherProducts = newEl; 
} else { 

} 
}
// Sets the form's action.
function setFormAction(element,action)
{
	var form = document.getElementById(element);
	form.action = action;
}
//
function urlPathPage()
{
	var p = String(window.location);
	var f = p.indexOf('.');
	var l = p.lastIndexOf('.');
	p = p.substring(f,l)
	p = p.substring(p.indexOf('/'),p.length)
	p += "/";
	if(p != undefined && p != null && p != "")
	{
		return p + 'buy_online/';
	} 
	else 
	{
		return "/buy_online/shop_clairol/";
	}
}
// CII
function callCII(el)
{
	var store = document.getElementById('cii-store');
	var upcform = document.getElementById('upcform');
	var upcfields = YAHOO.util.Dom.getElementsByClassName ( 'upc' , 'input');
	var upc = el.id; 
	upc = upc.substring(3,upc.length);
	var url = '/buy_it_now/product_links.jsp?upc=' + upc;
	for(i=0;i<upcfields.length;i++)
	{
		upcfields[i].value = upc;
		var path = urlPathPage() + upc;
		//urchinTracker(path);
	}
	frames['cii-store'].location.href = url;
	var zip = document.getElementById('zip');
	if(zip.value == "" || zip.value == undefined || zip.value == " ")
	{
		zip.value = "Enter Zip Code";
	}
}
//
function checkZipField()
{
	var el = document.getElementById('zip');
	el.onfocus = function() { if(this.value == "Enter Zip Code"){this.value = "";}}
}
function validateZipField()
{
	var el = document.getElementById('zipcodeform');
	el.onsubmit = function() 
	{ 
		var el = document.getElementById('zip');
		var num = Number(el.value);
		if(el.value == "Enter Zip Code" || isNaN(num))
		{
			el.value = "Enter Zip Code";
			return false;
		} else {
			return true;
		}
	}
}
//
function showStore(btn)
{
	var el = document.getElementById('cii-store');
	YAHOO.util.Dom.replaceClass(el,'hide','show');
	
	var upcfields = YAHOO.util.Dom.getElementsByClassName ( 'upc' , 'input');
	for(i=0;i<upcfields.length;i++)
	{
		var upc = upcfields[i].value;
		var path = urlPathPage() + upc;
		urchinTracker(path);
	}
	//alert(path);
}
//
function setCloseStoreBTN()
{
	var closebtn = document.getElementById('closestore');
	closebtn.onclick = function() { YAHOO.util.Dom.replaceClass('cii-store','show','hide');}
	checkZipField();
	validateZipField()
}
//
function setStoreBTN()
{
	var el = document.getElementById('buyitnowbtn');
	el.onclick = function() { showStore(this);}
	setCloseStoreBTN();
}
//
function setStoreBTNClass()
{
	var el = YAHOO.util.Dom.getElementsByClassName ( 'buyitnow' , 'a' , 'process' );
	for(i=0;i<el.length;i++){
		el[i].onclick = function() { showStore(this);alert:('click');}
	}
	setCloseStoreBTN();
}
//
function setStoreBTNClassCBG()
{
	var el = YAHOO.util.Dom.getElementsByClassName ( 'buyitnow' , 'a' , 'product' );
	for(i=0;i<el.length;i++){
		el[i].onclick = function() { showStore(this);alert:('click');}
	}
	setCloseStoreBTN();
}
//
function setStoreBTNClassMYS()
{
	var el = YAHOO.util.Dom.getElementsByClassName ( 'buyitnow' , 'a' , 'store' );
	for(i=0;i<el.length;i++){
		el[i].onclick = function() { showStore(this);alert:('click');}
	}
	setCloseStoreBTN();
}

function inventoryPopUp()
{
	inventory = new YAHOO.widget.Tooltip("inventory", { 
	context:"inventoryEl", 
	text:"You have hovered over myContextEl.",
	showDelay:500 } );
}

function fixAlphaPngBox(swatchId) {
    var src     = '';
    var ua      = '';
    var width   = '';
    var height  = '';
    var rpng    = new RegExp('\.(png)$');
    var rmsie   = new RegExp('msie');
    var rmac    = new RegExp('mac');
	
	var box = document.getElementById(swatchId);
	
    for (var i = 0; i < box.getElementsByTagName('IMG').length; i++) {
        src     = box.getElementsByTagName('IMG')[i].getAttribute('src');
        ua      = navigator.userAgent.toLowerCase();
        width   = box.getElementsByTagName('IMG')[i].getAttribute('width');
        height  = box.getElementsByTagName('IMG')[i].getAttribute('height');

        if (src.match(rpng) && ua.match(rmsie) && !ua.match(rmac)) {
        	box.getElementsByTagName('IMG')[i].setAttribute('src', '/images/brand/niceneasy/main/spacer.gif');
            box.getElementsByTagName('IMG')[i].style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + src + '\', sizingMethod=scale)';
           	box.getElementsByTagName('IMG')[i].style.width = width + 'px';
            box.getElementsByTagName('IMG')[i].style.height = height + 'px';            
        }
	}
}

