From 4b1a9203c547c019fc5398082ae19a3f3d4c3efe Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:15 -0500 Subject: initial commit --- files/de/archive/add-ons/index.html | 11 + files/de/archive/add-ons/seamonkey_2/index.html | 281 ++++++ files/de/archive/apps/index.html | 35 + .../b2g_os/anwendungsentwicklung/index.html | 12 + files/de/archive/b2g_os/api/index.html | 156 ++++ files/de/archive/b2g_os/api/navigator/index.html | 19 + .../api/navigator/requestwakelock/index.html | 37 + .../index.html" | 48 + files/de/archive/b2g_os/apps/index.html | 50 ++ .../arbeiten_mit_dem_b2g_desktop_client/index.html | 135 +++ .../b2g_os/benutzung_des_app_managers/index.html | 264 ++++++ files/de/archive/b2g_os/building/index.html | 268 ++++++ .../compatible_devices/index.html | 357 ++++++++ .../firefox_os_build_overview/index.html | 155 ++++ .../building_and_installing_firefox_os/index.html | 45 + .../b2g_os/debugging/developer_settings/index.html | 197 +++++ files/de/archive/b2g_os/debugging/index.html | 80 ++ .../b2g_os/debugging/installing_adb/index.html | 70 ++ .../index.html" | 41 + .../filing_bugs_against_firefox_os/index.html | 183 ++++ .../b2g_os/developing_firefox_os/index.html | 26 + .../firefox_os_build_prerequisites/index.html | 446 ++++++++++ files/de/archive/b2g_os/firefox_os_faq/index.html | 41 + files/de/archive/b2g_os/gaia/gaia_apps/index.html | 86 ++ files/de/archive/b2g_os/gaia/hacking/index.html | 181 ++++ files/de/archive/b2g_os/gaia/index.html | 56 ++ .../b2g_os/gaia/introduction_to_gaia/index.html | 35 + .../gaia_entwickeln/build_system_primer/index.html | 190 ++++ .../customizing_build-time_apps/index.html | 117 +++ .../durchfuehrung_der_gaia_codebase/index.html | 71 ++ files/de/archive/b2g_os/gaia_entwickeln/index.html | 52 ++ .../making_gaia_code_changes/index.html | 85 ++ files/de/archive/b2g_os/index.html | 163 ++++ .../installing_on_a_mobile_device/index.html | 81 ++ files/de/archive/b2g_os/introduction/index.html | 84 ++ .../phone_guide/alcatel_one_touch_fire/index.html | 102 +++ .../de/archive/b2g_os/phone_guide/flame/index.html | 39 + .../b2g_os/phone_guide/geeksphone/index.html | 202 +++++ files/de/archive/b2g_os/phone_guide/index.html | 44 + .../b2g_os/phone_guide/phone_specs/index.html | 800 +++++++++++++++++ .../b2g_os/phone_guide/zte_open_c/index.html | 82 ++ .../b2g_os/platform/app_architektur/index.html | 29 + .../archive/b2g_os/platform/architektur/index.html | 740 ++++++++++++++++ files/de/archive/b2g_os/platform/index.html | 81 ++ .../b2g_os/quickstart/deine_erste_app/index.html | 339 +++++++ .../quickstart/einfuerung_zu_firefox_os/index.html | 13 + .../quickstart/for_mobile_developers/index.html | 40 + files/de/archive/b2g_os/quickstart/index.html | 49 ++ .../open_web_apps_and_web_standards/index.html | 38 + files/de/archive/b2g_os/releases/1.4/index.html | 71 ++ files/de/archive/b2g_os/releases/2.0/index.html | 112 +++ files/de/archive/b2g_os/releases/index.html | 24 + files/de/archive/b2g_os/simulator/index.html | 86 ++ files/de/archive/b2g_os/troubleshooting/index.html | 44 + files/de/archive/css3/index.html | 976 +++++++++++++++++++++ files/de/archive/index.html | 21 + files/de/archive/mdn/index.html | 20 + files/de/archive/mozilla/index.html | 10 + .../de/archive/mozilla/marketplace/apis/index.html | 46 + .../de/archive/mozilla/marketplace/faq/index.html | 30 + files/de/archive/mozilla/marketplace/index.html | 126 +++ .../archive/mozilla/marketplace/index/index.html | 107 +++ .../mozilla/marketplace/marktplatz_apis/index.html | 109 +++ .../options/open_web_apps_for_android/index.html | 142 +++ .../mozilla/marketplace/publishing/index.html | 6 + .../publishing/packaged_apps/index.html | 184 ++++ .../publishing/publish_options/index.html | 67 ++ .../marketplace/publishing/submit/index.html | 10 + .../publishing/updating_apps/index.html | 27 + .../mozilla/marketplace/submission/index.html | 9 + .../marketplace_review_criteria/index.html | 79 ++ .../marketplace/ver\303\266ffentlichen/index.html" | 106 +++ files/de/archive/mozilla/xul/action/index.html | 86 ++ .../archive/mozilla/xul/arrowscrollbox/index.html | 134 +++ files/de/archive/mozilla/xul/assign/index.html | 115 +++ .../mozilla/xul/attribute/accesskey/index.html | 24 + .../xul/attribute/activetitlebarcolor/index.html | 14 + .../archive/mozilla/xul/attribute/align/index.html | 37 + .../mozilla/xul/attribute/allowevents/index.html | 17 + .../attribute/allownegativeassertions/index.html | 11 + .../archive/mozilla/xul/attribute/color/index.html | 14 + .../archive/mozilla/xul/attribute/cols/index.html | 14 + .../mozilla/xul/attribute/decimalplaces/index.html | 14 + .../mozilla/xul/attribute/disabled/index.html | 28 + .../archive/mozilla/xul/attribute/empty/index.html | 14 + .../mozilla/xul/attribute/emptytext/index.html | 14 + .../archive/mozilla/xul/attribute/expr/index.html | 14 + .../xul/attribute/hidespinbuttons/index.html | 10 + files/de/archive/mozilla/xul/attribute/index.html | 11 + .../archive/mozilla/xul/attribute/label/index.html | 32 + .../mozilla/xul/attribute/onchange/index.html | 14 + .../mozilla/xul/attribute/prefpane.src/index.html | 25 + .../archive/mozilla/xul/attribute/src/index.html | 34 + .../mozilla/xul/attribute/treecell.src/index.html | 17 + .../mozilla/xul/attribute/treecol.src/index.html | 17 + .../archive/mozilla/xul/attribute/var/index.html | 14 + files/de/archive/mozilla/xul/bbox/index.html | 87 ++ files/de/archive/mozilla/xul/binding/index.html | 89 ++ files/de/archive/mozilla/xul/box/index.html | 101 +++ .../de/archive/mozilla/xul/colorpicker/index.html | 77 ++ .../archive/mozilla/xul/eigenschaften/index.html | 14 + files/de/archive/mozilla/xul/events/index.html | 464 ++++++++++ files/de/archive/mozilla/xul/grippy/index.html | 88 ++ files/de/archive/mozilla/xul/iframe/index.html | 161 ++++ files/de/archive/mozilla/xul/index.html | 83 ++ .../archive/mozilla/xul/method/geticon/index.html | 15 + .../mozilla/xul/method/gettabforbrowser/index.html | 15 + files/de/archive/mozilla/xul/method/index.html | 14 + .../adding_menus_and_submenus/index.html | 99 +++ .../die_grundlagen_einer_erweiterung/index.html | 454 ++++++++++ .../index.html | 161 ++++ .../xul/school_tutorial/einleitung/index.html | 44 + .../index.html | 75 ++ .../archive/mozilla/xul/school_tutorial/index.html | 70 ++ files/de/archive/mozilla/xul/separator/index.html | 123 +++ files/de/archive/mozilla/xul/spacer/index.html | 94 ++ files/de/archive/mozilla/xul/splitter/index.html | 173 ++++ files/de/archive/mozilla/xul/style/index.html | 11 + .../mozilla/xul/style/treecol-image/index.html | 13 + files/de/archive/mozilla/xul/tab/index.html | 195 ++++ files/de/archive/mozilla/xul/tabbox/index.html | 77 ++ files/de/archive/mozilla/xul/tabpanels/index.html | 100 +++ files/de/archive/mozilla/xul/tabs/index.html | 123 +++ files/de/archive/mozilla/xul/textbox/index.html | 334 +++++++ files/de/archive/mozilla/xul/treecol/index.html | 262 ++++++ files/de/archive/mozilla/xul/vbox/index.html | 100 +++ files/de/archive/mozilla/xul/window/index.html | 209 +++++ .../de/archive/mozilla/xul/xul_referenz/index.html | 15 + .../xul/xul_tutorial/die_chrome_url/index.html | 39 + .../xul_tutorial/ein_fenster_erzeugen/index.html | 111 +++ .../xul/xul_tutorial/einfuehrung/index.html | 33 + .../de/archive/mozilla/xul/xul_tutorial/index.html | 57 ++ .../xul_tutorial/installations-skripte/index.html | 96 ++ .../xul/xul_tutorial/lokalisierung/index.html | 270 ++++++ .../positionierung_von_elementen/index.html | 259 ++++++ .../xul/xul_tutorial/xul_struktur/index.html | 154 ++++ .../index.html" | 44 + files/de/archive/mozilla/xulrunner/index.html | 81 ++ files/de/archive/rss/index.html | 13 + files/de/archive/themes/index.html | 11 + files/de/archive/web-standards/index.html | 69 ++ .../web-standards/rdf_in_mozilla_faq/index.html | 264 ++++++ files/de/archive/web/index.html | 12 + .../web/javascript/arguments.caller/index.html | 55 ++ .../ecmascript_7_support_in_mozilla/index.html | 68 ++ files/de/archive/web/javascript/index.html | 12 + .../legacy_generator_function/index.html | 56 ++ 147 files changed, 15536 insertions(+) create mode 100644 files/de/archive/add-ons/index.html create mode 100644 files/de/archive/add-ons/seamonkey_2/index.html create mode 100644 files/de/archive/apps/index.html create mode 100644 files/de/archive/b2g_os/anwendungsentwicklung/index.html create mode 100644 files/de/archive/b2g_os/api/index.html create mode 100644 files/de/archive/b2g_os/api/navigator/index.html create mode 100644 files/de/archive/b2g_os/api/navigator/requestwakelock/index.html create mode 100644 "files/de/archive/b2g_os/apps/eine_app_f\303\274r_firefox_os_schreiben/index.html" create mode 100644 files/de/archive/b2g_os/apps/index.html create mode 100644 files/de/archive/b2g_os/arbeiten_mit_dem_b2g_desktop_client/index.html create mode 100644 files/de/archive/b2g_os/benutzung_des_app_managers/index.html create mode 100644 files/de/archive/b2g_os/building/index.html create mode 100644 files/de/archive/b2g_os/building_and_installing_firefox_os/compatible_devices/index.html create mode 100644 files/de/archive/b2g_os/building_and_installing_firefox_os/firefox_os_build_overview/index.html create mode 100644 files/de/archive/b2g_os/building_and_installing_firefox_os/index.html create mode 100644 files/de/archive/b2g_os/debugging/developer_settings/index.html create mode 100644 files/de/archive/b2g_os/debugging/index.html create mode 100644 files/de/archive/b2g_os/debugging/installing_adb/index.html create mode 100644 "files/de/archive/b2g_os/debugging/verbinden_eines_firefox_os_ger\303\244ts_mit_dem_rechner/index.html" create mode 100644 files/de/archive/b2g_os/developing_firefox_os/filing_bugs_against_firefox_os/index.html create mode 100644 files/de/archive/b2g_os/developing_firefox_os/index.html create mode 100644 files/de/archive/b2g_os/firefox_os_build_prerequisites/index.html create mode 100644 files/de/archive/b2g_os/firefox_os_faq/index.html create mode 100644 files/de/archive/b2g_os/gaia/gaia_apps/index.html create mode 100644 files/de/archive/b2g_os/gaia/hacking/index.html create mode 100644 files/de/archive/b2g_os/gaia/index.html create mode 100644 files/de/archive/b2g_os/gaia/introduction_to_gaia/index.html create mode 100644 files/de/archive/b2g_os/gaia_entwickeln/build_system_primer/index.html create mode 100644 files/de/archive/b2g_os/gaia_entwickeln/customizing_build-time_apps/index.html create mode 100644 files/de/archive/b2g_os/gaia_entwickeln/durchfuehrung_der_gaia_codebase/index.html create mode 100644 files/de/archive/b2g_os/gaia_entwickeln/index.html create mode 100644 files/de/archive/b2g_os/gaia_entwickeln/making_gaia_code_changes/index.html create mode 100644 files/de/archive/b2g_os/index.html create mode 100644 files/de/archive/b2g_os/installing_on_a_mobile_device/index.html create mode 100644 files/de/archive/b2g_os/introduction/index.html create mode 100644 files/de/archive/b2g_os/phone_guide/alcatel_one_touch_fire/index.html create mode 100644 files/de/archive/b2g_os/phone_guide/flame/index.html create mode 100644 files/de/archive/b2g_os/phone_guide/geeksphone/index.html create mode 100644 files/de/archive/b2g_os/phone_guide/index.html create mode 100644 files/de/archive/b2g_os/phone_guide/phone_specs/index.html create mode 100644 files/de/archive/b2g_os/phone_guide/zte_open_c/index.html create mode 100644 files/de/archive/b2g_os/platform/app_architektur/index.html create mode 100644 files/de/archive/b2g_os/platform/architektur/index.html create mode 100644 files/de/archive/b2g_os/platform/index.html create mode 100644 files/de/archive/b2g_os/quickstart/deine_erste_app/index.html create mode 100644 files/de/archive/b2g_os/quickstart/einfuerung_zu_firefox_os/index.html create mode 100644 files/de/archive/b2g_os/quickstart/for_mobile_developers/index.html create mode 100644 files/de/archive/b2g_os/quickstart/index.html create mode 100644 files/de/archive/b2g_os/quickstart/open_web_apps_and_web_standards/index.html create mode 100644 files/de/archive/b2g_os/releases/1.4/index.html create mode 100644 files/de/archive/b2g_os/releases/2.0/index.html create mode 100644 files/de/archive/b2g_os/releases/index.html create mode 100644 files/de/archive/b2g_os/simulator/index.html create mode 100644 files/de/archive/b2g_os/troubleshooting/index.html create mode 100644 files/de/archive/css3/index.html create mode 100644 files/de/archive/index.html create mode 100644 files/de/archive/mdn/index.html create mode 100644 files/de/archive/mozilla/index.html create mode 100644 files/de/archive/mozilla/marketplace/apis/index.html create mode 100644 files/de/archive/mozilla/marketplace/faq/index.html create mode 100644 files/de/archive/mozilla/marketplace/index.html create mode 100644 files/de/archive/mozilla/marketplace/index/index.html create mode 100644 files/de/archive/mozilla/marketplace/marktplatz_apis/index.html create mode 100644 files/de/archive/mozilla/marketplace/options/open_web_apps_for_android/index.html create mode 100644 files/de/archive/mozilla/marketplace/publishing/index.html create mode 100644 files/de/archive/mozilla/marketplace/publishing/packaged_apps/index.html create mode 100644 files/de/archive/mozilla/marketplace/publishing/publish_options/index.html create mode 100644 files/de/archive/mozilla/marketplace/publishing/submit/index.html create mode 100644 files/de/archive/mozilla/marketplace/publishing/updating_apps/index.html create mode 100644 files/de/archive/mozilla/marketplace/submission/index.html create mode 100644 files/de/archive/mozilla/marketplace/submission/marketplace_review_criteria/index.html create mode 100644 "files/de/archive/mozilla/marketplace/ver\303\266ffentlichen/index.html" create mode 100644 files/de/archive/mozilla/xul/action/index.html create mode 100644 files/de/archive/mozilla/xul/arrowscrollbox/index.html create mode 100644 files/de/archive/mozilla/xul/assign/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/accesskey/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/activetitlebarcolor/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/align/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/allowevents/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/allownegativeassertions/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/color/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/cols/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/decimalplaces/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/disabled/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/empty/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/emptytext/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/expr/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/hidespinbuttons/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/label/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/onchange/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/prefpane.src/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/src/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/treecell.src/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/treecol.src/index.html create mode 100644 files/de/archive/mozilla/xul/attribute/var/index.html create mode 100644 files/de/archive/mozilla/xul/bbox/index.html create mode 100644 files/de/archive/mozilla/xul/binding/index.html create mode 100644 files/de/archive/mozilla/xul/box/index.html create mode 100644 files/de/archive/mozilla/xul/colorpicker/index.html create mode 100644 files/de/archive/mozilla/xul/eigenschaften/index.html create mode 100644 files/de/archive/mozilla/xul/events/index.html create mode 100644 files/de/archive/mozilla/xul/grippy/index.html create mode 100644 files/de/archive/mozilla/xul/iframe/index.html create mode 100644 files/de/archive/mozilla/xul/index.html create mode 100644 files/de/archive/mozilla/xul/method/geticon/index.html create mode 100644 files/de/archive/mozilla/xul/method/gettabforbrowser/index.html create mode 100644 files/de/archive/mozilla/xul/method/index.html create mode 100644 files/de/archive/mozilla/xul/school_tutorial/adding_menus_and_submenus/index.html create mode 100644 files/de/archive/mozilla/xul/school_tutorial/die_grundlagen_einer_erweiterung/index.html create mode 100644 files/de/archive/mozilla/xul/school_tutorial/eine_entwicklungsumgebung_einrichten_environment/index.html create mode 100644 files/de/archive/mozilla/xul/school_tutorial/einleitung/index.html create mode 100644 files/de/archive/mozilla/xul/school_tutorial/getting_started_with_firefox_extensions/index.html create mode 100644 files/de/archive/mozilla/xul/school_tutorial/index.html create mode 100644 files/de/archive/mozilla/xul/separator/index.html create mode 100644 files/de/archive/mozilla/xul/spacer/index.html create mode 100644 files/de/archive/mozilla/xul/splitter/index.html create mode 100644 files/de/archive/mozilla/xul/style/index.html create mode 100644 files/de/archive/mozilla/xul/style/treecol-image/index.html create mode 100644 files/de/archive/mozilla/xul/tab/index.html create mode 100644 files/de/archive/mozilla/xul/tabbox/index.html create mode 100644 files/de/archive/mozilla/xul/tabpanels/index.html create mode 100644 files/de/archive/mozilla/xul/tabs/index.html create mode 100644 files/de/archive/mozilla/xul/textbox/index.html create mode 100644 files/de/archive/mozilla/xul/treecol/index.html create mode 100644 files/de/archive/mozilla/xul/vbox/index.html create mode 100644 files/de/archive/mozilla/xul/window/index.html create mode 100644 files/de/archive/mozilla/xul/xul_referenz/index.html create mode 100644 files/de/archive/mozilla/xul/xul_tutorial/die_chrome_url/index.html create mode 100644 files/de/archive/mozilla/xul/xul_tutorial/ein_fenster_erzeugen/index.html create mode 100644 files/de/archive/mozilla/xul/xul_tutorial/einfuehrung/index.html create mode 100644 files/de/archive/mozilla/xul/xul_tutorial/index.html create mode 100644 files/de/archive/mozilla/xul/xul_tutorial/installations-skripte/index.html create mode 100644 files/de/archive/mozilla/xul/xul_tutorial/lokalisierung/index.html create mode 100644 files/de/archive/mozilla/xul/xul_tutorial/positionierung_von_elementen/index.html create mode 100644 files/de/archive/mozilla/xul/xul_tutorial/xul_struktur/index.html create mode 100644 "files/de/archive/mozilla/xul/\303\244nderungen_an_xul_f\303\274r_firefox_1.5/index.html" create mode 100644 files/de/archive/mozilla/xulrunner/index.html create mode 100644 files/de/archive/rss/index.html create mode 100644 files/de/archive/themes/index.html create mode 100644 files/de/archive/web-standards/index.html create mode 100644 files/de/archive/web-standards/rdf_in_mozilla_faq/index.html create mode 100644 files/de/archive/web/index.html create mode 100644 files/de/archive/web/javascript/arguments.caller/index.html create mode 100644 files/de/archive/web/javascript/ecmascript_7_support_in_mozilla/index.html create mode 100644 files/de/archive/web/javascript/index.html create mode 100644 files/de/archive/web/javascript/legacy_generator_function/index.html (limited to 'files/de/archive') diff --git a/files/de/archive/add-ons/index.html b/files/de/archive/add-ons/index.html new file mode 100644 index 0000000000..9c0f942944 --- /dev/null +++ b/files/de/archive/add-ons/index.html @@ -0,0 +1,11 @@ +--- +title: Add-ons +slug: Archive/Add-ons +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive/Add-ons +--- +

Archived add-ons documentation.

+ +

{{SubpagesWithSummaries}}

diff --git a/files/de/archive/add-ons/seamonkey_2/index.html b/files/de/archive/add-ons/seamonkey_2/index.html new file mode 100644 index 0000000000..ff0a0bcde2 --- /dev/null +++ b/files/de/archive/add-ons/seamonkey_2/index.html @@ -0,0 +1,281 @@ +--- +title: Extensions support in SeaMonkey 2 +slug: Archive/Add-ons/SeaMonkey_2 +translation_of: Archive/Add-ons/SeaMonkey_2 +--- +

{{AddonSidebar}}

+ +

Starting with SeaMonkey 2 Alpha 1 SeaMonkey supports toolkit/-style extensions. These type of extensions have many advantages for both users and developers compared to the old xpinstall/-style extensions.

+ +

The Basics

+ +

To support SeaMonkey 2 as a target application, you need to add it to the list of target applications in the extension's install.rdf file. The code for that will look something like this:

+ +
<em:targetApplication>
+  <!-- SeaMonkey -->
+  <Description>
+    <em:id>{92650c4d-4b8e-4d2a-b7eb-24ecf4f6b63a}</em:id>
+    <em:minVersion>2.0</em:minVersion>
+    <em:maxVersion>2.*</em:maxVersion>
+  </Description>
+</em:targetApplication>
+ +

The install.js is not supported any more and should be removed.

+ +

Differences as compared to other toolkit/-based applications

+ + + +

URLbar Icons

+ +

To display a button with a menupopup in the urlbar-icons for both Firefox and SeaMonkey 2.0, use this code:

+ +

    <hbox id="urlbar-icons">
+         <image popup="myExt-menu"/>
+     </hbox>
+      <window id="main-window">
+         <menupopup id="myExt-menu">
+             <menuitem label="menuitem"/>
+             <menuitem label="menuitem"/>
+         </menupopup>
+     </window>

+ +

Instead of

+ +

    <hbox id="urlbar-icons">
+         <button type="menu">
+             <menupopup>
+                 <menuitem label="menuitem"/>
+                 <menuitem label="menuitem"/>
+                 <menuitem label="menuitem"/>
+             </menupopup>
+         </button>
+    </hbox>

+ +

Technical Note: The code that opens the URL history popup just looks for any menupopup, so it goes wrong if you add your own. Ordinary popups are fine of course.

+ +

The Statusbar

+ +

In Firefox 3 a new vbox has been added, called "browser-bottombox", which encloses the find bar and status bar at the bottom of the browser window. Although this doesn't affect the appearance of the display, it may affect your extension if it overlays chrome relative to these elements.

+ +

For example, if you overlay some chrome before the status bar, like this:

+ +
<vbox id="browser-bottombox">
+  <something insertbefore="status-bar" />
+</vbox>
+
+ +

Use the following technique to make your overlay work on both SeaMonkey 2 and Firefox 3:

+ +
<window id="main-window">
+  <vbox id="browser-bottombox" insertbefore="status-bar">
+    <something insertbefore="status-bar" />
+  </vbox>
+</window>
+
+ +

Thunderbird 3

+ +

gFolderDisplay API

+ +

SeaMonkey 2.0 only supports a reduced set of methods:

+ + + +

gMessageDisplay API

+ +

SeaMonkey 2.0 only supports a reduced set of methods:

+ + + +

JavaScript Tweaks

+ +

Firefox supports some shorthand in various places. These are so commonly available that developers often forget that they are not built-ins. SeaMonkey on the other hand defaults to not support them so they either need to be expanded to their proper forms or matching constants/variables need to be defined in custom code.

+ + + + + + + + + + + + + + + + + + + + + + + + +
ShorthandExpansion
CcComponents.classes
CiComponents.interfaces
CrComponents.results
CuComponents.utils
+ +

Multi-browser compatibility

+ +

To make an extension compatible with SeaMonkey as well as Firefox/Thunderbird, you may need to do different things depending on which application is running the extension.

+ +

In JavaScript code

+ +

You can use the following technique to detect the application:

+ +
const FIREFOX_ID = "{ec8030f7-c20a-464f-9b0e-13a3a9e97384}";
+const THUNDERBIRD_ID = "{3550f703-e582-4d05-9a08-453d09bdfdc6}";
+const SEAMONKEY_ID = "{92650c4d-4b8e-4d2a-b7eb-24ecf4f6b63a}";
+var appInfo = Components.classes["@mozilla.org/xre/app-info;1"]
+                        .getService(Components.interfaces.nsIXULAppInfo);
+if(appInfo.ID == FIREFOX_ID) {
+  // running under Firefox
+} else if(appInfo.ID == THUNDERBIRD_ID) {
+  // running under Thunderbird
+} else if(appInfo.ID == SEAMONKEY_ID) {
+  // running under SeaMonkey
+} else {
+  // another app
+}
+ +

See Using nsIXULAppInfo for more details.

+ +

In manifest file

+ +

SeaMonkey uses different overlays than other applications. You can use the application flag to select which overlay should be used with which application:

+ +
overlay chrome://browser/content/browser.xul chrome://myaddon/content/ffOverlay.xul application={ec8030f7-c20a-464f-9b0e-13a3a9e97384}
+overlay chrome://messenger/content/mailWindowOverlay.xul chrome://myaddon/content/tbOverlay.xul application={3550f703-e582-4d05-9a08-453d09bdfdc6}
+overlay chrome://navigator/content/navigator.xul chrome://myaddon/content/smOverlay.xul application={92650c4d-4b8e-4d2a-b7eb-24ecf4f6b63a}
diff --git a/files/de/archive/apps/index.html b/files/de/archive/apps/index.html new file mode 100644 index 0000000000..bd2e2cad5c --- /dev/null +++ b/files/de/archive/apps/index.html @@ -0,0 +1,35 @@ +--- +title: Apps +slug: Archive/Apps +tags: + - Apps + - Deutsch + - Firefox OS + - Web +translation_of: Archive/Apps +--- +

Diese Seite enthält archivierten Inhalt für Apps, einschließlich veraltetem Web-App-Inhalt, Firefox OS-App-bezogenen Inhalten usw.

+ + + +
+
+
Erweiterte Themen  
+
Diese Artikel enthalten zusätzliche Informationen zu erweiterten Open Web Apps-Themen. Themen wie Dokumentationen zur App-Architektur, die beim Entwurf und der Implementierung offener Web-Apps hilfreich sind, und andere Dokumentationen zum Erstellen eines Geschäfts für den Verkauf und Vertrieb offener Web-Apps.  
+
API-Referenz für die App-Entwicklung  
+
Technische Überprüfung abgeschlossen. Redaktionelle Prüfung abgeschlossen.  
+
Entwerfen von Open Web Apps  
+
Die Elemente in diesem Abschnitt gelten allgemein für das Design von Webanwendungen.  
+
Grafiken und UX  
+
Beim Erstellen von Open Web Apps müssen Sie das Erscheinungsbild, die Benutzererfahrung und den Workflow Ihrer Anwendungen sehr berücksichtigen. In früheren Teilen dieses Materials haben wir uns mit der Anwendungsplanung und den flexiblen Layouts für Anwendungen befasst. In diesem Abschnitt werden wir uns sowohl mit allgemeinen Mustern als auch mit Entwurfstechniken befassen, die für Open Web Apps funktionieren, und mit bestimmten Techniken und Ressourcen, die Ihnen helfen Stellen Sie großartig aussehende Firefox OS-Apps zusammen, die der Erfahrung der Standardanwendungen des Geräts entsprechen.  
+
Öffnen Sie die Web-App-Architektur  
+
Apps können von dem Server, auf dem sie gehostet werden ("Self-Hosting"), oder von einem Store aus installiert werden. Mozilla startete den Firefox Marketplace 2012 in einem Testmodus für Apps. Andere App Stores von Drittanbietern sind mit dieser Architektur ebenfalls möglich. Apps können kostenlos oder kostenpflichtig sein. Stores können die Überprüfung von Einkäufen unterstützen, um sicherzustellen, dass Apps nur von Benutzern ausgeführt werden, die sie gekauft haben. Der Firefox-Marktplatz unterstützt dies.  
+
Aufenthaltsraum - Animation und Grafik  
+
Es gibt verschiedene Tools im Internet, mit denen Sie Animationen und Grafiken für Ihre Arbeit erstellen können. In diesem Artikel gehen wir auf einige dieser Optionen ein, damit Sie Ihr Projekt hervorheben können! Zum Beispiel ist CSS eine Möglichkeit, Animationen auf HTML-Elemente anzuwenden, während Chartist ein großartiges Werkzeug zum Erstellen von Diagrammen und Diagrammen ist.  
+
Tools und Frameworks  
+
+
Überprüfen von Web-Apps mit dem App Validator  
+
Einige Überprüfungen, die der Validator durchführt, umfassen: + +
+
diff --git a/files/de/archive/b2g_os/anwendungsentwicklung/index.html b/files/de/archive/b2g_os/anwendungsentwicklung/index.html new file mode 100644 index 0000000000..0c09cc1103 --- /dev/null +++ b/files/de/archive/b2g_os/anwendungsentwicklung/index.html @@ -0,0 +1,12 @@ +--- +title: Firefox OS Anwendungsentwicklung +slug: Archive/B2G_OS/Anwendungsentwicklung +translation_of: Archive/B2G_OS/Firefox_OS_apps/Building_apps_for_Firefox_OS +--- +

Firefox OS apps sind nichts anderes als Open Web apps, die auf einem Smartphone mit Firefox OS installiert werden.

+ +
+ Note: Firefox OS currently identifies using the same UA string as Firefox for Android, except without the "Android;" clause. For example: "Mozilla/5.0 (Mobile; rv:15.0) Gecko/15.0 Firefox/15.0a1".
diff --git a/files/de/archive/b2g_os/api/index.html b/files/de/archive/b2g_os/api/index.html new file mode 100644 index 0000000000..706080ff54 --- /dev/null +++ b/files/de/archive/b2g_os/api/index.html @@ -0,0 +1,156 @@ +--- +title: B2G OS APIs +slug: Archive/B2G_OS/API +tags: + - API + - B2G API + - NeedsTranslation + - TopicStub + - b2g os api's +translation_of: Archive/B2G_OS/API +--- +

List of B2G OS APIs 

+ +

+A +B +C +D + + +F + + +H + + + + + + + + +M +N + + +P + + + + +S +T +U + + +W + + + + + + + +

diff --git a/files/de/archive/b2g_os/api/navigator/index.html b/files/de/archive/b2g_os/api/navigator/index.html new file mode 100644 index 0000000000..553b9dd513 --- /dev/null +++ b/files/de/archive/b2g_os/api/navigator/index.html @@ -0,0 +1,19 @@ +--- +title: Navigator (Firefox OS extensions) +slug: Archive/B2G_OS/API/Navigator +tags: + - API + - Firefox OS + - Interface + - Navigator + - Non-standard + - Reference +translation_of: Archive/B2G_OS/API/Navigator +--- +

{{APIRef("Firefox OS")}}{{Draft}}{{Non-standard_Header}}

+ +

The Navigator interface represents the state and the identity of the user agent. It allows scripts to query it and to register themselves to carry on some activities. This page represents the list of properties and methods added to Navigator on Firefox OS devices. For the list of properties and methods available to any Web sites, consult Navigator.

+ +

A Navigator object can be retrieved using the read-only Window.navigator property.

+ +

{{SubpagesWithSummaries}}

diff --git a/files/de/archive/b2g_os/api/navigator/requestwakelock/index.html b/files/de/archive/b2g_os/api/navigator/requestwakelock/index.html new file mode 100644 index 0000000000..49d5275686 --- /dev/null +++ b/files/de/archive/b2g_os/api/navigator/requestwakelock/index.html @@ -0,0 +1,37 @@ +--- +title: Navigator.requestWakeLock() +slug: Archive/B2G_OS/API/Navigator/requestWakeLock +translation_of: Archive/B2G_OS/API/Navigator/requestWakeLock +--- +

{{APIRef("Wake Lock API")}}{{ non-standard_header() }}

+ +

This Navigator.requestWakeLock() method of the Wake Lock API is used to request a {{ domxref("MozWakeLock") }} on any resource of the device. This means that you can prevent that resource from becoming unavailable as long as your app holds a lock for that resource. For example, a voice recording app can obtain a lock to keep the screen on during recording so that it can give prover visual feedback to the user that recording is progressing.

+ +
+

Note: When the window that requested one or more wake locks is closed or destroyed, any wake locks it acquired are implicitly released; no manual release is necessary.

+
+ +

Syntax

+ +
lock = window.navigator.requestWakeLock(resourceName);
+ +

Parameters

+ +
+
resourceName
+
A string representing the name of the resource to lock. Gaia uses four basic resources names: screen, cpu,  wifi, and gps, but any certified application can expose new resources.
+
+ +

Return value

+ +

Returns a {{domxref("MozWakeLock")}} object you can use to keep track of or release the lock..

+ +

Specification

+ +

W3C tracks Wake Lock: Use cases and is working on the Editor's traft API.

+ +

See also

+ + diff --git "a/files/de/archive/b2g_os/apps/eine_app_f\303\274r_firefox_os_schreiben/index.html" "b/files/de/archive/b2g_os/apps/eine_app_f\303\274r_firefox_os_schreiben/index.html" new file mode 100644 index 0000000000..915a3be22d --- /dev/null +++ "b/files/de/archive/b2g_os/apps/eine_app_f\303\274r_firefox_os_schreiben/index.html" @@ -0,0 +1,48 @@ +--- +title: Eine App für Firefox OS schreiben +slug: Archive/B2G_OS/Apps/eine_app_für_firefox_os_schreiben +tags: + - Apps + - Firefox OS + - Handy +translation_of: Web/Apps/Fundamentals/Quickstart +--- +

Firefox OS Apps sind Web-Apps, die in HTML, CSS und JavaScript geschrieben sind. Die App wird im Internet publiziert, wie Sie es mit jeder anderen Website auch tun. Um die Website als installierbare Web-App auf dem Gerät zu erstellen, müssen Sie die App mit einem manifest und einem hock up, einem Installations-Button, wie nachfolgend erläutert, versehen.

+

Die folgenden Themen können als Ausgangspunkt genutzt werden:

+ +

Natürlich können Sie auch tiefer in die Technologie von Web-Apps eintauchen.

+

Die Web-App installieren

+

Mit der App und dem manifest im Internet, müssen Sie es Gecko bekannt machen. Während der Installationsphase schaut Gecko nach dem manifest und fügt die wichtigsten Einträge dem HomeScreen u.a. hinzu.

+

Um die App zu installieren, müssen sie die navigator.mozApps.install API aufrufen. Hier finden Sie ein Beispiel für einen Installations-Button, den Sie in ihre App einbinden können, wenn Sie sie selbst hosten.

+
<button id="install">
+  Installieren Sie diese App auf Ihrem HomeScreen!
+</button>
+
+<script>
+(function(){
+  function install(ev) {
+    ev.preventDefault();
+    // Definierung der Manifest URL
+    var manifest_url = "http://my.webapp.com/manifest.webapp";
+    // App installieren
+    var myapp = navigator.mozApps.install(manifest_url);
+    myapp.onsuccess = function(data) {
+      // App ist installiert, Entfernen-Button
+      this.parentNode.removeChild(this);
+    };
+    myapp.onerror = function() {
+      // App war noch nicht installiert, Info ist in this.error.name definiert
+      console.log('Es ist ein Fehler bei der Installation aufgetreten., error: ' + this.error.name);
+     };
+  };
+  // Ein Verweis auf den Button und Aufruf von install() beim betätigen.
+  var button = document.getElementById('install');
+  button.addEventListener('click', install, false);
+})();
+</script>
+
+

Tipp: DenInstallations-Button können Sie auch in App-Stores, wie zum Beispiel dem Firefox Marketplace, einbinden, aber es ist oft sehr praktisch den Installations-Button auf der Startseite des Projekts zu haben.

+

Nun besuchen Sie Ihre Website mit der Firefox OS Browser App und benutzen Sie den Installations-Button.

diff --git a/files/de/archive/b2g_os/apps/index.html b/files/de/archive/b2g_os/apps/index.html new file mode 100644 index 0000000000..6846cbffe7 --- /dev/null +++ b/files/de/archive/b2g_os/apps/index.html @@ -0,0 +1,50 @@ +--- +title: Apps entwickeln für Firefox OS +slug: Archive/B2G_OS/Apps +translation_of: Web/Apps/Fundamentals +--- +

Applikationen für Firefox OS Geräte sind einfach offene Web Apps die komplett auf offenen Web Technologien basieren, wie etwa Javascript, HTML oder CSS. Unsere hauptsächliche Dokumentation erklärt Dir alles grundlegende was Du wissen musst und es gibt speziellere Artikel über das Entwickeln und das Testen von Apps für Firefox OS.

+
+
+

DoKumentation und Anleitungen

+
+
+ Eine App für Firefox OS schreiben
+
+ Anleitung wie Du deine eigene erste Web Applikation für Firefox OS entwickelst.
+
+ Benutzererlebnis
+
+ Leitfaden der Dir helfen soll deine Apps mit einem aufgeräumten und attraktiven Erlebnis für den Benutzer auszustatten inklusive Codebeispielen und Templates.
+
+ Tipps und Techniken
+
+ Ein Sortiment mit Tipps und Tricks (wie auch möglichen Problemlösungen) die unsere Entwickler für Dich ausgewählt haben!
+
+

Alle anzeigen...

+
+
+

Hol dir Hilfe von der Community

+

Du brauchst Hilfe bei einem Problem mit deiner App und kannst keine Lösung in der Dokumentation finden?

+
    +
  • Konsultiere das Web Apps Forum: {{DiscussionList("dev-webapps", "mozilla.dev.webapps")}}
    • +
  • Konsultiere das Layout Forum, welches sich mit HTML und CSS beschätigt: {{ DiscussionList("dev-tech-css", "mozilla.dev.tech.layout") }} + +
    • +
+

Vergiss die Netiquette nicht...

+

Werkzeuge

+ +

Alle anzeigen...

+ + +
+
+

 

diff --git a/files/de/archive/b2g_os/arbeiten_mit_dem_b2g_desktop_client/index.html b/files/de/archive/b2g_os/arbeiten_mit_dem_b2g_desktop_client/index.html new file mode 100644 index 0000000000..14e53a827e --- /dev/null +++ b/files/de/archive/b2g_os/arbeiten_mit_dem_b2g_desktop_client/index.html @@ -0,0 +1,135 @@ +--- +title: Arbeiten mit dem B2G Desktop-Client +slug: Archive/B2G_OS/Arbeiten_mit_dem_B2G_Desktop_Client +translation_of: Archive/B2G_OS/Building_the_B2G_OS_simulator +--- +

Der Firefox OS desktop client, auch bekannt als B2G desktop client, bietet die Möglichkeit an Gaia and Web apps in einer Gecko-basierten Umgebung auf dem Desktop laufen zu lassen. Dabei wird die Geräte-Hardware jedoch nicht emuliert, sodass es zum Testen von Geräte-Api nicht taugt. Auch ist es kein Ersatz um auf einem Gerät zu testen. Dennoch, hat es einige aktivierte APIs, welche nicht im Firefox verfügbar sind, wie z.B. Kontakt- und Einstellungs-API. Es kann also durchaus nützlich sein, wenn man eine Anwendung entwickelt oder während man am Gaia-Inteface direkt arbeitet. Dieser Artikel behandelt das Downloaden bzw. zusammenbauen des Firefox OS Desktop Clients, jedoch auch wie man ihn benutzt.

+
+

Note: The easiest way to use the Firefox OS desktop client is to use the Firefox OS Simulator. It does not require you to build the desktop client yourself.

+
+

Download a nightly build

+
+

Note: Firefox OS version 1.0 is based on a branch of Gecko 18. There are also nightly builds based on mozilla-central here:
+ http://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/latest-mozilla-central/

+
+

Just like Firefox Nightlies, the Firefox OS desktop client is built every day from the latest source code. The latest build is available from the Mozilla FTP server. Be sure to pick the latest version and the right archive for your operating system. This lets you bypass having to build it yourself. In addition, you don't have to download Gaia on your own either.

+

Be sure to install the application in a writeable location; the application needs to be able to update included the Gaia profile.

+

You can now skip ahead to Running the desktop client, unless you actually want to build it for yourself.

+

Building the desktop client

+

The first thing we need to do is set up a standard Mozilla build environment. Once we have that, we can pull down the code we'll need and configure to build the Firefox OS desktop client.

+

Downloading the code for the first time

+

In a directory where we'd like the source code to go, let's clone the mozilla-central repository that contains all of Gecko:

+
 hg clone http://hg.mozilla.org/mozilla-central
+
+

Updating the code

+

When we do subsequent builds later, we'll want to make sure we have the latest code. Here's how to pull the latest changes:

+
cd mozilla-central
+hg pull -u
+
+

Create a mozconfig

+

Next, we need to create a mozconfig file in the mozilla-central directory to configure the build system to build the Boot to Gecko client instead of Firefox:

+
. "$topsrcdir/b2g/config/mozconfigs/common"
+
+mk_add_options MOZ_OBJDIR=../build
+mk_add_options MOZ_MAKE_FLAGS="-j9 -s"
+
+ac_add_options --enable-application=b2g
+ac_add_options --disable-libjpeg-turbo
+
+# This option is required if you want to be able to run Gaia's tests
+ac_add_options --enable-tests
+
+# turn on mozTelephony/mozSms interfaces
+# Only turn this line on if you actually have a dev phone
+# you want to forward to. If you get crashes at startup,
+# make sure this line is commented.
+#ac_add_options --enable-b2g-ril
+

Building

+

Now we're ready to build the desktop client with the following command issued from the mozilla-central directory:

+
make -f client.mk
+
+

The built client will be placed in the ../build/dist directory (based on the value you specify for MOZ_OBJDIR in the mozconfig file).

+

Downloading Gaia

+

By default the desktop client will show an empty screen because it doesn't know which Web app to load initially as the system app. The collection of system apps and default apps that come with Firefox OS is called Gaia.

+

To download Gaia for the first time, let's clone the source code repository on GitHub:

+
git clone https://github.com/mozilla-b2g/gaia
+cd gaia
+

To update an already existing clone of Gaia, we can pull in the latest changes from GitHub:

+
cd gaia
+git pull
+
+

Generating a profile

+

Next we need to set up Gaia's apps for the desktop client. This includes packaging the Gaia apps in the same way like they would be installed on the device, as well as setting up the permissions for the privileged system apps. We do this by generating a profile. The following command (run in the gaia directory) will take care of that:

+
DEBUG=1 make
+
+

This should create a profile-debug directory below the gaia directory. The new profile contains a customized extension and other configuration needed to make B2G run properly.

+

Running the desktop client

+

Once you've built the client and downloaded Gaia (or downloaded and installed the nightly desktop application), you're ready to fire up the Firefox OS desktop client.

+

Running on Linux

+

To run the desktop client on Linux using the embedded Gaia profile, just run the b2g executable. If you want to specify a different Gaia profile, you need to bypass the b2g wrapper program and run the b2g-bin binary. The binary is in the archive you downloaded earlier or in the ../build/dist/bin directory if you built the client yourself.

+
.../b2g-bin -profile gaia/profile-debug
+
+

You may experience annoying rendering problems. To avoid them, add the following line to your gaia/profile/user.js file:

+
user_pref("layers.acceleration.disabled", true);
+
+

Running on Mac

+

If you downloaded the nightly build, you can simply launch it from the Finder as usual. Any console output is visible by running the standard Console utility program included with your Mac.

+

If you want to specify a different Gaia profile, you need to bypass the b2g wrapper program and run the b2g-bin binary. The command line is slightly more complicated due to the location of the b2g-bin binary and the need for absolute paths when specifying the profile directory:

+
.../B2G.app/Contents/MacOS/b2g-bin -profile /full/path/to/gaia/profile-debug
+
+

Running on Windows

+

Running the nightly build on Windows is as simple as launching b2g.exe. If you want to customize the execution, you can do so by running the b2g-bin.exe executable instead; this bypasses the wrapper program that automatically uses the bundled Gaia.

+

Command line options

+

There are a number of command line options you can use to adjust the runtime experience while using the desktop client. You can get a list by using the -help option. This section covers some of the particularly interesting ones.

+

Specifying the screen size

+

You can specify the screen size of the device you want to simulate using the --screen option:

+
b2g --screen=<width>x<height>[@<dpi>]
+

Where <width>, <height>, and <dpi> are fairly self-explanatory parameters: the width and height of the device's screen in pixels and the device resolution in DPI. For example:

+
b2g --screen=320x480
+b2g --screen=320x480@160
+
+

Optionally, you can specify certain devices by name to simulate their screen size and resolution:

+ +

Opening the JavaScript console

+

You can open the JavaScript console when launching the desktop B2G client by launching it from the command line with the -jsconsole flag. After building, just do:

+
.../b2g -jsconsole -profile /path/to/your/profile
+

If you've installed the nightly build on a Mac, you can do the following:

+
/Applications/B2G.app/Contents/MacOS/b2g-bin -jsconsole -profile /path/to/your/profile-debug
+
+

Note: On production builds of Firefox OS, console logging (such as by {{domxref("console.log()")}}) is disabled by default. In order to enable it, open the Settings app and navigate down through Device Information->More Information->Developer, then toggle on the "Console Enabled" preference.

+
+

Launching a specific application at startup

+

You can now specify an application to be launched automatically when b2g starts up in the desktop client. This is done as soon as the rest of the system is done loading up. To do this, just use the --runapp option, which takes as a parameter the name of the application to run. For example:

+
 .../b2g-bin -profile /path/to/your/gaia/profile-debug --runapp email
+

Before looking for an app to launch, the specified name is normalized by converting it to all lower case and removing all dashes and spaces. This normalized name is then compared to similarly normalized names from the manifests of available apps' manifests.

+

For example, the name of the email app is currently "E-mail", but --runapp email will work because of this normalization.

+

If you specify the --runapp option without an argument, or with an empty argument, the b2g client will output to your terminal a list of the known applications as well as a brief usage message.

+
+

Note: Using the --runapp option disables the lock screen as a side effect and does not re-enable it. It's assumed that you won't use this command on a profile on which you will be testing the lock screen, or you will turn it back on manually in Settings application. Feel free to contribute a patch to change this behavior if it's a problem.

+
+

Usage tips

+

This section provides a few helpful tips to using the B2G desktop client.

+ +

Next steps

+

Now that you have a desktop build of Boot to Gecko running, you can do testing, development, and other work in it:

+ diff --git a/files/de/archive/b2g_os/benutzung_des_app_managers/index.html b/files/de/archive/b2g_os/benutzung_des_app_managers/index.html new file mode 100644 index 0000000000..5a03b1fb3b --- /dev/null +++ b/files/de/archive/b2g_os/benutzung_des_app_managers/index.html @@ -0,0 +1,264 @@ +--- +title: Benutzung des App Managers +slug: Archive/B2G_OS/Benutzung_des_App_Managers +translation_of: Archive/B2G_OS/Using_the_App_Manager +--- +
+

Der App Manager ist ein neues Tool, das in Firefox für Desktop integriert wurde. Es stellt einige nützliche Werkzeuge zum Testen, Verteilen und Debuggen von HTML5-Webapps mit Firefox OS Smartphones und dem Firefox OS Simulator bereit, welche direkt im Browser benutzt werden können.

+ +

Der App Manager ist an Entwickler, die Firefox OS Version 1.2 oder später entwickeln, gerichtet. Wenn Sie Apps für Firefox OS 1.1 entwickeln, werfen Sie stattdessen einen Blick auf die Dokumentation für den Firefox OS Simulator 1.1.

+
+ +

{{EmbedYouTube("z1Bxg1UJVf0")}}

+ +

Der App Manager besteht aus folgenden Komponenten:

+ + + +

Schnelleinstieg:

+ +

Dieser Abschnitt soll einen möglichst schnellen Einstieg ermöglichen. Falls genauere Erklärungen benötigt werden, überspringen Sie bitte diesen Abschnitt und lesen Sie {{ anch("Device and system configuration") }}. Bei Problemen könnte außerdem der Abschnitt {{ anch("Troubleshooting") }} weiterhelfen.

+ +
    +
  1. Stellen Sie sicher, dass Firefox Desktop 26+ installiert ist.
    2. +
  2. Öffnen Sie den App Manager (tippen Sie about:app-manager in die URL-Leiste).
    3. +
  3. Falls kein echtes Gerät mit Firefox OS zur Verfügung steht: +
      +
    1. Installieren Sie den Firefox OS Simulator
      2. +
    2. Klicken Sie auf Start Simulator in der unteren Werkzeugleiste des App Managers und anschließend auf den Namen des installierten Simulators.
      3. +
    +
    4. +
  4. Falls Sie ein echtes Gerät besitzen: +
      +
    1. Stellen Sie sicher, dass auf dem Gerät Firefox OS 1.2+ läuft.
      2. +
    2. Wenn Sie unter Windows arbeiten, stellen Sie sicher, dass Sie die bereitgestellten Treiber Ihres Handys installiert haben.
      3. +
    3. Deaktivieren Sie die Bildschirmsperre in den Einstellungen des Geräts (Settings > Screen Lock) und aktivieren Sie Remote Debugging (Settings > Device information > More information > Developer).
      4. +
    4. Installieren Sie das ADB Helper Add-on in Firefox Desktop.
      5. +
    5. Verbinden Sie ihr Gerät über ein USB-Kabel mit dem Computer.
      6. +
    6. Der Name des Geräts sollte nun in der unteren Leiste des App Managers erscheinen. Klicken Sie den Namen an.
      7. +
    +
    5. +
  5. Die untere Leiste sollte anzeigen "Connected to: xxx".
    6. +
  6. Klicken Sie auf das Apps-Panel und fügen Sie eine App hinzu (paketiert oder gehostet).
    7. +
  7. Der Refresh-Button validiert Ihre App und installiert sie auf dem Simulator/Gerät.
    8. +
  8. Der Debug-Button verbindet die Entwickler-Tools mit der laufenden App.
    9. +
+ +

Geräte- und System-Konfiguration

+ +

Bei der Benutzung des App Manager sollte man zuerst sicherstellen, dass System und Gerät korrekt konfiguriert sind. Dieser Abschnitt beschreibt alle dafür nötigen Schritte.

+ +

Firefox 1.2+ wird benötigt

+ +

Stellen Sie sicher, dass auf Ihrem Gerät Firefox OS 1.2/Boot2Gecko 1.2 oder höher läuft. Die Versionsnummer von Firefox OS wird unter Settings > Device Information > Software angezeigt.

+ +

Falls die installierte Version nicht hoch genug ist, muss je nachdem welches Gerät Sie verwenden, eine der verfügbaren Nightly-Builds von Firefox 1.2+ installiert oder eine Version selbst kompiliert werden.

+ +

Verfügbare Builds:

+ + + +
+

Hinweis: Für die Erstellung eines eigenen Builds von Firefox OS 1.2+, folgen Sie den Anweisungen unter Building and installing Firefox OS und starten Sie mit Firefox OS build prerequisites.

+
+ +

Remote-Debugging

+ +

Als nächstes muss Remote Debugging in Firefox OS aktiviert werden. Navigieren Sie zu Settings > Device information > More information > Developer und aktivieren Sie die Checkbox bei Remote Debugging.

+ +

ADB oder ADB Helper

+ +

Über die Android Debug Bridge (ADB) wird die Verbindung und Kommunikation zwischen Gerät und Computer geregelt. Es gibt zwei Möglichkeiten ADB einzusetzen:

+ + + +
+

Achtung: Es ist nicht nötig diesen Befehl auszuführen, wenn Sie das ADB Helper Add-on installiert haben.

+
+ +

Verbinden des Geräts mit dem App Manager

+ +

Nachdem alles konfiguriert wurde, ist es nun an der Zeit, das Gerät mit dem Computer zu verbinden und den App Manager zu starten:

+ +
    +
  1. Verbinden Sie das Gerät via USB mit dem Computer.
    2. +
  2. Deaktivieren Sie Screen lock auf dem Gerät, indem Sie zu Settings > Screen Lock navigieren und die Checkbox bei Lock Screen deaktivieren. Dieses Vorgehen ist sehr ratsam, da die Verbindung abbricht, sobald sich die Bildschirmsperre aktiviert.
    3. +
  3. Starten Sie den App Manager — klicken Sie in der Menüleiste von Firefox Desktop Extras > Web-Entwickler > App Manager an oder tippen Sie about:app-manager in die URL-Leiste.
    4. +
  4. An der Unterseite des App Manager Tabs sehen Sie nun eine Anzeige für den Verbindungsstatus (siehe Screenshot unten). Es sollte nun möglich sein das Gerät durch einen Klick auf den "Connect to localhost:6000" Button zu verbinden.
    5. +
  5. Falls die Verbindung erfolgreich hergestellt wurde, erscheint eine Frage auf dem Gerät: "An incoming request to permit remote debugging connection was detected. Allow connection?". Bestätigen Sie mit dem OK-Button (evtl. müssen Sie den Power-Button am Gerät betätigen, damit Sie die Frage sehen können). Der Verbindungsstatus in der Leiste sollte dann "Connected to B2G" und einen Disconnect-Button zum Abbruch der Verbindung anzeigen.
    6. +
+ +

+ +
+

Die anderen Bedienelemente in der Verbindungstatus-Leiste ermöglichen die Verbindung eines Simulators mit dem App Manager. Dies wird im nächsten Abschnitt behandelt, wobei der Port für die Verbindung geändert wird. Wenn der Port gewechselt wird, muss auch Portweiterleitung für diesen Port aktiviert werden, wie unter {{anch("Enable port forwarding")}} beschrieben.

+
+ +

Firefox OS Simulator Add-on

+ +

Steht kein echtes Gerät zur Verfügung, das mit dem App Manager benutzt werden kann, kann es dennoch zusammen einem Firefox OS Simulator Add-on ausprobiert werden. Installieren Sie hierzu einen Simulator, passend für Ihr Betriebssystem (mehrere Versionen verfügbar, es ist ratsam alle zu installieren, für maximale Flexibilität):

+ +

Simulator installieren

+ + +

Nach der Installation des Simulators/der Simulatoren gehen Sie auf about:app-manager und klicken Sie in der Verbindungsstatus-Leiste unten den "Start Simulator"-Button. Daraufhin erscheinen drei weitere Buttons:

+ + + +

Apps-Panel

+ +

Da nun alles soweit funktionert, wird nun die Funktionalität des App Managers beschrieben, beginnend mit dem Apps Panel. Von hier aus können Sie eine bereits existierende App importieren, auf Ihr Gerät übertragen und debuggen:

+ + + +

Ist dieser Schritt gelungen, sollten auf der rechten Seite des Fensters Informationen über die App angezeigt werden:

+ +

+ +

Manifest Editor

+ +

Mit Firefox 28 und später findet sich im Apps Panel ein Editor für das App-Manifest:

+ +

+ +

Debugging

+ +

Ein Klick auf "Update" überträgt (installiert) die App auf das Gerät. Mit einem Klick auf "Debug"  wird eine Toolbox mit der App verbunden, womit die App getestet werden kann:

+ +

+ +
+

Anmerkung: Es wird Ihnen gefallen mit der Toolbox herumzuspielen - ändern Sie den DOM, CSS etc. und Sie werden sehen, dass die Änderung in Echtzeit auf dem Gerät ablaufen. Die Änderungen werden im Code der installierten App gespeichert und beim nächsten Öffnen der App auf dem Gerät wieder angezeigt.

+
+ +

Before Firefox 28, the tools are launched in a separate window. From Firefox 28 onwards, the tools are launched in a separate tab in the App Manager itself, alongside the Apps and Device tabs. The tab is given your app's icon so it's easy to find:

+ +

+ +

Fehler

+ +

Falls eine App nicht erfolgreich hinzugefügt werden konnte - zum Beispiel weil die angegebene URL nicht korrekt ist oder ein gepackter App-Ordner ausgewählt wurde - wird dennoch ein Eintrag für die App hinzugefügt, dieser enthält jedoch Fehlermeldungen.

+ +

+ +

Bei dieser Ansicht ist es auch möglich, eine installierte App zu deinstallieren. Halten Sie hierfür den Mauszeiger über den Namen oder die Beschreibung der jeweiligen App auf der linken Seite und klicken Sie den X-Button an. Die App wird dadurch jedoch nicht vom Gerät entfernt. Um dies zu tun, muss das Gerät selbst benutzt werden.

+ +

Device-Panel

+ +

Im Tab unter Device werden Informationen zum verbundenen Gerät angezeigt. Von dem Fenster "Installed Apps" aus können die Apps auf dem Gerät gestartet und gedebuggt werden.

+ +

+ +
+

Anmerkung: Zertifizierte Apps werden standardmäßig nicht aufgelistet. Weitere Informationen zum Debuggen von zertifizierten Apps.

+
+ +

Das Fenster "Permissions" zeigt die benötigten Rechte für verschiedene Web-APIs des Geräts:

+ +

+ +

Abschließend können Sie einen Screenshot mit dem Bildschirminhalt des Geräts erstellen, indem Sie den Screenshot-Button anklicken. Der Screenshot wird dann in einem neuen Tab in Firefox geöffnet und kann von dort aus gespeichert oder verworfen werden.

+ +

Debuggen von zertifizierten Apps

+ +

Bis dato können nur Geräte, welche mit einem Development-Build von Firefox OS 1.2 laufen, für das Debuggen von zertifizierten Apps benutzt werden. Falls auf ihrem Gerät ein Development-Build installiert ist, können Sie das Debuggen von zertifzierten Apps erlauben, indem Sie die Einstellung devtools.debugger.forbid-certified-apps in ihrem Firefox-Profil auf false setzen. Gehen sie hierfür wie folgt vor:

+ +
    +
  1. +

    Geben Sie auf ihrem Computer den folgenden Befehl in ein Terminal/Konsole ein, um über die Shell auf das Dateisystem des Geräts zuzugreifen:

    + + 
    adb shell
    + +

    Daraufhin sollte sich der Prompt zu root@android ändern.

    +
    2. +
  2. +

    Als nächstes stoppen sie B2G mit dem Befehl:

    + + 
    stop b2g
    +
    3. +
  3. +

    Wechseln Sie mit folgenden Befehl zum Profilordner:

    + + 
    cd /data/b2g/mozilla/*.default/
    +
    4. +
  4. +

    Und fügen Sie mit folgendem Befehl eine Zeile für die Einstellung in die Datei prefs.js ein:

    + + 
    echo 'user_pref("devtools.debugger.forbid-certified-apps", false);' >> prefs.js
    +
    5. +
  5. +

    Nachdem die Datei bearbeitet und gespeichert wurde, starten Sie B2G erneut:

    + + 
    start b2g
    +
    6. +
  6. +

    Verlassen Sie das Android-Dateisystem mit der Eingabe des Befehls exit. Damit kehren Sie zum normalen Terminal-Prompt zurück.

    +
    7. +
  7. +

    Stellen Sie nun eine Verbindung mit dem App Manger her. Die zertifizierten Apps sollten nun angezeigt werden.

    +
    8. +
+ +
+

Anmerkung: Falls Sie diese Einstellung ihrem Gaia build hinzufügen möchten, sodass sie aktiv ist auch wenn ihr Telefon zurückgesetzt wird, fügen Sie die Einstellung in der Datei build/custom-prefs.js hinzu und führen Sie make reset-gaia aus.

+
+ +

Running custom builds in the App Manager

+ +

You can run custom B2G Desktop and Gaia builds in the App Manager via the simulator. Read Running custom Firefox OS/Gaia builds in the App Manager for more details.

+ +

Fehlerbehandlung

+ +

Falls das Gerät nicht gefunden wird:

+ + + +

Die Verbindung des Geräts mit dem App Manager funktioniert nicht oder der Simulator kann nicht gestartet werden? Lassen Sie es uns wissen oder schreiben Sie einen Bugreport.

diff --git a/files/de/archive/b2g_os/building/index.html b/files/de/archive/b2g_os/building/index.html new file mode 100644 index 0000000000..3b0c91142b --- /dev/null +++ b/files/de/archive/b2g_os/building/index.html @@ -0,0 +1,268 @@ +--- +title: Building Firefox OS +slug: Archive/B2G_OS/Building +translation_of: Archive/B2G_OS/Building +--- +
+
+
+

Once you've set up your build system and performed your initial pull and configure of the code, you can build Boot to Gecko. This guide explains how.

+
+

Updating your code

+

If this isn't your very first time building B2G, you might want to pull the latest code before you start to build. To do that, you should update both the B2G tools and the dependencies, using the following two commands:

+
git pull
+./repo sync -d
+
+

The -d option switches the various projects HEAD back to their Android manifest revision (i.e the default mainstream repository version). It is helpful if you made modifications to the repos (and have associated source changes) but you want to revert back to the master version temporarily. It will indeed leave your staged or working directory changes untouched (see the following SO question for the full explanation). If you did not touch the source code, you can use the normal command:

+
git pull
+./repo sync
+

You can update a specific make target's repository by specifying its name:

+
./repo sync gaia
+
+

The repo command has other options available that might be interesting; repo help will give you a lot of information.

+

Building

+
+

Note: Before building, you may want to set up a .userconfig file to customize the build. See Customization with the .userconfig file for details.

+
+

To build Boot to Gecko, simply use the build.sh tool:

+
cd B2G
+./build.sh
+
+

Time for another coffee break, or possibly a nap (especially if this is your first build, it takes about 30 min on a Core i7 with 8GB of RAM). As in the configure step on the previous page, if you are using a directory of previously-extracted Android system files, you should set ANDROIDFS_DIR before running build.sh.

+
+

Note: For more instructions on flashing your new build to a phone, read Installing Firefox OS on a mobile device.

+
+

Building specific modules

+

If you want to build just a particular module, such as Gecko, you can specify it by name:

+
./build.sh gecko
+
+

In order to refresh only one application, you can build only gaia module by using the BUILD_APP_NAME environment variable:

+
BUILD_APP_NAME=calendar ./build.sh gaia
+

To get a list of the modules you can build, you can do:

+
./build.sh modules
+
+

Setting the number of processor cores to use

+

By default, the B2G build scripts use the number of cores your system has plus two as the number of parallel tasks to run. You can change this by specifying the -j parameter when running build.sh. This can be handy if you're using your system for other things while building in the background and need to reduce CPU load a bit. It's also handy when you're having build problems, as it can make reading error output from the build process easier if you have just one task going at a time!

+

For example, to build using just two parallel tasks:

+
./build.sh -j2
+
+

The most common use case for this, however, is to prevent builds from running in parallel at all. This makes the output of the process much easier to read, making it easier to sort out build problems. To do this:

+
./build.sh -j1
+
+

Building multilocale

+

To create a multilocale build, do the following:

+

Gaia

+
    +
  1. Determine which Gaia languages file to use. We're currently using locales/languages_dev.json and locales/languages_all.json as our Gaia languages files.
    2. +
  2. Clone the appropriate locales from http://hg.mozilla.org/gaia-l10n into a directory; we use gaia-l10n/. You could use the locales/ directory . You'll need to clone a repo for each locale listed in the languages file.
    3. +
  3. In your environment, set LOCALE_BASEDIR to the absolute path of the directory in step 2. Set LOCALES_FILE to the absolute path of the file in step 1.
    4. +
  4. Also, you can set a GAIA_DEFAULT_LOCALE if you want to set a default locale.
    5. +
+
cd gaia/locales/
+hg clone https://hg.mozilla.org/releases/gaia-l10n/v1_2/es
+
+ Set your environment variables:
+
+  
+
export LOCALE_BASEDIR=$PWD/locales
+export LOCALES_FILE=$PWD/locales/languages_dev.json
+export GAIA_DEFAULT_LOCALE=es
+
+

And the languages-dev.json could be replaced by your own languages-own.json path, which could formed like this. You would need to add an entry per each repo cloned in your locales directory.:

+
{
+  "en-US"     : "English (US)",
+  "es"        : "Español"
+}
+
+
+

Since bug 884752 landed (November 2013), to add keyboard layouts (if available in Gaia), you can use parameter GAIA_KEYBOARD_LAYOUTS. 

+

Bug: https://bugzilla.mozilla.org/show_bug.cgi?id=884752

+

Layouts: https://github.com/mozilla-b2g/gaia/tree/v1.2/keyboard/layouts

+

For example, to add Spanish and Italian keyboard layout, run the previous command adding

+ 
  GAIA_KEYBOARD_LAYOUTS=en,es,it
+

At this point you're ready to flash Gaia to the phone for the first time. Connect the phone and make sure Remote Debugging is checked in Settings > Device Information > More Information > Developer.  You only need to do this once, for your own build of Gaia will have that pref turned on thanks to REMOTE_DEBUGGER=1:

+ 
 make clean && make production LOCALES_FILE=locales/languages-own.json
+
+

If you want to clone and/or update all supported locales for a particular branch, you can use this script

+
+

Gecko

+
    +
  1. Determine which Gecko languages file to use. We're currently using b2g/locales/all-locales as our Gecko languages file.
    2. +
  2. Clone the appropriate locales into a directory; this can be gecko-l10n/ . + +
    3. +
  3. Clone compare-locales.
    4. +
  4. +

    In your environment, set L10NBASEDIR to the absolute path of the directory in step 2. Set MOZ_CHROME_MULTILOCALE to a string of space-delimited locales from step 1.

    +

    Add the compare-locales/scripts dir to your PATH, and compare-locales/lib to your PYTHONPATH.

    + For instance, + 
    export L10NBASEDIR=$PWD/gecko-l10n
+export MOZ_CHROME_MULTILOCALE="ja zh-TW"
+export PATH="$PATH:$PWD/compare-locales/scripts"
+export PYTHONPATH="$PWD/compare-locales/lib"
+
    +

    Once you have the above set up, you can run build.sh.

    +

    You can use .userconfig as well:

    + 
    ## Gaia
+export GAIA_DEFAULT_LOCALE=es
+export LOCALE_BASEDIR=/b2g/gaia-l10n-transifex-v1.2/
+export LOCALES_FILE=/b2g/languages_propio.json
+
+## Gecko
+export L10NBASEDIR='/b2g/gecko-l10n-v1.2'
+export MOZ_CHROME_MULTILOCALE="es-ES eu ca gl pt-BR"
+export PATH="$PATH:/b2g/compare-locales/scripts"
+export PYTHONPATH="/b2g/compare-locales/lib"
+
    +
    5. +
+
+

There are some mappings between Gaia languages and Gecko ones. For example, in Gaia, Spanish is "es", but on Gecko is tranlated to "Spanish of Spain" (es-ES)

+
+

These instructions may change as we smooth things out.

+

Known errors

+

"Build failed!"

+

If you get a general "Build failed" message, you should always try reconnecting your phone to your computer; sometimes the phone can become unmounted for a variety of reasons.

+
+

Note that configuring and building B2G for Keon DOESN'T WORK on Mac. You'll need to use Linux to build for this device.

+
+

Mountain Lion-specific build errors

+
+

1. If you are building on OS X 10.8 "Mountain Lion" (Xcode 4.4.1 or later) and encounter the following error:

+ 
external/qemu/android/skin/trackball.c:130:25: error: 'M_PI' undeclared (first use in this function)
+ Edit the file: B2G/external/qemu/Makefile.android and add in line 78:
+ 
MY_CFLAGS += -DM_PI=3.14159265358979323846264338327950288   #/* B2G_fix: not finding M_PI constant */
+
+
+
+ 2. If you are on Mountain Lion and you receive an error during ./build.sh like:
+
+ 
/System/Library/Frameworks/IOKit.framework/Headers/usb/USB.h:797:9: error: too many #pragma options align=reset
+

Replace all instances of '#pragma options align=reset' with '#pragma pack()' inside /System/Library/Frameworks/IOKit.framework/Headers/usb/USB.h

+
+

Undefined symbols "_sqlite3_androidopt_handle_pragma" and "_sqlite3_androidopt_open"

+

This error appears if you are building on OS X 10.7 or newer with Xcode 4.5 or newer. To fix this, apply the patch at https://groups.google.com/forum/#!msg/android-building/yAfPyUqCsiQ/7zvICk4GWjYJ to the external/sqlite/dist/Android.mk file.

+

KeyedVector.h:193:31: error: indexOfKey was not declared in this scope

+

This error appears when your gcc version is too recent. Install gcc/g++/g++-multilib 4.6.x versions. See Customizing with the .userconfig file for more information.

+
+

Community Note: It is possible to use gcc 4.7.x with slight modifications to the B2G code (gcc will guide you) but you won't get any help! Neither with modifying the code nor with bugs you encounter.

+
+

arm-linux-androideabi-g++: Internal error: Killed (program cc1plus)

+

If you see this message, it most likely means that free memory is lacking. Ensure there is enough free memory before running ./build.sh. It should run fine if your system has 4GB of RAM.

+

"...is referenced by DSO" error

+

While building the emulator, if you get /usr/bin/ld: out/host/linux-x86/obj/EXECUTABLES/triangleCM_intermediates/triangleCM: hidden symbol `_XGetRequest' in out/host/linux-x86/obj/STATIC_LIBRARIES/libSDL_intermediates/libSDL.a(SDL_x11dyn.o) is referenced by DSO.

+

You can get this with some versions in binutils. If you run Debian Stable, you can use the gold linker by installing the package binutils-gold. Note that the gold linker is already installed by binutils, but it's not used by default; binutils-gold does just that.

+

If you get build errors while the build system is running tests

+

Sometimes (especially after build tool or operating system updates) you'll get weird errors like this when the build system runs its post-build tests:

+ 
Generating permissions.sqlite...
+test -d profile || mkdir -p profile
+run-js-command  permissions
+WARNING: permission unknown:offline-app
+WARNING: permission unknown:indexedDB-unlimited
+build/permissions.js:122: NS_ERROR_UNEXPECTED: Component returned failure code: 0x8000ffff (NS_ERROR_UNEXPECTED) [nsIPermissionManager.add]
+make[1]: *** [permissions] Error 3
+make: *** [gaia/profile.tar.gz] Error 2
+

In this situation, try deleting the gaia/xulrunner-sdk directory and re-pulling the code:

+ 
rm -r gaia/xulrunner-sdk
+
+

This deletes the downloaded, precompiled copy of XULRunner that the build system retrieves automatically; on your next build, a new copy of XULRunner will be automatically retrieved.

+

Cannot fetch platform/libcore

+

If you tried to configure your B2G build for Nexus S (./config.sh nexus-s) and got an error related to libcore, it is because of a problem with the linaro git that feeds into this. To fix this, checkout the B2G manifest like so:

+ 
git clone https://github.com/mozilla-b2g/b2g-manifest.git
+

Edit the nexus-s.xml file in this repo, replacing the linaro git entry with a reference to the aosp entry, which should read like so:

+ 
<default revision="refs/tags/android-4.0.4_r1.2"
+              remote="aosp"
+              sync-j="4" />
+

Commit these changes (git commit -a) and then change the config.sh file in the master branch of the main B2G repo that you checked out to point to your modified local manifest instead of the Mozilla one:

+ 
GITREPO=${GITREPO:-"file:///home/path/to/my/b2g-manifest"}
+

clang errors when building with Xcode 5 on Mac

+

If you are building on Mac OS X 10.8 with Xcode 5, you will likely see errors like the following:

+ 
clang: error: argument unused during compilation: '-include system/core/include/arch/darwin-x86/AndroidConfig.h'
+clang: error: argument unused during compilation: '-U DEBUG'
+clang: error: argument unused during compilation: '-U DEBUG'
+clang: error: argument unused during compilation: '-MF out/host/darwin-x86/obj/EXECUTABLES/obbtool_intermediates/Main.d'
+make: *** [out/host/darwin-x86/obj/EXECUTABLES/obbtool_intermediates/Main.o] Error 1
+

This is because Xcode 5 changes the g++ compiler in /usr/bin, which breaks the build process if you try to use it to compile. In order to work around the problem, edit the following line in build/core/combo/HOST_darwin-x86.mk:

+ 
HOST_CXX := g++
+

to

+ 
HOST_CXX := g++-4.6
+ifeq (,$(wildcard /usr/local/bin/g++-4.6))
+ HOST_CXX := g++
+endif
+

Next, you'll want to uninstall gcc, using brew (this assumes you've run the Mac OS bootstrap script — if not, you'll need to complete that step before continuing):

+ 
brew uninstall gcc-4.6
+

Now reinstall gcc with multilib and c++ support:

+ 
brew install --enable-cxx https://gist.github.com/artlogic/6988658/raw/aeb9d1ea098274ad3f3fe2637b9df7f308a8a120/gcc-4.6.rb
+

Make sure /usr/local/bin is on your PATH. You can do this temporarily by typing the following into the command prompt:

+ 
export PATH=/usr/local/bin:$PATH
+

You can make the above change permanent by adding it to the .bash_profile file in your home directory.

+

After you've set your PATH, make sure you can run both of the following commands:

+ 
gcc-4.6 -v
+
+g++-4.6 -v
+

If either of these commands fail, you may need to relink your gcc using brew with the following command:

+ 
brew link --overwrite gcc-4.6
+

It's also possible that /usr/bin/c++ is not pointing at clang++ as it should be with Xcode 5 installed. You can determine if it is by typing the following:

+ 
ls -l /usr/bin/c++
+

It should return something that looks like this:

+ 
lrwxr-xr-x 1 root admin 7 Sep 19 11:40 /usr/bin/c++ -> clang++
+
+

If c++ is pointing at something other than clang++, update it with the following commands:

+ 
sudo rm /usr/bin/c++
+
+sudo ln -s /usr/bin/clang++ /usr/bin/c++
+

Cannot pull files from backup directory

+

This could happen when the USB connection is broken while the script pulls data from device to computer.

+

When you run the script again, you'll probably get the following (the example is for the Peak device):

+ 
Pulling files from ../../../backup-peak
+cat: ../../../backup-peak/system/build.prop: No such file or directory
+Found firmware with build ID
+Pulling "libaudioeq.so"
+cp: cannot stat `../../../backup-peak/system/lib/libaudioeq.so': No such file or directory
+Failed to pull libaudioeq.so. Giving up.
+
+> Build failed! <
+
+Build with |./build.sh -j1| for better messages
+If all else fails, use |rm -rf objdir-gecko| to clobber gecko and |rm -rf out| to clobber everything else.
+

To solve this, it is not necessary to remove the whole objdir-gecko or out directories. Just remove the backup directory, like this (for the example above):

+ 
$rm -rf backup-peak
+

Emulator build issues

+

If you are making an emulator build, you need to pay attention to these issues:

+
+

First, note that you shouldn't use the x86 emulator — it is hard to install and not well supported.

+
+

Next, the build-system for the emulator builds both 32bit and 64bit versions of the emulator. As the emulator depends on OpenGL, this means that you need to have both 32bit and 64bit versions of OpenGL libraries installed on your system. See the discussion in bug 897727.

+

There are two ways that you can solve this problem:

+ +

If your linux distro has multilib packages for OpenGL libraries, you can attempt installing them. You might then have to manually create some symlinks.

+

For example, here is the situation on Ubuntu 12.04 LTS x86-64. On this distribution, the libgl1-mesa-dev package cannot be installed simultaneously in x86-64 and i386 versions, but you can have the following combination of packages simultaneously installed:

+ 
sudo apt-get install libgl1-mesa-dev libglapi-mesa:i386 libgl1-mesa-glx:i386
+

After having run this command, you will still have to manually create some symlinks for the emulator build to succeed:

+ 
sudo ln -s /usr/lib/i386-linux-gnu/libX11.so.6 /usr/lib/i386-linux-gnu/libX11.so
+sudo ln -s /usr/lib/i386-linux-gnu/mesa/libGL.so.1 /usr/lib/i386-linux-gnu/libGL.so
+

Solution #2: just patch the emulator so it only builds 64bit

+

Just apply this patch to the sdk/ git repository under the B2G repo. This will cause the B2G emulator to only attempt to build the 64bit emulator if you're on a 64bit system, thus avoiding any multilib issues. The 32bit emulator is unused anyway on a 64bit system. This is the simplest solution, until this patch eventually bit-rots.

+

Next steps

+

After building, your next step depends on whether you built Boot to Gecko for the emulator or for a real mobile device; see the following articles for details:

+ +
+

Submitting bugs on B2G/Firefox OS/Gaia

+

Once you've got a B2G/Firefox OS build running, you'll probably want to start to file bugs against this specific version, so the Firefox OS community can improve things as effectively as possible. You'll want to file the bug on Bugzilla, under the "Firefox OS" project, but you should include version specifics:

+
    +
  1. To start with, tell us the major version number, e.g. 1.4.0.0-prerelease. This can be found on the device under Settings > Device Information.
    2. +
  2. You can provide more specific version identifiers by  returning the current hashes from the gaia and gecko repositories. This can be done like so: + 
    #!/bin/bash
+(cd gaia;  echo "gaia  $(git rev-parse HEAD)")
+(cd gecko; echo "gecko $(git rev-parse HEAD)")
    +
    3. +
diff --git a/files/de/archive/b2g_os/building_and_installing_firefox_os/compatible_devices/index.html b/files/de/archive/b2g_os/building_and_installing_firefox_os/compatible_devices/index.html new file mode 100644 index 0000000000..ea95805479 --- /dev/null +++ b/files/de/archive/b2g_os/building_and_installing_firefox_os/compatible_devices/index.html @@ -0,0 +1,357 @@ +--- +title: Kompatible Geräte +slug: Archive/B2G_OS/Building_and_installing_Firefox_OS/Compatible_Devices +translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS/Compatible_Devices +--- +
+

Install B2G OS in you device easily with B2G installer - a Firefox Add-on.

+
+ +
+

Note: All devices have the recommended build target below its name (see nickname or codenames). For example to build for Nexus 6 do ./build.sh nexus-6-l. Device codenames where given directly by manufacturers. You can find it in build.prop file of a stock ROM.

+
+ +

Development Devices

+ +

These devices are official reference devices for developing B2G OS.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Image
Name
+ (Android version)		Z3 Compact (Kitkat)
+ Sony Shinano platform		Z3 (Kitkat)
+ Sony Shinano platform		Flame (Kitkat)
Nicknamearies-kkleo-kkflame-kk
Build and installation informationhttps://discourse.mozilla-community.org/t/building-b2g-os-for-aries-z3c/8082 https://discourse.mozilla-community.org/t/flame-builds/8548
Available in B2G InstallerYesNoYes
+ +

Community Supported Devices

+ +

Those devices are supported by community efforts. Feel free to help them !

+ +
+

Builds distribution frequency may vary depending of maintainers number and time available.

+
+ +

Working devices

+ +

These devices have builds available running B2G OS :

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Image
Name
+ (Android version)		ZTE Open CNexus 5WileyFox SwiftFairphone 2
Nicknameopenc-fr / openc-ebay                         
Build and installation informationhttps://discourse.mozilla-community.org/t/zte-open-c/8402/ +

https://discourse.mozilla-community.org/t/test-b2gos-on-nexus-5/9405/1

+ 		  +

https://discourse.mozilla-community.org/t/fairphone-2-build/8641/
+ https://discourse.mozilla-community.org/t/fairphone-2-support-for-b2g-installer-landed/8334

+
Available in B2G Installer +

No

+ +

(but a buildbot is available)

+ 		YesYesNot yet, but almost done. Blobfull build working.
+ +

Work in progress

+ +

Work is going on to support these devices :

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Image 
Name
+ (Android version)		E3
+ Sony Yukon platform		Z1 Compact (Lollipop)
+ Sony Rhine platform		Xiaomi Redmi 1S
Nicknameflamingo-lamami-larmani
Build and installation informationhttps://discourse.mozilla-community.org/t/b2g-os-flamingo-sony-xperia-e3-builds/8361https://discourse.mozilla-community.org/t/support-for-amami-xperia-z1c-building-debugging-providing-builds/8348https://discourse.mozilla-community.org/t/wip-xiaomi-redmi-1s-hongmi-1s/10273
Support statusBlocked, problem with flashing toolsEarly building testsEarly building tests
+ +

Devices with porting possibilities

+ +

This is a (non-exhaustive) list of devices with porting potential, thanks to available AOSP or Cyanogen Mod version, or because they supported Firefox OS until version 2.6.

+ +
+

Note: There aren't currently any ports for these phones, but it is possible to build B2G OS. See how to build section for more info. You are welcome to maintain these builds.

+
+ +

Nexus Devices

+ +

These devices are (almost) automatically supported by B2G OS because they are Google's reference devices for AOSP.

+ + + + + + + + + + + + + + + + +
Nexus 6Nexus 4
  
+ +

Sony Devices

+ +

These devices use Sony Mobile's Open Devices initiative, which aims to support all modern Xperia devices in AOSP.

+ +

These devices are built on a Lollipop AOSP base.

+ +
+

Right now most of the Sony devices are missing camera support. This depends on work in progress by Sony developers.
+ Also, we need contributors to maintain these ports.

+
+ +

Devices where support for B2G OS is ongoing are not listed here.

+ +

Sony Shinano Platform

+ + + + + + + + + + + + + + + + + + + + + + +
 
Z3 Z3 Tablet CompactZ2
leo-l scorpion-lsirius-l
+ +
+
+ +

Sony Rhine Platform

+ +
+

Rhine devices use a legacy NFC chip so this feature is currently missing. See bug 1226720 We need contributors to maintain these ports.

+
+ + + + + + + + + + + + + +
Z1
honami-l
+ +

Sony Yukon Platform

+ + + + + + + + + + + + + + + + + + + +
T2 UltraT3M2
tianchi-lseagull-leagle-l
+ +

CyanogenMod Supported Devices

+ +

Here be dragons! (To be completed)

+ +

Legacy Devices

+ +

Some old devices are no longer maintained by the community, but it is still possible for volunteers to keep them alive (Yay Open-Source!). Feel free to contact the team previously working on these devices to get some help.

+ +

No device here right now.

+ +

Obsolete Devices

+ +
+

Forget about these device's support if you have one.

+
+ +

Several old devices are no longer maintained for B2G OS , and we do not have a community to keep them alive. The current status of these devices is unknown, which probably means they cannot be built on B2G OS master branches.

+ + + + + + + + + + + + + + + + + + + + + + +
Geeksphone PeakGeeksphone KeonZTE OpenTCL Fire
peakkeoninarihamachi
+ + + + + + + + + + + + + + + + + + + + + + +
Samsung Galaxy S2Galaxy NexusNexus SNexus S 4G
galaxy-s2galaxy-nexusnexus-snexus-s-4g
+ + + + + + + + + + + + + + + + + + + + + + +
Foxconn InFocusVia VixenPandaboardRaspberry Pi
flatfishvixenpandaboardrpi
diff --git a/files/de/archive/b2g_os/building_and_installing_firefox_os/firefox_os_build_overview/index.html b/files/de/archive/b2g_os/building_and_installing_firefox_os/firefox_os_build_overview/index.html new file mode 100644 index 0000000000..56422c4cf6 --- /dev/null +++ b/files/de/archive/b2g_os/building_and_installing_firefox_os/firefox_os_build_overview/index.html @@ -0,0 +1,155 @@ +--- +title: 'Firefox OS Build Prozess: Übersicht' +slug: Archive/B2G_OS/Building_and_installing_Firefox_OS/Firefox_OS_build_overview +tags: + - Firefox OS + - build + - install +translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS/B2G_OS_build_process_summary +--- +
+

Firefox OS zu kompilieren und zu installieren erfordert eine erhebliche Menge Zeit, Netzwerkbandbreite und Rechenleistung. Leider können auch Dinge schiefgehen. Dieser Artikel beschreibt die Ziele und Schritte des Build-Prozesses, um Benutzern während der Firefox OS Installation zu helfen. Details der einzelnen Schritte werden in den verlinkten Seiten erläutert.

+
+ +
+

Anmerkung: Der Firefox OS Build Prozess ist voll von Bezügen zu 'B2G' oder 'Boot2Gecko'. 'Boot2Gecko' war der ursprüngliche Codename des Firefox OS Projekts.

+
+ +

Das Ziel: vier 'image'-Dateien

+ +

Der grundsätzliche Zweck des Build Prozesses ist es vier Dateien zu erzeugen, die auf das Firefox OS-Gerät kopiert werden können.

+ + + + + + + + + + + + + + + + + + + + +
boot.imgDer Linux-Kernel und ein Image des root-Dateisystems, wobei letzteres ein Set von grundlegenden UNIX-Tools zur Verfügung stellt.
system.imgDer Kern von Firefox OS inklusive einiger Teile von Gonk, der Portierung von Gecko, und dem ausführbaren Programm b2g.
userdata.imgDas Gecko-Profil des Benutzers und die Gaia Web-Anwendungen für das Gerät.
recovery.imgEin Linux-Kernel und ein Image des root-Dateisystems zusammen mit einem einfachen Werkzeug, um eine defekte Installation zu reparieren.
+ + +

Wenn diese 4 Images erzeugt wurden, können sie auf das Gerät übertragen werden.

+ +

Firefox OS setzt auf dem Android Open Source Project (AOSP) auf. Die AOSP-Werkzeuge adb und fastboot bieten Möglichkeiten auf ein Gerät zuzugreifen und es zu verändern. Insbesondere kann das Kommando adb reboot-bootloader ein angeschlossenes Gerät dazu bringen, neu zu starten und in einem frühen Bootloaderstadium zu pausieren, während das Kommando fastboot flash $partition $image dazu benutzt werden kann, ein Image auf das Gerät zu kopieren.

+ +

Das Boot-Image

+ +

Das Boot-Image (boot.img) ist eine Kombination aus dem Linux-Kernel und einer initialen root Partition, die die grundlegenden Werkzeuge und Initialisierungs-Skripte bereit stellt. Letzteres wird für eine effektive Nutzung durch das Gerät in den Gerätespeicher kopiert und wird deshalb als "ramdisk" (RAM-Disk) bezeichnet. Das Boot-Image wird in die boot Partition des Gerätes kopiert und die Inhalte der RAM-Disk erscheinen unter dem root-Verzeichnis, wenn zur Laufzeit auf das Geräte-Dateisystem zugegriffen wird; zum Beispiel beim Ausführen von adb shell.

+ +

Das Boot-Image richtet auch die Berechtigungen des root-Benutzers in der Datei default.prop im root-Verzeichnis ein.

+ +

Es ist auch möglich vorhandene Boot-Images zu verändern, indem man die Datei untersucht, sie in Kernel und RAM-Disk trennt, die Inhalte der RAM-Disk extrahiert, diese ändert, das RAM-Disk-Image neu zusammenstetzt und daraus eine funktionierende boot.img-Datei erzeugt. Ein Beispiel findet man auf der Alcatel One Touch Fire Hacking (Mini) Guide-Seite.

+ +

Boot-Images können vor der Installation getestet werden, indem man sie dem Gerät "unterschiebt" (sideload). Der Geräte-Start kann im Bootloader angehalten werden. Im Bootloader-Modus kann man dann mit fastboot von einem eigenen Boot-Image booten, indem man das Kommando fastboot boot /some/path/to/boot.img verwendet.

+ +

Das System-Image

+ +

Das System-image (system.img) stellt die Grundfunktionen von Firefox OS bereit:

+ + + +
+

Siehe Firefox OS platform guide für nähere Informationen zur System-Architektur.

+
+ +

Das System-Image wird in die system Partition des Geräts kopiert und ist im laufenden Betrieb im Verzeichnis /system/ zu sehen wenn das Dateisystem gemountet wurde.

+ +
+

Hinweis: Das System-Image stellt zudem vom Gerät genutze Binär-Programme zur Verfügung, insbesondere den RIL (Radio Interface Layer) für die Funk-Verbindungen.

+
+ +

Das User Data Image

+ +

Das User Data Image (userdata.img) enthält die Gaia Apps des Anwenders.

+ +

Das User Data Image wird in die userdata Partition des Gerätes kopiert. Der Inhalt ist im laufenden Betrieb im Verzeichnis /data/ zu sehen wenn das Dateisystem gemountet wurde. Das Verzeichnis /data/b2g/ enthält das Mozilla Gecko Profil des Anwenders, das Verzeichnis /data/local/webapps/ enthält die verfügbaren Apps.

+ +

Das Recovery Image

+ +

Das Recovery Image (recovery.img) enthält denselben Kernel und eine vergleichbare RAM-Disk wie die Boot Image Partition. Das Recovery Image verwendet allerdings ein anderes Initialisierungs-Skript, welches dem Anwender verschiedene Recovery-Funktionen zur Verfügung stellt die mit den Tasten des Gerätes bedient werden können.

+ +

Das Recovery Image wird in die recovery Partition des Gerätes kopiert, welche im Normalbetrieb nicht ins Dateisystem gemountet wird.

+ +

Der Build Prozess: setup, configure, build, install

+ +

Build Prozess und Installation von Firefox OS  bestehen aus 4 Schritten:

+ + + + + + + + + + + + + + + + + + + + +
SetupBereitstellen aller für den Build Prozess benötigten Programme wie z.B. Compiler und Bibliotheken.
ConfigureDownload des Quellcodes und Erzeugen einer configure Datei welche Umgebungsvariablen definiert in denen die benötigten Pfade und Parameter gespeichert werden.
BuildErzeugen des Gecko Anwender-Profils und der Gaia Anwendungen des Gerätes.
InstallInstallieren der Dateien auf dem Gerät.
+ + +

 

+ +

Setup

+ +

Die Setup-Phase ist notwendig um sicher zu stellen dass sämtliche für den Build Prozess benötigte Software zur Verfügung steht, z.B. Compiler und Build Tools.

+ +

Dieser Schritt kann manuell oder per Skript durchgeführt werden. Details hierzu findest Du auf Firefox OS build prerequisites.

+ +
+

Hinweis: Auf UNIX und UNIX-artigen Computern kann man mit dem Kommando which prüfen, ob ein für den Build Prozess benötigtes Programm vorhanden ist. Als Parameter erwartet which den Namen des benötigten Programms.

+
+ +

Configuration

+ +

Der eigentliche Build Prozess startet mit dem Erstellen einer Kopie der Firefox OS (bzw. B2G) Software, gewöhnlich wird ein Git Clone des B2G Projekts erstellt. Der Schritt Configuration kopiert den gesamten benötigten Quellcode und erzeugt eine config Datei, welche die benötigten Installations-Parameter enthält.

+ +

Ausgeführt wird dieser Schritt mit dem config.sh Skript. Details findest Du auf der Preparing for your first B2G build Seite.

+ +

Das Configure Skript benötigt einen Parameter mit dem der Gerätetyp spezifiziert wird. Diese sogenannten Code Names fliessen in den Build Namen ein und stehen für eine bestimmte CPU Architektur und nicht für ein spezielles Gerät. Momentan kann man also nicht anhand des Build Names bestimmen ob ein Build auf einem bestimmten Gerät lauffähig ist.  Eine Liste der verfügbaren Code Names findest Du hier.

+ +

Der Schritt Configure nutzt repo, ein Tool des Android Open Source Projekts, für den Download der für den Build benötigten Software. Die Software wird gespeichert im Verzeichnis repo/projects. Aufgrund der herunter zu ladenden Datenmenge und der durchzuführenden Schritte kann der Schritt Configure länger dauern.

+ +

Build

+ +

Im Schritt Build wird der Quellcode kompiliert und die Image-Dateien werden erzeugt.

+ +

Hierzu wurd das build.sh Skript ausgeführt. Details hierzu findest Du in Building Firefox OS.

+ +

Das Skript versucht alle Quellcodes in einem Schritt zu kompilieren: Die Android Open Source Project Tools, den Linux Kernel und die Gaia Web Anwendungen. Wenn dieser Schritt fehl schlägt ist nicht immer klar, an welcher Stelle der Build ein Problem hatte.

+ +

Es ist möglich, nur einzelne Komponenten des Gesamtpakets zu kompilieren. Z.B. kann Gecko einzeln kompiliert werden, indem das Build Skript mit dem gecko Parameter aufgerufen wird. Das gleiche gilt für Gaia, wo das Build Skript mit dem  gaia Parameter gestartet wird. Diese Pakete können einzeln installiert werden,wie im folgenden beschrieben Abschnitt wird.

+ +

Ebenso ist es möglich die oben beschriebenen Image-Dateien zu erzeugen. Z.B. kann man das System-Image mit ./build.sh out/platform/$target/system.img erzeugen, wobei der Parameter $target derselbe ist wie im Schritt Configuration.

+ +

Install

+ +

Im Schritt Install wird der neu kompilierte Code auf das Gerät kopiert. Hierzu wird das Skript flash.sh ausgeführt.

+ +

Es können auch gezielt einzelne Komponenten des neu erstellten Build-Pakets installiert werden, indem das Flash Skript mit den entsprechenden Parametern gestartet wird . Zum Beispiel können die Gaia Web Anwendungen durch ./flash.sh gaia installiert werden.

diff --git a/files/de/archive/b2g_os/building_and_installing_firefox_os/index.html b/files/de/archive/b2g_os/building_and_installing_firefox_os/index.html new file mode 100644 index 0000000000..51b1e0f6d4 --- /dev/null +++ b/files/de/archive/b2g_os/building_and_installing_firefox_os/index.html @@ -0,0 +1,45 @@ +--- +title: Erstellen und Installieren von Firefox OS +slug: Archive/B2G_OS/Building_and_installing_Firefox_OS +translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS +--- +

B2GOS befindet sich derzeit in aktiver Entwicklung und ist daher im Status einer Vorveröffentlichung. Um sicher die aktuellste Version zu benutzen empfiehlt es sich B2GOS selbst zu erstellen und zu installieren. Die Artikel auf dieser Seite führen dich durch die Prozesse um B2GOS für den Emulator, ein kompatibles Endgerät, oder das Gaia Benutzer Interface im Firefox Browser, zu erstellen.

+ + + + + + + + +
+

Beschaffen und Erstellen von B2GOS

+ +
+
Voraussetzungen zum Erstellen von B2GOS
+
Was du vor der Ersterstellung von B2GOS brauchst und tun musst.
+
Vorbereitungen zum Erstellen von B2GOS
+
Um B2GOS zu erstellen müssen zuerst die Quelldaten heruntergeladen werden. Was du dazu tun musst und wie es funktioniert wird in diesem Artikel erklärt. 
+
Erstellen von B2GOS
+
Erstellen von B2GOS für die Zielplattform.
+
+ +

View All...

+ 		+

Installieren von B2GOS und/oder Gaia

+ +
+
Möglichkeiten B2GOS zu testen
+
Hier wird erklärt welche verschiedenen Möglichkeiten es gibt B2GOS zu testen. Ob direkt im Browser mittels Gaia, auf dem Mobiltelefon oder im Emulator? Hier kannst du dir einen Überblick über die Möglichkeiten verschaffen.
+
Gaia im Browser
+
Wie man Gaia im Webbrowser testet.
+
B2GOS als Desktop Anwendung
+
Firefox OS kannst du in einer Desktop Anwendung die die Gaia Umgebung simuliert testen. Damit erzielst du bessere Ergebnisse als im Browser, es ist aber noch nicht so akkurat wie im Emulator.
+
B2GOS im Emulator
+
Eine Anleitung zur Benutzung von B2GOS im Emulator, und eine Einführung in die Auswahl des richtigen Emulators zur entsprechenden Aufgabe.
+
B2GOS auf deinem Gerät
+
Anleitung zur Installation von B2GOS auf Mobiltelefonen.
+
+
+ +

 

diff --git a/files/de/archive/b2g_os/debugging/developer_settings/index.html b/files/de/archive/b2g_os/debugging/developer_settings/index.html new file mode 100644 index 0000000000..1a614927b3 --- /dev/null +++ b/files/de/archive/b2g_os/debugging/developer_settings/index.html @@ -0,0 +1,197 @@ +--- +title: Developer settings for Firefox OS +slug: Archive/B2G_OS/Debugging/Developer_settings +translation_of: Archive/B2G_OS/Debugging/Developer_settings +--- +
+

Die Entwicklereistellungen befinden sich in den Firefox OS Einstellungen. Dieses Panel bietet eine Vielzahl an Optionen, die das Debugging deiner Open Web Anwendung für Firefox OS erleichtern. Dieser Artikel beschreibt die verfügbaren Optionen und erklärt wie diese benutzt werden können.

+
+

Der Einstellungsbereich für die Entwickler-Optionen wurde bewusst in einem Untermenüpunkt versteckt, um ein versehentliches Aktivieren durch unerfahrene Benutzer zu vermeiden, was eine Beeinträchtigung der Performance oder Auswirkungen auf die visuelle Darstellung von Firefox haben kann. Das Entwicklermenü sieht ähnlich aus wie auf der folgenden Darstellung gezeigt (dieses Bild wurde mit einem Geeksphone Keon mit einer im April 2014 erzeugten Version von Firefox OS 2.0 erstellt):

+

+

Das Entwicklermenü kann folgendermaßen erreicht werden:

+ +

Im folgenden Abschnitt werden alle Optionen einzeln vorgestellt und erklärt wie diese verwendet werden können.

+
+

Wichtig: Diese Tools sind hilfreich, aber können Probleme im normalen Gebrauch des Telefons versursachen. Einstellungen, die dafür bekannt sind, dass sie Probleme verursachen können, sind per default abgeschaltet. Falls du Probleme mit den Funktionen feststellen solltes, versuche die entsprechenden Funktionen wieder zu deaktivieren.

+
+

Einstellungen der Developer Tools

+

Debugging via USB

+

Die "Remote debugging" Option aktiviert das ferngesteuerte debugging deines Firefox OS Gerätes. Außerdem wird die ADB Kommando-Eingabe aktiviert. In Firefox < 1.4 gibt es dafür nur ein aktivierbares Kontrollkästchen; ab Firefox 1.4 sind es drei Optionen:

+ +

Developer HUD

+

Ab Firefox OS 1.4, öffnet ein Berühren des Menüeintrages Developer HUD folgendes Auswahlmenü:

+

+

Die beiden ersten Kontrollboxen (immer aktiv) sind:

+ +

Anschließend folgt ein Slider, mit dem weitere Entwickler-Optionen ('Developer Tools') aktiviert werden können , auch weitere Checkboxen sind verfügbar:

+ +

Frames per second

+

Enabling this option reports three numbers in the top left of the Firefox OS display; the values reported are an average of recent results within a sliding window, meant to be "instantaneous" but fairly accurate. As such, all numbers are "guesses":

+ +

A screenshot of Firefox OS, showing three numbers in the top left hand corner that are measurements of app framerate.

+

Time to load

+

Firefox OS also has a tool that can help measure startup time, specifically the "first paint" time. The value shown by the tool — in the top right of the Firefox OS display — is the elapsed time between when the most recent application was launched, and an estimate of the first time that application painted its UI, in milliseconds. This number only approximates the real "first paint" time, and in particular underestimates it. However, lowering this number almost always correlates to improvements in real startup time, so it can be useful to quickly measure optimization ideas.

+

A screenshot of Firefox OS, showing a number in the top right hand corner that is a measurement of the current app startup time, in milliseconds.

+

App memory

+

Displays information on how much memory the app is using, and allows you to enable or disable the different items that use memory to show much each one is using in the current app. For example, the screen shot below only has App memory and JS objects checked, and the indicator on the bottom right is showing that the Settings app is using 414.77KB for JS objects.

+

+

Pseudo-localization

+

When enabled, pseudo-languages like Accented English and Mirrored English are available for selection in Settings > Languages.  With pseudo-localizations, you can test the localizability of your code in regular Gaia builds without having to add real language resources nor having to speak a foreign language.  For instance, you can make sure the layout scales well with longer strings, you can preview the app in a fake RTL language, or spot HTML elements wihout the data-l10n-id attribute (they will be displayed in regular English).

+

Screenshot of pseudolocales

+

You can turn pseudo-localizations on by default when you build Gaia by adding the following line into gaia/build/config/common-settings.json:

+
 "devtools.qps.enabled": true
+

Note: Pseudo-localizations are generated completely dynamically, each time an app is launched.  The performance and memory characteristics may be different than those of regular localizations.  If you specifically want to test performance of non-English languages, build multilocale Gaia with real locales.

+

Graphics settings

+

Flash repainted area

+

In this mode, every time a region of the screen is painted by Gecko, Gecko blits a random translucent color over the painted region. Ideally, only parts of the screen that visually change between frames will "flash" with a new color. But sometimes more area than is needed is repainted, causing large areas to "flash". This symptom may indicate that application code is forcing too much of its scene to update. It may also indicate bugs in Gecko itself.

+

A screenshot of Firefox OS with a number of transparent overlays, showing the parts of the screen repainted with each new animation frame.

+

Enable APZ for all content (Async Pan/Zoom)

+

When enabled, the Async Pan/Zoom module allows panning and zooming to be performed on asynchronously, on another thread, with some noticeable differences to rendering behaviour. To find out more, read the MozillaWiki APZ article.

+

Overscrolling

+

This enables and disables the behaviour in Firefox 2.1+ where the display stretches in an elastic manner when you scroll past the end of a page, then shrinks back again when you stop dragging the display. The behaviour's full name is elastic overscroll.

+

Tiling (was Layers: Enable tiles)

+

Introduced in Firefox OS 1.4, this feature enables the painting of content to the screen in smaller chunks ("tiles") rather than painting the whole screen at once. This is mainly useful for platform QA work involving reducing checkerboarding and finding regression windows.

+

Simple tiling (was Layers: Simple tiles)

+

This flips between the two different content painting implementations described in the section above.

+

Low-precision painting

+

Enabling this option makes Gecko paint a low-precision (blurry) version of the content when scrolling really fast. This is useful because it's quicker to paint, and so helps us avoid displaying blank areas (i.e. checkerboarding) while scrolling quickly. It should only be visible to the user temporarily; once the user stops scrolling we fill in the low-precision areas with high-precision content.

+

Low-precision transparency

+

This is an additional flag for low-precision painting, which makes the low-precision content half transparent. This makes it a little more subtle and less jarring for the user.

+

Hardware composer (was Enable hardware compositing)

+

When enabled, this setting causes the device to use its Hardware Composer to composite visual elements (surfaces) to the screen.

+

Draw tile borders (was Layers: Draw tile borders)

+

This is very similar to the {{ anch("Draw layer borders") }} option, the difference being that it also draws the borders for individual tiles as well as the borders around layers.

+

Draw layer borders

+

When this setting is enabled, a brightly colored border is added around all the different layers painted to the display — great for diagnosing layout issues.

+

A screenshot from Firefox OS showing an opened select form with the draw layers borders option enabled, resulting in colored borders being drawn on all the different rendered layers.

+

Dump layers tree

+

This option enables layers.dump, which causes a copy of the compositor's layer tree to be dumped to logcat on every frame composited to the screen; this is mainly useful for platform graphics performance work, rather than regular web development.

+

Cards View: Screenshots

+

When enabled, this specifies that app screenshots will be taken when the open apps are displayed in card view. If disabled, app icons are shown in the center of blank cards for the card view instead.

+

Window management settings

+

Software home button

+

Enabling this option creates a software home button that can provide the same functionality as the equivalent hardware button if it is not available. This is intended for future use on devices that are likely to not have hardware home buttons, like tablets.

+

Home gesture

+

Enabling this option allows you to swipe upwards towards the center from outside the screen to bring up the homescreen. Again, this can provide the same functionality as the equivalent hardware button if it is not available, and is intended for future use on devices that are likely to not have hardware home buttons, like tablets.

+

Continuous transition

+

This setting allows you to decide whether app keyboards open immediately or continuously (with a  transition). Disabling such transition effects are useful on low end devices, when they cause performance to suffer.

+

App transition

+

Turn this on and then off again and you will disable all app closing/opening transitions: all apps will now just show immediately, without the smooth animation, and keyboards will also open/close without animation. Like "Continuous transition enabled", this is meant for improving performance on low end devices, but it has more of an effect.

+

App suspending

+

If enabled, this specifies that when an app is killed in the background, it will be kept in history and reopened when you open it from homescreen/card view. If disabled, such apps are not kept in history/card view.

+

Debug settings

+

Log slow animations

+

This tool tries to help developers understand why animations are not offloaded to the compositor to be run efficiently as possible. It reports "bugs" like trying to animate elements that are too large, or trying to animate CSS properties that can't be offloaded. The messages you'll get on the device will look like the following:

+
I/Gecko   ( 5644): Performance warning: Async animation disabled because frame size (1280, 410) is bigger than the viewport (360, 518) [div with id 'views']
+
+

Geolocation output in ADB

+

Enables logging of geolocation data to adb logcat. This helps with debugging both the GPS stack (namely we get NMEA callback) and MLS use.

+

Wi-Fi output in adb

+

Enabling this option adds information about Wi-Fi to the adb logs (error logs from the console can be accessed using adb logcat | grep "Error" in the Terminal.)

+

Bluetooth output in adb

+

Enabling this option adds information about Bluetooth to the adb logs (error logs from the console can be accessed using adb logcat | grep "Error" in the Terminal.)

+

Console enabled

+

When enabled, this option lets you use the Web Console in Firefox to remotely access the console output on the device; without this option enabled, the {{domxref("console.log()")}} function does nothing.

+

Gaia debug traces

+

Enabling this directly enables DEBUG traces in Gaia; see {{ bug("881672") }} for more details.

+
+

Note: Unfortunately, not every app supports this mechanism to print their debug log. Instead, they control a "DEBUG" flag in code directly, so enabling this flag does NOT ensure that you'll see all debug logs.

+
+

Show accessibility settings

+

This enables the accessibility settings menu, subsequently found at Settings > Accessibility. The options contained within the accessibility settings are as follows:

+

Screen reader

+

Enabling this option turns on Firefox OS's screen reader. This is technology that allows a blind person to use a Firefox OS device. Currently at a very early stage, it changes the way the standard touch events work. When the screen reader is on, you must interact with the screen as follows:

+ +
+

Note: If you have turned the screen reader on and wish to disable it again, you must navigate back to the setting via these new gestures and double-tap the checkbox once it is highlighted to turn it off again. That will restore the touch screen functionality to its default behaviour.

+
+

Note: In Firefox 1.4 and above, there is a quick toggle for the screen reader. Press volume up, then down, three times (up, down, up, down, up, down). The screen reader will instruct you to perform this same action again (volume up, down, up, down, up, down) to turn it on if it is not running, or to turn it off if it is already running. If you do not want to change the current toggle state, simply do something else. That way, you can turn it on and off at will to test your web application for accessibility without having to navigate the accessibility settings menu each time.

+

Speech volume

+

A slider that controls how loud the speech is delivered.

+

Speech rate

+

A slider that controls how fast the speech is delivered.

+

Use Marketplace reviewer certs

+

TBD

+

Shake to save system log

+

TBD

+

Verbose app permissions

+
+

Note: Introduced with Firefox 2.1

+
+

When this is enabled, developers (and privacy enthusiasts) may modify all permissions granted to installed privileged apps, using The "App Permission" pane in the Settings app. The app sub-pages under here are updated upon enabling the setting to provide a list of each API permission is requested for in the app's manifest file, along with choices to set that permission to. For example, "Schedule Alarms" appears with choices of Ask, Deny and Grant. Note that some apps may be unable to deal with changed permissions. If you experience any odd behavior, consider resetting the permission or re-installing the app.

+

Launch first time use

+

The "Launch first time use" button runs the "First-Time Use" (FTU) program; this lets you go through the initial setup and tutorial process, and is useful when trying to debug that process, or if you want to re-configure your device from scratch.

+

Software updates

+

Update channel

+

Enables you to specify different update channels to get software updates from when your device receives OTA updates. Options are nightly, aurora ... (others?)

+

Update URL

+

Enables you to specify different URLs from which to receive your updates.

+

Obsolete settings

+

This section lists settings that are no longer provided, or no longer exist in the same state, but might still be interesting if you are running an older version of Firefox OS.

+

Accessibility

+

In versions of Firefox earlier than newer 1.4 versions, this controls the accessibility settings, as explained in the {{ anch("Show_accessibility_settings") }} section above.

+

Grid

+

The "Grid" option, when enabled, causes the Firefox OS display to be overlaid with a grid pattern to help you gauge positioning and alignment of items. For example, below we see the Browser app running with the Grid option enabled:

+

+

The grid's heavier lines are 32 pixels apart, both horizontally and vertically.

+

Show frames per second

+

In Firefox OS versions older than newer 1.4, enabling this displays frames per second, as explained in the {{ anch("Frames_per_second") }} section above.

+

Show time to load

+

In Firefox OS versions older than newer 1.4, enabling this displays time to load information, as explained in the {{ anch("Time_to_load") }} section above.

+

Rocketbar enabled

+

In Firefox OS versions older than newer 1.4, this option enables the new Firefox Rocketbar on your device, which provides a useful new way to switch between apps, search, and more. When enabled, you'll find a search icon at the top left of the device, and the RocketBar can be brought up by swiping from the top left of the device towards the bottom left.

+
+

Note: In newer versions of Firefox OS, Rocketbar is enabled automatically and cannot be turned off.

+
+

Contacts debugging output in adb

+

Enabling this option adds debugging information about contacts to the adb logs (error logs from the console can be accessed using adb logcat | grep "Error" in the Terminal.)

+

Progressive paint (was Layers: Progressive paint)

+

This was introduced to help with debugging of the Async Panning/Zoom module (APZ) during its implementation. Now APZ implementation is complete, this option is deprecated, and will be removed from future versions (see {{ Bug("1003228") }}).

+

Displayport Heuristics

+ +

These options were introduced to help with debugging of the Async Panning/Zoom module (APZ) during its implementation, specifically to allow QA to experiment with different repainting heuristics to see which resulted in the least amount of checkboarding.. Now APZ implementation is complete, these options are deprecated, and will be removed from future versions (see {{ Bug("1003228") }}).

+

Edges gesture

+

Enabling this option allows you to swipe left and right from outside the screen towards the center, to navigate to the next and previous sheets (either web pages in the browser, or views inside another app.) This basically works like the browser navigator bar in Firefox, but is enabled by default in Firefox 2.1+.

+

Keyboard layouts

+

In addition to the developer-specific options listed above, Firefox OS < 1.4's developer settings featured keyboard layout options. These let you toggle on and off the then-experimental Chinese input methods:

+

+

As of Firefox 1.4, these options have been removed. This is because the Chinese keyboard layout implementations (zhuyin and pinyin) have now been completed.

+
+

Note: For other keyboard layouts still under development, such as Japanese, we now have a build-time config to opt them in.

+
+

 

diff --git a/files/de/archive/b2g_os/debugging/index.html b/files/de/archive/b2g_os/debugging/index.html new file mode 100644 index 0000000000..a83bb6ae67 --- /dev/null +++ b/files/de/archive/b2g_os/debugging/index.html @@ -0,0 +1,80 @@ +--- +title: Debugging on Firefox OS +slug: Archive/B2G_OS/Debugging +tags: + - B2G + - Debugging + - Firefox OS + - NeedsTranslation + - QA + - Testing + - TopicStub +translation_of: Archive/B2G_OS/Debugging +--- +
+

There are two main types of debugging you'll want to with Firefox OS: debugging apps, and debugging other aspects of the system. This section of the site provides articles covering the different tools at your disposal to debug your Firefox OS code.

+
+

Debugging apps

+

When debugging your web apps, the best tool at your disposal is Mozilla's powerful App Manager, which allows you to run your apps directly on a real device or simulator, update any changes instantly, and debug them directly on the device using Mozilla's excellent developer tools. This should be your first choice, especially for app/Gaia debugging.

+
+
+ Using the App Manager
+
+ The App Manager is a new tool available in Firefox for Desktop, which provides a number of useful tools to help you test, deploy and debug HTML5 web apps on Firefox OS phones and the Firefox OS Simulator, directly from your browser.
+
+ Debugging out of memory errors on Firefox OS
+
+ This article describes how B2G's multiprocess architecture affects what the phone does when we run out of memory, and how to understand and debug OOM crashes.
+
+

Debugging Gaia/B2G

+

If you want to debug code from the Gaia apps suite or B2G itself, the following tools will be of use to you.

+
+
+ Debugging using the desktop B2G client
+
+ You can use the dedicated B2G desktop application (and associated tools) to debug multiple aspects of B2G and Gaia.
+
+ Quickstart guide to Gaia development
+
+ This guide provides a very quick easy guide to developing and debugging Gaia apps, including running Gaia inside desktop Firefox, and debugging Gaia with App Manager.
+
+ Debugging B2G using gdb
+
+ The popular gdb debugger can be used to debug Firefox OS and web apps running on a device, or on an emulator. This guide will show you how it's done.
+
+ Debugging B2G using Valgrind
+
+ Valgrind gives developers access to information about memory allocations, threads, and other information important to performance. This guide shows how to run Valgrind either on desktop B2G or select phone hardware.
+
+ Getting NSPR logs in B2G
+
+ You can use NSPR logs to record HTTP and other networking.
+
+ Debugging OpenGL
+
+ How to debug OpenGL code on Firefox OS.
+
+

General setup and information

+

The following articles provide information on individual aspects of setup for Firefox OS development. The chances are that you won't need these, especially if you are just debugging apps using the App Manager. But we have made them available here in case you do.

+
+
+ Developer settings for Firefox OS
+
+ There are a number of settings options available for developers on Firefox OS. This guide explains what they do and how to take advantage of them.
+
+ Installing and using ADB
+
+ Many aspects of Firefox OS development require installation of adb, the Android Debug Bridge. This article explains how to do that, and shares some common useful ADB commands.
+
+ On-device console logging
+
+ How to log to console on a Firefox OS device, and how to access the resulting logs for review on your computer.
+
+ Connecting a Firefox OS device to the desktop
+
+ This short guide explains how to set up your Firefox OS device and your desktop so that the desktop can communicate with the device over USB.
+
+ Setting up to debug Firefox OS code
+
+ Before you can begin using most of the tools integrated into Firefox for debugging code running under Firefox OS, you need to do a little configuration work. This article explains what you need to do.
+
diff --git a/files/de/archive/b2g_os/debugging/installing_adb/index.html b/files/de/archive/b2g_os/debugging/installing_adb/index.html new file mode 100644 index 0000000000..9e49cc786b --- /dev/null +++ b/files/de/archive/b2g_os/debugging/installing_adb/index.html @@ -0,0 +1,70 @@ +--- +title: ADB installieren und benutzen +slug: Archive/B2G_OS/Debugging/Installing_ADB +tags: + - ADB + - B2G + - Debugging + - Firefox OS + - Installation + - mobil +translation_of: Archive/B2G_OS/Debugging/Installing_ADB +--- +
+

Viele Aspekte der Firefox OS Entwicklung erfordern die Installation von ADB, der Android Debug Bridge. Dieser Artikel erklärt, wie das geht und zeigt einige häufig verwendete und nützliche ADB Befehle.

+
+

ADB Installieren

+

ADB kann als Bestandteil des Android SDK Pakets für Mac, Linux oder Windows heruntergeladen und installiert werden - besuchen Sie dazu die Get the Android SDK Seite.

+

Bei neueren Linux Distributionen ist adb bereits in den Repositories verfügbar. Für Ubuntu 12.10 und neuere, führen Sie folgenden Befehl aus:

+
sudo apt-get install android-tools-adb
+

Oder für Fedora 18/19:

+
sudo yum install android-tools
+

Oder auf OSX mit Homebrew:

+
brew install android-platform-tools
+

Falls ihre Distribution kein Paket für adb zur Verfügung stellt (z.B. Ubuntu 12.04 oder Fedora 17), müssen Sie das Android SDK starter package für ihre Plattform installieren (wählen Sie die Option ADT Bundle, nicht SDK Tools Only). Führen Sie dann deren Paketmanager, $SDK_HOME/tools/android aus und nutzen Sie dann die GUI zum Installieren von "Android SDK Platform-tools".

+

Finden Sie heraus, wo adb installiert wurde (üblicherweise in usr/bin, unter Umständen zusätzlich in adt/platform-tools, je nach Installationsart). Stellen Sie sicher, dieses Verzeichnis zu ihrem PATH hinzuzufügen. Dies erreichen Sie durch Hinzufügen  der Zeile

+
PATH=$SDK_HOME:$PATH
+

in der Sie $SDK_HOME durch den Pfad ihres android sdk  ersetzen, zu ihrer ~/.bashrc oder vergleichbarem.

+

Fehlerbehebung

+

Wenn Sie eine 64-bit Installation verwenden, und Sie den Fehler "File not found" bei der Ausführung von 'adb' bekommen, obwohl diese Datei vorhanden ist, müssen Sie 32-bit Kompatibilitätsbibliotheken installieren. Um das mit apt zu tun:

+
sudo apt-get install ia32-libs
+

Häufig verwendete ADB Befehle

+

Der folgende Abschnitt erklärt einige häufig verwendete, nützliche adb Befehle.

+

Den b2g Prozess neu starten

+

b2g ist das Äquivalent einer XULRunner Anwendung die auf einem Smartphone auf einem Android-basierten Kernel ausgeführt wird. Manchmal kann ein Neustart dieser Anwendung nützlich sein; so können Sie die Anwendungsumgebung zurücksetzen ohne das Gerät neu zu starten. Sie können dies tun indem Sie folgendes in ihr Terminal eingeben, während ihr Gerät mit ihrem Computer verbunden ist (oder während der Ausführung des Debuggers):

+
adb shell killall b2g
+

Portweiterleitung zum Debuggen aktivieren

+

Um einfach eine Portweiterleitung zu aktivieren (zum Beispiel wenn Sie den App Manager nutzen um Apps auf ihrem Firefox OS Gerät zu debuggen), geben Sie folgenden Befehl in Ihrem Terminal ein:

+
adb forward tcp:6000 localfilesystem:/data/local/debugger-socket
+

Dies müssen Sie jedesmal beim neu Starten oder Aus- und wieder Einstecken des Smartphones tun. Sie können die Socket Nummer ändern, wenn gewünscht.

+

Portweiterleitung zu einem lokalen Rechner

+

Um Ports zu einem lokalen Rechner weiterzuleiten, müssen Sie die netcat and ssh binaries herunterladen und folgende Befehle ausführen:

+
# this is an awful hack but does in fact work...
+host$ adb forward tcp:7979 tcp:6969
+
+# make some named pipes so that we can make a bidirectional netcat
+phone$ mknod readback p
+host$ mknod readback p
+
+# this sets up a one time use connection to back to the host
+# listen on ports 6969 and 5959 and forward all the information between them
+phone$ ./netcat -l -p 6969 < readback | ./netcat -l -p 5959 > readback
+# connect to port 7979 (port 6969 on the device) and the local ssh server and forward all information between them
+host$ ./netcat localhost 7979 < readback | ./netcat localhost 22 > readback
+
+# now when we connect to port 5959 on the phone it will be like connecting to ssh server on the host
+
+# use the netcat reversal to set up an ssh connection back to the host and forward port 9999 on the device to 'localhost:8000' (this could be anything like 'google.com:80')
+phone$ ./ssh localhost -p 5959 -L 9999:localhost:8000
+

Das wird Port 9999 auf dem Gerät zu Port 8000 des Hosts weiterleiten.

+

Alternativ können Sie einen SSH-Server (dropbear und host_key) mit folgenden Befehlen direkt auf dem Gerät verwenden:

+
phone$ DROPBEAR_PASSWORD=root ./dropbear -p 9000 -F -v -a -r host_key ./dropbear
+host$ adb forward tcp:8888 tcp:9000
+# public key authentication has been hard coded to succeed (make sure you have a public key for ssh to use)
+host$ ssh -vvv root@localhost -p 8888 -R 9999:people.mozilla.org:80
+
+

Weitere Anleitungen:

+ diff --git "a/files/de/archive/b2g_os/debugging/verbinden_eines_firefox_os_ger\303\244ts_mit_dem_rechner/index.html" "b/files/de/archive/b2g_os/debugging/verbinden_eines_firefox_os_ger\303\244ts_mit_dem_rechner/index.html" new file mode 100644 index 0000000000..d82f69789d --- /dev/null +++ "b/files/de/archive/b2g_os/debugging/verbinden_eines_firefox_os_ger\303\244ts_mit_dem_rechner/index.html" @@ -0,0 +1,41 @@ +--- +title: Connecting a Firefox OS device to the desktop +slug: Archive/B2G_OS/Debugging/Verbinden_eines_Firefox_OS_Geräts_mit_dem_Rechner +tags: + - ADB + - Firefox OS +translation_of: Archive/B2G_OS/Debugging/Connecting_a_Firefox_OS_device_to_the_desktop +--- +
+

Diese Anleitung erklärt, wie man ein Firefox OS  Gerät mit dem Rechner über USB verbindet.

+
+
+

Achtung: Um Apps auf einem Firefox OS Gerät zu debuggen und wenn auf dem Gerät Firefox 1.2+ läuft, ist der beste Weg den App Manager zu benutzen. Details können unter Benutzung des App Mangers nachgelesen werden. Wird eine Version von Firefox OS kleiner 1.2 benutzt, kann man unter Einrichtung des Firefox OS Debugging Modus unter Verwendung der Entwickler Tools mehr über das Standard Remote Debugging  erfahren.

+
+

Einrichtung des Geräts

+

Auf deinem Firefox OS Gerät (see the layout):

+
    +
  1. öffnen der App Einstellungen, dann Geräteinformationen > Weitere Informationen > Entwickler.
    2. +
  2. Im Entwickler Menü  "Debugging über USB" aktivieren.
    3. +
+

Einrichtung des Rechners

+

Um ein Gerät mit dem Rechner zu verbinden muss die Android Debug Bridge (adb) installiert sein. Beachte dass das Firefox OS Simulator add-on eine adb mitbringt.

+

Instructions for setting up your desktop are specific to your operating system and are detailed in point 3 of "Setting up a Device for Development" on the Android developer site. We've listed some additional instructions below.

+

Spezielle Anweisungen für Mac OS X

+

If you're running Mac OS X, you have downloaded a package which has a name along adt-bundle-mac-x86_64-20130522. Put that folder into the Applications folder, so that you get /Applications/adt-bundle-mac-x86_64-20130522/ which contains two directories: eclipse and sdk. Then you can edit your ~/.bashrc and add

+
export PATH="/Applications/adt-bundle-mac-x86_64-20130522/sdk/platform-tools:$PATH"
+

(It will be ready for the next time you start your shell). You can now type on the CLI of the shell:

+
adb devices
+
+

and it will return a list of connected devices such as:

+
List of devices attached
+AA:BB:A5:B5:AA:BB    device
+

Spezielle Anweisungen für Linux

+

If you're running Linux, the vendor ID to use for Firefox OS Geeksphone devices is 05c6, so your /etc/udev/rules.d/51-android.rules file should contain an entry similar to:

+
SUBSYSTEM=="usb", ATTR{idVendor}=="05c6", MODE="0666", GROUP="plugdev"
+

Spezielle Anweisungen für Windows

+

You can download Windows drivers for the Geeksphone from the Geeksphone website.

+

Windows 8 by default will not let you install unsigned drivers. See this tutorial on "How to install an unsigned driver on Windows 8".

+

Since Windows XP Home Edition doesn't include tasklist.exe, Simulator won't detect the device. This can be solved downloading that file from ComputerHope website and putting it in Windows\System32 folder.

+

Einrichtung überprüfen

+

Once you've followed these instructions, attach the device to the desktop using a USB cable, open a command prompt and type "adb devices" (ensuring that adb is in your path). You should see your Firefox OS device listed in the output.

diff --git a/files/de/archive/b2g_os/developing_firefox_os/filing_bugs_against_firefox_os/index.html b/files/de/archive/b2g_os/developing_firefox_os/filing_bugs_against_firefox_os/index.html new file mode 100644 index 0000000000..6a269b17bc --- /dev/null +++ b/files/de/archive/b2g_os/developing_firefox_os/filing_bugs_against_firefox_os/index.html @@ -0,0 +1,183 @@ +--- +title: Firefox OS Fehler melden +slug: Archive/B2G_OS/Developing_Firefox_OS/Filing_bugs_against_Firefox_OS +tags: + - Abbruch + - Bugs + - Bugzilla + - Fehler + - Firefox OS +translation_of: Archive/B2G_OS/Developing_Firefox_OS/Filing_bugs_against_Firefox_OS +--- +
+

Dieser Artikel enthält eine Anleitung zum Melden von Fehlern zum Firefox OS Projekt, zu Gaia und zu B2G (Boot to Gecko).

+
+ +

Bugzilla

+ +

Wie die meisten Mozilla-Projekte nutzen wir Bugzilla für die Fehler- und Problemverfolgung. Du kannst Fehler an Bugzilla melden, wenn Du Fehler entdeckt hast — wir haben eine eigene Bugzilla Kategorie (Product) für Firefox OS mit Unter-Kategorien (Components) für Gaia, Gonk und Gecko. Du solltest diese Kategorien verwenden, um Fehler und Probleme bezüglich Firefox OS, Gaia etc. zu melden.

+ +

Fehler melden

+ +

Zum effektiven Melden von Fehlern und Problemen kannst Du dieses Bugzilla Template verwenden. Hinweise zum Ausfüllen des Templates findest Du weiter unten.

+ +

Pflichtfelder und optionale Felder

+ +

Die folgenden Felder in Bugzilla sind immer auszufüllen:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeldBeschreibung
ComponentKategorie, in die der Fehler gehört. Wenn der Fehler in keine der vorhandenen Kategorien passt kannst Du "General" verwenden.
SummaryZusammenfassung, die den Fehler kurz und treffend beschreibt.
DescriptionAussagefähige Beschreibung des Fehlers. Eine gute Fehlermeldung sollte die Schritte zum Reproduzieren (steps to reproduce, STR) des Fehlers, die erwarteten und die tatsächlichen Ergebnisse enthalten. Bitte gib auch an, wie oft dieser Fehler auftritt (z.B. wenn Du die Schritte öfter wiederholst).
Build InformationGehe zu Einstellungen > Geräteinformationen > Weitere Informationen und füge folgende Informationen in die Fehlermeldung ein: Betriebssystemversion, Plattform-Version, Build-ID, Updatekanal und die Informationen zum Commit auf Git. Falls Du einen Mac oder Linux Computer mit adb hast und dort git installiert ist, dann kannst Du dieses Skript ausführen und dessen Ergebnis in die Meldung kopieren.
ScreenshotsBitte füge Bildschirmfotos ein. Das kann uns helfen, den Fehler zu analysieren. Auf dem Flame Smartphone drückst Du dafür 2 Sekunden lang gleichzeitig den Ein-/Aus Schalter und die "Lautstärke runter/leiser" Taste bis auf dem Display eine Bestätigung des Bildschirmfotos angezeigt wird. Anschließend überträgst Du dieses Foto via USB auf Deinen Computer.
VideoFalls sich Dein Fehler auf ungewöhnliche Veränderungen des Displays bezieht die mit einem Bildschirmfoto nicht dargestellt werden können, dann mach bitte ein Video davon. Dieses Video kannst Du dann als Anhang zur Fehlermeldung hinzufügen. Du kannst das Video auch nach YouTube hochladen und die URL in die Fehlermeldung einfügen.
ADB logsFalls adb auf Deinem Computer installiert ist: Schließe bitte Dein Smartphone an den Computer an und führe das Kommando |adb logcat| aus. Bitte füge das Ergebnis dieses Kommandos in eine Text-Datei ein und füge diese als Anhang zur Fehlermeldung hinzu.
+ +

Die folgenden Felder sind optional:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeldBeschreibung
Depends/BlockZeige uns Abhängigkeiten zu anderen Fehlermeldungen.
KeywordsSchlüsselwörter für Bugzilla. Bestimmte Support-Abteilungen nutzen diese zur Statusverfolgung von Fehlern.
WhiteboardBeinhaltet Tags. Füge beliebige Tags zur Statusverfolgung hinzu. Du solltest keine vorhandenen Tags ohne Erlaubnis löschen.
See AlsoHin und wieder haben Fehler Bezug zu einem anderen Fehler. Das kannst Du hier angeben.
FlagsKennzeichen für die Statusverfolgung; das am häufigsten verwendete Kennzeichen in Firefox OS Fehlern ist blocking-b2g. Wenn eine Meldung als blocking-b2g gekennzeichnet ist, dann kann der Fehler die Veröffentlichung eines Releases gefährden und ist somit besonders zu beachten.
SecurityWenn ein Fehler die Sicherheit der persönlichen Daten gefährdet, monetäre Verluste oder ähnliches verursacht, dann solltest Du dieses Feld ankreuzen. Somit ist die Fehlermeldung nur noch für ausgewählte Mitarbeiter sichtbar.
+ +

Nähere Informationen zu den Bugzilla-Feldern findest Du auf Bugzilla Fields.

+ +

Lokalisierungs-Probleme melden

+ +

Wenn Du eine nicht übersetzte Zeichenkette siehst, dann kann das zwei Gründe haben:

+ + + +

Wie Lokalisierungs-Probleme (l12y) gemeldet werden

+ +
    +
  1. Lege eine Meldung in Bugzilla an, als "Product" wählst Du 'Firefox OS'. Wähle unter "Component" die Firefox OS Komponente, in der das Lokalisierungsproblem auftritt. Trage bitte 'l12y' als Schlüsselwort in das Feld "Keyword" ein.
    2. +
  2. Fülle alle anderen Pflichtfelder aus.
    3. +
+ +

Besondere Schlüsselwörter (Keywords)

+ +

Die folgende Tabelle enthält Informationen zu speziellen Schlüsselwörten, die Du in Firefox OX Fehlermeldungen häufiger finden wirst.

+ +


+ Du solltest immer die Kombination Build-Version/Betriebssystem/Plattform, unter der der Fehler behoben ist, ins Kommentarfeld der Fehlermeldung eintragen bevor Du den Status auf Verified setzt. Wenn der Fehler auf allen Plattformen gemeldet ist und Du die Behebung des Fehlers nur auf einer bestimmten Plattform verifizieren kannst, dann gebe dies bitte in der Fehlermeldung an. Bitte setze den Status der Meldung in einem solchen Fall nicht auf Verified. Es müssen erst alle Plattformen erfolgreich getestet worden sein, bevor der Status auf Verified gesetzt wird.
+
+ Zu guter Letzt: Falls andere Meldungen als Duplikat Deiner Meldung markiert wurden und Du Deine Meldung auf Verified setzt, dann prüfe diese Duplikate bitte ebenfalls und kommentiere diese Meldungen entsprechend. Oftmals markieren Entwickler eine Meldung als Duplikat obwohl der Fehler nur ähnlich, aber nicht identisch ist. Solche Fehlermeldungen können übersehen werden, wenn der Status ungeprüft auf Verified gesetzt wird.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
KeywordBeschreibung
metaZeigt an, dass eine Meldung nur zur Statusverfolgung genutzt wird. Mozilla benutz dies, um die Stati mehrerer Meldungen einer komplexeren Entwicklung in einer einzigen Meldung zu verfolgen. Meldungen mit diesem Keyword sollten von Entwicklern nicht in die Patch-Planung einbezogen werden. Bitte denk daran, dass Projektleiter und Tester dieses Keyword für die Statusverfolgung nutzen.
qablockerDieses Keyword wird benutzt, wenn eine Meldung das Testen in der Qualitätssicherung blockiert (manueller oder automatisierter Test eine neuen Entwicklung) und der Fehler daher im nächsten Projekt-Meilenstein der Beta-Phase bzw. Release-Veröffentlichung behoben sein muss.
qawantedNutze dieses Keyword für Meldungen die mehr Informationen, mehr Testfälle oder weitere Informationen zur Reproduzierbarkeit benötigen oder als Duplikat gekennzeichnet sind, ohne dass Du die duplizierte Original-Meldung finden kannst. Der über dieses Keyword angeforderte Qualitätssicherungs-Prozess wird im sogenannten Whiteboard aufgezeichnet. Wenn die Qualitätssicherung ihre Arbeit erledigt hat, sollte dieses Keyword entfernt werden.
regressionDieses Keyword bedeutet, dass das Problem gelöst war und wieder aufgetreten ist (regressed). Um dieses Wiederauftreten des Problems zu verfolgen wird eine neue Meldung mit Keyword "regression" angelegt. Es wird ebenso für Fehler verwendet, die in früheren Releases behoben waren und im aktuellen Release wieder auftreten. Das Nachverfolgen dieser Probleme hilft uns fehleranfällige und instabile Bereiche zu identifizieren, die beim Testen besonders beachtet werden sollten.
regressionwindow-wantedKennzeichnet eine Meldung als "regression" Meldung bei der es sehr hilfreich wäre zu wissen, wann genau der Fehler aufgetreten ist (Zeitpunkt oder Zeitraum).
steps-wantedBei Meldungen mit diesem Keyword wäre es sehr hilfreich zu wissen, wie der Fehler reproduziert werden kann.
verifymeSo gekennzeichnete Probleme sollten von einem Dritten zusätzlich verifiziert werden, auch wenn der Fehler für den Melder und die Qualitätssicherung behoben zu sein scheint.  Die Meldung enthält dann spezielle Angaben zur Hardware und zur Konfiguration, für die die Lösung zusätzlich noch verifiziert werden soll. Du solltest versuchen, diesen Fehler zu reproduzieren. Wenn Du dann bestätigen kannst, dass der Fehler bei Dir ebenfalls behoben ist, dann kann der Status von Fixed auf Verified geändert werden.
+  
crashNutze dieses Keyword, wenn Du Abbrüche in Firefox OS bekommst.
+ +
+

Hinweis: Weitere Informationen erhälst Du auf der Seite Bug writing guidelines. Das Mozilla B2G QA Wiki enthält zudem nützliche Informationen zum Melden von Firefox OS Fehlern; die hilfreichsten Seiten sind Bugzilla Usage und Incoming bug triage for Firefox OS.

+
+ +
+

Hinweis: Nähere Informationen zum Umgang mit Fehlern in der Gaia-Entwicklung findes Du auf  Submitting a Gaia patch.

+
+ +

 

diff --git a/files/de/archive/b2g_os/developing_firefox_os/index.html b/files/de/archive/b2g_os/developing_firefox_os/index.html new file mode 100644 index 0000000000..29f0a9c290 --- /dev/null +++ b/files/de/archive/b2g_os/developing_firefox_os/index.html @@ -0,0 +1,26 @@ +--- +title: Hacking Firefox OS +slug: Archive/B2G_OS/Developing_Firefox_OS +translation_of: Archive/B2G_OS/Developing_Firefox_OS +--- +
+

This section provides some useful articles covering different ways in which the Firefox OS experience can be modified/customized during the build or app writing process.

+
+
+
+ Modifying the hosts file
+
+ A guide to what can be achieved by modifying the Firefox OS hosts file.
+
+ Customization with the .userconfig file
+
+ How to customize the build and execution of Firefox OS by changing the .userconfig file.
+
+ Localizing Firefox OS
+
+ A guide to localising the Firefox OS platform, making it available in your preferred languages.
+
+ Customizing the keyboard in Firefox OS apps
+
+ This guide shows how to customize the keyboard in your Firefox OS apps.
+
diff --git a/files/de/archive/b2g_os/firefox_os_build_prerequisites/index.html b/files/de/archive/b2g_os/firefox_os_build_prerequisites/index.html new file mode 100644 index 0000000000..0c2f90d39c --- /dev/null +++ b/files/de/archive/b2g_os/firefox_os_build_prerequisites/index.html @@ -0,0 +1,446 @@ +--- +title: Firefox OS build prerequisites +slug: Archive/B2G_OS/Firefox_OS_build_prerequisites +translation_of: Archive/B2G_OS/B2G_OS_build_prerequisites +--- +

Vor dem Holen des Codes zum Bauen von Firefox OS benötigt man ein geeignet konfiguriertes Build-System. Im folgenden wird dieser Vorgang beschrieben. Zur Zeit eignen sich 64-bit-Linux-Distributionen und Mac OS X.

+
+

Anmerkung: Wenn man Firefox OS auf ein Telefon installieren will, beginnt man, ohne das Telefon an den Computer angeschlossen zu haben. Im Text wird dann später erklärt, wann man das Telefon anschließen muß.

+
+

Kompatibles Gerät oder Emulator besorgen

+

Das System kann nur für ein kompatibles Gerät (i.a. ein Smartphone) oder einen Emulator gebaut werden. Obwohl wir diverse Geräte unterstützen, gibt es für einige von diesen unterschiedliche Ausführungen. Von diesen Ausführungen unterstützen wir zur Zeit nur bestimmte, und außerdem werden einige Geräte besser unterstützt als andere.

+
+

Anmerkung: Mozillas B2G-Quellcode ist die Referenzimplementation von B2G, aber Telefonherstellern ist es freigestellt, Fehlerkorrekturen ("Patches") hinzuzufügen oder andere Änderungen vorzunehmen. Wenn man zum Beispiel ein Alcatel One Touch kauft, läuft darauf eine herstellerspezifische Version. Das ist für die installierten Apps irrelevant, aber unter Umständen kann es auf  Plattform-Ebene Unterschiede geben. Die Version für das  Nexus-4 ("Nexus 4 Port") wird direkt von Mozilla gepflegt, also ist es viel wahrscheinlicher, dass dieses Telefon mit unserer Gecko-Version auf Anhieb funktioniert, als zum Beispiel bei Rang-3-Geräten.

+
+

Rang 1 (Tier 1)

+

Tier-1-Geräte werden bei der Entwicklung bevorzugt und sind typischerweise die ersten, die Fehlerkorrekturen ("bugfixes") und Erweiterungen ("feature updates") erhalten.

+
+
+ Keon
+
+ Keon ist ein Gerät der FIrma Geeksphone und eines der ersten Entwicklertelefone. Beachte, dass Binärpakete ("builds") für diese Geräte von Geeksphone bereitgestellt werden.
+
+ Inari
+
+ Inari ist ein weiteres Testgerät. Benutze diese Konfiguration, um FirefoxOS für die ZTE-Open-Geräte zu bauen. Warnung: Neuere Firefox-OS-Builds könnten auf ZTE Open Probleme beim Booten von der Standard-Boot-Partition machen.
+
+ Flame
+
+ Flame is Mozillas neues Standard-Referenztelefon für Firefox OS. Die Konfiguration für Flame sollte auch verwendet werden, wenn man für das Gerät ZTE Open C baut, weil beide Geräte auf der Android-Jellybean-Basis aufbauen.
+
+  
+
+ Emulatoren (ARM und x86)
+
+ Zur Zeit gibt es zwei Emulatoren, einen für die Emulation eines ARM-Prozessors und einen für die Emulation eines x86-Prozessors. Hier erfährt man mehr über die Installation und die Verwendung der Emulatoren.
+
+ Achtung: Der x86-Emulator ist derzeit nicht praxistauglich, sowohl was die Installation angeht als auch die Unterstützung.
+
+  
+
+ Desktop
+
+ Man kann auch eine Version von Firefox OS für Desktop-Rechner bauen; diese führt Gecko in einer XULRunner-Anwendung aus und darin Benutzerumgebung Gaia.
+
+ Flatfish
+
+ Flatfish ist das erste für Firefox OS entwickelte Tablet, auf dem jedoch einige Telefoniefunktionen fehlen. Es werden ein paar spezielle Einstellungen benötigt, um den Code zu bauen.
+
+

Natürlich kann man den Desktop-Client und die Emulatoren auch bauen, ohne ein Telefon zu benutzen.

+

Rang 2 (Tier 2)

+

Bei den Tier-2-Geräten ist die Grundfunktionalität gegeben, und viele Entwickler, insbesondere App-Entwickler, arbeiten damit, daher sind es üblicherweise die nächsten Geräte (nach Tier-1), für die Änderungen bereitgestellt werden.

+
+
+ Samsung Nexus S
+
+ Die einzigen Varianten dieses Smartphones, von denen bekannt ist, daß sie mit Firefox OS funktionieren, sind GT-I9020A (mit Amoled-Bildschirm) and GT-I9023 (Billigmodell mit LCD). Möglicherweise funktionieren aber auch weitere.
+
+ Samsung Nexus S 4G
+
+ The SPH-D720 is supported as a tier 2 device.
+
+

Rang 3 (Tier 3)

+

Man kann Firefox OS für diese Geräte bauen, aber die Hauptentwickler verwenden sie nicht regelmäßig. Bezüglich Stabilität, Zuverlässigkeit und Funktionsvielfalt stehen sie daher den Tier-1- und Tier-2- Geräten möglicherweise nach.

+
+
+ Samsung Galaxy S2
+
+ Nur die Variante i9100 funktioniert, keine andere, zumindest nicht offiziell (i9100P könnte auch funktionieren, da sie sie sich nur durch einen zusätzlichen NFC-Baustein unterscheidet.)
+
+ Samsung Galaxy Nexus
+
+ Zur Zeit ist keine Variante bekannt, die nicht funktioniert.
+
+ Nexus 4
+
+ Einige Anwender haben laut IRC dieses Gerät mit Erfolg getestet. Möglicherweise muß man für den Fall, daß man Android 4.4 installiert hat, vorher auf 4.3 zurückgehen (Android- Betriebssystem-Images sind bei Google erhältlich)
+
+ Nexus 5
+
+ Einige Anwender haben laut IRC dieses Gerät mit Erfolg getestet.
+
+ Tara
+
+ Tara ist ebenfalls ein Testgerät. Das "Manifest" für Tara existiert nur im "master branch". Um den Tara-Code zu erhalten, ruft man folgendes Script auf: "BRANCH=master ./config.sh tara".
+
+ Unagi
+
+ Unagi ist ein Telefon, das als Test- und Entwicklungsplattform für einfache bis Mittelklasse- Smartphones verwendet wird. Viele Core-Firefox-OS-Entwickler arbeiten auf Unagi.
+
+ Pandaboard
+
+ Das Pandaboard ist eine Entwicklungsplatine ("Board"), die auf der OMAP-4-Architektur basiert, und wird verwendet, um auf mobilen Plattformen zu entwickeln.
+
+
+ Wichtig: Nur solche Geräte werden unterstützt, auf denen mindestens Android 4 (alias Ice Cream Sandwich) lauffähig ist. Für den Fall, daß ein Gerät oben aufgeführt ist, aber ein älteres Android-System installiert ist, muß man erst eine neuere Android-Version installieren.
+
+

Bemerkung: Tier-2 und Tier-3-Geräte haben einen virtuellen, d.h durch Software dargestellten, Home-Button anstelle eines physikalischen.

+

Alle Tier-1-Geräte haben  dagegen einen physikalischen "Home"-Button, mit dem man bei Betätigen stets auf den Startbildschirm zurückkehrt. Die meisten Android-Geräte für Version 4 oder später haben einen auf dem Bildschirm dargestellten "Home"-Button. Auch Firefox OS kann solch eine Schaltfläche darstellen; sie wird automatisch bei entsprechenden Geräten aktiviert. Wenn dies versagen sollte, muß man die Einstellungen öffnen und zu den Geräteinformationen navigieren, dort dann "Weitere Informationen" öffnen und "Entwicklermenü" einschalten (falls noch nicht geschehen). Dann wieder zurück zu den Einstellungen navigieren und das Entwickler-Menü öffnen, dort "Software-Startschaltfläche" einschalten.

+
+

Anforderungen für Linux

+

Um auf Linux bauen zu können, benötigt man:

+ +

Das ist zwar etwas mehr, als tatsächlich benötigt wird, aber mitunter kommt es vor, daß der Erstellungsprozeß gerade deswegen fehlschlägt, weil ein wenig Speicher fehlt.

+

Außerdem werden folgende Dienstprogramme benötigt und müssen ggf. nachinstalliert werden:

+ +

Installation im Falle eines 64-Bit-Linux

+

Im folgenden werden die Kommandos aufgeführt, mit denen man die notwendigen Programmpakete für das Bauen von Firefox OS installieren kann.

+

Ubuntu 12.04 / Linux Mint 13 / Debian 6

+

Diese Kommandos in einem Terminal-Fenster ausführen:

+
sudo apt-get update
+sudo apt-get install autoconf2.13 bison bzip2 ccache curl flex gawk gcc g++ g++-multilib git ia32-libs lib32ncurses5-dev lib32z1-dev libgl1-mesa-dev libx11-dev make zip
+

Für den Fall, daß Firefox OS für das Referenzgerät "Flame" oder Nexus 5 gebaut wird, diese Kommandos auführen:

+

sudo apt-get install libxml2-utils

+

Ein Java-Entwicklungspaket ("JDK") kann von dieser Paketquelle (ppa)  installiert werden.

+

Bitte auch die obigen Anmerkungen berücksichtigen, die die Probleme beschreiben, die auftreten, wenn man für einen Emulator baut!

+

Ubuntu 12.10 / Debian 7

+

Das folgende Kommando im Terminal-Fenster ausführen:

+
$ sudo apt-get install autoconf2.13 bison bzip2 ccache curl flex gawk gcc g++ g++-multilib gcc-4.6 g++-4.6 g++-4.6-multilib git ia32-libs lib32ncurses5-dev lib32z1-dev libgl1-mesa-dev libx11-dev make zip
+

Zusätzlich zu den oben erwähnte Schwierigkeiten beim Bauen für einen Emlator tritt hier noch das Problem auf, daß standardmäßig der Compiler in der Version gcc-4.7 verwendet wird, welcher den Compiliervorgang mit folgender Fehlermeldung abbricht:

+

"KeyedVector.h:193:31: error: indexOfKey was not declared in this scope, and no declarations were found by argument-dependent lookup at the point of instantiation"

+

Um diesen Fehler zu beheben, muß man auf die ältere Version gcc-4.6 als Standard-Compiler zurückgehen, und zwar am besten unmittelbar, nachdem man die Quellen für B2G heruntergeladen hat. Der Vorgang wird in der Anleitung "Changing the default host compiler" (engl.) beschrieben.

+

Bei einer unveränderten Ubuntu-12.10-Version gibt es eine Fehlermeldung wegen nicht erfüllter Abhängigkeiten der Systembibliotheken "ia32-libs". Dies wird mit diesen Befehlen behoben:

+
sudo dpkg --add-architecture i386
+sudo apt-get update
+sudo apt-get install ia32-libs
+

Ubuntu 13.04

+

Die folgenden Kommandos sind im Terminal-Fenster auszuführen:

+
$ sudo apt-get install --no-install-recommends autoconf2.13 bison bzip2 ccache curl flex gawk gcc g++ g++-multilib gcc-4.6 g++-4.6 g++-4.6-multilib git ia32-libs lib32ncurses5-dev lib32z1-dev zlib1g:amd64 zlib1g-dev:amd64 zlib1g:i386 zlib1g-dev:i386 libgl1-mesa-dev libx11-dev make zip
+

Auch hier muß von gcc-4.7 auf gcc-4.6 zurückgegangen werden, wie oben für Ubuntu 12.10 beschrieben.

+

Ubuntu 13.10

+

With Ubuntu 13.10, multi-arch packages are now the main way to support multiple architectures (e.g. 32-bit on a 64-bit install).  You must tell your Ubuntu system that you want to support 32-bit packages as well:
+  

+
sudo dpkg --add-architecture i386
+sudo apt-get update
+

Once you've completed that, then you can install the necessary packages:

+
sudo apt-get install --no-install-recommends autoconf2.13 bison bzip2 ccache curl flex gawk gcc g++ g++-multilib gcc-4.6 g++-4.6 g++-4.6-multilib git lib32ncurses5-dev lib32z1-dev zlib1g:amd64 zlib1g-dev:amd64 zlib1g:i386 zlib1g-dev:i386 libgl1-mesa-dev libx11-dev make zip libxml2-utils
+
+sudo update-alternatives --install /usr/bin/gcc gcc /usr/bin/gcc-4.6 1
+
+sudo update-alternatives --install /usr/bin/gcc gcc /usr/bin/gcc-4.8 2
+
+sudo update-alternatives --install /usr/bin/g++ g++ /usr/bin/g++-4.6 1
+
+sudo update-alternatives --install /usr/bin/g++ g++ /usr/bin/g++-4.8 2
+
+sudo update-alternatives --set gcc "/usr/bin/gcc-4.6"
+
+sudo update-alternatives --set g++ "/usr/bin/g++-4.6"
+

you can install the jdk via this ppa.

+

Ubuntu 14.04

+

Follow the instructions given for Ubuntu 13.10.

+

Fedora 19/20

+

Run the following command in Terminal:

+
sudo yum install autoconf213 bison bzip2 ccache curl flex gawk gcc-c++ git glibc-devel glibc-static libstdc++-static libX11-devel make mesa-libGL-devel ncurses-devel patch zlib-devel ncurses-devel.i686 readline-devel.i686 zlib-devel.i686 libX11-devel.i686 mesa-libGL-devel.i686 glibc-devel.i686 libstdc++.i686 libXrandr.i686 zip perl-Digest-SHA wget
+

The project should build correctly using the default compiler shipped with Fedora but if you encounter compilation errors you might need to install GCC 4.6.x:

+ +

Download the tarball then install it to /opt, with the following command on Fedora 19/20:

+
curl -O http://people.mozilla.org/~gsvelto/gcc-4.6.4-fc19.tar.xz
+sudo tar -x -a -C /opt -f gcc-4.6.4-fc19.tar.xz
+

To use GCC 4.6.x as the default host compiler you will have to set it explicitly after having retrieved the B2G sources: read Changing the default host compiler to find out how to do it.

+

Arch Linux

+

Run the following command in Terminal:

+
sudo pacman -S --needed alsa-lib autoconf2.13 bison ccache curl firefox flex gcc-multilib git gperf libnotify libxt libx11 mesa multilib-devel wget wireless_tools yasm zip lib32-mesa lib32-mesa-libgl lib32-ncurses lib32-readline lib32-zlib
+

To install the lib32-* packages you need to have the multilib repository enabled.

+

B2G can only be compiled with gcc4.6.4, and because Arch Linux always has bleeding edge software you will need to install gcc46-multilib from AUR. Note that you will have to edit the PKGBUILD and add staticlibs to the options array, or gcc will be unable to compile B2G and give you a cannot find -lgcc error when compiling. You will also need to add the following to your .userconfig file:

+
export CC=gcc-4.6.4
+export CXX=g++-4.6.4
+

By default, Arch Linux uses Python3. You'll have to force it to use the old python2. You can do that by linking the python2 executable to python but this is discouraged and considered error-prone. This will also break python 3 if it is installed on your system. A better way is to use virtualenv/virtualenvwrapper:

+
sudo pacman -S python-virtualenvwrapper
+source /usr/bin/virtualenvwrapper.sh
+mkvirtualenv -p `which python2` firefoxos
+workon firefoxos
+

Android will complain that you need make 3.81 or make 3.82 instead of 4.0. You can download make 3.81 from AUR.  This will install the make-3.81 binary on your path, you need to create a symlink named make to a location earlier in the PATH variable for the build to use the correct version.

+
mkdir -p ~/bin
+ln -s `which make-3.81` ~/bin/make
+export PATH=~/bin:$PATH
+

Android also needs the Java6 SDK and Arch only has Java7.  Unfortunately the aur build is broken, but you can still download the Java 6 SDK and install it manually.  You will then need to put it in your path.

+
cp ~/Downloads/jdk-6u45-linux-x64.bin /opt
+su
+cd /opt
+chmod +x jdk-6u45-linux-x64.bin
+./jdk-6u45-linux-x64.bin
+exit
+ln -s /opt/jdk1.6.0_45/bin/java ~/bin/java
+

Gentoo Linux

+
Installing ccache
+

You will need to install ccache, a tool for caching partial builds.

+
# emerge -av ccache
+

Because ccache is known to frequently cause support issues, Gentoo encourages you to use it explicitly and sparingly.

+

To enable the required use of ccache, on the subsequent step of this guide where the ./build.sh script is called, Gentoo users should instead run the command with an explicitly extended path, ie.

+
PATH=/usr/lib64/ccache/bin:$PATH ./build.sh
+
Generating Partition Images
+

If you are building B2G for actual physical hardware, then you may at some point also wish to generate some partition images for upload to your device. (For example, to restore backed up files to the device via the fastboot utility)

+

The filesystem image format used in this case is YAFFS2 (Yet Another Filesystem 2). Gentoo has support for the very latest (ie. git HEAD) yaffs2-utils userland package in portage. (Note: You will also need kernel patches if you want to mount YAFFS2 images, but this is not really required since you can deconstruct and rebuild them instead.)

+
# emerge --autounmask-write yaffs2-utils; etc-update; emerge -av yaffs2-utils
+

In order to generate such an image, simply change to the parent directory of the partition filesystem tree you wish to package, and issue a command like this:

+
mkyaffs2image system/ system.img
+

 

+

Anforderungen für Mac OS X

+

Um Firefox OS unter Mac OS X zu bauen, benötigt man etwas Vorarbeit, die unten detailiert beschrieben ist.  Außerdem werden typische Irrtümer und Fehler und ihre Lösungen erläutert.

+
+

Anmerkung: Das Bauen (und Konfigurieren der Quellen) von B2G für das Gerät Keon funktioniert nicht auf einem Mac OS-Rechner. Stattdessen muß man unter Linux bauen, ggf. auf demselben Rechner, auf dem auch Mac OS läuft.

+
+

Passende XCode-Versionen für Mac OS 10.9

+

XCode 4.2 oder älter sind nicht kompatibel mit OS X 10.9 ("Mavericks") und fallen daher ganz aus. Ansonsten gilt, daß man den ICS-Emulator nicht mit OS X 10.9 oder neuer bauen kann, und für das Gerät "flatfish" scheitert das Bauen mit allen Entwicklungsumgebungen der Versionen XCode 5.x.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ Version compatibility of OS X 10.9.x
 emulator (ICS)flatfish/vixen (JB-4.2)emulator-jb (JB-4.3)emulator-kk (KitKat-4.4)
XCode 4.3.3XXXX
XCode 4.4.1XO[1]OO
XCode 4.5.2XO[1]OO
XCode 4.6.3XO[1]OO
XCode 5.0.2XXOO
XCode 5.1.1XXOO
XCode 6.0.1XXXX
XCode 6.1beta2XXXX
+
    +
  1. You must have environment variable BUILD_MAC_SDK_EXPERIMENTAL=1 exported to build flatfish/vixen.
    2. +
+

Install XCode Command Line Utilities

+

You need to install Xcode's Command Line Utilities. You can download just the Command Line Utilities from Apple's developer downloads page for your particular version of OS X, however if you would like the entire Xcode suite of applications, you can install Xcode through the Mac App Store. 

+

Xcode 4.3.1 (OS X 10.7 "Lion") and other newer versions such as 4.4.1+ (that is, Mac OS X10.8 "Mountain Lion"), won't necessarily include the required Command Line Utilities. When you install Xcode, make sure to go into Preferences, then the Downloads panel, and install the Command Line Utilities. In addition, make sure you have at least 20 GB of free disk space.

+

Screenshot of Xcode Downloads Command Line Tools

+
+ Note: The Firefox OS emulator requires a Core 2 Duo processor or later; that is, a system that is compatible with Mac OS X 10.7 "Lion." You do not actually have to be running Lion, you just have to be compatible with it. You can, however, build any Firefox OS build on many older Macs.
+

Run Firefox OS Mac Bootstrap

+

Next, open a terminal and run the following command:

+
curl -fsSL https://raw.github.com/mozilla-b2g/B2G/master/scripts/bootstrap-mac.sh | bash
+

This will pull and run a bootstrap script that makes sure you have all the prerequisites met to build the emulator. It will also prompt you for permission to install anything you're missing, and provide warnings and suggested fixes to problems. The script will check for and install the following items:

+ +

Xcode wrangling

+

If you have already upgraded to Xcode 4.4+ and get the message that Xcode is outdated, check the Xcode path with:

+
xcode-select -print-path
+

If it still points to /Developer you can update the path with:

+
sudo xcode-select -switch /Applications/Xcode.app
+

Making the Mac OS X 10.6 SDK available

+

You also need to have the Mac OS X 10.6 SDK available. The SDK needs to be available at

+
/Applications/Xcode.app/Contents/Developer/Platforms/MacOSX.platform/Developer/SDKs/
+

If it cannot be found there you will need to extract and copy it from Xcode 4.3. To do this:

+
    +
  1. Download the XCode 4.3 .dmg file from the Apple Developer portal (you'll need an Apple Developer account).
    2. +
  2. Download the utility Pacifist and use it to extract the 10.6 SDK from the XCode 4.3 .dmg file. Click on the "Extract Package" button, find the SDK by searching for 10.6 in the search box, then Ctrl + click on the MacOSX10.6.sdk directory and Extract it to a suitable location.
    3. +
  3. Add a symlink from the 10.6 SDK location to the /Applications/Xcode.app/Contents/Developer/Platforms/MacOSX.platform/Developer/SDKs/ directory. For example, if you put the 10.6 SDK on your desktop, the comment would be
    4. +
+
ln -s /Users/<yourusername>/Desktop/MacOSX10.6.sdk /Applications/Xcode.app/Contents/Developer/Platforms/MacOSX.platform/Developer/SDKs/
+
+

Note: We can drop the 10.6 SDK requirement after bug 784227 has been fixed, and our version of platform_build has been updated.

+
+

Be aware of Mac file system case sensitivity

+

By default, Mac OS X ships with a case-insensitive file system.  This is problematic because the Linux kernel has a number of files with the same name, but different case.  For example, see the header files xt_CONNMARK.h and xt_connmark.h.  This results in a number of files appearing to be modified in /kernel after a fresh ./config.sh.

+

In many cases you can run the build just fine; for some platforms, however, you may encounter the following error:

+
ERROR: You have uncommited changes in kernel
+You may force overwriting these changes
+with |source build/envsetup.sh force|
+
+ERROR: Patching of kernel/ failed.
+

Please see bug 867259 for more discussion and possible fixes for this problem.

+

Alternatively, it will always be safest to build on a case sensitive file system.  The easiest way to do this is to create a separate, mountable disk image with case-sensitivity enabled.  You can do this using Apple's Disk Utility application or from the command line:

+
hdiutil create -volname 'firefoxos' -type SPARSE -fs 'Case-sensitive Journaled HFS+' -size 40g ~/firefoxos.sparseimage
+

Mount the drive with:

+
open ~/firefoxos.sparseimage
+

Change into the mounted drive with:

+
cd /Volumes/firefoxos/
+

You can then check out the code and compile from this location without worrying about case-sensitivity problems.

+

Mountain Lion homebrew gotcha

+
+
+ If you are on Mountain Lion and you receive an error during the installation of the dependencies via homebrew, such as:
+
+
+ 
clang: error: unable to execute command: Segmentation fault: 11
+ ... try reinstalling the dependency manually adding the --use-gcc flag, for example: + 
brew install mpfr --use-gcc
+
+

Follow Samsung Galaxy S2 extra steps

+

If you plan to build for the Samsung Galaxy S2, you will also need to install heimdall. See {{ anch("Installing heimdall") }} for details. This is not done for you by the bootstrap script!

+
+ Note: If you have installed the Samsung Kies tool, which is used to manage the contents of many Samsung phones, you will have to remove it before you can flash Firefox OS onto your device. You can use the standard application removal process on Windows; on Mac, the Kies install disk image has a utility to fully remove Kies from your system. Flashing will not work if you have Kies installed. If you forget to remove Kies, the build system will detect it and remind you to uninstall it. Note also that the uninstall tool does not correctly remove the folder ~/Library/Application Support/.FUS, and leaves a reference to a utility there in your user startup items list. You will want to remove these manually.
+

Fix libmpc dependency if broken

+

gcc 4.6 was built with libmpc 0.9; if you then use homebrew to update packages, libmpc gets updated to version 1.0, but homebrew doesn't rebuild gcc 4.6 after the library version changes. So you need to create a symlink to make things work again, like this:

+
cd /usr/local/lib/
+ln -s libmpc.3.dylib libmpc.2.dylib
+

Optional: Install HAX

+

Intel provides a special driver that lets the B2G emulator run its code natively on your Mac instead of being emulated, when you're using the x86 emulator. If you wish to use this, you can download and install it. It's not required, but it can improve emulation performance and stability.  

+

Before you install HAX you will need to install the Android SDK.

+

Install adb

+

The build process needs to pull binary blobs from the Android installation on the phone before building B2G (unless you're building the emulator, of course).  For this, you will need adb, the Android Debug Bridge.

+

You can download and install adb as part of the Android SDK package, for Mac, Linux or Windows - visit the Get the Android SDK page.

+

Newer Linux distributions have adb already in their repositories. For Ubuntu 12.10 and later, run the following command:

+
sudo apt-get install android-tools-adb
+

Or for Fedora 18/19:

+
sudo yum install android-tools
+

If your distribution does not have packages for adb available (i.e. Ubuntu 12.04 or Fedora 17), you'll need to install the Android SDK starter package for your platform (you'll want the ADT Bundle, not the SDK Tools Only option). Then run their package manager, $SDK_HOME/tools/android, and use the GUI to install "Android SDK Platform-tools".

+

Find out where adb is installed (usually in usr/bin, possibly additionally inside adt/platform-tools, depending on how you installed it). Be sure to add this directory to your PATH. This can be done by adding the line

+
PATH=$SDK_HOME:$PATH
+

replacing $SDK_HOME with the location of the android sdk, to your ~/.bashrc or equivalent.

+

Install heimdall

+

Heimdall is a utility for flashing the Samsung Galaxy S2. It's used by the Boot to Gecko flash utility to replace the contents of the phone with Firefox OS, as well as to flash updated versions of B2G and Gaia onto the device. You'll need it if you want to install Firefox OS on a Galaxy S2; it is not needed for any other device. For other devices, we build and use the fastboot utility instead.

+
+ Note: Again, it's important to note that this is only required for installing Firefox OS on the Samsung Galaxy S2.
+

There are two ways to install heimdall:

+ +

Configure ccache

+

The B2G build process uses ccache. The default cache size for ccache is 1GB, but the B2G build easily saturates this; around 3GB is recommended. You can configure your cache by running the following command inside terminal:

+
$ ccache --max-size 3GB
+

For Linux: configure the udev rule for your phone

+
+

Note: This section is specific to Linux; Mac OSX has the necessary device permissions set up already.

+
+

Next, you need to confingure the udev rule for your phone,

+

You can get the USB vendor ID by running lsusb with your phone plugged in, but typically it's Google 18d1, Samsung 04e8, ZTE 19d2, Geeksphone/Qualcomm 05c6. Add this line in your /etc/udev/rules.d/android.rules file (replacing XXXX with the ID for your device):

+
SUBSYSTEM=="usb", ATTR{idVendor}=="XXXX", MODE="0666", GROUP="plugdev"
+

Take ZTE for example, the content in android.rules will be

+
SUBSYSTEM=="usb", ATTR{idVendor}=="19d2", MODE="0666", GROUP="plugdev"
+
+

If the file doesn't exist, create it. The rules.d directory is usually read only by default, so you may have to use chmod to make the directory writeable, or the file, or both.

+
+

Once you've saved the file, and closed it,  make the file readable:

+
$ sudo chmod a+r /etc/udev/rules.d/android.rules
+
+

Now that the udev rules have been updated, restart the udev daemon. For ubuntu:

+
sudo service udev restart
+

Finally, unplug and the USB cable but don't replug it in because we need to enable remote debugging on the phone first.

+

Enable remote debugging

+

Before you plug your phone back into your USB port, put it USB developer mode. This allows you to debug and flash the phone. To enable developer mode, on your phone select Settings app -> Device information -> More Information -> Developer -> Remote debugging (this was called Developer mode on older versions.) Once the option is checked, remote debugging is enabled, and you are ready to go.

+

At this point, connect your phone to your computer via a USB cable (if you created the udev rule before, this will trigger udev to detect the phone and create the device node with the right permissions). Now you can check if you can list your device via the adb devices command. If everything has worked ok, you should see an output similar to this (the following is for a Geeksphone Keon):

+
$ adb devices
+List of devices attached
+full_keon       device
+

If the device did not list as expect, check the file name and the script are all correct (see previous section), then restart the computer and retype the command again. Note also that if your device uses fastboot, the bootloader may identify itself with a different vendor ID than the one you see when the device boots normally.

+

Backup the phone system partition

+
+

Note: You have to do this before you build your device if you do not have existing system backup. Because some libraries will be referenced in build time. These library might be proprietary so we can't provide in our code base.

+
+

It is recommended to back up the entire Android system partition on your phone.

+

You can use this copy of the binary blobs for Android in case you later delete your B2G tree. To do this, run:

+
adb pull /system <backup target dir>/system
+
+

 Depending on the phone, you may also need to pull the /data and/or /vendor directories:

+
adb pull /data <backup target dir>/data
+adb pull /vendor <backup target dir>/vendor
+
+

If the pull commands fail with "insufficient permission" message, try the following:

+ +

On to the next step

+
At this point, you should be ready to fetch the Firefox OS code!
diff --git a/files/de/archive/b2g_os/firefox_os_faq/index.html b/files/de/archive/b2g_os/firefox_os_faq/index.html new file mode 100644 index 0000000000..0cc309dbfe --- /dev/null +++ b/files/de/archive/b2g_os/firefox_os_faq/index.html @@ -0,0 +1,41 @@ +--- +title: Firefox OS FAQ DE +slug: Archive/B2G_OS/Firefox_OS_FAQ +translation_of: Archive/B2G_OS/Introduction +--- +
+
+ Wie bekomme ich ein Developer Preview Telefon?
+
+ Weitere Informationen werden bald auf der Geeksphone Website zur Verfügung stehen.
+
+ Wenn ich kein Entwickler-Telefon kaufen möchte, kann ich trotzdem eine App für Firefox OS entwickeln?
+
+ Selbstverständlich! Sie können die App über Android testen, oder auf dem Computer mit dem (using Marketplace for Firefox)  Firefox OS simulator.
+
+ Wann wird das "fertige" Telefon verfügbar sein?
+
+ Wir werden mit mehreren Partnern gemeinsam das Telefon auf den Markt bringen, jedoch besprechen wir uns diesbezüglich zu einem späteren Zeitpunkt nochmal.
+
+ Wo kann ich mir Firefox OS auf mein Handy laden?
+
+ https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Building_and_installing_Firefox_OS
+
+ Wie kann ich meine Firefox OS App testen?
+
+ Auf Android oder über unseren OS Simulator.
+
+ Was ist Firefox OS?
+
+ Es ist ein neues Handy-Betriebssystem, dass komplett auf offenen  Web-Standards basieren wird. Es ermöglicht für jede Geräte-Funktion (Telefonie, Messaging, Browsen usw.) eine eigenenständige auf dem HTML5-Standard basierende Applikation zu entwickeln, die grundsätzlich (theoretisch) auf jedem anderen Gerät (nur verfügbar in systemeigene Anwendungen) funktionieren würde.
+
+ Wie ist die Liste der vollständigen Web APIs; Werden diese standardisiert werden?
+
+ Eine große Anzahl von WebAPIs wird in die erste Implementierung des Firefox-OS aufgenommen werden. Eine vollständige Liste finden Sie auf
+
+ https://wiki.mozilla.orghttps://wiki.mozilla.org/WebAPI#APIs.
+
+ Sind die Web-APIs für den plattformübergreifenden Einsatz standardisiert?
+
+ Ja, die APIs sind das Ergebnis von Arbeiten mit mehreren Partnern, die bereits auch für andere Plattformen entwickelt haben. Das Umsetzen stellt in Bezug auf die unterschiedlichen Hardware-Anforderungen der Benutzer ein Problem dar, das nicht nur Mozilla beschäftigt. Unsere Anwendungen sind ein guter Anhalts&Ausgangspunkt für weitere zukünftige Plattformen und Entwicklungen.
+
diff --git a/files/de/archive/b2g_os/gaia/gaia_apps/index.html b/files/de/archive/b2g_os/gaia/gaia_apps/index.html new file mode 100644 index 0000000000..e4f64963a0 --- /dev/null +++ b/files/de/archive/b2g_os/gaia/gaia_apps/index.html @@ -0,0 +1,86 @@ +--- +title: Gaia apps +slug: Archive/B2G_OS/Gaia/Gaia_apps +translation_of: Archive/B2G_OS/Platform/Gaia/Gaia_apps +--- +
+

Gaia is the front-end of Firefox OS, which contains system administration functionality and the built-in suite of apps shipped with Firefox OS devices. All the Gaia source code — even the system, and keyboard IMEs — is fully implemented with HTML5 (HTML + CSS + JavaScript) & Open WebAPIs. This set of documents contains information on how each of the default apps available in the Gaia family works.

+
+ +

Gaia functionality categories

+ +

The different apps inside Gaia can be roughly categorized into the groups listed below.

+ +
+

Note: Many of the pages linked to for more explanation of how the individual apps work are README pages inside the Gaia Github repo. This is because many of the apps are on rapid development cycles and therefore subject to rapid (often daily) change, so it would make little sense to try to keep MDN pages updated with these changes. The engineer-maintained README pages are currently the most accurate source of information.

+
+ +

Platform

+ +

Including the System, Settings, Lockscreen, build scripts, and Bluetooth apps.

+ +

+ +

Platform apps: further explanation

+ +
+
System
+
The System app is the first web app loaded by Gecko during the Firefox OS bootup procedure, and it handles numerous responsibilities that are required generally for the running of the system, and are therefore not scoped per individual web app.
+
Browser
+
The Browser app (which is now part of System) provides browser-like functionality where it is needed — including page navigation, search and bookmarks.
+
Window Management
+
Firefox OS's window management functionality — including app life cycle and interaction, notifications, animations and much more — is handled by a specific part of the System app. This article looks at Firefox OS Window Management in detail.
+
Settings
+
The Settings app allows Firefox OS users to configure device settings, and responds to incoming activities (Web activities with a name of configure), which allows other apps to jump to different panels inside the Settings app to handle configuration as required (for example showing the wifi settings panel if no data connection is available.)
+
+ +

Communication

+ +

Including the Dialer, Contact, SMS apps and FTU apps.

+ +

+ +

Communication apps: further explanation

+ +

TBD

+ +

Productivity

+ +

Including the Email, Calendar, and Clock apps.

+ +

+ +

Productivity apps: further explanation

+ +
+
Calendar
+
The Firefox OS built-in calendar app.
+
Clock
+
Firefox OS's default Clock app, which includes alarm, timer and stopwatch functionality.
+
Email
+
The Gaia e-mail app.
+
+ +

Media

+ +

Including the Camera, Gallery, Music, and Video apps, and some media related functions such as forward lock DRM and wallpapers.

+ +

+ +

Media apps: further explanation

+ +
+
Video
+
Video is a simple video player app that will play videos present on your Firefox OS device's storage media.
+
Camera
+
Camera allows Firefox OS users to capture and manage videos and photos from the device camera(s), and responding the Web activities of type pick from other apps that want to grab media using Camera's functionality.
+
+ +

Other Gaia features

+ +

Besides these functions, there are several other major features such as browser, homescreen, marketplace, test framework, PDF viewer, and app manager, which are developed closely alongside Gaia.

+ +
+
pdf.js
+
pdf.js is an HTML5-based PDF viewer, used inside Gaia for viewing PDFs. Note that the codebase for pdf.js is maintained in a separate repo, outside Gaia.
+
diff --git a/files/de/archive/b2g_os/gaia/hacking/index.html b/files/de/archive/b2g_os/gaia/hacking/index.html new file mode 100644 index 0000000000..64b9be9f79 --- /dev/null +++ b/files/de/archive/b2g_os/gaia/hacking/index.html @@ -0,0 +1,181 @@ +--- +title: Hacking Gaia +slug: Archive/B2G_OS/Gaia/Hacking +translation_of: Firefox_OS/Developing_Gaia +--- +

Gaia ist die Sammlung von Webapps, die das Front-End des Firefox OS (Codename Boot to Gecko) bilden.

+

Alles was Sie auf dem Bildschirm von Firefox OS sehen, inklusive dem Homescreen, wurde nur mit Hilfe von freien Web-Technologien erstellt, 

+

 

+

Quellcode besorgen

+

To get the source code for Gaia, fork us on GitHub and then clone your fork using git.

+
$ git clone https://github.com/username/gaia.git
+

Gaia starten

+

Sie können Gaia entweder auf Ihrem Desktop nutzen oder mit einem kompatiblem mobilen Gerät.

+

 

+

B2G Desktop

+

B2G Desktop is a desktop build of the app runtime used on Firefox OS devices which you can use to run Gaia on your desktop computer.

+

You can download a nightly build of B2G Desktop from here. Currently we recommend installing the latest beta build for your platform. There are builds for Linux (32 bit and 64 bit), OS X and Windows.

+

Nightly builds come packaged with a recent version of gaia. Once you've downloaded the archive, all your need to do is extract it to a folder and run the b2g binary from the extracted folder.

+

Note: 64 bit Linux builds do not currently work on some distributions, this is bug 812484. If you have problems try a 32-bit build instead.

+
$ cd b2g
+$ ./b2g
+

To run B2G with your own version of Gaia for development purposes you first need build a profile from your clone:

+
$ cd /path/to/gaia
+$ DEBUG=1 make
+

This will generate a directory in your gaia directory called "profile". The DEBUG part runs Gaia as hosted apps on a built-in web server, rather than the default packaged apps which have to be re-packaged after every change.

+

Note: Debug builds are currently broken on B2G Desktop, so until bug 816957 is fixed you need to run "make" without the "DEBUG=1" part, then re-run make every time you make a change to Gaia.

+

 

+

You can then run B2G Desktop with your generated profile like so:

+
$ /path/to/b2g/b2g-bin -profile /path/to/gaia/profile
+

If you want to you can build your own B2G Desktop from source.

+

B2G Device

+

 

+

If you have a compatible mobile device you can also run Gaia by flashing it with Firefox OS. Please see documentation here.

+

There is also documentation here about testing changes on your device.

+

Unit Tests

+

 

+

See here for information about writing and running unit tests for Gaia.

+

Filing Bugs

+

 

+

Bugs are filed on Bugzilla under Boot2Gecko > Gaia.

+

File a new bug under the Gaia component (or one of the sub-components) here.

+

Contributing Code

+

 

+

Mozilla depends on contributions from the open source community to help develop Gaia apps and we'd love you to get involved.

+

Some great places to find some bugs to start hacking on:

+ +

Coding Style

+

 

+ + + + + + + + +

Bad:

+
if (expression) doSomething();
+
+

Correct:

+
if (expression)
+  doSomething();
+

 

+

If you're working on the system app, check out the guidance listed here.

+

Before submitting a patch we recommend you run gjslint on it to check for any style errors:

+

 

+
gjslint --nojsdoc my_file.js
+

 

+

Submitting a Patch

+

First file or assign a bug to yourself on Bugzilla, you'll need a Bugzilla account.

+

Then create a branch on your fork of Gaia:

+
$ git branch branchname
+$ git checkout branchname
+

Commit your changes:

+
$ git add /file/to/add
+$ git commit -m "commit message including bug number"
+

Push your branch:

+
$ git push origin branchname
+

Send a pull request by navigating to the branch in your fork on GitHub and finding the pull request button.

+

To request a review of your patch, add an attachment to the bug in Bugzilla referencing the URL of the pull request and set the review ("r") flag to "?" and enter the bugzilla ID of one of the module owners and peers listed here.

+

The reviewer may ask you to make some changes. Once they're is happy with your patch, they will merge it into the master branch for you. Before they do this they would prefer it if you could squash all your changes into a single commit and add "r=reviewername" to the end of the commit message.

+

Contacting the Team

+

 

+ +

Tips

+

Linux B2G Desktop support

+

 

+

The homescreen is empty

+

Currently, under Linux, OOP frame aren't rendered properly. The homescreen isn't actually rendered here...

+

If you just want to happily hack on pure UI (css and JS) you can safely run with OOP disabled and avoid those issues. Change the line in build/settings.py

+
 "debug.oop.disabled": False,
+
+

to

+
 "debug.oop.disabled": True,
+
+

To the profile/user.js in your gaia directory.

+

Port Forwarding

+

 

+

To forward the socket on the phone to the desktop (for desktop development), you first need to get rilproxy to expose it as such, rather than exposing it to Gecko. In the gaia directory:

+
 $ make forward
+
+

This runs the commands:

+
$ adb shell touch /data/local/rilproxyd
+$ adb shell killall rilproxy
+$ adb forward tcp:6200 localreserved:rilproxyd
+
+

The file located at /data/local/rilproxyd will be deleted once the rilproxy daemon will start again. As a consequence you have to do this manipulation every time your device restarts.

+

Restarting B2G on a device from the desktop

+

 

+
adb shell killall b2g
+
+

B2G Desktop JavaScript Console

+

 

+

You can run B2G Desktop with the JavaScript console by using the -jsconsole flag

+
$ /path/to/b2g-bin -jsconsole
+
+

Launching an app directly

+

 

+

A "--runapp" option has been added to the B2G Desktop command-line to automatically start an application. The system app is loaded and everything happens like normal; this is not like the old trick where we loaded your app instead of the system app.

+

"--runapp" takes an argument that it normalizes by lower-casing and removing dashes and spaces, and then checks the argument against the similarly normalized app names from app manifests. For example, the name of the e-mail app is currently "E-Mail", but "--runapp email" will run it. Partial matching is not supported right now, but you can enhance b2g/chrome/content/runapp.js if your app name is unwieldy.

+

If you invoke "--runapp" without an argument (or an empty argument), the command will print out a list of all the apps it knows about as well as a brief usage message.

+

One important note is that this command disables the lock-screen as part of its magic and does not re-enable it. The assumption is that you won't use this command on a profile where you are testing the lock screen, or will turn it back on manually. Feel free to enhance the command to behave better if this is a problem for you.

+

In summary:

+
./b2g -profile /path/to/your/gaia/profile --runapp email
+
+

runs the e-mail app.

+

reset-gaia and install-gaia make targets

+

 

+

The reset-gaia and install-gaia make targets can be used interchangeably. reset-gaia will purge all the existing profiles, database before push Gaia from your working directory (new setting database will also be initialized); install-gaia will just push updates of Gaia.

+

Blank screen when B2G Desktop starts

+

 

+

When you start b2g using b2g -profile $GAIA/profile a blank screen shows up and you see an error Cannot reach app://system.gaiamobile.org. To fix this there are a couple of things you can check

+ +

Diagnosing OOM problems

+

 

+

From Cjones:

+

Another way to diagnose possible OOMs is to open a terminal and run

+

$ watch -n 1 'adb shell b2g-procrank'

+

If you see the "USS" of one of the app processes go up near 100MB and then that process disappear from the process list (accompanied by some sort of visual crash in gaia), then you've almost certainly seen an OOM kill.

+

 

+

 

+

 

+

 

+

 

+

 

diff --git a/files/de/archive/b2g_os/gaia/index.html b/files/de/archive/b2g_os/gaia/index.html new file mode 100644 index 0000000000..1405dd58c9 --- /dev/null +++ b/files/de/archive/b2g_os/gaia/index.html @@ -0,0 +1,56 @@ +--- +title: Gaia +slug: Archive/B2G_OS/Gaia +tags: + - B2G + - Gaia + - Mobile +translation_of: Archive/B2G_OS/Platform/Gaia +--- +

Gaia ist die Benutzeroberfläche von Firefox OS. Alles was auf dem Bildschirm nach dem Start von Firefox OS erscheint, wird von Gaia gemalt. Einschließlich des Sperrbildschirmes, Homescreen, Dialer und anderen Programmen. Gaia ist komplett in HTML, CSS, und JavaScript geschrieben. Seine einzige Schnittstelle zu dem zugrunde liegenden Betriebssystem und Hardware wird über Standart Web APIs ermöglicht, welche von Gecko implementiert werden.

+

Wegen diesem Aufbaus kann Gaia nicht nur auf Firefox OS Geräten, sondern auch auf anderen Betriebssystemen und Webbrowsern (wenn auch, je nach Fähigkeiten des Browsers, möglicherweise Eingeschränkt) betrieben werden.

+

Anwendungen von Drittanbietern, welchen neben Gaia installiert wurden, können von Gaia gestartet werden.

+ + + + + + + +
+

Dokumentationen über Gaia

+
+
+ Einführungen zu Gaia
+
+ Gaia ist die Benutzeroberfläche für Firefox OS Geräte; Es ist eine Internetapplikation welche auf der Firefox OS Applikationsumgebung läuft. Dieses Handbuch bietete eine Einführung zu Gaia auf einem hohen Niveau.
+
+ Gaia hacking guide
+
+ Ein Leitfaden für Hacking und Modifizierung der Gaia-Schnittstelle.
+
+

View All...

+ 		+

Hilfe von der Community

+

Wenn du mit Gaia, oder an Gaia Anwendungen arbeitest, könnten dir diese Community-Ressourcen helfen!

+
    +
  • Besuche das Boot to Gecko Projekt Forum: {{ DiscussionList("dev-gaia", "mozilla.dev.gaia") }}
    • +
+
    +
  • Stelle deine Fragen im Mozilla's Gaia IRC channel: #gaia
    • +
+

Don't forget about the netiquette...

+
+ + +

Ressourcen

+ +
+

 

diff --git a/files/de/archive/b2g_os/gaia/introduction_to_gaia/index.html b/files/de/archive/b2g_os/gaia/introduction_to_gaia/index.html new file mode 100644 index 0000000000..2b121e8274 --- /dev/null +++ b/files/de/archive/b2g_os/gaia/introduction_to_gaia/index.html @@ -0,0 +1,35 @@ +--- +title: Introduction to Gaia +slug: Archive/B2G_OS/Gaia/Introduction_to_Gaia +translation_of: Archive/B2G_OS/Platform/Gaia/Introduction_to_Gaia +--- +
+

Gaia is the user interface for Boot to Gecko (B2G); it's a set of Web applications that runs locally on a B2G device, emulator, desktop build, or Firefox build. All you need to know in order to add apps or make changes to Gaia are Web technologies like JavaScript, HTML, and CSS.

+
+ +

The Gaia lock screen

+ +

The lock screen shows the network carrier, current time and date, and a slidebar allowing the user to unlock the phone or go straight to the camera to take a picture. If the user has got a passcode lock set, the lock screen will also show a passcode entry interface.

+ +

+ +

Note that on some devices the passcode is enabled by default; in these cases the default PIN to unlock the device is "0000". This most likely will change over time as this feature is fleshed out.

+ +

The default Gaia interface

+ +

The default interface in Gaia, as seen here, is similar to what you see on most typical smartphones.

+ +

+ +

This image is obviously of a prerelease version of the operating system, with placeholder icons (and some test applications). The status bar at the top indicates the network on which the phone is operating (or "No SIM card" for a device without any network), the network strength, WiFi signal strength, battery level, and current time.

+ +

The middle area of the display shows icons for the applications; swiping left and right pages through screens of icons. You can find more about the default suite of apps that comes with Gaia on our Gaia apps page.

+ +

At the bottom of the screen is a dock with room for up to seven of your most commonly used applications. You can drag and drop apps to the dock from the middle area.

+ +

See also

+ + diff --git a/files/de/archive/b2g_os/gaia_entwickeln/build_system_primer/index.html b/files/de/archive/b2g_os/gaia_entwickeln/build_system_primer/index.html new file mode 100644 index 0000000000..8f6f0c7379 --- /dev/null +++ b/files/de/archive/b2g_os/gaia_entwickeln/build_system_primer/index.html @@ -0,0 +1,190 @@ +--- +title: 'Gaia Build System: Grundlagen' +slug: Archive/B2G_OS/Gaia_Entwickeln/Build_System_Primer +tags: + - Building + - Firefox OS + - Gaia Grundlagen + - Gaia build +translation_of: Archive/B2G_OS/Developing_Gaia/Build_System_Primer +--- +
+

Dieser Artikel beschreibt die grundlegende Funktionsweise des Gaia Build Systems inklusive make-Datei, Build-Prozess, Umgebungsvariablen und Anpassungsmöglichkeiten.

+
+ +

Die wichtigen Schritte eines Builds werden größtenteils von den im Gaia-Unterverzeichnis build/ liegenden Skripten erledigt. Augerufen werden diese mit make, node.js und XPCShell (auch bekannt als JS Shell), einer Laufzeitumgebung von XULRunner. Das Gaia Build System enthält viele Werkzeuge zum Installieren, Testen und Lokalisieren von Apps und um diese als Paket auf ein Gerät zu bringen. Zudem können Entwickler das Gaia-Paket anpassen, z.B. können Hintergrundbilder, Klingeltöne, Apps und Einstellungen geändert werden.

+ +
+

Hinweis: XPCShell ist ähnlich wie node.js, bietet aber zusätzlich die Möglichkeit zum Ausführen von Mozilla-spezifischen javascripts. Zudem können Gaia-Skripte mit Hilfe von XPCShell in einer Firefox Erweiterung laufen.

+
+ +

Die make-Datei

+ +

Die make-Datei enthält eine Menge nützlicher Funktionen. Dieses Kapitel bechreibt die nützlichsten davon.

+ +

install-gaia

+ +

Gestartet mit dieser Option installiert make alle Apps auf Deinem Gerät. Wenn Du nur eine bestimmte App installieren möchtest, dann starte make wie folgt mit der APP Option:

+ +
APP=calendar make install-gaia
+ +

Dieses Verzeichnis muss im Gaia-Verzeichnisbaum existieren (z.B. apps).

+ +

reset-gaia

+ +

Funktioniert genauso wie install-gaia mit dem Unterschied, dass zuerst alle Apps deinstalliert und anschließend wieder mit den Standard-Zugriffsrechten installiert werden. Die Apps befinden sich in /data/local wie bei den Entwickler-Builds. Test- und Debugging-Apps werden hier ebenfalls installiert.

+ +
+

Vorsicht: Wenn beim Aufruf von make mit der Option reset-gaia die Umgebungsvariable APP gesetzt ist, dann wird dies Dein Gerät in einen unbrauchbaren Zustand versetzen (das kann allerdings behoben werden durch Aufruf von make mit der Option reset-gaia ohne die APP Umgebungsvariable). Also mach das bitte nicht.

+
+ +

production

+ +

Genauso wie reset-gaia, aber der Quellcode wird optimiert. Das ermöglicht grundsätzlich die Emulation von User Builds (stabilen Builds). Mit dieser Option werden dieselben Apps installiert wie bei User Builds.

+ +
+

Vorsicht: Wenn beim Aufruf von make mit der Option production die Umgebungsvariable APP gesetzt ist, dann wird dies Dein Gerät in einen unbrauchbaren Zustand versetzen (das kann allerdings behoben werden durch Aufruf von make mit der Option production ohne die APP Umgebungsvariable). Also mach das bitte nicht.

+
+ +

reference workloads

+ +

Diese Option installiert unterschiedlich große Pakete für Laufzeittests auf dem Gerät, um eventuell auftretende Geschwindigkeits- und Skalierungsprobleme debuggen und beheben zu können. Diese Option akzeptiert die APP Umgebungsvariable und auch die APPS Umgebungsvariable mit mehreren durch Leerzeichen voneinander getrennten App-Namen, z.B.:

+ +
APP=sms make reference-workload-light
+APPS="sms communications/contacts" make reference-workload-heavy
+
+ +
+

Hinweis: Weitere Informationen findest Du auf Hacking Gaia: Reference workloads.

+
+ +

Umgebungsvariablen

+ +

Mit einigen Umgebungsvariablen kannst Du den Build und die Installation auf dem Gerät steuern, z.B.:

+ +

P=1

+ +

Das ermöglicht parallele Build-Erzeugungen auf Multikern CPU Architekturen und verkürzt die Laufzeit von Build-Erzeugungen, der Standardwert ist 0.

+ +
+

Vorsicht: Parallele Build-Erzeugung ist noch in der Test-Phase und somit vielleicht nicht stabil.

+
+ +

GAIA_OPTIMIZE=1

+ +

Hiermit wird eine Optimierung der JavaScript Dateien angestossen. Diese Umgebungsvariable wird automatisch beim Ausführen von make production gesetzt. Die Variable kann für install-gaia und reset-gaia verwendet werden.

+ +

PRODUCTION=1

+ +

Das ist im Grunde ein Alias für make production.

+ +

DEBUG=1

+ +

Mit dieser Umgebungsvariablen wird eine Debugging-Umgebung aufgebaut, die Du für Gaia unit tests oder für die Entwicklung eigener Apps in Firefox OS nutzen kannst. Du musst ein bereits bestehendes Debugging-Profilverzeichnis löschen, bevor Du ein neues generieren kannst.

+ +

DEVICE_DEBUG=1

+ +

Deaktiviert die Bildschirmsperre auf dem Gerät.

+ +

GAIA_DEVICE_TYPE=phone

+ +

Diese Umgebungsvariable ermöglicht eine individuelle Installation mit mehreren 'app.list' Dateien. Alle 'app.list' Dateien müssen in /build/config/$(GAIA_DEVICE_TYPE)/  Verzeichnissen liegen.

+ +

Der Standardwert von GAIA_DEVICE_TYPE ist phone.

+ +
+

Hinweis: Weitere Details und optionen findest Du auf Hacking Gaia make options.

+
+ +

Build-Prozess

+ +

Das Ablaufdiagramm, wie ein Build für Gaia erzeugt wird:

+ +

+ +

pre-app.js, app.js & post-app.js werden von make gestartet und die meisten Build-Schritte werden in den xpcshell Skripten ausgeführt, make ermittelt das Betriebssystem und lädt den b2g-desktop herunter. Wir planen, mehr Build-Schritte von make in die xpcshell Skripte zu migrieren.

+ +

Vielleicht fragst Du Dich, warum wir pre-app, app and post-app nutzen. Das liegt daran, dass wir immer mehr Abhängigkeiten von make in die xpcshell Skripte verlagern. Deshalb entwickelten wir pre-app.js und post-app.js basierend auf  bug 1021051, um den Großteil der Abhängigkeiten in die xpcshell Skripte zu verlagern. Am Ende werden dann app.js, pre-app.js und post-app.js auf Basis von  bug 1053703 migriert.

+ +

Wir haben drei Typen von Verzeichnissen in einem Gaia Build System:

+ +
    +
  1. Source-Verzeichnisse: apps, dev_apps, gemeinsame Verzeichnisse
    2. +
  2. Stage-Verzeichnis: build_stage (stage = Plattform)
    3. +
  3. Profil-Verzeichnisse: profile, profile-debug oder profile-test
    4. +
+ +

Unser Ziel ist es, keine Dateien in die Source-Verzeichnisse hinein zu generieren. Leider haben wir immer noch ein paar Stellen, an denen Dateien in die Source-Verzeichnisse generiert werden. Wir planen, diese Probleme zu beheben. Die folgende Tabelle listet auf, von welchen Modulen Dateien ins Source-, ins Stage- und in die Profil-Verzeichnisse generiert werden.

+ +

+ +

Der Build-Prozess führt bei Aufruf von make im Gaia-Verzeichnis die folgenden Schritte in der angegebenen Reihenfolge aus:

+ +
    +
  1. b2g_sdk: b2g-desktop startet die xpcshell Skripte in GAIA_DIR/build/.
    2. +
  2. svoperapps: Download der Apps und Generieren der Konfigurations-Dateien der App-Installation pro SIM-Karten-Anbieter und Land.
    3. +
  3. webapp-manifests: Generieren der Metadaten der Web-Apps für den Build.
    4. +
  4. keyboard-layouts: Generieren der Layout-Konfiguration der Standard-Tastatur.
    5. +
  5. settings.json (settings.js): Dieses JavaScript generiert die Standard-Einstellungen für Firefox OS, die von Gaia gelesen werden.
    6. +
  6. webapp-shared: Kopieren der von den Apps benötigten Dateien vom gemeinsamen Source-Verzeichnis ins Stage-Verzeichnis.
    7. +
  7. preferences: Generiert die Standard-Umgebung für Firefox OS; generiert die Datei user.js und kopiert diese auf das Gerät, wo sie von Gecko gelesen wird. Bitte beachte, dass die Standard-Umgebung abhängig von den Umgebungsvariablen (wie z.B. DEBUG=1) variieren kann.
    8. +
  8. app.js: make-Dateien in den jeweiligen app Verzeichnissen: Sie werden ausgeführt, wenn sie existieren. Für jede App ohne eigene make-Datei kopiert die Gaia make-Datei das App-Verzeichnis ins Stage-Verzeichnis build_stage und führt [app-directory]/build/build.js aus, falls vorhanden. Siehe {{ anch("Build script for apps") }} für weitere Details.
    9. +
  9. test-agent-bootstrap & test-agent-config: Einrichten der zwei make Regeln test-agent-config & test-agent-bootstrap-apps, welche für den Aufbau von Test-Umgebungen pro App benötigt werden.
    10. +
  10. webapp-optimize: Dieses Skript enthält verschiedene Optimierungs-Prozeduren inklusive JavaScript Minimierung, Zusammenfügen von Lokalisierungs-Dateien in die JSON-Dateien und Generieren von HTML-Dateien für die Standard-Sprache, falls nötig.
    11. +
  11. webapp-zip: Hier wird jede App in eine eigene zip-Datei komprimiert und diese im Verzeichnis profile/ abgelegt.
    12. +
  12. optimize-clean: optimize-clean bereinigt die HTML-Dateien für die Standard-Sprache.
    13. +
  13. contacts: Kopiert eine vorgefertigte Kontakte-Datei in Dein Profil in GAIA_DISTRIBUTION_DIR, falls vorhanden.
    14. +
  14. extensions: Kopiert die in GAIA_DIR/tools/extensions liegenden Erweiterungen in Dein Profil-Verzeichnis; verschiedene Konfigurationen ermöglichen das Kopieren verschiedener Erweiterungen.
    15. +
  15. installed-extensions.json (additional-extensions.js): Zu guter Letzt: Dieses Skript kopiert per Download verschiedene zusätzliche Erweiterungen in Dein Profil-Verzeichnis.
    16. +
+ +

Build-Skript für Apps

+ +

Standardmäßig wird als App Build Skript [app directory]/build/build.js von  app.js ausgeführt, falls vorhanden. Wenn $APP/build/build.js nicht vorhanden ist, dann kopiert app.js die App ins Stage-Verzeichnis build_stage.

+ +

Die Dateien im App-Verzeichnis sollten vom App Build-Skript ins Stage-Verzeichnis build_stage kopiert werden; denn app.js kopiert sie nicht, wenn ein App Build-Skript existiert. Beispiel: Die App "Kalender" hat ein Skript build/build.js und utils.copyToStage() sollte in build.js für die "Kalender" App aufgerufen werden.

+ +
+

Hinweis: Sourcen, die nicht zu Deiner App gehören (wie in shared/) kannst Du in der index.html in den <head> Bereich einfügen, damit sie von shared/ in Deine App kopiert werden.

+
+ +

Build-Skripte für Apps benötigen möglicherweise alle Build Module im Verzeichnis  $GAIA_DIR/build; speziell das utils Modul, ein sehr nützliches Modul für den Build von Apps, kannst Du require('utils') verwenden um das Modul einzubinden.

+ +

+ +

Anpassen der Voreinstellungen

+ +

Wenn Du eine eigene Konfiguration mit Einstellungen und Apps immer wieder beim Flashen Deines Gerätes benötigst, dann kannst Du eine Datei namens custom-prefs.js mit all Deinen Präferenzen im Verzeichnis build/config ablegen. Dort ist sie vor Überschreiben geschützt und unterliegt nicht der Source-Steuerung.

+ +

Hier sind einige sinnvolle Voreinstellungen:

+ +
// Aktivieren von marionette für Performance-Tests
+// siehe https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Platform/Testing/Gaia_performance_tests
+user_pref("marionette.defaultPrefs.enabled", true);
+
+// Setzen des Ports für remote Debugging Deiner Anwendung auf Deinem Gerät
+user_pref("devtools.debugger.remote-port", 60000);
+
+// Aktivieren des remote Debuggers
+user_pref("devtools.debugger.remote-enabled", true);
+
+// Ausgeben der Debug-Meldungen über den Radio Interface Layer in logcat
+user_pref("ril.debugging.enabled", true);
+
+ +

Diese Datei wird immer gelesen, wenn Du ein Profil generierst. Der sicherste Weg sicherzustellen, dass alles generiert wurde ist das vorherige Löschen des vorhandenen Profils:

+ +
rm -rf profile && make profile
+ +

Anschließend kannst Du beruhigt die install-gaia Option von make verwenden.

+ +

FAQ

+ +

Das Display bleibt Schwarz nach einem flash

+ +

Das kann manchmal passieren, wenn das Gerät im Ruhemodus geflasht wird. Um das Problem zu beheben starte B2G einfach durch das folgende Kommando neu:

+ +
adb shell stop b2g && adb shell start b2g
+ +


+  

diff --git a/files/de/archive/b2g_os/gaia_entwickeln/customizing_build-time_apps/index.html b/files/de/archive/b2g_os/gaia_entwickeln/customizing_build-time_apps/index.html new file mode 100644 index 0000000000..928799c864 --- /dev/null +++ b/files/de/archive/b2g_os/gaia_entwickeln/customizing_build-time_apps/index.html @@ -0,0 +1,117 @@ +--- +title: 'Gaia-Apps: Build anpassen' +slug: Archive/B2G_OS/Gaia_Entwickeln/Customizing_build-time_apps +tags: + - Anpassung + - Apps + - Firefox OS + - Gaia + - build +translation_of: Archive/B2G_OS/Developing_Gaia/Customizing_build-time_apps +--- +
+

Entwickler und Geräte-Hersteller wollen die App-Pakete oftmals beim Erzeuen eines Builds aus verschiedenen Gründen anpassen. Dieser Artikel erklärt die unterschiedlichen Mechanismen dafür.

+
+ +

Pfade für App-Dateien in Gaia

+ +

Alle Firefox OS Apps befinden sich in einem der folgenden Pfade im Gaia Verzeichnisbaum:

+ + + +

Falls Du in Deinem Gaia/B2G Build Apps herauslassen oder hinzufügen möchtest, dann kannst Du das auf verschiedene Weise tun. Details dazu werden nachfolgend erläutert.

+ +

Die harte Methode

+ +

Bei der harten Methode werden einfach die Apps gelöscht, die man nicht in den Build mit einbeziehen will.

+ +

Anpassen der Konfigurations-Dateien

+ +

Die etwas elegantere Methode ist das Anpassen der apps-*.list Dateien (zu finden in den verschiedenen gerätespezifischen Verzeichnissen, die in gaia/build/config/ aufgelistet sind, z.B. phone/ und tablet/), um die für den Build gewünschten Apps zu konfigurieren. Zum Beispiel könnte die Konfigurations-Datei gaia/build/config/phone/apps-production.list wie folgt aussehen:

+ +
apps/bluetooth
+apps/bookmark
+apps/browser
+apps/calendar
+apps/callscreen
+etc.
+ +

Du kannst hier auch alle Apps eines Verzeichnisses einbinden, und zwar so:

+ +
apps/*
+ +

Welche apps-*.list Dateien wiederum für den Build verwendet werden um die verfügbaren Apps zu ermitteln ist in der Datei gaia/Makefile hinterlegt, die etwa so aussieht:

+ +
GAIA_DEVICE_TYPE?=phone
+  ...
+GAIA_APP_TARGET?=engineering
+  ...
+ifeq ($(MAKECMDGOALS), demo)
+GAIA_DOMAIN=thisdomaindoesnotexist.org
+GAIA_APP_TARGET=demo
+else ifeq ($(MAKECMDGOALS), dogfood)
+DOGFOOD=1
+else ifeq ($(MAKECMDGOALS), production)
+PRODUCTION=1
+endif
+  ...
+ifeq ($(PRODUCTION), 1)
+GAIA_OPTIMIZE=1
+GAIA_APP_TARGET=production
+endif
+
+ifeq ($(DOGFOOD), 1)
+GAIA_APP_TARGET=dogfood
+endif
+  ...
+ifndef GAIA_APP_CONFIG
+GAIA_APP_CONFIG=build$(SEP)config$(SEP)apps-$(GAIA_APP_TARGET).list
+endif
+ +

Standardmaßig ist die Variable GAIA_APP_TARGET auf engineering gesetzt und die Variable GAIA_DEVICE_TYPE auf phone, so dass beim Build von Gaia per Default die Datei gaia/config/phone/app-engineering.list verwendet wird (die alle Apps enthält, u.a. auch Test- und Demo-Apps).

+ +

Um andere apps-*.list Dateien zu verwenden musst Du entsprechende Parameter beim Aufruf des make Kommandos mitgeben. Um z.B. den Build mit gaia/build/config/phone/apps-production.list zu starten müsstest Du das hier verwenden:

+ +
PRODUCTION=1 make
+ +

Wenn Du den Build mit DEMO=1 startest, dann wird die Datei apps-demo.list verwendet. Und wenn Du den Build mit DOGFOOD=1 startest, dann wird die Datei apps-dogfood.list verwendet.

+ +

Du kannst dieses Verhalten komplett übersteuern, indem Du die Variable GAIA_APP_CONFIG in der Datei gaia/Makefile änderst und dort eine eigene apps-*.list Datei einträgst.

+ +

gaia/Android.mk enthält diese Zeilen:

+ +
ifneq ($(filter user userdebug, $(TARGET_BUILD_VARIANT)),)
+GAIA_MAKE_FLAGS += PRODUCTION=1
+B2G_SYSTEM_APPS := 1
+endif
+ +

Wenn Du den Build mit VARIANT=user oder VARIANT=userdebug startest (dieses Übersteuern spiegelt sich auch in der Variable TARGET_BUILD_VARIANT wieder), dann wird PRODUCTION=1 automatisch gesetzt.

+ +
+

Hinweis: Weitere Optionen für make findest Du in der make options reference.

+
+ +

Verwenden eigener Distributionen

+ +

Die dritte und eleganteste (allerdings auch komplexeste) Methode ist das Verwenden eigener Distributionen. Dies ermöglicht das Einbinden eigener Konfigurationen und Pakete ohne das Gaia Paket selbst zu ändern. Du kannst für Deine angepassten Konfigurationen und Pakete eigene Verzeichnisse oder die mit Gaia ausgelieferten Verzeichnisse verwenden.

+ +

Du kannst Deine Distribution durch Setzen der Umgebungsvariable GAIA_DISTRIBUTION_DIR in den Build einbinden, zum Beispiel so:

+ +
GAIA_DISTRIBUTION_DIR=<DISTRIBUTION_PATH> make production
+ +

Mehr Informationen zum Erstellen individueller Distributionen findest Du auf https://github.com/mozilla-b2g/gaia/tree/master/customization.

+ +

Dieses komplexe Thema hat eine komplett eigene Dokumentation. Mehr zum Thema erfährst Du unter Market Customizations guide.

+ +
+

Hinweis: Wenn Du Apps von Drittanbietern in Deinen Gaia Build einbinden willst, dann müssen diese auf spezielle Art erzeugt werden bevor sie im Verzeichnis gaia/dev-apps/ abgelegt werden. Nähere Informationen findest Du auf Building Prebundled web apps.

+
+ +
+

Wichtig: Wenn Sie als Geräte-Hersteller einen angepassten B2G/Gaia Build für Ihre Distribution verwenden möchten, dann müssen Sie bestimmte Voraussetzungen erfüllen bevor Sie Firefox OS Marketplace Apps auf Ihrem Smartphone, Tablet etc. anbieten dürfen. Bitte kontaktieren Sie in einem solchen Fall Mozilla für nähere Informationen.

+
+ +

 

diff --git a/files/de/archive/b2g_os/gaia_entwickeln/durchfuehrung_der_gaia_codebase/index.html b/files/de/archive/b2g_os/gaia_entwickeln/durchfuehrung_der_gaia_codebase/index.html new file mode 100644 index 0000000000..eef4cb0c8e --- /dev/null +++ b/files/de/archive/b2g_os/gaia_entwickeln/durchfuehrung_der_gaia_codebase/index.html @@ -0,0 +1,71 @@ +--- +title: Durchführung der Gaia codebase +slug: Archive/B2G_OS/Gaia_Entwickeln/Durchfuehrung_der_Gaia_codebase +tags: + - B2G + - Firefox + - Firefox OS + - Firefox OS lokal ausführen + - Gaia + - beitragen + - 'l10n:priority' +translation_of: Archive/B2G_OS/Developing_Gaia/Running_the_Gaia_codebase +--- +
+

Dieser Artikel beschreibt im Detail die lokale Durchführung der Gaia Codebase und welche Werkzeuge in diesem Setup verfügbar sind.

+
+ +

Zuerst sei erwähnt, dass Du NICHT Gecko oder B2G erstellen musst, um zu Gaia beizutragen. Du musst lediglich den Gaia Quellcode herunterladen und die Möglichkeit haben, diesen auszuführen und zu editieren.
+
+ Es gibt verschiedene Möglichkeiten, Gaia auszuführen:

+ + + +

Du findest auf der Different ways to run Gaia Seite kurzgefasste Informationen über jede der genannten Möglichkeiten, zusammen mit Links zu detailierten Beschreibungen - je nach Bedarf. Generell sind diese nach Komplexität geordnet, absteigend von der komplexesten zur einfachsten (aber unwahrscheinlichsten) Methode.

+ +

In diesem Artikel konzentrieren wir uns auf das Ausführen von Gaia innerhalb von Firefox Mulet oder in WebIDE. Für die meisten Änderungen, die Du in der Gaia Codebase machen möchtest, bietet dies den schnellsten Mechanismus, Updates zu testen aber offensichtlich gibt es einige Funktionen (z. B. das Testen von Geräte-APIs oder Interaktion mit der Smartphone Hardware ), für die ein physisches Gerät benötigt wird.

+ +
+

Info: Um weitere Hilfe zu Gaia zu bekommen, der beste Platz ist der #gaia IRC Channel (siehe auch Mozilla IRC für weitere Informationen hierzu) und die dev-gaia mailing list.

+
+ +

Ausführen der eigenen Gaia Version

+ +
    +
  1. Erstelle zuerst eine Verzweigung von der Gaia repo on Github.
    2. +
  2. Als nächstes, klone Deine Verzweigung lokal: + 
    git clone https://github.com/your-username/gaia.git
    +
    3. +
  3. Füge den Upstream wie folgt hinzu: + 
    cd gaia
+git remote add upstream https://github.com/mozilla-b2g/gaia
    +
    4. +
  4. Nun musst Du ein Gaia Profil anlegen. Führe make innerhalb Deines repo Ordners aus, um ein Profil in der profile Directory anzulegen, die für optimales Debugging konfiguriert ist. Dies erzeugt ungepackte (hosted) Versionen der Gaia Apps, welche dazu fungieren, gebündelt und direkt über den lokalen HTTPD Server -zusammen als Erweiterung für Firefox Desktop- übertragen zu werden. Wenn Du Änderungen gemacht hast, musst Du nur Dein Browser Fenster aktualisieren, um das Ergebnis zu sehen (wie Du es später sehen wirst), statt Dein Profil erneuern zu müssen, erneut auf das Gerät übertragen u.s.w..
    + Dies ist sehr gut für schnelles CSS/JS/HTML Hacking.
    5. +
  5. Mit Deinem angelegten Debug Profil, führe es in Mulet or WebIDE aus, mithilfe der Anleitungen hinter den Links.
    6. +
+ +

Troubleshooting und bekannte Probleme

+ +

Error: Python executable "python3" is v3.x, which is not supported by gyp.

+ +

In manchen Linux Versionen (eg: Archlinux), ist python3 der Standard python. Dadurch scheitert npm beim Ausführen mancher Befehle (z B. beim Testen). Um dies permanent zu beheben, führe folgenden Befehl aus:

+ +
npm config set python python2
+ +

Weiter Lösungen findest Du auch auf dieser Seite: Stack Overflow page.

+ +

Danach solltest Du Deine node_modules Directory löschen und den gescheiterten Befehl erneut ausführen.

+ +

Please Install NodeJS -- (use aptitude on linux or homebrew on osx)

+ +

Nun bekommst Du diesen Fehler obwohl Du NodeJS installiert hast. Möglicherweise benutzt Du Debian oder andere Debian-basierende Versionen wie zum Beispiel Ubuntu. Bei diesen Versionen ist NodeJS im nodejs Paket und Du kannst das nodejs-legacy Paket folgendermaßen installieren, um alles korrekt aufzusetzen:

+ +
sudo aptitude install nodejs-legacy
+ +

Solltest Du bei der Installation des Paketes Probleme haben, benutzt Du eventuell Chris Lea's PPA for Node; bitte entferne diese bevor Du weitermachst.

diff --git a/files/de/archive/b2g_os/gaia_entwickeln/index.html b/files/de/archive/b2g_os/gaia_entwickeln/index.html new file mode 100644 index 0000000000..d6f1d582d6 --- /dev/null +++ b/files/de/archive/b2g_os/gaia_entwickeln/index.html @@ -0,0 +1,52 @@ +--- +title: Gaia entwickeln +slug: Archive/B2G_OS/Gaia_Entwickeln +tags: + - B2G + - Bugs + - Firefox OS + - Gaia + - Mozilla + - beitragen +translation_of: Archive/B2G_OS/Developing_Gaia +--- +
+

Gaia ist das User Interface von Firefox OS, sowie eine Suite für die Standard-Apps. Gaia beinhaltet den Sperr- und Startbildschirm, die Telefonie-App und weitere Apps. Im Grunde ist Gaia eine Menge an Web-Apps, welche auf Firefox OS laufen. Diese Artikel behandelt alles, was zur Mitentwicklung an Gaia wissenswert ist.

+
+ +

In diesem Guide zeigen wir dir einen produktiven Workflow, um an Gaia mitzuarbeiten - und damit meinen wir, neue Features zu Gaia hinzuzufügen und an Bugs im Gaia Projekt zu arbeiten. Die ersten paar Artikel können in gegebener Reihenfolge durchgearbeitet werden oder du überspringst sie und gehst direkt zum relevanten Abschnitt, wenn du dein Wissen über ein bestimmtes Thema auffrischen möchtest.

+ +

Danach stellen wir Referenzmaterialien und Informationen zu weiteren Themen zur Verfügung.

+ +

+ +

Die Grundlagen

+ +
    +
  1. Die Gaia Codebase zum Laufen bringen
    2. +
  2. Die Gaia Codebase verstehen
    3. +
  3. Änderungen am Gaia Code machen
    4. +
  4. Änderungen am Gaia Code testen
    5. +
  5. Einen Gaia Patch einreichen
    6. +
+ +

Gaia Build Referenzen

+ + + +

Siehe auch

+ + diff --git a/files/de/archive/b2g_os/gaia_entwickeln/making_gaia_code_changes/index.html b/files/de/archive/b2g_os/gaia_entwickeln/making_gaia_code_changes/index.html new file mode 100644 index 0000000000..18a2a01cf5 --- /dev/null +++ b/files/de/archive/b2g_os/gaia_entwickeln/making_gaia_code_changes/index.html @@ -0,0 +1,85 @@ +--- +title: Gaia Coding ändern +slug: Archive/B2G_OS/Gaia_Entwickeln/Making_Gaia_code_changes +tags: + - Anleitung + - Code + - Firefox OS + - Gaia + - Änderungen +translation_of: Archive/B2G_OS/Developing_Gaia/Making_Gaia_code_changes +--- +
+

Jetzt, wo Gaia auf Deinem Desktop läuft und Du zu einem gewissen Grad die Arbeitweise der Codebase verstehst, solltest Du in der Lage sein Änderungen am Gaia Code durchzuführen. Dieser Artikel beschreibt, wie Änderungen durchgeführt werden und wie man Fehler findet um sie zu beheben.

+
+ +

Git Best Practices

+ +
    +
  1. Vor dem Ändern von Gaia solltest Du zuerst den master Zweig (branch) aktualisieren: + 
    cd path/to/gaia
+git checkout master
+git pull upstream master
    +
    2. +
  2. Als nächstes  brauchst Du einen eigenen Zweig für Deine Änderungen: + 
    git checkout -b my-code-fix
    +
    3. +
  3. Anschließend gehst Du ins Verzeichnis gaia/apps und führst Deine Änderungen an den App-Dateien durch.
    4. +
+ +

Beispiel einer einfachen Code-Änderung

+ +

Um Code-Änderungen anzuzeigen:

+ +
    +
  1. Führe die gewünschten  Änderungen an der Gaia Codebase durch und speichere die Änderungen.
    2. +
  2. Beende Firefox Mulet oder den WebIDE Simulator.
    3. +
  3. Erneuere Dein Gaia Profil mit make.
    4. +
  4. Starte Firefox Mulet oder den WebIDE Simulator erneut.
    5. +
+ +

Lass uns etwas Einfaches ändern wie die Textfarbe der Uhr auf dem Sperrbildschirm:

+ +

Gaia lockscreen showing the clock display in white text

+ +
    +
  1. Der beste Weg um herauszufinden wo dieser Stil geändert wird ist über die Entwickler-Werkzeuge. Verwende hier Strg/rechte Maustaste + Klick auf die Uhr im Firefox Desktop und wähle im Kontext-Menü Element untersuchen.
    2. +
  2. Nun kannst Du die zu ändernde CSS Datei suchen — in diesem Fall  gaia/apps/system/lockscreen/style/lockscreen.css — und die Änderungen an den CSS Styles auf der rechten Seite des Displays nach Deinen Vorstellungen vornehmen.
    3. +
  3. Wenn Du mit Deinen Änderungen zufrieden bist, dann öffne die Datei und mache dort Deine Änderungen direkt.
    4. +
  4. Als nächstes führst Du die oben aufgeführten Schritte durch, um Dir Deine Änderungen anzusehen.
    5. +
+ +

Gaia lockscreen showing the clock display modified from white to red text
+
+
+ Einschränkungen im Gaia Firefox Mulet Rendering:

+ + + +

Wo man zu bearbeitende Fehler findet

+ +

Am besten nutzt Du Josh Matthews' Bugs Ahoy app um Fehler zu finden, die Du bearbeiten kannst — diese Seite liest die vorhandenen Bugs direkt aus Mozilla's Bugzilla und stellt sie im Browser inklusive Suchfunktion dar. Wenn Du einen Fehler gefunden hast den Du bearbeiten willst, dann gehe zu dessen Bugzilla-Seite, trage Dich als Bearbeiter im Feld "assigned to" ein und beginne mit der Arbeit wie oben beschrieben.

+ +

Nützliche Tipps

+ + + +

https://bugzilla.mozilla.org/buglist.cgi?columnlist=product%2Ccf_blocking_b2g%2Cbug_status%2Cresolution%2Cshort_desc&resolution=---&query_based_on=CLOCK&query_format=advanced&bug_status=UNCONFIRMED&bug_status=NEW&bug_status=ASSIGNED&bug_status=REOPENED&component=Gaia%3A%3AClock&product=Boot2Gecko&known_name=CLOCK&list_id=9776392

+ +

Siehe auch

+ + diff --git a/files/de/archive/b2g_os/index.html b/files/de/archive/b2g_os/index.html new file mode 100644 index 0000000000..4447e3c024 --- /dev/null +++ b/files/de/archive/b2g_os/index.html @@ -0,0 +1,163 @@ +--- +title: B2GOS +slug: Archive/B2G_OS +tags: + - Anfangen + - Anfänger + - B2G OS + - Basic + - Firefox OS + - Gaia + - Gecko + - Gonk + - NeedsTranslation + - TopicStub +translation_of: Archive/B2G_OS +--- +
+

B2G OS ist ein vollständiges, selbstständig arbeitendes Betriebssystem für das offene Web. Es ist ein von der Mozilla-Community entwickeltes Open-Source-Projekt und bildet die Grundlage der Firefox OS-Produkte.

+
+ +

B2G OS ist ein von der Community gepflegtes Open-Source-Betriebssystem für Smartphones, Tablets, Smart TVs und andere internetfähige Geräte. Das Projekt startete ursprünglich 2011 und basiert auf dem Linux-Kernel und der Rendering-Engine Gecko. Die komplette Nutzeroberfläche ist mit Web-Technologien geschrieben und kann zum Starten und Benutzen von Web-Anwendungen benutzt werden. Nachdem die Mozilla Corporation ihr kommerzielles Firefox OS Smartphone-Programm eingestellt hat, wird das Projekt für Smartphones von Mozillas Community weiterentwickelt und als B2G OS geführt.

+ +

+ +
+

Hinweis: Aufruf zur Mitarbeit & Aufruf zur Appanpassung um mehr Personen zu beteiligen. Hilf uns und teile ihn!

+
+ +
+
+

Mithelfen

+ +
    +
  • Melde & behebe Fehler (Meta-Bug ist Bug 1252143)
    • +
  • Hilf uns, fehlschlagende Tests zu reparieren
    • +
  • Portiere eine Gaia Smartphone-App: +
      +
    1. in eine Web-App (oder)
      2. +
    2. in eine chrome://-Anwendung (warum?) und berichte darüber
      3. +
    +
    • +
  • Portiere B2G OS für dein Smartphone und hilf uns, den Port zu pflegen
    • +
  • Hilf uns, diese Dokumentation und das Wiki zu verbessern und zu übersetzen
    • +
  • Schlage neue Smartphone-Funktionen vor und implementiere sie
    • +
+
+ +
+

Mitreden

+ + +
+ +
+

Geräte

+ +

Informationen zu unterstützten Geräten, auf denen B2G OS laufen kann:

+ + + +

Mehr Informationen finden sich hier.

+ +

Dein Gerät ist nicht dabei? Probier die Mulet-Desktopanwendung aus.

+
+
+ +
+

Hinweis: Einige Seiten wurden in das MDN-Archiv verschoben. Lass es uns wissen, wenn du Schwierigkeiten hast, etwas zu finden oder ein Abschnitt aus dem Archiv hierher zurückgeholt werden sollte.

+
+ +

 

+ + + +
    +
  1. B2G OS Architecture + +
      +
    1. B2G OS Architecture
      2. +
    2. B2G OS APIs
      3. +
    +
    2. +
  2. Gaia +
      +
    1. Gaia overview
      2. +
    2. Different ways to run Gaia
      3. +
    3. Running the Gaia codebase
      4. +
    4. Developing Gaia +
        +
      1. Understanding the Gaia codebase
        2. +
      2. Making Gaia code changes
        3. +
      3. Testing Gaia code changes
        4. +
      4. Submitting a Gaia patch
        5. +
      5. Gaia build system primer
        6. +
      6. Make options reference
        7. +
      7. Gaia tools reference
        8. +
      +
      5. +
    +
    3. +
  3. Build B2G OS +
      +
    1. Build overview
      2. +
    2. B2G OS build process summary
      3. +
    3. Build prerequisites
      4. +
    4. Preparing for your first build
      5. +
    5. Building B2G OS +
        +
      1. Building B2G OS
        2. +
      2. Building B2G OS for Flame on Mac OS X
        3. +
      3. Building for Fairphone
        4. +
      4. B2G build variables reference sheet
        5. +
      +
      6. +
    +
    4. +
  4. Run B2G OS on Desktop +
      +
    1. Choosing how to run Gaia or B2G OS
      2. +
    2. Run B2G OS on desktop using Mulet
      3. +
    +
    5. +
  5. Install B2G OS on mobile +
      +
    1. Installing B2G OS on a mobile device
      2. +
    2. B2G installer add-on
      3. +
    +
    6. +
  6. Compatible Devices
    7. +
  7. Create updates for B2G OS +
      +
    1. Creating and applying B2G OS update packages
      2. +
    2. Building and installing FOTA community build
      3. +
    +
    8. +
  8. Porting B2G OS +
      +
    1. Porting overview
      2. +
    2. Porting basics
      3. +
    3. Porting on CyanogenMod
      4. +
    +
    9. +
diff --git a/files/de/archive/b2g_os/installing_on_a_mobile_device/index.html b/files/de/archive/b2g_os/installing_on_a_mobile_device/index.html new file mode 100644 index 0000000000..96a469353c --- /dev/null +++ b/files/de/archive/b2g_os/installing_on_a_mobile_device/index.html @@ -0,0 +1,81 @@ +--- +title: Installing Firefox OS on a mobile device +slug: Archive/B2G_OS/Installing_on_a_mobile_device +translation_of: Archive/B2G_OS/Installing_on_a_mobile_device +--- +
+

Once you've built Boot to Gecko for a supported mobile device, you can install it. This article will guide you through the process.

+
+
+ Note: The first time you flash your phone, it must have Android 4 (Ice Cream Sandwich) installed. The process will not work correctly otherwise. Once you've done your first install of B2G, however, you can simply update on top of it.
+

Installing ADB

+

On OSX

+

If you have homebrew on OSX:

+
brew install android-platform-tools
+

Otherwise, download the Android Developer Tools and add the binaries to your PATH.

+

On Ubuntu

+
sudo apt-get install android-tools-adb
+

Flashing your phone

+

To flash everything to your phone, simply connect your phone and type:

+
./flash.sh
+
+

That's it. The B2G you've currently got built will flash onto your device.

+

Note that If you are updating across revisions with significant Gaia changes, you might need also do:

+
cd gaia
+make reset-gaia
+

This will wipe all of your data stored in Gaia, but also clear out obsolete Gaia settings and prefs so that you'll boot into a "clean" Gaia. In theory ./flash.sh should do this already, but for some devices (e.g. hamachi) ./flash.sh only flashes a subset of modules (./flash.sh -f will force flash everything.)

+

Configuring the udev rule for your device

+

On Linux, if you get this,

+
< waiting for device >
+

that probably means that you haven't added a udev rule for the fastboot device, which is not the same as the one for adb. (Though it also might just mean you need to run ./flash.sh with sudo) You can get the USB vendor ID by running lsusb now, but typically it's Google's: 18d1, so adding this line in your /etc/udev/rules.d/51-android.rules would work:

+
SUBSYSTEM=="usb", ATTR{idVendor}=="18d1", MODE="0666", GROUP="plugdev"
+
+ Note: If you get a very helpful libusb error "-3" on Linux, it means you need to be root to have the needed access to the USB device. Run the script again using sudo.
+
+ Note 2: If you have an Unagi or a Geeksphone Keon phone, you need two lines like this - one for the original phone vendor's ID, and one for Google's.
+

Special notes for Hamachi, Helix, and Leo devices

+

If your phone is a hamachi, helix or leo device, the ./flash.sh script will now default to flashing only gecko and gaia.  It is recommended that you flash with the OEM as a base build to get the firmware and the gonk layers and then flash the gecko and gaia on top.  If you want to flash using the images, there is an override flash where you can ./flash.sh -f and it will use the image files to flash your device.

+

Special notes for the Samsung Galaxy S2

+

If your phone is a Galaxy S2 and you are using heimdall 1.3.2 (the latest version; use heimdall version to check), you may see an alarming error "FACTORYFS upload failed!" followed by "Heimdall flashing failed" and some additional information. This is actually a success condition, and you can ignore the advice.

+

To get rid of this strange behavior, grab a source copy of heimdall, downgrading to the 1.3.1 release ("git checkout fbbed42c1e5719cc7a4dceeba098981f19f37c06"), then compile it  according to the README, then install that to make the error go away. However, this isn't strictly necessary.

+

All versions of heimdall are unable to flash a system.img larger than 100MB. Do:

+
ls -l ./out/target/product/galaxys2/system.img
+
+

to see how big yours is. If it's too large, ask in IRC for advice; there are ways to do it in two stages.

+

Added step for the Samsung Galaxy S2

+

If you're flashing onto the Galaxy S2, there is an additional step to follow. Gaia does not get flashed automatically by the flash.sh script; you'll need to also do:

+
./flash.sh gaia
+
+

Flashing specific partitions to fastboot phones

+

You can flash specific partitions to fastboot phones (that is, any phone other than the Samsung Galaxy S2). For example:

+
./flash.sh system
+./flash.sh boot
+./flash.sh user
+
+

WARNING: flashing user (at least) may delete your user-specific data (contacts, etc.).

+

Updating specific modules

+

You can update specific components of B2G by specifying their names when flashing. For example:

+
./flash.sh gaia
+./flash.sh gecko
+
+

In order to update only one application you can use BUILD_APP_NAME environment variable:

+
BUILD_APP_NAME=calendar ./flash.sh gaia
+

If your phone is not for developer (you aren't interested on test apps and/or require optimization), you can update gaia using:

+
VARIANT=user ./flash.sh gaia
+

Next steps

+

At this point, your phone should be running Boot to Gecko! It's time to experiment, write some code, test, or do some debugging!

+
+ Note: A helpful usage tip: if your build of B2G starts up with the lock screen requesting a pass code to unlock the phone, the default code is 0000.
+

Troubleshooting

+

Here are a some tips for what to do if your device doesn't work right after installing B2G, or updating it to a new version

+

If the UI doesn't start up

+

If you update your phone and the user interface doesn't start up, you can reset it to clear out out-of-date configuration and the like. This may bring it back to life, but note that it may also delete your user-specific data (contacts, etc.). Here's how:

+
cd gaia
+make reset-gaia
+
+

If you want change from developer to production mode

+
cd gaia
+make reset-gaia PRODUCTION=1
+

WARNING: reset-gaia may delete your user-specific data (contacts, etc.).

+

"image is too large" error message on ./flash.sh execution

+

It might mean that you phone needs to be rooted first before flashing it. As b2g needs to be written on root partition, your phone needs to be rooted in order to install it.

diff --git a/files/de/archive/b2g_os/introduction/index.html b/files/de/archive/b2g_os/introduction/index.html new file mode 100644 index 0000000000..606b63f0e7 --- /dev/null +++ b/files/de/archive/b2g_os/introduction/index.html @@ -0,0 +1,84 @@ +--- +title: Einführung in Firefox OS +slug: Archive/B2G_OS/Introduction +translation_of: Archive/B2G_OS/Introduction +--- +

Firefox OS (auch unter seinem Codenamen "Boot to Gecko" oder "B2G" bekannt) ist Mozillas Open Source Betriebssystem für mobile Endgeräte, das auf Linux und Mozillas Gecko-Technologie basiert. Firefox OS ist ein mobiles Betriebssystem, das ohne proprietäre Technologie auskommt und dennoch Anwendungsentwicklern eine leistungsstarke Plattform bietet, um hervorragende Produkte zu erstellen. Darüber hinaus ist es flexibel und leistungsfähig genug, um auch den Endprodukt-Nutzer glücklich zu machen.

+

Für Web-Entwickler ist es am Wichtigsten zu verstehen, dass die gesamte Benutzeroberfläche eine Web-Anwendung ist, von der aus sich andere Web-Anwendungen anzeigen und ausführen lassen. Jede deiner Veränderungen an der Benutzeroberfläche und jegliche Anwendung, die du für den Betrieb unter Firefox OS erstellst, sind Webseiten. Allerdings: Mit erweitertem Zugriff auf Hardware und Dienste des mobilen Endgeräts.

+

Wie man Firefox OS installiert, kannst du unserer Handy-Anleitung entnehmen.

+

Hardware-Voraussetzungen

+

Die Portierung von Firefox OS sollte für die meisten aktuellen Mobilgeräte mit ARM-Chips gelingen. Der vorliegende Abschnitt beschreibt die grundlegenden Hardware-Anforderungen sowie empfohlene Eigenschaften der Hardware.

+

 

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
KomponenteMinimumEmpfohlen
CPUARMv6Cortex A5 class oder besser
+ ARMv7a mit NEON
GPU—Adreno 200 class oder besser
Verbindungen—WiFi
+ 3G
Sensoren—Accelerometer
+ Proximity
+ Ambient light
+ A-GPS
+

Es wird außerdem empfohlen, dass die Geräte ein einheitliches Farbprofil anbieten sollen (was über den Treiber der Grafikeinheit zu implementieren wäre). Ebenso sollen sie das Stummstellen und die Wiedergabe-Funktion via Kopfhörer-Fernbedienung unterstützen. Beides sind gängige Fähigkeiten moderner Smartphones.

+

Hinweise zur Benutzung

+

Dieser Abschnitt bietet dir einige Hinweise zur Verwendung von Firfox OS. Dabei handelt es sich um eine Art Platzhalter, bis wir eine echte Benutzer-Dokumentation zur Verfügung haben.

+

Entsperren des Telefons

+

Falls dein aus dem Quellcode erstelltes Firefox OS mit der Frage nach einem Entsperr-Code hochfährt, so lautet dieser standardmäßig 0000. Das liegt daran, dass wir bei diesen Code-Versionen mit der Entwicklung und dem Testen des Sperr-Bildschirms (Lock-Screen) beschäftigt sind.

+

Erstellen eines Screenshots

+

Ein Screenshot lässt sich ganz einfach durch gleichzeitiges Drücken von Power- und Home-Taste erzeugen. Das entsprechende Bild wird unter /sdcard/screenshots auf deinem Gerät abgelegt. Du kannst darauf auch mit Hilfe der Galerie-App deines Telefons zugreifen.

+

Sollte das aus irgendeinem Grund nicht funktionieren, kannst du auch jederzeit über ein Terminal des Linux- oder MacOSX-Computers, auf dem ein Firefox OS installiert ist, darauf zugreifen.

+
    +
  1. Stell sicher, dass bei dir ffmpeg installiert ist. +
      +
    1. Wenn Du MacPorts verwendest, kannst du das auf dem Mac mit sudo port install ffmpeg nachholen. Mit homebrew verwende brew install ffmpeg.
      2. +
    2. Unter Linux (Ubuntu/Debian) verwende sudo apt-get install ffmpeg.
      3. +
    +
    2. +
  2. Schließe dein Telefon mit einem USB-Kabel an deinen Rechner an.
    3. +
  3. Erzeuge auf deinem Telefon die Situation, von der Du einen Screenshot willst.
    4. +
  4. Wechsle mit cd ins B2G/gaia Verzeichnis.
    5. +
  5. make screenshot
    6. +
  6. Du hast einen Screenshot namens screenshot.png erstellt.
    7. +
+

Tasten und Bedienelemente

+

Ein typisches Firefox OS-Gerät verfügt hardwareseitig nur über eine geringe Zahl physischer Bedienelemente:

+
+
+ Home-Taste
+
+ Diese Taste befindet sich im Allgemeinen mittig unterhalb des Bildschirms. Bei Tastendruck wird man zum App-Launcher zurückgeführt. Bei Halten der Taste wird die Ansicht zum Umschalten der Karten geöffnet: Hochwischen auf einer App entfernt diese.
+
+ Lautstärken-Wippe
+
+ Entlang der linken Seite befindet sich die Lautstärken-Wippe. Druck auf die obere Hälfte erhöht die Lautstärke, Druck auf die untere senkt sie.
+
+ Power-Taste
+
+ Die Power-Taste befindet sich an der oberen rechten Ecke des Geräts.
+
diff --git a/files/de/archive/b2g_os/phone_guide/alcatel_one_touch_fire/index.html b/files/de/archive/b2g_os/phone_guide/alcatel_one_touch_fire/index.html new file mode 100644 index 0000000000..4ba54a945b --- /dev/null +++ b/files/de/archive/b2g_os/phone_guide/alcatel_one_touch_fire/index.html @@ -0,0 +1,102 @@ +--- +title: Alcatel One Touch Fire +slug: Archive/B2G_OS/Phone_guide/Alcatel_One_Touch_Fire +tags: + - Alcatel One Touch Fire + - Firefox OS +translation_of: Archive/B2G_OS/Phone_guide/Alcatel_One_Touch_Fire +--- +
+
+ +
+

Das Alcatel One Touch Fire Smartphone mit Firefox OS verfügt über einen 1 GHz Prozessor und einer rückseitigen 3.2 Megapixel Kamera. Es wird von einer großen Vielzahl von Mobilfunkanbietern in verschiedenen Teilen der Welt angeboten.

+ +

Besorge dir ein Gerät

+ +

Das Alcatel One Touch Fire ist im allgemeinen Handel erhältlich.

+ +

Verfügbare Länder

+ +
+
+
    +
  • Brasilien
    • +
  • Chile
    • +
  • Kolumbien
    • +
  • Deutschland
    • +
  • Griechenland
    • +
  • Ungarn
    • +
  • Italien
    • +
+
+ +
+
    +
  • Mexico
    • +
  • Montenegro
    • +
  • Peru
    • +
  • Polen
    • +
  • Serbien
    • +
  • Venezuela
    • +
+
+
+ +

Mobilfunkanbieter

+ +
+
+
    +
  • Congstar
    • +
  • Cosmote
    • +
  • Movistar
    • +
  • T-Mobile
    • +
+
+ +
+
    +
  • Telcel
    • +
  • Telenor
    • +
  • TIM
    • +
  • Vivo
    • +
+
+
+
+
+ +

Software - Updates & Upgrades

+ +

Das Systemabbild des Gerätes ist durch den Mobilfunkanbieter gesperrt. Aus diesem Grund kann ein Update der Software nur durchgeführt werden wenn der Netzbetreiber ein OTA Update veröffentlicht.

+ +

Geräteeigenschaften

+ +

Mehr Geräteeigenschaften sind auf der Alcatel Website unter dem Reiter "Specification" aufgelistet.

+ + + +

Verfügbare Farben

+ + + +

Weitere Informationen

+ + diff --git a/files/de/archive/b2g_os/phone_guide/flame/index.html b/files/de/archive/b2g_os/phone_guide/flame/index.html new file mode 100644 index 0000000000..b8e75bb09a --- /dev/null +++ b/files/de/archive/b2g_os/phone_guide/flame/index.html @@ -0,0 +1,39 @@ +--- +title: Flame +slug: Archive/B2G_OS/Phone_guide/Flame +translation_of: Archive/B2G_OS/Phone_guide/Flame +--- +
+

A picture of the Flame device, showing the Firefox OS homescreen containing several app icons.Coming soon

+

The Flame developer reference phone is a milestone in Firefox OS device releases. The Flame hardware offers a representative set of specs — including FWVGA display and dual-core processor (see Phone and device specs for full specs) — to help developers build great content and experiences. A single hardware platform is also good for testers, making it easier to test and address specific software issues without having to worry about device model-specific bugs, etc.

+
+

If you have your phone in hand and want to start playing with it, developing and distributing apps, or contributing to the Firefox platform, the following links will get you where you need to go:

+ +

If you’d like to purchase a phone or find out more about using it, you’ll find the information you need below.

+

Purchasing a device

+

Our device manufacturer partner is making the device available for purchase in the latter part of Q2, 2014, retailing at approximately US$170, global shipping included. Available for pre-order soon!

+

Emergency download mode

+

When flashing a new build to your phone fails to work, your phone becomes unresponsive, and the phone cannot enter fastboot mode, you can use emergency download mode for recovery.

+

A USB cable and the Emergency Download Tool are required to enter emergency download mode. (Tool download coming soon.)

+

Recovery mode

+

You can enter recovery mode to clear your phone data or manually update the firmware. There are two ways to enter this mode:

+ +

When in recovery mode, press the Volume up/down keys to move the selection highlight, and the Power key to select. Make sure you have your phone data (Contacts, SMS, etc.) backed up before clearing data, and your upgrade packages downloaded before updating.

+

RAM adjustment

+

You can adjust the available RAM capacity to see how apps perform on Firefox OS phones with lower memory footprints.

+

This is accomplished by entering fastboot mode (install fastboot first, which is available in the same SDK page as ADB) and typing:

+
fastboot oem mem [0|256-1024]
+

“0” is the memory automatically detected and “256-1024” is the number of megabytes. For example, if you want to adjust device RAM capacity to 512M, enter fastboot oem mem 512.

+

You'll need to then reboot your device for the settings to take effect. This can be done using:

+
fastboot reboot
+

The current memory size can be returned by entering fastboot mode and typing:

+
fastboot getvar mem
+
diff --git a/files/de/archive/b2g_os/phone_guide/geeksphone/index.html b/files/de/archive/b2g_os/phone_guide/geeksphone/index.html new file mode 100644 index 0000000000..b9bc2572df --- /dev/null +++ b/files/de/archive/b2g_os/phone_guide/geeksphone/index.html @@ -0,0 +1,202 @@ +--- +title: Geeksphone +slug: Archive/B2G_OS/Phone_guide/Geeksphone +translation_of: Archive/B2G_OS/Phone_guide/Geeksphone +--- +
+

Developer Preview editions of the Firefox OS phone are now becoming widely available to the community, mainly through Geeksphone. Since these are for developers, naturally we want to encourage you to tinker and play with them as much as possible! In this article we cover some basic tips on how to keep your phone up to date and how to tweak the system Gaia applications.

+
+ +
+

Bitte beachten: Diese Anleitungen sind für die älteren Modelle Keon und Peak gedacht und nicht für das aktuellste Geeksphone Revolution.

+
+ +

Geeksphone auf das letzte Abbild upgraden

+ +

Firefox OS Updates können über die Settings App heruntergeladen werden. Die Funktionalität befindet sich unter Device Informationen. Das Smartphone kann so eingestellt werden, dass es auf neue Updates täglich, wöchentlich oder monatlich prüft. Zusätzlich besteht die Möglichkeit über den "check now" Button eine Aktualisierung durchzuführen. Sobald ein neues Update verfügbar ist wird dies angezeigt und der Download und die Installation der aktuellen Version kann beginnen.

+ +

The screen for checking updates on the Firefox OS settings app

+ +

Das Telefon flashen

+ +

Das Team von Geeksphone stellt die "latest stable" und die "nightly builds" als eigenständige Downloads zum selbstständigen flashen zur Verfügung.

+ +

Telefon und Computer vorbereiten

+ +

Bevor man mit dem flashen des Smartphone beginnen sollte, sollte man die Anleitung im Abschnitt  “Setting Up the Geeksphone Device” in Pushing Firefox OS Apps to the Geeksphone beachten und die dort beschriebenen Voraussetzungen schaffen. Diese stellt sicher, dass man Daten an das Telefon übertragen kann. Ebenfalls sollte man, die im gleichen Abschnitt beschriebene  Anleitung zur Installation der korrekten USB-Treiber beachten.

+ +
+

Bitte beachten: Es ist besonders wichtig, dass auf Windows Computer die korrekten Treiber installiert sind.

+
+ +

Die aktuellen Build befinden sich auf der Geeksphone Download-Seite. Auf dieser Seite erhält man nun die Option das korrekte Gerät und den gewünschten Build auszuwählen.

+ +

Two phone images side by side, the Geeksphone Keon and Peak, with different software download options below each one.

+ +

Lade nun den zu deinem Gerät passenden Build herunten und entpacke die Archive-Datei auf deine Festplatte. Das Archive beinhaltet das Abbild und die benötigten Befehle um das Gerät zu aktualisieren. Dabei stehen Befehle für Windows, Mac OS oder Linux zur Verfügung. Um das Gerät nun zu aktualisieren muss "Remote debugging" unter Einstellungen aktiviert sein.

+ +

Settings -> Device information -> More information -> Developer tab.

+ +
+

Bitte beachten: Stelle sicher dass dein Handy eine Akkuladung von mit 50% aufweist. Um die System-Dateien zu verändern Bedarf es mehrere Restarts, welche im Falle von fehlender Akkuleistung zu einer Beschädigung führen kann.

+
+ +

Enabling remote debugging on the Firefox OS Settings app

+ +
+

Bitte beachten: Sollte dein Gerät, obwohl es angesteckt ist, von den mitgelieferten Skripten in den ersten Schritten nicht erkannt werden, musst ggf. das Handy entsperren und warten bis das USB-Zeichen im System-Tray auftaucht.

+
+ +
+

Bitte beachten: Das Flashen des Smartphone wird all deine Daten vom Telefon entfernen. Wenn du deine Daten zuvor sichern möchtest, solltest du die folgende Anleitung befolgen: Back up the phone system partition.

+
+ +

Windows

+ +
+

Bitte Beachten: Es müssten möglicherweise USB-Treiber für Windows installiert werden. Eine Anleitung befindet sich in der folgenden Anleitung “Setting Up the Geeksphone Device” in Pushing Firefox OS Apps to the Geeksphone.

+
+ +

Öffne zuerst eine Konsole (Start > Tippe cmd in der Suchfeld > Enter drücken, Unter Windows 7, Windows Taste + X > Wähle Command Prompt unter Windows 8) und wechsel in das Verzeichnis wo sich die entpackten Daten befinden. Führe den folgenden Befehlt aus:

+ +
flash.bat
+
+ +

Dieser Befehl sollte nun das neue Abbild auf das Telefon flashen. Das Telefon muss nun nochmals erneut aufgesetzt werden, da ja wie zuvor beschrieben alle Daten gelöscht wurden.

+ +

Mac OS

+ +

Öffnen eines Terminals(Cmd + space -> type terminal -> enter) Fensters und wechsle mit cd in das Verzeichnis wo sich die entpackten Daten befinden. Führe den folgenden Befehlt aus:

+ +
./flash_mac.sh
+
+ +

Dieser Befehl sollte nun das neue Abbild auf das Telefon flashen. Das Telefon muss nun nochmals erneut aufgesetzt werden, da ja wie zuvor beschrieben alle Daten gelöscht wurden.

+ +

Linux

+ +

Um ein Keon unter Ubuntu zu fläschen müssten die folgenden Regeln in  /etc/udev/rules.d/51-android.rules hinzugefügt werden:

+ +
SUBSYSTEM=="usb", ATTR{idVendor}=="05c6", ATTR{idProduct}=="8013", MODE="0666"
+ +
SUBSYSTEM=="usb", ATTR{idVendor}=="18d1", ATTR{idProduct}=="d00d", MODE="0666"
+ +
 
+ +

Öffne nun ein Terminal (control-alt-t unter Ubuntu) Fehnster und welche in das Verzeichnis wo sich die entapckten Daten befinden. Führe den folgenden Befehl aus:

+ +
./flash.sh
+
+ +

Dieser Befehl sollte nun das neue Abbild auf das Telefon flashen. Das Telefon muss nun nochmals erneut aufgesetzt werden, da ja wie zuvor beschrieben alle Daten gelöscht wurden.

+ +
+

Ein anderer Weg das Keon unter Ubuntu zu aktualisieren ist der folgende:-

+
+ +

Schritt 1: Das Gerät verbinden

+ +

Schritt 2: Ein Terminal öffnen

+ +

Schritt 3: Den Befehl  sudo nautilus eintippen und das Root-Passwort eingeben um den Root-Ordner zu öffnen

+ +
sudo nautilus
+ +
sudo nautilus "root password"
+ +

Schritt 4: Kopiere den Download des Firefox O.S Geeks Phone Builds in das Root-Verzeichnis

+ +

Schritt 5: Klicke auf die Datei mit dem Namen "flash.sh"

+ +
./flash.sh
+ +

 

+ +

If you have an 'unagi' or developer preview phone that is not a Geeksphone

+ +

If you have a developer phone that is not a Geeksphone such as an 'unagi' or a previously Android-based device, you may need to perform the following steps. If this is not you, please skip to the next section.

+ +

You will need to install adb and fastboot. These utilities can be found in the Android Developer Toolkit.

+ +

It is not necessary to install the entire toolkit. Download the toolkit from here and extract the contents. adb and fastboot are found in the /platform-tools/ folder. They can be copied to the /usr/bin of your Linux or Mac OS machine, or copied to another folder as long as that folder is added to your $PATH.

+ +

If you are attempting to flash your device and have another device plugged in via USB, your phone may not be detected by these utilities correctly. Only have your phone plugged in while trying to flash it.

+ +

Tweaking Gaia

+ +

If you are the industrious sort, you may want to tweak the default applications in Gaia — the UI in Firefox OS. In this section we will cover some of the basics for cloning Gaia and making changes to the default system apps. Bear in mind these tips are “at your own risk” and may involve you later referring to the section “Ok, I bricked my phone”. Before proceeding make sure that you have adb and fastboot installed on your system. To verify if these are installed open a terminal and type adb devices with your phone connected. You should see your phone listed under the attached devices.

+ +

You should also be able to run fastboot from the terminal. If you run fastboot, a set of parameter options should be displayed. If you do not have adb or fastboot installed, a quick Google search with your operating system will return several quick starts on how to install them. In addition to adb and fastboot you will need Git. If you do not currently have Git installed, have a look at this setup guide. Finally make sure your phone is set up for remote debugging as described in the previous section.

+ +

Once you have the prerequisites you can open a terminal and cd to the directory you would like to clone the Gaia source code to. Type the following commands:

+ +
git clone git://github.com/mozilla-b2g/gaia.git gaia
+cd gaia
+
+ +

This will clone the current Gaia code to your system.

+ +
+

If you plan on submitting changes back to the Gaia source, be sure to fork the source before cloning as described in Hacking Gaia.

+
+ +

Currently the Geeksphone Keon uses the v1.0.1 branch of Gaia code, so set the proper branch using the following command before you do anything else:

+ +
git checkout -b v1.0.1 origin/v1.0.1
+
+ +

Most of the system apps are located in the apps subdirectory of gaia. You can now make any changes to these Firefox OS apps you wish. Once you have made changes, make sure your device is mounted properly by first running:

+ +
adb remount
+ +

Next, run the following command to push the modified apps to your phone. This will by default push all the system apps to the phone:

+ +
B2G_SYSTEM_APPS=1 make install-gaia
+
+ +

If you only changed one of the apps you can specify the particular app using similar syntax. In this example only the calendar app will be pushed to the phone:

+ +
APP=calendar B2G_SYSTEM_APPS=1 make install-gaia
+
+ +

If you have issues while making the changes, you can reset the phone to default values using either of the following commands:

+ +
make production
+make reset-gaia
+
+ +
+

Note: Bear in mind that either of the above commands will clear any data or apps that you have pushed to the phone. If you want to back up your data and restore afterwards, you can follow the instructions at Back up the phone system partition.

+
+ +

"Ok, I bricked my phone"

+ +

If you are in the process of modifying your phone and it becomes “unresponsive” you should be able to recover it using fastboot with a simple procedure. The following illustrates resetting the Keon but other phones should have a similar process. You will also need to verify that you have fastboot and ADB installed (try typing fastboot and adb in the command line if you are not sure).

+ +
    +
  1. Remove the USB cable and then remove the battery from the phone for 30 seconds.
    2. +
  2. Reinsert the battery and hold down the volume up and power buttons at the same time, for a few seconds, until the system recovery menu appears.
    3. +
  3. Reconnect the USB cable
    4. +
  4. Type in the command run adb reboot bootloader.
    5. +
  5. When the phone reboots and starts to show the Geeskphone logo, you are now in fastboot mode; run the following commands from a terminal window in the directory that contains the latest img files described in the first section of this post:
    6. +
+ +
fastboot flash recovery recovery.img
+fastboot flash boot boot.img
+fastboot flash userdata userdata.img
+fastboot flash system system.img
+fastboot reboot
+
+ +

This process should recover your phone. If it doesn't seem to work, you may have to try it a second time.

+ +

Go play!

+ +

We hope these instructions are useful to you, and naturally we want you to be as happy about Firefox OS and the possibilities as we are! Feel free to play around with updating your devices, make changes/updates to Gaia apps, and also be inspired to build you own open web apps.

+ +

See also

+ + diff --git a/files/de/archive/b2g_os/phone_guide/index.html b/files/de/archive/b2g_os/phone_guide/index.html new file mode 100644 index 0000000000..472fcd195f --- /dev/null +++ b/files/de/archive/b2g_os/phone_guide/index.html @@ -0,0 +1,44 @@ +--- +title: Firefox OS developer phone guide +slug: Archive/B2G_OS/Phone_guide +tags: + - B2G + - Firefox OS + - NeedsTranslation + - Phones + - TopicStub +translation_of: Archive/B2G_OS/Phone_guide +--- +
+

This section contains developer information relevant to specific phones that run Firefox OS. We have general information available on Building and installing Firefox OS and Hacking Firefox OS, so please go there for information about building and installing the platform from scratch. Developers with specific phones in their possession may however find the following articles useful.

+
+

Specific device information

+
+
+ Firefox OS phone data
+
+ In this article we list the various available Firefox OS phones along with information such as their code names, availability, and specific hardware features.
+
+ Geeksphone
+
+ In this article we cover some basic tips on how to keep your Geeksphone up-to-date and how to tweak the system Gaia applications.
+
+ The Firefox OS ZTE OPEN
+
+ This article exists to share the information we have available on the ZTE OPEN Firefox OS device.
+
+

General Firefox OS information

+
+
+ General device features
+
+ This page lists typical Firefox OS hardware features and minimum hardware requirements.
+
+ Troubleshooting
+
+ This article provides tips for resolving common problems you may have while using Firefox OS.
+
+ Best practices for open reference devices
+
+ A set of best practices that we believe should come highly recommended for any widely available open reference devices. All of the recent Firefox OS reference devices have followed these practices.
+
diff --git a/files/de/archive/b2g_os/phone_guide/phone_specs/index.html b/files/de/archive/b2g_os/phone_guide/phone_specs/index.html new file mode 100644 index 0000000000..8cf863e090 --- /dev/null +++ b/files/de/archive/b2g_os/phone_guide/phone_specs/index.html @@ -0,0 +1,800 @@ +--- +title: Firefox OS Geräte und Spezifikationen +slug: Archive/B2G_OS/Phone_guide/Phone_specs +tags: + - Firefox OS + - Gerät + - Handy + - Smartphone +translation_of: Archive/B2G_OS/Phone_guide/Phone_specs +--- +
+

Dieser Artikel enthält Informationen über Firefox OS Geräte und deren Spezifikationen, Code-Namen, standardmäßig installierten FIrefox OS Versionen und mehr.

+
+ +

Verfügbare Firefox OS Smartphones

+ +

Die folgende Tabelle enthält Informationen zu den verfügbaren und ehemals verfügbaren Firefox OS Smartphones.

+ +
+

Hinweis: Nähere Informationen zu den verfügbaren Firefox OS Smartphones und die Länder, in denen sie verfügbar sind, findest Du auf Firefox OS devices.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+

Name / Code-Name

+ 		+

Datum der Veröffentlichung

+ 		FxOS
+ version		VerfügbarkeitWeitere Informationen
+

Alcatel One Touch Fire

+ +

hamachi, buri

+ 		12. Juli 20131.0.1Zur Zeit verfügbarVerfügbar in Brasilien, Uruguay, Italien, Deutschland, Griechenland, Serbien, Ungarn und Polen.
+ Erhältlich auf eBay.
Alcatel One Touch Fire E18. Juli 20141.3.0Zur Zeit verfügbarVerfügbar in Tschechien, Deutschland, Ungarn, Polen, Russland.
otoro, unagi, inari   nicht erhältliche ZTE Entwicklermodelle, Vorgänger des ZTE Open.
+

ZTE Open

+ +

ikura

+ 		2. Juli 20131.0.1Zur Zeit verfügbarBaugleich mit inari, erhältlich auf eBay.
+

LG Fireweb

+ +

leo

+ 		24. Oktober 20131.1Zur Zeit verfügbarVerfügbar in Brasilien.
+

Geeksphone Keon

+ +

keon

+ 		24. April 20131.0.1 +

Zur Zeit nicht verfügbar

+ 		Nur für Entwickler
+

Geeksphone Peak

+ +

peak

+ 		24. April 20131.0.1Zur Zeit nicht verfügbarehemaliger Code-Name "twist", nur für Entwickler
Geeksphone Peak+---gestoppt
Geeksphone Revolution4. März 20141.3preZur Zeit verfügbarOnline erhältlich
+

LG Google Nexus 4

+ +

nexus-4

+ 		   Test-Gerät. Weder von LG noch von Google unterstützt. Nicht mehr unterstützte Hardware.
+

Flame

+ +

Mozillas Referenz-Gerät

+ 		April 20141.3  +

Auf Vorbestellung erhältlich

+ +

Ausverkauft seit Dezember 2014

+
+

Spreadtrum

+ +

tarako

+ 		Ende Q2 2014? Demnächst verfügbar 
ZTE Open C13. Mai 20141.3Zur Zeit verfügbarOnline erhältlich
Symphony GoFox F1516. September 20141.4Zur Zeit verfügbarNur in Bangladesch erhältlich bei Grameenphone Vertriebspartnern
Intex Cloud Fx 1.3 Nicht mehr verfügbar 
Spice Fire One (Mi-FX1) 1.3 Nicht mehr verfügbar 
Alcatel OneTouch Fire C 4020D1. Oktober 20141.3 Nicht mehr verfügbar 
Zen U105 Fire16. Oktober 20141.3 Zur Zeit verfügbarErhältlich auf Homeshop18, Indien
Cherry Mobile AceNovember 20141.3TZur Zeit verfügbarErhältlich auf den Philippinen.
Fx0Dezember 20142.0Zur Zeit verfügbarErhältlich in Japan (KDDI.)
Orange Klif20152.0Zur Zeit verfügbarErhältlich in vielen afrikanischen Ländern.
ZTE Open C220152.1Zur Zeit verfügbarOnline erhältlich
+ +

Firefox OS Versionen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Version +

Feature Complete (FC) Datum

+ 		Release To Partner
+ (RTP) Datum		CodenameGecko VersionEnthaltene Security FixesRelease Infos
1.022. Dezember 201221. Februar 2013TEFGecko 18Gecko 18 
1.0.115. Januar 20136. September 2013ShiraGecko 18Gecko 20Entwickler
+ Anwender
1.129. März 20139. Oktober 2013LeoGecko 18+ (new APIs)Gecko 23Entwickler
+ Anwender
1.1.1 TBDHDWie 1.1.0 mit WVGAGecko 23 
1.215. September 20139. Dezember 2013KoiGecko 26[39]Gecko 26Entwickler
+ Anwender
1.39. December 2013TBD Gecko 28Gecko 28Entwickler
+ Anwender
1.417. März 2014TBD Gecko 30Gecko 30Entwickler
+ Anwender (TBD)
2.0TBDTBD Gecko 32Gecko 32Entwickler
+ Anwender (TBD)
2.1Januar 2015?TBD Gecko 34Gecko 34Entwickler
2.2Juni 2015TBD Gecko 37Gecko 37Entwickler
2.5November 2015TBD TBDTBD 
+ +

Geräte-Spezifikationen

+ +

Bitte beachte, dass wir in einigen Fällen bereits vor öffentlicher Verfügbarkeit eines angekündigten Gerätes dessen Code-Namen und einige seiner Eigenschaften hier veröffentlichen. Bitte FÜGE KEINE zusätzlichen Informationen zu diesen Geräten hinzu bevor Andreas Gal oder jemand vergleichbares diese Informationen veröffentlicht hat. Im Zweifelsfall wende Dich bitte an den Firefox OS Program Manager.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameVersionenAuflösungDisplay (Inches)CPUKamera(s), MpxRAMROMSpeicherBatterie (mAh)
+

Alcatel One Touch Fire

+ +

hamachi, buri

+ 		v1.0.1/v1.1 +

320 x 480
+ PX=1

+ 		3.5Qualcomm Snapdragon S1 MSM7227A 1 GHzRückseite: 3.2256MB512MB/data: wahrscheinlich identisch mit inari; laut Hersteller 160MB Speicher für Anwendungen;
+ Wahrscheinlich kein interner DeviceStorage, MicroSD Karte (max. 32GB) benötigt
+  		1400
Alcatel One Touch Fire Ev1.3.0540 x 9604.5Qualcomm Snapdragon 200
+ MSM8210
+ 1.2 GHz
+ dual-core		Rückseite: 5.0512MB   
+

ZTE Open / variants

+ +

ikura

+ 		v1.0.1 (as shipped)320 x 480
+ PX=1		3.5Qualcomm Snapdragon S1 MSM7225A 800 MHzRückseite: 3.2256MB512MB +

/data: 152M
+ Kein interner DeviceStorage, MicroSD Karte benötigt

+ 		1200
+

LG Fireweb

+ +

leo

+ 		v1.1320 x 480
+ PX=1		4Qualcomm  Snapdragon S1 MSM7227A 1 GHzRückseite: 5.0512MB4GB +

/data: 1007.90M
+ interner DeviceStorage: ja, Größe ungewiss, möglicherweise 3.7G, könnte aber auch eine falsche Berechnung sein. Der Wert von /sys/devices/platform/msm_sdcc.3/mmc_host/mmc0/mmc0:0001/block/mmcblk0/block ist 7733248, bei einer angenommenen Blockgröße von 512 byte kommen wir auf 3.7G.

+ 		1540
+

Geeksphone Keon

+ +

keon

+ 		+

v1.0.1 - nightly
+ downloads here

+ 		320 x 480
+ PX=1		3.5Qualcomm Snapdragon S1 7225AB 1 GHzRückseite: 3.0512MB4GB +

/data: 1.5G
+ interner DeviceStorage: 1023.4M

+ 		1580
+

Geeksphone Peak

+ +

peak

+ 		v1.0.1 - nightly
+ downloads here		540 x 960
+ PX=1.5		4.3Qualcomm Snapdragon S4 8225 1.2 GHz dual-core +

Frontseite: 2.0
+ Rückseite: 8.0

+ 		512MB4GB/data: 1.5G
+ interner DeviceStorage: 1023.4M		1800
Geeksphone Revolutionv1.3pre (as shipped)540 x 960 PX=1.54.7Dual-core Intel® Atom™ processor Z2560 with up to 1.6GHz +

Frontseite: 1.3 Rückseite: 8.0

+ 		1GB4GB +

/data: 2G
+ interner DeviceStorage: 2.5GB

+ 		2000
+

Nexus 4

+ +

nexus-4

+ 		v1.3 - nightly768 x 1280
+ 720p		4.7 +

Qualcomm
+ Snapdragon S4 Pro
+ 1.5 GHz quad-core

+ 		Rückseite: 8.02GB8 or 16GBHier wird alles in einem ziemlich undurchsichtigen Bereich gespeichert, es gibt keinen externen Speicher (MicroSD).  Die Größe des Bereichs variiert je nach dem, welches Nexus 4 Modell Du hast.2100
+

Foxconn InFocus

+ +

flatfish

+ 		 1280 x 80010Allwinner A31, Cortex A7 Quad-Core 1.0 GHz +

Frontseite: 2.0
+ Rückseite: 5.0

+ 		2GB16GB 7000
+

some phone thing

+ +

fugu

+ 		v1.2f (branch) per320 x 480   256MB   
+

Spreadtrum SC6821

+ +

tarako

+ 		v1.3 perHVGA
+ 320 x 480		3.5Spreadtrum SC6821, Cortex A5 1GHz0.3 (nur Rückseite?)128MB (zram)2GB NAND flash (external) + 1GB LPDDR1 (embedded)32GB micro SD card1100
+

VIA Vixen

+ +

community-driven customization of flatfish?

+ 		 1024 x 6007Cortex-A9 Dual Core 1.2 GHz +

Frontseite: 0.3 Rückseite: 2.0

+ 		1GB8GB  
+

Flame

+ +

Mozillas Referenz-Gerät

+ 		v1.3 +

FWVGA
+ 854 × 480
+ PX=1.5
+  

+ 		4.5 capacitive touch +

Qualcomm Snapdragon 200 MSM8210, 1.2GHZ Dual core processor

+ 		+

Frontseite: 2.0
+ Rückseite: 5.0 Auto-Fokus und Blitz
+  

+ 		256MB–1GB (adjustable by developer)8GB32GB micro SD card (USB 2.0)1800
ZTE Open Cv1.3800 x 4804Qualcomm Snapdragon 200 MSM8210, 1.2GHZ Dual core processorRückseite: 3.0512MB4GB +

/data: 1G

+ 		1400
Symphony GoFox F15v1.4320 x 480
+ PX=?		3.5Spreadtrum 1 GHz Single Core ProcessorFrontseite: 0.3
+ Rückseite: 3.2 mit Blitz		512MB512MB 1450
Intex Cloud FxV 1.3320 x 4803.5Spreadtrum 1 GHzRückseite: 2.0 ohne Blitz128 MB256MB +

Data : 2G

+ +

Interner Speicher: 46 MB (User Memory)

+ +

Externer Speicher (Micro SD Card): max. 4GB

+ 		1250
Spice Fire One (Mi-FX1)V 1.3320 x 4803.5Spreadtrum 1 GHz +

Frontseite: VGA

+ +

Rückseite: 1.3

+ 		128 MB512MB +

Data : 2G

+ +

Interner Speicher: 67.9 MB (User Memory)

+ +

Externer Speicher (Micro SD Card): max. 4GB

+ 		1400
Alcatel OneTouch Fire C 4020DV 1.3320 x 4803.5Spreadtrum 1 GHz 128 MB256MB +

Data : 2G

+ +

Interner Speicher : 65 MB (User Memory)

+ +

Externer Speicher (Micro SD Card): max. 32GB

+ 		1000
Zen U105 FireV 1.3320 x 4803.5Spreadtrum 1 GHz +

Frontseite: VGA

+ Rückseite: 2.0		128 MB256MB +

Data : 2G

+ +

Externer Speicher (Micro SD Card): max. 16GB

+ 		1200
Fx0V 2.01280 x 7204.7Qualcomm Snapdragon S4 MSM8926 1.2GHz quad-core +

Frontseite: 8.0

+ +

Rückseite: 2.1

+ 		1.5 GB16GBmicroSDXC Karte: max. 64GB2370
Orange KlifV 2.0480 x 3203.5MediaTek dual-core 1Ghz MT6572MRückseite: 2.0256MB512MBTBC1300
ZTE Open C 2V 2.1WVGA4.0Spreadturn  SC7715 1GBRückseite: 2.0512MB4GBExterner Speicher (Micro SD Card): max. 32GB1400
+ +

Anmerkungen zu den Spalten:

+ + diff --git a/files/de/archive/b2g_os/phone_guide/zte_open_c/index.html b/files/de/archive/b2g_os/phone_guide/zte_open_c/index.html new file mode 100644 index 0000000000..7b74fddbf2 --- /dev/null +++ b/files/de/archive/b2g_os/phone_guide/zte_open_c/index.html @@ -0,0 +1,82 @@ +--- +title: ZTE OPEN C +slug: Archive/B2G_OS/Phone_guide/ZTE_OPEN_C +tags: + - Update + - Upgrade + - ZTE Open C + - reagiert nicht mehr +translation_of: Archive/B2G_OS/Phone_guide/ZTE_OPEN_C +--- +
+

Das ZTE Open C Firefox OS Handy ist ein fortgeschrittenes Firefox OS Gerät von ZTE das über bessere Hardware verfügt, die unter anderem eine 3MP Kamera und einen 4-inch WVGA Display umfasst und bei dem Firefox OS 1.3 vorinstalliert ist. Dieser Artikel enthält Informationen über das Gerät, darunter Anleitungen zum Updaten und zur Fehlerbeseitigung.

+
+
+

Bitte Beachten: Diese Anleitungen sind nicht für das ZTE Open. Wenn Sie ein ZTE Open haben, sollten Sie stattdessen zu unterer ZTE Open Seite gehen.

+
+
+

Bitte beachten: Das Upgrade-Programm welches Sie benötigen, um das Handy zu entsprechen (s.u.) ist derzeit nur für Windows erhältlich. Kaufen Sie das Handy nicht, wenn Sie nicht über ein Windows-System verfügen und trotzdem selbst Ihre eigenen Versionen von Firefox OS installieren wollen.

+
+

Das ZTE Open C ist das erste Handy mit dem jüngsten update für Firefox OS. Es bietet viele neue Funktionen, darunter den Direktzugriff auf den Musikplayer vom Sperrbildschirm oder dem Benachrichtigungsfeld aus und Bluetooth sharing, mit dem dem Sie mehrere Dateien gleichzeitig übertragen können. Nutzer können jetzt schneller durch die Menüs navigieren mithilfe von intelligenten Ordnern, die automatisch Apps oder die Suche nach Apps nach Kategorien ordnen mit verbesserter Geschwindigkeit beim Scrollen und einem schnelleren Start von Systen-Apps wie Kalender, Addressbuch und Kamera.

+

Der Kauf eines Geräts

+

Das Gerät kostet US$99.99, es ist bei eBay erhältlich:

+ +
+

Bitte beachten: Sie erhalten das Gerät ohne dass irgendwelche Netzwerk-spezifischen Apps oder Dienste installert wären. Es handelt sich um eine entsperrte, global erhältliche Variante, die für early Adopters gedacht ist.

+
+

Einzelheiten zum Handy

+

Siehe Phone and device specs.

+

Wie Sie Firefox OS upgraden

+

Der einfachste Weg, um die Software Ihres Open C upzugraden ist es, die Dateien von der ZTE-Webseite zu verwenden. Um die richtige Datei zu finden, gehen Sie zu ZTE's Software support page, wählen Sie Ihre Region aus der Liste auf der linken Seite, wählen Sie Smart Phones in der mittleren Liste und Open C(European Standard) bzw. Open C(American Standard), je nachdem, wo Sie das Gerät gekauft haben. Klicken Sie dann auf Selected um zu Ihrer Download-Seite zu gelangen.

+

Sobald Ihr Download beendet ist, finden Sie ein PDF in der ZIP-Datei, das Ihnen erklärt, wie das Upgrade zu installieren ist.

+

"Manuelle" Updates

+

Wenn Sie selbst Gecko oder Gaia updaten wollen, ist der Vorgang etwas verzwickter, weil das Handy standardmäßig gesperrt ist und Sie keinen Root-Zugang haben. Um das Gerät zu entsperren, können Sie folgendes Programm von comebuy.com benutzen:Open_C_upgrade_Tool. Durch die Installation dieses Programms wird die Fimware Ihres Geräts so verändert, dass der Root-Zugang Fastboot aktiviert werden und Sie die Möglichkeit haben, Ihr Telefon mit neuen Softwarekomponenten zu flashen.

+
+

Bitte beachten: Dieses Upgrade-Programm ist derzeit nur für Windows verfügbar.

+
+

Gecko und Gaia upgraden

+

Sobald Sie Fastboot aktiviert haben, können Sie neue Firefox OS/B2G Gecko und Gaia Komponenten erstellen und installieren: build and install new Firefox OS/B2G.

+
    +
  1. Beginnen Sie mit folgender Anleitung: build prerequisite, wobei Sie das Open C zum Zwecke der Konfiguration wie ein Flame behandeln: Beide, Flame und Open C basieren auf dem Android Jellybean Basissystem.
    2. +
  2. Während der Konfiguration müssen Sie ein sog. "Custom Manifest File" für das Open C referenzieren. Laden Sie den Anhang zur Fehlermeldung auf folgender Seite herunter: Download the attachment on this bug und speichern Sie ihn an einem Ort auf ihrem Computer, den Sie leicht wiederfinden unter dem Dateinamen openc.xml.
    3. +
  3. Räumen Sie das B2G Verzeichnis auf und löschen Sie nicht benötigte Unterverzeichnisse:
    + 
    rm -rf objdir-gecko/ out/ backup-flame/
    +
    4. +
  4. Konfigurieren Sie jetzt Firefox OS mit dem nachfolgenden Befehl:
    + 
    ./config.sh flame /PATH/TO/openc.xml
    +
    5. +
  5. Sie können jetzt die Gecko Komponenten mit den nachfolgenden Befehlen bauen und auf Ihr Gerät flashen: + 
    ./build.sh gecko
+./flash.sh gecko
    +
    6. +
  6. Jetzt sollten Sie auch Gaia upgraden, damit die upgegradete Version von Gecko mit der Gaia-Version auf Ihrem Gerät zusammenarbeietet: + 
    cd gaia
+make reset-gaia
    +
    7. +
+
+

Achtung: Der Versuch, ein Image für das Flame auf Ihr Gerät zu flashen würde dieses unbrauchbar machen, weswegen hiervon abgeraten wird.

+
+

Gaia upgraden

+

Wenn Sie nur ein Update von Gaia und nicht auch von Gecko durchführen wollen, müssen Sie zunächst das Gaia Repo auf Github forken und klonen und das Ergebnis auf Ihr Gerät flashen.

+
    +
  1. Stellen Sie sicher dass ADB installiert ist.
    2. +
  2. Gehen Sie zu https://github.com/mozilla-b2g/gaia, klicken Sie dann auf den "fork" button in der oben rechten Ecke um in Ihr eigenes Repo zu forken.
    3. +
  3. Klonen Sie den Code von ihrem geforkten Repo auf Ihren eigenen Rechner, indem Sie folgenden Befehl ausführen: + 
    git clone https://github.com/your-github-username/gaia.git
    +
    4. +
  4. Wechseln Sie in das hierdurch erstellte Verzeichnis.
    5. +
  5. Schalten Sie auf ihrem Gerät remote debugging ein (wählen Sie die ADB und Devtools option).
    6. +
  6. Verbinden Sie jetzt Ihr Handy per USB mit Ihrem Computer, stellen Sie sicher, dass das Gerät erkannt wird, indem Sie den Befehl adb devices im terminal eingeben.
    7. +
  7. Führen Sie folgenden Befehl aus, um Ihr Handy neu zu starten und es mit dem neuesten Gaia Sourcecode upzudaten + 
    make reset-gaia
    +
    8. +
+

Mein Handy reagiert nicht mehr

+

Wenn Ihr Gerät nicht mehr reagiert, ist es unter Umständen möglich, es mit der unter  ZTE Open C user manual auf der Webseite von ZTE verfügbaren Anleitung und der  Anleitung auf dieser Seite wieder zum  Leben zu erwecken.

+

Weitere Informationen sind unter Umständen hier: reference this support entry verfügbar.

diff --git a/files/de/archive/b2g_os/platform/app_architektur/index.html b/files/de/archive/b2g_os/platform/app_architektur/index.html new file mode 100644 index 0000000000..315efb5b4e --- /dev/null +++ b/files/de/archive/b2g_os/platform/app_architektur/index.html @@ -0,0 +1,29 @@ +--- +title: Firefox OS App-Architektur +slug: Archive/B2G_OS/Platform/App_Architektur +tags: + - Anleitung + - Apps + - B2G + - Firefox OS +translation_of: Archive/B2G_OS/Platform/Apps_architecture +--- +
+

Dieser Artikel beschreibt die Details, wie Apps in Firefox OS gestartet und verwaltet werden. Diese Informationen sind hilfreich sowohl für Firefox OS-Plattformentwickler als auch für Gruppen, die das Betriebssystem auf neue Hardware portieren. Als App-Entwickler benötigt man diesen Artikel nicht unbedingt, aber er könnte trotzdem interessant sein.

+
+

Der App-Startprozess

+

Wenn der Nutzer eine App, die er starten möchte, auswählt oder eine App auf andere Weise gestartet werden soll, startet die  Home-Screen-App, indem sie sich eine App-Referenz von der {{domxref("App")}}-API holt  und dann die Methode {{domxref("App.launch()")}} aufruft, um die App zu starten.

+

Gecko empfängt diese Anforderung und sendet das {{domxref("mozChromeEvent")}} mit den App-Details zur System-App. Die System-App verarbeitet dieses Ereignis, indem sie ein neues {{HTMLElement("iframe")}}-Element in den DOM-Baum einfügt und die App in dieses neue {{HTMLElement("iframe")}}-Element lädt. Dieser Rahmen ist dann die Heimat der App, bis sie beendet wird.

+

Jede App benötigt ein Manifest, das sie beschreibt, und hat eine spezielle Dateihierarchie im Paket. Details stehen im Artikel App manifest.

+

Kommunikation mit Gecko

+

Die Kommunikation zwischen Gecko und Gaia's System-App passiert über {{domxref("mozChromeEvent")}} und {{domxref("mozContentEvent")}}. mozChromeEvents werden von Chrome zum Inhalt und mozContentEvents vom Inhalt zu Chrome gesendet. Diese Kommunikation wird benutzt, um die Erzeugung und das Schließen der vertrauten Benutzeroberfläche zu steuern und die benötigten Funktionen für Benachrichtigungen und andere Aufgaben bereitzustellen, dazu gehört auch, der System-App mitzuteilen, dass eine App gestartet werden soll.

+
+

Anmerkung: Mehr dazu, wie diese Ereignisse funktionieren, findet man in der System-App-Dokumentation. Eine andere Quelle, wie man die Ereignisse benutzt, findet man im Quellcode in {{source("b2g/chrome/content/shell.js")}}.

+
+

See also

+ diff --git a/files/de/archive/b2g_os/platform/architektur/index.html b/files/de/archive/b2g_os/platform/architektur/index.html new file mode 100644 index 0000000000..c438e89c9f --- /dev/null +++ b/files/de/archive/b2g_os/platform/architektur/index.html @@ -0,0 +1,740 @@ +--- +title: Firefox OS Architektur +slug: Archive/B2G_OS/Platform/Architektur +translation_of: Archive/B2G_OS/Architecture +--- +
+

Dieser Artikel gibt eine Übersicht über die Architektur der Firefox OS Plattform und beschreibt die grundlegenden Konzepte und wie die einzelnen Komponenten prinzipiell zusammen arbeiten.

+
+ +
+

Hinweis: Bitte denke daran, dass Firefox OS noch nicht veröffentlicht ist. Die hier beschriebene Architektur ist möglicherweise noch nicht endgültig und es können sich noch ein paar Dinge ändern.

+
+ +

Firefox OS Begriffserklärungen

+ +

Einige Begriffe solltest Du kennen, bevor Du die Dokumentation von Firefox OS liest.

+ +
+
B2G
+
Kurzform von "Boot to Gecko"
+
Boot to Gecko
+
Der interne Code-Name für das Firefox OS Betriebssystem. Du wirst diesen Begriff häufig als Synonym für Firefox OX finden, weil dieser Code-Name schon lange genutzt wurde bevor das Projekt einen offiziellen Namen hatte.
+
Firefox OS
+
Firefox OS stellt im Grunde das Mozilla Branding (und das von OEM Partnern) und verschiedene Support-Programme über der Boot to Gecko Ebene bereit, um aus den einzelnen Komponenten ein marktfähiges Produkt zu machen.
+
Gaia
+
Das ist die Benutzeroberfläche (User Interface) der Firefox OS Plattform. Alles, was nach dem Start von Firefox OS auf dem Bildschirm zu sehen ist wird von der Gaia Schicht erzeugt. Gaia implementiert den Sperrbildschirm, die Startseite und alle Apps, die man von einem modernen Smartphone erwartet. Die Gaia Schicht wurde vollständig in HTML, CSS und JavaScript geschrieben. Gaia kommuniziert mit dem darunter liegenden Betriebssystem ausschließlich über offene Web APIs, die durch Gecko bereit gestellt werden. Anwendungen von Drittanbietern können neben Gaia installiert werden.
+
Gecko
+
Gecko ist die Laufzeitumgebung von Firefox OS. Diese Schicht stellt alles zur Verfügung, was für die drei offenen Standards HTML, CSS und JavaScript benötigt wird. Gecko stellt sicher, dass diese APIs auf jedem von Gecko unterstützten Betriebssystem gut funktionieren. Zu diesem Zweck beinhaltet Gecko unter anderem Netzwerk-, Grafik- und Layoutstacks sowie eine Virtuelle Maschine für JavaScript und Schichten für die Portierung.
+
Gonk
+
Gonk ist eine tiefer liegende Schicht des Firefox OS Betriebsystems, bestehend aus dem Linux Kernel (basierend auf dem Android Open Source Project (AOSP)) und der Hardware-Abstraktionsschicht (hardware abstraction layer, HAL). Der Linux Kernel und einige der Anwendungs-Bibliotheken sind allgemeine Open Source Projekte: Linux, libusb, bluez und andere. Einige Pakete des HAL sind Gemeinschafts-Projekte mit AOSP: GPS, Kamera und andere. Man könnte sagen, Gonk ist eine sehr einfache Linux Distribution. Gonk ist ein Port von Gecko. Das heißt, es gibt einen Port von Gecko zu Gonk, so wie es Ports von Gecko zu Mac OS X, Windows und Android gibt. Seit das Firefox OS Projekt die alleinige Kontrolle über Gonk hat können wir Schnittstellen zu Gecko entwickeln, die auf anderen Betriebssystemen nicht möglich sind. Zum Beispiel hat Gecko auf Gonk direkten Zugriff zur gesamten Telefonie-Einheit und zum Display Frame Buffer. Auf anderen Betriebssystemen ist dies nicht möglich.
+
Jank
+
Dieser im Bereich der mobilen Web Apps häufig genutzte Begriff bezeichnet den Effekt von langsamem und ineffizientem Code in einer App, wodurch die Aktualisierung der Benutzeroberfläche blockiert wird und diese nur noch langsam oder überhaupt nicht mehr reagiert. Unsere Gaia Entwickler nutzen verschiedene Optimierungs-Techniken, um diese Probleme unter allen Umständen zu verhindern.
+
+ +

Overall architecture

+ +

The following figure compares architectures between proprietary platforms and Firefox OS.

+ +

on the left is a native mobile architecture stack, on the right is the Firefox OS architecture. they are similarm except that the native stack is all proprietary device functionality, and the Firefox OS stack is all done with open source and web technologies.

+ +

Firefox OS eliminates the native API layer between the operating system and application layers. This integrated design reduces platform overhead and simplifies security without sacrificing performance or a rich user smart phone experience.

+ +
    +
  1. Gaia is the core web apps of the device, and user interface layer, all written in HTML5, CSS and JavaScript, with a number of exposed APIs to allow the UI code to interact with the phone hardware and Gecko functionality.
    2. +
  2. Gecko is the web engine and presentation layer in Firefox OS that connects hardware to HTML by serving as the interface between web content and the underlying device. Gecko provides an HTML5 parsing and rendering engine, programmatic access to hardware functionality via secure web APIs, a comprehensive security framework, update management, and other core services.
    3. +
  3. Gonk is the kernel-level component in the Firefox OS stack that serves as the interface between Gecko and the underlying hardware. Gonk controls the underlying hardware and exposes hardware capabilities to Web APIs implemented in Gecko. Gonk can be seen as the “black box” that does all the complex, detailed work behind the scenes to control the mobile device by enacting requests at the hardware level.
    4. +
  4. The mobile device is the mobile phone hardware running Firefox OS. The OEM (Original Equipment Manifacturer) is responsible for providing the mobile device.
    5. +
+ +

Specific Firefox OS architecture

+ +

Firefox OS Architecture

+ +

Firefox OS bootup procedure

+ +

This section describes the process by which Firefox OS devices boot, what parts are involved, and where. As a quick reference, the general system bootup flow goes from bootloaders in the Kernel space, to init in the native code, to B2G and then Gecko in the user space, and then finally to the system app, window manager, then homescreen app inside Gecko. This is what all other apps are executed on top of.

+ +

+ +

The bootstrapping process

+ +

When a Firefox OS device is first turned on, execution begins in the primary bootloader. From there, the process of loading the main operating system proceeds in the typical way; a succession of increasingly higher-level bootloaders bootstrap the next loader in the chain. At the end of the process, execution is handed off to the Linux kernel.

+ +

There are a few points worth noting about the boot process:

+ + + +

The Linux kernel

+ +

The Linux kernel(s) used by Gonk is very similar to the upstream Linux from which it's derived (based on the Android Open Source Project). There are a few changes made by the AOSP that have not yet been upstreamed. In addition, vendors sometimes modify the kernel and upstream those changes on their own schedule. In general, though, the Linux kernel is close to stock.

+ +

The startup process for Linux is well-documented elsewhere on the Internet, so this article won't cover that.

+ +

The Linux Kernel will bring up devices and run essential processes. It will execute processes defined in init.rc and the successor init.b2g.rc to boot essential process such as b2g (FirefoxOS basic process, containing Gecko) and rild (telephony related process that might proprietary by different chipsets) — see below for more details. At the end of the process, a userspace init process is launched, as it is in most UNIX-like operating systems.

+ +

Once the init process is launched, the Linux kernel handles system calls from userspace, and interrupts and the like from hardware devices. Many hardware features are exposed to userspace through sysfs. For example, here's a code snippet that reads the battery state in Gecko:

+ +
FILE *capacityFile = fopen("/sys/class/power_supply/battery/capacity", "r");
+double capacity = dom::battery::kDefaultLevel * 100;
+if (capacityFile) {
+  fscanf(capacityFile, "%lf", &capacity);
+  fclose(capacityFile);
+}
+ +

More on the init process

+ +

The init process in Gonk handles mounting the required file systems and spawns system services. After that, it stays around to serve as a process manager. This is quite similar to init on other UNIX-like operating systems. It interprets scripts (that is, the init*.rc files) that consist of commands describing what should be done to start various services. The Firefox OS init.rc is typically the stock Android init.rc for that device patched to include the things required to kick-start Firefox OS, and varies from device to device.

+ +

One key task the init process handles is starting up the b2g process; this is the core of the Firefox OS operating system.

+ +

The code in init.rc that starts this up looks like this:

+ +
service b2g /system/bin/b2g.sh
+  class main
+  onrestart restart media
+ +
+

Note: Exactly how much init.rc differs from the Android version varies from device to device; sometimes, init.b2g.rc is simply appended, and sometimes the patches are more significant.

+
+ +

The userspace process architecture

+ +

Now it's useful to take a high-level look at how the various components of Firefox OS fit together and interact with one another. This diagram shows the primary userspace processes in Firefox OS.

+ +

Userspace diagram

+ +
+

Note: Keep in mind that since Firefox OS is under active development, this diagram is subject to change, and may not be entirely accurate.

+
+ +

The b2g process is the primary system process. It runs with high privileges; it has access to most hardware devices. b2g communicates with the modem, draws to the display framebuffer, and talks to GPS, cameras, and other hardware features. Internally, b2g runs the Gecko layer (implemented by libxul.so). See Gecko for details on how the Gecko layer works, and how b2g communicates with it.

+ +

b2g

+ +

The b2g process may, in turn, spawn a number of low-rights content processes. These processes are where web applications and other web content are loaded. These processes communicate with the main Gecko server process through IPDL, a message-passing system.

+ +

The b2g process runs libxul, which references b2g/app/b2g.js to get default preferences. From the preferences it will open the described HTML file b2g/chrome/content/shell.html, which is compiled within the omni.ja file. shell.html includes b2g/chrome/content/shell.js file, which triggers the Gaia system app.

+ +

rild

+ +

The rild process is the interface to the modem processor. rild is the daemon that implements the Radio Interface Layer (RIL). It's a proprietary piece of code that's implemented by the hardware vendor to talk to their modem hardware. rild makes it possible for client code to connect to a UNIX-domain socket to which it binds. It's started up by code like this in the init script:

+ +
service ril-daemon /system/bin/rild
+  socket rild stream 660 root radio
+ +

rilproxy

+ +

In Firefox OS, the rild client is the rilproxy process. This acts as a dumb forwarding proxy between rild and b2g. This proxy is needed as an implementation detail; suffice it to say, it is indeed necessary. The rilproxy code can be found on GitHub.

+ +

mediaserver

+ +

The mediaserver process controls audio and video playback. Gecko talks to it through an Android Remote Procedure Call (RPC) mechanism. Some of the media that Gecko can play (OGG Vorbis audio, OGG Theora video, and WebM video) are decoded by Gecko and sent directly to the mediaserver process. Other media files are decoded by libstagefright, which is capable of accessing proprietary codecs and hardware encoders.

+ +
+

Note: The mediaserver process is a "temporary" component of Firefox OS; it's there to aid in our initial development work, but is expected to go away eventually. This will most likely not happen until Firefox OS 2.0 at the earliest, however.

+
+ +

netd

+ +

The netd process is used to configure network interfaces.

+ +

wpa_supplicant

+ +

The wpa_supplicant process is the standard UNIX-style daemon that handles connectivity with WiFi access points.

+ +

dbus-daemon

+ +

The dbus-daemon implements D-Bus, a message bus system that Firefox OS uses for Bluetooth communication.

+ +

Gecko

+ +

Gecko, as previously mentioned, is the implementation of web standards (HTML, CSS, and JavaScript) that is used to implement everything the user sees on Firefox OS, and control interactions with the phone hardware. Web apps connect HTML5 to hardware via controlled, secure Web APIs, implemented in Gecko. The Web APIs provide programmatic access to features in the underlying mobile device hardware (such as the battery or vibration), along with data that is stored on, or available to, a device (such as the calendar or contacts). Web content invokes the accessible Web APIs within HTML5.

+ +

An app consists of a collection of related HTML5 web content. To build web apps that run on Firefox OS mobile devices, developers simply assemble, package, and distribute this web content. At run time, this web content is interpreted, compiled, and rendered in a web browser. For more information on Apps, see the App Center.

+ +
+

Note: To search the Gecko codebase, you could use http://dxr.mozilla.org. It’s more fancy and provides good reference features, but with limited repositories. Or you could try the traditional http://mxr.mozilla.org, which contains more Mozilla projects.

+
+ +

Gecko architecture diagram

+ +

+ + + + + +

b2g/

+ +

The b2g folder contains mainly Firefox OS-related functions.

+ +
b2g/chrome/content
+ +

Contains Javascript files run above the system app.

+ +
b2g/chrome/content/shell.html
+ +

The entry point into Gaia — the HTML for the system app. shell.html pulls in settings.js and shell.js:

+ +
<script type="application/javascript;version=1.8" src="chrome://browser/content/settings.js"> </script>
+<script type="application/javascript;version=1.8" src="chrome://browser/content/shell.js"> </script>
+ +

settings.js contains system default setting parameters.

+ +
b2g/chrome/content/shell.js
+ +

shell.js is the first script to load in the Gaia system app.

+ +

shell.js imports all required modules, registers key listeners, defines sendCustomEvent and sendChromeEvent to communicate with Gaia, and provides webapp install helpers: indexedDB quota, RemoteDebugger, keyboard helper, and screenshot tool.

+ +

But the most important function of shell.js is to launch the Gaia system app, then hand over the overall systems related management work to the Gaia system app.

+ +
let systemAppFrame =
+  document.createElementNS('http://www.w3.org/1999/xhtml', 'html:iframe');
+    ...
+  container.appendChild(systemAppFrame);
+ +
b2g/app/b2g.js
+ +

This script contains predefined settings, like about:config in browser, and the same as Gaia's pref.js. These settings can be changed from the Settings app, and can be overwritten with Gaia’s user.js in the Gaia build script.

+ +

dom/{API}

+ +

New API implementations (post-b2g) will be located in dom/. Older APIs will be located in dom/base, for example Navigator.cpp.

+ +
dom/apps
+ +

.jsm will be loaded — .js API implementations such as webapp.js install, getSelf, etc.

+ +
dom/apps/PermissionsTable.jsm
+ +

All permissions are defined in PermissionsTable.jsm

+ +

dom/webidl

+ +

WebIDL is the language used to define web APIs. For supported attributes, read WebIDL_bindings.

+ +

hal/gonk

+ +

This directory contains files related to the gonk port layer.

+ +

Generated files

+ +
module/libpref/src/init/all.js
+ +

Contains all config files.

+ +
/system/b2g/ omni.ja and omni.js
+ +

Contains the pack of styles for resources in the device.

+ +

Processing input events

+ +

Most action inside Gecko is triggered by user actions. These actions are represented by input events (such as button presses, touches to a touch screen device, and so forth). These events enter Gecko through the Gonk implementation of nsIAppShell, a Gecko interface that is used to represent the primary entrance points for a Gecko application; that is, the input device driver calls methods on the nsAppShell object that represents the Gecko subsystem in order to send events to the user interface.

+ +

For example:

+ +
void GeckoInputDispatcher::notifyKey(nsecs_t eventTime,
+                                     int32_t deviceId,
+                                     int32_t source,
+                                     uint32_t policyFlags,
+                                     int32_t action,
+                                     int32_t flags,
+                                     int32_t keyCode,
+                                     int32_t scanCode,
+                                     int32_t metaState,
+                                     nsecs_t downTime) {
+  UserInputData data;
+  data.timeMs = nanosecsToMillisecs(eventTime);
+  data.type = UserInputData::KEY_DATA;
+  data.action = action;
+  data.flags = flags;
+  data.metaState = metaState;
+  data.key.keyCode = keyCode;
+  data.key.scanCode = scanCode;
+  {
+    MutexAutoLock lock(mQueueLock);
+    mEventQueue.push(data);
+  }
+  gAppShell->NotifyNativeEvent();
+}
+ +

These events come from the standard Linux input_event system. Firefox OS uses a light abstraction layer over that; this provides some nice features like event filtering. You can see the code that creates input events in the EventHub::getEvents() method in widget/gonk/libui/EventHub.cpp.

+ +

Once the events are received by Gecko, they're dispatched into the DOM by nsAppShell:

+ +
static nsEventStatus sendKeyEventWithMsg(uint32_t keyCode,
+                                         uint32_t msg,
+                                         uint64_t timeMs,
+                                         uint32_t flags) {
+    nsKeyEvent event(true, msg, NULL);
+    event.keyCode = keyCode;
+    event.location = nsIDOMKeyEvent::DOM_KEY_LOCATION_MOBILE;
+    event.time = timeMs;
+    event.flags |= flags;
+    return nsWindow::DispatchInputEvent(event);
+}
+ +

After that, the events are either consumed by Gecko itself or are dispatched to Web applications as DOM events for further processing.

+ +

Graphics

+ +

At the very lowest level, Gecko uses OpenGL ES 2.0 to draw to a GL context that wraps the hardware frame buffers. This is done in the Gonk implementation of nsWindow by code similar to this:

+ +
gNativeWindow = new android::FramebufferNativeWindow();
+sGLContext = GLContextProvider::CreateForWindow(this);
+ +

The FramebufferNativeWindow class is brought in directly from Android; see FramebufferNativeWindow.cpp. This uses the gralloc API to access the graphics driver in order to map buffers from the framebuffer device into memory.

+ +

Gecko uses its Layers system to composite drawn content to the screen. In summary, what happens is this:

+ +
    +
  1. Gecko draws separate regions of pages into memory buffers. Sometimes these buffers are in system memory; other times, they're textures mapped into Gecko's address space, which means that Gecko is drawing directly into video memory. This is typically done in the method BasicThebesLayer::PaintThebes().
    2. +
  2. Gecko then composites all of these textures to the screen using OpenGL commands. This composition occurs in ThebesLayerOGL::RenderTo().
    3. +
+ +

The details of how Gecko handles the rendering of web content is outside the scope of this document.

+ +

Hardware Abstraction Layer (HAL)

+ +

The Gecko hardware abstraction layer is one of the porting layers of Gecko. It handles low-level access to system interfaces across multiple platforms using a C++ API that's accessible to the higher levels of Gecko. These APIs are implemented on a per-platform basis inside the Gecko HAL itself. This hardware abstraction layer is not exposed directly to JavaScript code in Gecko — this part of the interaction is handled by the Web APIs.

+ +

Let's look at the process form a high level. When a user makes a request to use a phone feature (such as dialing a number, accessing a local wifi network, or connecting via Bluetooth), all layers in the Firefox OS technology stack are involved in carrying out the request. Apps and web content in the Gaia layer submits requests to access the underlying device via Web API calls (invoked from within HTML5 functions), which are implemented in Gecko. Gecko in turn submits the request to Gonk. A single request from Gecko can trigger a complex series of operations, initiated and managed by Gonk, in the mobile phone.

+ +

How the HAL works

+ +

Let's consider the Vibration API as an example. The Gecko HAL for this API is defined in hal/Hal.h. In essence (simplifying the method signature for clarity's sake), you have this function:

+ +
void Vibrate(const nsTArray<uint32> &pattern);
+ +

This is the function called by Gecko code to turn on vibration of the device according to the specified pattern; a corresponding function exists to cancel any ongoing vibration. The Gonk implementation of this method is in hal/gonk/GonkHal.cpp:

+ +
void Vibrate(const nsTArray<uint32_t> &pattern) {
+  EnsureVibratorThreadInitialized();
+  sVibratorRunnable->Vibrate(pattern);
+}
+ +

This code sends the request to start vibrating the device to another thread, which is implemented in VibratorRunnable::Run(). This thread's main loop looks like this:

+ +
while (!mShuttingDown) {
+  if (mIndex < mPattern.Length()) {
+    uint32_t duration = mPattern[mIndex];
+    if (mIndex % 2 == 0) {
+      vibrator_on(duration);
+    }
+    mIndex++;
+    mMonitor.Wait(PR_MillisecondsToInterval(duration));
+  }
+  else {
+    mMonitor.Wait();
+  }
+}
+ +

vibrator_on() is the Gonk HAL API that turns on the vibrator motor. Internally, this method sends a message to the kernel driver by writing a value to a kernel object using sysfs.

+ +

Fallback HAL API implementations

+ +

The Gecko HAL APIs are supported across all platforms. When Gecko is built for a platform that doesn't expose an interface to vibration motors (such as a desktop computer), then a fallback implementation of the HAL API is used. For vibration, this is implemented in hal/fallback/FallbackVibration.cpp.

+ +
void Vibrate(const nsTArray<uint32_t> &pattern) {
+}
+ +

Sandbox implementations

+ +

Because most web content runs in content processes with low privileges, we can't assume those processes have the privileges needed to be able to (for example), turn on and off the vibration motor. In addition, we want to have a central location for handling potential race conditions. In the Gecko HAL, this is done through a "sandbox" implementation of the HAL. This sandbox implementation simply proxies requests made by content processes and forwards them to the "Gecko server" process. The proxy requests are sent using IPDL.

+ +

For vibration, this is handled by the Vibrate() function implemented in hal/sandbox/SandboxHal.cpp:

+ +
void Vibrate(const nsTArray<uint32_t>& pattern, const WindowIdentifier &id) {
+  AutoInfallibleTArray<uint32_t, 8> p(pattern);
+
+  WindowIdentifier newID(id);
+  newID.AppendProcessID();
+  Hal()->SendVibrate(p, newID.AsArray(), GetTabChildFrom(newID.GetWindow()));
+}
+ +

This sends a message defined by the PHal interface, described by IPDL in hal/sandbox/PHal.ipdl. This method is described more or less as follows:

+ +
Vibrate(uint32_t[] pattern);
+ +

The receiver of this message is the HalParent::RecvVibrate() method in hal/sandbox/SandboxHal.cpp, which looks like this:

+ +
virtual bool RecvVibrate(const InfallibleTArray<unsigned int>& pattern,
+            const InfallibleTArray<uint64_t> &id,
+            PBrowserParent *browserParent) MOZ_OVERRIDE {
+
+  hal::Vibrate(pattern, newID);
+  return true;
+}
+ +

This omits some details that aren't relevant to this discussion; however, it shows how the message progresses from a content process through Gecko to Gonk, then to the Gonk HAL implementation of Vibrate(), and eventually to the Vibration driver.

+ +

DOM APIs

+ +

DOM interfaces are, in essence, how web content communicates with Gecko. There's more involved than that, and if you're interested in added details, you can read about the DOM. DOM interfaces are defined using IDL, which comprises both a foreign function interface (FFI) and object model (OM) between JavaScript and C++.

+ +

The vibration API is exposed to web content through an IDL interface, which is provided in nsIDOMNavigator.idl:

+ +
[implicit_jscontext] void mozVibrate(in jsval aPattern);
+ +

The jsval argument indicates that mozVibrate() (which is our vendor-prefixed implementation of this non-finalized vibration specification) accepts as input any JavaScript value. The IDL compiler, xpidl, generates a C++ interface that's then implemented by the Navigator class in Navigator.cpp.

+ +
NS_IMETHODIMP Navigator::MozVibrate(const jsval& aPattern, JSContext* cx) {
+  // ...
+  hal::Vibrate(pattern);
+  return NS_OK;
+}
+ +

There's a lot more code in this method than what you see here, but it's not important for the purposes of this discussion. The point is that the call to hal::Vibrate() transfers control from the DOM to the Gecko HAL. From there, we enter the HAL implementation discussed in the previous section and work our way down toward the driver. On top of that, the DOM implementation doesn't care at all what platform it's running on (Gonk, Windows, OS X, or anything else). It also doesn't care whether the code is running in a content process or in the Gecko server process. Those details are all left to lower levels of the system to deal with.

+ +

The vibration API is a very simple API, which makes it a good example. The SMS API is an example of a more complex API which uses its own "remoting" layer connecting content processes to the server.

+ +

Radio Interface Layer (RIL)

+ +

The RIL was mentioned in the section The userspace process architecture. This section will examine how the various pieces of this layer interact in a bit more detail.

+ +

The main components involved in the RIL are:

+ +
+
rild
+
The daemon that talks to the proprietary modem firmware.
+
rilproxy
+
The daemon that proxies messages between rild and Gecko (which is implemented in the b2g process). This overcomes the permission problem that arises when trying to talk to rild directly, since rild can only be communicated with from within the radio group.
+
b2g
+
This process, also known as the chrome process, implements Gecko. The portions of it that relate to the Radio Interface Layer are dom/system/gonk/ril_worker.js, which implements a worker thread that talks to rild through rilproxy and implements the radio state machine; and the nsIRadioInterfaceLayer interface, which is the main thread's XPCOM service that acts primarily as a message exchange between the ril_worker.js thread and various other Gecko components, including the Gecko content process.
+
Gecko's content process
+
Within Gecko's content process, the nsIRILContentHelper interface provides an XPCOM service that lets code implementing parts of the DOM, such as the Telephony and SMS APIs talk to the radio interface, which is in the chrome process.
+
+ +

Example: Communicating from rild to the DOM

+ +

Let's take a look at an example of how the lower level parts of the system communicate with DOM code. When the modem receives an incoming call, it notifies rild using a proprietary mechanism. rild then prepares a message for its client according to the "open" protocol, which is described in ril.h. In the case of an incoming call, a RIL_UNSOL_RESPONSE_CALL_STATE_CHANGED message is generated and sent by rild to rilproxy.

+ +

rilproxy, implemented in rilproxy.c, receives this message in its main loop, which polls its connection to rild using code like this:

+ +
ret = read(rilproxy_rw, data, 1024);
+
+if(ret > 0) {
+  writeToSocket(rild_rw, data, ret);
+}
+ +

Once the message is received from rild, it's then forwarded along to Gecko on the socket that connects rilproxy to Gecko. Gecko receives the forwarded message on its IPC thread:

+ +
int ret = read(fd, mIncoming->Data, 1024);
+// ... handle errors ...
+mIncoming->mSize = ret;
+sConsumer->MessageReceived(mIncoming.forget());
+ +

The consumer of these messages is SystemWorkerManager, which repackages the messages and dispatches them to the ril_worker.js thread that implements the RIL state machine; this is done in the RILReceiver::MessageReceived() method:

+ +
virtual void MessageReceived(RilRawData *aMessage) {
+  nsRefPtr<DispatchRILEvent> dre(new DispatchRILEvent(aMessage));
+  mDispatcher->PostTask(dre);
+}
+ +

The task posted to that thread in turn calls the onRILMessage() function, which is implemented in JavaScript. This is done using the JavaScript API function JS_CallFunctionName():

+ +
return JS_CallFunctionName(aCx, obj, "onRILMessage", NS_ARRAY_LENGTH(argv),
+                           argv, argv);
+ +

onRILMessage() is implemented in dom/system/gonk/ril_worker.js, which processes the message bytes and chops them into parcels. Each complete parcel is then dispatched to individual handler methods as appropriate:

+ +
handleParcel: function handleParcel(request_type, length) {
+  let method = this[request_type];
+  if (typeof method == "function") {
+    if (DEBUG) debug("Handling parcel as " + method.name);
+    method.call(this, length);
+  }
+}
+ +

This code works by getting the request type from the object, making sure it's defined as a function in the JavaScript code, then calling the method. Since ril_worker.js implements each request type in a method given the same name as the request type, this is very simple.

+ +

In our example, RIL_UNSOL_RESPONSE_CALL_STATE_CHANGED, the following handler is called:

+ +
RIL[UNSOLICITED_RESPONSE_CALL_STATE_CHANGED] = function UNSOLICITED_RESPONSE_CALL_STATE_CHANGED() {
+  this.getCurrentCalls();
+};
+ +

As you see in the code above, when notification is received that the call state has changed, the state machine simply fetches the current call state by calling the getCurrentCall() method:

+ +
getCurrentCalls: function getCurrentCalls() {
+  Buf.simpleRequest(REQUEST_GET_CURRENT_CALLS);
+}
+ +

This sends a request back to rild to request the state of all currently active calls. The request flows back along a similar path the RIL_UNSOL_RESPONSE_CALL_STATE_CHANGED message followed, but in the opposite direction (that is, from ril_worker.js to SystemWorkerManager to Ril.cpp, then rilproxy and finally to the rild socket). rild then responds in kind, back along the same path, eventually arriving in ril_worker.js's handler for the REQUEST_GET_CURRENT_CALLS message. And thus bidirectional communication occurs.

+ +

The call state is then processed and compared to the previous state; if there's a change of state, ril_worker.js notifies the nsIRadioInterfaceLayer service on the main thread:

+ +
_handleChangedCallState: function _handleChangedCallState(changedCall) {
+  let message = {type: "callStateChange",
+                 call: changedCall};
+  this.sendDOMMessage(message);
+}
+ +

nsIRadioInterfaceLayer is implemented in dom/system/gonk/RadioInterfaceLayer.js; the message is received by its onmessage() method:

+ +
onmessage: function onmessage(event) {
+   let message = event.data;
+   debug("Received message from worker: " + JSON.stringify(message));
+   switch (message.type) {
+     case "callStateChange":
+       // This one will handle its own notifications.
+       this.handleCallStateChange(message.call);
+       break;
+   ...
+ +

All this really does is dispatch the message to the content process using the Parent Process Message Manager (PPMM):

+ +
handleCallStateChange: function handleCallStateChange(call) {
+  [some internal state updating]
+  ppmm.sendAsyncMessage("RIL:CallStateChanged", call);
+}
+ +

In the content process, the message is received by receiveMessage() method in the nsIRILContentHelper service, from the Child Process Message Manager (CPMM):

+ +
receiveMessage: function receiveMessage(msg) {
+  let request;
+  debug("Received message '" + msg.name + "': " + JSON.stringify(msg.json));
+  switch (msg.name) {
+    case "RIL:CallStateChanged":
+      this._deliverTelephonyCallback("callStateChanged",
+                                     [msg.json.callIndex, msg.json.state,
+                                     msg.json.number, msg.json.isActive]);
+      break;
+ +

This, in turn, calls the nsIRILTelephonyCallback.callStateChanged() methods on every registered telephony callback object. Every web application that accesses the window.navigator.mozTelephony API has registered one such callback object that dispatches events to the JavaScript code in the web application, either as a state change of an existing call object or a new incoming call event.

+ +
NS_IMETHODIMP Telephony::CallStateChanged(PRUint32 aCallIndex, PRUint16 aCallState,
+                                          const nsAString& aNumber, bool aIsActive) {
+  [...]
+
+  if (modifiedCall) {
+    // Change state.
+    modifiedCall->ChangeState(aCallState);
+
+    // See if this should replace our current active call.
+    if (aIsActive) {
+      mActiveCall = modifiedCall;
+    }
+
+    return NS_OK;
+  }
+
+  nsRefPtr<TelephonyCall> call =
+          TelephonyCall::Create(this, aNumber, aCallState, aCallIndex);
+  nsRefPtr<CallEvent> event = CallEvent::Create(call);
+  nsresult rv = event->Dispatch(ToIDOMEventTarget(), NS_LITERAL_STRING("incoming"));
+  NS_ENSURE_SUCCESS(rv, rv);
+  return NS_OK;
+}
+ +

Applications can receive these events and update their user interface and so forth:

+ +
handleEvent: function fm_handleEvent(evt) {
+  switch (evt.call.state) {
+    case 'connected':
+      this.connected();
+      break;
+    case 'disconnected':
+      this.disconnected();
+      break;
+    default:
+      break;
+  }
+}
+ +

Take a look at the implementation of handleEvent() in the Dialer application as an extended example.

+ +

3G data

+ +

There is a RIL message that initiates a "data call" to the cellular service; this enables data transfer mode in the modem. This data call ends up creating and activating a Point-to-Point Protocol (PPP) interface device in the Linux kernel that can be configured using the usual interfaces.

+ +
+

Note: This section needs to be written.

+
+ + + +

This section lists DOM APIs that are related to RIL communications:

+ + + +

WiFi

+ +

The WiFi backend for Firefox OS simply uses wpa_supplicant to do most of the work. That means that the backend's primary job is to simply manage the supplicant, and to do some auxiliary tasks such as loading the WiFi driver and enabling or disabling the network interface. In essence, this means that the backend is a state machine, with the states following the state of the supplicant.

+ +
+

Note: Much of the interesting stuff that happens in WiFi depends deeply on possible state changes in the wpa_supplicant process.

+
+ +

The implementation of the WiFi component is broken up into two files:

+ +
+
dom/wifi/DOMWifiManager.js
+
Implements the API that's exposed to web content, as defined in nsIWifi.idl.
+
dom/wifi/WifiWorker.js
+
Implements the state machine and the code that drives the supplicant.
+
+ +

These two files communicate with one another using the message manager. The backend listens for messages requesting certain actions, such as "associate", and responds with a message when the requested action has been completed.

+ +

The DOM side listens for the response methods as well as several event messages that indicate state changes and information updates.

+ +
+

Note: Any synchromous DOM APIs are implemented by caching data on that side of the pipe. Synchronous messages are avoided whenever possible.

+
+ +

WifiWorker.js

+ +

This file implements the main logic behind the WiFi interface. It runs in the chrome process (in multi-process builds) and is instantiated by the SystemWorkerManager. The file is generally broken into two sections: a giant anonymous function and WifiWorker (and its prototype). The anonymous function ends up being the WifiManager by providing a local API, including notifications for events such as connection to the supplicant and scan results being available. In general, it contains little logic and lets its sole consumer control its actions while it simply responds with the requested information and controls the details of the connection with the supplicant.

+ +

The WifiWorker object sits between the WifiManager and the DOM. It reacts to events and forwards them to the DOM; in turn, it receives requests from the DOM and performs the appropriate actions on the supplicant. It also maintains state information about the supplicant and what it needs to do next.

+ +

DOMWifiManager.js

+ +

This implements the DOM API, transmitting messages back and forth between callers and the actual WiFi worker. There's very little logic involved.

+ +
+

Note: In order to avoid synchronous messages to the chrome process, the WiFi Manager does need to cache the state based on the received event.

+
+ +

There's a single synchronous message, which is sent at the time the DOM API is instantiated, in order to get the current state of the supplicant.

+ +

DHCP

+ +

DHCP and DNS are handled by dhcpcd, the standard Linux DHCP client. However, it's not able to react when the network connection is lost. Because of this, Firefox OS kills and restarts dhcpcd each time it connects to a given wireless network.

+ +

dhcpcd is also responsible for setting the default route; we call into the network manager to tell the kernel about DNS servers.

+ +

Network Manager

+ +

The Network Manager configures network interfaces opened by the 3G data and WiFi components.

+ +
+

Note: This needs to be written.

+
+ +

Processes and threads

+ +

Firefox OS uses POSIX threads to implement all application threads — this includes the main thread of each application as well as web workers and helper threads. Control groups are used to prioritize process and thread execution thus relying on the Linux kernel's completely fair scheduler. Depending on the status of a process we assign it to different control group. We've currently got 6 priority levels corresponding to 5 control groups:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Process priority levels
PriorityControl groupUsed for
MASTER Main b2g process
FOREGROUND_HIGHapps/criticalCritical applications holding the cpu or highpriority wakelock; this is currently reserved for the clock and communications applications
FOREGROUNDappsForeground applications
FOREGROUND_KEYBOARDappsKeyboard application
BACKGROUND_PERCEIVABLEapps/bg_perceivableBackground applications playing audio or holding the holding the cpu or highpriority wakelock and having at least a system message handler registered
BACKGROUNDapps/bg_non_interactiveAll other applications running in the background
+ +

Some levels share the same control group, that's because those levels currently differ in the way they're treated by the out of memory killer. All priorities can be adjusted at build time via preferences; the relevant entries can be found in the b2g/app/b2g.js file.

+ +

The following control groups are currently used:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Control groups
PathCPU allocationDescription
 50% of total CPU timeRoot control group reserved for the main b2g process and system daemons
apps50% of total CPU timeRegular applications
apps/critical95% of appsCritical applications
apps/bg_perceivable10% of appsPerceivable background applications
apps/bg_non_interactive5% of appsBackground applications
+ +
+

Note: for more information on the out-of-memory killer, and how Firefox OS manages low memory situations, read Out of memory management on Firefox OS.

+
+ +

Within a process the main thread inherits the "nice value" of the process whilst web worker threads are given a "nice value" that is one point higher than the main thread thus running at lower priority. This is done in order to prevent CPU-intensive workers from excessively slowing down the main thread. All threads of an application are currently assigned to the same control group. Process priorities are changed whenever a major event happens such as an application being sent into the background or foreground, a new application starting up or an existing application grabbing a CPU wakelock.

+ +
+

Note: cgroups support on ICS devices is currently broken due to a kernel bug.

+
diff --git a/files/de/archive/b2g_os/platform/index.html b/files/de/archive/b2g_os/platform/index.html new file mode 100644 index 0000000000..db8c4e9960 --- /dev/null +++ b/files/de/archive/b2g_os/platform/index.html @@ -0,0 +1,81 @@ +--- +title: Firefox OS Plattform +slug: Archive/B2G_OS/Platform +tags: + - Architektur + - Firefox OS + - Plattform + - Übersicht +translation_of: Archive/B2G_OS/Platform +--- +

Die Firefox OS Plattform besteht aus vielen Komponenten. Du musst seine Architektur nicht verstehen, um Apps für Firefox OS zu entwickeln. Falls Du aber an der Plattform selbst oder an ihrer Portierung mitentwickelst oder einfach nur neugierig bist, dann könnte diese Dokumentation interessant für Dich sein.

+ + + + + + + + +
+

Dokumentationen zur Firefox OS Plattform

+ +
+
Firefox OS Architektur: Überblick
+
Ein Überblick über die interne Struktur von Firefox OS; vor allem für diejenigen interessant, die an der Plattform oder ihrer Portierung mitentwickeln.
+
Firefox OS Architektur: Apps
+
Ein Überblick über das Anwendungs-Modell von Firefox OS.
+
Gaia
+
Dokumentation über Gaia, die Benutzeroberfläche von Firefox OS Geräten. Gaia ist eine Web-Anwendung, die auf der Firefox OS Betriebssystem-Schicht läuft.
+
Gonk
+
Dokumentation über Gonk, die Betriebssystem-Schicht unterhalb von Gaia. Gonk besteht aus einem Linux Kernel und einer Hardware-Abstraktionsschicht, mit der Gecko kommuniziert.
+
Gecko
+
Gecko ist die Ebene im Firefox OS, die dieselben offenen Web Standard-Implementierungen bereit stellt wie sie auch von Firefox, Thunderbird und vielen anderen Anwendungen genutzt werden.
+
 Sicherheit
+
Dokumentation über die Sicherheit in Firefox OS; dies beinhaltet alle Themen rund um die Sicherheit von Firefox OS Geräten: für die App-Entwicklung, für die Integration von Geräten in Netzwerke und so weiter.
+
Speicherengpässe in Firefox OS
+
Dieser Artikel erläutert wie Firefox OS mit Hilfe des "low memory killers" und der "low memory notifications" mit Speicherengpässen umgeht.
+
Feature Liste
+
Eine Liste mit den verfügbaren Features pro Firefox OS Release.
+
Firefox OS Einstellungen
+
Eine Liste allgemeiner Einstellungen, die mit dem Settings API vorgenommen werden können.
+
+ +

Alle anzeigen...

+ 		+

Wir helfen Dir

+ +

Wenn Du mit Firefox OS arbeitest oder Apps für Firefox OS Geräte entwickelst, dann kann Dir unsere große MDN-Geimeinschaft bei Fragen und Problemen helfen!

+ +
    +
  • Besuche das Boot to Gecko Projekt Forum: {{ DiscussionList("dev-b2g", "mozilla.dev.b2g") }}
    • +
+ +
    +
  • Stell Deine Fragen in Mozilla's Boot to Gecko IRC Channel: #b2g
    • +
+ +

Bitte vergiss nicht die netiquette...

+ +

 

+ + + + + + +

Quellen

+ + +
+ +

 

diff --git a/files/de/archive/b2g_os/quickstart/deine_erste_app/index.html b/files/de/archive/b2g_os/quickstart/deine_erste_app/index.html new file mode 100644 index 0000000000..abd858245b --- /dev/null +++ b/files/de/archive/b2g_os/quickstart/deine_erste_app/index.html @@ -0,0 +1,339 @@ +--- +title: Deine erste App +slug: Archive/B2G_OS/Quickstart/deine_erste_app +tags: + - Anfänger + - Apps + - FirefoxOS + - Guide +translation_of: Archive/B2G_OS/Quickstart/Your_first_app +--- +
+

Hinweis: Das Quickstart-Abschnitt wurde mit einem neuen, fokussierter Quick Artikel, der alle bisherigen Artikel ersetzt aktualisiert. Wir hoffen, dass Sie diese nützlicher finden, und eine schnellere Lernerfahrung als die älteren Artikel haben.

+
+
+
+

Offene Web-Anwendungen (Web-Entwickler) geben, was sie seit Jahren gewünscht haben: ein Cross-Plattform-Umgebung, um installierbare Apps mit nur HTML, CSS und JavaScript erstellen gewidmet - mit Firefox OS, der erste dedizierte Open Web App-Plattform.

+
+
+ Dieser Leitfaden soll Sie unternehmungslustig schnell mit einer grundlegenden Architektur und Anweisungen zu bauen inspirieren, so dass Sie die nächste große app erstellen können!
+
+
+

Wenn Sie dieser Anleitung folgen möchten, können Sie unsere Schnellstart-app-Vorlage herunterladen. Finden Sie mehr heraus was unser Apps-Vorlage-Guide enthält.

+
+

App-Struktur

+

 

+
+
+

Verpackt vs. gehostete Anwendungen

+
+

Es gibt zwei Arten der offenen Web-apps :  verpackt und gehostet. Verpackte apps sind im Wesentlichen die Zip-Dateien, alle Anwendung Anlagewerten: HTML, CSS, JavaScript, Bilder, Manifest, etc.. Gehostete Anwendungen laufen von einem Server in einer bestimmten Domain, genau wie eine standard-Website. Beide app-Arten benötigen ein gültiges Manifest. Wenn Ihre app auf dem Firefox-Marktplatz kommt, wird Ihre Anwendung als  Zip-Datei hochladen oder geben Sie die URL an, wo Ihre gehostete Anwendung  ist.

+
+

+
+

In Partnerschaft mit Treehouse erstellt : Zu die Treehouse Seite

+
+
+

Für die Zwecke dieses Leitfadens erstellen Sie eine gehostete app die werden dann an Ihre Adresse "localhost" geschickt. Sobald Ihre app bereit ist um auf die Liste des Firefox-Marktplatz zukommen, können Sie die Entscheidung, als verpackte app oder als gehostete Anwendung zu starten.

+

Manifeste App

+

Alle Firefox-app erfordern eine manifest.webapp -Datei im Stammverzeichnis der app.  Die manifest.webapp -Datei enthält wichtige Informationen über die app wie Version, Name, Beschreibung, Symbolspeicherort, Locale Zeichenfolgen, Domains, wo die app aus, installiert werden kann, und vieles mehr. Nur der Name und die Beschreibung sind erforderlich. Das einfache Manifest innerhalb der app-Vorlage enthalten ist, die der folgenden ähnelt:

+ 
{
+  "version": "0.1",
+  "name": "Open Web App",
+  "description": "Die eeindruckende Open Web App",
+  "launch_path": "/app-template/index.html",
+  "icons": {
+    "16": "/app-template/app-icons/icon-16.png",
+    "48": "/app-template/app-icons/icon-48.png",
+    "128": "/app-template/app-icons/icon-128.png"
+  },
+  "developer": {
+    "name": "Ihr Name",
+    "url": "http://ihrebeeindruckendeapp.eu"
+  },
+  "locales": {
+    "es": {
+      "description": "Su nueva aplicación impresionante Open Web",
+      "developer": {
+        "url": "http://ihrebeeindruckendeapp.eu"
+      }
+    },
+    "it": {
+      "description": "La tua nuova fantastica Open Web App",
+      "developer": {
+        "url": "http://ihrebeeindruckendeapp.eu"
+      }
+    }
+  },
+  "default_locale": "de"
+}
+
+

+
+

In Partnerschaft mit Treehouse erstellt : Zu die Treehouse Seite

+
+
+

 

+

Eine grundlegende Manifest ist alles, was Sie brauchen um loszulegen. Lesen Sie mehr über Manifeste Apps.

+

App Layout & Design

+

Das Design ist zunehmend wichtig, da die Bildschirmauflösungen standard auf verschiedenen Geräten geworden ist. Selbst wenn das Hauptziel Ihrer App mobile Plattformen wie Firefox-OS ist, haben andere Geräte wahrscheinlich auch darauf zugriff.  Mit CSS Media Queries können Sie das Layout des Gerät anpassen, wie in diesem CSS-Beispiel gezeigt:

+
+
+  
+
+ 
+/* Im folgenden Text werden Beispiele von Verschiedenen CSS Media Queries gezeigt */
+
+  /* Grundlegende Desktop/Bildschirm breite */
+@media only screen and (min-width : 1224px) {
+  /* style */
+}
+
+/* iPhone breite */
+@media
+  only screen and (-webkit-min-device-pixel-ratio : 1.5),
+  only screen and (min-device-pixel-ratio : 1.5) {
+  /* styles */
+}
+
+/* Geräteeinstellungen auf verschiedenen Ausrichtungen */
+@media screen and (orientation:portrait) {
+  /* styles */
+}
+@media screen and (orientation:landscape) {
+  /* styles */
+}
+

Es gibt viele JavaScript und CSS-Frameworks für responsive Design und mobile app Entwicklung (Bootstrap, etc.) Wählen Sie die Framework(s), die am besten zu Ihrer app-Entwicklung passen.

+

Web APIs

+

JavaScript-APIs werden erstellt und so schnell wie Geräte erweitert. Mozillas WebAPI Aufwand bringt Dutzende von mobilen Standardfunktionen von JavaScript-APIs. Eine Liste der Geräte-Support und Status steht auf der Seite des WebAPI zur Verfügung. JavaScript-Feature-Erkennung ist immer noch die beste Praxis, wie im folgenden Beispiel gezeigt:// Wenn dieses Gerät das Vibrieren API unterstützt

+ 
// Wenn dieses Gerät Vibration API unterstützt ...
+
+if('vibrate' in navigator) {
+    // ... Vibration in Sekunden
+    navigator.vibrate(1000);
+}
+

Im folgenden Beispiel wird das Anzeigeformat von einer <div> basierend auf die Änderungen in der Ladezustand des Geräts geändert :

+ 
// Erstellen Sie die Batterie Indiktator Hörer
+(function() {
+  var battery = navigator.battery || navigator.mozBattery || navigator.webkitBattery,
+      indicator, indicatorPercentage;
+
+  if(battery) {
+    indicator = document.getElementById('indicator'),
+    indicatorPercentage = document.getElementById('indicator-percentage');
+
+    // Zuhörer für Änderung
+    battery.addEventListener('chargingchange', updateBattery);
+    battery.addEventListener('levelchange', updateBattery);
+
+    // Aktualisiert sofort
+    updateBattery();
+  }
+
+  function updateBattery() {
+    // Prozent aktualisieren Breite und Text
+    var level = (battery.level * 100) + '%';
+    indicatorPercentage.style.width = level;
+    indicatorPercentage.innerHTML = 'Battery: ' + level;
+    // Ladestatus Updaten
+    indicator.className = battery.charging ? 'charging' : '';
+  }
+})();
+

Im Beispiel oben sobald Sie bestätigen, dass die Batterie-API unterstützt wird, können Sie Ereignis-Listener für Chargingchange und Levelchange um das Element Anzeige aktualisieren hinzufügen. Versuchen Sie, die folgenden auf die Quickstart-Vorlage, und sehen Sie, wenn Sie es funktioniert.

+
+
+ Überprüfen Sie die WebAPI-Seite regelmäßig, um sich mit Gerät API Status aktuell zu halten.
+
+  
+
+
+

API-Funktionen installieren

+
+  
+
+

In unserem Quickstart-app Beispielvorlage, haben wir eine installierungs-Schaltfläche, die Sie anklicken können, wenn Sie die app als standard website haben möchten ,
+ und diese Website auf Firefox-OS als app zu installieren. Das Knopf-Markup ist nichts Besonderes:

+ 
<button id="install-btn">App Installieren</button>
+
+
+ Diese Tastenfunktionen wird mithilfe der installieren-API implementiert (siehe install.js):
+
+  
+
+ 
var mainifest_url = location.href + 'manifest.webapp';
+
+function install(ev) {
+  ev.preventDefault();
+//Manifest URL Definieren
+// App Installieren
+  var installLocFind = navigator.mozApps.install(manifest_url);
+  installLocFind.onsuccess = function(data) {
+    // Wenn die App Installiert ist
+  };
+  installLocFind.onerror = function() {
+    // App ist nicht Installiert
+    // installapp.error.name
+    alert(installLocFind.error.name);
+  };
+};
+
+// Eine Verweis auf die Schaltfläche und rufen Sie install() auf Klick wenn die App nicht Installiert ist. Wenn sie installiert ist ist die Schaltfläche ausgeblendet.
+var button = document.getElementById('install-btn');
+
+var installCheck = navigator.mozApps.checkInstalled(manifest_url);
+
+installCheck.onsuccess = function() {
+  if(installCheck.result) {
+    button.style.display = "none";
+  } else {
+    button.addEventListener('click', install, false);
+  };
+};
+
+

Gehen Sie kurz alles durch was vor sich geht :

+
    +
  1. +
    + Wir erhalten einen Verweis auf die Schaltfläche "installieren" und speichern Sie sie in die Schaltfläche "Variablen".
    +
    2. +
  2. Wir verwenden navigator.mozApps.checkInstalled um zu prüfen, ob die App definiert durch das Manifest im http://people.mozilla.com/~cmills/location-finder/manifest.webapp bereits auf dem Gerät installiert ist. Dieser Text wird als Variable installCheck gespeichert.
    3. +
  3. Wenn der Test erfolgreich durchgeführt wird, dann wird sein Success Ereignis ausgelöst, daher wird installCheck.onsuccess = function() { ... } ausgeführt.
    4. +
  4. Wenn die App bereits Installiert ist wird die Schaltfläche ausgeblendet.
    5. +
  5. +
    +
    +
    +
    + Wenn die app nicht installiert ist, fügen wir einen Click-Ereignis-Listener zur Schaltfläche, so dass die Funktion install() ausgeführt wird, wenn die Schaltfläche geklickt wird.
    +
    +
    +
    +
    6. +
  6. Wenn die Schaltfläche angeklickt wird, und die Funktion install() ausgeführt wird, wird die Betriebsstätte für die manifest-Datei in eine Variable namens manifest_url und installieren dann die app unter Verwendung navigator.mozApps.install(manifest_url), einen Verweis auf die Installation in der InstallLocFind-Variablen zu speichern. Sie werden bemerken, dass diese Installation auch Erfolg und Fehler-Ereignisse auslöst, damit Sie Aktionen abhängig ausführen können, ob die Installation erfolgreich oder nicht passiert ist.
    7. +
+

Vielleicht möchten Sie den Umsetzung Stand der API prüfen, wenn dann aber zuerst nach installierbare Webanwendungen.

+
+
+
+ Hinweis: Installierbare offene Web-Anwendungen haben eine Sicherheitsrichtlinie "einzelne app pro Herkunft"; Grundsätzlich können Sie nicht mehr als eine installierbare app pro Herkunft hosten. Dies vereinfacht das Testen ein wenig komplizierter, aber es gibt noch Wege, um dieses, wie das Erstellen von verschiedenen Subdomains für apps, testen sie mit der Firefox-OS-Simulator, oder testen die Install-Funktionalität auf Firefox Aurora/nächtliche, welches Ihnen erlaubt zu installierbare Webanwendungen auf dem Desktop zu installieren. Siehe FAQs über apps Manifeste für weitere Informationen zur Herkunft.
+
+
+
+

WebRT APIs (APIs auf der Grundlage von Berechtigungen)

+
+
+
+ Es gibt eine Reihe von WebAPIs, aber die benötigen spezielle Berechtigungen für dieses Feature aktiviert werden. Apps können registrieren Berechtigungsanforderungen innerhalb der manifest.webapp-Datei wie folgt:
+
+  
+
+ 
// Neuer Key im Manifest : "permissions"
+// Anforderung der Zugriffe auf eine belibige Anzahl von APIs
+// Hier bitten wir um die berechtigung für die SystemXHR API
+"permissions": {
+    "systemXHR": {}
+}
+
+
+ Die drei Stufen der Berechtigung sind wie folgt:
+
+  
+
+ +
+
+ Weitere Informationen zu app-Berechtigungsstufen, Arten von verpackten apps lesen. Sie finden weitere Informationen über Berechtigungen welche APIs erfordern , und welche Berechtigungen sind erforderlich, um App-Berechtigungen.
+
+  
+
+
+
+
+ Es ist wichtig zu beachten, dass nicht alle Web-APIs in der Firefox-OS-Simulator umgesetzt werden.
+
+
+

Tools & Testen

+
+
+ Testen ist unglaublich wichtig, wenn mobile Geräte unterstützt. Es gibt viele Optionen zum Testen von installierbaren open-Web-apps.
+
+  
+
+

Firefox OS Simulator

+
+
+ Installation und Verwendung der Firefox-OS-Simulator ist der einfachste Weg zum aufstehen und laufen mit Ihrer app. Nach der Installation des Simulators ist es aus dem Tools-> Web Developer-> Firefox-OS-Simulator-Menü zugänglich. Der Simulator startet mit einer JavaScript-Konsole, damit Sie Ihre Anwendung in den Simulator Debuggen können.
+
+  
+
+

App Manager

+
+
+ Das neue Kind auf den Block im Hinblick auf die Testtools nennt man den App-Manager. Mit diesem Tool können Sie Verbindung mit einem kompatiblen Gerät über USB (oder ein Firefox-OS-Simulator) desktop Firefox, apps direkt auf das Gerät schieben, apps zu validieren und Debuggen sie, wie sie auf dem Gerät ausgeführt.
+
+  
+
+

Unit Tests

+
+
+ Unit-Tests sind sehr wertvoll, wenn Sie auf verschiedenen Geräten zu testen und baut. jQuery's QUnit ist eine beliebte Client-seitige Dienstprogramm zum Testen, aber können Sie einen beliebigen Satz von Testtools, die Sie möchten.
+
+  
+
+
+

Firefox OS auf einem Gerät installieren

+
+
+
+ Da Firefox-OS ein open-Source-Plattform ist sind Code und Tools Erstellen und installieren Firefox-OS auf Ihrem eigenen Gerät verfügbar. Build sowie Installationsanweisungen und Anmerkungen zu welchen Geräten es auf, installiert werden kann finden Sie auf MDN.
+
+  
+
+
+
+ Spezielle Firefox-OS Entwickler Vorschau Geräte stehen zur Verfügung: Lesen Sie unsere Entwickler-Vorschau-Telefon-Seite für weitere Informationen.
+
+  
+
+  
+
+
+

App-einreichen und Verteilung

+
+

Wenn Ihre app abgeschlossen ist, können Sie es selbst hosten wie eine standard-Website oder app (Lesen Sie self-publishing-Anwendungen für weitere Informationen), oder es kann eingereicht werden, auf den Firefox-Markt. Ihre Anwendung Manifest überprüft werden können Sie wählen, welche Geräte Ihr app unterstützt (z.B. Firefox OS, Desktop, Firefox, Firefox Mobile, Firefox Tablet). Sobald validiert, können die app Liste innerhalb der Marktplatz Sie fügen Sie zusätzliche Informationen über Ihre app (Screenshots, Beschreibungen, Preise, etc.) und offiziell einreichen. Sobald die App genehmigt ist, ist Ihre app der Welt für die Beschaffung und Installation zur Verfügung.

+
+

Marktplatz & Mehr Angaben

+
+
    +
  1. Senden Sie eine App auf den Firefox-OS-Marktz
    2. +
  2. Marktplatz-Prüfkriterien
    3. +
  3. + +
    4. +
+

 

+

 

+

Übersetzung bei Enes E.

+
diff --git a/files/de/archive/b2g_os/quickstart/einfuerung_zu_firefox_os/index.html b/files/de/archive/b2g_os/quickstart/einfuerung_zu_firefox_os/index.html new file mode 100644 index 0000000000..b262d5f208 --- /dev/null +++ b/files/de/archive/b2g_os/quickstart/einfuerung_zu_firefox_os/index.html @@ -0,0 +1,13 @@ +--- +title: Einführung zu Firefox OS +slug: Archive/B2G_OS/Quickstart/Einfuerung_zu_Firefox_OS +translation_of: Archive/B2G_OS/Quickstart/Intro_to_Firefox_OS +--- +
+

Firefox OS ist ein neues Mobilbetriebssystem, entwickelt von Mozillas Boot to Gecko (B2G) Projekt. Es besteht aus einem Linux Kernel und bootet als eine auf Gecko basierende Laufzeitumgebung, die es Nutzern ermöglicht Anwendungen, geschrieben in HTML, JavaScript, und mit anderen offenen APIs für Webanwendungen, auszuführen.

+
+

Firefox OS (also referred to by its codename "Boot to Gecko" or "B2G") is Mozilla's open source mobile operating system, based a Linux kernel, which boots into a Gecko-based runtime engine that lets users run applications developed entirely using HTML, CSS, JavaScript, and open web application APIs. Firefox OS is a mobile operating system that's free from proprietary technology while still a powerful platform that provides application developers an opportunity to create excellent products. In addition, it's flexible and capable enough to make the end user happy.

+

+

Firefox OS comes with a suite of pre-installed applications called Gaia, which handle the fundamental functions of the phone such as settings, calls, SMS, taking and storing photos, etc.

+

For Web developers, the most important part to understand is that the entire user interface is a Web app, one that is capable of displaying and launching other Web apps. Any modifications you make to the user interface and any applications you create to run on Firefox OS are Web pages, albeit with enhanced access to the mobile device's hardware and services.

+

Firefox OS is currently under heavy development; we are constantly working on ways to make it easier for you to use and hack on Gaia and create apps. However, you need knowledge about systems in order to do things like build the entire Firefox OS stack, or flash a phone with a build of Firefox OS. To find such information, and lots more besides, head on over to our Firefox OS content zone.

diff --git a/files/de/archive/b2g_os/quickstart/for_mobile_developers/index.html b/files/de/archive/b2g_os/quickstart/for_mobile_developers/index.html new file mode 100644 index 0000000000..e4a00e9335 --- /dev/null +++ b/files/de/archive/b2g_os/quickstart/for_mobile_developers/index.html @@ -0,0 +1,40 @@ +--- +title: App development for mobile developers +slug: Archive/B2G_OS/Quickstart/For_mobile_developers +translation_of: Archive/B2G_OS/Quickstart/For_mobile_developers +--- +
+

If you are a native mobile platform developer, why should you look into developer open web apps? This article talks you through open web app advantages, and the basic steps required to create one.

+
+

Advantages

+

For mobile application developers, the open web apps project offers these advantages:

+ +

Steps to developing a Web app

+
+
+ 1. Develop your app using open Web technologies.
+
+ You probably already know at least a bit about HTML, CSS, and JavaScript. The Learn section of this website has resources to help you ramp up even more. As a mobile app developer, you already have a Mobile First approach to Web design.
+
+ 2. Add an app manifest.
+
+ All that inherently separates a Web app from a normal website is a single, JSON-format text file.
+
+ 3. Publish the app, either on your own site or in an app store (or both).
+
+ Publishing it yourself requires adding some code to your site to manage installing and updating the app in users' browsers.
+
+

Optional features

+

{{ page("/en-US/docs/Web/Apps/For_Web_developers", "Optional_features") }}

+

Useful technologies

+

See Useful technologies.

+

See also

+ diff --git a/files/de/archive/b2g_os/quickstart/index.html b/files/de/archive/b2g_os/quickstart/index.html new file mode 100644 index 0000000000..ebe1f7c220 --- /dev/null +++ b/files/de/archive/b2g_os/quickstart/index.html @@ -0,0 +1,49 @@ +--- +title: Build +slug: Archive/B2G_OS/Quickstart +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive/B2G_OS/Quickstart +--- +
+

Quickstart information on coding open web apps.

+
+
+
+ Introduction to open web apps
+
+ What are open web apps? How they differ from regular web pages? Why is this significant? This article aims to answer these questions and more.
+
+ Your first app
+
+ This article takes you through the basic steps and additional knowledge on top of regular web development required to create installable open web apps.
+
+ Introduction to Firefox OS
+
+ An introduction to Firefox OS, Mozilla's new open web app-based mobile platform.
+
+ Introduction to manifests
+
+ An FAQ designed to answer any questions you may have about manifests, hosting apps, origins, and other such topics.
+
+ App development for web developers
+
+ If you're a web developer, how do open web apps differ from what you're used to? This article explains all.
+
+ App development for mobile developers
+
+ If you're a native mobile application developer, what advantages can open web apps bring to you, and how do they differ from what you are used to? Here are some ideas.
+
+ Developing app functionality
+
+ This page talks about the kinds of different functionality that you might want to build into your apps, with links to further information.
+
+ Payments
+
+ How do you build functionality to make people pay for installing your open web apps? Here is the lowdown.
+
+ App tools
+
+ Last for this section, we provide some links to more information on the tools available to help you develop great open web apps.
+
diff --git a/files/de/archive/b2g_os/quickstart/open_web_apps_and_web_standards/index.html b/files/de/archive/b2g_os/quickstart/open_web_apps_and_web_standards/index.html new file mode 100644 index 0000000000..f0767b57ed --- /dev/null +++ b/files/de/archive/b2g_os/quickstart/open_web_apps_and_web_standards/index.html @@ -0,0 +1,38 @@ +--- +title: Offene Web Apps und Web Standards +slug: Archive/B2G_OS/Quickstart/Open_Web_apps_and_Web_standards +translation_of: Archive/B2G_OS/Quickstart/Intro_to_open_web_apps +--- +

Multi devices

+

Das Web ist die Plattform

+

Open Web Apps are a great opportunity for those who need to develop applications that work on the largest number of devices, and for those who cannot afford to develop an app for every vendor platform (such as Android, iOS, and "classical" desktop web browsers). The difference between an app and a website is that you can install an app and more thoroughly integrate it into your device. It’s not a bookmark — it’s part of a system. Open Web Apps hold that great promise. They are an opportunity that we should not miss, otherwise the Web might become fragmented once more.

+

With this in mind it should be clear that Open Web Apps (OWA in short) are intended to be standardized and to become part of "the Web". If successful, OWA should eventually work on all browsers, operating systems anddevices.

+

At Mozilla we are working hard to create this apps platform that is backed entirely by the open Web. It’s not intended to be a “Mozilla platform” or a “Firefox platform”. The Web is the platform. We’re creating a set of open APIs and implementations to show how portable apps can exist on the Web without vendor lock-in. Other groups like Facebook and Google Chrome are also working on apps platforms backed by the Web. Facebook apps are meant to hook into Facebook and Chrome apps are designed for Chrome OS devices and Google servers. Chrome apps are the most similar to Open Web Apps. We continue to collaborate with the Google Chrome team as app standards evolve and we definitely share a lot of the same vision. There is tremendous potential for all Web based app platforms to converge and we invite all vendors to help us build the right Open Web App APIs.

+

Even though currently you must have a Mozilla Firefox-based engine ("Web runtime") to use Open Web Apps, it is not intended that this always will be the case. Many parts of the Open Web Apps project are still being worked out and it isn't possible to implement everything in all browsers at once. Although many parts of Open Web Apps are already standardized, many other parts are still in flux. It is intended and hoped that Open Web Apps will be a standard capability that is available in all major browsers.

+

Therefore, when you read the MDN pages that deal with Open Web Apps, please keep in mind that even though much of the information is specific to Firefox right now, it will hopefully enable you to develop Open Web Apps for all browsers in the future.

+

Web standards

+

OWA technology is not a single piece, it is an umbrella that groups many different technologies and some of them are very young. At the moment, parts of OWA are standardized (HTML5, CSS, JavaScript, IndexedDB, etc.). Other parts are not yet standardized and the Mozilla implementation is thus specific to Firefox or to some other Mozilla technology. As the Mozilla mission is to share and to empower everyone, this situation is only temporary. That's why in the OWA docs we will try to clearly identify the parts of OWA that are not yet standardized.

+

Please also note that there may be some OWA-related proposals and potential standards that are not used by Mozilla.

+

Intended eventual standards

+

So here are the parts not standardized yet across the different Web platforms and that still are Firefox-only for the moment:

+ +

Marketplace

+

Buy Once, Run Everywhere

+

From the ground up Mozilla has been building an apps system that lets users buy an app once and run it on all of their HTML5 devices. Very soon Mozilla will launch the first Firefox OS phone but that will be just one device on which to run your apps. When you purchase an app through the Firefox Marketplace, the system installs a receipt on your device. The receipt is a JSON Web Token with metadata that links to the Marketplace’s public key and its verification service URL. When an app starts up it can verify the receipt but the receipt on the device is not tied to the Firefox Marketplace. The receipt is just a cryptographically verifiable proof of purchase. Anyone can sell open Web apps if they follow the receipt specs. When you buy an app, it is intended to be portable across any device that supports the Open Web Apps system.

+

Mozilla is building the infrastructure needed to run Open Web Apps on any HTML5 device. Firefox for Android will let you install and run apps (you can try it today on the nightly build). Installed app icons go to your home screen just like regular Android apps. You can also install and run Web apps on your Windows, Mac, or Linux desktop using Firefox (this currently works in the nightly build). Currently some version of Firefox is required, but it is intended that the Open Web Apps system will eventually be supported by all major browsers as a set of standards. From day one Mozilla has included all major HTML5 compliant browsers in its proof of concepts; you can take a look at this hosted JavaScript shim for ideas on how to support the apps platform on a non-Firefox browser.

+

In the future the Open Web Apps system will support syncing your installed apps across devices. Since receipts are portable you could just sync them yourself if you wanted to. In case it’s not obvious, you can always run a free open Web app in any browser because it is no different than a website. It might, however, use new mobile specific web APIs which are not implemented on all platforms.

+

WebPayment API

+

Commerce For Apps

+

Part of the success of mobile app platforms like iOS and Android is that they make it very easy to try out new business models through mobile payments. Those models are still evolving but commerce is no doubt something that, at the moment, is awkward on the desktop Web and more natural on mobile. Specifically, it’s very convenient to charge something to your phone bill when you’re already accessing it from your phone anyway. With the launch of Firefox OS, the apps ecosystem will support app purchases and in-app payments through the WebPayment API. Supporting commerce is crucial for the growth of an apps platform. The use of the proposed payment API is completely optional. Mozilla won’t prevent any app from using its own in-app payment system.

+

See also

+ diff --git a/files/de/archive/b2g_os/releases/1.4/index.html b/files/de/archive/b2g_os/releases/1.4/index.html new file mode 100644 index 0000000000..47b18c0fbc --- /dev/null +++ b/files/de/archive/b2g_os/releases/1.4/index.html @@ -0,0 +1,71 @@ +--- +title: Firefox OS 1.4 for developers +slug: Archive/B2G_OS/Releases/1.4 +translation_of: Archive/B2G_OS/Releases/1.4 +--- +
+

Firefox OS 1.4 ist derzeit noch eien Vorabversion. Die Gecko Komponenten basieren auf Firefox 30 (dazu:Firefox 30 release notes for developers). Diese Seite beschreibt die neu hinzugefügten Entwicklerfunktionen in Firefox OS 1.4.

+
+

CSS

+

Gecko allgemein:

+ +

JavaScript

+

SpiderMonkey general:

+ +

Interfaces/APIs/DOM

+

Firefox OS specific:

+ +

Gecko general:

+ +

SVG

+

Gecko general:

+ +

Manifest

+ +

See also

+ +

Older versions

+

+ +

+

diff --git a/files/de/archive/b2g_os/releases/2.0/index.html b/files/de/archive/b2g_os/releases/2.0/index.html new file mode 100644 index 0000000000..175d141e00 --- /dev/null +++ b/files/de/archive/b2g_os/releases/2.0/index.html @@ -0,0 +1,112 @@ +--- +title: Firefox OS 2.0 for developers +slug: Archive/B2G_OS/Releases/2.0 +translation_of: Archive/B2G_OS/Releases/2.0 +--- +
+

This page details the developer features newly implemented in Gecko that are specific to Firefox OS 2.0.

+
+ +
+

Firefox OS 2.0's Gecko component is based on Firefox 31/32.

+
+ +

New product features

+ +

This section provides a summary of the new features available in Firefox OS 2.0. For more details on specific platform changes (API additions, etc.), see the Platform additions in detail section.

+ +
+
NFC
+
This release includes support for device-to-device content sharing support with NFC (Near Field Communication). You can pair your device with another, then swipe to share your contacts, media, or favorite URLs with others.
+
Telephony
+
Firefox OS now supports both IPv4 and IPv6 addresses in the network manager.
+
Find My Device
+
If you’ve lost your Firefox OS smartphone, Find My Device can help you find it (see the http://find.firefox.com website). You can see it on a map, make it play a sound and have it display a message. You can also remotely lock it or delete your personal info. To get started, create a Firefox Account (Settings > Firefox Accounts on your device) and enable Find My Device (Settings > Find My Device).
+
Media
+
You can now create your own ringtones using your own music collection, or songs you download from the Web.
+
Camera
+
The Camera app now supports various focus modes: Touch, Continuous Auto and Face tracking.
+
Productivity
+
We've done a visual refresh of the Email, Calender, and Clock apps.
+
Homescreen
+
Firefox OS 2.0 introduces a simpler vertical-scrolling homescreen with larger icons.
+
Edge-gesture app switching
+
Edge gestures are now available for switching between apps (swipe your thumb from the left edge of the screen to the right and vice versa, to switch between multiple open apps.)
+
+ +

New partner features

+ +
+
E.ME integration
+
E.ME integration provides direct access to web apps while configurable search providers can search the web at the same time.
+
+ +

New DevTools features

+ +

The Firefox Developer Tools have had a large number of features added in Firefox versions 31 and 32; these aren't Firefox OS-specific, but you can take advantage of them when debugging your Firefox OS apps through WebIDE. To find out more, read:

+ + + +

Platform additions in detail

+ +
+

Note: Our list here includes features most important to Firefox OS. For an expanded list of general Gecko feature additions (which are generally also present in Firefox OS 2.0), consult the Firefox 31 release notes for developers and Firefox 32 release notes for developers.

+
+ +

Web API

+ + + +

CSS

+ + + +

Technology support improvements

+ + + +

Older versions

+ +

+ +

diff --git a/files/de/archive/b2g_os/releases/index.html b/files/de/archive/b2g_os/releases/index.html new file mode 100644 index 0000000000..3edbcd4c75 --- /dev/null +++ b/files/de/archive/b2g_os/releases/index.html @@ -0,0 +1,24 @@ +--- +title: Firefox OS developer release notes +slug: Archive/B2G_OS/Releases +tags: + - Firefox OS + - NeedsTranslation + - TopicStub +translation_of: Archive/B2G_OS/Releases +--- +

Firefox OS release notes by version

+

This section provides articles covering each new release of Gaia and Gecko for Firefox OS, explaining what features were added and bugs eliminated in each update. There is also a linked summary table showing what APIs are supported by each version of Firefox OS.

+
+ {{ListSubpages("",1,0,1)}}
+

Other supporting information

+
+
+ Firefox OS API support table
+
+ Lists the different APIs available, and what versions of Firefox have support for them.
+
+ App permissions
+
+ Lists hosted, privileged and certified APIs, along with information on the permissions they need to have set in the App Manifest of your installable apps, such as the manifest permission name, app type required, description, access property, and default permission.
+
diff --git a/files/de/archive/b2g_os/simulator/index.html b/files/de/archive/b2g_os/simulator/index.html new file mode 100644 index 0000000000..5fa8770578 --- /dev/null +++ b/files/de/archive/b2g_os/simulator/index.html @@ -0,0 +1,86 @@ +--- +title: Firefox-OS-Simulator +slug: Archive/B2G_OS/Simulator +translation_of: Archive/B2G_OS/Simulator +--- +
+

Diese Seite beschreibt den Firefox-OS-Simulator für Entwickler für Firefox OS 1.2 oder neuer. Wenn Sie Apps für Firefox OS 1.1 entwickeln, sollten Sie sich stattdessen die Dokumentation für Firefox-OS-1.1-Simulator ansehen.

+
+ +

Der Firefox-OS-Simulator ist eine Version der höheren Schichten von Firefox OS, die ein Firefox-OS-Gerät simuliert, aber auf dem Desktop läuft. Dies bedeutet, dass Sie in vielen Fällen kein echtes Gerät benötigen, um Ihre App zu testen und zu debuggen. Er läuft in einem Fenster mit der selben Größe wie ein Firefox-OS-Gerät, enthält die Benutzeroberfläche sowie die integrierten Apps von FirefoxOS und simuliert viele der APIs eines Firefox-OS-Geräts.

+ +

Der Simulator wird als Firefox-Add-on gepackt und verteilt. Sobald Sie ihn heruntergeladen und in Firefox installiert haben, können Sie ihn ausführen, Apps darauf laden und mit dem App-Manager Entwicklerwerkzeuge einsetzen.

+ +

Installation

+ +

Um den Simulator zu installieren, klicken Sie auf die folgende Schaltfläche. (Es stehen mehrere Versionen zur Verfügung und zwecks maximaler Flexibilität sollten Sie alle installieren):

+ +

Simulator installieren

+ +

Um den Simulator zu starten, lesen sie die Anweisungen in der Dokumentation des App-Managers. Sobald der Simulator läuft, können Sie Apps darauf laden und dann mit dem App-Manager debuggen, genau wie mit einem echten Gerät. Ich habe unter Windows 7, Firefox 37.0.1 und mit Firefox OS Simulator die Erfahrung gemacht, dass erster Start in der WebIDE klappt nicht, dafür funktioniert 2. oder 3. Start. Auch dann, wenn eine Meldung: "Zeitüberschreitung bei der operation: connecting to runtime Firefox OS 2.0" in der WebIDE angezeigt wird.

+ +

Die Simulator-Oberfläche

+ +

Der Simulator erscheint als eigenes Fenster, so dass der simulierte Bildschirm 320×480 Pixel groß ist. Um Berührereignisse zu simulieren, können Sie mit der Maustaste klicken und die Maus bei gedrückter Taste ziehen. Durch Klicken und Ziehen von rechts nach links vom Startbildschirm aus sehen Sie also die integrierten Apps, sowie solche, die Sie hinzugefügt haben:

+ +

+ +

Der Simulator verfügt am unteren Rand über deine Symbolleiste mit zwei Schaltflächen:

+ + + +

Einschränkungen des Simulators

+ +

Beachten Sie, dass der Firefox-OS-Simulator keine perfekte Simulation ist.

+ +

Hardware-Einschränkungen

+ +

Abgesehen von der Bildschirmgröße simuliert der Simulator keine hardwareseitigen Einschränkungen eines Firefox-OS-Geräts, wie den verfügbaren Speicher oder die CPU-Geschwindigkeit.

+ +

Audio-/Video-Codecs

+ +

Die folgenden Codecs hängen von hardwarebeschleunigter Dekodierung ab und werden daher noch nicht unterstützt:

+ + + +

Dies bedeutet, dass es nicht möglich ist,  mit dem Simulator die Wiedergabe von Videos in Apps und Websites wie YouTube zu testen, die diese Codecs benötigen.

+ +

Nicht unterstützte APIs

+ +

Bestimmte APIs, die auf dem Gerät funktionieren, funktionieren nicht im Simulator, was meist daran liegt, weil die unterstützende Hardware auf dem Desktop nicht verfügbar ist. Wir haben Simulationen für bestimmte APIs, wie Geolokation, eingebaut und fügen in zukünftigen Versionen vermutlich weitere hinzu. Derzeug werden die folgenden APIs allerdings nicht unterstützt. Deren Verwendung kann zu Fehlermeldungen oder einfach falschen Ergebnissen führen:

+ + + +

Hilfe erhalten

+ +

Wenn Sie eine Frage haben, versuchen Sie, uns auf der Mailingliste dev-developer-tools oder in #devtools auf irc.mozilla.org zu erreichen.

+ +

Ausführliche Protokollierung aktivieren

+ +

In der Web-Konsole, die Sie über den App-Manager mit Ihrer App verknüpfen können, werden Nachrichten, von Ihrer App aufgezeichnet. Wenn Sie Nachrichten frühzeitig erfassen möchten, die während des Starts erscheinen, bevor die Konsole verbunden wird und funktioniert, können Sie im Simulator die ausführliche Protokollierung aktivieren.

+ +

Öffnen Sie about:config und erstellen Sie ein neue Einstellung. Der Name der Einstellung hängt von der Version des Simulators ab:

+ + + +

Setzen Sie den String-Wert auf „all“ und deaktivieren und reaktivieren Sie das Add-on im Add-ons-Manager. Jetzt erscheinen zusätzliche Nachrichten über die Ausführung des Simulators in der Browser-Konsole.

diff --git a/files/de/archive/b2g_os/troubleshooting/index.html b/files/de/archive/b2g_os/troubleshooting/index.html new file mode 100644 index 0000000000..a83cc46042 --- /dev/null +++ b/files/de/archive/b2g_os/troubleshooting/index.html @@ -0,0 +1,44 @@ +--- +title: Troubleshooting Firefox OS +slug: Archive/B2G_OS/Troubleshooting +translation_of: Archive/B2G_OS/Troubleshooting +--- +
+

This article provides tips for resolving common problems you may have while using Firefox OS. Please feel free to add more content to this page!

+
+ +

Networking problems

+ +

If you are having trouble connecting to Wi-Fi networks, it may be helpful to delete the Wi-Fi configuration file:

+ +
adb shell rm /data/misc/wifi/wpa_supplicant.conf
+adb reboot
+
+ +
+

Note: These instructions assume you have configured the udev settings for your device.

+
+ +

Bricked Phone

+ +

If you happen to brick the phone, by, for example, trying to flash wrong images on it,  try rebooting into the bootloader (fastboot or heimdal depending on your phone). The exact sequence varies depending on the phone. Try removing the usb cable, removing and then re-inserting the battery. For the Unagi and Otoro, press and hold volume up and power for several seconds until you see the splash screen. Verify that the phone is in bootloader mode by using fastboot devices (or heimdall devices for some Samsung phones). Once you can see your phone using fastboot devices, you can use ./flash.sh to flash your image for Unagi.

+ +

Flashing Red LED (otoro/unagi)

+ +

This means that the battery is too low to boot the phone. You can let it charge for a while (until the red LED stops flashing and a little bit longer), or you can unplug the USB cable, remove the battery, insert the USB cable, and re-insert the battery.

+ +

Failure to receive SMS after switching over from iPhone

+ +

If you have switched your SIM card over from an iPhone to a Firefox OS (or another different platform) device, you may run into a problem whereby you can no longer receive text messages from iPhone users. This is because iPhone to iPhone SMS messages are sent using iMessage, which works by routing iPhone-to-iPhone messages through Apple's servers instead of sending them as actual text messages, saving iPhone users money. Unfortunately when you leave iPhone, iMessage has no way of knowing you've left and SMS from other iPhone users will still go through iMessage, meaning that you won't receive them.

+ +

To fix this you have to turn off iMessage for your SIM; there is a guide on how to do this at imore.com — read Here's how to turn off iMessage.

+ +

Device not appearing to ADB on OSX

+ +

When running adb devices in OSX, some devices may simply not appear in the device list, for a variety of reasons. This can be fixed by adding your device's vendor ID to your ~/.android/adb_usb.ini file, to provide a hint to ADB for finding your device.

+ +
+

Note: See this stackoverflow post for a lot more detail, including how to find the vendor ID of the attached device, and how to add it into adb_usb.ini.

+
+ +

 

diff --git a/files/de/archive/css3/index.html b/files/de/archive/css3/index.html new file mode 100644 index 0000000000..51f6b689bb --- /dev/null +++ b/files/de/archive/css3/index.html @@ -0,0 +1,976 @@ +--- +title: CSS3 +slug: Archive/CSS3 +tags: + - CSS + - CSS Bezüge + - Fortgeschritten +translation_of: Archive/CSS3 +--- +

CSS3 ist die neuste Version der Cascading Style Sheets Sprache und erweitert damit CSS2.1. Sie bringt langerwartete Neuheiten, wie abgerundete Ecken, Schatten, Verläufe, Übergänge und Animationen, sowie neue Layouts wie z.B. multi-columns, flexible box oder grid layouts. Experimentelle Teile sind vendor-prefixed und sollten entweder in Productionsumgebungen vermieden oder mit großer Vorsicht verwendet werden, da sich sowohl Syntax, als auch Semantik in Zukunft noch ändern könnten.

+ +

Module und der Standardisierungsprozess

+ +

CSS2 brauchte 9 Jahre, von August 2002 bis Juni 2011, um als empfohlen angesehen zu werden. Was daran lag, dass ein paar zweitrangige Funktionen alle Vorschriften zurückhielten. Um die Standardisierung der fehlerfreien Funktionen zu beschleunigen, hat die CSS Working Group der W3C in der  Beijing-Doktrin beschlossen die CSS Sprache in mehrere Bausteine, Module genannt, zu zerlegen. Jedes Modul ist jetzt ein eigenständiger Teil der Sprache und bewegt sich mit eigener Geschwindigkeit zur Standardisierung zu. Während manche Module bereits von der W3C empfohlen werden, sind andere noch im frühen Entwicklungsstadium. Neue Module werden hinzugefügt, wenn neue Funktionen gebraucht werden.

+ +

CSS Modules and Snapshots as defined since CSS3 Formal gibt es kein CSS3 Standard. Da jedes Modul für sich standardisiert wird, besteht das Standard-CSS aus einem CSS2.1, dass verbessert und durch vollständige Module, die nicht zwingend auf dem selben Stand sind, erweitert wurde. Zu jeder Zeit kann eine Schattenkopie des CSS Standard definiert werden, indem man CSS2.1 und die ausgereiften Module betrachtet.

+ +

Das W3 Konsortium veröffentlicht regelmäßig solche Schattenkopien, wie in 2007, 2010 und 2015.

+ +

Obwohl momentan kein Modul über dem Level 3 standardisiert wurde, wird sich das in Zukunft ändern. Manche Module, wie Selectors 4 oder CSS Borders und Backgrounds Level 4 sind bereits im Editor's Draft, obwohl sie noch nicht den First Published Working Draft Status erreicht haben.

+ +

CSS Modulstatus

+ +

Stabile Module

+ +

Ein paar CSS Module sind bereits ziemlich stabil und haben bereits eines der drei Empfehlungslevel der CSSWG erreicht: Empfehlungskandidat, vorgeschlagene Empfehlung der Empfohlen. Diese können ohne Prefixe benutzt werden und sind weitesgehend stabil, obwohl ein paar Funktionen noch auf den Empfehlungskandidat-Status herabgesetzt werden können.

+ +

These modules extend and amend the CSS2.1 specification which build the core of the specification. Together with it, they are the current snapshot of the CSS specification.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Colors", "", "") }}{{ Spec2("CSS3 Colors") }} since June 7th, 2011
+

Adds the {{ cssxref("opacity") }} property, and the hsl(), hsla(), rgba() and rgb() functions to create {{cssxref("<color>")}} values. It also defines the currentColor keyword as a valid color.

+ +

The transparent color is now a real color (thanks to the support for the alpha channel) and is a now an alias for rgba(0,0,0,0.0) .

+ +

It deprecates the system-color keywords that shouldn't be used in a production environment anymore.

+
+ + + + + + + + + + + +
{{ SpecName("CSS3 Selectors", "", "") }}{{ Spec2("CSS3 Selectors") }} since September 29th, 2011
+

Adds:

+ +
    +
  • Substring matching attribute selectors, E[attribute^="value"], E[attribute$="value"], E[attribute*="value"] .
    • +
  • New pseudo-classes: {{ cssxref(":target") }}, {{ cssxref(":enabled") }} and {{ cssxref(":disabled") }}, {{ cssxref(":checked") }}, {{ cssxref(":indeterminate") }}, {{ cssxref(":root") }}, {{ cssxref(":nth-child") }} and {{ cssxref(":nth-last-child") }}, {{ cssxref(":nth-of-type") }} and {{ cssxref(":nth-last-of-type") }}, {{ cssxref(":last-child") }}, {{ cssxref(":first-of-type") }} and {{ cssxref(":last-of-type") }}, {{ cssxref(":only-child") }} and {{ cssxref(":only-of-type") }},{{ cssxref(":empty") }}, and {{ cssxref(":not") }}.
    • +
  • Pseudo-elements are now characterized by two colons rather than one: :after becomes {{ cssxref("::after") }}, :before becomes {{ cssxref("::before") }}, :first-letter becomes {{ cssxref("::first-letter") }}, and :first-line becomes {{ cssxref("::first-line") }}.
    • +
  • The new general sibling combinator ( h1~pre ).
    • +
+
+ +

The next iteration of the Selectors specification is already in progress, though it still hasn't reached the First Public Working Draft stage.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Namespaces", "", "") }}{{ Spec2("CSS3 Namespaces") }} since September 29th, 2011
+

Adds the support for the XML Namespaces by defining the notion of CSS qualified name, using the ' | ' syntax and adding the {{ cssxref("@namespace") }} CSS at-rule.

+
+ + + + + + + + + + + +
{{ SpecName("CSS3 Media Queries", "", "") }}{{ Spec2("CSS3 Media Queries") }} since June 19th, 2012
+

Extends the former media type ( print, screen, … ) to a full language allowing queries on the device media capabilities like only screen and (color) .

+ +

Media queries are not only used in CSS document but also in some attributes of HTML Elements, like the {{ htmlattrxref("media","link") }} attribute of the {{ HTMLElement("link") }} element.

+
+ +

The next iteration of this specification is in the work, allowing to tailor a Web site regarding the input methods available on the user agent, with new media features like hover or pointer. Detection of EcmaScript support, using the script media features is also proposed.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Style", "", "") }}{{ Spec2("CSS3 Style") }} since November 7th, 2013
Formally defines the syntax of the content of the HTML style global attribute.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Backgrounds", "", "") }}{{ Spec2("CSS3 Backgrounds") }}
+

Adds:

+ +
    +
  • Support, on backgrounds, for any type of {{cssxref("<image>")}}, and not only for uri() defined ones.
    • +
  • Support for multiple background images.
    • +
  • The {{ cssxref("background-repeat") }} space and round values, and for the 2-value syntax of this CSS property.
    • +
  • The {{ cssxref("background-attachment") }} local value.
    • +
  • The CSS {{ cssxref("background-origin") }}, {{ cssxref("background-size") }}, and {{ cssxref("background-clip") }} properties.
    • +
  • Support for curved border corners, with the CSS {{ cssxref("border-radius") }}, {{ cssxref("border-top-left-radius") }}, {{ cssxref("border-top-right-radius") }}, {{ cssxref("border-bottom-left-radius") }}, and {{ cssxref("border-bottom-right-radius") }} properties.
    • +
  • Support for the use of an {{cssxref("<image>")}} as the border with the CSS {{ cssxref("border-image") }}, {{ cssxref("border-image-source") }}, {{ cssxref("border-image-slice") }}, {{ cssxref("border-image-width") }}, {{ cssxref("border-image-outset") }}, and {{ cssxref("border-image-repeat") }} properties.
    • +
  • Support for shadows of the element with the CSS {{ cssxref("box-shadow") }} property.
    • +
+
+ +

The CSS4 iteration of the Backgrounds and Borders specification is already in progress, though it still hasn't reached the First Public Working Draft stage, it plans to add the ability to clip a border (with the CSS {{ cssxref("border-clip") }}, {{ cssxref("border-clip-top") }}, {{ cssxref("border-clip-right") }}, {{ cssxref("border-clip-bottom") }}, and {{ cssxref("border-clip-left") }} properties) or to control the shape of the border in a corner (using the CSS {{ cssxref("border-corner-shape") }} property).

+ + + + + + + + + + + +
{{ SpecName("CSS3 Multicol", "", "") }}{{ Spec2("CSS3 Multicol") }}
Adds support for easy multi-column layouts using the CSS {{ cssxref("columns") }}, {{ cssxref("column-count") }}, {{ cssxref("column-fill") }}, {{ cssxref("column-gap") }}, {{ cssxref("column-rule") }}, {{ cssxref("column-rule-color") }}, {{ cssxref("column-rule-style") }}, {{ cssxref("column-rule-width") }}, {{ cssxref("column-span") }}, {{ cssxref("column-width") }}, {{ cssxref("break-after") }}, {{ cssxref("break-before") }}, and {{ cssxref("break-inside") }}.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Speech", "", "") }}{{ Spec2("CSS3 Speech") }}
Defines the speech media type, an aural formatting model and numerous properties specific for speech-rendering user agents.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Images", "", "") }}{{ Spec2("CSS3 Images") }}
+

Defines the {{cssxref("<image>")}} data type.

+ +

Extends the url() syntax to support image slices using media fragments.

+ +

Adds:

+ +
    +
  • The dppx unit to the {{cssxref("<resolution>")}} data type.
    • +
  • The image() function as a more flexible alternative to url() to define an image from an url.
    + At risk : due to insufficient browser support, standardization of the image() function may be postponed to the next iteration of this module .
    • +
  • Support for linear-gradient(), repeating-linear-gradient(), radial-gradient() and repeating-radial-gradient().
    • +
  • The ability to define how a replaced element should fit in its element, using the CSS {{ cssxref("object-fit") }} property.
    + At risk : due to insufficient browser support, standardization of the {{ cssxref("object-fit") }} and property may be postponed to the next iteration of this module .
    • +
  • The ability to override the resolution and orientation of an external image using the CSS {{ cssxref("image-resolution") }} and {{ cssxref("image-orientation") }} properties.
    + At risk : due to insufficient browser support, standardization of the {{ cssxref("image-resolution") }} and {{ cssxref("image-orientation") }} properties may be postponed to the next iteration of this module .
    • +
+
+ +

The CSS Image Values and Replaced Content Level 4 which will supersede CSS Image Level 3 is in development and is a {{Spec2("CSS4 Images")}}.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Values", "", "") }}{{ Spec2("CSS3 Values") }}
+

Makes initial and inherit keywords usable on any CSS property.

+ +

Formally defines the CSS data types of CSS 2.1, that were implicitely defined by their grammar token and some textual precisions.

+ +

Adds:

+ +
    +
  • Definition for new font-relative length units: rem and ch .
    • +
  • Definition for viewport-relative length units: vw, vh, vmax, and vmin .
    • +
  • Precision about the real size of the absolute length units, which are not really absolute, but defined in relation with the reference pixel .
    • +
  • Definition for {{ cssxref("<angle>") }}, {{cssxref("<time>")}}, {{cssxref("<frequency>")}}, {{cssxref("<resolution>")}}.
    • +
  • Normative value to the definition of {{cssxref("<color>")}}, {{cssxref("<image>")}}, and {{cssxref("<position>")}}.
    • +
  • Definition for the {{ cssxref("calc", "calc()") }}, {{ cssxref("attr", "attr()")}}, and toggle() functional notations.
    + At risk: due to insufficient browser support, standardization of the calc(), attr(), and toggle() functional notations may be postponed to the next iteration of this module.
    • +
+
+ +

Several types definition, like <ident> and <custom-ident>, have been deferred to CSS Values and Units Module Level 4.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Flexbox", "", "") }}{{ Spec2("CSS3 Flexbox") }}
Add a flexbox layout to the CSS {{ cssxref("display") }} property and several new CSS properties to control it: {{ cssxref("flex") }}, {{ cssxref("flex-align") }}, {{ cssxref("flex-direction") }}, {{ cssxref("flex-flow") }}, {{ cssxref("flex-item-align") }}, {{ cssxref("flex-line-pack") }}, {{ cssxref("flex-order") }}, {{ cssxref("flex-pack") }}, and {{ cssxref("flex-wrap") }}.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Conditional", "", "") }}{{ Spec2("CSS3 Conditional") }}
Adds features for conditional processing of parts of style sheets, conditioned on capabilities of the browser or the document the style sheet is being applied to. It consists mainly in allowing nested at-rules inside {{ cssxref("@media") }} and the adding of a new CSS at-rule, {{ cssxref("@supports") }}, and a new DOM method {{domxref("CSS.supports()")}}.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Text Decoration", "", "") }}{{ Spec2("CSS3 Text Decoration") }}
+

Extends:

+ +
    +
  • the CSS {{ cssxref("text-decoration") }} property by making it a shorthand for the CSS {{ cssxref("text-decoration-line") }}, {{ cssxref("text-decoration-color") }}, and {{ cssxref("text-decoration-style") }} properties. And adds the {{ cssxref("text-decoration-skip") }}, and {{ cssxref("text-underline-position") }} properties.
    • +
+ +

Adds:

+ +
    +
  • Support for East-Asian-script emphasis marks with the CSS {{ cssxref("text-emphasis") }}, {{ cssxref("text-emphasis-style") }}, {{ cssxref("text-emphasis-color") }}, and {{ cssxref("text-emphasis-position") }} properties.
    • +
  • Support for script shadows with the CSS {{ cssxref("text-shadow") }} property.
    • +
+ +

Clarifies:

+ +
    +
  • The paint order of the decorations.
    • +
+ +

At risk: due to insufficient browser support, standardization of the text-decoration-skip, line positioning rules and the ability to place both emphasis marks and ruby above the same base text may be postponed to the next iteration of this module.

+
+ + + + + + + + + + + +
{{ SpecName("CSS3 Fonts", "", "") }}{{ Spec2("CSS3 Fonts") }}
+

Amends the CSS2.1 Font matching algorithm to be closer to what is really implemented.

+ +

Adds:

+ +
    +
  • Support for downloadable fonts via the CSS {{ cssxref("@font-face") }} at-rule.
    • +
  • The control of the contextual inter-glyph spacing via the CSS {{ cssxref("font-kerning") }} property.
    • +
  • The choice of language-specific glyphs via the CSS {{ cssxref("font-language-override") }} property.
    • +
  • The choice of glyphs with specific OpenType features via the CSS {{ cssxref("font-feature-settings") }} property.
    • +
  • The control of the aspect ratio to use when fallback fonts are selected via the CSS {{ cssxref("font-size-adjust") }} property.
    • +
  • The choice of alternative font faces using the CSS {{ cssxref("font-stretch") }}, {{ cssxref("font-variant-alternates") }}, {{ cssxref("font-variant-caps") }}, {{ cssxref("font-variant-east-asian") }}, {{ cssxref("font-variant-ligatures") }}, {{ cssxref("font-variant-numeric") }}, and {{ cssxref("font-variant-position") }} properties. It also extends the related CSS {{ cssxref("font-variant") }} shorthand property and introduces the {{ cssxref("@font-feature-values") }} at-rule.
    • +
  • The control of the automatic generation of an oblique or bold face when none are found via the CSS {{ cssxref("font-synthesis") }} property.
    • +
+
+ + + + + + + + + + + +
{{ SpecName("CSS3 Cascade", "", "") }}{{ Spec2("CSS3 Cascade") }}
+

Adds:

+ +
    +
  • The initial, unset values for properties.
    • +
  • The CSS {{ cssxref("all") }} property.
    • +
  • The scoping mechanism.
    • +
+ +

Clarifies:

+ +
    +
  • Interaction of media-dependent @import statements and style sheet loading requirements.
    • +
+
+ + + + + + + + + + + +
{{ SpecName("CSS3 Writing Modes", "", "") }}{{ Spec2("CSS3 Writing Modes") }}
Defines the writing modes of both horizontal and vertical scripts and clarifies how the CSS {{ cssxref("direction") }} and {{ cssxref("unicode-bidi") }} properties interact with the new CSS {{ cssxref("text-orientation") }} property, and extends them where needed.
+ + + + + + + + + + + +
{{ SpecName("CSS Shapes", "", "") }}{{ Spec2("CSS Shapes") }}
Defines geometric shapes, which can be applied to floats. These shapes describe areas, around which inline content wraps instead of wrapping around the bounding box.
+ + + + + + + + + + + +
{{ SpecName("CSS Masks", "", "") }}{{ Spec2("CSS Masks") }}
Defines a way for partially or fully hiding portions of visual elements. It describes how to use another graphical element or image as a luminance or alpha mask.
+ +

Modules in the refining phase

+ +

Specifications that are deemed to be in the refining phase are already fairly stable. Though changes are still expected, they shouldn't create incompatibilities with current implementations; they should mainly define behavior in edge cases.

+ + + + + + + + + + + +
{{ SpecName("Web Animations", "", "") }}{{ Spec2("Web Animations") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS3 Counter Styles", "", "") }}{{ Spec2("CSS3 Counter Styles") }}
 
+ + + + + + + + + + + +
{{ SpecName("Compositing", "", "") }}{{ Spec2("Compositing") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS3 Syntax", "", "") }}{{ Spec2("CSS3 Syntax") }}
Clarifies how charsets are determined; minor changes in parsing and tokenization algorithms.
+ + + + + + + + + + + +
{{ SpecName("CSS Will Change", "", "") }}{{ Spec2("CSS Will Change") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS3 Transitions", "", "") }}{{ Spec2("CSS3 Transitions") }}
Allows the definition of transitions effects between two properties values by adding the CSS {{ cssxref("transition") }}, {{ cssxref("transition-delay") }}, {{ cssxref("transition-duration") }}, {{ cssxref("transition-property") }}, and {{ cssxref("transition-timing-function") }} properties.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Animations", "", "") }}{{ Spec2("CSS3 Animations") }}
Allows the definition of animations effects by adding the CSS {{ cssxref("animation") }}, {{ cssxref("animation-delay") }},{{ cssxref("animation-direction") }}, {{ cssxref("animation-duration") }}, {{ cssxref("animation-fill-mode") }}, {{ cssxref("animation-iteration-count") }}, {{ cssxref("animation-name") }}, {{ cssxref("animation-play-state") }}, and {{ cssxref("animation-timing-function") }} properties, as well as the {{ cssxref("@keyframes") }} at-rule.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Transforms", "", "") }}{{ Spec2("CSS3 Transforms") }}
+

Adds:

+ +
    +
  • the support of bi-dimensional transforms to be applied to any element using the CSS {{ cssxref("transform") }} and {{ cssxref("transform-origin") }} properties. The supported transforms are: matrix(), translate(), translateX(), translateY(), scale(), scaleX(), scaleY(), rotate(), skewX(), and skewY().
    • +
  • the support of tri-dimensional transforms to be applied to any element by adding the CSS {{ cssxref("transform-style") }}, {{ cssxref("perspective") }}, {{ cssxref("perspective-origin") }}, and {{ cssxref("backface-visibility") }} properties and extended the {{ cssxref("transform") }} property with the following transforms are: matrix 3d(), translate3d(), translateZ(),  scale3d(), scaleZ(), rotate3d(), rotateX(), rotateY(), rotateZ(), and perspective().
    • +
+ +

Note: this specification is a merge of CSS 2D-Transforms, CSS 3D-Transforms and SVG transforms.

+
+ + + + + + + + + + + +
{{ SpecName("CSS3 Fragmentation", "", "") }}{{ Spec2("CSS3 Fragmentation") }}
Defines how partitions of a Web page should happen, that is page, column breaks, and widows and orphans handling. +

Adds:

+ +
    +
  • Support for defining the behavior of decorations, that is borders and background colors or images, when a box is breaked (at a page, column or line-break) with the CSS {{ cssxref("box-decoration-break") }} property.
    • +
+
+ + + + + + + + + + + +
{{ SpecName("CSS3 Text", "", "") }}{{ Spec2("CSS3 Text") }}
+

Extends:

+ +
    +
  • the CSS {{ cssxref("text-transform") }} property with the value full-width.
    • +
  • the CSS {{ cssxref("text-align") }} property with the value start, end, start end, and match-parent for a better support of documents with multiple directionalities of text.
    • +
  • the CSS {{ cssxref("text-align") }} property with a {{cssxref("<string>")}} value to align on that character. This is useful to align number on the decimal point.
    • +
  • the CSS {{ cssxref("word-spacing") }} and {{ cssxref("letter-spacing") }} properties with range constraints to control flexibility in justification.
    • +
+ +

Adds:

+ +
    +
  • Control on how whitespaces are displayed using the CSS {{ cssxref("text-space-collapse") }} and {{ cssxref("tab-size") }} properties.
    • +
  • Control on line breaks and word boundaries using the CSS {{ cssxref("line-break") }}, {{ cssxref("word-break") }}, {{ cssxref("hyphens") }}, {{ cssxref("text-wrap") }}, {{ cssxref("overflow-wrap") }}, and {{ cssxref("text-align-last") }} properties.
    • +
  • Control on how justification is happening, in order to support more type of scripts, using the CSS {{ cssxref("text-justify") }} property.
    • +
  • Control on edge effect using the CSS {{ cssxref("text-indent") }} and {{ cssxref("hanging-punctuation") }} properties.
    • +
+
+ +

A few features present in early CSS Text Level 3 draft have being postponed to the next iteration of this module .

+ + + + + + + + + + + +
{{ SpecName("CSS3 Variables", "", "") }}{{ Spec2("CSS3 Variables") }}
Defines a mechanism allowing to define variables in CSS.
+ + + + + + + + + + + +
{{ SpecName("Compositing", "", "") }}{{ Spec2("Compositing") }}
 
+ +

Modules in the revising phase

+ +

Modules that are in the revising phase are much less stable than those in the refining phase. Often the syntax is still under scrutiny and may evolve a lot, in a non-compatible way. Alternative syntaxes are tested and often implemented.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Basic UI", "", "") }}{{ Spec2("CSS3 Basic UI") }}
+

Adds:

+ +
    +
  • The ability to tweak the box model using the CSS {{ cssxref("box-sizing") }} property.
    + At risk: due to insufficient browser support, standardization of the padding-box value may be postponed to the next iteration of this module .
    • +
  • Allow the styling of forms according their content using the CSS {{ cssxref(":indeterminate") }}, {{ cssxref(":default") }}, {{ cssxref(":valid") }}, {{ cssxref(":invalid") }}, {{ cssxref(":in-range") }}, {{ cssxref(":out-of-range") }}, {{ cssxref(":required") }}, {{ cssxref(":optional") }}, {{ cssxref(":read-only") }}, and {{ cssxref(":read-write") }} pseudo-classes and the {{ cssxref("::value") }}, {{ cssxref("::choices") }}, {{ cssxref("::repeat-item") }}, and {{ cssxref("::repeat-index") }} pseudo-elements.
    + At risk: due to insufficient browser support, standardization of the pseudo-elements {{ cssxref("::value") }}, {{ cssxref("::choices") }}, {{ cssxref("::repeat-item") }}, and {{ cssxref("::repeat-index") }} may be postponed to the next iteration of this module .
    • +
  • Support for icons, defined by the CSS {{ cssxref("icon") }} property simultaneously with the new icon value of the CSS {{ cssxref("content") }} property.
    + At risk: due to insufficient browser support, standardization of the {{ cssxref("icon") }} property and the icon value may be postponed to CSS4.
    • +
  • Support for the CSS {{ cssxref("outline-offset") }} property giving more control on the position of the outline.
    • +
  • Support for the CSS {{ cssxref("resize") }} property allowing Web authors to control if and how elements should be resized.
    • +
  • Support for the CSS {{ cssxref("text-overflow") }} property defining how text overflows, if needed.
    + At risk: due to insufficient browser support, the 2-value syntax of this property as well as the support for {{cssxref("<string>")}} values may be postponed to the next iteration of this module .
    • +
  • The ability to define the hotspot of a cursor as well as the new none, context-menu, cell, vertical-text, alias, copy, no-drop, not-allowed, nesw-resize, nwse-resize, col-resize, row-resize, all-scroll, zoom-in, zoom-out, extending the {{ cssxref("cursor") }} property.
    • +
  • The ability to specify the sequential navigation order (that is the tabbing order ) using the CSS {{ cssxref("nav-index") }}, {{ cssxref("nav-up") }}, {{ cssxref("nav-right") }}, {{ cssxref("nav-left") }}, {{ cssxref("nav-down") }} properties.
    + At risk: due to insufficient browser support, standardization of the navigation properties may be postponed to the next iteration of this module .
    • +
  • The ability to control the usage of an IME editor, using the CSS {{ cssxref("ime-mode") }} property.
    + At risk: due to insufficient browser support, standardization of the {{ cssxref("ime-mode") }} property may be postponed to the next iteration of this module .
    • +
+
+ +

An early list of what could be in the next iteration of the CSS Basic User Interface Module is available.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Grid", "", "") }}{{ Spec2("CSS3 Grid") }}
Add a grid layout to the CSS display property and several new CSS properties to control it: {{cssxref("grid")}}, {{cssxref("grid-area")}}, {{cssxref("grid-auto-columns")}}, {{cssxref("grid-auto-flow")}}, {{cssxref("grid-auto-position")}}, {{cssxref("grid-auto-rows")}}, {{cssxref("grid-column")}}, {{cssxref("grid-column-start")}}, {{cssxref("grid-column-end")}}, {{cssxref("grid-row")}}, {{cssxref("grid-row-start")}}, {{cssxref("grid-row-end")}}, {{cssxref("grid-template")}}, {{cssxref("grid-template-areas")}}, {{cssxref("grid-template-rows")}}, and {{cssxref("grid-template-columns")}}.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Box Alignment", "", "") }}{{ Spec2("CSS3 Box Alignment") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS3 Paged Media", "", "") }}{{ Spec2("CSS3 Paged Media") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSSOM View", "", "") }}{{ Spec2("CSSOM View") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS4 Selectors", "", "") }}{{ Spec2("CSS4 Selectors") }}
 
+ +

Modules in the exploring phase

+ + + + + + + + + + + +
{{ SpecName("CSS4 Images", "", "") }}{{ Spec2("CSS4 Images") }}
+

Extends:

+ +
    +
  • the image() functional notation to describe the directionality of the image (rtl or ltr), allowing for bidi-sensitive images.
    • +
  • the {{ cssxref("image-orientation") }} property by adding the keyword from-image, allowing to follow EXIF data stored into images to be considered.
    • +
+ +

Adds:

+ +
    +
  • the image-set() functional notation to allow the definition to equivalent images at different resolution allowing for resolution-negotiated selection of images.
    • +
  • the element() functional notation allowing the use of part of the page as image.
    • +
  • the cross-fade() functional notation allowing to refer to intermediate images when transitioning between two images and defines the interpolation between two images.
    • +
  • the conic-gradient() and repeating-conic-gradient() functional notation describing a new type of gradient.
    • +
  • the {{cssxref("image-rendering")}} property that allow to define how resize of the object should be handled.
    • +
+
+ + + + + + + + + + + +
{{ SpecName("CSS3 Device", "", "") }}{{ Spec2("CSS3 Device") }}
Adds a new at-rule, {{ cssxref("@viewport") }}, allowing to specify the size, zoom factor, and orientation of the viewport that is used as the base for the initial containing block.
+ + + + + + + + + + + +
{{ SpecName("CSS3 GCPM", "", "") }}{{ Spec2("CSS3 GCPM") }}
Adds the ability to tailor printed version of a document by allowing to control header, footer but also references tables like indexes or tables of content.
+ + + + + + + + + + + +
{{ SpecName("CSS Exclusions", "", "") }}{{ Spec2("CSS Exclusions") }}
Extends the floats mechanism to define exclusion regions in any positioning scheme. Adds the notion of shapes, in which content must flows.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Lists", "", "") }}{{ Spec2("CSS3 Lists") }}
Extends the list counter mechanism so that list markers can be styled and Web developers can define new list counter schemes.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Regions", "", "") }}{{ Spec2("CSS3 Regions") }}
Defines a new mechanism allowing content to flow across, eventually non-contiguous, multiple areas called regions.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Device", "", "") }}{{ Spec2("CSS3 Device") }}
Adds a new at-rule, {{ cssxref("@viewport") }}, allowing to specify the size, zoom factor, and orientation of the viewport that is used as the base for the initial containing block.
+ + + + + + + + + + + +
{{ SpecName("Filters 1.0", "", "") }}{{ Spec2("Filters 1.0") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS3 Template", "", "") }}{{ Spec2("CSS3 Template") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS3 Sizing", "", "") }}{{ Spec2("CSS3 Sizing") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS Line Grid", "", "") }}{{ Spec2("CSS Line Grid") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS3 Positioning", "", "") }}{{ Spec2("CSS3 Positioning") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS3 Ruby", "", "") }}{{ Spec2("CSS3 Ruby") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSSOM", "", "") }}{{ Spec2("CSSOM") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS3 Overflow", "", "") }}{{ Spec2("CSS3 Overflow") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS3 Font Loading", "", "") }}{{ Spec2("CSS3 Font Loading") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS3 Display", "", "") }}{{ Spec2("CSS3 Display") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS Scope", "", "") }}{{ Spec2("CSS Scope") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS4 Media Queries", "", "") }}{{ Spec2("CSS4 Media Queries") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS Non-element Selectors", "", "") }}{{ Spec2("CSS Non-element Selectors") }}
 
+ + + + + + + + + + + +
{{ SpecName("Geometry Interfaces", "", "") }}{{ Spec2("Geometry Interfaces") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS3 Inline", "", "") }}{{ Spec2("CSS3 Inline") }}
 
+ +

Modules in the rewriting phase

+ +

Modules that are in the rewriting phase are outdated and require to be rewritten. The syntax is still under scrutiny and may evolve a lot, in a non-compatible way. Alternative syntaxes are tested and often implemented.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Box", "", "") }}{{ Spec2("CSS3 Box") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS3 Content", "", "") }}{{ Spec2("CSS3 Content") }}
 
+ + + + + + + + + + + +
{{ SpecName("CSS3 Inline Layout", "", "") }}{{ Spec2("CSS3 Inline Layout") }}
 
+ +

 

diff --git a/files/de/archive/index.html b/files/de/archive/index.html new file mode 100644 index 0000000000..4f4a70c023 --- /dev/null +++ b/files/de/archive/index.html @@ -0,0 +1,21 @@ +--- +title: Archive of obsolete content +slug: Archive +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive +--- +

Here at MDN, we try to avoid outright deleting content that might be useful to people targeting legacy platforms, operating systems, and browsers. Perhaps your target audience is people that are using older hardware, for example, and can't upgrade to the latest and greatest browsers. Or for "reasons," your company is required to use very old software and you need to build Web content that runs on that software. Or perhaps you're just curious about the history of an obsolete feature or API, and how it worked.

+ +

There are many reasons older documentation can be useful. So, we've established this area into which we can archive older documentation. Material in this Archived content zone should not be used for building new Web sites or apps for modern browsers. It's here for historical reference only.

+ +
+

Note to writers: We need to try to keep the subpages here organized instead of all dumped into one large folder. Try to create subtrees for categories of material. Also, only move pages here that are extremely obsolete. If anyone might realistically need the information in a living product, it may not be appropriate to move it here. In general, it may be best to discuss it in the MDN Web Docs chat room before moving content here.

+
+ +

{{SubpagesWithSummaries}}

+ + + +

{{ListSubpages("/en-US/docs/Archive", 2, 0, 1)}}

diff --git a/files/de/archive/mdn/index.html b/files/de/archive/mdn/index.html new file mode 100644 index 0000000000..9e550840e3 --- /dev/null +++ b/files/de/archive/mdn/index.html @@ -0,0 +1,20 @@ +--- +title: MDN Archive +slug: Archive/MDN +tags: + - Archive + - MDN + - NeedsTranslation + - TopicStub +translation_of: Archive/MDN +--- +

{{MDNSidebar}}

+ +
+

Obsolete
+ This documentation is obsolete.

+
+ +

The documentation listed below is archived, obsolete material about MDN itself.

+ +

{{LandingPageListSubpages}}

diff --git a/files/de/archive/mozilla/index.html b/files/de/archive/mozilla/index.html new file mode 100644 index 0000000000..0acec76e6d --- /dev/null +++ b/files/de/archive/mozilla/index.html @@ -0,0 +1,10 @@ +--- +title: Archived Mozilla and build documentation +slug: Archive/Mozilla +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive/Mozilla +--- +

These articles are archived, obsolete documents about Mozilla, Gecko, and the process of building Mozilla projects.

+

{{SubpagesWithSummaries}}

diff --git a/files/de/archive/mozilla/marketplace/apis/index.html b/files/de/archive/mozilla/marketplace/apis/index.html new file mode 100644 index 0000000000..ca60d38982 --- /dev/null +++ b/files/de/archive/mozilla/marketplace/apis/index.html @@ -0,0 +1,46 @@ +--- +title: Zusatz Bibiliotheken and APIs +slug: Archive/Mozilla/Marketplace/APIs +tags: + - Anfänger + - Anwendungen + - Firefox OS + - Marketplace + - Marktplatz +translation_of: Archive/Mozilla/Marketplace/APIs +--- +
+

Wenn es um das Programmieren in Ihrer App oder Web-Seite für den Firefox Marketplace geht, werden Sie Marketplace Zusatz Bibliotheken, Web APIs und Marketplace APIs verwenden. Diese Seite erklärt Ihnen, wie und wann Sie diese Optionen verwenden können und stellt Ihnen weitere Links zu noch mehr Informationen bereit.

+
+ +

Marketplace Zusatz Bibiliotheken

+ +
+
Die Marketplace Zusatz Bibliotheken sollen Ihr tägliches Programmieren einfacher machen. Es gibt zurzeit eine solche Bibliothek, es können aber mehr entstehen, sobald es noch mehr Funktionen für den Marketplace geben wird.
+ +
 
+
+ + + +

Web APIs

+ +

Ihre App für den Marketplace benötigt zur Verwendung von Web APIs bestimmte Funktionen:

+ + + +

Marketplace APIs

+ +

Für die üblichen Anwendungen brauchen Sie die Marketplace APIs nicht, doch manche Projekte, wie das Erstellen von eigenen Shops, benötigen diese. Wenn Sie also bestimmte Funktionen in diesem Bereich brauchen, bietet es sich an, die Marketplace APIs zu nutzen. 

+ +

Die Dokumentation der Marketplace APIs finden sie hier, auf readthedocs.org. Bitte treten Sie der Entwickler-Marketplace Mailing Liste bei, wenn Sie noch weitere Informationen zum Marketplace API brauchen.

+ +
+

Diese Marketplace API Dokumentation beschreibt den Einsatz in der Entwicklung von Apps für den Firefox Marketplace. Das heißt, dass dieser Artikel Informationen über APIs enthalten kann, die im öffentlichen Marketplace nicht zugänglich sind.

+
+ +

 

diff --git a/files/de/archive/mozilla/marketplace/faq/index.html b/files/de/archive/mozilla/marketplace/faq/index.html new file mode 100644 index 0000000000..6b6def2d3a --- /dev/null +++ b/files/de/archive/mozilla/marketplace/faq/index.html @@ -0,0 +1,30 @@ +--- +title: Firefox Marketplace FAQs +slug: Archive/Mozilla/Marketplace/FAQ +translation_of: Archive/Mozilla/Marketplace/FAQ +--- +
+
+ Wie kann ich eine neue App hochladen?
+
+ Schaue dir dazu diesen Artikel an: Veröffentlichen einer App
+ +
+ Was ist der Genehmigungsprozess?
+
+ Für die Entwickler-Preview werden alle Apps mit einer gültigen manifest-Datei automatisch zugelassen.
+
+ Müssen meine Apps den Content-Richtlinien entsprechen?
+
+ Die primären inhaltlichen Einschränkungen im "Firefox Marketplace" verhindern, dass bösartige oder illegale Aktivitäten zu stande kommen. Die Richtlinien sind die Gleichen, wie die Content-Richtlinien für den Firefox. Die Richtlinien werden vor dem benutzersichtbaren Betastart vom "Marketplace" fertig sein.
+
+ Wie verkauft der "Firefox Marketplace" meine App?
+
+
+ Notiz: Kauf-Apps und In-App-Käufe sind der Zeit im "Firefox Marketplace" deaktiviert (August 2012). Es wird erwartet, dass diese Funktionen im Oktober 2012 wieder aktiviert werden.
+
+
+ Wer hosted die App?
+
+ Du hostest alle Dateien deiner App auf deinem eigenden Server. Wenn du eine App in den "Firefox Marketplace" einträgst, gibst du die URL von der manifest-Datei deiner App an, welches der "Marketplace" einliest und überprüft. Du kannst Icons, Screenshots, usw. hochladen, um deine App im "Firefox Marketplace" zu promoten.
+
diff --git a/files/de/archive/mozilla/marketplace/index.html b/files/de/archive/mozilla/marketplace/index.html new file mode 100644 index 0000000000..10b84af67e --- /dev/null +++ b/files/de/archive/mozilla/marketplace/index.html @@ -0,0 +1,126 @@ +--- +title: Firefox Marketplace +slug: Archive/Mozilla/Marketplace +tags: + - Anfänger + - Apps + - Beginner + - Firefox OS + - Intro + - Landing + - Marketplace +translation_of: Archive/Mozilla/Marketplace +--- +
Der Firefox-Marktplatz ist ein offener und nicht-proprietärer Online-Marktplatz für Web-Anwendungen mit HTML5.
+ +

Der Firefox-Marketplace ermöglicht Entwicklern, plattformübergreifende open web Anwendungen mittels standardisierter Web-Technologien, Sprachen und Tools zu veröffentlichen. Mozilla bringt seine innersten Werte — Offenheit, Freiheit, Auswahl durch den Benutzer – in die Welt der Apps.

+ +
+
+

Ihre Apps veröffentlichen

+ +
+
App Veröffentlichungsoptionen
+
+
+
Nachdem Sie eine offene Web-App erstellt haben, stehen Ihnen verschiedene Optionen für die Veröffentlichung zur Verfügung. Dieser Artikel erklärt, was zur Auswahl steht.
+
+
+
Übermitteln einer App in den Firefox Marketplace
+
+
+
Ein ausführlicher Leitfaden für diejenigen, die eine App auf dem Firefox-Marketplace veröffentlichen wollen um Sie der ganzen Welt zur Verfügung zu stellen..
+
+
+
Allgemeines zur App-Veröffentlichung
+
+
+
Allgemeine Informationen und nützliche Tipps über die Veröffentlichung von Web-Apps.
+
+
+
Firefox Marketplace APIs
+
+
+
Links zu den wichtigsten Referenzhandbüchern für Mozillas Firefox Marketplace APIs, mit denen Sie Zahlungskonten und das automatische Hochladen der App (und der Updates) kontrollieren können.
+
+
+
+
+ +
+

Monetarisierung

+ +
+
Profitieren von Ihrer App
+
+
+
Sie haben viel Arbeit und Liebe in ihre App gesteckt und wollen nun auch etwas von der App haben? Dieser Artikel befasst sich mit kostenpflichtigen Apps und In-App-Käufen. Alles Wege, damit Sie Geld an ihrem Werk verdienen.
+
+
+
+ +

Werkzeuge für App Entwickler

+ + + +

Erstellen Sie Ihren eigenen Marketplace

+ +
+
Erstellen eines Marktplatzes
+
+
+
Sie müssen nicht den Firefox-Marktplatz verwenden, um Ihre Anwendung zu verteilen. Sie können auch ihren eigenen internen Marktplatz erstellen. Nützlich zum Beispiel für Firmennetzwerke.
+
+
+
+
+
+ + + +
    +
  1. Eine App veröffentlichen und überprüfen + +
      +
    1. Veröffentlichen einer App im Firefox Marketplace
      2. +
    2. Eine App bewerten
      3. +
    3. Überprüfungskriterien für Marketplace
      4. +
    4. Marketplace: screenshot Kriterien
      5. +
    5. Leitfaden für die Datenschutzerklärungen
      6. +
    6. Das Testen und Verbessern ihrer Apps.
      7. +
    +
    2. +
  2. Veröffentlichung +
      +
    1. Möglichkeiten der Veröffentlichung
      2. +
    2. Verpacken der Apps
      3. +
    3. Apps aktualisieren.
      4. +
    4. Open-Web-Apps für Android
      5. +
    5. Einen "Subdomain" zur App hinzufügen.
      6. +
    6. Ihren eigenen Marktplatz erstellen.
      7. +
    +
    3. +
  3. Monetization +
      +
    1. Verdiehen Sie mit ihrer App Geld.
      2. +
    2. Richtlinien zur Bezahlung
      3. +
    3. In-App Käufe
      4. +
    4. Überprüfung
      5. +
    5. App-Preise
      6. +
    6. Bezahlungsstatus
      7. +
    +
    4. +
  4. Marketplace APIs +
      +
    1. Marketplace utility library
      2. +
    2. Submission API
      3. +
    3. Payment API
      4. +
    4. Marketplace API
      5. +
    +
    5. +
  5. Firefox Marketplace FAQs
    6. +
diff --git a/files/de/archive/mozilla/marketplace/index/index.html b/files/de/archive/mozilla/marketplace/index/index.html new file mode 100644 index 0000000000..6c4402ac0e --- /dev/null +++ b/files/de/archive/mozilla/marketplace/index/index.html @@ -0,0 +1,107 @@ +--- +title: Index +slug: Archive/Mozilla/Marketplace/Index +translation_of: Archive/Mozilla/Marketplace/Index +--- + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SeiteMarkierungen und Zusammenfassung
Firefox Marketplace +
+
+ Apps, Anfänger, Firefox-OS, Intro, Marktplatz, l10n Priorität
+
+
+
+
+ In dieser Zone finden Sie alle Informationen die Sie für die Vorbereitung benötigen um apps auf dem Firefox-Marktplatz zu veröffentlichen. Anleitung wie man apps erfolgreich zustellt, Zustelloptionen, Monetarisierung, Veröffentlichung , Aktualisierung der apps,  die Bibliotheken und APIs Finde Marktplatz-Funktionen zu verwenden.
+
+
Firefox Marketplace APIsAPI, Apps, Marketplace
+
+
+ Links zu den wichtigsten Referenzen für Mozillas Firefox Marktplatz APIs, mit denen Sie app-Einreichungen behandeln können. Konfigurieren Sie ein Abrechnungskonto für eine app und vieles mehr.
+
+
Firefox Marketplace FAQApp Zahlungen, Apps, B2G, FAQ, Firefox OS, Mobile, Marketplace
+
+
+ Dieser Artikel beantwortet eine Vielzahl von häufig gestellte Fragen mit Bezug zur Veröffentlichung auf dem Firefox Marketplace.
+
+
IndexIndex
7 Seiten gefunden:
Publishing on the Firefox MarketplaceApps, Marketplace
+
+
+ Dokumentation für das Veröffentlichen einer app auf dem Firefox Marketplace.
+
+
VorlageAnlegen
Marketplace Vorlagen
Zusatz Bibiliotheken und APIsApps, Anfänger, Firefox OS, Anleitung, Marketplace
+
+
+ Wenn es darum geht, die Funktionen für den Firefox-Marktplatz in Ihre apps und Webseiten zu codieren. Machen nutzen Sie die Marktplatz Zusatz Bibliothek, Web-APIs und Markt-APIs. Diese Seite führt diese Optionen, wenn Sie möglicherweise Links einsetzen und  zu weiteren Dokumentation beschreiben.
+
+
+

 

diff --git a/files/de/archive/mozilla/marketplace/marktplatz_apis/index.html b/files/de/archive/mozilla/marketplace/marktplatz_apis/index.html new file mode 100644 index 0000000000..41c61d5451 --- /dev/null +++ b/files/de/archive/mozilla/marketplace/marktplatz_apis/index.html @@ -0,0 +1,109 @@ +--- +title: Firefox Marktplatz APIs +slug: Archive/Mozilla/Marketplace/Marktplatz_APIs +translation_of: Archive/Mozilla/Marketplace/Marketplace_APIs +--- +
+
+
+
+ Links zu den wichtigsten Referenzen für Mozillas Firefox Marktplatz APIs, mit denen Sie, App-Einreichungen behandeln können und Sie ein Abrechnungskonto für eine App konfigurieren können und vieles mehr.
+
+
+
+
+
+
+
+ Marktplatz unitity Bibliothek
+
+
+
+ Damit Sie mit dem Firefox-Markt arbeiten können, bieten wir zu erleichterung eine JavaScript-Bibliothek an um eine ihnen Anwendungen einfach handhaben in-app-Zahlungen und Zahlungseingänge überprüfen zu können.
+
+
+
+ Überprüfungs API
+
+
+
+ Mit der API-Vorlage können Sie Ihre app überprüfen, aktualisieren Ihre app und holen Informationen über die apps verfügbar installiert werden.
+
+
+
+ Zahlungs API
+
+
+
+ Mit  API-Zahlung können Sie Informationen zu in-app Einkäufe machen und erhalten Informationen über die Preisgestaltung Stufen für verschiedene Länder.
+
+
+
+ Andere Marktplatz APIs
+
+
+
+ Die vollständige Dokumentation für die Firefox-Marktplatz-APIs.
+
+
+
+
+
+
+
+ Tools für app-Entwickler
+
+ +
+
+ Technologie-Referenzdokumentation
+
+
+ +
+
+
+ Hilfe von der Gemeinschaft
+
+
+
+ Wenn Sie noch nicht sicher sind was zu tun ist, was Sie erledigen wollen, zögern Sie nicht zu der Unterhaltung!
+
+  
+
+ +

Vergessen Sie nicht über die netiquette...

+

 

+
+
+

 

diff --git a/files/de/archive/mozilla/marketplace/options/open_web_apps_for_android/index.html b/files/de/archive/mozilla/marketplace/options/open_web_apps_for_android/index.html new file mode 100644 index 0000000000..76a5dc98c8 --- /dev/null +++ b/files/de/archive/mozilla/marketplace/options/open_web_apps_for_android/index.html @@ -0,0 +1,142 @@ +--- +title: Open Web Apps for Android +slug: Archive/Mozilla/Marketplace/Options/Open_web_apps_for_android +translation_of: Archive/Marketplace/Options/Open_web_apps_for_android +--- +
+

Users of Firefox for Android install Marketplace apps as 'normal' Android apps, gaining the benefit of powerful open web features. This ability is enabled by the creation of APKs by the APK Factory. Installed apps are run by the Web Runtime for Android, which is included in Firefox for Android. By making your apps accessible to Firefox for Android users, you gain an additional distribution opportunity, expanding the potential audience for your work.

+
+

What is Open Web Apps for Android?

+

Open Web Apps for Android enables free Marketplace apps to be packaged into an APK (Android installation package), which is then installed and run in the same way as any other Android app. The APK package consists of web content (in the case of packaged apps) or a pointer to web content (in the case of hosted apps). This content is then enclosed in a thin Java/Android wrapper, which provides the integration with the Android OS. Once installed on an Android device the app is executed by Web Runtime for Android, a component of Firefox for Android.

+

These packages are created by the APK Factory Service, which is run as a web service by Marketplace. The APK Factory Service makes use of the APK Factory Library to create the actual package and the APK Signer to digitally sign the APK. This service is available to your own Marketplace, should you choose to create one.

+

You don't need any knowledge of Android development, or to take any extra development steps, to use Open Web Apps for Android: you simply select the option for distribution to Firefox Mobile or Firefox Tablet when submitting your apps to the Firefox Marketplace.

+
+

Note: Open Web Apps for Android provides support for hosted apps in Firefox for Android xx or later, packaged apps are supported in Firefox for Android 29 or later. Only free apps are available for Android from the Firefox Marketplace at this time.

+
+

Web Runtime for Android supports 12 APIs to access device capabilities, such as vibration, geolocation and battery status. You can see a complete list of supported APIs here: APIs showing "A" under "Availability" are those APIs available on Android, with green cells indicating that the API is available in full. You can also mouseover individual cells to get tooltips containing more information.

+

Web Runtime for Android will continue to add support for other APIs in future releases. Some of the APIs planned are:

+ +
+

Note: Android users may be using devices with higher resolutions, greater pixel densities (DPI) and larger screen sizes than those found on Firefox OS devices. Apps that haven't used responsive design may therefore provide a poor experience, and you may want to design your apps with this in mind. For more information on responsive design see the Design section of the App Center.

+
+

Using Open Web Apps for Android from Firefox Marketplace

+

This section provides details on how you make use of Open Web Apps for Android from Firefox Marketplace, how they affect the Marketplace experience, and information on app updates.

+

Submitting an app

+

When you submit an app to the Firefox Marketplace, you choose the option of making your app available for Firefox Mobile or Firefox Tablet. Choosing either or both of these options will automatically deliver your app as an APK on Android devices.

+

Approving an app

+

When your app is reviewed, the reviewer installs your app from the reviewer section in Firefox Marketplace. When they do this from an Android device, the "review" instance of the APK Factory service is invoked to create an APK signed in Android debug mode. This version of the APK is then installed on the app reviewer's device and they complete the review process.

+

If the app is approved, the "release" instance of the APK Factory service is invoked to generate and sign the APK with a unique APK Signing Key. The resulting signed APK is then cached for delivery when a user chooses to install the app.

+

Installing an app

+

When a user selects your app in the Marketplace on their Android device, installation works as follows:

+
    +
  1. Firefox Marketplace displays the app's details and Free install button as normal.
    2. +
  2. When the user taps Free, {{ domxref("Apps.install") }} or {{ domxref("Apps.installPackage") }} is invoked as usual (depending on whether it's a hosted or packaged app) and a call is made to the APK Factory service to request the APK.
    3. +
  3. The APK is downloaded to the Android device and the standard Android app installation process invoked.
    4. +
  4. If the user hasn't enabled the Security setting Unknown sources, Android will alert the user and give them the option to cancel the installation or open Settings.
    5. +
  5. Once Unknown sources is enabled, the user is shown an install confirmation dialog. The dialog lists the permissions requested by privileged apps.
    6. +
  6. If the user taps Install the app is installed.
    7. +
  7. Once the app has been installed, the user is given the option to Open the app and in Firefox Marketplace the Free button is replaced with a Launch button.
    8. +
+

Subsequently the user will find the application in their Apps screen. In addition, the process to use and remove the app is the same as they'd expect for other Android apps. Firefox for Android provides a list of installed apps under Apps on the Tools menu as well.

+

Keeping apps up to date

+

Firefox for Android provides a mechanism installing update apps.

+

If your app is hosted, whenever you make a change on its server, users will pick up changes the next time they run your app.

+

For all other changes, you need to add a new version to the Firefox Marketplace:

+ +

Firefox for Android makes a daily check on the version number in the app’s manifest and if it has changed silently applies the update.

+

Using Open Web Apps for Android from your own Marketplace

+

You're able to create your own Marketplace. Such a Marketplace consists of either a directory of apps in Firefox Marketplace or your own hosted content (app descriptions with the main manifest of hosted apps or the mini manifest with app zip archive in the case of packaged apps).

+

Your Marketplace will pass the URL of the manifest to be installed to {{ domxref("Apps.install") }} / {{ domxref("Apps.installPackage") }} that then invokes APK Factory, meaning you don't have to do anything to enable Open Web Apps for Android in your Marketplace. You do however need to ensure that your Marketplace only serves apps that include APIs supported by the Web Runtime for Android.

+

How the APK Factory works

+

This section describes how the APK Factory works.

+ +

The following diagrams offer an alternative representation of the workflow of the APK Factory:

+

Web Sequence diagram showing the operation of the APK factory

+

Package naming and APK signing keys

+

On installation of an APK the Android device checks the Java package name and signature. It verifies the signature the first time an app is installed (there is no central authority it checks with). Future updates must then have the same package name and signature. If the package name and signature aren't the same the Android device won't update the installation.

+

Package naming

+

The package name for an APK consists of the hosting site and a unique serial number, for example:

+ +

APK signing keys

+

Each APK needs to be identified by an APK signing key before it can be installed on an Android device. APK signing keys are created and owned by the APK Signer service. These signing keys are sensitive, and stored securely in the APK Signer.

+

This service creates a unique key for each app, applying it to the original release and subsequent updates. The reuse of the key on updated app APKs is important, as without a match in the package name and key Android won't install an update over an earlier version of the app. If you create your own Marketplace the APK will retain the same name and keys, so that either version will be able to update the other.

+
+

Note: Mozilla assumes no responsibility for the credibility of the APK signing keys. That is, the keys provide no information about the authenticity of the app or developer beyond the fact that they have been approved for release in Marketplace, if the app is hosted there. The service is not tied to Google or any other central authority.

+
+

FAQ

+

Here are answers to some frequently asked questions about APKs for Open Web Apps for Android.

+

What about re-installation of apps installed as bookmarks?

+

When a user updates to Firefox for Android version 29 or later, their bookmark-style apps will continue to work, and Firefox will prompt users to update apps to their Open Web Apps for Android version.

+

How will in-app purchases work?

+

The APK is given access to the trusted UI, mozPay, and all payment processes for in-app purchases, so in-app payments will function as normal.

+

How do I download a copy of my app's APK?

+

You can download a copy of your app from the APK Factory service by retrieving a URL in the format:

+

https://controller.apk.firefox.com/application.apk?manifestUrl=ESCAPED_URL_TO_MANIFEST

+

where ESCAPED_URL_TO_MANIFEST is an escaped URL to the app's manifest or mini-manifest. That URL causes the APK Factory to return the cached copy of the APK, or create a new one if the app hasn't been submitted to Marketplace.

+

Examples

+

For a hosted app:

+

> wget https://controller.apk.firefox.com/application.apk?manifestUrl=http%3A%2F%2Fmykzilla.org%2Fapp%2Fmanifest.webapp -O mykzilla.apk

+

For a packaged app:

+

> wget https://controller.apk.firefox.com/application.apk?manifestUrl=https%3A%2F%2Fmarketplace.firefox.com%2Fapp%2Fa22e0277-35bc-434d-9371-1568c75fc726%2Fmanifest.webapp -O cuttherope.apk
+  

+

Can I generate an APK manually from a different URL?

+

Yes, by providing the URL to any location for your manifest or mini-manifest files. However, be aware that because the APK is generated from a different URL the package name will differ from that created when you submit the app to Firefox Marketplace, so the Firefox Marketplace version will be installed as a separate app.

+

If I setup my own copy of the APK Factory can I use the APKs it generates?

+

You can, but be aware that the signing keys will differ from those assigned to the APKs generated by Firefox Marketplace. As a result Android will refuse to install whichever version the user tries to install second. (See If I also have an Android native version of my app, can both be installed on an Android device? for more information.)

+

Can I submit an APK created by the APK Factory to Google Play or other Android store?

+

You can submit an APK generated by APK Factory to Google Play or an alternative Android store. However, it's your responsibility to:

+ +

Can I use my Android signing keys to sign the APK and choose the package name?

+

At present you cannot use your own signing keys to sign an APK generated by APK Factory or choose the package name. This is an option being considered. If this is of interest to you, join the discussion on the dev-marketplace mailing list, or the Marketplace IRC channel.

+

If I also have an Android native version of my app, can both be installed on an Android device?

+

Unless you choose to use the APK package name created by APK Factory for your native Android app, both can be installed on an Android device. If you choose to use the same package name for your native Android app (which you'll sign with your own key) Android will refuse to install whichever version the user tries to install second. This is because the package names are the same but the signing keys are different, so Android considers the apps to be the same, but from different sources. Therefore Android will refuse to update one app with the other, since that would allow one developer to override another's app. The user will end up with the first version installed on their device.

+
+

Because of the issues it may cause for users, it's highly recommended that you don't reuse the package name the APK Factory assigns to your app for a native Android version of your app.

+
+

How can I test/debug APKs?

+

We're working on a toolchain for testing and debugging an app on an Android device. The initial version will include a Node-based command-line tool for generating an APK you can install on the device and debug using Firefox's Remote Developer Tools.

+

Also see

+ diff --git a/files/de/archive/mozilla/marketplace/publishing/index.html b/files/de/archive/mozilla/marketplace/publishing/index.html new file mode 100644 index 0000000000..d219377947 --- /dev/null +++ b/files/de/archive/mozilla/marketplace/publishing/index.html @@ -0,0 +1,6 @@ +--- +title: Publishing +slug: Archive/Mozilla/Marketplace/Publishing +translation_of: Archive/Mozilla/Marketplace/Publishing/Introduction +--- +

Marketplace publishing

diff --git a/files/de/archive/mozilla/marketplace/publishing/packaged_apps/index.html b/files/de/archive/mozilla/marketplace/publishing/packaged_apps/index.html new file mode 100644 index 0000000000..3ba4548eba --- /dev/null +++ b/files/de/archive/mozilla/marketplace/publishing/packaged_apps/index.html @@ -0,0 +1,184 @@ +--- +title: Gepackte Apps +slug: Archive/Mozilla/Marketplace/Publishing/Packaged_apps +translation_of: Archive/Mozilla/Marketplace/Options/Packaged_apps +--- +

Eine gepackte App ist eine Offene Web App die all ihre Ressourcen (HTML, CSS, JavaScript, app mainfest und so weiter) komprimiert in einer zip Datei hat, anstatt die Dateien auf einem Webserver zu hosten. EIne gepackte App ist einfach einezip Datei, welche die App Mainfest in dem Hauptverzeichniss trägt. Die App Mainfest muss den Namen manifest.webapp tragen.

+

Einer der unterschiede zu einer gehosteten App ist, dass eine gepackte App den launch_path in der Mainfest eingetragen haben muss. Dennoch ist es optional den Pfad auch in einer gehosteten App einzutragen.

+
+

Anmerkung: Der Firefox Marktplatz unterstützt momentan nur gepackte App´s für Firefox OS.

+
+

Zweck einer gepackten App

+

Der Zweck einer gepackten App ist, das man einen verarbeitbaren Weg hat, um Zugriff auf die sensitiven API´s der Geräte zu haben. Die App muss von dem Store (Wie der Firefox Marktplatz), von dem die App´s verteilt werden geprüft werden. Der Store prüft die App, sobald diese für akzeptabel befunden wird, wird die App kryptographisch mit einem privatem Schlüssel versehen. Das gebit den Verbrauchern der App mehr Sicherheit, dass die App sorgsam auf Sicherheit, Datenschutz und Leistungsfähigkeit geprüft wurde.

+

 

+

Typen einer gepackten App

+

Es gibt 3 Typen einer gepackten App:

+
+
+ Privilegierte App
+
+ Eine privilegierte App wurde durch ein spezielles Verfahren von dem Firefox Marktplatz genehmigt. Dadurch soll mehr Sicherheit für den Benutzer gewährleistet werden, wenn eine App spezielle sensitiven APIs des Gerätes benutzen möchte. Es ist mit nativen Apps auf Plattformen wie iOS oder Android zu vergleichen. Um eine App als privilegierte App zu kennzeichnen muss das type Feld in der der Datei manifest.webapp auf privileged gesetzt werden.
+
+ Eine priviligierte App hat folgende Eigenschaften: +
    +
  • Freigegeben durch einen App Store nach einem Code Review oder einer vergleichbraen Prüfung.
    • +
  • Alle resourcen einer App's werden durch den App Store signiert.
    • +
  • Zugriff auf spezielle, sensible Web APIs, auf die nicht vertrauenswürdiger Inhalt nicht zugreifen darf.
    • +
  • Erzwingt eine sogenannte Content Security Policy (CSP). Eine privilegierte App benutz folgende CSP: + 
    "default-src *; script-src 'self'; object-src 'none'; style-src 'self' 'unsafe-inline'"
    +
    • +
  • Implementiert weitere Anforderungen an die Sicherheit. Siehe Security für mehr Informationen.
    • +
+
+
+ Zertifizierte App
+
+ Ein zertifiziertes App ist für einen kritischen Systemfunktion wie die Standard Dialer oder die Systemeinstellungen App auf einem Smartphone gedacht. Diese Art von App könnte für kritische Funktionen auf einem Firefox OS Phone verwendet werden . Es ist nicht für Anwendungen von Drittanbietern vorgesehen, so dass die meisten App nich mit anderen Apps funktionieren . Ein zertifiziertes App ist eine verpackte App, die ähnlich einer privilegierten App ist, mit der Ausnahme, dass alle Geräteberechtigungen implizit sind, das heißt, sie ist ohne ausdrückliche Genehmigung durch den Benutzer aktiviert sind. Ein zertifiziertes App muss für ein Gerät genehmigen vom OEM oder Träger, um diese implizite Zustimmung zu kritischen APIs verwenden zu können . Um anzugeben, dass dies eine zertifizierter App ist, fügen Sie den Feldtyp type auf seine manifest.webapp -Datei und legen Sie es auf zertifiziert.
+
+ Das folgende ist die CSP für eine zertifizierte App, die geringfügig von der CSP für eine privilegierte App abweicht: + 
"default-src *; script-src 'self'; object-src 'none'; style-src 'self'"
+ Dies hat den Effekt von etwas lockerere Regeln für die Inline-CSP für privilegierte Apps im Vergleich zu zertifizierten Apps. Wenn Sie mehr von der Überlegung dahinter möchten, finden Sie unter Standard Default CSP policy und Bug 768029.
+
+ Plain packaged app
+
+ You can also make a regular app that is simply packaged in a zip file. The Marketplace signs it, but does not perform the special authentication process used for privileged or certified apps. This plain packaged app cannot use certain sensitive Web APIs. It is not subject to the CSPs described for privileged and certified apps. This type of app could be useful if you want all of your app's resources available on the device when the user first uses it, with no downloading. This type of packaged app does not require the type field in its manifest.webapp file, because the default value for type (web) is correct.
+
+

Using sensitive Web APIs

+

There are Web APIs that could be used maliciously, so access to them must be controlled. For every sensitive API you want your app to access, you must add an entry to the permissions field in the app's manifest.

+

Some sensitive APIs can be accessed by normal hosted apps, but other APIs require that you use a packaged app (privileged or certified). See App permissions for a table that describes the requirements.

+

Packaged apps and the Firefox Marketplace

+

The Firefox Marketplace handles packaged apps differently from hosted apps. When you submit your packaged app, its zip file is stored on the Marketplace servers, and the Marketplace generates a new manifest called the "mini-manifest" that is based on the app manifest in your packaged app's zip file. When a user installs your app, the mini-manifest is passed to the installPackage() function to install the app. The mini-manifest exists for installation and update purposes and is not used when your app runs.

+

Testing packaged app installation

+

To install a packaged app on a Firefox OS device using the Simulator for testing purposes, see the section on "Push to Device" in the Simulator guide. To test a packaged app without the Simulator, you can install it on a device from a regular web server by following the steps below, in the Self-publishing packaged apps section.

+

Self-publishing packaged apps

+

You can self-publish a packaged app by hosting it on a server along with a mini-manifest in the same directory that identifies the app and is used in the install process. This section covers how to do this detail.

+

Note that you can also host a packaged app locally and test it on a real device. The Web server and the phone must be on the same network, and the server must be able to serve requests from the local network. You just need to include the absolute path to the referenced files, in the same way as the absolute paths are included normally (see below.) Remember to include the port information if you are using a non-standard port, for example http://10.10.12.1:8080/package.zip.

+

Steps

+
    +
  1. +

    Zip up your app's contents and give it the name package.zip. This file should contain all the app's resource files, including the manifest.

    +
    +

    Caution: You must be also careful to zip the contents you wish to appear in the packaged app, and not the directory they are contained in. If you zip up the parent directory, the manifest will end up in the wrong place, and the packaged app will be invalid.

    +
    +
    2. +
  2. Create a file called package.manifest and give it the contents below. This is a mini-manifest used for packaged app installation purposes. It is not the main manifest of your app that is inside the zip file. See Mini-manifest fields if you want more detailed information about mini-manifests. + 
    {
+    "name": "My sample app",
+    "package_path" : "http://my-server.com/my-app-directory/my-app.zip",
+    "version": "1",
+    "developer": {
+        "name": "Chris Mills",
+        "url": "http://my-server.com"
+    }
+}
    +
    3. +
  3. Create a file named index.html with the following contents. This contains sample JavaScript that calls the packaged app (installPackage()) and callbacks for success and failure notification. + 
    <html>
+  <body>
+    <p>Packaged app installation page</p>
+    <script>
+      // This URL must be a full url.
+      var manifestUrl = 'http://my-server.com/my-app-directory/package.manifest';
+      var req = navigator.mozApps.installPackage(manifestUrl);
+      req.onsuccess = function() {
+        alert(this.result.origin);
+      };
+      req.onerror = function() {
+        alert(this.error.name);
+      };
+    </script>
+  </body>
+</html>
    +
    4. +
  4. Copy package.zip, package.manifest, and index.html into your app root directory (my-app-directory in my examples).
    5. +
  5. Using a compatible device (such as a Firefox OS phone), navigate to the location on your server where you put the example files and confirm the prompt to install the app. The script will give an indication of installation success or failure.
    6. +
+
+

Note: You can not install privileged or certified apps with installations from hosted packages, as they need to be signed. Use the Simulator to test privileged apps.

+
+

Mini-manifest fields

+

Here is a more in-depth example of a mini-manifest:

+
{
+  "name": "My app",
+  "package_path": "http://thisdomaindoesnotexist.org/myapp.zip",
+  "version": "1.0",
+  "size": 172496,
+  "release_notes": "First release",
+  "developer": {
+    "name": "Developer Name",
+    "url": "http://thisdomaindoesnotexist.org/"
+  },
+  "locales": {
+    "fr-FR": {
+      "name": "Mon application"
+    },
+    "se-SE": {
+      "name": "Min balla app"
+    }
+  },
+  "icons": {
+    "16": "/icons/16.png",
+    "32": "/icons/32.png",
+    "256": "/icons/256.png"
+  }
+}
+
+

When the Firefox Marketplace generates a mini-manifest for your app, it pulls information from your app's manifest for some of the fields. You can find documentation for these fields at App manifest. The fields unique to the mini-manifest are package_path, release_notes, and size. The name, version, developer, and locales fields in your app manifest must be exactly the same as in your mini-manifest.

+

Here is information on the mini-manifest that relates to using it locally for your own testing:

+
+
+ name
+
+ (required) The app's name. Maximum length is 128 characters.
+
+ package_path
+
+ (required) The URL where the app's zip file can be found. You need to make sure the package_path is absolute to where the ZIP file is located.
+
+ version
+
+ The version of the app.
+
+ size
+
+ The size of the app's zip file in bytes. This is not necessary for local testing, but provide it to get a progressbar during installation.
+
+ release_notes
+
+ Information about this release of the app. On the Marketplace this information comes from a Web page that is part of the submission process.
+
+ developer
+
+ Information about the developer, contains the name and url fields. The developer info needs to match between the mini-manifest and the main manifest file in the ZIP.
+
+ locales
+
+ Localization information. Keys should be in xx-YY format.
+
+ icons
+
+ Icons for use by the app.
+
+
+

Note: Values in package and webapp.manifest need to be the same, otherwise installation will fail. The safest way is to copy manifest.webapp into package.manifest and just add the package_path.

+
+

Differences from hosted apps

+

Packaged apps have the same capabilites as normal website-style Open Web Apps ("hosted" apps), but packaged apps have a few differences:

+ +

The packaged app can still do things like access a database on a Web server, like a regular hosted app.

+

Updating packaged apps

+

For information on updating apps, see Updating apps.

+

Packaged app example

+

Firefox OS Boilerplate App

diff --git a/files/de/archive/mozilla/marketplace/publishing/publish_options/index.html b/files/de/archive/mozilla/marketplace/publishing/publish_options/index.html new file mode 100644 index 0000000000..63d97f6016 --- /dev/null +++ b/files/de/archive/mozilla/marketplace/publishing/publish_options/index.html @@ -0,0 +1,67 @@ +--- +title: Veröffentlichungsoptionen Ihrer App +slug: Archive/Mozilla/Marketplace/Publishing/Publish_options +translation_of: Archive/Mozilla/Marketplace/Options/Self_publishing +--- +
+

Once you have finished your app, you need to deploy it and publish it. This involves making it available for users to consume (whether they are going to just navigate to it in a browser and use it like a regular web page, or download it and install it on a device like a Firefox OS phone.), letting people know it is available, and providing supporting information such as usage instructions and help resources. This article looks briefly at the options available to you.

+
+

Publishing on the Firefox Marketplace

+

The Firefox Marketplace is our own dedicated app store for distributing free and paid apps. Submitting an app to the Firefox Marketplace is a simple process, involving uploading the app itself plus surrounding information, and waiting for it to go through our thorough review process to make sure it is high quality and not malicious. Submitting to the Firefox Marketplace also confers other advantages such as increased publicity, no need to implement special APIs on your own web site, and the possibility of publishing paid apps more easily. You can submit both hosted apps and packaged apps to the Firefox Marketplace.

+

Hosted apps

+

A hosted app is basically an app hosted on a web server just like a regular web page. If you want to let people install a hosted app straight from the site, you must implement some JavaScript code on your Web site to manage installing and updating your app into users' browsers, and make sure your app code includes a valid manifest file. Please see our writeups of manifest files and Install API functionality for how simple these steps are to implement.

+

Where you host the app is really up to you, but the two options listed below are probably the most common and easiest.

+

GitHub

+

If the Web app is purely static (HTML/CSS/JavaScript, but no server-side processing), GitHub Pages is a solid hosting option. It will serve your manifest with the correct MIME type if you give it a .webapp extension.

+

Generic hosting solutions

+

For dynamic websites, use a generic hosting option (like a Web server you may already own or have access to) with the right capabilities or a hosting provider specifically tailored to the needs of your app, like Heroku or Google App Engine.

+
+

Note: Installable open web apps have a "single app per origin" security policy; basically, you can't host more than one installable app per origin. This makes testing a bit more tricky, but there are still ways around this, such as creating different sub-domains for apps, testing them using the Firefox OS Simulator, or testing the install functionality on Firefox Aurora/Nightly, which allow installable web apps to install on the desktop. See FAQs about apps manifests for more information on origins.

+
+

Packaged apps

+

A packaged app is an Open Web App that has all of its resources (HTML, CSS, JavaScript, app manifest, and so on) contained in a zip file, instead of having its resources on a Web server. A packaged app is simply a zip file with the app manifest in its root directory. The manifest must be named manifest.webapp.

+

One difference from a hosted app is that a packaged app must specify a launch_path in the manifest, whereas it's an optional manifest field for a hosted app. For more information, check out our Packaged Apps article.

+

Self-publishing apps

+

You can also choose to self-publish apps. For hosted apps, this just involves putting them up on web hosting, as detailed above.

+

You can self-publish a packaged app by hosting it on a server along with a mini-manifest in the same directory that identifies the app and is used in the install process. Let's run through this process:

+
    +
  1. Have your packaged app's zip file available and give it the name package.zip. This file contains all the app's resource files, including the manifest.
    2. +
  2. Create a file called package.manifest and give it the contents below. This is a mini-manifest used for packaged app installation purposes. It is not the main manifest of your app that is inside the zip file.
    + 
    {
+    "name": "My sample app",
+    "package_path" : "http://my-server.com/my-app-directory/my-app.zip",
+    "version": "1",
+    "developer": {
+        "name": "Chris Mills",
+        "url": "http://my-server.com"
+    }
+}
    +
    3. +
  3. Create a file named index.html with the following contents. This contains sample JavaScript that calls the packaged app (installPackage()) and callbacks for success and failure notification. + 
    <html>
+  <body>
+    <p>Packaged app installation page</p>
+    <script>
+      // This URL must be a full url.
+      var manifestUrl = 'http://my-server.com/my-app-directory/package.manifest';
+      var req = navigator.mozApps.installPackage(manifestUrl);
+      req.onsuccess = function() {
+        alert(this.result.origin);
+      };
+      req.onerror = function() {
+        alert(this.error.name);
+      };
+    </script>
+  </body>
+</html>
    +
    4. +
  4. Copy package.zip, package.manifest, and index.html into your app root directory (my-app-directory in my examples).
    5. +
  5. Using a compatible device (such as a Firefox OS phone), navigate to the location on your server where you put the example files and confirm the prompt to install the app. The script will give an indication of installation success or failure.
    6. +
+
+

Note: You can't install privileged or certified apps from self-hosted packages, as they need to be signed via the Firefox Marketplace submission process.

+
+
+

Note: You can even create your own apps store, which has a number of options available to it.

+
+

 

diff --git a/files/de/archive/mozilla/marketplace/publishing/submit/index.html b/files/de/archive/mozilla/marketplace/publishing/submit/index.html new file mode 100644 index 0000000000..a6e3468169 --- /dev/null +++ b/files/de/archive/mozilla/marketplace/publishing/submit/index.html @@ -0,0 +1,10 @@ +--- +title: Submit +slug: Archive/Mozilla/Marketplace/Publishing/Submit +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive/Mozilla/Marketplace/Publishing/Submit +--- +

This section describes the process for submitting an app to Firefox Marketplace

+

Residual details: https://developer.mozilla.org/en-US/Marketplace/Publishing/Submit/Submitting_an_app

diff --git a/files/de/archive/mozilla/marketplace/publishing/updating_apps/index.html b/files/de/archive/mozilla/marketplace/publishing/updating_apps/index.html new file mode 100644 index 0000000000..5fc08ff26a --- /dev/null +++ b/files/de/archive/mozilla/marketplace/publishing/updating_apps/index.html @@ -0,0 +1,27 @@ +--- +title: Updating apps +slug: Archive/Mozilla/Marketplace/Publishing/Updating_apps +translation_of: Archive/Mozilla/Marketplace/Publishing/Updating_apps +--- +
+

Dieser Artikel beschreibt den Prozess, mit dem Sie apps aktualisieren können, die bereits, Selbstveröffentlicht oder veröffentlicht auf dem   Firefox Marketplace  wurden.

+
+
+

Hinweis: Wenn Sie den Namen Ihrer Anwendung ändern, wenn es Marketplace genehmigt hat, müssen Sie Ihre app zur Genemigung erneut senden.

+
+

Gehostete apps zu aktualisieren

+

An app respects the normal rules for Web caching, and may optionally use advanced mechanisms for improved start-up, like the HTML5 AppCache. Given this, there are no special considerations for updating the normal resources that an app uses.

+

Open Web Apps are different, however, in the handling of the manifest. Some changes to a manifest may require user approval. Depending on the implementation of the Web runtime, it may be unclear whether an update has occurred.

+

As a clean way to deal with this issue, you can provide a version field in the app manifest. You can later check the version by inspecting the return value of the navigator.mozApps.getInstalled() function. If the user's installed version is not up-to-date, you can trigger an update using navigator.mozApps.install().

+

The value of version is not used by the Web runtime, so you can use whatever versioning scheme you want.

+

Also note that changes to a manifest that introduce errors or other breakage will be detected if the manifest has been submitted to Firefox Marketplace. Serious errors will cause the app's listing to be disabled. Less serious errors may automatically flag the app for re-review.

+

Updating packaged apps

+

Packaged apps have a different update process than hosted apps. To update a packaged app, you upload a new version of the app's zip file to the Firefox Marketplace. Then the updated app gets reviewed and published to the Marketplace. This triggers an update on the Firefox OS phone. The phone user can also request an update using the Settings app.

+

If you want more detail on the packaged app update process, see below.

+

More details on packaged app update

+

Here are more details on the update process for packaged apps. You might want to know these things if you are implementing an app marketplace.

+ diff --git a/files/de/archive/mozilla/marketplace/submission/index.html b/files/de/archive/mozilla/marketplace/submission/index.html new file mode 100644 index 0000000000..5f1479f109 --- /dev/null +++ b/files/de/archive/mozilla/marketplace/submission/index.html @@ -0,0 +1,9 @@ +--- +title: Submission +slug: Archive/Mozilla/Marketplace/Submission +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive/Mozilla/Marketplace/Submission +--- +

Marketplace Vorlage

diff --git a/files/de/archive/mozilla/marketplace/submission/marketplace_review_criteria/index.html b/files/de/archive/mozilla/marketplace/submission/marketplace_review_criteria/index.html new file mode 100644 index 0000000000..8582aaccbc --- /dev/null +++ b/files/de/archive/mozilla/marketplace/submission/marketplace_review_criteria/index.html @@ -0,0 +1,79 @@ +--- +title: Überprüfungskriterien für Marketplace +slug: Archive/Mozilla/Marketplace/Submission/Marketplace_review_criteria +translation_of: Archive/Mozilla/Marketplace/Publishing/Marketplace_review_criteria +--- +
+

Dieser Artikel beschreibt die Anforderungen, die eine App erfüllen muss, um über den Firefox Marketplace verteilt zu werden. Diese Anforderungen sind dazu da, ein Gleichgewicht zwischen den Bedürfnissen der Entwickler und der Anwender von Apps aus dem Firefox Marketplace herzustellen. Entwickler möchten faire, einheitliche, nicht übermäßig strenge Anforderungen, auf denen sie verlässlich ihre Arbeit aufbauen können. Andererseits möchten Anwender die Gewissheit, dass Apps sicher sind, auf ihren Geräten funktionieren und tun, was sie zu tun angeben. Die folgenden App-Anforderungen versuchen, auf dem schmalen Grat zwischen diesen Anforderungen zu gehen.

+
+

Dies sind Mozillas Erwartungen daran, was eine App-Überprüfung ist und nicht ist:

+ +

Sicherheit

+

Die Einzelheiten der Sicherheitsarchitektur für Apps finden Sie hier: https://wiki.mozilla.org/Apps/Security

+ +

Datenschutz

+ +

Inhalt

+ +

Richtlinien für Inhalte

+

Diese Liste beschreibt Typen von Inhalten, die nicht in den Firefox Marketplace passen. Diese Liste ist beispielhaft, nicht abschließend und kann aktualisiert werden. Wenn eine App diese Richtlinien verletzt, darf Mozilla die App umgehend aus dem Firefox Marketplace entfernen.

+ +

Funktionalität

+ +

Bedienerfreundlichkeit

+ +

Sperrlisten-Richtlinie

+

Wir hoffen, diese Funktion niemals nutzen zu müssen, aber wir behalten uns vor, freigegebene Apps zu entfernen („blocklist“) bei denen wir im Laufe der Zeit feststellen, dass sie eine der Sicherheits-, Datenschutz- oder Inhalts-Richtlinien verletzt sowie Apps, die die System- oder Netzwerkleistung stark einschränken. Entwickler werden informiert, bevor die Sperre in Kraft tritt. Solange wir keine Beweise für das Gegenteil haben, gehen wir davon aus, dass Entwickler anständig sind und sie erhalten Unterstützung des Überprüfer-Teams zur Aufklärung und Behebung des Problems. Konkrete Beispiele, für Situationen, in denen wir uns eine Sperre vorbehalten, beinhalten:

+ diff --git "a/files/de/archive/mozilla/marketplace/ver\303\266ffentlichen/index.html" "b/files/de/archive/mozilla/marketplace/ver\303\266ffentlichen/index.html" new file mode 100644 index 0000000000..3c94ca1182 --- /dev/null +++ "b/files/de/archive/mozilla/marketplace/ver\303\266ffentlichen/index.html" @@ -0,0 +1,106 @@ +--- +title: Veröffentlichen auf dem Firefox Marketplace +slug: Archive/Mozilla/Marketplace/Veröffentlichen +translation_of: Archive/Mozilla/Marketplace/Publish +--- +
+

Dokumentation für das Veröffentlichen einer app auf dem Firefox Marketplace.

+
+
+
+
+
+ App testen und Problembehandlung
+
+
+
+ Ein leichtes Handbuch zur überprüfung und Problembehandlung , bevor Sie Ihre app auf den Firefox-Marktplace einreichen.
+
+
+
+ Senden einer app auf dem Firefox Marketplace
+
+
+
+ Dieser Leitfaden hilft Ihnen erfolgreich Ihre Anwendung auf den Firefox-Marktplace einzureichen.
+
+
+
+ Marketplace Prüfkriterien
+
+
+
+ Eine Erläuterung der Kriterien die eine app erfüllen muss um auf dem Firefox-Marktplatz veröffentlicht zu werden; Befolgen Sie die Richtlinien wie in diesem Artikel dargelegt.
+
+
+
+ Marketplace screenshot Kriterien
+
+
+
+ Richtlinien für die Screenshots um mit Ihrer app die Auswirkungen und die Qualität auf dem Markt zu maximieren.
+
+
+
+
+
+
+
+
+ Tools für app-Entwickler
+
+ +
+
+ Technologie-Referenzdokumentation
+
+
+ +
+
+
+ Hilfe von der Gemeinschaft
+
+
+
+ Wenn Sie noch nicht sicher sind was zu tun ist, was Sie erledigen wollen, zögern Sie nicht zu der Unterhaltung!
+
+  
+
+ +

Vergessen Sie nicht über die netiquette...

+

 

+
+
+
+

 

diff --git a/files/de/archive/mozilla/xul/action/index.html b/files/de/archive/mozilla/xul/action/index.html new file mode 100644 index 0000000000..5492305611 --- /dev/null +++ b/files/de/archive/mozilla/xul/action/index.html @@ -0,0 +1,86 @@ +--- +title: action +slug: Archive/Mozilla/XUL/action +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/action +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Das action Element wird verwendet, um den Inhalt festzulegen, welcher für jedes zutreffende Ergebnis einer Abfrage passt. Dieses Element sollte in den Elementen query oder rule enthalten sein.

+

Für weitere Informationen, siehe Aktionen.

+

Beispiele

+

(Beispiel benötigt)

+

Attribute

+ + + + + + +

Geerbt von XUL-Element
+align, +allowevents, +allownegativeassertions, +class, +coalesceduplicatearcs, +collapsed, +container, +containment, +context, +contextmenu, +datasources, +dir, +empty, +equalsize, +flags, +flex, +height, +hidden, +id, +insertafter, +insertbefore, +left, +maxheight, +maxwidth, +menu, +minheight, +minwidth, +mousethrough, +observes, +ordinal, +orient, +pack, +persist, +popup, +position, +preference-editable, +querytype, +ref, +removeelement, +sortDirection, +sortResource, +sortResource2, +statustext, +style, +template, +tooltip, +tooltiptext, +top, +uri, +wait-cursor, +width

+
+

Eigenschaften

+ +

Geerbte Eigenschaften
align, , allowEvents, , boxObject, builder, , , , className, , , , , collapsed, contextMenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxHeight, maxWidth, menu, minHeight, minWidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statusText, style, ,, tooltip, tooltipText, top, width
+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
diff --git a/files/de/archive/mozilla/xul/arrowscrollbox/index.html b/files/de/archive/mozilla/xul/arrowscrollbox/index.html new file mode 100644 index 0000000000..d1785f82b6 --- /dev/null +++ b/files/de/archive/mozilla/xul/arrowscrollbox/index.html @@ -0,0 +1,134 @@ +--- +title: arrowscrollbox +slug: Archive/Mozilla/XUL/Arrowscrollbox +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/arrowscrollbox +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Eine Box, die entlang den Kanten Scrollpfeile bereitstellt, um die Box zu scrollen. Der Benutzer muss die Maus dazu nur über die Pfeile bewegen. Dieses Element wird typischerweise bei langen Popup-Menüs verwendet.

+

Wenn die Maus über einen (aktiven) Pfeil bewegt wird, wird ein Scroll-Event ausgelöst.

+

Weitere Informationen sind im XUL Tutorial verfügbar.

+
Attribute
disabled, smoothscroll, tabindex
+
+
Eigenschaften
disabled, scrollBoxObject, scrollIncrement, smoothScroll, tabIndex
+
+
Methoden
ensureElementIsVisible, scrollByIndex, scrollByPixels
+
+

Beispiele

+
Image:menuscroll1.jpg
+
<arrowscrollbox orient="vertical" flex="1">
+  <button label="Red"/>
+  <button label="Blue"/>
+  <button label="Green"/>
+  <button label="Yellow"/>
+  <button label="Orange"/>
+  <button label="Silver"/>
+  <button label="Lavender"/>
+  <button label="Gold"/>
+  <button label="Turquoise"/>
+  <button label="Peach"/>
+  <button label="Maroon"/>
+  <button label="Black"/>
+</arrowscrollbox>
+
+

Attribute

+ + + + + + +

Geerbt von XUL-Element
+align, +allowevents, +allownegativeassertions, +class, +coalesceduplicatearcs, +collapsed, +container, +containment, +context, +contextmenu, +datasources, +dir, +empty, +equalsize, +flags, +flex, +height, +hidden, +id, +insertafter, +insertbefore, +left, +maxheight, +maxwidth, +menu, +minheight, +minwidth, +mousethrough, +observes, +ordinal, +orient, +pack, +persist, +popup, +position, +preference-editable, +querytype, +ref, +removeelement, +sortDirection, +sortResource, +sortResource2, +statustext, +style, +template, +tooltip, +tooltiptext, +top, +uri, +wait-cursor, +width

+
+ +
disabled
Typ: boolean
Kennzeichnet, ob ein Element deaktiviert ist oder nicht. Wenn das Element auf  true gesetzt ist, ist das Element deaktiviert. Deaktivierte Elemente sind gewöhnlich mit einem grauen Text dargestellt. Wenn ein Element deaktiviert ist, wird es auf Anwenderaktionen nicht reagieren, es kann den Fokus nicht erlangen und das command Ereignis wird nicht ausgelöst. Das Element wird allerdings noch auf Mausereignisse antworten. Um das Element zu aktivieren, ist es besser das Attribut zu entfernen als es auf den Wert false zu setzen. Um den Wert dieses Attributs mittels JavaScript zu setzen oder abzurufen, sollte besser die disabled Eigenschaft verwendet werden.
+
+ + +
+ +
+
+ smoothscroll
+
+ Type: boolean
+
+ true initially enables smooth scrolling for the corresponding arrowscrollbox, false disables it. Currently, smooth scrolling supports horizontal arrowscrollboxes only.
+
+
+ + +
+
tabindex
+
Type: integer
+
The tab order of the element. The tab order is the order in which the focus is moved when the user presses the "tab" key. Elements with a higher tabindex are later in the tab sequence.
+
+
+

Eigenschaften

+ +

Geerbte Eigenschaften
align, , allowEvents, , boxObject, builder, , , , className, , , , , collapsed, contextMenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxHeight, maxWidth, menu, minHeight, minWidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statusText, style, ,, tooltip, tooltipText, top, width
+

Methoden

+

+

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+ +

TBD

diff --git a/files/de/archive/mozilla/xul/assign/index.html b/files/de/archive/mozilla/xul/assign/index.html new file mode 100644 index 0000000000..a08496f06a --- /dev/null +++ b/files/de/archive/mozilla/xul/assign/index.html @@ -0,0 +1,115 @@ +--- +title: assign +slug: Archive/Mozilla/XUL/Assign +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/assign +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Erstellt eine zusätzliche Variable für XML Templates, deren Wert mittels XPath bestimmt werden kann.

+
Weitere Informationen sind unter XML_Assignments verfügbar.
+
Attribute

expr, var

+
+

Beispiele

+
<vbox datasources="people.xml" ref="*" querytype="xml">
+  <template>
+    <query expr="person">
+      <assign var="?namelength" expr="string-length(@name)"/>
+      <assign var="?siblings" expr="count(../*) - 1"/>
+    </query>
+    <action>
+      <hbox uri="?" align="center">
+        <button label="?name"/>
+        <label value="?gender"/>
+        <label value="?namelength"/>
+        <label value="?siblings"/>
+      </hbox>
+    </action>
+  </template>
+</vbox>
+
+

Attribute

+
+ +
expr
Typ: string
Ein XPath Ausdruck für XML Abfragen, der Ergebnisse zurückliefert. Innerhalb des Ausdrucks kann jeder Namespace Präfix verwendet werden, der für ein Element deklariert wurde.
+
+ +
+ +
var
Typ: string
Dient der Variablenzuweisung innerhalb assign Tags; ansonsten wird es als Referenz zu einer Template Variable wie beispielsweise "?name" verwendet.
+
+ + +
+ + + + + +

Geerbt von XUL-Element
+align, +allowevents, +allownegativeassertions, +class, +coalesceduplicatearcs, +collapsed, +container, +containment, +context, +contextmenu, +datasources, +dir, +empty, +equalsize, +flags, +flex, +height, +hidden, +id, +insertafter, +insertbefore, +left, +maxheight, +maxwidth, +menu, +minheight, +minwidth, +mousethrough, +observes, +ordinal, +orient, +pack, +persist, +popup, +position, +preference-editable, +querytype, +ref, +removeelement, +sortDirection, +sortResource, +sortResource2, +statustext, +style, +template, +tooltip, +tooltiptext, +top, +uri, +wait-cursor, +width

+
+

Eigenschaften

+ +

Geerbte Eigenschaften
align, , allowEvents, , boxObject, builder, , , , className, , , , , collapsed, contextMenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxHeight, maxWidth, menu, minHeight, minWidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statusText, style, ,, tooltip, tooltipText, top, width
+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
diff --git a/files/de/archive/mozilla/xul/attribute/accesskey/index.html b/files/de/archive/mozilla/xul/attribute/accesskey/index.html new file mode 100644 index 0000000000..5f223df6c4 --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/accesskey/index.html @@ -0,0 +1,24 @@ +--- +title: accesskey +slug: Archive/Mozilla/XUL/Attribute/accesskey +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/accesskey +--- +
« XUL-Referenz Startseite
+
accesskey
Attribut von: button, checkbox, caption, description, label, listitem, menu, menuitem, menulist, tab, radio, toolbarbutton, textbox (Firefox autocomplete)
Typ: character
Dem Attribut wird der Buchstabe zugewiesen, der als Tastenkürzel für das Element dienen soll. Dieser Buchstabe sollte sinnvollerweise innerhalb des Textes des Attributs label des Elements vorkommen.
Typischerweise wird dieser Buchstabe visuell durch Unterstreichung hervorgehoben. Dies ist jedoch plattform- und themenspezifisch. Betätigt der Benutzer gleichzeitig die Alt-Taste (oder eine ähnliche Taste; variiert je nach Betriebssystem) und die durch dieses Attribut angegebene Taste, wird das Element im Fenster von überall aus aktiviert. Auch wenn Groß-/Kleinschreibung des Wertes irrelevant ist, wird die dem Attribut accesskey entsprechende Variante benutzt, sollten beide Schreibweisen innerhalb der Beschriftung vorkommen.
+
+
+

Beispiel

+
<vbox>
+  <label value="Namen eingeben" accesskey="e" control="myName"/>
+  <textbox id="myName"/>
+  <button label="Abbrechen" accesskey="b"/>
+  <button label="Ok" accesskey="O"/>
+</vbox>
+
+

Siehe auch

+

Attribut label, Attribut acceltext

+ +
diff --git a/files/de/archive/mozilla/xul/attribute/activetitlebarcolor/index.html b/files/de/archive/mozilla/xul/attribute/activetitlebarcolor/index.html new file mode 100644 index 0000000000..95f6be0346 --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/activetitlebarcolor/index.html @@ -0,0 +1,14 @@ +--- +title: Activetitlebarcolor +slug: Archive/Mozilla/XUL/Attribute/Activetitlebarcolor +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/activetitlebarcolor +--- +
« XUL-Referenz Startseite
+
activetitlebarcolor
Typ: color string
Bestimmt die Hintergrundfarbe der Titelleiste eines Fensters, wenn es aktiv ist (Vordergrund). Außerdem versteckt dies die Trennlinie zwischen Titelleiste und Fensterinhalt. Dies trifft nur auf Mac OS Systeme zu.
+
+
+ +
diff --git a/files/de/archive/mozilla/xul/attribute/align/index.html b/files/de/archive/mozilla/xul/attribute/align/index.html new file mode 100644 index 0000000000..fe97a3c6c4 --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/align/index.html @@ -0,0 +1,37 @@ +--- +title: align +slug: Archive/Mozilla/XUL/Attribute/align +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/align +--- +
+ « XUL-Referenz Startseite
+
+
+ align
+
+
+
+ Typ: einer der unten angegebenen Werte
+
+
+
+ Das Attribut align gibt die Ausrichtung der Kindelemente des Kastens (Box) an, wenn die Größe des Kastens größer als die Gesamtgröße seiner Kindelemente ist. Für Kästen horizontaler Orientierung gibt es die vertikale Ausrichtung der Kindelemente an. Im Falle vertikaler Orientierung legt es entsprechend die horizontale Ausrichtung der Kindelemente fest. Das Attribut pack bezieht sich auf die Ausrichtung, wird jedoch zur Angabe der Position in entgegengesetzter Richtung benutzt. Der Wert von align kann auch mittels der Stileigenschaft -moz-box-align angeben werden.
+
+ +
+

Siehe auch

+

Attribut pack

+ +
+

 

diff --git a/files/de/archive/mozilla/xul/attribute/allowevents/index.html b/files/de/archive/mozilla/xul/attribute/allowevents/index.html new file mode 100644 index 0000000000..63dc160f9e --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/allowevents/index.html @@ -0,0 +1,17 @@ +--- +title: allowevents +slug: Archive/Mozilla/XUL/Attribute/allowevents +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/allowevents +--- +
« XUL-Referenz Startseite
+
allowevents
Typ: boolean
Falls true, werden Ereignisse an die Kindelemente des Elements weitergereicht. Anderenfalls erhält nur das Element Ereignisse.
+
+
+

Bei listitem und titlebar Elementen werden Maus-Ereignisse normalerweise nicht an deren Kindelemente gesendet. Stattdessen werden sie zurück auf das listitem und titlebar Element selbst geschickt. Das bedeutet, dass Elemente innerhalb eines listitem Elements nicht auf auf Ereignisse reagieren und stattdessen nur ein Item in der Liste ausgewählt wird. Wird das allowevents Attribut auf true gesetzt, wird dieses spezielle Verhalten deaktiviert und Ereignisse werden wie bei anderen Elementen behandelt.

+

Bei menu, menuseparator, menuitem und treecol Elementen, sowie Menü-Buttons, und beim datepicker Popup werden Maus-Ereignisse ebenfalls auf das Element selbst gerichtet. Das allowevents Attribut wird jedoch in einer anderen Art verwendet. Das Attribut allowevents kann hier im Kindelement auf true gesetzt werden. Das hat die gleichen Auswirkungen, wie bei normal gerichteten Ereignissen, erlaubt aber unterschiedliche Einstellungen für jedes Kindelement.
+Dieses Verhalten wird für Menüs verwendet, um zum Beispiel einem Menü-Button zu erlauben sich so zu verhalten wie das Menü, wenn man darauf klickt.

+ +
diff --git a/files/de/archive/mozilla/xul/attribute/allownegativeassertions/index.html b/files/de/archive/mozilla/xul/attribute/allownegativeassertions/index.html new file mode 100644 index 0000000000..83634ca471 --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/allownegativeassertions/index.html @@ -0,0 +1,11 @@ +--- +title: allownegativeassertions +slug: Archive/Mozilla/XUL/Attribute/allownegativeassertions +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/allownegativeassertions +--- +
« XUL-Referenz Startseite
+
allownegativeassertions
Typ: boolean
Gültig für jedes Element mit einem Attribut datasources. Werden mehrere Datenquellen benutzt, wird die Aussage eventuell von einer anderen überschrieben. Wenn dieses Attribut true ist (was die Vorgabe ist), kann eine Datenquelle eine frühere Aussage negieren.
+
diff --git a/files/de/archive/mozilla/xul/attribute/color/index.html b/files/de/archive/mozilla/xul/attribute/color/index.html new file mode 100644 index 0000000000..50902e7afe --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/color/index.html @@ -0,0 +1,14 @@ +--- +title: color +slug: Archive/Mozilla/XUL/Attribute/Color +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/color +--- +
« XUL-Referenz Startseite
+
color
Typ: color string
Die aktuell ausgewählte Farbe. Diese wird geändert, sobald der Anwender eine Farbe auswählt. Man kann einen String in der Form #RRGGBB der Eigenschaft zuweisen, um die gewählte Farbe zu ändern.
+
+
+

 

+
diff --git a/files/de/archive/mozilla/xul/attribute/cols/index.html b/files/de/archive/mozilla/xul/attribute/cols/index.html new file mode 100644 index 0000000000..1f2ea0a4d6 --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/cols/index.html @@ -0,0 +1,14 @@ +--- +title: cols +slug: Archive/Mozilla/XUL/Attribute/Cols +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/cols +--- +
« XUL-Referenz Startseite
+
cols
Typ: integer
Stellt die Anzahl an Spalten für mehrzeilige Textboxen dar.
+
+
+ +
diff --git a/files/de/archive/mozilla/xul/attribute/decimalplaces/index.html b/files/de/archive/mozilla/xul/attribute/decimalplaces/index.html new file mode 100644 index 0000000000..bea62c69a2 --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/decimalplaces/index.html @@ -0,0 +1,14 @@ +--- +title: decimalplaces +slug: Archive/Mozilla/XUL/Attribute/Decimalplaces +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/decimalplaces +--- +
« XUL-Referenz Startseite
+
decimalplaces
Typ: integer
Die Anzahl an Dezimalstellen, die angezeigt werden sollen. Der Standardwert ist 0, was bedeutet, dass keine Dezimalstellen angezeigt werden. Der Wert infinity kann dazu verwendet werden, keine Begrenzung der Dezimalstellen bei Zahlen anzuzeigen. Hinweis: Dezimalzahlen werden als Floats gespeichert.
+
+
+ +
diff --git a/files/de/archive/mozilla/xul/attribute/disabled/index.html b/files/de/archive/mozilla/xul/attribute/disabled/index.html new file mode 100644 index 0000000000..0b296a38ea --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/disabled/index.html @@ -0,0 +1,28 @@ +--- +title: Disabled +slug: Archive/Mozilla/XUL/Attribute/Disabled +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/disabled +--- +
« XUL-Referenz Startseite
+
disabled
Typ: boolean
Kennzeichnet, ob ein Element deaktiviert ist oder nicht. Wenn das Element auf  true gesetzt ist, ist das Element deaktiviert. Deaktivierte Elemente sind gewöhnlich mit einem grauen Text dargestellt. Wenn ein Element deaktiviert ist, wird es auf Anwenderaktionen nicht reagieren, es kann den Fokus nicht erlangen und das command Ereignis wird nicht ausgelöst. Das Element wird allerdings noch auf Mausereignisse antworten. Um das Element zu aktivieren, ist es besser das Attribut zu entfernen als es auf den Wert false zu setzen. Um den Wert dieses Attributs mittels JavaScript zu setzen oder abzurufen, sollte besser die disabled Eigenschaft verwendet werden.
+
+
+
// Deaktiviere ein Element.
+document.getElementById('buttRemove').setAttribute("disabled", "true");
+
+// Reaktiviere ein Element, während das "disabled" Attribute beibehalten wird.
+document.getElementById('buttRemove').setAttribute("disabled", "");
+
+// Reaktiviere ein Element, in dem das "disabled" Attribut entfernt wird.
+document.getElementById('buttRemove').removeAttribute("disabled");
+
+
+

Hinweis zu Firefox 3.5

+

Seit Firefox 3.5 wird dieses Attribut für Keyset Elemente unterstützt.

+
+
+ +
diff --git a/files/de/archive/mozilla/xul/attribute/empty/index.html b/files/de/archive/mozilla/xul/attribute/empty/index.html new file mode 100644 index 0000000000..f1a3d0071b --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/empty/index.html @@ -0,0 +1,14 @@ +--- +title: empty +slug: Archive/Mozilla/XUL/Attribute/Empty +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/textbox.empty +--- +
« XUL-Referenz Startseite
+
empty
Typ: boolean
Gibt an, ob emptyText angezeigt werden soll. Kann zur Gestaltung des Elements verwendet werden.
+
+
+ +
diff --git a/files/de/archive/mozilla/xul/attribute/emptytext/index.html b/files/de/archive/mozilla/xul/attribute/emptytext/index.html new file mode 100644 index 0000000000..9631bea08c --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/emptytext/index.html @@ -0,0 +1,14 @@ +--- +title: emptytext +slug: Archive/Mozilla/XUL/Attribute/Emptytext +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/emptytext +--- +
« XUL-Referenz Startseite
+
emptytext Unerwünscht Gecko 2
Typ: string
Ein String, der in der Textbox angezeigt wird, falls diese keinen Wert besitzt. Dieses Attribut wurde vom placeholder Attribut in Gecko 2 ersetzt. Der alte Name bleibt zur Kompatibilität bestehen, aber Sie sollten Ihren Code aktualisieren.
+
+
+ +
diff --git a/files/de/archive/mozilla/xul/attribute/expr/index.html b/files/de/archive/mozilla/xul/attribute/expr/index.html new file mode 100644 index 0000000000..1448277f5c --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/expr/index.html @@ -0,0 +1,14 @@ +--- +title: Expr +slug: Archive/Mozilla/XUL/Attribute/Expr +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/expr +--- +
« XUL-Referenz Startseite
+
expr
Typ: string
Ein XPath Ausdruck für XML Abfragen, der Ergebnisse zurückliefert. Innerhalb des Ausdrucks kann jeder Namespace Präfix verwendet werden, der für ein Element deklariert wurde.
+
+
+ +
diff --git a/files/de/archive/mozilla/xul/attribute/hidespinbuttons/index.html b/files/de/archive/mozilla/xul/attribute/hidespinbuttons/index.html new file mode 100644 index 0000000000..37b86f1f3f --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/hidespinbuttons/index.html @@ -0,0 +1,10 @@ +--- +title: hidespinbuttons +slug: Archive/Mozilla/XUL/Attribute/Hidespinbuttons +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/hidespinbuttons +--- +
« XUL-Referenz Startseite
+
hidespinbuttons
Typ: boolean
Falls der Wert auf true gesetzt wird, werden keine Buttons mit Pfeilen angezeigt, um den Wert des Feldes anzupassen. Der Wert kann dann ausschließlich per Tastatur eingegeben werden. Standardmäßig ist der Wert false.
diff --git a/files/de/archive/mozilla/xul/attribute/index.html b/files/de/archive/mozilla/xul/attribute/index.html new file mode 100644 index 0000000000..2bc9d70f0d --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/index.html @@ -0,0 +1,11 @@ +--- +title: Attribute +slug: Archive/Mozilla/XUL/Attribute +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute +--- +

« XUL-Referenz Startseite

+ diff --git a/files/de/archive/mozilla/xul/attribute/label/index.html b/files/de/archive/mozilla/xul/attribute/label/index.html new file mode 100644 index 0000000000..d1bde8c8b8 --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/label/index.html @@ -0,0 +1,32 @@ +--- +title: label +slug: Archive/Mozilla/XUL/Attribute/label +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/label +--- +
« XUL-Referenz Startseite
+
label
Typ: string
Die Beschriftung für das Element. Wird das Attribut nicht angegeben, so erscheint auch kein Beschriftungstext.
+
+
+

Siehe auch

+ +

Beispiele in JavaScript

+
<label value="Whaw" id="the-big-label" command="the-big-button"/>
+<button id="the-big-button" label="Klick mich"
+	oncommand="alert(document.getElementById('the-big-label').value)"/>
+
+<label id="myLabel" value="Meine Beschriftung"/>
+<button label="Klick mich"
+	oncommand="document.getElementById('myLabel').setAttribute('value','Wert geändert');" />
+
+<checkbox label="my Checkbox" id="myCheckboX"/>
+<button label="Weiterer Klick"
+	oncommand="document.getElementById('myCheckboX').setAttribute('label','Noch nicht angekreuzt');"/>
+<button label="Beschriftung des Ankreuzfeldes"
+	oncommand="alert( document.getElementById('myCheckboX').getAttribute('label') )"/>
+
+ +
diff --git a/files/de/archive/mozilla/xul/attribute/onchange/index.html b/files/de/archive/mozilla/xul/attribute/onchange/index.html new file mode 100644 index 0000000000..ef1f0e8bd8 --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/onchange/index.html @@ -0,0 +1,14 @@ +--- +title: onchange +slug: Archive/Mozilla/XUL/Attribute/Onchange +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/onchange +--- +
« XUL-Referenz Startseite
+
onchange
Typ: script code
Der Code im onchange Attribut wird aufgerufen, wenn sich der Wert des Elements geändert hat.
+
+
+ +
diff --git a/files/de/archive/mozilla/xul/attribute/prefpane.src/index.html b/files/de/archive/mozilla/xul/attribute/prefpane.src/index.html new file mode 100644 index 0000000000..14c934c98f --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/prefpane.src/index.html @@ -0,0 +1,25 @@ +--- +title: prefpane.src +slug: Archive/Mozilla/XUL/Attribute/prefpane.src +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/prefpane.src +--- +
+ « XUL-Referenz Startseite
+
+
+ src
+
+ Typ: Überlagerungs-URL
+
+ Die URL des Inhalts des prefpane. Sofern nicht angegeben, wird der Inhalt des prefpane Elements dargestellt.
+
+ +
+

Siehe auch

+ +
diff --git a/files/de/archive/mozilla/xul/attribute/src/index.html b/files/de/archive/mozilla/xul/attribute/src/index.html new file mode 100644 index 0000000000..875fa55f2d --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/src/index.html @@ -0,0 +1,34 @@ +--- +title: src +slug: Archive/Mozilla/XUL/Attribute/src +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/src +--- +
+ « XUL-Referenz Startseite
+
+
+ src
+
+ Typ: URL
+
+ Die URL des im Element anzuzeigenden Inhalts.
+
+
+

Beispiele

+ 
<iframe id="content-body" src="http://www.mozilla.org/"/>
+<browser src="http://www.mozilla.org" flex="1"/>
+<image src='Firefoxlogo.png' width='135' height='130'/>
+
+

Siehe auch

+ +
diff --git a/files/de/archive/mozilla/xul/attribute/treecell.src/index.html b/files/de/archive/mozilla/xul/attribute/treecell.src/index.html new file mode 100644 index 0000000000..0c1a44cd34 --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/treecell.src/index.html @@ -0,0 +1,17 @@ +--- +title: treecell.src +slug: Archive/Mozilla/XUL/Attribute/treecell.src +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/treecell.src +--- +
« XUL-Referenz Startseite
+
src
Typ: Bild-URL
URL des Bildes, welches in der Zelle des Baums angezeigt werden soll. Sofern nicht angegeben, erscheint auch kein Bild. In der Zelle können sowohl Bild als auch Beschriftung angezeigt werden.
+
+
+

Siehe auch

+ + +
diff --git a/files/de/archive/mozilla/xul/attribute/treecol.src/index.html b/files/de/archive/mozilla/xul/attribute/treecol.src/index.html new file mode 100644 index 0000000000..e94d0f7cbb --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/treecol.src/index.html @@ -0,0 +1,17 @@ +--- +title: treecol.src +slug: Archive/Mozilla/XUL/Attribute/treecol.src +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/treecol.src +--- +
« XUL-Referenz Startseite
+
src
Typ: Bild-URL
Um für das treecol Element ein Bild für den Kopf, statt eines label Attribut zu benutzen, kann dieses Attribut gesetzt werden. Im Kopf können nicht gleichzeitig Bild und Beschriftung angezeigt werden. Die URL eines Bildes, das als Spaltenkopf des Baums angezeigt wird, kann mit diesem Attribut festgelegt werden. Wird das Attribut nicht angegeben, erscheint kein Bild und es wird stattdessen die Beschriftung angezeigt. Damit das Bild erscheint, muss die Klasse treecol-image für das treecol Element gesetzt werden. Ein label sollte dennoch für die Benutzung im Spaltenwähler angegeben werden, falls ignoreincolumnpicker nicht true ist und hidecolumnpicker für den tree ebenfalls nicht true ist .
+
+
+

Siehe auch

+ + +
diff --git a/files/de/archive/mozilla/xul/attribute/var/index.html b/files/de/archive/mozilla/xul/attribute/var/index.html new file mode 100644 index 0000000000..1ed49683ea --- /dev/null +++ b/files/de/archive/mozilla/xul/attribute/var/index.html @@ -0,0 +1,14 @@ +--- +title: var +slug: Archive/Mozilla/XUL/Attribute/Var +tags: + - XUL Attribute + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Attribute/var +--- +
« XUL-Referenz Startseite
+
var
Typ: string
Dient der Variablenzuweisung innerhalb assign Tags; ansonsten wird es als Referenz zu einer Template Variable wie beispielsweise "?name" verwendet.
+
+
+ +
diff --git a/files/de/archive/mozilla/xul/bbox/index.html b/files/de/archive/mozilla/xul/bbox/index.html new file mode 100644 index 0000000000..35dc11a250 --- /dev/null +++ b/files/de/archive/mozilla/xul/bbox/index.html @@ -0,0 +1,87 @@ +--- +title: Bbox +slug: Archive/Mozilla/XUL/Bbox +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/bbox +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Eine horizontale Box, die an der Grundlinie ausgerichtet ist. Gleichwertig zum hbox Element mit einem align Attribut mit dem Wert baseline.

+

Beispiele

+

(Beispiel benötigt)

+

Attribute

+ + + + + + +

Geerbt von XUL-Element
+align, +allowevents, +allownegativeassertions, +class, +coalesceduplicatearcs, +collapsed, +container, +containment, +context, +contextmenu, +datasources, +dir, +empty, +equalsize, +flags, +flex, +height, +hidden, +id, +insertafter, +insertbefore, +left, +maxheight, +maxwidth, +menu, +minheight, +minwidth, +mousethrough, +observes, +ordinal, +orient, +pack, +persist, +popup, +position, +preference-editable, +querytype, +ref, +removeelement, +sortDirection, +sortResource, +sortResource2, +statustext, +style, +template, +tooltip, +tooltiptext, +top, +uri, +wait-cursor, +width

+
+

Eigenschaften

+ +

Geerbte Eigenschaften
align, , allowEvents, , boxObject, builder, , , , className, , , , , collapsed, contextMenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxHeight, maxWidth, menu, minHeight, minWidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statusText, style, ,, tooltip, tooltipText, top, width
+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+

Verwandte Themen

+

TBD

diff --git a/files/de/archive/mozilla/xul/binding/index.html b/files/de/archive/mozilla/xul/binding/index.html new file mode 100644 index 0000000000..bc3dbe2daf --- /dev/null +++ b/files/de/archive/mozilla/xul/binding/index.html @@ -0,0 +1,89 @@ +--- +title: binding +slug: Archive/Mozilla/XUL/Binding +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/binding +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Sollte in einem bindings Element enthalten sein. Ein binding wird benutzt, um eine Variable an einen Node zu binden. Ähnlich zum Syntax des triple Elements, können die Eigenschaften eines entsprechenden Nodes an einen Variablennamen gebunden werden. Dieser Name kann innerhalb einer Aktion einer Regel benutzt werden.

+
Eigenschaften
object, predicate, subject
+
+

Beispiele

+

(Beispiel benötigt)

+

Attribute

+ + + + + + +

Geerbt von XUL-Element
+align, +allowevents, +allownegativeassertions, +class, +coalesceduplicatearcs, +collapsed, +container, +containment, +context, +contextmenu, +datasources, +dir, +empty, +equalsize, +flags, +flex, +height, +hidden, +id, +insertafter, +insertbefore, +left, +maxheight, +maxwidth, +menu, +minheight, +minwidth, +mousethrough, +observes, +ordinal, +orient, +pack, +persist, +popup, +position, +preference-editable, +querytype, +ref, +removeelement, +sortDirection, +sortResource, +sortResource2, +statustext, +style, +template, +tooltip, +tooltiptext, +top, +uri, +wait-cursor, +width

+
+

Eigenschaften

+
+

Geerbte Eigenschaften
align, , allowEvents, , boxObject, builder, , , , className, , , , , collapsed, contextMenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxHeight, maxWidth, menu, minHeight, minWidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statusText, style, ,, tooltip, tooltipText, top, width
+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+

Verwandte Themen

+

TBD

diff --git a/files/de/archive/mozilla/xul/box/index.html b/files/de/archive/mozilla/xul/box/index.html new file mode 100644 index 0000000000..b479153f5c --- /dev/null +++ b/files/de/archive/mozilla/xul/box/index.html @@ -0,0 +1,101 @@ +--- +title: box +slug: Archive/Mozilla/XUL/Box +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/box +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Ein Containerelement, welches eine beliebige Anzahl an Kindelementen enthalten kann. Falls das box Element ein orient Attribut besitzt, das auf horizontal gesetzt ist, werden die Kindelemente von links nach rechts, in der Reihenfolge, in der sie in im box Element erscheinen, angelegt. Falls orient auf vertical gesetzt ist, werden die Kindelemente von oben nach unten angelegt. Kindelemente überlappen sich dabei nicht. Die standardmäßige Ausrichtung ist horizontal.

+

Weitere Informationen sind im XUL Tutorial verfügbar.

+

Beispiele

+
Image:XUL_ref_box.png
+
<box orient="horizontal">
+  <label value="Zero"/>
+  <box orient="vertical">
+    <label value="One"/>
+    <label value="Two"/>
+  </box>
+  <box orient="horizontal">
+    <label value="Three"/>
+    <label value="Four"/>
+  </box>
+</box>
+
+

Attribute

+ + + + + + +

Geerbt von XUL-Element
+align, +allowevents, +allownegativeassertions, +class, +coalesceduplicatearcs, +collapsed, +container, +containment, +context, +contextmenu, +datasources, +dir, +empty, +equalsize, +flags, +flex, +height, +hidden, +id, +insertafter, +insertbefore, +left, +maxheight, +maxwidth, +menu, +minheight, +minwidth, +mousethrough, +observes, +ordinal, +orient, +pack, +persist, +popup, +position, +preference-editable, +querytype, +ref, +removeelement, +sortDirection, +sortResource, +sortResource2, +statustext, +style, +template, +tooltip, +tooltiptext, +top, +uri, +wait-cursor, +width

+
+

Eigenschaften

+ +

Geerbte Eigenschaften
align, , allowEvents, , boxObject, builder, , , , className, , , , , collapsed, contextMenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxHeight, maxWidth, menu, minHeight, minWidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statusText, style, ,, tooltip, tooltipText, top, width
+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+ +
Elemente
vbox, hbox
+
diff --git a/files/de/archive/mozilla/xul/colorpicker/index.html b/files/de/archive/mozilla/xul/colorpicker/index.html new file mode 100644 index 0000000000..fa6c6bf533 --- /dev/null +++ b/files/de/archive/mozilla/xul/colorpicker/index.html @@ -0,0 +1,77 @@ +--- +title: colorpicker +slug: Archive/Mozilla/XUL/Colorpicker +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/colorpicker +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Eine Farbpalette aus der ein Anwender durch Anklicken auf eine der Gitterzellen wählen kann.

+
Attribute
disabled, color, onchange, preference, tabindex, type
+
+
Eigenschaften
accessibleType, color, disabled, open, tabIndex
+
+

Beispiele

+

Image:XUL_REF_rgb.gif

+
<colorpicker/>
+
+

Attribute

+

+ +
disabled
Typ: boolean
Kennzeichnet, ob ein Element deaktiviert ist oder nicht. Wenn das Element auf  true gesetzt ist, ist das Element deaktiviert. Deaktivierte Elemente sind gewöhnlich mit einem grauen Text dargestellt. Wenn ein Element deaktiviert ist, wird es auf Anwenderaktionen nicht reagieren, es kann den Fokus nicht erlangen und das command Ereignis wird nicht ausgelöst. Das Element wird allerdings noch auf Mausereignisse antworten. Um das Element zu aktivieren, ist es besser das Attribut zu entfernen als es auf den Wert false zu setzen. Um den Wert dieses Attributs mittels JavaScript zu setzen oder abzurufen, sollte besser die disabled Eigenschaft verwendet werden.
+
+ + +
+ +
color
Typ: color string
Die aktuell ausgewählte Farbe. Diese wird geändert, sobald der Anwender eine Farbe auswählt. Man kann einen String in der Form #RRGGBB der Eigenschaft zuweisen, um die gewählte Farbe zu ändern.
+
+ +
+ +
onchange
Typ: script code
Der Code im onchange Attribut wird aufgerufen, wenn sich der Wert des Elements geändert hat.
+
+ +
+ + +
+
preference
+
Type: id
+
Connects the element to a corresponding preference. This attribute only has any effect when used inside a prefwindow. More information is available in the Preferences System article.
+
+
+ + +
+
tabindex
+
Type: integer
+
The tab order of the element. The tab order is the order in which the focus is moved when the user presses the "tab" key. Elements with a higher tabindex are later in the tab sequence.
+
+
+ + +
+
type
+
Type: string
+
If this attribute is not present, the colorpicker is displayed inside the window. If this is set to the text button, the colorpicker is displayed as a button. When the user clicks the button, a popup appears for the user to select a color.
+
+
+

Eigenschaften

+

+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+

Verwandte Themen

+
Schnittstellen
nsIDOMXULControlElement
+
+

Bugs

+

Das onchange Event funktioniert nur, wenn das type Attribut auf "button" festgelegt wurde. Die Verwendung von onclick bietet sich daher an, wenn mit mit dem losen Colorpicker gearbeitet wird und die gerade ausgewählte Farbe benötigt wird, um z.B. in einer <textbox> angezeigt zu werden.

diff --git a/files/de/archive/mozilla/xul/eigenschaften/index.html b/files/de/archive/mozilla/xul/eigenschaften/index.html new file mode 100644 index 0000000000..f152ae7489 --- /dev/null +++ b/files/de/archive/mozilla/xul/eigenschaften/index.html @@ -0,0 +1,14 @@ +--- +title: Eigenschaften +slug: Archive/Mozilla/XUL/Eigenschaften +tags: + - XUL Eigenschaften + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Property +--- +

« XUL-Referenz Startseite

+ +

Verwandte DOM Elementeigenschaften

+ diff --git a/files/de/archive/mozilla/xul/events/index.html b/files/de/archive/mozilla/xul/events/index.html new file mode 100644 index 0000000000..346a893f9a --- /dev/null +++ b/files/de/archive/mozilla/xul/events/index.html @@ -0,0 +1,464 @@ +--- +title: Ereignisse +slug: Archive/Mozilla/XUL/Events +tags: + - XUL-Ereignisse +translation_of: Archive/Mozilla/XUL/Events +--- +

 

+ +

« Startseite XUL Referenz

+ +

 

+ +

Die folgenden Tabellen beschreiben die Ereignisbehandlungsroutinen, welche die meisten XUL-Elemente betreffen. Die Ereignisse können mit dem Element über »Lauscher« (Listener) verknüpft werden. Der addEventListener fügt ein Ereignis hinzu, der removeEventListener hebt diese Verknüpfung wieder auf.

+ +

Für einige Ereignisse kann die Verknüpfung auch über Attribute erfolgen. Hierbei muss jedoch berücksichtigt werden, dass nur ein Listener gleichzeitig verknüpft werden kann. Eventuell bereits bestehende Verknüpfungen mit Lauschern werden aufgelöst. Der Name des Attributs entspricht dem Namen des Ereignisses mit einem vorangestellten 'on'.

+ +

Geerbte DOM Ereignisse

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
EreignisBeschreibung
+

blur

+ 		+

Das Gegenteil des focus-Ereignisses; das blur-Ereignis tritt auf, nachdem ein Element den Eingabefokus verloren hat.
+ Attribut: onblur

+
+

change

+ 		+

Dieses Ereignis wird gesendet, wenn der Wert eines Textfelds geändert wird, aber erst wenn der Eingabefokus auf ein anderes Element übergeht.
+ Attribut: onchange

+
+

click

+ 		+

Dieses Ereignis wird gesendet, wenn eine Maustaste gedrückt und wieder losgelassen wurde. Über die button Eigenschaft des Ereignisobjekts kann ermittelt werden, welche Maustaste gedrückt wurde. Dieses Ereignis wird auch gesendet, wenn der Benutzer einen Doppelklick ausführt. Über die detail Eigenschaft kann festgelegt werden, wie viele Klicks auftreten sollen. So kann auch auf dreifach-Klicks getestet werden. Dieses Ereignis sollte in XUL nicht verwendet werden, um auf Benutzeraktionen zu reagieren. Stattdessen sollte das command Ereignis benutzt werden.
+ Attribut: onclick

+
+

dblclick

+ 		+

Dieses Ereignis verhält sich wie das click Ereignis, allerdings wird es nur gesendet, wenn der Benutzer einen Doppelklick ausführt. Das Ereignis kann als eine Alternative zur detail Eigenschaft im click Ereignis verwendet werden.
+ Attribut: ondblclick

+
+

DOMMouseScroll

+ 		+

Dieses Ereignis wird gesendet, wenn das Mausrad bewegt wird, egal, ob der Inhalt gescrollt wird oder nicht.
+ Ziel dieses Ereignisses ist das Element, welches sich unter dem Mauszeiger befindet, wenn das Mausrad bewegt wird.

+
+

focus

+ 		+

Das focus Ereignis wird gesendet, wenn ein Element den Fokus erhält. Wenn das Element fokussiert ist, werden Tastaturereignisse zu diesem Element gesendet. Der Fokus kann geändert werden, indem auf eine anderes Element geklickt wird, die TAB Taste gedrückt wird, um zum nächsten Element zu wechseln, oder die »Zurück TAB« Taste gedrückt wird, um zum vorherigen Element zu wechseln.
+ Attribut: onfocus

+
+

keydown

+ 		+

Dieses Ereignis wird zu einem Element gesendet, das den Eingabefokus hat, während eine Taste gedrückt, aber nicht losgelassen wird.
+ Attribut: onkeydown

+
+

keypress

+ 		+

Das keypress Ereignis wird zu einem Element gesendet, das den Eingabefokus hat und eine Taste gedrückt und losgelassen wurde. Wenn der Benutzer eine Taste drückt, wird zuerst das keydown Ereignis gesendet, gefolgt vom keypress Ereignis und schließlich dem keyup Ereignis. In einem Textfeld kann der Benutzer normalerweise eine Taste gedrückt halten, um ein Zeichen wiederholt zu senden. In diesem Fall werden mehrere Ereignispaare gesendet, als ob der Benutzer die gleiche Taste sehr schnell hintereinander drücken würde.
+ Attribut: onkeypress

+
+

keyup

+ 		+

Das keyup Ereignis wird einem Element gesendet, das den Eingabefokus hat, wenn eine Taste losgelassen wird.
+ Attribut: onkeyup

+
+

load

+ 		+

Dieses Element wird zum Fenster gesendet, nachdem es vollständig geladen wurde. Die Behandlungsroutine sollte dem window Element zugewiesen werden. Dieses Ereignis kann auch bei Bildelementen oder einem Element, das Bildattribute akzeptiert verwendet werden und wird dann gesendet, wenn das Bild vollständig geladen wurde. Bei Bildern wird dieses Element nicht im Elementenbaum auftauchen, sodass es nicht mit dem load Ereignis des Fensters in Konflikt gerät.
+ Attribut: onload

+
+

mousedown

+ 		+

Dieses Ereignis wird gesendet, wenn die Maustaste über einem Element gedrückt, aber nicht losgelassen wird.
+ Attribut: onmousedown

+
+

mousemove

+ 		+

Dieses Ereignis wird wiederholt gesendet, während der Mauszeiger über einem Element bewegt wird.
+ Attribut: onmousemove

+
+

mouseout

+ 		+

Dieses Ereignis wird einem Element gesendet, wenn der Benutzer den Mauszeiger aus dem Bereich des Elements bewegt. Es ist das Gegenstück zum mouseover Ereignis.
+ Attribut: onmouseout

+
+

mouseover

+ 		+

Dieses Element wird einem Element gesendet, wenn sich die Maus erstmals über einem Element befindet. Es kann dazu verwendet werden dem Benutzer Rückmeldungen bereitzustellen.
+ Attribut: onmouseover

+
+

mouseup

+ 		+

Dieses Ereignis wird gesendet, wenn die Maustaste über einem Element losgelassen wird.
+ Attribut: onmouseup

+
+

select

+ 		+

Dieses Ereignis wird einer Listbox bzw. einem Tree bei Auswahl eines Eintrags gesendet.
+ Attribut: onselect

+
+

unload

+ 		+

Dieses Ereignis wird einem Fenster gesendet, wenn das Fenster geschlossen wurde. Das erfolgt nach dem close Ereignis. Die Behandlungsroutine für dieses Ereignis sollte dem window Element zugewiesen werden.
+ Attribut: onunload

+
+ +

Ereignisse zu Veränderungen am DOM

+ + + + + + + + + + + + + + + + + + + + +
EreignisBeschreibung
+

DOMAttrModified

+ 		+

Dieses Ereignis wird einem Element gesendet, wenn eines der Attribute verändert wird. In der Behandlungsroutine kann das Attribut, welches verändert wurde, über die attrName Eigenschaft ermittelt werden. Neue und alte Werte des Attributs können über die prevValue und newValue Eigenschaften abgerufen werden.

+
+

DOMNodeInserted

+ 		+

Dieses Ereignis wird gesendet, wenn ein Kontenelement (als ein Kindelement) einem Element hinzugefügt wird. Wenn dieses Element auf dem Dokumentenlevel erfasst wird, können Hinweise zu Dokumentenveränderung auftreten.

+
+

DOMNodeRemoved

+ 		+

Dieses Ereignis wird gesendet, wenn ein Kontenelement aus einem Element entfernt wird. Wenn dieses Element auf dem Dokumentenlevel erfasst wird, können Hinweise zu Dokumentenveränderung auftreten.

+
+ +

Es sollte darauf hingewiesen werden, dass die Anwesenheit von Behandlungsroutinen zur Veränderungen am DOM die Performance von nachfolgenden DOM Operationen in dem Dokument stark beeinträchtigt. Das kann bedeuten, dass eine DOM Operation 1,5 bis 7 mal so lange braucht als es ohne einen Eventhandler brauchen würde.

+ +

Gebräuchliche XUL Ereignisse

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
EreignisBeschreibung
+

broadcast

+ 		+

Dieses Ereignis sollte einem Beobachter zugewiesen werden. Das broadcast Ereignis wird gesendet, wenn die Attribute eines Elements verändert oder beobachtet werden.
+ Attribut: onbroadcast

+
+

close

+ 		+

Dieses Ereignis wird gesendet, wenn eine Anfrage durch den Benutzer getätigt wurde, die das Fenster schließen lassen soll (z.B durch Klick auf den Schließen Button). Wird eine Behandlungsroutine auf das window Element gesetzt, kann das Schließen des Fensters verhindert werden. Wird false vom Close-handler zurückgeliefert, wird das Fenster nicht geschlossen. Eine Rückgabe von true schließt das Fenster normal. Dieses Ereignis wird nur gesendet, wenn der Benutzer den Schließen Button in der Titelleiste anklickt. Das unload Ereignis erfasst alle Versuche das Fenster zu schließen.
+ Attribut: onclose

+
+

command

+ 		+

Dieses Ereignis wird gesendet, wenn ein Element aktiv ist. Wie es aktiviert wird, variiert von Element zu Element und in vielen Fällen gibt es mehrere Wege, um eine Element zu aktivieren. Zum Beispiel kann eine Schaltfläche, wenn sie fokussiert ist, durch ein Klick mit der Maus oder durch das Drücken der ENTER Taste aktivert werden. Menüs können durch das Auswählen mit der Maus oder durch das Drücken einer Schnelltaste aktiviert werden. Es sollte immer das command Ereignis, anstatt des click Ereignisses verwendet werden, weil in allen nötigen Fällen aufgerufen wird.
+ Attribut: oncommand

+
+

commandupdate

+ 		+

Dieses Ereignis tritt auf, wenn eine Befehlsaktualisierung beim <commandset> Element statt findet. Es wird verwendet, um die ausgeschalteten Befehle zu aktualisieren.
+ Attribut: oncommandupdate

+
+

contextmenu

+ 		+

Dieses Ereignis wird einem Element gesendet, wenn der Benutzer eine Anfrage stellt, die ein Kontextmenü öffnen soll. Die Aktion variiert von Betriebssystem zu Betriebssystem, wird aber typischerweise durch einen Rechtsklick ausgelöst. Diese Behandlungsroutine wird normalerweise verwendet, um dynamische Befehle auszuführen, wenn der Benutzer die Anfrage stellt, das Menü anzuzeigen oder es wird ein Ereignis benutzt, welches ein Popup-Fenster anzeigt. Wird false von diesem Eventhandler zurückgegeben, wird verhindert, dass das Popup-Fenster angezeigt wird.
+ Attribut: oncontextmenu

+
+

drag {{ Fx_minversion_inline(3) }}

+ 		+

Das drag Ereignis wird zum Quellknoten (der Knoten, der gezogen wurde) mehrmals pro Sekunde gesendet, während ein Objekt gezogen wird.
+ Attribut: ondrag

+
+

dragdrop

+ 		+

Dieses Ereignis wird ausgelöst, wenn der Benutzer die Maustaste los lässt, um ein Objekt abzulegen, welches gezogen wurde. Das Element, wenn es das Ablegen akzeptiert, sollte in irgendeiner Weise reagieren (z.B. durch das Hineinlegen des gezogenen Objekten in das Element selbst).
+ Attribut: ondragdrop

+
+

dragend {{ Fx_minversion_inline(3) }}

+ 		+

Das dragend Ereignis wird zum Quellknoten (der Konten, der gezogen wurde) gesendet, wenn das Objekt nicht mehr gezogen wird.
+ Attribut: ondragend

+
+

dragenter

+ 		+

Das dragenter Ereignis wird gesendet, wenn sich der Mauszeiger erstmals über ein Element befindet in welches ein Objekt gezogen werden soll. Es ist ähnlich zum mouseover Ereignis, tritt aber nur beim Hineinlegen von Objekten auf.
+ Attribut: ondragenter

+
+

dragexit

+ 		+

Dieses Ereignis wird gesendet, wenn sich der Mauszeiger aus dem Element entfernt, in welches ein Objekten gezogen werden soll. Es wird auch aufgerufen, wenn ein Objekt in ein Element gezogen wurde. Es ist ähnlich zum mouseout Ereignis, tritt aber nur beim Hineinlegen von Objekten auf.
+ Attribut: ondragexit

+
+

draggesture

+ 		+

Dieses Ereignis wird gesendet, wenn der Benutzer beginnt ein Element zu ziehen, normalerweise in dem die Maustaste gedrückt und bewegt wird.
+ Attribut: ondraggesture

+
+

dragover

+ 		+

Ähnlich zum mousemove Ereignis wird dieses Ereignis gesendet, während etwas über ein Element gezogen wird. Die Behandlungsroutine sollte angeben, ob das Objekt gezogen wird oder abgelegt werden kann.
+ Attribut: ondragover

+
+

input

+ 		+

Dieses Ereignis wird gesendet, wenn der Benutzer einen Text in ein Textfeld eingibt. Das Ereignis wird nur dann aufgerufen, wenn der angezeigte Text verändert wird, daher wird es nicht aufgerufen, wenn der Benutzer Tasten drückt, die nicht in einem Textfeld dargestellt werden.
+ Attribut: oninput

+
+

overflow

+ 		+

Dieses Ereignis wird nur zu einer Box oder einem anderen Layoutelement gesendet, wenn die CSS overflow Eigenschaft auf einen anderen Wert als 'visible' festgelegt wird. Falls nicht genug Platz vorhanden ist, um den Inhalt des Elements vollständig anzuzeigen, wird das overflow Ereignis gesendet. Abhängig vom Wert der overflow Eigenschaft treten eventuell Scrollbalken auf. Wenn zum Beispiel eine Box eine maximale Größe von 100 Pixeln besitzt und nur genug Platz für 80 Pixel verfügbar ist, wird das overflow Ereignis zur Box gesendet. Wenn sich die Größe verändert, zum Beispiel durch den Benutzer, der die Fenstergröße ändert, wird das underflow Ereignis gesendet, wenn genug Platz frei wird.
+ Attribut: onoverflow

+
+

popuphidden

+ 		+

Dieses Ereignis wird einem Popup gesendet, nachdem er versteckt wurde.
+ Attribut: onpopuphidden

+
+

popuphiding

+ 		+

Dieses Ereignis wird einem Popup gesendet, wenn es versteckt wird.
+ Attribut: onpopuphiding

+
+

popupshowing

+ 		+

Dieses Ereignis wird einem Popup gesendet, bevor dieser angezeigt wird. Diese Behandlungsroutine wird normalerweise verwendet, um Inhalte dynamisch festzulegen, wenn der Benutzer eine Anfrage stellt diese anzuzeigen. Wird false vom Eventhandler zurückgegeben, wird die Anzeige des Popups verhindert.
+ Attribut: onpopupshowing

+
+

popupshown

+ 		+

Dieses Ereignis wird einem Popup gesendet, nachdem er geöffnet wurde, sehr ähnlich zum onload Ereignis, welches gesendet wird, wenn ein Fenster geöffnet wurde.
+ Attribut: onpopupshown

+
+

syncfrompreference

+ 		+

Dieses Ereignis wird gesendet, wenn das Element verändert wurde, weil eine Einstellung geändert wurde oder wenn ein Element von einer Einstellung initialisiert wurde. Dieses Ereignis wird nur an Elemente gesendet, die mit einer Einstellung verbunden sind und in prefwindow vorhanden sind. Das ist kein wirkliches Ereignis, es ist ein Funktionsaufruf und muss die Attributschreibweise verwenden. Das Skript kann einen Wert zurück liefern, um dem Element auf einen spezifischen Wert zu geben, als den Wert der Einstellung. Dieses Ereignis wird normalerweise verwendet, um einen Wert einzustellen, sodass es passender für die Anzeige in der Benutzeroberfläche gemacht werden kann.
+ Attribut: onsyncfrompreference

+
+

synctopreference

+ 		+

Dieses Ereignis wird gesendet, wenn ein Element, das mit einer Einstellung verbunden ist, verändert wurde. ieses Ereignis wird nur an Elemente gesendet, die mit einer Einstellung verbunden sind und in prefwindow vorhanden sind. Das ist kein wirkliches Ereignis, es ist ein Funktionsaufruf und muss die Attributschreibweise verwenden. Das Skript kann einen Wert zurück liefern, um dem Element auf einen spezifischen Wert zu geben, als den Wert der Einstellung.
+ Attribut: onsynctopreference

+
+

underflow

+ 		+

Dieses Ereignis wird einem Element gesendet, wenn genug Platz vorhanden ist, um es vollständig anzuzeigen. Das betrifft Boxen und andere Layoutelement mit der CSS overflow Eigenschaft, die einen anderen Wert als 'visible' besitzen. Das underflow Ereignis kann verwendet werden, um zu ermitteln, dass ein Scrollmechanismus nicht länger benötigt wird.
+ Attribut: onunderflow

+
+

DOMMenuItemActive

+ 		+

Dieses Ereignis wird gesendet, wenn ein Menü oder Menüitem hervorgehoben wird oder die Maus darüber schwebt.

+
+

DOMMenuItemInactive

+ 		+

Dieses Ereignis wird gesendet, wenn ein Menü oder Menüitem nicht länger hervorgehoben wird oder die Maus nicht länger darüber schwebt.

+
+ +

Ereignisse zur Zugänglichkeit (Accessibility)

+ +

Mit diesen Ereignissen wird das Zugänglichkeitssystem über Veränderungen an einem Element benachrichtigt. Sie würden diese normalerweise nicht selbst verwenden.

+ + + + + + + + + + + + + + + + +
EreignisBeschreibung
+

CheckboxStateChange

+ 		+

Dieses Ereignis wird gesendet, wenn eine checkbox angekreuzt oder nicht angekreuzt wird, entweder vom Benutzer oder von einem Skript. Normalerweise würde ein command Ereignis zur Abfrage der checkbox Veränderungen verwendetet werden, das command Ereignis wird aber nur gesendet, wenn der Benutzer den Wert verändert, während das CheckboxStateChange Ereignis auch gesendet wird, wenn ein Skript die checked Eigenschaft einer checkbox verändert. Bei Änderungen vom Benutzer wird das CheckboxStateChange Ereignis vor dem command Ereignis gesendet.

+
+

RadioStateChange

+ 		+

Dieses Ereignis wird gesendet, wenn ein Radiobutton ausgewählt wird, entweder vom Benutzer oder von einem Skript. Normalerweise würde ein command Ereignis zur Abfage der Veränderungen am Radiobutton verwendet werden, das command Ereignis wird aber nur gesendet, wenn der Benutzer den ausgewählten Radiobutton verändert, während das RadioStateChange Ereignis auch gesendet wird, wenn ein Skript die Auswahl verändert. Bei Änderungen vom Benutzer wird das RadioStateChange Ereignis vor dem command Ereignis gesendet.

+
+ +

{{ languages( { "en": "en/XUL/Events", "es": "es/XUL/Events", "ja": "ja/XUL/Events", "pl": "pl/XUL/Zdarzenia" } ) }}

diff --git a/files/de/archive/mozilla/xul/grippy/index.html b/files/de/archive/mozilla/xul/grippy/index.html new file mode 100644 index 0000000000..73061bf15a --- /dev/null +++ b/files/de/archive/mozilla/xul/grippy/index.html @@ -0,0 +1,88 @@ +--- +title: grippy +slug: Archive/Mozilla/XUL/grippy +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/grippy +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Ein Element, das in einem splitter-Element verwendet werden kann. Es ermöglicht das Zusammenklappen eines Geschwisterelements des Trenners.

+

Weitere Informationen im XUL Tutorial.

+

Beispiele

+

(Beispiel benötigt)

+

Attribute

+ + + + + + +

Geerbt von XUL-Element
+align, +allowevents, +allownegativeassertions, +class, +coalesceduplicatearcs, +collapsed, +container, +containment, +context, +contextmenu, +datasources, +dir, +empty, +equalsize, +flags, +flex, +height, +hidden, +id, +insertafter, +insertbefore, +left, +maxheight, +maxwidth, +menu, +minheight, +minwidth, +mousethrough, +observes, +ordinal, +orient, +pack, +persist, +popup, +position, +preference-editable, +querytype, +ref, +removeelement, +sortDirection, +sortResource, +sortResource2, +statustext, +style, +template, +tooltip, +tooltiptext, +top, +uri, +wait-cursor, +width

+
+

Eigenschaften

+ +

Geerbte Eigenschaften
align, , allowEvents, , boxObject, builder, , , , className, , , , , collapsed, contextMenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxHeight, maxWidth, menu, minHeight, minWidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statusText, style, ,, tooltip, tooltipText, top, width
+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+

Verwandt

+

TBD

diff --git a/files/de/archive/mozilla/xul/iframe/index.html b/files/de/archive/mozilla/xul/iframe/index.html new file mode 100644 index 0000000000..7d5fa181af --- /dev/null +++ b/files/de/archive/mozilla/xul/iframe/index.html @@ -0,0 +1,161 @@ +--- +title: iframe +slug: Archive/Mozilla/XUL/iframe +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/iframe +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Ein innerer Frame, der in etwa wie das iframe-Element von HTML funktioniert. Das Attribut src gibt den Inhalt des Frames an. Dieser Inhalt befindet sich in einem separaten Dokument. Jegliche Kindelemente des iframe Elements werden ignoriert.

+

Weitere Informationen sind im XUL Tutorial verfügbar.

+
Attribute
showcaret, src, type, transparent
Eigenschaften
accessibleType, contentDocument, contentWindow, docShell, webNavigation
+
+

Beispiele

+
<iframe src="table.php" flex="2" id="browserTable" name="table_frame"/>
+
+

Einen URL aus einem Menü auswählen

+
<menulist oncommand="doNav(this);">
+  <menupopup>
+    <menuitem label="Mozilla" value="http://mozilla.org" />
+    <menuitem label="Slashdot" value="http://slashdot.org"/>
+    <menuitem label="Sourceforge" value="http://sf.net" />
+    <menuitem label="Freshmeat" value="http://freshmeat.net"/>
+  </menupopup>
+</menulist>
+
+
+<iframe id="myFrame" flex="1"/>
+
+<script>
+function doNav(obj){
+  var url = obj.selectedItem.value;
+  // note the firstChild is the menupopup element
+  document.getElementById('myFrame').setAttribute('src', url);
+}
+</script>
+
+

Attribute

+
+ + +
+
showcaret
+
Type: boolean
+
Whether or not to cause a typing caret to be visible in the content area. Default is false.
+
+ + +
+ +
+
+ src
+
+ Typ: URL
+
+ Die URL des im Element anzuzeigenden Inhalts.
+
+ +
+ + +
+
type
+
Type: one of the values below.
+
The type of browser, which can be used to set access of the document loaded inside the browser. If this is not set, the loaded document has the same access as the window containing the browser. More precisely: The document loaded into a chrome window is always of chrome type. Subdocuments of chrome documents are of chrome type, unless the container element (one of iframe, browser or editor) has one of the special type attribute values (the common ones are content, content-targetable and content-primary) indicating that the subdocument is of content type. This boundary has a number of special effects, such as making window.top == window (unless the browser is added to a chrome document), and preventing documents from inheriting the principal of the parent document. The type attribute on all frames in content documents is ignored; subdocuments of content documents are always content documents.
+
+
Warning: The type attribute must be set before the element is inserted into the document.
+
+
+
+
content
+
A browser for content. The content that is loaded inside the browser is not allowed to access the chrome above it.
+
content-primary
+
The primary browser for content. The content that is loaded inside the browser is not allowed to access the chrome above it. For instance, in a web browser, this would be the element that displays the web page. The window for the primary content can be retrieved more conveniently using window.content.
+
content-targetable
+
One browser among many for content. The content that is loaded inside the browser is not allowed to access the chrome above it. This is the preferred value for any browser element in an application, which will use multiple browsers of equal privileges, and is unselected at the moment.
+
chrome
+
(default behaviour): A browser, intended to be used for loading privileged content using a chrome:// URI. Don't use for content from web, as this may cause serious security problems!
+
+
+
+ + +
+
transparent
Type: one of the values below
Set the background of an iframe as transparent.
transparent
This results in the iframe's background being transparent. This can be used to workaround things like bug 540911
+
+
+ + + + + +

Geerbt von XUL-Element
+align, +allowevents, +allownegativeassertions, +class, +coalesceduplicatearcs, +collapsed, +container, +containment, +context, +contextmenu, +datasources, +dir, +empty, +equalsize, +flags, +flex, +height, +hidden, +id, +insertafter, +insertbefore, +left, +maxheight, +maxwidth, +menu, +minheight, +minwidth, +mousethrough, +observes, +ordinal, +orient, +pack, +persist, +popup, +position, +preference-editable, +querytype, +ref, +removeelement, +sortDirection, +sortResource, +sortResource2, +statustext, +style, +template, +tooltip, +tooltiptext, +top, +uri, +wait-cursor, +width

+
+

Eigenschaften

+

+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+

Verwandte Themen

+
Schnittstellen
nsIAccessibleProvider
+
diff --git a/files/de/archive/mozilla/xul/index.html b/files/de/archive/mozilla/xul/index.html new file mode 100644 index 0000000000..d275bb0520 --- /dev/null +++ b/files/de/archive/mozilla/xul/index.html @@ -0,0 +1,83 @@ +--- +title: XUL +slug: Archive/Mozilla/XUL +tags: + - XUL +translation_of: Archive/Mozilla/XUL +--- +
XUL Tutorial
+Ein geführter Leitfaden für einen schnellen Einstieg in XUL, ursprünglich von XULPlanet.
+ +
XUL (XML User Interface Language) ist Mozillas XML-basierte Beschreibungssprache, die plattformübergreifende Anwendungen ermöglicht, die unabhängig von einer bestehenden Internetverbindung ausgeführt werden können. Diese Anwendungen können leicht (z.B. sprachlich) mittels alternativen Texten oder Layouts und alternativer Grafik angepasst werden. Web-Entwickler, die bereits mit dynamischen HTML (DHTML) vertraut sind, finden sich schnell in XUL zurecht und können direkt mit dem Bauen von Anwendungen beginnen. Das XUL Periodensystem zeigt in Firefox oder einem anderen Gecko-basierten Browser einige XUL-Demos, die einen guten Überblick liefern.
+ + + + + + + + +
+

Dokumentation

+ +
+
XUL Referenz
+
XUL Elemente, Attribute, Eigenschaften, Methoden, und Eventhandler.
+
XUL Bedienelemente
+
Eine kurze Liste aller verfügbaren XUL Bedienelemente.
+
XUL School
+
Eine sehr ausführliche Tutorial-Reihe über die Entwicklung von Add-ons in Mozilla.
+
XUL Überblick
+
Beschreibung der wichtigsten Eigenschaften und Komponenten von XUL.
+
Menüs und Popups
+
Ein Leitfaden zur Verwendung von Menüs und Popup-Panels.
+
Leitfaden für Vorlagen
+
Ein detaillierter Leitfaden für XUL Vorlagen (Templates), einem Mittel zur Erzeugung von Inhalt aus Datenquellen.
+
Drag und Drop
+
Wie man Drag und Drop Operationen ausführen kann.
+
XUL Anwendungen für Firefox 3 anpassen
+
Eine Liste von Änderungen in Firefox 3.0, die XUL-Entwickler betreffen.
+
XUL Anwendungen für Firefox 2 anpassen
+
Eine Liste von Änderungen in Firefox 2.0, die XUL-Entwickler betreffen.
+
XUL Anwendungen für Firefox 1.5 anpassen
+
Eine Liste von Änderungen in Firefox 1.5, die XUL-Entwickler betreffen.
+
+ +

Alle anzeigen...

+ +
+
+ 		+

Community

+ +
    +
  • Mozillas XUL Foren:
    • +
+ +

{{ DiscussionList("dev-tech-xul", "mozilla.dev.tech.xul") }}

+ + + +

Tools

+ + + +

Verwandte Themen

+ +
+
JavaScript, XBL, CSS, RDF, Erweiterungen, XULRunner
+
+
+ +

{{ languages( { "en": "en/XUL", "es": "es/XUL", "fr": "fr/XUL", "it": "it/XUL", "ja": "ja/XUL", "ko": "ko/XUL", "pl": "pl/XUL", "pt": "pt/XUL", "ru": "ru/XUL", "zh-cn": "cn/XUL", "zh-tw": "zh_tw/XUL" } ) }}

diff --git a/files/de/archive/mozilla/xul/method/geticon/index.html b/files/de/archive/mozilla/xul/method/geticon/index.html new file mode 100644 index 0000000000..cb0dd30447 --- /dev/null +++ b/files/de/archive/mozilla/xul/method/geticon/index.html @@ -0,0 +1,15 @@ +--- +title: getIcon +slug: Archive/Mozilla/XUL/Method/getIcon +translation_of: Archive/Mozilla/XUL/Method/getIcon +--- +
+ « XUL-Referenz Startseite
+
+
+ getIcon( aTab )
+
+ Return type: string
+
+ Returns the URL of the specified tab's favicon. If aTab is null, the current tab's icon is returned. See setIcon to set the icon.
+
diff --git a/files/de/archive/mozilla/xul/method/gettabforbrowser/index.html b/files/de/archive/mozilla/xul/method/gettabforbrowser/index.html new file mode 100644 index 0000000000..bc48db12b9 --- /dev/null +++ b/files/de/archive/mozilla/xul/method/gettabforbrowser/index.html @@ -0,0 +1,15 @@ +--- +title: getTabForBrowser +slug: Archive/Mozilla/XUL/Method/getTabForBrowser +translation_of: Archive/Mozilla/XUL/Method/getTabForBrowser +--- +
+ « XUL-Referenz Startseite
+
+
+ getTabForBrowser( browser )
+
+ Return type: tab
+
+ Returns the XUL tab which contains the specified browser.
+
diff --git a/files/de/archive/mozilla/xul/method/index.html b/files/de/archive/mozilla/xul/method/index.html new file mode 100644 index 0000000000..934c525318 --- /dev/null +++ b/files/de/archive/mozilla/xul/method/index.html @@ -0,0 +1,14 @@ +--- +title: Methoden +slug: Archive/Mozilla/XUL/Method +tags: + - XUL Methoden + - XUL Referenz +translation_of: Archive/Mozilla/XUL/Method +--- +

« XUL-Referenz Startseite

+ +

Verwandte DOM-Element Methoden

+ diff --git a/files/de/archive/mozilla/xul/school_tutorial/adding_menus_and_submenus/index.html b/files/de/archive/mozilla/xul/school_tutorial/adding_menus_and_submenus/index.html new file mode 100644 index 0000000000..e48c15eade --- /dev/null +++ b/files/de/archive/mozilla/xul/school_tutorial/adding_menus_and_submenus/index.html @@ -0,0 +1,99 @@ +--- +title: Adding menus and submenus +slug: Archive/Mozilla/XUL/School_tutorial/Adding_menus_and_submenus +translation_of: Archive/Add-ons/Overlay_Extensions/XUL_School/Adding_menus_and_submenus +--- +

{{ PreviousNext("XUL_School/Setting_Up_a_Development_Environment", "XUL_School/Adding_Toolbars_and_Toolbar_Buttons") }}

+

The Hello World example in the previous sections shows the two most common ways to add menus. In this section we'll look into more specialized menus and what you can do with them.

+

Adding a New Menu

+

We already saw how to add menus in overlays and, as you may have imagined, you can nest submenus as deep as you want. You should avoid having deep menus or too many options, since they are confusing for most users.

+

If your extension requires custom XUL windows, you may also need to have menus on those windows. You can do this with a menubar. The menubar element should be a child of a toolbox element because it is treated like another toolbar on systems other than Mac OS X.

+
+

Mac OS X treats menus in a very different way than other systems. If your extension involves menus in any way, you should test it on Mac OS X to make sure everything works adequately.

+
+

The toolbox should be positioned near the top of the XUL document, and the code should be similar to this:

+
<toolbox>
+  <menubar id="xulschoolhello-menubar">
+    <menu id="xulschoolhello-greeting-menu" label="&xulschoolhello.greeting.label;">
+      <menupopup>
+        <menuitem label="&xulschoolhello.greet.short.label;"
+          oncommand="XULSchoolChrome.GreetingDialog.greetingShort(event);" />
+        <menuitem label="&xulschoolhello.greet.medium.label;"
+          oncommand="XULSchoolChrome.GreetingDialog.greetingMedium(event);" />
+        <menuitem label="&xulschoolhello.greet.long.label;"
+          oncommand="XULSchoolChrome.GreetingDialog.greetingLong(event);" />
+        <menuseparator />
+        <menuitem label="&xulschoolhello.greet.custom.label;"
+          oncommand="XULSchoolChrome.GreetingDialog.greetingCustom(event);" />
+      </menupopup>
+    </menu>
+  </menubar>
+</toolbox>
+

This code displays a simple menu with options for 3 different types of greetings, a menuseparator, and finally an option to show a custom greeting. The separator is usually displayed as a horizontal line that creates a logical division between different types of menuitem elements, keeping everything more organized.

+

A menubar can hold one or more menu elements. Menus require a menupopup element as a container for its children, which are usually menuitem elements, but can also be menuseparator, or menu in order to have multiple nesting levels:

+
<toolbox>
+ <menubar id="xulschoolhello-menubar">
+    <menu id="xulschoolhello-greeting-menu" label="&xulschoolhello.greeting.label;">
+      <menupopup>
+        <menu id="xulschoolhello-greeting-sizes-menu" label="&xulschoolhello.greetingSizes.label;">
+          <menupopup>
+            <menuitem label="&xulschoolhello.greet.short.label;"
+              oncommand="XULSchoolChrome.GreetingDialog.greetingShort(event);" />
+            <menuitem label="&xulschoolhello.greet.medium.label;"
+              oncommand="XULSchoolChrome.GreetingDialog.greetingMedium(event);" />
+            <menuitem label="&xulschoolhello.greet.long.label;"
+              oncommand="XULSchoolChrome.GreetingDialog.greetingLong(event);" />
+          </menupopup>
+        </menu>
+        <menuitem label="&xulschoolhello.greet.custom.label;"
+          oncommand="XULSchoolChrome.GreetingDialog.greetingCustom(event);" />
+      </menupopup>
+    </menu>
+  </menubar>
+</toolbox>
+

In this case we grouped the 3 greeting items into a submenu. It doesn't make much sense to do that in this case because we end up with only two menu items, one of them being a menu with 3 child items.

+

You can also have menus that are filled dynamically. Instead of setting the menupopup directly in the XUL, you can use the onpopupshowing event to fill the children when the popup is about to be displayed. DOM functions like createElement and appendChild can be used to accomplish this.

+
+

If you have nothing to show on a menu, you should follow the standard used in Firefox: show a single disabled item with an "(Empty)" label.

+

If filling your menu takes a noticeable amount of time, you should not make Firefox (and your users) wait for it to fill up before displaying anything. It's best to show an item with a throbber image (see chrome://global/skin/icons/loading_16.png) so the user knows there's something going on, and asynchronously fill its contents. We'll look into some asynchronous techniques further ahead in the tutorial.

+
+

Adding Elements to Existing Menus

+

Just as explained in the previous sections, the best place to overlay your extension menu is inside the Tools menu. That is, unless there's a place inside the menu structure where your extension menus make more sense. If you're overlaying the Tools menu, your overlay code should have something like this:

+
<menupopup id="menu_ToolsPopup">
+  <menu id="xulschoolhello-hello-menu" label="&xulschoolhello.hello.label;"
+    accesskey="&xulschoolhello.helloMenu.accesskey;"
+    insertafter="javascriptConsole,devToolsSeparator">
+    <menupopup>
+      <!-- Your menuitem goes here. -->
+    </menupopup>
+  </menu>
+</menupopup>
+

Now let's look at some specialized types of menu items.

+ +

Checkbox Menu Items

+

You can make a menuitem "checkable" to allow the user to enable/disable options using the menu. We use two attributes for this: type and checked. The type attribute must be set to "checkbox". You can set the checked attribute to "true" to check it by default.

+

The item's checked state changes when the user clicks on it. An example of one such item is the View > Status Bar item in the main Firefox menu.

+

Radio Menu Items

+

If you need to have a set of menuitem elements where only one of them has to be checked at any given moment, you should set the type to "radio". The name attribute is used to identify the items that belong to the radio group.

+
<menupopup oncommand="XULSchoolChrome.HW.GreetingDialog.greeting(event);">
+  <menuitem type="radio" name="xulschoolhello-greeting-radio"
+    label="&xulschoolhello.greet.short.label;" checked="true" />
+  <menuitem type="radio" name="xulschoolhello-greeting-radio"
+    label="&xulschoolhello.greet.medium.label;" />
+  <menuitem type="radio" name="xulschoolhello-greeting-radio"
+    label="&xulschoolhello.greet.long.label;" />
+</menupopup>
+

This is a modified version of the 3 greeting menus. It is now implemented as a radio menu where you pick one of the 3 available choices. The first one is checked by default. The oncommand attribute is set on the menupopup to avoid code duplication, since now the 3 items call the same function.

+

Another example of a menu like this is the View > Sidebars menu. Only one sidebar is visible at any given moment, and you can pick from several.

+ +

To add an icon to a menu or menuitem, set its class to "menu-iconic" or "menuitem-iconic" respectively, and set the image attribute or the list-style-image CSS property. Menu icons are typically 16px by 16px.

+ +

As mentioned earlier, menus are very different on Mac OS X. This is because menus on Mac are located in a single menu bar which is controlled by the operating system, as opposed to menus in other systems, which are entirely controlled by Firefox. Mac OS X also has menu standards, such as the positioning of certain items that are not used in other systems. Here's a list of the known issues we've run into when handling menus on Mac:

+ +

{{ PreviousNext("XUL_School/Setting_Up_a_Development_Environment", "XUL_School/Adding_Toolbars_and_Toolbar_Buttons") }}

+

This tutorial was kindly donated to Mozilla by Appcoast.

diff --git a/files/de/archive/mozilla/xul/school_tutorial/die_grundlagen_einer_erweiterung/index.html b/files/de/archive/mozilla/xul/school_tutorial/die_grundlagen_einer_erweiterung/index.html new file mode 100644 index 0000000000..cda64ab5a8 --- /dev/null +++ b/files/de/archive/mozilla/xul/school_tutorial/die_grundlagen_einer_erweiterung/index.html @@ -0,0 +1,454 @@ +--- +title: Die Grundlagen einer Erweiterung +slug: Archive/Mozilla/XUL/School_tutorial/Die_Grundlagen_einer_Erweiterung +translation_of: Archive/Add-ons/Overlay_Extensions/XUL_School/The_Essentials_of_an_Extension +--- +

{{ PreviousNext("XUL_School/Getting_Started_with_Firefox_Extensions", "XUL_School/Setting_Up_a_Development_Environment") }}

+ +

Die install.rdf Datei

+ +

In der letzten Lektion haben wir uns den Inhalt der Hello World Erweiterung angesehen.Jetzt werfen wir einen Blick in diese Dateien und den Code, beginnen wir mit der install.rdf Datei. Sie können diese mit jedem Texteditor öffnen.

+ +

Die Datei ist in einem speziellen Dialekt von XML, RDF genannt formatiert. RDF wird eingesetzt als ein zentraler Speichermechanismus für Forefox, aber es ist jetzt durch ein einfacheres Datenbanksystem ersetzt worden. Wir werden später in diesem Tutorial beide Speichersystem besprechen.

+ +

Nehmen wir jetzt einen genaueren Blick auf die wichtigen Teile der Datei.

+ +
+
+
<em:id>helloworld@xulschool.com</em:id>
+
+
+ +

Dies ist der eindeutige Bezeichner für die Erweiterung. Firefox benötigt diesen für die Unterscheidung eurer Erweiterung von anderen Erweiterungen, aufgrunddessen ist es erforderlich das Sie eine ID haben die eindeutig ist.

+ +

Es gibt zwei akzeptierte Standards für Add-on ID`s. Eine ist das E-Mail ähnliche Format in dem Hello World Beispiel, dieses sollte folgendermaßen aufgebaut sein <project-name>@<yourdomain>. Die andere standard Vorgehensweise ist die Verwendung eines erzeugten UUID-Strings, welcher sehr unwahrscheinlich duppliziert ist. UNIX-basierte Systeme haben ein Kommandozeilenprogramm mit dem Namen uuidgen das diese UUID`S erzeugt. Auch gibt es herunterladbare Anwendungen für alle Plattformen die diese gnerieren. Die umschließenden Klammern sind nur ein Teil der Notation und hierbei handelt es sich nur um die gängige Praxis. Solange Ihre ID etwas eindeutiges hat, ist es OK diese in irgendeiner Form zu verwenden.

+ +
+
+
<em:name>XUL School Hello World</em:name>
+<em:description>Welcome to XUL School!</em:description>
+<em:version>0.1</em:version>
+<em:creator>Appcoast</em:creator>
+<em:homepageURL>https://developer.mozilla.org/en-US/docs/XUL_School</em:homepageURL>
+ +

Dies sind die Informationen die angezeigt werden bevor und nachdem die Erweiterung installiert ist, die Sie im Add-on Manager sehen können. Es können viele weitere Tags für Beteiligte und Übersetzer hinzugefügt werden. Die vollständige Spezifikation der install.rdf Datei beinhaltet alle Details.

+ +

Seit Erweiterungen in mehrere Sprachen übersetzt werden können, ist es oft notwendig die Erweiterungsbeschreibung zu übersetzen, oder sogar deren Namen. Eine lokal begrenzte Beschreibung und Name kann mit dem folgenden Code hinzugefügt werden.

+
+
+ +
+
+
<em:localized>
+  <Description>
+    <em:locale>es-ES</em:locale>
+    <em:name>XUL School Hola Mundo</em:name>
+    <em:description>Bienvenido a XUL School!</em:description>
+  </Description>
+</em:localized>
+
+
+ +

Der es-Es lokale String bedeutet das dies die spanische (es) lokalisierung für Spanien (ES) ist. Sie können soviele <em:localized> Sektionen hinzufügen wie Sie benötigen. Für Friefox 2, ist die lokaliesierungs Datei etwas komplizierter. Wir werden im weiteren die lokalisierung in diesem Kapitel besprechen.

+ +
+
+
<em:type>2</em:type>
+
+
+ +

Dies bestimmt, dass das Add-on als eine Erweiterung installiert wird. Sie können die verschieden möglichen Typen in der install.rdf Spezifikation nachlesen.

+ +
+
+
<em:targetApplication>
+  <Description>
+    <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
+    <em:minVersion>4.0</em:minVersion>
+    <em:maxVersion>10.*</em:maxVersion>
+  </Description>
+</em:targetApplication>
+
+
+
+ +

Dieser Knoten spezifiziert die Zielanwendung und die Zielversion für die Erweiterung, in der Regel Firefox von Version 4 bis zu Version 10. Die UUID ist die eindeutige ID von Firefox. Ander Mozilla und Mozillabasierte Anwendenungen wie z.B. Thunderbirf und Seamonkey besitzen ihre eigene. Es ist möglich eine Erweiterung zu besitzen die auf mehreren Anwendungen und Versionen arbeitet. Als Beispiel , wenn Sie eine Firefox-Erweiterung entwickeln, wird es in der Regel wenig Aufwand erfordern diese zu SeaMonkey zu portieren, welches ähnliche Features und Benutzeroberflächen besitzt.

+ +

Die min und max Version Angabe spezifiziert den Versionbereich in dem die Erweiterung installiert werden kann. Hier gibt es mehr Informationen über das Versionsformat. Wenn die Anwendung nicht mit dem Versionsbereich übereinstimmt, wird es Ihnen nicht erlaubt sein die Anwendung zu installieren, oder die Erweiterung wird mit einem gesetzten deaktiviert Status installiert. Benutzer können Versionsüberprüfungen über die Einstellungen deaktivieren, oder durch die Installation von Add-on`s wie den Add-on Compatibility Reporter. Mit Anfang des Firefox 11, werden Add-on`s standardmäßig als kompatiel betrachtet und Firefox wird den Versionsbereich weitesgehend ignorieren. Das Testen Ihrer Add-on`s auf allen Firefoxversionen ist immer empfehlenswert.

+ +

Diese Informationen werden von Firefox und anderen Mozillaanwendungen benötigt um ein Add-on zu installieren. Jeder Fehler oder fehlende Informationen werden den Installationsprozess zum Scheitern bringen, oder die Erweiterung wird mit einem gesetzten deaktvitiert Status installiert.

+ +

The chrome.manifest File

+ +
+

Chrome is the set of user interface elements of the application window that are outside of a window's content area. Toolbars, menu bars, progress bars, and window title bars are all examples of elements that are typically part of the chrome.

+
+ +

Auszug aus der Chrome Registration.

+ +

Mit anderen Worten, Chrome ist alles was Sie im Firefox sehen. Alle Firefoxfenster können betrachtet werden als Zusammensetzung zweier Teilbereiche: (1) Chrome und (2) ein möglicher Inhaltsbereich, wie das das in Firefox die Anzeige von Webseiten übernimmt. Fenster wie das Downloadfenster sind ausschließlich Chrome. Der Großteil des Programmcodes einer Erweiterung liegt im Chromeordner, wie bei dem Hello World Beispiel.

+ +

Wie wir in der Ordnerstruktur der entpackten Erweiterung gesehen haben, Chrome ist zusammengesetzt aus drei Teilbereichen: content, locale und skin. Diese drei sind notwendig für die meisten Erweiterungen. Wenn wir die chrome.manifest-Datei erneut öffnen (nochmals jeder Texteditor kann hierfür verwendet werden), werden wir diese drei angesprochenen Teilbereiche erkennen können.

+ +
+
+
content   xulschoolhello              content/
+skin      xulschoolhello  classic/1.0 skin/
+locale    xulschoolhello  en-US       locale/en-US/
+
+
+
+ +

Die chrome.manifest Datei lässt Firefox wissen, wo es nach den Chromedateien zu suchen hat. Der Text ist formatiert so das er dem Aussehen einer Tabelle gleicht, aber dies ist nicht notwendig. Der Parser ignoriert aufeinanderfolgende Leerzeichen.

+ +

Das erste Wort in einer Zeile teilt Firefox mit, was angegeben ist (content, skin, locale, oder weiter Angaben, die später erwähnt werden). Das zweite ist der Paketname, was wir demnächst erklären werden.

+ +

Darstellungs und lokale Packete besitzen einen dritten Wert, um zu spezifizieren welche lokale oder welche Darstellung sie erweitern. Es können mehrere Darstellungs und lokale Einträge für unterschiedliche Darstellung und lokalisierungs Variablen eingetragen werden. Der häufigste Fall ist es einen Darstellungeintrag für die gloabe Darstellung zu haben , classic/1.0, und mehrere lokale Einträge, einen für jede Übersetzung. Am Ende wird eine Ortsvariable spezifizerit.

+ +

Es gibt einige zusätzliche Optionen, die in die Einträge der chrome.manifest Datei eingefügt werden können. Diese sind auf der Chrome Registration Seite dokumentiert. Beachtenswert ist, wir können Einträge erstellen, die Betriebssystem spezifisch sind. Dies ist wichtig, weil das Aussehen des Browsers ist sehr unterschiedlich für jedes Betriebssystem. Wenn es notwendig ist, dass Ihre Erweiterung auf verschieden Systemen unterschiedlich aussieht, könnten wir das Manifest so anpassen, dass es aussieht wie hier:

+ +
+
+
content   xulschoolhello              content/
+skin      xulschoolhello  classic/1.0 skin/unix/
+skin      xulschoolhello  classic/1.0 skin/mac/ os=Darwin
+skin      xulschoolhello  classic/1.0 skin/win/ os=WinNT
+locale    xulschoolhello  en-US       locale/en-US/
+
+
+
+ +

Über diesen Weg können wir unterschiedliche Darstellungen für Windows, Mac OS X und Linux (plus anderer unix-ähnlichen Systemen) haben, die jede von ihnen in einer seperaten Ordnerstruktur definiert ist. Seit die meisten anderen System Unix-basiert sind, ist die "unix" Darstellung der Standard ohne weitere Marker.

+ +

Chrome

+ +

Wie zuvor angesprochen Chrome besteht aus 3 Teilbereichen: content, locale und skin. Der content-Bereich ist der wichtigste Bereich, beinhaltet die Benutzerschnittstelle (XUL) und Skriptdateien (JA). Der Darstellungsbereich beinhaltet die Dateien die das Meiste des Aussehen und Verhalten der UI (mit Einsatz von CSS und Bildern, wie bei Webseiten) definieren. Abschließend enthält der locale Bereich den gesamten in der Erweiterung verwendeten Text, in DTD und die Einstellungsdateien. Diese Aufteilung erlaubt es anderenen Entwicklern Themes zu entwickeln die die Darstellung ersetzen und Übersetzer für andere Sprachen, all das ohne das eine Änderung der Erweiterung oder des Programmcodes notwendig wäre. Dies gibt Firefox Erweiterungen eine großartige Flexibiltät.

+ +

Chrome Dateien werden über das Chrome-Protokoll zugewiesen. So sieht eine chrome URI aus:

+ +
+
+
chrome://packagename/section/path/to/file
+ +

Wenn ich beispielsweise Zugriff auf die Datei browserOverlay.xul haben möchte, wäre die Chrome URI chrome://xulschoolhello/content/browserOverlay.xul.

+
+
+ +

Wenn Sie zu viele Dateien im content Bereich habe und Sie diese in Subordner organisieren wollen, gibt es nichts was Sie im chrome.manifest ändern müssen, alles was Sie benötigen ist den richtigen Pfad nach content in die URI hinzuzufügen.

+ +

Darstellungs- und Regions-Dateien arbeiten in der selben Art und Weise, und Sie müssen keine Darstellungs- oder Regions -Namen festleggen. Also um auf die DTD-Datei in der Hello Wolrd Erweiterung zuzugreifen, ist der Chromepfad chrome://xulschoolhello/locale/browserOverlay.dtd. Firefox was anschließend nach welcher Region es abrufen muss.

+ +

Hier ist ein interesantes Experiment. Öffne ein neues Firefox Tab, tippe chrome://mozapps/content/downloads/downloads.xul in deine Adressleiste und drücke Enter. Überrascht? Sie haben soeben das Downloadfenster in einem Firefoxtab geöffnet! Sie können auf jede Chromedatei zugreifen indem Sie die URI in die Addressleite eintippen. Dies kann nützlich werden, wenn du Skriptdatei untersuchen möchtest, die ein Teil von Firefox, anderen Erweiterungen oder deine eigene sind. Die meisten dieser Dateien werden als Textdatei geöffnet, mit der Ausnahme von XUL-Dateien, diese werden ausgeführt und so dargestellt wie Sie diese normalerweise in einem Fenster sehen würden.

+ +

Content

+ +

Es gibt 2 Dateien im content Verzeichnis. Sehen wir uns zuerst die XUL-Datei an.

+ +

Bei XUL-Dateien handelt es sich um XML-Dateien, die Benutzeroberflächenelemente in Firefox und Firefoxerweiterungen definieren. XUL wurde von HTML inspiriert, von daher werden Sie viele Ähnlichkeiten zwischen den beiden feststellen. Wie auch immer, XUL ist auch eine Verbesserung gegenüber HTML, die aus vielen Fehlern gelernt hat, die bei der Entwickliung von HTML gemacht wurden. XUL erlaubt Ihnen reichere und interaktivere Oberflächen zu erstellen, als mit HTML, oder zumindest macht XUL es einfacher.

+ +

XUL-Dateien defineren in der Regel eine von zwei Dingen: Fenster oder Overlays. Die Datei die Sie zuvor geöffnet haben, downloads.xul, beinhaltet den Programmcode der das Downloadfenster definiert. Die XUL-Datei die in der Hello World Erweiterung eingeschlossen ist, ist eine Overlay. Ein Overlay erweitert ein vorhandes Fenster, fügt diesem neue Elemente hinzu oder ersetzt einige der Elemente in ihm. Die Zeile die wir in der chrome.manifest Datei übersprungen haben gibt an das es sich bei dieser XUL-Datei um ein Overlay für das Browserhauptfenster handelt:

+ +
+
+
overlay chrome://browser/content/browser.xul  chrome://xulschoolhello/content/browserOverlay.xul
+ +

Durch diese Zeile weiß Firefox, dass es die Inhalte aus browserOverlay.xul verwenden muss und diese über das Browserhauptfenster, browser.xul legen muss. Sie können für jedes Fenster oder Dialog in Firefox ein Overlay festlegen, aber ein Overlay über das Browserhauptfenster zu legen ist der mit Abstand häufigste Fall.

+ +

Jetzt nehme wir einen Blick auf unsere XUL-Datei. Wir werden die ersten paar Zeilen überspringen, weil diese sich auf die Darstellung und die Region beziehen, diese werden wir im späteren behandeln.

+
+
+ +
+
+
<overlay id="xulschoolhello-browser-overlay"  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+
+ +

Das Wurzelelement in dieser Datei ist ein Overlay. Andere XUL-Dokumente nutzen den window oder dialog Tag. Das Element besitzt einie eindeutige ID, welche Sie bei den meisten Element in Ihrer XUL vergeben sollten. Das zweite Attribut ist der Namensraum, diesen sollten Sie immer in Ihrem XUL-Wurzelelment definieren. Es sagt aus, dass dieser Knoten und alle Kindknotten XUL-Element sind. Sie brauchen nur änderungen an der Namensraum deklaration vornehmen, wenn Sie verschiedene Arten eines Inhalts in dem gleichen Dokument kombinieren, wie z.B. XUL mit HTML oder SVG.

+ +
+
+
You may have noticed the naming we use on several places, such as the id xulschoolhello-browser-overlay. This is the namespacing standard that we use to avoid conflicts with Firefox and other extensions, as well as making some development tasks easier. We namespace all ids and style classes in overlay elements because they will be mixed with other elements in the main browser window. If we used generic ids like container or input, they will likely conflict with ids used within Firefox, or with ids from other extension overlays. Using namespaces minimizes compatibility problems with other extensions. We use camel casing for file names, and all lower case with dashes for element ids and CSS style class names, but you're free to use your own system.
+
+
+ +
+
+
<script type="application/x-javascript"   src="chrome://xulschoolhello/content/browserOverlay.js" />
+
+
+ +

Wie in HTML, wird hierdurch eine JavaScript-Datei eingebunden. Sie können soviele Skriptelement in ein XUL-Dokumente einbinden wie Sie benötigen. Wir werden uns diesen Programmcode später noch ansehen.

+ +
+
+
You also probably noticed how we format our code, and wonder about the rules we follow. Our general rule on line length is not having lines longer than 80 characters. This feels very restrictive, specially with XML files, but the number was chosen to allow pretty much any text editor to handle these files easily. Even old command line editors work well with files that cut their lines at 80 characters. The tabulation is very straightforward: 2 blank space indents. We never use actual tab characters, with the exception of Makefiles, which will be covered later on. Most of our coding standards are based on Mozilla's or other known and used standards.
+
+
+ +

Wir werden etwas Programmcode übersprinder, der im Regionsbereich behandelt wird, um mit dem wichtigsten Bereich von content fortzufahren.

+ +
+
+
<menubar id="main-menubar">
+  <menu id="xulschoolhello-hello-menu" label="&xulschoolhello.hello.label;"
+    accesskey="&xulschoolhello.helloMenu.accesskey;" insertafter="helpMenu">
+    <menupopup>
+      <menuitem id="xulschoolhello-hello-menu-item"
+        label="&xulschoolhello.hello.label;"
+        accesskey="&xulschoolhello.helloItem.accesskey;"
+        oncommand="XULSchoolChrome.BrowserOverlay.sayHello(event);" />
+    </menupopup>
+  </menu>
+</menubar>
+
+<vbox id="appmenuSecondaryPane">
+  <menu id="xulschoolhello-hello-menu-2" label="&xulschoolhello.hello.label;"
+    accesskey="&xulschoolhello.helloMenu.accesskey;"
+    insertafter="appmenu_addons">
+    <menupopup>
+      <menuitem id="xulschoolhello-hello-menu-item-2"
+        label="&xulschoolhello.hello.label;"
+        accesskey="&xulschoolhello.helloItem.accesskey;"
+        oncommand="XULSchoolChrome.BrowserOverlay.sayHello(event);" />
+    </menupopup>
+  </menu>
+</vbox>
+
+
+
+ +

Das ist der Code, der das Hello World-Menü dem Browserfenster hinzufügt.

+ +

Darin enthalten sind zwei ähnliche Codeblöcke, dass ist dadurch begründet das in modernen Versionen von Firefox, insbesondere unter Windows, ein einzelner Firefox Menübutton mit vereinfachten Menüoptionen, anstatt einer umfangreichen Menübar dargestellt wird. Der zweite Codeblock bezieht sich auf alle üblichen Buttonprozesse; der erste Codeblock bezieht sich auf alle anderen Prozesse. Setze den Hacken Menüleiste unter dem Optionsmenü im Menübutton, um die Anzeige des klassischen Menüs unter Windows und einigen Linuxdistributionen zu aktivieren.

+ +

Um diesen Code zu schreiben, benötigen wir etwas Wissen über den XUL-Code in browser.xul. Wir müssen wissen, dass die ID des rechten Fläche in dem undefinierten Menü appmenuSecondaryPane ist. Wir werden ein eigenes Menü hinzufügen und Firefox mitteilen dieses rechts nachdem Add-on-Element in die Fläche hinzuzufügen. Dies ist die Festlegung des Attributes:

+ +
+
+
insertafter="appmenu_addons"
+
+
+
+ +

appmenu_addons ist die ID des Menüelements, dass mit dem Add-on-Menü im Hauptmenü in verbindung steht. Wir werden später sehen wir die Dinge wie die ID von Browserelementen ermitteln können, aber jetzt sehen wir uns die Elemente aus denen sich das Hello World-Menü zusammensetzt.

+ +

Für das klassische Menü, fügen wir das Hello World-Menü rechts in das "Wurzelverzeichnis" der Menüs hinzu, so dass es sehr einfach zu finden ist, aber in der Praxis ist es nicht notwendig. Stellen Sie sich vor was passieren würde, wenn alle Erweiterungen ein Menü im oberen Menü hinzufügen würden; ein paar Erweiterungen zu haben würde es dann außen lassen wie die Kontrollanzeige eines Flugzeuges, voller Knöpfe und Schalter. Im Falle des zusammengesetzen Menüs, sind die Dinge aufgrund von zu wenigen Optionen etwas mehr kompliziert. Wenn dein Menüitem in den Webentwicklerbereich passt empfiehlt es sich es dort zu platzieren. Andererweise ist das Wurzelmenü möglicherweise der einzige sinnvolle Ort.

+ +

Ein empfehlenswerter Ort für Menüs in dem Klassikmenü ist unter dem Extrasmenü, von daher sollte der Code in etwa so aussehen:

+ +
+
+
<menupopup id="menu_ToolsPopup">
+  <menu id="xulschoolhello-hello-menu" label="&xulschoolhello.hello.label;"
+    accesskey="&xulschoolhello.helloMenu.accesskey;"
+    insertbefore="devToolsEndSeparator">
+    <menupopup>
+      <menuitem id="xulschoolhello-hello-menu-item"
+        label="&xulschoolhello.hello.label;"
+        accesskey="&xulschoolhello.helloItem.accesskey;"
+        oncommand="XULSchoolChrome.BrowserOverlay.sayHello(event);" />
+    </menupopup>
+  </menu>
+</menupopup>
+
+
+
+ +

Wir legen das Menü über das tieferlegende in dem XUL-Baum, aber das spielt keine Rolle weil alles was wir benötigen ist die ID des Elements das wir Überblenden wollen. In diesem Fall ist dies das Menüpopup-Element das sich innerhalb des Extras. Dasinsertbefore Attribut teilt Firefox mit das Menü im unteren Bereich des Entwicklerextrasbereich hinzuzufügen, über den abschließenden Seperatoren. Wir werden im späteren des Tutorials über Menüs sprechen.

+ +

Nehmen wir jetzt einen Blick auf den  eigentlichen Code:

+ +
+
+
oncommand="XULSchoolChrome.BrowserOverlay.sayHello(event);"
+
+
+
+ +

Dieses Attribute beschreibt einen Eventhandler. . Das command event ist das am meisten genutzte in Firefox, da es mit den Hauptaktionen der meisten UI-Elemente kommuniziert. Der Nutzen der Attribute ist der JacaScript-Code der eine Funktion aufruft. Diese Funktion ist in er der JS-Datei definiert, das mit Skript-Tag eingebunden wird. Die JS-Funktion wird aufgerufen wenn der Benutzer auf einen Menüeintrag im Hello World-Menü aufruft. Alle Eventhandler definieren ein spezielles Objekt namens event, welches normalerweise ausreicht um ein Argument an die Funktion zu übergeben. Eventhandler werden im späteren genauer definiert.

+ +

Nun werfen wir einen Blick in die JavaScript-Datei und und sehen uns an wenn das Event ausgeführt wird.

+ +
+
+
/**
+ * XULSchoolChrome namespace.
+ */
+if ("undefined" == typeof(XULSchoolChrome)) {
+  var XULSchoolChrome = {};
+};
+
+
+ +

Der XULSchoolChrome Namensraum ist definiert. Alle Objekte und Variablen die wir i JavaScript definieren sind global, das bedeutet das Skripte in Firefox und andere Erweiterungen können diese sehen und mit Ihnen interagieren. Dies bedeudet also dass wenn wir ein Objekt MenuHandler definieren oder einige generische Namen, ist es wahrscheinlich das es mit einem extierenden Objekt in Konflikt steht. Was wir hier machen ist ein einzelnes globales Objekt zu definieren: XULSchoolChrome. Nun wissen dass alle unsere Objekte sind innerhalb dieses Objekts, welches unwahrscheinlich duplliziert oder überschrieben wird von anderen Erweiterungen.

+ +

Sie können hier mehr über den typeof operator erfahren. Wenn Sie nicht mit JavaScript oder der besonderen Syntax, ein Objekt mit {} zu intialisieren ist identisch mit es mit new Object() zu intialisieren.

+ +
+
+
/**
+ * Controls the browser overlay for the Hello World extension.
+ */
+XULSchoolChrome.BrowserOverlay = {
+
+
+ +

Sclussendlich ist BrowserOverlay unser Objekt. Ein Objekt in solcher langen und ausführlichen Art und Weise zu benennen und refernzieren kann sich am Anfang unkomfirtabel anfühlen, aber es ist den Aufwand wert.

+ +
+
+
We use Javadoc style comments on all namespaces, objects and object members. This is a similar standard to the one used in Mozilla code, and some tools can generate documentation automatically from Javadoc.
+
+
+ +
+
+
sayHello : function(aEvent) {
+  let stringBundle = document.getElementById("xulschoolhello-string-bundle");
+  let message = stringBundle.getString("xulschoolhello.greeting.label");
+
+  window.alert(message);
+}
+
+
+ +

Und Schlussendlich ist dass unsere Funktionsdeklaration. Drei Zeilen sind alles was wir benötigen. Die erste Zeile in dem Body der Funktion deklariert eine Variable die das stringbundle-Element beinhaltet, das im Overlay definiert ist. Die Variable ist deklariert durch die Verwendung von let, dass var ähnlich ist aber einen enger begrenzten Bereich besitzt. Hier können Sie mehr über die let deklaration nachlesen.

+ +

WIe auch im regulären JS, können wir das DOM (Document Object Model) nutzen um dass XUL-Dokument zu manipulieren.Als erstes bekommen wir eine referenze auf das stringbundle-Element  in dem Dokument. Dies ist ein spezielles Element das es uns erlaubt beschränkte Strings dynamisch zu erhalten, nur durch die bereitstellung eines "key`s" der Den String identifiziert. Das macht die zweite Zeile. Wir rufen die getString Methode des bundle-Elements udn bekommen die begrenzte Meldung angeziegt. Anschließende rufen wir die window.alert-Funktion auf, wie wir das auch in einem HTML-Dokument machen würden.

+ +

Locale

+ +

Es gibt zwei Arten von locale-Dateien: DTD und Einstellungen, und in diesem Beispiel werden wir beide benutzen. DTD ist der effizenteste Weg um Text in XUL anzuzeigen, von daher sollten Sie es benutzen wann immer es möglich ist. Es ist etwas unflexibel, so kann es nicht für dynamisch erzeugten Text verwendet werden, folglich gibt es eine Notwendigkeit um auf regionale Strings zuzugreifen.

+ +

Werfen wir einen Blick zurück auf den Menücode, dort haben Sie unter Umständen einge Attribute wie diese bemerkt:

+ +
+
+
label="&xulschoolhello.hello.label;" accesskey="&xulschoolhello.helloItem.accesskey;"
+
+
+ +

Diese Attribute definieren den Text den Sie in den Menüs sehen,  es sind String-keys die in unserer DTD-Datei definiert sind, browserOverlay.dtd. Die DTD-Datei wurd mit folgendem Code in die XUL-Datei eingefügt:

+ +
+
+
<!DOCTYPE overlay SYSTEM "chrome://xulschoolhello/locale/browserOverlay.dtd" >
+
+
+ +

Und in der DTD-Datei können Sie die Zuordnung von Keys und regionalen Strings sehen:

+ +
+
+
<!ENTITY xulschoolhello.hello.label            "Hello World!">
+<!ENTITY xulschoolhello.helloMenu.accesskey    "l">
+<!ENTITY xulschoolhello.helloItem.accesskey    "H">
+
+
+ +

Beachte das Sie in den XUL-Dateien den String mit & und ; umschließen, wohingegen sie in eriner DTD-Datei nur den Key spezifizieren. Sie erhalten womöglich sonderbare Fehlermeldungen oder Zuordnungen wenn Sie dass nicht beachten.

+ +

Zugangs Key`s sind Shortcuts die es Ihnen erlauben, nur mit der Tastatur schnell durch ein Menü zu navigieren. Sie sind auch der einzige Weg durch die Menüs zu navigieren für Menschen die eine Barrierefreiheit benötigen, durch teilweise oder vollkommene Blindheit oder durch körperliche Eingeschränktheit die, dass nutzen einer Maus sehr schwierig oder unmöglich machen. Sie können die Zugangs-Key`s unter Windows leicht erkennen, weil der Buchstabe der mit dem Zugangs-Key in Verbindung steht unterstrichen ist, wie in der folgenden Abbildung.

+ +
+

+
+ +

DIe meisten Benutzeroberflächen Schaltflächen besitzen ein accesskey Atribut, und Sie sollten es benutzen. Der Wert eines Zugangs-Key`s ist lokal beschränkt, weil er einem Buchstaben im Labeltext entsprechen soll. Sie sollten darauf achten es zu vermeiden Zugangs-Key´s zu wiederholen. Als Beispiel, innerhalb eines Menüs oder Untermenüs sollten Zugangs-Key`s nicht wiederholt werden. In einem Fenster müssen Sie noch vorsichtiger sein bei der Auswahl von Zugang-Key`s weil es dort normalerweise eine größere Anzahl an Schaltflächen gibt. Besonders vorsichtig müssen Sie sein wenn Sie Zugangs-Key`s für eine Overlay auswahlen. In unserem Fall, können wir den Buchstaben "H" nicht als einen Zugangs-Key im Hauptmenü verwenden, weil dieser sich mit dem Zugangs-Key den Hilfemenüs überschneiden würde. Das selbe gilt für das "W" und das Fenstermenü unter Mac OS. Von daher haben wir den Buchstaben "l" zugewiesen.

+ +

DTD-Strings werden aufgelöst und gesetzt wenn das Dokument lädt. Wenn Sie den label-Attribute Wert für das Hello World-Menü mit hilfe von DOM abfragen, erhalten Sie den begrenzten String und nicht den String-Key. Sie können nicht dynamischen den Wert von Attributen mit einem neuen DTD-Schlüssel ändern, Sie müssen den neuen Wert direkt setzen.

+ +
+
+
let helloItem = document.getElementById("xulschoolhello-hello-menu-item");
+
+// The alert will say "Hello World!"
+alert(helloItem.getAttribute("label"));
+// Wrong
+helloItem.setAttribute("label", "&xulschoolhello.hello2.label;");
+// Better
+helloItem.setAttribute("label", "Alternate message");
+// Right!
+helloItem.setAttribute("label", someStringBundle.getString("xulschoolhello.hello2.label"));
+
+
+ +

Das ist der Grund warum DTD-String keine Lösung für alle beschränkten Fälle sind, and der Grund warum wir oft Stringpakete in XUL-Dateien einbinden müssen.

+ +
+
+
<stringbundleset id="stringbundleset">
+  <stringbundle id="xulschoolhello-string-bundle"
+    src="chrome://xulschoolhello/locale/browserOverlay.properties" />
+</stringbundleset>
+
+
+ +

Das stringbundleset-Element ist nur ein Container für stringbundle-Elemente. Hiervon sollte eines pro Dokument geben, dies ist auch der Grund warum wir das stringbundleset in der browser.xul überschreiben, daher die sehr generische ID.  Wir fügen keine insertbefore oder insertafter Attribute ein weil die Reihenfolge der Stringpakete keine Rolle spielt. Das Element ist vollständig unsichtbar. Wenn Sie keine Ordnungsattribute in ein Overlay-Element einfügen, wird Firefox Ihr Element als letztes Kindelement des Elternelements betrachten.

+ +

Alles was Sie für das Stringpaket benötigen ist eine ID (um später auf das Element zugreifen zu können und den Chrome-Pfad der Einstellungsdatei. Und natürlich die Einstellungsdatei:

+ +
xulshoolhello.greeting.label = Hi! How are you?
+ +

Die Leerzeichen vor und nach dem Gleichheitszeichen werden ignoriert. Genauso wie in der install.rdf, Kommentare können durch das "#" Zeichen am Anfang einer zeile hinzugefügt werden. Leere Zeilen werden ebenso ignoriert.

+ +

Sei werden oft einen dynamischen Inhalt als Teil eines begrenzten Strings einbinden wollen, wie wenn Sie den Nutzer über den Status der Erweiterung informieren wollen. Als Beispiel: "Es wurden 5 der Suchanfrage entprechende Wörter gefunden". Ihre erste Idee ist möglicherweise einfach Strings zu verketten und eine "Found" Eigenschaft und eine weitere "words matching..." Eigenschaft zu verwenden. Dies ist keine Gute Idee. Sie behindert nur in einem großen Maße die Arbeit von Übersetzern und Grammatikregeln der verschieden Sprachen ändern möglicherweise den Aufbau des Satzes. Aus diesem Grund ist es besser Parameter in den Eienschaften zu verwenden.

+ +
+
+
xulshoolhello.search.label = Found %S words matching the search query!
+
+
+ +

Wenn Sie den getFormattedString anstatt des getString verwenden um auf den begrenzten String zuzugreifen. Glücklicherweise müssen wir durch dass nicht mehrere Eigenschaften anlegen, hierdurch wird das Leben für Übersetzer einfacher. Sie können mehr über das in dem Text Formatting Bereich des XUL Tutorial nachlesen. Werfen Sie auch einen Blick auf die Plurals and Localization Artikel, die die Lokalisierungsfunktionen behandeln und es Ihnen weiterhin erlauben das letzte Beispiel zu verbessern, um verschiedene Arten von Pluralformen zu verarbeiten die auch Sprachabhängig sind.

+ +

Skin

+ +

XUL zu gestalten ist dem gestalten von HTML sehr ähnlich. Wir werden uns einige Unterschiede ansehen wenn wir das XUL-Box-Modell und andere fortgeschritten Themen. Es gibt nicht viel was Sie in bei einem minimalen Menü und einer einfachen Warnmeldung gestalten können, da die Hello World ERweiterung nur eine leere CSS-Datei und eine vorgeschriebene globale Skin-Datei beinhaltet:

+ +
+
+
<?xml-stylesheet type="text/css" href="chrome://global/skin/"  ?>
+<?xml-stylesheet type="text/css"
+  href="chrome://xulschoolhello/skin/browserOverlay.css"  ?>
+
+
+ +

Die globale Skin-CSS-Datei enthält alle standard Styles für alle XUL-Elmente und Fenster. Wenn Sie vergessen diese Datei in ein XUL-Fensterer einzubinden, führt das normalerweise zu intersanten und oft ungewohlten Ergebnissen. In unserem Fall müssen wir diese nicht einbinden, seit wir die Hauptbrowser-XUL-Datei überblenden und diese bindet bereits diese globale CSS-Datei ein. Auf jeden Fall ist es besser sie immer einzubinden. Auf diesem Weg ist es schwieriger Fehler durch ein nicht einbinden zu vermeiden. Sie können den Chrome-Pfad in der Adressleiste eingeben und überprüfen wenn Sie sich unsicher sind.

+ +

Dies behandelt alle Dateien der Hello World-Erweiterung. Nun sollten Sie eine Idee haben welche in die Erweiterungsentwicklung involviert sind, nun steigen wir direkt ein und stzen eine Eintwicklungumgebung auf. Aber als erstes eine kleine Übung.

+ +

This covers all of the files in the Hello World extension. Now you should have an idea of the basics involved in extension development, so now we'll jump right in and set up a development environment. But first, a little exercise.

+ +

Übung

+ +

Mache die folgenden Änderungen in der Beispielerweiterung:

+ + + +

Packe die XPI neu. Führe unter Linux oder Mac OS X folgendes Kommando innerhalb des Wurzelverzeichnisses der Erweiterung aus:

+ +
zip -r ../xulschoolhello2.xpi *
+
+ +

Verwende unter Windows ein ZIP-Tool um alle Datei und Unterverzeichnisse innerhalb des Wurzelverzeichnisses der Erweiterung zu packen und setze die Dateierweiterung der Datei auf .xpi.

+ +

Installiere die XPI neu. Sie können hierzu die XPI-Datei hierzu einfach in den Browser ziehen und diese wird lokal installiert.

+ +

Teste es und überprüfe ob die Änderungen funktionieren. Wenn Sie auf Probleme während der Installation stoßen, ist es wahrscheinlich, dass Sie die XPI-Struktur nicht korrekt nachgebildet haben, möglicherweise durch das hinzufügen unnötiger Ordner.

+ +
Note: Packaging an extension is really just creating a ZIP archive of the contents of the main folder, then changing the filename extension to .XPI. Do not zip the containing folder, just its contents. The content folder, chrome.manifest, install.rdf, and other files and directories should be at the root level of your archive. If you zip the containing folder, your extension will not load.
+ +

Beachte, dass das Extramenü standardmäßig in Firefox 4und höher, unter Windows und einige Linuxdistributionen versteckt ist. Setze einen Hacken im Optionsmenü unter dem Firefoxmenüknopf um es zu aktivieren.

+ +

Nachdem Sie fertig sind, können Sie sich diese Refernzlösung ansehen: Hello World 2.

+ +

+ +

{{ PreviousNext("XUL_School/Getting_Started_with_Firefox_Extensions", "XUL_School/Setting_Up_a_Development_Environment") }}

+ +

This tutorial was kindly donated to Mozilla by Appcoast.

diff --git a/files/de/archive/mozilla/xul/school_tutorial/eine_entwicklungsumgebung_einrichten_environment/index.html b/files/de/archive/mozilla/xul/school_tutorial/eine_entwicklungsumgebung_einrichten_environment/index.html new file mode 100644 index 0000000000..1f4ea0ffbb --- /dev/null +++ b/files/de/archive/mozilla/xul/school_tutorial/eine_entwicklungsumgebung_einrichten_environment/index.html @@ -0,0 +1,161 @@ +--- +title: Eine Entwicklungsumgebung einrichten +slug: >- + Archive/Mozilla/XUL/School_tutorial/Eine_Entwicklungsumgebung_einrichten_Environment +translation_of: >- + Archive/Add-ons/Overlay_Extensions/XUL_School/Setting_Up_a_Development_Environment +--- +

{{ PreviousNext("XUL_School/The_Essentials_of_an_Extension", "XUL_School/Adding_menus_and_submenus") }}

+

Eine Entwicklungsumgebung einrichten

+

Es gibt 3 Tools von denen wir denken das diese essentiell für eine effektive Add-on-Entwicklung sind (oder ehrlich gesagt für jede Art von Entwicklung): ein Quellcodeeditor, ein Versionskontrollsystem und eine Entwicklungsumgebung.

+

Im Bezug auf das Codeediting, es gibt keine offizelle Mozilla IDE. Mit anderen Worten, Erweiterungen benutzen die selben (oder ähnlichen) Sprachen die auch für die Webentwicklung genutzt werden, von daher könnnen die meisten Texteditoren und IDE`s eingesetzt werden. Die meisten XUL-Tools und Plugin`s die Sie Online finden werden sind lediglich Templates die die Ordnerstruktur füre das Projekt erzeugen, und das ist nicht viel Hilfe.

+

WIe empfehlen Komodo Edit. Es ist kostenlos, OpenSource und Cross-Platform-Unabhängig. Es basiert auf der Mozilla XULRunner Platform, von daher unterstützt einige der Besonderheiten in der Firefoxerweiterungsentwicklung. Komodo Edit bietet eine Autovercollständigung für XUL-Tags und Attribute und es unterstützt Mozilla`s CSS-Erweiterungen (CSS-Werte und Einstellungen beginnen mit "-moz"). Es besitzt ein Add-on System ähnlich dem im Firefox, und es gibt einige Komodo-Erweiterungen die zusätzliche Hilfe bei der Erweiterungsentwicklung bieten. Das ist mehr als die meisten andern Editoren bieten, von daher empfehlen wir Ihnen ihm eine Chance zu geben. Alle unsere Beispiel wurden mit Komodo Edit erstellt, also wenn Sie eine .kpf oder .komodoproject fi Datei in einem Beispieldownload sehen ist das eine Komodoprojektdatei.

+

+

Wir empfehlen Git und GitHub für die Versionskontrolle, aber jedes anständige Software-Configuration-Management System kann hier eingesetzt werden.

+

Um XPI-Dateien zu packen, nutzen wir make. Wir haben make gewählt weil dieses System von Mozilla genutzt wird um Firefox zu bauen und es ist für alle Betriebssysteme verfügbar. make ist das Standard Tool in den meisten UNIX-basierten Systemen. Es kann unter Mac OS X als Teil von des XCode Tool-Paketes installiert werden und unter Windows mit cygwin. In einer cygwin-Installation werden Sie explizit die make und zip utilities aus der langen Liste der Pakete auswählen müssen um diese herunterzuladen und installieren.

+

Sorgen Sie des weiteren dafür das make sich im ausführbaren Systempfad befindet. Nach der Einrichtung von make, sollten Sie in der Lage sein ein Kommandozeildenfenster zu öffnen, führen Sie "make-ver" aus, und Sie bekommen die installierte Version von make als Ausgabe.

+

Wir empfehlen Ihnen make auf Ihrem System einzurichten, da unsere Beispiele beinhalten alle notwendigen Dateien um die daraus entstehende XPI mit diesem Toolzu bauen und installieren. Es wird Ihnen einiges an Zeit für das packen ersparen. Oder Sie können ein vergleichbares System unter der Verwendung von Batch aufsetzen, machen Sie es wie auch immer Sie bevorzugen. Letztlich können Sie auch einfach jeden Zip oder Archivierungs Tool verwenden um den Inhalt des src Verzeichnisses zu komprimieren um ein identisches Ergebniss zu ereichen.

+

Build system

+

Beginnen wir mit dem Herunterladen des Projekts mit dem die zweite Version von Hello World aufgebaut wurde, aus der Übung der letzten Lektion

+

Hello World 2 Project.

+

Entpacken die Datei wohin Sie wollen. Innerhalb des HelloWorld2 Verzeichnisses weden Sie zwei Verzeichnisse sehen: bin und src. Das bin Verzeichnis sollte leer sein. Dort werden alle enstehenden build-Dateien erstellt und dort werden Sie die Erweiterungs XPI-Datei finden wenn sie erstellt wurde.

+

Öffnen Sie die Projektdatei (HelloWorld2.komodoproject) in the src Verzeichnis in Komodo Edit. In dem Projektreiter sollten Sie nun in der Lage sein die Verzeichnisstruktur innerhalbt des src-Verzeichnises sehen. Dies Struktur solle ihnen vertraut sein, da Sie beinahe identisch mit der ungepackten XPI von der vorherigen Lektion ist.

+

Die einzige bemwerkswerte Änderung ist eine Datei mit der Bezeichnung Makefile unter src. Das ist die Datei die make nutzt  um die XPI zu erstellen. Sie sollten sich etwas Zeit nehmen um diese zu lesen und zu verstehen., oder zumindest die Teile untersuchen die Sie ändern müssen um Ihr projekt zu beginnen. Die GNU Make Manual ist eine sehr gute Refernz um sich mit make und der Makefile-Datei vertraut zu machen.

+

In den meisten Fällen müssen Sie nur ein paar der ersten Zeilen in der Makefile-Datei ändern. Diese definieren den Erweiterungsnamen, die Erweiterungs ID (wie in install.rdf festgelegt) und der Name des profile-Verzeichnisses wohin die Erweiterung während der Entwicklung und des testens installiert wird. Mehr über das später.

+

Versuchen wir zuerst die XPI über die Kommandozeile zu erstellen. Öffnen Sie das Kommandozeilenprogramm in Ihrem System und naviergien Sie zum src Verzeichnis in Ihrem Projekt. Führen Sie folgenden Befehl aus:

+
+
+ 
make
+
+
+

Das ist es. Wenn alles gut läuft sollten Sie eine Ausgabe wie diese sehen:

+
+
+ 
Creating XPI file.
+  adding: install.rdf (deflated 50%)
+  adding: chrome.manifest (deflated 50%)
+  adding: content/browserOverlay.js (deflated 42%)
+  adding: content/browserOverlay.xul (deflated 69%)
+  adding: skin/browserOverlay.css (stored 0%)
+  adding: locale/en-US/browserOverlay.dtd (deflated 52%)
+  adding: locale/en-US/browserOverlay.properties (stored 0%)
+Creating XPI file. Done!
+
+Build finished successfully.
+
+
+
+

Wenn Sie das bin Verzeichnis untersuchen, sollten Sie die xulschoolhello2.xpi Datei sehen.

+

Wenn Sie make ausführen, werden Sie die letzte Zeilde des Erstellungsprozesses sehen. Das ist so weil make mitteilt das die Datei im bin Verzeichnis aktuell ist und es nichts zu machen gibt. Änderungen an der Quelldatei werden make dazu bringen die notwendigen Schritte erneut auszuführen um XPI erneut zu erstellen.

+

Sie können das bin Verzeichnis aufräumen indem Sie einfach den folgenden Befehl ausführen (nochmal, innerhalb des src Verzeichnises)
+  

+
+
+ 
make clean
+
+
+

Sie können diese Befehle auch in Komodo ausführen. Klicken Sie auf Tools > Befehl ausführen... In das "Ausführen" Textfeld sollten Sie das eingeben:

+
+
+ 
bash -c "make"
+
+
+

+

Oder ersetzen Sie "make" mit "make clean" für das aufräumen. Der "basc -c" Teil zwingt Komodo bash zu nutzen, welches aus einigen Gründen nicht als das Standard Kommandozeile gesetzt werden kann. Es ist nicht notwendig dies zu tun, aber es ist besser so das mit dem make-Befehl übereinstimmt den wir als nächstes sehen werden.

+

In em "Start in" Textfeld sollten Sie %p wählen (Verzeichnispfad des aktiven Projektes. Wenn Sie dieses Textfeld nicht sehen können dann klicken Sie auf den "More" Schalter. Sie besitzen auch die Möglichkeit den Befehl zu speichern, durch einen Klick auf das "Add to Toolbox" Auswahlfeld. Um die Toolbox zu sehen, klicke auf View > Tabs > Toolbox, über das Hauptmenü. Damit sollten Sie einen sehr einfachen Weg haben um Ihre XPI zu erstellen, indem Sie nur den Erstellungsbefehl Doppelklicken.

+

Wir können es sogar noch besser machen. Wenn Sie einmal Ihren Code testen und debuggen, werden Sie feststellen, dass das ständige erstellen und installieren einer XPI sehr ermüdend sein kann. Das ist der Gründ warum wir "make install" eingeführt haben. Dies funktioniert nur wenn die Erweiterung bereits in einem Firefoxprofil installiert ist. Wie in den vorgestellten Projekt, benötigen Sie die Add-on-ID und die gesetzte Profillokation die in der Makefile-Datei. Wir nutzen diese Informationen um den Installationspfad  von der Erweiterung  und überschreiben die installierten Dateien. Wenn Firefox geöffnet ist können Sie den "make install"-Befehl ausführen, Sie müssen Firefox neustarten um die Änderungen zu sehen. Es ist immernoch besser als die XPI andauernd neu zu installieren.

+

Möglicherweise möchten Sie die Profillokation in Ihrem Makefile-Datei ändern. . Um die Profilloaktion auf den richtigen Wert zu setzen, sollten Sie den Artikel support article on profiles auf der Mozilla Support Seite lesen. Auch werden wir später tiefer in dieses Thema eintauchen.

+

Um "make install" auf nicht WIndowssystemen einzusetzen, benötigen Sie einen extra Schritt. Der Installationsprozess benötigt eine Umgebungsvariable mit dem Namen OSTYPE, welche nicht exportiert wird. Lange Geschichte kurzer Sinn, über Kommandozeile müssen Sie folgendes ausführen:

+
+
+ 
export OSTYPE; make install
+
+
+

Und in Komodo sollten Sie fogenden Befehl eingeben:

+
+
+ 
bash -c "export OSTYPE; make install"
+
+
+

Der export-Befehl wird nicht korrekt funktionieren wenn Sie nicht "bach-c" verwenden.

+
+ The file Makefile specifies which profile folder the add-on will be reinstalled to. This is set in the profile_dir variable (set to "xulschool-dev" in this case). When creating a development profile for your add-on, make sure you choose an easy name for the profile folder, and set it in your Makefile in order to take advantage of the install command.
+

Building IDL files

+

Einige Erweiterungen setzen die Entwicklung von XPCOM-Komponeten voraus um gewisse fortgeschritten Funktionen hinzuzufügen. Es gibt eine Lektion die für XPCOM in diesem Tutorial vorgesehen ist, aber wie gehen kaum auf den Einflussdie es auf die Entwicklung von Erweiterungen hat ein. Sie können diesen Teil überspringen und es als Refernenz zu nutzen wenn Sie XPCOM in Ihrem Projekt benötigen.

+

XPCOM Schnittstellen werden mit IDL-Dateien definiert. Das sind Textdateien die Attribute definieren und Methoden in einem oder mehren Schnittstellen. Diese IDL-Dateien werden in Binarydateien kompiliert und werden in die Erweiterung als XPT-Dateien eingebunden.

+

Um eine IDL-Dateizu XPT zu komplieren, benötigen Sie ein Kommandozeilen Tool, xpidl. Dieses Tool ist im Mozilla Gecko SDK enthalen. Wenn Sie IDL`s kompilieren möchten, gehen Sie zur SDK-Seite und laden Sie eine kompilierte Version für Ihr System herunter. Beachte auch mögliche Anforderungen. Wenn Ihr System nicht bei den unterstützen Systemen aufgelistet ist, müssen Sie das SDK selbständig aus dem Mozilla Quellcode erstellen. Viel Glück damit.

+

Sie sollten auch Ihre Umgebung so aufbauen das die xpidl.exe (oder nur xpidl in anderen Systemen) dich in dem standardmäßige auführbaren Pfad befindet und fügen Sie auch eine Variable mit der Bennung Gecko_SDK hinzu, die auf Ihren SDK-Build verweist:

+
+
+ 
export GECKO_SDK=/path/to/your/sdk
+
+
+

Ihr Buildsystem sollte dort darauf zugreifen. Um es in Komodo unter UNIX-basierten Systemen einsetzen zu können, fügen wir den Befehl in die .bash_login-Datei im Homeverzeichnis hinzu und wir passen den Befehl folgendermasen an.

+
+
+ 
bash -c ". ~/.bash_login; make"
+
+
+

Ein Beispiel Projekt mit XPCOM-Komponeten ist in der XPCOM-Lektion enthalten. Dort wird auch XPCOM Erstellung mit C++ angesprochen, was sehr viel schwieriger ist.

+

Signing

+

Um zusätzliche Sicherheit für Ihre Nutzer bereitzustellen, können Sie sich entscheiden eine Signature zu Ihrer Erweiterung hinzuzufügen. Die Signatur verfiziert das Sie der Autor dieser Erweiterung sind und das kann nur gemacht werden wenn Sie ein gültiges Zertifikat einer vertrauswürdigen Zertifizierungsstelle besitzen.

+

Der einzige wahrnehmbare Unterschied für den Benutzer ist das der XPI-Installationsdialog mitteilen wird das die Erweiterung von Ihnen erstellt wurde, was den Dialog vertrauswürdiger macht. Es is nicht üblich Erweiterungen zu signieren weil die meisten Anwender der offizellen Add-on-Seite (AMO) vertrauen anstatt sich auf die Erweiterungssignaturen zu verlassen. Auf der anderen Seite, ist es gängie Praxis für große Unternehmen ihre Erweiterungen zu signieren.

+

Sie werden einige libraries herunterladen müssen damit Sie in der Lage sind Ihre Erweiterungen zu signieren. Folgen Sie dieser Anleitung und fügen etwas ähnliches wie das der Makefile-Datei hinzu:

+
+
+ 
# The directory where the signature sources are located.
+signature_dir := signature
+
+# The signing key /certificate file.
+signature_extra_files := $(build_dir)/META-INF/manifest.mf \
+                         $(build_dir)/META-INF/zigbert.sf
+# The signing key /certificate file.
+signature_rsa_file = $(build_dir)/META-INF/zigbert.rsa# The signing key /certificate file.
+signature_files := $(signature_extra_files) \
+                   $(signature_rsa_file)
+
+$(signature_files): $(build_dir) $(xpi_built)
+  @signtool -d $(signature_dir) -k $(cert_name) \
+  -p $(cert_password) $(build_dir)
+
+
+

Behalten Sie im Hinterkopf ds Ihr Passwort sollte nicht in Ihren Makefile-Dateien enthalten sein und Sie müssen sehr vorsichtig mit den Zertifkatsinformationen sein. Idealerweise sollte das von einer Person erledigt werden und nur Kurz vor Abschluss des Releaseprozess erledigt werden. Sie sollten auch einen abweichenden make-Befehl hierfür haben, wie z.B. make signed um die signierten und unsignierten Entwicklungs builds unterscheiden zu können.

+

Firefox profile management

+

Es ist gute Entwicklungspraxis die Testumgebung von allem anderen zu seperieren. Sie wollen bestimmt nicht das unstabilen Erweiterungen Ihr Firefoxprofil zu schädigen und einen Datenverlust zu riskieren. Es ist viel Besser eine weitere Firefox-"Version" für die Tests zu haben. Hierfür gibt es de Firefoxprofile.

+

Sie können in dem Mozillasupport-Artikeln Managing Profiles lernen wie man mehrere Firefoxprofile aufsetzt. Sie können soviele Profile anlegen wie Sie möchten. Sie können diese auch mit mehreren Firefoxinstallationen mischen. Als Beispiel, Sie möchten möglicherweise Ihre Erweiterungen in Firefox 3.5 und Firefox 3.6 oder in unterschiedlichen regionalen Versionen von Firefox testen. Sie können soviele Firefoxversionen installieren wie Sie möchten und die Profile und Versionen mischen.

+

Unter Windows und Linux ist es einfach Verknüpfungen für jedes angeleget Profil zu erstellen, unter der Verwendung der Befehle beschrieben in http://kb.mozillazine.org/Command_line_arguments ..

+

Für Mac OS X Entwickler, gibt es auch eine Möglichkeit "Verknüpfungen" zu erstellen. Sie können dies erledigen, indem Sie eine Automator-Anwendung öffnen, indem Sie Run Shell Script auswählen und anschließend das Profillade-Skript in das Textfeld eingeben:

+
+
+ 
/Applications/Firefox.app/Contents/MacOS/firefox-bin -no-remote -p MyProfile > /dev/null &
+
+
+

Sie können "/dev/null" auf einen Dateispeicherort ändern, in dem Fall das Sie eine dump-Ausgabe in Firefox sehen möchten oder ander Erweiterungen. last & prevents hindert Automator daran auf das beenden Ihrer Firefoxsitzung zu warten. Speicher Sie das als eine Anwendung nicht als einen Workflow. Un möglicherweise wollen Sie diese auf Ihrem Desktop oder Dock, für einen einfachen Zugriff.

+

Es sollten auch noch Konfigurationsänderungen in Ihrem Testprofil vorgenommen werden, sodass Sie im falls etwas schief geht detailierte Informationen erhalten. Die Firefox Error Console (Extras > Error Console) zeigt normalerweise JavaScripte Fehler an die auf der Webseite auftretten, aber mit etwas Optimierung können Sie Fehlerinformationen aus Ihrer Erweiterungen erhalten. Lesen hierfür Sie diesen Beitrag über Development preferences.

+

Developer extensions

+

Es gibt ein große Bandbreite an Firefoxerweiterungen die die Web- und Add-on-Entwicklung untersützen. Ein guter Ort um danach zu suchen ist die Mozilla Add-ons Seite auch gibt es hier ein gute Entwicklungserweiterungsliste. Sie sollten sich etwas Zeit nehmen und mit den Webentwicklungstools die in Firefox enthalten sind herumspielen. Einige von diesen können sehr hilfreich für die Add-on-Entwicklung sein und überschneiden sich mit den aufgeführen Add-on`s. in dieser Lektion werden wir ein paar wenige ansprechen die wir als sehr hilfreich empfunden haben.

+

DOM Inspector

+

Der DOM Inspector war früher ein Teil von Firefox als eine Installationsoption, aber seit Firefox 3 ist von Firefox abgetrennt als ein weiteres Add-on Sie können es hinzufügen und entfernen. Es ist ein sehr nützliches Tool für Untersuchungen das Sie in das DOM von HTML und XUL-Dokumenten sehen lässt, genauso wie eingesetzte CSS-Regeln und zugehörige JavaScript Objekte. Introduction to DOM Inspector ist eine gute Einführung um mit der Verwendung zu beginnen.

+

Der DOM Inspector ist besonders hilfreich um heruauszufinden wie Sie ein Fenster überblenden, und wie Sie standard CSS-Style-Regeln ersetzen. Sie können die Namen der beteiligten Dateien sehen, was Ihnen einen guten Startpunkt gibt wenn Sie in die Mozilla source sehen. Sie können sogar Styles, Attribute ändern und JavaScript Code ausführen, obwohl dies nicht vollständig zuverlässig ist.

+

JavaScript Debugger

+

Der Name sagt alles. Der Venkman JavaScript Debugger ist ein größartiger Weg um die Ausführung von JavaScript zu verfolgen.

+

Um Erweiterungen und Browsercod zu debuggen, klicken Sie mit der rechten Maustaste auf die geladene Scriptkonsole und entfernen Sie die Auswahl von Exclude Browser Files. Die Liste der geladenen Skripte wird anwachsen um alle Skripte in Firefox zu beinhalten. Unsere Dateinamenkonventionen erweisen sich hierbei als sehr hilfreich. Sie können Unterbrechngspunkte setzen, aus und in Methoden springen und sogar Profilinformationen aus der JavaScriptausführung erhlaten. Sie können Variablen untersuchen, Überwachungsausdrücke verfolgen, und nach Ermessen JS an jedem Punkt der Ausführung auswerten.

+

Diese Erweiterungen ist seit einiger Zeit nicht mehr gewartet werden, daher ist sie sehr buggy. Es ist besonders unzuverlässig wenn es Code in XPCOM und XBL-Dateien debuggen soll. Dennoch, ist ein wertvolles Tool wenn man versucht herauszufinden warum sich eine bestimmte Funktion ungewünscht verhält.

+

Tamper Data

+

Tamper Data fängt HTTP-Anfragen und ihren -Antworten ab. Dies erlaubt Ihnen diese zu unterbrechen und sogar die Payload-Daten zu ersetzten bevor diese gesendet werden. Es gibt einige ähnliche Erweiterungen, wie z.B. Live HTTP Headers, aber Tamper Data ist das eine das wir am meisten einsetzen. Wir werden mehr über HTTP debugging später erfahren.

+

Firebug

+

Die Firebug Erweiterung enthält fast alle Tools die bisher angesprochen wurden, aber sie ist hauptsächlich auf die Webentwicklung ausgerichtet. Die Chromebug Erweiterung hilft Firebug nützlicher im Bezug auf die Erweiterungsentwicklung, aber sie ist möglicherweise nicht stark genug um alle alle angesprochen Add-ons zu ersetzen.

+

Auf der anderen Seite, bietet Firebug eine sehr benutzerfreundliches integriertes Oberfläche und wirdurch stärker weiterentwickelt als seine Gegenstücke. Es ist definitiv einen Versuch wert.

+

Leak Monitor

+

Memoryleaks sind immer ein großer Kritikpunkt an Firefox gewesen. mozilla hat über die Zeit bewiesen das es die Arbeitsspeicher nutzung ernst nimmt, durch die Verbesserung der Performance an besonders kritischen Bereichen und durch das entfernen aller Memoryleaks.

+

Wie auch immer, Erweiterung können auch die Ursache von Memoryleaks sein. Wenn Sie Ihre Erweiterung in die Mozilla Add-on Seite aufgenommen haben möchten, sollten Sie besser keine Memoryleaks haben. In Using XPCOM in JavaScript sind einige Richtlinien erfastt die Sie befolgen sollten um diese zu vermeiden. Einer der häufigsten Fehler die Entwicklern machen, ist einen JS event listener oder observer zu registrieren und diesen niemals zu entfernen. Die einfache Praxis immer Code für das Entfernen für alles was Sie hinzuzufügen anzufügen macht einen großen Unterschied.

+

Um sicher zugehen das Ihre Erweiterungen keine Leaks beinhaltet, Sie sollten die Leak Monitor Erweiterung verwenden wenn Sie das testen. Testen Sie immer öffnende und schließende Fenster. Gewöhnlicherweise tretten diese Leaks bei diesem Vorgang auf.

+

Exercise

+ +

Jetzt das Sie wissen wie man schnell Ihr Projekt und Test-Änderungen überprüft, werden wir lernen wie man neue UI-Elemente zu Firefox durch Overlays und neuer Fenster hinzufügt.

+

{{ PreviousNext("XUL_School/The_Essentials_of_an_Extension", "XUL_School/Adding_menus_and_submenus") }}

+

This tutorial was kindly donated to Mozilla by Appcoast.

diff --git a/files/de/archive/mozilla/xul/school_tutorial/einleitung/index.html b/files/de/archive/mozilla/xul/school_tutorial/einleitung/index.html new file mode 100644 index 0000000000..d31a97b230 --- /dev/null +++ b/files/de/archive/mozilla/xul/school_tutorial/einleitung/index.html @@ -0,0 +1,44 @@ +--- +title: Einleitung +slug: Archive/Mozilla/XUL/School_tutorial/Einleitung +tags: + - Add On + - Benutzeroberfläche + - Extension + - Gecko + - Mozilla + - XUL + - XULRunner +translation_of: Archive/Add-ons/Overlay_Extensions/XUL_School/Introduction +--- +
+ {{Next("XUL_School/Getting_Started_with_Firefox_Extensions")}}
+

Willkommen beim XUL School Tutorial!

+

Dieses Tutorial soll der entscheidene Schritt sein, welcher Sie in einen Firefox Extension Developer (Erweiterungsentwickler) verwandelt. Wir haben Jahre an Erfahrung mit XUL und während dieser Zeit alle Probleme kennengelernt, auf die Entwickler stoßen.

+

XUL School wurde erschaffen von Appcoast (ehemals Glaxstar), eine der wenigen Firmen, welche sich der Addon Entwicklung von Firefox verschrieben hat. Ein Team von über einem Dutzend XUL Entwickler entwickelten Glaxstar während dieses Tutorial geschrieben wurde. Sie sammelten jahrelang Erfahrung und diese reflektieren Sie hier.

+

In diesem Tutorial erfahren Sie, wie Sie Firefox-Erweiterungen entwickeln. Sie werden lernen, wie man schnell die häufigsten Aufgaben in der Extension-Entwicklung löst und vergleichen verschiedene Ansätze, sie zu lösen. In den meisten Fällen bieten wir Codebeispiele, die Sie leicht kopieren und an Ihre Bedürfnisse anpassen können, sowie einige funktionierende Beispiele von Erweiterungen. Das Tutorial soll so kurz wie möglich sein. Oft hilft das Zurückgreifen auf die Mozilla-Dokumentation für weitere Informationen. Sie können es als praktischen Reiseführer mit Infos durch die wachsende Welt, die die Mozilla-Plattform ist, nutzen. Die meisten Links in dieser Dokumentation sollten angeklickt und gelesen werden.

+

Wir starten mit einer Einführung in die Hauptkonzepte, falls Sie nicht mit Mozilla und Firefox vertraut sind.

+

Mozilla and Firefox

+

Der Term Mozilla wird benutzt, um folgende Konzepte zu beschreiben: das Mozilla Projekt, die Mozilla Foundation, die Mozilla Corporation und den alten Mozilla browser. Auch Firefox wird manchmal "Mozilla" genannt. Falls Ihnen die Begriffe nicht geläufig sind, ist es von Vorteil, sich etwas Zeit zu nehemen und mehr über Mozilla zu lernen. Dies hilft die Kultur und das Umfeld von Mozilla zu verstehen.

+

Mozilla hat mehrere Produkte und Projekte hervorgebracht. Das bemerkenswerteste ist der Mozilla Firefox Web-Browser. Firefox ist eines der erfolgreichsten Open-Source-Projekte in der Geschichte. Es kombiniert Offenheit, die Einhaltung von Standards und Raffinesse von Open Source mit dem Fokus auf Benutzerfreundlichkeit und leistungsstarke Vielseitigkeit, wie man es in weniger offenen Unternehmen nur selten sieht.
+
+ Version 1.0 von Firefox wurde im November 2004, Version 2.0 im Oktober 2006 und Version 3.0 im Juni 2008 veröffentlicht. Dieses Tutorial wurde geschrieben, nachdem Firefox 3 veröffentlicht wurde, und ist mit der Zeit aktualisiert worden. Obwohl noch für die Erstellung von Erweiterungen in Firefox 3 (und auch Firefox 2) gearbeitet wird, ist es dringend zu empfehlen, dass Sie moderne Firefox-Versionen unterstützen, um Nutzer zu motivieren, mit Sicherheitsupdates auf dem laufenden zu bleiben. Eine Version, die vor mehr als 6 Monaten veröffentlicht wurde, ist wahrscheinlich anfällig für Sicherheitslücken.
+
+ Firefox und andere Mozilla-Anwendungen kann man als zusammengesetzt ansehen aus zwei verschiedenen Teilen: eine Benutzeroberflächen-Schicht, die für jedes Projekt verschieden ist, und eine gemeinsame Plattform, worauf die Benutzeroberflächen-Schicht angesiedelt ist. Die Benutzeroberfläche ist mit der Technologie XUL entwickelt und die Plattform wird als XULRunner bezeichnet.

+

 

+

XUL

+

XUL (ausgesprochen "zool") ist eine von vielen Technologien für die Erstellung von Mozilla-basierten Produkten und wird auch für Erweiterungen verwendet. Sie ist nur ein Teil der Entwicklungslandschaft, aber da sie praktisch exklusiv für Mozilla ist, neigt man dazu, sie zu verwenden, um Mozilla-bezogene Entwicklungen zu identifizieren. Sie lesen manchmal Begriffe wie "XUL-Anwendungen" und "XUL-Erweiterungen", aber nur selten werden sie für Projekte benutzt, die ausschließlich mit XUL gebaut sind. Es bedeutet in der Regel, dass die Projekte mit Mozilla-Technologien gebaut wurden. Auch dieses Projekt, genannt XUL Schule, erstreckt sich über mehrere andere Technologien wie JavaScript, CSS, XBL und XPCOM.

+

XULRunner

+

XULRunner umfasst die Gecko-Rendering-Engine, die Necko Netzwerk-Bibliothek, und einige andere Komponenten, die unter anderem OS-unabhängiges Datei-Management, Zugänglichkeit und Lokalisierung bieten. Es ist eine sehr leistungsfähige Plattform, die ein solch schnelles Wachstum der Entwickler-Community rund um Mozilla und Firefox erlaubt hat.

+

XULRunner ist in binärer Form auf der XULRunner Seite verfügbar und sie ist die Basis für mehrere Projekte, wie zum Beispiel Songbird, Miro und Eudora. Es gibt eine sehr umfassende Liste von Anwendungen in der XULRunner Hall of Fame.

+

Gecko

+

Die Gecko-Engine ist der Teil von Firefox, der verwendet wird, um Web-Seiten und eine eigene Benutzeroberfläche zu gestalten. Sie erkennen den Grad der Kompatibilität von Web-Standards in Gecko-basierten Browsern, indem Sie sich ihren User Agent String ansehen, der die Gecko-Version enthalten sollte. Gecko-Versionen sind etwas unabhängig von Firefox-Versionen. Sie können eine Zuordnung von Firefox-Versionen und Gecko-Versionen auf der Gecko-Seite sehen. Der User Agent String für Firefox zum Zeitpunkt des Schreibens dieses Artikels (in US-Englisch, Mac OS X) ist:

+

Mozilla/5.0 (Macintosh; Intel Mac OS X 10.7; rv:7.0.1) Gecko/20100101 Firefox/7.0.1

+

Der markierte Abschnitt ist die Gecko-Version: 7.0.1. Sie können den  User-Agent-String lesen und kopieren in jedem beliebiegen Firefox-Fenster. Dazu wählen Sie "Hilfe> Informationen zur Fehlerbehebung" aus dem Hauptmenü.

+

Weiter im Tutorial

+

Mit den grundlegenden Konzepten können wir jetzt in die Entwicklung von Erweiterungen einsteigen. Sie werden sich wahrscheinlich immer noch fragen, was genau ist eine Erweiterung, was kann sie leisten und wie kann man sie erstellen. Nun, dieses ganze Tutorial verfolgt das Ziel, Ihnen das zu erklären.
+
+ Willkommen in der Welt der Extension-Entwicklung. Jetzt wollen wir uns dem zuwenden.

+
+ {{Next("XUL_School/Getting_Started_with_Firefox_Extensions")}}
+

This tutorial translation was kindly donated to Mozilla by Sinn - IT mit Emotion

diff --git a/files/de/archive/mozilla/xul/school_tutorial/getting_started_with_firefox_extensions/index.html b/files/de/archive/mozilla/xul/school_tutorial/getting_started_with_firefox_extensions/index.html new file mode 100644 index 0000000000..bfb1d41e7a --- /dev/null +++ b/files/de/archive/mozilla/xul/school_tutorial/getting_started_with_firefox_extensions/index.html @@ -0,0 +1,75 @@ +--- +title: Mit Firefox Erweiterungen beginnen +slug: Archive/Mozilla/XUL/School_tutorial/Getting_Started_with_Firefox_Extensions +tags: + - Erweiterungen +translation_of: >- + Archive/Add-ons/Overlay_Extensions/XUL_School/Getting_Started_with_Firefox_Extensions +--- +

{{ PreviousNext("XUL_School/Introduction", "XUL_School/The_Essentials_of_an_Extension") }}

+

Was ist eine Firefox Erweiterung?

+
+

Extensions add new functionality to Mozilla applications such as Firefox and Thunderbird. They can add anything from a toolbar button to a completely new feature. They allow the application to be customized to fit the personal needs of each user if they need additional features, while keeping the applications small to download.

+
+

Auszug aus der Erweiterungs-Seite.

+

Wie es das Zitat beschreibt, ist eine Erweiterung eine kleine Anwendung, die etwas Neues zu einer oder mehreren Mozilla-Anwendungen hinzufügt. Dieses Tutorial konzentriert sich auf Erweiterungen für Firefox. Dieselben (oder sehr ähnliche) Prinzipien gelten auch für die Entwicklung von Erweiterungen zu anderen Anwendungen wie Thunderbird, Seamonkey oder Flock.

+

Bitte beachten Sie, dass es es einen Unterschied zwischen der Definiton einer Erweiterung und einem Add-on gibt. Alle Erweiterungen sind Add-ons, aber ein Add-on kann auch eine Theme, ein Plug-in oder ein Sprachpaket sein. Der Inhalt dieses Tutorials behandelt die Entwicklung von Erweiterungen. Themes und Sprachpakete werden in einer sehr ähnlichen Art und Weise entwickelt. Plug-ins sind gänzlich anders und sie werden in diesem Tutorial nicht behandelt. Sie können mehr über Plug-ins und deren Entwicklung auf der Plug-in-Seite erfahren.

+

Firefox bietet eine sehr reiche und flexible Architektur. Diese erlaubt es den Entwicklern von Erweiterungen fortgeschrittene Funktionalitäten hinzuzufügen, sich der Benutzererfahrung anzupassen und Teile des Browsers vollständig zu ersetzen oder zu entfernen.

+

Das Mozilla Add-on Repository (AMO) beinhaltet eine umfassende Anzahl von Erweiterungen mit einer großen Bandbreite an Funktionen: Inhaltsfilterung (AdBlock Plus, NoScript), Interaktion mit Webanwendungen (Delicious Bookmarks, eBay Companion) und Webentwicklung (DOM Inspector, Firebug). Dabei handelt es sich um sehr fortgeschrittene und komplexe Erweiterungen. Sie werden in diesem Tutorial das meiste erlernen, was benötigt wird, um derartige Erweiterungen zu erzeugen (genau genommen basiert Glaxstar auf drei von den hier aufgezählten).

+

Erweiterungen gibt es im Moment in drei verschiedenen Ausprägungen: Add-ons SDK extensions (auch bekannt als Jetpacks), bootstrapped-Erweiterungen und traditionelle Erweiterungen. Wenn Sie gerade beginnen, Add-ons zu entwickeln, bietet das Add-on SDK einen fantastischen Weg, um schnell Erweiterungen zu entwickeln und auf diesen aufzubauen. Dieses Tutorial konzentriert sich auf traditionelle Erweiterungen, welche auf eine andere Art entwickelt werden. Bootstrapped-Erweiterungen sind eine Stufe komplexer, als die traditionellen. Von daher sollten Sie zuerst dieses Tutorial durchgehen, bevor Sie sich diese ansehen.

+

Wir werden dieses Tutorial mit der Analyse einer sehr einfachen Erweiterung beginnen.

+

Die Hallo Welt Erweiterung

+

Unsere Beispielerweiterung und dieses Tutorial im Allgemeinen sind ausgelegt für moderne Versionen des Firefox, aber die meisten von ihnen funktionieren auch auf älteren Versionen.

+

Wir werden nun mit einer einfachen "Hallo Welt"-Erweiterung beginnen. WIr beginnen mit seiner Installation. Dafür klicken Sie auf den folgenden Link.

+

Install Hello World

+

Hierbei wird entweder eine Installation oder ein Datei-Download angestoßen, abhängig von dem Inhaltstyp, der auf dem Webserver abgelegt ist. Der entsprechende Inhaltstyp, um eine Installation zu veranlassen, ist application/x-xpinstall. Im Fall dieses Wiki`s, ist der Inhaltstyp entsprechend gesetzt und ein Installationsfenster sollte erscheinen.

+

Wenn der Inhaltstyp richtig gesetzt ist, werden Sie ordnungsgemäß gewarnt, dass es dieser Seite nicht erlaubt ist Add-ons zu installieren. Hierbei handelt es sich um eine Sicherheitsbarriere, die Seiten daran hindert, Erweiterungen ohne Benutzerzustimmung zu installieren. Dies ist vonnöten, weil bösartige Erweiterungen den gleichen Schaden verursachen können, wie jedes anderes Schadprogramm: Datenklau, das Löschen oder das Austauschen von Daten oder sonstiges unerwünschtes Verhalten. AMO ist die einzige Seite mit einer generellen Erlaubnis. Dies liegt daran, dass die auf AMO veröffentlichten Add-ons einem Überprüfungsprozess unterzogen werden, der Sicherheitsüberprüfungen beinhaltet.

+

Nach dem Herunterladen der Datei, können Sie diese, per Drag and Drop in den Firefox Inhaltsbereich ziehen und die Installation sollte beginnen.

+

Sie werden ein Fenster sehen, welches Ihnen mitteilt, dass sie dabei sind eine Erweiterung zu installieren. In diesem sind einige zusätzliche Informationen enthalten, wie unter anderem der Name des Authors. Sie werden benachrichtigt, dass der Author nicht verfiziert werden kann. Nur Erweiterungen, die mit einem digitalen Zertifkat signiert sind, können die Autorschaft verifizieren. Signierte Erweiterungen sind selten, aber wir werden das Signieren von Erweiterungen später behandeln.

+

Klicken Sie auf die "Jetzt Installieren"-Schaltfläche. Nach der Installation der Erweiterung, werden Sie gefragt ob Sie Firefox neu starten wollen. Installation, Deinstallation, Aktivierung und Deaktiverung von Add-ons erfordern einen Neustart für die Ausführung (außer von NPAPI-Plug-ins, Add-on SDK Erweiterungen und Bootstrapped Erweiterungen). Dies ist ein wichtiger Punkt, den Sie im Hinterkopf behalten sollten, wenn Sie Erweiterungen entwickeln, die andere Erweiterungen oder Themes manipulieren.

+

Sehen Sie nach der Installation in das Firefox Hauptfenster und schauen Sie, ob Sie eine Veränderung feststellen können.

+

Haben Sie es gesehen? Dort ist ein neues Menü im Hauptmenü, bezeichnet "Hello World!".

+

+

Wenn Sie dieses Menü öffnen und den darunter liegenden Menüpunkt, werden Sie eine nette Mitteilung sehen ("nett" im weitesten Sinne). Klicken Sie auf die OK-Schaltfläche um die Mitteilung zu schließen.

+

+

Das ist alles was die Erweiterung macht. Sehen wir uns das jetzt mal genauer an.

+

Erweiterungsinhalte

+

Sie werden vielleicht bemerkt haben, dass die von Ihnen installierte Erweiterungsdatei mit xulschoolhello1.xpi benannt ist. XPI (ausgesprochen "zippy") steht für Cross-Plattform Installer. Diese Installationsdatei funktioniert auf allen Plattformen, die Firefox unterstützen. XPIs sind einfache ZIP-Dateien, aber Firefox erkennt die XPI-Erweiterung und veranlasst den Installationprozess, wenn die XPI-Datei geladen wird.

+

Um in die XPI-Datei zu sehen, müssen Sie diese zuerst herunterladen, ohne sie zu installieren. Anstatt eine Installation durch einen Klick auf einen Link oder eine Schaltfläche auszulösen, führen sie einen Rechtsklick darauf aus und wählen Sie die Ziel speichern unter... Option.

+

Entpacken Sie die XPI-Datei an einen gewünschten Ort. Unter Linux oder Mac OS X führen Sie den folgenden Befehl aus, um die Datei  zu entpacken:

+
unzip xulschoolhello1.xpi -d xulschoolhello1
+
+

Unter Windows können Sie die Dateierweiterung von xpi zu zip ändern oder die Datei direkt öffnen und anschließend mit einem ZIP-Tool entpacken.

+

Sie sollten die folgendene Dateistruktur sehen:

+ +

Das ist eine große Anzahl an Dateien, für etwas so einfaches! In der nächsten Lektion werden wir die Dateien und was sie machen genauer analysieren .

+

{{ PreviousNext("XUL_School/Introduction", "XUL_School/The_Essentials_of_an_Extension") }}

+

This tutorial was kindly donated to Mozilla by Appcoast.

diff --git a/files/de/archive/mozilla/xul/school_tutorial/index.html b/files/de/archive/mozilla/xul/school_tutorial/index.html new file mode 100644 index 0000000000..c11982d447 --- /dev/null +++ b/files/de/archive/mozilla/xul/school_tutorial/index.html @@ -0,0 +1,70 @@ +--- +title: XUL School Tutorial +slug: Archive/Mozilla/XUL/School_tutorial +translation_of: Archive/Add-ons/Overlay_Extensions/XUL_School +--- +

XUL School ist ein umfassendes Tutorial zur Entwicklung von Addons, das sich auf die Erstellung von Firefox-Erweiterungen konzentriert. Wir empfehlen Dir, dieses Dokument mindestens einmal vollständig zu lesen. Obwohl sich Firefox sehr schnell weiterentwickelt, sollte der Inhalt dieses Tutorials aktuell und korrekt sein.

+
+
+ Einführung
+
+ +
+
+ Grundlegende Techniken
+
+ +
+
+ Fortgeschrittene Techniken
+
+ +
+
+ Weiterführende Themen
+
+ +
+
+ Anhänge
+
+ +
+
+

Das XUL School Projekt wurde von Appcoast (ehemals Glaxstar) entwickelt. Das Projekt wird hier unter deren Lizenzen veröffentlicht. Die originalen Inhalte wurden wo nötig angepasst.

+
+

{{ languages( { "ja": "ja/XUL_School", "fr": "fr/Vulgarisation_XUL", "es": "es/Escuela_XUL", "de": "de/XUL_School" } ) }}

+
+

 

diff --git a/files/de/archive/mozilla/xul/separator/index.html b/files/de/archive/mozilla/xul/separator/index.html new file mode 100644 index 0000000000..d01d1d589c --- /dev/null +++ b/files/de/archive/mozilla/xul/separator/index.html @@ -0,0 +1,123 @@ +--- +title: separator +slug: Archive/Mozilla/XUL/separator +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/separator +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Erstellt eine trennende Lücke zwischen Elementen. Dieser Typ ist dazu gedacht unterschiedliche Teile eines Dialogs aufzuteilen. Es wird kein sichtbarer Trennbalken dargestellt, aber ein kleiner Leerraum frei gelassen. Die Funktionsweise ist identisch zum spacer Element außer, dass standardmäßig eine kleine Größe eingestellt ist (normalerweise 1.5 em).

+
Attribute
orient
+
+
Styleklassen
groove, groove-thin, thin
+
+

Beispiele

+
<separator class="groove-thin"/>
+
+

Attribute

+
+ + +
+
orient
+
Type: one of the values below
+
Used to specify whether the separator is a horizontal or vertical separator. Note that the values are the reverse of what seems more likely.
+
+
+
horizontal
+
The separator separates vertically placed elements.
+
vertical
+
The separator separates horizontally placed elements.
+
+
+
+ + +
+ + + + + +

Geerbt von XUL-Element
+align, +allowevents, +allownegativeassertions, +class, +coalesceduplicatearcs, +collapsed, +container, +containment, +context, +contextmenu, +datasources, +dir, +empty, +equalsize, +flags, +flex, +height, +hidden, +id, +insertafter, +insertbefore, +left, +maxheight, +maxwidth, +menu, +minheight, +minwidth, +mousethrough, +observes, +ordinal, +orient, +pack, +persist, +popup, +position, +preference-editable, +querytype, +ref, +removeelement, +sortDirection, +sortResource, +sortResource2, +statustext, +style, +template, +tooltip, +tooltiptext, +top, +uri, +wait-cursor, +width

+
+

Eigenschaften

+ +

Geerbte Eigenschaften
align, , allowEvents, , boxObject, builder, , , , className, , , , , collapsed, contextMenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxHeight, maxWidth, menu, minHeight, minWidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statusText, style, ,, tooltip, tooltipText, top, width
+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+

Styleklassen

+

Folgende Klassen können benutzt werden, um den Stil des Elements zu bestimmen. Statt den Stil des Elements direkt zu ändern, sollten diese Klassen zu Hilfe genommen werden, da sie sich natürlicher in das vom Benutzer gewählte Theme der Benutzeroberfläche einfügen.

+
+
groove
+
A grooved separator.
+
+
groove-thin
+
A thin grooved separator.
+
+
thin
+
A thinner separator, which is usually 0.5 ems.
+
+

Verwandte Themen

+
Elemente
spacer, splitter, menuseparator, toolbarseparator, treeseparator.
+
diff --git a/files/de/archive/mozilla/xul/spacer/index.html b/files/de/archive/mozilla/xul/spacer/index.html new file mode 100644 index 0000000000..f566611098 --- /dev/null +++ b/files/de/archive/mozilla/xul/spacer/index.html @@ -0,0 +1,94 @@ +--- +title: spacer +slug: Archive/Mozilla/XUL/spacer +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/spacer +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Ein Element, das Platz einnimmt, aber nichts anzeigt. Gewöhnlich benutzt, um Freiraum in einem Behälter zu platzieren. Wenn der Platzhalter nicht als flexibel und für ihn keine Größe angegeben ist, nimmt der Platzhalter keinen Raum ein. Ist eine kleine Lücke gewünscht, ist der Einsatz des Elements separator sinnvoller.

+

Weitere Informationen im XUL Tutorial.

+

Beispiele

+
<box>
+  <button label="Links"/>
+  <spacer flex="1"/>
+  <button label="Rechts"/>
+</box>
+
+

Attribute

+ + + + + + +

Geerbt von XUL-Element
+align, +allowevents, +allownegativeassertions, +class, +coalesceduplicatearcs, +collapsed, +container, +containment, +context, +contextmenu, +datasources, +dir, +empty, +equalsize, +flags, +flex, +height, +hidden, +id, +insertafter, +insertbefore, +left, +maxheight, +maxwidth, +menu, +minheight, +minwidth, +mousethrough, +observes, +ordinal, +orient, +pack, +persist, +popup, +position, +preference-editable, +querytype, +ref, +removeelement, +sortDirection, +sortResource, +sortResource2, +statustext, +style, +template, +tooltip, +tooltiptext, +top, +uri, +wait-cursor, +width

+
+

Eigenschaften

+ +

Geerbte Eigenschaften
align, , allowEvents, , boxObject, builder, , , , className, , , , , collapsed, contextMenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxHeight, maxWidth, menu, minHeight, minWidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statusText, style, ,, tooltip, tooltipText, top, width
+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+

Verwandt

+
Elemente
separator, splitter
+
diff --git a/files/de/archive/mozilla/xul/splitter/index.html b/files/de/archive/mozilla/xul/splitter/index.html new file mode 100644 index 0000000000..6c89456da3 --- /dev/null +++ b/files/de/archive/mozilla/xul/splitter/index.html @@ -0,0 +1,173 @@ +--- +title: splitter +slug: Archive/Mozilla/XUL/splitter +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/splitter +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Ein Element, das vor oder nach einem Element innerhalb eines Containers auftauchen sollte. Das Ziehen des Trenners ändert die Größe der Geschwisterelemente des Trenners. Platziert man ein 'Griffchen' (grippy) innerhalb eines Trenners, so wird ein Geschwisterelement des Trenners beim Anklicken des 'Griffchens' zugeklappt.

+

Weitere Information sind im XUL Tutorial verfügbar.

+
Attribute
collapse, resizeafter, resizebefore, state, substate
+
+
Styleklassen
tree-splitter
+
+

Beispiele

+

 splitter_arrow.png

+

<splitter tooltiptext="Größe der Suchbox verändern" oncommand="alert('Der Splitter wurde gezogen!')">
+   <vbox id="Beispiel_vbox" />
+</splitter>

+

Attribute

+

+ + +
+
collapse
+
Type: one of the values below
+
Determines which side of the splitter is collapsed when its grippy is clicked. If this attribute is not specified, the splitter will not cause a collapse. You should put a grippy element inside the splitter when it is used for collapsing.
+
+
+
none
+
No collapsing occurs.
+
before
+
When the grippy is clicked, the element immediately before the splitter in the same parent is collapsed so that its width or height is 0.
+
after
+
When the grippy is clicked, the element immediately after the splitter in the same parent is collapsed so that its width or height is 0.
+
both
+
Either the element immediately before the splitter, or the element immediately after the splitter can be collapsed, if the size of that element would fall below the minimum size due to the position of the splitter.
+
+
+
+
+ + +
+
resizeafter
+
Type: one of the values below
+
This attribute indicates which element to the right or below the splitter should be resized when the splitter is repositioned.
+
+
+
closest
+
The element immediately to the right or below the splitter resizes.
+
farthest
+
The element that is the farthest away from the splitter to the right or below the splitter resizes.
+
grow
+
The elements to the right or below the splitter do not change size (unless they are flexible) when the splitter is dragged, but instead the entire container changes size.
+
flex
+
The closest flexible element resizes.
+
+
+
+ + +
+ + +
+
resizebefore
+
Type: one of the values below
+
This attribute indicates which element to the left or above the splitter should be resized when the splitter is repositioned.
+
+
+
closest
+
The element immediately to the left or above the splitter resizes.
+
farthest
+
The element that is the farthest away from the splitter to the left or above the splitter resizes.
+
flex
+
The closest flexible element resizes.
+
+
+
+
+ + +
+
state
+
Type: one of the values below
+
Indicates whether the splitter has collapsed content or not. This attribute will be updated automatically as the splitter is moved, and is generally used in a stylesheet to apply a different appearance for each state.
+
+
+
open
+
The content either before or after the splitter, depending on the value of the collapsed attribute, is currently displayed.
+
collapsed
+
The content either before or after the splitter is collapsed and is not visible.
+
dragging
+
The user is current adjusting the position of the splitter, typically by dragging it with the mouse.
+
+
+
+ + +
+ + +
+
substate
+
Type: one of the values below
+
On splitters which have state="collapsed" and collapse="both", determines which direction the splitter is actually collapsed in. Since collapse="both" is a Gecko 1.9+ feature, this will have no effect on earlier versions.
+
+
+
before
+
The element immediately before the splitter is collapsed.
+
after
+
The element immediately after the splitter is collapsed.
+
+
+
+
+

Eigenschaften

+ +

Geerbte Eigenschaften
align, , allowEvents, , boxObject, builder, , , , className, , , , , collapsed, contextMenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxHeight, maxWidth, menu, minHeight, minWidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statusText, style, ,, tooltip, tooltipText, top, width
+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+

Styleklassen

+

Folgende Klassen können benutzt werden, um den Stil des Elements zu bestimmen. Statt den Stil des Elements direkt zu ändern, sollten diese Klassen zu Hilfe genommen werden, da sie sich natürlicher in das vom Benutzer gewählte Theme der Benutzeroberfläche einfügen.

+
+
tree-splitter
+
This splitter is intended to be used in tree columns (in-between treecol elements). The splitter will be drawn with no width so that it isn't visible, however, the columns may still be resized.
+
+
	<tree id="tree1" flex="1" height="300" enableColumnDrag="true">
+	  <treecols>
+    	    <treecol id="name" label="Name" flex="1"/>
+	    <splitter class="tree-splitter"/>
+    	    <treecol id="id" label="ID" flex="1"/>
+	    <splitter class="tree-splitter"/>
+    	    <treecol id="date" label="Date" flex="1"/>
+	    <splitter class="tree-splitter"/>
+	  </treecols>
+	  <treechildren/>
+	</tree>
+
+ +

Das Maß, welches die Größe der Box verändert und was während der Größenveränderung passiert nachdem das Limit erreicht wurde, hängt von der festgelegten Höhe (oder Breite) der Box, welche über ein Attribut, über eine CSS Anweisung (min-height [oder min-width]) oder die wirkliche Höhe der Boxinhalte bestimmt werden kann, und von der An- oder Abwesenheit des eines collapse Attributs des Splitters ab.

+

Bei:

+
<vbox></vbox>
+<splitter/>
+<vbox></vbox>
+

...wird sich der Splitter nicht bewegen, da kein collapse Attribute für den Splitter festgeleget wurde, was dazu führt das der Splitter zusammenfällt, sobald er gezogen wird.

+

Bei:

+
<vbox></vbox>
+<splitter/>
+<vbox height="500"><vbox height="100"/></vbox>
+

...kann der Splitter bis auf eine Höhe von 100px der unteren Box gezogen werden, wo er nicht weiter gezogen werden kann (oder zusammenfällt, wenn der Splitter über ein collapse Attribut verfügt).

+

Bei:

+
<vbox></vbox>
+<splitter/>
+<vbox height="500" minheight="200"><vbox height="100"/></vbox>
+

...kann der Splitter bis auf eine Mindesthöhe von 200px gezogen werden, wo er stoppen wird oder zusammenfällt.

+

Bei:

+
<vbox></vbox>
+<splitter>
+<vbox height="500" style="min-height: 50"><vbox height="100"/></vbox>
+

...kann der Splitter bis unter einer Höhe von 100px der unteren Box gezogen werden, wodurch das Kindelement überläuft, wenn die Mindesthöhe erreicht wird. Dort stoppt oder fällt der Splitter zusammen. Das sollte auch mit einem minheight Attribut, das kleiner als die wirkliche Höhe ist, möglich sein. (Jedoch funktioniert der Überlauf tatsächlich wegen Bug 513597  nur beim Festlegen von minheight und minwidth Attributen oder bei einer Angabe von min-height oder min-width über CSS).

+

Verwandte Themen

+

TBD

diff --git a/files/de/archive/mozilla/xul/style/index.html b/files/de/archive/mozilla/xul/style/index.html new file mode 100644 index 0000000000..74732b6e00 --- /dev/null +++ b/files/de/archive/mozilla/xul/style/index.html @@ -0,0 +1,11 @@ +--- +title: Style Klassen +slug: Archive/Mozilla/XUL/Style +tags: + - XUL Referenz + - XUL Style +translation_of: Archive/Mozilla/XUL/Style +--- +

« Startseite XUL Referenz

+ diff --git a/files/de/archive/mozilla/xul/style/treecol-image/index.html b/files/de/archive/mozilla/xul/style/treecol-image/index.html new file mode 100644 index 0000000000..d7be7f7df7 --- /dev/null +++ b/files/de/archive/mozilla/xul/style/treecol-image/index.html @@ -0,0 +1,13 @@ +--- +title: treecol-image +slug: Archive/Mozilla/XUL/Style/treecol-image +tags: + - XUL Referenz + - XUL Style +translation_of: Archive/Mozilla/XUL/Style/treecol-image +--- +
« Startseite XUL Referenz
+
treecol-image
Um ein Bild als Kopf der Baumspalte anzuzeigen, wird diese Klasse benutzt. Das Bild selbst wird über das Attribut src angegeben.
+
+
+
diff --git a/files/de/archive/mozilla/xul/tab/index.html b/files/de/archive/mozilla/xul/tab/index.html new file mode 100644 index 0000000000..6c0f5831d0 --- /dev/null +++ b/files/de/archive/mozilla/xul/tab/index.html @@ -0,0 +1,195 @@ +--- +title: tab +slug: Archive/Mozilla/XUL/tab +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/tab +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Steht für einen einzelnen Reiter innerhalb eines tabs-Elements. Der Benutzer kann den Reiter klicken, um die Seite in den Vordergrund zu holen, die zu der tabbox gehört.

+

Weitere Informationen im XUL Tutorial.

+
Attribute
accesskey, afterselected, beforeselected, command, crop, disabled, first-tab, image, label, last-tab, linkedpanel, oncommand, pinned, selected, tabindex, validate, value
+
+
Eigenschaften
accessKey, accessibleType, command, control, crop, disabled, image, label, linkedPanel, selected, tabIndex, value
+
+

Beispiele

+

(Beispiel benötigt)

+

Attribute

+

+ +
accesskey
Typ: character
Dem Attribut wird der Buchstabe zugewiesen, der als Tastenkürzel für das Element dienen soll. Dieser Buchstabe sollte sinnvollerweise innerhalb des Textes des Attributs label des Elements vorkommen.
+
+ +
+ + +
+
afterselected
+
Type: boolean
+
This is set to true if the tab is immediately after the currently selected tab. This is automatically set when needed and you shouldn't adjust it manually. This is primarily useful for themes so that they can adjust the appearance of the area around the selected tab.
+
+
+ + +
+
beforeselected
+
Type: boolean
+
This is set to true if the tab is immediately before the currently selected tab. This is set automatically set when needed and you shouldn't adjust it manually. This is primarily useful for themes so that they can adjust the appearance of the area around the selected tab.
+
+
+ +
+
+ crop
+
+ Type: one of the values below
+
+ If the label of the element is too big to fit in its given space, the text will be cropped on the side specified by the crop attribute. An ellipsis will be used in place of the cropped text. If the box direction is reversed, the cropping is reversed.
+
+
+
+ start
+
+ The text will be cropped on its left side in left-to-right text locales, and the right side in right-to-left locales.
+
+ end
+
+ The text will be cropped on its right side in left-to-right text locales, and the right side in right-to-left locales.
+
+ left
+
+ The text will be cropped on its left side.
+
+ right
+
+ The text will be cropped on its right side.
+
+ center
+
+ The text will be cropped in the middle, showing both the start and end of the text normally.
+
+ none
+
+ The text will be not be cropped using an ellipsis. However, the text will simply be cut off if it is too large. The side depends on the CSS text alignment.
+
+
+
+ Depending on the platform and theme being used, some elements will have set a maximum width so they will always appear cropped. If you wish to use the value none and the displayed text is larger than this maximum width, you may be able to use the max-width CSS property (or the maxwidth attribute) to override this size. For example, for a menuitem in a menu you can add the following CSS rule when you want to use the value none:
+
+ 
menupopup > menuitem, menupopup > menu { max-width: none; }
+
+
+
+
+ +
disabled
Typ: boolean
Kennzeichnet, ob ein Element deaktiviert ist oder nicht. Wenn das Element auf  true gesetzt ist, ist das Element deaktiviert. Deaktivierte Elemente sind gewöhnlich mit einem grauen Text dargestellt. Wenn ein Element deaktiviert ist, wird es auf Anwenderaktionen nicht reagieren, es kann den Fokus nicht erlangen und das command Ereignis wird nicht ausgelöst. Das Element wird allerdings noch auf Mausereignisse antworten. Um das Element zu aktivieren, ist es besser das Attribut zu entfernen als es auf den Wert false zu setzen. Um den Wert dieses Attributs mittels JavaScript zu setzen oder abzurufen, sollte besser die disabled Eigenschaft verwendet werden.
+
+ + +
+ + +
+
first-tab
+
Type: boolean
+
This attribute will be set to true for the first tab. This attribute should not be set manually, but is useful in a theme if the first tab should be styled differently.
+
+
+ +
+
image
+
Type: URI
+
The URI of the image to appear on the element. If this attribute is empty or left out, no image appears. The position of the image is determined by the dir and orient attributes.
+
+ + + +
+ +
label
Typ: string
Die Beschriftung für das Element. Wird das Attribut nicht angegeben, so erscheint auch kein Beschriftungstext.
+
+ +
+ + +
+
last-tab
+
Type: boolean
+
This attribute will be set to true for the last tab. This attribute should not be set manually, but is useful in a theme if the last tab should be styled differently.
+
+
+ + +
+
linkedpanel
+
Type: id
+
The id of the linked tabpanel element that will be displayed when the tab is selected. If this attribute is not used, the tab will be connected to the panel at the corresponding index in the tabpanels element that the tab is in its tabs container. However, if this attribute is used, this behavior is overridden, and the tab will always be linked to a specific panel. This might be used to avoid duplication by linking several tabs to one panel with slight differences to the content adjusted in the select event.
+
+
+ + +
+
oncommand
+
Type: script code
+
This event handler is called when the command is activated. This occurs when a user selects a menu item or presses a keyboard shortcut attached to the command.
+
+ + +
+ +
pinned
Type: boolean
This attribute is set to true if the tab has been pinned (that is, if it's an app tab). The tabbrowser element's pinTab and unpinTab methods handle pinning and unpinning tabs.
+
+
+ + +
+
selected
+
Type: boolean
+
This attribute is set to true if the tab is selected by default.
+
+ + +
+ + +
+
tabindex
+
Type: integer
+
The tab order of the element. The tab order is the order in which the focus is moved when the user presses the "tab" key. Elements with a higher tabindex are later in the tab sequence.
+
+
+ + +
+
validate
+
Type: one of the values below
+
This attribute indicates whether to load the image from the cache or not. This would be useful if the images are stored remotely or you plan on swapping the image frequently. The following values are accepted, or leave out the attribute entirely for default handling:
+
+
+
always
+
The image is always checked to see whether it should be reloaded.
+
never
+
The image will be loaded from the cache if possible.
+
+
+
+
+

Eigenschaften

+

+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+

Probleme

+

In Versionen vor Gecko 1.9 (Firefox 3.0) ist es nicht möglich, einen Reiter außer Kraft zu setzen. Der Reiter wird zwar "grau" dargestellt, akzeptiert jedoch Ereignisse. Dieses Verhalten wurde in Firefox 3 behoben.

+

Des weiteren führt ein Wiederanzeigen eines Reiters nach dem Verstecken zu einer unvorhersehbaren Anordnung der Reiter. Siehe Bug 307088 und Bug 261826. (Es empfiehlt sich collapsed statt hidden zu verwenden)

+

Verwandte Themen

+
Elemente
tabbox, tabs, tabpanels, tabpanel.
Schnittstellen
nsIAccessibleProvider, nsIDOMXULSelectControlItemElement
+
diff --git a/files/de/archive/mozilla/xul/tabbox/index.html b/files/de/archive/mozilla/xul/tabbox/index.html new file mode 100644 index 0000000000..29c5cf9dab --- /dev/null +++ b/files/de/archive/mozilla/xul/tabbox/index.html @@ -0,0 +1,77 @@ +--- +title: tabbox +slug: Archive/Mozilla/XUL/tabbox +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/tabbox +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Ein Behälter für die Anzeige von Seiten mit Karteikarten/-reitern. Das Element tabbox sollte zwei Kindelemente enthalten. Als erstes ein tabs Element, welches je Reiter ein tab Element enthält und als zweites ein tabpanels Element, welches den Inhalt der Seiten aufnimmt.

+

Weitere Informationen im XUL Tutorial.

+
Attribute
eventnode, handleCtrlPageUpDown, handleCtrlTab
+
+
Eigenschaften
accessibleType, eventNode, handleCtrlPageUpDown, handleCtrlTab, selectedIndex, selectedPanel, selectedTab, tabs, tabpanels
+
+

Beispiele

+
<tabbox id="myTabList" selectedIndex="2">
+  <tabs>
+    <tab label="Erster Reiter"/>
+    <tab label="Zweiter Reiter"/>
+    <tab label="Weiterer Reiter"/>
+    <tab label="Letzter Reiter"/>
+  </tabs>
+  <tabpanels>
+    <tabpanel><!-- tabpanel Erste Elemente hierher --></tabpanel>
+    <tabpanel><!-- tabpanel Zweite Elemente hierher --></tabpanel>
+    <tabpanel><button label="Klick mich"/></tabpanel>
+    <tabpanel><!-- tabpanel Vierte Elemente hierher --></tabpanel>
+  </tabpanels>
+</tabbox>
+
+

Image:XUL_REF_tabboxes.gif

+

Attribute

+

+ + +
+
eventnode
+
Type: one of the values below
+
Indicates where keyboard navigation events are listened to. If this attribute is not specified, events are listened to from the tabbox. Thus, if this attribute is not used, the tabbox or an element inside it must have the focus for the keyboard navigation to apply.
+
+
+
parent
+
Keyboard navigation is captured at the parent of the tabbox.
+
window
+
Keyboard navigation is captured at the window level. Tab navigation will occur as long as any element in the window is focused.
+
document
+
Keyboard navigation is captured at the document level. Tab navigation will occur as long as any element in the document is focused.
+
+
+
+
+ +
+ + +
+
handleCtrlTab
+
Type: boolean
+
If set to true or omitted, the tabbox will switch to the next tab when the Control and Tab keys are pressed. If the Shift key is also held down, the previous tab will be displayed. If this attribute is set to false, these keys do not navigate between tabs.
+
+
+

Eigenschaften

+

+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+

Verwandt

+
Elemente
tabs, tab, tabpanels, tabpanel.
+
diff --git a/files/de/archive/mozilla/xul/tabpanels/index.html b/files/de/archive/mozilla/xul/tabpanels/index.html new file mode 100644 index 0000000000..8c58b9b082 --- /dev/null +++ b/files/de/archive/mozilla/xul/tabpanels/index.html @@ -0,0 +1,100 @@ +--- +title: tabpanels +slug: Archive/Mozilla/XUL/tabpanels +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/tabpanels +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Ein Container, der Seiten in Form von tabbox Elementen enthält. Das tabpanels Element sollte in einer tabbox platziert sein, es muss aber nicht unbedingt ein direktes Kindelement sein. Die Kindelemente des tabpanels Elements werden zu Panels des tabbox Elements. In den meisten Fällen würde ein vbox Element benutzt werden, aber es kann jedes Element verwendet werden, wobei die meisten Autoren am Liebsten das tabpanel Element gebrauchen. Wenn auf den ersten Tag geklickt wird, wird dieser angezeigt. Wenn auf den zweiten Tab geklickt wird, wird dieser angezeigt und so weiter. Es sollte die selbe Anzahl an Panels vorhanden sein wie Tabs. Panels sollten niemals versteckt sein, denn das bedeutet, dass das Panel unzugänglich ist.

+

Weitere Informationen sind im XUL Tutorial verfügbar.

+
Attribute
selectedIndex
+
+
Eigenschaften
selectedIndex, selectedPanel
+
+

Beispiele

+

(Beispiel benötigt)

+

Attribute

+
+ + +
+
selectedIndex
+
Type: integer
+
Gets and sets the index of the currently selected panel. The first item is at index 0.
+
+
+ + + + + +

Geerbt von XUL-Element
+align, +allowevents, +allownegativeassertions, +class, +coalesceduplicatearcs, +collapsed, +container, +containment, +context, +contextmenu, +datasources, +dir, +empty, +equalsize, +flags, +flex, +height, +hidden, +id, +insertafter, +insertbefore, +left, +maxheight, +maxwidth, +menu, +minheight, +minwidth, +mousethrough, +observes, +ordinal, +orient, +pack, +persist, +popup, +position, +preference-editable, +querytype, +ref, +removeelement, +sortDirection, +sortResource, +sortResource2, +statustext, +style, +template, +tooltip, +tooltiptext, +top, +uri, +wait-cursor, +width

+
+

Eigenschaften

+

+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+

Verwandte Themen

+
Elemente
tabbox, tabs, tab, tabpanel.
+
diff --git a/files/de/archive/mozilla/xul/tabs/index.html b/files/de/archive/mozilla/xul/tabs/index.html new file mode 100644 index 0000000000..21f0853e04 --- /dev/null +++ b/files/de/archive/mozilla/xul/tabs/index.html @@ -0,0 +1,123 @@ +--- +title: tabs +slug: Archive/Mozilla/XUL/tabs +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/tabs +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Behälter für einzelne Reiter. Ein tabs-Element kann innerhalb einer tabbox benutzt werden und nimmt selbst tab-Elemente auf.

+

Mehr Information im XUL Tutorial.

+
Attribute
closebutton, disableclose, disabled, onclosetab, onnewtab, onselect, setfocus, tabbox, tabindex, tooltiptextnew, value,
+
+
Eigenschaften
accessibleType, disabled, itemCount, selectedIndex, selectedItem, tabIndex, value,
+
+
Methoden
advanceSelectedTab, appendItem, getIndexOfItem, getItemAtIndex, insertItemAt, removeItemAt
+
+

Beispiele

+

(Beispiel benötigt)

+

Attribute

+

+ +
+
+ closebutton Obsolete since Gecko 1.9.2
+
+ Type: boolean
+
+ If this attribute is set to true, the tabs row will have a "new tab" button and "close" button on the ends. This feature is used by the tabbrowser to provide the facilities for adding and closing tabs. You can set an image to the "new tab" and "close" buttons by applying them to the tabs-newbutton and tabs-closebutton classes respectively.
+
+
+ + +
+
disableclose
+
Type: boolean
+
If this attribute is true the close button will be disabled.
+
+
+ +
disabled
Typ: boolean
Kennzeichnet, ob ein Element deaktiviert ist oder nicht. Wenn das Element auf  true gesetzt ist, ist das Element deaktiviert. Deaktivierte Elemente sind gewöhnlich mit einem grauen Text dargestellt. Wenn ein Element deaktiviert ist, wird es auf Anwenderaktionen nicht reagieren, es kann den Fokus nicht erlangen und das command Ereignis wird nicht ausgelöst. Das Element wird allerdings noch auf Mausereignisse antworten. Um das Element zu aktivieren, ist es besser das Attribut zu entfernen als es auf den Wert false zu setzen. Um den Wert dieses Attributs mittels JavaScript zu setzen oder abzurufen, sollte besser die disabled Eigenschaft verwendet werden.
+
+ + +
+ + +
+
onclosetab
+
Type: script code
+
This script will be called when the close tab button is clicked.
+
+
+ + +
+
onnewtab
+
Not in Firefox
+
Type: script code
+
This script will be called when the new tab button is clicked.
+
+
+ + +
+
onselect
+
Type: script code
+
This event is sent to the tabs element when this tab is changed.
+
+ + +
+ + +
+
setfocus
+
Type: boolean
+
If true or omitted, the focus will be given to the first element in the corresponding tabpanel when the tabs are navigated via the keyboard. If this attribute is false, the focus does not change during navigation.
+
+ + +
+ + +
+
tabindex
+
Type: integer
+
The tab order of the element. The tab order is the order in which the focus is moved when the user presses the "tab" key. Elements with a higher tabindex are later in the tab sequence.
+
+
+ + +
+
tooltiptextnew
+
Not in Firefox
+
Type: string
+
Used to set the text which appears in the tooltip when the user moves the mouse over the new button in the tab row.
+
+
+

Eigenschaften

+

+

Methoden

+ + + + + + +
+

Geerbte Methoden
+element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()

+ +
+

Verwandte Themen

+
Elemente
tabbox, tab, tabpanels, tabpanel.
Schnittstellen
nsIAccessibleProvider, nsIDOMXULSelectControlElement
+
diff --git a/files/de/archive/mozilla/xul/textbox/index.html b/files/de/archive/mozilla/xul/textbox/index.html new file mode 100644 index 0000000000..a96f2673d5 --- /dev/null +++ b/files/de/archive/mozilla/xul/textbox/index.html @@ -0,0 +1,334 @@ +--- +title: textbox +slug: Archive/Mozilla/XUL/Textbox +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/textbox +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Ein Eingabefeld, in dem der Benutzer einen Text eingeben kann. Die textbox ist ähnlich wie das HTML input Element. Nur eine Textzeile wird im Standardverhalten angezeigt. Das multiline Attribut kann das Feld auch mit mehreren Zeilen ausstatten.

+

Weitere Informationen sind im XUL Tutorial verfügbar.

+
Attribute
cols, decimalplaces, disabled, emptytext, hidespinbuttons, increment, label, max, maxlength, min, multiline, newlines, onchange, oninput, placeholder, preference, readonly, rows, searchbutton, size, spellcheck, tabindex, timeout, type, value, wrap, wraparound
+
+
Eigenschaften
accessibleType, clickSelectsAll, decimalPlaces, decimalSymbol, defaultValue, disabled, editor, emptyText, increment, inputField, label, max, maxLength, min, placeholder, readOnly, searchButton, selectionEnd, selectionStart, size, spinButtons, tabIndex, textLength, timeout, type, value, valueNumber, wrapAround
+
+
Methoden
decrease, increase, reset, select, setSelectionRange
+
+
Styleklassen
plain
+
+

Besipiele

+
Image:XUL_ref_textbox.png
+
<vbox>
+<label control="your-name" value="Enter your name:"/>
+<textbox id="your-name" value="John"/>
+</vbox>
+
+

Attribute

+

+ +
cols
Typ: integer
Stellt die Anzahl an Spalten für mehrzeilige Textboxen dar.
+
+ +
+ +
decimalplaces
Typ: integer
Die Anzahl an Dezimalstellen, die angezeigt werden sollen. Der Standardwert ist 0, was bedeutet, dass keine Dezimalstellen angezeigt werden. Der Wert infinity kann dazu verwendet werden, keine Begrenzung der Dezimalstellen bei Zahlen anzuzeigen. Hinweis: Dezimalzahlen werden als Floats gespeichert.
+
+ +
+ +
disabled
Typ: boolean
Kennzeichnet, ob ein Element deaktiviert ist oder nicht. Wenn das Element auf  true gesetzt ist, ist das Element deaktiviert. Deaktivierte Elemente sind gewöhnlich mit einem grauen Text dargestellt. Wenn ein Element deaktiviert ist, wird es auf Anwenderaktionen nicht reagieren, es kann den Fokus nicht erlangen und das command Ereignis wird nicht ausgelöst. Das Element wird allerdings noch auf Mausereignisse antworten. Um das Element zu aktivieren, ist es besser das Attribut zu entfernen als es auf den Wert false zu setzen. Um den Wert dieses Attributs mittels JavaScript zu setzen oder abzurufen, sollte besser die disabled Eigenschaft verwendet werden.
+
+ + +
+ +
emptytext Unerwünscht Gecko 2
Typ: string
Ein String, der in der Textbox angezeigt wird, falls diese keinen Wert besitzt. Dieses Attribut wurde vom placeholder Attribut in Gecko 2 ersetzt. Der alte Name bleibt zur Kompatibilität bestehen, aber Sie sollten Ihren Code aktualisieren.
+
+ +
+ +
hidespinbuttons
Typ: boolean
Falls der Wert auf true gesetzt wird, werden keine Buttons mit Pfeilen angezeigt, um den Wert des Feldes anzupassen. Der Wert kann dann ausschließlich per Tastatur eingegeben werden. Standardmäßig ist der Wert false.
+
+ +
+
+ increment
+
+ Type: integer
+
+ The amount by which the curpos (for scroll bars) or value (for number boxes and scale) attribute changes when the arrows are clicked(or scales are dragged). The default value is 1.
+
+
+ + +
+
label
+
Type: string
+
If present and not empty, this will be exposed to screen readers through the label property.
+
+
+ +
+
+ Type: integer
+
+ The maximum value that the scale or number box may be set to. The default value is 100 for scales and Infinity for number boxes.
+
+ +

 

+
+ + +
+
maxlength
+
Type: integer
+
The maximum number of characters that the textbox allows to be entered.
+
+
+ +
+
+ min
+
+ Type: integer
+
+ The minimum value the control's value may take. The default value is 0.
+
+

 

+
+ + +
+
multiline
+
Type: boolean
+
If true, the textbox displays multiple lines. If the user presses Enter, a new line is started. If false, the textbox only allows entry of one line.
+
+
+ + +
+
newlines
+
Type: one of the values below
+
How the text box handles pastes with newlines in them.
+
Possible values: +
+
pasteintact
+
Paste newlines unchanged
+
pastetofirst
+
Paste text up to the first newline, dropping the rest of the text
+
replacewithcommas
+
Pastes the text with the newlines replaced with commas
+
replacewithspaces
+
Pastes the text with newlines replaced with spaces
+
strip
+
Pastes the text with the newlines removed
+
stripsurroundingwhitespace
+
Pastes the text with newlines and adjacent whitespace removed
+
+
+
+
+ + +
+
onchange
+
Type: script code
+
This event is sent when the value of the textbox is changed. The event is not sent until the focus is moved to another element.
+
+ + +
+ + +
+
oninput
+
Type: script code
+
This event is sent when a user enters text in a textbox. This event is only called when the text displayed would change, thus it is not called when the user presses non-displayable keys.
+
+ + +
+ + +
+
preference
+
Type: id
+
Connects the element to a corresponding preference. This attribute only has any effect when used inside a prefwindow. More information is available in the Preferences System article.
+
+
+ + +
+
readonly
+
Type: boolean
+
If set to true, then the user cannot change the value of the element. However, the value may still be modified by a script.
+
+
+ +
+
+ rows
+
+ Type: integer
+
+ The number of rows to display in the element. If the element contains more than this number of rows, a scrollbar will appear which the user can use to scroll to the other rows. To get the actual number of rows in the element, use the getRowCount method.
+
+
+ + +
+
searchbutton
+
Type: boolean
+
If true, the search field will only fire a command event when the user presses the search button or presses the Enter key. Otherwise, the command event is fired whenever the user modifies the value. This attribute only applies to textboxes with the type search.
+
+
+ + +
+
size
+
Type: integer
+
The number of characters that can be displayed in the textbox.
+
+
+ + +
+
spellcheck
+
Type: boolean
+
If true, spell checking is enabled by default for the text box; if false, spell checking is disabled by default.
+
If not specified, this defaults to false
+
+ +

The HTML

+ +
+

The spellcheck attribute uses values of true or false (you cannot simply add the spellcheck attribute to a given element):

+ +
<!-- spellcheck everything! -->
+<input type="text" spellcheck="true" /><br />
+<textarea spellcheck="true"></textarea>
+<div contenteditable="true" spellcheck="true">I am some content</div>
+
+<!-- spellcheck nothing! -->
+<input type="text" spellcheck="false" /><br />
+<textarea spellcheck="false"></textarea>
+<div contenteditable="true" spellcheck="false">I am some content</div>
+ +

You can use spellcheck on INPUT, TEXTAREA, and contenteditable elements.  Thespellcheck attribute works well paired with the autocomplete, autocapitalize, and autocorrect attributes too!

+ +

Added from David Walsh's article on Spell Check.

+
+
+ + +
+
tabindex
+
Type: integer
+
The tab order of the element. The tab order is the order in which the focus is moved when the user presses the "tab" key. Elements with a higher tabindex are later in the tab sequence.
+
+
+ + +
+
timeout
+
Type: integer
+
For autocomplete textboxes, the number of milliseconds before the textbox starts searching for completions. The default is 50 milliseconds. For search textboxes, the number of milliseconds before the timer fires a command event. The default is 500 milliseconds. For timed textboxes, the number of milliseconds before the timer fires a command event. There is no default. The timer starts after the user types a character. If the user types another character, the timer resets.
+
+
+ + +
+
type
+
Type: one of the values below
+
You can set the type attribute to one of the values below for a more specialized type of textbox. Don't set the type if you wish to use a regular textbox.
+
+
+
autocomplete
+
A textbox that supports autocomplete. For more information about autocomplete textboxes, see the autocomplete documentation (XPFE [Thunderbird/SeaMonkey]) (Firefox)
+
number
+
 A textbox that only allows the user to enter numbers. In addition, arrow buttons appear next to the textbox to let the user step through values. There are several attributes that allow the number textbox to be configured, including decimalplaces, min, max, increment, wraparound, hidespinbuttons, and textbox.value.
+
password
+
A textbox that hides what is typed, used for entering passwords.
+
search
+
 A textbox intended for searching. The command event will fire as the user modifies the value. A listener for the command event should update search results. If the searchbutton attribute is set to true, the command event is only fired if the user presses the search button or presses the Enter key. You may specify grey text to appear when the search box is empty using the emptytext attribute, and a timeout may be set for the command event using the timeout attribute (defaults to 500).
+
timed
+
This textbox will fire a command event after the user types characters and a certain time has passed. The delay is set with the timeout attribute. The command event will fire if the user presses the Enter key. The timed type is deprecated in Gecko 1.9.1 and the search textbox may be used instead.
+
+
+
+ + +
+ + +
+
value
+
Type: string
+
The default value entered in a textbox. The attribute only holds the default value and is never modified when the user enters text. To get the updated value, use the value property. For number boxes, the default is 0 or the minimum value returned by the min property, whichever is higher.
+
+ + +
+ + +
+
wrap
+
Type: string
+
Set this attribute to the value off to disable word wrapping in the textbox. If this attribute is not specified, word wrapping is enabled.
+
+
+ + +
+
wraparound
+
Type: boolean
+
If true, the value of the number box will wrap around when the maximum or minimum value is exceeded. The minimum and maximum values must both not be infinity.
+
+
+

Eigenschaften

+

+ + +
+
placeholder
+
Type: string
+
A string that appears in the textbox when it has no value.
+
+
+

Methoden

+

+

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+

Styleklassen

+

Folgende Klassen können benutzt werden, um den Stil des Elements zu bestimmen. Statt den Stil des Elements direkt zu ändern, sollten diese Klassen zu Hilfe genommen werden, da sie sich natürlicher in das vom Benutzer gewählte Theme der Benutzeroberfläche einfügen.

+
+
plain
+
This class causes the element to be displayed with no border or margin.
+
+

Hinweise

+

Das maxlength Attribut funktioniert nicht, wenn man im Mehrzeilenmodus ist. Ein Workaround mittels JavaScript und dem onkeypress Eventhandler stellt eine Lösung dar.

+

Das XUL script:

+
<textbox id="pnNote" multiline="true" rows="2" cols="70" onkeypress="return pnCountNoteChars(event);"/>
+
+

Das Javascript:

+
function pnCountNoteChars(evt) {
+    //Erlaube Tasten, die keine Zeichen sind (Entfernen, Backspace etc.)
+    if ((evt.charCode == 0) && (evt.keyCode != 13))
+      return true;
+
+    if(evt.target.value.length < 10) {
+        return true;
+    } else {
+        return false;
+    }
+}
+

Verwandte Themen

+
Schnittstellen
nsIAccessibleProvider, nsIDOMXULTextboxElement
+
diff --git a/files/de/archive/mozilla/xul/treecol/index.html b/files/de/archive/mozilla/xul/treecol/index.html new file mode 100644 index 0000000000..dbfeb1c995 --- /dev/null +++ b/files/de/archive/mozilla/xul/treecol/index.html @@ -0,0 +1,262 @@ +--- +title: treecol +slug: Archive/Mozilla/XUL/treecol +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/treecol +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Eine Spalte eines tree Elementes. Dieses Element zeigt einen Spaltenkopf an und beinhaltet Informationen über Größe und andere Eingenschaften über die Spalte. Außerdem können splitter Elemente zwischen den einzelnen Spalten gesetzt werden, um Veränderungen an der Spaltengröße zu erlauben. Es sollte immer ein id Attribut für ein treecol Element festgelegt werden, um sicher zu gehen, dass die Spaltenpositionierung richtig angewendet wird.

+

Weitere Informationen finden sich im XUL Tutorial.

+
Attribute
crop, cycler, dragging, editable, fixed, hidden, hideheader, ignoreincolumnpicker, label, primary, sort, sortActive, sortDirection, src, type, width
+
+
Eigenschaften
accessibleType
+
+
Style Klassen
treecol-image
+
+

Beispiele

+
Image:Xul_tree_col_checked.png
+

Dieses Beispiel zeigt eine Checkbox in der ersten Spalte.

+
<tree flex="1" editable="true">
+
+  <treecols>
+    <treecol label="Active" type="checkbox" editable="true"/>
+    <treecol label="Name" flex="1" />
+  </treecols>
+
+  <treechildren>
+    <treeitem>
+      <treerow>
+      	<treecell value="true"/>
+        <treecell label="Alice"/>
+      </treerow>
+    </treeitem>
+    <treeitem>
+      <treerow>
+        <treecell value="false"/>
+        <treecell label="Bob"/>
+      </treerow>
+    </treeitem>
+  </treechildren>
+
+</tree>
+
+

Um die Checkbox auf einigen Plattformen sichtbar zu machen, müssen die folgenden Angaben zum Stylesheet hinzugefügt werden (siehe treecol.type). Bei Firefox 2.x und 3.x, benutzen alle Betriebssysteme außer Mac OS X diese Angaben bereits als Standard. Um Firefox für Mac OS X mit einzubeziehen, sollten diese Angaben auf jeden Fall notiert werden und ein eigenes Checkbox-Bild verwendet werden. Für SeaMonkey auf Mac OS X ist das Bild chrome://global/skin/checkbox/cbox-check.gif jedoch verfügbar.

+
treechildren::-moz-tree-checkbox {
+  /* nicht angewählte Baumzellen. Dieser Deklaration MUSS vor treechildren::-moz-tree-checkbox(checked) erfolgen, sonst führt es zu keinem Effekt.  */
+  list-style-image: none;
+}
+
+treechildren::-moz-tree-checkbox(checked){
+  /* css für angewählte Zellen. cbox-check.gif ist in Firefox 1, 2, und 3 auf Mac OS X nicht verfügbar, es sollte also eine URL auf ein Bild in der Erweiterung oder woanders festgelegt werden. */
+  list-style-image: url("chrome://global/skin/checkbox/cbox-check.gif");
+}
+
+

Attribute

+

+ +
+
+ crop
+
+ Type: one of the values below
+
+ If the label of the element is too big to fit in its given space, the text will be cropped on the side specified by the crop attribute. An ellipsis will be used in place of the cropped text. If the box direction is reversed, the cropping is reversed.
+
+
+
+ start
+
+ The text will be cropped on its left side in left-to-right text locales, and the right side in right-to-left locales.
+
+ end
+
+ The text will be cropped on its right side in left-to-right text locales, and the right side in right-to-left locales.
+
+ left
+
+ The text will be cropped on its left side.
+
+ right
+
+ The text will be cropped on its right side.
+
+ center
+
+ The text will be cropped in the middle, showing both the start and end of the text normally.
+
+ none
+
+ The text will be not be cropped using an ellipsis. However, the text will simply be cut off if it is too large. The side depends on the CSS text alignment.
+
+
+
+ Depending on the platform and theme being used, some elements will have set a maximum width so they will always appear cropped. If you wish to use the value none and the displayed text is larger than this maximum width, you may be able to use the max-width CSS property (or the maxwidth attribute) to override this size. For example, for a menuitem in a menu you can add the following CSS rule when you want to use the value none:
+
+ 
menupopup > menuitem, menupopup > menu { max-width: none; }
+
+
+
+
+ + +
+
cycler
+
Type: boolean
+
If true, then the column is a cycler column. In the case, clicking on a cell in the column will alternate its state between on and off. This is used, for example, in a mail window, for a column that indicates that the message is read or unread with a small mark in the cell. If the cycler attribute is not set, the cell is a regular text cell.
+
+
+ + +
+
dragging
+
Type: boolean
+
This attribute will be set to true if the column is being dragged. This attribute is set automatically; you shouldn't adjust it yourself.
+
+
+ + +
+
editable
+
Type: boolean
+
Allows the contents of cells in the column to be changed, especially useful when type="checkbox". When the user double-clicks an editable cell, a text field appears in which the user can edit the contents of the cell.
+
+ +
+
The tree must also be marked as editable in order for this to work. Individual treecell elements in the column may be marked editable="false" in order to disable editing.
+
+
+ + +
+
fixed
+
Type: boolean
+
If true, the size of the column in the tree cannot be adjusted by the user. Any splitter to either side will resize those columns while keeping the fixed column at a constant size. If false or not specified, the user can adjust the size of the column, typically by dragging the column header with the mouse.
+
+
+ + +
+
hidden
+
Type: boolean
+
If set to true, the element is not displayed. This is similar to setting the CSS display property to 'none'.
+
+ + +
+ + +
+
hideheader
+
Type: boolean
+
Set this to true to indicate that the tree column header should be displayed without any column header styling. If you don't set a label for that column either, the header is not displayed at all.
+
+
+ + +
+
ignoreincolumnpicker
+
Type: boolean
+
If true, the column does not appear in the column picker.
+
+
+ +
label
Typ: string
Die Beschriftung für das Element. Wird das Attribut nicht angegeben, so erscheint auch kein Beschriftungstext.
+
+ +
+ + +
+
primary
+
Type: boolean
+
If set to true, the treecol will have indentation and twisties drawn to the left of it to indicate the hierarchy level of the rows. If no column has the primary attribute set to true, the tree may still contain nested rows, although no indication will be given to the user.  The attribute also controls whether the column picker allows the user to deselect this column.
+
+
+ + +
+
sort
+
Type: URI or XML attribute
+
Set this to a RDF property or XML attribute to have the data in the column sorted based on that property. The property will usually be the same as that of the cell label.
+
+
+ + +
+
sortActive
+
Type: boolean
+
This should be set to true for the column which should be sorted by default.
+
+
+ + +
+
sortDirection
+
Type: one of the values below
+
Set this attribute to set the direction that template-generated content is sorted. Use the sortResource attribute to specify the sort key. +
+
ascending
+
The data is sorted in ascending order.
+
descending
+
The data is sorted in descending order.
+
natural
+
The data is sorted in natural order, which means the order that it is stored in.
+
+
+
+
+ +
src
Typ: Bild-URL
Um für das treecol Element ein Bild für den Kopf, statt eines label Attribut zu benutzen, kann dieses Attribut gesetzt werden. Im Kopf können nicht gleichzeitig Bild und Beschriftung angezeigt werden. Die URL eines Bildes, das als Spaltenkopf des Baums angezeigt wird, kann mit diesem Attribut festgelegt werden. Wird das Attribut nicht angegeben, erscheint kein Bild und es wird stattdessen die Beschriftung angezeigt. Damit das Bild erscheint, muss die Klasse treecol-image für das treecol Element gesetzt werden. Ein label sollte dennoch für die Benutzung im Spaltenwähler angegeben werden, falls ignoreincolumnpicker nicht true ist und hidecolumnpicker für den tree ebenfalls nicht true ist .
+
+ +
+ + +
+
type
+
Type: one of the values below
+
The type of tree column. The default is a text column that displays the content as text.
+
+
+
checkbox
+
The content of the columns are checkboxes.
+
progressmeter
+
The content of the columns are a progress meters. This is used in Mozilla's download manager window.
+
text
+
The content of the columns is text.
+
+
+
+ + +
+ + +
+
width
+
Type: string (representing an integer)
+
The preferred width of the tree column. The value should not include a unit as all values are in pixels. Specifying widths for your columns causes Gecko to allow the tree to be scrolled horizontally if it is wider than the available space.
+
+
+

Eigenschaften

+
+

Geerbte Eigenschaften
align, , allowEvents, , boxObject, builder, , , , className, , , , , collapsed, contextMenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxHeight, maxWidth, menu, minHeight, minWidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statusText, style, ,, tooltip, tooltipText, top, width
+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+

Style Klassen

+

Die folgenden Style Klassen können verwendet werden, um das Aussehen des Elementes zu verändern. Diese Klasse sollte verwendet werden, anstatt das Aussehen des Elementes direkt zu verändern, damit es dann besser mit dem, vom Benutzer gewählten, Theme zusammenarbeiten kann.

+
treecol-image
Um ein Bild als Kopf der Baumspalte anzuzeigen, wird diese Klasse benutzt. Das Bild selbst wird über das Attribut src angegeben.
+
+

Verwandte Themen

+
Elemente
tree, treecols, treechildren, treeitem, treerow, treecell und treeseparator.
Schnittstellen
nsIAccessibleProvider
+
diff --git a/files/de/archive/mozilla/xul/vbox/index.html b/files/de/archive/mozilla/xul/vbox/index.html new file mode 100644 index 0000000000..d45736c02a --- /dev/null +++ b/files/de/archive/mozilla/xul/vbox/index.html @@ -0,0 +1,100 @@ +--- +title: vbox +slug: Archive/Mozilla/XUL/vbox +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/vbox +--- +
+ + « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Ein Behälterelement, das eine gewünschte Anzahl von Kindelementen enthalten kann. Gleichwertig zum Element box, mit dem Unterschied, dass die Ausrichtung per Vorgabe vertikal ist.

+

Mehr Information im XUL Tutorial.

+

Beispiel

+
<!-- Zwei Beschriftungen am unteren Rand -->
+<vbox>
+  <spacer flex="1"/>
+  <label value="Eins"/>
+  <label value="Zwei"/>
+</vbox>
+
+

Attribute

+ + + + + + +

Geerbt von XUL-Element
+align, +allowevents, +allownegativeassertions, +class, +coalesceduplicatearcs, +collapsed, +container, +containment, +context, +contextmenu, +datasources, +dir, +empty, +equalsize, +flags, +flex, +height, +hidden, +id, +insertafter, +insertbefore, +left, +maxheight, +maxwidth, +menu, +minheight, +minwidth, +mousethrough, +observes, +ordinal, +orient, +pack, +persist, +popup, +position, +preference-editable, +querytype, +ref, +removeelement, +sortDirection, +sortResource, +sortResource2, +statustext, +style, +template, +tooltip, +tooltiptext, +top, +uri, +wait-cursor, +width

+
+

Eigenschaften

+ +

Geerbte Eigenschaften
align, , allowEvents, , boxObject, builder, , , , className, , , , , collapsed, contextMenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxHeight, maxWidth, menu, minHeight, minWidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statusText, style, ,, tooltip, tooltipText, top, width
+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+

Verwandte Themen

+
+
+ Elemente
+
+ box, hbox
+
diff --git a/files/de/archive/mozilla/xul/window/index.html b/files/de/archive/mozilla/xul/window/index.html new file mode 100644 index 0000000000..8dfd0cb192 --- /dev/null +++ b/files/de/archive/mozilla/xul/window/index.html @@ -0,0 +1,209 @@ +--- +title: window +slug: Archive/Mozilla/XUL/Window +tags: + - XUL Elemente + - XUL Referenz +translation_of: Archive/Mozilla/XUL/window +--- +
+ « XUL Referenz Startseite [ + Beispiele | + Attribute | + Eigenschaften | + Methoden | + Verwandte Themen ] +
+

Beschreibt die Struktur eines Fensters. Dieses Element ist der Wurzelknoten eines XUL Dokuments. Das Fenster ist standardmäßig eine horizontal ausgerichtete Box und daher können alle box Attribute verwendet werden. Per Voreinstellung liegt um das Fenster ein plattform-spezifischer Rahmen.

+

Um ein Icon für das Fenster festzulegen, muss eine plattform-spezifische Icon-Datei <windowid>.ico und/oder <windowid>.xpm erstellt und in das <mozilla-verzeichnis>/chrome/icons/default/ Verzeichnis platziert oder installiert werden. Die <windowid> ist der Wert des id Attributs des Fensters. Dadurch wird für jedes Fenster ein unterschiedliches Icon ermöglicht.

+

Ohne die CSS Datei unter "chrome://global/skin/" einzubinden, wird das Fenster nicht durch CSS formatiert, unsichtbar und funktioniert nicht einwandfrei, wenn es als Dialog geöffnet wird.

+

Weitere Informationen sind im XUL Tutorial verfügbar.

+
Attribute
accelerated, drawintitlebar, height, hidechrome, id, lightweightthemes, lightweightthemesfooter, screenX, screenY, sizemode, title, width, windowtype
+
+

Beispiele

+
<?xml version="1.0"?>
+<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+<!-- Extremely recommended to keep this css include!! -->
+<window id="rootWnd" title="Register Online!"
+        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+  <vbox>
+    <hbox>
+      <image src="application_form.png"/>
+      <description>Register Online!</description>
+    </hbox>
+    <groupbox align="start">
+      <caption label="Your Information"/>
+      <radiogroup>
+        <vbox>
+          <hbox>
+            <label control="your-fname" value="Enter first name:"/>
+            <textbox id="your-fname" value="Johan"/>
+          </hbox>
+          <hbox>
+            <label control="your-lname" value="Enter last name:"/>
+            <textbox id="your-lname" value="Hernandez"/>
+          </hbox>
+          <hbox>
+            <button oncommand="alert('save!')">
+              <description>Save</description>
+            </button>
+          </hbox>
+        </vbox>
+      </radiogroup>
+    </groupbox>
+  </vbox>
+</window>
+
+

Attribute

+

+
accelerated
Type: boolean
Set this attribute to true to allow hardware layer managers to accelerate the window.
+
+ +
activetitlebarcolor
Typ: color string
Bestimmt die Hintergrundfarbe der Titelleiste eines Fensters, wenn es aktiv ist (Vordergrund). Außerdem versteckt dies die Trennlinie zwischen Titelleiste und Fensterinhalt. Dies trifft nur auf Mac OS Systeme zu.
+
+ +
+ +
drawintitlebar
Type: boolean
If this attribute is true, the top of the window's content area will begin at the top edge of the title bar, instead of below the title bar. This allows the window to draw in the title bar. This is supported only from window elements, and is ignored on platforms that don't support drawing into the title bar.
+
+
+ + +
+
height
+
Type: string (representing an integer)
+
The preferred height of the element in pixels. The actual displayed height may be different if the element or its contents have a minimum or maximum height. The CSS height property may also be used.
+
+
+ + +
+
hidechrome
+
Type: boolean
+
Set this attribute to true to have the chrome including the titlebar hidden.
+
+
+ + +
+
id
+
Type: unique id
+
A unique identifier so that you can identify the element with. You can use this as a parameter to getElementById() and other DOM functions and to reference the element in style sheets.
+
+ + +
+ + +
+
inactivetitlebarcolor
+
Type: color string
+
Specify background color of the window's titlebar when it is inactive (background). Moreover this hides separator between titlebar and window contents. This affects only on Mac OS X.
+
+
+ +
lightweightthemes
Type: boolean
true if the window supports lightweight themes, otherwise false.
+
+
+ +
lightweightthemesfooter
Type: id
Specifies the ID of an element to which a lightweight theme's footer image will be applied.
+
+
+ + +
+
screenX
+
Type: integer
+
The horizontal position at which the window appears on the screen.
+
+
+ + +
+
screenY
+
Type: integer
+
The vertical position at which the window appears on the screen.
+
+
+ + +
+
sizemode
+
Type: one of the values below
+
The state of the window. It can have one of the following values:
+
+
+
maximized
+
The window is maximized, and occupies the full size of the screen.
+
normal
+
The window appears in a normal state at the desired size.
+
+
+
+ +

This attribute is used to save and restore the state of a window (together with the persist attribute) and for CSS styles (e.g. to hide the resizer grippy on maximized windows).

+ +
Note: When a window is minimized, the sizemode attribute is not updated. This is done so that if a window is closed while minimized, its persisted sizemode attribute wouldn't be minimized.
+ +

Setting this attribute does not change the window state. Use window.maximize(), window.restore(), or window.minimize() to change the window state.

+ +

To get the window state from JavaScript code, use window.windowState. Listen to the sizemodechange event dispatched to the DOM window to get notified when the window state changes.

+ + +
+ + +
+
title
+
Type: string
+
The text to appear in the title bar of the window.
+
+
+ + +
+
width
+
Type: string (representing an integer)
+
The preferred width of the element. The value should not include a unit as all values are in pixels. The actual displayed width may be different if the element or its contents have a minimum or maximum width, or the size is adjusted by the flexibility or alignment of its parent. The CSS width property may also be used.
+
+ + +
+ +
+
+ windowtype
+
+ Type: string
+
+ Set to a string which can be used to identify the type of window. This might be used, for example, to distinguish between a browser window and an editor window. Some of Mozilla's window handling functions use this attribute to group windows of the same type together.
+
+
+

Values for window type as found on MXR: http://mxr.mozilla.org/mozilla-release/search?string=windowtype

+

navigator:browser - Looks like if window has gBrowser it has this window type

+

devtools:scratchpad - Scratchpad windows

+

navigator:view-source - The view source windows

+
+ +

 

+
+

Eigenschaften

+ +

Geerbte Eigenschaften
align, , allowEvents, , boxObject, builder, , , , className, , , , , collapsed, contextMenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxHeight, maxWidth, menu, minHeight, minWidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statusText, style, ,, tooltip, tooltipText, top, width
+

Methoden

+ +

Geerbte Methoden
element.addEventListener(), node.appendChild(), blur, click, node.cloneNode(), node.compareDocumentPosition(), element.dispatchEvent(), doCommand, focus, element.getAttribute(), element.getAttributeNode(), element.getAttributeNodeNS(), element.getAttributeNS(), element.getBoundingClientRect(), element.getClientRects(), getElementsByAttribute, getElementsByAttributeNS, element.getElementsByClassName(), element.getElementsByTagName(), element.getElementsByTagNameNS(), node.getFeature(), node.getUserData(), element.hasAttribute(), element.hasAttributeNS(), nodes.hasAttributes(), nodes.hasChildNodes(), node.insertBefore(), node.isDefaultNamespace(), node.isEqualNode(), node.isSameNode(), node.isSupported(), node.lookupNamespaceURI(), node.lookupPrefix(), node.normalize(), element.querySelector(), element.querySelectorAll(), element.removeAttribute(), element.removeAttributeNode(), element.removeAttributeNS(), node.removeChild(), element.removeEventListener(), node.replaceChild(), element.setAttribute(), element.setAttributeNode(), element.setAttributeNodeNS(), element.setAttributeNS(), node.setUserData()
+

Hinweise

+

Die Fehlermeldung "XML Parsing Error: undefined entity...<window" kann durch eine fehlende oder nicht erreichbare DTD Datei, die in der XUL Datei angegeben wurde, verursacht werden. Ein Dateiname mit einem SYSTEM Schlüsselwort in einer DOCTYPE Deklaration kann unter Umständen auch nicht geladen werden, ohne dass eine solche Fehlermeldung ausgegeben wird. In diesem Fall kann die Fehlermeldung ein nicht definierter Entity Fehler am nächsten XUL Element sein.

+

Verwandte Themen

+
Elemente
prefwindow, dialog, dialogheader
+
+
Fenster in Chrome

Benutzerhinweise

Um das Icon der Fenstertitelleiste zu ändern siehe: Fenster Icons.

Um ein Favicon zur Adressleiste und zum Tab hinzufügen, kann der folgende Codeschnipsel verwendet werden.

<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+	xmlns:html="http://www.w3.org/1999/xhtml">
+
+<!-- Icon from chrome -->
+<html:link rel="icon" href="chrome://myExtension/content/path/to/favicon.png"/>
+
+<!-- From a remote site -->
+<html:link rel="icon" href="http://www.mozilla.org/favicon.ico"/>
+
diff --git a/files/de/archive/mozilla/xul/xul_referenz/index.html b/files/de/archive/mozilla/xul/xul_referenz/index.html new file mode 100644 index 0000000000..b92aa1361e --- /dev/null +++ b/files/de/archive/mozilla/xul/xul_referenz/index.html @@ -0,0 +1,15 @@ +--- +title: XUL Referenz +slug: Archive/Mozilla/XUL/XUL_Referenz +tags: + - XUL + - XUL Referenz +translation_of: Archive/Mozilla/XUL/XUL_Reference +--- +

« XUL Referenz «

+

Alphabetische Liste aller XUL Elemente

+
  1. action
  2. arrowscrollbox
  3. assign
  4. bbox
  5. binding
  6. bindings
  7. box
  8. broadcaster
  9. broadcasterset
  10. button
  11. browser
  12. checkbox
  13. caption
  14. colorpicker
  15. column
  16. columns
  17. commandset
  18. command
  19. conditions
  20. content
  21. datepicker
  22. deck
  23. description
  24. dialog
  25. dialogheader
  26. dropmarker
  27. editor
  28. grid
  29. grippy
  30. groupbox
  31. hbox
  32. iframe
  33. image
  34. key
  35. keyset
  36. label
  37. listbox
  38. listcell
  39. listcol
  40. listcols
  41. listhead
  42. listheader
  43. listitem
  44. member
  45. menu
  46. menubar
  47. menuitem
  48. menulist
  49. menupopup
  50. menuseparator
  51. notification
  52. notificationbox
  53. observes
  54. overlay
  55. page
  56. panel
  57. param
  58. popupset
  59. preference
  60. preferences
  61. prefpane
  62. prefwindow
  63. progressmeter
  64. query
  65. queryset
  66. radio
  67. radiogroup
  68. resizer
  69. richlistbox
  70. richlistitem
  71. row
  72. rows
  73. rule
  74. scale
  75. script
  76. scrollbar
  77. scrollbox
  78. scrollcorner
  79. separator
  80. spacer
  81. spinbuttons
  82. splitter
  83. stack
  84. statusbar
  85. statusbarpanel
  86. stringbundle
  87. stringbundleset
  88. tab
  89. tabbrowser (Firefox-only ab Firefox 3/Gecko 1.9)
  90. tabbox
  91. tabpanel
  92. tabpanels
  93. tabs
  94. template
  95. textnode
  96. textbox
  97. textbox (Firefox autocomplete)
  98. textbox (Mozilla autocomplete)
  99. timepicker
  100. titlebar
  101. toolbar
  102. toolbarbutton
  103. toolbargrippy
  104. toolbaritem
  105. toolbarpalette
  106. toolbarseparator
  107. toolbarset
  108. toolbarspacer
  109. toolbarspring
  110. toolbox
  111. tooltip
  112. tree
  113. treecell
  114. treechildren
  115. treecol
  116. treecols
  117. treeitem
  118. treerow
  119. treeseparator
  120. triple
  121. vbox
  122. where
  123. window
  124. wizard
  125. wizardpage
    126. +
+

Kategorische Liste aller XUL Elemente

+

« XUL Referenz «

+

    Fenster

    1. dialog
    2. overlay
    3. page
    4. window
    5. wizard
    6. wizardpage
    7. preference
    8. preferences
    9. prefpane
    10. prefwindow

    Fensterstrukturen

    1. browser
    2. tabbrowser
    3. editor
    4. iframe
    5. titlebar
    6. resizer
    7. statusbar
    8. statusbarpanel
    9. dialogheader
    10. notification
    11. notificationbox

    Menüs und Popups

    1. menubar
    2. menu
    3. menuitem
    4. menuseparator
    5. menupopup
    6. panel
    7. tooltip
    8. popupset

    Toolbars

    1. toolbar
    2. toolbarbutton
    3. toolbargrippy
    4. toolbaritem
    5. toolbarpalette
    6. toolbarseparator
    7. toolbarset
    8. toolbarspacer
    9. toolbarspring
    10. toolbox

    Tabs und Gruppierungen

    1. tabbox
    2. tabs
    3. tab
    4. tabpanels
    5. tabpanel
    6. groupbox
    7. caption
    8. separator
    9. spacer

    Kontrollelemente

    1. button
    2. checkbox
    3. colorpicker
    4. datepicker
    5. menulist
    6. progressmeter
    7. radio
    8. radiogroup
    9. scale
    10. splitter
    11. textbox
    12. textbox (Firefox autocomplete)
    13. textbox (Mozilla autocomplete)
    14. timepicker

    Text und Bilder

    1. description
    2. label
    3. image

    Listen

    1. listbox
    2. listitem
    3. listcell
    4. listcol
    5. listcols
    6. listhead
    7. listheader
    8. richlistbox
    9. richlistitem

    Trees

    1. tree
    2. treecell
    3. treechildren
    4. treecol
    5. treecols
    6. treeitem
    7. treerow
    8. treeseparator

    Layout

    1. box
    2. hbox
    3. vbox
    4. bbox
    5. deck
    6. stack
    7. grid
    8. columns
    9. column
    10. rows
    11. row
    12. scrollbox

    Templates

    1. action
    2. assign
    3. binding
    4. bindings
    5. conditions
    6. content
    7. member
    8. param
    9. query
    10. queryset
    11. rule
    12. template
    13. textnode
    14. triple
    15. where

    Scripting

    1. script
    2. commandset
    3. command
    4. broadcaster
    5. broadcasterset
    6. observes
    7. key
    8. keyset
    9. stringbundle
    10. stringbundleset

    Hilfselemente

    1. arrowscrollbox
    2. dropmarker
    3. grippy
    4. scrollbar
    5. scrollcorner
    6. spinbuttons

    Andere XUL Listen

diff --git a/files/de/archive/mozilla/xul/xul_tutorial/die_chrome_url/index.html b/files/de/archive/mozilla/xul/xul_tutorial/die_chrome_url/index.html new file mode 100644 index 0000000000..e742e6f280 --- /dev/null +++ b/files/de/archive/mozilla/xul/xul_tutorial/die_chrome_url/index.html @@ -0,0 +1,39 @@ +--- +title: Die Chrome URL +slug: Archive/Mozilla/XUL/XUL_Tutorial/Die_Chrome_URL +tags: + - XUL + - XUL Tutorial +translation_of: Archive/Mozilla/XUL/Tutorial/The_Chrome_URL +--- +

{{ PreviousNext("XUL_Tutorial/XUL_Struktur", "XUL_Tutorial/Manifest_Dateien") }}

+

Der folgende Abschnitt beschreibt wie man Bezug zu weiteren XUL-Dokumenten und Chrome-Dateien herstellen kann.

+

Die Chrome-URL

+

XUL-Dateien können über eine reguläre HTTP-URL (oder jeder andere Typ einer URL) genau wie HTML-Dateien aufgerufen werden. Pakete, die jedoch in Mozillas chrome-System gespeichert sind, können mit speziellen chrome-URLs aufgerufen werden. Die Pakete, die in Mozilla vorhanden sind, sind bereits installiert und Sie können zudem Ihre eigenen registrieren.

+

Installierte Pakete haben den Vorteil, dass sie über keine Sicherheitsbeschränkungen verfügen, welche für viele Anwendungen von Bedeutung sind. Ein weitere Vorteil gegenüber anderen URL-Typen ist, dass sie automatisch mehrere Themes und Orte handhaben. Eine chrome-URL kann sich auf eine Theme-Datei beziehen, ohne zu wissen, welches Theme überhaupt installiert ist. Da die Dateinamen in allen Themes die gleichen sind, können Sie einfach eine Datei beziehen, die über die chrome-URL angegeben wird. Mozilla bestimmt dann wo die Datei zu finden ist und gibt dann die richtige Datei zurück. Das bedeutet auch, dass es egal ist wo das Paket installiert ist. Die chrome-URLs sind unabhängig davon wo die Dateien tatsächlich liegen. Das vereinfacht es ungemein Anwendungen zu schreiben, die eine Vielzahl von Dateien verwendet und Sie sich keine Gedanken machen brauchen, wo Sie die Dateien speichern.

+

Die grundlegende Schreibweise einer chrome-URL ist die folgende:

+
chrome://<package name>/<part>/<file.xul>
+
+

Der Platzhalter <package name> ist der Paketname, wie z.B. messenger oder editor. Alle Paketnamen sind case-insensitiv, aber Kleinbuchstaben werden bevorzugt. <part> ist entweder 'content', 'skin' oder 'locale', abhängig davon, welchen Teil sie möchten. <file.xul> ist einfach der Dateiname.

+

Beispiel: chrome://messenger/content/messenger.xul

+

Das Beispiel hier bezieht sich auf das Messenger-Fenster. Sie könnten sich auch auf eine Datei beziehen, die Teil eines Skins ist, indem Sie 'content' durch 'skin' ersetzen und den Dateinamen entsprechend ändern. Genauso könnten Sie 'locale' statt 'content' angeben.

+

Wenn Sie eine chrome-URL öffnen, schaut Mozilla durch die Liste der installierten Pakete und versucht eine JAR-Datei oder ein Verzeichnis zu finden, das auf den angeben Paketnamen und <part> zutrifft. Die Zuordnung von chrome-URLs und JAR-Dateien sind in den Manifest-Dateien festgelegt, welche sich im chrome-Verzeichnis befinden. Wenn Sie die messenger.jar-Datei verschieben und die Manifest-Datei entsprechend ändern wird Thunderbird weiterhin funktionieren, denn es ist nicht von einem bestimmten Installationsort abhängig. Indem wir chrome-URLs verwenden lassen wir solche Details Mozilla machen. Auch wenn der Benutzer das verwendete Theme ändert, wird der 'skin'-Teil der chrome-URL in ein anderes Verzeichnis übersetzt und XUL-Dateien und Skripte brauchen nicht geändert zu werden.

+

Hier sind noch ein paar Beispiele. Beachten Sie, dass keine URL ein Theme oder eine Lokalisierung festlegen.

+
chrome://messenger/content/messenger.xul
+chrome://messenger/content/attach.js
+chrome://messenger/skin/icons/folder-inbox.gif
+chrome://messenger/locale/messenger.dtd
+
+

Um auf Unterverzeichnisse zuzugreifen, können Sie diese einfach am Ende der chrome-URL hinzufügen. Die folgenden URLs beziehen sich auf das Lesezeichenfenster, für Mozilla-Suite und Firefox, da der Paketname unterschiedlich ist:

+
chrome://communicator/content/bookma...rksManager.xul (Mozilla)
+chrome://browser/content/bookmarks/b...rksManager.xul (Firefox)
+
+

Sie können chrome-URLs überall verwenden, wo auch normale URLs verwendet werden können. Sie können sie sogar in die Adresszeile des Mozilla Browsers eingeben. Wenn Sie eine der oben genannten URLs eingeben, sollten Sie sehen, dass ein Fenster wie eine Webseite geöffnet wird und so funktioniert wie ein separates Fenster. Einige Dialogboxen funktionieren vielleicht nicht richtig, weil sie eventuelle Argumente erwarten, die ihnen beim Aufrufen nicht übergeben worden sind.

+

Es kommen außerdem auch chrome-URLs ohne Dateinamen vor, zum Beispiel:

+
chrome://browser/content/
+
+

In diesem Fall wurde nur der Paketname und der Teilabschnitt angegeben. Dieser Referenztyp wird automatisch eine passende Datei aus diesem Verzeichnis auswählen. Für content wird eine Datei mit dem selben Namen des Pakets und XUL-Erweiterung ausgewählt. Im obigen Beispiel wird die Datei browser.xul ausgewählt. Für messenger würde messenger.xul ausgewählt werden. Wenn Sie Ihre eigene Anwendung erstellen, möchten Sie vielleicht eine Datei für Ihr Hauptfenster, mit dem selben Namen wie das Paket, erstellen. Dann kann ein Bezug in dieser verkürzten Form hergestellt werden.

+

Bei einem Skin wird die Datei <package name>.css ausgewählt; für eine Lokalisierung wird die Datei <package name>.dtd ausgewählt.

+

Denken Sie daran, dass die chrome-URL sich nicht auf den physikalischen Pfad auf der Festplatte bezieht. Die ersten beiden Stücke der chrome-URL sind der Paketname und der Teilabschnitt (entweder content, skin oder locale).

+

Im nächsten Abschnitt schauen wir uns an, wie wir .manifest-Dateien und Pakete erstellen können.

+

{{ PreviousNext("XUL_Tutorial/XUL_Struktur", "XUL_Tutorial/Manifest_Dateien") }}

diff --git a/files/de/archive/mozilla/xul/xul_tutorial/ein_fenster_erzeugen/index.html b/files/de/archive/mozilla/xul/xul_tutorial/ein_fenster_erzeugen/index.html new file mode 100644 index 0000000000..54c31683a0 --- /dev/null +++ b/files/de/archive/mozilla/xul/xul_tutorial/ein_fenster_erzeugen/index.html @@ -0,0 +1,111 @@ +--- +title: Ein Fenster erzeugen +slug: Archive/Mozilla/XUL/XUL_Tutorial/Ein_Fenster_erzeugen +tags: + - XUL + - XUL Tutorial +translation_of: Archive/Mozilla/XUL/Tutorial/Creating_a_Window +--- +

{{ PreviousNext("XUL_Tutorial/Manifest_Dateien", "XUL_Tutorial/Buttons_hinzufügen") }}

+ +

Zunächst wollen wir uns mit der Syntax einer XUL-Datei beschäftigen.

+ +

Eine XUL Datei erstellen

+ +

Der Name einer XUL Datei kann frei gewählt werden, es sollte jedoch darauf geachtet werden, dass die Endung .xul verwendet wird. Die einfachste XUL Datei hat folgende Struktur:

+ +
<?xml version="1.0"?>
+<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+
+<window
+    id="findfile-window"
+    title="Find Files"
+    orient="horizontal"
+    xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+<!-- Other elements go here -->
+</window>
+
+ +

Dieses Fenster wird keine Funktion haben, da es keine weitere UI-Elemete enthält. Diese werden im nächsten Abschnitt hinzugefügt. Der Code wird im folgenden Zeile für Zeile erklärt:

+ +
    +
  1. <?xml version="1.0"?>
    + Diese Zeile zeigt, dass dies eine XML Datei ist. Diese Zeile sollte in jeder XUL Datei als erstes stehen.
    2. +
  2. <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
    + Diese Zeile wird gebraucht um festzulegen, welches Style Sheet für diese Datei verwendet wird. Dies ist die Syntax wie XML Dateien Style Sheets importieren. In diesem Fall importieren wir ein Style Sheet welches sich im globalen Teil eines Skins befindet. Wir legen keine spezifische Datei fest, so dass Mozilla selbst entscheidet, welche Datei verwendet werden soll. In diesem Fall wird die Datei global.css verwendet. Diese Datei enthält alle Standard-Deklarationen für jedes XUL Element. Weil XML selbst nicht weiß wie die Elemente dargestellt werden sollten, brauch es diese Datei, welche dies festlegt. Normalerweise wird diese Zeile ebenfalls an den Anfang einer jeden XUL Datei geschrieben. Es können auch andere Style Sheets mit der selben Syntax importiert werden. Das globale Style Sheet wird normalerweise aus dem eigenen Style Sheet importiert.
    3. +
  3. <window
    + Diese Zeile gibt an, dass ein {{ XULElem("window") }} beschrieben wird. Jedes User Interface wird in einer eigenen Datei beschrieben. Dieser Tag ist wie ein HTML Tag welcher ein gesamtes HTML Dokument umfasst, mit dem Unterschied dass hier ein User Interface beschrieben wird. Einige Attribute können im {{ XULElem("window") }} Tag platziert werden, hier sind es vier. In diesem Beispiel wird jedes Attribut in einer eigenen Zeile beschrieben, dies ist jedoch nicht zwingend.
    4. +
  4. id="findfile-window"
    + Das {{ XULAttr("id") }} Attribut wird zur Identifizierung gebraucht, damit später auf das Fenster per Skript zugegriffen werden kann. Im Normalfall sollte ein id Attribut bei allen Elementen vorhanden sein. Der Name kann frei gewählt werden, er sollte jedoch sinnvoll sein.
    5. +
  5. title="Find Files"
    + Das {{ XULAttr("title") }} Attribut beschreibt den Text, welcher in der Titelzeile des Fensters erscheinen soll. In unserem Fall wird es 'Find Files' sein.
    6. +
  6. orient="horizontal"
    + Das {{ XULAttr("orient") }} Attribut beschreibt die Anordnung der Elemente in diesem Fenster. Der Wert horizontal zeigt, dass die Elemente horizontal über dem Fenster verteilt werden. Es kann auch der Wert vertical verwendet werden, welcher meint, dass die Elemente in einer Spalte verteilt werden. Dies ist der Standardwert, das heißt, dass man dieses Attribut weglassen kann, wenn man eine vertikale Ausrichtung möchte.
    7. +
  7. xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> Diese Zeile deklariert den Namensraum für XUL, welcher im Fenster deklariert sein sollte um festzulegen, dass alle Nachfolger XUL sind. Diese URL wird niemals heruntergeladen. Mozilla wird diese URL intern verarbeiten.
    8. +
  8. <!-- Other elements go here -->
    + Ersetze diesen Kommentar Block durch andere Elemente (Buttons, Menüs und andere User Interface Komponenten), welche im Fenster angezeigt werden sollten. Wir werden ein paar von ihnen zu einem späteren Zeitpunkt hinzufügen.
    9. +
  9. </window>
    + Zum Schluss brauchen wir das {{ XULElem("window") }} Tag, um das Ende der Datei anzuzeigen.
    10. +
+ +

Ein Fenster öffnen

+ +

Um ein XUL Fenster zu öffnen gibt es verschiedene Methoden. Wenn Sie sich nur in der Entwicklungsphase befinden, können Sie einfach die URL ("chrome:", "file:" oder weitere) in die Adresszeile des Browserfensters eingeben. Sie können auch einfach auf einen Doppelklick auf die Datei ausführen, wenn XUL Dateien mit Mozilla verknüpft sind. Das XUL Fenster erscheint im Browserfenster als neues Fenster, aber das ist meistens ungenügend während der Entwicklung.

+ +

Der korrekte Weg ist natürlich ein Fenster über JavaScript zu öffnen. Es ist kein neuer Syntax dazu notwendig, denn die window.open() Funktion kann genau wie für HTML Dokumente dazu verwendet werden. Es ist jedoch ein zusätzlicher Parameter "flag" nötig. In diesem Fall muss 'chrome' angeben werden, damit klar ist, dass ein chrome Dokument geöffnet werden soll. Dieses Stück Code wird dafür sorgen, dass ein Fenster ohne Toolbars und Menüs geöffnet wird:

+ +
window.open(url,windowname,flags);
+ +

wobei "flags" das Schlüsselwort "chrome" wie in diesem Beispiel enthält:

+ +
window.open("chrome://navigator/content/navigator.xul", "bmarks", "chrome,width=600,height=300");
+
+ +
+

Wenn Sie Firefox verwenden:

+ +
window.open("chrome://browser/content/places/places.xul", "bmarks", "chrome,width=600,height=300");
+
+ +

Diese Zeile kann auch in der Fehlerkonsole getestet werden. Wählen Sie Extras -> Fehlerkonsole, tippen Sie die Zeile JavaScript ein und drücken Sie auf Evaluieren oder benutzen Sie die Enter-Taste.

+ +
Das findfile.xul Beispiel
+ +

Fangen wir an die Basisdatei für den Dateisuche-Dialog zu schreiben. Erstellen Sie die Datei findfile.xul und packen Sie diese in das content Verzeichnis, welches von der finndfile.manifest Datei festgelegt wurde (haben wir im vorherigen Abschnitt festgelegt). Fügen Sie die XUL Vorlage von oben zu dieser Datei hinzu und speichern Sie diese ab.

+
+ +

Sie können den Kommandozeilenparameter '-chrome' verwenden, um die XUL Datei mit Mozilla zu starten. Wird dies nicht festgelegt, wird das Standardfenster geöffnet (normalerweise das Browserfenster). Wir können zum Beispiel den Dateisuche-Dialog mit einem der folgenden Zeilen öffnen:

+ +
mozilla -chrome chrome://findfile/content/findfile.xul
+
+mozilla -chrome resource:/chrome/findfile/content/findfile.xul
+
+ +

Wenn Sie einen dieser Kommandos in einer Eingabeaufforderung (angenommen Sie verfügen übere eine auf Ihrem System) eingeben, wird der Dateisuche-Dialog standardmäßig geöffnet, anstatt des normalen Mozilla Browserfensters. Da wir allerdings noch keine UI-Elemente in das Fenster gepackt haben, sehen Sie zunächst nichts. Im nächsten Abschnitt werden wir Elemente hinzufügen.

+ +

Um den Effekt dennoch zu beobachten, können Sie mit der folgenden Zeile das Lesezeichenfenster öffnen:

+ +
mozilla -chrome chrome://communicator/content/bookmarks/bookmarksManager.xul
+ +

Wenn Sie Firefox benutzen:

+ +
firefox -chrome chrome://browser/content/places/places.xul
+ +

Das '-chrome' Argument gibt der Datei keine gesonderten Rechte. Stattdessen kann es dadurch als Top-level Fenster in jedem Browser angezeigt werden, ohne Adressleiste oder Menüs. Nur chrome: URLs haben diese zusätzlichen Rechte.

+ +
Die Erweiterungsentwickler Erweiterung enthält einen XUL Editor, der den eingegebenen XUL-Code in Echtzeit wiedergibt!
+ +

Problemlösung

+ + + +
 <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+
+ +

Im nächsten Abschnitt werden wir ein paar Buttons zum Fenster hinzufügen.

+ +

{{ PreviousNext("XUL_Tutorial/Manifest_Dateien", "XUL_Tutorial/Buttons_hinzufügen") }}

+ +

{{ languages( { "en": "en/XUL_Tutorial/Creating_a_Window", "fr": "fr/Tutoriel_XUL/Cr\u00e9er_une_fen\u00eatre", "ja": "ja/XUL_Tutorial/Creating_a_Window", "pl": "pl/Kurs_XUL/Tworzenie_okna", "es": "es/Tutorial_de_XUL/Creando_una_ventana" } ) }}

diff --git a/files/de/archive/mozilla/xul/xul_tutorial/einfuehrung/index.html b/files/de/archive/mozilla/xul/xul_tutorial/einfuehrung/index.html new file mode 100644 index 0000000000..93aa98324a --- /dev/null +++ b/files/de/archive/mozilla/xul/xul_tutorial/einfuehrung/index.html @@ -0,0 +1,33 @@ +--- +title: Einführung +slug: Archive/Mozilla/XUL/XUL_Tutorial/Einfuehrung +tags: + - XUL + - XUL Tutorial +translation_of: Archive/Mozilla/XUL/Tutorial/Introduction +--- +

{{ Next("XUL_Tutorial/XUL_Struktur") }}

+

Dieses Tutorial ist eine Anleitung für das Erlernen von XUL (XML User Interface Language). XUL ist eine plattformübergreifende Sprache, um die Benutzer-Schnittstellen (z.B. GUI) einer Anwendung zu beschreiben.

+

Dieses Tutorial demonstriert die Erstellung eines einfachen "Datei suchen"-Dialogs, in der Art des "Sherlock" auf dem Macintosh oder des "Suchen"-Dialogs von Windows. Bitte beachten Sie, dass nur das Fenster (GUI) erstellt wird. Dieses beinhaltet sehr eingeschränkte Funktionalität. Das tatsächliche Auffinden von Dateien ist nicht implementiert. An den Stellen, wo der "Datei suchen"-Dialog bearbeitet wird, ist am linken Rand eine blaue Linie gemalt. Sie können der Entwicklung des Dialogs einfach folgen, indem Sie die so markierten Stellen lesen.

+

Was ist XUL und warum wurde es entwickelt?

+

XUL (ausgesprochen "zuul" und reimt sich auf "cool") wurde entwickelt, um die Entwicklung des Mozilla-Browsers zu vereinfachen und zu beschleunigen. Es ist eine XML-Sprache und somit gelten alle Eigenschaften von XML auch für XUL.

+

Die meisten Anwendungen benötigen bei ihrer Entwicklung plattform-spezifische Abhängigkeiten und Eigenschaften - die Entwicklung von plattform-unabhängiger Software ist zeitraubend und teuer. In den letzten Jahren wurde eine Vielzahl von plattform-übergreifenden Anwendungen entwickelt. Die Programmiersprache Java hat zum Beispiel die Plattformunabhängigkeit als herausragende Eigenschaft. XUL ist eine Sprache, die speziell für plattform-übergreifende Benutzerschnittstellen (GUIs) entwickelt wurde. Es dauert lange, um eine Anwendung zu entwickeln - selbst für eine Plattform. Die Zeit des Kompilierens und Debuggens kann sich sehr strecken. Mit XUL kann die Benutzerschnittstelle schnell und einfach implementiert und geändert werden.

+

XUL hat alle Vorteile von anderen XML-Sprachen. Es können zum Beispiel XHTML oder andere XML-Sprachen, wie MathML oder SVG eingebunden werden. Zudem ist angezeigter Text in XUL einfach an den Standort des Anwenders anzupassen. Das heißt er kann mit wenig Aufwand in andere Sprachen übersetzt werden.

+

Welche Art von Benutzerschnittstellen können mit XUL erstellt werden?

+

XUL bietet die Möglichkeit die meisten Elemente zu erstellen, die in modernen Benutzeroberflächen vorkommen. Einige dieser Elemente sind:

+ +

Der angezeigte Inhalt kann mit dem Inhalt aus XUL-Dateien oder aus Datenquellen erstellt werden. In Mozilla schließen solche Datenquellen die Mailbox eines Anwenders, seine Lesezeichen und Suchergebnisse ein. Die Inhalte von Menüs, Bäumen und anderen Elementen können mit diesen Daten befüllt werden oder mit Ihren eigenen Daten, die in RDF-Dateien bereitgestellt werden.

+

Es gibt verschieden Arten, um XUL zu nutzen:

+ +

Die ersten drei Arten benötigen alle die Ausführung einer Installation auf dem Computer des Anwenders. Diese Arten haben dadurch keine Sicherheitsbeschränkungen, sodass sie, zum Beispiel, das lokale Dateisystem lesen und schreiben können. Für eine Erweiterung werden die XUL-Dateien und zugehörige Skripte und Bilddateien der Anwendung in einer einzigen Datei zusammengepackt, die vom Anwender heruntergeladen und installiert wird. Mozilla-Anwendungen, wie der Firefox, bieten einen Erweiterungsmanager an, der es erlaubt, Installationen zusammenzustellen, ohne viel komplizierten Code schreiben zu müssen.

+

Es ist auch möglich XUL-Dateien direkt aus dem Dateisystem oder von einer Webseite zu starten. Diese sind aber in ihren Möglichkeiten eingeschränkt und einige Aspekte von XUL können nicht ausgeführt werden. Wenn Sie XUL-Inhalte von einer entfernten Webseite laden möchten, muss der Webserver so eingestellt sein, dass er XUL-Dateien mit dem Content-Type "application/vnd.mozilla.xul+xml" senden kann. XUL-Code wird normalerweise in Dateien mit der Endung ".xul" gespeichert. Sie können XUL-Dateien in Mozilla wie jede andere Datei (z.B. HTML) öffnen, indem Sie die "Öffnen mit..."-Option im Datei-Explorer für eine solche Datei auswählen oder den Ort der Datei direkt in die Adressleiste des Mozilla Browsers eingegeben.

+

Welches Vorwissen brauche ich für dieses Tutorial?

+

Sie sollten eine Vorstellung von HTML und zumindest grundsätzliches Verständnis von XML und CSS haben. Hier sind einige Richtlinien:

+ +

XUL wird in Mozilla-Browsern unterstützt, die auf der Gecko-Engine basieren, z.B. Netscape 6 oder höher und Mozilla Firefox. Trotz diverser Änderungen in der XUL-Syntax, sollten die aktuellen Versionen der Beispiele korrekt ablaufen. Die meisten Beispiele sollten unter Mozilla 1.0 oder höher laufen. XUL ist ziemlich ähnlich in Firefox und anderen Browsern, obwohl es kleine Unterschiede gibt, wie zum Beispiel die Unterstützung für anpassbare Werkzeugleisten.

+

Dieses Tutorial versucht viel von der XUL-Funktionalität abzudecken, aber es können nicht alle Themen behandelt werden. Wenn Sie einmal vertraut mit XUL sind, können Sie die XUL-Referenz benutzen, um mehr über Eigenschaften von bestimmten Elementen herauszufinden.

+

{{ Next("XUL_Tutorial/XUL_Struktur") }}

+

{{ languages( { "en": "en/XUL_Tutorial/Introduction", "es": "es/Tutorial_de_XUL/Introducci\u00f3n", "fr": "fr/Tutoriel_XUL/Introduction", "ja": "ja/XUL_Tutorial/Introduction", "ko": "ko/XUL_Tutorial/Introduction", "pl": "pl/Kurs_XUL/Wprowadzenie", "zh-cn": "cn/XUL_\u6559\u7a0b/\u5f15\u8a00", "ru": "ru/\u0420\u0443\u043a\u043e\u0432\u043e\u0434\u0441\u0442\u0432\u043e_\u043f\u043e_XUL/\u0412\u0432\u0435\u0434\u0435\u043d\u0438\u0435" } ) }}

diff --git a/files/de/archive/mozilla/xul/xul_tutorial/index.html b/files/de/archive/mozilla/xul/xul_tutorial/index.html new file mode 100644 index 0000000000..5cf8ecb42d --- /dev/null +++ b/files/de/archive/mozilla/xul/xul_tutorial/index.html @@ -0,0 +1,57 @@ +--- +title: XUL Tutorial +slug: Archive/Mozilla/XUL/XUL_Tutorial +tags: + - XUL + - XUL Tutorial +translation_of: Archive/Mozilla/XUL/Tutorial +--- +

Dieses Tutorial beschreibt XUL, die »XML User-Interface Language«. Diese Sprache wurde für die Anwendung Mozilla entwickelt und wird verwendet, um die Nutzerschnittstelle (GUI) für die Anwendung zu beschreiben.

+
Einführung
+ +
Einfache Elemente
+ +
Das Box-Modell
+ +
Weitere Layout-Elemente
+ +
Toolbars und Menüs
+ +
Ereignisse und Scripte
+ +
Das DOM (Document Object Model)
+ +
Bäume
+ +
RDF und Vorlagen
+ +
Skins und Locales
+ +
Bindings
+ +
Spezielle Fenster-Typen
+ +
Installation
+ +
+

Dieses XUL-Tutorial wurde ursprünglich von Neil Deakin geschrieben. Er hat die Erlaubnis gegeben, es als Teil des MDC zu nutzen.

+
+
+
Informationen zum Originaldokument
+ +
+

{{ languages( { "zh-cn": "cn/XUL_\u6559\u7a0b", "en": "en/XUL_Tutorial", "es": "es/Tutorial_de_XUL", "fr": "fr/Tutoriel_XUL", "ja": "ja/XUL_Tutorial", "ko": "ko/XUL_Tutorial", "pl": "pl/Kurs_XUL", "ru": "ru/\u0420\u0443\u043a\u043e\u0432\u043e\u0434\u0441\u0442\u0432\u043e_\u043f\u043e_XUL" } ) }}

diff --git a/files/de/archive/mozilla/xul/xul_tutorial/installations-skripte/index.html b/files/de/archive/mozilla/xul/xul_tutorial/installations-skripte/index.html new file mode 100644 index 0000000000..cf11ed3b11 --- /dev/null +++ b/files/de/archive/mozilla/xul/xul_tutorial/installations-skripte/index.html @@ -0,0 +1,96 @@ +--- +title: Installations-Skripte +slug: Archive/Mozilla/XUL/XUL_Tutorial/Installations-Skripte +translation_of: Archive/Mozilla/XUL/Tutorial/Install_Scripts +--- +
+

« zurückweiter »

+
+

Dieser Abschnitt beschreibt das Installationsskript.

+

Erstellen eines Installationsskripts

+
+ Hinweis: Für Firefox Erweiterungen, werden install.js Dateien nicht weiter verwendet. Es sollte ein install.rdf stattdessen erstellt werden.
+

In der Regel möchten Sie den Installationsprozess steuern können. Zum Beispiel möchten Sie vielleicht Datei-Versionen überprüfen und nur aktualisierte Dateien installieren oder Sie möchten Fehler in existierenden Dateien beheben. Das Installationsskript ist flexibel genug, um sogar Dateien zu deinstallieren. Aus diesen Gründen sollten Installationen ein Installationsskript an Board haben, um den Installationsprozess zu regeln.

+

Das Installationsskript muss "install.js" genannt werden und muss im Wurzelverzeichnis des Installationsverzeichnisses platziert werden. Das Skript wird JavaScript Code enthalten, welcher eine Reihe von Installationsfunktionen aufruft.

+

In einem HTML Dokument oder einem XUL Dokument ist das "window" Objekt das Wurzelobjekt. Das bedeutet, dass Sie die Methoden des window-Objekts ohne einem Qualifier davor aufrufen können, zum Beipiel kann statt window.open() einfach open() geschrieben werden. In einem Installationsskript gibt es kein Fenster, jedoch ist das globale Objekt das Install Objekt, welches eine Reihe von Funktionen zur Anpassung des Installationsprozess mit sich bringt. Einige der Install-Ojekt Funktionen werden weiter unter beschrieben.

+

Das Installationsskript sollte die folgenden Schritte ausführen:

+
    +
  1. Initialisiere die Installation in dem festgelegt wird, welche Version und Paket installiert werden soll.
    2. +
  2. Benutze die Installationsfunktionen, um zu bestimmen, welche Dateien und Verzeichnisse installiert werden müssen. Sie können außerdem Dateien festlegen, die gelöscht oder verschoben werden sollen.
    3. +
  3. Starte den Installationsprozess der nötigen Dateien.
    4. +
+

Es ist wichtig zu beachten, dass während Schritt zwei, nur angegeben wird, welche Dateien installiert werden sollen und welche weiteren Operationen ausgeführt werden sollen. Es werden keine Dateien bis zum dritten Schritt kopiert. Sie können daher sehr einfach eine Reihe von Dateien festlegen, die installiert werden sollen, stolpern eventuell über einen Fehler und können den Prozess abbrechen, ohne dass das System des Benutzers verändert wird.

+

Die Komponentenregistrierung

+

Mozilla verfügt über eine Registrierungsdatei, welche alle Komponenten enthält, die momentan installiert sind. Komponenten sind Chrome Pakete, Skins und Plugins. Wird eine neue Komponente installiert, wird die Registrierungsdatei aktualisiert. Die Registrierung speichert auch Dateisets und Versionsinformationen über die installierten Komponenten. Daher ist es sehr einfach die Versionen Ihrer Komponente zu prüfen und zu ermitteln, ob die Komponente bereits verfügbar ist und eventuell aktualisiert werden muss.

+

Die Komponentenregistrierung arbeit ähnlich wie die Windows Registrierung. Sie besteht aus der hierarchischen Anordnung von Schlüsseln und Werten. Dabei müssen Sie nicht viel darüber wissen, um XUL Anwendungen zu erstellen, es sei denn Sie wollen eigene XPCOM Komponenten erstellen.

+

Was Sie für eine Installation wissen müssen, ist, dass die Registrierung eine Reihe von Informationen über Ihre Anwendung speichert, zum Beispiel eine Liste der Dateien und Versionen. Die gesamten Informationen werden in einem Schlüssel gespeichert (und in Unter-Schlüsseln), welche Sie im Installationsskript angeben (in Schritt eins oben genannt).

+

Dieser Schlüssel ist wie in Verzeichnissen in der folgenden Form strukturiert:

+
/Autor/Paketname
+
+

Ersetzen Sie das Wort "Author" mit Ihrem Name und "Paketname" mit dem Namen Ihres Pakets, welches Sie installieren möchten. Zum Beispiel:

+
/Xulplanet/Find Files
+
+/Netscape/Personal Security Manager
+
+

Das erste Beispiel werden wir für den Dateisuche-Dialog verwenden. Das zweite Beispiel wird vom Personal Security Manager benutzt.

+

Initialisierung der Installation

+

Das Install Objekt hat eine Funktion, initInstall(), welche zur Initialisierung der Installation gebraucht wird. Es sollte am Anfang des Installationsskript aufgerufen werden. Die Syntax dieser Funktion ist die folgende:

+
initInstall( ''packageName'' , ''regPackage'' , ''version'' );
+

Ein Beispiel

+
initInstall("Find Files","/Xulplanet/Find Files","0.5.0.0");
+ +

Als nächstes müssen wir das Verzeichnis festlegen, wo die Dateien installiert werden sollen. Es gibt zwei Möglichkeiten.

+ +

Die Funktion setPackageFolder() legt ein Installationsverzeichnis fest. Für den Dateisuche-Dialog werden wir die Dateien in das Chrome-Verzeichnis installieren. (Wir könnten sie überall speichern). Die Funktion setPackageFolder() nimmt ein Argument an, das Installationsverzeichnis. Für maximale Portabilität kann kein String-Name für das Verzeichnis festgelegt werden. Stattdessen wird ein Identifier eines bekannten Verzeichnis verwendet und dann werden dort Unterverzeichnisse erstellt. Falls Ihre Anwendung Systembibliotheken installieren muss, brauchen Sie den Pfad dieser Verzeichnisse nicht zu wissen.

+

Die Verzeichnis-Identifiers sind in der XULPlanet Referenz aufgelistet. Für das Chrome-Verzeichnis ist der Identifier 'Chrome'. Die getFolder() Funktion kann verwendet werden, um eine der speziellen Verzeichnisse zu bekommen. Diese Funktion nimmt zwei Argumente, das erste ist der Identifier und das zweite ist ein Unterverzeichnis. Zum Beispiel:

+
findDir = getFolder("Chrome","findfile");
+setPackageFolder(findDir);
+
+

Hier bekommen wir das "findfile" Verzeichnis im Chrome-Ordner und reichen dies an die setPackageFolder() Funktion weiter. Das zweite Argument für getFolder() ist das Unterverzeichnis in dem wir installieren werden, was nicht bedeutet, dass es existieren muss. Dieses Argument kann weggelassen werden, wenn Sie kein Unterverzeichnis benötigen.

+

Installationsdateien festlegen

+

Als nächstes müssen die Dateien festgelegt werden, die installiert werden sollen. Das erfordert die Verwendung der Funktionen addDirectory() und addFile(). Die addDirectory() Funktion teilt dem Instller mit, dass ein Verzeichnis aus dem XPI Archiv (und alle Inhalte darin) in ein bestimmtes Verzeichnis installiert werden soll. Die Funktion addFile() ist ähnlich, aber für eine einzelne Datei.

+

Beide Funktionen addDirectory() und addFile() haben unterschiedliche Formen. Die einfachste Form nimmt nur ein Argument: Das Verzeichnis, welches von der Installation erstellt werden soll.

+
addDirectory ( dir );
+addFile ( dir );
+
+Beispiel:
+
+addDirectory("findfile");
+
+

Das obige Beispiel legt ein Verzeichnis "findfile" für die Installation fest. Diese Funktionen können mehrmals aufgerufen werden, um mehrere Verzeichnisse und Dateien zu installieren.

+

Als nächstes wollen wir die Dateien im Chrome System registrieren, sodass diese mit einer Chrome-URL verwendet werden können. Das kann mit der registerChrome() Funktion erledigt werden. Die Funktion nimmt zwei Argumente an, als erstes den Chrome-Typ, der registriert werden soll (content, skin oder locale). Ein zweites Argument ist das Verzeichnis, welches die contents.rdf Datei enthält. Weil der Dateisuche-Dialog content, eine Skin-Datei und eine locale-Datei enthält, muss registerChrome() dreimal aufgerufen werden.

+
registerChrome(Install.CONTENT | Install.DELAYED_CHROME, getFolder(findDir, "content"));
+registerChrome(Install.SKIN | Install.DELAYED_CHROME, getFolder(findDir, "skin"));
+registerChrome(Install.LOCALE | Install.DELAYED_CHROME, getFolder(findDir, "locale"));
+
+

 DELAYED_CHROME wird verwendet, um anzuzeigen, dass es beim nächsten Mozilla-Start installiert werden soll.

+

Abschluss der Installation

+

Die addDirectory() und addFile() Funktions kopieren keine Dateien. Sie geben nur an, welche Dateien installiert werden sollen. Ebenfalls gibt registerChrome() nur an, dass diese im chrome-System registriert werden sollen. Um den Prozess zu vervollständigen und Dateien zu kopieren, muss die performInstall() Funktion aufgerufen werden. Diese Funktionen erwartet keine Argumente.

+

Das finale Skript zur Installation der "Dateisuche"-Komponente ist unten aufgeführt:

+
+

Datei

+ 
initInstall("Find Files","/Xulplanet/Find Files","0.5.0.0");
+
+findDir = getFolder("Chrome","findfile");
+setPackageFolder(findDir);
+
+addDirectory("findfile");
+
+registerChrome(Install.CONTENT | Install.DELAYED_CHROME, getFolder(findDir, "content"));
+registerChrome(Install.SKIN | Install.DELAYED_CHROME, getFolder(findDir, "skin"));
+registerChrome(Install.LOCALE | Install.DELAYED_CHROME, getFolder(findDir, "locale"));
+
+performInstall();
+
+
+

Als nächstes schauen wir uns zusätzliche Installationsfunktionen an.

+
+

« zurückweiter »

+
diff --git a/files/de/archive/mozilla/xul/xul_tutorial/lokalisierung/index.html b/files/de/archive/mozilla/xul/xul_tutorial/lokalisierung/index.html new file mode 100644 index 0000000000..7f6f44a00e --- /dev/null +++ b/files/de/archive/mozilla/xul/xul_tutorial/lokalisierung/index.html @@ -0,0 +1,270 @@ +--- +title: Lokalisierung +slug: Archive/Mozilla/XUL/XUL_Tutorial/Lokalisierung +tags: + - Lokalisierung + - XUL + - XUL_Tutorial +translation_of: Archive/Mozilla/XUL/Tutorial/Localization +--- +

{{ PreviousNext("XUL_Tutorial/Eine_eigene_Skin_erstellen", "XUL_Tutorial/Property-Dateien") }}

+

XUL und XML stellen Entities als komfortablen Weg bereit, um Lokalisierungen zu ermöglichen.

+

Entities

+

Viele Anwendungen sind so gebaut, dass das Interface so einfach wie möglich in verschiedene Sprachen zu übersetzten ist. Üblicherweise wird eine Tabelle aus Strings für jede Sprache erstellt. Anstelle von den Text direkt in die Applikation zu programmieren, stellt jede Textstelle nur eine Referenz zur Stringtabelle dar. XML stellt Entities zur Verfügung, welche für den gleichen Zweck verwendet werden können.

+

Man sollte mit Entities bereits vertraut sein, wenn man schon Erfahrungen mit HTML sammeln konnte. Der Code &lt; und &gt; sind Beispiele von Entities, welche anstelle von „Größer-als-“ und „Kleiner-als-Zeichen“ im Text verwendet werden können. XML besitzt einen Syntax, welcher dir das deklarieren eigener Entities erlaubt. Du kannst diese so verwenden, dass das Entity durch seinen Wert ersetzt wird, welcher ein Textstring ist. Entities können immer wenn Text auftritt verwendet werden, inklusive den Attributwerten. Das Beispiel unten demonstriert die Verwendung eines Entity in einem Button.

+
<button label="&findLabel;"/>
+
+

Der Text der als Label erscheinen wird, wird den Wert des Entity &findLabel; sein. Eine Datei welche die Entity-Deklaration enthält wird für jede unterstützte Sprache erstellt. Für Englisch wird das &findLabel; Entity wahrscheinlich mit dem Text »Find« deklariert sein.

+

DTD-Dateien

+

Entities sind in Document Type Declaration (DTD) Dateien deklariert. Dateien dieses Typs werden normalerweise verwendet um den Syntax und die Semantik einer bestimmten XML-Datei zu deklarieren, aber es können auch Entities deklariert werden. Im Mozilla Chrome-System sind die DTD Dateien im locales Unterordner zu finden. Normalerweise existiert eine DTD Datei (mit der Endung .dtd) pro XUL-Datei.

+

Wenn man im Chrome-Ordner nachschaut, sollte man ein Archiv für die jeweilige Sprache (de-De.jar ist normalerweise Deutsch) finden. Es ist möglich lokale Dateien in verschiedenen Sprachen, z.B. Deutsch (de-DE) und Englisch (en-US) zu haben. Innerhalb dieser Archive sind die Dateien zu finden, welche den lokalisierten Text für jedes Fenster enthalten. Die Struktur der Archive ist sehr ähnlich derjenigen, die für Skins verwendet wird.

+

Im Innern der Archive würde man die DTD-Dateien platzieren in welchen die Entities deklariert werden sollen. Normalerweise wird für jede XUL-Datei eine DTD-Datei mit dem gleichen Namen erstellt mit allerdings einer .dtd Endung. Daher werden wir für den Dateisuchdialog eine Datei namens findfile.dtd benötigen.

+

Für nicht installierte chrome Dateien kann einfach die DTD-Datei ins selbe Verzeichnis wie die XUL-Datei ablegt werden.

+
Anmerkung: Die DTD-Dateien sollten für nicht ASCII Zeichen als UTF-8 kodiert werden. Deswegen sollten die Dateien im UTF-8 Format gespeichert werden. (ohne BOM). Für mehr Informationen, siehe Mozilla Sprachpakete.
+

Sobald eine DTD-Datei für das XUL erstellt worden ist, muss eine Zeile in die XUL-Datei einfügt werden, welche angibt, dass die DTD-Datei verwendet werden soll. Andernfalls werden Fehler auftreten, weil die Entities nicht gefunden werden. Um dies zu tun, muss die folgende Zeile irgendwo im oberen Bereich der XUL-Datei eingefügt werden:

+
<!DOCTYPE window SYSTEM "chrome://findfile/locale/findfile.dtd">
+
+

Diese Zeile legt fest, dass die URL auf eine DTD-Datei verweist. In diesem Fall wurde deklariert, dass die findfile.dtd DTD-Datei verwendet werden soll. Diese Zeile ist typischerweise gerade vor dem window Element platziert.

+

Entities deklarieren

+

Die Entities werden mit einem einfachen Syntax deklariert:

+
<!ENTITY findLabel "Find">
+
+

Dieses Beispiel erstellt ein Entity mit dem Namen findLabel und dem Wert »Find«. Dies bedeutet, dass überall wo der Text „&findLabel;“ in der XUL-Datei auftritt es durch den Text »Find« ersetzt wird. Es sollte beachtet werden, dass die Deklaration kein Slash am Ende besitzt. In der DTD-Datei einer anderen Sprache wird der Text stattdessen in dieser Sprache geschrieben.

+
für Japanisch:
+<!ENTITY findLabel "検索">
+
+

Zum Beispiel der folgende Text:

+
<description value="&findLabel;"/>
+
+

wird übersetzt als:

+
Englische Version:
+<description value="Find"/>
+
+Japanische Version:
+<description value="検索"/>
+
+

Es wird ein Entity für jede Beschriftung und Textstelle vorhanden sein, die dem Interface verwendet wird. Es sollte kein direkt angezeigter Text in den XUL-Dateien existieren.

+

Zusätzlich zu der Verwendung in Beschriftungen, sollten Entities für jeden Wert verwendet werden, welcher in einer anderen Sprache abweichen könnte. Access-Keys und Tastatur-Shortcuts zum Beispiel.

+
 XUL
+ <menuitem label="&undo.label;" accesskey="&undo.key;"/>
+ DTD
+ <!ENTITY undo.label "Undo">
+ <!ENTITY undo.key "u">
+
+

Das Beispiel oben verwendet zwei Entities, eines für die Beschriftung des Menüpunktes und ein zweiter für den Access-Key.

+

 

+
+

Änderung des Dateisuche Beispiels

+

Werfen wir jetzt einen Blick darauf, wie wir das alles zusammenfügen können, indem wir den Dateisuche-Dialog so modifizieren, so dass eine DTD-Datei für alle seine Textstellen verwendet wird. Die gesamte XUL-Datei mit allen Änderungen in Rot ist unterhalb gezeigt.

+
<?xml version="1.0"?>
+
+<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+<?xml-stylesheet href="findfile.css" type="text/css"?>
+
+<!DOCTYPE window SYSTEM "chrome://findfile/locale/findfile.dtd">
+
+<window
+  id="findfile-window"
+  title="&findWindow.title;"
+  persist="screenX screenY width height"
+  orient="horizontal"
+  onload="initSearchList()"
+  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+<script src="findfile.js"/>
+
+<popupset>
+   <popup id="editpopup">
+     <menuitem label="Cut" accesskey="&cutCmd.accesskey;"/>
+     <menuitem label="Copy" accesskey="&copyCmd.accesskey;"/>
+     <menuitem label="Paste" accesskey="&pasteCmd.accesskey;" disabled="true"/>
+   </popup>
+</popupset>
+
+<keyset>
+   <key id="cut_cmd" modifiers="accel" key="&cutCmd.commandkey;"/>
+   <key id="copy_cmd" modifiers="accel" key="&copyCmd.commandkey;"/>
+   <key id="paste_cmd" modifiers="accel" key="&pasteCmd.commandkey;"/>
+   <key id="close_cmd" keycode="VK_ESCAPE" oncommand="window.close();"/>
+</keyset>
+
+<vbox flex="1">
+
+ <toolbox>
+
+  <menubar id="findfiles-menubar">
+    <menu id="file-menu" label="&fileMenu.label;"
+        accesskey="&fileMenu.accesskey;">
+      <menupopup id="file-popup">
+        <menuitem label="&openCmd.label;"
+                  accesskey="&openCmd.accesskey;"/>
+        <menuitem label="&saveCmd.label;"
+                  accesskey="&saveCmd.accesskey;"/>
+        <menuseparator/>
+        <menuitem label="&closeCmd.label;"
+                  accesskey="&closeCmd.accesskey;" key="close_cmd" oncommand="window.close();"/>
+      </menupopup>
+    </menu>
+    <menu id="edit-menu" label="&editMenu.label;"
+          accesskey="&editMenu.accesskey;">
+      <menupopup id="edit-popup">
+        <menuitem label="&cutCmd.label;"
+                  accesskey="&cutCmd.accesskey;" key="cut_cmd"/>
+        <menuitem label="&copyCmd.label;"
+                  accesskey="&copyCmd.accesskey;" key="copy_cmd"/>
+        <menuitem label="&pasteCmd.label;"
+                  accesskey="&pasteCmd.accesskey;" key="paste_cmd" disabled="true"/>
+      </menupopup>
+    </menu>
+  </menubar>
+
+  <toolbar id="findfiles-toolbar">
+    <toolbarbutton id="opensearch" label="&openCmdToolbar.label;"/>
+    <toolbarbutton id="savesearch" label="&saveCmdToolbar.label;"/>
+  </toolbar>
+ </toolbox>
+
+ <tabbox>
+  <tabs>
+    <tab label="&searchTab;" selected="true"/>
+    <tab label="&optionsTab;"/>
+  </tabs>
+
+  <tabpanels>
+
+   <tabpanel id="searchpanel" orient="vertical" context="editpopup">
+
+   <description>
+     &findDescription;
+   </description>
+
+   <spacer class="titlespace"/>
+
+   <groupbox orient="horizontal">
+     <caption label="&findCriteria;"/>
+
+     <menulist id="searchtype">
+       <menupopup>
+         <menuitem label="&type.name;"/>
+         <menuitem label="&type.size;"/>
+         <menuitem label="&type.date;"/>
+       </menupopup>
+     </menulist>
+   <spacer class="springspace"/>
+     <menulist id="searchmode">
+       <menupopup>
+         <menuitem label="&mode.is;"/>
+         <menuitem label="&mode.isnot;"/>
+       </menupopup>
+     </menulist>
+   <spacer class="springspace"/>
+
+   <menulist id="find-text" flex="1"
+             editable="true"
+             datasources="file:///mozilla/recents.rdf"
+             ref="http://www.xulplanet.com/rdf/recent/all">
+     <template>
+       <menupopup>
+         <menuitem label="rdf:http://www.xulplanet.com/rdf/recent#Label" uri="rdf:*"/>
+       </menupopup>
+     </template>
+   </menulist>
+
+   </groupbox>
+
+  </tabpanel>
+
+  <tabpanel id="optionspanel" orient="vertical">
+     <checkbox id="casecheck" label="&casesensitive;"/>
+     <checkbox id="wordscheck" label="&matchfilename;"/>
+    </tabpanel>
+
+  </tabpanels>
+ </tabbox>
+
+ <tree id="results" style="display: none;" flex="1">
+   <treecols>
+     <treecol id="name" label="&results.filename;" flex="1"/>
+     <treecol id="location" label="&results.location;" flex="2"/>
+     <treecol id="size" label="&results.size;" flex="1"/>
+   </treecols>
+
+   <treechildren>
+     <treeitem>
+       <treerow>
+         <treecell label="mozilla"/>
+         <treecell label="/usr/local"/>
+         <treecell label="&bytes.before;2520&bytes.after;"/>
+       </treerow>
+     </treeitem>
+   </treechildren>
+ </tree>
+
+ <splitter id="splitbar" resizeafter="grow" style="display: none;"/>
+
+ <spacer class="titlespace"/>
+
+ <hbox>
+   <progressmeter id="progmeter" value="50%" style="display: none;"/>
+   <spacer flex="1"/>
+   <button id="find-button" label="&button.find;"
+           oncommand="doFind()"/>
+   <button id="cancel-button" label="&button.cancel;"
+           oncommand="window.close();"/>
+ </hbox>
+</vbox>
+
+</window>
+
+

Jede Textstelle wurde durch eine Entity ersetzt. Eine DTD-Datei wurde nahe am Anfang eingefügt. Jede Entity welche eingefügt wurde, sollte in der DTD-Datei deklariert sein. Das Fenster wird nicht angezeigt, wenn eine Entity in der XUL-Datei gefunden wird, welche nicht deklariert wurde.

+

Es sollte beachtet werden, dass der Name der Entity nicht wichtig ist. Im Beispiel oben wurden die Wörter der Entities mit Bindestrichen getrennt. Dies ist keine Vorgabe. Die Entity-Namen folgen den selben Konventionen wie der Rest des Mozilla Codes.

+

Es ist vielleicht aufgefallen, dass der Text '2520 bytes' durch zwei Entities ersetzt wurde. Das kommt daher, weil die Struktur in anderen Sprachen variieren kann. Es könnte z.B. nötig sein, dass die Einheit vor der Zahl steht.

+

Die Access-Keys und Tastatur-Shortcuts wurden auch in Entities übersetzt, weil sie in anderen Sprachen abweichen können.

+

Nun die DTD-Datei - findfile.dtd:

+
<!ENTITY findWindow.title "Find Files">
+<!ENTITY fileMenu.label "File">
+<!ENTITY editMenu.label "Edit">
+<!ENTITY fileMenu.accesskey "f">
+<!ENTITY editMenu.accesskey "e">
+<!ENTITY openCmd.label "Open Search...">
+<!ENTITY saveCmd.label "Save Search...">
+<!ENTITY closeCmd.label "Close">
+<!ENTITY openCmd.accesskey "o">
+<!ENTITY saveCmd.accesskey "s">
+<!ENTITY closeCmd.accesskey "c">
+<!ENTITY cutCmd.label "Cut">
+<!ENTITY copyCmd.label "Copy">
+<!ENTITY pasteCmd.label "Paste">
+<!ENTITY cutCmd.accesskey "t">
+<!ENTITY copyCmd.accesskey "c">
+<!ENTITY pasteCmd.accesskey "p">
+<!ENTITY cutCmd.commandkey "X">
+<!ENTITY copyCmd.commandkey "C">
+<!ENTITY pasteCmd.commandkey "V">
+<!ENTITY openCmdToolbar.label "Open">
+<!ENTITY saveCmdToolbar.label "Save">
+<!ENTITY searchTab "Search">
+<!ENTITY optionsTab "Options">
+<!ENTITY findDescription "Enter your search criteria below and select the Find button to begin the search.">
+<!ENTITY findCriteria "Search Criteria">
+<!ENTITY type.name "Name">
+<!ENTITY type.size "Size">
+<!ENTITY type.date "Date Modified">
+<!ENTITY mode.is "Is">
+<!ENTITY mode.isnot "Is Not">
+<!ENTITY casesensitive "Case Sensitive Search">
+<!ENTITY matchfilename "Match Entire Filename">
+<!ENTITY results.filename "Filename">
+<!ENTITY results.location "Location">
+<!ENTITY results.size "Size">
+<!ENTITY bytes.before "">
+<!ENTITY bytes.after "bytes">
+<!ENTITY button.find "Find">
+<!ENTITY button.cancel "Cancel">
+
+

Um den Text in einer neuen Sprache hinzuzufügen, genügt es eine weitere DTD-Datei zu erstellen. Durch die Verwendung des Chrome Systems, um die DTD-Datei einer anderen Sprache hinzuzufügen, kann die selbe XUL-Datei für jede Sprache verwendet werden.

+

Das Dateisuche Beispiel so weit: Quellcode

+
+

Als nächstes werden wir einen Blick auf Property Dateien werfen.

+

{{ PreviousNext("XUL_Tutorial/Eine_eigene_Skin_erstellen", "XUL_Tutorial/Property-Dateien") }}

+

{{ languages( { "en": "en/XUL_Tutorial/Localization", "fr": "fr/Tutoriel_XUL/Localisation", "ja": "ja/XUL_Tutorial/Localization", "pl": "pl/Kurs_XUL/Lokalizacja" } ) }}

diff --git a/files/de/archive/mozilla/xul/xul_tutorial/positionierung_von_elementen/index.html b/files/de/archive/mozilla/xul/xul_tutorial/positionierung_von_elementen/index.html new file mode 100644 index 0000000000..756e025aaa --- /dev/null +++ b/files/de/archive/mozilla/xul/xul_tutorial/positionierung_von_elementen/index.html @@ -0,0 +1,259 @@ +--- +title: Positionierung von Elementen +slug: Archive/Mozilla/XUL/XUL_Tutorial/Positionierung_von_Elementen +tags: + - XUL + - XUL Tutorial +translation_of: Archive/Mozilla/XUL/Tutorial/Element_Positioning +--- +
+

« zurückweiter »

+
+ +

Schauen wir uns die Steuerung von Positionen und Größen von XUL Elementen an.

+ +

Positionierung in Boxen

+ +

Bis jetzt wissen wir, dass Elemente entweder horizontal oder vertikal innerhalb einer Box positioniert werden können. Meistens brauchen wir aber weitere Steuerungsmöglichkeiten zur Position und Größe von Elementen in der Box. Dazu müssen wir uns zunächst anschauen wie eine Box arbeitet.

+ +

Die Position eines Elementes wird vom Layout des Containers bestimmt. Zum Beispiel ist die Position einer Schaltfläche in einer horizontalen Box rechts von der vorherigen Schaltfläche, sofern diese existiert. Die Größe eines Elements wird von zwei Faktoren beeinflusst: Die Größe, die das Element an Größe braucht und die Größe, die Sie festlegen. Die Größe, die das Element braucht, hängt vom dem ab, was sich innerhalb des Elements befindet. Zum Beispiel wird die Breite einer Schaltfläche anhand des Textes, welcher sich darauf befindet, berechnet.

+ +

Ein Element wird generell so groß wie es Inhalt vorschreibt und nicht größer. Einige Elemente verfügen über eine Standardgröße (z.B. Textboxen), welche verwendet wird. Eine horizontale Box mit drei Schaltflächen darin, wird so groß wie die drei Schaltflächen plus einem kleinen zusätzlichen Abstand.

+ +
Image:boxstyle1n.png
+ +

Im Bild wurde den ersten beiden Schaltflächen eine passende Größe vorgeschrieben, um den Text anzuzeigen. Die dritte Schaltfläche ist größer, weil sie mehr Inhalt enthält. Die Breite der umschließenden Box ist die Summe der Breite der drei Schaltflächen plus einem zusätzlichen Abstand zwischen ihnen. Die Höhe der Schaltflächen ist passend zur Textgröße berechnet worden.

+ +

Width und height Attribute

+ +

Sie möchten sicher mehr Einfluss auf die Größe eines Elements in einem Fenster nehmen können. Es gibt eine Reihe von Features, die Ihnen erlauben die Größe eines Elementes festzulegen. Der schnellste Weg ist, einfach die width und height Attribute festzulegen, genauso wie Sie es vielleicht von HTML kennen. Ein Beispiel dazu:

+ +

Beispiel 1: Datei Ansehen

+ +
<button label="OK" width="100" height="40"/>
+
+ +

Es ist jedoch nicht empfohlen, das so zu machen. Es ist passt nicht in einige Themes und ist umständlicher anpassbar. Ein besserer Weg ist, CSS Eigenschaften zu verwenden, welche wie in HTML arbeiten. Die folgenden CSS Eigenschaften können dazu verwendet werden:

+ +
+
width
+
Legt die Breite eines Elementes fest.
+
height
+
Legt die Höhe eines Elementes fest.
+
+ +

Werden beide Eigenschaften festgelegt, wird das Element mit dieser Breite und Höhe erstellt. Wird nur eines der beiden angegeben, wird die andere Eigenschaft nach dem benötigten Platz berechnet. Die Größe sollte als Zahl gefolgt von einer Einheit angegeben werden.

+ +

Flexible Elemente

+ +

Die Größen der Elemente sind ziemlich einfach zu berechnen für nicht-flexible Elemente. Sie folgen einfach der festgelegten Breiten und Höhen und sobald eine Größe nicht festgelegt wurde, wird das Element so groß wie es für den Inhalt erforderlich ist. Für flexible Elemente ist die Berechnung allerdings nicht ganz so einfach.

+ +

Flexible Elemente sind solche, die über ein flex Attribut verfügen und einen Wert größer als 0 haben. Flexible Elemente passen sich an den verfügbaren Freiraum an. Die Standardgröße wird trotzdem genauso berechnet wie für nicht-flexible Elemente. Das folgende Beispiel soll dies verdeutlichen:

+ +

Beispiel 2 : Datei Ansehen

+ +
<window orient="horizontal"
+        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+<hbox>
+  <button label="Yes" flex="1"/>
+  <button label="No"/>
+  <button label="I really don't know one way or the other"/>
+</hbox>
+
+</window>
+
+ +

Das Fenster wird zunächst so erscheinen wie im vorherigen Bild. Die ersten beiden Schaltflächen werden auf eine passende Breite und die dritte Schaltfläche auf längere Breite skaliert, weil diese über eine längere Aufschrift verfügt. Die erste Schaltfläche ist flexibel und alle Elemente wurde in eine Box getan. Die Breite dieser Box wird auf die Startgröße aller drei Schaltflächen gesetzt (ca. 430 Pixel in dem Bild).

+ +

Wenn Sie nun das Fenster vergrößern, wird überprüft, ob Elemente flexibel sind, um den entstehenden Freiraum zu füllen, der entstehen würde. Da die erste Schaltfläche das einzig flexible Element ist, sollte es größer werden. Das geschieht in diesem Fall jedoch nicht, da die Box in dem sich die Schaltfläche befindet nicht flexibel ist. Ein unflexibles Element kann niemals seine Größe ändern, wenn der Platz verfügbar ist. Die Schaltfläche kann also nicht größer werden.

+ +

Die Lösung ist, die Box ebenfalls flexibel zu machen. Wird dann das Fenster größer gemacht, ist zusätzlicher Raum verfügbar und die Box wird diesen Raum füllen. Weil die Box größer ist, ist auch mehr Platz innerhalb verfügbar und die flexible Schaltfläche kann diesen Platz einnehmen. Dieser Prozess wird für jede Verschachtelung wiederholt.

+ +

Minimale und maximale Größen festlegen

+ +

Vielleicht möchten Sie, dass ein Element eine bestimmte Größe besitzt, aber dennoch flexibel ist. Es können Größen festgelegt werden, die auch flexible Elemente nicht über- oder unterschreiten sollen. Diese Einstellung erreicht man mit diesen vier Attributen:

+ +
+
minwidth
+
Legt die minimale Breite eines Elements fest.
+
minheight
+
Legt die minimale Höhe eines Elements fest.
+
maxwidth
+
Legt die maximale Breite eines Elements fest.
+
maxheight
+
Legt die maximale Höhe eines Elements fest.
+
+ +

Die Werten werden immer in Pixeln angegeben. Es können auch die zugehörigen CSS Eigenschaften angegeben werden: min-width, min-height, max-width und max-height.

+ +

Diese Eigenschaften sind nur für flexible Elemente sinnvoll. Wird zum Beispiel eine maximale Höhe festgelegt, wird eine Schaltfläche nur bis zu einer bestimmten Größe skaliert. Sie können das Fenster weiterhin vergrößern, die Schaltfläche wird jedoch nicht weiter vergrößert werden. Die Box, in der sich die Schaltfläche befindet wird sich weiterhin anpassen, wenn Sie keine maximale Höhe festgelegt haben.

+ +

Wenn zwei Schaltflächen flexibel sind, werden sich normalerweise beide den freien Platz gleichermaßen teilen. Falls eine Schaltfläche eine maximale Breite hat, wird die zweite Schaltfläche den restlichen Freiraum mit einnehmen.

+ +

Wenn eine Box über eine maximale Breite oder Höhe verfügt, können die darin enthaltenen Kindelemente nicht größer als die festgelegte Größe der Box werden. Wenn eine minimale Breite oder Höhe vorliegt, können die Kindelemente ebenfalls nicht kleiner werden.

+ +
Beispiele zur Festlegung von Breiten und Höhen
+ +
<button label="1" style="width: 100px;"/>
+<button label="2" style="width: 100em; height: 10px;"/>
+<button label="3" flex="1" style="min-width: 50px;"/>
+<button label="4" flex="1" style="min-height: 2ex; max-width: 100px"/>
+<textbox flex="1" style="max-width: 10em;"/>
+<description style="max-width: 50px">This is some boring but simple
+wrapping text.</description>
+
+ +
+
Beispiel 1 
+
Die erste Schaltfläche wird mit einer Breite von 100 Pixeln (px bedeutet Pixel) angezeigt. Die Einheit muss angegeben werden, sonst wird die Breite ignoriert.
+
Beispiel 2 
+
Die zweite Schaltfläche wird mit einer Höhe von 10 Pixeln und einer Breite von 100em (ein em ist die Größe eines Zeichens der aktuellen Schrift) angezeigt.
+
Beispiel 3 
+
Die dritte Schaltfläche ist flexibel, sie wird also auf Basis der Größe Box der angezeigt. Die Schaltfläche wird jedoch niemals kleiner als 50 Pixel breit. Andere flexible Komponenten wie z.B. Spacer werden den verbleibenden Platz einnehmen.
+
Beispiel 4 
+
Die vierte Schaltfläche is flexibel und wird niemals eine Höhe haben, die kleiner als 2 ex ist (ein ex ist normalerweise die Höhe des Buchstaben x der aktuellen Schrift) oder größer als 100 Pixel ist.
+
Beispiel 5 
+
Das Texteingabefeld ist flexibel, wird aber niemals größer als 10em werden. Sie werden vermehrt em verwenden wollen, da Sie Größen für Elemente festlegen, die Text enthalten. Diese Einheit ist hilfreich für Textboxen, da die Schrift geändert werden kann und die Textbox immer eine passende Größe hat, auch wenn der Text mal ganz groß werden sollte.
+
Beispiel 6 
+
Das description Element wird gezwungen eine maximale Breite von 50 Pixeln zu besitzen. Der Text innerhalb wird in eine neue Zeile verschoben, wenn die 50 Pixel erreicht sind.
+
+ +
+
Unser Dateisuche-Dialog
+ +

Fügen wir einige dieser Möglichkeiten zu unserem Dateisuche-Dialog hinzu. Wir werden es so machen, dass die Textbox auf das gesamte Fenster ausgestreckt wird.

+ +
<textbox id="find-text" flex="1" style="min-width: 15em;"/>
+
+ +
Image:boxstyle1.png
+ +

Hier wurde das Texteingabefeld flexibel gemacht. Demnach wird es sich anpassen, wenn der Benutzer die Fenstergröße ändert. Das ist sehr hilfreich, wenn der Benutzer einen langen Text einfügen möchte. Außerdem wurde eine minimale Breite von 15em festgelegt, damit immer zumindest 15 Zeichen zu sehen sind. Verkleinert der Benutzer den Dialog sehr stark, wird das Texteingabefeld nur bis 15em verkleinert. Es wird so gezeichnet werden, als wenn es sich auch außerhalb des Fensters ausbreitet. Beachten Sie, dass das Bild ein Texteingabefeld zeigt, welches auf die maximale Fenstergröße ausgebreitet wurde.

+
+ +

Anordnung in Boxen

+ +

Wenn Sie eine Box mit zwei Kindelementen haben, beide nicht flexibel, die Box ist aber flexibel. Zum Beispiel:

+ +

Beispiel 3: Datei Ansehen

+ +
<box flex="1">
+  <button label="Happy"/>
+  <button label="Sad"/>
+</box>
+
+ +

Wenn Sie nun das Fenster vergrößern, wird die Box auf die Fenstergröße ausgedehnt. Die Schaltflächen sind nicht flexibel, sie werden also nicht ihre Breiten ändern. Das Ergebnis ist zusätzlicher Platz, der auf der rechten Seite der Fensters (innerhalb der Box) erscheint. Sie möchten aber unter Umständen, dass dieser freie Platz auf der linken Seite erscheint, sodass die Schaltflächen auf der rechten Seite des Fensters ausgerichtet werden.

+ +

Sie könnten das lösen, in dem Sie ein spacer Element innerhalb der Box platzieren, aber das wird umständlich, wenn Sie es für eine Vielzahl von Elementen machen müssen. Ein besserer Weg ist, ein zusätzliches Attribut pack dem box Element hinzuzufügen. Dieses Attribut gibt an, wie die Kindelemente innerhalb der Box angeordnet werden sollen. Für horizontal orientierte Boxen wird die horizontale Position der Kindelemente gesteuert. Für vertikal orientierte Boxen wird die die vertikale Position der Kindelemente gesteuert. Es können die folgenden Werte verwendet werden:

+ +
+
start
+
Positioniert Elemente an der linken Seite für horizontale Boxen und an der oberen Seite für vertikale Boxen. Dies ist der Standardwert.
+
center
+
Zentriert Kindelemente in der Box.
+
end
+
Positioniert Elemente an der rechten Seite für horizontale Boxen und an der unteren Seite für vertikale Boxen.
+
+ +

Das pack Attribut wird in der Box festgelegt, die die auszurichteten Elemente enthält, nicht in den Elementen selbst.

+ +

Wir können das vorherige Beispiel ändern, sodass die Elemente wie folgt zentriert werden:

+ +

Beispiel 4: Datei Ansehen

+ +
<box flex="1" pack="center">
+  <button label="Happy"/>
+  <button label="Sad"/>
+</box>
+
+ +

Jetzt, wenn das Fenster verändert wurde, werden die Schaltflächen horizontal zentriert. Vergleichen Sie das Verhalten zum vorherigen Beispiel.

+ +

Box Ausrichtung

+ +

Wenn das Fenster im Happy-Sad Beispiel oben horizontal verändern, wird die Box in der Breite wachsen. Wenn Sie das Fenster vertikal verändern, werden jedoch die Schaltflächen in ihrer Höhe mitwachsen. Das kommt daher weil, die Flexibilität standardmäßig für die vertikale Richtung aktiviert ist.

+ +

Dieses Verhalten kann mit dem align Attribut gesteuert werden. Für horizontale Boxen werden die vertikalen Positionen der kindelemente gesteuert. Für vertikale Boxen werden die horizontalen Positionen der Kindelemente gesteuert. Die möglichen Werte sind ähnlich zu denen des {{XULAttr("pack")}} Attributs.

+ +
+
start
+
Richtet Elemente an der oberen Seite für horizontal Boxen und an der linken Seite für vertikale Boxen aus.
+
center
+
Zentriert Kindelemente in der Box.
+
end
+
Richtet Elemente an der unteren Seite für horizontale Boxen und an der rechten Seite für vertikale Boxen aus.
+
baseline
+
Richtet Elemente an der Textlinie aus. Nur für horizontale Boxen sinnvoll.
+
stretch
+
Standardwert. Sorgt dafür, dass die Elemente auf die Größe der Box ausgedehnt werden, wie ein flexibles Element nur in die andere Richtung.
+
+ +

Im Gegensatz zum pack Attribut, wird das align Attribut auf die beinhalteten Elemente der Box angewendet, nicht auf das Element selbst.

+ +

Zum Beispiel, die erste Box unten wird die Kindelemente ausdehnen, weil das die Standardeinstellung ist. Die zweite Box hat ein align Attribut, seine Kindelemente werden also zentriert platziert.

+ +

Beispiel 5: Datei Ansehen

+ +
<?xml version="1.0"?>
+<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+
+<window id="yesno" title="Question" orient="horizontal"
+        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+  <hbox>
+    <button label="Yes"/>
+    <button label="No"/>
+  </hbox>
+  <hbox align="center">
+    <button label="Maybe"/>
+    <button label="Perhaps"/>
+  </hbox>
+
+</window>
+
+ +
Image:boxstyle2-b.png
+ +

Es können auch die CSS Eigenschaften: -moz-box-pack und -moz-box-align anstatt von Attributen verwendet werden.

+ +
Vielleicht finden Sie auch das Ausrichtungsbeispiel hilfreich, um die verschiedenen Eigenschaften auszuprobieren.
+ +

Text und Schaltflächen abschneiden

+ +

Sie können eine Schaltfläche erstellen, die eine Beschriftung hat, die länger als die maximale Breite der Schaltfläche ist. Eine Lösung wäre sicher die Breite zu erhöhen, jedoch verfügen Schaltflächen (und andere Elemente mit einer Beschriftung) über ein spezielles Attribut. Das Attribut "crop" erlaubt Ihnen wie ein Text abgeschnitten wird, wenn dieser zu lang ist.

+ +

Wenn der Text abgeschnitten wird, wird ein Auslassungszeichen (...) dort eingefügt, wo der Text ausgeschnitten wurde. Vier mögliche Werte sind dazu gültig:

+ +
+
left
+
Der Text wird auf der linken Seite abgeschnitten.
+
right
+
Der Text wird auf der rechten Seite abgeschnitten.
+
center
+
Der Text wird in der Mitte abgeschnitten.
+
none
+
Der Text wird nicht abgeschnitten. Das ist das Standardverhalten.
+
+ +

Dieses Attribut ist wirklich nur dann sinnvoll, wenn ein Dialog so entworfen wurde, dass er verwendbar in jeder Große sein soll. Das crop Attribut kann auch bei anderen Elementen verwendet werden, die ein label Attribut für Beschriftungen verwenden. Das folgende Beispiel zeigt das Attribut in Aktion:

+ +

Beispiel 6: Datei Ansehen

+ +
Image:boxstyle2.png
+ +
<button label="Push Me Please!" crop="right" flex="1"/>
+
+ +

Beachten Sie, wie der Text der Schaltfläche auf der rechten Seiten abgeschnitten wird, wenn das Fenster verkleinert wird.

+ +
+

Aktueller Dateisuche-Dialog: Datei Ansehen

+
+ +

Als nächstes eine Zusammenfassung und einige zusätzliche Details zum Box-Modell.

+ +
+

« zurückweiter »

+
diff --git a/files/de/archive/mozilla/xul/xul_tutorial/xul_struktur/index.html b/files/de/archive/mozilla/xul/xul_tutorial/xul_struktur/index.html new file mode 100644 index 0000000000..2469697a21 --- /dev/null +++ b/files/de/archive/mozilla/xul/xul_tutorial/xul_struktur/index.html @@ -0,0 +1,154 @@ +--- +title: XUL Struktur +slug: Archive/Mozilla/XUL/XUL_Tutorial/XUL_Struktur +tags: + - XUL + - XUL Tutorial +translation_of: Archive/Mozilla/XUL/Tutorial/XUL_Structure +--- +

{{ PreviousNext("XUL_Tutorial/Einfuehrung", "XUL_Tutorial/Die_Chrome_URL") }}

+ +

Wir werden mit einem Blick auf die Handhabung von XUL in Mozilla starten.

+ +

Wie wird XUL behandelt

+ +

In Mozilla wird XUL genauso behandelt wie HTML oder anderer Inhalt. Wenn man die URL einer HTML-Seite in das Adressfeld des Browsers eingibt, ortet der Browser die Webseite und lädt den Inhalt herunter. Die Mozilla Rendering-Engine übersetzt den HTML-Quelltext in ein Dokumentbaum mit DOM. Anschließend wird der Baum in ein Satz Objekte konvertiert, die am Bildschirm angezeigt werden können. CSS, Bilder und andere Technologien werden verwendet, um die Anzeige zu kontrollieren. XUL funktioniert größtenteils auf die selbe Art und Weise.

+ +

In der Tat werden alle Dokumenttypen, egal ob HTML, XUL oder sogar SVG, durch den selben zugrunde liegenden Code behandelt. Das bedeutet, dass die selben CSS-Eigenschaften benutzt werden können, um sowohl HTML und XUL zu manipulieren. Daher können viele Funktionen von beiden genutzt werden. Doch gibt es einige Funktionen, welche nur von HTML verwendet werden können, wie z.B. Formulare, und andere, welche nur von XUL verwendet werden können, so wie Overlays. Da XUL und HTML auf die selbe Art und Weise behandelt werden, kann man beide, sowohl vom lokalen Dateisystem, von einer Webseite oder von einer Erweiterung oder einer selbständigen XULRunner-Anwendung laden.

+ +

Inhalte aus entfernten Quellen z.B. http://localhost/~username/ sind (egal ob HTML, XUL oder ein anderer Dokumententyp) aus Sicherheitsgründen in ihrem Handlungsspielraum beschränkt. Deshalb stellt Mozilla die Methode zur Verfügung, Inhalte lokal zu installieren und registriert die installierten Dateien in sein chrome-System. Dies ermöglicht, dass eine spezielle URL-Form genutzt werden kann, die chrome:// URL genannt wird. Durch den Zugriff auf eine Datei mittels einer Chrome-URL erhält die Datei höhere Rechte, um auf lokale Dateien, Eigenschaften und Bookmarks zuzugreifen und andere privilegierte Operationen auszuführen. Webseiten erhalten diese Privilegien nicht, es sei denn sie sind mit einem digitalen Zertifikat signiert, und der Benutzer hat den Zugriff auf diese Operationen gewährt.

+ +

Die chrome-Paketregistrierung ist der Weg, um es Firefox-Erweiterungen zu ermöglichen, Funktionen zum Browser hinzuzufügen. Erweiterungen sind kleine Pakete mit XUL-Dateien, JavaScript, Stylesheets und Bildern, die in einer einzigen Datei verpackt sind. Eine solche Datei kann mit einem ZIP-Programm erstellt werden. Wenn der Benutzer diese Datei herunterlädt, wird die Erweiterung auf seiner Maschine installiert. Sie hängt sich in den Browser ein, indem sie eine XUL-Eigenschaft benutzt, die man Overlay nennt. Sie erlaubt es, das XUL der Erweiterung mit dem XUL des Browsers zu kombinieren. Für den Benutzer scheint es, als ob die Erweiterung den Browser verändert hat, aber in Wirklichkeit ist der Quelltext separat und die Erweiterung kann leicht entfernt werden. Registrierte Pakete müssen natürlich nicht unbedingt Overlays benutzen. Wenn sie keinen Gebrauch von Overlays machen, ist die Erweiterung nicht von der Browser-Oberfläche aus erreichbar, aber man kann sie über die Chrome-URL erreichen, sofern das erwünscht ist.

+ +

Eigenständige XUL-Anwendungen können XUL-Code auf ähnliche Weise enthalten, er wird aber natürlich als Teil der Installation eingebunden, anstatt separat als Erweiterung eingebettet zu werden. Dennoch wird der XUL-Code im chrome-System registriert, sodass die Applikation die Benutzeroberfläche darstellen kann.

+ +

Der Mozilla Browser selbst ist ebenfalls nichts weiter als eine Sammlung von Paketen, die XUL-Dateien, JavaScript und Stylesheets enthalten. Diese Dateien können über die chrome URL erreicht werden, haben erweiterte Privilegien und verhalten sich auch sonst wie andere Pakete. Natürlich ist der Browser weitaus größer und komplexer als die meisten Erweiterungen. Firefox und Thunderbird und einige andere Komponenten sind alle in XUL geschrieben und erreichbar über chrome-URLs. Sie können diese Pakete erkunden, indem Sie die Dateien in dem chrome-Verzeichnis ansehen, wo Firefox oder die anderen XUL-Anwendungen installiert sind.

+ +

Die chrome-URL beginnt immer mit 'chrome://'. Ähnlich wie eine 'http://'-URL immer eine entfernte Website per HTTP adressiert und die 'file://'-URL immer lokale Dateien, referenziert die 'chrome://'-URL immer installierte Pakete und Erweiterungen. Wir werden uns die chrome-Syntax im nächsten Kapitel genauer ansehen. Es ist wichtig zu wissen, dass der Zugriff über eine chrome-URL erweiterte Privilegien gegenüber den anderen Arten von URLs erlangt. Beispielsweise hat eine HTTP-URL keine besonderen Rechte und es wird ein Fehler ausgegeben, wenn eine Website versucht, zum Beispiel lokale Dateien zu lesen. Wird hingegen eine Datei von einer chrome-URL aus geladen, hat sie das Recht, lokale Dateien ohne Einschränkungen zu lesen.

+ +

Diese Unterscheidung ist wichtig. Es bedeutet, dass Websites bestimmte Dinge nicht tun können, wie zum Beispiel die Lesezeichen des Benutzers zu lesen. Diese Unterscheidung basiert nicht auf dem Inhalt, sondern nur auf der URL, die benutzt wird. Sowohl HTML als auch XUL auf einer Website haben keine erweiterten Rechte, wohingegen XUL und HTML, die mit einer chrome-URL geladen wurden, erweiterte Privilegien haben.

+ +

Wenn Sie XUL auf einer Website benutzen möchten, müssen Sie nur die XUL-Dateien auf die Website stellen, genau so, wie Sie es auch mit HTML-Dateien tun. Laden Sie dann die URL in den Browser: http://localhost/xul.php. Vergewissern Sie sich, dass Ihr Webserver so konfiguriert ist, dass er XUL-Dateien mit dem passenden Content-Type application/vnd.mozilla.xul+xml ausliefert. (zum Beispiel mittels PHP: header('content-type: application/vnd.mozilla.xul+xml');). Der Content-Type stellt sicher, dass Mozilla HTML und XUL unterscheiden kann. Mozilla nutzt die Dateierweiterung nur, solange die Datei vom Dateisystem gelesen wird. Sie sollten trotzdem die .xul-Dateiendung für all Ihre XUL-Dateien benutzen. Sie können XUL-Dateien in Ihren Browser laden, indem Sie sie mit dem Browser öffnen oder im Datei-Manager die Datei doppelklicken.

+ +
Denken Sie daran, dass entfernte XUL-Dateien bedeutende Einschränkungen haben.
+ +

 

+ +

Dokumenttypen: HTML XML XUL CSS

+ +

Mozilla verwendet deutlich unterschiedliche Arten des Dokumentenobjektmodells (DOM) für HTML und XUL, obwohl viele der Funktionen gemeinsam verwendet werden. Es gibt drei hauptsächliche Dokumententypen in Mozilla: HTML, XML und XUL. Natürlich wird HTML für HTML-Dokumente genutzt, XUL für XUL-Dokumente und XML für andere XML-Dokumenttypen. Da XUL ebenfalls XML ist, ist das XUL-Dokument als eine Unterart des XML-Dokumentes zu verstehen. Es gibt feine Unterschiede in der Funktionsweise. Zum Beispiel sind die Formularsteuerungen auf einer HTML-Seite über die document.forms-Eigenschaft erreichbar, während diese nicht für XUL-Dokumente verfügbar ist, weil XUL keine Formulare im Sinne von HTML haben. Andererseits sind spezielle XUL-Funktionen (wie Overlays und Templates) nur in XUL-Dokumenten verfügbar.

+ +

Diese Unterscheidung zwischen den Dokumenten ist wichtig. Es ist möglich viele XUL-Funktionen in HTML oder XML-Dokumenten zu verwenden, sofern sie nicht spezifisch für den jeweiligen Dokumententyp sind. Andere Funktionen erfordern jedoch den richtigen Dokumententyp. Daher können Sie zum Beispiel XUL-Layouts in anderen Dokumenten verwenden, da diese nicht vom XUL-Dokumententyp abhängig sind.

+ +

Um die oben genannten Punkte zusammenfassen:

+ + + +

Die nächsten Abschnitte beschreiben die grundlegende Struktur eines Chrome-Pakets, welches in Mozilla installiert werden kann. Wenn Sie jedoch beginnen wollen eine einfache Anwendung zu schreiben, sollten Sie zu "Ein Fenster erzeugen" springen und zu diesem Abschnitt später zurück kommen.

+ +

Paketorganisation

+ +

Mozilla ist so organisiert, sodass Sie so viele Komponenten wie Sie möchten, vorinstallieren können. Jede Erweiterung ist eine eigenständige Komponente mit einer separaten Chrome-URL. Mozilla verfügt außerdem über je eine Komponente für jedes installierte Theme und Sprachpaket. Jedes dieser Komponenten oder Pakete besteht aus einer Reihe von Dateien, welche die Benutzeroberfläche dafür beschreiben. Die Messenger-Komponente besitzt z.B. Beschreibungen für Fenster von Mailnachrichten oder Adressbuchdialogen.

+ +

Die Pakete, die mit Mozilla ausgeliefert werden, befinden sich im Chrome-Verzeichnis, welches das Verzeichnis ist, wo Sie Mozilla installiert haben. Das Chrome-Verzeichnis ist das, wo Sie alle Dateien, die die Benutzeroberfläche beschreiben, finden. Normalerweise packen Sie alle XUL-Dateien für eine Anwendung in dieses Verzeichnis, obwohl Erweiterungen in das Erweiterungsverzeichnis für einen bestimmten Benutzer installiert werden. Das einfache Kopieren einer XUL-Datei in das chrome-Verzeichnis gibt der Datei noch keine erweiterten Rechte und außerdem kann sie nicht über eine chrome-URL aufgerufen werden. Um diese zusätzlichen Privilegien zu bekommen, müssen Sie eine Manifestdatei erstellen und diese in das Chrome-Verzeichnis packen. Diese Datei ist sehr einfach zu erstellen und ist normalerweise nur ein paar Zeilen lang. Diese Datei wird verwendet, um chrome-URLs auf eine Datei oder einen Verzeichnispfad zu binden, wo sich die XUL-Dateien befinden. Details zur Erstellung dieser Datei werden in einem späteren Abschnitt genauer betrachtet.

+ +

Der einzige Weg Inhalte zu erstellen, die über eine Chrome-Url erreichbar sind, ist, ein Paket wie in nächsten Abschnitten beschrieben, zu erstellen. Das Verzeichnis wird 'chrome' genannt, weil es ein geeigneter Name zur Aufbewahrung von Chrome-Paketen ist, welche in Mozilla enthalten sind.

+ +

Um die Verwirrung noch weiter zu treiben, gibt es noch zwei weitere Orte, wo das Wort "chrome" auftreten könnte. Das ist einmal das -chrome-Kommandozeilenargument und zum anderen der chrome-Modifier der window.open()-Funktion. Keine dieser Funktionen verteilen zusätzliche Privilegien, stattdessen werden sie verwendet, um ein neues Top-Level-Fenster ohne das Browser UI (Toolbars, Menü) zu erstellen. Sie werden diese Funktion sicher noch in komplexeren XUL Anwendungen verwenden, wenn Sie nicht das Browser UI um Ihre Dialogboxen herum haben wollen.

+ +

Dateien eines Pakets werden normalerweise in einzelne JAR-Dateien zusammengefügt. Eine JAR-Datei kann mit einem ZIP-Tool erstellt werden. Beispielsweise können Sie JAR-Dateien in Mozilla's chrome-Verzeichnis öffnen, um die grundlegende Struktur des Pakets zu sehen. Obwohl es normal so ist, dass die Dateien in einer JAR-Datei gepackt sind, können Pakete genauso von einem normalen Verzeichnis erreicht werden. Obwohl Pakete normalerweise nicht auf diese Art ausgeliefert werden, ist es dennoch während der Entwicklung handlicher, die Dateien vorerst nicht zu packen, da Sie diese dann besser bearbeiten können ohne die Dateien jedes Mal neu zu packen zu müssen.

+ +

Standardmäßig parsen Mozilla-Applikationen XUL-Dateien und Skripte und speichern eine vor-kompilierte Version im Speicher im Laufe der Anwendungssitzung. Das verbessert die Leistung. Dadurch wird XUL allerdings nicht neu geladen, auch nicht, wenn die Quelldateien sich geändert haben. Um diesen Mechanismus zu deaktivieren, ist es notwendig die Einstellung nglayout.debug.disable_xul_cache festzulegen. In Firefox muss diese Einstellung unter Umständen hinzugefügt werden, indem "about:config" in die Adresszeile eingegeben wird und dieser Wert auf "true" gesetzt wird. Oder Sie verändern die user.js-Einstellungsdatei manuell und fügen die folgende Zeile hinzu:

+ +
pref("nglayout.debug.disable_xul_cache", true);
+
+ +

Es gibt normalerweise drei verschiedene Teile eines chrome-Pakets, auch wenn sie alle optional sind. Jeder Teil wird in einem anderen Verzeichnis gespeichert. Diese drei Sets sind content, skin und locale, welche unten näher beschrieben sind. Ein bestimmtes Paket kann ein oder mehrere Skins und Sprachen bereitstellen und der Benutzer kann diese mit den eigenen ersetzen. Zusätzlich kann das Paket mehrere unterschiedliche Anwendungen enthalten, jedes davon über eine andere chrome-URL erreichbar. Das Paketsystem ist flexibel genug, um separate Downloads von anderen Teilen wie zum Beispiel andere Sprachen, handzuhaben.

+ +

Die drei Typen der Chrome-Pakete sind:

+ + + +

Content Pakete

+ +

Der Name der JAR-Datei kann beschreiben, was sich darin befindet, aber Sie können nur sicher gehen, wenn Sie sich die Inhalte wirklich anschauen. Verwenden wir das Browserpaket, welches in Firefox enthalten ist als Beispiel. Wenn Sie Dateien in browser.jar entpacken, werden Sie die folgende Verzeichnisstruktur auffinden:

+ +
content
+   browser
+      browser.xul
+      browser.js
+      -- weitere XUL und JS-Dateien --
+      bookmarks
+         -- Bookmarks-Dateien --
+      preferences
+         -- Einstellungsdateien --
+.
+.
+.
+
+ +

Das lässt einfach als ein 'content'-Paket identifizieren, weil das oberste Verzeichnis "content" genannt wurde. Für Skins wird dieses Verzeichnis normalerweise "skin" und für Sprachen wird es normalerweise "locale" genannt. Dieses Benennungsschema ist nicht notwendig, aber es ist eine gute Konvention, um die Teile des Pakets klar trennen zu können. Einige Pakete können unter Umstand ein Abschnitt für content, skin sowie locale besitzen. In diesem Fall werden Sie ein Unterverzeichnis für jeden Typ finden. Chatzilla wird zum Beispiel auf diesem Weg ausgeliefert.

+ +

Das "content/browser"-Verzeichnis enthält eine Vielzahl an Dateien mit der Endung .xul und .js. Die XUL-Dateien sind die mit der .xul-Endung. Die Dateien mit der .js-Endung sind JavaScript-Dateien, welche Skripte enthalten, die die Funktionen eines Fenstern steuern. Viele XUL-Dateien haben eine zugehörige JavaScript-Datei und einige haben sogar mehr als eine.

+ +

In der Verzeichnisauflistung oben werden zwei Dateien genannt. Es gibt natürlich noch weitere, aber zur Einfachheit wurde diese ausgelassen. Die Datei browser.xul ist die XUL-Datei, die das Hauptfenster beschreibt. Das Hauptfenster für ein "content"-Paket sollte den selben Namen wie das Paket haben, mit der Endung .xul. In diesem Fall ist der Paketname "browser" also erwarten wir die Datei browser.xul. Einige der anderen XUL-Dateien beschreiben weitere Fenster. Die Datei pageInfo.xul beschreibt zum Beispiel den Seiteninformationsdialog.

+ +

Viele Pakete werden eine contents.rdf Datei enthalten, welches das Paket beschreibt, den Autor und die Overlays, die verwendet werden. Diese Datei ist jedoch veraltet und wurde durch ein einfacheres Verfahren ersetzt. Die neue Methode ist die sogenannte Manifestdatei, die bereits erwähnt wurde. Diese Dateien finden Sie mit der Endung .manifest im Chrome-Verzeichnis. Die Datei browser.manifest beschreibt beispielsweise das Browser-Paket.

+ +

Mehrere Unterverzeichnisse wie "bookmarks" und "preferences" sind zusätzliche Bereiche der Browser-Komponente. Sie werden nur in unterschiedlichen Ordnern aufbewahrt, um die Dateien besser organisieren zu können.

+ +

Skins oder Themes

+ +

Obwohl der zugrunde liegende Code für Mozilla sie Skins nennt und die Benutzeroberfläche den Ausdruck "Themes" gebraucht, meinen beide die gleiche Sache. Die classic.jar-Datei beschreibt das Standard-Theme von Firefox. Die Struktur ist ähnlich zum content-Paket. Zum Beispiel classic.jar:

+ +
skin
+   classic
+      browser
+         browser.css
+         -- weitere browser Skin-Dateien --
+      global
+         -- globale Skin-Dateien --
+.
+.
+.
+
+ +

Auch hier ist die Verzeichnisstruktur nicht notwendig und wird zur besseren Organisation verwendet. Sie können sogar alle Dateien in ein Verzeichnis packen. Für große Anwendungen werden Unterverzeichnisse verwendet, um verschiedene Komponenten zu trennen. Im obigen Beispiel existiert ein Verzeichnis für Theme-bezogene Dateien des Browsers und ein Ordner für globale Theme-bezogene Dateien. Das "global"-Verzeichnis enthält Skin-Dateien, die allgemein für alle Pakete zu gebrauchen sind. Die Dateien sind für alle Komponenten angelegt und werden mit ihrer eigenständigen Anwendung eingebunden. Der globale Teil definiert den Teil der gemeinsamen XUL-Widgets, wohingegen die anderen Verzeichnisse Dateien enthalten, die speziell für die entsprechenden Anwendungen sind. Firefox bindet beide, die globalen und die Browser Theme-Dateien in einem Archiv ein, aber sie können auch einzeln eingebunden werden.

+ +

Ein Skin besteht aus CSS-Dateien und einer Reihe von Bildern, die das Aussehen des Interface definieren. Die Datei browser.css wird von browser.xul verwendet und enthält Styles, welche das Aussehen unterschiedlicher Teile der Anwendung beschreiben. Beachten Sie hier wieder, dass die Datei browser.css den gleichen Dateinamen wie das Paket besitzt. Beim Verändern von CSS-Dateien, stellen Sie das Aussehen eines Fensters ein, ohne dabei die Funktionen zu beeinflussen. Auf diese Weise können Sie ein neues Theme erstellen. Der XUL-Teil bleibt der Gleiche, aber der Skin-Teil wird unabhängig verändert.

+ +

Lokalisierung

+ +

Die Datei "en-US.jar" beschreibt die Sprachinformationen für jede Komponente, in diesem Fall für US-Englisch. Wie bei den Skins, enthält jede Sprachdatei Dateien, welche den Text für das Paket in der jeweiligen Sprache festlegen. Die Struktur von "locale" ist ähnlich zu den anderen, wir werden das hier nicht noch einmal auflisten.

+ +

Der lokalisierte Text wird in zwei verschiedenen Dateitypen gespeichert: DTD-Dateien und properties-Dateien. Die DTD Dateien haben die Endung .dtd und enthalten Entity-Deklarationen, eine für jeden Textstring, welcher in einem Fenster verwendet wird. Die Datei browser.dtd enthält zum Beispiel Entity-Deklarationen für jedes Menü-Kommando. Zusätzlich werden Tastaturkürzel für jedes Kommando definiert, weil Sie eventuell unterschiedlich in verschiedenen Sprachen sein können. DTD-Dateien werden von XUL Dateien benutzt, meist werden Sie eine Datei pro XUL Datei finden. Der "locale" Teil beinhaltet auch "properties" Dateien, welche ähnlich sind, aber von Skriptdateien verwendet werden. Die Datei browser.properties enthält einige solcher lokalisierter Strings.

+ +

Diese Struktur erlaubt Ihnen Mozilla oder eine Komponente in verschiedene Sprachen zu übersetzen, in dem einfach ein neues "locale"-Verzeichnis hinzugefügt wird. Sie müssen den XUL-Code gar nicht verändern. Weiter kann eine andere Person ein anderes Paket hinzufügen, welches Unterstützung für eine neue Sprache bietet, ohne dass Ihr Originalpaket verändert wird.

+ +

Weitere Pakete

+ +

Es gibt ein spezielles Paket, welches "Toolkit" (oder "global") genannt wird. Wir haben uns das "global"-Verzeichnis für Skins angeschaut. Die Datei toolkit.jar enthält den zugehörigen "content"-Teil dazu. Es sind einige globale Dialoge und Definitionen darunter. Es wird auch das Standardaussehen und die Standardfunktionen der XUL-Widgets, wie Textboxen und Schaltflächen festgelegt. Diese Datei im globalen Teil eines Skin-Verzeichnisses enthalten das Standardaussehen für alle XUL Interface-Elemente. Das Toolkit-Paket wird von allen XUL-Applikationen verwendet.

+ +

Ein Paket hinzufügen

+ +

Mozilla platziert die Pakete, die mit der Installation eingebunden werden, in das Chrome-Verzeichnis. Diese Dateien müssen dort jedoch nicht platziert werden. Wenn ein anderes Paket installiert wird, können Sie dies überall auf der Festplatte platzieren, so lange eine Manifestdatei darauf zielt. Es ergibt Sinn Pakete in das Chrome-Verzeichnis zu packen, einfach weil es bequemer ist. Jedoch funktionieren die Pakete genauso gut, wenn sie woanders liegen. Sie können die Dateien jedoch nicht auf einer entfernten Seite speichern, da die entfernte Seite nicht durch das lokale Dateisystem gemountet ist.

+ +

Es gibt zwei chrome-Verzeichnisse für XUL-Applikationen: Eine ist dort installiert, wo auch die Anwendung installiert wurde, während die andere Teil des Benutzerprofils ist. Das erste Verzeichnis erlaubt Paketen über alle Benutzer zu agieren, während das zweite Verzeichnis nur für den jeweiligen Benutzer erstellt worden ist. Erweiterungen werden in einem separaten  Erweiterungsverzeichnis installiert und sind außerdem Benutzer-spezifisch. Jede Manifestdatei in einem der Chrome-Verzeichnissen wird geprüft, um zu sehen, welche Pakete installiert sind.

+ +

Im nächsten Abschnitt werden wir einen Blick darauf werfen, wie man die Chrome-URL verwendet, um sich auf Chrome-Pakete zu beziehen.

+ +

{{ PreviousNext("XUL_Tutorial/Einfuehrung", "XUL_Tutorial/Die_Chrome_URL") }}

+ +

{{ languages( { "en": "en/XUL_Tutorial/XUL_Structure", "es": "es/Tutorial_de_XUL/Estructura_XUL", "ja": "ja/XUL_Tutorial/XUL_Structure", "pl": "pl/Kurs_XUL/Struktura_XUL","fr": "fr/Tutoriel_XUL/La_structure_XUL" } ) }}

diff --git "a/files/de/archive/mozilla/xul/\303\244nderungen_an_xul_f\303\274r_firefox_1.5/index.html" "b/files/de/archive/mozilla/xul/\303\244nderungen_an_xul_f\303\274r_firefox_1.5/index.html" new file mode 100644 index 0000000000..685c091888 --- /dev/null +++ "b/files/de/archive/mozilla/xul/\303\244nderungen_an_xul_f\303\274r_firefox_1.5/index.html" @@ -0,0 +1,44 @@ +--- +title: Änderungen an XUL für Firefox 1.5 +slug: Archive/Mozilla/XUL/Änderungen_an_XUL_für_Firefox_1.5 +tags: + - Firefox 1.5 + - XUL +translation_of: Archive/Mozilla/XUL/XUL_Changes_for_Firefox_1.5 +--- +

Diese Seite liefert eine Übersicht über die wichtigsten Änderungen an XUL in Firefox 1.5 (Gecko 1.8). Weitere Änderungen, von denen man wissen sollte, beschreibt die Seite XUL Anwendungen für Firefox 1.5 anpassen.

+

<scrollcorner>

+

Es wurde das Element <scrollcorner> hinzugefügt, welche für den kleinen Kasten an der Überkreuzung von horizontalen und vertikalen Scrollbalken benutzt wird.

+

<richlistbox> und <richlistitem>

+

Die Elemente <richlistbox> und <richlistitem> werden zur Darstellung von Listen beliebigen Inhalts benutzt. Das erst genannte funktioniert ähnlich wie <listbox>, welches vorwiegend für Listen mit Texteinträgen entworfen wurde. Die <richlistbox> hat größtenteils die gleiche API wie <listbox> und einzelne Einträge, die mithilfe von <richlistitem> erzeugt wurden, können ausgewählt werden. Siehe Richlistbox für weiterführende Information.

+

System für Voreinstellungen

+

Einige Elemente wurden hinzugefügt, mit denen Voreinstellungsfenster erzeugt werden können. Diese Fenster sind spezielle Typen von Dialogfenstern, die mehrere Panels unterstützen, welche jeweils zusammen in der gleichen Datei oder in einer eigenen Datei gespeichert werden können. Ein Satz von Icons wird am oberen Rand des Dialogfensters angezeigt und erlaubt dem Benutzer das Umschalten zwischen den Panels. Zusammen mit den neuen Elementen und einigen zusätzlichen Attributen für bestehende Elemente ermöglichen sie auf einfache Weise das Setzen von Voreinstellungen, ohne dafür Code benutzen zu müssen. Für weiterführende Information, siehe Preferences System.

+

bfcache

+

Mozilla speichert nun das DOM der Seite zwischen. Daher führt das Navigieren vor und zurück nicht zu einem Neuladen der Seite, was die Navigation sehr viel effizienter macht. Die Ereignisse pageshow und pagehide treten beim Umschalten von einer Seite im Zwischenspeicher auf, wohingegen die Ereignisse load und unload nur beim Laden und Entladen einer Seite auftreten.

+

Für weiterführende Information siehe: Benutzen des Zwischenspeichers in Firefox 1.5.

+

tabIndex

+

Die Eigenschaft tabIndex wird nun auf die meisten Elemente angewendet.

+

<radiogroup>

+

Das Setzen der value Eigenschaft eines <radiogroup> Elements führt zur Auswahl des <radio> Elements in der Gruppe mit dem entsprechenden Wert.

+

Dialog: defaultButton Eigenschaft

+

Die Bindung des <dialog> Elements besitzt nun die Eigenschaft defaultButton. Das Setzen dieser Eigenschaft ändert die Standardschaltfäche des Dialogfensters. Die eine Möglichkeit ist die Angabe einer der Schaltflächen der <dialog>-Bindung (anhand des Namens); die andere ist none, dann ist keine Schaltfläche die Standardschaltfläche.

+

Schaltfläche: icon Eigenschaft

+

Die icon Eigenschaft einer Schaltfläche ermöglicht die Verwendung vordefinierter Icons als Bild der Schaltfläche. Beispielsweise erzeugt <button icon="help"> eine Schaltfläche mit einem Hilfe-Icon. Dies wird typischerweise auf Systemen mit GNOME eingesetzt, die möglichen Werte sind hier: accept, cancel, help, open, save, find, clear, yes, no, apply, close, print, add, remove, refresh, go-forward, go-back, properties, select-font, select-color, network.

+

<menulist>

+

Einträge in einer <menulist> können ein description Attribut haben, um zusätzlich beschreibenden Text neben dem Namen eines Eintrags anzuzeigen. Die Änderungsmethoden appendItem und insertItemAt von menulist verlangen ein zusätzliches description Argument, wenn Einträge auf diese Weise erzeugt werden.

+

<listbox>

+

Die Methode removeItemAt war augrund eines Fehlers ({{ Bug(236068) }}) manchmal nicht nullbasiert. Dies wurde in Firefox 1.5 behoben und Code, der sich auf dieses nicht nullbasierte Verhalten verlässt, sollte entsprechend geändert werden.

+

<stringbundle>

+

Das <stringbundle> Element hat eine Eigenschaft strings dazu bekommen, die eine Aufzählung aller im Bündel enthaltenen Zeichenketten ermöglicht.

+

Ziehbare Reiter

+

Von jetzt an erlaubt der Tab-Browser ein Neuanordnen der Reiter durch einfaches Ziehen.

+

<tabbox>

+

Das <tabbox> Element besitzt nun ein Attribut selectedIndex zur Angabe desjenigen Reiters, der standardmäßig gewählt sein soll.

+

Überlagerungen dynamisch laden

+

XUL untersützt nun das dynamische Laden von Überlagerungen mithilfe der Funktion document.loadOverlay.

+
+

Information zum Originaldokument

+ +
+

{{ languages( { "en": "en/XUL_Changes_for_Firefox_1.5", "fr": "fr/Modifications_XUL_pour_Firefox_1.5", "ja": "ja/XUL_Changes_for_Firefox_1.5", "pl": "pl/Zmiany_w_XUL-u_w_Firefoksie_1.5" } ) }}

diff --git a/files/de/archive/mozilla/xulrunner/index.html b/files/de/archive/mozilla/xulrunner/index.html new file mode 100644 index 0000000000..f4f7b708d4 --- /dev/null +++ b/files/de/archive/mozilla/xulrunner/index.html @@ -0,0 +1,81 @@ +--- +title: XULRunner +slug: Archive/Mozilla/XULRunner +tags: + - XUL + - XULRunner +translation_of: Archive/Mozilla/XULRunner +--- +
XULRunner Einführung
+Eine kurzes Tutorial zu XULRunner.
+ +
XULRunner ist ein Mozilla-Laufzeitpaket, welches genutzt werden kann, um XUL+XPCOM-Anwendungen auszuführen. Es stellt Mechanismen zur Installation, Aktualisierung und Deinstallation solcher Anwendungen bereit. XULRunner stellt weiterhin libxul bereit, eine Lösung, welche es erlaubt Mozilla-Technologien in andere Projekte und Produkte einzubetten.
+ + + + + + + + +
+

Veröffentlichungen

+ +
+

XULRunner 1.9.2 wurde veröffentlicht und kann unter ftp.mozilla.org heruntergeladen werden. Siehe auch: Versionsinformationen zur Installation, Deinstallation, und für weitere Informationen zu dieser Version.

+ +

Firefox 3 und höher sind mit einem XULRunner Paket ausgestattet, welches jede kompatible XULRunner Anwendung über den -app Parameter benutzen kann.

+ +

Ältere Versionen sind auch verfügbar.

+
+ +

Überblick

+ + + +

Dokumentation

+ +
+
XULRunner Einführung
+
Eine kurze Einführung in XULRunner.
+
XULRunner Tipps
+
Eine Sammlung von Tipps zum Arbeiten mit XULrunner.
+
XULRunner 1.8 verwenden
+
Dieser Artikel beschreibt, wie man XULRunner 1.8 als eigenständige Anwendung verwendet.
+
XULRunner Hall of Fame
+
Auflistung aller verfügbaren Anwendungen, die auf XULRunner basieren.
+
Build Dokumentation
+
Wie man den Quelltext bekommt und kompiliert.
+
Debug Dokumentation
+
Schritte, die man benötigt, um Venkman zum Debuggen zu konfigurieren.
+
+ +

Alles anzeigen...

+ 		+

Community

+ +
    +
  • Mozillas Plattform Foren:
    • +
+ +

{{ DiscussionList("dev-platform", "mozilla.dev.platform") }}

+ + + +

Verwandte Themen

+ +
+
XUL
+
+
+ +

 

diff --git a/files/de/archive/rss/index.html b/files/de/archive/rss/index.html new file mode 100644 index 0000000000..e160b25010 --- /dev/null +++ b/files/de/archive/rss/index.html @@ -0,0 +1,13 @@ +--- +title: RSS +slug: Archive/RSS +tags: + - RSS +translation_of: Archive/RSS +--- +
Einführung
+Dieses Tutorial soll Anfängern den Einstieg in RSS erleichtern.
+
Really Simple Syndication (RSS) ist ein weit verbreitetes HTML-ähnliches und XML-basierendes Datenformat, welches zum Austausch von Inhalten benutzt wird. RSS hat eine schäbige Geschichte und eine Vielzahl an unterschiedlichen inkompatiblen RSS Versionen (einige sind auf RDF basiert, aber die meisten sind auf XML basiert). Nichtsdestotrotz ist RSS ein extrem populäres Format, das für den Austausch von Nachrichten, Blogposts, IPradio, IPTV und vielem mehr bestens geeignet ist und enorm an Fahrt gewonnen hat.
+ +

Dokumentation

Why RSS Slash is Popular - Counting Your Comments (en)
Ein Artikel von Charles Iliya Krempeaux über das RSS Slash Modul, warum es so populär ist und wie es man schafft einen Zähler für seine Kommentare bereit zu stellen.
Why Well-Formed Web RSS Module is Popular - Syndicating Your Comments (en)
Ein Artikel von Charles Iliya Krempeaux über das RSS Well-Formed Web Modul, warum es so populär ist und wie man damit Kommentare verlinkt.
The Myth of RSS Compatibility (en)
Mark Pilgrim schildert die schäbige Geschichte von RSS und Details zur Inkompatibilität zwischen jeder Version.
Atomic RSS (en)
Tim Bray schildert die Benutzung von Atom 1.0 als Mikroformat und erweiterndes Modul für RSS 2.0 sowie das Beibehalten von RSS 2.0 als Austauschformat, allerdings mit integrierten, ausgewählten Atom 1.0 Elementen.

Alle ansehen...

Community

  • Mozillas XML-Foren:

{{ DiscussionList("dev-tech-xml", "mozilla.dev.tech.xml") }}

RDF, XML
+

{{ languages( { "en": "en/RSS","es": "es/RSS", "fr": "fr/RSS", "it": "it/RSS", "ja": "ja/RSS", "pl": "pl/RSS", "pt": "pt/RSS", "ko": "ko/RSS" } ) }}

diff --git a/files/de/archive/themes/index.html b/files/de/archive/themes/index.html new file mode 100644 index 0000000000..a440be2e7a --- /dev/null +++ b/files/de/archive/themes/index.html @@ -0,0 +1,11 @@ +--- +title: Themes +slug: Archive/Themes +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive/Themes +--- +

Archived theme documentation.

+ +

{{Listsubpages("/en-US/docs/Archive/Themes", 10)}}

diff --git a/files/de/archive/web-standards/index.html b/files/de/archive/web-standards/index.html new file mode 100644 index 0000000000..6b29b8e71c --- /dev/null +++ b/files/de/archive/web-standards/index.html @@ -0,0 +1,69 @@ +--- +title: Webstandards +slug: Archive/Web-Standards +tags: + - Webstandards +translation_of: Archive/Web_Standards +--- +
+ Webstandards wurden sorgfältig entworfen, um für die größtmögliche Zahl von Internet-Nutzern den größtmöglichen Nutzen zu erzielen und gleichzeitig die Langlebigkeit von im Internet veröffentlichten Dokumenten sicherzustellen. Wer sich beim Entwerfen und Erstellen von Websites an diese Standards hält, vereinfacht die Produktion und senkt die Kosten, während gleichzeitig Websites entstehen, die für mehr Menschen und mehr webfähige Endgeräte zugänglich sind. Websites, die gemäß dieser Richtlinien entwickelt wurden, bleiben auch dann voll funktionsfähig, wenn sich herkömmliche Desktop-Browser verändern und neue internetfähige Endgeräte auf den Markt kommen.{{ Ref(1) }}
+ + + + + + + +
+

Dokumentation

+
+
+ Anwendungen vom Internet Explorer zu Mozilla migrieren
+
+ Jemals Probleme mit Internet Explorer-spezifischen Webanwendungen unter Mozilla gehabt? In diesem Artikel werden geläufige Probleme bei der Verwendung von IE-Anwendungen unter Mozilla-basierenden Browsern erläutert.
+
+ Verwendung von Webstandards
+
+ Dieser Artikel liefert einen Überblick über die Einhaltung von W3C Webstandards für die Inhalte der eigenen Webseite.
+
+ Wahl von Webstandards gegenüber proprietären Praktiken
+
+ In der Welt der (Web-)Entwicklung gibt es einen Bedarf an Standards, weil Anwendungen für für mehrere Entwicklergruppen entworfen werden.
+
+ Vorteile von Webstandards
+
+ Wie das Festhalten an Webstandards sowie die Verminderung von proprietären Markup und Technologien dazu beitragen kann, geschäftliche Ziele zu erreichen.
+
+ 		+

Community

+

Mozillas Webstandardsforen

+
+ {{ DiscussionList("dev-web-development", "mozilla.dev.web-development") }}
+ +

Tools

+ +

Beispiele

+ +

Verwandte Themen

+
+
+ CSS, DHTML, HTML, Webentwicklung, XHTML, XML
+
+
+

{{ endnote("1") }} - The Web Standards Project

diff --git a/files/de/archive/web-standards/rdf_in_mozilla_faq/index.html b/files/de/archive/web-standards/rdf_in_mozilla_faq/index.html new file mode 100644 index 0000000000..cbd3c1194b --- /dev/null +++ b/files/de/archive/web-standards/rdf_in_mozilla_faq/index.html @@ -0,0 +1,264 @@ +--- +title: RDF in Mozilla FAQ +slug: Archive/Web-Standards/RDF_in_Mozilla_FAQ +tags: + - RDF +translation_of: Archive/Web_Standards/RDF_in_Mozilla_FAQ +--- +

Allgemeines

+

Wo fange ich an?

+

RDF dient zwei primären Zielen in Mozilla. Erstens ist es eine einfache, plattformübergreifende Datenbank für kleinere Datenmengen und zweitens - und das ist der Hauptgrund - wird das RDF-Modell zusammen mit XUL Templates als eine abstrakte "API" zur Anzeige von Informationen benutzt. RDF in fünfzig Worten oder weniger ist eine kurze Beschreibung auf hohem Niveau, was RDF in Mozilla macht. Die RDF Back-End Architektur beschreibt die RDF Implementierung in Mozilla detaillierter und gibt eine kurze Übersicht der beteiligten Schnittstellen.

+

Wo finde ich Informationen über Open Directory ("dmoz")?

+

Detaillierte Informationen zu Open Directory gibt es auf www.dmoz.org. Das Open Directory Datenset ist als (riesiger) RDF/XML Dump verfügbar. Es beschreibt tausende von Webseiten, die eine Mischung aus dem Dublin Core Metadaten-Vokabular und der DMoz Klassifizierung benutzen. Für mehr Informationen zu diesem Thema lesen Sie bitte die DMoz RDF Seiten oder odp-rdf-announce für Änderungen an dessen genauem Datenformat. Die Seite ChefMoz (gemeinnütziger Restaurantführer) ist auch als RDF verfügbar.

+

Wenn Sie Probleme mit den Daten von DMoz bzw. ChefMoz haben, ist es das Beste, die Leute hinter diesen Projekten direkt zu kontaktieren. Aber wenn Sie etwas Interessantes mit diesem Inhalt machen (z.B. ihn in Mozilla benutzen, um beispielsweise Teile davon in das XUL UI von einer entfernten Seite zu laden), vergessen Sie bitte nicht, es mozilla-rdf und die RDF Interest Group wissen zu lassen. Diese Gruppen sind wahrscheinlich auch an Tools interessiert, die die DMoz Daten säubern, umgestalten oder speichern. Besuchen Sie die Seiten, die ODP Daten benutzen, um einige Verzeichnisse zu sehen, die auf den ODP RDF Dumps basieren.

+

Was ist eine Datenquelle?

+

RDF kann für gewöhnlich auf zwei verschiedene Arten angezeigt werden: Entweder als Datenmenge mit Knoten und Bogen oder als Gruppierung logischer Aussagen. Eine Datenquelle ist eine Teilmenge (oder eine Ansammlung von Aussagen, abhängig von Ihrem Standpunkt), die aus bestimmten Gründen zusammengefasst werden. Einige Beispiele für bereits existierende Datenquellen sind Browser Lesezeichen, Browser Verlauf, IMAP E-Mail Accounts, NNTP News Server und RDF/XML Dateien.

+

In Mozilla können Datenquellen mit Hilfe der Composite Data Source zusammengefasst werden. Dies entspricht dem Überlagern von Datenmengen oder dem Zusammenfassen von Gruppen von Aussagen. Aussagen über die selbe RDF Ressource können dann gemischt werden: Zum Beispiel das Datum des letzten Besuchs einer bestimmten Webseite kommt aus dem globalen Browser-Verlauf und die Tastenkombination zum Erreichen der Webseite per Tastatur kann aus der Datenquelle für die Browser-Lesezeichen stammen. Beide Datenquellen gehören zur Webseite, die über die URL angesprochen wird: Das ist der Schlüssel, der es erlaubt, die Datenquellen korrekt zu verbinden.

+

Für eine detailliertere Beschreibung, wie man Datenquellen schreibt, lesen Sie sich bitte das RDF Datenquellen Tutorial durch.

+

Wie verwaltet Mozilla Datenquellen?

+

Der RDF Service verwaltet eine Tabelle aller geladenen Datenquellen. Die Tabelle ist mit der URI der Datenquelle verbunden, welche entweder die URL einer RDF/XML Datei oder eine spezielle URI mit "rdf:" am Anfang ist, welche auf eine eingebaute Datenquelle zielt.

+

Datenquellen können über den RDF Service unter Verwendung der GetDataSource() Methode bezogen werden. Wenn sich das URI Argument auf eine URL einer RDF/XML Datei bezieht, wird der RDF Service eine RDF/XML Datenquelle erstellen und diese asynchron parsen. Die Datenquelle bleibt im Cache bis die letzte Referenz der Datenquelle ausgegeben wurde.

+

Wenn sich das URI-Argument auf eine eingebaute Datenquelle bezieht, wird der RDF Service den XPCOM Component Manager verwenden, um eine Komponente zu laden, deren ContractID über eine spezielle URI geladen wurde: prefix@mozilla.org/rdf/datasource;1?name=.

+

Zum Beispiel,

+
rdf:foo
+
+

Würde folgendes laden::

+
@mozilla.org/rdf/datasource;1?name=foo
+
+

Wie bei RDF/XML Datenquellen, wird eine Datenquelle über diesen Weg solange im Cache bleiben die letzte Referenz ausgegeben wurde.

+

Wie erstelle ich eine Datenquelle aus einer RDF/XML Datei?

+

Sie können entweder eine RDF/XML Datenquelle über die RDF Service GetDataSource() Methode erstellen:

+
// Get the RDF service
+var RDF =
+  Components
+  .classes["@mozilla.org/rdf/rdf-service;1"]
+  .getService(Components.interfaces.nsIRDFService);
+// ...and from it, get the datasource. Make sure that your web server
// dishes it up as text/xml (recommended) or text/rdf!
+var ds = RDF.GetDataSource("http://www.mozilla.org/some-rdf-file.rdf");
+// Note that ds will load asynchronously, so assertions will not
// be immediately available
+
+

Alternativ können Sie eine direkt erstellen, indem Sie den XPCOM Component Manager nutzen, so wie im folgendem Codeausschnitt dargestellt:

+
// Create an RDF/XML datasource using the XPCOM Component Manager
+var ds =
+  Components
+  .classes["@mozilla.org/rdf/datasource;1?name=xml-datasource"]
+  .createInstance(Components.interfaces.nsIRDFDataSource);
+// The nsIRDFRemoteDataSource interface has the interfaces
// that we need to setup the datasource.
+var remote =
+   ds.QueryInterface(Components.interfaces.nsIRDFRemoteDataSource);
+// Be sure that your web server will deliver this as text/xml (recommended) or text/rdf!
+remote.Init("http://www.mozilla.org/some-rdf-file.rdf");
+// Make it load! Note that this will happen asynchronously. By setting
// aBlocking to true, we could force it to be synchronous, but this
// is generally a bad idea, because your UI will completely lock up!
+remote.Refresh(false);
+// Note that ds will load asynchronously, so assertions will not
// be immediately available
+
+

Sie können sich auch dafür entscheiden, die RDF/XML Datenquelle "manuell" zu erstellen, wenn Sie diese synchron statt asynchron laden wollen.

+

Wie lade ich eine RDF/XML Datenquelle neu?

+

Sie können eine RDF/XML Datenquelle (oder jede andere Datenquelle, die nsIRDFRemoteDataSource unterstützen) neu laden, indem Sie die Refresh() Methode von nsIRDFRemoteDataSource nutzen. Refresh() nimmt einen Parameter an, welcher angibt, ob Sie die Operation synchron ("blocking") oder asynchron ("non-blocking") ausführen möchten. Sie sollten niemals einen synchronen Ladevorgang durchführen, wenn Sie nicht wirklich wissen, was Sie tun: Das wird die Benutzeroberfläche zum Einfrieren bringen bis der Ladevorgang abgeschlossen ist!

+

Wie kann ich feststellen, ob eine RDF/XML Datenquelle geladen wurde?

+

Über die nsIRDFRemoteDataSource Schnittstelle ist es möglich die Eigenschaft "loaded" zu befragen, um zu bestimmen, ob die Datenquelle geladen wurde oder nicht:

+
// Get the RDF service
+var RDF =
+  Components
+  .classes["@mozilla.org/rdf/rdf-service;1"]
+  .getService(Components.interfaces.nsIRDFService);
+// Get the datasource.
+var ds = RDF.GetDataSource("http://www.mozilla.org/some-rdf-file.rdf");
+// Now see if it's loaded or not...
+var remote =
+  ds.QueryInterface(Components.interfaces.nsIRDFRemoteDataSource);
+
+if (remote.loaded) {
+  alert("the datasource was already loaded!");
+}
+else {
+  alert("the datasource wasn't loaded, but it's loading now!");
+}
+
+

Sagen wir mal, dass die Datenquelle nicht geladen wurde und sie asynchron geladen werden wird. Über diese API und über JavaScript setTimeout() können wird eine Schleife erstellen, die kontinuierlich die "loaded" Eigenschaft prüft. Das ist sehr zusammengeschustert und schlecht, da kein fehlgeschlagener Ladevorgang erkannt wird, beispielsweise, wenn gar keine Daten in der URL vorhanden waren!

+

Aus diesem Grund gibt es ein Observer Interface, welche Ihnen erlaubt den Fortschritt der Datenquelle zu beobachten. Der folgende Code zeigt die Verwendung:

+
// This is the object that will observe the RDF/XML load's progress
+var Observer = {
+  onBeginLoad: function(aSink)
+    {},
+
+  onInterrupt: function(aSink)
+    {},
+
+  onResume: function(aSink)
+    {},
+
+  onEndLoad: function(aSink)
+    {
+      aSink.removeXMLSinkObserver(this);
+      alert("done!");
+    },
+
+  onError: function(aSink, aStatus, aErrorMsg)
+    { alert("error! " + aErrorMsg); }
+};
+// Get the RDF service
+var RDF =
+  Components
+  .classes["@mozilla.org/rdf/rdf-service;1"]
+  .getService(Components.interfaces.nsIRDFService);
+// Get the datasource.
+var ds = RDF.GetDataSource("http://www.mozilla.org/some-rdf-file.rdf");
+// Now see if it's loaded or not...
+var remote =
+  ds.QueryInterface(Components.interfaces.nsIRDFRemoteDataSource);
+
+if (remote.loaded) {
+  alert("the datasource was already loaded!");
+}
+else {
+  alert("the datasource wasn't loaded, but it's loading now!");
+  // RDF/XML Datasources are all nsIRDFXMLSinks
+  var sink =
+    ds.QueryInterface(Components.interfaces.nsIRDFXMLSink);
+  // Attach the observer to the datasource-as-sink
+  sink.addXMLSinkObserver(Observer);
+  // Now Observer's methods will be called-back as
  // the load progresses.
+}
+
+

Beachten Sie, dass der Observer an der RDF/XML Datenquelle angehängt bleibt, bis removeXMLSinkObserver aufgerufen wurde.

+

Wie bekomme ich Zugang zu den Informationen in einer Datenquelle?

+

Das nsIRDFDataSource Interface ist ein Hilfsmittel mit dem Sie die Assertions der Datenquelle erreichen und verändern können.

+ +

Sie können außerdem RDF Container Schnittstellen verwenden, um Zugang zu Informationen der RDF Container zu erhalten.

+

Wie kann ich Informationen in der Datenquelle ändern?

+

Um 'Assert' verwenden zu können, um eine Assertion hinzuzufügen und 'Unassert' zu verwenden, um eine zu entfernen, lesen Sie Mozilla RDF Back end Architecture (engl.).

+
ds.Assert(homepage, FV_quality, value, true);
+ds.Unassert(homepage, FV_quality, value, true);
+
+

Wie mache ich Änderungen an einer RDF/XML Datenquelle rückgängig?

+

Eine RDF/XML Datenquelle kann über QueryInterface() der nsIRDFRemoteDataSource Schnittstelle gesteuert werden. Dieses Interface hat eine Flush() Methode, welche versuchen wird, die Inhalte der Datenquelle zurück zur URL, von der Sie kommen, wiederherzustellen. Das geschieht über ein speziellen Protokollmechanismus (z.B., schreibt eine "file:" URL nur die Datei; eine "http:" URL kann einen HTTP-POST ausführen). Flush() schreibt nur zur Datenquelle, wenn sich die Inhalte geändert haben.

+

Wie füge ich zwei oder mehr Datenquellen zusammen, um sie als eine zu sehen?

+

Verwenden Sie nsIRDFCompositeDataSource. Dieses Interface ist von nsIRDFDataSource abgeleitet. Eine Implementierung dieser Schnittstelle kombiniert typischerweise die Aussagen mehrerer Datenquellen zusammen als eine Sammlung. Weil das nsIRDFCompositeDataSource Interface von nsIRDFDataSource abgeleitet ist, kann es genau so abgefragt und verändert werden wie eine individuelle Datenquelle.

+

Wie bekomme ich Zugang zu "eingebauten" Datenquellen?

+

Eine eingebaute Datenquelle ist eine lokal installierte Komponente, die nsIRDFDataSource implementiert. Zum Beispiel den Bookmarks Service. Prüfen Sie zunächst hier, um sicher zu gehen, dass sie Zugang zu einer eingebauten Datenquelle haben. Es gibt mehrere Sicherheitsbeschränkungen für den Zugang zu eingebauten Datenquellen von "unsicherem" XUL und JS.

+

Da eine eingebaute Datenquelle nur eine XPCOM Komponente ist, können Sie diese direkt über den XPConnect Component Manager instanzieren.

+
// Use the component manager to get the bookmarks service
+var bookmarks =
  Components.
  classes["@mozilla.org/rdf/datasource;1?name=bookmarks"].
  getService(Components.interfaces.nsIRDFDataSource);
+
+// Now do something interesting with it...
+if (bookmarks.HasAssertion(
+     RDF.GetResource("http://home.netscape.com/NC-rdf#BookmarksRoot"),
+     RDF.GetResource("http://home.netscape.com/NC-rdf#child"),
+     RDF.GetResource("http://home.netscape.com/NC-rdf#PersonalToolbarFolder"),
+     true) {
+  // ...
+}
+
+

Alternativ haben einige Datenquellen "spezielle" RDF-freundliche ContractIDs, die es einfach machen, die Datenquelle über die nsIRDFSerivce GetDataSource() Method zu instantiieren oder die Datenquellenattribute auf einem XUL Template. Diese ContractIDs haben die Form

+
@mozilla.org/rdf/datasource;1?name=name
+
+

und sind über GetDataSource() und die Datenquellenattribute über den Kürzel "rdf:name" erreichbar. Beispielsweise zeigt der folgende Codeausschnitt, wie man den Bookmark Service als eine Datenquelle in ein XUL Template hinzufügt.

+
<tree datasources="rdf:bookmarks">
+  ...
+</tree>
+
+

Wie manipuliere ich RDF "container"?

+

Um einen RDF "container" (ein <rdf:Seq>, zum Beispiel) zu manipulieren, können Sie nsIRDFContainerUtils verwenden, welche als Service mit der folgenden ContractID instantiiert werden kann:

+
@mozilla.org/rdf/container-utils;1
+
+

Sie können diesen Service verwenden, um zu ermitteln, ob etwas ein RDF Container ist, indem Sie IsSeq(), IsBag() und IsAlt() benutzen. Sie können eine Quelle in einen Container machen, wenn das nicht schon der Fall ist, in dem Sie MakeSeq(), MakeBag() oder MakeAlt() verwenden. Diese Methoden geben einen nsIRDFContainer zurück, welcher Ihnen erlaubt Container-ähnliche Operationen auszuführen und das Sie sich Ihre Hände schmutzig machen.

+

Alternativ, wenn Ihre Datenquelle bereits ein Objekt hat, welches ein RDF Container ist, können Sie ein nsIRDFContainer Objekt mit der folgenden Zeile instantiieren:

+
@mozilla.org/rdf/container;1
+
+

Mit der ContractID und Init() mit der Datenquelle und der Ressource als Parameter. Beachten Sie, dass dies fehlschlagen wird, wenn die Ressource nicht bereits ein Container ist.

+

XUL Templates

+

XUL Templates werden durch die Angabe eines Datenquellenattributs für ein Element in einem XUL Dokument festgelegt.

+

Es gibt zwei Arten von XUL Templates. Die einfache Art, welche aktuell die meist genutzte im Mozilla Code ist, und die erweiterte Art, welche anspruchsvolle Muster im RDF Graphen bietet. Siehe Vorlagen Tutotrial.

+

Was ich mit einem XUL Template machen?

+

Sie können jede Art von Inhalt mit einem XUL Template verarbeiten. Sie können jede Art von Tags in dem <action> Bereich des <rule> Tags verwenden (auch HTML oder beliebiges XML).

+

Wann sollte ich ein XUL Template verwenden?

+

Eine Alternative zur Verwendung von RDF und XUL Templates ist die Verwendung von W3C DOM APIs, um XUL (oder HTML) Inhaltsmodelle zu verändern. Es kann jedoch sein, dass es dann etwas umständlich werden kann:

+
  1. Es gibt mehrere "views" der Daten. Zum Beispiel erkennen Mozilla mail/news die Verzeichnisstruktur in der Toolbar, das "folder pane", in mehreren Menüs und in einigen Dialogen. Um nicht drei Stücke JS (oder C++) Code zum Aufbau der DOM Trees für <menubutton>, <menu> and <tree> Inhaltsmodell zu erstellen, schreiben Sie einfach drei kompakte Regeln für jedes Inhaltsmodell.
  2. Die Daten können sich verändern. Zum Beispiel kann ein mail/news Benutzer IMAP Ordner löschen oder hinzufügen. (Beachten Sie wie diese Aufgabe das Inhaltsmodell verkompliziert). Der XUL Template Builder verwendet Regeln, um automatisch alle Inhaltsmodelle synchron zu halten.
    3. +
+

Um die Vorteile dieser Funktionen zu nutzen, müssen Sie natürlich in der Lage sein, Ihre Informationen nach der RDF datasource API auszudrücken, entweder durch die Verwendung des eingebauten Datenquellenspeichers, durch RDF/XML zum Speichern Ihrer Informationen oder durch das Schreiben Ihrer eigenen Implementierung (möglicherweise in JavaScript) der nsIRDFDataSource Schnittstelle.

+

Was wird geladen, wenn ich "datasources=" festlege?

+

Das "datasources" Attribut in der Wurzel eines Templates legt eine Leerzeichen-getrennte Liste von Datenquellen URIs zum Laden fest. Aber was ist eine "Datenquellen URI"? Entweder:

+ +

In beiden Fällen wird die Datenquelle über die GetDataSource() Methode der nsIRDFService Schnittstelle geladen, daher wird es ähnlich verwaltet wie alle anderen Datenquellen, die auf diesem Weg geladen werden.

+

Was ist das Sicherheitsmodell für RDF/XML in XUL?

+

XUL wird von einer "vertrauten" URL geladen. Jede "chrome:" URL kann jede Datenquellen-URI über das Datenquellenattribut des XUL Templates festlegen.

+

XUL, welches von einer "unvertrauten" URL geladen wurde, kann nur ein RDF/XML Dokument aus der gleichen Codebase (im Sinne von Java) festlegen. Keine speziellen (z.B., rdf:) Datenquellen können von unsicherem XUL geladen werden.

+

Wie füge ich eine Datenquelle zu einem XUL Template hinzu?

+

Obwohl es möglich ist ein XUL Template mit einem eingeschlossenen Set von Datenquellen durch das Datenquellenattribut auszustatten, gibt es oft Situationen bei denen Sie nicht wissen, welche Datenquelle geladen werden soll, bis das XUL geladen wurde. Beispielsweise muss Ihr XUL die Datenquellen erst berechnen, daher brauchen Sie eine onload Routine. Oder es muss eine Datenquelle auf Basis der Benutzeraktionen hinzugefügt werden.

+

Hier ist ein einfaches Beispiel, welches zeigt wie man dies machen kann. fangen wir mit dem folgendem XUL an.

+
<window xmlns="http://www.mozilla.org/keymaster/gat...re.is.only.xul">
+  ...
+  <tree id="my-tree" datasources="rdf:null">
    ...
  </tree>
+  ...
+</window>
+
+

Nehmen wir an, dass wir die Datenquelle irgendwie erhalten haben. Der folgende Beispielcode zeigt, wie man eine Datenquelle zu einem Template hinzufügtund dann das Template auffordert, sich selbst auf Basis der neuen Daten neu zu laden.

+
var ds = /* assume we got this somehow! */;
+// Get the DOM element for 'my-tree'
+var tree = document.getElementById('my-tree');
+// Add our datasource to it
+tree.database.AddDataSource(ds);
+// Force the tree to rebuild *now*. You have to do this "manually"!
+tree.builder.rebuild();
+
+

Jedes XUL Element mit einem "datasources" Attribut wird eine Datenbank- und eine Builder-Eigenschaft erhalten. Die Datenbankeigenschaft bezieht sich auf ein nsIRDFCompositeDataSource Objekt, welches die Datenquellen aus denen ein Template erstellt wird, enthält.

+

Der Builder-Eigenschaft bezieht sich auf ein nsIXULTemplateBuilder Objekt, welches ein "builder" ist, der den Status der Template-Inhalte verwaltet.

+

Hinweis zur rdf:null Datenquelle: Das ist eine spezielle Datenquelle, die sagt, "Hey, Ich habe noch keine Datenquelle für dich, aber ich werde später eine hinzufügen, also mach dich bereit!" Die database und builder Eigenschaften werdn eingerichtet, aber lassen die Datenbank der Datenquellen leer: Sie müssen diese selbst hinzufügen!

+

Kann ich ein XUL Template über DOM APIs manipulieren?

+

Ja: Sie können Regeln hinzufügen und Regeln entfernen, eine Abfrage ändern und den Inhalt, der durch eine Regel erzeugt wird, ändern. Sie können sogar alles über die W3C DOM APIs verändern.

+

Die einzige Einschränkung ist, dass Sie rebuild() aufrufen müssen, bevor die Änderungen sichtbar werden (so als wenn Sie eine Datenquelle zu einem XUL Template hinzufügen).

+

Wie füge ich Plaintext aus einem Template hinzu?

+

Um Plaintext in ein Template hinzuzufügen, verwenden Sie das <text> Element.

+
<template>
+  <rule>
+    <query>...</query>
+    <binding>...</binding>
+    <action>
+      <text value="?some-variable" />
+    </action>
+  </rule>
+</template>
+
+

Das obige Template wird ein Inhaltsmodell erstellen, dass eine Reihe von Textknoten zusammen ausführt.

+

Problemlösungen

+

Tipps und Tricks.

+

Meine RDF/XML Datei wird nicht geladen.

+

Der häufigste Grund dafür, dass RDF/XML nicht von einem Webserver geladen werden kann, ist ein falscher MIME Type. Stellen Sie sicher, dass Ihr Server die Datei als text/xml (empfohlen) oder als text/rdf ausliefert.

+

Beachten Sie, dass die W3C RDF Core WG application/rdf+xml registriert hat, aber dies noch nicht von Mozilla verstanden wird.

+

Ein weiteres, mögliches Problem: Für fern-geladenes XUL und RDF müssen Mozillas Sicherheitsbeschränkungen richtig eingestellt werden (siehe unten für Beispielcode). Wenn XUL nicht in Ihr RDF geladen wurde und der Mimetype OK ist, könnte dies Ihr Problem sein.

+

Sie können die rdfcat und rdfpoll Tools verwenden, um sicherzustellen, dass das RDF/XML valide ist. Beide Programme werden unter Windows geladen, wenn Sie configure --enable-tests festgelegt haben.

+ +

Beide Programme sind zu langsam zum Laden und zum Laufen (aber sie werden laufen, letztendlich). Sie initialisieren XPCOM und bringen Necko dazu, die URLs zu laden und auszuführen, so wie es Mozilla tut.

+

Es passiert nichts nachdem ich AddDataSource aufgerufen habe.

+

Beachten Sie, dass der Template-Builder die Inhalte eines Templates nicht automatisch neu aufbaut nachdem AddDataSource oder RemoveDataSource aufgerufen wurden. Um die Inhalte des Templates zu erneuern, müssen Siel elt.builder.rebuild() selbst aufrufen.

+

Warum? Das kommt daher, weil man mehrere Rebuilds verhindern möchte, wenn mehr als eine Datenquelle zur Datenbank hinzugefügt wird.

+

Beispiele

+

Wo kann ich einige (funktionierende) Beispiele finden?

+

Einige Beispiele kann man hier finden. Einige sind in signierten Skripts enthalten und sind über HTTP direkt ausführbar.

+

Siehe auch duplicates.rdf (Live RDF Feed von Mozilla) und duplicates.xul. Beachten Sie, dass sie Mozillas Sicherheitsmodell einhalten müssen. Um das zu tun, fügen Sie die folgende Zeile in Ihre Preferences Datei hinzu. (Schließen Sie Mozilla erst, da sonst die Datei überschrieben wird, wenn Sie Mozilla beenden.)

+
user_pref("signed.applets.codebase_principal_support", true);
+
+

Mozilla wird Sie fragen, ob Sie den Skripten in duplicates.xul Rechte zum Zugang zu XPConnect geben wollen; stimmen Sie dem zu.

+

Aktuell erlaubt Mozilla kein unprivilegierten Zugang zu RDF Schnittstellen und Services; Siehe Bug 122846 für Details.

+

Bitte schicken Sie danbri, mozilla-rdf oder waterson eine Mail mit URLs, wenn Sie weitere Beispiele haben, die wir hier hinzufügen können!

+

Hinweise

+
  1. Siehe auch W3C RDF und Semantic Web für weitere Informationen über RDF und verwandte Technologien.
    2. +
+

Mitwirkende

+ +

Autor: Chris Waterson

+
+

Informationen zum Originaldokument

+ +
+

{{ languages( { "en": "en/RDF_in_Mozilla_FAQ", "es": "es/Preguntas_frecuentes_sobre_RDF_en_Mozilla", "ja": "ja/RDF_in_Mozilla_FAQ", "ko": "ko/RDF_in_Mozilla_FAQ" } ) }}

diff --git a/files/de/archive/web/index.html b/files/de/archive/web/index.html new file mode 100644 index 0000000000..6f60d315ff --- /dev/null +++ b/files/de/archive/web/index.html @@ -0,0 +1,12 @@ +--- +title: Archived open Web documentation +slug: Archive/Web +tags: + - Archived + - NeedsTranslation + - TopicStub + - Web +translation_of: Archive/Web +--- +

The documentation listed below is archived, obsolete material about open Web topics.

+

{{SubpagesWithSummaries}}

diff --git a/files/de/archive/web/javascript/arguments.caller/index.html b/files/de/archive/web/javascript/arguments.caller/index.html new file mode 100644 index 0000000000..f2d9dd90ad --- /dev/null +++ b/files/de/archive/web/javascript/arguments.caller/index.html @@ -0,0 +1,55 @@ +--- +title: arguments.caller +slug: Archive/Web/JavaScript/arguments.caller +tags: + - Functions + - JavaScript + - Obsolete + - Property + - arguments +translation_of: Archive/Web/JavaScript/arguments.caller +--- +
{{jsSidebar("Functions")}}
+ +

{{obsolete_header}}

+ +

Die veraltete Eigenschaft arguments.caller wird genutzt, um die Funktion, die die aktuelle Funktion ausführt, zu ermittelt. Die Eigenschaft wurde entfernt und kann nicht mehr genutzt werden.

+ +

Beschreibung

+ +

Die Eigenschaft ist nicht mehr verfügbar, aber man kann {{jsxref("Function.caller")}} benutzen.

+ +
function whoCalled() {
+   if (whoCalled.caller == null)
+      console.log('I was called from the global scope.');
+   else
+      console.log(whoCalled.caller + ' called me!');
+}
+ +

Beispiele

+ +

Der folgende Quelltext wurde eingesetzt, um den Wert der Eigenschaft arguments.caller zu prüfen, jedoch funktioniert dieses nicht mehr.

+ +
function whoCalled() {
+   if (arguments.caller == null)
+      console.log('I was called from the global scope.');
+   else
+      console.log(arguments.caller + ' called me!');
+}
+
+ +

Spezifikationen

+ +

Wurde in keinem Standard spezifiziert. Wurde in JavaScript 1.1 implementiert und wegen {{bug(7224)}} und potenziellen Sicherheitsrisiken wieder entfernt.

+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.functions.arguments.caller")}}

+ +

Siehe auch

+ + diff --git a/files/de/archive/web/javascript/ecmascript_7_support_in_mozilla/index.html b/files/de/archive/web/javascript/ecmascript_7_support_in_mozilla/index.html new file mode 100644 index 0000000000..302b230c09 --- /dev/null +++ b/files/de/archive/web/javascript/ecmascript_7_support_in_mozilla/index.html @@ -0,0 +1,68 @@ +--- +title: ECMAScript 7 Unterstützung in Mozilla +slug: Archive/Web/JavaScript/ECMAScript_7_support_in_Mozilla +translation_of: Archive/Web/JavaScript/ECMAScript_Next_support_in_Mozilla +--- +
{{jsSidebar("New_in_JS")}}
+ +

ECMAScript 2016 ist die nächste Erweiterung des ECMA-262 Standards. Neue Sprachfeatures sind bereits im Entwurf der 6. Edition vorgeschlagen und nähern sich der Vollendung. Die aktuellen Vorschläge lassen sich unter dem folgenden GitHub Repository ansehen tc39/ecma262.
+ Aktuelle Probleme mit dem Spezifikationsprozess sollen durch die Einführung von Stages und Champions gelöst werden. Außerdem ist ein zweijähriger Release-Zyklus von dem Standard vorgeschlagen.
+
+  Link für weitere Informationen über den post-ES6 Spezifikationsprozess.

+ +

Mailing-Liste zur Diskussion von ECMAScript standards: es-discuss

+ +

Experimentale Features

+ +

Die folgenden Features sind bereits implementiert, jedoch nur zugänglich in Firefox Nightly channel:

+ +

Zusätze zu dem Array Objekt

+ + + +

Zusätze zu dem ArrayBuffer Objekt

+ + + +

Neue TypedObject Objekte

+ + + +

Neue SIMD Objekte

+ + + +

Features mit zunehmender Stabilität

+ +

The following features are supported beyond the Nightly channel, but ongoing specification and implementation work is happening. Features which were originally in the ECMAScript 6 draft and got postponed to ECMAScript 2016 are likely to appear here.

+ +

Ausdrücke

+ + + +

Noch nicht unterstütze Features

+ +

The following features are not yet implemented, but targeted for ECMAScript 2016.

+ + + +

Weiterführend

+ + diff --git a/files/de/archive/web/javascript/index.html b/files/de/archive/web/javascript/index.html new file mode 100644 index 0000000000..4687b7bf23 --- /dev/null +++ b/files/de/archive/web/javascript/index.html @@ -0,0 +1,12 @@ +--- +title: JavaScript +slug: Archive/Web/JavaScript +translation_of: Archive/Web/JavaScript +--- + + +

{{Obsolete_Header}}

+ +

Obsolete JavaScript features and unmaintained docs

+ +

{{SubpagesWithSummaries}}

diff --git a/files/de/archive/web/javascript/legacy_generator_function/index.html b/files/de/archive/web/javascript/legacy_generator_function/index.html new file mode 100644 index 0000000000..8e05b218bd --- /dev/null +++ b/files/de/archive/web/javascript/legacy_generator_function/index.html @@ -0,0 +1,56 @@ +--- +title: Alter Generatorfunktionsausdruck +slug: Archive/Web/JavaScript/Legacy_generator_function +tags: + - JavaScript + - Legacy Iterator + - Reference +translation_of: Archive/Web/JavaScript/Legacy_generator_function +--- +
Der alte Generatorfunktionsausdruck war eine SpiderMonkey spezifische Funktion, welche in Firefox 58+ entfernt wurde. Für zukünftige Verwendung sollte der {{jsxref("Operators/function*", "function* Ausdruck")}} genutzt werden.
+ +
{{jsSidebar("Operators")}}
+ +

Das function Schlüsselwort kann benutzt werden, um eine alte Generatorfunktion in einem Ausdruck zu definieren. Um eine Funktion einen alten Generator zu machen, muss der Funktionskörper mindestens einen {{jsxref("Operators/yield", "yield")}} Ausdruck enthalten.

+ +

Syntax

+ +
function [name]([param1[, param2[, ..., paramN]]]) {
+   statements
+}
+ +

Parameter

+ +
+
name
+
Der Funktionsname. Kann in fällen einer anonymen Funktion weggelassen werden. Der Name ist nur lokal im Funktionskörper verfügbar.
+
paramN
+
Der Name eines Argumentes, welches der Funktion übergeben wird. Eine Funktion kann bis zu 255 Argumente haben.
+
statements
+
Die Statements, welche den Funktionskörper bilden. Diese müssen mindestens ein {{jsxref("Operators/yield", "yield")}} Ausdruck enthalten.
+
+ +

Beschreibung

+ +

Ein Überblick über den Einsatz ist auf der Iteratoren und Generatoren Seite verfügbar.

+ +

Browserkompatibilität

+ +

Kein Support.

+ +

Siehe auch

+ + -- cgit v1.2.3-54-g00ecf