$.fn.image = function(src, f){ 
		return this.each(function(){ 
			var i = new Image(); 
			i.src = src; 
			i.onload = f; 
			this.appendChild(i);
		}); 
	}
	function setSelected(sSelectBox, sOption) {
		$(function() {
			$("select#"+sSelectBox).children().each(function(i){
				if (this.value == sOption) {
					$(this).attr("selected", "selected");
				}
			});
		});
	}
	function setCheckbox(sCheckBox, sStatus) {
		$(function() {
			if (sStatus == 'checked') {
				$("input#"+sCheckBox).attr("checked", "checked");
				$("input#"+sCheckBox).attr("value", "1");
			} else {
				$("input#"+sCheckBox).attr("checked", "");	
				$("input#"+sCheckBox).attr("value", "0");
			}
		});	
	}
	function setTextlines(iTextlines) {
		$(function() {
			$("div#marker-textlines").empty();
			for (i=1;i<=iTextlines;i++) {
				sValue = getCookie("label-textrule-"+i);
				$("div#marker-textlines").append('<label for="textrule-'+i+'">regel '+i+'</label><input name="textrule-'+i+'" maxlength="20" type="text" id="textrule-'+i+'" value="'+sValue+'" />');
			}
		});	
	}
	function setExample(iExample) {
		$(function() {
			$("div#marker-exampleimage").empty();
			$("div#marker-exampleimage").append('<img src="/secumate-marker/img/marker-examples-'+iExample+'.png" alt="voorbeelden" />');
		});	
	}
	function setCookie(c_name,value,expiredays) {
		var exdate=new Date();
		exdate.setDate(exdate.getDate()+expiredays);
		document.cookie=c_name+ "=" +escape(value)+
		((expiredays==null) ? "" : ";expires="+exdate.toGMTString());
	}
	function getCookie(c_name) {
	if (document.cookie.length>0)
	  {
	  c_start=document.cookie.indexOf(c_name + "=");
	  if (c_start!=-1)
		{ 
		c_start=c_start + c_name.length+1; 
		c_end=document.cookie.indexOf(";",c_start);
		if (c_end==-1) c_end=document.cookie.length;
		return unescape(document.cookie.substring(c_start,c_end));
		} 
	  }
	return "";
	}
	function loadLabel (sLabel) {
		$(function() {
			$("div#marker-preview").empty();
			$("div#marker-preview").image(sLabel,function(){
				$("div#marker-preview-loading").css("display", "none");
				$("div#marker-preview").css("display", "block");
			});
		});
	}
	function resetLabel() {
		//reset cookies loading default label
		setCookie('label-width','',-1);
		setCookie('label-height','',-1);
		setCookie('label-color-red','',-1);
		setCookie('label-color-green','',-1);
		setCookie('label-color-blue','',-1);
		setCookie('label-foreground-red','',-1);
		setCookie('label-foreground-green','',-1);
		setCookie('label-foreground-blue','',-1);
		setCookie('label-logo-text-rate','',-1);
		setCookie('label-logo-position','',-1);
		setCookie('label-font','',-1);
		setCookie('label-textrule-1','',-1);
		setCookie('label-textrule-2','',-1);
		setCookie('label-textrule-3','',-1);
		setCookie('label-logo-image','',-1);
		setCookie('label-serial-number','',-1);
		
		defaultLabel();
	}
	function updateLabel() {
		//get all cookie values
		iWidth = getCookie("label-width");
		iHeight = getCookie("label-height");
		
		iBackgroundRed = getCookie("label-color-red");
		iBackgroundGreen = getCookie("label-color-green");
		iBackgroundBlue = getCookie("label-color-blue");
		iForegroundRed = getCookie("label-foreground-red");
		iForegroundGreen = getCookie("label-foreground-green");
		iForegroundBlue = getCookie("label-foreground-blue");
		
		sLogoTextRate = getCookie("label-logo-text-rate");

		sLogoPosition = getCookie("label-logo-position");
		
		sFont = getCookie("label-font");
		
		sTextline1 = getCookie("label-textrule-1");
		sTextline2 = getCookie("label-textrule-2");
		sTextline3 = getCookie("label-textrule-3");
		iTextlines = getCookie("label-textlines");
		iExample = getCookie("label-example");
		
		sLogoImage = getCookie("label-logo-image");
		
		sSerialNumber = getCookie("label-serial-number");
		
		//set textlines (preferring serial above normal text)
		if (sSerialNumber.length <= 0) {
			setTextlines(iTextlines);
		} else {
			setTextlines(iTextlines-1);
			if (iTextlines-1 == 1) {
				sTextline2 = '';
				sTextline3 = '';
			}
			if (iTextlines-1 == 2) {
				sTextline3 = '';
			}
		}
		//set example image
		setExample(iExample);
		
		//set all selectboxes
		setSelected("properties", iWidth+","+iHeight+","+iTextlines+","+iExample);
		setSelected("color",iBackgroundRed+","+iBackgroundGreen+","+iBackgroundBlue+","+iForegroundRed+","+iForegroundGreen+","+iForegroundBlue);
		setSelected("logo-position", sLogoPosition);
		setSelected("font", sFont);
		
		//set checkbox
		if (sLogoTextRate == '0,100') {
			$("div#marker-logo").css("display", "none");
			$("div#logo-position").css("display", "none");
			setCheckbox("logo", "");
		} else {
			$("div#marker-logo").css("display", "block");
			$("div#logo-position").css("display", "block");	
			setCheckbox("logo", "checked");
		}
		//reload label image
		$("div#marker-preview").empty();
		$("div#marker-preview").css("display", "none");
		$("div#marker-preview-loading").css("display", "block");
		
		loadLabel("/secumate-marker/label.php5?label-width="+iWidth+"&label-height="+iHeight+"&label-color-red="+iBackgroundRed+"&label-color-green="+iBackgroundGreen+"&label-color-blue="+iBackgroundBlue+"&label-logo-text-rate="+sLogoTextRate+"&label-logo-position="+sLogoPosition+"&label-font="+sFont+"&label-textline-1="+sTextline1+"&label-textline-2="+sTextline2+"&label-textline-3="+sTextline3+"&label-logo-image="+sLogoImage+"&label-serial-number="+sSerialNumber+"&label-foreground-red="+iForegroundRed+"&label-foreground-green="+iForegroundGreen+"&label-foreground-blue="+iForegroundBlue);
	}
	
	function saveLabel(sFileName) {
		//get all cookie values
		iWidth = getCookie("label-width");
		iHeight = getCookie("label-height");
		
		iBackgroundRed = getCookie("label-color-red");
		iBackgroundGreen = getCookie("label-color-green");
		iBackgroundBlue = getCookie("label-color-blue");
		iForegroundRed = getCookie("label-foreground-red");
		iForegroundGreen = getCookie("label-foreground-green");
		iForegroundBlue = getCookie("label-foreground-blue");
		
		sLogoTextRate = getCookie("label-logo-text-rate");

		sLogoPosition = getCookie("label-logo-position");
		
		sFont = getCookie("label-font");
		
		sTextline1 = getCookie("label-textrule-1");
		sTextline2 = getCookie("label-textrule-2");
		sTextline3 = getCookie("label-textrule-3");
		iTextlines = getCookie("label-textlines");
		iExample = getCookie("label-example");
		
		sLogoImage = getCookie("label-logo-image");
		
		sSerialNumber = getCookie("label-serial-number");
		
		loadLabel("/secumate-marker/label.php5?label-width="+iWidth+"&label-height="+iHeight+"&label-color-red="+iBackgroundRed+"&label-color-green="+iBackgroundGreen+"&label-color-blue="+iBackgroundBlue+"&label-logo-text-rate="+sLogoTextRate+"&label-logo-position="+sLogoPosition+"&label-font="+sFont+"&label-textline-1="+sTextline1+"&label-textline-2="+sTextline2+"&label-textline-3="+sTextline3+"&label-logo-image="+sLogoImage+"&label-serial-number="+sSerialNumber+"&label-foreground-red="+iForegroundRed+"&label-foreground-green="+iForegroundGreen+"&label-foreground-blue="+iForegroundBlue+"&save-as="+sFileName);
	}
	
	//label setup events
	$(function() {
		//label properties
		$("select#properties", this) .change( function() { 
			sProperties = this.options[this.selectedIndex].value;
			aProperties = sProperties.split(",");
			setCookie("label-width", aProperties[0]);
			setCookie("label-height", aProperties[1]);
			setCookie("label-textlines", aProperties[2]);
			setCookie("label-example", aProperties[3]);
		});
		//color
		$("select#color", this) .change( function() { 
			sColor = this.options[this.selectedIndex].value;
			aRgb = sColor.split(",");
			setCookie("label-color-red", aRgb[0]);
			setCookie("label-color-green", aRgb[1]);
			setCookie("label-color-blue", aRgb[2]);
			
			setCookie("label-foreground-red", aRgb[3]);
			setCookie("label-foreground-green", aRgb[4]);
			setCookie("label-foreground-blue", aRgb[5]);
		});
		//logo
		$("input#logo", this) .click( function() { 
			
			if ($(this).is(":checked")) {
				//enable logo
				setCookie("label-logo-text-rate", "40,60");
				$(this).attr("value", "1");
				$("div#marker-logo").css("display", "block");
				$("div#logo-position").css("display", "block");
			}
			else {     
				//disable logo
				setCookie("label-logo-text-rate", "0,100");
				setCookie("label-logo-image", "");

				$(this).attr("value", "0");
				//hide logo blocks
				$("div#marker-logo").css("display", "none");
				$("div#logo-position").css("display", "none");
			}
		
		});
		//logo position
		$("select#logoposition", this) .change( function() { 
			sPosition = this.options[this.selectedIndex].value;
			setCookie("label-logo-position", sPosition);
		});
		//font
		$("select#font", this) .change( function() { 
			sFont = this.options[this.selectedIndex].value;
			setCookie("label-font", sFont);
		});
		//text
		$("input#textrule-1", this) .livequery('blur', function() { 
			sText = this.value;
			setCookie("label-textrule-1", sText);
		});

		$("input#textrule-2", this) .livequery('blur', function() { 
			sText = this.value;
			setCookie("label-textrule-2", sText);
		});
		$("input#textrule-3", this) .livequery('blur', function() { 
			sText = this.value;
			setCookie("label-textrule-3", sText);
		});
		//serial number
		$("input#serial-number", this) .blur( function() { 
			sText = this.value;
			setCookie("label-serial-number", sText);
		});
		//update action
		$("button#update", this) .click( function() { 
			updateLabel();
		});
		//reset action
		$("button#reset", this) .click( function() { 
			resetLabel();
		});
	});