/**
 * Das Hintergrundbild wird (nach dem laden) mit Zeitabstand durch
 * weitere Hintergrundbilder ersetzt, sodass eine Slideshow entsteht. 
 * Die Hintergrundbilder werden als Folge von .jpg überblendet.
 * Das erste Bild hat keine Nummer, erste Nummer ist also
 * -2.jpg.
 * Im mobilen Stylesheet ist die Animation mangels Bandbreite
 * abgeschaltet.
 */

/* settings */
var pauseMs = 500;
/*/settings */


$(document).ready(function(){
if(kcmBigCSS()) {

  var themenbild = $('#inhalt');
  var bildCSS = $(themenbild).css('background-image');
  var srcMatches = bildCSS.match(/url\(['"]?([^'")]+)['"]?\)/);
  if(bildSrc = srcMatches[1]) {
	  var basisBildName = bildSrc.substring(0,bildSrc.lastIndexOf('.'));
	  var basisBildSuffix = bildSrc.substr(bildSrc.lastIndexOf('.'));
  }
  var nextFrame = 2; /* 1. Bild wird schon per CSS zugewiesen */
  var loadedFrames = new Object();
  var lastFrame = 1; /* 1. bild ist schon über CSS geladen */


  /**
   * Lädt das nächste Frame.
   * Wurde es erfolgreich geladen, wird das nächste geladen.
   * Schlägt das Laden fehl, ist das Vorausladen beendet,
   * und der callback wird aufgerufen.
   * @recursive kinda
   */
  function continuePrefetchFrames(onPrefetchFinished) {	  
	  var src = frameSrc(lastFrame + 1);
	  var tmpFrame = document.createElement('img');
	  
	  $(tmpFrame).error(function() {
		  onPrefetchFinished();
	  });
	  
	  $(tmpFrame).load(function() {
		  loadedFrames[++lastFrame] = src;
		  
		  continuePrefetchFrames(onPrefetchFinished);
	  });

	  $(tmpFrame).attr('src', src);
  }
  
  
  /**
   * Baut den Dateinamen für ein Frame zusammen
   * @param number des Frames
   */
  function frameSrc(number) {
	  return basisBildName + '-' + number + basisBildSuffix;
  }
  
  /**
   * Die Funktion weist ein bereits vorbereitetes Bild zu und wartet die entsprechende Zeit,
   * bis es sich selbst für das nächste Bild aufruft.
   * @return Gibt es weitere Frames?
   */
  function showNextFrame() {
	  themenbild.css('background-image', 'url(' + frameSrc(nextFrame++) + ')');
	  
	  if(nextFrame <= lastFrame) {
		  return true;
	  } else {
		  return false;
	  }
  }
  
  startBGAnimation = function() {
	  nextFrame = 2;
	  var bgAnimation = window.setInterval(function() {
		  if(! showNextFrame()) {
			  window.clearInterval(bgAnimation);
		  }
	  }, pauseMs);
  };

  continuePrefetchFrames(function() {
	  /* Animation nur auf Hauptseiten zeigen, die kein Vollbild-Element haben,
	   * oder auf der ersten Unterseite */
	  if(bildSrc
			  && ($('#navigation > li.aktiv > strong').length || $('#navigation > li.aktiv > ul > li:first-child.aktiv').length) ) {
		  startBGAnimation();
	  }
  });
}
});