/**
 * @uses sliderImages array(Object['src' => string, 'alt' => string]) Array mit alle anzuzeigenden Bildern
 * @uses curImgId int Index des aktuel amgezeigten Bildes in sliderImages.
 * @uses imgElementId string Id des auszutauschenden Bildelementes.
 * @uses imgPath string Pfad zu den durch CSS referenzierten Bilddateien.
 *
 * @todo projektunabhaengiger Code
 */


var fontsizeComponentSliderEm = 1;
var sliderOffBottomPx = 0; /* wird aus padding-bottom des Sliders ermittelt - layoutabhaengig */
var sliderElementId = 'component_slider'; /* Id des Sliders - projektabhaengig */

var sliderContentElementId = 'CoreSlideImageNavContent'; /* Id des Slidercontents zur Ermittlung der eigentlichen Höhe des Sliders */

var gStartImgHeight = 0;
var gCurrentImgHeight = 0;
var gOffSliderBottom = 0;

/**
 * Zeigt das erste Bild der Bildliste an.
 */
function sliderShowFirstImage(objId) {};

/**
 * Zeigt das letzte Bild der Bildliste an.
 */
function sliderShowLastImage(objId) {};

/**
 * Zeigt das naechste Bild der Bildliste an.
 *
 * @todo: unterschiedliche Bilddimensionen beruecksichtigen.
 */
function sliderShowNextImage(objId) {
	// kein Bildwechsel nach letztem Bild
	if (curImgId < sliderImages.length-1) {
		curImgId++;
		// Bildquelle aendern
		var oldImgHeight = $(imgElementId).getHeight();
		$(imgElementId).src = sliderImages[curImgId]["src"];
		// Alt-Text aendern
		$(imgElementId).alt = sliderImages[curImgId]["alt"];
		// Title-Text aendern
		$(imgElementId).title = sliderImages[curImgId]["title"];

		// Slider-content aendern
		$(objId).getElementsByClassName('imgCur')[0].update(curImgId+1);
		
		// Slider-Buttons aendern
		if ($('dcmpslprev').disabled) {
			Form.Element.enable('dcmpslprev');
			// Style aendern
			if (window.sliderEnablePrevStyle) {
				sliderEnablePrevStyle($('dcmpslprev'), imgPath);
			}
		}
		if ((curImgId == sliderImages.length-1) && !($('dcmpslnext').disabled)) {
			Form.Element.disable('dcmpslnext');
			// Style aendern
			if (window.sliderDisableNextStyle) {
				sliderDisableNextStyle($('dcmpslnext'), imgPath);
			}
		}

		loadImg.addImage($(imgElementId));
		loadImg.run('sliderRefresh()');
	}
}

/**
 * Zeigt das vorhergehende Bild der Bildliste an.
 *
 * @todo: unterschiedliche Bilddimensionen berücksichtigen.
 */
function sliderShowPrevImage(objId) {
	// kein Bildwechsel bei erstem Bild
	if (curImgId) {
		curImgId--;
		// Bildquelle aendern
		$(imgElementId).src = sliderImages[curImgId]["src"];
		// Alt-Text aendern
		$(imgElementId).alt = sliderImages[curImgId]["alt"];
		// Title-Text aendern
		$(imgElementId).title = sliderImages[curImgId]["title"];

		// Slider-content aendern
		$(objId).getElementsByClassName('imgCur')[0].update(curImgId+1);
		
		// Slider-Buttons aendern
		if ($('dcmpslnext').disabled) {
			Form.Element.enable('dcmpslnext');
			// Style aendern
			if (window.sliderEnablePrevStyle) {
				sliderEnableNextStyle($('dcmpslnext'), imgPath);
			}
		}
		if ((!curImgId) && !($('dcmpslprev').disabled)) {
			Form.Element.disable('dcmpslprev');
			// Style aendern
			if (window.sliderDisableNextStyle) {
				sliderDisablePrevStyle($('dcmpslprev'), imgPath);
			}
		}
		
		loadImg.addImage($(imgElementId));
		loadImg.run('sliderRefresh()');
	}
}

/**
 * Setzt den Style des übergebenen Buttons.
 * 
 * @param Element Das Button-Element.
 * @param Pixel-Pfad.
 */
function sliderEnablePrevStyle(button, imgPath) {
	button.setStyle({
		backgroundImage: 'url('+imgPath+'slide_nav_left_state1.gif)',
		backgroundRepeat: 'no-repeat',
		cursor: 'pointer'
	});
	// MouseOver
	Event.observe(button, 'mouseover', SliderMouseOverEffect.mouseover.bindAsEventListener(SliderMouseOverEffect));
	Event.observe(button, 'mouseout', SliderMouseOverEffect.mouseout.bindAsEventListener(SliderMouseOverEffect));
}

/**
 * Setzt den Style des übergebenen Buttons.
 * 
 * @param Element Das Button-Element.
 * @param Pixel-Pfad.
 */
function sliderDisablePrevStyle(button, imgPath) {
	button.setStyle({
		backgroundImage: 'url('+imgPath+'slide_nav_left_state0.gif)',
		backgroundRepeat: 'no-repeat',
		cursor: 'auto'
	});
	// MouseOver
	Event.stopObserving(button, 'mouseover', SliderMouseOverEffect.mouseover.bindAsEventListener(SliderMouseOverEffect));
	Event.stopObserving(button, 'mouseout', SliderMouseOverEffect.mouseout.bindAsEventListener(SliderMouseOverEffect));
}

/**
 * Setzt den Style des übergebenen Buttons.
 * 
 * @param Element Das Button-Element.
 * @param Pixel-Pfad.
 */
function sliderEnableNextStyle(button, imgPath) {
	button.setStyle({
		backgroundImage: 'url('+imgPath+'slide_nav_right_state1.gif)',
		backgroundRepeat: 'no-repeat',
		cursor: 'pointer'
	});
	// MouseOver
	Event.observe(button, 'mouseover', SliderMouseOverEffect.mouseover.bindAsEventListener(SliderMouseOverEffect));
	Event.observe(button, 'mouseout', SliderMouseOverEffect.mouseout.bindAsEventListener(SliderMouseOverEffect));
}

/**
 * Setzt den Style des übergebenen Buttons.
 * 
 * @param Element Das Button-Element.
 * @param Pixel-Pfad.
 */
function sliderDisableNextStyle(button, imgPath) {
	button.setStyle({
		backgroundImage: 'url('+imgPath+'slide_nav_right_state0.gif)',
		backgroundRepeat: 'no-repeat',
		cursor: 'auto'
	});
	// MouseOver
	Event.stopObserving(button, 'mouseover', SliderMouseOverEffect.mouseover.bindAsEventListener(SliderMouseOverEffect));
	Event.stopObserving(button, 'mouseout', SliderMouseOverEffect.mouseout.bindAsEventListener(SliderMouseOverEffect));
}

/**
 * MouseOver für aktive Buttons.
 */
var SliderMouseOverEffect = {
	mouseover: function(event) {
		var button = Event.element(event);
		if (!button.disabled) {
			this.button = button;
			this.img = this.button.getStyle('backgroundImage');
			
			var moverImg = this.img.replace(/state\d/, 'state2');
	 		this.button.setStyle({backgroundImage: moverImg});
	 	}
	},
	
	mouseout: function(event) {
		if (this.button) {
			var moutImg = this.img.replace(/state\d/, 'state1');
	 		this.button.setStyle({backgroundImage: moutImg});
 		
			// Aufraeumen
			this.button = 0;
			this.img = '';
		}
	}
} 

/**
 * MouseOver f. IE6 anstelle v. CSS
 */
if (Browser.IE6) {
	Event.observe(window, 'load', function() {
		if ($('dcmpslnext')) {
			Event.observe($('dcmpslnext'), 'mouseover', SliderMouseOverEffect.mouseover.bindAsEventListener(SliderMouseOverEffect));
			Event.observe($('dcmpslnext'), 'mouseout', SliderMouseOverEffect.mouseout.bindAsEventListener(SliderMouseOverEffect));
		}
		if ($('dcmpslprev')) {
			Event.observe($('dcmpslprev'), 'mouseover', SliderMouseOverEffect.mouseover.bindAsEventListener(SliderMouseOverEffect));
			Event.observe($('dcmpslprev'), 'mouseout', SliderMouseOverEffect.mouseout.bindAsEventListener(SliderMouseOverEffect));
		}
	});
}


Event.observe(window, 'load', function() {
	// bottom-offset f. slider berechnen
	if ($(sliderElementId)) {
		var cssOff = $(sliderElementId).getStyle('paddingBottom');
	 	var unit = cssOff.match(/\D+$/);
	 	var numPx = cssOff.match(/^\d+/);
	 	if (unit == 'em') {
			numPx = numPx*10*fontsizeComponentSliderEm;		
	 	}
	 	sliderOffBottomPx = numPx-0; // -0 for integer cast
		
		sliderRefresh();
	}
});


/**
 * @uses imgElementId
 * @uses sliderOffBottomPx Abstand des Sliders von unten
 */
function sliderRefresh() {
	
	// Elemente zuweisen
	var imgE = $(imgElementId);
	var sliderE = $(sliderElementId);
	var sliderContentE = $(sliderContentElementId);
	
	if (sliderE && imgE && sliderContentE) {

		// Initialszustand setzen
		if (gStartImgHeight != 0) {
			// urspruengliche Groesse	
			gStartImgHeight = imgE.getHeight();
			// urspruenglicher unterer Abstand des Widgets
			gOffSliderBottom = 	gStartImgHeight
								+ Position.positionedOffset($(imgElementId))[1]
								- Position.positionedOffset(sliderE)[1]
								- sliderContentE.getHeight();
		}		
		
		// Elementeigenschaften auslesen
		var imgHeight = imgE.getHeight();
		var sliderHeight = sliderE.getHeight();
	
		
		// rekursiver Aufruf wenn Bildgröße nicht geändert ist 
		if (gCurrentImgHeight == imgHeight) {
			window.setTimeout('sliderRefresh()', 80);
		}
		// Positionierung wenn Bildgröße geändert wurde, Rekursion wird beendet
		else {
			// aktuelle Bildgröße aktualisieren
			gCurrentImgHeight = imgHeight;
			
			// Positionierung f. bestimmte Browser durchfuehren
			if (Browser.IE) { // Rahmenfarbe aendern um Repaint des Elementes im IE zu erzwingen
				sliderE.setStyle({
					borderColor: '#'+imgHeight
				});
			}
			else if (Browser.NS7) {
				// Elementeigenschaften auslesen
				var posSliderV = Position.positionedOffset(sliderE)[1];
				var posImgV = Position.positionedOffset(imgE)[1];
				
				// Horizontales Layout
				if (!$('component_illu_spacer')) {
					// Positionierung des Widgets neu berechnen
					var offChangePx = imgHeight - gOffSliderBottom;
					var offChangeEm = offChangePx/(10*fontsizeComponentSliderEm);
					// Widget positionieren
					sliderE.setStyle({
						paddingBottom: 0,
						top: offChangeEm + 'em'
					});
				}
				// Vertikales Layout
				else {
					// aktuelle Werte für Verarbeitung auslesen		
					//// var cumposImgV = Position.cumulativeOffset(sliderE)[1]; // dieser Wert funktioniert hier nicht, zaehlt immer hoch
				
					//// margin-Top des Widgets
					var styleMarginTop = sliderE.getStyle('marginTop');
					var unit = styleMarginTop.match(/\D+$/);
					var numPx = styleMarginTop.match(/^-?\d+/);
					if (unit == 'em') {
						numPx = numPx*10*fontsizeComponentSliderEm;		
					}
					var sliderMarginTop = numPx-0; // -0 for integer cast
		
					//// absoluter oberer Abstand des Spacers
					var cumposSpacerV = Position.cumulativeOffset($('component_illu_spacer'))[1];
					
					//// Hoehe des Widgets
					var nativeSliderHeigth = $(sliderContentElementId).getHeight();
				
				
				
					// Positionierung des Widgets neu berechnen
					var offChangePx = 	cumposSpacerV + posImgV + nativeSliderHeigth*1.5 // Positionierung am oberen Rand der Illu
										+ imgHeight // Positionierung am unteren Rand
										+ sliderMarginTop // Abstand von unten beruecksichtigen
										;
					var offChangeEm = offChangePx/(10*fontsizeComponentSliderEm);
		
					// Widget positionieren
					sliderE.setStyle({
						top: offChangeEm + 'em'
					});
				}
			}
		}
	}
}