// Titel:    Aus- und Einblenden einer Navigationsleiste mit animierten Buttons
// Autor:    Robin Pohlink
// Erzeugt:  08.10.2001
// Erneuert: 13.02.2006
// Start:    navi_init(TopOffset, LeftOffset, NavBarWidth, ButtonHeight, NumOfButtons, FirstButton);

// Jeder Button muss eine ID und einen Style erhalten!
// Beispiel fuer Button 1: <DIV ID="button1" STYLE="position:absolute; visibility:hidden;">

// Parameter der Funktion navi_init()
var navi_TopOffset       = 100;         /* Abstand des NavBars von der oberen Fensterkante            */
var navi_LeftOffset      = 10;          /* Abstand des NavBars von der linken Fensterkante            */
var navi_NavBarWidth     = 100;         /* Breite des NavBars                                         */
var navi_ButtonHeight    = 30;          /* Vertikale Ausdehnung eines Buttons (inkl. Zwischenraum)    */
var navi_NumOfButtons    = 10;          /* Anzahl der Buttons                                         */
var navi_FirstButton     = 1;           /* Button der als erster reingefahren wird                    */

// Individuell anpassbare globale Variablen
var navi_ButtonVariance  = 20;          /* Streuung der Buttonposition beim Reinfahren (muss >0 sein) */
var navi_BlockMove       = true;        /* Reinfahren aller Buttons als Block                         */
var navi_ButtonPath      = 'buttons/';  /* Pfad des Buttonverzeichnisses                              */
var navi_ImagePath       = 'images/';   /* Pfad des Bilderverzeichnisses                              */

// Globale Variablen fuer den internen Gebrauch
var navi_safeY           = 0;           /* Y-Koordinate der Fensteroberkante relativ zum Dokument     */
var navi_Icons           = false;       /* Icons benutzen                                             */
var navi_MSIE            = false;       /* MS Internet Explorer vorhanden?                            */
var navi_NewB            = false;       /* Neuer Browser (ab NetScape 6.0 oder MSIE 5.0) vorhanden?   */
var navi_OutComplete     = false;       /* Rausfahren beendet?                                        */
var navi_InComplete      = true;        /* Reinfahren beendet?                                        */


// Mini-Debugger
function navi_Debug(navi_Objekt)
  {
  var navi_strErgebnis ='';
  for (var navi_Attribut in navi_Objekt)
    navi_strErgebnis += navi_Objekt.name+'.'+navi_Attribut+'='+navi_Objekt[navi_Attribut]+' | ';
  alert(navi_strErgebnis);
  };

// Erzeugt ein Array mit den Bildern der Icons und schaltet die Icons ein
function navi_initIcons()
  {
  navi_Icons = true;
  if (document.images)
    {
    navi_IconImage = new Array(navi_NumOfButtons);

    for (var i=0; i<navi_NumOfButtons; i++)
      {
      navi_IconImage[i]     = new Image();
      navi_IconImage[i].src = navi_ButtonPath + 'icon'+i+'.gif';
      };

    navi_IconFade = new Array(3);
    for (var i=0; i<3; i++)
      {
      navi_IconFade[i]     = new Image();
      navi_IconFade[i].src = navi_ButtonPath + 'icon_'+i+'.gif';
      };
    navi_EpmtyIcon     = new Image();
    navi_EpmtyIcon.src = navi_ImagePath + 'empty.gif';
    }; 
  };

// Speichert die aktuelle Y-Koordinate der Fensteroberkante relativ zum Dokument.
function navi_SafePos()
  {
  navi_safeY = (navi_MSIE ? document.body.scrollTop : pageYOffset);
  setTimeout('navi_SafePos()', 50);
  };

// Ueberwacht das Fenster und loest das Reinfahren des NavBars, eine Sekunde nachdem das Fenster gerollt wurde, aus.
function navi_WatchWindow()
  {
  if (navi_safeY != (navi_MSIE ? document.body.scrollTop : pageYOffset))
    {
    setTimeout('navi_MoveNavBar()', 1000);
    }
    else
      setTimeout('navi_WatchWindow()', 5);
  };

// Faehrt den NavBar raus und wieder rein.
function navi_MoveNavBar()
  {
  if (navi_safeY == (navi_MSIE ? document.body.scrollTop : pageYOffset))
    {
    navi_MoveOut();
    navi_MoveIn();
    };
  setTimeout('navi_WatchWindow()', 10);
  };

// Bewegt jeden Button einzeln wieder ins Fenster.
function navi_MoveIn()
  {
  navi_InComplete = true;
  if (navi_OutComplete)
    {
    for(j = 1; j <= navi_NumOfButtons; j++)
      {
      if (navi_LeftPosition[j] < navi_LeftOffset)
        {
        navi_LeftPosition[j] += 10;
        navi_Button[j].left = navi_LeftPosition[j];
        navi_InComplete = false;
        }
        else
          {
          if (!navi_VisIcon[j-1] && navi_Icons)
            {
            navi_strIcon = 'ic'+(j-1);
            for(j2=0; j2<3; j2++)
              {
              navi_document.images[navi_strIcon].src = navi_IconFade[j2].src;
              for (j3=0; j3<100; j3++) continue;
              };
            navi_document.images[navi_strIcon].src = navi_IconImage[j-1].src;
            navi_VisIcon[j-1] = true;
            };
          };
      };
    };
  if (!navi_InComplete || !navi_OutComplete) setTimeout('navi_MoveIn()', 5);
  };

// Bewegt alle Buttons als Block aus dem Fenster und versieht jeden Button mit einem individuellen zufälligen Offset.
function navi_MoveOut()
  {
  navi_OutComplete = false;
  if (navi_LeftPosition[navi_FirstButton] > (-2*navi_NavBarWidth - navi_LeftOffset))
    {
    if (navi_VisIcon[0] && navi_Icons)
      {
      for(i = 1; i <= navi_NumOfButtons; i++)
        {
        navi_strIcon = 'ic'+(i-1);
        navi_document.images[navi_strIcon].src = navi_EpmtyIcon.src;
        navi_VisIcon[i-1] = false;
        };
      };
    for(i = 1; i <= navi_NumOfButtons; i++)
      {
      navi_LeftPosition[i] -= 20;
      navi_Button[i].left = navi_LeftPosition[i];
      };
    setTimeout('navi_MoveOut()', 3);
    }
    else
      {
      for(i = 1; i <= navi_NumOfButtons; i++)
        {
        navi_Button[i].top = navi_TopOffset + (i-1)*navi_ButtonHeight + (navi_MSIE ? document.body.scrollTop : pageYOffset);
        navi_Button[i].visibility = "visible";  
        if (!navi_BlockMove && (i != navi_FirstButton))
          navi_LeftPosition[i] -= 10*Math.round(navi_NumOfButtons*navi_NavBarWidth*Math.random()/navi_ButtonVariance);
        };
      navi_OutComplete = true;
      };
  };

// Initialisiert den dynamischen NavBar.
function navi_init(navi_paramTopOffset,navi_paramLeftOffset,navi_paramNavBarWidth,
                   navi_paramButtonHeight,navi_paramNumOfButtons,navi_paramFirstButton)
  {
  navi_TopOffset    = navi_paramTopOffset;
  navi_LeftOffset   = navi_paramLeftOffset;
  navi_NavBarWidth  = navi_paramNavBarWidth;
  navi_ButtonHeight = navi_paramButtonHeight;
  navi_NumOfButtons = navi_paramNumOfButtons;
  navi_FirstButton  = navi_paramFirstButton;
  navi_LeftPosition = new Array(navi_NumOfButtons);
  navi_Button       = new Array(navi_NumOfButtons);

  navi_NewB = (document.getElementById('button1')) ? true : false;
  navi_MSIE = (document.all) ? true : false;

  navi_document = (!navi_NewB && navi_MSIE) ? document.all : document;
  for(k = 1; k <= navi_NumOfButtons; k++)
    {
    navi_LeftPosition[k] = navi_LeftOffset;
    navi_strButton = 'button'+k;
    navi_Button[k] = navi_NewB ? navi_document.getElementById(navi_strButton) : navi_document[navi_strButton];
    if (navi_Button[k].style) navi_Button[k] = navi_Button[k].style;
    };  
  navi_VisIcon = new Array(navi_NumOfButtons);
  for (var i=0; i<navi_NumOfButtons; i++)
    navi_VisIcon[i] = false;
  navi_SafePos();
  navi_MoveNavBar();
  };

