function categoryDropdown(enabled)
{
	var catselect = document.getElementById('searchcategoryselect').style;
	
	if(enabled)
	{
		catselect.display = 'block';
		
		document.body.onmouseup = function()
		{
			categoryDropdown(false);
		}
	}
	else
	{
		catselect.display = 'none';
		
		document.body.onmouseup = null;
	}
}

function categorySelect(option)
{
	if(option == 'alle'){
		document.getElementById('searchcategorydropdown').innerHTML = '-- Alle Categorieën --';
	}
	else if(option == 'kies'){
		document.getElementById('searchcategorydropdown').innerHTML = '-- Kies een categorie --';
	}
	else {
		document.getElementById('searchcategorydropdown').innerHTML = option;
		getSubCategories(option);
		document.getElementById('searchsubcategorydropdown').innerHTML = "Kies een category";
	}
	document.getElementById('searchcategory').value             = option;
	
	categoryDropdown(false);
}

var color = null;
		
function getColor(position)
{
	var posx = 10;
	var posy = 10;

	if(position.offsetParent)
	{
		posx = position.offsetLeft;
		posy = position.offsetTop;

		while(position = position.offsetParent)
		{
			posx += position.offsetLeft;
			posy += position.offsetTop;
		}
	}

	var overlay = document.getElementById('color_overlay').style;

	overlay.left = (posx - 226) + 'px';
	overlay.top  = (posy + 21) + 'px';
				
	if(overlay.display == "block")
	{
		overlay.display = "none";
		
		document.body.onmouseup = null;
	}
	else 
	{
		overlay.display = "block";
		
		document.body.onmouseup = function()
		{
			colorBox();
		}
	}
}

function colorBox()
{
	var overlay = document.getElementById('color_overlay').style;

	overlay.display = "none";
		
	document.body.onmouseup = null;
}

function setColor(colorcode)
{
	
	if(colorcode == "empty")
	{
		color = null;
		
		var overlay = document.getElementById('color_overlay').style;
		
		overlay.display = "none";
		
		document.getElementById("cpicker").innerHTML = "<img src=\"/images/color_picker_none.gif\" alt=\"geen kleur geselecteerd\" />";
	
		document.getElementById("searchcolor").value = "";
	}
	else 
	{
		document.getElementById("cpicker").style.backgroundColor = "RGB(" + colorcode + ")";
		
		var overlay = document.getElementById('color_overlay').style;
		
		overlay.display = "none";
		
		color = colorcode;
		
		document.getElementById("searchcolor").value = colorcode;
	}
}

function overColor(colorcode)
{
	if(colorcode == "empty")
	{
		document.getElementById("cpicker").innerHTML = "<img src=\"/images/color_picker_none.gif\" alt=\"geen kleur geselecteerd\" />";
		document.getElementById("cpicker").style.backgroundColor = "RGB(255,255,255)";
	}
	else 
	{
		document.getElementById("cpicker").innerHTML = "<img src=\"/images/color_picker.gif\" alt=\"" + colorcode + "\" />";
		document.getElementById("cpicker").style.backgroundColor = "RGB(" + colorcode + ")";
	}
}

function outColor()
{
	if(color == null)
	{
		document.getElementById("cpicker").innerHTML = "<img src=\"/images/color_picker_none.gif\" alt=\"geen kleur geselecteerd\" />";
	}
	else {
		document.getElementById("cpicker").innerHTML = "<img src=\"/images/color_picker.gif\" alt=\"" + color + "\" />";
	}
	
	document.getElementById("cpicker").style.backgroundColor = "RGB(" + color + ")";
}

function fixImage(image, size)
{
	if((!image.complete) || (typeof(image.naturalWidth) != 'undefined' && image.naturalWidth == 0) || (image.src.indexOf('no_image') != -1))
	{
		if(size >= 200)
		{
			image.src = '/images_v3/no_image.jpg';
		}
		else
		{
			image.src = '/images_v3/no_image_small.jpg';
		}
	}
	else
	{
		image.style.height = '';
		image.style.width  = '';
		
		var imageh = image.clientHeight;
		var imagew = image.clientWidth;
		
		if((imageh > size) || (imagew > size))
		{
			var scaleh = size / imageh;
			var scalew = size / imagew;
			
			if(scaleh < scalew)
			{
				image.style.height = size                        + 'px';
				image.style.width  = Math.round(imagew * scaleh) + 'px';
			}
			else
			{
				image.style.height = Math.round(imageh * scalew) + 'px';
				image.style.width  = size                        + 'px';
			}
		}
		
		image.style.marginTop = Math.round(((size - image.clientHeight) / 2)) + 'px';
	}
}

function fixImages(size)
{
	for(var i = 0; i < document.images.length; i++)
	{
		if(document.images[i].className == 'fiximage')
		{
			fixImage(document.images[i], size);
		}
	}
}

function getElementPosition(element)
{
	var posx = 10;
	var posy = 10;
	
	if(element.offsetParent)
	{
		posx = element.offsetLeft;
		posy = element.offsetTop;
		
		while(element = element.offsetParent)
		{
			posx += element.offsetLeft;
			posy += element.offsetTop;
		}
	}
	
	return [posx, posy];
}

function hideOverlay()
{
	document.getElementById('overlay').style.display = 'none';
}

function setCategoryView(view)
{
	document.getElementById('productsview').className = view;
	
	var expires = new Date();
	expires.setMonth(expires.getMonth() + 1);
	
	document.cookie = 'categoryview=' + view + ';expires=' + expires.toGMTString() + ';path=/';
	
	if(view == 'productslist')
	{
		fixImages(80);
	}
	else
	{
		fixImages(200);
	}
}

function setRating(rating)
{
	var previous = document.getElementById('ReviewScore').value;
	
	if(previous == 0) previous = 1;
	
	var it = 0;
	
	if(rating >= previous)
	{
		for(var i = previous; i <= rating; i++)
		{
			setTimeout("document.getElementById('rating" + i + "').style.backgroundPosition = 'bottom';", (it += 20));
		}
	}
	else
	{
		for(var i = previous; i > rating; i--)
		{
			setTimeout("document.getElementById('rating" + i + "').style.backgroundPosition = 'top';", (it += 20));
		}
	}
	
	document.getElementById('ReviewScore').value = rating;
}

function setTab(tab)
{
	for(var i = 1; i <= 5; i++)
	{
		document.getElementById('tab' + i).className = '';
		document.getElementById('tab' + i + 'content').style.display = 'none';
	}
	
	document.getElementById(tab).className = 'active';
	document.getElementById(tab + 'content').style.display = 'block';
	
	if(tab == "tab4"){
		resetReviewForm();
	}
}

function resetReviewForm()
{
	document.getElementById('ReviewName').value = "";
	document.getElementById('ReviewEmail').value = ""
	document.getElementById('ReviewText').value = "";
	setRating(0);
	document.getElementById('ReviewScore').value = 0;
	document.getElementById('ErrorMessage').innerHTML = "";
}

function showOverlay(position, title)
{
	document.getElementById('overlaytitle').innerHTML = title;
	
	var posx = 10;
	var posy = 10;
	
	if(position.offsetParent)
	{
		posx = position.offsetLeft;
		posy = position.offsetTop;
		
		while(position = position.offsetParent)
		{
			posx += position.offsetLeft;
			posy += position.offsetTop;
		}
	}
	
	var overlay = document.getElementById('overlay').style;
	
	overlay.left = (posx - 50) + 'px';
	overlay.top  = (posy - 50) + 'px';
	
	overlay.display = 'block';
}

function zoomImage(image)
{
	var zoomimage = document.getElementById('zoomimage');
	
	var position               = getElementPosition(image);
	zoomimage.style.left       = (position[0] - 10) + 'px';
	zoomimage.style.top        = (position[1] - 10) + 'px';
	
	zoomimage.style.visibility = 'hidden';
	zoomimage.style.display    = 'block';
	
	zoomimage.src              = image.src;
	
	var originalh              = zoomimage.clientHeight - 20;
	var originalw              = zoomimage.clientWidth  - 20;
	
	zoomimage.style.height     = image.style.height;
	zoomimage.style.width      = image.style.width;
	
	var currenth               = parseInt(zoomimage.style.height);
	var currentw               = parseInt(zoomimage.style.width);
	
	zoomimage.style.visibility = 'visible';
	
	if((originalh > currenth) || (originalw > currentw))
	{
		var step  = 20;
		var steph = Math.round((originalh - currenth) / step);
		var stepw = Math.round((originalw - currentw) / step);
		
		for(var i = 0; i < step; i++)
		{
			currenth += steph;
			setTimeout("document.getElementById('zoomimage').style.height = " + currenth + " + 'px';", (i * 10));
			currentw += stepw;
			setTimeout("document.getElementById('zoomimage').style.width  = " + currentw + " + 'px';", (i * 10));
		}
		
		setTimeout("document.getElementById('zoomimage').style.height = " + originalh + " + 'px';", ((i * 10) + 10));
		setTimeout("document.getElementById('zoomimage').style.width  = " + originalw + " + 'px';", ((i * 10) + 10));
	}
	else
	{
		zoomimage.style.display = 'none';
	}
}

function viewAddTag(productid, categoryid, productname, position)
{
	document.getElementById('overlayproducttitle').innerHTML = productname;
	document.getElementById('ProductID').value = productid;
	document.getElementById('CategoryID').value = categoryid;
	
	showOverlay(position, 'tag toevoegen');
	document.getElementById("tag_form").Tag.focus();
	
	document.getElementById('tagadded').style.display = 'none';
	document.getElementById('addtagform').style.display = 'block';
	document.getElementById('Tag').value = '';
}

function viewReportError(position)
{
	document.getElementById('ErrorDescription').value = "";
	document.getElementById('ErrorCategory').options[0].selected = true;
	
	showOverlay(position, 'meld een fout');
	
	document.getElementById('erroradded').style.display = 'none';
	document.getElementById('reporterrorform').style.display = 'block';
}

function sendErrorNew(url)
{
	var category 	= document.getElementById('ErrorCategory').value;
	var description = document.getElementById('ErrorDescription').value;
	var old			= document.getElementById("reporterrorform");
	var div			= document.getElementById("erroradded");
	
	if(category == ""){
		div.innerHTML = 'Kies een soort fout!<br /><br />';
		div.style.display = 'block';
		return;
	}
	
	else if(description == ""){
		div.innerHTML = 'Vul een omschrijving in!<br /><br />';
		div.style.display = 'block';
		return;
	}
	else {
		var sUrl = "/add_error.php?url=" + url + "&category=" + category + "&description=" + description;
				
		var handleSuccess = function(o){
			if(o.responseText !== undefined){
				old.style.display = 'none';
				div.innerHTML     = o.responseText;
				div.style.display = 'block';
			}
		}

		var handleFailure = function(o){
			old.style.display = 'none';
			div.innerHTML 	  = "Momenteel niet werkend";
			div.style.display = 'block';
		}

		var callback =
		{
			success:handleSuccess,
			failure:handleFailure,
			argument: {  }
		};

		var request = YAHOO.util.Connect.asyncRequest('GET', sUrl, callback);	
	}
}

function sendForm()
{
	var error 	= document.getElementById('ErrorMessage');
	
	var name 	= document.getElementById('ReviewName').value;
	var email	= document.getElementById('ReviewEmail').value;
	var review	= document.getElementById('ReviewText').value;
	var score	= document.getElementById('ReviewScore').value;
	var catid	= document.getElementById('CategoryID').value;
	var prodid	= document.getElementById('ProductID').value;

	if(name == ""){
		error.innerHTML = "Vul uw naam in!";
		return;
	}
	else if(name.length > 64){
		error.innerHTML = "Naam bestaat uit teveel tekens! (max. 64)";
		return;
	}
	else if(email == ""){
		error.innerHTML = "Vul uw emailadres in!";
		return;
	}
	else if(email.indexOf('@') == -1){
		error.innerHTML = "Ongeldig e-mail! (bijv: jan@goomla.nl)";
		return;
	}
	else if(email.length > 64){
		error.innerHTML = "E-mail bestaat uit teveel tekens! (max. 64)";
		return;
	}
	else if(review == ""){
		error.innerHTML = "Vul een motivatie in!";
		return;
	}
	else if(score == "0"){
		error.innerHTML = "Geef een score aan het product!";
		return;
	}
	else if(catid == "00000"){
		error.innerHTML = "Momenteel niet beschikbaar!";
		return;
	}
	else if(prodid == "00000000"){
		error = "Momenteel niet beschikbaar!";
		return;
	}
	else {
		saveReview(name, email, review, score, catid, prodid);
	}
}

function saveReview(name, email, review, score, catid, prodid)
{
	var div = document.getElementById('reviewthanks');
	
	name = escape(name);
	email = escape(email);
	review = escape(review);
	
	var sUrl = "/review/insert_review.php?name=" + name + "&email=" + email + "&review=" + review + "&score=" + score + "&catid=" + catid + "&prodid=" + prodid;
					
	var handleSuccess = function(o){
		if(o.responseText !== undefined){
			div.style.display = "block";
			resetReviewForm();
		}
	}

	var handleFailure = function(o){
		alert("Review not saved");
	}

	var callback =
	{
		success:handleSuccess,
		failure:handleFailure,
		argument: {  }
	};
	
	var request = YAHOO.util.Connect.asyncRequest('GET', sUrl, callback);	
}

function letternumber(e)
{
	var key;
	var keychar;
	
	if (window.event){
		key = window.event.keyCode;
	}
	else if (e){
		key = e.which;
	}
	else {
		return true;
	}
	
	keychar = String.fromCharCode(key);
	keychar = keychar.toLowerCase();

	// control keys
	if ((key==null) || (key==0) || (key==8) || (key==9) || (key==13) || (key==27) ) {
		return true;
	}
	// alphas and numbers
	else if ((("abcdefghijklmnopqrstuvwxyz0123456789").indexOf(keychar) > -1)){
		document.getElementById("tagadded").style.display = "none";
	    return true;
	}
	else {
		if (key == 32){
			if((document.getElementById("tag").value).indexOf(" ") > -1){
				//shows error
				document.getElementById("tagadded").innerHTML = "Ongeldige invoer (max. twee woorden)";
				document.getElementById("tagadded").style.display = "block";
				return false;
			}
			else {
				document.getElementById("tagadded").style.display = "none";
				return true;
			}
		}
		else{
			//shows error
			document.getElementById("tagadded").innerHTML = "Ongeldige invoer (correct: A-Z, a-z en 0-9)";
			document.getElementById("tagadded").style.display = "block";
			return false;
		}
	}
}

function checkTag()
{
	var tag = document.getElementById("Tag");
	
	if(tag.value == ""){
		document.getElementById("tagadded").innerHTML = "Er is geen tag ingevoerd";
		document.getElementById("tagadded").style.display = "block";
		return false;
	}
	else {
		return true;
	}
}


function addTag()
{
	var old = document.getElementById("addtagform");
	var div = document.getElementById("tagadded");
	var tag = document.getElementById("Tag").value;
	var pid = document.getElementById("ProductID").value;
	var cid = document.getElementById("CategoryID").value;
	
	var sUrl = "/tag/index.php?tag=" + tag + "&pid=" + pid + "&cid=" + cid;
						
	var handleSuccess = function(o){
		if(o.responseText !== undefined){
			old.style.display = "none";
			div.innerHTML = o.responseText;
			div.style.display = "block";
		}
	}

	var handleFailure = function(o){
		old.style.display = "none";
		div.innerHTML = "Momenteel niet werkend.";
		div.style.display = "block";
	}
				
	var callback =
	{
		success:handleSuccess,
		failure:handleFailure,
		argument: {  }
	};
		
	var request = YAHOO.util.Connect.asyncRequest('GET', sUrl, callback);
}