function show(number) {
    if (document.getElementById) {

        var node = document.getElementById(number);

        if (node != null) {
            node.style.visibility = "visible";
            node.style.display = "";
            if (! isNaN(number)) {
                shown = number;
            }
        }
    }
}

function hide() {
    hideSingle(shown);
}

function hideSingle(number) {
      if (document.getElementById) {
         var node = document.getElementById(number);

         if (node != null) {
            node.style.visibility = "hidden";
            node.style.display = "none";
         }
      }
    }

function display() {
    document.write("<div id=\"load\" class=\"animlayer\" style=\"visibility: visible; display: block;\">");
    document.write("<b><br><br><br><br><br><br>Please stand by while animation loads....</b>");
    document.write("</div>");

    document.write("<div id=\"start\" class=\"animlayer\" style=\"visibility: hidden; display: none;\">");
    document.write("<b><br><br><br><br><br><br>Start</b>");
    document.write("</div>");

    for (var i = 0; i <= end; i += inkrement) {
       var offset = i;
       
       if (i < 10) {
          offset = "0" + i;
       }
       
       document.write("<div id=\"" + i + "\" style=\"visibility: hidden; display: none;\">");
       document.write("<img src=\"" + prefix + type + "_" + karte + offset + postfix + "\">");
       document.write("</div>");
    }

    document.write("<div id=\"end\" class=\"animlayer\" style=\"visibility: hidden; display: none;\">");
    document.write("<b><br><br><br><br><br><br>End</b>");
    document.write("</div>");
}

function init() {
    if (document.getElementById) {
        if (loadingActive == 1) {
            var node = document.getElementById("load");

            if (node != null) {
                node.style.visibility = "hidden";
                node.style.display = "none";
                loadingActive = 0;
            }
        }

        if (startActive == 1) {
            var node = document.getElementById("start");

            if (node != null) {
                node.style.visibility = "hidden";
                node.style.display = "none";
                startActive = 0;
            }
        }

        if (endActive == 1) {
            var node = document.getElementById("end");

            if (node != null) {
                node.style.visibility = "hidden";
                node.style.display = "none";
                endActive = 0;
            }
        }

    }
}


function startAnimation() {
    init();
    hideSingle(shown);
    show('start');
    startActive = 1;
    shown = start;
    timer = window.setInterval("next()", interval);
}

function stopAnimation() {
    window.clearInterval(timer);
}


function next() {
   init();
   if (shown <= end) {
       if (shown == end) {
          hideSingle(shown);
          stopAnimation();
          show('end');
          endActive = 1;
       } else {
           hideSingle(shown);
           shown += inkrement;
           show(shown);
       }
   }
}

function back() {
   init();
   if (shown >= start) {
       if (shown == start) {
           stopAnimation();
           hideSingle(shown);
           show('start');
           startActive = 1;
       } else {
           hideSingle(shown);
           shown -= inkrement;
           show(shown);
       }
   }
}

function disableLoading() {
    hideSingle('load');
    show(shown);
}

function debug() {
   window.alert(shown);
}

function last() {
    init();
    hideSingle(shown);
    shown = end;
    show(shown);
}

function first() {
    init();
    hideSingle(shown);
    shown = start;
    show(shown);
}