function getConfiguratorImage(fontsize, font, fontcolor, fontposition, img, text, scale, texture, textlen, align, angle) {
	var url = 'http://djoudjou-design.test-rackspeed.de/imggen/generator.php';
	if(align == '') {
		if(img == '/f/o/fotoalbum.png') align = 'left'; else align = 'center';
	}
	if((img == '/f/o/fotoalbum.png') && (typeof align == 'undefined')) align = 'left';
	var pars   = 'fontsize='+fontsize+'&font='+font+'&fontcolor='+fontcolor+'&fontposition='+fontposition+'&img='+img+'&text='+urlEncode(text)+'&scale='+scale+'&texture='+texture+'&textlength='+textlen+'&align='+align+'&angle='+angle+'';	
	console.log(pars);	
	//hide main image
	$$("#imageShowcase img").each(function(elmt) {
		elmt.hide();
	});
	$('hidewhenconfig').hide();	
	$('configurator').show().update('<img src="'+url+'?'+pars+'"/>');
	$('serviervorschlag').show();
}
function setDefaultValues() {
	$$('.optionsbox input:checked[type="radio"]').each(function(elmt) {
				var value = elmt.getAttribute('rel').split(":");
				if (value[0] == 'texture') texture = value[1];
				else if (value[0] == 'fontcolor') fontcolor = value[1];
				else if (value[0] == 'font') font = value[1];				
	});
	text = 'Name';
	$$('.optionsbox input.product-custom-option').each(function(elmt) {
		if(elmt.value != '') text = elmt.value;
	});
}

function urlEncode(str)
{
    return escape(str).replace(/\+/g,'%2B').replace(/%20/g,'+').replace(/@/g,'%40').replace(/\*/g,'%2A').replace(/\//g,'%2F');
}

document.observe("dom:loaded", function() {
		setDefaultValues();
		$$('.optionsbox input.radio').each(function(elmt) {
			elmt.observe('click', function(ev) {
				var value = elmt.getAttribute('rel').split(":");
				if (value[0] == 'texture') texture = value[1];
				else if (value[0] == 'fontcolor') fontcolor = value[1];
				else if (value[0] == 'font') font = value[1];
				getConfiguratorImage(fontsize, font, fontcolor, fontposition, img, text, scale, texture, textlen, align, angle);
			});
		});
		$$('.optionsbox input.input-text').each(function(elmt) {
			elmt.observe('keyup', function(ev) {
				text = elmt.value;
				getConfiguratorImage(fontsize, font, fontcolor, fontposition, img, text, scale, texture, textlen, align, angle);
			});
		});
		$$('#mediacontainer img').each(function(elmt) {
			elmt.observe('click', function(ev) {
				$$('#mediacontainer img.active').each(function(el) {el.removeClassName('active')});
				elmt.addClassName('active');
			});
		});
});