﻿/**
 * Eve.ItemPager
 *
 * WAS STELLT DIESE DATEI ZUR VERFUEGUNG?
 *
 * 		- Erstellt einen Pager fuer "Items".
 *
 * WAS BENOETIGT DIESE DATEI?
 *
 * 		- jquery.js (jQuery-Framework)
 *		- Eve.js
 *
 * LETZTE AENDERUNGEN:
 *		2009-05-11 17:30	Die Methode .onBtnClick und den Konstruktor fuer HBX-Tracking angepasst (hans-peter.beck@eventim.de)
 * 		2009-04-08			Erstellt (hans-peter.beck@eventim.de)
 *
 * Copyright 2009 by CTS Eventim AG.
 */
 

/**
 * Klasse zum Erstellen von Pagern fuer "Items".
 *
 * An Hand des Containers wird darin nach bestimmten HTML-Tags gesucht, die die Items darstellen.
 *
 * @class	Eve.ItemPager
 * @base	Eve
 * @constructor
 * @param	{object}	options					Optionshash:
 * @param	{element}	options.containerEl		DOM-Element in dem ein zu kuerzender Quellcode enthalten ist.
 * @param	{string}	options.itemSelektor	Optional: jQuery-Selektor der innerhalb des Containers angewandt wird, um die "Items" zu finden (Default 'li').
 * @param	{integer}	options.itemsPerPage	Optional: Anzahl der Items pro Seite (Default 5).
 * @param	{string}	options.containerId		Optional: ContainerId in der der Pager dargestellt werden soll. Wenn nicht angegeben wird der Pager in options.containerEl abgelegt.
 * @param	{string}	options.lastItemCls		Optional: Eine auf das letzte sichtbare Item zu setzende CSS-Klasse (um evtl. Abschlusslinien zu vermeiden oder so).
 * @param	{string}	options.prefix			Optional: Prefix, z. B. "blaettern", welches vor die Liste gesetzt wird.
 * @param	{string}	options.hbxPrefix		Optional: Wenn gesetzt, werden die Pager-Links mit HBX-Tracking ausgestattet, wobei options.hbxPrefix als Prefix vor die Seite gesetzt wird.
 */
Eve.ItemPager = function(options) {

	/** Wenn es das Element nicht gibt, dann abbrechen. */
	if(!(this.el = options.containerEl || false)) return;
	
	this.itemSelektor = options.itemSelektor || 'li';
	this.itemsPerPage = options.itemsPerPage || 5;
	this.containerId  = options.containerId || false;
	this.lastItemCls  = options.lastItemCls || 'last';
	this.prefix       = options.prefix || false;
	this.hbxPrefix    = options.hbxPrefix || false;
	
	// Sicherstellen dass es einen Container gibt, in dem der Pager abgelegt werden kann
	this.pagerContainerEl = (this.containerId) ? (jQuery('#' + this.containerId).get(0) || this.el) : this.el ;
		
	/** Start! */
	this.initialize();
};

Eve.ItemPager.prototype = {
	
	/**
	 * Sucht nach allen Items, berechnet wieviele "Button" fuer die jeweiligen Seiten
	 * im Pager erstellt werden muessen und belegt diese mit den entsprechenden Events.
	 *
	 * @member	Eve.ItemPager
	 */
	initialize : function() {
		
		this.items = jQuery(this.el).find(this.itemSelektor);	
		
		if (this.items.length > this.itemsPerPage) this.createPager();
	},
	
	/**
	 * Erstellt Pager mit entsprechenden Events.
	 *
	 * @member	Eve.ItemPager
	 */
	createPager : function() {
		
		var tmpButtons = Math.ceil(this.items.length / this.itemsPerPage);
		
		this.pagerUl = document.createElement('ul');
		this.pagerUl.className = 'pager floatLeft last';
		this.pagerUl.style.display = 'none';
		
		this.pagerBtns = [];
		
		for (var i = 1; i <= tmpButtons; i++) {
			
			this.pagerBtns[i] = document.createElement('li');
			this.pagerBtns[i].innerHTML = '<a href="javascript:void(0);" title="' + (eveMessages.ItemPager.page || 'page') + ' ' + i + '">' + i + '</a>';
			
			// onClick-Event
			jQuery(this.pagerBtns[i]).bind('mousedown', this.onBtnClick.scope(this, [i]));
			
			jQuery(this.pagerUl).append(this.pagerBtns[i]);
		};
		
		jQuery(this.pagerContainerEl).append(this.pagerUl);
		
		var tmpFunc = function() {
			
			jQuery(this).fadeIn(1000);
			
		}.defer(250, this.pagerUl);
		
		tmpFunc();
		
		// Prefix erstellen
		if((this.prefix || false)) {
			
			this.prefixEl = document.createElement('span');
			this.prefixEl.className = 'moreText marginRightXS';
			this.prefixEl.innerHTML = this.prefix;
			
			jQuery(this.pagerContainerEl).prepend(this.prefixEl);
		}
		
		// Merker setzen, dass gerade noch initialisiert wird ...
		this.iniActive = true;
		
		jQuery(this.pagerBtns[1]).triggerEvent('mousedown');
		
		// Merker zuruecksetzen, dass gerade noch initialisiert wird ...
		this.iniActive = false;
	},
	
	/**
	 * onClick-Event auf einem Pager-Button, blendet dann entsprechende Items aus / ein.
	 *
	 * @member	Eve.ItemPager
	 * @param	{integer}		page		Nummer der anzuzeigenden Seite.
	 */
	onBtnClick : function(page) {
		
		var page = page || 1;
		var visibleItemsEnd   = page * this.itemsPerPage;
		var visibleItemsStart = visibleItemsEnd - this.itemsPerPage;
		visibleItemsEnd--;
		
		for(var i = 0; i < this.items.length; i++) {
			
			var tmpItem = this.items[i];
			
			if(i >= visibleItemsStart && i <= visibleItemsEnd) {
				
				jQuery(tmpItem)[((i == visibleItemsEnd) ? 'addClass' : 'removeClass' )](this.lastItemCls).show();
				
			} else {
				
				jQuery(tmpItem).hide();
			}
		};
		
		jQuery(this.pagerUl).find('li.current').removeClass('current');
		
		jQuery(this.pagerBtns[page]).addClass('current');
		
		jQuery(this.pagerBtns[page]).blur();
				
		return false;
	}
};

/** Ableiten */
Eve.ItemPager.extendClassBy(Eve);
