/**************************************************************

	Script		: Javascript
	Version		: 0.1
	Authors		: Dominic Kelly
	Desc		: Common scripts
	Last Update : 22.09.08

**************************************************************/

// Attach events

document.addEvent( 'domready' , function() { // dom is ready
	
		// sIFR
		
		if(typeof sIFR == "function"){

			// This is the preferred "named argument" syntax
			
			sIFR.replaceElement(named({sSelector:"h1 u", sFlashSrc:"/fonts/fg-bold.swf", sColor:"#6b6a6c", sWmode:"transparent", sFlashVars:"textalign=left&offsetTop=0"}));			
			sIFR.replaceElement(named({sSelector:"h3 u", sFlashSrc:"/fonts/fg-medium.swf", sColor:"#6b6a6c", sWmode:"transparent", sFlashVars:"textalign=left&offsetTop=0"}));			
			sIFR.replaceElement(named({sSelector:"h4 u", sFlashSrc:"/fonts/fg-regular.swf", sColor:"#6b6a6c", sWmode:"transparent", sFlashVars:"textalign=left&offsetTop=0"}));
			sIFR.replaceElement(named({sSelector:"h1 strong", sFlashSrc:"/fonts/fg-bold.swf", sColor:"#ffffff", sWmode:"transparent", sFlashVars:"textalign=left&offsetTop=0"}));			
			sIFR.replaceElement(named({sSelector:"h3 strong", sFlashSrc:"/fonts/fg-medium.swf", sColor:"#ffffff", sWmode:"transparent", sFlashVars:"textalign=left&offsetTop=0"}));			
			sIFR.replaceElement(named({sSelector:"h4 strong", sFlashSrc:"/fonts/fg-regular.swf", sColor:"#ffffff", sWmode:"transparent", sFlashVars:"textalign=left&offsetTop=0"}));
			sIFR.replaceElement(named({sSelector:"h1 a", sFlashSrc:"/fonts/fg-bold.swf", sColor:"#6b6a6c", sWmode:"transparent", sFlashVars:"textalign=left&offsetTop=0"}));
			sIFR.replaceElement(named({sSelector:"div#secondary-info h3", sFlashSrc:"/fonts/fg-medium.swf", sColor:"#6b6a6c", sWmode:"transparent", sFlashVars:"textalign=left&offsetTop=0"}));			
			sIFR.replaceElement(named({sSelector:"h3 a", sFlashSrc:"/fonts/fg-medium.swf", sHoverColor:"#666666", sColor:"#6b6a6c", sWmode:"transparent", sFlashVars:"textalign=left&offsetTop=0"}));			
			sIFR.replaceElement(named({sSelector:"h4 a", sFlashSrc:"/fonts/fg-regular.swf", sColor:"#6b6a6c", sWmode:"transparent", sFlashVars:"textalign=left&offsetTop=0"}));
			sIFR.replaceElement(named({sSelector:".tab-text h2", sFlashSrc:"/fonts/fg-bold.swf", sColor:"#ffffff", sWmode:"transparent", sFlashVars:"textalign=left&offsetTop=0"}));	
			sIFR.replaceElement(named({sSelector:".newstitle", sFlashSrc:"/fonts/fg-medium.swf", sColor:"#6b6a6c", sWmode:"transparent", sFlashVars:"textalign=left&offsetTop=0"}));
		}

		// If the right hand-side menu has no children, hide the entire menu, otherwise display it
		
		if($("right-nav")){				
			var myElement = $("right-nav");
			var nextSibling = myElement.getChildren();
				if(nextSibling.length >=3){
					myElement.style.display = "block";
				}else{
					myElement.style.display = "none";
				}				
		}	
		
		// on the sanitary template.  
		//If any group doesn't have a title, then the box will be hidden		
		
		if($("sanitarybox1")){				
			var myElement = $("sanitarytitle2");
			var myElement2 = $("sanitarybox2");
			var myElement3 = $("sanitarytitle3");
			var myElement4 = $("sanitarybox3");
			
			if (myElement.innerHTML=="") {
			myElement2.style.display="none";			
			}
			
			if (myElement3.innerHTML=="") {
			myElement4.style.display="none";			
			}
					
		}			
		
		// on the accessories details page
		// hides any boxes which arent filled in
		
		if($("accessoriestext1")){	
			var myElement = $("accessoriestext1");
			var myElement2 = $("accessoriesbox1");
			var myElement3 = $("accessoriestext2");
			var myElement4 = $("accessoriesbox2");
			var myElement5 = $("accessoriestext3");
			var myElement6 = $("accessoriesbox3");
			var myElement7 = $("accessoriestext4");
			var myElement8 = $("accessoriesbox4");
			var myElement9 = $("accessoriestext5");
			var myElement10 = $("accessoriesbox5");
			var myElement11 = $("accessoriestext6");
			var myElement12 = $("accessoriesbox6");
			var myElement13 = $("accessoriestext7");
			var myElement14 = $("accessoriesbox7");
			var myElement15 = $("accessoriestext8");
			var myElement16 = $("accessoriesbox8");
			var myElement17 = $("accessoriestext9");
			var myElement18 = $("accessoriesbox9");
			var myElement19 = $("accessoriestext10");
			var myElement20 = $("accessoriesbox10");
			var myElement21 = $("accessoriestext11");
			var myElement22 = $("accessoriesbox11");
			var myElement23 = $("accessoriestext12");
			var myElement24 = $("accessoriesbox12");			
			
			if (myElement.innerHTML=="") {
				myElement2.style.display="none";			
			}
			if (myElement3.innerHTML=="") {
				myElement4.style.display="none";			
			}
			if (myElement5.innerHTML=="") {
				myElement6.style.display="none";			
			}
			if (myElement7.innerHTML=="") {
				myElement8.style.display="none";			
			}
			if (myElement9.innerHTML=="") {
				myElement10.style.display="none";			
			}
			if (myElement11.innerHTML=="") {
				myElement12.style.display="none";			
			}
			if (myElement13.innerHTML=="") {
				myElement14.style.display="none";			
			}
			if (myElement15.innerHTML=="") {
				myElement16.style.display="none";			
			}
			if (myElement17.innerHTML=="") {
				myElement18.style.display="none";			
			}
			if (myElement19.innerHTML=="") {
				myElement20.style.display="none";			
			}
			if (myElement21.innerHTML=="") {
				myElement22.style.display="none";			
			}
			if (myElement23.innerHTML=="") {
				myElement24.style.display="none";			
			}				
		}	

		// Hide / Show login buttons
		
		if($('acc-login')){
			if(skUsername){
				$('acc-login').style.display = "none";
				$('acc-logout').style.display = "block";
			}else{
				$('acc-login').style.display = "block";
				$('acc-logout').style.display = "none";
			}
		}

		// Homepage - Add slideshow panel
		
		if(skEditorialId == "01r"){
			var myMooSlide = new mooSlide({
				box: $('slideBox'),
				items: $$('#slideBox div'),
				size: 663,
				handles: $$('#slideHandles a'),
				startItem: 1,
				onWalk: function(currentItem,currentHandle){
					this.handles.removeClass('active');
					currentHandle.addClass('active');
				}
			});			
		}
		
		// Manage Account - populate fields (variables set in the data island)
		
		if(skEditorialId == "01r008002"){
			$('SKFCE_6_UserInput').value = xmlTitle;
			$('SKFCE_7_UserInput').value = xmlForename;
			$('SKFCE_8_UserInput').value = xmlSurname;
			$('SKFCE_9_UserInput').value = xmlCompany;
			$('SKFCE_10_UserInput').value = xmlPosition;
			$('SKFCE_11_UserInput').value = xmlAddress_1;
			$('SKFCE_12_UserInput').value = xmlAddress_2;
			$('SKFCE_13_UserInput').value = xmlTown_City;
			$('SKFCE_14_UserInput').value = xmlPostcode;
			$('SKFCE_15_UserInput').value = xmlTelephone_Number;
			$('SKFCE_16_UserInput').value = xmlEmail;
			$('SKFCE_20_UserInput').value = xmlUser_Type;
			
			if(xmlMarketing_Opt_In == "ON" ){
				$('SKFCE_19_UserInput').checked = true;
			}			
			
		}
		
		// add popups to links

		// right banner links
		if($('callslink2')){
			$('callslink2').varbit="http://design.bushboard-washrooms.co.uk/index.asp?pUserName=" + skUsername;
			$('callslink2').widd="760";
			$('callslink2').hidd="570";
			$('callslink2').scroll="0";
			$('callslink2').addEvent( 'click' , popup);
		}

		if($('callslink1')){	
			$('callslink1').addEvent( 'click' , openOrderSamples);
		}
		
		// Quick search box add events 

		if($('searchbtn')){$('searchbtn').addEvent( 'click' , submitQuickSearch);} // quick search button is clicked
		if($('searchbox')){$('searchbox').addEvent( 'focus' , focusQuickSearch);}  // clear quick search text box
		if($('searchbox')){$('searchbox').addEvent( 'blur' , blurQuickSearch);} // populate quick search text box	
		
		// Quick search box define events
		
		function submitQuickSearch(){
			if(($('searchbox').value != "Product Search...")){
				$('quick-search-box').submit();
			}
		}

		function focusQuickSearch(){
			this.value = "";	
		}
		
		function blurQuickSearch(){
			// user left the text box blank, so reset it
			if(this.value.length < 1){
				this.value = "Product Search...";
			}
		}

		// PRESENTATION BOARD REQUEST FORM : add dynamic functionality
		// WHEN LAMINATE IS CLICKED, IT WILL POPULATE THE VANITY UNITS COLOUR WITH FULL LIST OF VALUES

		if($("Sitekit_Form_2708")){	

			// add function to laminate checkbox
			$('SKFCE_4_UserInput_0').addEvent( 'click' , laminateclicked);

			// save values from the two dropdowns to arrays so that they can be toggled.

			var laminateval1=$('SKFCE_32_UserInput');
			var laminateval2=$('SKFCE_28_UserInput');

			// 32 is the laminate vanity unit colours, 28 is the list for colour 1

			var lamval1=new Array();
			var lamval1b=new Array();

			lamval1.length=laminateval1.length;
			lamval1b.length=laminateval1.length;

			for (i=0;i<laminateval1.length;i++) {
				lamval1[i]=laminateval1.options[i].value;
				lamval1b[i]=laminateval1.options[i].text;
			}

			var lamval2=new Array();
			var lamval2b=new Array();

			lamval2.length=laminateval2.length;
			lamval2b.length=laminateval2.length;


			for (y=0;y<laminateval2.length;y++) {
				lamval2[y]=laminateval2.options[y].value;
				lamval2b[y]=laminateval2.options[y].text;
			}
		}



		function laminateclicked() {

			// check if laminate is selected
			var lamval="check"+($('SKFCE_4_UserInput_0').checked);
			
			if(lamval!="checktrue") {
			
				//populate with initial values when "laminate" not selected
				laminateval1.options.length=lamval1.length;
				for (i=0;i<lamval1.length;i++) {
				laminateval1.options[i].value=lamval1[i];
				laminateval1.options[i].text=lamval1b[i];
				}
			}else{
			
				//populate with values from colour 1 when laminate is selected
				laminateval1.options.length=lamval2.length;
				for (i=0;i<lamval2.length;i++) {
				laminateval1.options[i].value=lamval2[i];
				laminateval1.options[i].text=lamval2b[i];
				}
			}
		}


		// FORM VALIDATIONS
		// Check for the presence of a SiteKit form, and if found attach the required validation to field based on 
		// associated label names
			
		// Find form id

		var allForms = $$('form'); // get all forms on the page
		
		
		if(allForms.length >=1){ // if there actually is a form on the page...

			allForms.each(function(item, index){
				// Search form ids for the string "Sitekit_Form_" and returns true if found	
				isSitekitForm = item.id.test("Sitekit_Form_");
				if(isSitekitForm == true){
					skFormId = item.id;
				}
			});
		}
		
		// Add validation classes to form (Available validations: required,required email,required number,required postcode,required date)
		var formLabelElements = $$('.FormContentLeft span'); // Returns an array of spans contained within the element with id 'FormContentLeft'

		// Loop through the 'formLabelElements' array
		formLabelElements.each(function(item, index){

			// Search form labels for the string "required" and returns true if found
			var isRequired = item.innerHTML.test("required");
			
			// apply classes to required fiels
			
			if(isRequired == true){
							
				// Get the parent label 'for' name, which tells us the id of the corresponding form input
				var formElementId = item.getParent().htmlFor;

				// Check the field name to get the type of validation required
				returnValidationType(item.innerHTML,formElementId);

				// Add type of validation required as used by the validation class	
				document.getElementById(formElementId).className = validationOptions[0];			
				
				// Set default Error message	
				//document.getElementById(formElementId).title = validationOptions[1]; // not used
			}
			
			// Search form labels for the string "Repeat" and returns true if found
			var isPassword = item.innerHTML.test("Password");
			
			// Apply classes to password field
			if(isPassword == true){

				// Get the parent label 'for' name, which tells us the id of the corresponding form input
				var formElementId = item.getParent().htmlFor;
				
				// Passwords are not required, but if one is entered validate it
				
				//alert(formElementId);
				
				//if(item.innerHTML.length > 0){
					// Passwords are not always required, but if the user sets on, make sure it matches
				//	returnValidationType(item.innerHTML + "(required)",formElementId);
				
					// Add type of validation required as used by the validation class	
				//	document.getElementById(formElementId).className = validationOptions[0];	
				//}
			
			}

		});
		
		// Attach a validation object to the form (if there is one)
		
		// had to add a check for presense of any forms, causing errors on pop up windows
		
		if(allForms.length >=1){
			if(isSitekitForm == true){
				var myFormValidation = new Validate(skFormId,{	
					errorClass: 'formErrorField',
					errorMsgClass: 'formErrorLabel' // not used - default messages are set in the class
				});
			}
		}
		
		
		// Shows the slidebox only when the page has loaded
		// This prevents the "ghosting" effect where the other sections are shown before the page is loaded
		
		if($('slideBox')){
		$('slideBox').style.margin="0";
		}
		

		// Check the field name to get the type of validation required
		// Valid validations are "required", "required postcode", "required number" and "required email"

		function returnValidationType(controlLabel, controlId){

			validationOptions = new Array();

			switch(controlLabel)
			{
			case "Postcode (required)":
				validationOptions[0] = "required postcode";
			  break;
			case "Date (required)":
				validationOptions[0] = "required date";
			  break;			  
			case "Telephone Number (required)":
				validationOptions[0] = "required number";
			  break;
			case "Email Address (required)":
				validationOptions[0] = "required email";
			  break;
			case "Password (required)":
				validationOptions[0] = "required password";
			  break;
			case "Repeat Password (required)":
				validationOptions[0] = "required repeatpassword";
			  break;
			default:
				validationOptions[0] = "required";
			}			
		}
		
	
		// Search page for div id "thumbnails-box-images" which contain images which must be largerBox (similiar to lightbox)
				
		if($("thumbnails-box-images")){	


			var myElement = $("thumbnails-box-images");
			var allAnchors = $(myElement).getElements('img');

				allAnchors.each(function(item, index){			
			
					// largerBox requires a class on the link called "fullImage", so add it.
					//item.className = "fullImage";	
								
					if(item.getParent().tagName == "A"){			
			
					item.getParent().className = "fullImage";	
					
					}			

			});	
			
				
		}	
	
	 // largerBox routine
	 
	    $$("a.fullImage").addEvents({
		
	        click: function(e) {
	            if ($("largerBox") || $("modal"))
	                return false;

	            var _this = this;
	            var e = new Event(e).stop();
	            toggleModal("#555");

	            var coords = this.getFirst().getCoordinates();

	            var winSize = window.getSize();
	            var winScroll = window.getScroll();
	            var windowHeight = window.getScrollHeight()-1;

	            new Asset.image(this.get("href"), {
	                onload: function() {
	                    var image = {
	                        y: winScroll.y + (winSize.y / 2) - (this.height / 2),
	                        x: winSize.x / 2 - this.width / 2,
	                        width: this.width,
	                        height: this.height
	                    }

	                    if (image.y + this.height + 20 > windowHeight)
	                        image.y = windowHeight - 20 - this.height;

	                    if (image.y <= 0)
	                        image.y = 20;

	                    this.set({
	                        id: "largerBox",
	                        styles: {
	                            "z-index": 1000000000,
	                            position: "absolute",
	                            top: coords.top,
	                            left: coords.left,
	                            width: coords.width,
	                            height: coords.height,
	                            border: "1px solid #000"
	                        },
	                        events: {
	                            click: function() {
	                                this.fireEvent("mouseleave");

	                                // close animation
	                                var myEffect = new Fx.Morph($("largerBox"), {
	                                    transition: Fx.Transitions.Sine.easeOut,
	                                    duration: 150
	                                }).start({
	                                    width: coords.width,
	                                    height: coords.height,
	                                    left: coords.left,
	                                    top: coords.top,
	                                    "border-width": 0,
	                                    opacity: .4
	                                });

	                                this.fade(0);

	                                var _this = this;
	                                (function() {
	                                    _this.dispose();
	                                    toggleModal();
	                                }).delay(500);
	                            }
	                        }
	                    }).inject(document.body).makeDraggable();

	                    $clear(initCheck);

	                    var myEffect = new Fx.Morph($("largerBox"), {
	                        transition: Fx.Transitions.Sine.easeOut,
	                        duration: 300
	                    }).start({
	                        width: image.width,
	                        height: image.height,
	                        left: image.x,
	                        top: image.y,
	                        "border-width": "3px"
	                    });

	                    var __this = this;
	                    (function() {
	                        __this.addEvents({
	                            mouseenter: function() {
	                                __this.tooltip("click to close");
	                            }
	                        });
	                    }).delay(300);
	                }
	            });

	            var initCheck = (function() {
	                _this.set("href", "#").removeEvents();
	                _this.getFirst().removeEvents();
	                if (!$("largerBox"))
	                    toggleModal();
	            }).delay(3500);
	        },
	        mouseenter: function() {
	            this.getFirst().tooltip("click to enlarge", {
	                opacity: .8
	            });
	        }

	    });
		
		}
)

//generic popup function - one for mootools, one for flash
function popup() {
	var winname="mywindow"+Math.floor(Math.random()*110);
	window.open (this.varbit,winname,"width="+this.widd+",height="+this.hidd+",scrollbars="+this.scroll+",left=10,top=10");	
}

function popupforflash(varbit,widd,hidd,scroll) {
	var winname="mywindow"+Math.floor(Math.random()*110);
	window.open (varbit,winname,"width="+widd+",height="+hidd+",scrollbars="+scroll+",left=10,top=10");	
}

// order samples pop-up. open window, build a form and then submit to it. the email address is passed in via a hidden
// field, and is accessed as post data from within the order samples app
function openOrderSamples() {	
	
	var emailAddress = skUsername;	// get sk logged in username	
	var formAction = "http://samples.bushboard-washrooms.co.uk";	
	
	winSamples = window.open('','winSamples', 'status = 1, height = 560, width = 775, resizable = 1, scrollbars=1');
	var tmp = winSamples.document;
	tmp.write('<html><head><title>Loading</title></head>');
	tmp.write('<body onload=document.getElementById("samples_frm").submit();>');
	tmp.write('<form id="samples_frm" name="samples_frm>" action="' + formAction + '" method="post">');
	tmp.write('<input id="em" name="em" type="hidden" value="' + emailAddress + '"/>');
	tmp.write('</form>');
	tmp.write('</body></html>');
	tmp.close();
}