/**
 * Extending prototype
 */
// Defines a Event.delegate method allowing for bubbling delegation
Event.delegate = function(rules) {
   return function(_delegatedEvent) {
       var container = this, source = _delegatedEvent.element(), sourcePath = source.ancestors(), _delegateArguments = arguments;
       sourcePath.unshift(source);

       $A(sourcePath).each(function(element) {
           if (_delegatedEvent.cancelBubble == true || _delegatedEvent.stopped == true) { throw $break; }
           for (var selector in rules) {
               if (element.match(selector)) {
                   rules[selector].apply(element, $A(_delegateArguments));
               }
           }
           if (element == container) { throw $break; }
       });
   };
};

// Additional methods for all elements
//Element.addMethods({
//   delegate: function(element, eventName, rules) {
//       Event.observe(element, eventName, Event.delegate(rules));
//       return element;
//   }
//});

// Detect IE6
//Object.extend(Prototype.Browser, {
//    IE6: Prototype.Browser.IE && (typeof window.XMLHttpRequest == "undefined")
//});


/*
 * Quick Fix for Top Menu + IE
 * Adds .hover class to li
 */

Event.observe(window, 'load', function() {
   if (Prototype.Browser.IE) {
      $$('li.item').each(function(el) {
    	  el.observe('mouseover', function(e) {
		  	
			  var eventElementUp = Event.element(e).up('li.item');
			  
    		  Event.element(e).addClassName('hover');			  
			  if (eventElementUp != null) {
			  	eventElementUp.addClassName('hover');
			  }	

          });
      });

      $$('li.item').each(function(el) {
          el.observe('mouseout', function(e) {
		  	
			  var eventElementUp = Event.element(e).up('li.item');
			
        	  Event.element(e).removeClassName('hover');
			  
			  if (eventElementUp != null) {
			  	eventElementUp.removeClassName('hover');
			  }
			  
          });
      });      
    }
});

/*
 * Ajax Catalog
 * 
 * @TODO: Error Handling in Ajax Request (catalogUpdate)
 * @TODO: update Pager according to products limit per page
 * @TODO: Im 404 und Failure Handler (ajax request) das alert durch was sinnvolles aendern
 * 
 */

/*******************************************************************
* workaround "global" variables.
********************************************************************/
var _productListingObject = null;
var _colorTableElement = null;
var _min = 0;
var _max = 0;
var _minVal = 0;
var _maxVal = 0;
var _range = 0;
var _doRequest = true;
var _quickViewObject = null;
var _sizeTooltipObject = null;
var _semLandingObject = null;
var _myProductViewCarousel = null;
var _myProductDetailTabs = null;
var _extraHeightWatcher = null;
var _cartUpdate = null;
var _emailForm = null;
var _sharePopup = null;
var _quickAddToCart = null;
var _newsletterChecker =null;
/*******************************************************************/

/**
 * class productListing
 */
var productListing = Class.create({
	
	/**
	 * function initialize
	 * @param {Object} catid
	 * @param {Object} page
	 * @param {Object} color
	 * @param {Object} sizes
	 * @param {Object} requestUrl
	 * @param {Object} pager
	 * @param {Object} availableColors
	 */
	initialize: function(catid, page, color, sizes, requestUrl, pager, availableColors){
	
		//set workaround object
		_productListingObject  = this;		
		this.isRequesting = false;		
		this.doFilter = 'no';		
		this.catid = catid;
		this.page = page;
		this.pager = pager;
		this.sizes = sizes;
        this.sort = false;
        this.order = 'desc';
		this.color = color; //id or 'any'
		if(this.color != 'any') this.color = parseInt(this.color);

		//find out a way to change that!!!! what the hell
		this.limit = 28; //fix number		
		
		this.colorElements = $('color_selector') ? $('color_selector').select('option') : [];
		this.activeColorElement = $('color_selected');		
		this.availableColors = availableColors;		
		this.colorHash = new Hash();
		this.fillColorHash();
		this.requestUrl = requestUrl;	
		this.catalogContainer = $('product-listing-wrapper');
		this.ajaxLoaderDisplay = $('ajax-loader-display');
        this.anchor = '#';
        this.anchorTime = null;
		
		//initial things to do
        this.watchAnchor();
		
		this.observeValueToHidden();
		this.updateSizeEvents();
        this.updateSortEvents();
        this.updateOrderEvents();
		this.updatePagerEvent();
		this.updateColorEvents();
	},
	
	/**
	 * function observeValueToHidden
	 */	
	observeValueToHidden:function(){
		
		$('size_selector').observe("change", function(){
			$('size_selected').value = $('size_selector').value;
		});
		$('color_selector').observe("change", function(){
			$('color_selected').value = $('color_selector').value;
		});
		$('sort_selector').observe("change", function(){
			$('sort_selected').value = $('sort_selector').value;		
		});
	},

	/**
	 * function fillColorHash
	 * creates a color lookup table (hash) [id -> colorname] => [78 -> red]
	 */
	fillColorHash:function(){
		this.colorElements.each(function(elem){
			arr = elem.id.split(".");
			this.colorHash.set(arr[0], arr[1]);
		}.bind(this));
	},

	/**
	 * function watchAnchor
	 * watches for any changes to the current page anchor in the URI
	 */
    watchAnchor:function() {
	this.anchorTime = setInterval(function(){
		if (this.anchor != document.location.hash) {
			this.anchor = document.location.hash;
			if (this.anchor) {
				this.setParams(this.anchor.substring(1));
				this.catalogUpdate('page');
			}
		}
	}.bind(this), 400);
    },

	/**
	 * function disableWatchAnchor
	 * cancels anchor watching 
	 */
    disableWatchAnchor:function() {
		if (this.anchorTime) {
		    clearInterval(this.anchorTime);
		}
    },

	/**
	 * function setPageAnchor
	 * Set the page anchor with all current params 
	 */
    setPageAnchor:function() {
        // disable anchor watch so it doesn't start a new request
        this.disableWatchAnchor();
        // set anchor
        var hashAnchor = '#' + this.getParams();
        scroll(0,0);
        document.location.hash = hashAnchor;
        this.anchor = hashAnchor;
        // re-enable anchor watch
        this.watchAnchor();
    },
	
	/**
	 * function updateColorEvents
	 */
	updateColorEvents:function() {
    	$('color_selector').observe('change', this.fireColorChange.bind(this));
	},	

	/**
	 * function updateSizeEvents
	 * Grabs both sort-order arrow link and changes event to ajax request
	 */
	updateSizeEvents:function() {
        $('size_selector').observe('change', this.fireSizeChange.bind(this));
	},
	
	/**
	 * function updateSortEvents
	 */
    updateSortEvents:function() {
        $('sort_selector').observe('change', this.fireSortChange.bind(this));
    },
	
	/**
	 * function updateOrderEvents
	 */
    updateOrderEvents:function() {
        $('order_selector').observe('click', this.fireOrderChange.bind(this));
    },
	
	/**
	 * function updatePagerEvent
	 * Grabs the click event of pager TOP and BOTTOM and changes it to ajax request
	 */
	updatePagerEvent:function() {
		$$('ul.paging-elements').each(function(pagingElement){
			//grab event for page-nr links
			pagingElement.select('span.change-page').each(function(page){
				page.observe('click', this.firePageChange.bind(this));
			}.bind(this));
			//grab events for arrow right
			pagingElementRArrow = pagingElement.select('span.r-arrow-page').first();
			if(!Object.isUndefined(pagingElementRArrow)){
				pagingElementRArrow.observe('click', this.fireRightArrowEvent.bind(this));
			}
			//grab events for arrow left
			pagingElementLArrow = pagingElement.select('span.l-arrow-page').first();
			if(!Object.isUndefined(pagingElementLArrow)){
				pagingElementLArrow.observe('click', this.fireLeftArrowEvent.bind(this));
			}
		}.bind(this));
	},
	
	/**
	 * function doNothing
	 * let there be silence
	 * function is used to observe "nothing" in the pagers if the controlls should be blocked for the user
	 * if we would only remove the currently observed function, the href link from a-element will be processed
	 */
	doNothing:function(){},
	
	/**
	 * function disablePagerEvent
	 */
	disablePagerEvent:function() {
		$$('ul.paging-elements').each(function(pagingElement){
			//grab event for page-nr links
			pagingElement.select('span.change-page').each(function(page){
				page.observe('click', this.doNothing.bind(this));
			}.bind(this));
			
			//grab events for arrow right
			pagingElementRArrow = pagingElement.select('span.r-arrow-page').first();
			if(!Object.isUndefined(pagingElementRArrow)){
				pagingElementRArrow.observe('click', this.doNothing.bind(this));
			}
			//grab events for arrow left
			pagingElementLArrow = pagingElement.select('span.l-arrow-page').first();
			if(!Object.isUndefined(pagingElementLArrow)){
				pagingElementLArrow.observe('click', this.doNothing.bind(this));
			}
		}.bind(this));
	},	
	
	/**
	 * Event for changing the sizes-box value
	 * @param {Object} event
	 */
	fireSizeChange:function(event){
		event.stop();        
		this.resetPager();
		this.sizes = document.getElementById('size_selector').value;
		this.catalogUpdate('size');
	},
	
	/**
	 * Event for changing the colours
	 * @param {Object} event
	 */
    fireColorChange:function(event){
	event.stop();
    this.resetPager();
	this.color = document.getElementById('color_selector').value;
	this.catalogUpdate('color');
    },
	
	/**
	 * Event for changing sort order
	 * @param {Object} event
	 */
    fireSortChange:function(event){
    event.stop();
    this.resetPager();
	//This does not get the right value in IE ! Value is empty !!
	//this.sort = document.getElementById('sort_selected').value;
	this.sort = document.getElementById('sort_selector').value;	
	this.catalogUpdate('color');
    },
	
	/**
	 * Event for chaning sort direction
	 * @param {Object} event
	 */
    fireOrderChange:function(event) {
        event.stop();
        this.resetPager();
        if ($('order_selector').hasClassName('asc')) {
            this.order = 'desc';
        }
        else {
            this.order = 'asc';
        }
        this.catalogUpdate('color');
    },

	/**
	 * Page updates  - page-nrs, next/last-arrows
	 * @param {Object} event
	 */
	firePageChange:function(event) {
        event.stop();
		this.page = Event.element(event).innerHTML;	
		this.catalogUpdate('page');
	},
	
	/**
	 * Event for pager 'next'
	 * @param {Object} event
	 */
	fireRightArrowEvent:function(event) {
		event.stop();
		this.page = parseInt(this.page) + 1;
		this.catalogUpdate('page');
	},

	/**
	 * Event for pager 'previous'
	 * @param {Object} event
	 */
	fireLeftArrowEvent:function(event) {
		event.stop();
		this.page = parseInt(this.page) - 1;
		this.catalogUpdate('page');
	},
	
	/**
	 * 
	 * @param {Object} pager_html
	 */
	updatePager:function(pager_html){
		$$('div.pages').each(function(pagerElement){
			pagerElement.update(pager_html);
		}.bind(this));
	},

	/**
	 * Reset the page number to 1
	 */
    resetPager:function(){
            this.page = 1;
    },
	
	/**
	 * disable controls
	 */
	disableControls:function(){
		this.toggleSizeSelector(true);
        this.toggleColorSelector(true);
        this.toggleSortSelector(true);
        this.toggleOrderSelector(true);
		this.disablePagerEvent();
	},
	
	/**
	 * denable controls
	 */
	enableControls:function(){
		this.toggleSizeSelector(false);
        this.toggleColorSelector(false);
        this.toggleSortSelector(false);
        this.toggleOrderSelector(false);
		this.updatePagerEvent();
	},
	
	/**
	 * function toggleSizeSelector
	 * @param {Object} state
	 */
	toggleSizeSelector:function(state){
        $$('select.size-filter-element').each(function(elem){
		elem.disabled = state;
		}.bind(this));
	},
	
	/**
	 * function toggleColorSelector
	 * @param {Object} state
	 */
    toggleColorSelector:function(state){
        $$('select.color-filter-element').each(function(elem){
		elem.disabled = state;
		}.bind(this));
        },
		
	/**
	 * function toggleSortSelector
	 * @param {Object} state
	 */
    toggleSortSelector:function(state){
        $$('select.sort-filter-element').each(function(elem){
		elem.disabled = state;
		}.bind(this));
    },
	
	/**
	 * function toggleOrderSelector
	 * @param {Object} state
	 */
    toggleOrderSelector:function(state){
        $('order_selector').disabled = state;
        /* set correct arrow image */
        if (!this.order){
            this.order = 'asc';
        }
        // remove direction arrow when performing a search
        $('order_selector').removeClassName('asc');
        $('order_selector').removeClassName('desc');
        if (state === false){
            $('order_selector').addClassName(this.order);
        }
    },

	/**
	 * function catalogUpdate
	 * @param {Object} type
	 */
	catalogUpdate:function(type) {
				
		if(!this.isRequesting){
			this.isRequesting = true;

			try{
				//disable controls
				this.disableControls();
				//fade out current content
				this.fadeOut();
                // set params for request
                var params = this.getParams() + '&limit=' + String(this.limit);
				new Ajax.Request(this.requestUrl, {
			  		method: 'post',
			  		parameters: params,
			  		onSuccess: function(transport){   //success handler
				  	this.isRequesting = false;
					var result = transport.responseText.evalJSON();		
					var newCatalog = result.content.product_html;  
					var options = result.content.options;
					//update pager gui
					this.updatePager(result.content.pager_html);
					//update product listing

					this.catalogContainer.update(newCatalog);
		
					if(type == 'size'){
						this.synchronizeSizeBoxes();
					}
					
					//enable controls
					this.enableControls();
						
					//enable quickView click observers
					_quickViewObject.reset(result.content.product_ids);

					//enable size mouseover observers
					_sizeTooltipObject.initializeObservers();
		                                        
		            // set new page anchor
		            this.setPageAnchor();
										
					//fade in new content
					this.fadeIn();
			
		  			}.bind(this),
					
					/**
					 * 404 handler
					 * @param {Object} transport
					 */
				  	on404: function(transport){
					  	this.isRequesting = false;
					  	this.enableControls()
					  	this.catalogContainer.update("<p>Your request couldn't be fullfilled - 404 handler</p>");
					  	this.fadeIn();
				  	}.bind(this),
					
		  			/**
		  			 * //failure handler
		  			 * @param {Object} transport
		  			 */
			  		onFailure: function(transport){
					  	this.isRequesting = false;
					  	this.enableControls()
					  	this.catalogContainer.update("<p>Your request couldn't be fullfilled - failure handler</p>");
					  	this.fadeIn();
					}.bind(this)					  
				});
			}
			catch(e){}
		}
	},	

	/**
	 * function synchronizeSizeBoxes
	 * Syncronizes the values of both size select boxes (e. g. both values to: S / M)
	 */
	synchronizeSizeBoxes:function(){
		$$('select.size-filter-element').each(function(elem){
		 	idx = 0;
		 	elem.select('option').each(function(option){
				if(option.value != this.sizes)
					option.writeAttribute("selected", null);
				else{
					option.writeAttribute("selected", "selected");
					elem.selectedIndex = idx;
				}
				idx++;
			}.bind(this));
		}.bind(this));
	},

	/**
	 * function fadeIn
	 * fades in all elements we want to fade in
	 */
 	fadeIn:function(){
 		//bottom toolbar 
 		toolbars = $$('div.toolbar');
 		if(toolbars.length > 1)
	   		new Effect.Opacity(toolbars.last(), { from: 0.0, to: 1.0, duration:0.2});
 		//content
 		new Effect.Opacity(this.catalogContainer, { from: 0.0, to: 1.0, duration:0.3}); 		
		return;
 	},

	/**
	 * function fadeOut
	 * fades out all elements we want to fade out
	 */
 	fadeOut:function(){
 		toolbars = $$('div.toolbar');
 		if(toolbars.length > 1)
	   		new Effect.Opacity(toolbars.last(), { from: 1.0, to: 0.0, duration:0.2});
 		new Effect.Opacity(this.catalogContainer, { from: 1.0, to: 0.0, duration:0.2}); 		
		return;
 	},
	
	/**
	 * function getParams
	 * get a parameter string for request
	 */
	getParams:function(){
		params = 'catid=' + String(this.catid) + 
		'&color=' + String(this.color) + 
		/*'&avcolors=' + this.availableColors.join(",") + */
		'&sort=' + String(this.sort) +
		'&sizes=' + String(this.sizes) +
		'&p=' + String(this.page) +
		'&order=' + String(this.order);		
		return params;
	},
	
	/**
	 * function setParams
	 * set parameters given a params string
	 * @param {Object} params
	 */
    setParams:function(params){
		var splitpars = params.split('&');
		for (i=0;i<splitpars.length;i++){
			if (splitpars[i].length > 0) {
				var pieces = splitpars[i].split('=');
				switch (pieces[0]) {
				    case 'catid':
				        this.catid = pieces[1];
				        break;
				    case 'color':
				        this.color = pieces[1];
				        break;
				    case 'avcolors':
				        this.avcolors = pieces[1].split(',');
				        break;
				    case 'sort':
				        this.sort = pieces[1];
				        break;
				    case 'sizes':
				        this.sizes = pieces[1];
				        break;
				    case 'name':
				        this.name = pieces[1];
				        break;
				    case 'p':
				        this.page = pieces[1];
				        break;
				    case 'order':
				        this.order = pieces[1];
				        break;
				}
			}
		}
	}
});

/**
 * simple pager - if pager is used standalone (no ajax catalog) 
 */
var simplePager = Class.create({
	initialize: function(){
	    this.url = '';
	    this.page = 1;
	    this.setBaseUrl();
	    // watch page buttons for clicks
	    this.updatePagerEvent();
	},

	/**
	 * funtion updatePagerEvent
	 */
	updatePagerEvent:function() {
		$$('ul.paging-elements').each(function(pagingElement){
			//grab event for page-nr links
			pagingElement.select('span.change-page').each(function(page){
				page.observe('click', this.firePageChange.bind(this));
			}.bind(this));
			//grab events for arrow right
			pagingElementRArrow = pagingElement.select('span.r-arrow-page').first();
			if(!Object.isUndefined(pagingElementRArrow)){
				pagingElementRArrow.observe('click', this.fireRightArrowEvent.bind(this));
			}
			//grab events for arrow left
			pagingElementLArrow = pagingElement.select('span.l-arrow-page').first();
			if(!Object.isUndefined(pagingElementLArrow)){
				pagingElementLArrow.observe('click', this.fireLeftArrowEvent.bind(this));
			}
		}.bind(this));
	},

	/**
	 * function firePageChange
	 * @param {Object} event
	 * Page updates  - page-nrs, next/last-arrows
	 */
	firePageChange:function(event) {
        event.stop();
		page = Event.element(event).innerHTML;
		this.gotoPage(page);
	},

	/**
	 * function fireRightArrowEvent
	 * @param {Object} event
	 * Event for pager 'next'
	 */
	fireRightArrowEvent:function(event) {
		event.stop();
		page = parseInt(this.page) + 1;
		this.gotoPage(page);
	},

	/**
	 * function fireLeftArrowEvent
	 * @param {Object} event
	 * Event for pager 'previous'
	 */
	fireLeftArrowEvent:function(event) {
		event.stop();
		page = parseInt(this.page) - 1;
		this.gotoPage(page);
	},
	
	/**
	 * function gotoPage
	 * @param {Object} page
	 */
    gotoPage:function(page) {
    	document.location = this.url + '&p=' + page;
    },
	
	/**
	 * function setBaseUrl
	 */
    setBaseUrl:function(){
        var cUrl = document.location.href;
        var urls = cUrl.split('?');
        var base = urls[0];
        if (urls.length > 1) {
            base += '?';
        }
        var paramStr = urls[1];
        var params = paramStr.split('&');
        if (params.length > 0) {
        	for (var i=0;i<params.length;i++) {
            	paramfields = params[i].split('=');
                if (paramfields[0] != 'p') {
                	base += params[i] + '&';
                }
                else {
                // set current page
                	if (paramfields[1]) {
                    	this.page = paramfields[1];
                    }
                }
            }
            base = base.slice(0, -1);
        }
        this.url = base;
    }
});

var branchSelected="";
var checked=false;

/**
 * function checkInitial
 * @param {Object} branch
 */
function checkInitial(branch){
    if(checked){
       return 1;
    }
    if (document.getElementById("nav_brands").style.display=='none' && document.getElementById("nav_products").style.display!='none' ){
        branchSelected="products";
    }else if (document.getElementById("nav_products").style.display=='none' && document.getElementById("nav_brands").style.display!='none'){
        branchSelected="brands";
    }
    checked=true;
    if(branchSelected!=branch){
        return 1;
    }
    return 2;
}

/**
 * function animateLeftTree
 * @param {Object} branch
 */
function animateLeftTree(branch){
    if( checkInitial(branch)==2){
        return true;
    };
    if(branchSelected!=branch){
        branchSelected=branch;
        if(branch=='products'){
            otherBranch='brands';
            document.getElementById("click_to_products").className="header-tabs selected";
            document.getElementById("click_to_brands").className="header-tabs ";
        }else if(branch=='brands'){
            otherBranch='products';
            document.getElementById("click_to_brands").className="header-tabs selected";
            document.getElementById("click_to_products").className="header-tabs ";
        }
        Effect.BlindUp('nav_' +otherBranch);
        Effect.BlindDown('nav_' +branch);
        //document.getElementById("nav_"+otherBranch).style.display="none";
    }
}

/*****************************************************************************************
 * new stuff outsourced from phtml files by kathrin (if your looking for someone to blame)
******************************************************************************************/


/**
 * class quickView
 * for quickView on product list
 */
var MyQuickView = Class.create({

	MODE_PREVIOUS: -1,
	MODE_NEXT: 1,
	MODE_INDEX: 0,

	PREFETCH_COUNT_PAGING: 2,
	PREFETCH_COUNT_INDEX: 3,
	PREFETCH_MAX_DISTANCE_PAGING: 0,
	PREFETCH_MAX_DISTANCE_INDEX: 3,

	DURATION_FADING: 0.5,
	DURATION_SLIDING: 0.5,

	SLIDE_WIDTH: 526,

	initialize: function(container, collection){
		// No Quickview for dinosaurs
		if (Prototype.Browser.IE6) { return; }

		this._element = $(container);
		if (!this._element) { return; }

		this._deck = (new Element('div')).addClassName('quickview-deck');

		this.reset(collection);

		this._element.down('.quick-content').update(this._deck);
		this._initEventHandling();

		_quickViewObject = this;
	},

	reset: function(collection) {
		this._collection = $A(collection);
		this._currentIndex = 0;
		this._size = this._collection.length || 0;

		this._deck.update('').setStyle({ 'width': (this.SLIDE_WIDTH * this._size) + 'px' });

		this._collection.each(function(productId, position) {
			var slide = (new Element('div')).addClassName('quickview-slide');

			slide._quickview_id = productId;

			this._deck.insert({ 'bottom': slide });
		}, this);

		this._requestedProducts = [];
	},

	showQuickView: function(productId) {
		var index = this._collection.indexOf(productId);
 		if (index == -1) { return; }
		this._currentIndex = index;
		this._loadContent(this.MODE_INDEX);
		this._deck.setStyle({ position: 'absolute', top: '0px', left: (-this.SLIDE_WIDTH*this._currentIndex)+'px'});
		this._updateNavigation();
		if (Prototype.Browser.IE) {
			this._element.show();
		} else {
			Effect.Appear(this._element,{ duration: this.DURATION_FADING, position: 'front'});
		}
		this._track(true);
	},

	showNext: function() {
		this._moveSlide(this.MODE_NEXT);
	},

	showPrevious: function() {
		this._moveSlide(this.MODE_PREVIOUS);
	},

	_moveSlide: function(mode) {
		if ((mode == this.MODE_PREVIOUS && this._currentIndex <= 0) ||
				(mode == this.MODE_NEXT && this._currentIndex >= this._size - 1)) { return; }
		this._loadContent(mode);
		this._currentIndex += (mode == this.MODE_PREVIOUS ? -1 : 1);
		this._updateNavigation();
		new Effect.Move(this._deck, { x: -this._currentIndex*this.SLIDE_WIDTH, y: 0, mode: 'absolute', duration: this.DURATION_SLIDING });
		this._track(false);
	},

	_loadContent: function(mode) {
		var index = this._currentIndex, indexIncrement = 1, distance = 0,
			prefetch_count = this.PREFETCH_COUNT_PAGING,
			max_distance = this.PREFETCH_MAX_DISTANCE_PAGING,
			productIds2fetch = [], slide;

		switch (mode) {
			case this.MODE_NEXT:
				break;
			case this.MODE_PREVIOUS:
				indexIncrement = -1;
				break;
			default:
				index -= index ? 2 : 1;
				prefetch_count = this.PREFETCH_COUNT_INDEX;
				max_distance = this.PREFETCH_MAX_DISTANCE_INDEX;
				break;
		}

		while (true) {
			if (productIds2fetch.length >= prefetch_count ||
					(max_distance && distance++ > max_distance) ||
					!(slide = this._deck.down('div.quickview-slide', (index += indexIncrement)))) { break; }
			if (this._requestedProducts.include(slide._quickview_id)) { continue; }
			productIds2fetch.push(slide._quickview_id);
		}

		if (!productIds2fetch.length) { return; }

		this._requestedProducts = this._requestedProducts.concat(productIds2fetch);

		new Ajax.Request('/remoteajax/quickview/product/ids/'+productIds2fetch.join(',')+'/', {
			evalJSON: 'force',
			method: 'get',
			asynchronous: true,
			onSuccess: (function(transport) {
				var json;
				if (!(json = $H(transport.responseJSON)) || !json.size()) { return; }
				json.each(function(it) {
					var index, element;
					if ((index = this._collection.indexOf(it.key)) == -1 ||
							!(slide = this._deck.down('div.quickview-slide', index))) { return; }
					slide.update(it.value);
					slide.addClassName('quickview-slide-loaded');
				}, this);
			}).bind(this)
		});
	},

	_updateNavigation: function() {
		this._element.down('.quick-left')[(this._currentIndex <= 0? 'add':'remove')+'ClassName']('disabled');
		this._element.down('.quick-right')[(this._currentIndex >= this._size - 1? 'add':'remove')+'ClassName']('disabled');
	},

	_initEventHandling: function() {
 		this._element.delegate('click', {
			'.quick-close': (function(event) {
				event.stop();
				if (Prototype.Browser.IE) {
					this._element.hide();
				} else {
					Effect.Fade(this._element,{ duration: this.DURATION_FADING });
				}
			}).bind(this),
			'.quick-navigation .clickable': function(event) {
				event.stop();
				var div = this.up('div');
				if (div.hasClassName('disabled')) { return; }
				_quickViewObject['show'+(div.hasClassName('quick-left')?'Previous':'Next')]();
			},
			'.addToCartButton': function(event) {
				event.stop();
				var cartForm = this.up('form'), selectElement;
				if (!cartForm) { return; }

				if ((selectElement = cartForm.down('.choose-size select')) && $F(selectElement) == '_null') {
					selectElement.addClassName('validation-failed');
				} else {
                        //cartForm.submit();
                        //call quick-addtocart popup
                        _quickAddToCart.popUp(cartForm);
				}
			},
			'.size-table': function(event) {
				event.stop();
				window.open("/groessen-uebersicht", "popsize","width=750,height=400,left=300,top=200,location=no,menubar=no,status=no,toolbar=no,resizable=no,scrollbars=yes");
			}
		});

		if (!$('product-listing-wrapper')) { return; }
		$('product-listing-wrapper').delegate('click', {
			'.quickViewTrigger': function(event) {
				event.stop();
				_quickViewObject._triggerHandler(this, event);
			}
		});
	},

	_triggerHandler: function(button, event) {
		var productId, container, productIdElement;
		if (!button || !(container = button.up('.product_wrapper')) ||
				!(productIdElement = container.down('.product_id')) ||
				!Number(productId = productIdElement.innerHTML)) { return; }
		this.showQuickView(productId);
	},

	_track: function(init) {
		try {
			var currentProductId = this._deck.down('.quickview-slide', this._currentIndex)._quickview_id;
			pageTracker._trackPageview("/quickview/"+currentProductId+(init?'/start':''));
			logOCPV('pover=quickview-'+currentProductId+(init?'-start':''));
		} catch(e) {}
	}

});




/**
 * class sizeTooltip
 * for size tooltip on category page
 */
var sizeTooltip = Class.create({
	
	/**
	 * function initialize
	 */
	initialize: function(){
		this.initializeObservers();
		this.counter = 0;
		//set workaround object
		_sizeTooltipObject = this;
	},

	/**
	 * function initializeObservers
	 */
	initializeObservers:function(){
 		var productsArray = $$('.product_wrapper');
		productsArray.each(function(prod){
			
			var tooltip = prod.select('.sizeTooltip');
			
			if(tooltip.length > 0){
				this.observeMouseOver(prod);
			}
			
		}.bind(this)
		)		
	},

	/**
	 * function observeMouseOver
	 * @param {Object} prod
	 */
	observeMouseOver:function(prod){
		prod.observe('mouseover', this.showTooltip.bind(this));	
	},

	/**
	 * function showTooltip
	 * @param {Object} event
	 */
	showTooltip:function(event){	
		this.counter++;
		
		var elem = Event.element(event);
		if(!elem.hasClassName('product_wrapper')){
			elem = elem.up('.product_wrapper');	
		}
		elem.stopObserving('mouseover');		
		var tooltip = elem.select('.sizeTooltip');
		
		Effect.BlindDown(tooltip[0],{ duration: 0.1, position: 'front'});
				
		Effect.BlindUp(tooltip[0], 
			{
				duration: 0.2, 
				delay: 3.0, 
				afterFinish:function(){
					_sizeTooltipObject.observeMouseOver(elem)
				} 
			}
		);	

		// No quickview for dinosaurs
		if (Prototype.Browser.IE6) { return; }

		// dirty hack!! TODO
		var quickView = elem.select('.quickViewTrigger');
		Effect.BlindDown(quickView[0],{ duration: 0.1, position: 'front'});

		Effect.BlindUp(quickView[0],
			{
				duration: 0.2,
				delay: 3.0
	}			
		);
	}
}); 

/**
 * class semLanding
 * animating left navigation tree on sem landing pages
 */

var semLanding = Class.create({
	
	/**
	 * function initialize
	 */
	initialize: function(){
		this.initializeObservers();
		//set workaround object
		_semLandingObject = this;
	},

	/**
	 * function initializeObservers
	 * observer for click event
	 */
	initializeObservers:function(){
		$('more-brands-trigger').observe("click", function(){
			$('more-brands-container').style.display = "block";
			$('more-brands-trigger').style.display = "none";
			$('current-brand').style.display = "none";
		});
		$('more-products-trigger').observe("click", function(){
			$('more-products-container').style.display = "block";
			$('more-products-trigger').style.display = "none";
			$('current-product').style.display = "none";
		});
	}
});

/**
 * class myProductViewCarousel
 * carousel in productdetail page
 */
var myProductViewCarousel = Class.create({
	
	/**
	 * initialize
	 */
	initialize: function(position){
		this.position = parseInt(position);
                this.hCarousel = null;
                this.first = true; // stuff to do on first run
		//set workaround object
		_myProductViewCarousel = this;
		this.runCarousel();
	},
	
	/**
	 * function runCarousel
	 */
	runCarousel:function() {
            this.hCarousel = new UI.Carousel("horizontal_carousel");
            this.hCarousel.
                observe('scroll:ended', function(event) {
                    this.display();
                }.bind(this));
            if (this.position > 0) {
                this.hCarousel.scrollTo(this.position)
            }
            else {
                this.display();
            }
	},

        /**
         * Make carousel visible and loader invisible.
         */
        display:function() {
            if (this.first) {
                $('horizontal_carousel').removeClassName('unvisible');
                $('loader').addClassName('unvisible');
                this.first = false;
            }
        }
});

var myProductDetailTabs = Class.create({
	
	/**
	 * initialize
	 */
	initialize: function(){
		//set workaround object
		_myProductDetailTabs = this;
		this.initializeObservers();
	},
	
	/**
	 * function initializeObservers
	 */
	initializeObservers:function(){
		
		$('tab1').observe("click", function(){
			$('tab2-content').style.display = "none";
			$('tab3-content').style.display = "none";
			$('tab4-content').style.display = "none";
			$('tab1-content').style.display = "block";
			$('tab2').removeClassName('active');
			$('tab3').removeClassName('active');		
			if($('tab4')){
				$('tab4').removeClassName('active');
			}
			$('tab1').addClassName('active');						
		});
		$('tab2').observe("click", function(){
			$('tab1-content').style.display = "none";
			$('tab3-content').style.display = "none";
			$('tab4-content').style.display = "none";
			$('tab2-content').style.display = "block";
			$('tab1').removeClassName('active');
			$('tab3').removeClassName('active');		
			if($('tab4')){
				$('tab4').removeClassName('active');
			}
			$('tab2').addClassName('active');									
		});								
		$('tab3').observe("click", function(){
			$('tab1-content').style.display = "none";
			$('tab2-content').style.display = "none";
			$('tab4-content').style.display = "none";
			$('tab3-content').style.display = "block";
			$('tab1').removeClassName('active');
			$('tab2').removeClassName('active');		
			if($('tab4')){
				$('tab4').removeClassName('active');
			}
			$('tab3').addClassName('active');									
		});	
		if($('tab4')){
			$('tab4').observe("click", function(){
				$('tab1-content').style.display = "none";
				$('tab2-content').style.display = "none";
				$('tab3-content').style.display = "none";
				$('tab4-content').style.display = "block";
				$('tab1').removeClassName('active');
				$('tab2').removeClassName('active');
				$('tab3').removeClassName('active');
				$('tab4').addClassName('active');
			});
		};
	}
});

/**
 * class extraHeightWatcher
 * for setting the height for the sidebar on the big version
 */
var extraHeightWatcher = Class.create({
		
	initialize:function(){
		//set workaround object
		_extraHeightWatcher = this;
		this.height = null;
		this.setHeight();
		setInterval(function(){
			this.setHeight();
		}.bind(this), 400)
	},
	
	setHeight:function(){

		var sideBarHeight = 0;
		// get height of main column
		var mainHeight = $$('.col-main')[0].getHeight();
		
		var elts = document.getElementsByClassName('col-left');
		if(elts.length == 0){
		}
		else {
			// get height of sidebar column
		    var sideBarHeight = $$('.col-left')[0].getHeight();
		}
		//if col-main is smaller than sidebar take the sidebar height
		if(sideBarHeight > mainHeight){			
			mainHeight = sideBarHeight;
		}
		// if recently viewed products, subtract
		var recentlyViewed = $('recently-viewed');
		var recentlyHeight = 0;
		if(recentlyViewed != null){
			recentlyHeight = recentlyViewed.getHeight() % 100;
		}		

		// compute height of extra column (steps of 100px)
		var extraHeight = Math.round((mainHeight/100))*100+recentlyHeight;
		$('wide-extra').style.height = extraHeight + "px";
	}
});

/**
 * class newsletterChecker
 * for subscribing to newsletter, checks valid email, sets text and styling
 */
var newsletterChecker = Class.create({
		
	initialize:function(){
		//set workaround object
		_newsletterChecker = this;
	},

	f:function(){
		//return false;
	},

	addToNewsletter:function() {

		var emailAddress = $F('newsletterEmail');

		new Ajax.Request('/newsletterchecker/', {
	        method:'post',
	        parameters: {
	            email: emailAddress
	        },
	        onComplete:function(req){

	        	if (req.status == 200){
					var msgText = '';

					if(req.responseText.match('OK')){
						msgText = 'Sie haben sich erfolgreich für unseren Newsletter angemeldet!';
						$('news').style.display = "none";
						$('newsletter-info').style.padding = "15px 0 0 0";
						$('newsletterEmail').style.border = "1px solid #AAAAAA";
						$('newsletterEmailBtn').style.border = "none";
						$('newsletter-info').style.color = "#000";
					}else if(req.responseText.match('IS_THERE')){
						msgText = 'Sie haben sich mit dieser Emailaddresse bereits angemeldet!';
						$('news').style.display = "none";
						$('newsletter-info').style.color = "#AA0B31";
						$('newsletter-info').style.padding = "15px 0 0 0";
						$('newsletterEmail').style.border = "1px dotted #AA0B31";
					}else if(req.responseText.match('INVALID_EMAIL')){
						msgText = 'Bitte geben Sie eine korrekte Emailaddresse an!';
						$('news').style.display = "none";
						$('newsletter-info').style.color = "#AA0B31";
						$('newsletter-info').style.padding = "15px 0 0 0";
						$('newsletterEmail').style.border = "1px dotted #AA0B31";
					}
					$('newsletter-info').update(msgText);
					$('newsletterEmail').value = 'E-Mail';
	        	  }
	        }
	    });
	}
});
var cartUpdate = Class.create(
{
	initialize:function(){
		//set workaround object
		_cartUpdate = this;
		
		var url =  '/remoteajax/';
    	// notice the use of a proxy to circumvent the Same Origin Policy.

	    new Ajax.Request(url, {
	      method: 'get',
	      onSuccess: function(transport) {
	          response=transport.responseText.evalJSON();
	          $('header-cart-articles-count').innerHTML=response.shoppingBasketArticles;
	          $('header-cart-articles-total').innerHTML=response.shoppingBasketTotal;
			  
			  if(response.promoCredit) {
			  				  					
				$('coupon-message').innerHTML=response.promoCredit;					
				$('coupon').style.display = "block";		
			  }
			  
			  else if(response.coupon){
	          	$('coupon-message').innerHTML=response.coupon;
				$('image-div-id').innerHTML=response.imageHTML;	
				$('coupon').style.display = "block";
			  }			  
	      }
	    });
	}	
});

var similarProducts = Class.create({
	
	initialize:function(id){
		var url = '/remoteajax/similarproducts/product/id/' + id + '/';
		new Ajax.Request(url, {
			method: 'get',
			onSuccess: function(transport) {
				response=transport.responseText;
				$('similarproducts').innerHTML=response;
			}
		});
	}
	

});


var emailForm = Class.create({
    initialize:function(){
        _emailForm = this;
        this.watch();
    },
    watch:function(){
        $('emailLink').observe("click", function(event){
            event.stop();
            this.showPop();
        }.bind(this));
        $('promotion-overlay').observe("click", function(event){
            event.stop();
            this.hidePop();
        }.bind(this));
        $('social-email-close').observe("click", function(event){
            event.stop();
            this.hidePop();
        }.bind(this));
    },
    hidePop:function(){
        $('promotion-email-form').style.display = 'none';
        $('promotion-overlay').style.display = 'none';
    },
    showPop:function(){
        $('promotion-email-form').style.display = 'block';
        $('promotion-overlay').style.display = 'block';
    }
});

var sharePopup = Class.create({
    initialize:function(){
        _sharePopup = this;
        this.watch();
    },
    watch:function(){
        $$('.sharePopup').each(function(elt) {
            elt.observe("click", function(event){
                event.stop();
                this.showPop();
            }.bind(this))
        }.bind(this));
        $('promotion-overlay').observe("click", function(event){
            event.stop();
            this.hidePop();
        }.bind(this));
        $('social-close-btn').observe("click", function(event){
            event.stop();
            this.hidePop();
        }.bind(this));
    },
    hidePop:function(){
        $('share-link-popup').style.display = 'none';
        $('promotion-overlay').style.display = 'none';
    },
    showPop:function(){
        $('share-link-popup').style.display = 'block';
        $('promotion-overlay').style.display = 'block';
    }
});

var MyFFClickNotifier = {
	_data: $H(),
	register: function(element_id, data) {
		if (!this._data.get(element_id)) {
			this._data.set(element_id, data);
			this._onReady(function() {
			    $(element_id).select('a').each(function(el) {
			    	  el.observe('click', MyFFClickNotifier._notify.bind(MyFFClickNotifier, element_id));
			    });
			});
		}
	},
	_notify: function(element_id, event) {
		if (data = this._data.get(element_id)) {
			new Ajax.Request('/static/ff/scic.php', { parameters: this._data.get(element_id), asynchronous: false });
		}
	},
	_onReady: function(f) {
	    if (document.body) f();
	    else document.observe('dom:loaded', f);
	}
}

var quickAddToCart = Class.create({
    initialize:function() {
        _quickAddToCart = this;
        this.hidePopup();
        this._initializeObservers();
    },
    _initializeObservers:function() {
        $$('#gocart-continue .continue')[0].observe('click', function(event) {
            Event.stop(event);
            this._continueShopping();
        }.bind(this));
        $$('#gocart-continue .addtocart')[0].observe('click', function(event) {
            Event.stop(event);
            this._goToCart();
        }.bind(this));
        // clicks on overlay return to shopping
        $('gocart-overlay-layer').observe('click', function(event) {
            Event.stop(event);
            this._continueShopping();
        }.bind(this));
    },
    hidePopup:function() {
        $('gocart-continue').style.display = 'none';
        $('gocart-overlay-layer').style.display = 'none';
        this._hideContent();
    },
    /* Show quick-add popup, first validate, add product to cart, then update cart.
     * Boolean doCheck param only used for product view */
    popUp:function(form) {
        // disable popup for ie6
        if (Prototype.Browser.IE) {
            form.submit();
			return;
        }
        $('gocart-continue').style.display = 'block';
        $('gocart-overlay-layer').style.display = 'block';
        // show ajax loader
        this._showLoader();
        this._addToCart(form);
        // hide ajax loader
        this._hideLoader();
        // show popup content
        this._showContent();
        this._updateCart();
    },
    _continueShopping:function() {
        // close popup and return to page
        this.hidePopup();
        // hide content
        this._hideContent();
    },
    _goToCart:function() {
        // redirect to the cart
        goTo('*checkout*cart');
    },
    /* form param must be a prototype extended element */
    _addToCart:function(form) {
        // add products to cart
        form.request({asynchronous: false});
    },
    _updateCart:function() {
        _cartUpdate.initialize();
    },
    _showLoader:function() {
        $$('#gocart-continue .loader')[0].style.display = 'block';
    },
    _hideLoader:function() {
        $$('#gocart-continue .loader')[0].style.display = 'none';
    },
    _showContent:function() {
        $$('#gocart-continue .content')[0].style.display = 'block';
    },
    _hideContent:function() {
        $$('#gocart-continue .content')[0].style.display = 'none';
    }
});

var dynamicLinks = Class.create({
    initialize:function() {
        var content = $$(".col-main").first();
        var self = $$(".block-category-dynamic").first();

        var content_top = content.cumulativeOffset().top;
        var content_height = content.getHeight();
        var self_top = self.cumulativeOffset().top;
        var self_height = self.getHeight();
        var margin = content_height - (self_top - content_top) - self_height;
        if(margin < 10) margin = 10;

        self.style.marginTop = margin+"px";
    }
});