﻿Ext.namespace("grafProducts");

grafProducts = {
	init: function(){

		var niederschlagsmengen = {
		
		"01":"1275",
		"02":"742",
		"03":"809",
		"04":"843",
		"05":"895",
		"06":"967",
		"07":"1244",
		"08":"905",
		"09":"997",
		"10":"755",
		"11":"859",
		"12":"1036",
		"13":"766",
		"14":"862",
		"15":"1229",
		"16":"860",
		"17":"855",
		"18":"759",
		"19":"1250",
		"20":"838",
		"21":"863",
		"22":"816",
		"23":"1012",
		"24":"890",
		"25":"1368",
		"26":"965",
		"27":"708",
		"28":"649",
		"29":"964",
		"30":"960",
		"31":"832",
		"32":"797",
		"33":"901",
		"34":"927",
		"35":"772",
		"36":"777",
		"37":"683",
		"38":"1177",
		"39":"1980",
		"40":"1114",
		"41":"670",
		"42":"859",
		"43":"822",
		"44":"761",
		"45":"679",
		"46":"976",
		"47":"810",
		"48":"1299",
		"49":"830",
		"50":"986",
		"51":"752",
		"52":"930",
		"53":"794",
		"54":"833",
		"55":"983",
		"56":"911",
		"57":"869",
		"58":"937",
		"59":"729",
		"60":"714",
		"61":"805",
		"62":"824",
		"63":"965",
		"64":"1399",
		"65":"1157",
		"66":"712",
		"67":"840",
		"68":"1162",
		"69":"838",
		"70":"1145",
		"71":"858",
		"72":"716",
		"73":"1151",
		"74":"1458",
		"75":"633",
		"76":"895",
		"77":"716",
		"78":"633",
		"79":"851",
		"80":"755",
		"81":"990",
		"82":"809",
		"83":"858",
		"84":"765",
		"85":"795",
		"86":"733",
		"87":"1061",
		"88":"1238",
		"89":"794",
		"90":"1075",
		"91":"633",
		"92":"633",
		"93":"633",
		"94":"633",
		"95":"633"
		
		}
		
		var dachbeiwert = {
			"1":0.9,	// Ton/glasiert
			"2":0.8,	// Schiefer
			"3":0.8,	// Beton
			"4":0.95,	// Blech
			"5":0.4,	// Begrünt
			"6":0.6,	// Kiesschüttung
			"7":0.95,	// Kunststoff
			"8":0.95	// Bitumen
		}

// Produktberater einblenden
		Ext.get('pb_back').setStyle('display','block');

// Helfer	
		var setSelect = function(e,val) {
			for(i=0;i<document.getElementById(e).length;i++) {
				if(document.getElementById(e).options[i].value==val)	{
					document.getElementById(e).selectedIndex=i
				}
			}
		}		

// Cookie konfigurieren		
		Ext.state.Manager.setProvider(new Ext.state.CookieProvider({
			//path: "/produktberater/",
			expires: new Date(new Date().getTime()+(1000*60*60*24*30)) //30 days
			//domain: "graf-online.info"
		}));
	
// Actions

		var tmpTarget;
		if (sys_language_uid == 0) tmpTarget = 148;
		if (sys_language_uid == 1) tmpTarget = 259;
		if (sys_language_uid == 2) tmpTarget = 589;
		if (sys_language_uid == 3) tmpTarget = 358;

	    // Data Store erzeugen
	    var produkteStore = new Ext.data.JsonStore({
	        root: 'contents',
	        totalProperty: 'totalCount',
	        idProperty: 'id',
	        //remoteSort: true,

	        fields: [
	            'content'
	        ],
			//proxy: new Ext.data.ScriptTagProxy({
	        proxy: new Ext.data.HttpProxy({
	            url: 'index.php?id='+tmpTarget
	        })
	    });
			
		// aktualisiert Produkte
		var getProdukte = function(){
			updateBelastbarkeit();
			if (einbauTooltip) einbauTooltip.hide();
			
			if (dachtyp.getValue()==5) {
				Ext.get('pb_produkte').setStyle('display','none');
				Ext.get('pb_dtbegruent').setStyle('display','block');
				return;
			} else {
				Ext.get('pb_dtbegruent').setStyle('display','none');
			}				
			
			var tmpTankgroesse = 0;
			if (Ext.state.Manager.get('groessenberechnungeingeblendet')==1) tmpTankgroesse = berechneteTankgroesse;
			
			// Parameter an Store übergeben => diese entsprechen den GET-Parametern des AJAX-Calls
			produkteStore.baseParams = {
				einsatzort:Ext.DomQuery.selectValue('input[name=einsatzort]:checked/@value'),
				einbau:Ext.DomQuery.selectValue('input[name=einbau]:checked/@value'),
				belastbarkeit:Ext.DomQuery.selectValue('input[name=belastbarkeit]:checked/@value'),
				berechnetetankgroesse:tmpTankgroesse,
				lang:sys_language_uid
			};
		
			// alte Werte mit neuen vergleichen, erster Aufruf?
			var tmpRefresh = false;
			if (Ext.DomQuery.selectValue('input[name=einsatzort]:checked/@value')!=Ext.state.Manager.get('einsatzort')) tmpRefresh = true;
			if (Ext.DomQuery.selectValue('input[name=einbau]:checked/@value')!=Ext.state.Manager.get('einbau')) tmpRefresh = true;
			if (Ext.DomQuery.selectValue('input[name=belastbarkeit]:checked/@value')!=Ext.state.Manager.get('belastbarkeit')) tmpRefresh = true;
			if (tmpTankgroesse!=Ext.state.Manager.get('berechnetetankgroesse')) tmpRefresh = true;
			if (initialLoad) tmpRefresh = true;
			initialLoad = false;

			// Refresh erforderlich?
			if (!tmpRefresh) return;
			
			// Werte in Cookie speichern
			Ext.state.Manager.set('einsatzort',Ext.DomQuery.selectValue('input[name=einsatzort]:checked/@value'));
			Ext.state.Manager.set('einbau',Ext.DomQuery.selectValue('input[name=einbau]:checked/@value'));
			Ext.state.Manager.set('belastbarkeit',Ext.DomQuery.selectValue('input[name=belastbarkeit]:checked/@value'));
			Ext.state.Manager.set('berechnetetankgroesse',tmpTankgroesse);
			
			if (Ext.DomQuery.selectValue('input[name=einsatzort]:checked/@value')!=undefined && Ext.DomQuery.selectValue('input[name=einbau]:checked/@value')!=undefined && (Ext.DomQuery.selectValue('input[name=belastbarkeit]:checked/@value')!=undefined || Ext.DomQuery.selectValue('input[name=einbau]:checked/@value')==1)) {
				// Produkte einblenden
				Ext.get('pb_produkte').setStyle('display','block');
				// Store aktualisieren
				produkteStore.load({
					params:{
						start:0, 	// Ergebnis "zurückspulen" auf den ersten DS
						limit:6		// DS pro Seite
					}
				});
				// Tracking-Cookie setzen
				Ext.state.Manager.set('trackingstate',1);
			} else Ext.get('pb_produkte').setStyle('display','none');	
		}
		
		// aktualisiert Berechnung
		var berechneteTankgroesse = 0;
		var tankgroesseTooltip;
		var regenwasserertragTooltip;
		var getErsparnis = function(){

			var bedarfHausGartenTpl = new Ext.Template(
				'<div class="regenwasserbedarf_back">',
					'<table cellspacing="0" cellpadding="0">',
						'<tbody>',
							'<tr>',
								'<td width="120">Toilettes</td>',
								'<td width="150">par personne et par an 8,5 m³</td>',
								'<td width="80">× {personen} personnes</td>',
								'<td width="15">=</td>',
								'<td width="90" class="result">{wc} litres</td>',
							'</tr>',
							'<tr>',
								'<td>Lave-linge</td>',
								'<td>par personne et par an 3,5 m³</td>',
								'<td>× {personen} personnes</td>',
								'<td>=</td>',
								'<td class="result">{waschmaschine} litres</td>',
							'</tr>',
							'<tr>',
								'<td>Lavage/nettoyage</td>',
								'<td>par personne et par an 1,1 m³</td>',
								'<td>× {personen} personnes</td>',
								'<td>=</td>',
								'<td class="result">{reinigung} litres</td>',
							'</tr>',
							'<tr>',
								'<td>Arrosage jardin</td>',
								'<td>100 L/m²</td>',
								'<td>× {gartengroesse} m²</td>',
								'<td>=</td>',
								'<td class="result">{gartenliter} litres</td>',
							'</tr>',
						'</tbody>',
					'</table>',
				'</div>',
				'<table cellspacing="0" cellpadding="0" class="pb_summe">',
					'<tbody>',						
						'<tr>',
							'<th colspan="3" width="350">Besoin en eau de pluie</th>',
							'<td width="15">=</td>',
							'<td width="90" class="result bedarf">{bedarf} litres</td>',
						'</tr>',
					'</tbody>',
				'</table>'
			);

			var bedarfHausTpl = new Ext.Template(
				'<div class="regenwasserbedarf_back">',
					'<table cellspacing="0" cellpadding="0">',
						'<tbody>',
							'<tr>',
								'<td width="120">Toilettes</td>',
								'<td width="150">par personne et par an 8,5 m³</td>',
								'<td width="80">× {personen} personnes</td>',
								'<td width="15">=</td>',
								'<td width="90" class="result">{wc} litres</td>',
							'</tr>',
							'<tr>',
								'<td>Lave-linge</td>',
								'<td>par personne et par an 3,5 m³</td>',
								'<td>× {personen} personnes</td>',
								'<td>=</td>',
								'<td class="result">{waschmaschine} litres</td>',
							'</tr>',
							'<tr>',
								'<td>Lavage/nettoyage</td>',
								'<td>par personne et par an 1,1 m³</td>',
								'<td>× {personen} personnes</td>',
								'<td>=</td>',
								'<td class="result">{reinigung} litres</td>',
							'</tr>',
						'</tbody>',
					'</table>',
				'</div>',
				'<table cellspacing="0" cellpadding="0" class="pb_summe">',
					'<tbody>',
						'<tr>',
							'<th colspan="3" width="350">Besoin en eau de pluie</th>',
							'<td width="15">=</td>',
							'<td width="90" class="result bedarf">{bedarf} litres</td>',
						'</tr>',
					'</tbody>',
				'</table>'
			);

			var bedarfGartenTpl = new Ext.Template(
				'<div class="regenwasserbedarf_back">',
					'<table cellspacing="0" cellpadding="0">',
						'<tbody>',
							'<tr>',
								'<td width="120">Arrosage jardin</td>',
								'<td width="150">100 L/m²</td>',
								'<td width="80">× {gartengroesse} m²</td>',
								'<td width="15">=</td>',
								'<td width="90" class="result">{gartenliter} litres</td>',
							'</tr>',
						'</tbody>',
					'</table>',
				'</div>',
				'<table cellspacing="0" cellpadding="0" class="pb_summe">',
					'<tbody>',
						'<tr>',
							'<th colspan="3" width="350">Besoin en eau de pluie</th>',
							'<td width="15">=</td>',
							'<td width="90" class="result bedarf">{bedarf} litres</td>',
						'</tr>',
					'</tbody>',
				'</table>'
			);

			var tmpBedarf = 0;
			if (Ext.DomQuery.selectValue('input[name=einsatzort]:checked/@value')=='haus') {
				if (anzpersonen.getValue()>0) {
					tmpBedarf = Math.round(anzpersonen.getValue()*(8.5+3.5+1.1)*1000);
					bedarfHausTpl.overwrite('regenwasserbedarf', {
						personen:anzpersonen.getValue(),
						wc:Math.round(anzpersonen.getValue()*8.5*1000),
						waschmaschine:Math.round(anzpersonen.getValue()*3.5*1000),
						reinigung:Math.round(anzpersonen.getValue()*1.1*1000),
						bedarf: tmpBedarf
					});
				} else Ext.DomHelper.overwrite('regenwasserbedarf','');
			}
			if (Ext.DomQuery.selectValue('input[name=einsatzort]:checked/@value')=='garten') {
				if (gartengroesse.getValue()>0) {
					tmpBedarf = Math.round(gartengroesse.getValue()*100);
					bedarfGartenTpl.overwrite('regenwasserbedarf', {
						gartengroesse:gartengroesse.getValue(),
						gartenliter:gartengroesse.getValue()*100,
						bedarf: tmpBedarf
					});
				} else Ext.DomHelper.overwrite('regenwasserbedarf','');
			}
			if (Ext.DomQuery.selectValue('input[name=einsatzort]:checked/@value')=='hausgarten') {
				if (gartengroesse.getValue()>0 && anzpersonen.getValue()>0) {
					tmpBedarf = Math.round(anzpersonen.getValue()*(8.5+3.5+1.1)*1000+gartengroesse.getValue()*100);
					bedarfHausGartenTpl.overwrite('regenwasserbedarf', {
						personen:anzpersonen.getValue(),
						wc:Math.round(anzpersonen.getValue()*8.5*1000),
						waschmaschine:Math.round(anzpersonen.getValue()*3.5*1000),
						reinigung:Math.round(anzpersonen.getValue()*1.1*1000),
						gartengroesse:gartengroesse.getValue(),
						gartenliter:gartengroesse.getValue()*100,
						bedarf: tmpBedarf
					});
				} else Ext.DomHelper.overwrite('regenwasserbedarf','');
			}
			
			
			var tankgroesseTpl = new Ext.Template(
				'<table cellspacing="0" cellpadding="0"><tbody>'+
				'<tr><th width="342">Volume d\'eau de pluie collecté</th><td width="15">=</td><td width="90" class="result">{regenwasserertrag} litres</td><td><a href="javascript:;" id="regenwasserertraginfo"><img src="fileadmin/templates/img/info_icon.gif" /></a></td></tr>'+
				'<tr><th width="342">Capacité de la cuve</th><td width="15">=</td><td width="90" class="result">{tankgroesse} litres</td><td><a href="javascript:;" id="tankgroesseinfo"><img src="fileadmin/templates/img/info_icon.gif" /></a></td></tr>'+
				'</tbody></table>'
			);
			
			if (plz.getValue()>0 && dachtyp.getValue()>0 && tmpBedarf>0) {
				// alten Tooltip ausblenden
				//if (Ext.get('tankgroesseinfoTooltip')) Ext.get('tankgroesseinfoTooltip').hide();

				// Berechnung
				var tmpErtrag = (niederschlagsmengen[plz.getValue()] * dachflaeche.getValue() * dachbeiwert[dachtyp.getValue()]);
				var tankgroessealt = berechneteTankgroesse;
				berechneteTankgroesse = Math.round(((tmpErtrag+tmpBedarf)/2)*(21/365));
				if (tankgroessealt != berechneteTankgroesse) getProdukte();
				tankgroesseTpl.overwrite('tankgroesse', {
					tankgroesse: berechneteTankgroesse,
					regenwasserertrag: tmpErtrag
				});
				var tankgroesseBerechnung = 
				'La moyenne des préciptations et du besoin en eau est utilisée comme facteur de dimensionnement:<br />' +
				'<table cellspacing="1" cellpadding="1" border="0">' +
				'<tbody><tr>' +
					'<td>'+tmpErtrag+' litres + '+tmpBedarf+' litres</td>'+
					'<td rowspan="2"> × </td>'+
					'<td>21 jours (réserve de sécurité)</td>'+
					'<td rowspan="2">= '+berechneteTankgroesse+' litres</td>'+
				'</tr>'+
				'<tr>'+
					'<td style="border-top: 1px solid black; text-align: center;">2</td>'+
					'<td style="border-top: 1px solid black; text-align: center;">365 jours</td>'+
				'</tr>'+
				'</tbody></table>';
				
				if (tankgroesseTooltip) tankgroesseTooltip.hide();
				tankgroesseTooltip = new Ext.ToolTip({
					target: 'tankgroesseinfo',
					html: tankgroesseBerechnung,
					title: 'Comment est calculée la capacité de la cuve?',
					autoHide: false,
					width: 425,
					closable: true,
					draggable: true,
					hideDelay: 1000,
					dismissDelay: 8000
				});

				if (regenwasserertragTooltip) regenwasserertragTooltip.hide();
				regenwasserertragTooltip = new Ext.ToolTip({
					target: 'regenwasserertraginfo',
					html: "Cette valeur est estimée d'après les moyennes de précipitations de votre région.",
					autoHide: false,
					closable: true,
					draggable: false,
					hideDelay: 1000,
					dismissDelay: 8000
				});

			} else {
				Ext.DomHelper.overwrite('tankgroesse','');
				berechneteTankgroesse = 0;
				getProdukte();
			}

			var ersparnisTpl = new Ext.Template(
				'<table cellspacing="0" cellpadding="0"><tbody><tr><th width="342">Economie annuelle</th><td width="15">=</td><td width="90" class="result">€{ersparnis}</td></tr></tbody></table>'
			);
			
			if (tmpBedarf > 0 && tmpErtrag > 0) {
				var tmpErsparnis;
				if (tmpErtrag < tmpBedarf) tmpErsparnis = Math.round(tmpErtrag * wasserpreis.getValue()/1000/1000);
				else tmpErsparnis = Math.round(tmpBedarf * wasserpreis.getValue()/1000/1000);
				ersparnisTpl.overwrite('ersparnis', {
					ersparnis: tmpErsparnis
				});
			} else Ext.DomHelper.overwrite('ersparnis','');
		
			// Werte in Cookie speichern
			Ext.state.Manager.set('plz',plz.getValue());
			Ext.state.Manager.set('dachflaeche',dachflaeche.getValue());
			Ext.state.Manager.set('dachtyp',dachtyp.getValue());
			Ext.state.Manager.set('anzpersonen',anzpersonen.getValue());
			Ext.state.Manager.set('gartengroesse',gartengroesse.getValue());
			Ext.state.Manager.set('wasserpreis',wasserpreis.getValue());			
		}
		
		// aktualisiert Einbau
		var updateEinbau = function(){
			if (Ext.DomQuery.selectValue('input[name=einsatzort]:checked/@value')=='garten' || Ext.DomQuery.selectValue('input[name=einsatzort]:checked/@value')=='') {
				document.getElementById('labeleinbau1').disabled=false;
				document.getElementById('einbau1').disabled=false;
				Ext.get('einbauinfo').setStyle('display','none');
				Ext.get('labeleinbau1').setStyle('color','#646567');
			} else {
				// oberirdisch ausgewählt? wähle unterirdisch aus
				if (Ext.DomQuery.selectValue('input[name=einbau]:checked/@value')==1) {
					document.getElementById('einbau2').checked = true;
					Ext.get('pb_belastbarkeit').setStyle('display','block');
				}
				Ext.get('labeleinbau1').set({disabled:'disabled'});
				Ext.get('labeleinbau1').setStyle('color','#A0A0A0');
				Ext.get('einbauinfo').setStyle('display','inline');
				//Ext.get('einbauinfo').frame();
			}
		}

		// aktualisiert Anz. Personen
		var updateAnzPersonen = function(){
			if (Ext.DomQuery.selectValue('input[name=einsatzort]:checked/@value')=='garten') {
				Ext.get('pb_anzpersonen').setStyle('display','none');
			} else {
				Ext.get('pb_anzpersonen').setStyle('display','inline');
			}
		}
		
		// aktualisiert Belastbarkeit
		var updateBelastbarkeit = function(){
			// oberirdisch ausgewählt? blende Belastbarkeit aus
			if (Ext.DomQuery.selectValue('input[name=einbau]:checked/@value')==1) {
				Ext.get('pb_belastbarkeit').setStyle('display','none');
			} else {
				Ext.get('pb_belastbarkeit').setStyle('display','block');
			}
		}
						
// Formular

// einsatzort Begin
		if (Ext.state.Manager.get('einsatzort')) {
			if (Ext.state.Manager.get('einsatzort')=='haus') Ext.get('einsatzort1').set({checked:'checked'});
			if (Ext.state.Manager.get('einsatzort')=='garten') Ext.get('einsatzort2').set({checked:'checked'});		
			if (Ext.state.Manager.get('einsatzort')=='hausgarten') Ext.get('einsatzort3').set({checked:'checked'});		
		}
		Ext.get('einsatzort1').addListener('click',getProdukte,this,{buffer: 500});
		Ext.get('labeleinsatzort1').addListener('click',getProdukte,this,{buffer: 500});
		Ext.get('einsatzort1').addListener('click',getErsparnis,this,{buffer: 500});
		Ext.get('labeleinsatzort1').addListener('click',getErsparnis,this,{buffer: 500});
		Ext.get('einsatzort1').addListener('click',updateEinbau,this,{buffer: 500});
		Ext.get('labeleinsatzort1').addListener('click',updateEinbau,this,{buffer: 500});
		Ext.get('einsatzort1').addListener('click',updateAnzPersonen,this,{buffer: 500});
		Ext.get('labeleinsatzort1').addListener('click',updateAnzPersonen,this,{buffer: 500});

		Ext.get('einsatzort2').addListener('click',getProdukte,this,{buffer: 500});
		Ext.get('labeleinsatzort2').addListener('click',getProdukte,this,{buffer: 500});
		Ext.get('einsatzort2').addListener('click',getErsparnis,this,{buffer: 500});
		Ext.get('labeleinsatzort2').addListener('click',getErsparnis,this,{buffer: 500});
		Ext.get('einsatzort2').addListener('click',updateEinbau,this,{buffer: 500});
		Ext.get('labeleinsatzort2').addListener('click',updateEinbau,this,{buffer: 500});
		Ext.get('einsatzort2').addListener('click',updateAnzPersonen,this,{buffer: 500});
		Ext.get('labeleinsatzort2').addListener('click',updateAnzPersonen,this,{buffer: 500});
		
		Ext.get('einsatzort3').addListener('click',getProdukte,this,{buffer: 500});
		Ext.get('labeleinsatzort3').addListener('click',getProdukte,this,{buffer: 500});
		Ext.get('einsatzort3').addListener('click',getErsparnis,this,{buffer: 500});
		Ext.get('labeleinsatzort3').addListener('click',getErsparnis,this,{buffer: 500});
		Ext.get('einsatzort3').addListener('click',updateEinbau,this,{buffer: 500});
		Ext.get('labeleinsatzort3').addListener('click',updateEinbau,this,{buffer: 500});
		Ext.get('einsatzort3').addListener('click',updateAnzPersonen,this,{buffer: 500});
		Ext.get('labeleinsatzort3').addListener('click',updateAnzPersonen,this,{buffer: 500});

		var tmpHtml;
		
		if (sys_language_uid == 0) tmpHtml = 'Wo möchten Sie Regewasser nutzen?';
		if (sys_language_uid == 1) tmpHtml = 'Where do you want to use the rainwater?';
		if (sys_language_uid == 3) tmpHtml = 'A quelle utilisation sera destinée l’eau de pluie ?';
		if (sys_language_uid == 2) tmpHtml = '¿Cómo quiere usar este producto?';		

		var einsatzortTooltip = new Ext.ToolTip({
			target: 'einsatzortinfo',
			html: tmpHtml,
			autoHide: false,
			closable: true,
			draggable: false,
			hideDelay: 1000,
			dismissDelay: 8000
		});

		
// einsatzort Ende
	
// einbau Begin
		if (Ext.state.Manager.get('einbau')) {
			if (Ext.state.Manager.get('einbau')==1) Ext.get('einbau1').set({checked:'checked'});
			if (Ext.state.Manager.get('einbau')==2) Ext.get('einbau2').set({checked:'checked'});		
		}
		Ext.get('einbau1').addListener('click',getProdukte,this,{
		    buffer: 500
		});
		Ext.get('labeleinbau1').addListener('click',getProdukte,this,{
		    buffer: 500
		});
		Ext.get('einbau2').addListener('click',getProdukte,this,{
		    buffer: 500
		});
		Ext.get('labeleinbau2').addListener('click',getProdukte,this,{
		    buffer: 500
		});
	
		Ext.get('einbau1').set({disabled:'disabled'});

		if (sys_language_uid == 0) tmpHtml = 'Die Option "oberirdisch" ist nur auswählbar, wenn "Garten" als Einsatzort gewählt wurde.';
		if (sys_language_uid == 1) tmpHtml = 'Die Option "oberirdisch" ist nur auswählbar, wenn "Garten" als Einsatzort gewählt wurde.';
		if (sys_language_uid == 3) tmpHtml = 'Vous pouvez choisir "en aérien" uniquement pour une utilisation "Jardin".';
		if (sys_language_uid == 2) tmpHtml = 'Die Option "oberirdisch" ist nur auswählbar, wenn "Garten" als Einsatzort gewählt wurde.';		
		
		var tmpHtml2;
		if (sys_language_uid == 0) tmpHtml2 = 'Option nicht auswählbar';
		if (sys_language_uid == 1) tmpHtml2 = 'Option not available';
		if (sys_language_uid == 3) tmpHtml2 = 'Option non disponible';
		if (sys_language_uid == 2) tmpHtml2 = 'Opción no disponible';		
		
		var einbauTooltip = new Ext.ToolTip({
			target: 'einbauinfo',
			html: tmpHtml,
			title: tmpHtml2,
			autoHide: false,
			closable: true,
			draggable: true,
			hideDelay: 1000,
			dismissDelay: 8000
		});
// einbau Ende
	
// belastbarkeit Begin

		if (Ext.state.Manager.get('belastbarkeit')) {
			if (Ext.state.Manager.get('belastbarkeit')=='begehbar') Ext.get('belastbarkeit1').set({checked:'checked'});
			if (Ext.state.Manager.get('belastbarkeit')=='pkwbefahrbar') Ext.get('belastbarkeit2').set({checked:'checked'});	
		}
		Ext.get('belastbarkeit1').addListener('click',getProdukte,this,{buffer: 500});
		Ext.get('labelbelastbarkeit1').addListener('click',getProdukte,this,{buffer: 500});
		
		Ext.get('belastbarkeit2').addListener('click',getProdukte,this,{buffer: 500});
		Ext.get('labelbelastbarkeit2').addListener('click',getProdukte,this,{buffer: 500});

// belastbarkeit Ende

// Link zum Aufundzuklappen von Größenberechnung
		var groessenberechnungEinblenden = function() {
			//einblenden, falls vorhanden
			Ext.get('ersparnisundgroessenberechnung').set({checked:'checked'});
			if (Ext.get('pb_groessenberechnung')) {
				Ext.get('pb_groessenberechnung').setStyle('display','block');
				// Slider aktualisieren (wird vom IE benötigt)
				if (dachflaeche) dachflaeche.syncThumb();
				if (wasserpreis) wasserpreis.syncThumb();
				if (gartengroesse) gartengroesse.syncThumb();
				// Zustand speichern
				Ext.state.Manager.set('groessenberechnungeingeblendet',1);
			} else Ext.state.Manager.set('groessenberechnungeingeblendet',0);
		}
		var groessenberechnungAusblenden = function () {
			//ausblenden
			Ext.get('ersparnisundgroessenberechnung').set({checked:''});
			Ext.get('pb_groessenberechnung').setStyle('display','none');
			// Zustand speichern
			Ext.state.Manager.set('groessenberechnungeingeblendet',0);
			if (tankgroesseTooltip) tankgroesseTooltip.hide();
		}
					
		Ext.get('ersparnisundgroessenberechnung').addListener('change',function(){
			if (Ext.DomQuery.select('input[name=ersparnisundgroessenberechnung]:checked')!='') {
				groessenberechnungEinblenden();
				getProdukte();
			} else {
				groessenberechnungAusblenden();				
				getProdukte();
			}
		},this,{buffer:300});
		
		Ext.get('ersparnisundgroessenberechnung').addListener('click',function(){
			Ext.get('ersparnisundgroessenberechnung').blur(); // IE-Fix
		},this,{buffer:400});
		
		// alten Zustand wieder herstellen
		if (Ext.state.Manager.get('groessenberechnungeingeblendet')) {
			if (Ext.state.Manager.get('groessenberechnungeingeblendet')==1) {
				Ext.get('ersparnisundgroessenberechnung').set({checked:'checked'});
				groessenberechnungEinblenden();
			}
			else Ext.get('ersparnisundgroessenberechnung').set({checked:''});
		} else {
			// default: Berechnung einblenden
			Ext.get('ersparnisundgroessenberechnung').set({checked:'checked'});
			groessenberechnungEinblenden();		
		}
	
	
// plz Begin
		var plz = Ext.get('plz');
		if (Ext.state.Manager.get('plz')) {
			setSelect('plz',Ext.state.Manager.get('plz'));
		}
		plz.addListener('change',getErsparnis,this,{
		    buffer: 500
		});
// plz Ende
	
// dachflaeche Begin
		var dachflaeche = new Ext.Slider({
			renderTo: 'dachflaeche',
			width: 150,
			height: 20,
			increment: 10,
			minValue: 10,
			maxValue: 500
		});
		
		dachflaeche.addListener('change',getErsparnis,this,{
		    buffer: 500
		});

		// Wert einstellen
		if (Ext.state.Manager.get('dachflaeche')) {
			// Wert aus Cookie wiederherstellen
			dachflaeche.setValue(Ext.state.Manager.get('dachflaeche'));
		} else {
			// Default-Wert einstellen
			dachflaeche.setValue(40);		
		}
		
		// Wert mit Einheit ausgeben
		var dachflaechevalue = new Ext.Template(
			'{value}'
		);
		dachflaechevalue.overwrite('dachflaecheval', {value: dachflaeche.getValue()});
		
		dachflaeche.addListener('change',function(){
			dachflaechevalue.overwrite('dachflaecheval', {value: dachflaeche.getValue()});
		});

		var dachflaecheTooltip = new Ext.ToolTip({
			target: 'dachflaecheinfo',
			html: '<table width="100%" border="0" cellpadding="3"> <tr>Surface de toiture effective<br /><td><img src="typo3conf/ext/nl_graf_produkte/res/images/projezierte-Dachflaeche.gif" alt="Surface de toiture effective" width="120" height="176" /></td><td>La surface du toiture effective ne dépend pas de la forme et de la pente du toit. Ne prendre en considération que les surfaces de toitures qui seront reliées à l\'installation.</td>  </tr></table>',
			autoHide: false,
			closable: true,
			draggable: false,
			hideDelay: 1000,
			dismissDelay: 8000
		});


// dachflaeche Ende		

// dachtyp Begin
		var dachtyp = Ext.get('dachtyp');
		if (Ext.state.Manager.get('dachtyp')) {
			setSelect('dachtyp',Ext.state.Manager.get('dachtyp'));
		}
		dachtyp.addListener('change',getErsparnis,this,{
		    buffer: 500
		});
// dachtyp Ende
		
// gartengroesse Begin		
		
		var tipgartengroesse = new Ext.ux.SliderTip({
			getText: function(slider){
				return String.format('<b>{0}m²</b>', slider.getValue());
			}
		});

		var gartengroesse = new Ext.Slider({
			stateId: 'gartengroesse',
			renderTo: 'gartengroesse',
			width: 150,
			height: 20,
			increment: 25,
			minValue: 0,
			maxValue: 1000
			//plugins: tipgartengroesse
		});
		
		gartengroesse.addListener('change',getErsparnis,this,{
		    buffer: 500
		});
		
		// Wert einstellen
		if (Ext.state.Manager.get('gartengroesse')) {
			// Wert aus Cookie wiederherstellen
			gartengroesse.setValue(Ext.state.Manager.get('gartengroesse'));
		} else {
			// Default-Wert einstellen
			gartengroesse.setValue(200);
		}

		// Wert mit Einheit ausgeben
		var gartengroessevalue = new Ext.Template(
			'{value}'
		);
		gartengroessevalue.overwrite('gartengroesseval', {value: gartengroesse.getValue()});
		
		gartengroesse.addListener('change',function(){
			gartengroessevalue.overwrite('gartengroesseval', {value: gartengroesse.getValue()});				
		});
		
// gartengroesse Ende		

// anzpersonen Begin
		var anzpersonen = Ext.get('anzpersonen');
		if (Ext.state.Manager.get('anzpersonen')) {
			setSelect('anzpersonen',Ext.state.Manager.get('anzpersonen'));
		}
		anzpersonen.addListener('change',getErsparnis,this,{
		    buffer: 500
		});
// anzpersonen Ende

// wasserpreis Begin		
		
		var tipwasserpreis = new Ext.ux.SliderTip({
			getText: function(slider){
				return String.format('<b>{0}€/m³</b>', (slider.getValue()/1000));
			}
		});

		var wasserpreis = new Ext.Slider({
			stateId: 'wasserpreis',
			renderTo: 'wasserpreis',
			width: 150,
			height: 20,
			increment: 100,
			minValue: 2000,
			maxValue: 8000
			//plugins: tipwasserpreis
		});
		
		wasserpreis.addListener('change',getErsparnis,this,{
		    buffer: 500
		});
		
		// Wert einstellen
		if (Ext.state.Manager.get('wasserpreis')) {
			// Wert aus Cookie wiederherstellen
			wasserpreis.setValue(Ext.state.Manager.get('wasserpreis'));
		} else {
			// Default-Wert einstellen
			wasserpreis.setValue(3700);
		}

		// Wert mit Einheit ausgeben
		var wasserpreisvalue = new Ext.Template(
			'{value}'
		);
		wasserpreisvalue.overwrite('wasserpreisval', {value: (wasserpreis.getValue()/1000).toFixed(2).replace('.',',')});
		
		wasserpreis.addListener('change',function(){
			gartengroessevalue.overwrite('wasserpreisval', {value: (wasserpreis.getValue()/1000).toFixed(2).replace('.',',')});				
		});
		
		var wasserpreisTooltip = new Ext.ToolTip({
			target: 'wasserpreisinfo',
			html: "Pour une utilisation exclusive en arrosage jardin, le coût de l'eau potable s'ajoute à celui de son traitement (épuration). Dans le cas d'une utilisation habitat (WC/lave-linge), le coût du traitement de l'eau dépend de votre distributeur d'eau.",
			autoHide: false,
			closable: true,
			draggable: false,
			hideDelay: 1000,
			dismissDelay: 8000
			
		});
// wasserpreis Ende		
		
// Produkt-Ausgabe Start

		
		if (sys_language_uid == 0) {
			var tmpbeforePageText = "Seite";
			var tmpafterPageText = "von {0}";
			var tmplastText = "letzte Seite";
			var tmpnextText = "nächste Seite";
			var tmpprevText = "vorherige Seite";
			var tmpfirstText = "erste Seite";
		}
		if (sys_language_uid == 1) {
			var tmpbeforePageText = "Page";
			var tmpafterPageText = "of {0}";
			var tmplastText = "last page";
			var tmpnextText = "next page";
			var tmpprevText = "previous page";
			var tmpfirstText = "first page";
		}
		if (sys_language_uid == 3) {
			var tmpbeforePageText = "Page";
			var tmpafterPageText = "/ {0}";
			var tmplastText = "dernière page";
			var tmpnextText = "page suivante";
			var tmpprevText = "page précédente";
			var tmpfirstText = "première page";
		}
		if (sys_language_uid == 2) {
			var tmpbeforePageText = "Página";
			var tmpafterPageText = "/ {0}";
			var tmplastText = "ultima página";
			var tmpnextText = "página siguiente";
			var tmpprevText = "página anterior";
			var tmpfirstText = "primera página";
		}

	    var pagingBarTop = new Ext.PagingToolbar({
	        pageSize: 6,
	        store: produkteStore,
	        displayInfo: false,
	        //displayMsg: 'Displaying entries {0} - {1} of {2}',
	        emptyMsg: "",
			refreshText: "",
			beforePageText : tmpbeforePageText,
			afterPageText : tmpafterPageText,
			lastText: tmplastText,
			nextText: tmpnextText,
			prevText: tmpprevText,
			firstText: tmpfirstText
	    });
	    var pagingBarBottom = new Ext.PagingToolbar({
	        pageSize: 6,
	        store: produkteStore,
	        displayInfo: false,
	        //displayMsg: 'Displaying entries {0} - {1} of {2}',
	        emptyMsg: "",
			refreshText: "",
			beforePageText : tmpbeforePageText,
			afterPageText : tmpafterPageText,
			lastText: tmplastText,
			nextText: tmpnextText,
			prevText: tmpprevText,
			firstText: tmpfirstText
	    });

	    var grid = new Ext.grid.GridPanel({
	        el:'pb_produkte',
	        //width:508,
	        //height:550,
			autoHeight: true,
	        store: produkteStore,
			border: false,
			disableSelection: true,
			enableHdMenu: false,
			hideHeaders: true,
	        trackMouseOver:false,

	        // grid columns
	        columns:[{
	            id: 'topic', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
	            dataIndex: 'content',
	            width: 636,
	            sortable: false
	        }],

	        // paging bar on the bottom
	        bbar: pagingBarBottom,
			tbar: pagingBarTop
	    });

	    // render it
	    grid.render();		
// Produkt-Ausgabe Ende

		// Quicktips initialisieren
		Ext.QuickTips.init();
		
		// initiale Aufrufe
		updateEinbau();
		updateAnzPersonen();
		getErsparnis();
		var initialLoad=true;
		getProdukte();
	}
}

Ext.onReady(grafProducts.init);
