TreeView-Beschreibung f�r HTML-Programmierer

Getestet mit Netscape3, Netscape4, IE3, IE4, IE5, Opera5: OK, volle Funktion, mit leichten Abstrichen bei Netscape4 (keine sofortige Fettschrift) sowie Netscape3 und IE3 (kein Scrollen). Bei Netscape2 mischen sich Properties (Array.length) mit Indizes (Array[0]), deshalb keine ordentliche Funktion, hier gibt's eine JavaScript-Fehlermeldung.

Wenn Sie die Baumansicht f�r ihre eigenen Projekte verwenden wollen, m�ssen Sie einen Baum der unten verwendeten Struktur erstellen: Jede Ebene besteht aus einem Array von Objekten, die jede eine Eigenschaft (Variable) sub haben k�nnen; das ist dann ein Unter-Ast. Die Objekte haben weitere Variablen Titel und Link sowie target, das ist f�r den dargestellten Text (letztere sind optional und d�rfen null sein), die Variablen Img und ILink sind ebenfalls optional und sind f�r das dargestellte Symbol zust�ndig.
Hinweis: Diese Baumansicht ist nur f�r statische B�ume geeignet, d.h. wenn die Baumstruktur von vornherein komplett bekannt ist!

Vorteilhaft f�r die Baum-Erstellung sind Konstruktoren, die als letzten Parameter sub haben (wie unten angegeben), damit kann man den Baum gewisserma�en im WISYWIG-Verfahren erstellen. Nur bei den Klammern muss man noch h�llisch aufpassen.

F�r immer wiederkehrende �hnliche �ste machen sich speziellere Konstruktoren gut; hier ist es StdLesson().

F�r die Darstellung der +/-Symbole sind 8 Grafiken notwendig, die einfach neben der content.htm liegen und 1.gif..8.gif durchnummeriert sind. Sie sind 11..14x20 Pixel gro�, 16farbig und mit transparenter (wei�er) Hintergrundfarbe. Wie man wohl sieht, stammen sie vom Windows-Explorer; dort sind sie jedoch 16x16 Pixel gro�. Mehr H�he bedeutet mehr Spielraum f�r Schriftgr��e (L�cken vermeiden), weniger Breite spart Platz bei tiefen B�umen.
Mit der Angabe align=texttop rutschten die Bilder optisch in die Mitte des Textes; allerdings ignoriert Opera5 dieses, und die Zeilen haben unsch�ne L�cken, deshalb wurde auf das portablere align=top umgestellt.

Die Speicherung der Information, welche Knoten geschlossen und welche ge�ffnet sind, w�rde normalerweise einen Cookie erfordern, um die Information von einer Seite in die n�chste zu retten.
Stattdessen wird hier diese Information nach einem Fragezeichen an die URL der momentanen Seite angeh�ngt; der Browser (bei Datei) bzw. der Web-Server ignorieren diesen Teil bei der Auffindung einer gew�hnlichen Datei (bei CGI wird diese Info an das CGI-Programm durchgereicht).
Eine Bit-Kette aus Nullen und Einsen speichert schlie�lich diese Info. Als Teil eines Frames sieht man diese Information jedoch (fast) nie.

Au�erdem wird gespeichert, welches Blatt zuletzt angeklickt wurde. Unter IE4+ mit seinen wird dieses Blatt sofort durch Fettschrift kenntlich gemacht, bei allen anderen Browsern erst nach einem weiteren Neulade-Vorgang.

Weiterhin wird die Position der Rollbalken gespeichert, um beim Reload m�glichst die gleiche Position wiederherzustellen. Leider erwies sich SelfHTML als Dokumentationsfehlerschleuder; erst nach eingehender Untersuchung der Unterschiede Netscape<->IE lie� sich das Scrollen auch beim IE4 verwirklichen.

Zur dauerhaften Speicherung des "Aufbl�tter-Zustandes" (also bis zum sp�teren Seiten-Besuch) musste ich doch noch zu einem Cookie greifen. Neben allen vier Parametern (Aufbl�tter-Zustand, angeklicktes Blatt, horizontale und vertikale Scroll-Position) wird auch die URL der rechten Seite gespeichert. (Die Verwendung von Frames ist hier ohnehin angeraten und naheliegend.)

Bei der Programm-Implementierung wurde zun�chst in einer Tabelle ausgegeben; dabei zeigten sich bei Netscape4 (nicht 3) unsch�ne Stockungen (die Tabelle wird erst nach l�ngerer Zeit in einem Rutsch ausgegeben), deshalb wird der Baum nun als normaler Text innerhalb eines <nobr> ausgegeben.
Auch bei Netscape4 (nicht 3) wurde festgestellt, da� die document.write- Anweisung sehr lange braucht; deshalb werden die Teilstrings erst zusammengesetzt und dann in einer ganzen Zeile ausgegeben.

Den Baum darstellen macht schlie�lich ein Aufruf von WriteTree(Baum). Vorherige Initialisierungen trennen die Angaben innerhalb der URL und ermitteln den Speicherplatzbedarf f�r die Bitkette und die maximale Baumtiefe. W�hrend der Erstellung eines eigenen Baums kann man die dabei entstehenden Werte per document.writeln ausgeben.

Eine letzte Optimierung betrifft den IE4+, der es mit dem document.all schafft, HTML-Text mehrzeilig zu �ndern. Damit ist es nun m�glich, ohne Neuladen der Seite den Baum zu �ndern; damit sieht es schon fast perfekt aus. (Vor allem entfallen st�rende Scroll-Effekte.) Der Einfachheit halber wird der ganze Baum neu gezeichnet.


haftmann#software, 08/01