desktop.xslt

Schiebeleisten Eine "Schiebeleiste" ist ein rechteckiger Bereich (Inhaltsbereich), der für die vollständige Anzeige zu hoch sein kann. Man kann sich vorstellen, dass über dem Bereich ein Sichtfenster liegt, durch das ein Ausschnitt des darunter liegenden Bereichs sichtbar ist. Das Sichtfenster und der Inhaltsbereich sind gleich breit. Wenn das Sichtfenster höher ist als der Inhaltsbereich, dann wird der Inhaltsbereich in das Sichtfenster eingepaßt. Er kann im Sichtfenster gestreckt und zentriert oder am oberen Rand angeordnet werden. In den meisten Fällen ist aber der Inhaltsbereich wahrscheinlich höher als das Sichtfenster. Oberhalb und unterhalb des Sichtfensters werden dann "Bewegungs-Schaltflächen" angezeigt. Wenn der Mauszeiger auf die obere Schaltfläche zeigt, dann wird der Inhaltsbereich "unter dem Sichtfenster" nach unten verschoben, bis die obere Kante des Inhaltsbereichs und des Sichtfensters zusammenfallen. Wenn der Mauszeiger auf die untere Schaltfläche zeigt, dann wird der Inhaltsbereich unter dem Sichtfenster nach oben verschoben, bis die Unterkanten des Inhaltsbereichs und des Sichtfensters zusammenfallen. Ein Mausklick auf eine Schaltfläche hält die Bewegung des Inhaltsbereichs an und startet sie wieder. Ein Doppelklick auf eine Schaltfläche zeigt den oberen oder den unteren Rand des Inhaltsbereichs an. Die genannten rechteckigen Bereiche (Inhaltsbereich, Sichtfenster und die beiden Bewegungs-Schaltflächen) bilden zusammen einen umfassenden Bereich. Eine Schiebeleiste ist somit eine Gruppe von fünf Bereichen. Jeder Bereich entspricht einem HTML-Element mit einem id-Attribut. Die id-Werte sind zusammengesetzt aus einem Präfix, das die Gruppe bezeichnet, und einem Suffix, das das Element innerhalb der Gruppe bezeichnet. Durch eine Konvention sind den fünf Elemente die folgenden Suffixe zugeordnet: _main Der umfassende Bereich, der die Bewegungs-Schaltflächen und das Sichtfenster und "darunter" den Inhaltsbereich enthält. _frame Das Sichtfenster. Zusammen mit den Bewegungs-Schaltflächen füllt es den umfassenden Bereich aus. _up Die obere Bewegungs-Schaltfläche _down Die untere Bewegungs-Schaltfläche _content Der Inhaltsbereich. Er ist als HTML-Element im Sichtfenster enthalten. In einer Schiebeleiste wirken die Dokument-Struktur, Cascading Stylesheets und JavaScript zusammen. Die Bewegungs-Schaltflächen sind durch das Wort "mover" im Attribut class gekennzeichnet. Sie können aktiv oder inaktiv sein. Eine aktive Schaltfläche hat das Wort "active" im Attribut class, ein inaktive Schaltfläche das Wort "inactive". Der anfängliche Zustand ist inaktiv. Hier werden zwei Schiebeleisten verwendet: die Abschnittsliste, Präfix ix_, mit Verweisen auf die einzelnen Inhalts-Abschnitte und die Leiste der Vorschaubilder, Präfix sl_.

Popup Ein "Popup" kombiniert mehrere Elemente, die ähnlich wie die Schiebeleisten durch ein gemeinsames Präfix der id-Werte miteinander verbunden sind. Die Suffixe sind: _link Bezeichnet den Knopf, der das eigentliche "Popup"-Fenster öffnet (anzeigt). _frame Das "Popup"-Element, das angezeigt wird, wenn der Anwender den Knopf drückt. _close Der Knopf, der das Popup-Fenster schließt (verbirgt). Es ist möglich, dass derselbe Knopf ein Popup-Fenster öffnet und schließt. Ich gehe hier von dem folgenden Anwendungsmuster aus: Der Öffner (Schaltknopf _link) ist anfangs aktiv, das Popup-Fenster wird nicht angezeigt. Beim Drücken des Öffners wird das Popup-Fenster aktiv und der Öffner selbst inaktiv. Der Schließknopf ist ein Teil des Popup-Fensters. Bei einem Klick auf den Schließknopf wird das Popup-Fenster inaktiv und der Öffner wieder aktiv. Die class - Wörter popact und popinact zeigen den Zustand der Popup-Elemente an. Weitere class - Wörter bezeichnen die Funktion eines Popup-Elements (Öffner, Popup-Fenster, Schließer). popact Dieses Wort im Wert des Attributs class kennzeichnet einen "Öffner" oder ein Popup-Fenster als aktiv. Von einem "Popup" ist entweder der Öffner oder das Popup-Fenster aktiv. popinact Kennzeichnet einen Popup-Öffner oder ein Popup-Fenster als inaktiv. popup Kennzeichnet ein Popup-Fenster. close Kennzeichnet einen Schließknopf eines Popups. Der "Schließen"-Knopf wird als Teil des Popup-Fensters nicht zwischen "aktiv" und "inaktiv" umgeschaltet. Hier verwende ich drei Popups: set Das Präfix set bezeichnet ein Popup, in dem der Anwender Einstellungen vornehmen kann. about Das Präfix about bezeichnet ein Popup mit Information über die Verantworlichen für die Website. help Das Präfix help bezeichnet ein Popup mit einer kurzen Hilfe zu Tasten-Befehlen.

Attribute im erzeugten XHTML-Dokument In der folgenden Liste steht der Platzhalter [section] für die Kennung eines is:section - Elements im Format s9+, wobei 9+ für die laufende Nummer des Abschnitts steht. [jpg] steht für die Kennung eines is:jpg - Elements, den Bilddateinamen ohne die Endung .jpg. Das erzeugte XHTML-Dokument verwendet die folgenden id-Attribute: audio Das audio-Element zur Klangwiedergabe. header Leerer Abschnitt, Kopf der Seite ix_main Abschnittsliste (eine Schiebeleiste) ix_up Die obere Bewegungs-Schaltfläche der Abschnittsliste zur Bewegung nach oben ix_frame Das Sichtfenster der Abschnittsliste ix_content Der Inhaltsbereich der Abschnittsliste ix_down Die untere Bewegungs-Schaltfläche der Abschnittsliste zur Bewegung nach unten li_[section] Der Eintrag zum Abschnitt [section] in der Abschnittsliste. sl_main Leiste der Vorschaubilder (eine Schiebeleiste) sl_up Die obere Bewegungs-Schaltfläche der Vorschaubilder sl_frame Das Sichtfenster der Vorschaubilder sl_content Der Inhaltsbereich der Vorschaubilder sl_down Die untere Bewegungs-Schaltfläche der Vorschaubilder slides_[section] Unterabschnitt der Vorschaubider mit den Bildern zum Abschnitt [section]. div_[section]_[jpg]_[lnr] Rahmen für das Vorschaubild mit der Datei-Kennung (Dateiname ohne ".jpg") [jpg]. [lnr] ist die Nummer des Bildes innerhalb des Abschnitts, beginnend mit 0. div_title Die Titel-Leiste. Sie besteht aus dem Logo (div_logo), der Seiten-Überschrift (div_head), dem Menüfeld (div_links) und der Ton-Schaltfläche (div_sound). div_head Die Seiten-Überschrift in der Titel-Leiste Damit die voreingestellte Darstellung eines h1-Elements mit einem oberen Rand (margin) die "Geometrie" nicht stört, ist das h1-Element in einem div-Element verschachtelt. div_logo Feld für das Logo in der Titelleiste div_links Menüfeld mit Verweisen und "Knöpfen" views_link Der Knopf öffnet das Fenster "Ansichten". help_link Der Knopf öffnet das Popup-Fenster "Befehle". div_sound Schaltfläche zum Starten und Beenden der Tonwiedergabe. div_main Der Haupt-Inhalt mit dem Haupttext (ID mt_main) oder dem Haupt-Bild (ID div_mainimg) mt_main Das umfassende Element für den Text der Abschnitte (Haupttext) div_mainimg Abschnitt (Rahmen) des Haupt-Bildes img_main Das Haupt-Bild span_[jpg]_[lnr] Verweis auf ein Bild im Haupttext iimg_[jpg]_[lnr] Ein Inline-Bild am Ende des Haupttextes set_frame Popup-Fenster "Einstellung ..." sel_imagesize Auswahlfeld "Bildgröße" im Fenster "Einstellung ..." sel_view Auswahlfeld "Bilddarstellung" im Fenster "Einstellung ..." sel_imgframe Auswahlfeld "Bildrahmen" im Fenster "Einstellung ..." sel_duration Zahl-Eingabefeld "Anzeigedauer bei Bildlauf" im Fenster "Einstellung ..." sel_sequence Auswahlfeld "Bildlauf" im Fenster "Einstellung ..." chk_global Markierungsfeld "Alle Bilder" im Fenster "Einstellung ..." inp_start Schaltfläche "Start" im Fenster "Einstellung ..." sel_slides Auswahlfeld "Vorschaubilder" im Fenster "Einstellung ..." sel_menu Auswahlfeld "Menü" im Fenster "Einstellung ..." sel_evtsect Auswahlfeld "Abschnittwahl" im Fenster "Einstellung ..." sel_evtsl Auswahlfeld "Bildwahl" im Fenster "Einstellung ..." sel_evtlink Auswahlfeld "Verweis" im Fenster "Einstellung ..." about_frame Info-Fenster: ein Popup-Fenster, das die Menschen hinter der Website nennt. help_frame Popup-Fenster "Befehle" views_frame Popup-Fenster "Ansichten" footer Leerer Abschnitt, Fuß der Seite Das erzeugte XHTML-Dokument verwendet neben den "Popup"-Wörtern die folgenden Wörter in class-Attributen: slide Rahmen um ein Vorschau-Bild imglink Verweis auf ein Bild im Text oder ein Inline-Vorschaubild sectlink Verweis (span-Element) auf einen Abschnitt der Bildergeschichte. Das zweite Wort das Attributs class bezeichnet den Abschnitt, auf den verwiesen wird. mover Bewegungs-Schalter in der Vorschau-Leiste oder der Index-Leiste shown Dieses Wort wird für Elemente verwendet, die ein- und ausgeblendet werden können. shown bedeutet, dass das Element angezeigt werden soll. paused Dieses Wort wird für die Tonwiedergabe-Schaltfläche verwendet. Es bedeutet, dass die Tonwiedergabe gestartet werden kann. Javascript ersetzt paused durch hidden, wenn der Klang (wahrscheinlich) nicht abgespielt werden kann, und durch playing, wenn die Klangwiedergabe läuft. Hier wird paused zu Anfang eingestellt. machine Der Wert kennzeichnet Hinweise (div-Elemente) auf die maschinelle Übersetzung. Jeder Abschnitt kann einen solchen Hinweis enthalten.

Von der Element-ID zum Dateipfad der Bilddatei Wenn dieselbe Transformation mehrmals ausgeführt wird, sollten bei jedem Mal dieselben id-Werte erzeugt werden. Das erleichtert Verweise von "außen" auf bestimmte Elemente. Die Funktion generate-id ist nicht geeignet. Eine ID soll die folgenden Elemente eindeutig bezeichnen: den Abschnitt (section im XML-Quelltext) ein Bild einen Verweis auf ein Bild Die Abschnitte werden einfach durchnummeriert. Eine Kennung s[lnr] bezeichnet den Abschnitt Nr. [lnr]: s12 bezeichnet den 12. Abschnitt. Bilder (Bilddateien) sind durch das Attribut jpg /@src eindeutig bestimmt. Die jpg - Elemente verweisen auf eine Bilddatei. Mehrere jpg - Elemente können auf dieselbe Bilddatei verweisen. In der Darstellung gibt es zu einem jpg - Element der Quelldatei einen Bildverweis im Text und ein Vorschaubildchen, das ebenfalls auf das Bild verweist. Es ist möglich, dass ein Abschnitt der Quelldatei kein jpg - Element enthält. Oft enthält der erste oder der letzte Abschnitt keinen Bildverweis. In der Darstellung erscheint zu einem Abschnitt ohne Bildverweis aber eine Leiste von Vorschaubildchen, die aus jedem Abschnitt mit einem Bildverweis das erste Bild enthält. Die id-Attribute der XHTML-Elemente, die auf einem jpg-Element beruhen, sind aus vier Komponenten zusammengesetzt: Dem Namen des XHTML-Elements (span oder div). Der Kennung des Abschnitts in der Form "s99". Dabei steht 99 für die laufende Nummer des Abschnitts. Der Kennung der Bilddatei (Dateiname ohne das Suffix .jpg) Der laufenden Nummer des jpg-Elements in der Quell-Datei Die Komponenten sind durch Unterstriche ("_") verbunden.

e		←
h		→
i		Scrn↑
c		Scrn↓
s		Pos 1
n		End
z		↑
m		↓
p		g
w		d
b		a