function create_element(type) {
	var e = document.createElement(type);
	var i;
	for(i = 1; i < create_element.arguments.length; i+=2) {
		if(create_element.arguments[i] == 'text') {
			e.appendChild(document.createTextNode(create_element.arguments[i+1]));
		}
		else if(create_element.arguments[i] == 'class') {
			e.className = create_element.arguments[i+1];
		}
		else {
			e.setAttribute(create_element.arguments[i], create_element.arguments[i+1]);
		}
	}
	return e;
}

function hide(id) {
	var i;
	if(i = document.getElementById(id)) {
		i.style.display = 'none';
	}
}

function show(id) {
	var i;
	if(i = document.getElementById(id)) {
		i.style.display = 'block';
	}
}

function mouse_position(ev) {
	if(ev) {
		return {x:ev.pageX, y:ev.pageY};
	}
	return {
		x:window.event.clientX + document.body.scrollLeft - document.body.clientLeft,
		y:window.event.clientY + document.body.scrollTop  - document.body.clientTop
    };
}

function empty(element) {
	if(element) {
		while(element.hasChildNodes()) {
			element.removeChild(element.firstChild);
		}
	}
}

function mouse_move(ev) {
	if(drag['object'] === null) {
		return true;
	}
	var pos = mouse_position(ev);
	drag['object'].style.top  = (pos.y + 5) + 'px';
	drag['object'].style.left = (pos.x + 5) + 'px';
	drag['object'].style.display = 'block';
	return true;
}

function mouse_up() {
	if(drag['object'] === null) {
		return;
	}
	var cont = document.getElementById('dragcontainer');
	cont.removeChild(drag['object']);
	if(drag['chair'] !== null) {
		var chair = drag['chair'];
		switch(drag['type']) {
			case 3:
				add_accessory(chair, drag['material']);
				break;
			case 1:
				chairs[chair]['verkleidung'] = drag['material'];
				var i = document.getElementById('chair'+chair);
				if(i) {
					i.src = get_image_address(chairs[chair]['verkleidung'], chairs[chair]['polster']);
				}
				break;
			case 2:
				chairs[chair]['polster'] = drag['material'];
				var i = document.getElementById('chair'+chair);
				if(i) {
					i.src = get_image_address(chairs[chair]['verkleidung'], chairs[chair]['polster']);
				}
		}
	}
	drag['object'] = null;
	drag['material'] = null;
	drag['type'] = null;
}

function replace_image(element) {
	if(element.src) {
		var p = element.parentNode;
		var i = create_element('img', 'src', element.src, 'class', 'material', 'title', element.title);
		i.onmousedown = element.onmousedown;
		i.onclick = element.onclick;
		p.replaceChild(i, element);
	}
}

function start_drag_material(material, type) {
	return function() {
		if(drag['object']) {
			return true;
		}
		show_material(material, type).call();
		var d = create_element('img', 'src', 'bilder/material/klein/' + material['imageName'] + '.jpg', 'class', 'material_drag');
		var cont = document.getElementById('dragcontainer');

		drag['object'] = d;
		drag['material'] = material['materialID'];
		drag['chair'] = null;
		drag['type'] = type;
		cont.appendChild(d);
		if(ie) {
			replace_image(event.srcElement);
		}
		return false;	// or else ff starts dragging the image
	};
}

function start_drag_accessory(acc) {
	return function() {
		if(drag['object']) {
			return true;
		}
		show_accessory(acc).call();
		var d = create_element('img', 'src', 'bilder/zubehor/' + acc['imageSmall'], 'class', 'material_drag');
		var cont = document.getElementById('dragcontainer');

		drag['object'] = d;
		drag['material'] = acc['equivalentID'];
		drag['chair'] = null;
		drag['type'] = 3;
		cont.appendChild(d);
		if(ie && event.srcElement.className == 'material') {
			replace_image(event.srcElement);
		}
		return false;	// or else ff starts dragging the image
	};
}

function chair_mouseover(chair) {
	return function() {
		drag['chair'] = chair;
		if(drag['object'] === null || drag['type'] == 3) {
			return;
		}
		var i = document.getElementById('chair'+chair);
		if(i) {
			if(parseInt(drag['material']) >= 50) {
				i.src = get_image_address(drag['material'], chairs[chair]['polster']);
			}
			else {
				i.src = get_image_address(chairs[chair]['verkleidung'], drag['material']);
			}
		}
	};
}

function chair_mouseout(chair) {
	return function() {
		drag['chair'] = null;
		if(drag['object'] === null || drag['type'] == 3) {
			return;
		}
		var i = document.getElementById('chair'+chair);
		if(i) {
			i.src = get_image_address(chairs[chair]['verkleidung'], chairs[chair]['polster']);
		}
	};

}

function get_image_address(v, p) {
	if(v == 0 && p == 0) {
		return image_chair;
	}
	if(v == 0) {
		v = 52;
	}
	if(p == 0) {
		p = 1;
	}
	return 'bilder/sessel/' + verkleidung['materials'][v]['imageName']
							 + polster['materials'][p]['imageName'] + '.jpg';
}

function show_material(mat, type) {
	return function() {
		var lt = document.getElementById('lefttop');
		empty(lt);
		var l = create_element('dl', 'id', 'materialDescription');
		if(type == 1) {
			l.appendChild(create_element('dt', 'text', 'Verkleidungstyp:'));
		}
		else {
			l.appendChild(create_element('dt', 'text', 'Polster:'));
		}
		l.appendChild(create_element('dd', 'text', mat['name']));
		l.appendChild(create_element('dt', 'text', 'Farbe:'));
		l.appendChild(create_element('dd', 'text', mat['color']));
		l.appendChild(create_element('dt', 'text', 'Eigenschaften:'));
		l.appendChild(create_element('dd', 'text', mat['properties']));
		l.appendChild(create_element('dt', 'text', 'Verwendung:'));
		l.appendChild(create_element('dd', 'text', mat['use']));
		if(mat['production']) {
			l.appendChild(create_element('dt', 'text', 'Herstellung:'));
			l.appendChild(create_element('dd', 'text', mat['production']));
		}
		l.appendChild(create_element('dt', 'text', 'Preisklasse:'));
		l.appendChild(create_element('dd', 'text', mat['price_name']));
		if(mat['option']) {
			l.appendChild(create_element('dt', 'text', 'Option:'));
			l.appendChild(create_element('dd', 'text', mat['option']));
		}

		lt.appendChild(l);
	};
}

function show_accessory(acc) {
	return function() {
		var lt = document.getElementById('lefttop');
		var l = create_element('div', 'id', 'accessoryDescription');
		var p = create_element('p');
		p.innerHTML = acc['description'];
		l.appendChild(p);

		var i = create_element('img', 'src', 'bilder/zubehor/' + acc['imageBig'], 'id', 'accessoryBig');
		i.onmousedown = start_drag_accessory(acc);

		empty(lt);
		lt.appendChild(i);
		lt.appendChild(l);
	};
}

function show_verkleidung() {
	var l = create_element('div');
	var lt = create_element('div', 'id', 'lefttop');
	var lp = create_element('p');
	lp.innerHTML = text_verkleidung;

	lt.appendChild(lp);
	l.appendChild(lt);

	for(var i in verkleidung['categories']) {
		var c = create_element('p', 'class', 'category', 'text', verkleidung['categories'][i]['description']);
		l.appendChild(c);
		var materials = verkleidung['categories'][i]['materials'];
		var count = 0;
		for(j in materials) {
			var mat = verkleidung['materials'][materials[j]];
			var m = create_element('img', 'src', 'bilder/material/klein/' + mat['imageName'] + '.jpg', 'class', 'material', 'title', mat['name']);
			m.onclick = show_material(mat, 1);
			m.onmousedown = start_drag_material(mat, 1);
			l.appendChild(m);
			count++;
		}
		if(count % 2 == 1) {
			// add dummy element for IE
			var m = create_element('div', 'class', 'material');
			l.appendChild(m);
		}
	}

	var old = document.getElementById('left');
	seite.replaceChild(l, old);
	l.id = 'left';
	l.style.display = 'block';
}

function show_polster() {
	var l = create_element('div');
	var lt = create_element('div', 'id', 'lefttop');
	var lp = create_element('p');
	lp.innerHTML = text_polster;

	lt.appendChild(lp);
	l.appendChild(lt);

	for(var i in polster['categories']) {
		var c = create_element('p', 'class', 'category', 'text', polster['categories'][i]['description']);
		l.appendChild(c);
		var materials = polster['categories'][i]['materials'];
		var count = 0;
		for(j in materials) {
			var mat = polster['materials'][materials[j]];
			var m = create_element('img', 'src', 'bilder/material/klein/' + mat['imageName'] + '.jpg', 'class', 'material', 'title', mat['name']);
			m.onclick = show_material(mat, 2);
			m.onmousedown = start_drag_material(mat, 2);
			l.appendChild(m);
			count++;
		}
		if(count % 2 == 1) {
			// add dummy element for IE
			var m = create_element('div', 'class', 'material');
			l.appendChild(m);
		}
		if(polster['categories'][i]['name'] == 'leder') {
			var p = create_element('p', 'class', 'category', 'text', 'in Bearbeitung');
			l.appendChild(p);
		}
	}

	var old = document.getElementById('left');
	seite.replaceChild(l, old);
	l.id = 'left';
	l.style.display = 'block';
}

function show_zubehor() {
	var l = create_element('div');
	var lt = create_element('div', 'id', 'lefttop');
	var lp = create_element('p');
	lp.innerHTML = text_zubehor;

	lt.appendChild(lp);
	l.appendChild(lt);

	for(var i in zubehor['categories']) {
		var c = create_element('p', 'class', 'category', 'text', zubehor['categories'][i]['description']);
		l.appendChild(c);
		var accessories = zubehor['categories'][i]['accessories'];
		var count = 0;
		for(j in accessories) {
			var acc = zubehor['accessories'][accessories[j]];
			var a = create_element('img', 'src', 'bilder/zubehor/' + acc['imageSmall'], 'class', 'material', 'title', acc['name']);
			a.onclick = show_accessory(acc);
			a.onmousedown = start_drag_accessory(acc);
			l.appendChild(a);
			count++;
		}
		if(count % 2 == 1) {
			// add dummy element for IE
			var m = create_element('div', 'class', 'material');
			l.appendChild(m);
		}
	}

	var old = document.getElementById('left');
	seite.replaceChild(l, old);
	l.id = 'left';
	l.style.display = 'block';
}

function get_sessel_price(chair, count) {
	var p = parseFloat(sessel['basis']) + parseFloat(verkleidung['materials'][chair['verkleidung']]['price']) + parseFloat(polster['materials'][chair['polster']]['price']);
	p = p * count;
	return { 'franken' : p.toFixed(2), 'euro' : (p / euro_factor).toFixed(2) };
}

function get_eck_price(chair, count) {
	var p = parseFloat(eck['basis']) + parseFloat(eck['verkleidung'][verkleidung['materials'][chair['verkleidung']]['fPriceCategoryID']]) + parseFloat(eck['polster'][polster['materials'][chair['polster']]['fPriceCategoryID']]);
	p = p * count;
	return { 'franken' : p.toFixed(2), 'euro' : (p / euro_factor).toFixed(2) };
}

function get_hocker_price(chair, count) {
	var p = parseFloat(hocker['basis']) + parseFloat(hocker['verkleidung'][verkleidung['materials'][chair['verkleidung']]['fPriceCategoryID']]) + parseFloat(hocker['polster'][polster['materials'][chair['polster']]['fPriceCategoryID']]);
	p = p * count;
	return { 'franken' : p.toFixed(2), 'euro' : (p / euro_factor).toFixed(2) };
}

function get_versand(chairs_ordered) {
	var o;
	var ret = { 'franken' : 0, 'euro' : 0, 'text' : 'Abgeholt ab Werk Wynigen' };

	o = document.getElementById('lieferart2');
	if(o.checked) {
		ret['text'] = 'Zugestellt mit Kurierdienst';
		if(chairs_ordered < 4) {
			ret['franken'] = 150;
		}
		else if(chairs_ordered < 9) {
			ret['franken'] = 250;
		}
		else {
			ret['franken'] = 0;
		}
	}
	else {
		o = document.getElementById('lieferart3');
		if(o.checked) {
			ret['text'] = 'von Wohnort überbracht';
			if(chairs_ordered < 9) {
				ret['franken'] = 250;
			}
			else {
				ret['franken'] = 0;
			}
		}
	}
	ret['euro'] = (ret['franken'] /  euro_factor).toFixed(2);
	ret['franken'] = ret['franken'].toFixed(2);
	return ret;
}

function show_overview() {
	var r = document.getElementById('orderright');
	empty(r);

	for(var i = 0; i < number_chairs; i++) {
		var valid = true;
		var d = create_element('div', 'class', 'chair_detail');
		var img = create_element('img', 'src', get_image_address(chairs[i]['verkleidung'], chairs[i]['polster']), 'id', 'chair' + i);
		d.appendChild(img);
		var t = create_element('h2', 'text', 'Variante ' + (i+1));
		d.appendChild(t);
		if(chairs[i]['verkleidung'] == 0) {
			t = create_element('p', 'text', 'Keine Verkleidung gewählt.');
			valid = false;
		}
		else {
			var v = verkleidung['materials'][parseInt(chairs[i]['verkleidung'])];
			t = create_element('p', 'text', 'Verkleidungstyp: ' + v['name'] + ', Farbe: ' + v['color'] + ', Preisklasse: ' + v['price_name']);
		}
		d.appendChild(t);
		if(chairs[i]['polster'] == 0) {
			t = create_element('p', 'text', 'Kein Polster gewählt.');
			valid = false;
		}
		else {
			var p = polster['materials'][parseInt(chairs[i]['polster'])];
			t = create_element('p', 'text', 'Bezug: ' + p['name'] + ', Farbe: ' + p['color'] + ', Preisklasse: ' + p['price_name']);
		}
		d.appendChild(t);

		if(valid) {
			var c = create_element('div');
			t = create_element('input', 'type', 'text', 'id', 'sessel' + i, 'value', chairs[i]['count']['sessel']);
			c.appendChild(t);
			t = create_element('label', 'for', 'sessel' + i, 'text', 'Sessel');
			c.appendChild(t);
			var p = get_sessel_price(chairs[i], 1);
			t = create_element('p', 'text', 'Fr. ' + p['franken']);
			c.appendChild(t);
			t = create_element('p', 'text', '€ ' + p['euro']);
			c.appendChild(t);
			d.appendChild(c);

			c = create_element('div');
			t = create_element('input', 'type', 'text', 'id', 'hocker' + i, 'value', chairs[i]['count']['hocker']);
			c.appendChild(t);
			t = create_element('label', 'for', 'hocker' + i, 'text', 'Hocker');
			c.appendChild(t);
			p = get_hocker_price(chairs[i], 1);
			t = create_element('p', 'text', 'Fr. ' + p['franken']);
			c.appendChild(t);
			t = create_element('p', 'text', '€ ' + p['euro']);
			c.appendChild(t);
			d.appendChild(c);

			c = create_element('div');
			t = create_element('input', 'type', 'text', 'id', 'eck' + i, 'value', chairs[i]['count']['eck']);
			c.appendChild(t);
			t = create_element('label', 'for', 'eck' + i, 'text', 'Eckelement');
			c.appendChild(t);
			p = get_eck_price(chairs[i], 1);
			t = create_element('p', 'text', 'Fr. ' + p['franken']);
			c.appendChild(t);
			t = create_element('p', 'text', '€ ' + p['euro']);
			c.appendChild(t);
			d.appendChild(c);

			for(j in chairs[i]['zubehor']) {
				c = create_element('div');
				t = create_element('input', 'type', 'text', 'id', 'zubehor' + i + 'i' + j, 'value', chairs[i]['zubehor'][j]['count']);
				c.appendChild(t);
				t = create_element('label', 'for', 'hocker' + i, 'text', zubehor['accessories'][chairs[i]['zubehor'][j]['id']]['name']);
				c.appendChild(t);
				p = parseFloat(zubehor['accessories'][chairs[i]['zubehor'][j]['id']]['price']);
				t = create_element('p', 'text', 'Fr. ' + p.toFixed(2));
				c.appendChild(t);
				t = create_element('p', 'text', '€ ' + (p / euro_factor).toFixed(2));
				c.appendChild(t);
				d.appendChild(c);
			}
		}
		r.appendChild(d);
	}

	hide('confirmleft');
	show('orderleft');
}

function check_address() {
	var fields = new Array('namen', 'adresse', 'ort', 'land', 'telefon', 'email');
	for(i in fields) {
		var e = document.getElementById(fields[i]);
		if(e.value == '') {
			alert('Bitte füllen Sie alle Felder der Rechnungsadresse aus.');
			return false;
		}
	}
	var e = document.getElementById('lieferungrechnung');
	if(!e.checked) {
		var fields = new Array('liefernamen', 'lieferadresse', 'lieferort', 'lieferland');
		for(i in fields) {
			var e = document.getElementById(fields[i]);
			if(e.value == '') {
				alert('Bitte füllen Sie alle Felder der Lieferadresse aus.');
				return false;
			}
		}

	}
	return true;
}

function kontaktieren() {
	var k = document.getElementById('kontakt');
	var m = document.getElementById('musterbox');

	if(!k.checked && !m.checked) {
		alert('Falls Sie Sessel bestellen wollen, können Sie dies auf der Seite "Warenkorb" tun.');
		return false;
	}
	if(!check_address()) {
		return false;
	}
	return true;
}

function bestellen() {
	var e = document.getElementById('bedingungen');
	if(!e.checked) {
		alert('Sie müssen den Verkaufsbedingungen zustimmen um eine Bestellung aufzugeben.');
		return false;
	}
	if(!check_address()) {
		return false;
	}

	var b = '[';

	for(var i = 0; i < number_chairs; i++) {
		if(chairs[i]['verkleidung'] == 0 || chairs[i]['polster'] == 0) {
			continue;
		}
		if(i > 0) {
			b += ',';
		}
		b += '{';
		b += '"verkleidung" : ' + chairs[i]['verkleidung'] + ',"polster" : ' + chairs[i]['polster'];
		b += ',"sessel" : ' + chairs[i]['count']['sessel'];
		b += ',"hocker" : ' + chairs[i]['count']['hocker'];
		b += ',"eck" : '    + chairs[i]['count']['eck'];
		b += ',"zubehor" : [';
		for(j = 0; j < chairs[i]['zubehor'].length; j++) {
			if(j > 0) {
				b += ',';
			}
			if(chairs[i]['zubehor'][j]['count'] > 0) {
				b += '{"count" : ' + chairs[i]['zubehor'][j]['count'];
				b += ',"id" : ' + chairs[i]['zubehor'][j]['id'] + '}';
			}
		}
		b += '] } ';
	}
	b += ']';

	var i = document.getElementById('bestellung');
	i.value = b;
	return true;
}

function show_confirm() {
	var r = document.getElementById('orderright');
	empty(r);
	var chairs_ordered = 0;
	var total = { 'franken' : 0.0, 'euro' : 0.0 };

	for(var i = 0; i < number_chairs; i++) {
		if(chairs[i]['verkleidung'] == 0 || chairs[i]['polster'] == 0) {
			continue;
		}
		// don't show items with count 0
		var count = chairs[i]['count']['sessel'] + chairs[i]['count']['hocker'] + chairs[i]['count']['eck'];
		for(j in chairs[i]['zubehor']) {
			count += chairs[i]['zubehor'][j]['count'];
		}
		if(count == 0) {
			continue;
		}

		var d = create_element('div', 'class', 'chair_detail');
		var img = create_element('img', 'src', get_image_address(chairs[i]['verkleidung'], chairs[i]['polster']), 'id', 'chair' + i);
		d.appendChild(img);
		var t = create_element('h2', 'text', 'Variante ' + (i+1));
		d.appendChild(t);
		var v = verkleidung['materials'][parseInt(chairs[i]['verkleidung'])];
		t = create_element('p', 'text', 'Verkleidungstyp: ' + v['name'] + ', Farbe: ' + v['color'] + ', Preisklasse: ' + v['price_name']);
		d.appendChild(t);
		var p = polster['materials'][parseInt(chairs[i]['polster'])];
		t = create_element('p', 'text', 'Bezug: ' + p['name'] + ', Farbe: ' + p['color'] + ', Preisklasse: ' + p['price_name']);
		d.appendChild(t);

		if(chairs[i]['count']['sessel'] > 0) {
			var c = create_element('div');
			t = create_element('label', 'for', 'sessel' + i, 'text', chairs[i]['count']['sessel'] + ' Sessel');
			c.appendChild(t);
			var p = get_sessel_price(chairs[i], chairs[i]['count']['sessel']);
			chairs_ordered += chairs[i]['count']['sessel'];
			total['franken'] += parseFloat(p['franken']);
			total['euro']    += parseFloat(p['euro']);
			t = create_element('p', 'text', 'Fr. ' + p['franken']);
			c.appendChild(t);
			t = create_element('p', 'text', '€ ' + p['euro']);
			c.appendChild(t);
			d.appendChild(c);
		}

		if(chairs[i]['count']['hocker'] > 0) {
			c = create_element('div');
			t = create_element('label', 'for', 'hocker' + i, 'text', chairs[i]['count']['hocker'] + ' Hocker');
			c.appendChild(t);
			var p = get_hocker_price(chairs[i], chairs[i]['count']['hocker']);
			total['franken'] += parseFloat(p['franken']);
			total['euro']    += parseFloat(p['euro']);
			t = create_element('p', 'text', 'Fr. ' + p['franken']);
			c.appendChild(t);
			t = create_element('p', 'text', '€ ' + p['euro']);
			c.appendChild(t);
			d.appendChild(c);
		}

		if(chairs[i]['count']['eck'] > 0) {
			c = create_element('div');
			t = create_element('label', 'for', 'eck' + i, 'text', chairs[i]['count']['eck'] + ' Eckelement');
			c.appendChild(t);
			var p = get_eck_price(chairs[i], chairs[i]['count']['eck']);
			total['franken'] += parseFloat(p['franken']);
			total['euro']    += parseFloat(p['euro']);
			t = create_element('p', 'text', 'Fr. ' + p['franken']);
			c.appendChild(t);
			t = create_element('p', 'text', '€ ' + p['euro']);
			c.appendChild(t);
			d.appendChild(c);
		}

		for(j in chairs[i]['zubehor']) {
			if(chairs[i]['zubehor'][j]['count'] > 0) {
				c = create_element('div');
				t = create_element('label', 'for', 'hocker' + i, 'text', chairs[i]['zubehor'][j]['count'] + ' ' +  zubehor['accessories'][chairs[i]['zubehor'][j]['id']]['name']);
				c.appendChild(t);
				p = parseFloat(zubehor['accessories'][chairs[i]['zubehor'][j]['id']]['price']) * chairs[i]['zubehor'][j]['count'];
				total['franken'] += p;
				total['euro'] += (p / euro_factor);

				t = create_element('p', 'text', 'Fr. ' + p.toFixed(2));
				c.appendChild(t);
				t = create_element('p', 'text', '€ ' + (p / euro_factor).toFixed(2));
				c.appendChild(t);
				d.appendChild(c);
			}
		}
		r.appendChild(d);
	}

	// versandkosten
	var d = create_element('div', 'class', 'chair_detail');
	var p = get_versand(chairs_ordered);
	total['franken'] += parseFloat(p['franken']);
	total['euro']    += parseFloat(p['euro']);
	c = create_element('div');
	t = create_element('label', 'text', 'Versand: ' + p['text']);
	c.appendChild(t);
	t = create_element('p', 'text', 'Fr. ' + p['franken']);
	c.appendChild(t);
	t = create_element('p', 'text', '€ ' + p['euro']);
	c.appendChild(t);
	d.appendChild(c);
// AKTION
	c = create_element('div');
	t = create_element('label', 'text', 'Frühlingsaktion: alle Bestellungen die bis am  30.04 2009 bei uns eintreffen werden in der ganzen Schweiz kostenlos geliefert.');
	c.appendChild(t);
	d.appendChild(c);
// ENDE AKTION
	r.appendChild(d);

	d = create_element('div', 'class', 'chair_detail');
	c = create_element('div');
	t = create_element('label', 'text', 'Total Warenkorb');
	c.appendChild(t);
	t = create_element('p', 'text', 'Fr. ' + total['franken'].toFixed(2));
	c.appendChild(t);
	t = create_element('p', 'text', '€ ' + total['euro'].toFixed(2));
	c.appendChild(t);
	d.appendChild(c);

	c = create_element('div');
	t = create_element('label', 'text', 'davon MWST');
	c.appendChild(t);
	t = create_element('p', 'text', 'Fr. ' + (total['franken'] * MWST_rate).toFixed(2));
	c.appendChild(t);
	d.appendChild(c);

	c = create_element('div', 'class', 'total');
	t = create_element('label', 'text', 'Total Rechnungsbetrag');
	c.appendChild(t);
	t = create_element('p', 'text', 'Fr. ' + total['franken'].toFixed(2));
	c.appendChild(t);
	t = create_element('p', 'text', '€ ' + total['euro'].toFixed(2));
	c.appendChild(t);
	d.appendChild(c);
	r.appendChild(d);

	d = create_element('div', 'class', 'chair_detail');
	t = create_element('input', 'type', 'submit', 'name', 'bestellen', 'value', 'Bestellung aufgeben');
	t.onclick = bestellen;
	d.appendChild(t);
	r.appendChild(d);

	hide('orderleft');
	show('confirmleft');
}

function parse_count(string) {
	var e = parseInt(string);
	if(isNaN(e) || e < 0) {
		e = 0;
	}
	return e;
}

function read_overview() {
	for(var i = 0; i < number_chairs; i++) {
		var valid = true;
		if(chairs[i]['verkleidung'] == 0 || chairs[i]['polster'] == 0) {
//			chairs[i]['count'] = {'sessel' : 0, 'eck' : 0, 'hocker' : 0};
		}

		else {
			var e = document.getElementById('sessel' + i);
			chairs[i]['count']['sessel'] = parse_count(e.value);

			e = document.getElementById('hocker' + i);
			chairs[i]['count']['hocker'] = parse_count(e.value);

			e = document.getElementById('eck' + i);
			chairs[i]['count']['eck'] = parse_count(e.value);

			for(j in chairs[i]['zubehor']) {
				e = document.getElementById('zubehor' + i + 'i' + j);
				chairs[i]['zubehor'][j]['count'] = parse_count(e.value);
			}
		}
	}
}

function show_muster() {
	hide_intro();
	hide_shop();
	hide_order();
	show('mustertext');
	show('muster');
}

function show_intro1() {
	show('introtext1');
	hide('introtext2');
}

function show_intro2() {
	show('introtext2');
	hide('introtext1');
}

function start_intro() {
	hide_order();
	hide_shop();
	show('intro');
}

function start_shop() {
	hide_intro();
	hide_order();
	show('left');
	var r = document.getElementById('chairs');
	empty(r);
	r.style.display = 'block';

	/* generate chairs */
	for(var i = 0; i < number_chairs; i++) {
		var chair = create_element('div', 'class', 'chair');
		var img = create_element('img', 'src', get_image_address(chairs[i]['verkleidung'], chairs[i]['polster']), 'id', 'chair' + i);
		img.onmouseover = chair_mouseover(i);
		img.onmouseout  = chair_mouseout(i);
		var desc = create_element('ul', 'id', 'chairacc' + i);
		chair.appendChild(img);
		chair.appendChild(desc);
		r.appendChild(chair);
		refresh_accessories(i);
	}
}

function start_order() {
	hide_intro();
	hide_shop();
	show('orderright');
}

function hide_shop() {
	hide('chairs');
	hide('left');
}

function hide_order() {
	hide('orderright');
	hide('orderleft');
	hide('confirmleft');
}

function hide_intro() {
	hide('introtext2');
	hide('introtext1');
	hide('intro');
}

function hide_muster() {
	hide('mustertext');
	hide('muster');
}

function add_accessory(chair, id) {
	var accessories = chairs[chair]['zubehor'];
	var found = false;
	var i;
	// see if we already have it there
	for(i in accessories) {
		if(accessories[i]['id'] == id) {
			found = true;
			break;
		}
	}
	// add if needed
	if(found) {
		accessories[i]['count']++;
	}
	else {
		accessories.push( {'id' : id, 'count' : 1 } );
	}
	// refresh display
	refresh_accessories(chair);
}

function delete_accessory(chair, id) {
	return function() {
		var accessories = chairs[chair]['zubehor'];
		// see if we actually have it there
		for(var i in accessories) {
			if(accessories[i]['id'] == id) {
				var a = accessories.slice(0,i);
				var b = accessories.slice(parseInt(i)+1);
				chairs[chair]['zubehor'] = a.concat(b);
				break;
			}
		}
		refresh_accessories(chair);
	};
}

function refresh_accessories(chair) {
	var l = document.getElementById('chairacc' + chair);
	var accessories = chairs[chair]['zubehor'];
	empty(l);
	for(i in accessories) {
		var acc = zubehor['accessories'][accessories[i]['id']];
		var z = create_element('li', 'text', acc['name'] + ': ' + accessories[i]['count']);
		var b = create_element('input', 'type', 'button', 'value', 'löschen');
		b.onclick = delete_accessory(chair, accessories[i]['id']);
		z.appendChild(b);
		l.appendChild(z);
	}
}

function animate_intro(image) {
	return function() {
		var i = document.getElementById('intro');
		if(!i) {
			return;
		}
		image++;
		if(image > 8) {
			image = 1;
		}
		if(position == 1) {
			i.src = 'bilder/intro/intro' + image + '.jpg';
		}
		else if(position == 2) {
			i.src = 'bilder/intro/sofa' + image + '.jpg';
		}
		setTimeout(animate_intro(image), intro_delay);
	}
}

function change_address() {
	var dis = document.getElementById('lieferungrechnung').checked;
	var names = new Array('liefernamen', 'lieferadresse', 'lieferort', 'lieferland')
	for(var n in names) {
		var i = document.getElementById(names[n]);
		i.disabled = dis;
	}
}

function step(pos) {
	if(pos == position) {
		return;
	}
	var list = document.getElementById('navigation').getElementsByTagName('li');
	if(position > 0) {
		list[position-1].className = '';
	}
	if(position == 7) {
		read_overview();
	}
	if(position == 6) {
		hide_muster();
	}
	switch(pos) {
		case 1:
			if(position != 2) {
				start_intro();
			}
			show_intro1();
			break;
		case 2:
			if(position != 1) {
				start_intro();
			}
			show_intro2();
			break;
		case 3:
			if(position != 4 && position != 5) {
				start_shop();
			}
			show_verkleidung();
			break;
		case 4:
			if(position != 3 && position != 5) {
				start_shop();
			}
			show_polster();
			break;
		case 5:
			if(position != 3 && position != 4) {
				start_shop();
			}
			show_zubehor();
			break;
		case 6:
			show_muster();
			break;
		case 7:
			if(position != 7 && position != 8) {
				start_order();
			}
			show_overview();
			break;
		case 8:
			if(position != 7 && position != 8) {
				start_order();
			}
			show_confirm();
			break;
	}
	position = pos;
	list[position-1].className = 'selected';
}

function init() {
	if(document.all) {
		ie = true;
	}
	seite = document.getElementById('seite');
	drag = {
		'object' : null,
		'material' : 0,
		'type'  : null,
		'chair' : null
	};
	// type can be 1: verkleidung, 2: polster, 3: zubehör
	document.onmousemove = mouse_move;
	document.onmouseup   = mouse_up;
	chairs = [];
	for(i = 0; i < number_chairs; i++) {
		chairs[i] = { 'verkleidung' : 0, 'polster' : 0, 'zubehor' : new Array(), 'count' : {'sessel' : 1, 'eck' : 0, 'hocker' : 0} };
	}

	hide_muster();
	hide_shop();
	hide_order();
	step(1);
	setTimeout(animate_intro(1), intro_delay);
}

var ie = false;
var position = -1;
var seite;
var image_chair = 'bilder/sessel/leer.png';
var number_chairs = 4;
var chairs;
var text_verkleidung = 'Hier können Sie für Ihren Sessel Change die Verkleidungen aussuchen.<br />Es ist möglich 4 Varianten parallel zu gestalten.<br />Die Verkleidungen sind in 3 Hauptkategorien eingeteilt (siehe unten).<br />Klicken Sie auf ein Musterfenster um Daten und Preisklasse zu erhalten. Wollen Sie diese Verkleidung auf einem Sessel sehen, ziehen Sie das Muster auf den gewünschten Sessel.';
var text_polster = 'Hier können Sie für Ihren Sessel Change die Polster aussuchen.<br />Die Polster sind wieder in 3 Hauptkategorien unterteilt (siehe unten).<br />Klicken Sie auf ein Musterfenster um Daten und Preisklasse zu erhalten. Wollen Sie diese Verkleidung auf einem Sessel sehen, ziehen Sie das Muster auf den gewünschten Sessel.';
var text_zubehor = 'Hier können Sie für Ihren Sessel Change das passende Zubehör aussuchen.<br />Klicken Sie auf ein Musterfenster, um Vergrösserung und Daten zu erhalten. Wollen Sie das Zubehör einem Sessel zuordnen, ziehen Sie das Zubehörfenster auf den gewünschten Sessel.';
var drag;
var intro_delay = 2000;
var euro_factor = 1.5 / 0.924;
var MWST_rate = 0.076;