//var BildPfad = "http://on3.ch/bilder/";
var BildPfad = "bilder/";
var BildArray = new Array(
                      "laden.png",
                      "card-on3.png",
                      "kreuz.png",
                      "back.png",
                      "jonas.jpg",
                      "peter.jpg",
                      "lage.jpg",
                      "team.jpg",
                      "start.jpg",
		      "4500.png",
		      "4400.png",
		      "4300.png",
                      "4200.png",
                      "4100.png",
                      "4000.png",
                      "3900.png",
                      "3800.png",
                      "3700.png",
                      "3600.png",
                      "3500.png",
                      "3400.png",
                      "3300.png",
                      "3200.png",
		      "3200-startbild.jpg",
                      "3100.png",
                      "3000.png",
                      "2900.png",
                      "2800.png",
                      "2800-startbild.jpg",
                      "2700.png",
                      "2700-startbild.jpg",
                      "2600.png",
                      "2600-startbild.jpg",
                      "2500.png",
                      "2400.png",
                      "2400-startbild.jpg",
                      "2300.png",
                      "2300-startbild.jpg",
                      "2200.png",
                      "2100.png",
                      "2100-startbild.jpg",
                      "2000.png",
                      "2000-startbild.jpg",
                      "1900.png",
                      "1800.png",
                      "1700.png",
                      "1600.png",
                      "1600-startbild.jpg",
                      "1500.png",
                      "1500-startbild.jpg",
                      "1400.png",
                      "1400-startbild.jpg",
                      "1300.png",
                      "1200.png",
                      "1100.png",
		      "3200/scrollerbild.jpg",
                      "2800/scrollerbild.jpg",
		      "2700/scrollerbild.jpg",
                      "2600/scrollerbild.jpg",
		      "2400/scrollerbild.jpg",
		      "2300/scrollerbild.jpg",
                      "2100/scrollerbild.jpg",
                      "2000/scrollerbild.jpg",
                      "1600/scrollerbild.jpg",
                      "1500/scrollerbild.jpg",
                      "1400/scrollerbild.jpg");

var HoverArray = new Array(
                      "back-hover.png");

var imagesLoaded = 0;
var images2Preload = BildArray.length;

        
function preloadHovers()
{
  for (var i=0; i < HoverArray.length; i++) {
    var Hover = new Image();
    Hover.src = BildPfad + HoverArray[i];
  }
}

function initPage(){
	for (var i=0; i < BildArray.length; i++ )
	{
	    var Bild = new Image();
	    Bild.src = BildPfad + BildArray[i];
            //Bild.onload = function() {imageIsLoaded(Bild)};
            checkImage(Bild);
    };

}

function checkImage(img){
        //if(currentImage.complete == true){
        //    imageIsLoaded(currentImage)
        //}else{
        //    setTimeout("checkImage()",100)
        //};
        img.onload = function(){imageIsLoaded(img)};
        imageIsLoaded(img);
}

function imageIsLoaded(newImage){
        var oStatusBox = document.getElementById("statusBox");
        var oStatusText = document.getElementById("statusText");
        var oLadeText = document.getElementById("ladeText");
        var oStatusBar = document.getElementById("statusBar");
        var statusBoxWidth = parseInt(oStatusBox.clientWidth);
    if (newImage.alreadyLoaded || newImage.width == 0){
        //alert(newImage.src+" "+newImage.alreadyLoaded+" "+newImage.width);
	    	return true;
    };
    newImage.alreadyLoaded = true;
    //alert(imagesLoaded+" Bilder geladen");
    ++imagesLoaded;
    var alreadyLoaded = Math.round(100 * imagesLoaded / images2Preload);    //prozentualer geladener Anteil [0,100]
    oStatusText.firstChild.nodeValue = alreadyLoaded + " %";
    oLadeText.firstChild.nodeValue = "Lade " + (Math.round(alreadyLoaded / 2.9 + 11) * 100);    //geladenes Projekt [1100,4500]
    oStatusBar.style.width = ((statusBoxWidth - 2) * alreadyLoaded / 100) + "px";

    if ( imagesLoaded >= (BildArray.length - 1) )
    {
        oStatusText.firstChild.nodeValue = "100 %";
        oStatusBar.style.width = (statusBoxWidth - 2) + "px";
        oLadeText.firstChild.nodeValue = "";
   	    // Alle Bilder wurden geladen
	    //oStatusBox.style.display="none";
	};

}

function show_sidescroller(id, bild, close) {
        var scroller = document.getElementById(id);
        var im = document.getElementById(bild);
        var closeButton = document.getElementById(close);
        closeButton.style.display="block";
        scroller.style.display="block";
        im.style.display="none";
}

function hide_sidescroller(id, bild, close) {
        var scroller = document.getElementById(id);
        var im = document.getElementById(bild);
        var closeButton = document.getElementById(close);
        scroller.style.display="none";
        closeButton.style.display="none";
        im.style.display="block";
}

function toggle_sidescroller(id, bild, close) {
        var scroller = document.getElementById(id);
        var im = document.getElementById(bild);
        var closeButton = document.getElementById(close);
        
        if(scroller.style.display==""){
            scroller.style.display=="none";
            };
        if(scroller.style.display=="block"){
            scroller.style.display="none";
            closeButton.style.display="none";
            im.style.display="block";}
            else {
                closeButton.style.display="block";
                scroller.style.display="block";
                im.style.display="none";};
}

function show_info(id, hide1, hide2, hover, normal1, normal2,close,x1,x2){
        //var lines = document.getElementById('lines');
        var scroller = document.getElementById(id);
        var hideCont1 = document.getElementById(hide1);
        var hideCont2 = document.getElementById(hide2);
        var active = document.getElementById(hover);
        var inactive1 = document.getElementById(normal1);
        var inactive2 = document.getElementById(normal2);
        var closeButton = document.getElementById(close);
        var magic1 = document.getElementById(x1);
        var magic2 = document.getElementById(x2);
        //lines.style.display = "none";
        active.style.display = "block";
        inactive1.style.display = "none";
        inactive2.style.display = "none";
        hideCont1.style.display = "none";
        hideCont2.style.display = "none";
        scroller.style.display = "block";
        closeButton.style.display="block";
        magic1.style.display="block";
        magic2.style.display="block";
}

function hide_info(id,hover,close,x1,x2){
        //var lines = document.getElementById('lines');
        var scroller = document.getElementById(id);
        var inactive = document.getElementById(hover);
        var closeButton = document.getElementById(close);
        var magic1 = document.getElementById(x1);
        var magic2 = document.getElementById(x2);
        //lines.style.display = "block";
        inactive.style.display = "none";
        scroller.style.display = "none";
        closeButton.style.display="none";
        magic1.style.display="none";
        magic2.style.display="none";
}

function hide_infos(cont1,cont2,cont3,hov1,hov2,hov3,close,x1,x2) {
        var content1 = document.getElementById(cont1);
        var content2 = document.getElementById(cont2);
        var content3 = document.getElementById(cont3);
        var hover1 = document.getElementById(hov1);
        var hover2 = document.getElementById(hov2);
        var hover3 = document.getElementById(hov3);
        var closeButton = document.getElementById(close);
        var magic1 = document.getElementById(x1);
        var magic2 = document.getElementById(x2);
        content1.style.display="none";
        content2.style.display="none";
        content3.style.display="none";
        hover1.style.display="none";
        hover2.style.display="none";
        hover3.style.display="none";
        closeButton.style.display="none";
        magic1.style.display="none";
        magic2.style.display="none";
}
