// automatischer Hintergrundbild wechseln nach einer bestimmten Zeitinterval

var pfadimages = 'js/jquery/background-changer/bgimages/';
var pfad_controllericons = 'js/jquery/background-changer/';
var backImage = new Array();
backImage[0] = pfadimages+'bg_0.gif';
backImage[1] = pfadimages+'bg_1.gif';
backImage[2] = pfadimages+'bg_2.gif';
backImage[3] = pfadimages+'bg_3.gif';
backImage[4] = pfadimages+'bg_4.gif';
backImage[5] = pfadimages+'bg_5.gif';
backImage[6] = pfadimages+'bg_6.gif';

var imgmaxnr =  backImage.length;
var back_for_imgmaxnr=imgmaxnr-1; 
var bginr = 0; 
var maxtime=30;
var buttonbgcoloron='#0099CC';
var buttonbgcoloroff='#EFEFEF';
var showbgchangebox=1;
var controller=0; 
var variablencheck=0;
var nextimagepreload=1;

// Wenn Dokument geladen ...
$(function(){
 writebackgroundoptions(imgmaxnr); 
 $('.bgimgloader').css({ width: maxtime+'px' });
 $('.bgcounter').html(maxtime);
 $("body").css("background", "url('" + backImage[bginr] + "')");
 $('#stoptimer').click(function(){ 
   var stopstatus=$(this).attr("alt");
   if(stopstatus=="stop"){
	stoptimer();
	$(this).attr("src","start.png");
	$(this).attr("alt","start");
   } else {
	starttimer();
	$(this).attr("src","stop.png");				
	$(this).attr("alt","stop");   
   }
 });
 $('img#forward').click(function(){ 
	fornr=$('img#forward').attr("alt");
	changeBGIMG(fornr);
 });
 $('img#backward').click(function(){ 
	backnr=$('img#backward').attr("alt");
	changeBGIMG(backnr);
 });

});

// Startet den Countdown beim Aufruf der Seite 
var timer = setInterval("updateTime()", 1000);

// Stop bei Klick den Countdown
function stoptimer(){
	clearInterval(timer);
}
// Startet bei Klick den Countdown
function starttimer(){
  timer = setInterval("updateTime()", 1000);
}

// Schreibt im DIV-Object id=background-options die Buttons zu den Bildern
function writebackgroundoptions(imgmaxnr){
 var htmlobj ="";
 if(showbgchangebox==1){
  $('#background-changer').css({
	background: '#FFFFFF', 
	width: '30px', 
	padding: '2px', 
	border: '#CCCCCC 1px solid'
  });
  if(controller==1){
   htmlobj = '<div style="padding: 0 0 3px 0;"><img id="backward" src="'+pfad_controllericons+'backward.png" border="0" alt="" style=" cursor:pointer;" /><img id="stoptimer" src="'+pfad_controllericons+'stop.png" border="0" alt="stop" style=" cursor:pointer;" /><img id="forward" src="'+pfad_controllericons+'forward.png" border="0" alt="" style=" cursor:pointer;" /></div>';
  }
  for (i = 0; i < imgmaxnr; i++){
   var onclick="changeBGIMG('"+i+"')";
   htmlobj = htmlobj+'<div id="buttonbgimg'+i+'" onclick="'+onclick+'" style="margin-bottom:3px; height:4px; cursor:pointer; background:'+buttonbgcoloroff+'; font-size:0px;">&nbsp;</div>';
  }
   htmlobj = htmlobj+'<div class="bgimgloader" style="height:1px; width:0px; background:#009900; font-size:0px;">&nbsp;</div>';
 }
  htmlobj = htmlobj+'<span class="bgcounter" style="display:none"></span>';
  $("#background-options").html(htmlobj);
  $('#buttonbgimg0').css({ backgroundColor:buttonbgcoloron });
}

// Bei Klick auf den Buttons Hintergrund wechseln
// und die Zeit neu starten
function changeBGIMG(imgnr) {
  clearInterval(timer);
  $('.bgcounter').html(maxtime);
  clearimgchangebox(imgnr); 
  $("body").css("background", "url('" + backImage[imgnr] + "')");
  timer = setInterval("updateTime()", 1000);
  bginr=imgnr;
  $('.bginr').html(bginr);
}

// Countdown zählt runter auf 0 und blendet ein neues Hintergrundbild ein
function updateTime() {
    var bgcounter = $('.bgcounter');
	var time = bgcounter.html();
    time--;
    bgcounter.html(time);
	$('.bgimgloader').css({ width: time+'px' });
    if(variablencheck==1){ $('#countdowncheck').html(time); }
	// Wenn die Zeit abgelaufen ist die Img Nr erhöhen
	if (time == 0 ){ 
	 bginr++; 
	 if (bginr >= imgmaxnr){ bginr = 0; }
	 var preloaded_image = $('<img />').attr('src', backImage[0]);
	 
	 $("body").css("background", "url('" + backImage[bginr] + "')");
	 clearimgchangebox(bginr);
	}
    if(time <= 0) {
        //clearInterval(timer);
        $('.bgcounter').html(maxtime);
    }
}

// Hintergrund Auswahl Box; alle Buttons in einer Schleife ausblenden 
// und zum Schluß den entsprechenden Buttons des Hintergrund aktivieren  
function clearimgchangebox(bginr){
  for (i = 0; i < imgmaxnr; i++){
   $("#buttonbgimg"+i).css({ backgroundColor:buttonbgcoloroff });
  }
  $('#buttonbgimg'+bginr).css({ backgroundColor:buttonbgcoloron });

  if(bginr==0){ backwardnr=back_for_imgmaxnr; } else { backwardnr=parseInt(bginr)-1; }
  if(bginr>=back_for_imgmaxnr){ forwardnr='0'; } else { forwardnr=parseInt(bginr)+1; }
  
  if(controller==1){
	if($('#stoptimer').attr("alt")=="start"){ 
	 $('#stoptimer').attr("src","stop.png");				
	 $('#stoptimer').attr("alt","stop");   
	}
   $('#backward').attr("alt",backwardnr);
   $('#forward').attr("alt",forwardnr);
   // Variablen Check
  }
  if(variablencheck==1){
   //$('#imagecheck').html(bginr+' | '+backImage[bginr]);
   //$('#backwardcheck').html(backwardnr+' | '+backImage[backwardnr]);
   //$('#forwardcheck').html(forwardnr+' | '+backImage[forwardnr]);
   // Nächstes Bild Vorladen / Anzeigen
  }
  if(variablencheck==1){
   if(nextimagepreload==1){ 
    $('#nextimage').attr("src",backImage[forwardnr]);
     if ($('#nextimage').is(":hidden")){}else{ $('#nextimage').slideToggle(300); }
    $('#nextimage').delay(800).slideToggle(300);
   }
  } else { 
   if(nextimagepreload==1){ 
    $('#nextimage').attr("src",backImage[forwardnr]); 
   }
  } 
}