hc.lightboxAuswahl = Class.create();
hc.lightboxAuswahl.prototype = {
	/*** Konstruktor ***/
	initialize: function(id, channel, elementeStart) {
		//HTML-IDs des Contents und der Pfeile
		var contentBereich = 'lightboxAuswahl_content';
		var links = 'lightboxAuswahl_pfeillinks';
		var rechts = 'lightboxAuswahl_pfeilrechts';
		
		this.id = id;
		this.channel = channel;
		this.content = ($(contentBereich) ? $(contentBereich) : contentBereich);
		this.geladen = false;
		this.elementeStart = elementeStart;
		this.elementeLaden = 7;
		this.elementeAnzeige = 3*this.elementeLaden;
		this.elementeAnzahlInitial = $T('a', this.content).length;
		this.elementeAnzahl = 0;
		this.scrollRechts = false;
		//Funktioniert irgendwie nicht: this.gibOffset(true/false);
		this.containerRechtsOffset = null;
		this.containerLinksOffset = null;
		this.scrollbalken = new hc.scrollbalken_horizontal(
													contentBereich, 
													links, 
													rechts,
													function () { return this.scrollEventLinks() }.bind(this),
													function () { return this.scrollEventRechts() }.bind(this)
												);
	},

	/*** Event beim Scrollen der Lightbox Auswahl ***/
	scrollEventLinks: function () {
		//Befindet sich der User am Anfang?
		if(this.elementeAnzahl <= 0) {
			return;	
		}
			
		//Befindet sich der User an der richtigen Stelle in der Scrollleiste?
		if(this.scrollbalken.el.scrollLeft > this.containerLinksOffset) {
			return;
		}
		
		//Scrollen kurz unterbrechen
		this.scrollbalken.killInterval();	
		
		//Elemente runterzählen
		if(!this.scrollRechts)
			this.elementeAnzahl -= this.elementeLaden;
		else
			this.elementeAnzahl -= this.elementeAnzeige;
		
		//Links	
		this.scrollRechts = false;
		
		//Fehler abfangen
		if(this.elementeAnzahl < 0) {
			this.elementeAnzahl = 0;
			return;	
		}
		
		//Ajax Request
		new hc.ajax(
			'ajax_backend.php', 
			{'_func':'lightboxauswahl','ch':this.channel,'_args':{'0':this.id,'1':this.elementeAnzahl,'2':this.elementeLaden}},
			function (AjaxResponse) { return this.elementeVorladen(AjaxResponse) }.bind(this),
			{'onComplete':function () { this.scrollbalken.left(); }.bind(this)},
			true, 'POST', this, true
		);
		/*this.elementeVorladen(-1);
		this.scrollbalken.left();
		this.gibOffset(true);*/
		return false;
	},

	/*** Event beim Scrollen der Lightbox Auswahl ***/
	scrollEventRechts: function () {
		//Kein Laden nötig, da am Anfang nicht genug Elemente gefunden wurden
		if(this.elementeStart > this.elementeAnzahlInitial)
			return;
	
		//Alle Elemente geladen?
		if(this.geladen)
			return;
		
		//Offset links/rechts berechnen. Funzt bei der Initialisierung nicht immer...
		if(!this.containerRechtsOffset) {
			this.containerLinksOffset = this.gibOffset();
			this.containerRechtsOffset = this.gibOffset(true);
		}
		
		//Befindet sich der User an der richtigen Stelle in der Scrollleiste?
		if(this.scrollbalken.el.scrollLeft < this.containerRechtsOffset)
			return;
		
		//Scrollen kurz unterbrechen
		this.scrollbalken.killInterval();
		
		//Elemente hochzählen
		if(this.scrollRechts)
			this.elementeAnzahl += this.elementeLaden;
		else
			this.elementeAnzahl += this.elementeAnzeige;
		
		//Rechts
		this.scrollRechts = true;	
		
		//if(!lightboxAjax.opts._request._args.lightboxDaten[this.elementeAnzahl]) {
			//Ajax Request
			new hc.ajax(
				'ajax_backend.php', 
				{'_func':'lightboxauswahl','ch':this.channel,'_args':{'0':this.id,'1':this.elementeAnzahl,'2':this.elementeLaden}}, 
				function (AjaxResponse) { return this.elementeVorladen(AjaxResponse) }.bind(this), 
				{'onComplete':function () { this.scrollbalken.right(); }.bind(this)},
				true, 'POST', this, true
			);
		/*}
		else {
			this.elementeVorladen(-1);
		}*/
		return false;
	},

	/*** Callback Funktion von Ajax Request ***/
	elementeVorladenNeu: function (AjaxResponse) {
		//Falls keine Elemente mehr gefunden wurden, abbrechen
		if(!AjaxResponse) {
			this.geladen = true;
			this.elementeAnzahl -= this.elementeLaden;
			return;
		}	

		//Linker oder rechter Container ermitteln
		var containerID = this.elementeAnzahl / this.elementeLaden;
		console.log('containerID: ' + containerID);
		if(this.scrollRechts) {
			var container = $T('span', this.content)[containerID-3];
		}
		else {
			var container = $T('span', this.content)[containerID+3];
			this.geladen = false;
		} 
		
		//Neue Elemente einsetzen, alte entfernen
		container.style.display = 'none';
		
		if(AjaxResponse == -1) {
			$T('span', this.content)[containerID].style.display = 'table-cell';
			$T('span', this.content)[containerID].style.verticalAlign = 'middle';
		}
		else {
			this.content.innerHTML += AjaxResponse.html;
			
			//Lightbox-Array dynamisch erweitern
			var counter = 0;	
			for(var key in AjaxResponse.daten) {
				var value = AjaxResponse.daten[key];
				with(lightboxAjax.opts._request._args) {				
					if(!lightboxDaten[key]) {
						lightboxDaten[key] = new Object();
						lightboxDaten[key]['id'] = value['id'];
						lightboxDaten[key]['typ'] = value['typ'];
						lightboxDaten[key]['lid'] = value['lid'];
						lightboxDaten[key]['titel'] = value['titel'];
						lightboxDaten[key]['dateiTyp'] = value['dateiTyp'];
					}
				}
				counter++;
			}
			
			//Es wurden alle Elemente geladen
			if(counter < this.elementeLaden)
				this.geladen = true;			
		}
		
		//Neue Scrollbar-Koordinaten ermitteln
		this.containerRechtsOffset = this.gibOffset(true);
		this.containerLinksOffset = this.gibOffset(false);
		
		console.log('Neue Scrollbar-Coords ermittelt' + this.containerLinksOffset + ';' + this.containerRechtsOffset);
		
		//Scrollbalken verschieben
		if(this.scrollRechts)
			this.scrollbalken.el.scrollLeft = this.containerLinksOffset;
		else
			this.scrollbalken.el.scrollLeft = this.containerRechtsOffset;
	},
	
	/*** Callback Funktion von Ajax Request ***/
	elementeVorladen: function (AjaxResponse) {
		//Falls keine Elemente mehr gefunden wurden, abbrechen
		if(!AjaxResponse.daten) {
			this.elementeAnzahl -= this.elementeLaden;
			this.geladen = true;
			return;
		}	

		//Linker oder rechter Container ermitteln
		if(this.scrollRechts) {
			var container = $T('span', this.content)[0];
			var containerWidth = container.offsetWidth;
		}
		else {
			var container = $T('span', this.content)[2];
		} 
		
		//Neue Elemente einsetzen, alte entfernen
		this.content.removeChild(container);
		if(this.scrollRechts) {					
			this.content.innerHTML += AjaxResponse.html;
		}
		else {
			this.content.innerHTML = AjaxResponse.html + this.content.innerHTML;
			this.geladen = false;
		}
		
		//Neue Scrollbar-Koordinaten ermitteln
		this.containerRechtsOffset = this.gibOffset(true);
		this.containerLinksOffset = this.gibOffset(false);
		
		//Scrollbalken verschieben
		if(this.scrollRechts)
			this.scrollbalken.el.scrollLeft = this.containerLinksOffset;
		else
			this.scrollbalken.el.scrollLeft = this.containerRechtsOffset;
		
		//Lightbox-Array dynamisch erweitern
		var counter = 0;	
		for(var key in AjaxResponse.daten) {
			var value = AjaxResponse.daten[key];
			with(lightboxAjax.opts._request._args) {				
				if(!lightboxDaten[key]) {
					lightboxDaten[key] = new Object();
					lightboxDaten[key]['id'] = value['id'];
					lightboxDaten[key]['typ'] = value['typ'];
					lightboxDaten[key]['lid'] = value['lid'];
					lightboxDaten[key]['titel'] = value['titel'];
					lightboxDaten[key]['dateiTyp'] = value['dateiTyp'];
				}
			}
			counter++;
		}
		
		//Nur die Elemente unmittelbar vor und nach dem aktuellen Element anzeigen
		/*var spanTags = $T('span', this.content);
		var differenz = 0;
		for(var key in spanTags) {
			differenz = key - this.elementeAnzahl;
			console.log(key + ' ; ' + this.elementeAnzahl);
			if(differenz <= -this.elementeLaden || differenz >= this.elementeLaden) {
				spanTags[key].setAttribute('class') = 'lightboxContainerHide';
				//console.log(key);
			}
		}*/
		
		//Es wurden alle Elemente geladen
		if(counter < this.elementeLaden)
			this.geladen = true;
	},

	/*** Ladepunkte für Links und Rechts ermitteln ***/
	gibOffsetNeu: function (rechts) {
		var spans = $T('span', this.content);
		var output = '';
		for(var key in spans) {
			output += key + ':' + (spans[key].offsetLeft - this.content.offsetWidth) + ' | ';
		}
		console.log(output);
		
		var containerID = this.elementeAnzahl / this.elementeLaden;
		if(!this.scrollRechts)
			containerID += 2;
		if(rechts) {
			console.log('rechts: '+containerID);
			return $T('span', this.content)[containerID].offsetLeft - this.content.offsetWidth;
		}
		else {
			containerID -= 1;
			console.log('links: '+containerID);
			return $T('span', this.content)[containerID].offsetLeft - this.content.offsetWidth;
		}
	},
	
	/*** Ladepunkte für Links und Rechts ermitteln ***/
	gibOffset: function (rechts) {
		if(rechts) {
			return $T('span', this.content)[2].offsetLeft - this.content.offsetWidth;
		}
		else {
			return $T('span', this.content)[1].offsetLeft - this.content.offsetWidth;
		}
	}	
}
