/*
 * Javascript Functions for Interplak
 * Mootools functions. NOTE: Requires the Mootools Javascript Framework (www.mootools.net)
 * @Author Tony Collings
 * @Copyright Conair Corporation
 * @Date Nov 2010
 * @Version 1.0
 *
 */

// Global Mootools DIV for injection in overlays... 
var CONST_HALO_HTML = '<div class="halo-bg halo-bg-n"></div><div class="halo-bg halo-bg-ne"></div><div class="halo-bg halo-bg-e"></div><div class="halo-bg halo-bg-se"></div><div class="halo-bg halo-bg-s"></div><div class="halo-bg halo-bg-sw"></div><div class="halo-bg halo-bg-w"></div><div class="halo-bg halo-bg-nw"></div>';

var CONST_THIN_HALO_HTML = '<div class="thin-halo-top"></div><div class="thin-halo-left"></div><div class="thin-halo-right"></div><div class="thin-halo-bottom"></div><div class="thin-halo-tl-corner"></div><div class="thin-halo-tr-corner"></div><div class="thin-halo-br-corner"></div><div class="thin-halo-bl-corner"></div>';

var CONST_SQUARE_THIN_HALO_HTML = '<div class="border1-halo-top"></div><div class="border1-halo-left"></div><div class="border1-halo-right"></div><div class="border1-halo-bottom">';

var CONST_THIN_HALO_WIDE_HTML = '<div class="thin-halo-wide-top"></div><div class="thin-halo-wide-left"></div><div class="thin-halo-wide-right"></div><div class="thin-halo-wide-bottom"></div><div class="thin-halo-tl-wide-corner"></div><div class="thin-halo-tr-wide-corner"></div><div class="thin-halo-br-wide-corner"></div><div class="thin-halo-bl-wide-corner"></div>';
//HTML_constants.js?

var sLoadingAnimation = '<div class="ajaxLoading"><img src="css/img/grey-ajax-loader.gif" alt="" border="0" /><br />Loading... Please Wait...</div>';
var bSelectBoxesDisabled; // Boolean flag set if IE6 and z-index is toggled and SELECT boxes are present. IE6 & SELECT Bug

/*function fnInsertHalo(oDiv){

	var oHalo = new Element('div',{'class': 'thin-halo-wrapper','html' : CONST_THIN_HALO_HTML});
	oHalo.inject(oDiv);	
	
}*/

var IMAGE_SET = 't=halo-t.png,l=halo-l.png,r=halo-r.png,b=halo-b.png,tl=halo-tl.png,tr=halo-tr.png,br=halo-br.png,bl=halo-bl.png';	//associative array of images

/*function getImgSize(imgSrc) {
    var newImg = new Image();

    newImg.onload = function() {
    var height = newImg.height;
    var width = newImg.width;
    alert ('The image size is '+width+'*'+height);
    }

    newImg.src = imgSrc; // this must be done AFTER setting onload

}*/
/*
function fnImageWidth(sSrc) {
  //return an array with both?
    var oBuffer = new Image();
	if (Browser.Engine.trident) {
		oBuffer.onload = function() {
			this.style.width=oBuffer.width;
		}
	}
    oBuffer.src = sSrc; // this must be done AFTER setting onload
	if (Browser.Engine.trident) {
		var iWidth=oBuffer.style.width;
	}else{
		var iWidth=oBuffer.width;
	} 
	oBuffer = null;
	return iWidth;

}
function fnImageHeight(sSrc) {
  
    var oBuffer = new Image();
	if (Browser.Engine.trident) {
		oBuffer.onload = function() {
			this.style.height=oBuffer.height;
	  	}
	}
    oBuffer.src = sSrc; // this must be done AFTER setting onload
	if (Browser.Engine.trident) {
		var iHeight=oBuffer.style.height;
	}else{
		var iHeight=oBuffer.height;
	} 
	oBuffer = null;
	return iHeight;
	
 

Mootools version (look into)

var iHeight;
var oPreload = Asset.image(sSrfc, {
    onLoad: function(){
	this.iHeight = this.getCoordinates().height;
}
return this.iHeight; 
});
}*/
function fnDecodeURL(sEncoded){

	var sMassage=decodeURI(sEncoded);
	sMassage=sMassage.replace(/%26/gi,'&');
	sMassage=sMassage.replace(/%24/gi,'$');
	sMassage=sMassage.replace(/%21/gi,'!');
	sMassage=sMassage.replace(/%23/gi,'#');
	sMassage=sMassage.replace(/%24/gi,'$');
	sMassage=sMassage.replace(/%26/gi,'&');
	sMassage=sMassage.replace(/%27/gi,"'");
	sMassage=sMassage.replace(/%28/gi,'(');
	sMassage=sMassage.replace(/%29/gi,')');
	sMassage=sMassage.replace(/%2A/gi,'*');
	sMassage=sMassage.replace(/%2B/gi,'+');
	sMassage=sMassage.replace(/%2C/gi,',');
	sMassage=sMassage.replace(/%2D/gi,'-');
	sMassage=sMassage.replace(/%2E/gi,'.');
	sMassage=sMassage.replace(/%2F/gi,'/');
	sMassage=sMassage.replace(/%3A/gi,':');
	sMassage=sMassage.replace(/%3B/gi,';');
	sMassage=sMassage.replace(/%3D/gi,'=');
	sMassage=sMassage.replace(/%3F/gi,'?');
	sMassage=sMassage.replace(/%40/gi,'@');
	sMassage=sMassage.replace(/%5F/gi,'_');
	sMassage=sMassage.replace(/%7E/gi,'~');
	return sMassage;

}
function fnTweenImage(oImg,oReplace,iDuration){

	oFXImg = new Fx.Tween(oImg,  {property: 'opacity', duration: (iDuration+100),
		onComplete: function(){
			oImg.setStyles({'display':'none','opacity':0});		
		}
	}).start(0);	//	alert('');
 	oReplace.setStyles({'display':'block','opacity':0});	

	oFXReplace = new Fx.Tween(oReplace,  {property: 'opacity', duration: iDuration}).start(1);							
	
}

function fnFadeIn(obj,iDuration){

	var oFadeFX = new Fx.Tween((obj), {
		property: 'opacity', 
		duration: iDuration, 
		transition: Fx.Transitions.Expo.easeInOut,
		link: 'cancel',
		onComplete: function(){

			if($defined(this) && $type(this) == 'object') this.cancel();
			obj.setStyles({'display':'block','opacity':0});
			var oFadeFX = new Fx.Tween(obj, {property: 'opacity', duration: iDuration, transition: Fx.Transitions.Expo.easeInOut,link: 'cancel'}).start(1);

	}
	}).start(0);	

}

function fnFadeOut(obj,iDuration){

	var oFadeFX = new Fx.Tween((obj), {
		property: 'opacity', 
		duration: iDuration, 
		transition: Fx.Transitions.Expo.easeInOut,
		link: 'cancel',
		onComplete: function(){

			if($defined(this) && $type(this) == 'object') this.cancel();
			oFadeFX = new Fx.Tween(obj, {property: 'opacity', duration: iDuration, transition: Fx.Transitions.Expo.easeInOut,link: 'cancel',
			onComplete: function(){
				obj.setStyles({'display':'none','opacity':0});}}
			).start(0);
		
		}
	}).start(0);	

}
function Halo(){
	
	//Defaults
	this.iZindex=50;
	this.bDisplay=false;
	this.iPerimeter=0;
	this.sImagePath='css/img/halo/';
	
	this.Create=function(oDiv,sImageSet){

		var position=oDiv.getStyle('position');
		if(position=='static') oDiv.setStyle('position', 'relative');//parent div must be set

		var oWrapperDiv = new Element('div');
		var iTotalWidth=oDiv.getStyle('width');
		var iTotalHeight=oDiv.getStyle('height');
		var sDisplay='block';
		if (!this.bDisplay==true) sDisplay='none';
		oWrapperDiv.setStyles({'position':'absolute','z-index':this.iZindex,'display':sDisplay,'height':iTotalHeight,'width':iTotalWidth,'top':0,'left':0});	
		oWrapperDiv.inject(oDiv);
		aImages=sImageSet.split(',');

		var iZindex	=this.iZindex;
		var bDisplay = this.bDisplay;
		var iPerimeter=this.iPerimeter;
		var sImagePath=this.sImagePath;

		aImages.each(function(oImage,index) {

			var aImage=oImage.split('=');
			var oNewDiv = new Element('div');
			oNewDiv.setStyles({'position':'absolute'});	
			iWidth=fnImageWidth(sImagePath + aImage[1]);
			iHeight=fnImageHeight(sImagePath + aImage[1]);
			switch (aImage[0]){
				case 't':
					var bg='transparent url(' +sImagePath + aImage[1] + ') top left repeat-x';
					oNewDiv.setStyles({top:-iPerimeter,left:0});
					iWidth='100%';
					break;	
				case 'l':
					var bg='transparent url(' +sImagePath + aImage[1] + ') top left repeat-y';
					oNewDiv.setStyles({top:0,left:-iPerimeter});
					iHeight='100%';
					break;	
				case 'r':
					var bg='transparent url(' +sImagePath + aImage[1] + ') top right repeat-y';
					oNewDiv.setStyles({top:0,right:-iPerimeter});
					iHeight='100%';
					break;	
				case 'b':
					var bg='transparent url(' +sImagePath + aImage[1] + ') top right repeat-x';
					oNewDiv.setStyles({bottom:-iPerimeter,left:0});
					iWidth='100%';
					break;	
				case 'tl':
					var bg='transparent url(' +sImagePath + aImage[1] + ') top left no-repeat';
					oNewDiv.setStyles({top:-iPerimeter,left:-iPerimeter});
					break;	
				case 'tr':
					var bg='transparent url(' +sImagePath + aImage[1] + ') top right no-repeat';
					oNewDiv.setStyles({top:-iPerimeter,right:-iPerimeter});
					break;	
				case 'br':
					var bg='transparent url(' +sImagePath + aImage[1] + ') bottom right no-repeat';
					oNewDiv.setStyles({bottom:-iPerimeter,right:-iPerimeter});
					break;	
				case 'bl':
					var bg='transparent url(' +sImagePath + aImage[1] + ') bottom left no-repeat';
					oNewDiv.setStyles({bottom:-iPerimeter,left:-iPerimeter});
					break;	
				}
			oNewDiv.setStyles({height:iHeight,width:iWidth,background: bg});
			oNewDiv.inject(oWrapperDiv);
		});
	}
	
	function fnImageWidth(sSrc) {
	  //return an array with both?
		var oBuffer = new Image();
		if (Browser.Engine.trident) {
			oBuffer.onload = function() {
				this.style.width=oBuffer.width;
			}
		}
		oBuffer.src = sSrc; // this must be done AFTER setting onload
		if (Browser.Engine.trident) {
			var iWidth=oBuffer.style.width;
		}else{
			var iWidth=oBuffer.width;
		} 
		oBuffer = null;
		return iWidth;
	
	}
	function fnImageHeight(sSrc) {
	  
		var oBuffer = new Image();
		if (Browser.Engine.trident) {
			oBuffer.onload = function() {
				this.style.height=oBuffer.height;
			}
		}
		oBuffer.src = sSrc; // this must be done AFTER setting onload
		if (Browser.Engine.trident) {
			var iHeight=oBuffer.style.height;
		}else{
			var iHeight=oBuffer.height;
		} 
		oBuffer = null;
		return iHeight;
	}
	
}//End Halo



/*function fnTestHalo(oDiv,sImageSet,iZindex,bDisplay,iPerimeter){

	var position=oDiv.getStyle('position');
	if(position=='static') oDiv.setStyle('position', 'relative');//parent div must be 

	var oWrapperDiv = new Element('div');
	var iWidth=oDiv.getStyle('width');
	var iHeight=oDiv.getStyle('height');
	var sDisplay='block';
	if (!bDisplay==true) sDisplay='none';
	oWrapperDiv.setStyles({'position':'absolute','z-index':iZindex,'display':sDisplay,'height':iHeight,'width':iWidth,'top':0,'left':0});	
	oWrapperDiv.inject(oDiv);
	aImages=sImageSet.split(',');
	aImages.each(function(oImage,index) {

		var aImage=oImage.split('=');
		var oNewDiv = new Element('div');
		oNewDiv.setStyles({'position':'absolute'});	
		iWidth=fnImageWidth('css/img/halo/' + aImage[1]);//re-purposing variables
		iHeight=fnImageHeight('css/img/halo/' + aImage[1]);
		switch (aImage[0]){
			case 't':
				var bg='transparent url(css/img/halo/' + aImage[1] + ') top left repeat-x';
				oNewDiv.setStyles({top:-iPerimeter,left:0});
				iWidth='100%';
				break;	
			case 'l':
				var bg='transparent url(css/img/halo/' + aImage[1] + ') top left repeat-y';
				oNewDiv.setStyles({top:0,left:-iPerimeter});
				iHeight='100%';
				break;	
			case 'r':
				var bg='transparent url(css/img/halo/' + aImage[1] + ') top right repeat-y';
				oNewDiv.setStyles({top:0,right:-iPerimeter});
				iHeight='100%';
				break;	
			case 'b':
				var bg='transparent url(css/img/halo/' + aImage[1] + ') top right repeat-x';
				oNewDiv.setStyles({bottom:-iPerimeter,left:0});
				iWidth='100%';
				break;	
			case 'tl':
				var bg='transparent url(css/img/halo/' + aImage[1] + ') top left no-repeat';
				oNewDiv.setStyles({top:-iPerimeter,left:-iPerimeter});
				break;	
			case 'tr':
				var bg='transparent url(css/img/halo/' + aImage[1] + ') top right no-repeat';
				oNewDiv.setStyles({top:-iPerimeter,right:-iPerimeter});
				break;	
			case 'br':
				var bg='transparent url(css/img/halo/' + aImage[1] + ') bottom right no-repeat';
				oNewDiv.setStyles({bottom:-iPerimeter,right:-iPerimeter});
				break;	
			case 'bl':
				var bg='transparent url(css/img/halo/' + aImage[1] + ') bottom left no-repeat';
				oNewDiv.setStyles({bottom:-iPerimeter,left:-iPerimeter});
				break;	
			}
		oNewDiv.setStyles({height:iHeight,width:iWidth,background: bg});
		oNewDiv.inject(oWrapperDiv);
	});
	
}*/
function fnInsertDiv(oDiv,sClassName,sHTML){//parent object,classname of new div,HTML to insert in new div
//Designed for halos initially, but made generic 

	var position=oDiv.getStyle('position');
	var oNewDiv = new Element('div',{'class': sClassName,'html' : sHTML});

	if(position!='absolute' && position!='relative') oDiv.setStyle('position', 'relative');//parent div must be positioned for halos
	oNewDiv.inject(oDiv);
	return oNewDiv;	//return object for referencing
	
}
// AJAX Wrapper function.... 
function gogogadgetAJAX(sURL,sElementToInject){
	var oElementToInject = $(sElementToInject);
	//var objAJAX; // AJAX object
	oElementToInject.set('html',sLoadingAnimation);
	oXHR = new Request.HTML({ 

		onRequest: function(){
				//
		},
		onStateChange: function(){
				//
		}, 
		onSuccess: function(sHTML) {
			
			// IE6 SELECT BOX BUG FIX
			// Remove Select Boxes for IE6 ONLY. IE6 + z-index = problem. 
			var oBrowserName = BrowserDetect.browser;
			var oBrowserVersion = BrowserDetect.version;
			if(oBrowserName == 'Explorer' && oBrowserVersion <= 6){
				// Grab ALL Select Boxes
				var arrElementArray = $$('select');
				fixIE6SelectBox(arrElementArray,false);
				bSelectBoxesDisabled = true; 
			}
		
		
			if(oElementToInject){
				oElementToInject.set('html', '');
				oElementToInject.adopt(sHTML);
			} else {
				alert('We\'re sorry, there seems to have been a technical issue in getting the content you have requested. Please refresh the page and try again. If the problem persists please contact us here at web_helpme@conair.com. Thank you for your patience');	
			}
		},
		onFailure: function() {
			if(oElementToInject){
				oElementToInject.set('html', '<span class="ajaxError">Please accept our apologies, but we have been unable to process this <a href="http://en.wikipedia.org/wiki/Ajax_(programming)" title="AJAX" target="_blank"><acroynm title="(A)synchronous (J)avaScript (A)nd (X)ML"><strong>AJAX</strong></acroynm></a> request. Please close this window and try again. If you still experience problems please contact us at : web_helpme@conair.com<br /><p><a href="javascript:window.location=document.URL" title="Close this Window"><strong>Close</strong></a></span></p>');
			} else {
				alert('We\'re sorry, there seems to have been a technical issue in getting the content you have requested. Please refresh the page and try again. If the problem persists please contact us here at web_helpme@conair.com. Thank you for your patience');	
			}
		}
	});
	oXHR.post(""+sURL+"")
	
}


// Passes in an array of elements (should all be select boxes) and true/false to toggle on/off
function fixIE6SelectBox(arrElementArray,toggle){
	if(toggle){
		// Show Elements	
		arrElementArray.each(function(el) {
			el.setStyle('display','block');
		});
	}else{
		// Hide Elements
		arrElementArray.each(function(el) {
			el.setStyle('display','none');
		});
	}
}
 
// Applies an onfocus/onblur effect to form borders. Input : array
function fnFancyBorders(aElements,sFocusColor,sBlurColor){
	var oFX;
	if(aElements.count>0){
	aElements.each(function(oElement,index) {
	oElement.setStyles({border:'1px solid '+sBlurColor});
	oElement.addEvents({
			'focus' : function() {
					if($type(this.oFX) == 'object') this.oFX.cancel();
					oElement.setStyles({'border-width':'1px','border-style':'solid'});
					this.oFX = new Fx.Tween(oElement,  {property: 'border-color', duration: 600/*, transition: Fx.Transitions.Back.easeOut*/}).start(sBlurColor,sFocusColor);
					
			}, 
			'blur' : function() {
					if($type(this.oFX) == 'object') this.oFX.cancel();
					oElement.setStyles({'border-width':'1px','border-style':'solid'});
					this.oFX = new Fx.Tween(oElement,  {property: 'border-color', duration: 600/*, transition: Fx.Transitions.Back.easeOut*/}).start(sFocusColor,sBlurColor);
			}
		}); 
	}
	,oFX);
	}
}
function fnFormErrorShake(sElementID){
	
	if(sElementID == '') return; 
	var oElement = $(sElementID);
	var oErrorFX = new Fx.Tween(oElement, {property:'margin-left',link:'ignore',duration:75}); 
	oErrorFX.start(-10).chain(oErrorFX.start.pass(10, oErrorFX))
	.chain(oErrorFX.start.pass(-10, oErrorFX))
	.chain(oErrorFX.start.pass(10, oErrorFX))
	.chain(oErrorFX.start.pass(-10, oErrorFX))
	.chain(oErrorFX.start.pass(10, oErrorFX))
	.chain(oErrorFX.start.pass(-10, oErrorFX))
	.chain(oErrorFX.start.pass(0, oErrorFX));
}

function fnZoom(sZoomImage,oJSON){
	var sZoomDir = 'images/products/zoom/';
	var iMaxImageWidth = 550;  // If raw image is greater than this it will be HTML restrained. 
	var bHalo = true; // Show Halo Effect
	var oFX; // Fading FX!
	
	var sZoomTitleHTML = ''; // Zoom title HTML. 
	if(oJSON.products_model != '') sZoomTitleHTML += '<span class="zoom-product-model">'+oJSON.products_model+'</span>';
	if(oJSON.products_title != '') sZoomTitleHTML += '<span class="zoom-product-title">'+oJSON.products_title+'</span>';

	
	var oTargetCoords = $('zoom-btn').getCoordinates();
	
	if(!$('product-zoom')){ 
		// DIV Creation
		var oDiv = new Element('div', {
			'id' : 'product-zoom',
			'html': 'Loading... ',
			'styles': {
					'opacity': 0
			}
		});
		var oHalo = new Element('div',{'class': 'halo-bg-wrap','html' : CONST_HALO_HTML});
		var oCloseBtn = new Element('div',{'id':'zoom-close-btn','html':'<img src="css/img/zoom-close-btn.gif" alt="Close" border="0" />',
			'events': {
				'click' : function(){
					// Fade out then destroy... 
					if($defined(oFX)) oFX.cancel();
					oFX = new Fx.Tween(oDiv, {
						property: 'opacity', 
						duration: 800, 
						transition: Fx.Transitions.Expo.easeIn,
						onComplete: function(){
							oDiv.destroy();		
						}
					}).start(1,0);
				}
			}
		});

		
		var oImageTitle = new Element('div',{'id':'zoom-image-title','html': sZoomTitleHTML});		
		
		
		
		// DIV Injection
		oDiv.inject(document.body);
		oDiv.setStyles({'top':115,'left':(oTargetCoords.right-537)});
		oFX = new Fx.Tween(oDiv, {property: 'opacity', duration: 1500}).start(0,1);
		// CONTENT Injection
		var oImage = new Asset.image(sZoomDir+sZoomImage, {
			onload: function(){
				oDiv.empty();
				oDiv.grab(this);
				oDiv.grab(oCloseBtn,'top');
				if(bHalo) oDiv.grab(oHalo,'top');
				oDiv.grab(oImageTitle,'bottom');
				if(this.getCoordinates().width > iMaxImageWidth){
					// Resize... 
					var iRatio = this.getCoordinates().width/iMaxImageWidth;
					var iHeight = this.getCoordinates().height/iRatio; 
					this.setProperties({
						height: iHeight,
						width: iMaxImageWidth
					});
				}
				var oDrag = new Drag(oDiv);	
			}
		});
	}
}


function fnOpenPopUp(sURL,sTitle){
	// Override the sTitle Parameter. 
	// Microsoft implements the open() method in a slightly different way : http://msdn.microsoft.com/en-us/library/ms536651%28VS.85%29.aspx
	// So falling back on the lowest denominator
	var sTitle = '_blank';
	scrollTo(0,0);
	try 
	{
		var oPopup = window.open(sURL,sTitle,'resizable=yes,location=0,menubar=0,toolbar=0,width=850,height=600,scrollbars=1,top=100,left='+((screen.width/2)-450)+'');
		if (!oPopup.opener) oPopup.opener = self;
		if (window.focus) oPopup.focus();
	} 
	catch (e) 
	{
		alert("We just tried to open a \'Popup Window\', but have noticed pop-ups are blocked.\nTo enjoy this site at its best, please enable pop-ups for models.conair.com.\n");
	}	
}



function fnGetQueryStringVar(sVar){
    var sQueryString = unescape(location.search);
    if (sQueryString == '') return null;
    sQueryString = sQueryString.substr(1);
    var aParams = sQueryString.split("&");
    for (var i = 0; i < aParams.length; i++)
    {
        var aKeyPairs = aParams[i].split("=");
        if(aKeyPairs[0] == sVar)
        {
            return aKeyPairs[1];
        }
    }
}

function fnRunErrorEffect(aFields){
	aFields.each(function(oElement,iIndex) {
		var a = '#e03b2a';
		var b = '#9e9e9e';
		var oErrorFX = new Fx.Tween(oElement, {property:'border-color',link:'ignore'}); 
		oErrorFX.start(b).chain(oErrorFX.start.pass(a, oErrorFX))
		.chain(oErrorFX.start.pass(b, oErrorFX))
		.chain(oErrorFX.start.pass(a, oErrorFX));	
	});
}


 function fnInstallPDF_XPI(oEvent){
	  var oParameters = {
		  "PDF Plugin for Firefox": { 
			  URL: oEvent.target.href,
			  Hash: oEvent.target.getAttribute("rel"),
			  toString: function () { return this.URL; }
		  }
	  };
	  InstallTrigger.install(oParameters); // This is Gecko based ONLY JS. 
	  return false;
 }
 
 function fnPreloadImages(aPreloadImages){
 	if(aPreloadImages.length > 0){
		var iTimer = 0;
		aPreloadImages.each(function(oImage, iIndex){	
			// Get src and load 
			oImage.setStyles({'opacity':0});				
			var sSrc = oImage.getProperty('src');
			var oPreloadImage = Asset.image(sSrc, {
				onload: function(){
					var oPreloadFX = new Fx.Tween(oImage,{property:'opacity',link:'cancel',duration:1500});
					oPreloadFX.start.delay(iTimer, oPreloadFX, [1]);	
					iTimer += 150;	
				}
			});
			
		}); 
	}
 }