JavaScript-Ouelltext

Benutzung von elviewer.js

ElViewer ist eine Objektklasse, mit der man einzelne absolut positionierbare Seitenelemente aus einer Gruppe abwechselnd anzeigen lassen kann. Man kann mit diesem Objekt also eine Art Stummfilmkino veranstalten, nur daß man eben nicht nur Bilder sondern ganze div- oder span- Sektionen filmartig anzeigen kann, die neben Bildern auch Text, Tabellen und alles enthalten können, was das Programmierer- oder Marktstrategenherz sonst noch so begehrt.

Die Einbindung von timer.js in das HTML-Dokument ist zwingend notwendig.

Funktionen von ElViewer-Objekten

Funktion	Bedeutung
Objekt erzeugen
`new ElViewer(hiddenleft,hiddentop)`	kreiert ein neues ElViewer-Objekt und meldet es beim Timer an `hiddenleft`: X-Koordinate für geparkte Seitenelemente `hiddentop`: Y-Koordinate für geparkte Seitenelemente Geparkt werden sollten Bildschirmelemente außerhalb des Seitenrandes, also irgendwo mit hiddentop<0 oder hiddentop<0. Dies ist nötig, da nicht alle Browser Seitenelemente über das `visibility`-Attribut einfach so verbergen können.
`AddElement(element,elapse,left,top)`	Fügt ein Seitenelement in den Film ein `elementname`: Seitenelement-Name `elapse`: Anzeigedauer in Timer-Ticks `left`: X-Anzeigeposition `top`: Y-Anzeigeposition
`ShowElement(number)`	Zeigt ein Seitenelement und parkt die anderen (Standbild) `number`: Nummer in der Liste
`Step(modus)`	Blättert ein Seitenelement weiter `modus`: 0: vorwärts 1: rückwärts
`SetEventHandler(eventhandler)`	Setzt die Funktion, die bei Start oder Stop des Vorganges aufgerufen werden soll Bei Start bekommt die Eventhandler-Funktion dann die Zahl 1, bei Stop 0 übergeben.
`Stop()`	Stoppt den Viewer
`Run(modus)`	Startet das Stummfilmvergnügen `modus`: 0: zyklisch vorwärts 1: zyklisch rückwärts 2: vorwärts bis Ende 3: rückwärts bis Anfang 4: abwechselnd vor und zurück 5: abwechselnd zurück und vor

Quelltext von elviewer.js


/* (c) 2001 Ulrich Kritzner */

function ElViewer_Add_Element(elementname,elapse,left,top)
{
  if (elementname&&elapse)
  {
    this.left[this.count]=left;
    this.top[this.count]=top;
    if (window.document.all)
      this.elements[this.count]=eval("window.document.all."+elementname+".style");
    else
      if (typeof(window.document.getElementById)=="function")
        this.elements[this.count]=window.document.getElementById(elementname).style;
      else
        this.elements[this.count]=eval("window.document."+elementname);
    this.elapse[this.count]=elapse;
    this.count++;
  }
}

function ElViewer_Show_Element(number)
{
  var i;
  this.Stop();
  this.current=number%this.count;
  for (i=0;i<this.count;i++)
  {
    this.elements[i].left=this.hiddenleft;
    this.elements[i].top=this.hiddentop;
  }
  this.elements[this.current].left=this.left[this.current];
  this.elements[this.current].top=this.top[this.current];
}

function ElViewer_Step(_modus)
{
  with (this)
  {
    switch (_modus)
    {
      case 0:
        current=(current+1)%count;
	break;
      case 1:
        current=(current+count-1)%count;
	break;
    }
    ShowElement(current)
  }
}

function ElViewer_TimerFunc()
{
  with (this)
  {
    elements[current].left=hiddenleft;
    elements[current].top=hiddentop;
    switch (modus)
    {
      case 0:
        current=(current+1)%count;
	break;
      case 1:
        current=(current+count-1)%count;
	break;
      case 2:
        if (current<count-1)
          current++;
	else
	  timestep=0;
	break;
      case 3:
        if (current>0)
          current--;
	else
	  timestep=0;
	break;
      case 4:
        if (current<count-1)
          current++;
	else
	{
	  timestep=-1;
	  modus=5;
	}
	break;
      case 5:
        if (current>0)
          current--;
	else
	{
	  timestep=-1;
	  modus=4;
	}
	break;
    }
    elements[current].left=left[current];
    elements[current].top=top[current];
    if (timestep==-1)
      timestep=1;
    else if (timestep>0)
      timestep=elapse[current];
    else if (this.EventHandler)
      this.EventHandler(0);
  }
}

function ElViewer_Set_Event_Handler(eventhandler)
{
  this.EventHandler=eventhandler;
}

function ElViewer_Stop()
{
  var oldrun=this.timestep;
  this.timestep=0;
  if (oldrun)
    if (this.EventHandler)
      this.EventHandler(0);
}

function ElViewer_Run(modus)
{
  this.modus=modus;
  this.Stop();
  this.timestep=1;
  if (this.EventHandler)
    this.EventHandler(1);
  u_timer_continue();
}

function ElViewer(hiddenleft,hiddentop)
{
  this.AddElement=ElViewer_Add_Element;
  this.ShowElement=ElViewer_Show_Element;
  this.TimerFunc=ElViewer_TimerFunc;
  this.SetEventHandler=ElViewer_Set_Event_Handler;
  this.Stop=ElViewer_Stop;
  this.Step=ElViewer_Step;
  this.Run=ElViewer_Run;
  this.hiddenleft=hiddenleft;
  this.hiddentop=hiddentop;
  this.left=new Array();
  this.top=new Array();
  this.elements=new Array();
  this.elapse=new Array();
  this.count=0;
  this.current=0;
  this.timestep=0;
  this.timeval=0;
  this.modus=0;
  u_timer_add_object(this);
}