
/* JS-Code for Product Finder (upper right corner) */
Event.observe(window, 'load', function(event) {
	$$('.finder').each( function (item) {
		var finderHasTrigger = ! item.hasClassName('finder-static');
	
		var bodyTag = $$('body').first();
		if (!finderDisplay) {
			var finderDisplay = item.select('.finder-display').first();
			if (finderHasTrigger) {
				finderDisplay = finderDisplay.remove();
				finderDisplay.identify();
				bodyTag.appendChild(finderDisplay);
			}
		}
			
		var finderTrigger = item.select('.finder-trigger').first(); 
		var configuration = finderTrigger.select('a[rel]').first().readAttribute('rel');
		var regExp = /(\d+)\-(\d+)/;
		configuration = regExp.exec(configuration);
		
		finderDisplay.initialValue = configuration[1] ? parseInt(configuration[1]) : 0;
		finderDisplay.startCatUid = configuration[2] ? parseInt(configuration[2]) : 0;

		
		finderDisplay.slide = function (startLeft, endLeft, innerContainer, oldContainer) {
			if (startLeft != endLeft) { 
				startLeft = startLeft * (-1);
				endLeft = endLeft * (-1);
				finderDisplay.select('.finder-display-level').each(function (item) {
					item.setStyle({ overflow: 'hidden' });
				});
				if (startLeft < endLeft) {
					new PeriodicalExecuter (function (pe) {
						startLeft = startLeft+12;
						if (startLeft >= endLeft) {
							innerContainer.setStyle({left: (endLeft) + 'px'});
							pe.stop();
							oldContainer.remove();
							finderDisplay.select('.finder-display-level').each(function (item) {
								item.setStyle({ overflowY: 'auto' });
							});
						} else {
							innerContainer.setStyle({left: (startLeft) + 'px'});
						}
					}, 0.002);
				} else {
					new PeriodicalExecuter (function (pe) {
						startLeft = startLeft-12; 
						if (startLeft <= endLeft) {
							innerContainer.setStyle({left: (endLeft) + 'px'});
							pe.stop();
							oldContainer.remove();
							finderDisplay.select('.finder-display-level').each(function (item) {
								item.setStyle({ overflowY: 'auto' });
							});
						} else {
							innerContainer.setStyle({left: (startLeft) + 'px'});
						}
					}, 0.002);
				}
			}
		}.bind(finderDisplay);
		
		finderDisplay.addEvents = function (container) {
			container.select('li.up a').each( function (item) {
				item.observe('click', function(event) {
					finderDisplay.getContents(parseInt(this.readAttribute('rel')), 'up');
				}.bindAsEventListener(item));
			});
			
			container.select('li.down a').each( function (item) {
				item.observe('click', function(event) {
					finderDisplay.getContents(parseInt(this.readAttribute('rel')), 'down');
				}.bindAsEventListener(item));
			});
		}.bind(finderDisplay);
		
		finderDisplay.parseContents = function (content) {
			var element_ul = new Element('ul', { 'class': 'item' });
			content.each (function (item) {
				var element_li = new Element('li', { 'class': item.type });
				var element_a = new Element('a');
				if (item.type == 'link') {
					element_a.writeAttribute('href', item.value);
				} else {
					element_a.writeAttribute('href', 'javascript:void(0);');
					element_a.writeAttribute('rel', item.value);
				}
				element_a.update(item.name);
				element_li.insert(element_a);
				element_ul.insert(element_li);
			});
			var element_div = new Element('div', { 'class': 'finder-display-level' } );
			element_div.insert(element_ul);
			return element_div;
		}.bind(finderDisplay);
		
		finderDisplay.getContents = function (catUid, action) {
			//console.log(" finderDisplay.getContents called: catUid " + catUid + " action:" + action);
			var ajax_url = '?eID=commerce_modifier&id=71&catUid=' + catUid + '&startCatUid=' + finderDisplay.startCatUid;
			new Ajax.Request(ajax_url, {
				method: 'get',
				onSuccess: function(transport) {
					var content = transport.responseText.evalJSON();
					var contentContainer = finderDisplay.parseContents(content);
					var finderDisplay_innerContainer = finderDisplay.select('.finder-display-innerContainer').first();
					if (action == 'init') {
						finderDisplay_innerContainer.update(contentContainer);
						finderDisplay.addEvents(contentContainer);
						finderDisplay.show();
					} else if (action == 'up') {
						var finderDisplay_level = finderDisplay_innerContainer.select('.finder-display-level').first();
						var positionLeft = finderDisplay_level.positionedOffset().left - finderDisplay_level.getWidth();
						contentContainer.setStyle({'left':positionLeft + 'px'});
						finderDisplay_level.insert({before : contentContainer });
						finderDisplay.slide(finderDisplay_level.positionedOffset().left, positionLeft, finderDisplay_innerContainer, finderDisplay_level);
						finderDisplay.addEvents(contentContainer);
					} else if (action == 'down') {
						var finderDisplay_level = finderDisplay_innerContainer.select('.finder-display-level').first();
						var positionLeft = finderDisplay_level.positionedOffset().left + finderDisplay_level.getWidth();
						contentContainer.setStyle({'left':positionLeft + 'px'});
						finderDisplay_level.insert({after : contentContainer });
						finderDisplay.slide(finderDisplay_level.positionedOffset().left, positionLeft, finderDisplay_innerContainer, finderDisplay_level);
						finderDisplay.addEvents(contentContainer);
					}
				}
			});	
		}.bind(finderDisplay); 
		
		if (finderHasTrigger) { 
			finderTrigger.observe( 'click', function(event) {
				event.stop();
				var trigger = event.element().hasClassName('.finder-trigger') ? event.element() : event.element().up('.finder-trigger');
				if (trigger.toggleClassName('finder-trigger-active').hasClassName('finder-trigger-active')) {
					var triggerPosition = trigger.cumulativeOffset();
					var triggerDimensions = trigger.getDimensions();
					
					var topPosition = triggerPosition.top + triggerDimensions.height;
					var leftPosition = triggerPosition.left;
										
					finderDisplay.setStyle({
						top: parseInt(topPosition) + 'px',
						left: parseInt(leftPosition) + 'px'
					});
	
					finderDisplay.getContents(finderDisplay.initialValue, 'init');
				} else {
					finderDisplay.hide();
				}
			});
		} else {
			finderDisplay.getContents(finderDisplay.initialValue, 'init');
		}
	});
});


Event.observe(document, 'DOMContentLoaded', function(event) {
	var contactContainerArr = $$('.contact-container');
	if (contactContainerArr.length > 0) {
		var contactContainer = contactContainerArr.first().up();
		for (i = 0; i < contactContainerArr.length; i++) {
			var prevContainer = (i==0) ? contactContainerArr.length : i;
			prevContainer--;
			prevContainer = contactContainer.select('.contact-container-'+prevContainer).first();
			var backLink = contactContainer.select('.contact-container-'+i+' .imageslider .back').first();
			backLink.observe('click', function (event) {
				event.stop();
				elementClicked = event.element();
				elementClicked.up('.contact-container').removeClassName('contact-container-active');
				this.addClassName('contact-container-active');;
			}.bindAsEventListener(prevContainer));
			
			var nextContainer = (i==(contactContainerArr.length-1)) ? 0 : i+1;
			nextContainer = contactContainer.select('.contact-container-'+nextContainer).first();
			var forwardLink = contactContainer.select('.contact-container-'+i+' .imageslider .forward').first();
			forwardLink.observe('click', function (event) {
				event.stop();
				elementClicked = event.element();
				elementClicked.up('.contact-container').removeClassName('contact-container-active');
				this.addClassName('contact-container-active');;
			}.bindAsEventListener(nextContainer)); 
		}
	}
});