var currentHeader = 0;
var headerCount = 0;
var timer;
var blendfx;


function headerNext() {
	var i = currentHeader;
	if ((currentHeader + 1) == headerCount) {
		currentHeader = 0;
  }
	else {
		currentHeader++;
	}
  var j = currentHeader;

	headerBlend(i, j);
}


function headerPrev() {
	var i = currentHeader;

	if ((currentHeader) == 0) {
		currentHeader = headerCount - 1;
	}
	else {
		currentHeader--;
	}

	var j = currentHeader;

	headerBlend(i, j);
}
  
  
function headerBlend(i, j) {
	headerStop();

	var e1 = $("nk_dhtml_slideshow_pic_" + i);
	var e2 = $("nk_dhtml_slideshow_pic_" + j);
	var to1 = 0;
	var to2 = 1;

	blendfx = new Fx.Styles(e1, {duration: 1800, wait: true, fps:25 });
	if (i == 0) {
		e1.setStyle("z-index", 200); 
	}

	$$(".nk_dhtml_slideshow_pic").setStyle("opacity", 0);
	e2.setStyle("z-index", (e1.getStyle("z-index") - 1));
	e2.setStyle("opacity", to2);
	e1.setStyle("opacity", to2);
  
	blendfx.start({"opacity":to1});
}


function headerStop() {
	if (blendfx) {
		blendfx.stop();
	}
}


function headerInit() {
	$("nk_dhtml_slideshow_pic_0").setStyle("opacity", "1");
  
  $("nk_dhtml_slideshow_pic_1").setStyle("opacity", "0");
  $("nk_dhtml_slideshow_pic_1").innerHTML = "<img src=\"/fileadmin/img/ani_handelsschiff.jpg\" />" + $("nk_dhtml_slideshow_pic_1").innerHTML;

  $("nk_dhtml_slideshow_pic_2").setStyle("opacity", "0");
  $("nk_dhtml_slideshow_pic_2").innerHTML = "<img src=\"/fileadmin/img/ani_transrapid.jpg\" />" + $("nk_dhtml_slideshow_pic_2").innerHTML;
  
  $("nk_dhtml_slideshow_pic_3").setStyle("opacity", "0");
  $("nk_dhtml_slideshow_pic_3").innerHTML = "<img src=\"/fileadmin/img/ani_yacht.jpg\" />" + $("nk_dhtml_slideshow_pic_3").innerHTML;
  
  $("nk_dhtml_slideshow_pic_4").setStyle("opacity", "0");
  $("nk_dhtml_slideshow_pic_4").innerHTML = "<img src=\"/fileadmin/img/ani_marineschiff.jpg\" />" + $("nk_dhtml_slideshow_pic_4").innerHTML;

	currentHeader = 0;

	//headerCount = 4;   // 
	headerCount = $$(".nk_dhtml_slideshow_pic").length;
	if (headerCount > 1) { // start animation just if there is more than 1 image
		timer = headerNext.periodical(3300);
	}
}

// Load Event fires when the whole page is loaded, included all images
window.addEvent("load", function() 	{
	headerInit();
});