/**
 * Link the correct classes by hovering navigation items for displaying the dropdown menu
 */
sfHover = function() {
	var nav = document.getElementById("nav");
	if (nav) {
		var sfEls = nav.getElementsByTagName("LI");
		for (var i=0; i<sfEls.length; i++) {
			sfEls[i].onmouseover=function() {
				this.className+=" sfhover";
			}
			sfEls[i].onmouseout=function() {
				this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
			}
		}
	}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);


var DID = DID || {
	
	init: function () {
		this.enableProductFlip();
		this.activateImagePopup();
	},
	
	/**
	 * Enables the jquery plugin 'Flip' for the product brick (when we're not in admin)
	 */
	enableProductFlip: function() {
		if (/\/admin\//.test(document.location))
			return;
		
		$('.product').quickFlip();
			
		$('.product .panelfront').mouseover(function() {
			var product = $(this).closest('.product');
			if ($(product).attr('rel') !== 'over') {
				$(product).quickFlipper();
				this.timeoutID = window.setTimeout( function(){ 
					$(product).quickFlipper({},0,1);
					$(product).attr('rel','out');
				}, 1300);
			}
			$(product).attr('rel','over');
		});
	},
	
	openPopup: function(img2,img3,txt,hyperlink) {
		(img2 == '') ? $('.productpopup .img2').hide() : $('.productpopup .img2').attr('src',decodeURIComponent(img2));
		(img3 == '') ? $('.productpopup .img3').hide() : $('.productpopup .img3').attr('src',decodeURIComponent(img3));
		$('.productpopup .link').attr('href',decodeURIComponent(hyperlink));
		$('.productpopup span').html(txt);
		$('.productpopup').show('normal');
	},
	
	closePopup: function(el) {
		$('.productpopup').hide('normal');
	},
	
	display_na_image: function(el) {
		if (el.src)
			el.src = '/images/dot_clear.gif';
	},
	
	activateImagePopup: function() {
		$('.colRight a[rel=lightbox]').lightBox(); // Select all links that contains lightbox in the attribute rel
	}
	
};

/**
* Webshop frontend class
* Some functions for user interaction in the template (like a tabbed menu, an image thumbnail gallery or form validation)
*
* author:		Niels Boogaard
* methods:  	toggleTabs(), toggleImageGallery(), validateOrderForm(), validateFormFields(), alertErrorMessage()
* properties:	none
*/

var WEBSHOP = WEBSHOP || {
	
	/**
	* validates the Order form using the default PPFormValidator and some custom checks (voor betaalwijze)
	* @param form: DOM element, the FORM object
	*/
	validateOrderForm:function (form) {
		if (!form)
			return false;
		
		var valid = true;
		
		//check default PPFormValidator fields
		if (!PPFormValidator(form))
			valid = false;
		
		//check wachtwoord velden
		var account = form['user[bewaarGegevens]'];
		if (account.checked == true) {
			var div = document.getElementById('wachtwoorden');
			if (div) {
				var elements = dom.downAll(div,'tagName=INPUT');
				if (!this.validateFormFields(elements))
					valid = false;
				if (elements[0].value !== elements[1].value) {
					if (!this.alertErrorMessage(elements[0]))
						valid = false;
				}
			}
		}
		
		//betaalwijze
		var betaalwijze = this.getCheckedValue(form['user[betaalwijze]']);
		if (betaalwijze == 5) {
			var div = document.getElementById('rekeninggegevens');
			if (div) {
				var elements = dom.downAll(div,'tagName=INPUT');
				if (!this.validateFormFields(elements))
					valid = false;
			}
		}
		
		if (valid)
			form.submit();
	},
	
	/**
	* execute the validation function of each element in the given array
	* @param form: array of INPUT elements
	*/
	validateFormFields:function (elements) {
		if (!elements)
			return false;
		
		for (var i=0; i<elements.length; i++) {
			var el 				= elements[i];
			var validationrule 	= el.getAttribute('validationrule');
			
			if (validationrule && validationrule !== '') {
				if (!eval(validationrule)) { //execute validation function
					return this.alertErrorMessage(el);
				}
			}
		}
		return true;
	},
	
	/**
	* display the errormessage and set the focus on the element
	* @param form: DOM (INPUT) element
	*/
	alertErrorMessage:function (el) {
		if (!el)
			return false;
	
		var errormsg = el.getAttribute('errormsg');
		if (errormsg) {
			alert(errormsg);
			try {
				el.focus();
			} catch(err){} //element not visible and can't have focus
		}
		return false;
	},
	
	/**
	* return the checked RADIO value
	* @param form: group of RADIO elements
	*/
	getCheckedValue:function (radioObj) {
		if (!radioObj)
			return false;
		
		var radioLength = radioObj.length;
		if (radioLength == undefined)
			if (radioObj.checked)
				return radioObj.value;
			else
				return false;
		for (var i = 0; i < radioLength; i++) {
			if (radioObj[i].checked) {
				return radioObj[i].value;
			}
		}
		return false;
	},
	
	displayErrorImage:function (el, width) {
		if (el) {
			if (width == 76)
				el.src = '/images/not_available_76x57.gif';
			else if (width == 149 || width == 150)
				el.src = '/images/not_available_150x114.gif';
			else if (width == 250)
				el.src = '/images/not_available_250x190.gif';
		}
	},
	
	submitShoppingBasket:function (action) {
		var form = document.forms.BASKETUPDATE;
		if (form && action) {
			var validate = PPFormValidator(form);
			if (validate) {
				if (action == 'update')
					form.submit();
				else if (action == 'order') {
					form.action = '/order/';
					form.submit();
				}
			}
		}
	},
	
	toggleDiv:function (divId) {
		if (!divId) 
			return false;
		
		var div = document.getElementById(divId);
		var action = arguments[1];
		
		if (div) {
			if (action == 'hide' || (action !== 'show' && div.style.display == 'block') )
				div.style.display = 'none';
			else
				div.style.display = 'block';
		}
	},
	
	SetImg2Background:function (img) {
		if (/\/admin\//.test(document.location)) 
			return false;
		if (!img || !dom)
			return false;
		
		var div = dom.up(dom.up(img));
		if (div) {
			//set as background
			div.style.backgroundImage = 'url('+img.src+')';
			div.style.backgroundRepeat = 'no-repeat';
			img.style.display = 'none';
		}
	}
	
};
