/**
 * Bildwechsel im Header
 *
 * Das Script tauscht in regelmäßigen Abständen die Hintergrundbilder im Seitenheader aus.
 *
 * Michael Ibsen
 * michael.ibsen@xisio.com
 * http://www.xisio.com
 *
 * 11.6.2010
 * Letzte Änderung: 11.6.2010
 *
 */

$.extend({
  getUrlVars: function(){
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for(var i = 0; i < hashes.length; i++)
    {
      hash = hashes[i].split('=');
      vars.push(hash[0]);
      vars[hash[0]] = hash[1];
    }
    return vars;
  },
  getUrlVar: function(name){
    return $.getUrlVars()[name];
  }
});


$(document).ready(function() {
		
	// Bilderliste
	var arrImages = new Array();
	
	// Steuerung	
	var nInterval = 10000; // Umschaltinterval zwischen den Bildern in ms
	var nFadeSpeed = 50; // Dauer eines Einzelschritts bei fadeIn und fadeOut (ms)
	var imageRotate = false;
	var timerFadeOut = false;
	var timerFadeIn = false;
	var gstrImage = '';
	var nCurrentImage = 0;
	var nOldImage = 0;
	var nImageCount = 0;
	
	/**
	 * Schaltet zum nächsten Bild weiter und ruft sich selbst
	 * über setTimeout nach der vorgegebenen Zeit wieder auf.
	 *
	 * @author Michael Ibsen
	 * @date 2010-04-13
	 *
	 */
	var imageRotate = function() {
		clearTimeout(imageRotate);
		imageRotate = false;

		nImageCount = arrImages.length;
		
        // Bilder werden über AJAX in die Liste geladen.
        // Wenn (bereits) Bilder in der Liste sind, zum
        // nächsten Bild weiterschalten:
        if (arrImages.length > 0) {
			//alert('imageRotate, >0');
            // Bild weiterschalten
            nextImage();
        }
        else {
			// imageRotate nach vorgegebenem Interval erneut aufrufen
			imageRotate = setTimeout(imageRotate, nInterval);
        
        }
        
	};
	
	var mfadeIn = function() {

		clearTimeout(imageRotate);
		imageRotate = false;
		
		var opacity = parseFloat($('#logo_background_layunder').css('opacity'));
		if (opacity < 1.0) {
			opacity = Math.min(1.0, (opacity + 0.05));
			$('#logo_background_layunder').css('opacity', opacity);
			timerFadeIn = setTimeout(mfadeIn, nFadeSpeed);
		}
		else {

			clearTimeout(timerFadeIn);
			timerFadeIn = false;

			// Bild umschalten
			$('#header').css('background-image', gstrImage);
			$('#logo_background_layunder').css('opacity', 0);

			clearTimeout(imageRotate);
			imageRotate = setTimeout(nextImage, nInterval);

		}
	}
	
	
    /**
     * Schaltet zum nächsten Bild weiter
     *
     * @author Michael Ibsen
     * @date 2010-04-14
     *
     */
    var nextImage = function() {
    	// wenn weniger als zwei Bilder vorhanden sind, gibt es nichts zum Weiterblättern...
    	if (nImageCount > 1) {
			nCurrentImage = (nOldImage + 1) % nImageCount;

			// Hintergrund des Bildelementes (=Bild) tauschen
			// var strBGImage = 'url(\'fileadmin/scripts/thumbnail.php?src=../' + arrImages[nCurrentImage] + '&p=980\')';
			var strBGImage = 'url(\'fileadmin/' + arrImages[nCurrentImage] + '\')';

			// sanften Übergang erzeugen:
			// - die Opacity von logo_background_layunder auf 0 setzen
			// - das neue Bild als Hintergrund des umgebenden DIV-Tags (id="logo_background_layunder") setzen
			// - die Transparenz schrittweise von 0 auf 1 fahren (mfadeIn())
			// - Dann wird das Bild background-image für logo_background ausgetauscht und die Transparenz wieder auf
			// 0 gestellt.

			$('#header').css('background-image', $('#logo_background_layunder').css('background-image'));
			$('#logo_background_layunder').css('opacity', 0);
			$('#logo_background_layunder').css('background-image', strBGImage);

			gstrImage = strBGImage;

			mfadeIn();

			// Bild weiterschalten
			nOldImage = nCurrentImage;
		}        
    };

    
    /**
     * Anzuzeigende Bilder holen.
     * 
     * Die gefundenen Bilder werden in die (globale) Liste arrImages
     * übernommen.
     *
     * @author Michael Ibsen
     * @date 2010-06-11
     *
     */
    var getImages = function(strPage) {
		var strHeaderImages = $('#header_images').html();
		// Bilder vom Server holen, wenn angegeben
		if ('' != strHeaderImages) {
			$.getJSON('fileadmin/scripts/getimages.php?himg=' + strHeaderImages, function(data) {
				// Bilder in Liste übernehmen
				$.each(data['instances'], function(entryIndex, entry) {
					arrImages.push(entry['file']);
				});	
				nImageCount = arrImages.length;
				imageRotate = setTimeout(imageRotate, nInterval);
			});
		}		
		
		//alert('getImages:' + nImageCount);

    }

    // Bildwechsel starten
	getImages();


	$('#logo_background_layunder').click(function() {
    	alert("Don't click this image again!");
    });
});