window.addEvent('domready', function(){

	// Slider
	var sliderObject = $('slideContainer'); // this.slider
	var knobObject = $('slideHandle'); // this.knob
	// var resObject = $('slideResult');	
	// var formObject =  $('dekor_slider'); 	
	var sliderRange = [1, 8];
	var sliderSteps = 8;
	// Auswahlkriterien	
	// Regler: 	Dekor, Base, Design, Oberflaeche, Sortierung, Serie, Nutzung-Celenio (n.z.d)
	// Parkett:	Dekor, Base, Design, Oberflaeche, Sortierung
	// Tritty:	Dekor, Base, Design, null, null, Serie
	// Celenio:	Dekor, Base, Design
	// Corkett:	Dekor, Base
	// Linett: 	Dekor, Base, 
	var sparte = 'parkett'; // default
	var scope = new Array(7);
	var i18n_Version = 'DE'; // default
	var restore_base = 0;
	
	// Filterelemente erstmal ausblenden
	var feSlide = new Fx.Slide($('frm_filter'), {
					hideOverflow: false
					}).hide();
	
	$('frm_filter').setStyle('display', 'block');
	
	sparte = $('sparte').value;
	i18n_Version = $('i18n_Version').value;
	
	$('no_js').setStyle('display','none');
	showList(sparte, scope, '', i18n_Version, 1);
	
	$('reset_dekor').addEvent('click', function(e) {
		// alert('reset dekor filter');
		knobObject.setStyle('visibility', 'hidden');
		scope[0] = 0;
		showList(sparte, scope, '', i18n_Version, 0);
	})
	

	if(sparte == 'celenio' || sparte == 'corkett' || sparte == 'linett') {
		sliderRange = [1, 4];
		sliderSteps = 4;		
	}
	
	
	// filter_dekor: slider 
	var slider = new Slider(sliderObject, knobObject, {
													
		// Settings
		range: sliderRange,	
		snap: true,
		steps: sliderSteps,
		wheel: true,
		// mode: 'horizontal',
		// offset: 3,
		
		// onchange fires when the value of step changes
		// it will pass the current step as a parameter
		onChange: function(step){
					knobObject.setStyle('visibility', 'visible');	
					feSlide.slideIn();	
					// $('frm_filter').setStyle('display', 'block');
					
			// put what you want to happen on change here
			// refer to the step
			// $('steps_number').set('html', step);				
		},	
		// ontick moves when the user drags the knob
		// it will pass the current position (relative to the parent element)		
		onTick: function(pos){
		
			// $('knob_pos').set('html', pos);
			//this is necessary for the knob to adjust		
			knobObject.setStyle('left', pos);			
		},
		// fires when the dragging stops
		onComplete: function(step){
			// put what you want to happen on complete here
			// refer to the step
			// $('steps_complete_number').set('html', step);
			// resObject.set('html', step);
			// formObject.set('value', step);
			this.set(step);
		
			scope[0] = step;
			
			// retore base filter if neccessary
			restore_base = $('restore').value;
			if((restore_base == 1)) { 
				scope[1] = '';
				scope[2] = '';
				scope[3] = '';
				scope[4] = '';
				scope[5] = '';
				
				// showBaseFilter(sparte, scope);
				setResoreValue(0);
			}			
			
			showList(sparte, scope, '', i18n_Version, 0);
			
		}	
		
	}); // END: slider
	
	
	// filter_base - select
	if($defined($('filter_base'))) {
		$('filter_base').addEvent('change', function(e) {				
				var base_value = $('filter_base').value;
				// alert('Base value changed to ' + sparte + ', ' + base_value);				
				scope[1] = base_value;						
				showList(sparte, scope, '', i18n_Version, 0);
		});		
	}
	
	// filter_design - select
	if($defined($('filter_design'))) {
		$('filter_design').addEvent('change', function(e) {				
				var design_value = $('filter_design').value;
				// alert('Design value changed to ' + design_value);				
				scope[2] = design_value;
				showList(sparte, scope, 'Design', i18n_Version, 0);
				
				showIcon(sparte, design_value);
		});		
	}
	// filter_design - radio group
	if($defined($('group_design'))) {
		$('group_design').getElements('input[name=filter_design]').addEvents({
				'click': function(){
						var radioChecked = this.checked;
						var design_value = 0;
						if(this.checked == true) {
							var design_value = this.value;
							// alert('radioGrp filter_design: click on ' + design_value + ' checked: ' + radioChecked);
							scope[2] = design_value;
							showList(sparte, scope, 'Design', i18n_Version, 0);
						}
				}
		});
	}
		
	// filter_oberflaeche - select
	if($defined($('filter_oberflaeche'))) {
		$('filter_oberflaeche').addEvent('change', function(e) {				
				var oberflaeche_value = $('filter_oberflaeche').value;
				// alert('Oberflaeche value changed to ' + oberflaeche_value);				
				scope[3] = oberflaeche_value;
				showList(sparte, scope, 'Oberflaeche', i18n_Version, 0);
		});	
	}
	// filter_oberflaeche - radio group
	if($defined($('group_oberflaeche'))) {
		$('group_oberflaeche').getElements('input[name=filter_oberflaeche]').addEvents({
				'click': function(){
						var radioChecked = this.checked;
						var oberflaeche_value = 0;
						if(this.checked == true) {
							var oberflaeche_value = this.value;
							// alert('radioGrp filter_oberflaeche: click on ' + oberflaeche_value + ' checked: ' + radioChecked);
							scope[3] = oberflaeche_value;
							showList(sparte, scope, 'Oberflaeche', i18n_Version, 0);
						}
				}
		});
	}
	
	// filter_sortierung - select
	if($defined($('filter_sortierung'))) {	
		$('filter_sortierung').addEvent('change', function(e) {				
				var sortierung_value = $('filter_sortierung').value;
				// alert('Sortierung value changed to ' + sortierung_value);				
				scope[4] = sortierung_value;
				showList(sparte, scope, 'Sortierung', i18n_Version, 0);
		});		
	}
	// filter_sortierung - radio group
	if($defined($('group_sortierung'))) {
		$('group_sortierung').getElements('input[name=filter_sortierung]').addEvents({
				'click': function(){
						var radioChecked = this.checked;
						var sortierung_value = 0;
						if(this.checked == true) {
							var sortierung_value = this.value;
							// alert('radioGrp filter_sortierung: click on ' + sortierung_value + ' checked: ' + radioChecked);
							scope[4] = sortierung_value;
							showList(sparte, scope, 'Sortierung', i18n_Version, 0);
						}
				}
		});
	}
	
	// filter_serie - select
	if($defined($('filter_serie'))) {
		$('filter_serie').addEvent('change', function(e) {				
				var serie_value = $('filter_serie').value;
				// alert('Serie value changed to ' + serie_value);				
				scope[5] = serie_value;
				showList(sparte, scope, 'Serie', i18n_Version, 0);
		});		
	}
	// filter_serie - radio group
	if($defined($('group_serie'))) {
		$('group_serie').getElements('input[name=filter_serie]').addEvents({
				'click': function(){
						var radioChecked = this.checked;
						var serie_value = 0;
						if(this.checked == true) {
							var serie_value = this.value;
							// alert('radioGrp filter_serie: click on ' + serie_value + ' checked: ' + radioChecked);
							scope[5] = serie_value;
							showList(sparte, scope, 'Serie', i18n_Version, 0);
						}
				}
		});
	}

	
	// filter__ -- Nutzung-Celenio
	

	
	/*
	$('filter_produktfinder').addEvent('click', function(e){
		var infos	= $$('.nfo');	
		var info_is_open = 0;
		for(var i = 0; i < infos.length; i++) {
			if(infos[i].getStyle('display') == 'block') info_is_open++;
		}
		if(info_is_open > 0) {
			// alert('open nfos: ' + info_is_open);
			$$('.nfo').setStyle('display', 'none');
		}
	});		
	*/ 
	$$('.nfo').addEvent('click', function(e){
		$$('.nfo').setStyle('display', 'none');							 
	});



});




// Bildergallerie / Slideshow
function showList(sp,sc,ai,i18n,init) {

	var r1 = sc[0];	// Dekor
	var r2 = sc[1]; // Base	
	var r3 = sc[2]; // Design
	var r4 = sc[3];	// Oberlfaeche
	var r5 = sc[4];	// Sortierung
	var r6 = sc[5];	// Serie
	var r7 = sc[6];	// Nutzung-Celenio		
	var res = 'Auswahlkriterien:<br />Sparte: '+sp+', Dekor: '+r1+', Base: '+r2+', Design: '+r3+', Oberlfaeche: '+r4+', Sortierung: '+r5+', Serie: '+r6+', Nutzung-Celenio: '+r7;
	// alert ('showList called<br />' + res);
	// alert ('showList called w/ i18n ' + i18n);

	$('preview').setStyle('display', 'none');
	// $$('.nfo').setStyle('display', 'none');	

	var a = new Request({
							method: 'post',
							url: '../../../_modules/produktfinder/php/load_slideshow.php',
							evalScripts: true,
							data: { 'action' : 'load',
									'init' : init,
									'sparte' : sp,
									'i18n_Version' : i18n,
									'scope' :  sc
							},
							onRequest: $('SlideItMoo_items').empty().addClass('ajax-loading')
	});			
	a.addEvent('success', function(response) {
				// $('status').set('html', res);
				
				$('SlideItMoo_items').empty().removeClass('ajax-loading')														 	
    			$('SlideItMoo_items').set('html', response);

				new SlideItMoo({
						overallContainer: 'SlideItMoo_outer',
						elementScrolled: 'SlideItMoo_inner',
						thumbsContainer: 'SlideItMoo_items',		
						itemsVisible: 15,
						itemsSelector: '.SlideItMoo_element',
						itemWidth: 48,
						showControls:1,
						duration: 100,
						mouseWheelNav: false
				});
				
				// Browser.Engine.name;
				// var is_ie = Browser.Engine.trident;
				var it = 0;				
				
				// todo: folgenden code evtl. in fkt packen
				// events: click, mouseover, onmouseout, mouseenter, mouseleave
				$$('.SlideItMoo_element').addEvent('mouseenter', function(e) {
					// e.stop();
					// alert('Element with ID ' +  this.id  + ' selected');
					var el = this.id;
					it = this.id;
					showPreview(sp, el, i18n);
				});				
				
				/* 
				// mit eventhandler realisiert
				$('preview').addEvent('click', function(e) {					
					ret = '<br />eID <strong>' + it  + '</strong> clicked';
					// $('preview').set('html', ret);	
					showStage(sp, it);
					
				});	
				*/

				/*	
				// nach fkt showPreview verschoben
				$('preview').addEvent('mouseleave', function() {
					$('preview').setStyle('display', 'none');
				});	
				*/
				
				// -- new -----------------------------------------------------	
				$$('.SlideItMoo_forward').addEvent('mouseover', function() {
					$('preview').setStyle('display', 'none');
				});
				$$('.SlideItMoo_back').addEvent('mouseover', function() {
					$('preview').setStyle('display', 'none');
				});			
				// -- new -----------------------------------------------------
				
				showBaseFilter(sp,sc);
				
				if(sp == 'parkett') {
					showDesignFilter(sp,sc);
					showOberflaecheFilter(sp,sc);
					showSortierungFilter(sp,sc);
				}
				if(sp == 'tritty') {
					showDesignFilter(sp,sc);
					showSerieFilter(sp,sc)
				}
				if(sp == 'celenio') {
					showDesignFilter(sp,sc);
				}	
				
				// showFilterElement(sp,sc,'Sortierung');
				// modifyFilterItems(sp,sc,ai);

	});
	a.send();	
	eval(a.response);

	
} // END: gallery


function showFilter() {
	// $('frm_filter').setStyle('display', 'block');	
	feSlide.slideIn();	
}

function showBaseFilter(sp,sc) {
	var a = new Request({
						method: 'post',
						url: '../../../_modules/produktfinder/php/get_base_filter.php',
						evalScripts: false,
						data: { 'action' : 'load', 
								'sparte' : sp,
								'scope' :  sc
						}
	});		
	a.addEvent('success', function(response) {											 	
			$('filter_base').set('html', response);
	});
	a.send();
	
}

function showDesignFilter(sp,sc) {
	
	var a = new Request({
						method: 'post',
						url: '../../../_modules/produktfinder/php/get_design_filter.php',
						evalScripts: true,
						data: { 'action' : 'load', 
								'sparte' : sp,
								'scope' :  sc
						}
	});		
	a.addEvent('success', function(response) {											 	
			$('filter_design').set('html', response);
	});
	a.send();	
}

function showOberflaecheFilter(sp,sc) {
	
	var a = new Request({
						method: 'post',
						url: '../../../_modules/produktfinder/php/get_oberflaeche_filter.php',
						evalScripts: true,
						data: { 'action' : 'load', 
								'sparte' : sp,
								'scope' :  sc
						}
	});		
	a.addEvent('success', function(response) {											 	
			$('filter_oberflaeche').set('html', response);
	});
	a.send();	
}


function showSortierungFilter(sp,sc) {
	
	var a = new Request({
						method: 'post',
						url: '../../../_modules/produktfinder/php/get_sortierung_filter.php',
						evalScripts: true,
						data: { 'action' : 'load', 
								'sparte' : sp,
								'scope' :  sc
						}
	});		
	a.addEvent('success', function(response) {											 	
			$('filter_sortierung').set('html', response);
	});
	a.send();	
}

function showSerieFilter(sp,sc) {
	
	var a = new Request({
						method: 'post',
						url: '../../../_modules/produktfinder/php/get_serie_filter.php',
						evalScripts: true,
						data: { 'action' : 'load', 
								'sparte' : sp,
								'scope' :  sc
						}
	});		
	a.addEvent('success', function(response) {											 	
			$('filter_serie').set('html', response);
	});
	a.send();	
}

function showFilterElement(sp,sc,ai) {
	// alert("show Filter called");
	// var filter_section = 'filter_' + toLowerCase(ai);
	
	var a = new Request({
						method: 'post',
						url: '../../../_modules/produktfinder/php/get_filter.php',
						evalScripts: true,
						data: { 'action' : 'load', 
								'sparte' : sp,
								'scope' :  sc,
								'active_item' : ai
						}
	});		
	a.addEvent('success', function(response) {											 	
			$('filter_sortierung').set('html', response);
	});
	a.send();
	
}

function modifyFilterItems(sp,sc,ai) {
	
	var a = new Request({
						method: 'post',
						url: '../../../_modules/produktfinder/php/modify_filter_items.php',
						evalScripts: true,
						data: { 'action' : 'load', 
								'sparte' : sp,
								'scope' :  sc,
								'active_item' : ai
						}
	});		
	a.addEvent('success', function(response) {											 	
			// ...
	});
	a.send();	

}

function setResoreValue(v) {
	// alert("restore filter items " + v);
	$('restore').value = v;	
}

function showIcon(sp,dval) {
	//alert("showIcon " + sp + " val: " + dval);	
		
	var a = new Request({
						method: 'post',
						url: '../../../_modules/produktfinder/php/load_info_icon.php',
						evalScripts: true,
						data: { 'action' : 'load', 
								'sparte' : sp,
								'design_value' :  dval
						}
	});		
	a.addEvent('success', function(response) {											 	
			$('info_icon').set('html', response);
	});
	a.send();		
}



// ------------------------------------------------------------------------------
		/* 
		window.addEvent('domready', function(){
			
			// Browser.Engine.name;
			var is_ie = Browser.Engine.trident;
			var it = 0;

			// thumbnails example , links only 
			new SlideItMoo({
					overallContainer: 'SlideItMoo_outer',
					elementScrolled: 'SlideItMoo_inner',
					thumbsContainer: 'SlideItMoo_items',		
					itemsVisible:15,
					itemsSelector: '.SlideItMoo_element',
					itemWidth: 48,
					showControls:1,
					mouseWheelNav: true
			});	
			
			// events: click, mouseover, onmouseout, mouseenter, mouseleave
			$$('.SlideItMoo_element').addEvent('mouseover', function(e) {
				e.stop();
				// alert('Element with ID ' +  this.id  + ' clicked');
				var el = this.id;
				it = this.id;
				
				var epos = $(el).getPosition('SlideItMoo_items'); // 'SlideItMoo_items'
				var ex = epos.x + 'px';
				var ey = epos.y + 'px';				
				var ret = 'Element '+el+'<br />Position<br />x: '+ex+'<br />y: '+ey+'<br />';
				$('preview').set('html', ret);				
				
				var offset_y = 12;
				if(is_ie == true) offset_y = 0;
				$('preview').position({
					relativeTo: el,					
					offset: {x: -2, y: offset_y},
					position: 'centerBottom',
					edge: 'centerBottom'		
				});				
				$('preview').setStyle('display', 'block');				
				// $('preview').setStyle('visibility', 'visible');
			});

			$('preview').addEvent('click', function(e) {					
				ret = 'Element ID ' + it  + ' clicked';
				$('preview').set('html', ret);	
				showStage('parkett', it); // ACHTUNG: FKT geandert + sparte
			});	
				
			$('preview').addEvent('mouseout', function() {
				$('preview').setStyle('display', 'none');
			});
			
			
		});	
		 */
// ------------------------------------------------------------------------------

function showPreview(sparte, ite, i18n) {
			// alert('showPreview called w/ ' + ite + ', ' + i18n);	
			// Browser.Engine.name;
			var is_ie = Browser.Engine.trident;
	
			var epos = $(ite).getPosition('SlideItMoo_items'); // 'SlideItMoo_items'
			var ex = epos.x + 'px';
			var ey = epos.y + 'px';				
			var ret = '<br />Element '+ite+'<br />Position<br />x: '+ex+'<br />y: '+ey+'<br />';
			// $('preview').set('html', ret);				
			
			// Layout
			var offset_y = 12;
			if(is_ie == true) offset_y = 12;
			$('preview').position({
				relativeTo: ite,					
				offset: {x: 0, y: offset_y},
				position: 'centerBottom',
				edge: 'centerBottom'		
			});				
			// $('preview').setStyle('display', 'block');						
			
			// Inhalt
			var a = new Request({
							method: 'post',
							url: '../../../_modules/produktfinder/php/load_preview.php',
							evalScripts: true,
							data: { 'action' : 'load', 
									'i18n_Version' : i18n,
									'sparte' : sparte,
									'item' : ite
							},
							onRequest: $('preview').addClass('ajax-loading')
			});		
			a.addEvent('success', function(response) {	
				$('preview').removeClass('ajax-loading');						   	
				$('preview').set('html', response);
				$('preview').setStyle('display', 'block');

				$('preview').addEvent('mouseleave', function() {
					$('preview').setStyle('display', 'none');
				});	
				
			});
			a.send();			


}


function showStage(sparte, it, i18n) {
			// alert('showStage called w/ ' + it);	
			// alert('showStage called w/ ' + i18n);	
			var a = new Request({
							method: 'post',
							url: '../../../_modules/produktfinder/php/load_stage.php',
							evalScripts: true,
							data: { 'action' : 'load', 
									'i18n_Version' : i18n,
									'sparte' : sparte,
									'item' : it
							},
							onRequest: $('main_stage_product').addClass('ajax-loading') // .empty() // stage
			});		
			a.addEvent('success', function(response) {
				$('main_stage_product').removeClass('ajax-loading');	// empty().												 	
				$('main_stage_product').set('html', response);																 	
			});
			a.send();
			
}


// ---------------- helpers --------------------------
// Produktinfos ein- und ausblenden
// ToDo: FX hinzufgen
function closeProductInfo() {
	$('product_desc').setStyle('display','none');												 	
	$('product_open').setStyle('display','block');		
}


function openProductInfo() {
	$('product_desc').setStyle('display','block');												 	
	$('product_open').setStyle('display','none');		
}

function showInterieur() {
	// alert('show interieur');	
	$('schraeg_bild').setStyle('display','none');
	$('interieur_bild').setStyle('display','block');	
	
	
	$('show_interieur_pic').removeClass('show_interieur');
	$('show_interieur_pic').addClass('show_interieur_active');

	$('show_schraegansicht_pic').removeClass('show_schraegansicht_active');
	$('show_schraegansicht_pic').addClass('show_schraegansicht');
													 		
}
function showSchraegansicht() {
	// alert('show schraegansicht');	
	$('interieur_bild').setStyle('display','none');
	$('schraeg_bild').setStyle('display','block');	
	
	$('show_interieur_pic').removeClass('show_interieur_active');
	$('show_interieur_pic').addClass('show_interieur');

	$('show_schraegansicht_pic').removeClass('show_schraegansicht');
	$('show_schraegansicht_pic').addClass('show_schraegansicht_active');
	
}


function toggleInfo(info_id) {
	var info = 'i' + info_id;
	var currentStyle = $(info).getStyle('display');	
	// alert('info: ' + info + ', current: ' +  currentStyle);
	
	$$('.nfo').setStyle('display', 'none');
	
	if(currentStyle == 'none') {
		$(info).setStyle('display','block');
	}
	else {
		$(info).setStyle('display','none');
	}
	
}


// Merkzettel
function addToNotepad(it, i18n) {
	//  alert('addToNotepad called w/ ' + it);			
	var a = new Request({
					method: 'post',
					url: '../../../_modules/merkzettel/notepad-marker.php',
					evalScripts: true,
					data: { 'action' : 'add', 
							'i18n_Version' : i18n,
							'item' : it
					}
	});		
	a.addEvent('success', function(response) {										 	
		$('notepad').set('html', response);																 	
	});
	a.send();	
	
}

function toggleTooltip(el) {
	var currentStyle = $(el).getStyle('display');	
	if(currentStyle == 'none') {
		$(el).setStyle('display','block');
	}
	else {
		$(el).setStyle('display','none');
	}	
}