Annotation of books/www/docbook/de/ch02.xml, revision 1.1

1.1     ! halter      1: <chapter label="2" id="mozilla-CHP-2">
        !             2: 
        !             3: <title>Erste Schritte</title>
        !             4: 
        !             5: <para>
        !             6: Um Ihnen einen m&ouml;glichst schnellen Einstieg in das Thema zu erm&ouml;glichen,
        !             7: pr&auml;sentiert dieses Kapitel zwei 'Hello World' Beispiele, die demonstrieren
        !             8: wie man die Entwicklung einer neue Applikation beginnt.
        !             9: </para>
        !            10: 
        !            11: <para>
        !            12: Das erste Beispiel ist eine einfache XUL Datei die im Browser Fenster geladen
        !            13: wird. Dieses Beispiel wird danach durch Stylesheets
        !            14: und JavaScript Funktionen erweitert. Das zweite Beispiel geht darauf
        !            15: ein, wie man die Applikations-Dateien in einem Paket zusammenfasst, das die modularen,
        !            16: geb&uuml;ndelten Sets der Dateien enth&auml;lt, die zusammen die Mozilla Applikation oder
        !            17: die neuen Module, f&uuml;r den Mozilla Browser ausmachen.
        !            18: </para>
        !            19: 
        !            20: <para>
        !            21: Diese Beispiele geben einen Kontext um die Applikationsentwicklung mit Mozilla
        !            22: zu diskutieren. Das erste Beispiel fokussiert vor allem auf das erstellen und
        !            23: editieren der Basisdateien, das zweite vor allem auf die Organisation und Verteilung
        !            24: der Applikation auf der Mozilla Platform.
        !            25: </para>
        !            26: 
        !            27: <sect1 role="" id="mozilla-CHP-2-SECT-1" label="2.1">
        !            28: <title>Ein einfaches Beispiel in XUL</title>
        !            29: 
        !            30: <para>
        !            31: Wie alle guten 'Hello World' Applikationen, zeigt das <link linkend="mozilla-CHP-2-EX-1">Beispiel 2-1</link>
        !            32: eine der einfachsten Anwendugen von XUL. Obwohl es sehr klein ist, demonstriert das Beispiel einige wichtige Aspekte
        !            33: der XUL Programmierung, inklusive der Verwendung von Event-Handlern um der Applikation Interaktionsm&ouml;glichkeiten
        !            34: hinzuzuf&uuml;gen und der Verwendung einer <literal>box</literal> um die Elemente korrekt im Fenster auszurichten.
        !            35: Dieses Beispiel dient auch dazu, einen Kontext f&uuml;r andere, generellere Features der Sprache, wie dem Dateiformat,
        !            36: die Namespace und ein paar Programmierregeln, zu schaffen.
        !            37: </para>
        !            38: 
        !            39: <example id="mozilla-CHP-2-EX-1" label="2-1">
        !            40: <title>Hallo xFly </title>
        !            41: <programlisting>&lt;?xml version="1.0"?&gt;
        !            42: &lt;!-- Beispiel XUL Datei --&gt;
        !            43: &lt;window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"&gt;
        !            44: &lt;box align="center"&gt;
        !            45:   &lt;button label="hello xFly" onclick="alert('Hello World');" /&gt;
        !            46: &lt;/box&gt;
        !            47: &lt;/window&gt;</programlisting>
        !            48: </example>
        !            49: 
        !            50: <para>
        !            51: Verwenden Sie einen Texteditor um den Code aus <link linkend="mozilla-CHP-2-EX-1">Beispiel 2-1</link>
        !            52: in einer Datei namens <filename>hello.xul</filename> abzuspeichern, und laden Sie es in Mozilla
        !            53: (via Datei &gt; Datei &ouml;ffnen, danach die Datei aus dem Dateisystem ausw&auml;hlen).
        !            54: Sie sollten danach in der oberen linken Ecke des Browser-Fensters einen Button sehen, der, bei Bet&auml;tigung
        !            55: ein kleines Warnfenster &ouml;ffnet. <link linkend="mozilla-CHP-2-FIG-1">Abbildung 2-1</link> zeigt ein
        !            56: Beispiel des Warnfensters das angezeigt werden sollte.
        !            57: </para>
        !            58: 
        !            59: <figure id="mozilla-CHP-2-FIG-1" label="2-1">
        !            60: <title>Das erste 'Hello World' Beispiel</title>
        !            61: <graphic fileref="figs/moz_0201.png"/></figure>
        !            62: 
        !            63: <para>
        !            64: Die n&auml;chsten Abschnitte beschreiben die Beispieldatei etwas genauer. Die
        !            65: Themen umfassen die Datei selbst, die Syntax der Markupsprache, XUL Namespaces
        !            66: und das Basislayout einer XUL Datei.
        !            67: </para>
        !            68: 
        !            69: <sidebar id="mozilla-CHP-2-SIDEBAR-1">
        !            70: <title>Die xFly Beispiele</title>
        !            71: 
        !            72: <para>
        !            73: Der beste Weg die m&ouml;glichen Anwendungsgebiete des Mozilla Frameworks zu verstehen,
        !            74: ist, einige existierende Applikationen etwas genauer zu betrachten. Dieses Buch
        !            75: zeigt einige Mozilla Projekte, wie ChatZilla und JSLib als Beispiele von Leuten
        !            76: die bereits begonnen haben Mozilla's XPFE Technologien zu nutzen.
        !            77: </para>
        !            78: 
        !            79: <para>
        !            80: Nebst diesen Applikationen werden Sie den Namen 'xFly' in vielen Beispielen
        !            81: in diesem Kapitel und durch das ganze Buch finden. Die xFly Beispiele werden von
        !            82: <link linkend="mozilla-CHP-2">Kapitel 2</link> bis <link linkend="mozilla-CHP-6">Kapitel 6</link>
        !            83: verwendet um Ihnen zu zeigen wie eine einfache Mozilla Applikation erstellt und verpackt wird.
        !            84: Eine installierbare Version der gesamten xFly Applikation kann unter <systemitem role="url">http://xfly.mozdev.org</systemitem>
        !            85: bezogen werden.
        !            86: </para>
        !            87: 
        !            88: <para>
        !            89: Diese einfache Applikation ist hilfreich, da sie Ihnen einen Platz bietet um die
        !            90: neuen Informationen die Sie in diesem Buch lernen zu erforschen. W&auml;hrend Sie
        !            91: mehr &uuml;ber XUL, CSS, JavaScript und die anderen Teile von Mozilla's Entwicklungsumgebung
        !            92: lernen, k&ouml;nnen Sie die xFly Dateien anpassen um zu sehen, wie sich die Technologie
        !            93: in der Praxis verh&auml;lt.
        !            94: </para>
        !            95: </sidebar>
        !            96: 
        !            97: </sect1>
        !            98: 
        !            99: <sect1 role="" id="mozilla-CHP-2-SECT-2" label="2.2">
        !           100: <title>XUL Basiskonzept</title>
        !           101: 
        !           102: <para>
        !           103: Sie haben bereits verschiedene XUL Features im Einsatz gesehen. Wenn Sie
        !           104: das Beispiel aus dem vorhergehenden Paragraph in Ihrem Browser &ouml;ffnen,
        !           105: identifiziert dieser die Datei als XUL, parsed die Daten, &ouml;ffnet ein neues
        !           106: Fenster und zeichnet das Button Widget darauf. Weiter f&uuml;hrt er die von Ihnen definierte
        !           107: Funktion aus, sobald der Button angeklickt wird.
        !           108: </para>
        !           109: 
        !           110: <para>
        !           111: Diese Aktivit&auml;ten sind Teil der Interaktionen zwischen Ihren Applikationsdateien
        !           112: und Mozilla. Dazu werden jedoch gewisse Grundvoraussetzungen wie das
        !           113: Format der XUL Dateien, deren Syntax oder Namespace, das XUL Layout und
        !           114: das Windowing-System ben&ouml;tigt.
        !           115: </para>
        !           116: 
        !           117: <sect2 role="" id="mozilla-CHP-2-SECT-2.1" label="2.2.1">
        !           118: <title>Das XUL Dateiformat</title>
        !           119: 
        !           120: <para>
        !           121: Eine XUL Datei ist eine normale Textdatei welche saubere XML Syntax und eine <filename>.xul</filename> Endung aufweist.
        !           122: Mozilla erwartet, dass Userinterface Widgets gezeichnet werden sollen wenn eine Datei mit der
        !           123: Endung <filename>.xul</filename> geladen wird oder wenn in einer Datei die XUL Namespace gefunden wird. Dies
        !           124: gilt ebenfalls f&uuml;r XML und HTML Dateien.
        !           125: </para>
        !           126: 
        !           127: <para>
        !           128: Der Mime Typ der f&uuml;r XUL Dateien verwendet wird, ist <filename>application/vnd.mozilla.xul+xml</filename>.
        !           129: Wenn Sie XUL Dateien lokal editieren, sollten Sie sich um diese Einstellungen keine Gedanken machen
        !           130: m&uuml;ssen. Wenn Sie XUL Dateien jedoch auf einem Webserver anbieten wollen, ben&ouml;tigen Sie diesen Mime Typ.
        !           131: Weitere Informationen wie Sie den korrekten Mime Type in Ihrem System konfigurieren k&ouml;nnen, finden Sie
        !           132: in <link linkend="mozilla-CHP-12">Kapitel 12</link>.
        !           133: </para>
        !           134: 
        !           135: </sect2>
        !           136: <sect2 role="" id="mozilla-CHP-2-SECT-2.2" label="2.2.2">
        !           137: <title>Richtlinien</title>
        !           138: 
        !           139: <para>
        !           140: XUL muss ein paar grunds&auml;tzliche Richtlinien einhalten (wie XHTML, oder jede andere XML
        !           141: basierte Datei) um g&uuml;ltig zu sein. Mozilla generiert eine Fehlermeldung wenn eine ung&uuml;ltige XUL Datei
        !           142: geladen werden soll.
        !           143: </para>
        !           144: 
        !           145: <para>Als erstes wird eine g&uuml;ltige XML Deklaration erwartet.</para>
        !           146: 
        !           147: <programlisting>&lt;?xml version="1.0"?&gt;</programlisting>
        !           148: 
        !           149: <para>
        !           150: Alle Kommentare die Sie verwenden um die XML Datei zu dokumentieren, k&ouml;nnen nach der Deklaration
        !           151: verwendet werden. Kommentare in XUL folgen dem gleichen Standard wie die von HTML und XML und werden von
        !           152: <literal>&lt;!--</literal> und <literal>--&gt;</literal> umschlossen.
        !           153: </para>
        !           154: 
        !           155: <para>
        !           156: Alle Tags m&uuml;ssen abgeschlossen werden. Leere Tags wie <literal>&lt;label&gt;</literal>
        !           157: m&uuml;ssen mit einem schliessenden Slash versehen werden.
        !           158: </para>
        !           159: 
        !           160: <programlisting>&lt;label value="Getting Started" /&gt;</programlisting>
        !           161: 
        !           162: <para>
        !           163: Ein weiterer, wichtiger Punkt an den Sie sich erinnern sollten ist die Gross-/Kleinschreibung. Wie bei allen
        !           164: XML basierten Sprachen ist ein <literal>&lt;window&gt;</literal> Tag nicht das gleiche wie <literal>&lt;Window&gt;</literal>.
        !           165: Sie k&ouml;nnen dahier ein <literal>&lt;window&gt;</literal> Tag nicht durch ein <literal>&lt;/Window&gt;</literal>
        !           166: Tag schliessen.
        !           167: </para>
        !           168: 
        !           169: <para>
        !           170: Diese Richtlinien gew&auml;hrleisten, dass die Render-Engine die XUL Datei erfolgreich verarbeiten kann
        !           171: und die definierten Elemente darstellt. Mozilla validiert keine XML (oder auch XUL) Dateien
        !           172: und verarbeitet auch keine extern deklarierten Entit&auml;ten, &uuml;berpr&uuml;ft jedoch die G&uuml;ltigkeit der XML Struktur.
        !           173: </para>
        !           174: 
        !           175: <para>
        !           176: Der XML Spezifikation folgend, werden Tags die nicht erkannt werden ignoriert.
        !           177: Dies kann Ihrer Applikation zu einer erh&ouml;hten Flexibilit&auml;t verhelfen, vor allem wenn Sie
        !           178: beginnen Technologien wie XBL einzusetzen. Nat&uuml;rlich kann dies auch den Debugging Prozess
        !           179: erschweren, zum Beispiel wenn Sie ein Element <literal>&lt;botton&gt;</literal> nennen
        !           180: und danach nicht erkennen, wieso der XUL button keine der typischen Eigenschaften eines Knopfes
        !           181: aufweist.
        !           182: </para>
        !           183: 
        !           184: <para>
        !           185: Es hat sich als hilfreich erwiesen innerhalb von XUL Dateien Kommentare, ausgiebig Leerzeichen
        !           186: und Einr&uuml;ckungen (nicht via Tabulator) und bekannte XUL Widgets zu verwenden.
        !           187: </para>
        !           188: 
        !           189: </sect2>
        !           190: <sect2 role="" id="mozilla-CHP-2-SECT-2.3" label="2.2.3">
        !           191: <title>Die XUL Namespace</title>
        !           192: 
        !           193: <para>
        !           194: Wie andere Markup Sprachen verwendet XUL eine Namespace Deklaration um auszuzeichnen welche Elemente
        !           195: in einem Dokument als g&uuml;ltig angesehen werden sollen. <link linkend="mozilla-CHP-2-EX-2">Beispiel 2-2</link> zeigt
        !           196: die verwendete Namespace Deklaration. Die Namespace ist ein Attribut des <literal>window</literal>
        !           197: Elements. Da kein Suffix angegeben wurde (bsp: <literal>xmlns:xul</literal>), wird XUL als Standard Namespace
        !           198: f&uuml;r das folgende Dokument verwendet.
        !           199: </para>
        !           200: 
        !           201: <example id="mozilla-CHP-2-EX-2" label="2-2">
        !           202: <title>Die XUL Namespace Deklaration</title>
        !           203: <programlisting>&lt;window
        !           204:   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"&gt;
        !           205:     &lt;description&gt;Illustrating the XUL namespace&lt;/description&gt;
        !           206:     &lt;/window&gt;</programlisting>
        !           207: </example>
        !           208: 
        !           209: <para>
        !           210: Wenn Sie XUL Inhalte in anderen Markup-Dokumenten verwenden wollen, m&uuml;ssen Sie mehr als
        !           211: eine Namespace deklarieren. &Uuml;blicherweise werden Namespaces wie HTML und RDF deklariert
        !           212: um weitere Elemente verwenden zu k&ouml;nnen, aber Sie k&ouml;nnen auch Ihre eigene erfinden. Wenn
        !           213: Sie den Button aus <link linkend="mozilla-CHP-2-EX-1">Beispiel 2-1</link> in einer normalen
        !           214: XML Datei haben m&ouml;chten, k&ouml;nnen Sie dies tun, indem Sie das <literal>xmlns:xul</literal> Attribut
        !           215: wie in <link linkend="mozilla-CHP-2-EX-3">Beispiel 2-3</link> verwenden.
        !           216: </para>
        !           217: 
        !           218: <example id="mozilla-CHP-2-EX-3" label="2-3">
        !           219: <title>Verschiedene Namespaces in einem XML Dokument</title>
        !           220: <programlisting>&lt;flies:flies 
        !           221:   xmlns:flies="http://www.flies.com/come.fly.with.me.xml#        !           222:   xmlns:html="http://www.w3.org/1999/xhtml"
        !           223:   xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"&gt;
        !           224:   &lt;flies:wings&gt;
        !           225:     &lt;xul:box align="center"&gt;
        !           226:       &lt;xul:button label="hello xFly" onclick="alert('hello.');" /&gt;
        !           227:     &lt;/xul:box&gt;
        !           228:     &lt;html:img src="wings.jpg" /&gt;
        !           229:   &lt;/flies:wings&gt;
        !           230: &lt;/flies:flies&gt;</programlisting>
        !           231: </example>
        !           232: 
        !           233: <para>
        !           234: Diese Datei hat drei verschiedene Arten von Inhalt: XUL, HTML und eine angepasste Markupsprache
        !           235: namens <literal>flies</literal>. Wenn Sie gemischte Namespaces verwenden, m&uuml;ssen Sie den XUL Elementen
        !           236: <literal>xul:</literal> voranstellen, um sie von anderen Markup Elementen zu unterscheiden. Ein Beispiel
        !           237: sehen Sie anhand von <literal>xul:box</literal> und <literal>xul:button</literal> im <link linkend="mozilla-CHP-2-EX-3">Beispiel 2-3</link>.
        !           238: </para>
        !           239: 
        !           240: </sect2>
        !           241: <sect2 role="" id="mozilla-CHP-2-SECT-2.4" label="2.2.4">
        !           242: <title>Basis XUL Layout</title>
        !           243: 
        !           244: <para>
        !           245: <link linkend="mozilla-CHP-2-EX-1">Beispiel 2-1</link> zeigt ein paar oft verwendete XUL Elemente.
        !           246: In diesem Abschnitt nehmen wir jedes Element auseinander, um zu sehen was es bewirkt und welche
        !           247: Interaktionen es mit anderen Elementen aufweist. Das <literal>&lt;window&gt;</literal> Element
        !           248: ist die Wurzel eigenst&auml;ndiger, prim&auml;rer XUL Dokumente (im Gegensatz zu Popups welche <literal>&lt;dialog&gt;</literal>
        !           249: und Subdokumenten welche <literal>&lt;page&gt;</literal> verwenden).
        !           250: </para>
        !           251: 
        !           252: <para>
        !           253: Wie in HTML definiert das Root-Element das Dokument, in das alle anderen
        !           254: Elemente gezeichnet werden sollen, wobei das Dokument bei XUL ein Teil einer Applikationsschnittstelle
        !           255: und nicht einer Webseite ist. Wir werden die weiteren Eigenschaften von 'window' sp&auml;ter noch genauer
        !           256: anschauen.
        !           257: </para>
        !           258: 
        !           259: <para>
        !           260: <link linkend="mozilla-CHP-2-EX-1">Beispiel 2-1</link> zeigt ein <literal>&lt;box&gt;</literal> Element,
        !           261: das ein <literal>&lt;button&gt;</literal> Element enth&auml;lt. Obwohl man Attribute des Window Elements
        !           262: verwenden kann um das Layout zu definieren, ist es eine gute idee <literal>&lt;box&gt;</literal> als Container
        !           263: zu verwenden. Dies ist vor allem sinnvoll wenn Sie neue Layout Elemente wie Button-Reihen, Grids, Tabs oder andere
        !           264: Elemente die genau angeordnet werden m&uuml;ssen verwenden. <literal>box</literal> ist das Basiselement um Layouts
        !           265: in XUL zu erstellen.
        !           266: </para>
        !           267: 
        !           268: <para>
        !           269: Das <literal>align</literal> Attribut des Box Elements definiert, dass Kind-Elemente nicht
        !           270: gestreckt oder zentriert werden sollen. Wenn die Box nicht verwendet wird und mehr als ein
        !           271: Kind-Element des Grundfensters existieren, w&uuml;rden sie normalerweise vertikal aliniert
        !           272: angezeigt. Diese Einstellung kann mit dem <literal>orient</literal> Attribut von <literal>&lt;window&gt;</literal>
        !           273: &uuml;berschrieben werden indem es als 'horizontal' definiert wird.
        !           274: </para>
        !           275: 
        !           276: </sect2>
        !           277: <sect2 role="" id="mozilla-CHP-2-SECT-2.5" label="2.2.5">
        !           278: <title>XUL Fenster verwenden</title>
        !           279: 
        !           280: <para>
        !           281: Die Basis jeder XPFE Applikation ist ein XUL Fenster. Jedes XUL Dokument muss mindestens ein (1)
        !           282: <literal>&lt;window&gt;</literal> Element enthalten, welches an der Wurzel des Dokuments sein muss
        !           283: und alle anderen XML Elemente umschliesst (nebst der XML Deklaration und den Verarbeitungspr&auml;ambeln).
        !           284: Ein einfaches Fenster ohne Inhalte sieht wie folgt aus:
        !           285: </para>
        !           286: 
        !           287: <programlisting>&lt;?xml version="1.0"?&gt;
        !           288: &lt;!DOCTYPE window&gt;
        !           289: &lt;window 
        !           290:     xmlns:html="http://www.w3.org/1999/xhtml"
        !           291:     xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"&gt;
        !           292: &lt;/window&gt;</programlisting>
        !           293: 
        !           294: <para>
        !           295: &Uuml;blicherweise hat eine Applikation mehrere Fenster, Dialoge und
        !           296: Sekund&auml;rfenster. Jedes Fenster ist ebenfalls durch ein <literal>&lt;window&gt;</literal>
        !           297: Element ausgezeichnet (obwohl seit kurzem auch die Elemente <literal>dialog</literal>
        !           298: und <literal>page</literal> als Root Elemente einer XUL Datei unterst&uuml;tzt werden.
        !           299: </para>
        !           300: 
        !           301: <para>
        !           302: Mit dem Wachstum Ihrer Applikation ben&ouml;tigen Sie Mittel, die Fenster zu verfolgen und ihre Kommunikation
        !           303: sicherzustellen. In Mozilla kann dies mit der <indexterm id="IXT-2-379"><primary>toOpenWindowByType( ) Funktion</primary></indexterm>
        !           304: erreicht werden indem Sie Fenster eines bestimmten Typs damit &ouml;ffnen.
        !           305: </para>
        !           306: 
        !           307: 
        !           308: <tip id="ch02-4-fm2xml" role="ora">
        !           309: <para>
        !           310: Wie alle anderen Funktionen die in diesem Buch erw&auml;hnt werden, k&ouml;nnen Sie
        !           311: <literal>toOpenWindowByType</literal> mit LXR nachschlagen.
        !           312: Der Web basierte Sourcecode Viewer wird in <link linkend="mozilla-APP-A">Anhang A</link>
        !           313: n&auml;her beschrieben und ist unter <systemitem role="url">http://lxr.mozilla.org/</systemitem>
        !           314: verf&uuml;gbar.
        !           315: </para>
        !           316: </tip>
        !           317: 
        !           318: <sect3 role="" id="mozilla-CHP-2-SECT-2.5.1" label="2.2.5.1">
        !           319: <title>window Features</title>
        !           320: 
        !           321: <para>
        !           322: Jedes <literal>&lt;window&gt;</literal> Element verf&uuml;gt &uuml;ber ein <literal>id</literal>
        !           323: Attribut. Dieses Attribut muss nicht angegeben werden, erleichtert jedoch das
        !           324: auffinden einzelner Fenster/Nodes aus dem Skript (siehe die DOM Methoden
        !           325: <literal>getElementByID</literal> in <link linkend="mozilla-CHP-5">Kapitel 5</link>
        !           326: um mehr dar&uuml;ber zu erfahren wie Elemente anhand ihres Identifiers ausgew&auml;hlt
        !           327: werden k&ouml;nnen.) Das ID Attribut wird wie folgt verwendet:
        !           328: </para>
        !           329: 
        !           330: <programlisting>&lt;window 
        !           331:     xmlns:html="http://www.w3.org/1999/xhtml"
        !           332:     xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
        !           333:     id="xflyMain"&gt;</programlisting>
        !           334: 
        !           335: <para>
        !           336: Eventhandler wie <literal>onload</literal> und <literal>onunload</literal> sind
        !           337: n&uuml;tzlich wenn Sie die Inhalte eines Fensters &auml;ndern wollen, oder die Eingabe auf
        !           338: ein bestimmtes Fenster umleiten m&ouml;chten:
        !           339: </para>
        !           340: 
        !           341: <programlisting>&lt;window 
        !           342:     xmlns:html="http://www.w3.org/1999/xhtml"
        !           343:     xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
        !           344:     id="xfly-main"
        !           345:     onload="startUp( )"
        !           346:     onunload="shutdown( )"
        !           347:     onclose="onClose( )"&gt;</programlisting>
        !           348: 
        !           349: <para>
        !           350: Wenn Sie eine XUL Datei laden, die wie das obige Beispiel beginnt, f&uuml;hren
        !           351: die Eventhandler Attribute <literal>onload</literal> und <literal>onunload</literal>
        !           352: deren Werte (<literal>startUp( )</literal> und <literal>shutdown( )</literal>) aus.
        !           353: Zus&auml;tzlich bietet Mozilla einen <literal>onclose</literal> Eventhandler
        !           354: welcher vor dem schliessen des Fensters aufgrufen wird, damit letzte Verarbeitungsschritte
        !           355: ausgef&uuml;hrt werden k&ouml;nnen. Das 'close' Event wird vor dem <literal>unload</literal>
        !           356: Event ausgef&uuml;hrt, womit Sie das Fenster &uuml;ber <literal>onclose</literal> am schliessen hindern k&ouml;nnten.
        !           357: Um das Schliessen des Fensters zu verhindern muss das 'close' Event als R&uuml;ckgabewert <filename>false</filename>
        !           358: liefern.
        !           359: </para>
        !           360: 
        !           361: <para>
        !           362: Dialogfenster enthalten weitere Eventhandlers die unter <link linkend="mozilla-CHP-3-SECT-2">Abschnitt 3.2</link> in
        !           363: <link linkend="mozilla-CHP-3">Kapitel 3</link> erkl&auml;rt werden.
        !           364: </para>
        !           365: 
        !           366: </sect3>
        !           367: 
        !           368: <sect3 role="" id="mozilla-CHP-2-SECT-2.5.2" label="2.2.5.2">
        !           369: <title>window Eigenschaften</title>
        !           370: 
        !           371: <para>
        !           372: Die window Implementierung wird st&auml;ndig erweitert und l&auml;sst Raum f&uuml;r unz&auml;hlige neue Features.
        !           373: Nebst den <emphasis>Attributen</emphasis> -- den Eventhandlern, der ID und der Namespace
        !           374: die innerhalb eines <literal>&lt;window&gt;</literal> Tags vorkommen -- hat ein XUL Window
        !           375: die gleichen DOM Eigenschaften wie ein HTML <literal>window</literal> Objekt. Diese Eigenschaften
        !           376: werden unten aufgelistet, zusammen mit zus&auml;tzlichen Eigeschaften f&uuml;r applikationsspezifische Arbeiten.
        !           377: </para>
        !           378: 
        !           379: <informaltable id="ch02-5-fm2xml">
        !           380: <tgroup cols="4">
        !           381: <colspec colnum="1" colname="col1"/>
        !           382: <colspec colnum="2" colname="col2"/>
        !           383: <colspec colnum="3" colname="col3"/>
        !           384: <colspec colnum="4" colname="col4"/>
        !           385: <thead>
        !           386: <row>
        !           387: <entry>
        !           388: <programlisting>Navigator</programlisting>
        !           389: </entry>
        !           390: <entry>
        !           391: <programlisting>Document</programlisting>
        !           392: </entry>
        !           393: <entry>
        !           394: <programlisting>window</programlisting>
        !           395: </entry>
        !           396: <entry>
        !           397: <programlisting>Parent</programlisting>
        !           398: </entry>
        !           399: </row>
        !           400: </thead>
        !           401: <tbody>
        !           402: <row>
        !           403: <entry>
        !           404: <programlisting>Top</programlisting>
        !           405: </entry>
        !           406: <entry>
        !           407: <programlisting>Scrollbars</programlisting>
        !           408: </entry>
        !           409: <entry>
        !           410: <programlisting>name</programlisting>
        !           411: </entry>
        !           412: <entry>
        !           413: <programlisting>ScrollX</programlisting>
        !           414: </entry>
        !           415: </row>
        !           416: <row>
        !           417: <entry>
        !           418: <programlisting>ScrollY</programlisting>
        !           419: </entry>
        !           420: <entry>
        !           421: <programlisting>ScrollTo</programlisting>
        !           422: </entry>
        !           423: <entry>
        !           424: <programlisting>scrollBy</programlisting>
        !           425: </entry>
        !           426: <entry>
        !           427: <programlisting>GetSelection</programlisting>
        !           428: </entry>
        !           429: </row>
        !           430: <row>
        !           431: <entry>
        !           432: <programlisting>ScrollByLines</programlisting>
        !           433: </entry>
        !           434: <entry>
        !           435: <programlisting>ScrollByPages</programlisting>
        !           436: </entry>
        !           437: <entry>
        !           438: <programlisting>Size
        !           439: ToContent</programlisting>
        !           440: </entry>
        !           441: <entry>
        !           442: <programlisting>Dump</programlisting>
        !           443: </entry>
        !           444: </row>
        !           445: <row>
        !           446: <entry>
        !           447: <programlisting>SetTimeout</programlisting>
        !           448: </entry>
        !           449: <entry>
        !           450: <programlisting>SetInterval</programlisting>
        !           451: </entry>
        !           452: <entry>
        !           453: <programlisting>Clear
        !           454: Timeout</programlisting>
        !           455: </entry>
        !           456: <entry>
        !           457: <programlisting>ClearInterval</programlisting>
        !           458: </entry>
        !           459: </row>
        !           460: <row>
        !           461: <entry>
        !           462: <programlisting>SetResizable</programlisting>
        !           463: </entry>
        !           464: <entry>
        !           465: <programlisting>CaptureEvents</programlisting>
        !           466: </entry>
        !           467: <entry>
        !           468: <programlisting>Release
        !           469: Events</programlisting>
        !           470: </entry>
        !           471: <entry>
        !           472: <programlisting>RouteEvent</programlisting>
        !           473: </entry>
        !           474: </row>
        !           475: <row>
        !           476: <entry>
        !           477: <programlisting>Enable
        !           478: External
        !           479: Capture</programlisting>
        !           480: </entry>
        !           481: <entry>
        !           482: <programlisting>DisableExternal
        !           483: Capture</programlisting>
        !           484: </entry>
        !           485: <entry>
        !           486: <programlisting>prompt</programlisting>
        !           487: </entry>
        !           488: <entry>
        !           489: <programlisting>Open</programlisting>
        !           490: </entry>
        !           491: </row>
        !           492: <row>
        !           493: <entry>
        !           494: <programlisting>OpenDialog</programlisting>
        !           495: </entry>
        !           496: <entry>
        !           497: <programlisting>Frames</programlisting>
        !           498: </entry>
        !           499: <entry>
        !           500: <programlisting>find</programlisting>
        !           501: </entry>
        !           502: <entry>
        !           503: <programlisting>self</programlisting>
        !           504: </entry>
        !           505: </row>
        !           506: <row>
        !           507: <entry>
        !           508: <programlisting>Screen</programlisting>
        !           509: </entry>
        !           510: <entry>
        !           511: <programlisting>History</programlisting>
        !           512: </entry>
        !           513: <entry>
        !           514: <programlisting>content</programlisting>
        !           515: </entry>
        !           516: <entry>
        !           517: <programlisting>Sidebar</programlisting>
        !           518: </entry>
        !           519: </row>
        !           520: <row>
        !           521: <entry>
        !           522: <programlisting>Menubar</programlisting>
        !           523: </entry>
        !           524: <entry>
        !           525: <programlisting>Toolbar</programlisting>
        !           526: </entry>
        !           527: <entry>
        !           528: <programlisting>Locationbar</programlisting>
        !           529: </entry>
        !           530: <entry>
        !           531: <programlisting>Personalbar</programlisting>
        !           532: </entry>
        !           533: </row>
        !           534: <row>
        !           535: <entry>
        !           536: <programlisting>Statusbar</programlisting>
        !           537: </entry>
        !           538: <entry>
        !           539: <programlisting>Directories</programlisting>
        !           540: </entry>
        !           541: <entry>
        !           542: <programlisting>closed</programlisting>
        !           543: </entry>
        !           544: <entry>
        !           545: <programlisting>Crypto</programlisting>
        !           546: </entry>
        !           547: </row>
        !           548: <row>
        !           549: <entry>
        !           550: <programlisting>pkcs11</programlisting>
        !           551: </entry>
        !           552: <entry>
        !           553: <programlisting>Controllers</programlisting>
        !           554: </entry>
        !           555: <entry>
        !           556: <programlisting>opener</programlisting>
        !           557: </entry>
        !           558: <entry>
        !           559: <programlisting>Status</programlisting>
        !           560: </entry>
        !           561: </row>
        !           562: <row>
        !           563: <entry>
        !           564: <programlisting>defaultStatus</programlisting>
        !           565: </entry>
        !           566: <entry>
        !           567: <programlisting>Location</programlisting>
        !           568: </entry>
        !           569: <entry>
        !           570: <programlisting>innerWidth</programlisting>
        !           571: </entry>
        !           572: <entry>
        !           573: <programlisting>InnerHeight</programlisting>
        !           574: </entry>
        !           575: </row>
        !           576: <row>
        !           577: <entry>
        !           578: <programlisting>outerWidth</programlisting>
        !           579: </entry>
        !           580: <entry>
        !           581: <programlisting>OuterHeight</programlisting>
        !           582: </entry>
        !           583: <entry>
        !           584: <programlisting>screenX</programlisting>
        !           585: </entry>
        !           586: <entry>
        !           587: <programlisting>ScreenY</programlisting>
        !           588: </entry>
        !           589: </row>
        !           590: <row>
        !           591: <entry>
        !           592: <programlisting>pageXOffset</programlisting>
        !           593: </entry>
        !           594: <entry>
        !           595: <programlisting>PageYOffset</programlisting>
        !           596: </entry>
        !           597: <entry>
        !           598: <programlisting>length</programlisting>
        !           599: </entry>
        !           600: <entry>
        !           601: <programlisting>FullScreen</programlisting>
        !           602: </entry>
        !           603: </row>
        !           604: <row>
        !           605: <entry>
        !           606: <programlisting>alert</programlisting>
        !           607: </entry>
        !           608: <entry>
        !           609: <programlisting>Confirm</programlisting>
        !           610: </entry>
        !           611: <entry>
        !           612: <programlisting>focus</programlisting>
        !           613: </entry>
        !           614: <entry>
        !           615: <programlisting>Blur</programlisting>
        !           616: </entry>
        !           617: </row>
        !           618: <row>
        !           619: <entry>
        !           620: <programlisting>back</programlisting>
        !           621: </entry>
        !           622: <entry>
        !           623: <programlisting>Forward</programlisting>
        !           624: </entry>
        !           625: <entry>
        !           626: <programlisting>home</programlisting>
        !           627: </entry>
        !           628: <entry>
        !           629: <programlisting>Stop</programlisting>
        !           630: </entry>
        !           631: </row>
        !           632: <row>
        !           633: <entry>
        !           634: <programlisting>print</programlisting>
        !           635: </entry>
        !           636: <entry>
        !           637: <programlisting>MoveTo</programlisting>
        !           638: </entry>
        !           639: <entry>
        !           640: <programlisting>moveBy</programlisting>
        !           641: </entry>
        !           642: <entry>
        !           643: <programlisting>ResizeTo</programlisting>
        !           644: </entry>
        !           645: </row>
        !           646: <row>
        !           647: <entry>
        !           648: <programlisting>resizeBy</programlisting>
        !           649: </entry>
        !           650: <entry>
        !           651: <programlisting>Scroll</programlisting>
        !           652: </entry>
        !           653: <entry>
        !           654: <programlisting>close</programlisting>
        !           655: </entry>
        !           656: <entry>
        !           657: <programlisting>UpdateCommands</programlisting>
        !           658: </entry>
        !           659: </row>
        !           660: <row>
        !           661: <entry>
        !           662: <programlisting>escape</programlisting>
        !           663: </entry>
        !           664: <entry>
        !           665: <programlisting>Unescape</programlisting>
        !           666: </entry>
        !           667: <entry>
        !           668: <programlisting>atob</programlisting>
        !           669: </entry>
        !           670: <entry>
        !           671: <programlisting>Btoa</programlisting>
        !           672: </entry>
        !           673: </row>
        !           674: <row>
        !           675: <entry>
        !           676: <programlisting>AddEvent Listener</programlisting>
        !           677: </entry>
        !           678: <entry>
        !           679: <programlisting>RemoveEvent Listener</programlisting>
        !           680: </entry>
        !           681: <entry>
        !           682: <programlisting>Dispatch Event</programlisting>
        !           683: </entry>
        !           684: <entry>
        !           685: <programlisting>GetComputed Style</programlisting>
        !           686: </entry>
        !           687: </row>
        !           688: </tbody>
        !           689: </tgroup>
        !           690: </informaltable>
        !           691: 
        !           692: <para>Spezielle XUL-Fenster Eigenschaften:</para>
        !           693: 
        !           694: <variablelist>
        !           695: <varlistentry><term>window.content</term>
        !           696: <listitem>
        !           697: <para>
        !           698: Dieses Property kann verwendet werden um einfach auf den Inhalt des Fensters zuzugreifen, falls einer 
        !           699: existiert. Dies ist nur sinnvoll wenn eines der Content-Elemente verwendet wurde, namentlich:
        !           700: <literal>&lt;iframe&gt;</literal>,
        !           701: <literal>&lt;browser&gt;</literal> und
        !           702: <literal>&lt;editor&gt;</literal>.
        !           703: <link linkend="mozilla-CHP-3-SECT-8">Abschnitt 3.8</link> in <link linkend="mozilla-CHP-3">Kapitel 3</link>
        !           704: bietet zus&auml;tzliche Informationen zum Thema. Das <literal>content</literal>-Property bezieht sich nur auf ein
        !           705: explizit als 'primary area' deklariertes Frame
        !           706: </para>
        !           707: </listitem>
        !           708: </varlistentry>
        !           709: </variablelist>
        !           710: 
        !           711: <programlisting>&lt;browser type="content-primary" ...&gt;</programlisting>
        !           712: 
        !           713: <para>So k&ouml;nnen Sie den Inhalt manipulieren.</para>
        !           714: 
        !           715: <programlisting>window.content.focus( );</programlisting>
        !           716: 
        !           717: <variablelist>
        !           718: <varlistentry><term>window.sizeToContent( )</term>
        !           719: <listitem>
        !           720: <para>
        !           721: Diese Methode wird verwendet um die Fenstergr&ouml;sse an die tats&auml;chliche Gr&ouml;sse der Inhalte
        !           722: anzupassen. Dies wird bei der Entwicklung mit XUL vor allem f&uuml;r Dialoge verwendet. Sie
        !           723: sollten vorzugsweise diesen Ansatz verwenden, anstatt den Fenstern eine fixe Breite und H&ouml;he
        !           724: zu geben wenn die Inhalte Ihres Fensters &auml;ndern k&ouml;nnten (<literal>onload</literal> &Auml;nderungen,
        !           725: input eines anderen Fensters, ..). Der Colorpicker im Mozilla Editor verwendet diese Eigenschaft
        !           726: um sein Fenster an die angezeigte Farbpalette anzupassen:
        !           727: </para>
        !           728: </listitem>
        !           729: </varlistentry>
        !           730: </variablelist>
        !           731: 
        !           732: <programlisting>function ChangePalette(palette)
        !           733: {
        !           734:   gDialog.ColorPicker.setAttribute("palettename", palette);
        !           735:   window.sizeToContent( );
        !           736: }</programlisting>
        !           737: 
        !           738: </sect3>
        !           739: 
        !           740: <sect3 role="" id="mozilla-CHP-2-SECT-2.5.3" label="2.2.5.3">
        !           741: <title>Interaktion zwischen Fenstern</title>
        !           742: 
        !           743: <para>
        !           744: Die <literal>nsIWindowMediator</literal> XPCOM Komponente bietet einige M&ouml;glichkeiten um
        !           745: verschiedene Fenster interagieren zu lassen. Obwohl es ein bisschen zu fr&uuml;h ist, in diesem
        !           746: Hello World Beispiel auf Komponenten einzugehen, umfasst sie folgende Routinen:
        !           747: </para>
        !           748: 
        !           749: <itemizedlist><listitem>
        !           750: <para>R&uuml;ckgabe des zuletzt ge&ouml;ffneten Fensters eines bestimmten Typs</para>
        !           751: </listitem><listitem>
        !           752: <para>R&uuml;ckgabe der Anzahl Fenster</para>
        !           753: </listitem><listitem>
        !           754: <para>Un-/registrierung von Fenstern</para>
        !           755: </listitem><listitem>
        !           756: <para>Aktualisieren der Fenster-Timestamp</para>
        !           757: </listitem><listitem>
        !           758: <para>Aktualisieren des Fenster-Titels</para>
        !           759: </listitem><listitem>
        !           760: <para>Anpassen der Z-Order Position</para>
        !           761: </listitem></itemizedlist>
        !           762: <para>
        !           763: <link linkend="mozilla-CHP-8">Kapitel 8</link> bietet viele Details um XPCOM besser zu verstehen.
        !           764: </para>
        !           765: 
        !           766: </sect3>
        !           767: 
        !           768: <sect3 role="" id="mozilla-CHP-2-SECT-2.5.4" label="2.2.5.4">
        !           769: <title>Fenster Verhalten</title>
        !           770: 
        !           771: <para>
        !           772: Mozilla unterst&uuml;tzt die Javascript Standardfunktion <literal>window.open</literal>, die ihren
        !           773: Ursprung im Browser-Scripting hat und verwendet wird um Fenster zu &ouml;ffnen. Mozilla erweitert diese
        !           774: Funktion um ein Paar Features f&uuml;r die Applikationsentwicklung. Weiter wird <literal>window.openDialog</literal>
        !           775: zur Verf&uuml;gung gestellt, um Fenster in der XPFE Scripting Umgebung zu &ouml;ffnen. Heutzutags wird vor allem die zweite Funktion
        !           776: eingesetzt um XUL Fenster zu &ouml;ffnen, obwohl beide Funktionen austauschbar sind.
        !           777: </para>
        !           778: 
        !           779: <para>Die Verwendung von <literal>window.open</literal>:</para>
        !           780: 
        !           781: <programlisting>window.open (url, name, features);</programlisting>
        !           782: 
        !           783: <para><literal>window.openDialog</literal> erweitert diese Funktionalit&auml;t mit einer
        !           784: erweiterten Argumentliste, welche optional ist und eine unbegrenzte Anzahl von Argumenten
        !           785: enthalten kann:
        !           786: </para>
        !           787: 
        !           788: <programlisting>window.openDialog (url, type, features, argument1, argument2);</programlisting>
        !           789: 
        !           790: <para>Folgend eine Liste einiger Features eines XUL Windows welche mit <literal>window.openDialog</literal> ge&ouml;ffnet wurde:
        !           791: </para>
        !           792: 
        !           793: <variablelist>
        !           794: <varlistentry><term>close</term>
        !           795: <listitem>
        !           796: <para>Dieses Widget kann mit oder ohne Close-Widget erstellt werden.</para>
        !           797: </listitem>
        !           798: </varlistentry>
        !           799: 
        !           800: <varlistentry><term>chrome</term>
        !           801: <listitem>
        !           802: <para>
        !           803: Das neue Fenster muss im chrome-Kontext und nicht im Browser-Kontext verwendet werden. Es hat ein
        !           804: eigenes top-level Fenster. Das Fenster selbst wird mit der chrome-URL &uuml;bergeben und wird nicht
        !           805: im Browser-Fenster geladen.
        !           806: </para>
        !           807: </listitem>
        !           808: </varlistentry>
        !           809: 
        !           810: <varlistentry><term>dependent</term>
        !           811: <listitem>
        !           812: <para>
        !           813: Das neue Fenster geh&ouml;rt zum aufrufenden Fenster wenn das Betriebssystem dies unterst&uuml;tzt. Es befindet sich
        !           814: &uuml;ber dem parent-Fenster welches immernoch zug&auml;nglich ist. Beide Fenster werden zusammen minimiert.
        !           815: </para>
        !           816: </listitem>
        !           817: </varlistentry>
        !           818: 
        !           819: <varlistentry><term>modal</term>
        !           820: <listitem>
        !           821: <para>
        !           822: Das Fenster wird modal angezeigt. Die Kontrolle wird erst an das Parent-Fenster zur&uuml;ckgegeben
        !           823: wenn das Fenster geschlossen wurde.
        !           824: </para>
        !           825: </listitem>
        !           826: </varlistentry>
        !           827: 
        !           828: <varlistentry><term>titlebar</term>
        !           829: <listitem>
        !           830: <para>
        !           831: Das Fenster wird mit oder ohne Titelleiste erzeugt.
        !           832: </para>
        !           833: </listitem>
        !           834: </varlistentry>
        !           835: 
        !           836: <varlistentry><term>centerscreen</term>
        !           837: <listitem>
        !           838: <para>
        !           839: &Ouml;ffnet das Fenster zentriert auf dem Bildschirm.
        !           840: </para>
        !           841: </listitem>
        !           842: </varlistentry>
        !           843: </variablelist>
        !           844: 
        !           845: <para>
        !           846: Kommata umschliessen die Features in der Liste, und die gesamte Liste muss
        !           847: von Anf&uuml;hrungszeichen umschlossen sein. Das Skript welches das neue
        !           848: Fenster verwaltet, kann auf die Argumentliste zugreifen:
        !           849: </para>
        !           850: 
        !           851: <programlisting>window.openDialog("chrome://xfly/content/utils/prompt.xul",
        !           852:                   "xFly_prompt",
        !           853:                   "chrome,dialog,modal",
        !           854:                   message);</programlisting>
        !           855: 
        !           856: <para>
        !           857: Das Fenster, das in diesem Beispiel erstellt wurde, ist modal und verwendet
        !           858: eine Nachricht aus der Vairable <emphasis>message</emphasis>, die ihm &uuml;bergeben wurde.
        !           859: Normalerweise geht Mozilla davon aus, dass <literal>chrome</literal> verwendet
        !           860: werden soll, wenn Sie <literal>window.open</literal> oder <literal>window.openDialog</literal>
        !           861: in einer chrome-Umgebung verwenden.
        !           862: </para>
        !           863: 
        !           864: </sect3>
        !           865: </sect2>
        !           866: </sect1>
        !           867: 
        !           868: <sect1 role="" id="mozilla-CHP-2-SECT-3" label="2.3">
        !           869: <title>Mozilla arbeitet f&uuml;r uns</title>
        !           870: 
        !           871: <para>
        !           872: Das zweite "Hello World" Beispiel in <link linkend="mozilla-CHP-2-EX-4">Beispiel 2-4</link>,
        !           873: f&uuml;gt ein paar wichtige Applikationseigenschaften hinzu und beginnt Mozillas Ressourcen
        !           874: aktiv zu nutzen. Dieser Abschnitt handelt davon, wie Sie Stylesheets und Skripts in Ihre Applikation
        !           875: importieren k&ouml;nnen um diese modularer und ausgereifter zu machen. Weiter bereitet es Sie darauf
        !           876: vor, eine vollst&auml;ndige Applikation zu entwickeln.
        !           877: </para>
        !           878: 
        !           879: <para>
        !           880: Sie k&ouml;nnen dieses Beispiel anschauen, wenn Sie den code aus <link linkend="mozilla-CHP-2-EX-4">Beispiel 2-4</link>
        !           881: in einer Datei namens <filename>hello2.xul</filename> speichern, Mozilla starten und 'File'-&gt;'Open File' im Browsermenu
        !           882: ausw&auml;hlen. Dies zeigt das Beispiel als Inhalt im Mozilla Browser an, wie in <link linkend="mozilla-CHP-2-FIG-2">Abbildung 2-2</link>.
        !           883: </para>
        !           884: 
        !           885: <example id="mozilla-CHP-2-EX-4" label="2-4">
        !           886: <title>XUL Beispielfenster </title>
        !           887: <programlisting>&lt;?xml version="1.0"?&gt;
        !           888: &lt;?xml-stylesheet href="chrome://global/skin" type="text/css"?&gt;
        !           889: &lt;!DOCTYPE window&gt;
        !           890: &lt;window title="Hello xFly"
        !           891:   xmlns:html="http://www.w3.org/1999/xhtml"
        !           892:   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
        !           893:   style="background-color: white;"
        !           894:   width="300"
        !           895:   height="215"
        !           896:   onload="centerWindowOnScreen( )"&gt;
        !           897: &lt;script type="application/x-javascript"   
        !           898:   src="chrome://global/content/dialogOverlay.js" /&gt;
        !           899: &lt;vbox align="left"&gt;
        !           900:   &lt;label style="font-weight: bold;"
        !           901:       value="Hello, Welcome to the xFly" /&gt;
        !           902:   &lt;image src="http://books.mozdev.org/xfly.gif" /&gt;
        !           903:   &lt;button label="hello xFly" oncommand="alert('Hello World');" /&gt;
        !           904: &lt;/vbox&gt;
        !           905: &lt;/window&gt;</programlisting>
        !           906: </example>
        !           907: 
        !           908: <para>
        !           909: Der Unterschied zwischen <link linkend="mozilla-CHP-2-EX-4">Beispiel 2-4</link> und dem ersten
        !           910: Beispiel sind die neuen Elemente. Das <literal>script</literal> Element,
        !           911: das in Mozilla JavaScript verf&uuml;gbar macht, weitere Box-Layout Eigenschaften, inline Style
        !           912: Definitionen und Verarbeitungs-Instruktionen um Stylesheets zu importieren und die
        !           913: <literal>DOCTYPE</literal> Deklaration, die wir sp&auml;ter in diesem Kapitel in <link linkend="mozilla-CHP-2-SECT-5.5.3">Abschnitt
        !           914: 2.5.5.3</link> genauer anschauen werden.
        !           915: </para>
        !           916: 
        !           917: <para>
        !           918: Diese Extras f&uuml;hren dazu dass Ihre XUL Datei jetzt eher wie eine Applikation aussieht.
        !           919: Weiter hilft Ihnen dieser Ansatz, Ihre Applikation in wiederverwendbare Teile wie Stylesheets, Widgets
        !           920: und Skript Bibliotheken aufzuteilen, wie in <link linkend="mozilla-CHP-2-SECT-5">Abschnitt 2.5</link>
        !           921: gezeigt wird.
        !           922: </para>
        !           923: 
        !           924: <figure id="mozilla-CHP-2-FIG-2" label="2-2">
        !           925: <title>Das zweite Hello xFly Beispiel - im Browser geladen</title>
        !           926: <graphic fileref="figs/moz_0202.png"/></figure>
        !           927: 
        !           928: <sect2 role="" id="mozilla-CHP-2-SECT-3.1" label="2.3.1">
        !           929: <title>Ressourcen aus Mozilla importieren</title>
        !           930: 
        !           931: <para>
        !           932: Der Code in <link linkend="mozilla-CHP-2-EX-4">Beispiel 2-4</link> verwendet Skripts und
        !           933: Styles die bereits in Mozilla definiert sind. Wie Sie in den Beispielen in diesem Buch
        !           934: sehen werden ist global.css das Stylesheet, das Styledefinitionen f&uuml;r XUL Widgets
        !           935: enth&auml;lt. Die meisten Widgets haben einen Basis-Style. Wie Sie in <link linkend="mozilla-CHP-2-EX-1">Beispiel 2-1</link>
        !           936: sehen k&ouml;nnen, sieht ein Button bereits wie ein Button aus, ohne dass zus&auml;tzliche Styles importiert werden m&uuml;ssten.
        !           937: </para>
        !           938: 
        !           939: <para>
        !           940: Als sich XPFE entwickelte wurden mehr und mehr Styledefinitionen in XBL
        !           941: definiert um diese Basis-Styles zu erhalten. Dies enthob <filename>global.css</filename>
        !           942: und andere CSS Dateien von einen Teil der Verantwortung.
        !           943: Dennoch enth&auml;lt dieses Stylesheet wichtige Informationen um XUL Widgets anzeigen
        !           944: zu k&ouml;nnen. Deshalb ist es normalerweise eine gute Idee es zu
        !           945: importieren und zu sehen wie die Applikation danach aussieht. Wenn Sie <link linkend="mozilla-CHP-2-EX-4">Beispiel 2-4</link>
        !           946: mit oder ohne <filename>global.css</filename> Zeile starten, sehen Sie welchen Einfluss
        !           947: auf die XUL Widgets ausge&uuml;bt wird.
        !           948: </para>
        !           949: 
        !           950: <para>
        !           951: Die Sktipts <filename>globalOverlay.js</filename>, <filename>tasksOverlay.js</filename> und <filename>dialogOverlay.js</filename>
        !           952: die in <link linkend="mozilla-CHP-2-EX-4">Beispiel 2-4</link> importiert werden, stellen ihrerseits Funktionalit&auml;t f&uuml;r die Applikation
        !           953: zur Verf&uuml;gung.
        !           954: </para>
        !           955: 
        !           956: <sect3 role="" id="mozilla-CHP-2-SECT-3.1.1" label="2.3.1.1">
        !           957: <title>Stylesheets laden</title>
        !           958: 
        !           959: <para>
        !           960: In der zweiten Zeile von <link linkend="mozilla-CHP-2-EX-4">Beispiel 2-4</link>, verwendet die Stylesheet
        !           961: Deklaration eine <filename>chrome://</filename> URL um die Datei <filename>global.css</filename> zu laden.
        !           962: Die Styleinformationen in dieser Datei geben dem Button Widget sein Look&amp;Feel. Sie k&ouml;nnen diese Deklaration
        !           963: verwenden um andere Mozilla Stylesheets wie <filename>global.css</filename>, <filename>navigator.css</filename>
        !           964: und <filename>toolbar.css</filename> oder Ihr eigenes Stylesheet zu laden. In beiden F&auml;llen wird die URL <filename>chrome://</filename>
        !           965: verwendet um auf verpackte Dateien auf eine flexible Art zuzugreifen.
        !           966: </para>
        !           967: 
        !           968: <programlisting>&lt;!--import the navigator.css stylesheet 
        !           969:     from the Mozilla navigator component--&gt;
        !           970: &lt;?xml-stylesheet href="chrome://navigator/skin" type="text/css"?&gt;
        !           971: &lt;!--import xfly.css stylesheet from the xFly package--&gt;
        !           972: &lt;?xml-stylesheet href="chrome://xfly/skin" type="text/css"?&gt;</programlisting>
        !           973: 
        !           974: <para>
        !           975: Weiter sollten Sie sich merken wie in <link linkend="mozilla-CHP-2-EX-4">Beispiel 2-4</link> inline Styles
        !           976: verwendet werden. Die Eigenschaft <literal>style</literal> des <literal>label</literal> Widgets bietet
        !           977: einen Platz um Styleinformationen unterzubringen. In unserem Beispiel setzen wir den Text des Labels FETT.
        !           978: Sie k&ouml;nnten diese Information auch in einem externen Stylesheet ablegen und dieses danach mitsamt Ihrer
        !           979: Applikation verpacken, dies machen wir sp&auml;ter in diesem Kapitel in <link linkend="mozilla-CHP-2-SECT-5.5">Abschnitt 2.5.5</link> auch noch.
        !           980: </para>
        !           981: 
        !           982: </sect3>
        !           983: 
        !           984: <sect3 role="" id="mozilla-CHP-2-SECT-3.1.2" label="2.3.1.2">
        !           985: <title>Skripts aus XUL aufrufen</title>
        !           986: 
        !           987: <para>
        !           988: Um ein Skript aus XUL anzusprechen verwenden Sie das <literal>script</literal> Element
        !           989: und eine URL f&uuml;r dessen <literal>src</literal> Attribut:
        !           990: </para>
        !           991: 
        !           992: <programlisting>&lt;script type="application/x-javascript"
        !           993:    src="chrome://xfly/content/xfly.js" /&gt;</programlisting>
        !           994: 
        !           995: <para>
        !           996: Die Datei <literal>dialogOverlay.js</literal>, die in <link linkend="mozilla-CHP-2-EX-4">Beispiel 2-4</link> verwendet
        !           997: wird, bietet Zugang zur Funktion <literal>CenterWindowOnScreen( )</literal>. Diese Funktion wird wie folgt zug&auml;nglich gemacht:
        !           998: </para>
        !           999: 
        !          1000: <programlisting>&lt;script type="application/x-javascript"   
        !          1001:   src="chrome://global/content/dialogOverlay.js" /&gt;</programlisting>
        !          1002: 
        !          1003: <para>
        !          1004: Alle Funktionen die in der Datei <filename>dialogOverlay.js</filename> gefunden
        !          1005: werden, werden in den Scope der aktuellen XUL Datei geladen und k&ouml;nnen somit
        !          1006: direkt aufgerufen werden. <literal>CenterWindowOnScreen( )</literal> wird zum Beispiel
        !          1007: im <literal>onload</literal> EventHandler des XUL Windows verwendet. Die Funktionen aus einer
        !          1008: JavaScript Datei machen sich nicht bemerkbar, sind aber via JavaScritp Debugger zu sehen.
        !          1009: Um die passende Funktion f&uuml;r Ihr Problem zu finden, schauen Sie sich den SourceCode der
        !          1010: Funktionsdatei oder einer Applikation an; die Chance ist gross, dass f&uuml;r Ihr Problem
        !          1011: bereits eine L&ouml;sung existiert.
        !          1012: <footnote label="1">
        !          1013: <para>
        !          1014: Leider gibt es im Moment keine gute Referenz aller Skripte die importiert werden k&ouml;nnen
        !          1015: und der Funktionalit&auml;t die Sie zur Verf&uuml;gung stellen. Deshalb ist es oft eine Frage von
        !          1016: Gl&uuml;ck, wen man kennt, testen, Willensst&auml;rke und Geduld um die korrekten Datein zu finden.
        !          1017: </para> </footnote>
        !          1018: </para>
        !          1019: 
        !          1020: </sect3>
        !          1021: </sect2>
        !          1022: </sect1>
        !          1023: 
        !          1024: <sect1 role="" id="mozilla-CHP-2-SECT-4" label="2.4">
        !          1025: <title>XUL Dateien als Chrome anzeigen</title>
        !          1026: 
        !          1027: <para>
        !          1028: <link linkend="mozilla-CHP-2-FIG-2">Darstellung 2-2</link> zeigt die XUL Datei aus
        !          1029: <link linkend="mozilla-CHP-2-EX-4">Beispiel 2-4</link> im Hauptfenster des Browsers. Das Beispiel
        !          1030: enth&auml;lt ein <literal>label</literal> Widget und ein <literal>image</literal>, die beide
        !          1031: innerhalb einer <literal>vbox</literal> ausgerichtet werden. Diese Widgets machen das 'Chrome'
        !          1032: ihrer Applikation aus, die M&ouml;glichkeit f&uuml;r Mozilla via <emphasis>chrome://</emphasis> URL auf
        !          1033: seine eigenen Ressourcen zuzugreifen.
        !          1034: </para>
        !          1035: 
        !          1036: <para>
        !          1037: Das Beispiel zeigt zwar einige interessante Konzepte um mit XPFE zu arbeiten,
        !          1038: ist aber noch keine Applikation. Unter anderem m&ouml;chten Sie sicher, dass Ihr Programm
        !          1039: ausserhalb des Browsers l&auml;uft. Je gr&ouml;sser das Projekt wird, desto mehr m&ouml;chten Sie
        !          1040: verschiedene Teile trennen -- zum Beispiel in eine XUL Datei, ein eigenes Stylesheet und ein Skript.
        !          1041: Der Rest dieses Kapitels geht darauf ein, wie man den Code aus <link linkend="mozilla-CHP-2-EX-4">Beispiel 2-4</link>
        !          1042: verpacken kann und wie man ihn standalone starten kann, indem man die <literal>-chrome</literal> Option beim starten
        !          1043: von Mozilla angibt.
        !          1044: </para>
        !          1045: 
        !          1046: <para>
        !          1047: Um eine Applikation mit der -chrome Option zu starten, muss diese zuerst 
        !          1048: korrekt in Mozillas Registry eingetragen werden. <link linkend="mozilla-CHP-2-SECT-5.6">Abschnitt 2.5.6</link>
        !          1049: geht n&auml;her auf die chrome-Umgebung ein und zeigt, wie Applikationen registriert werden.
        !          1050: </para>
        !          1051: 
        !          1052: <para>
        !          1053: Obwohl das Beispiel noch nicht registriert wurde, m&ouml;chten wir Ihnen zeigen wie die Applikation aussieht,
        !          1054: wenn sie in einem eigenen Fenster geladen wurde, und wie sie im Browser dargestellt wird. Wenn Sie das Beispiel
        !          1055: mit der <literal>-chrome</literal> Option (wie sp&auml;ter in diesem Kapitel, in <link linkend="mozilla-CHP-2-SECT-6">Abschnitt 2.6</link>
        !          1056: beschrieben) starten, sehen Sie das Fenster aus <link linkend="mozilla-CHP-2-FIG-3">Darstellung 2-3</link>.
        !          1057: </para>
        !          1058: 
        !          1059: <figure id="mozilla-CHP-2-FIG-3" label="2-3">
        !          1060: <title>Das zweite Hello xFly Beispiel in seinem eigenen Fenster</title>
        !          1061: <graphic fileref="figs/moz_0203.png"/></figure>
        !          1062: 
        !          1063: <para>
        !          1064: Die Verwendung der <literal>-chrome</literal> Option weist Mozilla an, die angegebene
        !          1065: Datei (in unserem Fall der Code aus <link linkend="mozilla-CHP-2-EX-4">Beispiel 2-4</link>)
        !          1066: in einem eigenen Fenster anstatt dem Browserfenster zu laden. Die Datei selbst ist genau die
        !          1067: gleiche, unabh&auml;ngig davon, wie sie geladen wird. Die Resultate unterscheiden sich je nachdem
        !          1068: was Sie Mozilla instruieren zu tun.
        !          1069: </para>
        !          1070: 
        !          1071: <para>
        !          1072: Die XUL Datei in einem eigenen chrome Window anzuzeigen macht die Applikation
        !          1073: unabh&auml;ngiger und unterbricht die Verbindung zum Browser die durch die File &gt; Open File
        !          1074: Methode erzeugt wird. Eigene Fenster mit der JavaScript Funktion <literal>window.openDialog</literal> 
        !          1075: zu starten, gibt der Applikation weit flexiblere Anzeigem&ouml;glichkeiten.
        !          1076: </para>
        !          1077: 
        !          1078: </sect1>
        !          1079: 
        !          1080: <sect1 role="" id="mozilla-CHP-2-SECT-5" label="2.5">
        !          1081: <title>Ein Paket erstellen</title>
        !          1082: 
        !          1083: <para>
        !          1084: Die zwei vorhergehenden Abschnitte handelten von chrome und der M&ouml;glichkeit
        !          1085: Applikationen in einem eigenen Fenster laufen zu lassen. Der n&auml;chste Schritt
        !          1086: ist, das Beispiel in ein Paket umzuwandeln -- eine modularen Sammlung der
        !          1087: Dateien, die in Mozilla als neue Applikation installiert werden k&ouml;nnen.
        !          1088: </para>
        !          1089: 
        !          1090: <para>
        !          1091: Im vorhergehenden <link linkend="mozilla-CHP-2-SECT-3">Abschnitt 2.3</link>,
        !          1092: haben Sie der XUL Datei zus&auml;tzliche Features und Komplexit&auml;t hinzugef&uuml;gt. In diesem
        !          1093: Abschnitt verteilen wir diese in einzelne Dateien -- einer CSS Datei, einer JS Datei
        !          1094: und einer DTD Datei -- registrieren dieses Dateien und machen Sie als
        !          1095: einziges Paket installierbar.
        !          1096: </para>
        !          1097: 
        !          1098: <para>
        !          1099: Nur wenn Sie Ihre Applikation verpacken, haben deren Dateien Zugriff auf Mozilla Dateien
        !          1100: wie CSS und Skripts, sind &uuml;ber die spezielle <filename>chrome://</filename> URL verf&uuml;gbar,
        !          1101: akzeptieren neue Themes und k&ouml;nnen auf die XPCOM Objekte zugreifen in denen der gr&ouml;sste Teil
        !          1102: der Mozilla Applikation definiert ist.
        !          1103: </para>
        !          1104: 
        !          1105: <para>
        !          1106: Um ein neues Paket zu erstellen sind verschiedene Werkzeuge verf&uuml;gbar. <link linkend="mozilla-APP-B">Anhang B</link>
        !          1107: enth&auml;lt Informationen &uuml;ber XULKit einer Handvoll Skripts die einen Teil der Paket-Erstellung &uuml;bernehmen. Es wird jedoch
        !          1108: empfohlen, zuerst ein paar Pakete von Hand zu machen um zu verstehen wie sie funktionieren bevor man XULKit verwendet.
        !          1109: </para>
        !          1110: 
        !          1111: <sect2 role="" id="mozilla-CHP-2-SECT-5.1" label="2.5.1">
        !          1112: <title>Architektur eines Chrome Pakets</title>
        !          1113: 
        !          1114: <para>
        !          1115: Die Architektur von Mozilla XPFE ist Komponenten- beziehungsweise Layer- basiert.
        !          1116: Eines der wichtiges Ziele bei diesem Design ist die klare Trennung der verschiedenen Komponenten
        !          1117: einer Applikation. Namentlich Inhalte, Funktionalit&auml;t und Layout. Dieses Design hat eine gr&ouml;ssere
        !          1118: Modularisierung zur Folge, die es einfach macht eine Benutzerschnittstelle zu &auml;ndern. Um zum Beispiel
        !          1119: die Skin Ihrer Applikation zu &auml;ndern, k&ouml;nnen Sie die Sprachdateien anpassen oder weitere Script Elemente
        !          1120: hinzuf&uuml;gen.
        !          1121: </para>
        !          1122: 
        !          1123: <para>
        !          1124: Wenn ein Paket so modular aufgebaut sein kann wie in Mozilla, k&ouml;nnen
        !          1125: Design-Entscheidungen von Designer, die Sprache der Benutzerschnittstelle
        !          1126: von einem Author und das Applikationsframework von einem Programmierer unterhalten werden
        !          1127: (obwohl der Programmierer in vielen kleinen Projekten wohl all diese Positionen selber belegt). Die n&auml;chsten
        !          1128: Abschnitte gehen n&auml;her auf die verschiedenen Komponenten, deren Inhalte und Dateitypen ein.
        !          1129: Die Art wie Komponenten zusammengestellt werden, kann als Inspiration f&uuml;r Ihre
        !          1130: eigenen Entwicklungen dienen.
        !          1131: </para>
        !          1132: 
        !          1133: <para>
        !          1134: Ein Paket ist eine Gruppe von Verzeichnissen und dazugeh&ouml;rigen Dateien, welche
        !          1135: zusammen 'die Mozilla Applikation' ausmachen. Ein kleines, typisches Paket enth&auml;t
        !          1136: normalerweise eine XUL Datei, eine Skript Datei (im Moment JavaScript, w&auml;hrend
        !          1137: Implementationen f&uuml;r Perl, Python, Ruby und andere Sprachen entwickelt werden)
        !          1138: und einer CSS Datei. Ein ausgewachsenes Paket kann weiter XBL Dateien, Bilder (PNG, JPG, GIF),
        !          1139: DTD, HTML und RDF Dateien enthalten. Jede davon hat eine wichtige Rolle in der Applikation.
        !          1140: </para>
        !          1141: 
        !          1142: </sect2>
        !          1143: <sect2 role="" id="mozilla-CHP-2-SECT-5.2" label="2.5.2">
        !          1144: <title>Paket Komponenten</title>
        !          1145: 
        !          1146: <para>
        !          1147: Sie werden feststellen, dass jede Komponente in einem Paket unabh&auml;ngig ist. Es ist m&ouml;glich mit
        !          1148: einer oder zwei Komponenten eine Applikation zu erstellen. Alle Komponenten wirken jedoch zusammen,
        !          1149: wenn eine ausgewachsene Applikation erstellt werden soll und stehen zu Ihrem Vorteil zur Verf&uuml;gung.
        !          1150: </para>
        !          1151: 
        !          1152: <sect3 role="" id="mozilla-CHP-2-SECT-5.2.1" label="2.5.2.1">
        !          1153: <title>Chrome Inhalt</title>
        !          1154: 
        !          1155: <para>
        !          1156: Der Inhalt setzt sich aus XUL und XBL Daten aus einer oder mehreren Dateien zusammen. Diese
        !          1157: Inhalte werden zur Laufzeit aus den Dateien, Overlays und Bindings gelesen um im Window System
        !          1158: wiedergegeben zu werden. Die plattform&uuml;bergreifende Architektur garantiert Konsistenz und passt
        !          1159: in den Leitgedanken 'write once, run everywhere'. XUL definiert ein einziges Widget Set, das 
        !          1160: f&uuml;r alle Plattformen g&uuml;ltig ist. Der XUL Parser ist jedoch nicht so tolerant wie mancher HTML Parser,
        !          1161: besser gesagt ist er sogar komplett intolerant. Dies muss auch so sein, da jedes XUL Element die umliegenden
        !          1162: Elemente beinflusst -- speziell im Kontext des Box Modells welches in <link linkend="mozilla-CHP-3">Kapitel 3</link>
        !          1163: n&auml;her beschrieben wird.
        !          1164: </para>
        !          1165: 
        !          1166: <para>
        !          1167: Das Widget Set besteht aus einfachen Widgets, die dargestellt werden
        !          1168: indem sie sich, im ihnen zugemessenen Raum, zeichnen. Komplexere Widgets, die
        !          1169: als Container benutzt werden bis zu Widgets die ihre Inhalte stapeln, oder Eingaben
        !          1170: verarbeiten.  Ein <literal>&lt;label&gt;</literal> Widget ist ein
        !          1171: Beispiel des erstgenannten, <literal>&lt;stack&gt;</literal> geh&ouml;rt zur letzteren,
        !          1172: komplexen Gruppe. Wenn der Parser ein Element nicht laden kann l&ouml;st er einen Fehler aus.
        !          1173: Die Fehler unterscheiden sich im Typ. XML Syntax-bedingte Fehler werden im Fenster anstelle
        !          1174: des erwarteten Inhalts ausgegeben. Angezeigt wird der Name der fehlerhaften Datei und
        !          1175: die Position (Zeile/Reihe) des fehlerhaften Abschnitts.
        !          1176: </para>
        !          1177: 
        !          1178: <para>
        !          1179: Als Erweiterung wird die XBL (eXtensible Binding Language) benutzt, eine
        !          1180: Beschreibungssprache zu XUL. XBL erlaubt dem Benutzer, eigene Widgets zu definieren,
        !          1181: oder einem bestehenden Widget neue Funktionalit&auml;t hinzuzuf&uuml;gen. Sie k&ouml;nnen f&uuml;r ein
        !          1182: Binding Scripte und Inhalte definieren. Mit einem bisschen Vorstellungskraft k&ouml;nnen
        !          1183: Sie unendlich viele Inhalte in Ihrer Applikation verwalten indem Sie
        !          1184: eigene Widgets, Styles und Verhalten in XBL erfassen.
        !          1185: </para>
        !          1186: 
        !          1187: </sect3>
        !          1188: 
        !          1189: <sect3 role="" id="mozilla-CHP-2-SECT-5.2.2" label="2.5.2.2">
        !          1190: <title>Chrome Aussehen</title>
        !          1191: 
        !          1192: <para>
        !          1193: Wenn man eine XUL Datei l&auml;dt, werden die XUL Elemente als einfache, unproportionierte
        !          1194: Widgets ausgegeben. W&auml;hrend einfacher Text f&uuml;r eine Webseite ein effizientes Mittel sein kann
        !          1195: um Informationen weiterzugeben, ist diese Situation mit Benutzerschnittstellen 
        !          1196: nicht der Fall.
        !          1197: </para>
        !          1198: 
        !          1199: <para>
        !          1200: Mozilla Benutzerschnittstellen ohne Styles sind nicht sehr brauchbar. Selbst um
        !          1201: das traditionelle Look&amp;Feel des grauen Interfaces, das viele Applikationen verwenden,
        !          1202: zu erhalten, muss CSS verwendet werden. Subtile Effekte wie Farbt&ouml;nungen und 3D Buttons
        !          1203: lassen sogar einfachste Benutzerschnittstellen besser aussehen.
        !          1204: </para>
        !          1205: 
        !          1206: <para>
        !          1207: Themes und die M&ouml;glichkeit das Look&amp;Feel einer Applikation auf ein Unternehmen anzupassen
        !          1208: werden immer wichtiger. Mozilla Entwickler realisierten dies w&auml;hrend der Design Phase, was sich
        !          1209: auf die Architektur auswirkte: das Aussehen der Schnittstelle ist fast komplett unabh&auml;ngig
        !          1210: von deren strukturellem Aufbau.
        !          1211: </para>
        !          1212: 
        !          1213: </sect3>
        !          1214: 
        !          1215: <sect3 role="" id="mozilla-CHP-2-SECT-5.2.3" label="2.5.2.3">
        !          1216: <title>Chrome Verhalten</title>
        !          1217: 
        !          1218: <para>
        !          1219: Mozilla unterst&uuml;tzt im Moment nur JavaScript als Br&uuml;cke zwischen Benutzerschnittstelle
        !          1220: und Applikationscode. JavaScript ist der Kleber zwischen dem Interface und dem
        !          1221: fast vollst&auml;ndig in C++ geschriebenen Backend.
        !          1222: </para>
        !          1223: 
        !          1224: <para>
        !          1225: Ein grosser Teil der Infrastruktur f&uuml;r die Unterst&uuml;tzung weiterer Skriptsprachen
        !          1226: wie Perl und Python existiert bereits, deshalb wurden beide Sprachen zur eingliederung
        !          1227: in das Framework vorgeschlagen.  Im Moment erkennen Sie Inhalte die mit JavaScript
        !          1228: verbunden sind anhand der folgenden Deklaration:
        !          1229: </para>
        !          1230: 
        !          1231: <programlisting>&lt;script type="application/x-javascript" src="xfly.js" /&gt;</programlisting>
        !          1232: 
        !          1233: <para>
        !          1234: <literal>type</literal> dient als Ersatz zum abgel&ouml;sten <literal>language</literal>
        !          1235: Attribut und erwartet einen MIME-Type als Wert. So kann, wenn weitere Sprachen
        !          1236: hinzugef&uuml;gt werden einfach der Wert ge&auml;ndert werden -- was sehr gut in die Philosphie von
        !          1237: 'There's More Than One Way To Do It' passt. Die Funktionellen Komponenten einer Mozilla Applikation
        !          1238: werden meist im <filename>content</filename> Unterverzeichnis abgelegt, wie in <link linkend="mozilla-CHP-2-SECT-5.3">Abschnitt 2.5.3</link>
        !          1239: erkl&auml;rt wird.
        !          1240: </para>
        !          1241: 
        !          1242: </sect3>
        !          1243: 
        !          1244: <sect3 role="" id="mozilla-CHP-2-SECT-5.2.4" label="2.5.2.4">
        !          1245: <title>Chrome Lokalisierung</title>
        !          1246: 
        !          1247: <para>
        !          1248: Lokalisierung ist der Prozess in dem eine Software an lokale Gegebenheiten
        !          1249: angepasst wird, indem zum Beispiel die Sprache f&uuml;r eine bestimmte Region ge&auml;ndert wird.
        !          1250: Widgets wie MenuItems, Buttons, Window TitleBars und Alert-Dialoge m&uuml;ssen zumeist
        !          1251: nicht angepasst werden. Nebst dessen k&ouml;nnen jedoch verschiedene Dinge lokalisiert
        !          1252: werden, von HTML Seiten bis zu Installationspaketen.
        !          1253: </para>
        !          1254: 
        !          1255: <para>Die unterst&uuml;tzten Formate sind:</para>
        !          1256: 
        !          1257: <itemizedlist><listitem>
        !          1258: <para>DTD (<filename>.dtd</filename>) Dateien, die Entities mit dem Inhalt der Zeichenkette
        !          1259: enthalten die im XUL Teil verwendet wird.
        !          1260: </para>
        !          1261: </listitem><listitem>
        !          1262: <para>
        !          1263: Property-Dateien (<filename>.properties</filename>), die Zeichenketten
        !          1264: enthalten und dynamisch via JavaScript oder C++ ausgelesen werden.
        !          1265: </para>
        !          1266: </listitem><listitem>
        !          1267: <para>
        !          1268: HTML Dateien sind f&uuml;r bestimmte Seiten die mit der Applikation installiert werden,
        !          1269: wie zum Beispiel About:Mozilla.
        !          1270: </para>
        !          1271: </listitem><listitem>
        !          1272: <para>RDF Dateien.</para>
        !          1273: </listitem></itemizedlist>
        !          1274: </sect3>
        !          1275: </sect2>
        !          1276: <sect2 role="" id="mozilla-CHP-2-SECT-5.3" label="2.5.3">
        !          1277: <title>Verzeichnisstruktur</title>
        !          1278: 
        !          1279: <para>
        !          1280: Dateien k&ouml;nnen auf verschiedene Arten organisiert werden. Wenn Ihre Applikation klein ist,
        !          1281: und nur aus einer einfachen Strukur besteht, nur in einer Sprache verf&uuml;gbar sein muss -- dann ist
        !          1282: es m&ouml;glicherweise einfacher, alle Dateien in einem einzigen Verzeichnis abzulegen. Wenn die Applikation
        !          1283: jedoch eine gewisse Gr&ouml;sse ereicht, ist es sinnvoller die Dateien logisch in Unterverzeichnissen abzulegen.
        !          1284: </para>
        !          1285: 
        !          1286: <para>
        !          1287: Die meisten Applikationen verwenden einen Verzeichnisstruktur die den Inhalt des Software Paketes
        !          1288: wiederspiegelt: XUL und JavaScript in einem <filename>content</filename> Unterverzeichnis, CSS und Bilder
        !          1289: in einem <filename>skin</filename> Unterverzeichnis und DTDs und andere Ressourcen f&uuml;r die Lokalisierung
        !          1290: in einem Unterverzeichnis namens <emphasis>locale</emphasis>. <link linkend="mozilla-CHP-2-FIG-4">Abbildung 2-4</link>
        !          1291: zeigt diese Anordnung.
        !          1292: </para>
        !          1293: 
        !          1294: <figure id="mozilla-CHP-2-FIG-4" label="2-4">
        !          1295: <title>Ein Beispiel Verzeichnis-Layout f&uuml;r ein Paket</title>
        !          1296: <graphic fileref="figs/moz_0204.png"/></figure>
        !          1297: 
        !          1298: <para>
        !          1299: Diese drei verschiedenen Verzeichnisse enthalten meist die folgenden Dateitypen:
        !          1300: </para>
        !          1301: 
        !          1302: <variablelist>
        !          1303: <varlistentry><term>content</term>
        !          1304: <listitem>
        !          1305: <para>
        !          1306: Das <filename>content</filename> Verzeichnis enth&auml;lt die XUL Dateien, das die Widgets
        !          1307: f&uuml;r die Applikation enth&auml;lt. Es ist g&auml;ngige Praxis ebenfalls JavaScript Dateien in diesem Verzeichnis
        !          1308: abzulegen.
        !          1309: </para>
        !          1310: </listitem>
        !          1311: </varlistentry>
        !          1312: 
        !          1313: <varlistentry><term>locale</term>
        !          1314: <listitem>
        !          1315: <para>
        !          1316: Dieses Verzeichnis enth&auml;lt Dateien, die Zeichenketten enthalten, welche f&uuml;r die
        !          1317: Lokalisierung Ihrer Applikation ben&ouml;tigt werden. Die meisten dieser Dateien sind
        !          1318: DTDs, die die Entit&auml;ten enthalten die in der XUL Datei referenziert werden. Darunter
        !          1319: gibt es ein Unterverzeichnis pro angebotene <emphasis>code-region</emphasis>, wie
        !          1320: zum Beispiel <literal>de-CH</literal>.
        !          1321: </para>
        !          1322: </listitem>
        !          1323: </varlistentry>
        !          1324: 
        !          1325: <varlistentry><term>skin</term>
        !          1326: <listitem>
        !          1327: <para>
        !          1328: Der name 'Skin' ist eine interne Bezeichnung f&uuml;r ein Theme. Das <filename>skin</filename>
        !          1329: Verzeichnis enth&auml;lt alle CSS Dateien und Bilder, die f&uuml;r das Aussehen der Fenster
        !          1330: zust&auml;ndig sind. Dies ist gleichzeitig ein guter Ort um die Applikationsicons aufzubewahren - in
        !          1331: einem eigenen Unterverzeichnis.
        !          1332: </para>
        !          1333: </listitem>
        !          1334: </varlistentry>
        !          1335: </variablelist>
        !          1336: 
        !          1337: <sect3 role="" id="mozilla-CHP-2-SECT-5.3.1" label="2.5.3.1">
        !          1338: <title> Die Verzeichnisstruktur der xFly Applikation</title>
        !          1339: 
        !          1340: <para>
        !          1341: Die Verzeichnisstruktur in der die Applikation definiert ist (egal ob es
        !          1342: sich um Dateisystem Verzeichnisse oder um Ordner in einem JAR-Archiv handelt),
        !          1343: ist ein wichtiger Teil des Applikations Designs und dem Zusammenhang zu Mozilla.
        !          1344: Verwenden Sie die folgenden Schritte um Ihr xFly Paket zusammenzufassen,
        !          1345: registrier- und anpassbar zu machen.
        !          1346: </para>
        !          1347: 
        !          1348: <itemizedlist><listitem>
        !          1349: <para>
        !          1350: Suchen Sie auf Ihrem Computer das Installationverzeichnis von Mozilla und
        !          1351: erstellen Sie unterhalb des <filename>chrome</filename> Verzeichnisses ein
        !          1352: neues Verzeichnis namens "<filename>xfly</filename>."
        !          1353: </para>
        !          1354: 
        !          1355: <para>
        !          1356: Alle Mozilla Applikationen werden im <filename>chrome</filename> Verzeichnis abgelegt.
        !          1357: </para>
        !          1358: </listitem><listitem>
        !          1359: <para>
        !          1360: Unter diesem Verzeichnis m&uuml;ssen Sie 3 weitere erstellen. <filename>content</filename>, <filename>locale</filename> und
        !          1361: <filename>skin</filename>, wie in <link linkend="mozilla-CHP-2-FIG-5">Abbildung 2-5</link> gezeigt wird. Das <filename>locale</filename>
        !          1362: Verzeichnis muss ein Unterverzeichnis namens 'en-US' enthalten um das Sprachpaket abzulegen.
        !          1363: </para>
        !          1364: </listitem></itemizedlist>
        !          1365: <figure id="mozilla-CHP-2-FIG-5" label="2-5">
        !          1366: <title>xFly Paket Verzeichnisstruktur</title>
        !          1367: <graphic fileref="figs/moz_0205.png"/></figure>
        !          1368: 
        !          1369: </sect3>
        !          1370: </sect2>
        !          1371: <sect2 role="" id="mozilla-CHP-2-SECT-5.4" label="2.5.4">
        !          1372: <title>Paket Manifeste</title>
        !          1373: 
        !          1374: <para>
        !          1375: Nun, nachdem wir die Verzeichnisse f&uuml;r unser Paket eingerichtet haben, m&uuml;ssen wir
        !          1376: Mozilla informieren, welche Dateien verwendet werden sollen. Alle Mozilla Pakete
        !          1377: m&uuml;ssen ein Manifest enthalten, das dessen Inhalt beschreibt und verwendet werden kann,
        !          1378: um das Paket zu registrieren. Manifeste sind ein oder mehrere RDF Dateien, die im Paket
        !          1379: enthalten sind, und mit Mozillas <filename>chrome</filename> Verzeichnis interagieren. RDF Dateien
        !          1380: sind XML Dateien die Daten in maschinenlesbarer Form beschreiben.
        !          1381: </para>
        !          1382: 
        !          1383: <para>
        !          1384: Jedes xFly Paket ben&ouml;tigt sein eigenes Manifest. Mozilla verwendet diese Dateien (in diesem
        !          1385: Fall <filename>contents.rdf</filename>) um eine Applikation zu registrieren. Diese Dateien werden
        !          1386: in <link linkend="mozilla-CHP-2-EX-5">Beispiel 2-5</link>, <link linkend="mozilla-CHP-2-EX-6">Beispiel 2-6</link>
        !          1387: und <link linkend="mozilla-CHP-2-EX-7">Beispiel 2-7</link> aufgelistet. Erstellen Sie diese Dateien in deren
        !          1388: <filename>content</filename>, <filename>skin</filename> und <filename>locale</filename> Unterverzeichnissen.
        !          1389: </para>
        !          1390: 
        !          1391: <example id="mozilla-CHP-2-EX-5" label="2-5">
        !          1392: <title>chrome/xfly/content/contents.rdf file </title>
        !          1393: <programlisting>&lt;?xml version="1.0"?&gt;
        !          1394: &lt;RDF:RDF xmlns:RDF="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
        !          1395:          xmlns:chrome="http://www.mozilla.org/rdf/chrome#"&gt;
        !          1396:   &lt;!-- list all the packages being supplied --&gt;
        !          1397:   &lt;RDF:Seq about="urn:mozilla:package:root"&gt;
        !          1398:     <emphasis role="bold">&lt;RDF:li resource="urn:mozilla:package:xfly"/&gt;</emphasis>
        !          1399:   &lt;/RDF:Seq&gt;
        !          1400:   &lt;!-- package information --&gt;
        !          1401:   &lt;RDF:Description about="urn:mozilla:package:xfly"
        !          1402:         chrome:displayName="xFly"
        !          1403:         chrome:author="xfly.mozdev.org"
        !          1404:         chrome:name="xfly"&gt;
        !          1405:   &lt;/RDF:Description&gt;
        !          1406:  <emphasis role="bold">&lt;/RDF:RDF&gt;</emphasis></programlisting>
        !          1407: </example>
        !          1408: 
        !          1409: <para>
        !          1410: Im content-Manifest in <link linkend="mozilla-CHP-2-EX-5">Beispiel 2-5</link> finden Sie
        !          1411: Metadaten wie <literal>chrome:name</literal> und <literal>chrome:author</literal>, die
        !          1412: das Manifest Mozilla zur Verf&uuml;gung stellt. Diese Information kann von anderen Leuten verwendet
        !          1413: werden um herauszufinden um was f&uuml;r eine Applikation es sich handelt und wer sie geschrieben hat.
        !          1414: Der Name, Author und Beschreibung eines Themes sind zum Beispiel in den Einstellungen
        !          1415: sichtbar, wenn Sie Appearance &gt; Themes w&auml;hlen.
        !          1416: </para>
        !          1417: 
        !          1418: <para>
        !          1419: In <link linkend="mozilla-CHP-2-EX-6">Beispiel 2-6</link> sehen Sie, dass das xFly Paket
        !          1420: nur die Skin Resource Classic erweitert, wie in <literal>RDF:Seq</literal> notiert, das
        !          1421: nur <literal>classic</literal> als betroffenes Paket auflistet.
        !          1422: </para>
        !          1423: 
        !          1424: <example id="mozilla-CHP-2-EX-6" label="2-6">
        !          1425: <title>chrome/xfly/skin/contents.rdf file </title>
        !          1426: <programlisting>&lt;?xml version="1.0"?&gt;
        !          1427: &lt;RDF:RDF xmlns:RDF="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
        !          1428:          xmlns:chrome="http://www.mozilla.org/rdf/chrome#"&gt;
        !          1429:   &lt;RDF:Seq about="urn:mozilla:skin:root"&gt;
        !          1430:     &lt;RDF:li resource="urn:mozilla:skin:classic/1.0" /&gt;
        !          1431:   &lt;/RDF:Seq&gt;
        !          1432:   &lt;RDF:Description about="urn:mozilla:skin:classic/1.0"&gt;
        !          1433:     &lt;chrome:packages&gt;
        !          1434:       &lt;RDF:Seq about="urn:mozilla:skin:classic/1.0:packages"&gt;
        !          1435:         <emphasis role="bold">&lt;RDF:li resource="urn:mozilla:skin:classic/1.0:xfly"/&gt;</emphasis>
        !          1436:       &lt;/RDF:Seq&gt;
        !          1437:     &lt;/chrome:packages&gt;
        !          1438:   &lt;/RDF:Description&gt;
        !          1439: &lt;/RDF:RDF&gt;</programlisting>
        !          1440: </example>
        !          1441: 
        !          1442: <para>
        !          1443: In <link linkend="mozilla-CHP-2-EX-7">Beispiel 2-7</link> wird gezeigt wie die dritte Art von
        !          1444: Manifest verwendet wird, um das englische Language Pack (<literal>en-US</literal>) als Ressource
        !          1445: im xFly Paket zu deklarieren. Die <literal>RDF:Seq</literal> Struktur in einem Manifest besagt
        !          1446: 'diesem Paket folgendes Language Pack (bsp: das <literal>en-US</literal> Language Pack), hinzuf&uuml;gen.'
        !          1447: </para>
        !          1448: 
        !          1449: <example id="mozilla-CHP-2-EX-7" label="2-7">
        !          1450: <title>chrome/xfly/locale/contents.rdf file </title>
        !          1451: <programlisting>&lt;?xml version="1.0"?&gt;
        !          1452: &lt;RDF:RDF xmlns:RDF="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
        !          1453:          xmlns:chrome="http://www.mozilla.org/rdf/chrome#"&gt;
        !          1454:   &lt;RDF:Seq about="urn:mozilla:locale:root"&gt;
        !          1455:     &lt;RDF:li resource="urn:mozilla:locale:en-US"/&gt;
        !          1456:   &lt;/RDF:Seq&gt;
        !          1457:   &lt;!-- locale information --&gt;
        !          1458:   <emphasis role="bold">&lt;RDF:Description about="urn:mozilla:locale:en-US</emphasis>"
        !          1459:         <emphasis role="bold">chrome:displayName="English(US)</emphasis>"
        !          1460:         <emphasis role="bold">chrome:author="xfly.mozdev.org</emphasis>"
        !          1461:         <emphasis role="bold">chrome:name="en-US</emphasis>"
        !          1462:         <emphasis role="bold">chrome:previewURL="http://www.mozilla.org/locales/en-US.gif"&gt;</emphasis>
        !          1463:     &lt;chrome:packages&gt;
        !          1464:       &lt;RDF:Seq about="urn:mozilla:locale:en-US:packages"&gt;
        !          1465:         <emphasis role="bold">&lt;RDF:li resource="urn:mozilla:locale:en-US:xfly"/&gt;</emphasis>
        !          1466:       &lt;/RDF:Seq&gt;
        !          1467:     &lt;/chrome:packages&gt;
        !          1468:   &lt;/RDF:Description&gt;
        !          1469: &lt;/RDF:RDF&gt;</programlisting>
        !          1470: </example>
        !          1471: 
        !          1472: <para>
        !          1473: Manifeste werden in <link linkend="mozilla-CHP-6">Kapitel 6</link> n&auml;her erl&auml;utert. F&uuml;r den Moment
        !          1474: reicht es, zu verstehen, dass jedes Manifest das Unterverzeichnis in dem es abgelegt ist beschreibt,
        !          1475: und dass die Inhalte dieser Unterverzeichnisse zusammen den Inhalt des Pakets ausmachen.
        !          1476: </para>
        !          1477: 
        !          1478: <para>
        !          1479: Content beschreibt den Inhalt des xFly Pakets, XUL und JavaScript.
        !          1480: Skin beschreibt das Theme oder CSS und Images welche in der XUL Struktur verwendet wurden.
        !          1481: Der dritte Teil beschreibt die Locale oder die Zeichenketten in der Benutzerschnittstelle
        !          1482: welche an verschiedene Sprachen und lokale Gegebenheiten angepasst werden kann.
        !          1483: </para>
        !          1484: 
        !          1485: </sect2>
        !          1486: <sect2 role="" id="mozilla-CHP-2-SECT-5.5" label="2.5.5">
        !          1487: <title>Aufteilen der Dateien</title>
        !          1488: 
        !          1489: <para>
        !          1490: Wenn Sie die Unterverzeichnis Struktur f&uuml;r Ihre Applikation
        !          1491: eingerichtet haben, k&ouml;nnen Sie diese Teile Ihrer Applikation aus den
        !          1492: Dateien extrahieren und in eigenen Dateien ablegen. Diese separaten
        !          1493: Dateien - die XUL Datei, CSS, JS und DTD Dateien -- werden danach als
        !          1494: einziges Paket registriert und k&ouml;nnen somit als Applikation gestartet
        !          1495: werden.
        !          1496: </para>
        !          1497: 
        !          1498: <para>
        !          1499: Obwohl wir bereits in <link linkend="mozilla-CHP-2-EX-4">Beispiel 2-4</link> gesehen haben, wie
        !          1500: unser "Hello World" Beispiel funktioniert, zeigt deren Integration, wie ein Paket 
        !          1501: mit Mozilla zusammenarbeiten kann. Jeder Schritt um die Komponenten zu separieren
        !          1502: f&uuml;hrt dazu, dass die Basis-Datei angepasst werden muss.
        !          1503: </para>
        !          1504: 
        !          1505: <sect3 role="" id="mozilla-CHP-2-SECT-5.5.1" label="2.5.5.1">
        !          1506: <title>Die xFly CSS Datei</title>
        !          1507: 
        !          1508: <para>
        !          1509: Die Inline Style Definition des Label Widgets kann fast direkt in einer separaten Datei
        !          1510: namens <filename>xfly.css</filename> abgelegt werden. Speichern sie den Code aus <link linkend="mozilla-CHP-2-EX-8">Beispiel 2-8</link>
        !          1511: im Unterverzeichnis <filename>chrome/xfly/skin/</filename>.
        !          1512: </para>
        !          1513: 
        !          1514: <example id="mozilla-CHP-2-EX-8" label="2-8">
        !          1515: <title>Der Inhalt von xfly.css </title>
        !          1516: <programlisting>#xlabel { font-weight: bold; }
        !          1517: window  { background-color: white; }</programlisting>
        !          1518: </example>
        !          1519: 
        !          1520: <para>
        !          1521: Style Definitionen aus einer externen Datei zu verwenden ist anders als sie direkt
        !          1522: Inline zu notieren, da man einen Weg haben muss, um den Style mit einem Element
        !          1523: zu verbinden. CSS verf&uuml;gt &uuml;ber eine breite Anzahl solcher sogenannter Selektoren,
        !          1524: die Elemente mit Styles verkn&uuml;pfen. In diesem Fall, in dem Sie zwei verschiedene
        !          1525: Elemente haben, die einen Style verwenden sollen, wird das <literal>id</literal> Attribut
        !          1526: benutzt um das Element zu referenzieren, auf das der Style angewendet werden soll, der zweite
        !          1527: Weg ist, dies direkt via Elementname zu erledigen. <link linkend="mozilla-CHP-2-EX-8">Beispiel 2-8</link>
        !          1528: enth&auml;lt die Selektoren f&uuml;r diese zwei Elemente und <link linkend="mozilla-CHP-2-EX-9">Beispiel 2-9</link>
        !          1529: zeigt die aktualisierte Version von <filename>xfly.css</filename>.
        !          1530: </para>
        !          1531: 
        !          1532: <example id="mozilla-CHP-2-EX-9" label="2-9">
        !          1533: <title>Externe Styledefinitionen verwenden</title>
        !          1534: <programlisting>&lt;?xml version="1.0"?&gt;
        !          1535: &lt;?xml-stylesheet href="chrome://global/skin" type="text/css"?&gt;
        !          1536: <emphasis role="bold">&lt;?xml-stylesheet href="chrome://xfly/skin" type="text/css"?&gt;</emphasis>
        !          1537: &lt;!DOCTYPE window&gt;
        !          1538: &lt;window title="Hello xFly"
        !          1539:   xmlns:html="http://www.w3.org/1999/xhtml"
        !          1540:   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
        !          1541:   width="300"
        !          1542:   height="215"
        !          1543:   onload="centerWindowOnScreen( )"&gt;
        !          1544:  &lt;script type="application/x-javascript"   
        !          1545:   src="chrome://global/content/dialogOverlay.js" /&gt;
        !          1546:  &lt;vbox align="left" <userinput>id="vb"</userinput>&gt;
        !          1547:   &lt;label <userinput>id="xlabel"</userinput>
        !          1548:       value="Hello, Welcome to the xFly" /&gt;
        !          1549:   &lt;image src="http://books.mozdev.org/xfly.gif" /&gt;
        !          1550:   &lt;button label="hello xFly" oncommand="alert('hello.');" /&gt;
        !          1551:  &lt;/vbox&gt;
        !          1552: &lt;/window&gt;</programlisting>
        !          1553: </example>
        !          1554: 
        !          1555: <para>
        !          1556: Beachten Sie das neue Stylesheet 'import'-Statement am Anfang der Datei und
        !          1557: die Verwendung des <literal>id</literal> Attributs im Label. Wenn Sie Dateien
        !          1558: mit Ihrem Paket registrieren wollen, deutet das <filename>xfly</filename> Verzeichnis
        !          1559: auf den Ort in der Verzeichnisstruktur an dem Ihre Applikation abgelegt wurde. (Das <filename>skin</filename>
        !          1560: Unterverzeichnis, und dessen Inhalt <filename>xfly.css</filename>). Das Label wird
        !          1561: danach die Style Informationen von der Stelle laden die mit dem <literal>style</literal>
        !          1562: Attribut angegeben wurde.
        !          1563: </para>
        !          1564: 
        !          1565: </sect3>
        !          1566: 
        !          1567: <sect3 role="" id="mozilla-CHP-2-SECT-5.5.2" label="2.5.5.2">
        !          1568: <title>Die xFly Script Datei</title>
        !          1569: 
        !          1570: <para>
        !          1571: Als erstes entfernen wir den Script Teil aus unserer XUL Datei und
        !          1572: legen ihn in einer JavaScript Datei ab. <link linkend="mozilla-CHP-2-EX-10">Beispiel 2-10</link>
        !          1573: zeigt eine XUL Datei welche eine Funktion f&uuml;r den Button aus der externen Script Datei <filename>xfly.js</filename>
        !          1574: l&auml;dt.
        !          1575: </para>
        !          1576: 
        !          1577: <example id="mozilla-CHP-2-EX-10" label="2-10">
        !          1578: <title>Verwendung von externen Scripts</title>
        !          1579: <programlisting>&lt;?xml version="1.0"?&gt;
        !          1580: &lt;?xml-stylesheet href="chrome://global/skin" type="text/css"?&gt;
        !          1581: &lt;?xml-stylesheet href="chrome://xfly/skin" type="text/css"?&gt;
        !          1582: &lt;!DOCTYPE window&gt;
        !          1583: &lt;window title="Hello xFly"
        !          1584:   xmlns:html="http://www.w3.org/1999/xhtml"
        !          1585:   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
        !          1586:   width="300"
        !          1587:   height="215"
        !          1588:   onload="centerWindowOnScreen( )"&gt;
        !          1589: &lt;script type="application/x-javascript"   
        !          1590:   src="chrome://global/content/dialogOverlay.js" /&gt;
        !          1591: <emphasis role="bold">&lt;script type="application/x-javascript</emphasis>"   
        !          1592:   <emphasis role="bold">src="chrome://xfly/content/xfly.js" /&gt;</emphasis>
        !          1593:  &lt;vbox align="left" id="vb"&gt;
        !          1594:   &lt;label id="xlabel" 
        !          1595:       value="Hello, Welcome to the xFly" /&gt;
        !          1596:   &lt;image src="http://books.mozdev.org/xfly.gif" /&gt;
        !          1597:   &lt;button label="hello xFly" oncommand="greet( );" /&gt;
        !          1598:  &lt;/vbox&gt;
        !          1599: &lt;/window&gt;</programlisting>
        !          1600: </example>
        !          1601: 
        !          1602: <para>
        !          1603: Die Funktion <literal>greet( )</literal> benennt die Aktion die
        !          1604: durchgef&uuml;hrt wird, wenn der Button angeklickt wird. Die <literal>greet( )</literal>
        !          1605: Funktion ist nun in der Script Datei <filename>xfly.js</filename> abgelegt, die via
        !          1606: 'import'-Statement hinzugebunden wurde:
        !          1607: </para>
        !          1608: 
        !          1609: <programlisting><emphasis role="bold">&lt;script type="application/x-javascript</emphasis>"   
        !          1610:   <emphasis role="bold">src="chrome://xfly/content/xfly.js" /&gt;</emphasis></programlisting>
        !          1611: 
        !          1612: <para>
        !          1613: <link linkend="mozilla-CHP-2-EX-11">Beispiel 2-11</link> enth&auml;lt den Code f&uuml;r die
        !          1614: <filename>xfly.js</filename> Datei den Sie ben&ouml;tigen.
        !          1615: </para>
        !          1616: 
        !          1617: <example id="mozilla-CHP-2-EX-11" label="2-11">
        !          1618: <title>Der Inhalt der xfly.js Datei</title>
        !          1619: <programlisting>function greet( ) {
        !          1620:   alert("Hello World");
        !          1621: }</programlisting>
        !          1622: </example>
        !          1623: 
        !          1624: <para>
        !          1625: Speichern Sie die Datei <filename>xfly.js</filename> in das <filename>content</filename>
        !          1626: Unterverzeichnis der xFly Applikation (<filename>chrome/xfly/content/</filename>). Das oben
        !          1627: benutzte 'import'-Statement verwendet eine <filename>chrome://</filename> URL um die Skripte und
        !          1628: die Verzeichnisse die registriert wurden aufzufinden.
        !          1629: </para>
        !          1630: 
        !          1631: </sect3>
        !          1632: 
        !          1633: <sect3 role="" id="mozilla-CHP-2-SECT-5.5.3" label="2.5.5.3">
        !          1634: <title>Das xFly DTD</title>
        !          1635: 
        !          1636: <para>
        !          1637: Der letzte Schritt ist, die sprachabh&auml;ngigen Teile der Applikation
        !          1638: zu generalisieren. Wenn Sie ein Unterverzeichnis namens <filename>locale</filename>
        !          1639: erstellen, und darin Ihre englische DTD Datei ablegen, k&ouml;nnen Sie sie genau gleich
        !          1640: wie CSS Dateien einbinden.
        !          1641: </para>
        !          1642: 
        !          1643: <para>
        !          1644: Um Mozilla anzuweisen f&uuml;r Label und Button Elemente in unserem xFly Beispiel
        !          1645: den Text anzupassen, k&ouml;nnen Sie Entit&auml;ten anstelle von Zeichenketten
        !          1646: zur Ausgabe dieser Texte verwenden. Da sich diese Entit&auml;ten in einer <filename>xfly.dtd</filename>
        !          1647: Datei in einem Unterverzeichnis befinden, kann somit sehr einfach ein anderes Sprachpaket verwendet
        !          1648: werden um die Sprache umzuschalten.
        !          1649: </para>
        !          1650: 
        !          1651: <para>
        !          1652: Auch diese Datei kann sehr einfach gehalten werden. <link linkend="mozilla-CHP-2-EX-12">Beispiel 2-12</link>
        !          1653: enth&auml;lt den Code f&uuml;r die <filename>xfly.dtd</filename> Datei, die Sie erstellen und im <filename>locale</filename>
        !          1654: Unterverzeichnis speichern sollten.
        !          1655: </para>
        !          1656: 
        !          1657: <example id="mozilla-CHP-2-EX-12" label="2-12">
        !          1658: <title>Der Inhalt der xfly.dtd Datei</title>
        !          1659: <programlisting>&lt;!ENTITY label.val       "Hello, Welcome to the xFly " &gt;
        !          1660: &lt;!ENTITY btn.lbl         "hello xFly " &gt;</programlisting>
        !          1661: </example>
        !          1662: 
        !          1663: <para>
        !          1664: Die aktualisierte XUL Datei, die das externe DTD verwendet wird in <link linkend="mozilla-CHP-2-EX-13">Beispiel 2-13</link>
        !          1665: ausgegeben. Wenn Sie die ben&ouml;tigten &Auml;nderungen an der XUL Datei vorgenommen haben, speichern Sie den Code aus <link linkend="mozilla-CHP-2-EX-13">Beispiel 2-13</link>
        !          1666: als <filename>xfly.xul</filename> im <filename>chrome/xfly/content/</filename> Verzeichnis.
        !          1667: </para>
        !          1668: 
        !          1669: <example id="mozilla-CHP-2-EX-13" label="2-13">
        !          1670: <title>XUL mit einem externen DTD</title>
        !          1671: <programlisting>&lt;?xml version="1.0"?&gt;
        !          1672: &lt;?xml-stylesheet href="chrome://global/skin" type="text/css"?&gt;
        !          1673: &lt;?xml-stylesheet href="chrome://xfly/skin" type="text/css"?&gt;
        !          1674: &lt;!DOCTYPE window SYSTEM "chrome://xfly/locale/xfly.dtd" &gt;
        !          1675: &lt;window title="Hello xFly"
        !          1676:   xmlns:html="http://www.w3.org/1999/xhtml"
        !          1677:   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
        !          1678:   width="300"
        !          1679:   height="215"
        !          1680:   onload="centerWindowOnScreen( )"&gt;
        !          1681: &lt;script type="application/x-javascript"   
        !          1682:   src="chrome://global/content/dialogOverlay.js" /&gt;
        !          1683: &lt;script type="application/x-javascript"   
        !          1684:   src="chrome://xfly/content/xfly.js" /&gt;
        !          1685:  &lt;vbox align="left" id="vb"&gt;
        !          1686:   &lt;label id="xlabel" 
        !          1687:       <userinput>value="&amp;label.val;"</userinput> /&gt;
        !          1688:   &lt;image src="http://books.mozdev.org/xfly.gif" /&gt;
        !          1689:   &lt;button <userinput>label="&amp;btn.lbl;"</userinput> oncommand="greet( );" /&gt;
        !          1690:  &lt;/vbox&gt;
        !          1691: &lt;/window&gt;</programlisting>
        !          1692: </example>
        !          1693: 
        !          1694: <para>
        !          1695: Wie bei CSS und Scripts ein 'import'-Statement, weist die aktualisierte <literal>DOCTYPE</literal>
        !          1696: Definition am Anfang der Datei, Mozilla an, zus&auml;tzliche Entit&auml;ten als Teil des xFly
        !          1697: Pakets zu laden. Diese Entit&auml;ten -- englische Zeichenketten die in der Benutzerschnittstelle
        !          1698: ausgegeben werden -- k&ouml;nnen also ohne die Applikationsstruktur zu beinflussen
        !          1699: lokalisiert und internationalisiert werden.
        !          1700: </para>
        !          1701: 
        !          1702: <para>
        !          1703: Alle drei 'import'-Statements verwenden die <filename>chrome://</filename> URL
        !          1704: um xFly interne Ressourcen zu referenzieren. Dieser URL Type kann auch verwendet
        !          1705: werden, um auf andere Ressourcen wie Bilder, bereits definierte Zeichenketten und
        !          1706: Skript Funktionen wie <literal>centerWindowOnScreen( )</literal> innerhalb von Mozilla zuzugreifen.
        !          1707: </para>
        !          1708: 
        !          1709: <para>
        !          1710: Wenn Sie fertig sind das Paket Verzeichnis aufzusetzen, sollten Sie eine Struktur wie die
        !          1711: in <link linkend="mozilla-CHP-2-EX-14">Beispiel 2-14</link> haben:
        !          1712: </para>
        !          1713: 
        !          1714: <example id="mozilla-CHP-2-EX-14" label="2-14">
        !          1715: <title>Die Struktur des xFly Pakets</title>
        !          1716: <programlisting>chrome/
        !          1717:        xfly/
        !          1718:            content/
        !          1719:                   xfly.xul
        !          1720:                   xfly.js
        !          1721:                   contents.rdf
        !          1722:            locale/
        !          1723:                  en-US/
        !          1724:                       xfly.dtd
        !          1725:                       contents.rdf
        !          1726:            skin/
        !          1727:                   xfly.css
        !          1728:                   contents.rdf</programlisting>
        !          1729: </example>
        !          1730: 
        !          1731: </sect3>
        !          1732: </sect2>
        !          1733: <sect2 role="" id="mozilla-CHP-2-SECT-5.6" label="2.5.6">
        !          1734: <title>Ein Paket registrieren</title>
        !          1735: 
        !          1736: <para>
        !          1737: Pakete in Mozilla zu registrieren kann anfangs etwas verwirrend sein, deshalb sollten Sie sich
        !          1738: keine Sorgen machen, wenn Sie an diesem Punkt nicht alles auf Anhieb verstehen. Sp&auml;tere Kapitel
        !          1739: gehen genauer auf Verpackung und Registrierung ein, und Sie k&ouml;nnen jederzeit die Beispiel aus
        !          1740: diesem Buch verwenden um Ihre eigene Applikation zu installieren. Generell ben&ouml;tigt Mozilla
        !          1741: Manifeste eines Paketes um diese zu registrieren.
        !          1742: </para>
        !          1743: 
        !          1744: <para>
        !          1745: Obwohl die Registration normalerweise Teil der Installation ist und mit dem XPInstall API
        !          1746: vorgenommen wird, brauchen Sie einen schnellen Weg um Pakete zu installieren damit Sie
        !          1747: die xFly Applikation testen k&ouml;nnen. Deshalb werden wir einfach die Datei <filename>installed-chrome.txt</filename>
        !          1748: in Mozillas <filename>chrome</filename> Verzeichnis direkt anpassen.
        !          1749: </para>
        !          1750: 
        !          1751: <para>
        !          1752: Die Datei <filename>installed-chrome.txt</filename> enth&auml;lt eine Liste aller
        !          1753: Pakete die von Mozilla beim aufstarten registriert werden sollen. Wenn Sie
        !          1754: dieser Datei Eintr&auml;ge hinzuf&uuml;gen weisen Sie Mozilla an, dieses Paket beim
        !          1755: Aufstarten zu laden.
        !          1756: </para>
        !          1757: 
        !          1758: <para>
        !          1759: H&auml;ngen Sie die Eintr&auml;ge von <link linkend="mozilla-CHP-2-EX-15">Beispiel 2-15</link> am Ende der
        !          1760: <filename>installed-chrome.txt</filename> Datei im chrome Verzeichnis an.
        !          1761: </para>
        !          1762: 
        !          1763: <example id="mozilla-CHP-2-EX-15" label="2-15">
        !          1764: <title>Zus&auml;tzliche Eintr&auml;ge f&uuml;r installed-chrome.txt</title>
        !          1765: <programlisting>content,install,url,resource:/chrome/xfly/content/
        !          1766: skin,install,url,resource:/chrome/xfly/skin/
        !          1767: locale,install,url,resource:/chrome/xfly/locale/en-US/</programlisting>
        !          1768: </example>
        !          1769: 
        !          1770: <para>
        !          1771: Wenn Mozilla aufstartet sucht er die Paket-Manifeste, liest sie und
        !          1772: registriert das xFly Paket.
        !          1773: </para>
        !          1774: 
        !          1775: <para>
        !          1776: Wenn andere Benutzer Ihre Applikation installieren m&ouml;chten ohne dabei
        !          1777: <filename>installed-chrome.txt</filename> anzupassen, k&ouml;nnen Sie eine
        !          1778: JavaScript Installations-Datei erstellen, die das Paket herunterl&auml;dt
        !          1779: und registriert. Konsultieren Sie <link linkend="mozilla-CHP-6">Kapitel 6</link>
        !          1780: f&uuml;r zus&auml;tzliche Informationen &uuml;ber diesen Vorgang und die Verwendung von XPInstall.
        !          1781: </para>
        !          1782: 
        !          1783: </sect2>
        !          1784: </sect1>
        !          1785: 
        !          1786: <sect1 role="" id="mozilla-CHP-2-SECT-6" label="2.6">
        !          1787: <title>Die Applikation starten</title>
        !          1788: 
        !          1789: <para>
        !          1790: Wenn Ihr Paket registriert ist, k&ouml;nnen Sie folgende Optionen verwenden um sie zu starten.
        !          1791: </para>
        !          1792: 
        !          1793: <sect2 role="" id="mozilla-CHP-2-SECT-6.1" label="2.6.1">
        !          1794: <title>Windows start</title>
        !          1795: 
        !          1796: <para>
        !          1797: Wechseln Sie in das Mozilla Installations-Verzeichnis und starten Sie xFly
        !          1798: &uuml;ber die Kommandozeile:
        !          1799: </para>
        !          1800: 
        !          1801: <programlisting>mozilla -chrome chrome://xfly/content/</programlisting>
        !          1802: 
        !          1803: <para>
        !          1804: Sie k&ouml;nnen die xFly Applikation auch anhand eines Shortcuts auf Ihrem Desktop
        !          1805: starten indem Sie den Icon mit der rechten Maustaste anklicken und 'Eigenschaften'
        !          1806: ausw&auml;hlen. F&uuml;gen Sie folgenden Text in das 'Ziel' Feld ein:
        !          1807: </para>
        !          1808: 
        !          1809: <programlisting> -chrome chrome://xfly/content/</programlisting>
        !          1810: 
        !          1811: <para><link linkend="mozilla-CHP-2-FIG-6">Abbildung 2-6</link> zeigt den neuen 'Eigenschaften'-Dialog
        !          1812: nach der &Auml;nderung.
        !          1813: </para>
        !          1814: 
        !          1815: <figure id="mozilla-CHP-2-FIG-6" label="2-6">
        !          1816: <title>Ge&auml;nderte Shortcut Eigenschaften</title>
        !          1817: <graphic fileref="figs/moz_0206.png"/></figure>
        !          1818: 
        !          1819: <sect3 role="" id="mozilla-CHP-2-SECT-6.1.1" label="2.6.1.1">
        !          1820: <title>Unix start</title>
        !          1821: 
        !          1822: <para>
        !          1823: Wechseln Sie in das Mozilla Installations-Verzeichnis von Mozilla, und
        !          1824: starten Sie xFly mit:
        !          1825: </para>
        !          1826: 
        !          1827: <programlisting><userinput>./mozilla -chrome chrome://xfly/content/</userinput></programlisting>
        !          1828: 
        !          1829: </sect3>
        !          1830: 
        !          1831: <sect3 role="" id="mozilla-CHP-2-SECT-6.1.2" label="2.6.1.2">
        !          1832: <title>Macintosh start</title>
        !          1833: 
        !          1834: <para>
        !          1835: Starten Sie xFly indem Sie auf dem Desktop eine neue Datei mit folgendem Inhalt
        !          1836: erstellen:
        !          1837: </para>
        !          1838: 
        !          1839: <programlisting><userinput>-chrome chrome://xfly/content/</userinput></programlisting>
        !          1840: 
        !          1841: <para>
        !          1842: Um die Applikation zu starten k&ouml;nnen Sie entweder die Textdatei &uuml;ber das Mozilla Icon
        !          1843: ziehen, oder den CreatorType der Datei auf <literal>MOZZ</literal> setzen. Wenn Sie den
        !          1844: CreatorType &auml;ndern, sollte es m&ouml;glich sein die Applikation mit Doppelklick zu starten.
        !          1845: </para>
        !          1846: 
        !          1847: <para>
        !          1848: Sobald Sie die Applikation registriert haben, steht es Ihnen frei, Ihre Applikation
        !          1849: so weiterzuentwickeln, wie Sie es f&uuml;r richtig halten. Legen Sie die neuen
        !          1850: Komponenten in die entsprechenden Verzeichnisse und starten Sie die Applikation
        !          1851: neu. Sie k&ouml;nnen im <filename>content</filename> Verzeichnis zum Beispiel neue
        !          1852: XUL Dateien ablegen, die danach mit der Funktion <literal>window.openDialog( )</literal>
        !          1853: ge&ouml;ffnet werden.
        !          1854: </para>
        !          1855: 
        !          1856: <para>
        !          1857: Sie k&ouml;nnen <filename>xfly.xul</filename> auch neue Widgets hinzuf&uuml;gen, neue
        !          1858: Styles f&uuml;r <filename>xfly.css</filename> definieren, neue Funktionen f&uuml;r
        !          1859: <filename>xfly.js</filename> schreiben oder existierende Funktionen von
        !          1860: Mozillas SourceCode verwenden.
        !          1861: </para>
        !          1862: 
        !          1863: <warning role="ora"><para>Wenn Sie Probleme haben die xFly Applikation zu &auml;ndern und neu zu starten, gibt es ein paar
        !          1864: plattformspezifische Dinge die beachtet werden sollten. Wenn Sie auf Windows das QuickLaunch Feature
        !          1865: verwenden, kann dies dazu f&uuml;hren, dass &Auml;nderungen nicht &uuml;bernommen werden. Wenn auf UNIX die Dateirechte
        !          1866: nicht korrekt gesetzt sind, kann die ebenfalls zu Problemen f&uuml;hren. Stellen Sie also sicher, dass
        !          1867: QuickLaunch ausgeschaltet ist und &uuml;berpr&uuml;fen Sie die Dateirechte um m&ouml;gliche Probleme mit xFly zu l&ouml;sen.</para></warning>
        !          1868: 
        !          1869: <para>
        !          1870: Die Schritte, die in diesem Kapitel erkl&auml;rt wurden -- erstellen einer XUL Datei,
        !          1871: neue Features hinzuf&uuml;gen, die Applikation standalone anzeigen, aufteilen des
        !          1872: Codes in separate Dateien und die Paket-Struktur und das Registrieren und Starten des
        !          1873: Pakets -- sind die wichtigsten Teile einer Mozilla Applikation. Wenn Sie diese Teile verstehen,
        !          1874: werden Sie die weiteren Kapitel in diesem Buch einfacher nachvollziehen k&ouml;nnen.
        !          1875: </para>
        !          1876: 
        !          1877: </sect3>
        !          1878: </sect2>
        !          1879: </sect1>
        !          1880: </chapter>

FreeBSD-CVSweb <freebsd-cvsweb@FreeBSD.org>