desktop.js


Übersicht

Die Datei desktop.js enthält Code für die Website kleider.herbaer.de. Zusammen mit den Dateien desktop.xslt (Text) und desktop.css (Quelltext) dient sie der Darstellung der Bildergeschichten (XML-Namensraum http://herbaer.de/xmlns/20080705/imgshow) und der Hilfe (help.xhtml) auf Desktop-Geräten.

Sie setzt voraus, dass die Javascript-Datei common.js (Quelltext) geladen ist.

Einige globale Variablen werden in der Funktion initialize oder beim ersten Aufruf von onResize einmalig mit Werten belegt, die aber nicht in dieser Datei definiert sind.

Zu diesen Variablen gehören Maße der Darstellung von Elementen, die aus CSS-Regeln ermittelt werden. Diese Variablen werden beim ersten Aufruf der Prozedur onResize initialisiert und in dieser Prozedur auch gelesen.

Andere Variable sind DOM-Elemente, die anfangs einmal ermittelt werden. Von einigen DOM-Elementen wird nur das style-Objekt benutzt. In diesen Fällen wird auch nur das style-Objekt in einer globalen Variablen gespeichert.

show_elt (elt)
hide_elt (elt)
Sequencer ()
  sequencer.timer
  sequencer.msec
  sequencer.mode
  sequencer.num       // Anzahl der Einträge
  sequencer.current   // Der aktuelle Eintrag
  sequencer.shf_arr   // Misch-Feld
  sequencer.tmfunc
Sequencer.prototype.on_start
Sequencer.prototype.start
Sequencer.prototype.stop
Sequencer.prototype.restart
Sequencer.prototype.toggle
Sequencer.prototype.setmode (mode)
Sequencer.prototype.shuffle
Sequencer.prototype.select (index)
Sequencer.prototype.nextstep
Sequencer.prototype.backstep
Breaker ()
  breaker.value
  breaker.msec
  breaker.tf
Breaker.prototype.set

var prf_img;         // Pfad-Prefix der Bilddateien
var ix_width;
var slides_msec;     // Schrittdauer der Vorschaubilder-Leiste
var min_width;       // Anfängliche Breite des Body-Elements ist die Mindestbreite
var min_height;      // Anfängliche Höhe des Body-Elements ist die Mindesthöhe
var slides_width;    // Breite der Vorschaubilder-Leiste
var logo_height;     // Höhe der Titel-Leiste: Logo, Titel und Menüfeld
var menu_height;     // Höhe einer Menü-Zeile
var header_height;   // Höhe des Kopfes in Pixeln
var footer_height;   // Höhe des Fußes in Pixeln
var cont_height;     // Höhe des Inhaltsbereichs, die Kopf und Fuß frei lassen
var sldiv_height;    // Höhe des "Rahmens" (div) um ein Vorschau-Bild
var last_id;         // ID zum letzten Vorschaubild
var url_galery;      // URL der "Galerie"
var style_body;      // "Style" der Gesamt-Seite
var style_logo;      // "Style" des Logos
var style_head;      // "Style" der Überschrift (rechts des Logos)
var style_main;      // "Style" des Haupt-Inhaltsfeldes
var div_title;       // die Titelleiste
var div_links;       // das Menüfeld
var div_header;      // die Kopfleiste
var div_sound;       // Abschnitt mit Schalter zum "Ogg-Spieler"
var div_mainimg;     // Abschnitt des Haupt-Bildes (Rahmen)
var img_mainimg;     // Haupt-Bild (Element)
var div_footer;      // die Fußleiste
var div_mt;          // Haupttext-Abschnitt
var mover_ix;        // Index-Schiebeleiste
  mover_ix.num_entries
  mover_ix.show_entry (ix)
var mover_sl;        // Vorschau-Schiebeleiste
var popup_set;       // Popup "Einstellungen"
  popup_set.initialized
  popup_set.show_title = 1
  popup_set.menu = "t"
  popup_set.header = "t"
  popup_set.show_footer = 1
  popup_set.sections = "l"
  popup_set.slides = "r"
  popup_set.imgdir
  popup_set.view
  popup_set.on_open ()
  popup_set.on_close ()
var popup_about;     // Popup "Über ..."
var popup_help;      // Popup "Befehle"
var seq;             // der Bildfolgen-Abspieler
  seq.msec
  seq.select (ix)
  seq.on_start ()
var mouseover_stop;  // Unterbrecher für "MouseOver"
var the_store;       // der Datenspeicher: localStorage oder sessionStorage
var cur_sectid;      // ID des aktiven Abschnitts (show_section / show_section_and_image)
var cur_li;          // der aktuelle Index-Eintrag (Abschnitt)
var cur_textdiv;     // der aktuelle Text-Abschnitt
var cur_slidesdiv;   // der aktuelle Slides-Abschnitt
var b_imgshown;      // wird ein Bild angezeigt? (show_text / show_image)
var cur_ifid;        // Datei-Kennung des aktuellen Bildes (show_image)
var b_frame;         // "Rahmenelemente" oder nur das Hauptfeld? (Taste b)
var cur_sldiv;       // Rahmen um das aktuell hervorgehobene Vorschau-Bild
var cur_sldivid ;    // ID zum aktuell hervorgehobenen Vorschau-Bild
var cur_id;          // aktuelle ID eines Elements
var sz_main;
var sound_elt;
var sound_playing;   // Spielt die Musik?
initialize_sound ()
sound_on_ended (event)
sound_play_pause (event)
get_id_components (combi_id)
hilite_elt_on (elt)
hilite_elt_off (elt)
hilite_slide (id)
show_text ()
show_image (ifid)
do_show_image ()
show_section (id)
show_section_and_image (id)
get_stored_settings ()
initialize ()
tell_about (event)
onResize (event)
onKeydown (event)
followIndexEntry (event)
updateIndexHandlers (evtname_old, evtname_new)
followSlide (event)
updateSlidesHandlers (evtname_old, evtname_new)
on_mouseover_imglink (event)
followImglink (event)
followSectlink (event)
updateLinkHandlers (evtname_old, evtname_new)
on_click_start (event)

Funktionen und Variablen

show_elt (elt)

Wenn elt nicht null ist, ersetzt diese Funktion das Wort "hidden" im Attribut class des XHTML-Elements elt durch "shown". CSS-Regeln können dann die Darstellung des Elements ändern. Bei typischen Anwendungen enthält das Attribut class bereits das Wort "shown" oder "hidden".

show_elt wird von onResize aufgerufen.

hide_elt (elt)

Die Funktion setzt voraus, dass elt ein Element mit dem Attribut class ist. Sie ersetzt das Wort "shown" im Attribut class des Elements elt durch "hidden".

Wie show_elt wird hide_elt von onResize aufgerufen.

Sequencer

Die Klasse Sequencer ruft in regelmäßigen Zeitabständen die Methode select auf, der sie eine natürliche Zahl als Parameter übergibt. Der Parameter kann auf verschiedene Arten bestimmt werden.

sequencer.timer

timer ist entweder null oder eine Kennzahl, die die Funktion window.setTimeout liefert (Zeitschalter). Der Zeitschalter ruft die Funktion tmfunc auf, die die Methode nextstep, gebunden an das Sequencer-Objekt, aufruft.

Die Methoden start und nextstep setzen timer, die Methode stop setzt timer zurück auf null.

sequencer.msec

msec ist die Zeit in Millisekunden zwischen zwei Aufrufen von tmfunc und damit indirekt der Methode select. Der Initialwert ist 2000.

sequencer.mode

mode steuert die Art, wie der Parameter des Aufrufs von select bestimmt wird. Die möglichen Werte sind:

0Es wird immer der Wert von current übergeben. current wird nicht geändert.
1Der Parameter durchläuft aufsteigend die ganzen Zahlen von 0 an. Wenn die obere Schranke num größer als Null ist, wird beim Erreichen des Werts num der Parameter auf 0 zurückgesetzt. Es werden wiederholt die Zahlen von 0 bis num - 1 durchlaufen.
2Der Parameter durchläuft absteigend die ganzen Zahlen. Wenn die obere Schranke num größer als Null ist, wird beim Erreichen des Werts -1 der Parameter auf num - 1 gesetzt. Es werden wiederholt die Zahlen von num - 1 bis 0 durchlaufen.
3Wenn num größer als Null ist, wird pseudo-zufällig eine ganze Zahl von 0 bis num - 1 (gleichverteilt) ausgewählt. Wenn num Null ist, wird immer 0 als Parameter übergeben.
4Wenn num Null ist, durchläuft der Parameter die ganzen Zahlen. Wenn num größer als Null ist, durchläuft current wiederholt die ganzen Zahlen von 0 bis num - 1. Immer wenn current den Wert Null erreicht, werden die ganzen Zahlen von 0 bis num - 1 neu gemischt (shf_arr). Die Zahl an der Position current im Feld shf_arr wird als Parameter an select übergeben.
sequencer.num

Wenn num größer als Null ist, werden nur ganze Zahlen im Bereich von 0 bis num - 1 als Parameter an select übergeben.

sequencer.current

current ist ein interner Zähler, der vor jedem Aufruf von select in der Methode nextstep weitergesetzt wird. Wenn num größer ist als Null, durchläuft current die ganzen Zahlen von 0 bis num - 1.

sequencer.shf_arr

Im Fall num > 0 und mode = 4 ist shf_arr ein Feld, das die ganzen Zahlen von 0 bis num - 1 in einer pseudo-zufälligen Reihenfolge enthält. Die Methode shuffle legt das Feld bei Bedarf neu an und mischt die Komponenten.

sequencer.tmfunc

Die Funktion tmfunc ruft die Methode nextstep des aktuellen Sequencer-Objekts auf. Die Methode nextstep übergibt sie der Funktion window.setTimeout als Parameter.

Sequencer::on_start

Diese Methode wird von start aufgerufen. Wenn das Ergebnis false ist, startet die Aufruf-Sequenz nicht. Die Methode kann in einzelnen Objekten überschrieben werden und nötige Initialisierungen vornehmen. Diese Klassen-Methode ergibt einfach true.

Sequencer::start

Die Methode start startet den regelmäßigen Aufruf der Methode select.

Wenn der Zeitschalter timer nicht gesetzt (null) ist und on_start true ergibt, ruft sie die Funktion window.setTimeout, die ohne Verzögerung die Funktion tmfunc aufruft. Wenn timer gesetzt ist oder on_start false ergibt, macht die Methode nichts.

Sequencer::stop

Die Methode stop beendet den regelmäßigen Aufruf der Methode select, indem sie window.clearTimeout aufruft.

Sequencer::restart

Wenn der Zeitschalter timer null ist, macht diese Methode nichts. Andernfalls ruft restart erst stop und dann select auf. So verkürzt restart die Zeit bis zum nächsten Aufruf von select.

Sequencer::toggle

Die Methode toggle ruft start auf, wenn der Zeitschalter timer nicht gesetzt ist. Andernfalls ruft sie stop auf.

Sequencer::setmode (mode)

Setzt das Feld (mode) auf den Wert des Parameters mode. Wenn nötig, mischt sie das Feld shf_arr durch einen Aufruf von shuffle neu: Wenn nämlich der neue Modus (Parameter mode) 4 ist, aber nicht der alte Modus (mode), und num positiv ist.

Sequencer::shuffle (mode)

Wenn das Feld shf_arr nicht existiert, legt es diese Methode neu an und füllt es mit den Zahlen von 0 bis num.

Sie mischt die Elemente des Feldes, indem sie pseudo-zufällig ein Element vom Anfang auswählt und es mit dem letzten Element des noch nicht neu gemischten Bereichs tauscht.

Sequencer::select

Die Methode select ist die Methode, die regelmäßig aufgerufen wird. Sie sollte objekt-spezifisch definiert sein. Die Klassen-Methode ist ein Platzhalter, der nichts tut.

Sequencer::nextstep

nextstep ist die Methode, die von tmfunc aufgerufen wird. Sie setzt zunächst current auf den nächsten Wert, ruft bei Bedarf shuffle auf, dann select und schließlich window.setTimeout für den nächsten verzögerten Aufruf von tmfunc und damit von select.

Diese Methode ist nur für den internen Aufruf gedacht und sollte nicht ausserhalb des Objekts aufgerufen werden: Sie prüft nicht, ob der Zeitschalter (timer) überhaupt gesetzt ist und würde versuchen, den Zeitschalter ggf. ohne nötige Initialisierungen durch on_start zu starten.

Sequencer::backstep

Wenn der Zeitschalter timer nicht gesetzt ist, macht diese Methode nichts.

Andernfalls ruft backstep select mit dem vorhergehenden statt des nächsten Parameterwertes auf.

In manchen Fällen ist das nicht möglich: nämlich im Modus "Zufällige Auswahl" (mode = 3) oder wenn im Modus "Mischen" (mode = 4) das Feld shf_arr gerade neu gemischt ist. backstep ruft dann select erneut mit dem aktuellen Parameterwert auf.

Nach dem Aufruf von select startet sie den Zeitschalter neu.

Breaker

Die Klasse Breaker setzt für eine bestimmte Zeit (msec) das Feld value auf den Wert true. Während dieser Zeit kann zum Beispiel die Behandlung von Ereignissen unterbrochen werden.

breaker.value

Die logische Variable value wird mit false initialisiert. Die Methode set setzt sie für die Dauer von msec ms auf true.

breaker.msec

Die Zeitdauer in Millisekunden, die die Methode set das Feld value auf true setzt.

breaker.tf

Die Funktion tf setzt value zurück auf false. Sie wird von der Methode set verzögert aufgerufen.

Breaker::set

Die Methode set setzt value auf true und ruft dann tf mit einer Verzögerung von msec ms auf. tf setzt value wieder auf false.

prf_img

prf_img ist das Präfix des Pfads der Bilddateien. Diese Variable muß außerhalb dieser Datei deklariert und initialisiert sein. Sie wird in der Methode popup_set.on_close gelesen.

Für die "Bildgeschichten" wird diese Variable in der Datei desktop.xslt (Text) definiert.

ix_width

ix_width steuert die Breite der Abschnitts-Liste (in der Voreinstellung auf der linken Seite). Das VarValue - Objekt wird in der Funktion onResize benutzt. Die Breite der Abschnitts-Liste beträgt 30 Prozent der Breite des Fensters, mindestens aber 150 Pixel und höchstens 500 Pixel.

slides_msec

slides_msec ist die Zeitdauer in Millisekunden zwischen zwei Bewegungsschritten der Vorschaubilder, während der Mauszeiger auf eine der Bewegungs-Schaltflächen der Vorschaubilder zeigt. Der Wert wird mover_sl.millisec zugewiesen.

min_width

Die Mindestbreite des body-Elements in Pixeln. Der Wert ist die Hälfte der anfänglichen Breite, die die Datei desktop.css (Quelltext) vorgibt. Wenn sich die Fenstergröße ändert (onResize), wird das body-Element so breit wie das Fenster, aber nicht schmaler als min_width Pixel.

min_height

Die Mindesthöhe des body-Elements in Pixeln. Der Wert ist die Hälfte der anfänglichen Höhe, die die Datei desktop.css (Quelltext) vorgibt. Wenn sich die Fenstergröße ändert (onResize), wird das body-Element so hoch wie das Fenster, wenigstens aber min_height Pixel hoch.

slides_width

Die Breite der Leiste der Vorschaubilder (Element mit der ID sl_main) in Pixeln. Der Wert ist die Breite eines "Rahmens" der Vorschaubilder, definiert in desktop.css (Quelltext). Die Funktion onResize benutzt diesen Wert zur Positionierung der Vorschaubilder (in der Voreinstellung an der rechten Seite).

logo_height

Die Höhe der Titelleiste (ID div_title). Sie ist das Maximum der ursprünglichen Höhen des Logo-Feldes (ID div_logo) und der Summe der Höhen des Titels (ID div_head) und des Menüfeldes (ID div_links).

menu_height

Die Höhe des Menüfeldes (ID div_links) über der Überschrift.

header_height

Die maximale Höhe der Kopfleiste (Element mit der ID header) in Pixeln. Der Wert ist die Höhe zu Anfang, festgelegt in der Datei desktop.css (Quelltext).

Das body-Element wird zunächst durch die Titelleiste (Logo, Titel und Menüfeld) und das Haupt-Inhaltsfeld ausgefüllt. Nur wenn das body-Element höher ist als die Summe der Höhe der Titelleiste und der Höhe des Haupt-Inhaltsfelds zu Anfang (cont_height), wird die Kopfleiste angezeigt.

footer_height

Die maximale Höhe der Fußleiste (Element mit der ID footer) in Pixeln. Der Wert ist die Höhe zu Anfang, festgelegt in der Datei desktop.css (Quelltext).

Die Titelleiste, das Haupt-Inhaltsfeld und die Kopfleiste werden vorrangig vor der Fußleiste angezeigt. Die Kopfleiste und die Titelleiste können aber ausgeschaltet werden. Nur wenn die Summe der anfänglichen Höhen der vorrangig angezeigten Elemente kleiner ist als die Höhe des body-Elements, wird die Fußleiste angezeigt (sofern nicht ausgeblendet).

cont_height

Die "minimale" Höhe des Haupt-Inhaltsfeldes (Element mit der ID div_main) in Pixeln. Der Wert ist die Höhe zu Anfang, festgelegt in der Datei desktop.css (Quelltext).

Wenn die Höhe des body-Elements kleiner ist als die Summe von cont_height und, falls angezeigt, der Höhe der Titelleiste (logo_height) wird das Haupt-Inhaltsfeld nur in der verfügbaren Höhe (der Differenz) angezeigt. cont_height ist also nicht wirklich die minimale Höhe.

Wenn die Höhe des body-Elements größer ist, werden die Kopfleiste und die Fußleiste angezeigt, sofern deren Anzeige nicht ausgeschaltet ist. Erst wenn die Summe der anfänglichen Höhen der Titelleiste, des Haupt-Inhaltsfeldes und, sofern angezeigt, der Kopfleiste und der Fußleiste kleiner ist als die Höhe des body-Elements, wird das Haupt-Inhaltsfeld höher dargestellt. Nach jeder Größenanpassung addieren sich die Höhen der angezeigten Elemente Titelleiste, Kopfleiste, Haupt-Inhaltsfeld und Fußleiste zur Höhe des body-Elements.

sldiv_height

Die Höhe des Rahmens um ein Vorschaubild. Der Wert ist die Höhe (in Pixeln) des ersten "Enkels" des Inhaltsbereichs der Vorschauleiste (ID sl_content). Dessen "Kinder" sind div-Elemente zu den Abschnitten, deren Kinder sind die div-Elemente (class slide), deren Hintergrund die Vorschaubilder sind. Die CSS-Datei desktop.css (Quelltext) setzt deren Höhe.

Der Wert wird in der Funktion hilite_slide benutzt, um die nötige Verschiebung der Vorschaubilder zu bestimmen, mit der das richtige Bild sichtbar ist. Er ist auch die Schrittweite der automatischen Bewegung der Vorschaubilder (mover_sl.stepwid).

last_id

Die "ID" des letzten Bildes: der Wert des Attributs id des letzten Vorschau-Bildrahmens des letzten Abschnitts ohne das Präfix "div_".

Die Variable wird bei der Behandlung der Taste Ende benutzt und bei Bedarf initialisiert.

url_galery

Die URL der "Galerie"-Darstellung (Stub). Der Wert ist das Verweisziel des Verweises mit der ID link_galery. Er wird zur Behandlung der Taste G benutzt (onKeydown)

style_body

Das style-Objekt des body-Elements. Die Funktion onResize nutzt es zur Anpassung an die Fenstergröße.

Das style-Objekt des Logo-Feldes in der Titelleiste mit der ID div_logo, falls die Bildergeschichte nicht eingebettet angezeigt wird. Es wird in der Funktion onResize zur Positionierung benutzt.

style_head

Das style-Objekt des Titels mit der ID div_head. Es wird in der Funktion onResize zur Positionierung benutzt.

style_main

Das style-Objekt des Haupt-Inhaltsbereichs mit der ID div_main. Es wird in der Funktion onResize zur Positionierung benutzt.

div_title

Die Titelleiste. Sie wird in der Funktion onResize positioniert oder verborgen.

Das Menüfeld in der Titelleiste. Es wird in der Funktion onResize verborgen oder angezeigt und positioniert.

div_header

Die Kopfleiste oberhalb der Titelliste. Sie wird in der Funktion onResize verborgen oder angezeigt und positioniert.

div_sound

Die Schaltfläche für den Klang in der Titelleiste. Wenn die Bildergeschichte eingebettet angezeigt wird, dann wird diese Schaltfläche bei der Initialisierung (initialize) verborgen. Falls das audio - Element zur Klangwiedergabe nicht verfügbar ist, wird sie in der Funktion initialize_sound verborgen.

div_mainimg

Das Feld, in dem das Haupt-Bild angezeigt wird. Die Funktion show_text verbirgt das Feld, die Funktion do_show_image zeigt das Feld an und setzt den oberen Innenabstand gemäß der Einstellung "Bilddarstellung" (popup_set.view).

img_mainimg

Das Haupt-Bild.

Die Funktion show_image setzt die Quell-Datei (Attribut src), die Funktion do_show_image setzt das Attribut class auf einen der Werte normal, fullheight oder fullwidth.

Die Fußleiste am unteren Rand. Sie wird in der Funktion onResize verborgen oder angezeigt und positioniert.

div_mt

Der Haupt-Textabschnitt. Die Funktion show_text zeigt ihn an und die Funktion do_show_image verbirgt ihn.

mover_ix

Das Objekt der Klasse Moveable steht für die Abschnitts-Liste.

Zu den Feldern und Methoden, die die Klasse definiert, hat mover_ix zwei weitere Elemente:

num_entries

Die Anzahl der Abschnitte. Dieses Feld wird in der Methode show_entry gelesen.

show_entry (ix)

Zeigt den Eintrag zum Abschnitt an der Position ix. Dabei wird angenommen, daß die Einträge etwa dieselbe Höhe einnehmen und daß etwa 40% der gesamten Liste zu sehen sind.

Die Methode wird in den Funktionen show_section und onKeydown aufgerufen.

mover_sl

Das Objekt der Klasse Moveable steht für die Leiste der Vorschaubilder. Es enthält nur die Komponenten, die die Klasse definiert. Das Feld millisec wird mit dem Wert slides_msec initialisiert, das Feld stepwid mit sldiv_height, der Höhe des Rahmens um ein Vorschaubild.

Die Funktion hilite_slide ruft die Methode show auf, damit das aktuelle Bild in der Vorschau zu sehen ist.

Die Funktion show_section ruft die Methode update_content auf, damit die Länge der Leiste der Vorschaubilder zum neuen Abschnitt in den Feldern des Objekts übernommen wird.

Die Methode seq.on_start liest mover_sl.content, um die Liste der Bildkennungen für einen "globalen" Bildlauf zu erstellen.

Die Funktion onResize verbirgt die Vorschaubilder an oder zeigt sie an und positioniert sie.

popup_set

Das Objekt der Klasse Popup steht für das Fenster "Einstellungen" (Kennung set). Objektspezifische Felder enthalten die aktuelle Einstellung. Nicht alle Felder von popup_set entsprechen Eingabe-Elementen in Fenster "Einstellungen". Manche Einstellungen vorgegebenen Einstellungen können nicht im Fenster "Einstellungen" geändert werden.

popup_set definiert eigene Methoden on_open und on_close.

initialized

Normalerweise werden beim Schließen (on_close) die Einstellungen lokal gespeichert (the_store). Beim ersten Aufruf der Methode on_close während der Initialisierung ist das allerdings nicht nötig. Dieses Feld wird mit false initialisiert und am Ende der Methode on_close auf true gesetzt, wenn das Storage-Objekt the_store existiert. Wenn das Storage-Objekt nicht existiert, ist initialized nicht relevant.

show_title

Das logische Feld show_title zeigt der Funktion onResize an, ob die Titelleiste (div_title) anzuzeigen ist. Es wird mit 1 initialisiert.

menu

Das Feld zeigt der Funktion onResize an, ob und wie das Menüfeld (div_links) anzuzeigen ist. Die möglichen Werte sind "h" (verbergen), "t" (über dem Titel) und "b" (unter dem Titel).

Der eingestellte Wert ist "t".

header

Das Feld zeigt der Funktion onResize an, ob und wo die Kopfleiste (div_header) anzuzeigen ist, wenn das Fenster groß genug ist. Die möglichen Werte sind "h" (verbergen), "t" (über der Titelleiste) und "b" (unter der Titelleiste).

Der eingestellte Wert ist "t".

Das logische Feld show_footer zeigt der Funktion onResize an, ob die Fußleiste (div_footer) anzuzeigen ist, wenn das Fenster groß genug ist.

Der eingestellte Wert ist 1.

sections

Das Feld sections zeigt der Funktion onResize an, ob und wo die Liste der Abschnitte (mover_ix) anzuzeigen ist. Die möglichen Werte sind "h" (verbergen), "l" (links) und "r" (rechts).

Der eingestellte Wert ist "l".

slides

Das Feld slides zeigt der Funktion onResize an, ob und wo die Vorschaubilder (mover_sl) anzuzeigen sind. Die möglichen Werte sind "h" (verbergen), "l" (links) und "r" (rechts).

Der eingestellte Wert ist "r".

imgdir

Das Verzeichnis der Bilddateien. Es ist zusammengesetzt aus dem Präfix prf_img und der Einstellung im Auswahlfeld "Bildgröße". Die möglichen Werte sind in der Datei desktop.xslt (Text) vorgegeben, zur Zeit "images/" oder "smallimg/".

popup_set.imgdir wird in der Funktion show_image gelesen.

view

Der Wert im Auswahlfeld "Bilddarstellung" (ID sel_view). Abhängig von diesem Wert bestimmt die Funktion do_show_image den oberen Innenabstand (padding-top) des Rahmens (div_mainimg) und das Attribut class des Bildes (img_mainimg).

on_open

Wenn das Fenster "Einstellungen" geöffnet wird, setzt diese Methode den Text der Schaltfläche mit der ID inp_start auf den Wert "■" oder "▶", abhängig davon, ob die Bilder automatisch laufen (s. seq.timer).

on_close

Diese Methode übernimmt die Einstellungen der Eingabe-Elemente. Wenn die Einstellung im Auswahlfeld "Bilddarstellung" (ID select_view) geändert ist, ruft sie die Funktion do_show_image auf. Bei einer Änderung im Auswahlfeld "Bildrahmen" (ID sel_imgframe) ändert sie direkt das Attribut class des "Bildrahmens" (div_mainimg).

Bei Änderungen der Werte in den Eingabefeldern, die in der folgenden Tabelle genannt werden, ruft on_close die genannte Funktion auf:

FeldIDFunktion
Abschnittwahlsel_evtsectupdateIndexHandlers
Bildwahlsel_evtslupdateSlidesHandlers
Verweissel_evtlinkupdateLinkHandlers

Die Eingabe im Feld "Anzeigedauer" (ID sel_duration) wird im Feld seq.msec gespeichert.

Wenn die Markierung des Feldes "Alle Bilder" (ID chk_global) geändert wird oder die Auswahl im Feld "Bildlauf" (ID sel_sequence) nicht dem Wert seq.mode entspricht, aktualisiert seq.restart den Bildlauf.

Wenn das Storage-Objekt the_store existiert und this.initialized logisch wahr ist, werden die neuen Einstellungen im Objekt the_store unter dem Schlüssel "set" gespeichert.

on_close wird nicht nur in der Methode close aufgerufen, sondern auch am Ende der Initialisierung (Funktion initialize).

Das Fenster "Einstellungen" wird geschlossen (popup_set.close) von der Funktion onKeydown bei der Behandlung der Tasten C und S und von der Funktion on_click_start (Mausklick auf dem Knopf "▶/■", ID inp_start).

Die Taste E öffnet oder schließt das Fenster (popup_set.toggle).

popup_about

Die Variable popup_about stellt das Info-Fenster (Klasse Popup) dar.

Ein Mausklick auf die Schaltfläche "Über ..." im Menüfeld (div_links) öffnet das Fenster. Ein Mausklick auf das Logo (ID div_logo) oder die Fußleiste (div_footer) öffnet oder schließt das Fenster (addSwitch).

Die Taste C schließt das Fenster, die Taste I öffnet oder schließt (toggle) es.

popup_help

Die Variable popup_help stellt das Fenster "Befehle" (Klasse Popup) dar.

Die Tasten C, E und I schließen das Fenster, die Taste H oder ein Klick auf das Hilfe-Fragezeichen (ID btn_help) öffnen oder schließwn (toggle) es.

seq

Dieses Sequencer-Objekt steuert den Bildlauf. Zum Bildlauf gibt es eine Liste der Kennungen der Bilder, die in den Bildlauf einbezogen sind ("Closure"-Variable).

msec

Der Wert wird aus dem Eingabefeld "Anzeigedauer" (ID sel_duration) gelesen.

select

Die Methode select zeigt das Bild mit dem übergebenen Index in der Liste an. Dazu ruft sie die Funktion show_section_and_image auf.

on_start

Sie aktualisiert die Bilderliste, falls nötig, und übernimmt die Einstellung im Auswahlfeld "Bildlauf" (ID sel_sequence).

Die Einstellung "Anzeigedauer" wird beim Schließen des Fensters "Einstellungen" (popup_set.on_close) in das Feld msec übertragen.

mouseover_stop

mouseover_stop ist ein Breaker-Objekt, das für 50 ms die Behandlung von "Mauseintritten" (mouseover) in Einträgen der Abschnitts-Liste oder Vorschaubildern verhindert. Die Funktionen followIndexEntry followSlide machen nichts, wenn mouseover_stop.value logisch wahr ist.

mouseover_stop.set wird aufgerufen, wenn eine Tastatureingabe das Bild oder den Abschnitt ändert.

the_store

Wenn window.localStorage existiert, ist the_store window.localStorage, sonst window.sessionStorage.

Die Funktion get_stored_settings liest bei der Initialisierung die gespeicherten Einstellungen der Eingabefelder im Fenster "Einstellungen" (popup_set).

Die Methode popup_set.on_close speichert die aktuellen Einstellungen nach jeder Änderung.

cur_sectid

Die Kennung des aktuellen Abschnitts in der Form "sNNN". "NNN" steht für die Nummer des Abschnitts. cur_sectid wird von der Funktion show_section verwaltet.

Die Funktion show_section_and_image vergleicht den Abschnitt des neu anzuzeigenden Bildes mit cur_sectid, und ruft show_section auf, wenn die Abschnitte nicht übereinstimmen.

Die Methode seq.on_start baut die Bilderliste neu auf, wenn sie nicht zum Abschnitt cur_sectid passt.

Beim Drücken der Tasten (onKeydown) Bild Auf und Bild Ab ergibt sich aus cur_sectid der neu anzuzeigende Abschnitt.

Die Taste M übernimmt cur_sectid in den Fragmentbezeichner des URI, wenn der Abschnittstext angezeigt wird.

Die Funktion tell_about baut cur_sectid in den zu versendenden URI, wenn der Text eines Abschnitts angezeigt wird (s. b_imgshown)

Die Variable cur_sectid ist redundant, denn der Wert kann immer aus cur_id ermittelt werden. Sie spart aber den Aufwand, cur_id zur Bestimmung des aktuellen Absichnitts zu zerlegen.

Zusammen mit cur_sectid werden auch die redundanten Variablen cur_li, cur_textdiv und cur_slidesdiv gesetzt.

cur_li

Der Eintrag in der Abschnitts-Liste zum aktuellen Abschnitt cur_sectid. Er hat die ID "li_CUR_SECTID". Die Variable wird zusammen mit cur_sectid in der Funktion show_section benutzt. Sie erspart Aufrufe der Funktion getElementById.

cur_textdiv

Der Text zum aktuellen Abschnitt cur_sectid. Er hat die ID "div_CUR_SECTID". Die Variable wird zusammen mit cur_sectid in der Funktion show_section benutzt. Sie erspart Aufrufe der Funktion getElementById.

cur_slidesdiv

Die Reihe der Vorschaubilder zum aktuellen Abschnitt cur_sectid. Sie hat die ID "slides_CUR_SECTID". Die Variable wird zusammen mit cur_sectid in der Funktion show_section benutzt. Sie erspart Aufrufe der Funktion getElementById.

Sie wird von der Funktion onKeydown bei der Behandlung der Taste benutzt.

b_imgshown

b_imgshown zeigt an, ob aktuell ein Bild (true) oder der Abschnitts-Text (false) angezeigt wird. Die Funktion show_text setzt b_imgshown auf true, do_show_image auf false.

Die Methode popup_set.on_close prüft b_imgshown: Wenn ein Bild angezeigt wird und die Einstellung zur Bildansicht, aber nicht die "Geometrie" geändert ist, ruft sie do_show_image auf.

Die Behandlung der Taste M und die Funktion tell_about lesen b_imgshown zur Bestimmung des URI zur aktuellen Ansicht.

Auch bei der Behandlung der Tasten (onKeydown) und wird b_imgshown geprüft: Wenn bereits der Text bzw. das Bild angezeigt wird, bleibt nichts zu tun.

Wenn die Fenstergröße geändert wird (onResize), hängt es von b_imgshown ab, ob do_show_image aufgerufen wird.

cur_ifid

Die Kennung (Dateiname ohne Dateinamens-Erweiterung) der aktuell oder zuletzt angezeigten Bilddatei. Die Funktion show_image verwaltet diese Variable. Sie kann anhand ihrer schnell entscheiden, ob ein anderes Bild anzuzeigen ist oder nicht, auch wenn zuletzt Textabschnitte angezeigt worden sind.

b_frame

Zeigt an, ob nur das Haupt-Inhaltsfeld (true) oder alle Felder (false) angezeigt werden sollen. Der Wert ist anfangs true. und wird beim Drücken der Taste B umgeschaltet. Er wird in der Funktion onResize gelesen.

cur_sldiv

Das hervorgehobene Vorschau-Bild (div-Element mit Hintergrundbild). Die Variable wird in der Funktion hilite_slide benutzt.

cur_sldivid

Die ID des aktuell hervorgehobenen Vorschaubildes (cur_sldiv): der Wert des Attributs id ohne das Präfix "div_". Die Form ist sSECT_IMGID_LNR.

Wenn ein anderer Abschnitt ausgewählt wird, dann bleibt das hervorgehobene Vorschaubild weiterhin hervorgehoben, solange kein anderes Vorschaubild gewählt wird. Wenn dann der Abschnitt des hervorgehobenen Vorschaubildes erneut ausgewählt wird, dann wird dieses wieder sichtbar, und cur_sldivid wird an cur_id zugewiesen.

cur_sldiv wird in der Funktion hilite_slide gesetzt und in der Funktion show_section gelesen.

cur_id

Zeichenkette, die ein Bild oder einen Abschnitt bezeichnet. Wenn sie ein Bild bezeichnet, entspricht sie dem Muster "sSECT_IMGID_LNR". SECT steht für die Nummer des Abschnitts, beginnend mit 1. IMGID steht für den Namen der Bilddatei ohne die Namensendung ".jpg". LNR steht für die laufende Nummer des Bilds innerhalb seines Abschnitts, beginnend mit 0. Zu einem Wert, der diesem Muster entspricht, gibt es das Vorschaubild (div-Element) mit der ID "div_" + cur_id und vielleicht einen Verweis im Text mit der ID "span_" + cur_id.

Wenn sie einen Textabschnitt bezeichnet, entspricht sie dem Muster "sSECT_". Der angehängte Unterstrich verhindert, daß ein Element mir der ID "div_" + cur_id gefunden wird.

Die folgenden Funktionen setzen cur_id: show_section, show_section_and_image und on_mouseover_imglink.

cur_id wird zur Behandlung der Tasten , und gelesen und dient zur Bestimmung des URI zur aktuellen Ansicht in der Funktion tell_about und bei der Behandlung der Taste M.

sz_main

sz_main ist die Größe des Haupt-Inhaltsbereichs (Bild-Rahmens) mit den Komponenten width und height. Die Werte werden in der Funktion onResize gesetzt und in der Funktion do_show_image gelesen.

sound_elt

Das XHTML-Element, das die Klangwiedergabe bestimmt: das audio-Element mit der ID audio. sound_elt wird von der Funktion initialize_sound gesetzt. Wenn das Element nicht die Javascript-Methoden play und pause anbietet, wird sound_elt auf null gesetzt. So zeigt sound_elt an, ob eine Klangwiedergabe möglich ist. Wenn sound_elt null ist, wird die Schaltfläche div_sound verborgen.

sound_playing

Diese logische Variable hat den Wert true, solange die Tonwiedergabe läuft. Sie wird in den Funktionen sound_on_ended und sound_play_pause gesetzt.

initialize_sound ()

Diese Funktion initialisiert die Variablen sound_elt und sound_playing. Wenn Klang wiedergegeben werden kann, ordnet sie einem Mausklick auf der Schaltfläche div_sound den Ereignisbehandler sound_play_pause und dem Erreichen des Endes der Klangdaten den Ereignisbehandler sound_on_ended zu.

sound_on_ended (event)

Wenn das Ende der Klangdaten erreicht ist, setzt dieser Ereignisbehandler sound_playing auf false und ersetzt das Wort playing im Attribut class des Schalters div_sound durch paused

sound_play_pause (event)

Startet die Tonwiedergabe und hält sie an. Diese Funktion behandelt den Mausklick auf der Schaltfläche div_sound und das Drücken der Taste p.

get_id_components (combi_id)

Der Parameter combi_id ist wie cur_id aufgebaut. Diese Funktion zerlegt den Parameter und liefert eine Struktur mit den Feldern sid (section id) und ifid (image file id).

Wenn combi_id nicht mit dem Buhstaben "s" beginnt, sind beide Felder undefiniert. Andernfalls besteht sid aus dem Anfangsbuchstaben s und allen unmittelbar folgenden Ziffern. Wenn nach der Ziffernfolge nach dem Anfangsbuchstaben eine Zeichenfolge folgt, die am Anfang und Ende durch einen Unterstrich begrenzt wird, enthält ifid die Zeichen zwischen den Unterstrichen. Andernfalls ist ifid undefiniert.

get_id_components wird von den Funktionen show_section_and_image und followImglink und zur Behandlung der Taste aufgerufen. aufgerufen.

hilite_elt_on (elt)

Diese Funktion fügt dem Attribut class des Elements elt das Wort hilite hinzu. Sie wird in hilite_slide aufgerufen, um ein Vorschaubild hervorzuheben, und in show_section, um einen Eintrag in der Abschnittsliste hervorzuheben.

hilite_elt_off (elt)

Diese Funktion entfernt das Wort hilite aus dem Attribut class des Elements elt. Sie wird in hilite_slide und in show_section aufgerufen.

hilite_slide (id)

Diese Funktion verwaltet das hervorgehobene Vorschaubild (cur_sldiv). Wenn ein Element mit der ID "div_ID existiert, wird dieses Element das neue hervorgehobene Vorschaubild. Wenn der Parameter id mit einem Unterstrich und einer Folge von Ziffern endet, dann stellt die Ziffernfolge die Anzahl der Vorschaubilder dar, die über dem neuen hervorzuhebenden Vorschaubild angezeigt werden. Diese Zahl bestimmt, wie weit die Leiste der Vorschaubilder zu verschieben ist, damit das neue hervorgehobene Vorschaubild sichtbar ist.

hilite_slide wird von show_section_and_image und on_mouseover_imglink aufgerufen.

show_text

Wenn ein Bild (div_mainimg) angezeigt wird (b_imgshown), dann hält diese Funktion den Bildlauf an (seq.stop) und wechselt zur Anzeige des Textes.

show_text behandelt einen Mausklick im Haupt-Bild und wird von den Funktionen onKeydown und followIndexEntry aufgerufen.

show_image (ifid)

Zeigt das Bild mit der Kennung (Dateiname ohne Erweiterung) ifid an. Die Funktion verwaltet die Variable cur_ifid. Wenn cur_ifid und ifid übereinstimmen, ruft sie do_show_image auf, um die Darstellung an neue Einstellungen oder die neue Fenstergröße anzupassen. Andernfalls ist ein neues Bild zu laden. Dazu setzt die Funktion das Attribut src des Hauptbildes (img_mainimg). Sobald das Bild geladen ist, passt do_show_image die Darstellung an.

show_image wird von den Funktionen show_section_and_image und followImglink aufgerufen.

do_show_image

Wenn der Textabschnitt angezeigt wird (s. b_imgshown), dann deaktiviert diese Funktion den Textabschnitt und aktiviert den Bild-Rahmen (div_mainimg). Dann setzt sie das Attribut class des Bildes (img_mainimg) entsprechend der aktuellen Einstellung auf einen der Werte normal, fullheight oder fullwidth und passt die CSS-Eigenschaft padding-top des Rahmens an.

Die Funktionen show_image, popup_set.on_close und onResize rufen do_show_image auf. do_show_image wird auch aufgerufen, wenn ein Bild geladen ist (Event load).

show_section (sectid)

sectid ist die Kennung eines Abschnitts in der Form "sNNN". "NNN" steht für die Nummer des Abschnitts. Wenn der aktuelle Abschnitt (cur_sectid) und sectid nicht übereinstimmen, dann passt diese Funktion cur_sectid und die damit zusammenhängenden Variablen cur_li, cur_textdiv und cur_slidesdiv an und aktualisiert die Darstellung der betroffenen Elemente.

Auch die Leiste der Vorschaubilder (mover_sl.update_content) wird aktualisiert. Wenn das aktuell hervorgehobene Vorschaubild (s. cur_sldivid) zum neuen Abschnitt gehört, wird dieses angezeigt und cur_sldivid der Variablen cur_id zugewiesen. Andernfalls wird der Anfang des Abschnitt der Vorschaubilder angezeigt und cur_id = sectid + "_" gesetzt. Der Wert von cur_id zeigt an, daß kein Bild ausgewählt ist. Es darf kein Element mit der ID div_CUR_ID existieren, damit der Durchlauf über die Bilder mit den Pfeiltasten funktioniert.

Die Funktionen show_section_and_image, initialize, onKeydown followIndexEntry und rufen show_section auf.

show_section_and_image (id)

Diese Funktion verwaltet zusammen mit der Funktion show_section die Variable cur_id: id ist der neue Wert und entspricht dem Muster "sSECT_IMGID_LNR". "SECT" steht für die Nummer eines Abschnitts, "IMGID" für die Kennung einer Bilddatei (Dateiname ohne Erweiterung). Diese Funktion zeigt den neuen Abschnitt und das neue Bild an und aktualisiert cur_id.

Die Funktionen initialize, seq.select, onKeydown, followSlide und followSectlink rufen show_section_and_image auf.

get_stored_settings ()

Diese Funktion liest aus dem Storage-Objekt the_store unter dem Schlüssel "set" eine Zeichenkette. Diese ist eine ":"-getrennte Liste von Schlüssel-/Wert-Paaren der Form "key=value". Jedem hier möglichen "key" ist ein Wert ID zugeordnet. Wenn ID die ID eines Eingabe-Elements ist, dann ist "value" der (neue) Wert (Attribut value).

Wenn aber ID mit "chk_" beginnt, dann ist das Element ein Markierungsfeld (Element input, Attribut type = checkbox). Der Wert (value) "1" steht für "markiert", jeder andere Wert für "nicht markiert".

initialize

Die Funktion initialize bestimmt die Werte der einmalig gesetzten Variablen und erzeugt die Objekte. Wenn die Bildergeschichte nicht eingebettet angezeigt wird, ruft sie initialize_sound auf.

Zur weiteren Initialisierung ruft sie die Methode popup_set.on_close auf.

Dann werden die Ereignisbehandler zugeordnet: Einem Mausklick auf dem Knopf "▶" (ID inp_start) wird die Funktion on_click_start zugeordnet. Das Hilfe-Fragezeichen (ID btn_help) öffnet und schließt das Fenster "Befehle". Ein Klick auf den Text eines Befehls wirkt wie die das Drücken einer Taste (onKeydown). Ein Klick in der Fußleiste öffnet und schließt das Info-Fenster (popup_about). Ein Klick auf den Menüpunkt "Weitersagen" (ID tellabout) ruft die Funktion tell_about auf. Eine Änderung der Größe des Browser-Fensters ruft die Funktion onResize auf, ein Mausklick im Haupbild (div_mainimg) die Funktion show_text, und Tastatureingaben (keydown) die Funktion onKeydown.

Zuletzt wird der Fragment-Bezeichner des URI ausgewertet. Wenn der Fragment-Bezeichner #rndimgshow ist, werden die Rahmenelemente verborgen (b_frame), die Darstellung an das Browser-Fenster angepasst (onResize) und der Bildlauf in zufälliger Reihenfolge über alle Bilder gestartet. Sonst werden der Abschnitt und das Bild angezeigt, das der Teil des Fragment-Bezeichners nach dem Zeichen # angibt, oder des erste Abschnitt, wenn der Fragment-Bezeichner fehlt oder nicht sinnvoll ist.

tell_about

Diese Funktion behandelt einen Klick auf den Menüeintrag "Weitersagen" und die Taste "w". Sie versucht, die URI zur aktuellen Ansicht per E-Mail zu versenden.

Sie startet, falls möglich, das E-Mail-Programm mit einem Fenster zur Erstellung einer neuen Nachricht. Als Betreff ist voreingestellt "Das gefällt mir", der voreingestellte Rumpf enthält den URI zur aktuellen Anzeige.

tell_about benutzt die Funktion encodeURIComponent, die in http://ecma-international.org/ecma-262/5.1/#sec-15.1.3.4 spezifiziert ist. Das mailto-URI-Schema ist definiert in RFC 6068 (http://tools.ietf.org/html/rfc6068). Ich vertraue darauf, dass der Brower mit dem mailto-Schema umgehen kann. Die Funktion isProtocolHandlerRegistered, die im aktuellen Entwurf für HTML 5 spezifiziert ist, kann das prüfen. Mein Test-Browser kennt sie nicht.

onResize

Die Funktion onResize behandelt die Änderung der Größe des Browserfensters und wird auch bei der Initialisierung (initialize) aufgerufen.

Bei der Initialisierung ist möglicherweise die Fenstergröße noch nicht festgelegt. Dann kehrt onResize sofort zurück. Wenn die Mindestbreite min_width noch nicht definiert ist, werden die konstanten Maße einmalig bestimmt.

onResize positioniert die anzuzeigenden Elemente und verbirgt andere Elemente. Dabei beachtet sie die Variable b_frame. Zunächst setzt sie die "logische" Größe der Anzeige (body-Element). Sie darf die Mindestbreite min_width und die Mindesthöhe min_height nicht unterschreiten.

Die Prozedur ermittelt die tatsächlichen Höhen der Titelleiste und der Kopfleiste: Abhängig davon, ob sie angezeigt wird oder nicht (popup_set.show_title), ist die Höhe der Titelleiste logo_height oder Null. Die Höhe der Kopfleiste ist die Höhe der Anzeige abzüglich der Höhe des Inhaltsbereichs (cont_height) und der Höhe der Titelleiste, höchstens aber die ursprüngliche Höhe header_height und nicht weniger als Null. Sie ist Null, wenn die Kopfleiste nicht angezeigt wird popup_set.header.

Wenn die ermittelte tatsächliche Höhe der Titelleiste positiv ist, werden das Logo, der Titel, das Menüfeld und die Ton-Schaltfläche (div_sound) einzeln positioniert. Das Logo wird über der Abschnittsliste und die Ton-Schaltfläche über den Vorschaubildern angezeigt, falls es möglich ist und die Bildergeschichte nicht eingebettet angezeigt wird. In diesem Fall bleiben das Logo und die Ton-Schaltfläche verborgen. Abhängig von popup_set.menu wird die Menü-Leiste über oder unter dem Titel oder gar nicht angezeigt.

Wenn die Titelleiste (div_title) angezeigt werden soll (popup_set.show_title), dann positioniert sie die Titelleiste am oberen Rand. Andernfalls wird die Titelleiste verborgen.

Danach wird die Kopfzeile angezeigt und positioniert oder verborgen.

Wenn die Fußleiste (div_footer) angezeigt werden soll (popup_set.show_footer) und die verbliebene freie Höhe größer ist als cont_height, wird die Fußleiste am unteren Rand des freien Bereichs positioniert.

Abhängig von popup_set.sections wird die Abschnittsliste (mover_ix) verborgen oder am linken oder rechten Rand des freien Bereichs positioniert.

Abhängig von popup_set.slides werden die Vorschaubilder (mover_sl) verborgen oder am linken oder rechten Rand des freien Bereichs positioniert.

Die Funktion speichert die neuen Maße (sz_main) des Haupt-Inhaltsbereichs und positioniert ihn (s. style_main).

Die geöffneten Aufklapp-Fenster ( Einstellung ..., Info-Fenster und Schnellhilfe) werden ebenfalls neu positioniert.

Wenn ein Bild angezeigt wird, dann passt do_show_image die Darstellung des Bildes an die neue Größe des Rahmens an.

onKeydown

Die Funktion onKeydown behandelt das Niederdrücken (keydown) von Tasten oder einen Klick (click) auf den Text eines Befehls im Fenster "Befehle". Bei einem Mausklick liest sie den "Tastenkode" aus dem Attribut data-code. Wenn eine Taste zusammen mit einer Zusatz-Taste (Control, Shift, Meta, Alt) gedrückt ist, kehrt die Funktion sofort zurück, ebenfalls, wenn eine Taste in einem Eingabefeld (Knotenname input oder select) gedrückt ist.

Die behandelten Tasten sind:

DOM_VK_B (B)

Schaltet den Wert der Variablen b_frame zwischen true und false um. Dadurch werden alle anderen Felder als das Haupt-Inhaltsfeld verborgen oder angezeigt.

DOM_VK_M (M)

Die Taste "M" fügt den Wert von cur_id als Fragmentbezeichner an den URI des Dokuments an.

DOM_VK_S (S)

Die Taste "S" schließt das Fenster "Einstellung ..." (popup_set.close), falls es geöffnet ist (popup_set.isopen), und startet den Bildlauf oder hält ihn an (seq.toggle).

DOM_VK_C (C)

Schließt alle geöffneten Aufklapp-Fenster ( Einstellung ..., Info-Fenster und Befehle)

DOM_VK_E (E)

Schließt das Fester "Befehle" und öffnet oder schließt das Fenster "Einstellung ..." (popup_set.toggle).

DOM_VK_N (N)

Setzt den aktiven Bildlauf mit dem nächsten Bild fort (seq.restart), wenn das Fenster "Einstellung ..." nicht geöffnet ist.

DOM_VK_Z (Z)

Wenn das Fenster "Einstellung ..." nicht geöffnet ist, setzt diese Taste den Bildlauf zum vorher angezeigten Bild zurück, falls möglich (seq.backstep).

DOM_VK_H (H)

Öffnet oder schließt das Fenster "Befehle" (popup_help.toggle).

DOM_VK_I (I)

Schließt das Fenster "Befehle" und öffnet oder schließt das Info-Fenster "Über ..." (popup_about.toggle).

DOM_VK_LEFT ()

Wechselt zum Textabschnitt (show_text), wenn ein Bild angezeigt wird (b_imgshown).

DOM_VK_RIGHT ()

Wechselt zur Bildansicht, wenn ein Textabschnitt angezeigt wird (b_imgshown). Wenn cur_id auf ein Bild verweist, dann wird dieses Bild angezeigt, sonst das erste Bild des Abschnitts.

DOM_VK_HOME (Pos 1)

Hält den Bildlauf an und zeigt den Text des ersten Abschnitts an (Anfang).

DOM_VK_END (Ende)

Hält den Bildlauf an und zeigt das letzte Bild des letzten Abschnitts an. Dabei wird die Variable last_id initialisiert, falls nötig.

DOM_VK_P (P)

Startet oder bendet die Klangwiedergabe (sound_play_pause).

DOM_VK_G (G)

Öffnet die "Galerieansicht".

DOM_VK_W (W)

Startet das E-Mail-Programm zur Weitergabe des URI zur aktuellen Anzeige (tell_about).

DOM_VK_UP ()

Mit dem Pfeil nach oben können alle Bilder und Textabschnitte, angefangen mit dem letzten Textabschnitt, in umgekehrter Reihenfolge durchlaufen werden. Wenn ein Textabschnitt angezeigt wird (cur_id bezeichnet kein Bild), dann wird nach dem Drücken der Taste das letzte Bild des Abschnitts angezeigt. Wenn cur_id ein Bild bezeichnet, dann wird nach dem Drücken der Taste das vorhergehende Bild des Abschnitts angezeigt, sofern das Bild nicht bereits das erste Bild des Abschnitts ist. Wenn das erste Bild eines Abschnitts angezeigt wird, dann führt die Taste zum Text des vorhergehenden Abschnitts. Wenn das erste Bild des Dokuments angezeigt ist, dann hat die Taste keine Wirkung.

DOM_VK_PAGE_UP (Bild auf)

Wenn nicht der erste Abschnitt des Dokuments aktuell ist, dann zeigt das Drücken der Taste den Text zum vorhergehenden Abschnitt an. Wenn der Text oder ein Bild des ersten Abschnitts angezeigt wird, bleibt die Taste wirkungslos.

DOM_VK_DOWN ()

Diese Taste führt, angefangen mit dem Text des ersten Abschnitts, durch alle Textabschnitte und Bilder des Dokuments: vom Textabschnitt zum ersten Bild des Abschnitts, von einem Bild, das nicht das letzte Bild des Abschnittes ist, zum nächsten Bild des Abschnitts, und vom letzten Bild eines Abschnitts zum Text des nächsten Abschnitts. Wenn des letzte Bild des letzten Abschnitts angezeigt wird, bleibt die Taste wirkungslos.

DOM_VK_PAGE_DOWN (Bild ab)

Diese Taste führt zum Text des nächsten Abschnitts. Wenn der Text oder ein Bild des letzten Abschnitts angezeigt wird, bleibt die Taste wirkungslos.

followIndexEntry (event)

Diese Funktion prüft zunächst, ob mouseover_stop gesetzt ist (mouseover_stop.value). Wenn das nicht der Fall ist, hält sie den Bildlauf an (seq.stop), wechselt zu dem Abschnitt, auf den der Eintrag verweist (show_section) und zeigt den Text zum Abschnitt (show_text)

updateIndexHandlers (evtname_old, evtname_new)

Diese Funktion definiert und ändert für alle Einträge in der Abschnittsliste das Ereignis, das mit der Funktion followIndexEntry verbunden ist. Sie wird von der Methode popup_set.on_close aufgerufen.

evtname_old ist der Name des Ereignisses, dem followIndexEntry bisher zugeordnet ist, evtname_new ist der Name des Ereignisses, dem followIndexEntry neu zugeordnet wird.

Beim ersten Aufruf, während initialize ausgeführt wird, ist evtname_old null. In diesem Fall gibt es keine Ereigniszuordnung aufzuheben. Bei allen folgenden Aufrufen können die Parameter evtname_old und evtname_new die Werte click, mouseover und dblclick annehmen. Diese Ereignisnamen sind in der Datei desktop.xslt (Text) aufgeführt.

followSlide (event)

Diese Funktion prüft zunächst, ob mouseover_stop gesetzt ist (mouseover_stop.value). Wenn das nicht der Fall ist, hält sie den Bildlauf an (seq.stop) und zeigt das Bild im Haupt-Inhaltsbereich an (show_section_and_image).

updateSlidesHandlers (evtname_old, evtname_new)

Diese Funktion definiert und ändert das Ereignis für ein Vorschaubild, das mit der Funktion followSlide verbunden ist, die das Bild anzeigt. Sie wird von der Methode popup_set.on_close aufgerufen.

evtname_old ist der Name des Ereignisses, dem followSlide bisher zugeordnet ist, evtname_new ist der Name des Ereignisses, dem followSlide neu zugeordnet wird.

Beim ersten Aufruf, während initialize ausgeführt wird, ist evtname_old null. In diesem Fall gibt es keine Ereigniszuordnung aufzuheben. Bei allen folgenden Aufrufen können die Parameter evtname_old und evtname_new die Werte click, mouseover und dblclick annehmen. Diese Ereignisnamen sind in der Datei desktop.xslt (Text) aufgeführt.

Wenn die Maus auf einen Bildverweis in einem Textabschnitt läuft, setzt diese Funktion die Variable cur_id und hebt das betroffene Vorschau-Bild hervor (hilite_slide).

Bei einem Mausklick auf einen Bildverweis in einem Textabschnitt zeigt (show_image) diese Funktion das aktuelle Bild (cur_id) an.

Bei einem Mausklick auf einen Abschnitts-Verweis im Text zeigt diese Funktion den neuen Abschnitt an (show_section_and_image).

updateLinkHandlers (evtname_old, evtname_new)

Diese Funktion definiert und ändert das Ereignis für einen Bildverweis, einen Abschnitts-Verweis oder ein Inline-Bild, das mit der Funktion followImglink oder followSectlink verbunden ist, die das Bild oder den Abschnitt anzeigt. Sie wird von der Methode popup_set.on_close aufgerufen.

evtname_old ist der Name des Ereignisses, dem followImglink bisher zugeordnet ist. Beim ersten Aufruf, während initialize ausgeführt wird, ist evtname_old null. In diesem Fall ordnet updateLinkHandlers dem Ereignis mouseover für Bildverweise und Inline-Bilder den Behandler on_mouseover_imglink zu.

Bei allen folgenden Aufrufen können die Parameter evtname_old und evtname_new die Werte click und dblclick annehmen. updateLinkHandlers hebt die Zuordnung von evtname_old zu followImglink auf und ordnet die Funktion followImglink dem Ereignis evtname_new zu.

on_click_start (event)

Diese Funktion behandelt einen Mausklick auf den Knopf "▶" (oder "■") im Fenster "Einstellungen" (popup_set). Sie schließt das Fenster und startet oder beendet den automatischen Bildlauf (seq.toggle).