From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- .../api_de_restauration_de_session/index.html | 82 ++ .../index.html" | 50 + .../index.html | 55 + files/fr/archive/add-ons/index.html | 8 + .../index.html" | 71 + .../add-ons/paquetage_multi_extensions/index.html | 78 ++ .../index.html" | 17 + .../index.html" | 299 +++++ files/fr/archive/apps/advanced_topics/index.html | 75 ++ files/fr/archive/apps/index.html | 8 + .../index.html" | 357 +++++ files/fr/archive/b2g_os/add-ons/index.html | 108 ++ files/fr/archive/b2g_os/api/alarm_api/index.html | 184 +++ .../fr/archive/b2g_os/api/api_contacts/index.html | 272 ++++ .../api/bluetoothstatuschangedevent/index.html | 59 + files/fr/archive/b2g_os/api/callevent/index.html | 130 ++ .../archive/b2g_os/api/data_store_api/index.html | 203 +++ .../archive/b2g_os/api/domapplication/index.html | 106 ++ .../archive/b2g_os/api/domrequest/error/index.html | 38 + files/fr/archive/b2g_os/api/domrequest/index.html | 97 ++ .../b2g_os/api/domrequest/onerror/index.html | 74 ++ .../b2g_os/api/domrequest/onsuccess/index.html | 74 ++ .../b2g_os/api/domrequest/readystate/index.html | 77 ++ .../b2g_os/api/domrequest/result/index.html | 76 ++ files/fr/archive/b2g_os/api/index.html | 831 ++++++++++++ files/fr/archive/b2g_os/api/l10n_api/index.html | 52 + .../api/navigator/addidleobserver/index.html | 62 + files/fr/archive/b2g_os/api/navigator/index.html | 25 + .../b2g_os/api/navigator/mozapps/index.html | 90 ++ .../api/navigator/requestwakelock/index.html | 60 + files/fr/archive/b2g_os/api/nfc_api/index.html | 118 ++ files/fr/archive/b2g_os/api/udpsocket/index.html | 66 + .../fr/archive/b2g_os/api/wake_lock_api/index.html | 77 ++ .../index.html | 83 ++ files/fr/archive/b2g_os/api/window/index.html | 25 + .../configurer_marionette/index.html | 48 + .../b2g_os/automated_testing/endurance/index.html | 153 +++ .../automated_testing/gaia-ui-tests/index.html | 74 ++ .../index.html | 129 ++ .../index.html | 120 ++ .../partie_3_tests_reutilisables/index.html | 131 ++ .../index.html | 108 ++ .../index.html | 190 +++ .../partie_6_marionette_classe_by/index.html | 77 ++ .../partie_7_ecrire_vos_propres_tests/index.html | 63 + .../partie_8_utiliser_une_classe_base/index.html | 94 ++ .../gaia-ui-tests/partie_9_objets_app/index.html | 80 ++ .../fr/archive/b2g_os/automated_testing/index.html | 93 ++ .../marionette_pour_python_interactif/index.html | 75 ++ .../b2g_os/automated_testing/mtbf_tests/index.html | 233 ++++ .../b2g_os/automated_testing/reftests/index.html | 191 +++ .../test_execution_chart/index.html | 89 ++ .../automated_testing/tests_cppunit/index.html | 44 + .../archive/b2g_os/b2g_os_architecture/index.html | 38 + files/fr/archive/b2g_os/bluetooth_api/index.html | 223 ++++ .../board_guide/chirimen/chirimen_faq/index.html | 14 + .../archive/b2g_os/board_guide/chirimen/index.html | 123 ++ .../board_guide/chirimen/os_image/index.html | 14 + .../quick_start_guide/basic_startup/index.html | 8 + .../quick_start_guide/board_connectors/index.html | 163 +++ .../quick_start_guide/dev_windows/index.html | 9 + .../firmware_update_guide_for_windows/index.html | 11 + .../chirimen/quick_start_guide/index.html | 26 + files/fr/archive/b2g_os/board_guide/index.html | 35 + .../appareils_compatibles/index.html | 360 +++++ .../b2g_build_variables_reference_sheet/index.html | 261 ++++ .../b2g_installer_add-on/index.html | 284 ++++ .../b2g_os_update_packages/index.html | 534 ++++++++ .../compiler_pour_le_flame_sur_os_x/index.html | 174 +++ .../index.html" | 87 ++ .../construire_anciennes_branches/index.html | 79 ++ .../index.html | 121 ++ .../index.html | 47 + .../index.html" | 153 +++ .../building_b2g_for_qemu_emulator/index.html | 37 + .../building_the_firefox_os_simulator/index.html | 264 ++++ .../choisir_comment_lancer_gaia_ou_b2g/index.html | 80 ++ .../index.html | 8 + .../compiler/compiler_pour_le_fairphone/index.html | 79 ++ .../compiler/fota_community_builds/index.html | 174 +++ files/fr/archive/b2g_os/compiler/index.html | 442 +++++++ .../index.html | 201 +++ .../index.html | 64 + files/fr/archive/b2g_os/debugging/index.html | 79 ++ .../b2g_os/debugging/installer_adb/index.html | 135 ++ .../debugging/journalisation_console/index.html | 25 + .../index.html" | 421 ++++++ .../debugging/personnaliser_b2g.sh/index.html | 46 + .../signaler_une_erreur_firefox_os/index.html | 121 ++ .../\303\251tapes_pr\303\251paratoires/index.html" | 59 + files/fr/archive/b2g_os/depannage/index.html | 60 + .../b2g_os/developer_preview_phone/index.html | 23 + .../b2g_os/developing_firefox_os/index.html | 49 + .../personnalisation_des_dns/index.html | 65 + .../quickstart_guide_to_b2g_development/index.html | 41 + .../rapporter_bug_firefox_os/index.html | 199 +++ .../apporter_modifications_gaia/index.html | 87 ++ .../index.html" | 191 +++ .../comprendre_les_fondements_de_gaia/index.html | 156 +++ .../different_ways_to_run_gaia/index.html | 230 ++++ .../index.html" | 89 ++ .../faire_fonctionner_code_gaia/index.html | 69 + .../gaia_tools_reference/index.html | 191 +++ .../index.html" | 1311 +++++++++++++++++++ files/fr/archive/b2g_os/developing_gaia/index.html | 73 ++ .../localiser_firefox_os/index.html | 132 ++ .../index.html" | 88 ++ .../personnaliser_le_clavier/index.html | 177 +++ .../index.html" | 331 +++++ .../soumettre_correctif_pour_gaia/index.html | 119 ++ .../tester_modifications_gaia/index.html | 119 ++ .../index.html | 110 ++ .../firefox_os_apps/building_blocks/index.html | 195 +++ files/fr/archive/b2g_os/firefox_os_apps/index.html | 84 ++ .../index.html | 173 +++ .../firefox_os_connected-devices_guide/index.html | 35 + .../index.html" | 27 + .../simuler_firefox_os_pour_tv/index.html | 126 ++ .../index.html | 93 ++ files/fr/archive/b2g_os/firefox_os_faq/index.html | 39 + .../b2g_os/firefox_os_usage_tips/index.html | 72 + .../unlocking_your_phone/index.html | 8 + .../archive/b2g_os/gaia_hacking_guide/index.html | 11 + files/fr/archive/b2g_os/index.html | 165 +++ .../installer_sur_un_telephone_mobile/index.html | 97 ++ files/fr/archive/b2g_os/introduction/index.html | 86 ++ files/fr/archive/b2g_os/media_support/index.html | 59 + files/fr/archive/b2g_os/mulet/index.html | 122 ++ files/fr/archive/b2g_os/pandaboard/index.html | 120 ++ .../phone_guide/alcatel_one_touch_fire/index.html | 104 ++ .../alcatel_one_touch_fire_c/index.html | 68 + .../alcatel_one_touch_fire_e/index.html | 97 ++ .../alcatel_one_touch_pixi_3_(3.5)/index.html | 54 + .../alcatel_onetouch_fire_c_4020d/index.html | 64 + .../index.html | 84 ++ .../phone_guide/cherry_mobile_ace/index.html | 118 ++ .../b2g_os/phone_guide/fairphone/index.html | 190 +++ .../firefox_os_device_features/index.html | 76 ++ .../phone_guide/flame/configuration/index.html | 129 ++ .../fr/archive/b2g_os/phone_guide/flame/index.html | 71 + .../flame/mettre_a_jour_flame/index.html | 353 +++++ files/fr/archive/b2g_os/phone_guide/fx0/index.html | 108 ++ .../b2g_os/phone_guide/huawei_y300_ii/index.html | 67 + files/fr/archive/b2g_os/phone_guide/index.html | 89 ++ .../b2g_os/phone_guide/intex_cloud_fx/index.html | 61 + .../b2g_os/phone_guide/lg_fireweb/index.html | 66 + .../archive/b2g_os/phone_guide/nexus_4/index.html | 47 + .../archive/b2g_os/phone_guide/nexus_5/index.html | 46 + .../b2g_os/phone_guide/phone_specs/index.html | 549 ++++++++ .../phone_guide/spice_fire_one_mi_fx1/index.html | 59 + .../phone_guide/spice_fire_one_mi_fx2/index.html | 66 + .../b2g_os/phone_guide/zen_u105_fire/index.html | 60 + .../archive/b2g_os/phone_guide/zte_open/index.html | 305 +++++ .../b2g_os/phone_guide/zte_open_c/index.html | 190 +++ .../b2g_os/phone_guide/zte_open_ii/index.html | 72 + .../b2g_os/platform/apps_architecture/index.html | 37 + .../b2g_os/platform/architecture/index.html | 722 ++++++++++ .../platform/gaia/gaia_apps/browser/index.html | 136 ++ .../b2g_os/platform/gaia/gaia_apps/index.html | 92 ++ .../gaia/gaia_apps/param\303\250tres/index.html" | 112 ++ .../gaia/gaia_apps/syst\303\250me/index.html" | 303 +++++ .../platform/gaia/gaia_apps/video/index.html | 30 + .../b2g_os/platform/gaia/hacking/index.html | 126 ++ files/fr/archive/b2g_os/platform/gaia/index.html | 83 ++ .../platform/gaia/introduction_a_gaia/index.html | 35 + .../index.html" | 74 ++ files/fr/archive/b2g_os/platform/gonk/index.html | 102 ++ files/fr/archive/b2g_os/platform/index.html | 92 ++ .../b2g_os/platform/settings_list/index.html | 717 ++++++++++ .../platform/support_fonctionnalites/index.html | 160 +++ files/fr/archive/b2g_os/portage/index.html | 244 ++++ .../porter_firefox_os/b2g_nexus_player/index.html | 186 +++ .../fr/archive/b2g_os/porter_firefox_os/index.html | 16 + .../portage_sur_cyanogenmod/index.html | 197 +++ .../preparing_for_your_first_b2g_build/index.html | 181 +++ .../index.html | 421 ++++++ files/fr/archive/b2g_os/quickstart/index.html | 32 + .../votre_premier_application/index.html | 261 ++++ files/fr/archive/b2g_os/releases/1.0.1/index.html | 128 ++ files/fr/archive/b2g_os/releases/1.1/index.html | 111 ++ files/fr/archive/b2g_os/releases/2.0/index.html | 111 ++ files/fr/archive/b2g_os/releases/2.1/index.html | 44 + files/fr/archive/b2g_os/releases/2.2/index.html | 125 ++ files/fr/archive/b2g_os/releases/2.5/index.html | 108 ++ files/fr/archive/b2g_os/releases/index.html | 31 + files/fr/archive/b2g_os/resources/index.html | 101 ++ .../index.html | 90 ++ files/fr/archive/b2g_os/samsung_nexus_s/index.html | 61 + .../index.html | 226 ++++ .../securite/application_security/index.html | 224 ++++ files/fr/archive/b2g_os/securite/index.html | 71 + .../index.html | 89 ++ .../b2g_os/securite/security_model/index.html | 396 ++++++ .../b2g_os/securite/system_security/index.html | 449 +++++++ files/fr/archive/b2g_os/simulator/index.html | 112 ++ .../simulator_vs_emulator_vs_device/index.html | 74 ++ files/fr/archive/b2g_os/spark/index.html | 20 + .../faire_des_captures_ecran/index.html | 88 ++ .../modifier_le_fichier_hosts/index.html | 38 + .../b2g_os/using_the_app_manager/index.html | 293 +++++ .../b2g_os/using_the_b2g_emulators/index.html | 151 +++ .../fr/archive/b2g_os/web_telephony_api/index.html | 40 + .../writing_apps_for_boot_to_gecko/index.html | 18 + files/fr/archive/css3/index.html | 14 + files/fr/archive/deviceproximity/index.html | 84 ++ files/fr/archive/index.html | 21 + .../getinstalled/index.html | 37 + .../api/domapplicationsregistry/getself/index.html | 42 + .../api/domapplicationsregistry/index.html | 51 + .../api/domapplicationsregistry/install/index.html | 86 ++ files/fr/archive/marketplace/api/index.html | 38 + files/fr/archive/marketplace/index.html | 56 + files/fr/archive/mdn/index.html | 42 + files/fr/archive/meta_docs/index.html | 30 + .../index.html" | 195 +++ files/fr/archive/misc_top_level/index.html | 8 + .../monitoring_wifi_access_points/index.html | 92 ++ .../index.html | 198 +++ .../index.html" | 38 + files/fr/archive/mozilla/drag_and_drop/index.html | 118 ++ files/fr/archive/mozilla/firefox/index.html | 8 + .../index.html" | 26 + .../soap_dans_les_navigateurs_gecko/index.html | 284 ++++ .../firefox/utilisation_de_microformats/index.html | 197 +++ files/fr/archive/mozilla/index.html | 19 + .../index.html" | 166 +++ .../mozilla/persona/api_de_verification/index.html | 142 ++ .../persona/bootstrapping_persona/index.html | 44 + .../fr/archive/mozilla/persona/branding/index.html | 44 + .../persona/browser_compatibility/index.html | 82 ++ .../persona/considerations_de_securite/index.html | 57 + .../persona/identity_provider_overview/index.html | 59 + files/fr/archive/mozilla/persona/index.html | 195 +++ .../persona/internationalisation/index.html | 50 + .../persona/libraries_and_plugins/index.html | 205 +++ .../mozilla/persona/pourquoi_persona/index.html | 32 + .../archive/mozilla/persona/quick_setup/index.html | 241 ++++ .../index.html | 18 + .../index.html | 12 + .../call_logout()_after_a_failed_login/index.html | 21 + .../persona/the_implementor_s_guide/index.html | 55 + .../index.html | 22 + .../problemes_integrer_protection_crsf/index.html | 21 + .../index.html | 10 + .../the_implementor_s_guide/tester/index.html | 10 + .../persona/vue_densemble_du_protocole/index.html | 61 + .../archive/mozilla/when_to_use_ifdefs/index.html | 28 + files/fr/archive/mozilla/xbl/index.html | 37 + .../r\303\251f\303\251rence_xbl_1.0/index.html" | 106 ++ .../\303\251l\303\251ments/index.html" | 462 +++++++ files/fr/archive/mozilla/xpinstall/index.html | 64 + .../codes_retourn\303\251s/index.html" | 274 ++++ .../exemples/file.macalias/index.html" | 33 + .../exemples/file.windowsshortcut/index.html" | 52 + .../exemples/index.html" | 6 + .../exemples/install.adddirectory/index.html" | 23 + .../exemples/install.addfile/index.html" | 25 + .../installtrigger.installchrome/index.html" | 18 + .../installtrigger.startsoftwareupdate/index.html" | 20 + .../index.html" | 15 + .../exemples/windows_install/index.html" | 112 ++ .../index.html" | 193 +++ .../objet_file/index.html" | 14 + .../objet_file/m\303\251thodes/copy/index.html" | 38 + .../m\303\251thodes/dircreate/index.html" | 36 + .../m\303\251thodes/dirgetparent/index.html" | 34 + .../m\303\251thodes/dirremove/index.html" | 32 + .../m\303\251thodes/dirrename/index.html" | 33 + .../m\303\251thodes/diskspaceavailable/index.html" | 48 + .../objet_file/m\303\251thodes/execute/index.html" | 41 + .../objet_file/m\303\251thodes/exists/index.html" | 33 + .../objet_file/m\303\251thodes/index.html" | 86 ++ .../m\303\251thodes/isdirectory/index.html" | 26 + .../objet_file/m\303\251thodes/isfile/index.html" | 30 + .../m\303\251thodes/macalias/index.html" | 46 + .../objet_file/m\303\251thodes/moddate/index.html" | 31 + .../m\303\251thodes/moddatechanged/index.html" | 54 + .../objet_file/m\303\251thodes/move/index.html" | 46 + .../objet_file/m\303\251thodes/remove/index.html" | 29 + .../objet_file/m\303\251thodes/rename/index.html" | 33 + .../objet_file/m\303\251thodes/size/index.html" | 26 + .../windowsgetshortname/index.html" | 34 + .../windowsregisterserver/index.html" | 30 + .../m\303\251thodes/windowsshortcut/index.html" | 71 + .../objet_install/index.html" | 45 + .../m\303\251thodes/adddirectory/index.html" | 84 ++ .../m\303\251thodes/addfile/index.html" | 103 ++ .../m\303\251thodes/alert/index.html" | 20 + .../m\303\251thodes/cancelinstall/index.html" | 32 + .../m\303\251thodes/confirm/index.html" | 212 +++ .../deleteregisteredfile/index.html" | 40 + .../m\303\251thodes/execute/index.html" | 71 + .../m\303\251thodes/gestalt/index.html" | 29 + .../m\303\251thodes/getcomponentfolder/index.html" | 40 + .../m\303\251thodes/getfolder/index.html" | 127 ++ .../m\303\251thodes/getlasterror/index.html" | 30 + .../m\303\251thodes/getwinprofile/index.html" | 40 + .../m\303\251thodes/getwinregistry/index.html" | 23 + .../objet_install/m\303\251thodes/index.html" | 101 ++ .../m\303\251thodes/initinstall/index.html" | 87 ++ .../m\303\251thodes/loadresources/index.html" | 33 + .../m\303\251thodes/logcomment/index.html" | 28 + .../m\303\251thodes/patch/index.html" | 80 ++ .../m\303\251thodes/performinstall/index.html" | 35 + .../m\303\251thodes/refreshplugins/index.html" | 52 + .../m\303\251thodes/registerchrome/index.html" | 61 + .../m\303\251thodes/reseterror/index.html" | 26 + .../m\303\251thodes/setpackagefolder/index.html" | 33 + .../propri\303\251t\303\251s/index.html" | 38 + .../objet_installtrigger/index.html" | 20 + .../objet_installversion/index.html" | 29 + .../m\303\251thodes/compareto/index.html" | 104 ++ .../m\303\251thodes/index.html" | 26 + .../m\303\251thodes/init/index.html" | 43 + .../m\303\251thodes/tostring/index.html" | 32 + .../propri\303\251t\303\251s/index.html" | 36 + .../objet_winprofile/index.html" | 13 + .../m\303\251thodes/getstring/index.html" | 37 + .../objet_winprofile/m\303\251thodes/index.html" | 22 + .../m\303\251thodes/writestring/index.html" | 41 + .../objet_winreg/index.html" | 19 + .../m\303\251thodes/createkey/index.html" | 32 + .../m\303\251thodes/deletekey/index.html" | 26 + .../m\303\251thodes/deletevalue/index.html" | 30 + .../m\303\251thodes/enumkeys/index.html" | 48 + .../m\303\251thodes/enumvaluenames/index.html" | 39 + .../m\303\251thodes/getvalue/index.html" | 33 + .../m\303\251thodes/getvaluenumber/index.html" | 32 + .../m\303\251thodes/getvaluestring/index.html" | 32 + .../objet_winreg/m\303\251thodes/index.html" | 74 ++ .../m\303\251thodes/iskeywritable/index.html" | 40 + .../m\303\251thodes/keyexists/index.html" | 45 + .../m\303\251thodes/setrootkey/index.html" | 42 + .../m\303\251thodes/setvalue/index.html" | 42 + .../m\303\251thodes/setvaluenumber/index.html" | 36 + .../m\303\251thodes/setvaluestring/index.html" | 36 + .../m\303\251thodes/valueexists/index.html" | 43 + .../objet_winreg/winregvalue/index.html" | 62 + .../mozilla/xul/attributs/acceltext/index.html | 18 + .../mozilla/xul/attributs/accesskey/index.html | 26 + .../archive/mozilla/xul/attributs/align/index.html | 36 + .../mozilla/xul/attributs/allowevents/index.html | 19 + .../attributs/allownegativeassertions/index.html | 17 + .../xul/attributs/buttondisabledaccept/index.html | 18 + .../mozilla/xul/attributs/checked/index.html | 24 + .../archive/mozilla/xul/attributs/class/index.html | 15 + .../xul/attributs/coalesceduplicatearcs/index.html | 17 + .../mozilla/xul/attributs/collapsed/index.html | 17 + .../mozilla/xul/attributs/command/index.html | 23 + .../mozilla/xul/attributs/container/index.html | 17 + .../mozilla/xul/attributs/containment/index.html | 19 + .../mozilla/xul/attributs/context/index.html | 17 + .../mozilla/xul/attributs/contextmenu/index.html | 17 + .../archive/mozilla/xul/attributs/crop/index.html | 26 + .../mozilla/xul/attributs/datasources/index.html | 21 + .../xul/attributs/datepicker.type/index.html | 40 + .../xul/attributs/datepicker.value/index.html | 18 + .../archive/mozilla/xul/attributs/dir/index.html | 32 + .../mozilla/xul/attributs/disabled/index.html | 21 + .../archive/mozilla/xul/attributs/empty/index.html | 15 + .../mozilla/xul/attributs/equalsize/index.html | 18 + .../xul/attributs/firstdayofweek/index.html | 17 + .../archive/mozilla/xul/attributs/flags/index.html | 20 + .../archive/mozilla/xul/attributs/flex/index.html | 14 + .../mozilla/xul/attributs/height/index.html | 15 + .../mozilla/xul/attributs/helpuri/index.html | 18 + .../mozilla/xul/attributs/hidden/index.html | 15 + .../mozilla/xul/attributs/hidechrome/index.html | 15 + .../mozilla/xul/attributs/hideseconds/index.html | 18 + .../fr/archive/mozilla/xul/attributs/id/index.html | 38 + .../archive/mozilla/xul/attributs/image/index.html | 18 + .../mozilla/xul/attributs/increment/index.html | 21 + files/fr/archive/mozilla/xul/attributs/index.html | 281 ++++ .../mozilla/xul/attributs/insertafter/index.html | 17 + .../mozilla/xul/attributs/insertbefore/index.html | 17 + .../mozilla/xul/attributs/instantapply/index.html | 17 + .../mozilla/xul/attributs/inverted/index.html | 17 + .../archive/mozilla/xul/attributs/label/index.html | 33 + .../archive/mozilla/xul/attributs/left/index.html | 15 + .../archive/mozilla/xul/attributs/max/index.html | 21 + .../mozilla/xul/attributs/maxheight/index.html | 15 + .../mozilla/xul/attributs/maxwidth/index.html | 15 + .../archive/mozilla/xul/attributs/menu/index.html | 15 + .../archive/mozilla/xul/attributs/min/index.html | 21 + .../mozilla/xul/attributs/minheight/index.html | 15 + .../mozilla/xul/attributs/minwidth/index.html | 15 + .../mozilla/xul/attributs/mousethrough/index.html | 25 + .../archive/mozilla/xul/attributs/name/index.html | 14 + .../mozilla/xul/attributs/noautofocus/index.html | 17 + .../mozilla/xul/attributs/observes/index.html | 17 + .../mozilla/xul/attributs/onchange/index.html | 17 + .../mozilla/xul/attributs/oncommand/index.html | 21 + .../mozilla/xul/attributs/onpaneload/index.html | 18 + .../mozilla/xul/attributs/onpopuphidden/index.html | 15 + .../mozilla/xul/attributs/onpopuphiding/index.html | 15 + .../xul/attributs/onpopupshowing/index.html | 15 + .../mozilla/xul/attributs/onpopupshown/index.html | 15 + .../archive/mozilla/xul/attributs/open/index.html | 16 + .../mozilla/xul/attributs/ordinal/index.html | 15 + .../mozilla/xul/attributs/orient/index.html | 21 + .../archive/mozilla/xul/attributs/pack/index.html | 22 + .../mozilla/xul/attributs/pageincrement/index.html | 21 + .../mozilla/xul/attributs/persist/index.html | 15 + .../mozilla/xul/attributs/popup.left/index.html | 17 + .../xul/attributs/popup.position/index.html | 30 + .../mozilla/xul/attributs/popup.top/index.html | 17 + .../archive/mozilla/xul/attributs/popup/index.html | 22 + .../mozilla/xul/attributs/position/index.html | 17 + .../xul/attributs/preference-editable/index.html | 16 + .../xul/attributs/preference.name/index.html | 18 + .../xul/attributs/preference.type/index.html | 13 + .../mozilla/xul/attributs/preference/index.html | 15 + .../xul/attributs/prefpane.selected/index.html | 24 + .../mozilla/xul/attributs/prefpane.src/index.html | 25 + .../mozilla/xul/attributs/properties/index.html | 15 + .../mozilla/xul/attributs/querytype/index.html | 15 + .../mozilla/xul/attributs/readonly/index.html | 15 + .../archive/mozilla/xul/attributs/ref/index.html | 15 + .../mozilla/xul/attributs/removeelement/index.html | 17 + .../archive/mozilla/xul/attributs/rows/index.html | 15 + .../mozilla/xul/attributs/screenx/index.html | 15 + .../mozilla/xul/attributs/screeny/index.html | 17 + .../mozilla/xul/attributs/selected/index.html | 19 + .../mozilla/xul/attributs/seltype/index.html | 26 + .../mozilla/xul/attributs/sizemode/index.html | 21 + .../mozilla/xul/attributs/sortdirection/index.html | 21 + .../mozilla/xul/attributs/sortresource/index.html | 17 + .../mozilla/xul/attributs/sortresource2/index.html | 17 + .../archive/mozilla/xul/attributs/src/index.html | 34 + .../mozilla/xul/attributs/statustext/index.html | 39 + .../archive/mozilla/xul/attributs/style/index.html | 15 + .../xul/attributs/suppressonselect/index.html | 22 + .../mozilla/xul/attributs/tabindex/index.html | 15 + .../mozilla/xul/attributs/template/index.html | 15 + .../xul/attributs/timepicker.increment/index.html | 18 + .../xul/attributs/timepicker.value/index.html | 18 + .../archive/mozilla/xul/attributs/title/index.html | 17 + .../mozilla/xul/attributs/tooltip/index.html | 15 + .../mozilla/xul/attributs/tooltiptext/index.html | 15 + .../archive/mozilla/xul/attributs/top/index.html | 17 + .../archive/mozilla/xul/attributs/type/index.html | 21 + .../archive/mozilla/xul/attributs/uri/index.html | 19 + .../archive/mozilla/xul/attributs/value/index.html | 22 + .../mozilla/xul/attributs/wait-cursor/index.html | 15 + .../archive/mozilla/xul/attributs/width/index.html | 30 + .../mozilla/xul/attributs/windowtype/index.html | 17 + files/fr/archive/mozilla/xul/box/index.html | 100 ++ files/fr/archive/mozilla/xul/button/index.html | 287 ++++ .../index.html" | 27 + files/fr/archive/mozilla/xul/checkbox/index.html | 194 +++ files/fr/archive/mozilla/xul/command/index.html | 81 ++ files/fr/archive/mozilla/xul/datepicker/index.html | 231 ++++ .../fr/archive/mozilla/xul/description/index.html | 150 +++ files/fr/archive/mozilla/xul/dropmarker/index.html | 88 ++ .../index.html" | 74 ++ .../mozilla/xul/guide_des_popups/index.html | 69 + .../ouverture_et_fermeture/index.html | 174 +++ .../mozilla/xul/guide_des_popups/panels/index.html | 128 ++ files/fr/archive/mozilla/xul/hbox/index.html | 98 ++ .../ic\303\264nes_de_fen\303\252tre/index.html" | 17 + files/fr/archive/mozilla/xul/index.html | 116 ++ .../xul/introduction_\303\240_xul/index.html" | 46 + files/fr/archive/mozilla/xul/label/index.html | 183 +++ .../xul/les_contr\303\264les_xul/index.html" | 550 ++++++++ .../mozilla/xul/les_joies_de_xul/index.html | 142 ++ files/fr/archive/mozilla/xul/listbox/index.html | 276 ++++ files/fr/archive/mozilla/xul/listitem/index.html | 265 ++++ files/fr/archive/mozilla/xul/menu/index.html | 196 +++ files/fr/archive/mozilla/xul/menubar/index.html | 77 ++ files/fr/archive/mozilla/xul/menuitem/index.html | 293 +++++ files/fr/archive/mozilla/xul/menulist/index.html | 276 ++++ files/fr/archive/mozilla/xul/menupopup/index.html | 229 ++++ .../archive/mozilla/xul/menuseparator/index.html | 242 ++++ .../index.html | 98 ++ .../modifications_xul_pour_firefox_1.5/index.html | 59 + .../mozilla/xul/m\303\251thodes/blur/index.html" | 14 + .../mozilla/xul/m\303\251thodes/click/index.html" | 14 + .../xul/m\303\251thodes/decrease/index.html" | 26 + .../xul/m\303\251thodes/decreasepage/index.html" | 17 + .../xul/m\303\251thodes/docommand/index.html" | 14 + .../mozilla/xul/m\303\251thodes/focus/index.html" | 14 + .../getelementsbyattribute/index.html" | 14 + .../xul/m\303\251thodes/getrowcount/index.html" | 14 + .../xul/m\303\251thodes/hasuservalue/index.html" | 16 + .../xul/m\303\251thodes/hidepopup/index.html" | 15 + .../xul/m\303\251thodes/increase/index.html" | 29 + .../xul/m\303\251thodes/increasepage/index.html" | 17 + .../mozilla/xul/m\303\251thodes/index.html" | 186 +++ .../mozilla/xul/m\303\251thodes/moveto/index.html" | 14 + .../xul/m\303\251thodes/openpopup/index.html" | 21 + .../m\303\251thodes/openpopupatscreen/index.html" | 15 + .../mozilla/xul/m\303\251thodes/reset/index.html" | 17 + .../mozilla/xul/m\303\251thodes/select/index.html" | 16 + .../xul/m\303\251thodes/selectall/index.html" | 14 + .../xul/m\303\251thodes/selectitem/index.html" | 14 + .../m\303\251thodes/selectitemrange/index.html" | 14 + .../m\303\251thodes/setselectionrange/index.html" | 18 + .../xul/m\303\251thodes/showpane/index.html" | 16 + .../xul/m\303\251thodes/showpopup/index.html" | 20 + .../mozilla/xul/m\303\251thodes/sizeto/index.html" | 14 + .../mozilla/xul/m\303\251thodes/stop/index.html" | 19 + .../xul/m\303\251thodes/syncsessions/index.html" | 19 + .../xul/m\303\251thodes/timedselect/index.html" | 14 + .../toggleitemselection/index.html" | 14 + files/fr/archive/mozilla/xul/panel/index.html | 222 ++++ files/fr/archive/mozilla/xul/popup/index.html | 19 + files/fr/archive/mozilla/xul/preference/index.html | 219 ++++ .../fr/archive/mozilla/xul/preferences/index.html | 95 ++ files/fr/archive/mozilla/xul/prefpane/index.html | 135 ++ files/fr/archive/mozilla/xul/prefwindow/index.html | 144 ++ .../accessible/index.html" | 16 + .../accessibletype/index.html" | 58 + .../propri\303\251t\303\251s/accesskey/index.html" | 16 + .../xul/propri\303\251t\303\251s/align/index.html" | 14 + .../allowevents/index.html" | 16 + .../amindicator/index.html" | 16 + .../propri\303\251t\303\251s/boxobject/index.html" | 16 + .../propri\303\251t\303\251s/builder/index.html" | 16 + .../propri\303\251t\303\251s/classname/index.html" | 14 + .../propri\303\251t\303\251s/collapsed/index.html" | 14 + .../contextmenu/index.html" | 14 + .../controllers/index.html" | 14 + .../xul/propri\303\251t\303\251s/crop/index.html" | 14 + .../currentitem/index.html" | 14 + .../propri\303\251t\303\251s/database/index.html" | 14 + .../datasources/index.html" | 14 + .../xul/propri\303\251t\303\251s/date/index.html" | 17 + .../dateleadingzero/index.html" | 17 + .../datepicker.open/index.html" | 17 + .../datepicker.value/index.html" | 17 + .../propri\303\251t\303\251s/datevalue/index.html" | 17 + .../defaultvalue/index.html" | 16 + .../xul/propri\303\251t\303\251s/dir/index.html" | 14 + .../propri\303\251t\303\251s/disabled/index.html" | 14 + .../xul/propri\303\251t\303\251s/flex/index.html" | 16 + .../propri\303\251t\303\251s/height/index.html" | 14 + .../propri\303\251t\303\251s/hidden/index.html" | 14 + .../hideseconds/index.html" | 17 + .../xul/propri\303\251t\303\251s/hour/index.html" | 17 + .../hourleadingzero/index.html" | 17 + .../xul/propri\303\251t\303\251s/id/index.html" | 16 + .../xul/propri\303\251t\303\251s/image/index.html" | 14 + .../propri\303\251t\303\251s/increment/index.html" | 17 + .../xul/propri\303\251t\303\251s/index.html" | 224 ++++ .../propri\303\251t\303\251s/inverted/index.html" | 16 + .../is24hourclock/index.html" | 17 + .../xul/propri\303\251t\303\251s/ispm/index.html" | 17 + .../xul/propri\303\251t\303\251s/label/index.html" | 14 + .../xul/propri\303\251t\303\251s/left/index.html" | 16 + .../listboxobject/index.html" | 14 + .../propri\303\251t\303\251s/locked/index.html" | 16 + .../xul/propri\303\251t\303\251s/max/index.html" | 16 + .../propri\303\251t\303\251s/maxheight/index.html" | 14 + .../propri\303\251t\303\251s/maxwidth/index.html" | 14 + .../xul/propri\303\251t\303\251s/menu/index.html" | 14 + .../xul/propri\303\251t\303\251s/min/index.html" | 16 + .../propri\303\251t\303\251s/minheight/index.html" | 16 + .../propri\303\251t\303\251s/minute/index.html" | 17 + .../minuteleadingzero/index.html" | 17 + .../propri\303\251t\303\251s/minwidth/index.html" | 14 + .../xul/propri\303\251t\303\251s/month/index.html" | 17 + .../monthleadingzero/index.html" | 17 + .../xul/propri\303\251t\303\251s/name/index.html" | 16 + .../propri\303\251t\303\251s/observes/index.html" | 14 + .../xul/propri\303\251t\303\251s/open/index.html" | 14 + .../propri\303\251t\303\251s/ordinal/index.html" | 16 + .../propri\303\251t\303\251s/orient/index.html" | 14 + .../xul/propri\303\251t\303\251s/pack/index.html" | 14 + .../pageincrement/index.html" | 16 + .../propri\303\251t\303\251s/persist/index.html" | 16 + .../pmindicator/index.html" | 17 + .../popupboxobject/index.html" | 14 + .../propri\303\251t\303\251s/position/index.html" | 14 + .../preference.preferences/index.html" | 16 + .../propri\303\251t\303\251s/readonly/index.html" | 21 + .../xul/propri\303\251t\303\251s/ref/index.html" | 14 + .../propri\303\251t\303\251s/resource/index.html" | 14 + .../propri\303\251t\303\251s/second/index.html" | 17 + .../secondleadingzero/index.html" | 17 + .../propri\303\251t\303\251s/selected/index.html" | 14 + .../selectedindex/index.html" | 14 + .../selecteditem/index.html" | 14 + .../propri\303\251t\303\251s/seltype/index.html" | 22 + .../xul/propri\303\251t\303\251s/state/index.html" | 20 + .../statustext/index.html" | 14 + .../xul/propri\303\251t\303\251s/style/index.html" | 14 + .../suppressonselect/index.html" | 20 + .../propri\303\251t\303\251s/tabindex/index.html" | 14 + .../timepicker.value/index.html" | 17 + .../propri\303\251t\303\251s/tooltip/index.html" | 14 + .../tooltiptext/index.html" | 24 + .../xul/propri\303\251t\303\251s/top/index.html" | 16 + .../xul/propri\303\251t\303\251s/type/index.html" | 17 + .../xul/propri\303\251t\303\251s/value/index.html" | 14 + .../xul/propri\303\251t\303\251s/width/index.html" | 16 + .../xul/propri\303\251t\303\251s/year/index.html" | 17 + .../yearleadingzero/index.html" | 17 + .../index.html" | 484 +++++++ .../fr/archive/mozilla/xul/richlistbox/index.html | 268 ++++ .../fr/archive/mozilla/xul/richlistitem/index.html | 128 ++ .../xul/r\303\251f\303\251rence_xul/index.html" | 165 +++ files/fr/archive/mozilla/xul/scale/index.html | 255 ++++ files/fr/archive/mozilla/xul/spacer/index.html | 100 ++ .../fr/archive/mozilla/xul/spinbuttons/index.html | 93 ++ files/fr/archive/mozilla/xul/stack/index.html | 93 ++ files/fr/archive/mozilla/xul/tabpanels/index.html | 126 ++ files/fr/archive/mozilla/xul/textbox/index.html | 348 +++++ files/fr/archive/mozilla/xul/timepicker/index.html | 264 ++++ .../index.html" | 127 ++ files/fr/archive/mozilla/xul/toolbars/index.html | 72 + files/fr/archive/mozilla/xul/toolbox/index.html | 127 ++ files/fr/archive/mozilla/xul/tooltip/index.html | 225 ++++ files/fr/archive/mozilla/xul/tree/index.html | 313 +++++ files/fr/archive/mozilla/xul/treecell/index.html | 83 ++ .../fr/archive/mozilla/xul/treechildren/index.html | 101 ++ files/fr/archive/mozilla/xul/treecol/index.html | 187 +++ files/fr/archive/mozilla/xul/treecols/index.html | 112 ++ files/fr/archive/mozilla/xul/treeitem/index.html | 87 ++ files/fr/archive/mozilla/xul/treerow/index.html | 108 ++ .../archive/mozilla/xul/treeseparator/index.html | 107 ++ .../index.html" | 153 +++ .../index.html" | 139 ++ .../index.html" | 140 ++ .../ajout_de_m\303\251thodes/index.html" | 194 +++ .../ajout_de_propri\303\251t\303\251s/index.html" | 168 +++ .../tutoriel_xul/ajouter_des_boutons/index.html | 106 ++ .../ajouter_des_feuilles_de_style/index.html | 107 ++ .../index.html" | 64 + .../index.html" | 73 ++ .../mozilla/xul/tutoriel_xul/arbres/index.html | 105 ++ .../xul/tutoriel_xul/arbres_et_gabarits/index.html | 93 ++ .../assistant_avan\303\247\303\251/index.html" | 66 + .../index.html" | 109 ++ .../barres_de_d\303\251filement/index.html" | 39 + .../barres_de_menus_simples/index.html | 127 ++ .../index.html" | 103 ++ .../broadcasters_et_observateurs/index.html | 86 ++ .../xul/tutoriel_xul/cadres_de_contenu/index.html | 86 ++ .../index.html" | 76 ++ .../mozilla/xul/tutoriel_xul/commandes/index.html | 119 ++ .../xul/tutoriel_xul/contenu_anonyme/index.html | 214 +++ .../cr\303\251ation_d'un_assistant/index.html" | 141 ++ .../index.html" | 115 ++ .../index.html" | 152 +++ .../cr\303\251er_un_th\303\250me/index.html" | 205 +++ .../cr\303\251er_une_fen\303\252tre/index.html" | 104 ++ .../tutoriel_xul/document_object_model/index.html | 138 ++ .../donn\303\251es_persistantes/index.html" | 51 + .../index.html" | 92 ++ .../index.html" | 298 +++++ .../xul/tutoriel_xul/exemple_xbl/index.html | 205 +++ .../xul/tutoriel_xul/exemples_xpcom/index.html | 157 +++ .../xul/tutoriel_xul/focus_et_selection/index.html | 122 ++ .../index.html | 72 + .../mozilla/xul/tutoriel_xul/gabarits/index.html | 205 +++ .../mozilla/xul/tutoriel_xul/grilles/index.html | 200 +++ .../h\303\251ritage_d'attributs_xbl/index.html" | 100 ++ .../tutoriel_xul/h\303\251ritage_xbl/index.html" | 60 + .../fr/archive/mozilla/xul/tutoriel_xul/index.html | 179 +++ .../indicateurs_de_progression/index.html | 48 + .../xul/tutoriel_xul/interfaces_xpcom/index.html | 190 +++ .../xul/tutoriel_xul/introduction/index.html | 52 + .../introduction_\303\240_rdf/index.html" | 147 +++ .../introduction_\303\240_xbl/index.html" | 78 ++ .../xul/tutoriel_xul/l'url_chrome/index.html | 45 + .../xul/tutoriel_xul/la_structure_xul/index.html | 158 +++ .../le_mod\303\250le_de_bo\303\256te/index.html" | 146 +++ .../les_bo\303\256tes_de_groupe/index.html" | 101 ++ .../tutoriel_xul/les_champs_de_saisie/index.html | 126 ++ .../les_contr\303\264les_de_listes/index.html" | 134 ++ .../index.html" | 63 + .../index.html" | 81 ++ .../tutoriel_xul/les_fichiers_manifest/index.html | 108 ++ .../les_objets_bo\303\256tes/index.html" | 159 +++ .../index.html" | 193 +++ .../les_scripts_d'installation/index.html | 147 +++ .../xul/tutoriel_xul/localisation/index.html | 328 +++++ .../tutoriel_xul/manipulation_de_listes/index.html | 132 ++ .../menus_d\303\251filants/index.html" | 47 + .../xul/tutoriel_xul/menus_surgissants/index.html | 214 +++ .../mise_\303\240_jour_de_commandes/index.html" | 98 ++ .../modification_d'une_interface_xul/index.html | 167 +++ .../index.html" | 50 + .../mozilla/xul/tutoriel_xul/onglets/index.html | 107 ++ .../overlays_inter-paquetage/index.html | 96 ++ .../xul/tutoriel_xul/piles_et_paquets/index.html | 97 ++ .../index.html" | 107 ++ .../index.html" | 93 ++ .../index.html" | 129 ++ .../positionnement_dans_une_pile/index.html | 36 + .../index.html" | 253 ++++ .../xul/tutoriel_xul/raccourcis_clavier/index.html | 377 ++++++ .../index.html" | 213 +++ .../sources_de_donn\303\251es_rdf/index.html" | 296 +++++ .../xul/tutoriel_xul/styler_un_arbre/index.html | 79 ++ .../s\303\251lection_dans_les_arbres/index.html" | 60 + .../tutoriel_xul/s\303\251parateurs/index.html" | 80 ++ .../utilisation_des_spacers/index.html | 143 ++ .../vues_d'arbre_personnalis\303\251es/index.html" | 143 ++ .../xul/utilisation_de_nsixulappinfo/index.html | 109 ++ .../xul/utilisation_de_plusieurs_dtd/index.html | 41 + .../index.html | 36 + files/fr/archive/mozilla/xul/vbox/index.html | 100 ++ .../mozilla/xul/vulgarisation_xul/index.html | 33 + .../xul/vulgarisation_xul/introduction/index.html | 102 ++ .../l'essentiel_d'une_extension/index.html | 412 ++++++ .../index.html | 132 ++ files/fr/archive/mozilla/xul/window/index.html | 179 +++ .../mozilla/xulrunner/astuces_xulrunner/index.html | 164 +++ .../xulrunner/ce_qu'offre_xulrunner/index.html | 67 + .../index.html" | 157 +++ .../empaqueter_une_application_xul/index.html | 74 ++ .../mozilla/xulrunner/faq_de_xulrunner/index.html | 23 + .../index.html" | 79 ++ files/fr/archive/mozilla/xulrunner/index.html | 118 ++ .../index.html | 90 ++ .../notes_de_versions_de_xulrunner_1.9/index.html | 137 ++ .../xulrunner_anciennes_versions/index.html | 26 + files/fr/archive/plugins/reference/index.html | 17 + files/fr/archive/rss/autres_ressources/index.html | 17 + "files/fr/archive/rss/entit\303\251s/index.html" | 1379 ++++++++++++++++++++ files/fr/archive/rss/index.html | 70 + .../premiers_pas/fonctionnement_de_rss/index.html | 21 + files/fr/archive/rss/premiers_pas/index.html | 56 + .../premiers_pas/pourquoi_utiliser_rss/index.html | 28 + .../pr\303\251sentation_de_rss/index.html" | 255 ++++ .../rss/premiers_pas/syndication/index.html | 101 ++ files/fr/archive/rss/version/index.html | 27 + .../archive/rss/\303\251l\303\251ments/index.html" | 80 ++ files/fr/archive/security/index.html | 27 + .../index.html" | 104 ++ .../standards_du_web/communaut\303\251/index.html" | 30 + files/fr/archive/standards_du_web/index.html | 92 ++ .../index.html" | 143 ++ .../le_sniffing_de_doctype_dans_mozilla/index.html | 142 ++ .../index.html" | 73 ++ .../rdf_en_cinquante_mots/index.html | 69 + .../index.html | 35 + .../index.html | 102 ++ files/fr/archive/themes/creer_un_theme/index.html | 268 ++++ files/fr/archive/themes/index.html | 27 + files/fr/archive/web/css/display-inside/index.html | 139 ++ .../fr/archive/web/css/display-outside/index.html | 145 ++ files/fr/archive/web/css/index.html | 10 + files/fr/archive/web/index.html | 19 + files/fr/archive/web/iterator/index.html | 190 +++ .../extensions_microsoft/activexobject/index.html | 96 ++ .../extensions_microsoft/at-cc-on/index.html | 59 + .../extensions_microsoft/at-if/index.html | 78 ++ .../extensions_microsoft/at-set/index.html | 94 ++ .../date.getvardate/index.html | 41 + .../debug/debuggerenabled/index.html | 30 + .../extensions_microsoft/debug/index.html | 140 ++ .../debug/mstraceasynccallbackcompleted/index.html | 26 + .../debug/mstraceasynccallbackstarting/index.html | 71 + .../mstraceasyncoperationcompleted/index.html | 88 ++ .../debug/mstraceasyncoperationstarting/index.html | 26 + .../debug/msupdateasynccallbackrelation/index.html | 71 + .../debug/setnonusercodeexceptions/index.html | 48 + .../extensions_microsoft/debug/write/index.html | 57 + .../extensions_microsoft/debug/writeln/index.html | 56 + .../enumerator/atend/index.html | 62 + .../extensions_microsoft/enumerator/index.html | 98 ++ .../enumerator/item/index.html | 62 + .../enumerator/movefirst/index.html | 66 + .../enumerator/movenext/index.html | 66 + .../error.description/index.html | 64 + .../extensions_microsoft/error.number/index.html | 61 + .../error.stacktracelimit/index.html | 48 + .../extensions_microsoft/getobject/index.html | 78 ++ .../web/javascript/extensions_microsoft/index.html | 68 + .../extensions_microsoft/scriptengine/index.html | 43 + .../scriptenginebuildversion/index.html | 45 + .../scriptenginemajorversion/index.html | 46 + .../scriptengineminorversion/index.html | 46 + .../vbarray/dimensions/index.html | 80 ++ .../vbarray/getitem/index.html | 89 ++ .../extensions_microsoft/vbarray/index.html | 108 ++ .../extensions_microsoft/vbarray/lbound/index.html | 91 ++ .../vbarray/toarray/index.html | 84 ++ .../extensions_microsoft/vbarray/ubound/index.html | 91 ++ .../index.html" | 58 + .../index.html" | 66 + .../web/javascript/handler.enumerate/index.html | 121 ++ files/fr/archive/web/javascript/index.html | 12 + .../web/javascript/reflect.enumerate/index.html | 79 ++ .../support_ecmascript_next_par_mozilla/index.html | 75 ++ .../web/xforms/autres_ressources/index.html | 15 + files/fr/archive/web/xforms/index.html | 96 ++ .../index.html" | 27 + .../r\303\251f\303\251rence_api_xforms/index.html" | 47 + .../index.html" | 25 + .../index.html" | 159 +++ 793 files changed, 68748 insertions(+) create mode 100644 files/fr/archive/add-ons/api_de_restauration_de_session/index.html create mode 100644 "files/fr/archive/add-ons/d\303\251veloppement_de_modules_compl\303\251mentaires/index.html" create mode 100644 files/fr/archive/add-ons/gestion_de_suggestions_dans_les_plugins_de_recherche/index.html create mode 100644 files/fr/archive/add-ons/index.html create mode 100644 "files/fr/archive/add-ons/installation_d_extensions_et_de_th\303\250mes_depuis_une_page_web/index.html" create mode 100644 files/fr/archive/add-ons/paquetage_multi_extensions/index.html create mode 100644 "files/fr/archive/add-ons/t\303\251l\303\251charger_du_json_et_du_javascript_dans_une_extension/index.html" create mode 100644 "files/fr/archive/add-ons/versions_extension,_mise_\303\240_jour_et_compatibilit\303\251/index.html" create mode 100644 files/fr/archive/apps/advanced_topics/index.html create mode 100644 files/fr/archive/apps/index.html create mode 100644 "files/fr/archive/b2g_os/add-ons/d\303\251velopper_des_add-ons_pour_firefox_os/index.html" create mode 100644 files/fr/archive/b2g_os/add-ons/index.html create mode 100644 files/fr/archive/b2g_os/api/alarm_api/index.html create mode 100644 files/fr/archive/b2g_os/api/api_contacts/index.html create mode 100644 files/fr/archive/b2g_os/api/bluetoothstatuschangedevent/index.html create mode 100644 files/fr/archive/b2g_os/api/callevent/index.html create mode 100644 files/fr/archive/b2g_os/api/data_store_api/index.html create mode 100644 files/fr/archive/b2g_os/api/domapplication/index.html create mode 100644 files/fr/archive/b2g_os/api/domrequest/error/index.html create mode 100644 files/fr/archive/b2g_os/api/domrequest/index.html create mode 100644 files/fr/archive/b2g_os/api/domrequest/onerror/index.html create mode 100644 files/fr/archive/b2g_os/api/domrequest/onsuccess/index.html create mode 100644 files/fr/archive/b2g_os/api/domrequest/readystate/index.html create mode 100644 files/fr/archive/b2g_os/api/domrequest/result/index.html create mode 100644 files/fr/archive/b2g_os/api/index.html create mode 100644 files/fr/archive/b2g_os/api/l10n_api/index.html create mode 100644 files/fr/archive/b2g_os/api/navigator/addidleobserver/index.html create mode 100644 files/fr/archive/b2g_os/api/navigator/index.html create mode 100644 files/fr/archive/b2g_os/api/navigator/mozapps/index.html create mode 100644 files/fr/archive/b2g_os/api/navigator/requestwakelock/index.html create mode 100644 files/fr/archive/b2g_os/api/nfc_api/index.html create mode 100644 files/fr/archive/b2g_os/api/udpsocket/index.html create mode 100644 files/fr/archive/b2g_os/api/wake_lock_api/index.html create mode 100644 files/fr/archive/b2g_os/api/wake_lock_api/keeping_the_geolocation_on_when_the_application_is_invisible/index.html create mode 100644 files/fr/archive/b2g_os/api/window/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/configurer_marionette/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/endurance/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_1_marionette_firefox_os_commencer/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_2_marionette_firefox_os_interactions/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_3_tests_reutilisables/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_4_reutiliser_commandes_firefox_os_configuration/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_5_introduction_executeur_tests/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_6_marionette_classe_by/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_7_ecrire_vos_propres_tests/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_8_utiliser_une_classe_base/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_9_objets_app/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/marionette_pour_python_interactif/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/mtbf_tests/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/reftests/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/test_execution_chart/index.html create mode 100644 files/fr/archive/b2g_os/automated_testing/tests_cppunit/index.html create mode 100644 files/fr/archive/b2g_os/b2g_os_architecture/index.html create mode 100644 files/fr/archive/b2g_os/bluetooth_api/index.html create mode 100644 files/fr/archive/b2g_os/board_guide/chirimen/chirimen_faq/index.html create mode 100644 files/fr/archive/b2g_os/board_guide/chirimen/index.html create mode 100644 files/fr/archive/b2g_os/board_guide/chirimen/os_image/index.html create mode 100644 files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/basic_startup/index.html create mode 100644 files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/board_connectors/index.html create mode 100644 files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/dev_windows/index.html create mode 100644 files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/firmware_update_guide_for_windows/index.html create mode 100644 files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/index.html create mode 100644 files/fr/archive/b2g_os/board_guide/index.html create mode 100644 files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/appareils_compatibles/index.html create mode 100644 files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/b2g_build_variables_reference_sheet/index.html create mode 100644 files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/b2g_installer_add-on/index.html create mode 100644 files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/b2g_os_update_packages/index.html create mode 100644 files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/compiler_pour_le_flame_sur_os_x/index.html create mode 100644 "files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/configurer_votre_premi\303\250re_construction/index.html" create mode 100644 files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/construire_anciennes_branches/index.html create mode 100644 files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/index.html create mode 100644 files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/mettre_en_place_un_environnement_de_construction/index.html create mode 100644 "files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/r\303\251sum\303\251_processus_compilation_firefox_os/index.html" create mode 100644 files/fr/archive/b2g_os/building_b2g_for_qemu_emulator/index.html create mode 100644 files/fr/archive/b2g_os/building_the_firefox_os_simulator/index.html create mode 100644 files/fr/archive/b2g_os/choisir_comment_lancer_gaia_ou_b2g/index.html create mode 100644 files/fr/archive/b2g_os/compiler/building_an_engineering_build_like_the_ones_publis/index.html create mode 100644 files/fr/archive/b2g_os/compiler/compiler_pour_le_fairphone/index.html create mode 100644 files/fr/archive/b2g_os/compiler/fota_community_builds/index.html create mode 100644 files/fr/archive/b2g_os/compiler/index.html create mode 100644 files/fr/archive/b2g_os/customisation_avec_le_fichier_.userconfig/index.html create mode 100644 files/fr/archive/b2g_os/debugging/connecting_a_firefox_os_device_to_the_desktop/index.html create mode 100644 files/fr/archive/b2g_os/debugging/index.html create mode 100644 files/fr/archive/b2g_os/debugging/installer_adb/index.html create mode 100644 files/fr/archive/b2g_os/debugging/journalisation_console/index.html create mode 100644 "files/fr/archive/b2g_os/debugging/les_param\303\250tres_d\303\251veloppeurs/index.html" create mode 100644 files/fr/archive/b2g_os/debugging/personnaliser_b2g.sh/index.html create mode 100644 files/fr/archive/b2g_os/debugging/signaler_une_erreur_firefox_os/index.html create mode 100644 "files/fr/archive/b2g_os/debugging/\303\251tapes_pr\303\251paratoires/index.html" create mode 100644 files/fr/archive/b2g_os/depannage/index.html create mode 100644 files/fr/archive/b2g_os/developer_preview_phone/index.html create mode 100644 files/fr/archive/b2g_os/developing_firefox_os/index.html create mode 100644 files/fr/archive/b2g_os/developing_firefox_os/personnalisation_des_dns/index.html create mode 100644 files/fr/archive/b2g_os/developing_firefox_os/quickstart_guide_to_b2g_development/index.html create mode 100644 files/fr/archive/b2g_os/developing_firefox_os/rapporter_bug_firefox_os/index.html create mode 100644 files/fr/archive/b2g_os/developing_gaia/apporter_modifications_gaia/index.html create mode 100644 "files/fr/archive/b2g_os/developing_gaia/bases_syst\303\250me_construction_gaia/index.html" create mode 100644 files/fr/archive/b2g_os/developing_gaia/comprendre_les_fondements_de_gaia/index.html create mode 100644 files/fr/archive/b2g_os/developing_gaia/different_ways_to_run_gaia/index.html create mode 100644 "files/fr/archive/b2g_os/developing_gaia/ex\303\251cuter_des_versions_personnalis\303\251es_dans_webide/index.html" create mode 100644 files/fr/archive/b2g_os/developing_gaia/faire_fonctionner_code_gaia/index.html create mode 100644 files/fr/archive/b2g_os/developing_gaia/gaia_tools_reference/index.html create mode 100644 "files/fr/archive/b2g_os/developing_gaia/guide_version_personnalis\303\251e_gaia/index.html" create mode 100644 files/fr/archive/b2g_os/developing_gaia/index.html create mode 100644 files/fr/archive/b2g_os/developing_gaia/localiser_firefox_os/index.html create mode 100644 "files/fr/archive/b2g_os/developing_gaia/personnalisation_applications_pr\303\251sentes_construction/index.html" create mode 100644 files/fr/archive/b2g_os/developing_gaia/personnaliser_le_clavier/index.html create mode 100644 "files/fr/archive/b2g_os/developing_gaia/r\303\251f\303\251rence_options_make/index.html" create mode 100644 files/fr/archive/b2g_os/developing_gaia/soumettre_correctif_pour_gaia/index.html create mode 100644 files/fr/archive/b2g_os/developing_gaia/tester_modifications_gaia/index.html create mode 100644 files/fr/archive/b2g_os/dual_boot_de_b2g_et_android_sur_sgs2/index.html create mode 100644 files/fr/archive/b2g_os/firefox_os_apps/building_blocks/index.html create mode 100644 files/fr/archive/b2g_os/firefox_os_apps/index.html create mode 100644 files/fr/archive/b2g_os/firefox_os_connected-devices_guide/how_to_get_started_with_tv_apps_development/index.html create mode 100644 files/fr/archive/b2g_os/firefox_os_connected-devices_guide/index.html create mode 100644 "files/fr/archive/b2g_os/firefox_os_connected-devices_guide/interagir_avec_les_t\303\251l\303\251commandes_tv/index.html" create mode 100644 files/fr/archive/b2g_os/firefox_os_connected-devices_guide/simuler_firefox_os_pour_tv/index.html create mode 100644 files/fr/archive/b2g_os/firefox_os_connected-devices_guide/tv_remote_control_button_mapping_to_keyboard/index.html create mode 100644 files/fr/archive/b2g_os/firefox_os_faq/index.html create mode 100644 files/fr/archive/b2g_os/firefox_os_usage_tips/index.html create mode 100644 files/fr/archive/b2g_os/firefox_os_usage_tips/unlocking_your_phone/index.html create mode 100644 files/fr/archive/b2g_os/gaia_hacking_guide/index.html create mode 100644 files/fr/archive/b2g_os/index.html create mode 100644 files/fr/archive/b2g_os/installer_sur_un_telephone_mobile/index.html create mode 100644 files/fr/archive/b2g_os/introduction/index.html create mode 100644 files/fr/archive/b2g_os/media_support/index.html create mode 100644 files/fr/archive/b2g_os/mulet/index.html create mode 100644 files/fr/archive/b2g_os/pandaboard/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/alcatel_one_touch_fire/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/alcatel_one_touch_fire_c/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/alcatel_one_touch_fire_e/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/alcatel_one_touch_pixi_3_(3.5)/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/alcatel_onetouch_fire_c_4020d/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/best_practices_open_reference_devices/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/cherry_mobile_ace/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/fairphone/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/firefox_os_device_features/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/flame/configuration/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/flame/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/flame/mettre_a_jour_flame/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/fx0/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/huawei_y300_ii/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/intex_cloud_fx/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/lg_fireweb/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/nexus_4/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/nexus_5/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/phone_specs/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/spice_fire_one_mi_fx1/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/spice_fire_one_mi_fx2/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/zen_u105_fire/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/zte_open/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/zte_open_c/index.html create mode 100644 files/fr/archive/b2g_os/phone_guide/zte_open_ii/index.html create mode 100644 files/fr/archive/b2g_os/platform/apps_architecture/index.html create mode 100644 files/fr/archive/b2g_os/platform/architecture/index.html create mode 100644 files/fr/archive/b2g_os/platform/gaia/gaia_apps/browser/index.html create mode 100644 files/fr/archive/b2g_os/platform/gaia/gaia_apps/index.html create mode 100644 "files/fr/archive/b2g_os/platform/gaia/gaia_apps/param\303\250tres/index.html" create mode 100644 "files/fr/archive/b2g_os/platform/gaia/gaia_apps/syst\303\250me/index.html" create mode 100644 files/fr/archive/b2g_os/platform/gaia/gaia_apps/video/index.html create mode 100644 files/fr/archive/b2g_os/platform/gaia/hacking/index.html create mode 100644 files/fr/archive/b2g_os/platform/gaia/index.html create mode 100644 files/fr/archive/b2g_os/platform/gaia/introduction_a_gaia/index.html create mode 100644 "files/fr/archive/b2g_os/platform/gestion_de_la_m\303\251moire_dans_firefox_os/index.html" create mode 100644 files/fr/archive/b2g_os/platform/gonk/index.html create mode 100644 files/fr/archive/b2g_os/platform/index.html create mode 100644 files/fr/archive/b2g_os/platform/settings_list/index.html create mode 100644 files/fr/archive/b2g_os/platform/support_fonctionnalites/index.html create mode 100644 files/fr/archive/b2g_os/portage/index.html create mode 100644 files/fr/archive/b2g_os/porter_firefox_os/b2g_nexus_player/index.html create mode 100644 files/fr/archive/b2g_os/porter_firefox_os/index.html create mode 100644 files/fr/archive/b2g_os/porter_firefox_os/portage_sur_cyanogenmod/index.html create mode 100644 files/fr/archive/b2g_os/preparing_for_your_first_b2g_build/index.html create mode 100644 files/fr/archive/b2g_os/prerequis_pour_construire_firefox_os/index.html create mode 100644 files/fr/archive/b2g_os/quickstart/index.html create mode 100644 files/fr/archive/b2g_os/quickstart/votre_premier_application/index.html create mode 100644 files/fr/archive/b2g_os/releases/1.0.1/index.html create mode 100644 files/fr/archive/b2g_os/releases/1.1/index.html create mode 100644 files/fr/archive/b2g_os/releases/2.0/index.html create mode 100644 files/fr/archive/b2g_os/releases/2.1/index.html create mode 100644 files/fr/archive/b2g_os/releases/2.2/index.html create mode 100644 files/fr/archive/b2g_os/releases/2.5/index.html create mode 100644 files/fr/archive/b2g_os/releases/index.html create mode 100644 files/fr/archive/b2g_os/resources/index.html create mode 100644 files/fr/archive/b2g_os/running_tests_on_firefox_os_for_developers/index.html create mode 100644 files/fr/archive/b2g_os/samsung_nexus_s/index.html create mode 100644 files/fr/archive/b2g_os/screencast_series_colon__app_basics_for_firefox_os/index.html create mode 100644 files/fr/archive/b2g_os/securite/application_security/index.html create mode 100644 files/fr/archive/b2g_os/securite/index.html create mode 100644 files/fr/archive/b2g_os/securite/installing_and_updating_applications/index.html create mode 100644 files/fr/archive/b2g_os/securite/security_model/index.html create mode 100644 files/fr/archive/b2g_os/securite/system_security/index.html create mode 100644 files/fr/archive/b2g_os/simulator/index.html create mode 100644 files/fr/archive/b2g_os/simulator_vs_emulator_vs_device/index.html create mode 100644 files/fr/archive/b2g_os/spark/index.html create mode 100644 files/fr/archive/b2g_os/tips_and_tricks/faire_des_captures_ecran/index.html create mode 100644 files/fr/archive/b2g_os/tips_and_tricks/modifier_le_fichier_hosts/index.html create mode 100644 files/fr/archive/b2g_os/using_the_app_manager/index.html create mode 100644 files/fr/archive/b2g_os/using_the_b2g_emulators/index.html create mode 100644 files/fr/archive/b2g_os/web_telephony_api/index.html create mode 100644 files/fr/archive/b2g_os/writing_apps_for_boot_to_gecko/index.html create mode 100644 files/fr/archive/css3/index.html create mode 100644 files/fr/archive/deviceproximity/index.html create mode 100644 files/fr/archive/index.html create mode 100644 files/fr/archive/marketplace/api/domapplicationsregistry/getinstalled/index.html create mode 100644 files/fr/archive/marketplace/api/domapplicationsregistry/getself/index.html create mode 100644 files/fr/archive/marketplace/api/domapplicationsregistry/index.html create mode 100644 files/fr/archive/marketplace/api/domapplicationsregistry/install/index.html create mode 100644 files/fr/archive/marketplace/api/index.html create mode 100644 files/fr/archive/marketplace/index.html create mode 100644 files/fr/archive/mdn/index.html create mode 100644 files/fr/archive/meta_docs/index.html create mode 100644 "files/fr/archive/misc_top_level/images,_tableaux_et_d\303\251calages_myst\303\251rieux/index.html" create mode 100644 files/fr/archive/misc_top_level/index.html create mode 100644 files/fr/archive/misc_top_level/monitoring_wifi_access_points/index.html create mode 100644 files/fr/archive/misc_top_level/utilisation_de_data_islands_xml_dans_mozilla/index.html create mode 100644 "files/fr/archive/misc_top_level/utilisation_des_pr\303\251f\303\251rences_de_contenu/index.html" create mode 100644 files/fr/archive/mozilla/drag_and_drop/index.html create mode 100644 files/fr/archive/mozilla/firefox/index.html create mode 100644 "files/fr/archive/mozilla/firefox/les_\303\251tats_de_contenu_et_le_syst\303\250me_de_style/index.html" create mode 100644 files/fr/archive/mozilla/firefox/soap_dans_les_navigateurs_gecko/index.html create mode 100644 files/fr/archive/mozilla/firefox/utilisation_de_microformats/index.html create mode 100644 files/fr/archive/mozilla/index.html create mode 100644 "files/fr/archive/mozilla/nouveau_mod\303\250le_de_s\303\251curit\303\251_des_services_web/index.html" create mode 100644 files/fr/archive/mozilla/persona/api_de_verification/index.html create mode 100644 files/fr/archive/mozilla/persona/bootstrapping_persona/index.html create mode 100644 files/fr/archive/mozilla/persona/branding/index.html create mode 100644 files/fr/archive/mozilla/persona/browser_compatibility/index.html create mode 100644 files/fr/archive/mozilla/persona/considerations_de_securite/index.html create mode 100644 files/fr/archive/mozilla/persona/identity_provider_overview/index.html create mode 100644 files/fr/archive/mozilla/persona/index.html create mode 100644 files/fr/archive/mozilla/persona/internationalisation/index.html create mode 100644 files/fr/archive/mozilla/persona/libraries_and_plugins/index.html create mode 100644 files/fr/archive/mozilla/persona/pourquoi_persona/index.html create mode 100644 files/fr/archive/mozilla/persona/quick_setup/index.html create mode 100644 files/fr/archive/mozilla/persona/the_implementor_s_guide/ajouter_adresse_email_supplementaire_avec_persona/index.html create mode 100644 files/fr/archive/mozilla/persona/the_implementor_s_guide/appeler_request()_seulement_depuis_gestionnaire_clic/index.html create mode 100644 files/fr/archive/mozilla/persona/the_implementor_s_guide/call_logout()_after_a_failed_login/index.html create mode 100644 files/fr/archive/mozilla/persona/the_implementor_s_guide/index.html create mode 100644 files/fr/archive/mozilla/persona/the_implementor_s_guide/permettre_utilisateurs_changer_adresse_email/index.html create mode 100644 files/fr/archive/mozilla/persona/the_implementor_s_guide/problemes_integrer_protection_crsf/index.html create mode 100644 files/fr/archive/mozilla/persona/the_implementor_s_guide/supporter_utilisateurs_sans_javascript/index.html create mode 100644 files/fr/archive/mozilla/persona/the_implementor_s_guide/tester/index.html create mode 100644 files/fr/archive/mozilla/persona/vue_densemble_du_protocole/index.html create mode 100644 files/fr/archive/mozilla/when_to_use_ifdefs/index.html create mode 100644 files/fr/archive/mozilla/xbl/index.html create mode 100644 "files/fr/archive/mozilla/xbl/r\303\251f\303\251rence_xbl_1.0/index.html" create mode 100644 "files/fr/archive/mozilla/xbl/r\303\251f\303\251rence_xbl_1.0/\303\251l\303\251ments/index.html" create mode 100644 files/fr/archive/mozilla/xpinstall/index.html create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/codes_retourn\303\251s/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/file.macalias/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/file.windowsshortcut/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/install.adddirectory/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/install.addfile/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/installtrigger.installchrome/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/installtrigger.startsoftwareupdate/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/scripts_de_d\303\251clenchement_et_scripts_d'installation/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/windows_install/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/copy/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/dircreate/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/dirgetparent/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/dirremove/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/dirrename/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/diskspaceavailable/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/execute/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/exists/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/isdirectory/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/isfile/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/macalias/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/moddate/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/moddatechanged/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/move/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/remove/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/rename/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/size/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/windowsgetshortname/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/windowsregisterserver/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/windowsshortcut/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/adddirectory/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/addfile/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/alert/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/cancelinstall/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/confirm/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/deleteregisteredfile/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/execute/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/gestalt/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getcomponentfolder/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getfolder/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getlasterror/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getwinprofile/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getwinregistry/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/initinstall/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/loadresources/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/logcomment/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/patch/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/performinstall/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/refreshplugins/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/registerchrome/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/reseterror/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/setpackagefolder/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/propri\303\251t\303\251s/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installtrigger/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/m\303\251thodes/compareto/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/m\303\251thodes/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/m\303\251thodes/init/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/m\303\251thodes/tostring/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/propri\303\251t\303\251s/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winprofile/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winprofile/m\303\251thodes/getstring/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winprofile/m\303\251thodes/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winprofile/m\303\251thodes/writestring/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/createkey/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/deletekey/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/deletevalue/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/enumkeys/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/enumvaluenames/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/getvalue/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/getvaluenumber/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/getvaluestring/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/iskeywritable/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/keyexists/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/setrootkey/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/setvalue/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/setvaluenumber/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/setvaluestring/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/valueexists/index.html" create mode 100644 "files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/winregvalue/index.html" create mode 100644 files/fr/archive/mozilla/xul/attributs/acceltext/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/accesskey/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/align/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/allowevents/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/allownegativeassertions/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/buttondisabledaccept/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/checked/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/class/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/coalesceduplicatearcs/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/collapsed/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/command/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/container/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/containment/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/context/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/contextmenu/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/crop/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/datasources/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/datepicker.type/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/datepicker.value/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/dir/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/disabled/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/empty/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/equalsize/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/firstdayofweek/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/flags/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/flex/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/height/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/helpuri/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/hidden/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/hidechrome/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/hideseconds/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/id/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/image/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/increment/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/insertafter/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/insertbefore/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/instantapply/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/inverted/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/label/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/left/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/max/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/maxheight/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/maxwidth/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/menu/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/min/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/minheight/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/minwidth/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/mousethrough/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/name/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/noautofocus/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/observes/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/onchange/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/oncommand/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/onpaneload/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/onpopuphidden/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/onpopuphiding/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/onpopupshowing/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/onpopupshown/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/open/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/ordinal/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/orient/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/pack/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/pageincrement/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/persist/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/popup.left/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/popup.position/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/popup.top/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/popup/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/position/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/preference-editable/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/preference.name/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/preference.type/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/preference/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/prefpane.selected/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/prefpane.src/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/properties/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/querytype/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/readonly/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/ref/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/removeelement/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/rows/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/screenx/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/screeny/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/selected/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/seltype/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/sizemode/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/sortdirection/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/sortresource/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/sortresource2/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/src/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/statustext/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/style/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/suppressonselect/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/tabindex/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/template/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/timepicker.increment/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/timepicker.value/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/title/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/tooltip/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/tooltiptext/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/top/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/type/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/uri/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/value/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/wait-cursor/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/width/index.html create mode 100644 files/fr/archive/mozilla/xul/attributs/windowtype/index.html create mode 100644 files/fr/archive/mozilla/xul/box/index.html create mode 100644 files/fr/archive/mozilla/xul/button/index.html create mode 100644 "files/fr/archive/mozilla/xul/caract\303\250res_internationaux_dans_du_javascript_xul/index.html" create mode 100644 files/fr/archive/mozilla/xul/checkbox/index.html create mode 100644 files/fr/archive/mozilla/xul/command/index.html create mode 100644 files/fr/archive/mozilla/xul/datepicker/index.html create mode 100644 files/fr/archive/mozilla/xul/description/index.html create mode 100644 files/fr/archive/mozilla/xul/dropmarker/index.html create mode 100644 "files/fr/archive/mozilla/xul/faq_et_r\303\250gles_pour_les_accesskeys_en_xul/index.html" create mode 100644 files/fr/archive/mozilla/xul/guide_des_popups/index.html create mode 100644 files/fr/archive/mozilla/xul/guide_des_popups/ouverture_et_fermeture/index.html create mode 100644 files/fr/archive/mozilla/xul/guide_des_popups/panels/index.html create mode 100644 files/fr/archive/mozilla/xul/hbox/index.html create mode 100644 "files/fr/archive/mozilla/xul/ic\303\264nes_de_fen\303\252tre/index.html" create mode 100644 files/fr/archive/mozilla/xul/index.html create mode 100644 "files/fr/archive/mozilla/xul/introduction_\303\240_xul/index.html" create mode 100644 files/fr/archive/mozilla/xul/label/index.html create mode 100644 "files/fr/archive/mozilla/xul/les_contr\303\264les_xul/index.html" create mode 100644 files/fr/archive/mozilla/xul/les_joies_de_xul/index.html create mode 100644 files/fr/archive/mozilla/xul/listbox/index.html create mode 100644 files/fr/archive/mozilla/xul/listitem/index.html create mode 100644 files/fr/archive/mozilla/xul/menu/index.html create mode 100644 files/fr/archive/mozilla/xul/menubar/index.html create mode 100644 files/fr/archive/mozilla/xul/menuitem/index.html create mode 100644 files/fr/archive/mozilla/xul/menulist/index.html create mode 100644 files/fr/archive/mozilla/xul/menupopup/index.html create mode 100644 files/fr/archive/mozilla/xul/menuseparator/index.html create mode 100644 files/fr/archive/mozilla/xul/modification_dynamique_d'interfaces_utilisateur_en_xul/index.html create mode 100644 files/fr/archive/mozilla/xul/modifications_xul_pour_firefox_1.5/index.html create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/blur/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/click/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/decrease/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/decreasepage/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/docommand/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/focus/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/getelementsbyattribute/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/getrowcount/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/hasuservalue/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/hidepopup/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/increase/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/increasepage/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/moveto/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/openpopup/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/openpopupatscreen/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/reset/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/select/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/selectall/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/selectitem/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/selectitemrange/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/setselectionrange/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/showpane/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/showpopup/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/sizeto/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/stop/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/syncsessions/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/timedselect/index.html" create mode 100644 "files/fr/archive/mozilla/xul/m\303\251thodes/toggleitemselection/index.html" create mode 100644 files/fr/archive/mozilla/xul/panel/index.html create mode 100644 files/fr/archive/mozilla/xul/popup/index.html create mode 100644 files/fr/archive/mozilla/xul/preference/index.html create mode 100644 files/fr/archive/mozilla/xul/preferences/index.html create mode 100644 files/fr/archive/mozilla/xul/prefpane/index.html create mode 100644 files/fr/archive/mozilla/xul/prefwindow/index.html create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/accessible/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/accessibletype/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/accesskey/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/align/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/allowevents/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/amindicator/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/boxobject/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/builder/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/classname/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/collapsed/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/contextmenu/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/controllers/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/crop/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/currentitem/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/database/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/datasources/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/date/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/dateleadingzero/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/datepicker.open/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/datepicker.value/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/datevalue/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/defaultvalue/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/dir/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/disabled/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/flex/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/height/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/hidden/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/hideseconds/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/hour/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/hourleadingzero/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/id/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/image/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/increment/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/inverted/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/is24hourclock/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/ispm/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/label/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/left/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/listboxobject/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/locked/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/max/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/maxheight/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/maxwidth/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/menu/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/min/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/minheight/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/minute/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/minuteleadingzero/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/minwidth/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/month/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/monthleadingzero/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/name/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/observes/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/open/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/ordinal/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/orient/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/pack/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/pageincrement/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/persist/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/pmindicator/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/popupboxobject/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/position/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/preference.preferences/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/readonly/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/ref/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/resource/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/second/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/secondleadingzero/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/selected/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/selectedindex/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/selecteditem/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/seltype/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/state/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/statustext/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/style/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/suppressonselect/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/tabindex/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/timepicker.value/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/tooltip/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/tooltiptext/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/top/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/type/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/value/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/width/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/year/index.html" create mode 100644 "files/fr/archive/mozilla/xul/propri\303\251t\303\251s/yearleadingzero/index.html" create mode 100644 "files/fr/archive/mozilla/xul/recommandations_accessibilit\303\251_pour_xul/index.html" create mode 100644 files/fr/archive/mozilla/xul/richlistbox/index.html create mode 100644 files/fr/archive/mozilla/xul/richlistitem/index.html create mode 100644 "files/fr/archive/mozilla/xul/r\303\251f\303\251rence_xul/index.html" create mode 100644 files/fr/archive/mozilla/xul/scale/index.html create mode 100644 files/fr/archive/mozilla/xul/spacer/index.html create mode 100644 files/fr/archive/mozilla/xul/spinbuttons/index.html create mode 100644 files/fr/archive/mozilla/xul/stack/index.html create mode 100644 files/fr/archive/mozilla/xul/tabpanels/index.html create mode 100644 files/fr/archive/mozilla/xul/textbox/index.html create mode 100644 files/fr/archive/mozilla/xul/timepicker/index.html create mode 100644 "files/fr/archive/mozilla/xul/toolbars/cr\303\251ation_de_boutons_de_barre_d'outils/index.html" create mode 100644 files/fr/archive/mozilla/xul/toolbars/index.html create mode 100644 files/fr/archive/mozilla/xul/toolbox/index.html create mode 100644 files/fr/archive/mozilla/xul/tooltip/index.html create mode 100644 files/fr/archive/mozilla/xul/tree/index.html create mode 100644 files/fr/archive/mozilla/xul/treecell/index.html create mode 100644 files/fr/archive/mozilla/xul/treechildren/index.html create mode 100644 files/fr/archive/mozilla/xul/treecol/index.html create mode 100644 files/fr/archive/mozilla/xul/treecols/index.html create mode 100644 files/fr/archive/mozilla/xul/treeitem/index.html create mode 100644 files/fr/archive/mozilla/xul/treerow/index.html create mode 100644 files/fr/archive/mozilla/xul/treeseparator/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/ajout_d'\303\251l\303\251ments_html/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/ajout_de_gestionnaire_d_\303\251v\303\250nements/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/ajout_de_gestionnaires_d'\303\251v\303\250nements/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/ajout_de_m\303\251thodes/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/ajout_de_propri\303\251t\303\251s/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/ajouter_des_boutons/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/ajouter_des_feuilles_de_style/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/ajouter_des_libell\303\251s_et_des_images/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/ajouter_plus_d'\303\251l\303\251ments/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/arbres/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/arbres_et_gabarits/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/assistant_avan\303\247\303\251/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/autres_caract\303\251ristiques_des_arbres/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/barres_de_d\303\251filement/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/barres_de_menus_simples/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/bo\303\256te_de_dialogue_de_fichier/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/broadcasters_et_observateurs/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/cadres_de_contenu/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/caract\303\251ristiques_d'une_fen\303\252tre/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/commandes/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/contenu_anonyme/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251ation_d'un_assistant/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251ation_d'un_programme_d'installation/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251er_des_bo\303\256tes_de_dialogue/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251er_un_th\303\250me/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251er_une_fen\303\252tre/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/document_object_model/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/donn\303\251es_persistantes/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/d\303\251tails_sur_le_mod\303\250le_de_bo\303\256te/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/d\303\251tails_sur_les_vues_d'arbres/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/exemple_xbl/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/exemples_xpcom/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/focus_et_selection/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/fonctions_additionnelles_d'installation/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/gabarits/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/grilles/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/h\303\251ritage_d'attributs_xbl/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/h\303\251ritage_xbl/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/indicateurs_de_progression/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/interfaces_xpcom/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/introduction/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/introduction_\303\240_rdf/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/introduction_\303\240_xbl/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/l'url_chrome/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/la_structure_xul/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/le_mod\303\250le_de_bo\303\256te/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/les_bo\303\256tes_de_groupe/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/les_champs_de_saisie/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/les_contr\303\264les_de_listes/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/les_contr\303\264les_num\303\251riques/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/les_fichiers_de_propri\303\251t\303\251s/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/les_fichiers_manifest/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/les_objets_bo\303\256tes/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/les_objets_bo\303\256tes_des_arbres/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/les_scripts_d'installation/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/localisation/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/manipulation_de_listes/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/menus_d\303\251filants/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/menus_surgissants/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/mise_\303\240_jour_de_commandes/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/modification_d'une_interface_xul/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/modification_du_th\303\250me_par_d\303\251faut/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/onglets/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/overlays_inter-paquetage/index.html create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/piles_et_paquets/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/plus_de_caract\303\251ristiques_sur_les_boutons/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/plus_de_fonctionnalit\303\251s_de_menu/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/plus_sur_les_gestionnaires_d'\303\251v\303\250nements/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/positionnement_dans_une_pile/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/positionnement_des_\303\251l\303\251ments/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/raccourcis_clavier/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/r\303\250gles_avan\303\247\303\251es/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/sources_de_donn\303\251es_rdf/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/styler_un_arbre/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/s\303\251lection_dans_les_arbres/index.html" create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/s\303\251parateurs/index.html" create mode 100644 files/fr/archive/mozilla/xul/tutoriel_xul/utilisation_des_spacers/index.html create mode 100644 "files/fr/archive/mozilla/xul/tutoriel_xul/vues_d'arbre_personnalis\303\251es/index.html" create mode 100644 files/fr/archive/mozilla/xul/utilisation_de_nsixulappinfo/index.html create mode 100644 files/fr/archive/mozilla/xul/utilisation_de_plusieurs_dtd/index.html create mode 100644 files/fr/archive/mozilla/xul/utilisation_du_correcteur_orthographique_dans_xul/index.html create mode 100644 files/fr/archive/mozilla/xul/vbox/index.html create mode 100644 files/fr/archive/mozilla/xul/vulgarisation_xul/index.html create mode 100644 files/fr/archive/mozilla/xul/vulgarisation_xul/introduction/index.html create mode 100644 files/fr/archive/mozilla/xul/vulgarisation_xul/l'essentiel_d'une_extension/index.html create mode 100644 files/fr/archive/mozilla/xul/vulgarisation_xul/premiers_pas_avec_les_extensions_firefox/index.html create mode 100644 files/fr/archive/mozilla/xul/window/index.html create mode 100644 files/fr/archive/mozilla/xulrunner/astuces_xulrunner/index.html create mode 100644 files/fr/archive/mozilla/xulrunner/ce_qu'offre_xulrunner/index.html create mode 100644 "files/fr/archive/mozilla/xulrunner/d\303\251ploiement_de_xulrunner_1.8/index.html" create mode 100644 files/fr/archive/mozilla/xulrunner/empaqueter_une_application_xul/index.html create mode 100644 files/fr/archive/mozilla/xulrunner/faq_de_xulrunner/index.html create mode 100644 "files/fr/archive/mozilla/xulrunner/floril\303\250ge_des_applications_xulrunner/index.html" create mode 100644 files/fr/archive/mozilla/xulrunner/index.html create mode 100644 files/fr/archive/mozilla/xulrunner/notes_de_versions_de_xulrunner_1.8.0.4/index.html create mode 100644 files/fr/archive/mozilla/xulrunner/notes_de_versions_de_xulrunner_1.9/index.html create mode 100644 files/fr/archive/mozilla/xulrunner/xulrunner_anciennes_versions/index.html create mode 100644 files/fr/archive/plugins/reference/index.html create mode 100644 files/fr/archive/rss/autres_ressources/index.html create mode 100644 "files/fr/archive/rss/entit\303\251s/index.html" create mode 100644 files/fr/archive/rss/index.html create mode 100644 files/fr/archive/rss/premiers_pas/fonctionnement_de_rss/index.html create mode 100644 files/fr/archive/rss/premiers_pas/index.html create mode 100644 files/fr/archive/rss/premiers_pas/pourquoi_utiliser_rss/index.html create mode 100644 "files/fr/archive/rss/premiers_pas/pr\303\251sentation_de_rss/index.html" create mode 100644 files/fr/archive/rss/premiers_pas/syndication/index.html create mode 100644 files/fr/archive/rss/version/index.html create mode 100644 "files/fr/archive/rss/\303\251l\303\251ments/index.html" create mode 100644 files/fr/archive/security/index.html create mode 100644 "files/fr/archive/standards_du_web/choisir_de_se_conformer_aux_standards_plut\303\264t_qu_aux_pratiques_propri\303\251taires/index.html" create mode 100644 "files/fr/archive/standards_du_web/communaut\303\251/index.html" create mode 100644 files/fr/archive/standards_du_web/index.html create mode 100644 "files/fr/archive/standards_du_web/le_mod\303\250le_\303\251conomique_des_standards_web/index.html" create mode 100644 files/fr/archive/standards_du_web/le_sniffing_de_doctype_dans_mozilla/index.html create mode 100644 "files/fr/archive/standards_du_web/probl\303\250mes_soulev\303\251s_par_le_pseudo_\303\251l\303\251ment_hover/index.html" create mode 100644 files/fr/archive/standards_du_web/rdf_en_cinquante_mots/index.html create mode 100644 files/fr/archive/standards_du_web/utiliser_des_titres_corrects_avec_des_feuilles_de_styles_externes/index.html create mode 100644 files/fr/archive/themes/create_your_own_firefox_background_theme/index.html create mode 100644 files/fr/archive/themes/creer_un_theme/index.html create mode 100644 files/fr/archive/themes/index.html create mode 100644 files/fr/archive/web/css/display-inside/index.html create mode 100644 files/fr/archive/web/css/display-outside/index.html create mode 100644 files/fr/archive/web/css/index.html create mode 100644 files/fr/archive/web/index.html create mode 100644 files/fr/archive/web/iterator/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/activexobject/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/at-cc-on/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/at-if/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/at-set/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/date.getvardate/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/debug/debuggerenabled/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/debug/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/debug/mstraceasynccallbackcompleted/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/debug/mstraceasynccallbackstarting/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/debug/mstraceasyncoperationcompleted/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/debug/mstraceasyncoperationstarting/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/debug/msupdateasynccallbackrelation/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/debug/setnonusercodeexceptions/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/debug/write/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/debug/writeln/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/enumerator/atend/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/enumerator/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/enumerator/item/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/enumerator/movefirst/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/enumerator/movenext/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/error.description/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/error.number/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/error.stacktracelimit/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/getobject/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/scriptengine/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/scriptenginebuildversion/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/scriptenginemajorversion/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/scriptengineminorversion/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/vbarray/dimensions/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/vbarray/getitem/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/vbarray/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/vbarray/lbound/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/vbarray/toarray/index.html create mode 100644 files/fr/archive/web/javascript/extensions_microsoft/vbarray/ubound/index.html create mode 100644 "files/fr/archive/web/javascript/fonction_g\303\251n\303\251ratrice_historique/index.html" create mode 100644 "files/fr/archive/web/javascript/fonction_g\303\251n\303\251ratrice_historique_statement/index.html" create mode 100644 files/fr/archive/web/javascript/handler.enumerate/index.html create mode 100644 files/fr/archive/web/javascript/index.html create mode 100644 files/fr/archive/web/javascript/reflect.enumerate/index.html create mode 100644 files/fr/archive/web/javascript/support_ecmascript_next_par_mozilla/index.html create mode 100644 files/fr/archive/web/xforms/autres_ressources/index.html create mode 100644 files/fr/archive/web/xforms/index.html create mode 100644 "files/fr/archive/web/xforms/pr\303\251f\303\251rences_utilisateur/index.html" create mode 100644 "files/fr/archive/web/xforms/r\303\251f\303\251rence_api_xforms/index.html" create mode 100644 "files/fr/archive/web/xforms/r\303\251solution_des_probl\303\250mes_avec_xforms/index.html" create mode 100644 "files/fr/archive/web/xforms/\303\251l\303\251ment_interface_utilisateur_xforms/index.html" (limited to 'files/fr/archive') diff --git a/files/fr/archive/add-ons/api_de_restauration_de_session/index.html b/files/fr/archive/add-ons/api_de_restauration_de_session/index.html new file mode 100644 index 0000000000..dfae935362 --- /dev/null +++ b/files/fr/archive/add-ons/api_de_restauration_de_session/index.html @@ -0,0 +1,82 @@ +--- +title: API de restauration de session +slug: Archive/Add-ons/API_de_restauration_de_session +tags: + - Extensions +translation_of: Archive/Add-ons/Session_store_API +--- +

Firefox 2 introduit la sauvegarde de session, une nouvelle fonctionnalité qui permet aux extensions de sauvegarder et restaurer des données entre différentes sessions de Firefox. Une API simple permet aux extensions d'accéder à cette fonctionnalité. +

Un des cas où l'utilisation de cette fonctionnalité peut être cruciale pour une extension est que Firefox 2 permet à l'utilisateur d'annuler la fermeture des onglets. Pour récupérer proprement l'état de votre extension lorsqu'un onglet est restauré, celle-ci doit utiliser la méthode setTabValue() de l'API de sauvegarde de session pour enregistrer toutes les données devant pouvoir être restaurées par la suite, puis appeler la méthode getTabValue() pour récupérer ces données lorsque l'onglet est restauré. +

L'API de sauvegarde de session est implémentée en utilisant l'interface nsISessionStore. +

+

Savoir quand restaurer

+

Chaque fois que Firefox est sur le point de restaurer un onglet, un événement de type SSTabRestoring est généré. Si votre extension doit pouvoir restaurer des données lorsqu'un onglet est récupéré, vous pouvez mettre en place un listener comme ceci : +

+
function myExtensionHandleRestore(aEvent) {
+  Components.classes["@mozilla.org/consoleservice;1"].
+             getService(Components.interfaces.nsIConsoleService).
+             logStringMessage("Restauration d'onglets");
+};
+
+document.addEventListener("SSTabRestoring", myExtensionHandleRestore, false);
+
+

Il vous suffit de remplacer le contenu de la fonction myExtensionHandleRestore() avec vos propres actions à effectuer lorsque l'onglet est récupéré. Dans cet exemple, l'interface nsIConsoleService sert à afficher un message dans la console JavaScript. +

Cet événement est généré juste avant que l'onglet ne soit récupéré. Un événement de type SSTabRestored est déclenché à chaque fois qu'un onglet a fini d'être récupéré. +

+

Le processus de restauration de session

+

La séquence exacte d'événements qui surviennent lorsqu'une session est en cours de restauration est la suivante : +

+
  1. Un état de session est sur le point d'être restauré. Cela peut se faire au démarrage ou en réponse à une annulation de fermeture d'onglet, puisque les sessions d'onglets fermés sont récupérées onglet par onglet. +
  2. De nouvelles fenêtres sont ouvertes si nécessaire (une pour chaque fenêtre qui a été sauvegardée dans l'enregistrement de session), les cookies et la liste des onglets récemment fermés sont restaurés. +
+

Ensuite, les étapes suivantes sont lancées pour chaque onglet récupéré : +

+
  1. Soit un onglet existant est réutilisé, soit un nouvel onglet est créé. Dans ce dernier cas, un événement TabOpen est généré. +
  2. Les attributs XUL persistants de l'onglet (ceux dus aux appels de persistTabAttribute()) et les permissions sont restaurés. +
  3. L'événement SSTabRestoring est généré. +
  4. L'onglet reçoit l'indication de l'URL à afficher. +
  5. Lorsque la page est chargée, les champs de saisie et les barres de défilement sont restaurés. +
  6. Finalement, l'événement SSTabRestored est généré. +
+

Si vous voulez définir des permissions ou manipuler un onglet récupéré avant que la page y soit chargée, vous devrez surveiller SSTabRestoring. Si vous voulez faire une action après le chargement de la page, vous devrez surveiller SSTabRestored. +

Ces deux événements sont générés systématiquement pour chaque onglet récupéré. Vous pouvez déterminer quel onglet est concerné par la récupération grâce au champ originalTarget de l'événement. +

Il n'y a pas vraiment de moyen pour déterminer quand le dernier onglet a été récupéré à moins de déterminer combien d'onglets doivent être récupérés puis de compter le nombre d'événements SSTabRestored. +

+

Utilisation de l'API de restauration de session

+

Cette section propose quelques exemples simples sur l'emploi de l'API de restauration de session. +

+

Sauvegarder une valeur avec un onglet

+

Le code suivant permet d'attacher un couple clef/valeur à un onglet de telle façon que lorsque l'onglet est récupéré, ce couple le soit également. +

+
 var ss = Components.classes["@mozilla.org/browser/sessionstore;1"].
+                             getService(Components.interfaces.nsISessionStore);
+ var currentTab = getBrowser().selectedTab;
+ var dataToAttach = "Je veux attacher ceci";
+ ss.setTabValue(currentTab, "key-name-here", dataToAttach);
+
+

Ce code définit une valeur de dataToAttach à la clef "key-name-here". La donnée peut être n'importe quel objet JavaScript. +

+

Lire une valeur sauvegardée

+

Vous pouvez lire une valeur associée à un onglet n'importe quand (que l'onglet soit ou non dans un processus de récupération) en utilisant le code suivant : +

+
 var ss = Components.classes["@mozilla.org/browser/sessionstore;1"].
+                             getService(Components.interfaces.nsISessionStore);
+ var currentTab = getBrowser().selectedTab;
+ var retrievedData = ss.getTabValue(currentTab, "key-name-here");
+
+

Après l'exécution de ce code, la variable retrievedData contient la valeur sauvegardée correspondante à la clef "key-name-here". La variable retrievedData est indéfinie (undefined) si aucune valeur correspondant à cette clef n'a été sauvegardée. +

+

Effacer une valeur associée à un onglet

+

Pour effacer une valeur d'un onglet, vous pouvez utiliser un code similaire à celui-ci : +

+
 var ss = Components.classes["@mozilla.org/browser/sessionstore;1"].
+                             getService(Components.interfaces.nsISessionStore);
+ var currentTab = getBrowser().selectedTab;
+ deleteTabValue(currentTab, "key-name-here");
+
+

Remarques

+

Les fonctions de restauration et de lecture des valeurs d'une fenêtre fonctionnent exactement comme les fonctions pour les onglets portant des noms similaires. +

+

Voir également

+

nsISessionStore +

diff --git "a/files/fr/archive/add-ons/d\303\251veloppement_de_modules_compl\303\251mentaires/index.html" "b/files/fr/archive/add-ons/d\303\251veloppement_de_modules_compl\303\251mentaires/index.html" new file mode 100644 index 0000000000..1be4236d13 --- /dev/null +++ "b/files/fr/archive/add-ons/d\303\251veloppement_de_modules_compl\303\251mentaires/index.html" @@ -0,0 +1,50 @@ +--- +title: Développement de modules complémentaires +slug: Archive/Add-ons/Développement_de_modules_complémentaires +translation_of: Archive/Add-ons/Developing_add-ons +--- +

Les logiciels basés sur Mozilla sont typiquement extensibles au travers de modules complémentaires. Trois principaux types de modules existent : les extensions, les thèmes et les plugins. Cette page vous aidera à trouver les informations dont vous aurez besoin pour créer des modules complémentaires pour Firefox, Thunderbird ou d'autres logiciels basés sur la plateforme Mozilla, ainsi que pour les distribuer.

+ + + + + + + + + + +
+

Modules complémentaires

+
+
+
+ Soumettre un module complémentaire sur AMO
+
+ Fournit des informations pour les développeurs de modules afin de les aider à empaqueter et délivrer leur modules. Ces informations concernent notamment addons.mozilla.org, le site de distribution de modules de Mozilla.
+
+ Extensions
+
+ Les extensions ajoutent de nouvelles fonctionnalités à des applications Mozilla comme Firefox, SeaMonkey et Thunderbird. Cela peut aller d'un simple bouton de barre d'outils à une toute nouvelle fonctionnalité.
+
+ Plugins
+
+ Informations sur la manière de créer des plugins, des composants binaires permettant aux logiciels basés sur Mozilla d'afficher du contenu non gérés nativement.
+
+ 		+
+
+ Thèmes
+
+ Les thèmes permettent aux utilisateurs de personnaliser l'apparence de leur interface dans les applications basées sur Mozilla.
+
+ Plugins de moteurs de recherche
+
+ Firefox permet d'utiliser des plugins de moteurs de recherche, avec lesquels le champ de recherche peut gérer différents moteurs de recherche.
+
+ La plateforme Mozilla
+
+ Informations concernant la plateforme Mozilla, toutes ses technologies et API, ainsi que la manière de les utiliser dans vos propres projets.
+
+
+

 

diff --git a/files/fr/archive/add-ons/gestion_de_suggestions_dans_les_plugins_de_recherche/index.html b/files/fr/archive/add-ons/gestion_de_suggestions_dans_les_plugins_de_recherche/index.html new file mode 100644 index 0000000000..146f12cc47 --- /dev/null +++ b/files/fr/archive/add-ons/gestion_de_suggestions_dans_les_plugins_de_recherche/index.html @@ -0,0 +1,55 @@ +--- +title: Gestion de suggestions dans les plugins de recherche +slug: Archive/Add-ons/Gestion_de_suggestions_dans_les_plugins_de_recherche +tags: + - Plugins + - Plugins_de_recherche +translation_of: Archive/Add-ons/Supporting_search_suggestions_in_search_plugins +--- +

MozSearch offre la gestion des suggestions de recherche ; au fur et à mesure que l'utilisateur saisit des caractères dans la barre de recherche, Firefox 2 demande à l'URL spécifiée par le plugin de lui fournir des suggestions de recherche. +

Une fois la liste récupérée, elle est affiche dans une liste déroulante en dessous de la barre de recherche, permettant à l'utilisateur de sélectionner une des propositions s'il le souhaite. S'il continue à ajouter des caractères, de nouvelles suggestions sont demandées au moteur de recherche, puis utilisées pour rafraîchir la liste précédente. +

Les plugins de recherche Yahoo et Google inclus dans Firefox 2 utilisent la suggestion de recherche. +

+

Implémenter le support de la suggestion dans le plugin de recherche

+

Pour offrir des suggestions de recherche, un plugin doit comporter un élément <Url> supplémentaire dont l'attribut type vaut "application/x-suggestions+json". (Cela signifie que le plugin d'un moteur de recherche offrant des suggestions de recherche contient deux éléments <Url>, l'autre étant l'URL de recherche text/html principale.) +

Par exemple, le plugin de recherche Yahoo contient l’élément <Url> suivant : +

+
<Url type="application/x-suggestions+json" template="http://ff.search.yahoo.com/gossip?output=fxjson&command={searchTerms}"/>
+
+

Si l'utilisateur entre « fir » dans la barre de recherche, puis fait une pause, Firefox remplace {searchTerms} par « fir » et contacte cette URL : +

+
<Url type="application/x-suggestions+json" template="http://ff.search.yahoo.com/gossip?output=fxjson&command=fir"/>
+
+

Les résultats sont utilisés pour créer la liste de la boite de suggestion. +

Consultez la page de création d'un plugin MozSearch pour plus de détails sur l’implémentation d’un plugin de recherche. +

+

Implémenter le support des suggestions de recherche sur le serveur

+

La plus grande partie du travail de la suggestion de recherche se passe du coté du serveur. Si vous êtes concepteur de site Web et que vous désirez proposer des suggestions de recherche, vous devez prévoir la possibilité de renvoyer des suggestions correspondant à un terme de recherche avec la Notation JSON (en) (JavaScript Object Notation). +

Quand le navigateur désire obtenir une liste de correspondances possibles pour un terme recherché, il envoie une requête HTTP GET à l'URL spécifiée dans l'élément <Url>. +

Votre serveur doit alors décider des suggestions à faire en utilisant le moyen qu'il jugera adéquat, puis construire un JSON composé d'au minimum deux, et au maximum quatre éléments : +

+
chaîne de recherche +
Le premier élément du JSON est le terme de recherche qui a été communiqué au serveur. Cela permet à Firefox de vérifier que les suggestions correspondent au terme de recherche actuel. +
+
liste de suggestions +
Un tableau des termes de recherche suggérés. Le tableau est placé entre crochets. Par exemple : <tt>["terme 1", "terme 2", "terme 3", "terme 4"]</tt> +
+
descriptions +
Cet élément optionnel est un tableau de descriptions correspondant à chacun des éléments de la liste de suggestions. Il peut s'agir de n'importe quelle information supplémentaire que le moteur de recherche désire voir affichée par le navigateur, comme nombre de résultats disponibles pour une suggestion. +
+
Les descriptions ne sont pas supportées dans Firefox 2, et sont ignorées lorsqu’elles sont spécifiées.
+
URL spécifiques associées à des requêtes +
Cet élément optionnel est un tableau d'URL alternatives pour chacune des suggestions de la liste de suggestions. Par exemple, si pour une suggestion donnée vous préférez donner un lien vers une carte plutôt qu'une simple page de résultats de recherche, vous pouvez retourner une URL vers une carte dans ce tableau. +
+
Si vous ne spécifiez pas d'URL spécifique pour un élément de la liste de suggestions, c'est la requête par défaut, décrite par l’élément <Url> dans la description XML du plugin, qui sera employée. +
+
Les URL associées à des requêtes ne sont pas supportées dans Firefox 2, et sont ignorées lorsqu'elles sont spécifiées.
+

Ainsi, si le terme de recherche est « fir », et si vous ne désirez renvoyer ni les descriptions, ni les URL associées aux requêtes, vous pouvez renvoyer le JSON suivant : +

+
["fir", ["firefox", "first choice", "mozilla firefox"]]
+
+

Remarquez que dans cet exemple, seules la chaîne de recherche et la liste de suggestions sont spécifiées, et les éléments optionnels sont négligés. +

Votre liste de suggestions peut comporter autant d'éléments que vous le souhaitez, mais elle devrait être limitée à une longueur raisonnable étant donné que l'affichage doit être rafraîchi au fur et à mesure que l'utilisateur compose son terme de recherche. Enfin, notez que vous êtes entièrement libre quant à la méthode que vous employez pour sélectionner les suggestions à envoyer. +

+
+
diff --git a/files/fr/archive/add-ons/index.html b/files/fr/archive/add-ons/index.html new file mode 100644 index 0000000000..d1851bd7ee --- /dev/null +++ b/files/fr/archive/add-ons/index.html @@ -0,0 +1,8 @@ +--- +title: Add-ons +slug: Archive/Add-ons +translation_of: Archive/Add-ons +--- +

In progress. Archived add-ons documentation.

+ +

diff --git "a/files/fr/archive/add-ons/installation_d_extensions_et_de_th\303\250mes_depuis_une_page_web/index.html" "b/files/fr/archive/add-ons/installation_d_extensions_et_de_th\303\250mes_depuis_une_page_web/index.html" new file mode 100644 index 0000000000..3d0300b2a6 --- /dev/null +++ "b/files/fr/archive/add-ons/installation_d_extensions_et_de_th\303\250mes_depuis_une_page_web/index.html" @@ -0,0 +1,71 @@ +--- +title: Installation d'extensions et de thèmes depuis une page Web +slug: Archive/Add-ons/Installation_d_extensions_et_de_thèmes_depuis_une_page_Web +tags: + - Extensions + - Themes +translation_of: Archive/Add-ons/Installing_Extensions_and_Themes_From_Web_Pages +--- +

Il existe de nombreuses façons d'installer des extensions et des thèmes depuis des pages Web, parmi lesquelles un lien direct vers les fichiers XPI et l'utilisation de l'objet InstallTrigger.

+

Les auteurs d'extensions et de pages Web sont encouragés à utiliser la méthode décrite ci-dessous pour installer des fichiers XPI, c'est celle qui est la plus agréable pour l'utilisateur.

+

Exemple de script Web

+
<script type="application/x-javascript">
+<!--
+function install (aEvent)
+{
+  var params = {
+    "Foo": { URL: aEvent.target.href,
+             IconURL: aEvent.target.getAttribute("iconURL"),
+             Hash: aEvent.target.getAttribute("hash"),
+             toString: function () { return this.URL; }
+    }
+  };
+  InstallTrigger.install(params);
+
+  return false;
+}
+-->
+</script>
+
+ <a href="http://www.example.com/foo.xpi"
+   iconURL="http://www.example.com/foo.png"
+   hash="sha1:28857e60d043447c5f4550853f2d40770b326a13"
+   onclick="return install(event);">Installer l'extension</a>
+ 
+
+

Examinons ce code pièce par pièce. L'élément HTML <a> est le lien d'installation. L'attribut href contient un lien direct vers le fichier XPI de l'extension, c'est ce qui sera affiché dans la barre d'adresse lorsque le pointeur survole le lien. Les visiteurs peuvent enregistrer le fichier XPI sur leur disque facilement en cliquant dessus et en choisissant « Enregistrer sous… »

+

Lorsqu'on clique sur le lien, il appelle la fonction install en passant l'objet d'évènement en paramètre.

+

L'installation crée d'abord un bloc de paramètres :

+
var params = {
+  "Foo": { URL: aEvent.target.href,
+           IconURL: aEvent.target.getAttribute("iconURL"),
+           Hash: aEvent.target.getAttribute("hash"),
+           toString: function () { return this.URL; }
+};
+
+

Ceci spécifie le nom (Foo) à afficher dans le dialogue de confirmation, l'URL où trouver l'extension (qui, souvenez-vous, est l'attribut href du lien), l'URL de l'icône à afficher dans le dialogue de confirmation, une empreinte de contrôle du fichier xpi (pour protéger contre les téléchargements corrompus), et une fonction toString qui permettra à ce code de fonctionner avec les versions 0.8 et antérieures de Firefox. Vous pouvez également utiliser l'ancien style de bloc de paramètres ({ "Foo": aEvent.target.href  }) si vous le désirez et que vous n'avez pas d'icône à afficher dans le dialogue de confirmation.

+

InstallTrigger.install est ensuite appelée pour installer l'élément défini dans le bloc de paramètres.

+
return false;
+
+

Cette dernière partie est la plus importante : la fonction d'installation doit renvoyer false afin que, lorsqu'on clique sur le lien, seul le script soit exécuté et le href du lien ne soit pas chargé dans le navigateur. Si vous oubliez cette étape, l'utilisateur risque de voir deux dialogues d'installation, étant donné que vous avez effectivement invoqué deux requêtes d'installation : une avec InstallTrigger et l'autre en essayant de charger directement le fichier XPI.

+

Paramètres disponibles pour l'objet d'installation

+

La méthode InstallTrigger.install accepte un objet JavaScript en paramètre, dont plusieurs propriétés seront utilisées au cours de l'installation.

+

URL

+

La propriété URL spécifie l'adresse URL du fichier XPI à installer. Cette propriété est obligatoire.

+

IconURL

+

La propriété IconURL indique une icône à utiliser dans le dialogue d'installation. Cette propriété est facultative. Si aucune icône n'est spécifiée, l'icône par défaut sera utilisée, habituellement une pièce de puzzle verte. L'icône peut être dans n'importe quel format d'image accepté par Firefox, et doit être d'une taille de 32×32 pixels.

+

Hash

+

La propriété Hash spécifie une empreinte cryptographique du contenu du fichier XPI. Celle-ci est utilisée pour vérifier le fichier téléchargé, pour empêcher d'installer, par exemple, un fichier corrompu servi par un serveur de téléchargement miroir. Toute fonction de hachage supportée par nsICryptoHash peut être utilisée. L'empreinte est spécifiée de la manière fonction de hachage:empreinte de contrôle, par exemple, sha1:28857e60d043447c5f4550853f2d40770b326a13.

+

toString()

+

La propriété toString() devrait renvoyer l'URL du fichier XPI, pour la compatibilité avec les versions de Firefox antérieures à 1.0, et d'autres applications comme Seamonkey.

+

Thèmes

+

À peu près tout ce qui est décrit ci-dessus s'applique également aux thèmes, sauf qu'il faut utiliser la fonction installChrome. Comme beaucoup de sites installaient des extensions en donnant un lien direct vers un fichier XPI en se reposant sur la gestion de contenu interne au navigateur pour invoquer la fenêtre de confirmation, certains procèdent (incorrectement) de même pour les fichiers JAR de thèmes et se demandent pourquoi ils ne sont pas détectés et installés automatiquement. En fait, XPI est une extension spécifique à Mozilla, et ce format peut donc être géré de façon spéciale, mais ce n'est pas le cas de JAR. Tous les fichiers .jar ne sont pas des thèmes pour Firefox, donc si vous cliquez sur un lien vers un .jar vous verrez un dialogue d'enregistrement de fichier. Pour cette raison, vous devriez toujours utiliser l'API InstallTrigger pour installer des thèmes.

+

Une note à propos d'updateEnabled()

+

InstallTrigger expose une fonction appelée updateEnabled que certains peuvent être tentés d'appeler avant InstallTrigger.install. Ce n'est pas nécessaire étant donné que l'installation appelle elle-même updateEnabled en interne. De plus, l'appel à updateEnabled peut causer des problèmes si votre site de distribution n'est pas dans la liste blanche de l'utilisateur, parce que Firefox affiche le message « Installation bloquée » uniquement lorsque installChrome est appelé, ou lorsqu'un fichier XPI est chargé. Donc, si vous avez du code qui ressemble à ceci :

+
if (InstallTrigger.updateEnabled())
+  InstallTrigger.install({"MonExtension": "foo.xpi"});
+
+

… et que votre site n'est pas dans la liste blanche, lorsque l'utilisateur déclenchera ce code, updateEnabled renverra false étant donné que votre site n'est pas dans la liste autorisée, et puisque c'est updateEnabled qui a fait ce constat et pas une demande d'installation, l'utilisateur ne verra rien du tout se produire.

+

Par conséquent, vous devriez uniquement utiliser updateEnabled pour afficher du contenu dans la page pour avertir l'utilisateur que l'installation est désactivée, ou que votre site n'est pas dans la liste blanche, et ne pas le placer dans le chemin de code menant à l'installation.

+

(* de toute manière, ceci ne doit pas vous empêcher de développer des systèmes d'installation plus ambitieux, cette documentation est uniquement fournie comme un guide dans l'espoir que la plupart des distributeurs d'extensions l'utiliseront. Elle se comporte en effet bien dans la plupart des cas.)

+

diff --git a/files/fr/archive/add-ons/paquetage_multi_extensions/index.html b/files/fr/archive/add-ons/paquetage_multi_extensions/index.html new file mode 100644 index 0000000000..946292425d --- /dev/null +++ b/files/fr/archive/add-ons/paquetage_multi_extensions/index.html @@ -0,0 +1,78 @@ +--- +title: Paquetage multi extensions +slug: Archive/Add-ons/Paquetage_multi_extensions +tags: + - API_du_toolkit + - Extensions +translation_of: Archive/Add-ons/Multiple_Item_Packaging +--- +
+

From the release of Firefox 53, multiple item extension packages are no longer supported and will not load. As a consequence, these packages are no longer accepted by AMO.

+
+ +

Un paquetage multi extensions fournit la possibilité de conditionner plusieurs paquets installables qui peuvent alors être chargés et installés par un utilisateur, ou fournis pré-empaquetés avec une application ou un programme externe. Chaque paquetage multi extensions doit utiliser un fichier install.rdf et a les mêmes exigences et possibilités qu'une extension, à l'exception de ce qui suit :

+ +

Si l'utilisateur installe une version précédente de l'extension, il n'existe aucun moyen de le prévenir ni de l'en empêcher.

+ +

 

+ +

Structure d'un paquetage multi extensions

+ +

La structure d'un paquetage multi extensions est la forme simplifiée d'un paquet installable et requiert un fichier avec l'extension .xpi. Un paquetage multi extensions peut contenir aussi bien des extensions (fichiers .xpi) que des thèmes (fichiers .jar). La structure de base est indiquée ci-dessous:

+ +
/install.rdf                        Manifeste d'installation
+/extension1.xpi                     Extension
+/extension2.xpi                     Extension
+/theme1.jar                         Theme
+/theme2.jar                         Theme
+...
+
+ +

Le gestionnaire d'extension lira le manifeste d'installation pour déterminer si c'est un paquetage multi extensions et démarrera alors automatiquement l'installation de chaque paquet qu'il contient. Aucun autre fichiers, hormis le manifeste d'installation et les fichiers .jar ou .xpi, ne sera extrait ni utilisé.

+ +

install.rdf

+ +

Un paquetage multi extensions n'a pas les mêmes obligations qu'une extension pour son manifeste d'installation. Les seuls éléments requis sont em:id, em:targetApplication, et em:type.

+ +

Pour que les gestionnaires d'extensions de Firefox et Thunderbird 1.5 déterminent la nature du paquetage multi extensions, l'élément em:type spécifié dans votre install.rdf doit être à 32 et indiqué comme <em:type NC:parseType="Integer">32</em:type>. L'espace de nommage XML xmlns:NC="http://home.netscape.com/NC-rdf#" doit aussi être déclaré dans votre install.rdf comme indiqué ci-dessous:

+ +
...
+<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+     xmlns:NC="http://home.netscape.com/NC-rdf#"
+     xmlns:em="http://www.mozilla.org/2004/em-rdf#">
+
+  <Description about="urn:mozilla:install-manifest">
+    <!-- nsIUpdateItem type for a Multiple Item Package -->
+    <em:type NC:parseType="Integer">32</em:type>
+...
+ +

Pour les gestionnaires d'extensions de Firefox et Thunderbird 2.0, vous pouvez utiliser la précédente syntaxe ou <em:type>32</em:type> comme indiqué ci-dessous:

+ +
...
+<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+     xmlns:em="http://www.mozilla.org/2004/em-rdf#">
+
+  <Description about="urn:mozilla:install-manifest">
+    <!-- nsIUpdateItem type for a Multiple Item Package -->
+    <em:type>32</em:type>
+...
+ +

En spécifiant em:targetApplication, l'élément minVersion indiqué doit être l'élément minVersion le plus élevé et l'élément maxVersion indiqué doit être l'élément maxVersion le plus bas de tous les paquets installables par le paquetage multi extensions pour l'élément em:targetApplication. Sinon chaque paquet incompatible ne sera pas installé, à moins qu'un test de compatibilité découvre une information de compatibilité mise à jour qui le rendrait compatible.

+ +

Installation

+ +

L'installation peut être effectuée en utilisant les méthodes existantes pour les extensions/thèmes et la même interface utilisateur est employée pour un paquetage multi extensions (les paquets contenus dans le paquetage multi extensions ne seront pas listés). Cela permet aussi d'afficher l'information de signature pour le paquetage multi extensions.

+ +

Si un gestionnaire (le gestionnaire d'extensions/thèmes par exemple) est affiché après le chargement du paquetage multi extensions, le gestionnaire affichera chaque paquet contenu dans celui-ci, de la même manière que si l'utilisateur avait choisi d'installer plusieurs paquets simultanément. Le gestionnaire n'affichera pas le paquetage multi extensions dans la liste des paquets, un fois le chargement terminé du paquetage multi extensions.

+ +

Références officielles de l'API du toolkit

+ +

Official References. Do not add to this list without contacting Benjamin Smedberg. Note that this page is included from the pages listed below. So: Don't Add Breadcrumbs! +

+

diff --git "a/files/fr/archive/add-ons/t\303\251l\303\251charger_du_json_et_du_javascript_dans_une_extension/index.html" "b/files/fr/archive/add-ons/t\303\251l\303\251charger_du_json_et_du_javascript_dans_une_extension/index.html" new file mode 100644 index 0000000000..bdc5b7d9b5 --- /dev/null +++ "b/files/fr/archive/add-ons/t\303\251l\303\251charger_du_json_et_du_javascript_dans_une_extension/index.html" @@ -0,0 +1,17 @@ +--- +title: Télécharger du JSON et du JavaScript dans une extension +slug: Archive/Add-ons/Télécharger_du_JSON_et_du_JavaScript_dans_une_extension +tags: + - AJAX + - Extensions +translation_of: Archive/Add-ons/Downloading_JSON_and_JavaScript_in_extensions +--- +

Une pratique courante utilisée par de nombreuses extensions est d'utiliser XMLHttpRequest ou un mécanisme similaire pour charger du code JavaScript ou des données au format JSON depuis un site distant. Le contenu récupéré est ensuite interprété avec la fonction eval(). Cette pratique est dangereuse, et une extension qui l'utiliserait ne pourrait pas franchir l'étape de la revue de code pour être hébergée sur le site AMO

+

Cette pratique est dangereuse car le code ainsi interprété obtient les mêmes droits que l'extension, c'est à dire qu'il a un accès complet au chrome, donc à la machine de l'utilisateur, sur laquelle il peut faire ce qu'il veut. L'extension n'a aucun moyen de s'assurer que le site à partir duquel elle récupère du code ou des données n'a pas été piraté, et que le code récupéré est sans danger. AMO prend ce risque très au sérieux.

+

Il existe heureusement un moyen de contourner ce problème.

+

Télécharger du JSON

+

Pour interpréter des données formatées en JSON, les développeurs ne devraient pas utiliser eval() mais plutôt une des méthodes indiquées sur cette page. Ces méthodes protègent contre du code malicieux, par exemple en garantissant que l'object JSON ne contient que des propriétés, et qu'aucune de ses éventuelles fonctions ne sera exécutée. Pour décoder du JSON, utilisez une fonction faite pour ça, pas eval() !

+

Télécharger du JavaScript

+

Il arrive que du code JavaScript soit téléchargé d'un serveur distant et exécuté dans l'extension. Par exemple si le développeur veut que son extension soit toujours à jour, et ne pas faire appel au mécanisme de mise à jour à chaque modification de code. Dans ce cas, le code téléchargé devrait être exécuté dans un bac à sable pour protéger l'extension et la machine sur laquelle elle s'exécute.

+

Pour exécuter ce code dans un environnement protégé, il faut faire appel au composant Components.utils.evalInSandbox(). Le code JavaScript est exécuté dans un bac à sable avec tous les objets "sûrs" avec lesquels il doit communiquer. Cette méthode n'est cependant pas sans danger, et les développeurs devraient lire attentivement la documentation pour s'assurer que le code non sûr ne risque pas de sortir de ce contexte protégé

+

diff --git "a/files/fr/archive/add-ons/versions_extension,_mise_\303\240_jour_et_compatibilit\303\251/index.html" "b/files/fr/archive/add-ons/versions_extension,_mise_\303\240_jour_et_compatibilit\303\251/index.html" new file mode 100644 index 0000000000..ab057e896c --- /dev/null +++ "b/files/fr/archive/add-ons/versions_extension,_mise_\303\240_jour_et_compatibilit\303\251/index.html" @@ -0,0 +1,299 @@ +--- +title: 'Versions d''une extension, mise à jour et compatibilité' +slug: 'Archive/Add-ons/Versions_extension,_mise_à_jour_et_compatibilité' +tags: + - Extensions +translation_of: 'Archive/Add-ons/Extension_Versioning,_Update_and_Compatibility' +--- +

Versions d'un module

+ +

Les modules doivent spécifier leurs versions en utilisant le Format de version du toolkit. Il s'agit approximativement d'une chaîne de caractères découpée par des points, comme par exemple :

+ + + +
Note : Avant Firefox 1.5, un format de version plus basique était utilisé : major.minor.release.build[+] où seuls des chiffres étaient permis. Le format de version du toolkit gère la numérotation des versions de Firefox mais il permet une plus grande flexibilité.
+ +

Comment les applications déterminent la compatibilité

+ +

Lors de l'installation de modules, les applications regardent les entrées de targetApplication dans le fichier install.rdf du module. L'id de cette entrée doit correspondre exactement à l'id de l'application. De plus, les valeurs minVersion et maxVersion de cette entrée doivent former un intervalle comprenant la version de l'application.

+ +

Si l'application possède une entrée targetApplication pour une version incompatible, elle tentera alors d'obtenir des informations de mise à jour à partir de l'updateURL du module.

+ +

Si le fichier install.rdf contient des entrées targetPlatform, la plateforme devant faire tourner l'application doit y être listée. Dans le cas contraire, l'installation sera refusée.

+ +

+

Note concernant Firefox 3

+

Dans des applications basées sur Gecko 1.9, vous pouvez également utiliser une entrée targetApplication avec une id toolkit@mozilla.org, et des valeurs minVersion et maxVersion qui correspondent à la version du toolkit faisant tourner l'application. Cela vous permet que d'installer votre module sur n'importe quelle application basée sur ce toolkit.

+

+ +

Passer outre les tests de compatibilité

+ +

Pour des besoins de tests, vous pouvez dire à l'application d'ignorer quelque peu les vérifications de compatibilité lors de l'installation de modules. Créez simplement une préférence booléenne extensions.checkCompatibility avec la valeur false.

+ +
Note : Avant Firefox 1.5, la préférence app.extensions.version servait à outrepasser la version que l'application croyait pouvoir installer normalement.
+ +

Choix de minVersion et maxVersion

+ +

minVersion et maxVersion doivent spécifier la plage de versions de l'application sur laquelle vous avez fait des tests. En particulier, vous ne devriez jamais spécifier un maxVersion plus grand que la version actuelle de l'application, puisque vous ne connaissez pas les modifications possibles à venir des API et de l'interface utilisateur. Avec la mise à jour de compatibilité, il n'est pas nécessaire de fournir une version entière nouvelle de l'extension simplement pour augmenter son maxVersion.

+ +

Pour la valeur maxVersion, il est généralement permis d'utiliser un * à la place de la version mineure de l'application supportée, par exemple 2.0.0.* signifiera que vous supporterez toutes les mises à jour mineures de la version 2.

+ +

N'allez pas imaginer que * dans une version représente n'importe quelle version. Le * représente en fait un nombre infiniment grand et n'a réellement un sens que lorsqu'il est utilisé dans maxVersion. Si vous l'utilisez dans minVersion, vous n'obtiendrez pas le résultat escompté.

+ +

Vérification automatique des mises à jour de modules

+ +

Les applications vont vérifier périodiquement les mises à jour à installer des modules en récupérant le fichier updateURL. L'information renvoyée peut servir à prévenir l'utilisateur d'une mise à jour d'un module, aussi bien qu'indiquer à l'application qu'il existe des nouvelles versions d'applications compatibles avec ce module.

+ +

Mise à jour de compatibilité

+ +

Pendant la phase de vérification automatique, les applications examinent à la fois s'il existe des nouvelles versions et des mises à jour de compatibilité concernant la version installée d'un module. Cela signifie que votre manifeste de mise à jour contient une entrée pour la version actuellement installée du module, et l'entrée targetApplication spécifie un maxVersion plus grand, l'application utilisera cette valeur à la place de celle spécifiée dans le fichier install.rdf du module. De ce fait, des modules qui étaient désactivés car incompatibles peuvent s'activer, et des modules qui ne s'installaient normalement pas peuvent être installés.

+ +

Format RDF de mise à jour

+ +

Si vous hébergez l'updateURL de votre module vous-même, vous devrez alors retourner l'information de version dans un format RDF. Vous trouverez ci dessous un exemple de manifeste de mise à jour. Il liste les informations de 2 différentes versions de l'extension ayant pour id foobar@developer.mozilla.org. Les versions incluses sont 2.2 et 2.5, et chacune d'elles définit une compatibilité avec les versions de 1.5 à 2.0.0.* de Firefox. Pour la version 2.2, un lien https de mise à jour est employé tandis que pour la version 2.5, c'est un lien régulier http avec un hash pour vérifier le fichier récupéré.

+ +

Il est important de récupérer correctement l'attribut about du RDF:Description initial. Cette information précisera de quel type de module il s'agit :

+ + + +

Dans chacun des exemples qui vont suivre, la séquence des versions au sein de l'élément <RDF:Seq> est significative, les versions plus récentes devant être présentées après les versions plus anciennes. Il n'est pas nécessaire de lister toutes les versions intermédiaires si la dernière version est fournie.

+ +
<?xml version="1.0" encoding="UTF-8"?>
+
+<RDF:RDF xmlns:RDF="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+         xmlns:em="http://www.mozilla.org/2004/em-rdf#">
+
+  <!-- Cette ressource de description inclut toutes les informations de mise à jour
+       et de compatibilité pour un unique module ayant l'id foobar@developer.mozilla.org.
+       Vous pouvez lister plusieurs informations de module dans un même fichier RDF. -->
+  <RDF:Description about="urn:mozilla:extension:foobar@developer.mozilla.org">
+    <em:updates>
+      <RDF:Seq>
+
+        <!-- Chaque li est une version différente du même module -->
+        <RDF:li>
+          <RDF:Description>
+            <em:version>2.2</em:version> <!-- Ceci est le numéro de version du module -->
+
+            <!-- Un targetApplication pour chacune des applications avec laquelle le module est compatible -->
+            <em:targetApplication>
+              <RDF:Description>
+                <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
+                <em:minVersion>1.5</em:minVersion>
+                <em:maxVersion>2.0.0.*</em:maxVersion>
+
+                <!-- Ceci est l'emplacement de téléchargement du module -->
+                <em:updateLink>https://www.mysite.com/foobar2.2.xpi</em:updateLink>
+
+                <!-- Une page décrivant les nouveautés de la mise à jour -->
+                <em:updateInfoURL>http://www.mysite.com/updateinfo2.2.xhtml</em:updateInfoURL>
+              </RDF:Description>
+            </em:targetApplication>
+          </RDF:Description>
+        </RDF:li>
+
+        <RDF:li>
+          <RDF:Description>
+            <em:version>2.5</em:version>
+            <em:targetApplication>
+              <RDF:Description>
+                <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
+                <em:minVersion>1.5</em:minVersion>
+                <em:maxVersion>2.0.0.*</em:maxVersion>
+                <em:updateLink>http://www.mysite.com/foobar2.5.xpi</em:updateLink>
+                <em:updateHash>sha1:78fc1d2887eda35b4ad2e3a0b60120ca271ce6e6</em:updateHash>
+              </RDF:Description>
+            </em:targetApplication>
+          </RDF:Description>
+        </RDF:li>
+
+      </RDF:Seq>
+    </em:updates>
+
+    <!-- Une signature est nécessaire seulement si votre module inclut un updateKey dans
+         son fichier install.rdf. -->
+    <em:signature>MIGTMA0GCSqGSIb3DQEBBQUAA4GBAMO1O2gwSCCth1GwYMgscfaNakpN40PJfOWt
+                  ub2HVdg8+OXMciF8d/9eVWm8eH/IxuxyZlmRZTs3O5tv9eWAY5uBCtqDf1WgTsGk
+                  jrgZow1fITkZI7w0//C8eKdMLAtGueGfNs2IlTd5P/0KH/hf1rPc1wUqEqKCd4+L
+                  BcVq13ad</em:signature>
+  </RDF:Description>
+</RDF:RDF>
+
+ +

Certaines personnes préfèrent le format alternatif suivant (notez que beaucoup d'informations ont été retirées de cet exemple par souci de clarté) :

+ +
<?xml version="1.0" encoding="UTF-8"?>
+
+<RDF:RDF xmlns:RDF="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+         xmlns:em="http://www.mozilla.org/2004/em-rdf#">
+
+  <!-- Cette ressource de description inclut toutes les informations de mise à jour
+       et de compatibilité pour un unique module ayant l'id foobar@developer.mozilla.org.
+       Vous pouvez lister plusieurs informations de module dans un même fichier RDF. -->
+  <RDF:Description about="urn:mozilla:extension:foobar@developer.mozilla.org">
+    <em:updates>
+      <RDF:Seq>
+        <!-- L'attribut resource pointe vers une entrée RDF:Description correspondante
+             plus bas. L'uri peut être ce que vous voulez -->
+        <RDF:li resource="urn:mozilla:extension:foobar@developer.mozilla.org:2.2"/>
+        <RDF:li resource="urn:mozilla:extension:foobar@developer.mozilla.org:2.5"/>
+      </RDF:Seq>
+    </em:updates>
+    <em:signature>MIGTMA0GCSqGSIb3DQEBBQUAA4GBAMO1O2gwSCCth1GwYMgscfaNakpN40PJfOWt
+                  ub2HVdg8+OXMciF8d/9eVWm8eH/IxuxyZlmRZTs3O5tv9eWAY5uBCtqDf1WgTsGk
+                  jrgZow1fITkZI7w0//C8eKdMLAtGueGfNs2IlTd5P/0KH/hf1rPc1wUqEqKCd4+L
+                  BcVq13ad</em:signature>
+  </RDF:Description>
+
+  <!-- Ceci représente la même description qu'avec le li de l'exemple précédent -->
+  <RDF:Description about="urn:mozilla:extension:foobar@developer.mozilla.org:2.2">
+    <em:version>2.2</em:version>
+
+    <!-- suppression du contenu ici -->
+
+  </RDF:Description>
+
+  <RDF:Description about="urn:mozilla:extension:foobar@developer.mozilla.org:2.5">
+    <em:version>2.5</em:version>
+
+    <!-- suppression du contenu ici -->
+
+  </RDF:Description>
+
+</RDF:RDF>
+
+ +

Fournir des détails sur les mises à jour

+ +

+ +

En général

+ +

Il est possible de fournir à l'utilisateur quelques détails sur les nouveautés d'une mise à jour d'un module. Ils seront visibles lorsque l'utilisateur reçoit une notification de mise à jour et devraient lui permettre d'avoir un aperçu rapide des nouvelles fonctionnalités et des problèmes de sécurité résolus.

+ +

Pour réaliser cela, vous devez ajouter une entrée updateInfoURL à votre manifeste de mise à jour (voir l'exemple plus haut). La page à cette URL sera récupérée et affichée à l'utilisateur. Puisqu'elle est affichée en dehors du contexte d'une page Web normale, son contenu est énormément assaini, ce qui signifie qu'il n'y a pas beaucoup d'options de formatage disponibles et les scripts et images ne sont pas autorisés.

+ + + +

À l'intérieur des listes, utilisez les balises habituelles li pour chaque item.

+ +

À l'intérieur des balises h1, h2, h3, p et li, vous pouvez utiliser :

+ + + +

La page d'information récupérée doit pour l'instant être totalement valide en XHTML, et doit être servie avec le type MIME application/xhtml+xml.

+ +

Vous pouvez ajouter %APP_LOCALE% dans votre updateInfoURL si vous désirez que les informations de locale soient fournis dans l'URL — ceci permet de personnaliser le texte selon la locale de l'utilisateur. Vous pouvez également utiliser les autres chaînes de substitution gérées par updateURL, bien qu'elles soient probablement moins utiles.

+ +

Ce que voit l'utilisateur

+ +

Le contenu de updateInfoURL sera affiché pour l'utilisateur dans la page des modules complémentaires, dans une liste des mises à jour disponibles. L'utilisateur peut ensuite cliquer sur le bouton Afficher les informations et verra celles-ci sur le côté droit. (notez que l'intitulé du bouton devient Masquer les informations)

+ +

Image:Example_updateInfoURL2.png

+ +

Mises à jour sécurisées

+ +

+ +

Gecko 1.9 dispose d'un processus supplémentaire destiné à protéger les utilisateurs contre les attaques de l'homme du milieu ainsi que pendant des mises à jour de modules. Dans le fichier install.rdf du module déjà installé, updateURL doit être défini d'une des façons suivantes :

+ + + +

Lorsque vous spécifier une updateKey dans install.rdf, vous devez inclure une signature numérique dans le manifeste de mise à jour ou l'information sera rejetée.

+ +

Dans le manifeste de mise à jour délivré par updateURL, updateLink doit être défini d'une des façons suivantes :

+ + + +

Toutes les entrées du manifeste de mise à jour qui ne respectent pas ces deux exigences seront ignorées lors de la vérification des nouvelles versions.

+ +

Notez que les liens https vers des sites ayant des certificats invalides ou qui redirigent les requêtes vers des sites http échoueront également pour les cas update.rdf et updateLink

+ +

Hachages de mise à jour

+ +

Afin de vérifier l'intégrité du XPI téléchargé, vous devez fournir une entrée updateHash en même temps que le lien updateLink. Il s'agit d'un hachage généré à partir des données du fichier selon l'un des algorithmes gérés (sha1, sha256, sha384 et sha512). Dans Firefox 3, si la valeur updateLink n'est pas https le hachage doit être fait à l'aide d'un des membres de la famille d'algorithmes sha. L'algorithme de hachage utilisé est placé en préfixe de la chaîne de caractères et séparé par « : ».

+ +
  <em:updateHash>sha1:78fc1d2887eda35b4ad2e3a0b60120ca271ce6e6</em:updateHash>
+
+ +

Note : La valeur de updateHash, doit commencer par la chaîne de l'algorithme de hachage, une erreur courante est d'effacer le préfixe en mettant à jour la valeur de updateHash : sha1:78fc1d2887eda35b4ad2e3a0b60120ca271ce6e6

+ +

Une erreur est affichée lorsque le hachage d'un fichier téléchargé diffère de son hachage spécifié.

+ +

Différents outils peuvent être utilisés pour générer des hachages :

+ +

De nombreuses variantes d'Unix fournissent sha1sum, sha256sum et ainsi de suite. Les utilisateurs de Windows peuvent utiliser HashTab pour une utilisation interactive (hors script de compilation). On pensera aussi aux outils GNU pour Windows (en dehors des classiques comme Cygwin), qui peuvent servir en utilisation non interactive :

+ +
sha1sum FICHIER
+
+ +

On peut encore citer md5deep, qui est multiplateforme :

+ +
sha1deep FICHIER
+
+ +

OpenSSL peut également générer des hachages :

+ +
openssl sha1 FICHIER
+
+ +

Sous Windows, HashTab peut servir d'extension au shell… un clic droit vous donnera des valeurs de hachage pour n'importe quel fichier.

+ +

De plus, un bug d'amélioration est ouvert pour ajouter une génération automatique de hachages pour les fichiers XPI à l'outil McCoy.

+ +

Enfin, tous les langages (de script) populaires offrent cette fonctionnalité, par exemple : Python, Perl: CPAN Digest, PHP.

+ +

Signature de manifestes de mise à jour

+ +

+ +

Si vous souhaitez servir votre RDF de mise à jour depuis un serveur http classique, les applications basées sur Gecko 1.9 auront besoin que vous signez numériquement le manifeste de mise à jour pour garantir que l'information n'est pas altérée entre le moment où vous l'avez créée et celui où les applications la récupèrent. L'outil McCoy doit être utilisé pour signer le RDF de mise à jour.

+ +

Les détails techniques du mécanisme de signature dépasse le cadre de ce document, toutefois les bases sont les suivantes :

+ +
Première étape — à faire une seule fois, avant de publier le module
+ +

L'objectif et d'ajouter updateKey au fichier install.rdf.

+ +

L'auteur du module crée une paire de clés cryptée RSA publique/privée.

+ +

La partie publique de la clé est encodée en DER et encodée en base 64, puis ajoutée au fichier install.rdf du module dans l'entrée updateKey.

+ +
Deuxième étape — à faire à chaque modification du fichier « update.rdf »
+ +

L'objectif est de définir la valeur de signature dans update.rdf.

+ +

Lorsque l'auteur crée le fichier rdf de mise à jour, un outil sert à le signer en utilisant la partie privée de la clé. Plus simplement, l'information de mise à jour est convertie en chaîne de caractères, puis hachée par un algorithme sha512 et le hachage obtenu est signé grâce à la clé privée. La donnée résultante est encodée en DER, puis encodée en base 64 pour être inclue dans update.rdf et comme une entrée de signature.

+ +

Débogage et résolution de problèmes

+ +

Les mécanismes de mise à jour peuvent envoyer des informations à la console, et afficher différentes informations pouvant vous aider à résoudre un problème. Pour activer l'affichage des messages :

+ +
    +
  1. Définissez la valeur de extensions.logging.enabled à true (en utilisant l'URL about:config).
    2. +
  2. Lancez Firefox en ligne de commande avec l'option -console
    3. +
+ +

Si vous rencontrez des problèmes, examinez la sortie en console pour l'id de votre extension, et regardez si des erreurs ont été enregistrées.

diff --git a/files/fr/archive/apps/advanced_topics/index.html b/files/fr/archive/apps/advanced_topics/index.html new file mode 100644 index 0000000000..dd21392e76 --- /dev/null +++ b/files/fr/archive/apps/advanced_topics/index.html @@ -0,0 +1,75 @@ +--- +title: Sujets avancés +slug: Archive/Apps/Advanced_topics +tags: + - Applications + - Firefox OS + - Mobile +translation_of: Archive/Apps/Advanced_topics +--- +

Ces articles vous donnerons plus d'informations sur des sujets plus avancés concernant les applications Web.

+ +
+
+

Documentation sur l'architecture des applications

+ +
+
Architectures des Applications Web
+
Vue d'ensemble de l'architecture à la base du design et de l'implémentation d'un projet d'applications Web.
+
Spécificités de la plateforme pour l'installation d'une application
+
Il y a quelques différences dans la façon dont les applications web sont installées selon les diverses plateformes qui les supportent; cette article va vous aider à les comprendre.
+
Applications Web pour Android
+
Informations à propos de l'installation et du test d'une applications Web sur un appareil Android.
+
+ +

Autre documentation

+ +
+
Créer une plateforme de téléchargement d'applications en ligne
+
Informations utiles si vous voulez créer votre propre marché d'application en ligne pour vendre et distribuer des applications Web.
+
+ +

Tout Voir...

+
+ +
+

Tools for app developers
+ +
Technology reference documentation
+
+ +
+
Getting help from the community
+

If you still aren't sure how to do what you're trying to get done, feel free to join the conversation!

+ +

Don't forget about the netiquette...

+
+
+ +

 

diff --git a/files/fr/archive/apps/index.html b/files/fr/archive/apps/index.html new file mode 100644 index 0000000000..10bb499435 --- /dev/null +++ b/files/fr/archive/apps/index.html @@ -0,0 +1,8 @@ +--- +title: Apps +slug: Archive/Apps +translation_of: Archive/Apps +--- +

In progress. This page includes archived content for Apps, including obsolete web app content, Firefox OS app-related content, etc.

+ +

diff --git "a/files/fr/archive/b2g_os/add-ons/d\303\251velopper_des_add-ons_pour_firefox_os/index.html" "b/files/fr/archive/b2g_os/add-ons/d\303\251velopper_des_add-ons_pour_firefox_os/index.html" new file mode 100644 index 0000000000..0f7f9ab464 --- /dev/null +++ "b/files/fr/archive/b2g_os/add-ons/d\303\251velopper_des_add-ons_pour_firefox_os/index.html" @@ -0,0 +1,357 @@ +--- +title: Développer des modules pour B2G OS +slug: Archive/B2G_OS/Add-ons/Développer_des_add-ons_pour_Firefox_OS +tags: + - Apps + - CSS + - Extensions + - Firefox OS + - JavaScript + - Manifeste + - Modules + - personnalisations +translation_of: Archive/B2G_OS/Add-ons/Developing_B2G_OS_add-ons +--- +

+ +

Les modules sont un concept bien connu dans le monde des navigateurs web, et ce concept a été ajouté à Firefox OS. Un module Firefox OS unique peut étendre les fonctionalités d'une ou plusieurs applications, voire toutes les applications, en incluant les applications système. Cet article est un guide pour la création de votre propre module Firefox OS, avec des conseils, des astuces, et des informations à prendre en compte.

+ +
+

Note: Les modules Firefox OS utilisent le système d'extensions WebExtensionns, qui est largement basé sur les extensions de Chrome/Blink, donnant de nombreux avantages sur la façon dont les modules sont créés en terme d'interopérabilité et de fonctionalités. Pour en savoir plus, gardez un œil sur notre documentation grandissante sur WebExtensions.

+
+ +
+

Important : Les modules ne sont disponibles que sur Firefox OS 2.5+, et vous aurez besoin d'un nouveau build installé sur votre téléphone pour être sûr que vous avez un support pour le débogage d'extensions dans WebIDE, etc. Soyez sûr d'avoir mis à jour avec le dernier build (2015-27-08 ou plus) sur votre téléphone développeur avant de commencer à développer des modules Firefox OS.

+
+ +

Développer des modules

+ +

Les modules sont des paquets composés de Javascipt, CSS, et d'autres assets. Cependant, ils ne sont pas autonomes. À la place, le manifeste du module inclut des fonctionnalités spéciales qui définissent les applications auxquelles appliquer le module. Quand les applications sont lancées sur un appareil Firefox OS qui a un module installé, le module est injecté dans l'application qui concorde avec le modèle spécifié dans le champ du fichier manifest.json.

+ +

Les modules Firefox OS utilisent les mêmes syntaxe et structure dans leur code que la nouvelle école de modules Firefox utilisant l'API WebExtensions, qui est basée sur le modèle d'extensions de Chrome.

+ +

Un exemple simple

+ +

Pour comprendre les bases des modules Firefox OS, nous allons présenter un simple exemple qui ajoute une bannière a l'application système, sur laquelle on peut cliquer pour la cacher.

+ +

firefox os screenshot showing add-on banner

+ +

C'est vraiment basique et trivial, mais cela vous donnera ce qu'il faut pour commencer. Vous pouvez regarder le code de l'exemple sur Github, et installer le module sur votre appareil Firefox OS en clonant le dépôt localement, puis en utilisant WebIDE (voir la section Testing your add-on using WebIDE.) Vous pouvez distribuer le module en utilisant le Marketplace Firefox.

+ +

Sachez qu'un module Firefox OS peut faire bien plus que ce qui est listé ici. La documentation de WebExtensions comportera plus d'informations au fil du temps.

+ +

L'anatomie d'un module Firefox OS

+ +

Dans cette partie, nous allons parcourir le contenu du dépôt du module d'exemple, en expliquant chaque élément. La structure des dossiers ressemble à ça :

+ + + +

manifest.json

+ +

Remarquez qu'il y a deux fichiers de manifeste dans notre dossier d'exemple de module. Le premier, manifest.json, suit la structure de manifeste Chrome, et est placé dans l'archive extensions.zip avec le CSS, le Javascript et l'icône compris dans le module. Il peut contenir une large palette d'instructions (voir Chrome Manifest File Format), mais pour le moment nous allons nous concentrer sur une petite partie :

+ +
{
+  "manifest_version": 1,
+  "name": "Add-on banner",
+  "description": "Firefox OS add-on example",
+  "version": "1.0",
+  "author": "Chris Mills",
+  "content_scripts": [{
+    "matches": ["app://system.gaiamobile.org/index.html"],
+    "css": ["css/style.css"],
+    "js": ["js/index.js"]
+  }],
+  "icons": {
+    "128": "/icons/128.png"
+  }
+}
+ +

La plupart de ces champs sont assez explicites, mais nous allons voir les derniers.

+ +

Tout d'abord, le champ content_scripts désigne le code qui sera injecté dans les applications sur lesquelles le module est appliqué, en fournissant le chemin des fichiers CSS et Javascript dans les champs css et js. Le champ matches contient un modèle qui spécifie dans quelles applications le code sera injecté. Ce modèle peut prendre différentes formes (voir Chrome Match Patterns), mais pour l'instant nous spécifions simplement app://system.gaiamobile.org/index.html, ce qui affecte uniquement l'application système. Vous pourriez l'appliquer à toutes les applications en utilisant app://*/*.

+ +
+

Note : Vous pouvez désigner plusieurs scripts et feuilles de styles en incluant simplement plusieurs éléments dans les tableaux, par exemple "css": ["css/style.css", "css/more.css"].

+
+ +
+

Note : Firefox OS ne supporte pas le mot-clé de Chrome <all_urls>.

+
+ +

En bas du manifeste nous avons inclus le champ icons, voir la section suivante pour plus d'infos à ce sujet.

+ +

update.webapp

+ +
+

Note : Vous n'avez pas besoin du manifeste .webapp si vous voulez soumettre un module au Marketplace Firefox, simplement du fichier .zip

+
+ +

Le manifeste update.webapp est un manifeste de style Firefox OS, ce qui est sensiblement équivalent à un mini manifeste d'application empaquetée (voir Auto-publication d'applications empaquetées.)

+ +

Notre update.webapp ressemblera à ça :

+ +
{
+  "name" : "Add-on banner",
+  "description": "Firefox OS add-on example",
+  "developer": { "name": "Chris Mills" },
+  "package_path": "extension.zip",
+  "icons": {
+    "128": "/icons/128.png"
+  }
+}
+ +

Encore une fois, ceci est assez explicite.

+ +

Le champ le plus important ici est probablement package_path, qui référence l'archive qui contient l'extension.

+ +

Vous remarquerez que le champ icons est inclus ici de la même façon que dans manifest.json, update.webapp est le seul endroit où vous avez besoin des informations d'icônes pour le moment, mais nous vous recommendons de les inclure dans les deux au cas où cela deviendrait nécessaire. Le champ icons dirige vers l'icône du module pour être utilisé dans l'application Paramètres de Gaia.

+ +

Inclure une icône

+ +

Vous devez inclure au moins une icône et la référencer dans votre manifeste, autrement le manifeste ne sera pas validé. Voir la section de référence des icônes de Manifeste pour plus d'informations. 

+ +

CSS

+ +
+

Important : A cause du bug 1179536, injecter des feuilles de styles ailleurs que dans l'application système est impossible, cela fonctionnera tout de même pour ce tutoriel car le module n'affecte que l'application système, mais pour ajouter des règles de style à une autre application ou page web vous aurez besoin de modifier le style en utilisant JavaScript.

+
+ +

Il n'y a rien de spécial à propos du CSS dans cet exemple. La seule chose à garder à l'esprit est de faire attention aux noms de classe et sélecteurs de votre module pour ne pas entrer en conflit avec le CSS de/des application(s).

+ +

Par exemple, nous avons enveloppé notre bannière d'exemple dans une <div> avec la classe fxos-banner. Mais vous pourriez tout aussi bien utiliser votre propre code pour votre nom de classe.

+ +

JavaScript

+ +

Encore une fois, le ficher JavaScript qui fait fonctionner le module ne contient aucune fonctionnalité spéciale (voir le code source JavaScript sur Github). Il est injecté dans l'applicaction avec le CSS spécifié dans le fichier manifest.json.

+ +
+

Note : Le code du module est injecté à chaque fois qu'une application qui est référencée par le modèle du manifest.json est lancé. Il est aussi injecté quand les modules sont activés. Quand le module est injecté par le lancement de l'application, tous les fichiers du module sont injectés dans l'application avant que quoi que ce soit dans l'app ne soit initialisé, en incluant le DOM. C'est au développeur du module de gérer les différents cas de lancement (injection immédiate contre injection au lancement), il y a plus d'informations plus bas.

+
+ +

Plusieurs autres points sont abordés plus bas.

+ +

L'objet window

+ +

Les modules ne partagent qu'une représentation du contenu de window. En conséquence, tout ce qui est enregistré dans l'objet window par un module est indisponible dans le code de l'application. Cependant, tout ce qui est dans l'objet window par le code de l'application est disponible aux modules. Le DOM est accessible comme d'habitude.

+ +

Injection DOM

+ +

Vous pouvez utiliser les APIs JavaScript pour manipuler le DOM de l'application.

+ +

Injecter du code au bon moment

+ +

Vous devez être prudent pour gérer correctement les cas où un module est injecté dans une application après qu'elle ait été chargée. Un tel scénario peut se produire quand une application est déjà lancée et qu'un module qui la concerne est activé. Dans ce cas, un gestionnaire window.onload ne fonctionnera pas parce que l'événement DOMContentLoaded s'est déjà produit.

+ +

Pour l'instant, il n'existe pas de bonne solution à ce problème. En attendant, nous conseillons de vérifier si le DOM a été chargé ou non avant de définir un callback DOMContentLoaded. Ce modèle est utilisé dans la démo :

+ +
// En cas d'injection dans une appli déjà lancée au moment où
+// l'appli a été activée, l'initialiser simplement.
+if (document.documentElement) {
+  initialize();
+}
+
+// Sinon, nous devons attendre que le DOM soit prêt avant de
+// lancer l'initialisation car les modules sont en général (toujours ?)
+// injectés *avant* que `document.documentElement` ne soit défini.
+else {
+  window.addEventListener('DOMContentLoaded', initialize);
+}
+
+function initialize() {
+  // ...
+}
+
+ +

Empêcher les injections multiples

+ +

Enfin, pour empêcher un module d'être injecté à plusieurs reprises dans une instance unique d'application, nous devons vérifier si votre module est déjà présent ou non, de cette manière :

+ +
function initialize() {
+  if (document.querySelector('.fxos-banner')) {
+    // Déjà injectée, annulation.
+    return;
+  } else {
+    var body = document.querySelector('body');
+    var fxosBanner = document.createElement('div');
+    fxosBanner.classList.add('fxos-banner');
+    var bannerText = document.createElement('p');
+    var closeBtn = document.createElement('button');
+
+    fxosBanner.appendChild(bannerText);
+    fxosBanner.appendChild(closeBtn);
+    body.appendChild(fxosBanner);
+
+    closeBtn.textContent = 'X';
+    bannerText.textContent = 'Waouh, vous avez une extension installée !';
+
+    closeBtn.onclick = function() {
+      fxosBanner.parentNode.removeChild(fxosBanner);
+    }
+  }
+}
+
+ +

Ici donc, nous faisons usage de if (document.querySelector('.fxos-banner')) pour vérifier si la bannière d'exemple existe déjà. Dans l'affirmative, nous quittons la fonction. Si ce n'est pas le cas, la méthode querySelector() renvoie alors null, et nous exécutons le bloc de code qui crée la bannière.

+ +

Fonctions de gestion des applis dans les modules

+ +

Toutes les fonctions Apps et Mgmt se comportent avec les modules de la même façon qu'avec les applications. Notez cependant qu'elles ne sont disponibles pour les modules que lorsque ces derniers sont injectés dans une application certifiée possédant la permission webapps-manager spécifiée dans le manifeste.

+ +

En plus de ces fonctions, un callback onenabledstatechange est exposé aux modules qui sont activés et désactivés. Comme cet événement est déclenché pour tous les modules, il vous faut vérifier lequel d'entre-eux a été activé/désactivé avant de procéder à toute initialisation ou nettoyage.

+ +
navigator.mozApps.mgmt.addEventListener('enabledstatechange', function(event) {
+  var app = event.application;
+  if (app.manifestURL === 'https://origin.of.manifest/manifest.webapp') {
+    var wasEnabled = app.enabled;
+    // faire quelque chose de cette information
+  }
+});
+
+ +
+

Important :  En raison du bogue 1214155, il n'est pas possible d'ajouter le gestionnaire d'événement enabled state via navigator.mozApps.mgmt.onenabledstatechange = function() {...} : vous devez utiliser la méthode addEventListener comme mentionné ci-dessus.

+
+ +

extension.zip

+ +
+

Note : Le fichier extension.zip a été laissé dans le dépôt de démo principalement dans un but d'illustration ; la façon dont fonctionne le système est ainsi claire. En réalité, vous n'avez pas besoin d'inclure le zip dans votre répertoire car WebIDE va le générer à votre place lorsque vous installerez le module.

+
+ +

L'archive extension.zip contient le code de l'extension et est référencée dans le champ update.webapp package_path — C'est ainsi que Gecko trouve le code à installer. Archivés à l'intérieur, vous trouverez :

+ + + +

Le fichier manifest.json se trouve donc à l'intérieur de l'archive et sert à faire référence aux fichiers à injecter et à spécifier quelles sont les applications à affecter.

+ +

Tester votre module avec WebIDE

+ +

L'outil WebIDE de Mozilla est disponible par défaut dans Firefox pour ordinateur. Pour s'en servir afin d'installer des modules sur votre téléphone, suivez les étapes énumérées ci-dessous :

+ +
    +
  1. Assurez-vous d'avoir installé Firefox 43 ou plus récent (il s'agissait de Nightly au moment de la rédaction de cet article). Les modules ne sont pas pris en charge par WebIDE avant cette version.
    2. +
  2. Ouvrez votre navigateur puis l'outil WebIDE (cliquez sur le bouton WebIDE ou allez dans le menu Outils > Développement web > WebIDE.)
    3. +
  3. Vérifiez que le débogage distant est activé sur votre téléphone (Paramètres > Développeur > Définissez "Débogage via USB " sur "ADB et outils de développement".)
    4. +
  4. Branchez votre téléphone sur votre ordinateur avec un câble USB. Vérifiez que vous n'avez pas branché d'autres téléphones en même temps.
    5. +
  5. Dans l'interface de WebIDE, choisissez l'option Sélectionner l'environnement puis sélectionnez votre téléphone, celui-ci devant être listé dans la catégorie Périphériques USB.
    6. +
  6. À ce stade, votre téléphone devrait afficher une demande Autoriser la connexion de débogage USB ?. Choisissez Autoriser.
    7. +
  7. Sélectionnez l'option Ouvrir une application puis choisissez Ouvrir une application empaquetée...
    8. +
  8. Dans le sélecteur de fichiers qui apparaît, naviguez jusqu'au répertoire qui contient votre fichier de manifeste update.webapp et cliquez sur Ouvrir.
    9. +
  9. En supposant qu'il n'y ait aucun avertissement ni erreur, vous pouvez installer votre module sur votre appareil en cliquant sur le bouton "Lecture" situé au centre (Installer et lancer.)
    10. +
  10. Pour voir le module en action, activez-le en choisissant Paramètres > Modules > Module exemple > basculez la case à cocher en haut.
    11. +
+ +

Déboguer les modules

+ +

Il faut noter qu'à cause du bug 1185464 il n'est pas possible pour l'instant de déboguer les modules avec WebIDE.

+ +

Paramètres du module

+ +

Vous pouvez contrôler les modules de votre téléphone en allant dans Paramètres > Modules ; vous trouverez à cet endroit une liste de vos modules installés et vous pourrez voir plus d'informations sur chacun d'eux en tapant sur l'entrée correspondante.

+ +

firefox os screenshot showing a list of installed add-ons in the settings appinformation screen for an individual addon, with a list of apps this add-on affects, and controls to disable and delete the add-on

+ +

Activer/désactiver et supprimer des modules

+ +

Par défaut, les modules sont activés après leur installation s'ils sont installés depuis le Marketplace Firefox. Par contre, lorsqu'ils sont installés via WebIDE, ils sont désactivés par défaut.

+ +

Vous avez la possibilité d'activer/désactiver des modules manuellement par l'intermédiaire de la case à cocher qui se trouve en haut de la page individuelle du module (accessible dans Paramètres > Modules), ou par programmation en utilisant la fonction navigator.mozApps.mgmt.setEnabled() (voir cet exemple d'utilisation de setEnabled() sur Github.)

+ +

Vous pouvez supprimer totalement un module en tapant le bouton Supprimer qui se trouve sur les pages individuelles des applications.

+ +

Permissions

+ +

Les modules héritent toutes leurs permissions depuis leur application hôte. Demander des permissions dans le manifeste du module (voir update.webapp) n'aura aucun effet et n'exposera au module aucune API qui n'est pas disponible dans l'application hôte.

diff --git a/files/fr/archive/b2g_os/add-ons/index.html b/files/fr/archive/b2g_os/add-ons/index.html new file mode 100644 index 0000000000..f09b9d9a97 --- /dev/null +++ b/files/fr/archive/b2g_os/add-ons/index.html @@ -0,0 +1,108 @@ +--- +title: Modules B2G OS +slug: Archive/B2G_OS/Add-ons +tags: + - Add-ons + - Apps + - Extensions + - Firefox OS + - customizations +translation_of: Archive/B2G_OS/Add-ons +--- +

+ +
+

Note : Les modules B2G OS sont basés sur l'API WebExtensions qui est également prise en charge par Firefox pour ordinateur à partir de la version 42 et qui se base sur les APIs des extensions utilisées dans Chrome et Opera.

+
+ +

Prérequis

+ +

Pour commencer à développer des extensions, vous devez suivre les étapes ci-dessous pour effectuer la configuration.

+ +

 

+ +

1. Activer le débogage USB

+ +

 

+ +

Dans l'application Paramètres de l'appareil, sélectionnez Développeurs > Débogage via USB > ADB et outils de développement.  Vous devriez maintenant pouvoir déboguer les applications installées avec WebIDE, soit via un câble USB, soit en Wifi (câble USB non requis.)

+ +

3. Configurer WebIDE

+ +

L'outil WebIDE est un composant de Firefox et peut être utilisé pendant le développement pour installer des modules sur votre téléphone — voir Tester votre module avec WebIDE pour plus d'informations.

+ +

Voir aussi

+ +

Développer

+ + + +

 

+ +

Contribuer

+ + diff --git a/files/fr/archive/b2g_os/api/alarm_api/index.html b/files/fr/archive/b2g_os/api/alarm_api/index.html new file mode 100644 index 0000000000..8a71386e21 --- /dev/null +++ b/files/fr/archive/b2g_os/api/alarm_api/index.html @@ -0,0 +1,184 @@ +--- +title: Alarm API +slug: Archive/B2G_OS/API/Alarm_API +translation_of: Archive/B2G_OS/API/Alarm_API +--- +

{{DefaultAPISidebar("Alarm API")}}{{Non-standard_Header}}

+ +

The Alarm API allows applications to schedule actions to be run in the future. For example, some applications like alarm-clock, calendar or auto-update might need to utilize the Alarm API to trigger particular device behaviors at specified time points.

+ +

By itself, the Alarm API just allows to schedule alarms. An alarm is dispatched to applications through the System Message API, so applications which want to react to alarms have to register themselves to the alarm messages.

+ +

Alarms are set using the {{DOMxRef("Navigator.mozAlarms")}} object which is an instance of the {{DOMxRef("MozAlarmsManager")}} interface.

+ +
+

Note: The term alarm in the Alarms API is not the same as an alarm used by the Clock app. The Alarms API wakes up applications, the Clock wakes up humans. The Clock uses the Alarm API to be notified when the time is right to wake up humans.

+
+ +

Schedule alarms

+ +

The first things to do when using alarm is to schedule alarms. There are two kind of alarms based on the respect of the time zone. In both case it's done using the {{DOMxRef("MozAlarmsManager.add()")}} method.

+ +
+

Note: If an alarm is not targeted at a specific application, the system will dispatch all the alarms to all the applications listening for alarms.

+
+ +
+

Note: You need to use the same URL for setting and receiving an alarm. For example, If you invoke navigator.mozAlarms.add() on foo.html or index.html?foo=bar, but have { "alarm": "/index.html" } in your manifest messages field, you'll never receive the alarm.

+
+ +

Alarms ignoring time zones

+ +

Those kind of alarms is dispatched based on the local time of the device. If the user of the device changes its time zone, the alarm will be dispatched based on the new time zone. For example, if a user is in Paris and sets an alarm that should be dispatched at 12 PM CET (Central European Time) and that user travels to San Francisco, the alarm will be dispatched at 12 PM PDT (Pacific Daylight Time).

+ +
// This the date to schedule the alarm
+var myDate  = new Date("May 15, 2012 16:20:00");
+
+// This is arbitrary data pass to the alarm
+var data    = {
+  foo: "bar"
+}
+
+// The "ignoreTimezone" string is what make the alarm ignoring it
+var request = navigator.mozAlarms.add(myDate, "ignoreTimezone", data);
+
+request.onsuccess = function () {
+  console.log("The alarm has been scheduled");
+};
+
+request.onerror = function () {
+  console.log("An error occurred: " + this.error.name);
+};
+ +

Alarms honoring time zones

+ +

Those kind of alarms are dispatched based on the time in the time zone that defines when the alarm has been scheduled. If for some reason, the user of the device changes its time zone the alarm will be dispatched based on the original time zone. For example, if a user is in Paris and set an alarm that should be dispatched at 12pm CET (Central European Time) and if that user travel to San Francisco, the alarm will be dispatched at 3 AM PDT (Pacific Daylight Time).

+ +
// This the date to schedule the alarm
+var myDate  = new Date("May 15, 2012 16:20:00");
+
+// This is arbitrary data pass to the alarm
+var data    = {
+  foo: "bar"
+}
+
+// The "honorTimezone" string is what make the alarm honoring it
+var request = navigator.mozAlarms.add(myDate, "honorTimezone", data);
+
+request.onsuccess = function () {
+  console.log("The alarm has been scheduled");
+};
+
+request.onerror = function () {
+  console.log("An error occurred: " + this.error.name);
+};
+ +

Managing alarms

+ +

Once an alarm is scheduled, it's still possible to manage it.

+ +

The {{DOMxRef("MozAlarmsManager.getAll()")}} method will return the complete list of alarms currently scheduled by the application. This list is an Array of {{anch("mozAlarm")}} objects.

+ +

mozAlarm

+ +

{{page("/en-US/docs/Web/API/MozAlarmsManager.getAll","mozAlarm")}}

+ +
var request = navigator.mozAlarms.getAll();
+
+request.onsuccess = function () {
+  this.result.forEach(function (alarm) {
+    console.log('Id: ' + alarm.id);
+    console.log('date: ' + alarm.date);
+    console.log('respectTimezone: ' + alarm.respectTimezone);
+    console.log('data: ' + JSON.stringify(alarm.data));
+  });
+};
+
+request.onerror = function () {
+  console.log("An error occurred: " + this.error.name);
+};
+ +

The {{DOMxRef("MozAlarmsManager.remove")}} method is used to unschedule an existing alarm.

+ +
var alarmId;
+
+// Set an alarm and store it's id
+var request = navigator.mozAlarms.add(new Date("May 15, 2012 16:20:00"), "honorTimezone");
+
+request.onsuccess = function () {
+  alarmId = this.result;
+}
+
+// ...
+
+// Later on, removing the alarm if it exists
+if (alarmId) {
+  navigator.mozAlarms.remove(alarmId);
+}
+ +

Handling alarms

+ +

Any application can react when an alarm is dispatched by the system. In order to be able to handle any alarms, an application must register itself as an alarm handler. This is done through the System Messaging API in two steps:

+ +

First, the applications must include alarm to the messages property of its application manifest with the URL to the document which registers the callback function to be used when an alarm is dispatched.

+ +
"messages": [
+  { "alarm": "/index.html" }
+]
+ +

Second, the application must bind a callback function with the alarm message. This is done using the {{DOMxRef("Navigator.mozSetMessageHandler()")}} method. This callback function will receive a {{Anch("mozAlarm")}} object containing the data attached to the alarm.

+ +
navigator.mozSetMessageHandler("alarm", function (mozAlarm) {
+  alert("alarm fired: " + JSON.stringify(mozAlarm.data));
+});
+ +

If an application wants to know if there is a pending alarm at the system level, it's possible to use the {{DOMxRef("Navigator.mozHasPendingMessage()")}} method with the value alarm.

+ +
navigator.mozHasPendingMessage("alarm");
+ +

Permissions for the Alarm API

+ +

Please note that while the Alarm API is not privileged or certified, you should still include permissions and messages entries in your manifest.webapp file when including it in an installable open Web app.

+ +
{
+  "permissions": {
+    "alarms": {
+      "description": "Required to schedule alarms"
+    }
+  },
+  "messages": [
+    { "alarm": "/index.html" }
+  ]
+}
+ +

Specifications

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName("Alarm API")}}{{Spec2("Alarm API")}}Initial specification.
+ +

Browser compatibility

+ +

Supported in Firefox OS 1.0.1.

+ +

See also

+ + diff --git a/files/fr/archive/b2g_os/api/api_contacts/index.html b/files/fr/archive/b2g_os/api/api_contacts/index.html new file mode 100644 index 0000000000..01422c1af0 --- /dev/null +++ b/files/fr/archive/b2g_os/api/api_contacts/index.html @@ -0,0 +1,272 @@ +--- +title: API Contacts +slug: Archive/B2G_OS/API/API_Contacts +tags: + - API + - B2G + - Contact + - Contacts + - Firefox OS + - Guide +translation_of: Archive/B2G_OS/API/Contacts_API +--- +

+

Non standard
+ Cette fonctionnalité n'est pas en voie de standardisation au W3C, mais elle est supportée par la plateforme Firefox OS. Bien que son implémentation puisse changer dans le futur et qu'elle n'est pas largement supportée par les différents navigateurs, elle est utilisable pour du code dédié aux applications Firefox OS.

+

+ +

+

Cette API est disponible sur Firefox OS pour des applications privilégiées ou certifiées seulement.

+

+ +

Résumé

+ +

L'API Contacts fournit une interface simple pour gérer les contacts des utilisateurs enregistrés dans le carnet d'adresses du système. Un cas pratique typique de l'API Contacts est l'implémentation d'une application de gestion de carnet d'adresses.

+ +
+

Note : Comme les informations personnelles des contacts utilisateurs constituent des données sensibles, seules les applications certifiées et privilégiées sont autorisées à accéder à cette API. L'utilisation des Activités Web pour déléguer les opérations sur les contacts est préconisée pour les autres applications.

+
+ +

Gestion des contacts

+ +

Les contacts enregistrés dans le carnet d'adresses du système sont accessibles par l'intermédiaire de la propriété navigator.mozContacts, elle-même étant une instance de l'interface ContactManager.

+ +

Ajout d'un contact

+ +

La création d'une nouvelle entrée dans le carnet d'adresses du système se fait en deux étapes :

+ +
    +
  1. Instanciez un nouvel objet mozContact et remplissez toutes les propriétés nécéssaires. L'interface mozContact définit toutes les propriétés possibles pour un contact donné. Ces propriétés sont essentiellement les mêmes que celles définies dans la spécification vCard 4.0, avec les exceptions suivantes : +
      +
    • L'attribut vCard N est divisé en cinq propriétés : familyName, givenName, additionalName, honorificPrefix, honorificSuffix
      • +
    • L'attribut vCard FN a été renommé name
      • +
    • L'attribut vCard GENDER est divisé en deux propriétés : sex, genderIdentity
      • +
    • Faîtes attention : la plupart des propriétés sont des tableaux. Firefox v1.3 vérifie cela de manière bien plus stricte et par conséquent du code qui fonctionnait avec Firefox v1.2 peut ne plus s'exécuter avec Firefox v1.3 à cause de ça.
      • +
    +
    2. +
  2. Utilisez la méthode ContactManager.save() avec l'objet contact comme premier paramètre. La méthode renvoie un DOMRequest pour conserver une trace de la réussite ou de l'échec de l'opération d'enregistrement.
    3. +
+ +
// première méthode : définir les propriétés directement
+var person = new mozContact();
+person.givenName  = ["John"];
+person.familyName = ["Doe"];
+person.nickname   = ["No kidding"];
+
+// seconde méthode : utilisation d'un objet
+var contactData = {
+  givenName: ["John"],
+  familyName: ["Doe"],
+  nickname: ["No kidding"]
+};
+
+var person = new mozContact(contactData); // Firefox OS 1.3 prend un paramètre pour initialiser l'objet
+if ("init" in person) {
+  // Firefox OS 1.2 et précédents utilisent une méthode "init" pour initialiser l'objet
+  person.init(contactData);
+}
+
+// enregistre le nouveau contact
+var saving = navigator.mozContacts.save(person);
+
+saving.onsuccess = function() {
+  console.log('nouveau contact enregistré');
+  // Cela actualise la personne telle qu'elle est enregistrée
+  // Elle comporte son ID interne unique
+  // Notez que saving.result est null ici
+};
+
+saving.onerror = function(err) {
+  console.error(err);
+};
+
+ +

Recherche d'un contact

+ +

Deux méthodes permettent de récupérer un contact depuis le carnet d'adresses du système :

+ + + +

Les deux méthodes attendent un paramètre qui est un objet défiinissant les options de filtres et de tri. ContactManager.getAll n'accepte que les options de tri. Ces dernières sont :

+ + + +

Et les options de filtre :

+ + + +

find renvoie un objet DOMRequest et getAll retourne un objet DOMCursor pour connaître la réussite ou l'échec d'une recherche.

+ +

Si la recherche réussit, son résultat est disponible dans la propriété DOMRequest.result, soit dans un tableau d'objets mozContact pour find, soit dans un unique objet mozContact pour getAll. Pour obtenir le résultat suivant dans la liste obtenue avec getAll, appelez la méthode continue() du curseur.

+ +
var options = {
+  filterValue : "John",
+  filterBy    : ["givenName","name","nickName"],
+  filterOp    : "contains",
+  filterLimit : 1,
+  sortBy      : "familyName",
+  sortOrder   : "ascending"
+}
+
+var search = navigator.mozContacts.find(options);
+
+search.onsuccess = function() {
+  if (search.result.length === 1) {
+    var person = search.result[0];
+    console.log("Trouvé :" + person.givenName[0] + " " + person.familyName[0]);
+  } else {
+    console.log("Désolé, il n'y a pas de tel contact.")
+  }
+};
+
+search.onerror = function() {
+  console.warn("Aïe ! Quelque chose ne va pas, aucun résultat !");
+};
+
+var allContacts = navigator.mozContacts.getAll({sortBy: "familyName", sortOrder: "descending"});
+
+allContacts.onsuccess = function(event) {
+  var cursor = event.target;
+  if (cursor.result) {
+    console.log("Trouvé : " + cursor.result.givenName[0] + " " + cursor.result.familyName[0]);
+    cursor.continue();
+  } else {
+    console.log("Pas d'autre contact");
+  }
+};
+
+allContacts.onerror = function() {
+  console.warn("Quelque chose s'est mal passée ! :(");
+};
+
+ +

Mise à jour d'un contact

+ +

Lors de l'obtention d'un contact par l'intermédiaire de find() ou de getAll() (ou après un appel réussi à save() pour un nouveau contact), celui-ci se voit attribuer des méta-données :

+ + + +

Actualiser un contact revient globalement à modifier les valeurs de ses propriétés puis à l'enregistrer via un appel à la méthode save().

+ +
+

Note : À chaque fois qu'un contact est ajouté, mis à jour ou supprimé, un événement contactchange est déclenché afin d'avoir un suivi de tous les changements apportés au carnet d'adresses du système. Cet événement peut être géré avec la propriété ContactManager.oncontactchange.

+
+ +

Suppression d'un contact

+ +

Un appel à la méthode ContactManager.remove() va tout simplement supprimer l'objet mozContact qui lui a été transmis.

+ +

Dans certains cas limites, il est aussi possible de se débarrasser de tous les contacts. Pour cela, utilisez ContactManager.clear(). Soyez prudent lors de l'appel de cette méthode ; il n'est pas possible de revenir en arrière.

+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + + + +
SpécificationÉtatCommentaire
Contacts Manager API
La définition de 'Contacts Manager API' dans cette spécification.		Obsolete 
vCard Format SpecificationIETF RFCRFC 6350
+ +

Compatibilité des navigateurs

+ +

Nous convertissons les données de compatibilité dans un format JSON. + Ce tableau de compatibilité utilise encore l'ancien format + car nous n'avons pas encore converti les données qu'il contient. + Vous pouvez nous aider en contribuant !

+ +
+ + +

+ +
+ + + + + + + + + + + + + + + + + + + +
CaractéristiqueChromeFirefox (Gecko)Internet ExplorerOperaSafari
support basiquePas de supportPas de supportPas de supportPas de supportPas de support
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
CaractéristiqueAndroidChrome pour AndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari Mobile
basic supportPas de supportPas de support18.01.1Pas de supportPas de supportPas de support
+
+ +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/api/bluetoothstatuschangedevent/index.html b/files/fr/archive/b2g_os/api/bluetoothstatuschangedevent/index.html new file mode 100644 index 0000000000..8474dbd5f8 --- /dev/null +++ b/files/fr/archive/b2g_os/api/bluetoothstatuschangedevent/index.html @@ -0,0 +1,59 @@ +--- +title: BluetoothStatusChangedEvent +slug: Archive/B2G_OS/API/BluetoothStatusChangedEvent +translation_of: Archive/B2G_OS/API/BluetoothStatusChangedEvent +--- +

{{ apiref("Bluetooth API") }}

+ +

{{ non-standard_header() }}

+ +

{{ B2GOnlyHeader2('certified') }}

+ +

Sommaire

+ +

L'API BluetoothStatusChangedEvent donne accès aux informations de modification du statut de l'équipement Bluetooth.

+ +

Une modification du statut a lieu lorsqu'un des évènements suivants est détecté :

+ + + +

Interface overview

+ +
interface BluetoothStatusChangedEvent: Event
+{
+  readonly attribute DOMString address;
+  readonly attribute boolean status;
+};
+ +

Properties

+ +
+
{{domxref("BluetoothStatusChangedEvent.address")}} {{readonlyinline}}
+
A string representing the address of the device for which the status has changed in the Bluetooth micro-network.
+
{{domxref("BluetoothStatusChangedEvent.status")}} {{readonlyinline}}
+
A boolean representing the current status of the connection. It can be enabled (true) or disabled (false).
+
+ +

Methods

+ +

None.

+ +

Specification

+ +

Not part of any specification yet. It should be discussed as part of the W3C's System Applications Working Group.

+ +

See also

+ + diff --git a/files/fr/archive/b2g_os/api/callevent/index.html b/files/fr/archive/b2g_os/api/callevent/index.html new file mode 100644 index 0000000000..9b140224a9 --- /dev/null +++ b/files/fr/archive/b2g_os/api/callevent/index.html @@ -0,0 +1,130 @@ +--- +title: CallEvent +slug: Archive/B2G_OS/API/CallEvent +translation_of: Archive/B2G_OS/API/CallEvent +--- +

+ +

+

Non standard
+ Cette fonctionnalité n'est ni standard, ni en voie de standardisation. Ne l'utilisez pas pour des sites accessibles sur le Web : elle ne fonctionnera pas pour tout utilisateur. Il peut également y avoir d'importantes incompatibilités entre les implémentations et son comportement peut être modifié dans le futur.

+

+ +

+

Cette API est disponible sur Firefox OS pour des applications internes seulement.

+

+ +

L'interface CallEvent de l'API Web Téléphony représente les événements liés aux appels téléphoniques.

+ +

Propriétés

+ +
+
CallEvent.call Lecture seule
+
Un objet TelephonyCall représantant l'appel à l'origine de l'événement.
+
+ +

Examples

+ +
// Telephony object
+var tel = navigator.mozTelephony;
+
+// Receive a call
+tel.onincoming = function(e) {
+  var incomingCall = e.call;
+
+  // Answer the call
+  incomingCall.answer();
+};
+ +

Specifications

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
Web TelephonyProjetDraft
+ +

Browser compatibility

+ +

For obvious reasons, support is primarily expected on mobile browsers.

+ +

Nous convertissons les données de compatibilité dans un format JSON. + Ce tableau de compatibilité utilise encore l'ancien format + car nous n'avons pas encore converti les données qu'il contient. + Vous pouvez nous aider en contribuant !

+ +
+ + +

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic supportPas de supportPas de supportPas de supportPas de supportPas de support
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OS (Gecko)IE MobileOpera MobileSafari Mobile
Basic supportPas de support12.0 (12.0)1.0.1Pas de supportPas de supportPas de support
+
+ +

See also

+ + diff --git a/files/fr/archive/b2g_os/api/data_store_api/index.html b/files/fr/archive/b2g_os/api/data_store_api/index.html new file mode 100644 index 0000000000..8eabb360a4 --- /dev/null +++ b/files/fr/archive/b2g_os/api/data_store_api/index.html @@ -0,0 +1,203 @@ +--- +title: Data Store API +slug: Archive/B2G_OS/API/Data_Store_API +tags: + - API + - Certified + - Firefox OS + - Interface + - Non-standard + - Obsolete + - Reference + - WebAPI +translation_of: Archive/B2G_OS/API/Data_Store_API +--- +
+
+

Non-standard
+ Cette fonctionnalité ne fait pas partie des normes actuelles du W3C, mais elle est prise en charge sur la plate-forme Firefox OS. Bien que les implémentations puissent changer à l'avenir et qu'il ne soit pas largement pris en charge par les navigateurs, il convient pour une utilisation dans le code dédié aux applications Firefox OS.

+
+ +
+

Cette API est disponible sur Firefox OS pour les applications internes uniquement.

+
+
+ +
+

L'API Data Store fournit un mécanisme de stockage puissant et flexible que les applications Firefox OS peuvent utiliser pour stocker et partager des données. Il s’agit en fait d’un magasin intermédiaire permettant à plusieurs applications de partager des données entre elles rapidement, efficacement et en toute sécurité, malgré les différences entre les structures de données des API, les formats, etc.

+
+ +

Concepts et usages

+ +

L'API Data Store a été créée pour permettre à plusieurs applications Firefox OS, avec des structures de données et des mécanismes de stockage potentiellement différents, de créer, de maintenir et de partager efficacement les mêmes objets de données entre elles. Chaque application peut ensuite importer les données dans sa propre base IndexedDB locale pour indexer en fonction de leurs besoins en matière de requête. Cela n'est toutefois pas nécessaire et vous pouvez simplement écrire directement dans le magasin de données de l'API du magasin de données.

+ +
+

Note: Pour plus d'informations concernant le fonctionnement de l'API Data Store avec des exemples, consultez notre article Utiliser l'API Data Store.

+
+ +
+

Note: L'API Data Store est disponible dans Web Workers, à partir de Firefox 32 (Firefox OS 2.0; voir bug 949325.)

+
+ +

Il y a plusieurs raisons d'utiliser cette API, comme :

+ + + +

Chaque data store appartient à une application spécifique (comme spécifié par le champ datastores-owned dans le manifeste de l'application - voir Manifest_fields, ci-dessous). Cette propriété donne à l'application le droit de remplir le data store et de déclarer si le magasin de données est readonly (ce qui signifie que les autres applications ne peuvent lire que les données) ou readwrite (ce qui signifie que d'autres applications peuvent modifier les données ainsi que les lire.) Les autres applications peuvent accéder à un data store en le nommant dans le champ datastores-access de son manifeste. 

+ +

Lorsqu'une application souhaite accéder à un data store, elle doit appeler Navigator.getDataStores(). La valeur résultante de cette méthode est un objet Promise qui sera résolu avec un tableau d'objets DataStore. À partir de ces objets DataStore, l'application peut lire et modifier des valeurs à l'aide de différentes méthodes du DataStore telles que DataStore.get() et DataStore.insert().

+ +
+

Note: L'API Data Store n'impose pas pour le moment de limitations sur l'espace de stockage. Cela sera surement changé dans un futur proche.

+
+ +

Gestion du changement et résolution des conflits

+ +

Quand plusieurs applications effectuent des changements dans un data store, cela peut créer des conflits. Cependant, toutes les modifications effectuées ( en utilisant DataStore.update(), DataStore.add(), reçoivent un revisionId, un UUID reçu dans l'évenement change est déclenché chaque fois qu'une opération est effectuée sur le data store par une application ayant accès à celui-ci. Cela peut être lu à partir de la propriété DataStore.revisionId

+ +

La propriété revisionId peut être incluse en tant que paramètre facultatif dans les méthodes DataStore.add(), DataStore.put(), DataStore.remove(), DataStore.clear(), and DataStore.sync(). Elles utilisent essentiellement revisionId pour éviter les conflit - l'opération est annulée si cette revisionId n'est pas la dernière connue par le data store (c'est-à-dire si une autre application a apporté une modification plus récente).

+ +

Lorsque l'événement change est déclenché, il reçoit un objet DataStoreChangeEvent, donnant à l'application l'accès à:

+ + + +

Quand une application veut savoir ce qui a changé, elle peut le faire en demandant le "delta" entre le dernier revisionId et l'actuel. Cela s'effectue avec la méthode DataStore.sync() . Vous pouvez autoriser votre application à gérer les changements des données en utilisant sync() lors du démarage de l'application et onchange en lui passant lerevisionId actuel pour vérifier de nouveau.

+ +

Filtrage des donnée

+ +

Comme indiqué ci-dessus, l'API Data Store n'est pas responsable du filtrage des données ni de la création d'index. Au lieu de cela, elle laisse cela au mécanisme de stockage local de l'application (généralement  IndexedDB); L'API Data Store permet simplement de mettre à jour les index locaux, via l'objet DataStoreCursor, créé lors de l'appel de sync().

+ +

Champs du manifest

+ +

Le manifest propriétaire du data store DOIT inclure le champ datastores pourrevendiquer la propriété, par exemple :

+ +
"datastores-owned": {
+  "myData": {
+    "access": "readwrite",
+    "description": "mon data store"
+  }
+}
+
+ +

Vous pouvez inclure différentes propriétés pour représenter différents data stores, et chacun peut utiliser readonly/readwrite pour spécifier si le data store peut être lu / modifié par d'autres applications. Une description est également incluse pour décrire le data store.

+ +

Les autres application qui veulent accèder au data store mais qui ne leur appartient pas doivent inclure le champdatastores-access , par exemple :

+ +
"datastores-access": {
+  "myData": {
+    "access": "readonly",
+    "description": "Lire et modifier mon data store"
+  }
+}
+
+ +

Sans ce champ, la réponse par défaut est "no access". Encore, plusieurs propriétées peuvent être incluses si vous voulez accèder à plusieurs data stores, et un accès readonly ou readwrite peut être mis pour déclarer le type d'accès dont l'application a besoin.

+ +

En termes de permissions, le propriétaire du data store gagne toujours contre les applications tières. Si le propriétaire déclare "readonly": true dans le manifest, toutes les applications tières seront readonly, même si elles déclarent "access": "readwrite" dans leur manifest. Bien sûr, cela n’est pas très utile si le propriétaire autorise la modification du magasin de données par des applications tierces. Pour le moment, Data Store est une API certifiée. Il est probable que les privilèges reviendront à la finalisation du modèle de sécurité.

+ +
+

Note: Rappelez-vous également que dans de tels cas, vous devez utiliser le champ type de votre manifeste pour déclarer explicitement que votre application est une application interne / certifiée : "type": "certified".

+
+ +

Interfaces de l'API Data Store

+ +

L'API Data Store contient les interfaces suivantes :

+ +
+
DataStore
+
L'interface DataStore représente  un ensemble de données récupérées, et inclut des propriétés standards pour accèder au nom du store, le propriétaire, etc. mais aussi des méthodes pour lire, modifier et syncroniser les données, et le gestionnaire d'évenements  onchange pour réagire aux changements dans les données.
+
DataStoreCursor
+
Cette interface permet à l'application de parcourir une liste d'objets  DataStoreTask représentant l'historique des changements du data store, pour utiliser lors de la syncronisation des données.
+
DataStoreChangeEvent
+
Cette interface représente l'évenement lié à un enregistrement changé dans le data store, par exemple elle est renvoyée une fois qu'une modification est effectuée et que l'événement change est déclenché (voir DataStore.onchange pour le gestionnaire), à utiliser lors de la synchronisation de modifications individuelles.
+
DataStoreTask
+
Cette interface représente un enregistrement changé dans le data store quand  est utilisé pour parcourir l'historique des modifications du data store.
+
+ +

Exemples

+ +

Nous avons écrit quelques exemples qui vont ensemble, pour expliquer comment différentes applications peuvent avoir différents usages du même data store :

+ + + +

Continuez à vous référer à ces exemples et lisez Utilisation de l'API Data Store pour des explications et des exemples de code.

+ +
+

Note: Sachez que pour tester des exemples de magasin de données, vous devez vous assurer que vos applications sont internes / certifiées (voir ci-dessus pour les champs de manifeste nécessaires) et utilisez App Manager ou WebIDE pour simuler un environnement dans lequel une application interne / certifiée peut être exécutée. Suivez ces liens pour savoir comment faire cela en utilisant chaque outil: App Manager: Debugger les applications certifiées et WebIDE: Debugger les applications certifiées.

+
+ +

Caractéristiques

+ + + + + + + + + + + + + + +
CaractéristiquesStatutCommentaires
API Data StoreBrouillon
+ + + +

La discussion concernant la création de cette API a eu lieu dans diverses listes de diffusion Mozilla et ailleurs. Vous trouverez un résumé de la discussion et d'autres indications sur le Wiki de Mozilla. Pour plus d'informations et de questions, envoyez un courrier à la liste de diffusion dev-webapi.

+ +

Compatibilité

+ +
Supporté dans Firefox OS 1.0.1.
+ +
Disponible dans web workers dans Firefox OS 2.0.
+ +

Voir aussi

+ + + + diff --git a/files/fr/archive/b2g_os/api/domapplication/index.html b/files/fr/archive/b2g_os/api/domapplication/index.html new file mode 100644 index 0000000000..59dc92f290 --- /dev/null +++ b/files/fr/archive/b2g_os/api/domapplication/index.html @@ -0,0 +1,106 @@ +--- +title: App +slug: Archive/B2G_OS/API/DOMApplication +tags: + - API Apps + - Apps +translation_of: Archive/B2G_OS/API/DOMApplication +--- +

+

Non standard
+ Cette fonctionnalité n'est ni standard, ni en voie de standardisation. Ne l'utilisez pas pour des sites accessibles sur le Web : elle ne fonctionnera pas pour tout utilisateur. Il peut également y avoir d'importantes incompatibilités entre les implémentations et son comportement peut être modifié dans le futur.

+

+ +

Dans l'API JavaScript Open Web Apps, un objet App est un objet JavaScript qui représente une application qui a été, ou pourrait être, installée par l'utilisateur.

+ +

Propriétés

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NomDescriptionType
manifestL'instance actuellement stockée du manifeste de l'application.object
manifestURLOù le manifeste a été trouvé.string
originL'origine de l'application (protocole, hôte, et numéro du port facultatif). Par exemple : http://example.comstring
installOriginL'origine du site qui a déclenché l'installation de l'application.string
installTimeQuand a été installée l'application. Généré à partir de Date().getTime(), représentant le nombre de millisecondes depuis le 1er janvier 1970 à minuit.integer
receiptsUn objet contenant un tableau d'un ou plusieurs reçus. Chaque reçu est une chaîne de caractères. Si il n'y a aucun reçu, sa valeur est null.object ou null
+ +

Méthodes

+ + + + + + + + + + + + + + + + + + + + + + +
MéthodeDescription
launch()Lance l'application. Ne renvoie aucune valeur.
uninstall()Désinstalle l'application, inclus la suppression des ressources locales. Une confirmation par l'utilisateur peut être nécessaire. Renvoie un objet pendingUninstall.
checkForUpdate()Pour les applications empaquetées. Vérifie si l'application empaquetée a été mise à jour. Renvoie un objet DOMRequest.
+ +

Exemple d'un objet App

+ +
{
+  manifest: {
+    name: "Add-on Builder",
+    default_locale: "en",
+    installs_allowed_from: [
+      "https://apps-preview-dev.example.com/",
+      "https://apps-preview.example.com/"
+    ],
+    description: "Add-on Builder makes it easy to write, build and test Firefox extensions using common web technologies.",
+    version: "0.9.16.1",
+    developer: {
+      url: "https://builder.addons.mozilla.org/",
+      name: "Mozilla Flightdeck Team"
+    }
+  },
+  origin: "https://builder-addons-dev.example.com",
+  installTime: 1321986882773,
+  installOrigin: "https://apps-preview-dev.example.com",
+  receipts: ["h0dHBzOi8v (la majorité du reçu a été supprimée) Tg2ODtkUp"]
+}
diff --git a/files/fr/archive/b2g_os/api/domrequest/error/index.html b/files/fr/archive/b2g_os/api/domrequest/error/index.html new file mode 100644 index 0000000000..97e50b6908 --- /dev/null +++ b/files/fr/archive/b2g_os/api/domrequest/error/index.html @@ -0,0 +1,38 @@ +--- +title: DOMRequest.error +slug: Archive/B2G_OS/API/DOMRequest/error +tags: + - DOM +translation_of: Archive/B2G_OS/API/DOMRequest/error +--- +
+ +

This property can contain error information in a DOMError object.

+ +

Note: This feature is available in Web Workers.

+ +

Syntax

+ +
var errorname = request.error.name;
+
+ +

Where request is a DOMRequest object. This gets the name of the error. See DOMError for the error types.

+ +

Specifications

+ +

Not part of any current specification.

+ +

Browser compatibility

+ +

Supported in Firefox 13.
+ Available in workers in Firefox 41.

+ +

See also

+ + diff --git a/files/fr/archive/b2g_os/api/domrequest/index.html b/files/fr/archive/b2g_os/api/domrequest/index.html new file mode 100644 index 0000000000..6fb4e8f968 --- /dev/null +++ b/files/fr/archive/b2g_os/api/domrequest/index.html @@ -0,0 +1,97 @@ +--- +title: DOMRequest +slug: Archive/B2G_OS/API/DOMRequest +tags: + - DOM + - Référence_du_DOM_Gecko +translation_of: Archive/B2G_OS/API/DOMRequest +--- +

{{ ApiRef() }}

+

{{ non-standard_header() }}

+

Un objet DOMRequest représente une opération en cours. Il fournit des callbacks qui sont appelés quand l'operation est finit, ainsi qu'une reférence au résultat de l'opération. Une méthode DOM qui initie une opération se poursuivant au cours du temps, retounera un objet DOMRequest que vous pouvez surveiller pour connaitre le déroulement de l'opération

+

Attributs

+
+
+ {{ domxref("DOMRequest.onsuccess") }}
+
+ Pour définir un callback à appeler quand l'opération représentée par DOMRequest est terminée
+
+ {{ domxref("DOMRequest.onerror") }}
+
+ Pour définir un callback qui sera appelé si une erreur survient pendant le déroulement de l'opération.
+
+ {{ domxref("DOMRequest.readyState") }}
+
+ Une chaîne de caractère indiquant si l'opération tourne toujours. Sa valeur est soit "done" ou "pending".
+
+ {{ domxref("DOMRequest.result") }}
+
+ Le résultat de l'opération.
+
+ {{ domxref("DOMRequest.error") }}
+
+ Information de l'erreur, si présent.
+
+

Exemple

+

Un exemple de l'utilisation des propriétés onsuccess, onerror, result et error de l'objet DOMRequest.

+
var pending = navigator.mozApps.install(manifestUrl);
+pending.onsuccess = function () {
+  // Enregistre l'objet App renvoyé
+  var appRecord = this.result;
+  alert('Installation réussie !');
+};
+pending.onerror = function () {
+  // Affiche le nom de l'erreur
+  alert('Installation échouée, erreur : ' + this.error.name);
+};
+
+

Compatibilité des navigateurs

+

{{ CompatibilityTable() }}

+
+ + + + + + + + + + + + + + + + + + + +
FonctionChromeFirefox (Gecko)Internet ExplorerOperaSafari
Support de base{{ CompatUnknown() }}{{ CompatGeckoDesktop("13.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+
+ + + + + + + + + + + + + + + + + + + + + +
FonctionAndroidChrome pour AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Support de base{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatGeckoMobile("13.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+

Spécification

+

Ne fait actuellement partie d'aucune spécification

diff --git a/files/fr/archive/b2g_os/api/domrequest/onerror/index.html b/files/fr/archive/b2g_os/api/domrequest/onerror/index.html new file mode 100644 index 0000000000..81160a27cb --- /dev/null +++ b/files/fr/archive/b2g_os/api/domrequest/onerror/index.html @@ -0,0 +1,74 @@ +--- +title: DOMRequest.onerror +slug: Archive/B2G_OS/API/DOMRequest/onerror +tags: + - DOM + - Référence_du_DOM_Gecko +translation_of: Archive/B2G_OS/API/DOMRequest/onerror +--- +

{{ ApiRef() }}

+

{{ non-standard_header() }}

+

Résumé

+

Cette propriété renseigne la fonction de callback à appeler quand un {{ domxref("DOMRequest") }} échoue.

+

Syntaxe

+
requete.onerror = fonction;
+
+

Où requete est un objet {{ domxref("DOMRequest") }} et fonction est une fonction JavaScript à éxecuter quand la requête ne parvient pas à se terminer sans problème.

+

Spécification

+

Ne fait actuellement partie d'aucune spécification.

+

Compatibilité des navigateurs

+

{{ CompatibilityTable() }}

+
+ + + + + + + + + + + + + + + + + + + +
FonctionChromeFirefox (Gecko)Internet ExplorerOperaSafari
Support de base{{ CompatUnknown() }}{{ CompatGeckoDesktop("13.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+
+ + + + + + + + + + + + + + + + + + + + + +
FonctionAndroidChrome pour AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Support de base{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatGeckoMobile("13.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+

Voir aussi

+ diff --git a/files/fr/archive/b2g_os/api/domrequest/onsuccess/index.html b/files/fr/archive/b2g_os/api/domrequest/onsuccess/index.html new file mode 100644 index 0000000000..454fb8e72a --- /dev/null +++ b/files/fr/archive/b2g_os/api/domrequest/onsuccess/index.html @@ -0,0 +1,74 @@ +--- +title: DOMRequest.onsuccess +slug: Archive/B2G_OS/API/DOMRequest/onsuccess +tags: + - DOM + - Référence_du_DOM_Gecko +translation_of: Archive/B2G_OS/API/DOMRequest/onsuccess +--- +

{{ ApiRef() }}

+

{{ non-standard_header() }}

+

Résumé

+

Cette propriété renseigne la fonction de callback à appeler quand un {{ domxref("DOMRequest") }} se termine sans problème.

+

Syntaxe

+
requete.onsuccess = fonction;
+
+

Où requete est un objet {{ domxref("DOMRequest") }} et fonction est une fonction JavaScript à executer quand le requête se termine sans problème.

+

Spécification

+

Ne fait actuellement partie d'aucune spécification.

+

Compatibilité des navigateurs

+

{{ CompatibilityTable() }}

+
+ + + + + + + + + + + + + + + + + + + +
FonctionChromeFirefox (Gecko)Internet ExplorerOperaSafari
Support de base{{ CompatUnknown() }}{{ CompatGeckoDesktop("13.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+
+ + + + + + + + + + + + + + + + + + + + + +
FonctionAndroidChrome pour AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Support de base{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatGeckoMobile("13.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+

Voir aussi

+ diff --git a/files/fr/archive/b2g_os/api/domrequest/readystate/index.html b/files/fr/archive/b2g_os/api/domrequest/readystate/index.html new file mode 100644 index 0000000000..15e22601a4 --- /dev/null +++ b/files/fr/archive/b2g_os/api/domrequest/readystate/index.html @@ -0,0 +1,77 @@ +--- +title: DOMRequest.readyState +slug: Archive/B2G_OS/API/DOMRequest/readyState +tags: + - DOM + - Référence_du_DOM_Gecko +translation_of: Archive/B2G_OS/API/DOMRequest/readyState +--- +

{{ ApiRef() }}

+

{{ non-standard_header() }}

+

Résumé

+

Cette propriété est une chaîne de caractères indiquant si une opération {{ domxref("DOMRequest") }} a fini, ou pas, de s'éxecuter.

+

Syntaxe

+
var etat = requete.readyState;
+
+

Où requete est un objet {{ domxref("DOMRequest") }}.

+

Cette propriété est en lecture seul.

+

Valeur renvoyée

+

La valeur renvoyé est une chaîne de caractères JavaScript dont le contenu est "done" si l'opération est finie ou "pending" si elle ne l'est pas.

+

Spécification

+

Ne fait actuellement partie d'aucune spécification.

+

Compatibilité des navigateurs

+

{{ CompatibilityTable() }}

+
+ + + + + + + + + + + + + + + + + + + +
FonctionChromeFirefox (Gecko)Internet ExplorerOperaSafari
Support de base{{ CompatUnknown() }}{{ CompatGeckoDesktop("13.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+
+ + + + + + + + + + + + + + + + + + + + + +
FonctionAndroidChrome pour AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Support de base{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatGeckoMobile("13.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+

Voir aussi

+ diff --git a/files/fr/archive/b2g_os/api/domrequest/result/index.html b/files/fr/archive/b2g_os/api/domrequest/result/index.html new file mode 100644 index 0000000000..73efc17722 --- /dev/null +++ b/files/fr/archive/b2g_os/api/domrequest/result/index.html @@ -0,0 +1,76 @@ +--- +title: DOMRequest.result +slug: Archive/B2G_OS/API/DOMRequest/result +tags: + - DOM + - Référence_du_DOM_Gecko +translation_of: Archive/B2G_OS/API/DOMRequest/result +--- +

{{ ApiRef() }}

+

{{ non-standard_header() }}

+

Résumé

+

Cette propriété fournit la valeur de résultat pour l'opération d'un {{ domxref("DOMRequest") }}.

+

Syntaxe

+
var resultat = requete.result;
+
+

Où requête est un objet {{ domxref("DOMRequest") }}.

+

Valeur renvoyée

+

La valeur renvoyée est un objet JavaScript représentant le résultat de l'opération.

+

Spécification

+

Ne fait actuellement partie d'aucune spécification.

+

Compatibilité des navigateurs

+

{{ CompatibilityTable() }}

+
+ + + + + + + + + + + + + + + + + + + +
FonctionChromeFirefox (Gecko)Internet ExplorerOperaSafari
Support de base{{ CompatUnknown() }}{{ CompatGeckoDesktop("13.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+
+ + + + + + + + + + + + + + + + + + + + + +
FonctionAndroidChrome pour AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Support de base{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatGeckoMobile("13.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+

Voir aussi

+ diff --git a/files/fr/archive/b2g_os/api/index.html b/files/fr/archive/b2g_os/api/index.html new file mode 100644 index 0000000000..7706d81bd4 --- /dev/null +++ b/files/fr/archive/b2g_os/api/index.html @@ -0,0 +1,831 @@ +--- +title: APIs de B2G OS +slug: Archive/B2G_OS/API +tags: + - API + - B2G API + - api de b2g os +translation_of: Archive/B2G_OS/API +--- +

B2G OS utilise les API Web standards

+ +

+A +B +C +D +E +F +G +H +I + + +K +L +M +N +O +P + + +R +S +T +U +V +W +X + + + + + +

diff --git a/files/fr/archive/b2g_os/api/l10n_api/index.html b/files/fr/archive/b2g_os/api/l10n_api/index.html new file mode 100644 index 0000000000..3b1c9850ed --- /dev/null +++ b/files/fr/archive/b2g_os/api/l10n_api/index.html @@ -0,0 +1,52 @@ +--- +title: L10n API +slug: Archive/B2G_OS/API/L10n_API +tags: + - API + - 'API:Mozilla Extensions' + - Aperçu + - Firefox OS + - I10n + - Non-standard + - Reference +translation_of: Archive/B2G_OS/API/L10n_API +--- + + +
+

Brouillon
+ Cette page n'est pas complète.

+
+ +
+

Non-standard
+ Cette fonctionnalité ne fait pas partie des standards actuels du W3C, mais elle est prise en charge sur la plate-forme Firefox OS. Bien que les implémentations puissent changer à l'avenir et qu'il ne soit pas largement pris en charge par les navigateurs, il convient pour une utilisation dans du code dédié aux applications Firefox OS.

+
+ + + +

Interfaces

+ +
+ +
diff --git a/files/fr/archive/b2g_os/api/navigator/addidleobserver/index.html b/files/fr/archive/b2g_os/api/navigator/addidleobserver/index.html new file mode 100644 index 0000000000..54e7fd998e --- /dev/null +++ b/files/fr/archive/b2g_os/api/navigator/addidleobserver/index.html @@ -0,0 +1,62 @@ +--- +title: Navigator.addIdleObserver() +slug: Archive/B2G_OS/API/Navigator/addIdleObserver +translation_of: Archive/B2G_OS/API/Navigator/addIdleObserver +--- +

{{ non-standard_header() }}

+

{{ B2GOnlyHeader2('certified') }}

+

Résumé

+
+
+ Cette méthode est utilisée pour ajouter un observateur qui va vérifier si l'utilisateur est inactif et agira en conséquence. Une fois l'observateur ajouté, il est possible de le retirer avec {{domxref("window.navigator.removeIdleObserver","navigator.removeIdleObserver")}}.
+
+  
+
+

Syntaxe

+
navigator.addIdleObserver(IdleObserver);
+

Paramètres

+
+
+ IdleObserver
+
+
+
+ Un objet avec des propriétés spécifiques à gérer si l'utilisateur est inactif ou non ; cf {{anch("IdleObserver")}} ci-dessous.
+
+
+
+

IdleObserver

+

IdleObserver est un objet contenant les trois propriétés suivantes :

+
+
+ time
+
+ Le temps (exprimé en secondes) avant que l'utilisateur soit considéré comme inactif.
+
+ onidle
+
+ Une fonction appelée lorsque l'utilisateur est considéré comme inactif.
+
+ onactive
+
+ Une fonction appelée lorsque l'utilisateur redevient actif.
+
+

Exemple

+
var myObserver = {
+  time: 10,
+  onidle: function () {
+    console.log("L'utilisateur est inactif depuis 10 secondes");
+  },
+  onactive: function () {
+    console.log("L'utilisateur est actif de nouveau");
+  }
+}
+
+navigator.addIdleObserver(myObserver);
+
+

Spécification

+

Ne fait encore partie d'aucune spécification ; Toutefois, cette API sera discutée au W3C dans le cadre de la System Applications Working Group.

+

Voir aussi

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

L'interface Navigator représente l'état et l'identité de l'agent utilisateur. Il permet aux scripts de l'interroger et de s'enregistrer pour effectuer certaines activités. Cette page représente la liste des propriétés et des méthodes ajoutées à Navigator sur les appareils Firefox OS. Pour obtenir la liste des propriétés des méthodes disponibls sur tous les sites Web, consultez Navigator.

+ +

Un objet Navigator peut être récupéré à l'aide de la propriété Window.navigator en lecture seule.

+ + + +
+
window.navigator.mozApps
+
Renvoie un objet Apps que vous pouvez utiliser pour installer, gérer et contrôler des Open Web Apps dans le navigateur.
+
diff --git a/files/fr/archive/b2g_os/api/navigator/mozapps/index.html b/files/fr/archive/b2g_os/api/navigator/mozapps/index.html new file mode 100644 index 0000000000..6b1d9283bc --- /dev/null +++ b/files/fr/archive/b2g_os/api/navigator/mozapps/index.html @@ -0,0 +1,90 @@ +--- +title: window.navigator.mozApps +slug: Archive/B2G_OS/API/Navigator/mozApps +tags: + - API Apps + - Apps +translation_of: Archive/B2G_OS/API/Navigator/mozApps +--- +

(fr translation)

+ +

+

Non standard
+ Cette fonctionnalité n'est ni standard, ni en voie de standardisation. Ne l'utilisez pas pour des sites accessibles sur le Web : elle ne fonctionnera pas pour tout utilisateur. Il peut également y avoir d'importantes incompatibilités entre les implémentations et son comportement peut être modifié dans le futur.

+

+ +

Résumé

+ +

Renvoie un objet Apps que vous pouvez utiliser pour installer, gérer et contrôler des Open Web Apps dans le navigateur.

+ +

Syntaxe

+ +
var apps = window.navigator.mozApps;
+
+ +

Spécification

+ +

Ne fait partie d'aucune spécification. Implementé dans Gecko suite au bug 697383.

+ +

Compatibilité des navigateurs

+ +

Nous convertissons les données de compatibilité dans un format JSON. + Ce tableau de compatibilité utilise encore l'ancien format + car nous n'avons pas encore converti les données qu'il contient. + Vous pouvez nous aider en contribuant !

+ +
+ + +

+ +
+ + + + + + + + + + + + + + + + + + + +
FonctionChromeFirefox (Gecko)Internet ExplorerOperaSafari
Support de base---11.0 (11.0)---------
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FonctionAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Support de base---11.0 (11.0)---------
+
+ +

 

diff --git a/files/fr/archive/b2g_os/api/navigator/requestwakelock/index.html b/files/fr/archive/b2g_os/api/navigator/requestwakelock/index.html new file mode 100644 index 0000000000..b9cf1367d4 --- /dev/null +++ b/files/fr/archive/b2g_os/api/navigator/requestwakelock/index.html @@ -0,0 +1,60 @@ +--- +title: window.navigator.requestWakeLock +slug: Archive/B2G_OS/API/Navigator/requestWakeLock +tags: + - B2G + - Firefox OS + - Non Standard + - Power Management + - WebAPI +translation_of: Archive/B2G_OS/API/Navigator/requestWakeLock +--- +

{{ non-standard_header() }}

+

Résumé

+

Cette méthode est utilisée pour faire une requête de blocage de mise en veille de n'importe quelle ressource de l'appareil. Elle renvoie un objet {{ anch("MozWakeLock") }} utilisable pour garder une trace ou libérer le verrou de blocage.

+

Syntaxe

+
var lock = window.navigator.requestWakeLock(resourceName);
+
+
+
+ resourceName
+
+ Une chaîne de caractères représentant le nom de la ressource à verrouiller. Gaia utilise trois noms de ressources basiques : screen, cpu et wifi. Cependant toute application certifiée peut exposer de nouvelles ressources.
+
+

Valeur

+

navigator.requestWakeLock retourne un objet {{anch("MozWakeLock")}} qu'il est nécessaire d'utiliser pour libérer le verrou.

+
+

Note : quand la fenêtre qui a requis un ou plusieurs verrou est fermée ou supprimée, tout verrou impliqué est implicitement libéré. Une libération manuelle n'est pas nécessaire.

+
+

MozWakeLock

+
interface MozWakeLock
+{
+  readonly attribute DOMString topic
+
+  void unlock();
+}
+
+
+ topic
+
+ La chaîne de caractères contenant le nom de la ressource à verrouiller.
+
+ unlock
+
+ Une fonction qui doit être appelée pour libérer le verrou. Si plusieurs verrous ont été requis, chacun d'entre eux doit être libéré individuellement.
+
+
+

Note : appeler la méthode unlock sur un verrou déjà  libéré lancera une erreur de type : NS_ERROR_DOM_INVALID_STATE_ERR.

+
+

Exemple

+
var lock = window.navigator.requestWakeLock('screen');
+
+window.addEventListener('unload', function () {
+    lock.unlock();
+});
+

Spécification

+

Cette API ne fait partie d'aucune spécification.

+

Voir aussi

+ diff --git a/files/fr/archive/b2g_os/api/nfc_api/index.html b/files/fr/archive/b2g_os/api/nfc_api/index.html new file mode 100644 index 0000000000..8d6e16ffb4 --- /dev/null +++ b/files/fr/archive/b2g_os/api/nfc_api/index.html @@ -0,0 +1,118 @@ +--- +title: NFC API +slug: Archive/B2G_OS/API/NFC_API +tags: + - API + - Firefox OS + - NFC + - Non-standard + - Reference +translation_of: Archive/B2G_OS/API/NFC_API +--- + + +
+

Non-standard
+ Cette fonctionnalité ne fait pas partie des normes actuelles du W3C, mais elle est prise en charge sur la plate-forme Firefox OS. Bien que les implémentations puissent changer à l'avenir et qu'il ne soit pas largement pris en charge par les navigateurs, il convient pour une utilisation dans le code dédié aux applications Firefox OS.

+
+ +
+

Cette API est disponible sur Firefox OS pour les applications privilégiées ou certifiées uniquement.

+
+ +
+

L'API NFC (Near Field Communication) est utilisée pour échanger des données entre des appareils mobiles compatibles NFC ou des balises NFC en les touchant ensemble.

+
+ +

Présentation

+ +

Vous accédez à l'ensemble des fonctionnalités NFC via la propriété Navigator.mozNfc , ce qui vous permet de retourner un objet MozNFC sur lequel vous pouvez effectuer d'autres opérations.

+ +

Permissions

+ +

Les applications privilégiées qui souhaitent utiliser l'API NFC doivent demander l'autorisation NFC dans leur manifeste d'application. Firefox 2.2+ permet l'utilisation de la technologie NFC dans des applications privilégiées. Pour les versions anterieures, il n'est disponible que pour les applications certifiées.

+ +
"permission": {
+  "nfc":{}
+}
+ +

L'API NFC prend en charge trois modes d'opération définis dans le forum NFC.

+ +

Mode Lecture/Écriture

+ +

Ce mode peut être utilisé pour lire / écrire des balises NFC via l'interface MozNFCTag à l'aide de MozNDEFRecord, ou pour communiquer avec la balise NFC en envoyant / recevant une commande APDU.

+ +

Mode Pair à Pair

+ +

Ce mode est utilisé pour partager du contenu avec un autre périphérique NFC via l'interface MozNFCPeer .

+ +

Card Emulation Mode

+ +

Ce mode permet d'émuler le périphérique NFC en tant que balise NFC. Ce mode est principalement utilisé dans les paiements NFC.

+ +

À partir de Firefox OS v2.2, seulement Secure Element-based Card Emulation est supporté.

+ +

Enregistrement NDEF

+ +

NDEF (NFC Data Exchange Format) est le format de données commun défini dans le forum NFC. En utilisant NDEF, une application peut oppérer sur MozNFCTag si la balise est compatible avec NFC Forum Tag, ou peut échanger des données avec MozNFCPeer.

+ +

En savoir plus : MozNDEFRecord.

+ +

Event Dispatching 

+ +

Pour les événements NFC Tag ou NFC Peer, la priorité est d’envoyer d’abord ces événements à l’application de premier plan (décidé par l’application Système). Si l'application de premier plan ne peut pas traiter l'événement, l'événement sera à nouveau redistribué vers l'application System. L'application System lancera les applications en appelant MozActivity.

+ +

Vous pouvez trouver plus de détails sur l’utilisation de NFC dans Firefox OS dans Utiliser l'API NFC.

+ +

Interfaces NFC

+ +
+
MozNDEFRecord
+
Structure NDEF (NFC Data Exchange Format) pour les données liées à NFC.
+
MozNFC
+
Objet Navigateur haut niveau pour les opérations NFC.
+
MozNFCTag
+
Objet NFC utilisé pour manipuler des données sur des balises.
+
+ +
+
MozNFCPeer
+
Objet NFC utilisé pour manipuler des données sur des périphériques.
+
+ +

Caractéristiques

+ +

L'implémentation NFC dans Gecko suit les caracteristiques du Forum NFC.

+ +

Compatibilité

+ +

Supporté dans Firefox OS 1.0.
+ Disponible dans les applications privilégiées à partir de Firefox OS 2.2.

+ +

Voir aussi

+ + + + diff --git a/files/fr/archive/b2g_os/api/udpsocket/index.html b/files/fr/archive/b2g_os/api/udpsocket/index.html new file mode 100644 index 0000000000..b9ade8c1c7 --- /dev/null +++ b/files/fr/archive/b2g_os/api/udpsocket/index.html @@ -0,0 +1,66 @@ +--- +title: UDPSocket +slug: Archive/B2G_OS/API/UDPSocket +translation_of: Archive/B2G_OS/API/UDPSocket +--- +

+ +

+

Non standard
+ Cette fonctionnalité n'est ni standard, ni en voie de standardisation. Ne l'utilisez pas pour des sites accessibles sur le Web : elle ne fonctionnera pas pour tout utilisateur. Il peut également y avoir d'importantes incompatibilités entre les implémentations et son comportement peut être modifié dans le futur.

+

+ +

+

Cette API est disponible sur Firefox OS pour des applications privilégiées ou certifiées seulement.

+

+ +

Exemple d'appel de l'API

+ +
var SSDP_PORT = 1900;
+var SSDP_ADDRESS = "239.255.255.250";
+var SSDP_DISCOVER_MX = 2;
+var SEARCH_TARGET = "urn:schemas-upnp-org:service:ContentDirectory:1";
+
+var SSDP_DISCOVER_PACKET =
+    "M-SEARCH * HTTP/1.1\r\n" +
+    "HOST: " + SSDP_ADDRESS + ":" + SSDP_PORT + "\r\n" +
+    "MAN: \"ssdp:discover\"\r\n" +
+    "MX: " + SSDP_DISCOVER_MX + "\r\n" +
+    "ST: " + SEARCH_TARGET + "\r\n" +
+    "\r\n";
+
+var searchSocket = new UDPSocket({
+    loopback: true
+});
+
+searchSocket.joinMulticastGroup(SSDP_ADDRESS);
+
+searchSocket.onmessage = function (e) {
+
+    var msg = String.fromCharCode.apply(null, new Uint8Array(e.data));
+
+    console.log(msg);
+};
+
+searchSocket.opened.then(function() {
+
+    searchSocket.send(SSDP_DISCOVER_PACKET, SSDP_ADDRESS, SSDP_PORT);
+
+    setTimeout(function () { searchSocket.close(); }, SSDP_DISCOVER_MX * 1000);
+});
+ +

Exemple de manifeste

+ +
{
+  "name": "My App",
+  "launch_path": "/index.html",
+  "icons": {
+  },
+  "developer": {
+  },
+  "type": "privileged",
+  "permissions": {
+    "udp-socket": { "description": "Required to do any UDP" }
+  },
+  "default_locale": "en"
+}
diff --git a/files/fr/archive/b2g_os/api/wake_lock_api/index.html b/files/fr/archive/b2g_os/api/wake_lock_api/index.html new file mode 100644 index 0000000000..122d994ab9 --- /dev/null +++ b/files/fr/archive/b2g_os/api/wake_lock_api/index.html @@ -0,0 +1,77 @@ +--- +title: Wake Lock API +slug: Archive/B2G_OS/API/Wake_Lock_API +tags: + - Firefox OS + - Non-standard + - Overview + - TopicStub + - Wake Lock API +translation_of: Archive/B2G_OS/API/Wake_Lock_API +--- + + +
+

Non standard
+ Cette fonctionnalité n'est pas en voie de standardisation au W3C, mais elle est supportée par la plateforme Firefox OS. Bien que son implémentation puisse changer dans le futur et qu'elle n'est pas largement supportée par les différents navigateurs, elle est utilisable pour du code dédié aux applications Firefox OS.

+
+ + + +

L' API Wake Lock permet de verrouiller n'importe quelle ressource de l'appareil. Cela signifie que vous pouvez empêcher cette ressource de devenir indisponible tant que votre application détient un verrou pour cette ressource. Par exemple, une application d'enregistrement vocal peut obtenir un verrouillage pour garder l'écran allumé pendant l'enregistrement afin de pouvoir donner à l'utilisateur un retour visuel prouveur indiquant que l'enregistrement est en cours.

+ +

Gaia utilise trois noms de ressources de base qui peuvent être utilisés comme sujet: écran, cpu, et wifi, mais toute application certifié peut exposer de nouvelles ressources.

+ +

Références

+ +
+
Navigator.requestWakeLock()
+
Verrouillez une ressource.
+
MozWakeLock
+
Interface représentant une serrure et permettant de les gérer, en en gardant une trace, et en donnant la possibilité de la libérer.
+
+ +

Exemple

+ +

Garder l'écran allumé

+ +

Toute application peut choisir de garder l'écran allumé pendant son exécution. Pour ce faire, l'application doit obtenir un verrou pour la ressource écran lorsqu'elle est initialisée.

+ +
var lock = window.navigator.requestWakeLock('screen');
+
+ +

Les développeurs d'applications doivent être responsables et réfléchir soigneusement à la question de savoir s'ils doivent garder l'écran allumé. Le risque de réclamer le verrou est que les utilisateurs peuvent oublier de fermer l'application lorsqu'ils ont fini de l'utiliser, ce qui peut entraîner une augmentation significative de l'utilisation de la batterie. Si vous n'êtes pas certain que l'obtention du verrouillage de l'écran ait du sens dans tous les scénarios, il serait judicieux de fournir l'option d'activer ou de désactiver l'option de verrouillage d'écran dans les paramètres de l'application.

+ +

Si vous ne relâchez pas du tout le verrouillage de l'écran, il sera à nouveau obtenu à partir de votre application lorsqu'il passe en arrière-plan ou lorsque l'application se termine. Cependant, il existe certains scénarios où vous devez libérer vous-même le verrouillage de l'écran, par exemple lorsque l'utilisateur désactive l'option dans les paramètres ou lorsque l'application n'exécute pas la tâche qui nécessitait que l'écran reste allumé. Dans ces scénarios, il vous suffit d'appeler la méthode unlock() pour libérer le verrou.

+ +
lock.unlock();
+ +

Le verrouillage de réveil de l'écran est actuellement disponible pour les applications hébergées et packagées exécutées sur la plate-forme Firefox OS.

+ +

Spécification

+ +

Ne fait partie d'aucune spécification

+ +

Voir également

+ + diff --git a/files/fr/archive/b2g_os/api/wake_lock_api/keeping_the_geolocation_on_when_the_application_is_invisible/index.html b/files/fr/archive/b2g_os/api/wake_lock_api/keeping_the_geolocation_on_when_the_application_is_invisible/index.html new file mode 100644 index 0000000000..f6ffe5ed9d --- /dev/null +++ b/files/fr/archive/b2g_os/api/wake_lock_api/keeping_the_geolocation_on_when_the_application_is_invisible/index.html @@ -0,0 +1,83 @@ +--- +title: Garder la main sur la géolocalisation même si l'application n'est plus visible +slug: >- + Archive/B2G_OS/API/Wake_Lock_API/Keeping_the_geolocation_on_when_the_application_is_invisible +tags: + - Firefox OS + - Guide + - Non-standard + - Wake Lock API + - Web +translation_of: >- + Archive/B2G_OS/API/Wake_Lock_API/Keeping_the_geolocation_on_when_the_application_is_invisible +--- +

+ +

+

Non standard
+ Cette fonctionnalité n'est pas en voie de standardisation au W3C, mais elle est supportée par la plateforme Firefox OS. Bien que son implémentation puisse changer dans le futur et qu'elle n'est pas largement supportée par les différents navigateurs, elle est utilisable pour du code dédié aux applications Firefox OS.

+

+ +

+

Cette API est disponible sur Firefox OS pour des applications internes seulement.

+

+ +

Une application Firefox OS peut continuer à utiliser le service de géolocalisation alors même qu'elle n'est plus visible. Ceci peut être obtenu via un appel à MozWakeLock conjointement avec watchPosition() de cette façon, l'application pourra continuer à utiliser le GPS bien que n'étant plus au premier plan.

+ +
+

Toute application désirant conserver l'accès au service de géolocalisation alors que l'écran est éteint ou que cette application se retrouve en arrière plan, doit obtenir un verrou spécial avant de ne plus être visible.

+
+ +

Pour obtenir un tel verrou, il suffit d'appeler la méthode Navigator.requestWakeLock() avec l'argument 'gps'.

+ +
var lock = window.navigator.requestWakeLock('gps');
+
+ +

Ici, les développeurs d'applications portent une lourde responsabilté. Ils doivent être certains des raisons pour lesquelles ils ont besoin du service de géolocalisation et surtout savoir quand l'arrêter. Le risque, avec ce verrou, vient de ce que les utilisateurs de votre application peuvent très bien oublier de fermer l'appli lorsqu'ils ont fini de l'utiliser - ce qui se soldera par une diminution importante de la charge de la batterie, inutilement. Si vous n'êtes pas certain à 100 % que l'obtention d'un verrou de géolocalisation est gérable dans tous les cas de figure, alors vous devez proposer une option pour activer ou désactiver ce verrou de géolocalisation dans les paramètres de votre appli.

+ +

Si vous ne libérez pas du tout votre verrou de géolocalisation, il sera automatiquement libéré lorsque votre appli se terminera. Cependant il y a de nombreux cas où vous pouvez libérer ce verrou vous-même - notamment lorsque l'utilisateur désactive cette option dans vos paramètres applicatifs, ou encore lorsque votre appli ne requiert plus d'utiliser la géolocalisation. Pour libérer le verrou, vous appelez unlock() qui est la méthode prévue :

+ +
lock.unlock();
+ +

Les verrous de géolocalisation sont disponibles, à la fois dans les applis hébergées et les applis packagées - au sens de la plateforme Firefox.

+ +

Example

+ +
var id, target, options;
+var wakeLock;
+
+function success(pos) {
+  var crd = pos.coords;
+
+  if (target.latitude === crd.latitude && target.longitude === crd.longitude) {
+    console.log('Congratulations, you reached the target');
+    navigator.geolocation.clearWatch(id);
+    wakeLock.unlock();
+  }
+}
+
+function error(err) {
+  console.warn('ERROR(' + err.code + '): ' + err.message);
+}
+
+target = {
+  latitude : 0,
+  longitude: 0
+};
+
+options = {
+  enableHighAccuracy: false,
+  timeout: 5000,
+  maximumAge: 0
+};
+
+wakeLock = window.navigator.requestWakeLock('gps');
+id = navigator.geolocation.watchPosition(success, error, options);
+
+ +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/api/window/index.html b/files/fr/archive/b2g_os/api/window/index.html new file mode 100644 index 0000000000..b4383e7590 --- /dev/null +++ b/files/fr/archive/b2g_os/api/window/index.html @@ -0,0 +1,25 @@ +--- +title: Window (extensions Firefox OS) +slug: Archive/B2G_OS/API/Window +tags: + - API + - Firefox OS + - Interface + - Navigator + - Non-standard +translation_of: Archive/B2G_OS/API/Window +--- +

+ +

L'interface Window représente une fenêtre contenant un document DOM. Cette page expose la liste des propriétés et méthodes ajoutées à Window sur les appareils Firefox OS. Pour la liste des propriétés et méthodes disponibles pour tous les sites Web, consultez Window.

+ +

Propriétés

+ +
+
Window.onmoztimechange
+
Contient le gestionnaire d'événement à appeler lorsque l'événement moztimechange est envoyé.
+
+ +

Méthodes

+ +

Il n'y a aucune méthode spécifique à Firefox OS pour l'interface Window.

diff --git a/files/fr/archive/b2g_os/automated_testing/configurer_marionette/index.html b/files/fr/archive/b2g_os/automated_testing/configurer_marionette/index.html new file mode 100644 index 0000000000..8ae67abda9 --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/configurer_marionette/index.html @@ -0,0 +1,48 @@ +--- +title: Configurer Marionette pour Firefox OS +slug: Archive/B2G_OS/Automated_testing/Configurer_Marionette +tags: + - Firefox OS + - Guide +translation_of: 'https://marionette-client.readthedocs.io/en/latest/' +--- +

Configurer le client Marionette

+ +

Le client Marionette est un package Python avec lequel vous pouvez exécuter des tests Marionette : à la fois des tests Python et des tests de WebAPI JavaScript. Vous allez avoir besoin de configurer ceci sur votre machine avant de pouvoir l'utiliser.

+ +

Pour y parvenir, vous devez cloner un arbre Gecko ; soit l'arbre Gecko dans un clone Firefox OS, soit un clone Gecko autonome (par exemple, mozilla-central). Par exemple, supposons que c'est la première fois que vous clonez un arbre Gecko :

+ +

Installez tout d'abord Mercurial, si ce n'est déjà fait. Voici comment vous pouvez faire sur Mac si vous avez Homebrew d'installé. Les autres gestionnaires de package seront différents :

+ +

$ brew install mercurial

+ +

Déplacez-vous dans votre répertoire de travail (par exemple ~/code) et tapez la ligne suivante pour commencer le processus de clonage :

+ +

$ hg clone http://hg.mozilla.org/mozilla-central/ $GECKO_DIR

+ +

... où $GECKO_DIR peut être n'importe quel nom valide de répertoire, par exemple mozilla-central. Cette étape va prendre un peu de temps (environ 10 minutes avec une connexion rapide).

+ +

Voir assi Compiler et installer Firefox OS pour plus de détails sur la façon de configurer un environnement de compilation Firefox OS et faire un pull du code.

+ +
$ cd $GECKO_DIR/testing/marionette/client
+
+$ python setup.py develop
+ +

Il est recommandé d'utiliser un environnement virtuel virtualenv. Configuration rapide de virtualenv :

+ +

$ pip install virtualenv

+ +

$ virtualenv $MARIONETTE_ENV

+ +

Encore une fois, $MARIONETTE_ENV peut être n'importe quel nom valide de répertoire. Maintenant vous devriez être capable d'exécuter les étapes ci-dessus mais dans le nouvel environnement avec :

+ +
$ cd $GECKO_DIR/testing/marionette/client
+
+$ $MARIONETTE_ENV/bin/python setup.py develop
+ +

Pour vérifier que Marionette est installé :

+ +
$ $MARIONETTE_ENV/bin/python
+>>> from marionette import Marionette
+ +

Voir aussi Exécuter des tests Marionette pour plus d'informations sur la façon d'exécuter des tests après avoir configuré Marionette.

diff --git a/files/fr/archive/b2g_os/automated_testing/endurance/index.html b/files/fr/archive/b2g_os/automated_testing/endurance/index.html new file mode 100644 index 0000000000..dc39c6ae1d --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/endurance/index.html @@ -0,0 +1,153 @@ +--- +title: Endurance tests +slug: Archive/B2G_OS/Automated_testing/Endurance +translation_of: Archive/B2G_OS/Automated_testing/Endurance +--- +
+

Important: Les tests d'endurance Gaia-ui ne sont plus utilisés - voir bug 1117144 - cette page est maintenu seulement pour la valeur historique. Vous devriez regarder nos tests MTBF place.

+
+ +
+

Le but de nos tests d'endurance est de vérifier Firefox OS et la stabilité de l'application Gaia et de détecter des fuites de mémoire, en effectuant de multiples itérations de cas d'utilisation communes. Les tests d'endurance Gaia-IU sont en cours d'exécution dans l'ombre, tandis que d'autres types de tests d'endurance sont actuellement en développement (et seront ajoutés ici quand ils serontt mis en ligne). Cet article explique comment ces tests fonctionnent, et comment les exécuter.

+
+ +

Les tests d'endurance Gaia-IU sont une suite de tests de Firefox OS construits au-dessus du cadre Gaiatest (Tests de l'IU Gaia). Les tests s'exécutent sur de vrais dispositifs de Firefox OS, et utilisent Marionette pour  conduire l'IU de l'appareil.

+ +

Comme mentionné ci-dessus, les tests d'endurance Gaia-IU vérifie  le dispositif Firefox OS et la stabilité de l'application Gaia  en effectuant plusieurs itérations de cas d'utilisation communes. Des exemples de ces cas d'utilisation comprennent l'ajout d'un contact dans le carnet d'adresses, d'ajouter un événement au calendrier, l'envoi d'un message SMS, ouvrant le navigateur Firefox et la navigation sur un site spécifique.

+ +

As well as verifying Gaia application functionality under numerous iterations, the endurance tests also perform device-side "checkpoints" after every N number of iterations. This checkpoint currently consists of recording the device’s B2G process RSS memory use value. By logging these results over time and comparing them across commits and builds, we can to detect any sudden changes in B2G memory consumption that may occur during the various test scenarios.

+ +

Running the tests

+ +
+

Note: The Gaia-UI Endurance tests and framework source code can be found in the "v1-train" branch of the Mozilla Github Gaia repository.

+
+ +

Let's go through the steps required to set up the Gaia-UI Endurance test environment and run the tests on your local machine and Firefox OS device.

+ +
+

WARNING: Running the Gaia-UI Endurance Tests will result in data being ERASED from the Firefox OS device, including data on the device’s microSD card. Therefore, if there is any data on your Firefox OS device and microSD card that you wish to keep, be sure to back it up first before running the Gaia-UI Endurance Tests. Consider yourself warned!

+
+ +

Prerequisites

+ + + +

If you are on Ubuntu, you need to check that it is configured to support the USB connection to the Firefox OS device. To verify this, connect the device to your computer via USB, open a terminal and enter the adb logcat command to see if it connects.

+ +
+

Note: To start with, the Firefox OS device should not be connected to your computer. You will be told when to connect it in the steps below.

+
+ +

Step 1: Clone the Gaia repository

+ +

The Gaia-UI Endurance Tests are located in the Mozilla Github Gaia repository. Assuming that you haven’t done so already, the first step is to clone that repo:

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

You may want to go grab a coffee and come back in five minutes.

+ +

Step 2: Run the GaiaTest setup

+ +

The Gaia-UI Endurance tests are built upon the GaiaTest framework (which uses Marionette). The next step is to run the setup script to install GaiaTest and all of the required dependencies. You may wish to create a new virtual environment to use with the Gaia-UI Endurance Tests. If you don’t, you may need to use sudo while running the setup command. In your terminal, type:

+ +
cd gaia/tests/python/gaia-ui-tests
+python setup.py develop
+ +

Step 3: Set test vars and acknowledge risks

+ +

GaiaTest uses a special file to set certain variables that are required for test configuration. For example, to tell the device which WiFi network it should use. Before running the Gaia-UI Endurance Tests, you must setup the test vars file. Make a copy of the gaia/tests/python/gaia-ui-tests/gaiatest/testvars_template.json file in the same location (call it what you like) and edit it:

+ + + +

As mentioned in the warning above, running the Gaia-UI Endurance tests will result in data being erased from the Firefox OS device and microSD card. This is to ensure that the tests start cleanly each time. For example, running a test on a device that already has 10,000 contacts will have very different memory value results vs running the same test on a device with no existing contacts. In order to run the tests, you must acknowledge that you are aware of this data loss risk.

+ +

To acknowledge the risks, add the following entry to your testvars file as the first entry in the list: "acknowledged_risks": true.

+ +
+

Note: If the risks are not acknowledged in the testvars file, the tests will not run.

+
+ +

Step 4: Connect the device to WiFi

+ +

Next, power on your Firefox OS device. After it boots up, go into the Wifi settings then manually select and connect to the Wifi network that you want the device to use for the tests. Ensure the Wifi settings confirm that the device is connected to Wifi before continuing.

+ +

Step 5: Connect to USB and ADB Forward the Device

+ +

Attach the Firefox OS device to your computer via USB.

+ +
+

Note: If you’re using an Ubuntu VM, after attaching the device ensure the VM sees the device and connects to it; in the VM select VM > Removable Devices > Your Device > Connect and wait for the device to connect to the VM.

+
+ +

Now tell adb to forward the device port to GaiaTest using the following command:

+ +
adb forward tcp:2828 tcp:2828
+ +
+

Note: If you are using the Firefox OS Leo device, you must first tell ADB to be the root user, like so:

+ +
adb root
+adb forward tcp:2828 tcp:2828
+
+ +

Step 6: Run a Test

+ +

Now you’re ready to actually try running a test. To run the add_contact endurance test, with a single iteration, use the following commands:

+ +
cd gaia/tests/python/gaia-ui-tests
+gaiatest --type=b2g --address=localhost:2828 --testvars=mytestvars.json --iterations=1 --checkpoint=1 --restart gaiatest/tests/endurance/test_endurance_add_contact.py
+ +

If you get a “connection refused” error it means the device USB connection didn’t work; just repeat the device connection and try again.

+ +

The Firefox OS device b2g process should now restart, then the add_contact endurance test will run with a single iteration. If you watch the Firefox OS device, you’ll see the device UI being manipulated by Marionette. After the test finishes, a memory checkpoint will be performed.

+ +
+

Note: The Gaia-UI Endurance tests now grab the Firefox OS device’s b2g process RSS value for the memory use checkpoint (it used to be the V-SIZE value.)

+
+ +

The test result will be displayed in the terminal window. Note that this result doesn’t include the b2g process memory value; this value is stored in a text file that was created at the time of the checkpoint in the checkpoints directory. To see the resulting b2g process, open this file. This "suite_summary" file will contain the average b2g process memory use (RSS) value, averaged from all of the test checkpoints (in our example there was only one checkpoint anyway).

+ +

There are two other files present in the checkpoints folder:

+ + + +

Command Line Options

+ +

Here is a description of the GaiaTest command line options that you can use when running the Gaia-UI Endurance Test(s):

+ + + +

As an example, to run the add_contact test and have it perform 100 test case iterations, grabbing a device memory checkpoint after every 10 iterations, and restarting the b2g process before the test begins, you would use the following command line:

+ +
gaiatest --type=b2g --address=localhost:2828 --testvars=mytestvars.json --iterations=100 --checkpoint=10 --restart gaiatest/tests/endurance/test_endurance_add_contact.py
+ +

If you wish to run the entire Gaia-UI Endurance test suite, instead of specifying a single test on the command line, just point to the manifest file for the test name, like this:

+ +
gaiatest --type=b2g --address=localhost:2828 --testvars=mytestvars.json --iterations=1 --checkpoint=1 --restart gaiatest/tests/endurance/manifest.ini
+ +

However, note that running the entire test suite, with 100 iterations of each test (and a checkpoint after every 10 iterations) takes approximately 16 hours.

+ +

Now you should be all set and have the Gaia-UI Endurance Tests up and running on your local machine/device.

+ +

Contributing to the project

+ +

If you have any questions about the Firefox OS Endurance tests or are interested in contributing to this important automation development effort, feel free to contact us in the Mozilla #automation IRC channel.

diff --git a/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/index.html b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/index.html new file mode 100644 index 0000000000..92bef3f84c --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/index.html @@ -0,0 +1,74 @@ +--- +title: Gaia UI Tests Introduction +slug: Archive/B2G_OS/Automated_testing/gaia-ui-tests +tags: + - B2G + - Build documentation + - Firefox OS + - Gaia + - Guide + - Mobile + - Testing + - TopicStub + - gaia-ui-test + - gaiatest +translation_of: Archive/B2G_OS/Automated_testing/gaia-ui-tests +--- +
+

Suivant »

+
+ + + +
+

Gaia-ui-tests est la suite de tests Mozilla, qui permet de tester le rendu final de l'interface utilisateur pour Gaia, l'interface utilisateur de Firefox OS. Tous les tests sont écrits en Python avec un peu de JavaScript utilisé pour interagir avec les API Firefox OS. Cette série d'articles explique comment configurer l'environnement pour écrire et lancer des tests.

+
+ +

Gaia-ui-tests utilise Gaiatest, un package Python basé autour de Marionette. Gaiatest est concu pour réunir, les cibles HTML, les appels Marionette, et les appels API pour une communication et un fonctionnement inter-opérable. Marionette est basé sur le standard W3C développé pour le Selenium WebDriver une interface de programmation pour l'automatisation du navigateur. Si vous avez déjà utilisé WebDriver ainsi que des objets de page/application auparavant, alors l'utilisation de Marionette et gaiatest vous paraitront facile.

+ +

Démarrer avec Gaia UI tests

+ +

Pour ceux qui désirent débuter avec les tests automatisés sur Gaia/Firefox OS, nous avons une séries de tutoriels, qui vous aideront de zéro, jusqu'à écrire vos propres tests. Une fois que vous aurez achevé ce tutoriel, vous aurez assez de connaissance en tests Firefox OS et Marionette, pour contribuer aux tests Mozilla. Il est fortement recommandé de suivre l'ensemble de ce tutoriel, si vous souhaitez devenir contributeur.

+ +
+
Partie 1: Bien commencer avec Marionette et Firefox OS
+
Cet article couvre l'installation des outils nécessaire pour démarrer avec les tests, comme le Bureau B2G, Python et Marionette.
+
Partie 2 : Interactions de base avec Firefox OS via l'utilisation de Marionette
+
Un apperçu des commandes de base, que vous utiliserez, pour manipuler Firefox OS avec Marionette.
+
Partie 3 : Améliorer notre code pour en faire un test réutilisable
+
Pour continuer, dans cet article, nous allons assembler quelques commandes de base dans un test simple, à l'intérieur d'un fichier Python, afin qu'ils puissent tous être gérés comme une seule entité.
+
Partie 4 : Réutiliser des commandes pour configurer Firefox OS
+
Ici, nous allons déplacer certaines des commandes, dans les méthodes de Python, pour promouvoir la réutilisation du code.
+
Partie 5 : Introduction à un exécuteur de tests
+
Un lanceur de test est un élément central de toute bonne suite de tests, vous permettant d'exécuter de multiples tests, et d'obtenir un rapport et des résultats globaux. Dans cet article, nous allons explorer les bases du lanceur unittest de Python.
+
Partie 6: Utiliser des tuples, et la classe By de Marionette
+
Cette fois, nous expliquons comment réduire encore la duplication de code, en stockant les localisateurs répétées dans tuples et simplifiant la syntaxe avec la classe By de Marionette.
+
Partie 7 : Écrire vos propres tests
+
Maintenant, les bases sont derrière vous, et il est temps de commencer à écrire vos propres tests! Nous vous donnons ici quelques recommandations d'outils pour vous faciliter le travail, et proposons des tests pour vous exercer à en écrire.
+
Partie 8 : Utiliser une classe base
+
Dans son état actuel, notre fichier de test contient tout le code du lanceur de test. Ceci va bien pour le moment, mais dès que vous commencez à exécuter de nombreux fichiers de test, cela signifie beaucoup de doublons. Ici, nous résolvons ce problème, en faisant abstraction du code du lanceur de test, dans une classe Python séparée.
+
Partie 9 : Réduire le code dupliqué avec des objets app
+
Comme amélioration finale à la maintenabilité du code, dans cet article, nous explorons le code d'abstraction, qui gère l'interaction avec les applications spécifiquent à Firefox OS, dans des objets d'applications Python.
+
+ +

Sujets avancés

+ +

Une fois que vous possédez les bases pour écrire et lancer des tests, vous pourriez vouloir avancer pour des travaux avec plus d'implications ou plus avancés, comme lancer la suite de tests complète gaia-ui-tests, ou connecter l'énergie résultante de la suite d'un test.

+ +
+
Lancer le gaia-ui-tests
+
Des guides pour lancer la suite gaia-ui-tests sur des vrais périphériques Firefox OS et Le Bureau B2G dans diverses configurations.
+
+ +

Voir aussi

+ +

Repo principal Gaia-ui-tests

+ +

Questions/Commentaires/Préoccupations

+ +

Ce projet est à un stade d'avancement précoce, et vos retours d'expérience sont grandement appréciés :

+ + diff --git a/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_1_marionette_firefox_os_commencer/index.html b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_1_marionette_firefox_os_commencer/index.html new file mode 100644 index 0000000000..6747a2a1dc --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_1_marionette_firefox_os_commencer/index.html @@ -0,0 +1,129 @@ +--- +title: 'Partie 1: Bien commencer avec Marionette et Firefox OS' +slug: >- + Archive/B2G_OS/Automated_testing/gaia-ui-tests/Partie_1_Marionette_Firefox_OS_commencer +tags: + - Automatisation + - interface utilisateur +translation_of: >- + Archive/B2G_OS/Automated_testing/gaia-ui-tests/Part_1_Marionette_Firefox_OS_start +--- +

+

« PrécédentSuivant »

+

+ +
+

Cette série de tutoriels a pour objectif de vous familiariser avec l'écriture et l'exécution des tests automatisés de l'interface utilisateur pour Firefox OS en utilisant Marionette, un package d'automatisation qui tourne sur votre ordinateur. Marionette publie des commandes pour exécuter des tests sur les plateformes basées sur Gecko. Cet article va vous faire parcourir plus particulièrement la configuration que vous devez effectuer avant d'exécuter des tests.

+
+ +

La série de tutoriels va parcourir les concepts de l'automatisation de tests et aussi vous familiariser au travail avec Firefox OS (y compris le très utile outil de test B2G Desktop) et Marionette. Occasionnellement, nous présenterons quelques défis pour vous encourager à explorer vos propres solutions.

+ +
+

Note : le tutoriel n'est pas spécifique aux produits de Mozilla ; par exemple, si vous développez une application HTML5, vous pouvez utiliser ce tutoriel pour constuire un framework de tests.

+
+ +

Logiciels requis pour ce tutoriel

+ +

Au cours de ce tutoriel, nous allons installer et utiliser les logiciels suivants :

+ + + +

Python et pip

+ +

Des systèmes d'exploitation comme Linux auront Python déjà préinstallé. Avant d'installer Python, vérifiez qu'il n'est pas déjà installé. Depuis une ligne de commande ou un terminal, exécutez :

+ +
python --version
+ +

Toute version de Python 2.6.x ou 2.7.x est valable pour ce tutoriel. Si vous n'avez pas Python 2.7 d'installé, vous pouvez trouver l'installeur sur le site de téléchargement de Python.

+ +

Pip est utilisé pour installer les outils Python et nous en avons besoin pour installer Marionette. Vous pouvez vérifier si pip est installé en saisissant pip dans votre terminal ou votre ligne de commande. Pour installer pip, suivez les instructions dans la documentation pip.
+  

+ +

Bureau B2G

+ +

Le client de bureau B2G vous permet d'exécuter Gaia — l'interface utilisateur de Firefox OS — et les applications Firefox OS sur un bureau d'ordinateur. Le client de bureau possède certaines limites — il n'émule pas le matériel de l'appareil comme l'appareil photo, la batterie, etc. — mais il sera parfait pour les sujets de ce tutoriel. Allez, installons-le maintenant.

+ +

Téléchargez la dernière version du bureau B2G depuis le site Firefox Nightly (voir Desktop Boot2Gecko, en bas). Dès que le bureau B2G est téléchargé, extraire les contenus dans un dossier sur votre ordinateur. Pour démarrer le simulateur Firefox OS exécutez le fichier script b2g approprié à votre système d'exploitation :

+ + + +

Dès que l'application démarre, vous devriez voir une fenêtre similaire à celle-ci :

+ +

A welcome screen for Firefox OS - says welcome in multiple languages

+ +

Suivez les étapes de Premier Usage jusqu'à arriver sur l'écran d'accueil Firefox OS. Notez que vous pouvez émuler les boutons du téléphone en utilisant les commandes clavier suivantes, qui peuvent être parfois utiles (par exemple, appuyer sur Home pour éviter que le téléphone ne se mette en veille).

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
+

 

+ 		+

Clavier Windows/Linux

+ 		+

Clavier Mac OS

+
+

Bouton Home

+ 		+

Home

+ 		+

Fn + flèche gauche

+
+

Bouton Power

+ 		+

Fin

+ 		+

Fn + flèche droite

+
+

Volume haut/bas

+ 		+

Haut/Bas de page

+ 		+

Fn+ flèche haut/bas

+
+ +

À cette étape, vous pouvez laisser ouvert le bureau B2G et mettre la fenêtre de coté. Maintenant nous allons terminer le travail en installant Marionette.

+ +

Marionette

+ +

Marionette est constitué de deux parties ; le client — qui fonctionne sur votre ordinateur — et le serveur — qui fonctionne à l'intérieur de Firefox OS. Le serveur Marionette, comme un marionnettiste, peut contrôler directement Firefox OS.

+ +

marionette architecture showing marionette server inside Firefox OS and marionette client on its own outside

+ +

Puisque nous utilisons le client bureau B2G, le serveur Marionette est préinstallé (cela est aussi vrai quand vous utilisez une compilation préconfigurée de Firefox OS sur un appareil réel). Avant toutefois de pouvoir contrôler Firefox OS, nous devons installer le client Marionette sur notre ordinateur. On peut le faire en exécutant la commande suivante dans le terminal :

+ +
pip install marionette_client
+ +

C'est tout pour le moment. Nous avons tout configuré et sommes prêts à commencer !

diff --git a/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_2_marionette_firefox_os_interactions/index.html b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_2_marionette_firefox_os_interactions/index.html new file mode 100644 index 0000000000..04eed2587c --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_2_marionette_firefox_os_interactions/index.html @@ -0,0 +1,120 @@ +--- +title: >- + Partie 2 : Interactions de base avec Firefox OS via l'utilisation de + Marionette +slug: >- + Archive/B2G_OS/Automated_testing/gaia-ui-tests/Partie_2_Marionette_Firefox_OS_interactions +tags: + - Automatisation + - interface utilisateur +translation_of: >- + Archive/B2G_OS/Automated_testing/gaia-ui-tests/Part_2_Marionette_Firefox_OS_interactions +--- +

+

« PrécédentSuivant »

+

+ +
+

Dans la deuxième partie de notre tutoriel nous allons débuter avec des commandes Marionette simples qui vont nous permettre de contrôler à distance Firefox OS. Même si nous n'allons pas couvrir l'écriture d'un test en intégralité, cet article vous enseigne les fonctionnalités basiques de code que vous pourrez utiliser pour écrire un test. Dans la troisième partie, nous irons plus loin pour faire évoluer ce code en un test réel.

+
+ +

Démarrage de Firefox OS

+ +

Pour écrire ces tests vous avez besoin d'avoir Firefox OS déjà en cours d'exécution et prêt à recevoir des commandes :

+ +
    +
  1. Démarrer le bureau B2G.
    2. +
  2. Désactiver l'écran de verrouillage en utilisant Paramètres > Ecran de verrouillage > décocher verrouiller l'écran.
    3. +
  3. Désactiver la mise en veille de l'écran en changeant le paramètre Paramètres > Affichage > Ecran de veille à jamais.
    4. +
  4. Déplacer la fenêtre sur le côté en attendant les commandes de test.
    5. +
+ +

Démarrage de Marionette

+ +

Maintenant nous allons démarrer une console Python : allez simplement dans une fenêtre de terminal et tapez la commande python.

+ +

Depuis cette console nous pouvons envoyer des commandes au serveur Marionette dans Firefox OS. Après avoir saisi les commandes qui suivent vous devriez voir répondre Firefox OS. Dans la console Python, entrez la commande suivante pour importer la librairie Marionette contenant le code dont nous avons besoin :

+ +
from marionette import Marionette
+ +

Exécutez maintenant les deux lignes suivantes, qui débutent une session Marionette et le préparent à recevoir des commandes de la part du client :

+ +
marionette = Marionette()
+marionette.start_session()
+ +

Si vous ne désactivez pas l'écran de verrouillage comme expliqué ci-dessus, vous pouvez déverrouiller l'écran  en ligne de commande, en utilisant :

+ +
marionette.execute_script('window.wrappedJSObject.lockScreen.unlock();')
+ +

Accès à différents cadres dans Firefox OS

+ +

Les applications web dans Firefox OS opèrent dans différents iFrames. Exécuter des applications web dans des cadres séparés leur donnent des conteneurs différents pour la gestion de la sécurité et du visuel (comme une fenêtre). Vous pouvez imaginer que cela fonctionne comme un bac à sable dans lequel l'application s'exécute. Marionette ne peut fonctionner que dans un seul cadre à la fois. Nous avons besoin de Marionette pour passer dans le cadre avec lequel nous voulons interagir.

+ +

Le cadre du haut est aussi l'application Système. Toutes les applications et leurs cadres sont des filles de l'application Système. Notre nouvelle session Marionette commence dans le cadre Système mais pour commencer le test nous devons passer dans l'écran d'accueil.

+ +

Pour trouver le iFrame, nous devons d'abord l'identifier. Comme Marionette est basée sur l'API WebDriver, elle utilise les mêmes stratégies pour localiser des éléments, donc nous pouvons utiliser une de ces stratégies pour identifier les éléments web de WebDriver. Pour plus d'informations, lire element location strategies.

+ +

Dans ce cas, nous allons utiliser le sélecteur CSS div.homescreen iframe pour sélectionner le iFrame de l'écran d'accueil ; la fonction find_element() le prend comme deuxième argument, le premier étant une définition du mécanisme de sélection utilisé pour faire la recherche. Nous allons ensuite stocker ce résultat dans une variable et exécuter la fonction switch_to_frame() avec la variable comme argument. À présent, essayez les deux commandes suivantes :

+ +
# Switch context to the homescreen iframe and tap on the Contacts app icon
+home_frame = marionette.find_element('css selector', 'div.homescreen iframe')
+marionette.switch_to_frame(home_frame)
+ +
+

Note: Pour plus d'informations et de diagrammes décrivant le changement de cadres, vous pouvez lire Working with iFrames.

+
+ +

Ouverture d'une application

+ +

OK. Maintenant que nous nous trouvons dans l'application Homescreen nous pouvons cibler les icônes et les cliquer en utilisant la fonction find_element(), combinée avec la fonction tap().

+ +
contacts_icon = marionette.find_element('xpath', "//div[@class='icon']//span[contains(text(),'Contacts')]")
+contacts_icon.tap()
+ +

Si tout se passe bien, vous devriez maintenant avoir l'application Contacts ouverte, mais nous devons encore passer dans cadre de l'application Contacts pour interagir avec lui, comme nous l'avions fait précédemment avec l'écran d'accueil :

+ +
# First, we need to switch context back to the System frame
+marionette.switch_to_frame()
+
+# Now, switch context to the contacts app frame
+contacts_frame = marionette.find_element('css selector', "iframe[data-url*='contacts']")
+marionette.switch_to_frame(contacts_frame)
+ +

Passer dans le cadre devrait renvoyer True. Si c'est le cas, c'est super ! Cela signifie que nous sommes dans le contexte de l'application Contacts et que nous sommes prêts à l'utiliser.

+ +

Manipulation de l'application

+ +

Dans la prochaine étape, nous allons réaliser une tâche de test typique — créer un nouveau contact, lui entrer un nom, et le sauvegarder. Premièrement, nous allons appuyer sur le bouton d'ajout d'un contact :

+ +
# Tap [+] to add a new Contact
+marionette.find_element('id', 'add-contact-button').tap()
+ +

Maintenant, ajoutons le nom du contact en utilisant les deux commandes suivantes (send_keys() est utilisée pour insérer une valeur dans un élément) :

+ +
marionette.find_element('id', 'givenName').send_keys('Foo')
+# Add the contact's surname
+marionette.find_element('id', 'familyName').send_keys('Bar')
+ +

À présent, appuyons sur le bouton OK pour sauvegarder le contact :

+ +
marionette.find_element('id', 'save-button').tap()
+ +

Vous devriez voir un nouveau contact entré dans l'application Contacts. Si c'est le cas, c'est parfait !

+ +
+

Note : si ce n'est pas le cas, redémarrez ou tuez l'application Contacts, retournez sur l'écran d'accueil et essayez d'exécuter la tâche de nouveau.

+
+ +

Fermeture de votre session Marionette

+ +

Pour finir, vous devez fermer votre session Marionette en saisissant la commande suivante :

+ +
marionette.delete_session()
+ +

Tout cela a bien fonctionné, mais vous ne pouvez pas taper dans une console Python à chaque fois que vous voulez exécuter un test ! Dans la partie 3, nous allons compiler ce script dans un fichier Python que nous pourrons réutiliser à chaque fois que l'on voudra exécuter un test. Nous ajouterons également une ligne pour déterminer si le test a réussi ou échoué.

+ +
+

Note : lors de l'écriture des commandes Marionette, vous avez certainement remarqué que l'accès à la structure HTML sous-jacente de l'application est vitale pour comprendre les repères dont vous avez besoin. Partie 7: Ecrire vos propres tests offre quelques ressources utiles pour vous aider sur ce sujet.

+
+ +

 

diff --git a/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_3_tests_reutilisables/index.html b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_3_tests_reutilisables/index.html new file mode 100644 index 0000000000..b053f8cf9b --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_3_tests_reutilisables/index.html @@ -0,0 +1,131 @@ +--- +title: 'Partie 3 : Améliorer notre code pour en faire un test réutilisable' +slug: Archive/B2G_OS/Automated_testing/gaia-ui-tests/Partie_3_Tests_reutilisables +tags: + - Firefox OS + - Marionette + - Python + - test +translation_of: Archive/B2G_OS/Automated_testing/gaia-ui-tests/Part_3_Reusable_tests +--- +

+

« PrécédentSuivant »

+

+ +
+

Nous avons appris dans la partie 2 que nous pouvions contrôler de manière simple Firefox OS en utilisant les commandes du client Marionette. Néanmoins, les saisir dans une console Python est aussi lent que fastidieux. L'avantage clé de l'automatisation de tests est son exécution autonome. Nous allons apprendre comment faire cela dans cette partie, en mettant toutes nos commandes dans un fichier Python qui pourra s'exécuter d'un seul coup.

+
+ +

Résumé d'un cas de test

+ +

Dans la partie 2, nous avons passé les étapes pour exécuter un cas de test typique — ouvrir l'application Contacts et ajouter un nouveau contact :

+ +
    +
  1. Déverrouiller Firefox OS (facultatif ; dans la partie 2 nous avons désactivé l'écran de verrouillage manuellement, en conséquence nous ne l'incluerons pas dans le code ci-dessous)
    2. +
  2. Aller dans l'application Contacts
    3. +
  3. Appuyer sur l'icône d'ajout d'un nouveau contact
    4. +
  4. Saisir le nom du contact
    5. +
  5. Appuyer sur OK
    6. +
  6. Attendre et vérifier que le contact est présent
    7. +
+ +

Mettre notre test dans un fichier Python

+ +

Si nous mettons toutes ces étapes dans un fichier Python, nous pouvons le réutiliser et l'exécuter bien plus rapidement. Créez un nouveau fichier texte nommé test_add_contact.py dans un dossier convenable de votre choix.

+ +

Dans ce fichier, entrez les commandes que nous avons vues dans la partie 2, comme listé ci-dessous. Nous utiliserons une structure de classes Python, puisque c'est une bonne pratique et qui plus est elle constitue une bonne base pour construire les étapes à venir de ce tutoriel.

+ +
import time
+from marionette import Marionette
+
+class TestContacts:
+
+    def __init__(self):
+        self.test_add_contacts()
+
+    def test_add_contacts(self):
+        # Create the client for this session. Assuming you're using the default port on a Marionette instance running locally
+        self.marionette = Marionette()
+        self.marionette.start_session()
+
+        # Switch context to the homescreen iframe and tap on the contacts icon
+        time.sleep(2)
+        home_frame = self.marionette.find_element('css selector', 'div.homescreen iframe')
+        self.marionette.switch_to_frame(home_frame)
+        contacts_icon = self.marionette.find_element('xpath', "//div[@class='icon']//span[contains(text(),'Contacts')]")
+        contacts_icon.tap()
+
+        # Switch context back to the base frame
+        self.marionette.switch_to_frame()
+        time.sleep(2)
+
+        # Switch context to the contacts app
+        contacts_frame = self.marionette.find_element('css selector', "iframe[data-url*='contacts']")
+        self.marionette.switch_to_frame(contacts_frame)
+
+        # Tap [+] to add a new Contact
+        self.marionette.find_element('id', 'add-contact-button').tap()
+        time.sleep(2)
+
+        # Type name into the fields
+        self.marionette.find_element('id', 'givenName').send_keys('John')
+        self.marionette.find_element('id', 'familyName').send_keys('Doe')
+
+        # Tap done
+        self.marionette.find_element('id', 'save-button').tap()
+        time.sleep(2)
+
+        # Close the Marionette session now that the test is finished
+        self.marionette.delete_session()
+
+if __name__ == '__main__':
+    TestContacts()
+
+ +
+

Note : il y a une chose que vous allez remarquer dans le code que nous n'avons pas couverte dans la partie 2 : la fonction Python time.sleep() — cela met le script en pause pour une certaine durée (définie en secondes) avant qu'il ne continue jusqu'à la ligne suivante. Nous avons ajouté ces lignes dans le test automatisé car nous devons simuler l'utilisateur qui, manuellement, appuie sur les boutons, etc. et attendre que Firefox OS effectue les actions qui en résultent. Si nous exécutons le script sans pause, Python effectuera toutes les actions de manière instantanée, mettant probablement le test en échec, puisque Firefox OS n'aurait pas été capable de s'adapter.

+
+ +

À présent, nous pouvons lancer le test en allant dans le fichier où le test est enregistré via le terminal et en exécutant la commande suivante :

+ +
python test_add_contact.py
+ +
+

Note : soyez vigilant par rapport aux règles d'identation de Python. Après avoir copié et collé le code vous devrez probablement tout identer correctement pour qu'il s'exécute. Si vous obtenez une erreur liée à ce point, assurez-vous que tous les niveaux d'indentation sont séparés par une tabulation.

+
+ +
+

Note : vous remarquerez également que le nom inséré dans le code ci-dessus est "John Doe", à la différence du nom "Foo Bar" de la partie 2. Nous avons fait ce changement dans le code pour qu'il puisse ajouter avec succès un autre contact. Si vous essayez d'ajouter un contact avec le même nom, Firefox OS vous alertera sur le doublon de contacts. Pour l'instant, la meilleure façon de répéter l'exécution du test est d'aller dans l'interface de Firefox OS et de supprimer manuellement le contact avant chaque exécution.

+
+ +

Ajouter une assertion

+ +

L'élément qui manque toujours dans notre test, qui est important dans les tests automatisés, est une assertion — un rapport ou mesure pour déterminer si Firefox OS a atteint l'état que nous voulions qu'il atteigne ou si le test est un succès. Nous allons régler ce problème en ajoutant du code pour vérifier si le nouveau contact est présent dans l'application.
+  
+ Juste avant la ligne # Close the Marionette session… ajoutez dans ce code, en s'assurant qu'il est indenté au même niveau que les autres lignes de la classe :

+ +
# Now let's find the contact item and get its text
+contact_name = self.marionette.find_element('css selector', 'li.contact-item:not([data-group$="ice"]) p').text
+assert contact_name == 'John Doe'
+ +

Supprimez l'ancien contact et essayer d'exécuter de nouveau le test, avec la commande suivante :

+ +
python test_add_contact.py
+ +

Si cela s'exécute correctement, alors nous avons un test qui fonctionne !

+ +
+

Note : si l'assertion échoue, assurez-vous que le précédent contact 'Foo Bar' n'existe plus. Le sélecteur CSS avant l'assertion prend en compte le premier contact de la liste (cela pourrait être visible en appelant print "Contact name: %s" % contact_name avant l'appel de l'assertion).

+
+ +
+

Note : l'assertion n'apparaîtra pas pour faire quelque chose, mais les assertions sont très importantes quand nous commençons à utiliser des exécuteurs de tests, comme présenté dans la Partie 5: Présentation d'un exécuteur de tests. Les exécuteurs de test comme unittest utilisent les assertions pour vérifier si les tests ont été réalisés avec succès ou non, et ensuite retournent les résultats de ces tests (OK ou FAIL.)

+
+ +

Note sur le timing

+ +

Une des choses les plus difficiles à gérer en écrivant un test automatisé est le timing. Si le test passe à l'étape suivant avant que Firefox OS n'effectue la précédente, alors nous allons probablement avoir un échec du test.
+  
+ Comme mentionné ci-dessus, dans l'exemple de code que nous avons ajouté, la commande time.sleep(x) résout ce problème. Pourtant, utiliser time.sleep(x) n'est pas une bonne pratique. Utiliser une temporisation codée en dur peut faire que le test va s'exécuter trop longtemps ou pas assez. Le dernier cas est le pire ; il donnera des résultats de tests faux négatifs — ce qui signifie un test qui remonte un échec quand en réalité l'application fonctionne parfaitement mais se comporte de manière plus lente que ce que le test espérait.

+ +

Dans la partie suivante, nous aborderons l'abstraction de certains points du test vers des fonctions Pythons distinctes,  et remplacerons les fonctions sleep() par les temporisations dynamiques appropriées.

diff --git a/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_4_reutiliser_commandes_firefox_os_configuration/index.html b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_4_reutiliser_commandes_firefox_os_configuration/index.html new file mode 100644 index 0000000000..c19b0fe951 --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_4_reutiliser_commandes_firefox_os_configuration/index.html @@ -0,0 +1,108 @@ +--- +title: 'Partie 4 : Réutiliser des commandes pour configurer Firefox OS' +slug: >- + Archive/B2G_OS/Automated_testing/gaia-ui-tests/Partie_4_Reutiliser_commandes_Firefox_OS_configuration +tags: + - Automatisation + - B2G + - Firefox OS + - Gaia + - Marionette + - Python + - interface utilisateur + - test +translation_of: >- + Archive/B2G_OS/Automated_testing/gaia-ui-tests/Part_4_Reusing_commands_Firefox_OS_setup +--- +

+

« PrécédentSuivant »

+

+ +
+

Dans les parties 2 et 3 nous avons écrit un test qui fonctionne, mais si nous voulions réinitialiser son état (par exemple en tuant les applications ouvertes) avant d'exécuter le test, nous devions le faire manuellement. Ceci est un peu fastidieux, nous devrions donc automatiser ce point ! Dans cette partie, nous allons voir comment faire cela en éclatant des bouts de code dans des méthodes Python distinctes que nous pourrons réutiliser.

+
+ +

Réinitialisation automatique

+ +

Avant de réaliser une exécution de test typique, nous aurons probablement besoin de déverrouiller l'écran de verrouillage de Firefox OS et tuer toutes les applications en cours d'exécution. Regardons de plus près comment faire.

+ +

Déverrouiller l'écran de verrouillage

+ +

Avant d'aller plus loin, activez l'écran de verrouillage de nouveau avec Paramètres > Écran de verrouillage > Verrouiller l'écran, si ce n'est pas déjà fait.

+ +

Ajoutez la méthode Python suivante dans votre fichier test_add_contact.py, juste dans la classe :

+ +
def unlock_screen(self):
+    self.marionette.execute_script('window.wrappedJSObject.lockScreen.unlock();')
+ +

Cette méthode va désormais déverrouiller Firefox OS quand elle sera appelée. Maintenant, appelons-la dans notre test en ajoutant les lignes suivantes sous la ligne self.marionette.start_session() :

+ +
# Unlock the screen
+self.unlock_screen()
+ +

Tuer toute application ouverte

+ +

Maintenant nous allons ajouter une méthode dans notre code pour tuer toutes les applications ouvertes. Cela ressemble à ceci :

+ +
    def kill_all(self):
+        self.marionette.switch_to_frame()
+        self.marionette.execute_async_script("""
+             // Kills all running apps, except the homescreen.
+             function killAll() {
+               let manager = window.wrappedJSObject.appWindowManager;
+
+               let apps = manager.getApps();
+               for (let id in apps) {
+                 let origin = apps[id].origin;
+                 if (origin.indexOf('verticalhome') == -1) {
+                   manager.kill(origin);
+                 }
+               }
+             };
+             killAll();
+             // return true so execute_async_script knows the script is complete
+             marionetteScriptFinished(true);
+            """)
+ +

Ajoutez ceci juste après la méthode unlock_screen que nous avons ajoutée dans la section précédente.

+ +

Puis, ajoutez les lignes suivantes pour exécuter ceci pour le reste du test ; ajoutez ceci juste après la ligne self.unlock_screen() :

+ +
# kill all open apps
+self.kill_all()
+ +

Maintenant, essayez de laisser l'application Contacts ouverte après la dernière exécution du test et retournez à l'écran de verrouillage avant d'exécuter le test de nouveau. En plus du déverrouillage de l'écran, l'application Contacts ouverte sera automatiquement tuée avant d'exécuter de nouveau le test, donc son état n'affectera pas le test que vous êtes en train d'exécuter. Ce point est important pour la fiabilité sur le long terme de notre exécution de test.

+ +

Exécutez de nouveau le test plusieurs fois et visualisez si tout fonctionne et si Firefox OS est réinitialisé proprement.

+ +

Attentes dynamiques

+ +

Dans la partie 3, nous avons mentionné l'importance des attentes dynamiques. Marionette possède des attentes comme WebDriver/Selenium2, avec une syntaxe particulière qui ressemble à celle-ci :

+ +
from marionette_driver import Wait
+
+# Wait until element is displayed
+Wait(self.marionette).until(lambda m: m.find_element('id', 'element_id').is_displayed())
+ +

Ce code attendra jusqu'à ce que l'élément spécifié soit affiché. À ce moment, nous savons que nous sommes prêts à interagir avec lui. Essayons d'utiliser cette construction de code dans notre test.

+ +

Tout d'abord, incluez la ligne importée Wait, juste après les lignes d'import existantes :

+ +
from marionette_driver
+ import Wait
+ +

À présent, nous pouvons remplacer la deuxième fonction time.sleep(2) après avoir pressé l'icone Contacts (juste après la ligne self.marionette.switch_to_frame()) avec une méthode Wait() qui attendra jusqu'à ce que le cadre Contacts soit affiché :

+ +
Wait(self.marionette).until(lambda m: m.find_element('css selector', "iframe[data-url*='contacts']").is_displayed())
+ +

Quand nous appuyons sur le symbole + pour commencer la création d'un nouveau contact, nous voulons attendre que le formulaire d'ajout de contact soit complètement visible. Le bouton OK (sauvegarder) est la chose suivante que nous devons presser, nous allons donc attendre d'être mis en position avant de continuer. Remplacez la troisième fonction time.sleep(2) par la ligne suivante :

+ +
Wait(self.marionette).until(lambda m: m.find_element('id', 'save-button').location['y']== 0)
+ +

Dans cet exemple, nous attendons que le bouton OK soit déplacé en haut de l'écran ; cet élément sera visible en de nombreux points suite à l'animation, mais la postition d'arrêt finale est la position la plus sûre à attendre.

+ +

Nous pouvons également attendre les éléments qui ne doivent pas être affichés. Après avoir appuyé sur OK, nous attendons que le bouton OK soit caché en utilisant une méthode Wait() similaire avec une négation, avant d'exécuter le reste du code. Remplacez la quatrième et dernière fonction time.sleep(2) avec ce qui suit :

+ +
Wait(self.marionette).until(lambda m: not m.find_element('id', 'save-button').is_displayed())
+ +

SI votre test est bon, alors c'est super ! Nous avons réalisé un test plus modulaire et fiable. Dans la partie 5, nous vous familiariserons à l'utilisation d'un exécuteur de tests.

diff --git a/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_5_introduction_executeur_tests/index.html b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_5_introduction_executeur_tests/index.html new file mode 100644 index 0000000000..bd8ea4f19a --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_5_introduction_executeur_tests/index.html @@ -0,0 +1,190 @@ +--- +title: 'Partie 5 : Introduction à un exécuteur de tests' +slug: >- + Archive/B2G_OS/Automated_testing/gaia-ui-tests/Partie_5_Introduction_executeur_tests +tags: + - Automatisation + - B2G + - Firefox OS + - Gaia + - Marionette + - Python + - interface utilisateur + - tests +translation_of: >- + Archive/B2G_OS/Automated_testing/gaia-ui-tests/Part_5_Introducing_a_test_runner +--- +

+

« PrécédentSuivant »

+

+ +
+

Jusqu'ici tout va bien, mais nous avons toujours traité un seul test. Quand on teste une réelle application web il peut y avoir des centaines de cas de tests, et nous ne voulons certainement pas exécuter chacun d'eux manuellement. Dans un tel scénario, nous devons utiliser un exécuteur de tests pour trouver et exécuter les tests à pour nous. C'est le sujet de cet article.

+
+ +

Exécuteurs de tests

+ +

Un exécuteur de tests fournit la bonne base pour un framework de test réel. Il est conçu pour exécuter des tests, des étiquettes de tests avec des attributs (annotations), fournir du reporting et bien d'autres fonctionnalités encore. Il existe de nombreux exécuteurs de tests Python disponibles, mais dans notre cas, nous allons utiliser le unittest de Python puisqu'il est simple, efficace et inclus dans le package Python (comme cela nous n'avons pas besoin d'installer quoi que ce soit).

+ +

En général on sépare les tests en 3 sections standard : setUp(), tests, et tearDown(), typique pour une configuration d'exécuteur de tests.
+  
+ Les méthodes setUp() et tearDown() sont exécutées automatiquement pour chaque test et contiennent respectivement :

+ + + +

La partie test de la configuration est le code que vous voulez exécuter pour le test en cours. Regardons maintenant comment nous pouvons appliquer cela au test que nous avons construit dans les parties 2 à 4.

+ +

Exécuter test_add_contact.py avec unittest

+ +

Pour utiliser unittest nous devons tout d'abord importer unittest : ajoutez la ligne suivante en dessous de vos autres lignes d'import :

+ +
import unittest
+ +

Ensuite, nous devons créer un exécuteur de tests. Pour faire cela, nous allons faire hériter la classe TestContacts de la classe unittest.Testcase ; mettez à jour votre ligne class comme suit :

+ +
class TestContacts(unittest.TestCase):
+ +

Nous devons également supprimer ceci :

+ +
    def __init__(self):
+        self.test_add_contacts()
+ +

L'initialisation du test sera gérée à la place par unittest, ainsi nous ne devons pas le gérer nous-mêmes. A la fin du code, remplacez ce qui suit :

+ +
if __name__ == '__main__':
+    TestContacts()
+ +

par :

+ +
if __name__ == '__main__':
+    unittest.main()
+ +

Ensuite, nous devons créer une méthode setUp(self): dans notre classe TestContacts et insérer les étapes suivantes :

+ +
    +
  1. Instancier Marionette et démarrer une session Marionette
    2. +
  2. Déverrouiller l'écran
    3. +
  3. Tuer les applications ouvertes
    4. +
  4. Charger l'application Contacts
    5. +
+ +

La méthode devrait ressembler au code ci-dessous. Vous devrez supprimer les lignes identiques qui sont déjà dans test_add_contacts.

+ +
    def setUp(self):
+         # Create the client for this session. Assuming you're using the default port on a Marionette instance running locally
+        self.marionette = Marionette()
+        self.marionette.start_session()
+
+        # Unlock the screen
+        self.unlock_screen()
+
+        # kill all open apps
+        self.kill_all()
+
+        # Switch context to the homescreen iframe
+        time.sleep(2)
+        home_frame = self.marionette.find_element('css selector', 'div.homescreen iframe')
+        self.marionette.switch_to_frame(home_frame)
+ +

Maintenant passons à la méthode tearDown(self). A l'intérieur de celle-ci nous devons ajouter le code pour fermer la session Marionette. La méthode devrait ressembler à ceci :

+ +
    def tearDown(self):
+        # Close the Marionette session now that the test is finished
+        self.marionette.delete_session()
+
+ +

Encore une fois, n'oubliez pas de supprimer les lignes identiques dans test_add_contacts.

+ +

Manitenant essayez d'exécuter le test exactement comme vous l'avez fait précédemment. Vous allez voir que vous obtenez un rapport de succès et d'échecs. Ceci est un des avantages d'utiliser un exécuteur de tests comme unittest ou py.test.

+ +
+

Note : Si vous êtes bloqués, il existe de nombreux guides d'utilisation de unittest sur Internet. Nous recommandons http://selenium-python.readthedocs.org/en/latest/getting-started.html et http://assertselenium.com/2013/10/07/getting-started-with-python-webdriver/. Ils sont pour Python et WebDriver mais sont tout de même appropriés.

+
+ +

Code de référence

+ +

Pour référence, notre code final à cette étape ressemble à celui-ci :

+ +
import time
+from marionette import Marionette
+from marionette_driver import Wait
+import unittest
+
+
+class TestContacts(unittest.TestCase):
+
+    def unlock_screen(self):
+        self.marionette.execute_script('window.wrappedJSObject.lockScreen.unlock();')
+
+    def kill_all(self):
+        self.marionette.switch_to_frame()
+        self.marionette.execute_async_script("""
+             // Kills all running apps, except the homescreen.
+             function killAll() {
+               let manager = window.wrappedJSObject.AppWindowManager;
+
+               let apps = manager.getApps();
+               for (let id in apps) {
+                 let origin = apps[id].origin;
+                 if (origin.indexOf('verticalhome') == -1) {
+                   manager.kill(origin);
+                 }
+               }
+             };
+             killAll();
+             // return true so execute_async_script knows the script is complete
+             marionetteScriptFinished(true);
+            """)
+
+    def setUp(self):
+         # Create the client for this session. Assuming you're using the default port on a Marionette instance running locally
+        self.marionette = Marionette()
+        self.marionette.start_session()
+
+        # Unlock the screen
+        self.unlock_screen()
+
+        # kill all open apps
+        self.kill_all()
+
+        # Switch context to the homescreen iframe and tap on the contacts icon
+        time.sleep(2)
+        home_frame = self.marionette.find_element('css selector', 'div.homescreen iframe')
+        self.marionette.switch_to_frame(home_frame)
+
+
+    def test_add_contacts(self):
+        contacts_icon = self.marionette.find_element('xpath', "//div[@class='icon']//span[contains(text(),'Contacts')]")
+        contacts_icon.tap()
+
+        # Switch context back to the base frame
+        self.marionette.switch_to_frame()
+        Wait(self.marionette).until(lambda m: m.find_element('css selector', "iframe[data-url*='contacts']").is_displayed())
+
+        # Switch context to the contacts app
+        contacts_frame = self.marionette.find_element('css selector', "iframe[data-url*='contacts']")
+        self.marionette.switch_to_frame(contacts_frame)
+
+        # Tap [+] to add a new Contact
+        self.marionette.find_element('id', 'add-contact-button').tap()
+        Wait(self.marionette).until(lambda m: m.find_element('id', 'save-button').location['y']== 0)
+
+        # Type name into the fields
+        self.marionette.find_element('id', 'givenName').send_keys('John')
+        self.marionette.find_element('id', 'familyName').send_keys('Doe')
+
+        # Tap done
+        self.marionette.find_element('id', 'save-button').tap()
+        Wait(self.marionette).until(lambda m: not m.find_element('id', 'save-button').is_displayed())
+
+    def tearDown(self):
+        # Close the Marionette session now that the test is finished
+        self.marionette.delete_session()
+
+if __name__ == '__main__':
+    unittest.main()
+
+
diff --git a/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_6_marionette_classe_by/index.html b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_6_marionette_classe_by/index.html new file mode 100644 index 0000000000..85b1c5451b --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_6_marionette_classe_by/index.html @@ -0,0 +1,77 @@ +--- +title: 'Partie 6: Utiliser des tuples, et la classe By de Marionette' +slug: Archive/B2G_OS/Automated_testing/gaia-ui-tests/Partie_6_Marionette_classe_By +tags: + - Automatisation + - B2G + - Firefox OS + - Gaia + - Marionette + - Python + - interface utilisateur + - tests +translation_of: Archive/B2G_OS/Automated_testing/gaia-ui-tests/Part_6_Marionette_By_class +--- +

 

+

« PrécédentSuivant »

+

+ +
+

Jusqu'à présent dans notre code, nous avons utilisé de nombreux repères pour trouver des éléments spécifiques, que ce soit des applications (iFrames) ou des parties d'applications. De plus, nous avons écrit les repères directement dans le code et en conséquence, dupliqué du code. Pour améliorer la situation par la suite, une bonne pratique est d'abstraire ces repères dans des variables tuples Python pour ensuite les réutiliser. Dans cet article, nous allons vous montrer comment faire.

+
+ +

Les tuples et la classe By de Marionette

+ +

Considérons comme exemple le repère que nous avons utilisé pour localiser le iFrame de l'application Contacts :

+ +
'css selector', "iframe[data-url*='contacts']"
+ +

Nous utilisons ce repère à la fois quand on attend l'affichage du cadre et quand on passe à l'intérieur de ce dernier. Pour rendre les choses plus simples, on peut stocker ceci dans une variable (il faut aussi iomporter By) :

+ +
from marionette import By
+
+_contacts_frame_locator = (By.CSS_SELECTOR, "iframe[data-url*='contacts']")
+ +

La classe By de Marionette fournit un court-circuit pour accéder aux techiques de repérage comme id, le sélecteur CSS... Comme précédemment, on saisit l'élément en utilisant le sélecteur et ensuite on le stocke dans une variable tuple CSS. Si l'HTML (et le repère) change, alors il est plus facile de simplement mettre à jour la variable une fois, plutôt que de réaliser les changements aux deux endroits. Pour utiliser ce tuple, il faut l'inclure dans la méthode find_element() comme suit :

+ +
self.marionette.find_element(*self._contacts_frame_locator)
+ +
+

Note : * — dans ce contexte — est du code Python pour dépiler la liste d'arguments ; cela sépare le tuple d'origine en deux arguments que nous devons passer dans find_element(). Pour plus d'informations et d'exemples, lire Unpacking argument lists dans la documentation Python.

+
+ +

Un autre exemple de tuple, qui repère via l'attribut id :

+ +
_add_contact_button_locator = (By.ID, 'add-contact-button')
+ +

Utilisation de tuples et By dans notre test Contacts

+ +

Maintenant il est temps de réduire la duplication dans notre cas de test test_add_contact.py en déplaçant les repères hors du test vers le périmètre de la classe TestContacts où ils peuvent être partagés. Nous allons vous montrer comment substituer un couple de repères et laisser le reste comme exercice pour le lecteur.

+ +

D'abord vous devez vous assurer d'importer By, en mettant la ligne suivante au début de votre code :

+ +
from marionette import By
+ +

Maintenant nous pouvons ajouter nos tuples en haut de la classe TestContacts ; ajoutez les lignes suivantes juste en dessous de la ligne class TestContacts(unittest.TestCase) :

+ +
_contacts_frame_locator = (By.CSS_SELECTOR, "iframe[data-url*='contacts']")
+_save_button_locator = (By.ID, "save-button")
+
+ +

Désormais, vous pouvez parcourir votre code et remplacer toutes les instances de

+ +
find_element('id', 'save-button')
+ +

par

+ +
find_element(*self._save_button_locator)
+ +

et toutes les instances de

+ +
find_element('css selector', "iframe[data-url*='contacts']")
+ +

avec

+ +
find_element(*self._contacts_frame_locator)
+ +

Et c'est tout pour le moment. Nous sommes sûrs que vous allez déjà voir les bénéfices de cette réutilisation de code, même dans cet exemple simple. La technique commence à devenir particulièrement efficace dès que vous commencez à écrire des tests plus complexes qui peuvent utiliser le même repère 5, 10 ou 20 fois.

diff --git a/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_7_ecrire_vos_propres_tests/index.html b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_7_ecrire_vos_propres_tests/index.html new file mode 100644 index 0000000000..77a0cda65b --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_7_ecrire_vos_propres_tests/index.html @@ -0,0 +1,63 @@ +--- +title: 'Partie 7 : Ecrire vos propres tests' +slug: >- + Archive/B2G_OS/Automated_testing/gaia-ui-tests/Partie_7_Ecrire_vos_propres_tests +tags: + - interface utilisateur +translation_of: Archive/B2G_OS/Automated_testing/gaia-ui-tests/Part_7_Writing_your_own_tests +--- +

+

« PrécédentSuivant »

+

+ +
+

Jusqu'à présent nous vous avons donné la plupart des outils et informations dont vous avez besoin pour commencer à écrire vos propres tests automatisés sur Firefox OS,  avec suffisamment d'étapes à suivre pour vous permettre de démarrer rapidement. Dans cette partie nous allons vous lâcher, en vous fournissant des ressources et idées, et ensuite en vous encourageant à faire votre propre chemin. Ici, nous allons vous pousser à écrire vos propres tests - profitez-en !

+
+ +

Ressources

+ +

Les ressources suivantes seront utiles quand vous commencerez à construire vos propres tests unitaires.

+ + + +

Idées pour des nouveaux tests et des modifications de tests

+ +

Cette section vous fournir un peu d'idées pour vous lancer.

+ +

Modifier test_add_contact.py

+ +

Commençons par modifier le test sur lequel nous avons déjà travaillé :

+ +
    +
  1. Faire que le contact testé ait un nom unique à chaque fois.
    2. +
  2. Supprimer tous les contacts dans l'étape setUp().
    3. +
  3. Réveiller l'écran avant le déverrouillage.
    4. +
+ +

Maintenant ajoutons une nouvelle méthode de test. Vous pouvez l'appeler comme vous le souhaitez du moment qu'elle commence par test_. Ce test réalise les choses suivantes :

+ +
    +
  1. Ouvrez Contacts.
    2. +
  2. Créez un contact avec un nom différent de celui créé dans le premier test.
    3. +
  3. Entrez de nouveau dans le mode édition du contact.
    4. +
  4. Ajoutez une Société.
    5. +
  5. Appuyez sur OK.
    6. +
  6. Vérifiez que l'entreprise est listée.
    7. +
+ +

Maintenant quand vous exécutez le fichier test, les deux tests vont s'exécuter. Nous nous rapprochons de la force de l'automatisation de tests - la capacité d'exécuter une série de tests de manière automatique et de remonter les résultats !

+ +

D'autres idées nouvelles de tests

+ + + +

 

diff --git a/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_8_utiliser_une_classe_base/index.html b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_8_utiliser_une_classe_base/index.html new file mode 100644 index 0000000000..6529777ae6 --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_8_utiliser_une_classe_base/index.html @@ -0,0 +1,94 @@ +--- +title: 'Partie 8 : Utiliser une classe base' +slug: >- + Archive/B2G_OS/Automated_testing/gaia-ui-tests/Partie_8_Utiliser_une_classe_base +tags: + - Automatisation +translation_of: Archive/B2G_OS/Automated_testing/gaia-ui-tests/Part_8_Using_a_base_class +--- +

+

« PrécédentSuivant »

+

+ +
+

À présent vous avez des tests multiples et vous sentez probablement que vous avez bien progressé. Pourtant, il existe d'autres manières d'améliorer encore l'efficacité de votre code — vous pouvez remarquer que vous avez dû jusqu'ici inclure les méthodes setUp() et tearDown() dans chaque fichier de test, au fur et à mesure de notre progression. Si vous avez plusieurs douzaines de tests alors il y a beaucoup de duplication de code ! Dans cet article, nous allons regarder comment mettre le code setUp()/tearDown() commun à tous les tests dans une classe TestBase, qui peut ainsi être importée dans chaque fichier de test.

+
+ +

test_base.py

+ +

Pour commencer, créez un nouveau fichier nommé test_base.py, dans le même dossier que vos cas de tests existants.

+ +

Ensuite, déplacez vos déclarations relatives à la configuration commune (unittest, Marionette et time) dans le fichier, avec une classe TestBase contenant les méthodes setUp() et tearDown(), et les fonctions d'aide communes (comme unlock_screen()). Le fichier devrait ressembler à cela :

+ +
import time
+import unittest
+from marionette import Marionette
+
+
+class TestBase(unittest.TestCase):
+
+    def unlock_screen(self):
+        self.marionette.execute_script('window.wrappedJSObject.lockScreen.unlock();')
+
+    def kill_all(self):
+        self.marionette.switch_to_frame()
+        self.marionette.execute_async_script("""
+             // Kills all running apps, except the homescreen.
+             function killAll() {
+               let manager = window.wrappedJSObject.AppWindowManager;
+
+               let apps = manager.getApps();
+               for (let id in apps) {
+                 let origin = apps[id].origin;
+                 if (origin.indexOf('verticalhome') == -1) {
+                   manager.kill(origin);
+                 }
+               }
+             };
+             killAll();
+             // return true so execute_async_script knows the script is complete
+             marionetteScriptFinished(true);
+            """)
+
+    def setUp(self):
+         # Create the client for this session. Assuming you're using the default port on a Marionette instance running locally
+        self.marionette = Marionette()
+        self.marionette.start_session()
+
+        # Unlock the screen
+        self.unlock_screen()
+
+        # kill all open apps
+        self.kill_all()
+
+        # Switch context to the homescreen iframe and tap on the contacts icon
+        time.sleep(2)
+        home_frame = self.marionette.find_element('css selector', 'div.homescreen iframe')
+        self.marionette.switch_to_frame(home_frame)
+
+
+    def tearDown(self):
+        # Close the Marionette session now that the test is finished
+        self.marionette.delete_session()
+
+ +

Mettre à jour vos fichiers de test

+ +

Avec la création de votre fichier test_base.py, vous devez importer TestBase dans vos fichiers de test, et les classes de test doivent être changées pour étendre la classe TestBase :

+ +
import unittest
+from marionette import Wait
+from marionette import By
+from test_base import TestBase
+
+class TestContacts(TestBase):
+
+    def test(self):
+        # Tests in here
+
+if __name__ == '__main__':
+    unittest.main()
+ +

Essayez d'exécuter votre fichier de test de nouveau.

+ +

Vous ne devriez pas voir de grande différence maintenant mais si vous avez des douzaines ou des centaines de tests, cela économise beaucoup de code dupliqué.

diff --git a/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_9_objets_app/index.html b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_9_objets_app/index.html new file mode 100644 index 0000000000..aecb44aec1 --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/gaia-ui-tests/partie_9_objets_app/index.html @@ -0,0 +1,80 @@ +--- +title: 'Partie 9 : Réduire le code dupliqué avec des objets app' +slug: Archive/B2G_OS/Automated_testing/gaia-ui-tests/Partie_9_objets_app +tags: + - Automatisation +translation_of: Archive/B2G_OS/Automated_testing/gaia-ui-tests/Part_9_app_objects +--- +

+

« Précédent

+

+ +
+

Dans l'automatisation de tests nous utilisons souvent les objets app pour abstraire le code. Cela réduit la duplication de code et de repères. Si nous avons besoin de changer une section de code commune, nous pouvons la changer juste dans un seul objet app, plutôt que d'avoir à la modifier dans 10 ou 20 fichiers de test. Cet article donne les bases de l'utilisation des objets app.

+
+ +

Objets app : bien démarrer

+ +

L'objet app est une classe Python qui contient des méthodes et des propriétés qui représentent les actions sur une page. Regardons comment nous pouvons utiliser ceci dans un exemple théorique.

+ +

homepage.py

+ +

Voici un cadre que nous pouvons utiliser pour l'app Homepage avec un peu de pseudo-code.

+ +
class Homepage:
+        __init__(self, marionette):
+                # Marionette is passed in so that the object can use it
+                self.marionette = marionette
+
+        def switch_to_homepage_frame(self):
+                # Code for switching to System then to Homepage frame
+
+        def tap_contacts_icon(self):
+                # Code to tap the icon
+                # Switch to Contacts frame
+                # Now we return the Contacts app object as it has focus
+                from contacts import Contacts
+                return Contacts(self.marionette)
+ +

contacts.py

+ +

Et voici ce que nous pouvons utiliser pour l'app Contacts, avec encore du pseudo-code.

+ +
class Contacts:
+        _new_contact_button = (By.ID, ‘id’)
+
+        def tap_new_contact(self):
+                # Tap new contact icon
+                # Wait for event
+
+        def type_given_name(self, name_string):
+                # element.send_keys(name_string)
+ +

test_contacts.py

+ +

Pour comprendre comment cela fonctionne dans le contexte d'un test, voici un exemple rapide qui utilise la classe Homepage :

+ +
from homepage import Homepage
+
+def test_add_contact(self):
+        homepage = Homepage(self.marionette)
+        homepage.switch_to_homepage_frame()
+
+contacts = homepage.tap_contacts_icon()
+contacts.tap_new_contact()
+ +

Mettre à jour vos tests

+ +

À partir de cela, nous voudrions vous pousser à mettre à jour tous vos fichiers de test pour utiliser le nouveau système d'objets app.

+ +

C'est une tâche difficile si vous n'êtes pas familier avec les structures de classes Python, vous aurez peut-être besoin de consulter quelques livres pour avoir des références et des exemples de code.

+ +

Quand vous aurez fini, idéalement vous aurez une séparation claire entre les fichiers de test :

+ +
    +
  1. TestBase contiendra les méthodes setUp() et tearDown()
    2. +
  2. Les objets app contiendront les interactions et repères des pages
    3. +
  3. Vos fichiers de test contiendront uniquement les étapes de test.
    4. +
+ +

Bonne chance !

diff --git a/files/fr/archive/b2g_os/automated_testing/index.html b/files/fr/archive/b2g_os/automated_testing/index.html new file mode 100644 index 0000000000..5ec736aa4d --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/index.html @@ -0,0 +1,93 @@ +--- +title: Test automatisé pour Firefox OS +slug: Archive/B2G_OS/Automated_testing +translation_of: Archive/B2G_OS/Automated_testing +--- +

+ +
+

Vu que Firefox OS est en cours de développement, et que le support pour le nouveau matériel est à venir dans un futur proche, il est important de savoir comment le tester. Cette page présente des articles qui fournissent des informations concernant différents aspects pour le test de Firefox OS, ainsi que l’exécution des tests, l’automatisation, le suivi et l'établissemenr de rapports des résultats.

+
+ +

Premiers pas

+ +
+
Exécuter des tests sur Firefox OS: un guide pour les développeurs
+
+

Un guide rapide, pour les développeurs, pour commencer à exécuter les tests. C’est d’ici que vous devez commencer si vous n’êtes pas confirmés dans l’exécution des tests Mozilla et les systèmes d’automatisation. Si vous l’êtes, vous aurez probablement une idée sur les tests que vous devez exécuter et comment procéder, et vous pouvez aller directement aux guides plus détaillées ci-dessous. 

+
+
+ +

Les tests Gaia

+ +

Ces articles couvrent les suites de test primaires destinées à mettre Gaia à l’épreuve.

+ +
+
Tests d'interface utilisateur Gaia
+
Tests Python des interactions et caractéristiques de l’interface utilisateur Gaia.
+
Tests d'intégration Gaia
+
Tests d’intégration JavaScript pour Gaia, basés sur Marionette.
+
Tests unitaires Gaia
+
Tests unitaires sans interaction avec l'interface utilisateur; écrits en JavaScript, et non basés sur Mrionette.
+
Tests de performance Gaia
+
Mesure des performance de l'application Gaia en se basant sur une instrumentation interne. The testing harness is in-tree.
+
Raptor: Outils de mesure de performance pour Gaia
+
Raptor est un outil qui permet de mesurer la performance spécifique à Firefox OS, qui à pour ambition d'améliorer les outils de test de performance existants.
+
B2GPerf
+
Mesure la performance d'applications Gaia, basé sur une cuisine interne.
+
Eideticker
+
Donne des mesures de performance d'applications Gaia, en se basant sur des captures d'écran.
+
Tests MTBF
+
Durée moyenne avant panne(Mean Time Between Failure). Suite de tests lancés sur un périphérique pendant une longue période, essayant de trouver des problèmes de disponibilité de Gaia et de stabilité. (Actuellement, il est dans les mains de l'équipe Qualité à Taiwan et reste un framework de test en développement)
+
+ +

Les tests B2G

+ +

Les tests ci-dessous couvrent différents faisceaux d'essai qui permettent de tester de nombreux aspect et fonctionnalités de B2G.

+ +
+
Mochitests
+
Tests fonctionnels et d'API, basés sur HTML et JavaScript. Les tests n'interagissent pas avec Gaia.
+
Reftests
+
Test d'exactitude des rendus des tests Gecko.
+
WebAPI tests
+
Tests des WebAPI Gecko, en se basant sur JavaScript. La majorité de ces tests exigent un émulateur.
+
xpcshell tests
+
Tests 'sans tête' (headless) des API XPCOM de Gecko.
+
Tests cppunit
+
Tests unitaires C++ 'sans tête' (headless).
+
+ +

Supporting documentation

+ +

Cette section, apporte des liens, sur quelques-unes des technologies de support, sur lesquels les tests Mozilla s'appuient, et pour lesquels vous voudrez surement en savoir plus.

+ +
+
Marionette
+
Un conducteur de test à distance, basé sur Selenium.
+
Outils JavaScript Marionette
+
Basés sur node.js ils permettent de lancer des tests sur Marionette.
+
Client Python Marionette
+
Un client Python pour lancer des tests sur Marionette.
+
Try server
+
Serveur de Mozilla permettant de tester les correctifs avant de les intégrer dans le répertoire central. Voir aussi le TryChooser Syntax Builder.
+
+ +
+

A noter: Si vous souhaitez lancer Marionette sur une compilation pour la production (pour lancer les tests d'intégration de gaia, gaia-ui-tests, etc.), vous pouvez installer Marionette comme une extension (cela fonctionne pour l'instant uniquement sur les compilations en version 1.3, mais le support sera bientôt plus étendu.)

+
+ +

Intégration continue et rapport des résultats

+ +

Les articles suivants couvrent les mécanismes d'intégration continue et d'établissement de rapports des résultats utilisés par Mozilla afin de sauvegarder et interpréter les données de test.

+ +
+
Treeherder
+
Comprendre les tests et compilations lancées sur Treeherder.
+
Raptor
+
Visualisation des tests de performance lancés avec l'outil Raptor.
+
Datazilla [déprécié]
+
Comprendre quels tests de performances sont rapportés sur Tableau de bord Datazilla, et qu'est ce qu'ils mesurent.
+
Graphe de test d'exécution
+
Un graphe montrant quels tests ont été exécutés - sur quels appareils et quand - et quelles sont les plateformes supportées par chaque test.
+
diff --git a/files/fr/archive/b2g_os/automated_testing/marionette_pour_python_interactif/index.html b/files/fr/archive/b2g_os/automated_testing/marionette_pour_python_interactif/index.html new file mode 100644 index 0000000000..729263087f --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/marionette_pour_python_interactif/index.html @@ -0,0 +1,75 @@ +--- +title: Marionette pour du Pyhton interactif +slug: Archive/B2G_OS/Automated_testing/Marionette_pour_Python_interactif +translation_of: Archive/B2G_OS/Automated_testing/Marionette_for_interactive_Python +--- +

Ce tutoriel suppose que vous avez configuré Marionette pour B2G.

+ +

Ouvrez un terminal et lancez Python pour obtenir l'invite interactive :

+ +

$ python

+ +

Depuis l'invite interactive, exécutez les commandes nécessaire pour invoquer une session Marionette de manière interactive :

+ +

>>> from marionette import Marionette
+ >>> marionette = Marionette('localhost', 2828)
+ >>> marionette.start_session()
+  u'session-b2g'

+ +

Ici, nous voyons que le système renvoie qu'une session Marionette est en cours d'exécution.

+ +

+ +

La commande "marionette.execute_script()" peut intégrer des commandes JavaScript, qui peuvent ensuite s'exécuter sur une plateforme B2G. En utilisant ceci, nous pouvons voir quels éléments DOM renvoient des objets HTMLElement ainsi que les attributs et méthodes disponibles :

+ +

>>> marionette.execute_script("return navigator.battery;")
+ {u'onlevelchange': None, u'level': 0.91, u'dischargingTime': None, u'onchargingchange': None, u'ondischargingtimechange': None, u'onchargingtimechange': None, u'chargingTime': None, u'charging': True}
+ >>> marionette.execute_script("return navigator.battery.level;")
+ 0.91
+ >>> marionette.execute_script("return navigator.geolocation;")
+ {}
+ >>> marionette.execute_script("return navigator.mozSms;")
+ {u'onreceived': None, u'ondelivered': None, u'onsent': None}

+ +

+ +

Vous pouvez parcourir l'arbre DOM en utilisant cette technique pour évaluer quels objets, méthode et attributs sont disponibles.

+ +

Tester la téléphonie basique de manière interactive

+ +

Vous pouvez tester de manière interactive la téléphonie de base avec Marionette.  L'exemple suivant nécessite deux téléphones en état de fonctionnement, chacun ayant sa carte sim. L'un d'eux est notre Galaxy SII, avec B2G en cours d'exécution.

+ +

Lancez une session Marionette interactive  et transférez le port :

+ +

$ adb forward tcp:2828 tcp:2828
+ $ python
+ >>> from marionette import Marionette
+ >>> marionette = Marionette('localhost', 2828)
+ >>> marionette.start_session()
+ u'5-b2g

+ +

À présent, deux approches sont possibles avec Marionette.  L'une d'elles est un peu plus Pythonesque :

+ +

>>> marionette.set_context("chrome")
+ True
+ >>> marionette.execute_script("return navigator.mozTelephony;")
+ >>> num =
+ >>> marionette.execute_script("return navigator.mozTelephony.dial('%d');" % num)

+ +

Ou la seconde approche qui repose plus sur du JS (embarqué dans marionette.execute_script() ) Remarquez les guillemets autour de la variable JS nombre :

+ +

>>> marionette.set_context("chrome")
+ True
+ >>> marionette.execute_script("""
+ ... var num = ""
+ ... return navigator.mozTelephony.dial(num);
+ ... """)
+ {}

+ +

Nous allons essayer la première approche :

+ +

+ +

Ceci démarre un appel téléphonique, dont la sortie peut être contrôlée dans $adb logcat

+ +

diff --git a/files/fr/archive/b2g_os/automated_testing/mtbf_tests/index.html b/files/fr/archive/b2g_os/automated_testing/mtbf_tests/index.html new file mode 100644 index 0000000000..8f624687ac --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/mtbf_tests/index.html @@ -0,0 +1,233 @@ +--- +title: MTBF tests +slug: Archive/B2G_OS/Automated_testing/MTBF_tests +translation_of: Archive/B2G_OS/Automated_testing/MTBF_tests +--- +
+

Les essais de MTBF sont une suite de tests de Firefox OS construits au-dessus du framework  Gaiatest (Tests IU Gaia) . Les tests effectués sur de vrais dispositifs de Firefox OS, et utilisent Marionette pour conduire l'interface utilisateur de l'appareil. Ces tests sont conçus pour mesurer la stabilité / fiabilité de l'application, et de remplacer les tests d'endurance Gaia maintenant abandonnées.

+
+ +

Mean time between failures (MTBF) is the predicted elapsed time between inherent failures of a system during operation. MTBF can be calculated as the arithmetic mean (average) time between failures of a system. The MTBF is typically part of a model that assumes the failed system is immediately repaired (mean time to repair, or MTTR), as a part of a renewal process. This is in contrast to the mean time to failure (MTTF), which measures average time to failures with the modeling assumption that the failed system is not repaired (infinite repair time).

+ +

Current Environment & Setup

+ +

MTBF tests are run by automation; the test suite collects general test cases like send sms, email, set alarm, etc., and executes them to emulate typical user behavior.  Right now we have more than 10 Firefox OS phones concurrently running tests in our test lab.

+ +

How often are the tests run?

+ +

MTBF is purposed to test on versions or branches with 0 functional failures.  it runs when everything passes in our smoke tests; the testing code should be in the Aurora (next release) branch.

+ +

Where can I see the results?

+ +

MTBF is still being developed and you can mail us for an early report (try the dev-b2g or dev-gaia mailing lists).  You can set up the necessary environment to run the tests yourself and generate your own reports by following the below steps.

+ +

Running the tests

+ +

Let's go through the steps required to set up the Gaia-UI MTBF test environment and run the tests on your local machine and Firefox OS device.

+ +

Prerequisites

+ + + +

If you are on Ubuntu, you need to check that it is configured to support the USB connection to the Firefox OS device. To verify this, connect the device to your computer via USB, open a terminal and enter the adb logcat command to see if it connects. If not, you may need to set up a udev rule for the device.

+ +
+

Note: At the point where you start running through the following steps, the Firefox OS device should not be connected to your computer. You will be told when to connect it in the steps below.

+
+ +

Step 1: Clone the MTBF-Driver repository from Mozilla-TWQA

+ +

The Gaia-UI MTBF Tests are located in the Mozilla Github Gaia repository. Assuming that you haven’t done so already, the first step is to clone that repo:

+ +
git clone https://github.com/Mozilla-TWQA/MTBF-Driver.git
+ +

You may want to go get a coffee and come back in five minutes. Furthermore, you can get all the branches and try to switch to the current MTBF branch (e.g. master or v1.4+.) In this case, master matches the current master branch Gaia, and v1.4+ matches the v1.4/v1.3 branch Gaia.

+ +

Step 2: Run the GaiaTest setup

+ +

The Gaia-UI MTBF tests are built upon the GaiaTest framework (which uses Marionette). The next step is to run the setup script to install GaiaTest and all of the required dependencies. You may wish to create a new virtual environment to use with the Gaia-UI MTBF Tests. If you don’t, you may need to use sudo while running the setup command. In your terminal, type:

+ +
cd MTBF-Driver
+python setup.py develop
+ +

Step 3: Get memory tools if you need them

+ +

To access the memory tools, find them in the tools directory in the B2G repo. If you've not already got this, clone it from Github like so (this is also a large download):

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

You should copy the tools folder into the MTBF-Driver/mtbf_drivers directory.

+ +

Step 4: Set test vars and acknowledge risks

+ +

GaiaTest uses a special file to set certain variables that are required for test configuration, for example to tell the device which WiFi network it should use. Before running the Gaia-UI MTBF Tests, you must set up the test vars file. Make a copy of the gaia/tests/python/gaia-ui-tests/gaiatest/testvars_template.json file in its existing location (rename it to something memorable) and edit it:

+ + + +

Running the Gaia-UI MTBF tests will result in data being erased from the Firefox OS device and microSD card. This is to ensure that the tests start cleanly each time. For example, running a contacts test on a device that already has 10,000 contacts will have very different memory value results compared to running the same test on a device with no existing contacts. In order to run the tests, you must acknowledge that you are aware of this data loss risk. You should also backup any data you don't want to lose.

+ +

To acknowledge the risks, add the following entry to your testvars file as the first field in the list: "acknowledged_risks": true.

+ +
+

Note: If the risks are not acknowledged in the testvars file, the tests will not run.

+
+ +

Step 5: Connect to USB and ADB Forward the Device

+ +

Attach the Firefox OS device to your computer via USB.

+ +
+

Note: If you’re using an Ubuntu VM, after attaching the device ensure the VM sees the device and connects to it; in the VM select VM > Removable Devices > Your Device > Connect and wait for the device to connect to the VM.

+
+ +

Now tell adb to forward the device port to GaiaTest using the following command:

+ +
adb forward tcp:2828 tcp:2828
+ +
+

Note: If you are using the Firefox OS Leo device, you must first tell ADB to be the root user, like so:

+ +
adb root
+adb forward tcp:2828 tcp:2828
+
+ +

Step 6: Run a Test

+ +

Now you’re ready to actually try running a test. Use the following commands:

+ +
cd {MTBF Driver Folder}
+MTBF_TIME=1d MTBF_CONF=conf/local.json mtbf --address=localhost:2828 --testvars=mytestvars.json
+ +

We can parse the MTBF_TIME by d(ay), h(our), or m(inute).

+ +

If you get a “connection refused” error it means the device USB connection didn’t work; just repeat the device connection and try again.

+ +

The Firefox OS device b2g process should now restart, then the specified test will run with a single iteration. If you watch the Firefox OS device, you’ll see the device UI being manipulated by Marionette. After the test finishes, a memory checkpoint will be performed.

+ +
+

Note: The Gaia-UI MTBF tests now grab the Firefox OS device’s b2g process RSS value for the memory use checkpoint (it used to be the V-SIZE value.)

+
+ +

The test result will be displayed in the terminal window. Note that this result doesn’t include the b2g process memory value; this value is stored in a text file, created at the time of the checkpoint in the checkpoints directory. To see the resulting b2g process, open this file. This "suite_summary" file will contain the average b2g process memory use (RSS) value, averaged from all the test checkpoints (in our example there was only one checkpoint.)

+ +

There are two other files present in the checkpoints folder (assuming the test run was the "add contact" test):

+ + + +

Step 7: Using Variables and Config Files

+ +

We use envrionment variable MTBF_TIME for running duration.  The other one is MTBF_CONF which refers to json file, specific runner options include test case repository and list.  A normal config file should look like 

+ +
{
+  "memory_report": false,
+  "logcat": true,
+  "overall_status": true,
+  "b2g_status": true,
+  "get_event": true,
+  "rootdir": "tests/mtbf",
+  "workspace": "/tmp/workspace",
+  "manifest_prefix": "mtbf",
+  "archive": "output",
+  "runlist": "runlist/all.list",
+  "level": 4
+}
+ + + +

Contributing to the project

+ +

If you have any questions about the Firefox OS MTBF tests or are interested in contributing to this important automation development effort, feel free to contact us at wachen@mozilla.com

+ +

How to migrate test cases from Gaia-ui-tests

+ +

This section provides a guide to migrating tests between gaia-ui tests and MTBF.

+ +

Step 1: Rename

+ + + +

Step 2: Add

+ + + +

Step 3: Principles

+ + + +

Step 4: About apps

+ +
    +
  1. apps > mtbf_apps if needed.
    2. +
  2. Import original apps.
    3. +
  3. Add __init__() and any functions you need.
    4. +
+ +

Step 5: After you have finished

+ +
    +
  1. Test each test case using Test full suite > Test full suite with shuffle
    2. +
  2. Check PEP8 errors
    3. +
  3. Use a pull request to add your test cases to the main repo! Do not push directly.
    4. +
diff --git a/files/fr/archive/b2g_os/automated_testing/reftests/index.html b/files/fr/archive/b2g_os/automated_testing/reftests/index.html new file mode 100644 index 0000000000..6bab5de637 --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/reftests/index.html @@ -0,0 +1,191 @@ +--- +title: Firefox OS reftests +slug: Archive/B2G_OS/Automated_testing/Reftests +tags: + - B2G + - Firefox OS + - Tests automatiques +translation_of: Archive/B2G_OS/Automated_testing/Reftests +--- +
+

Les tests de référence (ou reftests), sont des tests simples qui comparent, deux rendus d'interface utilisateur, d'une application web séparément (Des éléments HTML, par exemple) pour vérifier si ils sont identiques ou non. Cet article vous fournit tout ce que vous devez savoir pour lancer la suite reftests de Mozilla sur B2G. Pour en savoir plus sur reftests, lisez Créer des tests unitaires basés sur reftest (Ressource en anglais).

+
+ +

Prérequis pour lancer reftests

+ +

Vous pouvez lancer reftests sur B2G. Il est principalement essayé sur l'émulateur, mais en théorie doit fonctionner tout aussi bien sur des appareils. Dans cet article $B2G_HOME fait référence au clone du dépôt B2G. Vous trouverez ci-dessous ce que vous aurez besoin de compiler ou paramétrer, avant de pouvoir essayer de lancer les reftests B2G.

+ +
+

Si vous obtenez ce stacktrace pendant que vous jouez les reftests:

+ +

ImportError: cannot import name expected

+ +
File "gecko-dev/objdir-b2g-ics-emulator/_tests/reftest/runreftestb2g.py", line 16, in <module>
+ +
    from b2g_desktop import run_desktop_reftest
+ +
File "Projects/gecko-dev/objdir-b2g-ics-emulator/_tests/reftest/b2g_desktop.py", line 14, in <module>
+ +
     from marionette import Marionette, expected
+ +
 
+ +
Ceci est un bogue connu sur https://bugzilla.mozilla.org/show_bug.cgi?id=1114474#c7
+
+ +

Build B2G for the target you're testing

+ +

Regular B2G build instructions apply — no need for any special build options.

+ +

The B2G config that you will be using (what you pass to ./config.sh) will probably be emulator as that is what reftests are typically run on. Before building B2G for the emulator config, pay special attention to the Emulator build issues section in the Firefox OS build prerequisites page.

+ +

As usual, make sure adb is in your path and that it successfully connects to your running emulator or device. Try adb devices to make sure it is working ok.

+ +

Running reftests

+ +

Having satisfied the above prerequisites, you can then run reftests using one of the following sets of terminal commands.

+ +

For the emulator

+ +

Use mach:

+ +
cd $B2G_HOME
+​./mach reftest-remote
+ +

This will run all reftests. If you want to run a specific reftest, do the following:

+ +
cd $B2G_HOME
+./mach reftest-remote relative/path/from/B2G/to/reftest.list
+ +

For a real device

+ +

Running reftests on a device is not officially supported yet. One problem is that most devices don't support the minimum required resolution (800x1000) for many of the tests. But if you want to try anyway, you should be able to do so using the following steps:

+ +
cd $B2G_HOME/objdir-gecko
+make package-tests
+source _virtualenv/bin/activate
+cd dist/test-package-stage/reftest
+python runreftestb2g.py --b2gpath $B2G_HOME --xre-path /path/to/dir/containing/desktop/xpcshell --ignore-window-size relative/path/from/B2G/objdir-gecko/to/reftest.list
+ +

Running crashtests

+ +

To run crashtests, do the following:

+ +
cd $B2G_HOME
+​./mach crashtest-remote
+ +

This will run all crashtests. If you want to run a specific crashtest, do the following:

+ +
cd $B2G_HOME
+./mach reftest-remote relative/path/from/B2G/to/crashtests.list
+ +

Running jsreftests

+ +

JSReftests are not officially supported yet. See bug 972870 for progress updates on adding jsreftests to mach.

+ +

Running reftest with non-default options

+ +

You can optionally add --total-chunks and --this-chunks arguments as you would with regular desktop reftests. Use:

+ +
mach help reftest-remote
+ +

for a full list of supported arguments.

+ +

Running reftest with a downloaded emulator

+ +

If you've built B2G for another config (like otoro) and want to run the tests on an emulator, you can do so without building an emulator yourself. Just download the latest trunk arm emulator and do the following:

+ +
pip install marionette-client
+python runreftestb2g.py --emulator arm --b2gpath path/to/emulator --xre-path /path/to/dir/containing/desktop/xpcshell --ignore-window-size --emulator-res 800x1000 <path_to_reftest_manifest>
+ +

Running reftest with a downloaded emulator and downloaded tests.zip package

+ +

If you want to run reftests against a downloaded emulator and a downloaded tests.zip package, you should extract them both.

+ +

Then run the following commands:

+ +
cd $TESTS_ZIP_DIR/mozbase
+python setup_development.py
+cd $TESTS_ZIP_DIR/marionette
+python setup.py develop
+cd $TESTS_ZIP_DIR/reftest
+python runreftestb2g.py --emulator arm --b2gpath $EMULATOR_DIR --xre-path /path/to/dir/containing/desktop/xpcshell --ignore-window-size --emulator-res 800x1000 <path_to_reftest_manifest>
+ +
+

Note: For best results, you should perform the above steps using a Python virtualenv.

+
+ +

Troubleshooting

+ +

The following sections provide some answers to common problems encountered when trying to use reftests.

+ +

I can't build the emulator!

+ +

If you have trouble building B2G in the emulator config, check out the Emulator build issues section in the Firefox OS build prerequisites page.

+ +

Check that your B2G build/emulator works and that ADB can connect to it

+ +

First check that your B2G build runs normally. If this is an emulator build, then ./run-emulator.sh should work: it should start up the emulator and boot B2G inside it. If it doesn't, get the log from adb logcat and ask for help. If ADB fails to connect to the running emulator, make sure that you have no other (Android or B2G) devices connected, and try passing in the -e option to tell adb to focus on the emulator:

+ +
adb logcat -e
+ +

Once you have verified that your B2G build/emulator works normally and that ADB can connect to it, the next step is to verify that your xpcshell desktop executable runs normally. If you built B2G for a real device and ADB can't connect to it, check out Connecting a Firefox OS device to the desktop.

+ +
+

Note: None of the errors below should occur if you are using mach. If you have problems with mach, please file a bug under Testing/Reftest and CC :ahal

+
+ +

Check that you can run your desktop xpcshell executable

+ +

The python runreftestb2g.py command line above will try to run xpcshell on your desktop with the path specified by the --xre-path argument. Check that running xpcshell from the current directory with this relative path actually works.

+ +

For example, suppose that your command line contains:

+ +
--xre-path /hack/mozilla-central/objdir/dist/bin
+ +

Try running this from the same directory as you want to run python runreftestb2g.py from:

+ +
$ /hack/mozilla-central/objdir/dist/bin/xpcshell
+ +

This should land you in a special-looking shell like this:

+ +
js>
+ +

If this fails with an error message complaining about being unable to find or load certain shared libraries, like this

+ +
/hack/mozilla-central/objdir/dist/bin/xpcshell: error while loading shared libraries: libxul.so: cannot open shared object file: No such file or directory
+ +

then you need to set the right environment variable so that it looks for these libraries in the same directory. On Linux, you would set LD_LIBRARY_PATH to the same directory as you want to pass as --xre-path. For example, this should work:

+ +
LD_LIBRARY_PATH=/hack/mozilla-central/objdir/dist/bin /hack/mozilla-central/objdir/dist/bin/xpcshell
+ +

On Mac OSX, the environment variable to set is DYLD_LIBRARY_PATH.

+ +

Check that reftest can find httpd.js

+ +

If reftest still fails to run — returning early with an error — the next most likely cause of trouble is it failing to find certain files that it needs to load. The first file that it could fail to find is httpd.js. Typically, the reason why it would not find it is that you accidentally built xpcshell with --disable-tests. So, make sure that the path you pass to --xre-path does contain a httpd.js file under the components subdirectory.

+ +

This is good:

+ +
$ find /hack/mozilla-central/objdir/dist/bin/ -name httpd.js
+/hack/mozilla-central/objdir/dist/bin/components/httpd.js
+/hack/mozilla-central/objdir/dist/bin/modules/commonjs/sdk/test/httpd.js
+ +

This is bad (was caused by --disable-tests):

+ +
$ find /hack/mozilla-central/objdir/dist/bin/ -name httpd.js
+/hack/mozilla-central/objdir/dist/bin/modules/commonjs/sdk/test/httpd.js
+ +

Check that you didn't forget to make package-tests

+ +

Forgetting the make package-tests step described above would certainly explain why nothing works.

+ +

Check that you passed a correct relative path to the reftest.list

+ +

The final argumant in the command line running reftest is the relative/path/from/B2G/objdir-gecko/to/reftest.list. This must be a relative path from the B2G/objdir-gecko directory to a reftest.list file under it. So check that a reftest.list file is actually present there! If it isn't, compare your command line to the sample command line below, and/or check that you didn't forget to make package-tests as explained above.

+ +

Sample command line:

+ +
$ LD_LIBRARY_PATH=/hack/mozilla-central/objdir/dist/bin python runreftestb2g.py --b2gpath /hack/b2g/B2G/ --xre-path /hack/mozilla-central/objdir/dist/bin  --ignore-window-size --emulator arm --emulator-res 800x1000 tests/layout/reftests/css-gradients/reftest.list
+ +

Here, we are running only the css-gradients directory of reftests.

diff --git a/files/fr/archive/b2g_os/automated_testing/test_execution_chart/index.html b/files/fr/archive/b2g_os/automated_testing/test_execution_chart/index.html new file mode 100644 index 0000000000..f01bb8274f --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/test_execution_chart/index.html @@ -0,0 +1,89 @@ +--- +title: Tableau d'exécution des tests +slug: Archive/B2G_OS/Automated_testing/Test_Execution_Chart +translation_of: Archive/B2G_OS/Automated_testing/Test_Execution_Chart +--- +

+ +
+

Il y a différentes plate-formes B2G actuellement utilisées par les développeurs. Le tableau des exécutions de tests montre quels sont les outils de tests supportés pour chaque plate-forme, ainsi que les plate-formes actuellement utilisées pour l'intégration en continu.

+
+ +

Légende

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Outil de testversion b2g pour bureauémulateur b2gversions pour appareils
b2gperfNNS J
eidetickerNNS
tests d'intégration gaiaS Trtbdtbd
tests ui gaiaS T TrNS J
tests unitaires gaiaS T TrNN
tests émulateur webapiNS TN
mochitestsSS TS
reftestsNS TN
tests xpcshellNS TN
+ +

 

diff --git a/files/fr/archive/b2g_os/automated_testing/tests_cppunit/index.html b/files/fr/archive/b2g_os/automated_testing/tests_cppunit/index.html new file mode 100644 index 0000000000..3f833b952f --- /dev/null +++ b/files/fr/archive/b2g_os/automated_testing/tests_cppunit/index.html @@ -0,0 +1,44 @@ +--- +title: Tests Cppunit +slug: Archive/B2G_OS/Automated_testing/Tests_Cppunit +tags: + - Automatisation + - cppunit + - tests +translation_of: Archive/B2G_OS/Automated_testing/Cppunit_Tests +--- +
+

Les tests Cppunit, sont des tests unitaires sans tête (headless) Gecko C++. Vous pouvez lancer les tests Cppunit sur B2G; dans cet article, nous verrons comment les réaliser. Actuellement, les tests sont effectués principalement sur l'émulateur, mais devrait en théorie fonctionner aussi bien sur les appareils.

+
+ +
+

A noter: Dans cet article, $B2G_HOME fait référence au clone du dépôt B2G.

+
+ +

À la dur

+ +

Actuellement, il n'y a pas de commande mach pour lancer les tests cppunit, alors nous sommes cantonnés à les lancer "à la dur".

+ +

Prérequis

+ + + +

Lancer les tests

+ +

Vous pouvez alors lancer les tests xpcshell en démarrant d'abord un émulateur puis en exécutant les commandes suivante:

+ +
cd $B2G_HOME/objdir-gecko
+make package-tests
+cd dist/test-stage/cppunittests
+python remotecppunittests.py --xre-path $B2G_HOME/objdir-gecko/dist/bin --adbpath $ADB_PATH --dm_trans=adb --addEnv LD_LIBRARY_PATH=/vendor/lib:/system/lib:/system/b2g <test1> <test2> ...
diff --git a/files/fr/archive/b2g_os/b2g_os_architecture/index.html b/files/fr/archive/b2g_os/b2g_os_architecture/index.html new file mode 100644 index 0000000000..0b01d8807d --- /dev/null +++ b/files/fr/archive/b2g_os/b2g_os_architecture/index.html @@ -0,0 +1,38 @@ +--- +title: Architecture de B2G OS +slug: Archive/B2G_OS/B2G_OS_Architecture +tags: + - Architecture B2G OS + - B2G + - B2G OS +translation_of: Archive/B2G_OS/Architecture +--- +

Cet article détaille l'architecture de B2G OS

+ +
+

B2G OS est constitué de trois couches :

+ +
    +
  1. Gaia
    2. +
  2. Gecko
    3. +
  3. Gonk
    4. +
+ +

Gaia

+ +

Gaia est l'interface utilisateur ; elle comporte les applications systèmes telles que téléphone, SMS, Horloge, Agenda qui sont réalisées en HTML, CSS et Javascript.

+ +

Code source : https://github.com/mozilla-b2g/gaia

+ +

Gecko

+ +

Gecko est le moteur de rendu web qui affiche et traite HTML, CSS et Javascript et qui implémente divers composants chrome:// et API Web.

+ +

Code source : https://github.com/mozilla/gecko-dev

+ +

+
+ +

Gonk

+ +

Gonk se compose du noyau Android, de la couche d'abstraction matérielle HAL (Hardware Abstraction Layer) et des pilotes de périphériques.

diff --git a/files/fr/archive/b2g_os/bluetooth_api/index.html b/files/fr/archive/b2g_os/bluetooth_api/index.html new file mode 100644 index 0000000000..b9c49720fe --- /dev/null +++ b/files/fr/archive/b2g_os/bluetooth_api/index.html @@ -0,0 +1,223 @@ +--- +title: L'API Web Bluetooth +slug: Archive/B2G_OS/Bluetooth_API +tags: + - API + - B2G + - Non-standard + - WebAPI +translation_of: Archive/B2G_OS/Bluetooth_API +--- +
+

Non standard
+ Cette fonctionnalité n'est ni standard, ni en voie de standardisation. Ne l'utilisez pas pour des sites accessibles sur le Web : elle ne fonctionnera pas pour tout utilisateur. Il peut également y avoir d'importantes incompatibilités entre les implémentations et son comportement peut être modifié dans le futur.

+
+

Cette API est disponible sur Firefox OS pour des applications internes seulement.

+
+ +

L'API WebBluetooth permet à une application web de se connecter à des périphériques Bluetooth. C'est une API complètement expérimentale et non-standard, elle n'est actuellement disponible que pour les applications certifiées. Cependant, il y a de bonnes raisons d'avoir une telle API disponible ; cette question sera examinée dans le cadre du groupe de travail des applications système du W3C .

+ +
+

Remarque: Les développeurs d'applications qui souhaitent envoyer des données à un périphérique Bluetooth peuvent utiliser share activity. Cette activity permet seulement le partage d'images, d'audio, de vidéo et de contenu vCard.

+
+ +

Aperçu de l'API

+ +

Le principal point d'entrée de l'API est la propriété Navigator.mozBluetooth qui retourne un objet BluetoothManager.

+ +

Interfaces de base

+ +

Les interfaces suivantes fournissent une application avec les fonctionnalités de base Bluetooth

+ +
+
BluetoothManager
+
Permet l'accès à tous les adaptateurs Bluetooth disponibles sur l'appareil. Des adaptateurs sont l'interface de connexion pour connecter un autre périphérique Bluetooth à l'appareil actuel.
+
BluetoothAdapter
+
Utilisé pour traiter toutes les opérations demandées par les réseaux Bluetooth.
+
BluetoothClassOfDevice
+
Fournit identifiant / informations d'un périphérique Bluetooth distant, disponible au stade recherche.
+
BluetoothDevice
+
Fournit des informations concernant un périphérique Bluetooth distant.
+
BluetoothDiscoveryHandle
+
Utilisé pour notifier à l'application en cours de la découverte d'un périphérique Bluetooth distant.
+
BluetoothPairingHandle
+
Contient les fonctionnalités nécessaires pour achever une opération de connexion, y compris les clés d'accès, et les mécanismes pour répondre aux codes PIN saisis par l'utilisateur et confirmer des codes d'authentification.
+
BluetoothPairingListener
+
Définit les gestionnaires d'événements déclenchés pour différentes opérations d'appariement.
+
+ +

Interfaces Gatt

+ +

Les interfaces suivantes permettent à Firefox OS de communiquer avec les services basés sur Gatt (Generic Attribute Profile) sur les périphériques distants Smart/LE(intelligent/basse énergie).

+ +
+
BluetoothGatt
+
Handles de communications initiales et de connexions avec les services Gatt.
+
BluetoothGattServer
+
Fournit des fonctionnalités serveur Bluetooth GATT pour permettrent la création de services et caractéristiques Bluetooth Smart/LE.
+
BluetoothGattService
+
Représente un service fourni par un serveur GATT, y compris la définition du service, la liste des services inclus, et la liste des caractéristiques de ce service.
+
BluetoothGattCharacteristic
+
Représente une caractéristique de service GATT, qui comprend la définition de la caractéristique, la valeur des propriétés et les informations de configuration, et la liste de descripteurs qui fournissent des informations connexes.
+
BluetoothGattDescriptor
+
Représente un descripteur GATT, qui contient des informations connexes sur une valeur caractéristique.
+
+ +

Interfaces d'événements Bluetooth

+ +

Ces objets représentent différents événements ayant lieu au sein d'une interaction Bluetooth.

+ +
+
BluetoothAdapterEvent
+
Donne accès à l'objet BluetoothAdapter et à son adresse comme paramètre d'un gestionnaire d'événement adapteradded ou adapterremoved (voir BluetoothManager.onadapteradded et BluetoothManager.onadapterremoved).
+
BluetoothAttributeEvent
+
Permet d'accéder à des attributs modifiés et à leurs nouvelles valeurs par le paramètre attributechanged du gestionnaires d'événements (y compris BluetoothManager.onattributechanged, BluetoothAdapter.onattributechanged et BluetoothDevice.onattributechanged ).
+
BluetoothDeviceEvent
+
Fournit un accès à un périphérique trouvé/apparié (BluetoothDevice) ou à l'adresse ou à un dispositif non apparié comme paramètre d'un gestionnaire d'événement devicefound, devicepaired ou deviceunpaired.
+
BluetoothGattCharacteristicEvent
+
Fournit un accès à une mise à jour BluetoothGattCharacteristic comme paramètre du gestionnaire BluetoothGatt.oncharacteristicchanged, lorsque l'événement characteristicchanged est déclenché.
+
BluetoothLeDeviceEvent
+
Permet d'accéder à un objet BluetoothDevice de LE, à sa valeur RSSI et son annonce d'enregistrement, par le paramètre d'un gestionnaire d'événement devicefound (voir BluetoothDiscoveryHandle.ondevicefound).
+
BluetoothPairingEvent
+
Permet d'accéder à un nom de dispositif et à l'objet BluetoothPairingHandle requis pour l'association de périphériques (incluant par exemple BluetoothPairingListener.ondisplaypasskeyreq et BluetoothPairingListener.onenterpincodereq).
+
+ +

Les messages du système

+ +

Comme certaines actions de périphériques distants peuvent nécessiter le réveil d'une application pour les manipuler, il y a plusieurs messages système liés à Bluetooth:

+ + + +
+

Note : une application peut réagir à ces messages en les demandant dans son fichier manifeste et en utilisant la fonction navigator.mozSetMessageHandler() pour définir un gestionnaire de messages.

+
+ +

Interfaces obsolètes

+ +
+
BluetoothStatusChangedEvent
+
Fournit un accès à l'information concernant tout changement d'état d'un périphérique Bluetooth.
+
+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaires
Web BluetoothProjetBrouillon. Ne fait partie d'aucune spécification à l'heure actuelle. Doit être discuté avec le W3C's System Applications Working Group.
+ +

Compatibilité des navigateurs

+ +

Nous convertissons les données de compatibilité dans un format JSON. + Ce tableau de compatibilité utilise encore l'ancien format + car nous n'avons pas encore converti les données qu'il contient. + Vous pouvez nous aider en contribuant !

+ +
+ + +
+ +
+ + + + + + + + + + + + + + + + + + + +
FonctionnalitéChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Support simplePas de supportPas de supportPas de supportPas de supportPas de support
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FonctionnalitéAndroidAndroid WebviewFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Bluetooth 'v2' supportPas de supportPas de supportPas de support2.1Pas de supportPas de supportPas de supportPas de support
Bluetooth initial support: BluetoothManager, BluetoothAdapter, BluetoothDevice, BluetoothDeviceEvent, BluetoothStatusChangedEventPas de supportPas de supportPas de support1.0.1Pas de supportPas de supportPas de supportPas de support
+
+ +

Notes de compatibilité

+ + + +

Voir aussi

+ + + +

 

+ +

 

diff --git a/files/fr/archive/b2g_os/board_guide/chirimen/chirimen_faq/index.html b/files/fr/archive/b2g_os/board_guide/chirimen/chirimen_faq/index.html new file mode 100644 index 0000000000..ec8a0fcd1a --- /dev/null +++ b/files/fr/archive/b2g_os/board_guide/chirimen/chirimen_faq/index.html @@ -0,0 +1,14 @@ +--- +title: FAQ CHIRIMEN +slug: Archive/B2G_OS/Board_guide/CHIRIMEN/CHIRIMEN_FAQ +tags: + - Boot to Gecko + - CBC + - MozOpenHard +translation_of: Archive/B2G_OS/Board_guide/CHIRIMEN/CHIRIMEN_FAQ +--- +

FAQ sur CHIRIMEN

+ +

 

+ +

déplacée vers : https://chirimen.org/docs/en/FAQ.html

diff --git a/files/fr/archive/b2g_os/board_guide/chirimen/index.html b/files/fr/archive/b2g_os/board_guide/chirimen/index.html new file mode 100644 index 0000000000..7bb603c9f4 --- /dev/null +++ b/files/fr/archive/b2g_os/board_guide/chirimen/index.html @@ -0,0 +1,123 @@ +--- +title: CHIRIMEN +slug: Archive/B2G_OS/Board_guide/CHIRIMEN +translation_of: Archive/B2G_OS/Board_guide/CHIRIMEN +--- +

+ +
+

Une communauté de Mozilla Factory, appelée "MozOpenHard Project", est en train de développer une puissante carte développeur sous B2G (version OSS de Firefox OS) avec des APIs Web pour le contrôle du matériel (I2C et GPIO). L'environnement qui comporte aussi bien le matériel que le logiciel est appelé CHIRIMEN. Il est en cours de développement et n'est pas encore prêt pour être commercialisé.

+
+ +
+

Note : La version japonaise de cette page est actualisée en premier.

+
+ +

À propos de CHIRIMEN

+ +

CHIRIMEN est un environnement de développement pour contrôler des périphériques physiques, comme des capteurs et des actionneurs, qui utilisent des technologies Web. C'est le terme fourre-tout pour à la fois l'ordinateur monocarte et son logiciel.

+ +

Le paquet contient le matériel de l'ordinateur monocarte, le logiciel Boot to Gecko le faisant fonctionner et la version des APIs de bas-niveau telles que WebGPIO et WebI2C qui peuvent contrôler les capteurs et périphériques grâce à JavaScript. Il a été développé par la communauté MozOpenHard au Japon et le nom de code CHIRIMEN lui a été donné.

+ +

Le code du matériel et du logiciel de CHIRIMEN sera bientôt rendu open source.

+ +

FAQ

+ +

Obtenir une carte

+ +
+
Carte assemblée
+
Il n'est pas possible pour l'instant d'acheter cette carte, elle est toujours en développement. Il est prévu que le prix soit inférieur à 50 dollars.
+
Code source du matériel et du logiciel
+
Il est en cours de préparation pour être distribué au public en open source. 
+
Comment obtenir l'image de l'OS
+
Voir cette page.
+
+ +

Guide de démarrage rapide

+ +

Voir la page d'accueil démarrage rapide

+ +

Spécifications de l'appareil

+ +

Vous trouverez plus d'informations sur les spécifications de l'appareil sur notre page de spécifications des téléphones et appareils.

+ +

Matériel

+ + + +

EditDépôt

+ + diff --git a/files/fr/archive/b2g_os/board_guide/chirimen/os_image/index.html b/files/fr/archive/b2g_os/board_guide/chirimen/os_image/index.html new file mode 100644 index 0000000000..83bebc0961 --- /dev/null +++ b/files/fr/archive/b2g_os/board_guide/chirimen/os_image/index.html @@ -0,0 +1,14 @@ +--- +title: Comment obtenir l'image de l'OS +slug: Archive/B2G_OS/Board_guide/CHIRIMEN/OS_Image +translation_of: Archive/B2G_OS/Board_guide/CHIRIMEN/OS_Image +--- +

Comment obtenir l'image de l'OS

+ +

Cette section donne les instructions pour mettre à jour B2G sur votre carte CHIRIMEN.
+
+ voir aussi https://github.com/MozOpenHard/CHIRIMEN/wiki/Setup

+ +
+

À FAIRE : écrire les instructions.

+
diff --git a/files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/basic_startup/index.html b/files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/basic_startup/index.html new file mode 100644 index 0000000000..9d948af50b --- /dev/null +++ b/files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/basic_startup/index.html @@ -0,0 +1,8 @@ +--- +title: Section Mise en route +slug: Archive/B2G_OS/Board_guide/CHIRIMEN/Quick_start_guide/basic_startup +tags: + - CHIRIMEN +translation_of: Archive/B2G_OS/Board_guide/CHIRIMEN/Quick_start_guide/basic_startup +--- +

Page déplacée sur chirimen.org.

diff --git a/files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/board_connectors/index.html b/files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/board_connectors/index.html new file mode 100644 index 0000000000..7e720fd668 --- /dev/null +++ b/files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/board_connectors/index.html @@ -0,0 +1,163 @@ +--- +title: Disposition des connecteurs +slug: Archive/B2G_OS/Board_guide/CHIRIMEN/Quick_start_guide/board_connectors +tags: + - CHIRIMEN + - Connecteurs +translation_of: Archive/B2G_OS/Board_guide/CHIRIMEN/Quick_start_guide/board_connectors +--- +

Cette section présente la disposition des connecteurs et des interrupteurs d'un ordinateur monocarte CHIRIMEN. 

+ +

Disposition des connecteurs

+ +

chirimen_board_front

+ +

chirimen_board_back

+ +
    +
  1. USB OTG
    + Port USB de type MicroUSB Type B utilisé pour brancher l'ordinateur hôte pour les développements.
    2. +
  2. Connecteur vidéo de type Micro HDMI
    + Connecteur pour brancher un moniteur vidéo HDMI.
    3. +
  3. USB UART
    + Ce connecteur n'est pas utilisé dans de nombreux cas. Le signal produit par le Soc et en provenance du port UARTx est sorti ici converti en USB.
    4. +
  4. Entrée alimentation 5V
    + C'est un connecteur pour l'alimentation de 5V avec un diamètre externe de 2, 5 mm.
    5. +
  5. USB HOST
    + Port USB Type A pour brancher un adaptateur réseau, un périphérique de pointage etc.
    6. +
  6. Interrupteur du mode de récupération
    + Interrupteur essentiellement utilisé lors de la mise à jour d'un système d'exploitation.
    7. +
  7. CN1 (Connecteur1)
    + C'est un groupe de broches d'entrées/sorties à usage générique constituant un point central où sont collectés les signaux tels que GPIO, I2C, émetteur-récepteur universel synchrone-asynchrone et SPI. Se référer au chapitre suivant pour la signification de chaque broche de ce connecteur.
    8. +
  8. CN2  (Connecteur2)
    + C'est un autre groupe de broches d'entrées/sorties à usage générique.
    9. +
  9. Slot Micro SD
    + C'est un slot MicroSD. Il n'est pas supporté par le système d'exploitation à la date de février 2016.
    10. +
+ +

Brochage de l'interface E/S à usage générique

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
 CN1 (Connecteur1) CN2 (Connecteur2)
NuméroDescription Description
1GND GND
2I2C-2 SDA GND
3I2C-2 SCL GND
4UART-3 RX GND
5UART-3 TX Sortie audio G
6ADC-0 in Sortie audio D
7SPI-0 CS Entrée audio G
8SPI-0 CLK Entrée audio D
9SPI-0 RX GND audio
10SPI-0 TX PWM-0
11SPI-1 CS I2C-0 SCL
12SPI-1 CLK I2C-0 SDA
13SPI-1 RX UART-0 TX
14SPI-1 TX UART-0 RX
15GND GPIO-6 A1
16VCC 3.3V Power ON
17VCC 3.3V GND
18VCC 5V VSYS 5V
diff --git a/files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/dev_windows/index.html b/files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/dev_windows/index.html new file mode 100644 index 0000000000..7d08b3bd7f --- /dev/null +++ b/files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/dev_windows/index.html @@ -0,0 +1,9 @@ +--- +title: Version Windows de la section Préparation de l'environnement de développement +slug: Archive/B2G_OS/Board_guide/CHIRIMEN/Quick_start_guide/dev_windows +tags: + - CHIRIMEN + - Firefox WebIDE +translation_of: Archive/B2G_OS/Board_guide/CHIRIMEN/Quick_start_guide/dev_windows +--- +

Page déplacée vers chirimen.org.

diff --git a/files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/firmware_update_guide_for_windows/index.html b/files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/firmware_update_guide_for_windows/index.html new file mode 100644 index 0000000000..85a13a85d4 --- /dev/null +++ b/files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/firmware_update_guide_for_windows/index.html @@ -0,0 +1,11 @@ +--- +title: Guide de mise à jour du firmware pour windows +slug: >- + Archive/B2G_OS/Board_guide/CHIRIMEN/Quick_start_guide/firmware_update_guide_for_windows +tags: + - CHIRIMEN + - Windows +translation_of: >- + Archive/B2G_OS/Board_guide/CHIRIMEN/Quick_start_guide/firmware_update_guide_for_windows +--- +

Page déplacée vers chrimen.org.

diff --git a/files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/index.html b/files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/index.html new file mode 100644 index 0000000000..86434da533 --- /dev/null +++ b/files/fr/archive/b2g_os/board_guide/chirimen/quick_start_guide/index.html @@ -0,0 +1,26 @@ +--- +title: Guide de démarrage rapide CHIRIMEN +slug: Archive/B2G_OS/Board_guide/CHIRIMEN/Quick_start_guide +translation_of: Archive/B2G_OS/Board_guide/CHIRIMEN/Quick_start_guide +--- +

Pour débuter avec CHIRIMEN, consultez nos guides de démarrage rapide :  

+ + + +

Note : Les articles sans lien sont en cours de réalisation.

diff --git a/files/fr/archive/b2g_os/board_guide/index.html b/files/fr/archive/b2g_os/board_guide/index.html new file mode 100644 index 0000000000..1bb20aff0a --- /dev/null +++ b/files/fr/archive/b2g_os/board_guide/index.html @@ -0,0 +1,35 @@ +--- +title: Guide des cartes Firefox OS +slug: Archive/B2G_OS/Board_guide +tags: + - Cartes + - Firefox OS +translation_of: Archive/B2G_OS/Board_guide +--- +
+

Cette section contient des informations à destination des développeurs, en rapport avec des téléphones spécifiques sous Firefox OS — à la fois des appareils développeurs et utilisateurs. Des informations génériques sont disponibles pour Compiler et installer Firefox OS et Développer Firefox OS. Veuillez vous y rendre pour construire et installer la plate-forme à partir de zéro. Les développeurs en possession de téléphones particuliers peuvent cependant trouver les articles suivants utiles.

+
+ +

Informations sur les cartes développeur

+ +

Les cartes ci-dessous sont spécialement destinées aux développeurs qui veulent expérimenter Firefox OS, en développant des applications ou en contribuant au système d'exploitation lui-même. 

+ +
+
Raspberry Pi
+
Cet article contient des informations sur le Raspberry Pi avec Firefox OS.
+
CHIRIMEN
+
Cet article contient des informations sur la carte de développement Firefox OS CHIRIMEN.
+
+ +

Informations générales sur Firefox OS

+ +
+
Données sur les téléphones Firefox OS
+
Dans cet article sont listés les différents téléphones Firefox OS disponibles accompagnés d'informations telles que leurs noms de code, leur disponibilité et leurs caractéristiques matérielles spécifiques.
+
Caractéristiques des appareils
+
Cette page recense les caractéristiques matérielles classiques sous Firefox OS et les configurations matérielles minimales requises.
+
Dépannage
+
Cet article propose des astuces pour résoudre les problèmes les plus couramment rencontrés en utilisant Firefox OS.
+
Bonnes pratiques pour appareils de référence ouverts
+
Un ensemble de bonnes pratiques que nous considérons comme devant être recommandées pour tout appareil de référence ouvert disponible. Tous les appareils de référence Firefox OS récents ont respecté ces pratiques.
+
diff --git a/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/appareils_compatibles/index.html b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/appareils_compatibles/index.html new file mode 100644 index 0000000000..8eb4bbec5a --- /dev/null +++ b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/appareils_compatibles/index.html @@ -0,0 +1,360 @@ +--- +title: Appareils compatibles +slug: Archive/B2G_OS/Building_and_installing_Boot_to_Gecko/Appareils_compatibles +tags: + - Téléphones B2G OS + - Téléphones supportés par B2G OS +translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS/Compatible_Devices +--- +
+

Installez facilement B2G OS sur votre appareil avec B2G installer - un module Firefox.

+
+ +
+

Note : Chaque appareil a sous son nom la cible de construction recommandée (voir nom de code ou surnom). Par exemple, pour compiler pour le Nexus 6, utilisez ./build.sh nexus-6-l. Les noms de code des appareils sont donnés directement par les fabricants. Vous pouvez les trouver dans le fichier build.prop d'une ROM stock.

+
+ +

Appareils de développement

+ +

Ce sont les appareils de référence officiels pour le développement de B2G OS.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Image
Nom
+ (version Android)		Z3 Compact (Kitkat)
+ Plate-forme Sony Shinano		Z3 (Kitkat)
+ Plate-forme Sony Shinano		Flame (Kitkat)
Nom de codearies-kkleo-kkflame-kk
Build et instructions d'installationhttps://discourse.mozilla-community.org/t/building-b2g-os-for-aries-z3c/8082 https://discourse.mozilla-community.org/t/flame-builds/8548
Disponible dans B2G InstallerOuiNonOui
+ +

Appareils supportés par la communauté

+ +

Ces appareils sont pris en charge grâce aux efforts de la communauté. N'hésitez pas à y contribuer !

+ +
+

La fréquence de distribution des builds peut fortement varier selon le nombre de mainteneurs et le temps disponible.

+
+ +

Appareils fonctionnels

+ +

Ces appareils disposent de builds pour faire tourner B2G OS :

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Image
Nom
+ (version Android)		ZTE Open CNexus 5WileyFox SwiftFairphone 2
Nom de codeopenc-fr / openc-ebay   
Build et instructions d'installationhttps://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

+
Disponible dans B2G Installer +

Non

+ +

(mais un buildbot est disponible)

+ 		OuiOuiPas pour l'instant, mais presque terminé. La version avec blob fonctionne.
+ +

Travaux en cours

+ +

Le support de ces appareils est en cours :

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Image 
Nom
+ (version Android)		E3
+ Plate-forme Sony Yukon		Z1 Compact (Lollipop)
+ Plate-forme Sony Rhine		Xiaomi Redmi 1S
Nom de codeflamingo-lamami-larmani
Build et instructions d'installationhttps://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
État du supportBloqué, problème avec les outils de flashageTout début des tests de compilationTests préliminaires de compilation
+ +

Appareils sur lesquels un portage est envisageable

+ +

Voici une liste (non exhaustive) d'appareils sur lesquels un portage est éventuellement possible, grâce à la disponibilité de version AOSP ou Cyanogen Mod, ou parce qu'ils fonctionnaient sous Firefox OS jusqu'à la version 2.6.

+ +
+

Note : Pour l'instant, il n'existe aucun portage pour ces téléphones mais la construction de B2G OS est possible. Voir la section Comment compiler pour plus d'informations. N'hésitez pas à maintenir ces builds.

+
+ +

Appareils Nexus

+ +

Ces appareils sont (presque) automatiquement supportés par B2G OS car ceux sont les appareils de référence de Google pour AOSP.

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

Appareils Sony

+ +

Ces appareils bénéficient de l'initiative Open Devices de Sony Mobile dont le but est de supporter dans AOSP tous les appareils Xperia modernes.

+ +

Ils sont construits sur une base AOSP Lollipop.

+ +
+

À l'heure actuelle, le support de l'appareil photo est absent de la plupart des appareils Sony. Cela est tributaire des travaux en cours des développeurs de Sony.
+ Là aussi, nous avons besoin de contributeurs pour maintenir ces portages.

+
+ +

Les appareils dont le support B2G OS est à venir ne sont pas listés ici.

+ +

Plate-forme Sony Shinano

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

Plate-forme Sony Rhine

+ +
+

Les appareils Rhine étant dotés d'une puce NFC ancienne, cette fonctionnalité est actuellement absente. Voir le bogue 1226720 Nous avons besoin de contributeurs pour maintenir ces portages.

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

Plate-forme Sony Yukon

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

Appareils CyanogenMod supportés

+ +

Voici des dragons ! (à compléter)

+ +

Anciens appareils

+ +

Certains anciens appareils ne sont plus maintenus par la communauté mais il est encore possible pour des bénévoles de les garder en vie (Ouais Open-Source !). N'hésitez pas à contacter l'équipe qui travaillait dessus auparavant pour avoir de l'aide.

+ +

Pour l'instant, aucun appareil n'est présent ici.

+ +

Appareils obsolètes

+ +
+

Oubliez le support de ces appareils si vous disposez de l'un d'eux.

+
+ +

Plusieurs vieux appareils ne sont plus maintenus sous B2G OS, et aucune communauté n'est là pour les garder en vie. La situation actuelle de ces appareils est inconnue ce qui signifie que les principales branches de B2G OS ne pourront sans doute pas être compilées dessus.

+ + + + + + + + + + + + + + + + + + + + + + +
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/fr/archive/b2g_os/building_and_installing_boot_to_gecko/b2g_build_variables_reference_sheet/index.html b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/b2g_build_variables_reference_sheet/index.html new file mode 100644 index 0000000000..4b4f08fc2f --- /dev/null +++ b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/b2g_build_variables_reference_sheet/index.html @@ -0,0 +1,261 @@ +--- +title: Variable de référence pour les builds B2G +slug: >- + Archive/B2G_OS/Building_and_installing_Boot_to_Gecko/B2G_Build_Variables_Reference_Sheet +tags: + - B2G + - Commandes + - Compilation + - Firefox OS + - Gaia + - Gecko + - Références(2) + - Variables +translation_of: >- + Archive/B2G_OS/Building_and_installing_B2G_OS/B2G_Build_Variables_Reference_Sheet +--- +

Cet article fournit une référence pour toutes les variables des builds B2G, les builds Gaia et les builds Gecko et les commandes dont vous pouvez avoir besoin durant des opérations relative à la compilation de Firefox OS.

+ +

B2G build

+ +

Variables

+ +
+
Example
+
xxx
+
+ +

Commandes

+ +
+
./repo sync
+
xxx
+
./config.sh
+
xxx
+
+ +

Gaia build

+ +

Variables

+ +

Voir le Gaia MakeFile pour la définition de toutes ces variables.

+ +
+
ADB
+
xxx
+
APP
+
Certaines commandes peuvent agir sur tout gaia ou seulement sur une seule application. Cette variable d'environnement défini si l'on veut qu'une commande agisse sur une app seulement, et si c'est le cas, sur laquelle.
+
GAIA_DIR
+
xxx
+
PROFILE_DIR
+
xxx
+
PROFILE_FOLDER
+
Cela défini le dossier où le profil sera généré. Par défaut il est défini à gaia/profile pour les profils normaux et gaia/profile-debug pour les profils DEBUG=1 profils (voir plus loin.)
+
COREWEBAPPS_DIR
+
xxx
+
SCHEME
+
xxx
+
GAIA_DOMAIN
+
xxx
+
DEBUG
+
Lorsque la valeur est à 1, les profils généreés peuvent être utilisés avec Firefox desktop ou le simulator Firefox OS (B2G Desktop): DEBUG=1 DESKTOP=0 make.
+ Il inclut l'extension httpd.js et les préférences de configurations pour accèder aux applications en utilisant app://<appname>.gaiamobile.org/. Quelques applications sont connues pour fonctionner ainsi, notamment l'application SMS.
+
LOCAL_DOMAINS
+
xxx
+
DESKTOP
+
Cela inclus un set d'extensions dans le profil DEBUG pour permettre aux applications systèmes de Gaia d'être chargées dans Firefox. Cela ne fonctionne plus bien et est obsolète en faveur de Mulet. La valeur par defaut est mise à 1 lorsque DEBUG=1 est utilisé, mais vous pouvez vouloir le désactiver du fait de son non fonctionnement.
+ Prenez des précautions car cela ne fonctionne pas aussi avec le Simulator Firefox OS (B2G Desktop).
+
DEVICE_DEBUG
+
Active une expérience plus developer-friendly : active le debuggage adb avec les devtools, désactive le lock screen et active les préférences pour permettre de debugger les applications certifiées.
+
NO_LOCK_SCREEN
+
xxx
+
SCREEN_TIMEOUT
+
Lorsque la valeur est à 0, cette préférence désactive le timeout de l'écran.
+
SYSTEM
+
xxx
+
GAIA_PORT
+
xxx
+
GAIA_LOCALES_PATH
+
xxx
+
GAIA_INSTALL_PARENT
+
xxx
+
LOCALES_FILE
+
xxx
+
GAIA_KEYBOARD_LAYOUTS
+
xxx
+
GAIA_KEYBOARD_DOWNLOADABLE_LAYOUTS
+
xxx
+
GAIA_KEYBOARD_ENABLE_USER_DICT
+
xxx
+
LOCALE_BASEDIR
+
xxx
+
BUILD_APP_NAME
+
Essentiellement un alias pour APP (voir plus haut).
+
PRODUCTION
+
Crée des builds productions (à la place d'une build ingénieur); L'id de l'app Facebook et d'autres id d'applications productions sont utilisées dedans. Sinon make production fonctionnera
+
GAIA_OPTIMIZE
+
Lorsque la valeur est mise à 1 cela active les étapes d'optimisations lorsqu'on compile Gaia comme la minification du code JS. Toutes les applications gaia ne sont pas affectées par cela, tant que la fonction est opt-in.
+
GAIA_DEVICE_TYPE
+
xxx
+
GAIA_DEV_PIXELS_PER_PX
+
Définis la densité de pixels pour l'appareil visé. Cela affecte les images et/ou les vidéos qui sont copiées dans la build. La valeur par défaut est à 1, mais les appareils avec des spécifications plus haute - par exemple le  Flame doivent utiliser une valeur de 1.5. C'est aliasé comme GAIA_DPPX.
+
DOGFOOD
+
Active les build Dogfood gaia.
+
MOZILLA_OFFICIAL
+
Lorsque la valeur n'est pas à 0, une build Mozilla-branded sera produite. La valeur par défaut est à 0.
+
GAIA_DEFAULT_LOCALE
+
xxx
+
GAIA_PRETRANSLATE
+
xxx
+
GAIA_CONCAT_LOCALES
+
xxx
+
GAIA_DISTRIBUTION_DIR
+
Utilisez cela pour spéficier une Gaia customisée; voir le Market customizations guide pour plus détails.
+
GAIA_APPDIRS
+
xxx
+
GAIA_ALLAPPDIRS
+
xxx
+
GAIA_MEMORY_PROFILE
+
xxx
+
NOFTU
+
Lorsque la valeur est à 1, cela met la préférence pour déactiver le FTU.
+
REMOTE_DEBUGGER
+
xxx
+
TARGET_BUILD_VARIANT
+
xxx
+
SETTINGS_PATH
+
xxx
+
FTU_PING_URL
+
xxx
+
KEYBOARD_LAYOUTS_PATH
+
xxx
+
CONTACTS_IMPORT_SERVICES_PATH
+
xxx
+
EMAIL_SERVICES_PATH
+
xxx
+
STAGE_DIR
+
xxx
+
GAIA_APP_TARGET
+
xxx
+
BUILD_DEBUG
+
xxx
+
VARIANT_PATH
+
xxx
+
REBUILD
+
xxx
+
P
+
xxx
+
VERBOSE
+
xxx
+
RAPTOR
+
Active les marques de performances en mesurant et sortant les meta-données dans le logcat. Utilisation : RAPTOR=1 make reset-gaia
+
SHARE_PERF_USAGE
+
xxx
+
DEFAULT_KEYBOAD_SYMBOLS_FONT
+
xxx
+
DEFAULT_GAIA_ICONS_FONT
+
xxx
+
MOZ_APPROX_LOCATION
+
Utilisez cela pour activer le panneau vie privée, par défaut la valeur est à off sauf dans les build ingénieur.
+
+ +

Commandes

+ +

La suite est une liste d'abreviations des commandes les plus utilisées dont vous aurez besoin. Une liste plus détaillée peut être trouvée dans Gaia make options reference.

+ +
+
make
+
Construit uniquement le profil.
+
make reset-gaia
+
Supprime le profil précédent et installe un nouveau profil Gaia.
+
make install-gaia
+
Install Gaia par dessus sans rien supprimer.
+
make production
+
Fait la même chose que PRODUCTION=1 make reset-gaia.
+
make clean
+
Supprime le profil généré.
+
make really-clean
+
Supprime le profil généré et le dossier de xul-runner; vous devez utiliser cela seulement quand tout est cassé.
+
+ +

Gecko build

+ +

Variables

+ +
+
B2G_DEBUG
+
xxx
+
VARIANT
+
Spéficie les variantes de gecko que vous voulez compiler. Les types valides sont listés ci-dessous:
+
+ + + + + + + + + + + + + + + + +
eng +

Ceci est le flag par défaut. Un make est la même chose que make eng.

+ +
    +
  • Installe les modules tagger avec: eng, debug, user, et/ou development.
    • +
  • Installe les modules non-APK qui n'ont pas de tags spéficiés.
    • +
  • Installe les APK selon les fichiers de définition du produit, en plus des tagger APK.
    • +
  • ro.secure=0
    • +
  • ro.debuggable=1
    • +
  • ro.kernel.android.checkjni=1
    • +
  • adb est activé par defaut.
    • +
  • marionette est activé
    • +
  • Ne possède pas les notifications de mise à jour par défaut ( B2G_UPDATER=1 est activé )
    • +
+
user +

Ceci est le flag attendu pour une release final.

+ +
    +
  • Installe les modules tagger avec user.
    • +
  • Installe les modules non-APK qui n'ont pas de tags spéficiés.
    • +
  • Installe les APK selon les fichiers de définition du produit, les tags sont ignorés pour les modules APK.
    • +
  • ro.secure=1
    • +
  • ro.debuggable=0
    • +
  • adb est désactivé par défaut.
    • +
  • Optimise par défaut
    • +
+
userdebug make userdebug +

La même chose que user, excepté:

+ +
    +
  • Installe aussi les modules tagger avec debug.
    • +
  • ro.debuggable=1
    • +
  • adb est activé par défaut.
    • +
  • marionette est activé
    • +
+
+ +
+

Note: Cette table est inspirée par la table Android Build Variants .

+
+ +

Commandse

+ +
+
./build.sh buildsymbols
+
Crée une build symbols pour debugger; voir Uploading symbols to Mozilla's symbol server.
+
./build.sh gecko-update-full
+
Crée un fichier mar OTA; voir Firefox OS update packages.
+
./build.sh gecko-update-fota
+
Crée un mar/zip FOTA basé sur des fichiers qui contiennent seulement un sous-ensemble de fichiers et de dossiers; see Firefox OS update packages.
+
./build.sh gecko-update-fota-full
+
Crée un mar/zip FOTA basé sur les fichiers; voir Firefox OS update packages.
+
./build.sh gecko-update-fota-fullimg
+
Crée un mar/zip FOTA basé sur les partitions; voir Firefox OS update packages.
+
diff --git a/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/b2g_installer_add-on/index.html b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/b2g_installer_add-on/index.html new file mode 100644 index 0000000000..35dcacb05d --- /dev/null +++ b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/b2g_installer_add-on/index.html @@ -0,0 +1,284 @@ +--- +title: Module complémentaire B2G installer +slug: Archive/B2G_OS/Building_and_installing_Boot_to_Gecko/B2G_installer_add-on +tags: + - B2G + - B2G installer + - Installation + - Module complémentaire + - blobfree +translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS/B2G_installer_add-on +--- +

+ +

Le module complémentaire B2G installer contribue à résoudre un problème de longue date : l'impossibilité de redistribuer des builds du système complet à cause des blobs (composants propriétaires.) Cet article détaille comment le module fonctionne et comment l'installer.

+ +
+

Important : Ce module complémentaire en est encore à un stade expérimental et il a besoin d'un mainteneur. À l'heure actuelle, il est conseillé de ne l'utiliser qu'avec un appareil que vous savez comment reflasher en cas de problème. Il n'est supporté que sur Linux (32 et 64 bits) et OSX (64 bits) pour l'instant.

+
+ +
+

Important : En ce  qui concerne la première version de ce module, il est important de comprendre que ses objectifs sont en réalité de prendre en charge le cas pratique de base suivant : flasher B2G sur un appareil supporté, fonctionnant sous le système Android (ou CyanogenMod). La gestion des mises à jour de B2G et l'obtention des Blobs à partir d'une source autre que l'appareil lui-même ne sont pas (encore) abordées.

+
+ +

Construire une distribution sans blob

+ +

Une solution au problème cité plus haut consiste à produire une distribution dite sans blob ou "blobfree" (voir le bug 1175934) qui englobe tout ce qui est nécessaire pour la compilation d'un appareil :

+ + + +

Une telle distribution sans blob peut être construite en spécifiant la cible |blobfree| make lors de la compilation de B2G :

+ +
$ ./build.sh blobfree
+ +
+

Note : Plus de détails là-dessus figurent dans la section blobfree de la page sur la compilation de B2G.

+
+ +

Le module complémentaire B2G installer simplifie l'installation de ce type de distribution.

+ +

Ajout du support d'un nouvel appareil

+ +

Pour rendre un nouvel appareil disponible dans le module lorsque l'utilisateur branche un appareil compatible, quelques étapes sont requises :

+ +
    +
  1. Assurez-vous que la génération d'une distribution sans blob est prise en charge par votre appareil. Vérifiez la section blobfree de la page Compiler B2G.
    2. +
  2. Dès lors que votre appareil dispose de ce support, vous pouvez faire en sorte qu'il soit disponible à partir du module. Tout d'abord, clonez le dépôt des builds.
    3. +
  3. Enregistrez un bogue dans Bugzilla pour le composant Firefox OS :: B2GInstaller.
    4. +
  4. Enrichissez builds.json avec les informations relatives à votre nouvel appareil.
    5. +
  5. Envoyez un PR sur Github, joignez-le au bogue que vous avez créé et faîtes une demande de review :gerard-majax.
    6. +
+ +

Le fichier builds.json contient un tableau d'objets, chacun décrivant un appareil compatible. Ces objets possèdent les propriétés suivantes :

+ + + +
+

Note : Chaque propriété Android ou variable Fastboot peut être comparée soit avec une chaîne de caractères (égalité stricte) soit avec un tableau (égalité stricte avec une des valeurs du tableau.)

+
+ +

Installation

+ +

Pour installer le module complémentaire B2G installer, il faut suivre ces étapes :

+ + + +

Vous pouvez également faire usage d'une machine virtuelle préconçue sous la forme d'un paquet OVA. Elle offre une installation prête à l'emploi de B2G Installer qui prend en charge certains appareils automatiquement (udev, etc. déjà configurés.) Voir le bug 1204482 pour plus de détails.

+ +
https://drive.google.com/file/d/0B8Ju6ek0Knd6aE5RdUkwTnlUTjQ/view?usp=sharing
+SHA1: 9cbf309fa48eb73d983150e6aab21f7facb4f327
+ +

Utilisation

+ +
    +
  1. Lorsque le module complémentaire démarre, il télécharge builds.json depuis Github pour obtenir la liste des builds disponibles. Il est toujours possible d'utiliser un fichier zip local.
    2. +
  2. Branchez votre appareil en USB et attendez qu'il soit détecté par le module.
    3. +
  3. Après que l'appareil ait été détecté comme étant supporté, une liste des builds sera proposée.
    4. +
  4. Sélectionnez le build que vous voulez, cliquez sur Flash et patientez.
    5. +
+ +

Captures d'écran

+ +

Quand aucun appareil n'est branché :

+ +

First page, no device plugged

+ +

Quand un build est sélectionné :

+ +

Device plugged in and detected

+ +

Lors du flashage d'un appareil :

+ +

Device plugged in and flashing a device

+ +

Données

+ +

Dans le but d'améliorer le module, nous collectons certaines données lorsqu'il est utilisé. Le principal objectif est de s'assurer que le module fonctionne correctement chez tout le monde. Nous collectons également des données pour savoir quels appareils intéressent les utilisateurs, de manière à ajuster les builds supportés en conséquence. Aucun pistage n'est fait.

+ +

Nous envoyons deux pings de télémétrie externes pour collecter ces données :

+ + + +

Hacking

+ + + +

À FAIRE

+ +
    +
  1. Sortir de la branche mozilla-central pour la compilation. Cela va sans doute imposer la réécriture des tests avec autre chose que mochitests.
    2. +
  2. Convertir moz.build en Makefile pour la construction des outils.
    3. +
  3. Prendre en charge des sources externes de blobs (nécessaire pour gérer les cas de mise à jour).
    4. +
diff --git a/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/b2g_os_update_packages/index.html b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/b2g_os_update_packages/index.html new file mode 100644 index 0000000000..021099552f --- /dev/null +++ b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/b2g_os_update_packages/index.html @@ -0,0 +1,534 @@ +--- +title: Créer et appliquer des paquets de mise à jour B2G OS +slug: Archive/B2G_OS/Building_and_installing_Boot_to_Gecko/B2G_OS_update_packages +tags: + - B2G OS + - FOTA + - Firefox OS + - Gaia + - Mise à jour + - OTA + - Paquets +translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS/B2G_OS_update_packages +--- +

+ +
+

Si vous souhaitez permettre aux utilisateurs de B2G OS de mettre à jour facilement la version de leur système sur leurs appareils, vous devez leur créer un paquet de mise à jour qu'ils puissent utiliser. Cet article décrit les différents types de paquets disponibles pour les mises à jour et détaille la construction du paquet, l'hébergement des mises à jour (et comment le système scrute les mises à jour disponibles), ainsi que l'application et la vérification de ces mises à jour.

+
+ +

Créer et appliquer une mise à jour se divise en quatre étapes :

+ +
    +
  1. Construire des paquets de mise à jour incrémentale à partir d'ancienne(s) version(s) vers une nouvelle version compilée sur un hôte.
    2. +
  2. Rechercher le bon paquet de mise à jour à télécharger sur le client.
    3. +
  3. Télécharger la mise à jour.
    4. +
  4. Appliquer la mise à jour aux fichiers existants sur l'appareil.
    5. +
+ +

Chacune de ces étapes est abordée ci-dessous.

+ +
+

Note : Il existe un certain nombre d'outils pratiques pour construire et tester les mises à jour système de Firefox OS, disponibles dans b2g/tools/update-tools.

+
+ +

Prérequis

+ +

Pour construire et appliquer des mises à jour, vous devez vous assurer que votre build dispose de l'updater et des outils de mise à jour associés. Par défaut, ceux-ci ne sont présents que dans les variantes userdebug et user. Vous pouvez néanmoins forcer leur construction en ajoutant la ligne suivante dans votre fichier .userconfig :

+ +
export B2G_UPDATER=1
+ +

Pour signer les paquets de mise à jour, vous aurez besoin d'installer un environnement d'exécution Java (JRE) ou le kit de développement logiciel Java (JDK), et d'avoir la commande java accessible via le path par défaut.

+ +

Types de mise à jour

+ +

Il existe deux types de mise à jour à connaître : FOTA (Firmware Over-The-Air) et OTA Gecko/Gaia (Over-The-Air). Voyons les différences qu'il y a entre les deux.

+ +

Mises à jour FOTA

+ +

Le système B2G OS entier peut être actualisé via les mises à jour FOTA, la technologie sous-jacente qui est commune avec le projet Android. Parmi les emplacements du disque dur du téléphone qui peuvent être modifiés par les mises à jour FOTA figurent la partition système, le noyau, le modem en bande de base, l'image de recovery utilisée pour la mise à jour, ou tout autre fichier présent sur l'appareil.

+ +

B2G OS ne dépend pas d'un client FOTA en particulier, une API que nous appelons librecovery constituant une interface d'abstraction. Néanmoins, nous recommandons l'utilisation du client de recovery GOTA (voir plus bas pour plus de détails), et le texte présent se base sur le fait que GOTA est utilisé.

+ +

Les paquets de mise à jour FOTA consistent essentiellement en un fichier nommé update.zip. Ce paquet est constitué des éléments suivants

+ + + +

Ce format et l'ensemble des fichiers sont identiques à ceux utilisés pour les mises à jour Android normales, excepté que B2G OS encapsule en plus le paquet update.zip dans un wrapper mar (MAR signifie Mozilla ARchive). Ce wrapper mar offre un degré supplémentaire de vérification, ce qui est expliqué plus bas.

+ +

Mises à jour OTA Gecko/Gaia

+ +

Autrement, il est possible de ne mettre à jour sur un appareil B2G OS que les fichiers de Gecko et Gaia, à travers un mécanisme que nous appelons mises à jour OTA Gecko/Gaia. L'ensemble des fichiers de Gecko et Gaia — ce qui comprend le cœur exécutif de Gecko et l'interface utilisateur de l'appareil — se trouve dans le répertoire /system/b2g de l'appareil. Il s'agit du seul répertoire auquel les mises à jour OTA peuvent apporter des modifications.

+ +

Les mises à jour OTA Gecko/Gaia utilisent la même technologie que celle mise en œuvre pour mettre à jour le navigateur web Firefox pour ordinateur de bureau. Un peu comme les paquets FOTA update.zip abordés plus haut, les mises à jour OTA consistent en un fichier MAR contenant un ensemble de diffs binaires et de nouveaux fichiers nécessaires à la mise à jour du client vers une version plus récente du logiciel.

+ +

Le client Gecko vérifie l'intégrité des MARs qu'il a téléchargés, ces derniers pouvant être signés par plusieurs parties.

+ +

Pourquoi avoir deux technologies de mise à jour ?

+ +

Les mises à jour OTA ne sont pas aussi complètes que les FOTA, mais elles sont beaucoup plus ergonomiques et simples à appliquer, et elles correspondront mieux à vos besoins concernant les mises à jour :

+ + + +

Bien sûr, s'il vous faut actualiser des fichiers autres que ceux de Gecko/Gaia, vous n'aurez pas d'autre choix que de passer par un paquet FOTA complet.

+ +

Voyons à présent la suite avec l'examen du processus de construction du paquet.

+ +

Construire des paquets de mise à jour

+ +

La construction des mises à jour est le processus consistant à générer les fichiers nécessaires à la mise à jour des clients B2G OS d'une version X du logiciel vers une nouvelle version Y. Le paquet de mise à jour requis pour le client dépend des fichiers qui ont été modifiés entre la version X et la version Y.

+ + + +

Pour générer un paquet de mise à jour incrémentale (que ce soit pour des mises à jour FOTA ou OTA Gecko/Gaia), nos outils nécessitent la construction complète de la version X et de la version Y. Une construction complète signifie que le paquet intègre tous les fichiers nécessaires au flashage d'un client. Lorsque nous produisons une construction complète pour la version X, nous ne savons pas quelle sera la future version vers laquelle il faudra effectuer la mise à jour de la version X . C'est pour cette raison que les paquets FOTA et les paquets Gecko/Gaia complets doivent être construits pour chaque version. Cela permet de générer aussi bien une mise à jour OTA Gecko/Gaia incrémentale qu'une mise à jour FOTA incrémentale si besoin, entre la version X et toutes les versions futures.

+ +

Schématiquement, le processus de construction d'un mise à jour ressemble à ceci :

+ +
    +
  1. Avec le logiciel version X + +
      +
    • Générer un fichier MAR OTA Gecko/Gaia complet du contenu de /system/b2g.
      • +
    • Générer une archive zip des fichiers cibles pour la mise à jour FOTA complète, éventuellement signée, pour les partitions de l'appareil. Le zip des fichiers cibles est référencé plus bas sous le nom DEVICE-target_files-$VARIANT.$USER.zip, c'est un zip contenant les fichiers pour mettre à jour les répertoires du téléphone, dont SYSTEM/, BOOT/, etc. Un fichier FOTA complet update.zip peut être produit à partir du zip des fichiers cibles.
      • +
    +
    2. +
  2. Avec le logiciel version Y +
      +
    • Générer un fichier MAR OTA Gecko/Gaia complet du contenu de /system/b2g.
      • +
    • Générer une archive zip des fichiers cibles pour la mise à jour FOTA complète, éventuellement signée, pour les partitions de l'appareil. Le zip des fichiers cibles est référencé plus bas sous le nom DEVICE-target_files-$VARIANT.$USER.zip, c'est un zip contenant les fichiers pour mettre à jour les répertoires du téléphone, dont SYSTEM/, BOOT/, etc. Un fichier FOTA complet update.zip peut être produit à partir du zip des fichiers cibles.
      • +
    +
    3. +
  3. Si seuls des fichiers de /system/b2g ont changé, générer un fichier MAR pour une mise à jour OTA Gecko/Gaia incrémentale de la version X vers la version Y.
    4. +
  4. Sinon, générer un fichier FOTA incrémental update.zip de la version X vers la version Y. Intégrer cette mise à jour FOTA incrémentale update.zip dans un fichier MAR pour le distribuer auprès du client B2G.
    5. +
  5. Signer les paquets comme cela est requis pour les autorisations de distribution.
    6. +
+ +

Les sous-sections ci-dessous décrivent comment utiliser les outils de B2G pour implémenter chacune de ces étapes.

+ +
+

Note : les étapes ci-après supposent que vous avez déjà mis en place un environnement de compilation b2g à l'emplacement $b2g. Les commandes ci-dessous font référence au script $b2g/build.sh mais make peut tout aussi bien être utilisé.

+
+ +

Générer un fichier MAR complet de mise à jour OTA Gecko/Gaia

+ +

Pour générer un MAR de mise à jour OTA complète à partir de la dernière compilation de b2g réussie (e.g. que vous avez compilée vous-même), vous devez invoquer la cible gecko-update-full. Pour placer le MAR dans $b2g/objdir-gecko/dist/b2g-update/b2g-gecko-update.mar, utilisez les commandes suivantes :

+ +
$ cd $b2g
+$ ./build.sh gecko-update-full
+$ cp objdir-gecko/dist/b2g-update/b2g-gecko-update.mar <destination>
+
+ +

Générer un fichier MAR de mise à jour FOTA complète

+ +

Pour générer un MAR de mise à jour FOTA complète à partir de la dernière compilation de b2g réussie (e.g. que vous avez compilée vous-même), vous devez invoquer la cible gecko-update-fota-full. Cela intègre le contenu de la partition /system dans sa totalité. Voici les commandes dont vous avez besoin :

+ +
$ cd $b2g
+$ ./build.sh gecko-update-fota-full
+
+ +

Un fichier ZIP sera généré ($PRODUCT_OUT/fota/full/update.zip) ainsi qu'un fichier MAR ($PRODUCT_OUT/fota-$TARGET_DEVICE-update-full.mar). Le fichier ZIP peut être utilisé directement avec adb sideload, tandis que le MAR est prévu pour être distribué de la même manière que tout autre paquet de mise à jour.

+ +

Générer un fichier MAR de mise à jour FOTA plus un paquet de recovery

+ +

Depuis Firefox OS 2.2 (mi-avril et après) nous avons ajouté une nouvelle cible pour make, elle peut être appelée ainsi :

+ +
$ cd $b2g
+$ ./build.sh gecko-update-fota-fullimg
+ +

Elle est utilisée pour produire un paquet de recovery constituant un dump du jeu d'images de partitions. Le jeu par défaut est contrôlé par la variable B2G_FOTA_FULLIMG_PARTS, définie dans gonk-misc/Android.mk (parmi la plupart des autres nouvelles fonctionnalités vues plus bas.) Il s'agit d'une chaîne de caractères utilisant l'espace comme séparateur, listant les instances mountpoint:image à inclure. La valeur par défaut est "/boot:boot.img /system:system.img /recovery:recovery.img /cache:cache.img".

+ +

Avec tout ça, nous avons également introduit quelques nouvelles variables d'environnement pour contrôler la production de deux autres cibles make — gecko-update-fota et gecko-update-fota-full :

+ + + +
+

Note : Toutes ces nouvelles fonctionnalités reposent fortement sur la disponibilité d'un fichier recovery.fstab correct fourni pour l'appareil concerné.

+
+ +

Générer un fichier MAR de mise à jour FOTA Gecko/Gaia partielle

+ +

Une mise à jour FOTA partielle utilise le même mécanisme que pour celles complètes, mais par défaut, seuls sont inclues les mises à jour Gecko/Gaia, tout comme une mise à jour OTA normale. Des fichiers supplémentaires autres que ceux de Gecko/Gaia peuvent aussi être intégrés (tels que des polices de caractères).

+ +

La logique derrière la génération d'un paquet de mise à jour FOTA partielle est principalement conditionnée par des problèmes de licence : lors de la construction d'un paquet de mise à jour FOTA complet, la partition système entière (au moins) sera intégrée. Elle peut comporter des blobs que vous n'êtes pas autorisé à redistribuer. Cependant, comme la distribution de MAR est utile et que Gecko/Gaia eux-mêmes sont des logiciels libres, il n'y a aucune raison pour que nous ne puissions pas être en mesure de les distribuer de cette façon. Une FOTA partielle permet de ne mettre à jour qu'un sous-ensemble du système. Dans un tel scénario, une mise à jour OTA pourrait être employée à la place, mais cela aurait un coût : les mises à jour OTA ont besoin d'assez d'espace sur la partition système pour contenir à la fois les fichiers Gecko/Gaia existants et les fichiers de mise à jour décompressés. Une mise à jour FOTA partielle ne possède pas cette contrainte car elle écrase les fichiers existants par ceux de la mise à jour.

+ +

Pour créer une mise à jour FOTA partielle à partir de la dernère compilation de b2g réussie (e.g. que vous avez compilée vous-même), invoquez la cible gecko-update-fota avec les commandes suivantes :

+ +
$ cd $b2g
+$ ./build.sh gecko-update-fota
+
+ +

Elles vont générer un fichier ZIP ($PRODUCT_OUT/fota/partial/update.zip) et un fichier MAR ($PRODUCT_OUT/fota-$TARGET_DEVICE-update.mar). Le fichier ZIP peut être utilisé directement avec adb sideload, tandis que le fichier MAR est destiné à être distribué de la même manière que tout autre paquet de mise à jour.

+ +

La construction peut être contrôlée par un certain nombre de variables d'environnement, les plus utiles d'entre-elles sont documentées ci-dessous :

+ + + + + + + + + + + + + + + + + + + + + + +
VariableSignification
$B2G_FOTA_DIRSListe des répertoires à inclure dans la mise à jour, séparés par des espaces. system/b2g par défaut.
$TARGET_UPDATE_BINARYBinaire utilisé pour exécuter le script Edify à l'intérieur du paquet. Si aucun binaire n'est spécifié, un updater binaire pré-construit issu de ICS sera utilisé.
$FOTA_FINGERPRINTSListe d'empreintes Android, séparées par des virgules, avec lesquelles faire les contrôles. Le cas pratique est la possibilité de distribuer des paquets de mise à jour Gecko/Gaia par-dessus un système de base Gonk sous contrôle qu'il ne nous est pas possible de distribuer légalement. Par exemple, les builds communautaires de l'Open C les utilisent.
+ +
+

Note : Un ensemble complet de ces variables est défini dans le fichier Android.mk du répertoire gonk-misc ; remarquez que $FOTA_FINGERPRINTS est utilisé dans notre outil update_tools.py.

+
+ +

Générer une archive zip des fichiers cibles pour une mise à jour FOTA complète

+ +

Invoquez la cible target-files-package pour construire un zip des fichiers cibles qui pourra servir à générer des mises à jour FOTA tant complète qu'incrémentale. Le zip des fichiers cibles peut aussi être signé avec des clés personnalisées pour garantir que seules les mises à jour FOTA en provenance de sources connues  puissent être installées. Après signature des fichiers cibles, toutes les images et mises à jour (OTA aussi) doivent à nouveau être générées pour obtenir les clés insérées.

+ +
+

Note : Le zip des fichiers cibles est généré à l'emplacement out/target/product/$DEVICE/obj/PACKAGING/target_files_intermediates/$DEVICE-target_files-$VARIANT.$USER.zip

+
+ +

Cette étape est réalisée par les commandes suivantes :

+ +
$ cd $b2g
+$ ./build.sh target-files-package
+$ cp out/target/product/$DEVICE/obj/PACKAGING/target_files_intermediates/$DEVICE-target_files-$VARIANT.$USER.zip <destination>
+
+ +

Les valeurs des variables dans les commandes listées ci-dessus doivent être remplies comme suit :

+ + + + + + + + + + + + + + + + + + + + + + +
VariableSignification
$DEVICENom de l'appareil pour le produit AOSP
$VARIANTeng, user, ou userdebug
$USERLe nom d'utilisateur du build
+ +

Signer le zip des fichiers cibles d'une FOTA complète

+ +

Les distributions correctes devraient en principe être signées par des clés personnalisées connues uniquement du vendeur. Grâce à l'introduction de cette couche de sécurité supplémentaire, le fait de posséder de telles clés empêchera l'installation de mises à jour FOTA dont la source est inconnue. Pour que cela fonctionne, les images flashées sur un appareil doivent inclure les clés publiques tandis que les mises à jour doivent être signées avec les clés privées correspondantes. 

+ +

La première étape consiste à générer des clés personnalisées et à les stocker en lieu sûr. Android Open Source Project dispose d'un script pour générer ces clés. Pour une compatibilité totale, récupérez ce script depuis la branche correspondant à la version de Gonk présente sur l'appareil en question. La version pour la branche master se trouve ici.

+ +

Plusieurs clés sont requises — créez-les avec les commandes suivantes. releasekey est la clé à utiliser pour signer les paquets de mise à jour FOTA.

+ +
$ development/tools/make_key releasekey '/C=US/ST=California/L=Mountain View/O=Android/OU=Android/CN=Android/emailAddress=android@android.com'
+$ development/tools/make_key platform '/C=US/ST=California/L=Mountain View/O=Android/OU=Android/CN=Android/emailAddress=android@android.com'
+$ development/tools/make_key shared '/C=US/ST=California/L=Mountain View/O=Android/OU=Android/CN=Android/emailAddress=android@android.com'
+$ development/tools/make_key media '/C=US/ST=California/L=Mountain View/O=Android/OU=Android/CN=Android/emailAddress=android@android.com'
+
+ +

Une fois les clés présentes, le fichier zip des fichiers cibles peut être signé par l'emploi des commandes suivantes. Elles vont insérer les clés publiques et modifier les propriétés du build pour refléter le fait qu'il ait été signé.

+ +
$ cd $b2g
+$ ./build/tools/releasetools/sign_target_files_apks \
+  --default_key_mappings $RELEASEKEY_FOLDER \
+  --replace_ota_keys \
+  --signapk_path prebuilts/sdk/tools/lib/signapk.jar \
+  $UNSIGNED_TARGET_FILES_ZIP \
+  $SIGNED_TARGET_FILES_ZIP
+ +

Les valeurs des variables présentes dans les commandes listées plus haut doivent être remplies de la manière qui suit :

+ + + + + + + + + + + + + + + + + + + + + + +
VariableSignification
$RELEASEKEY_FOLDERLe chemin du dossier contenant les clés personnalisées
$UNSIGNED_TARGET_FILES_ZIPLe zip des fichiers cibles FOTA à signer.
$SIGNED_TARGET_FILES_ZIPLe zip des fichiers cibles FOTA qui doit être généré
+ +

Générer un fichier MAR de mise à jour OTA incrémentale

+ +

Dans cet exemple, nous supposons générer une mise à jour du logiciel version X vers la version Y. L'emplacement du fichier MAR de l'OTA Gecko/Gaia complète compilé à partir du logiciel version X en suivant les instructions ci-dessus sera appelé $MAR_X par la suite. ll peut s'agir d'un chemin sur le serveur de compilation comme /home/build/b2g/versions/X/update.mar. De manière similaire, l'emplacement du MAR complet compilé à partir de la version Y sera appelé $MAR_Y.

+ +

L'outil build-gecko-mar.py va générer un fichier MAR de mise à jour OTA Gecko/Gaia incrémental en utilisant $MAR_X et $MAR_Y. La destination du fichier généré sera appelée $GENERATED_INCREMENTAL_MAR_X_Y. Utilisez les commandes suivantes pour cette étape :

+ +
$ cd $b2g
+$ ./tools/update-tools/build-gecko-mar.py --from $MAR_X --to $MAR_Y $GENERATED_INCREMENTAL_MAR_X_Y
+
+ +

Générer une archive zip de mise à jour FOTA incrémentale

+ +

Dans cet exemple, nous supposons générer une mise à jour du logiciel version X vers la version Y. L'emplacement du zip cible pour la FOTA complète construite à partir du logiciel version X en utilisant les instructions ci-dessus sera appelé $TARGET_FILES_X par la suite. Il peut s'agir d'un chemin sur un serveur de compilation comme /home/build/b2g/versions/X/target_files.zip. De manière similaire, l'emplacement du zip cible pour la FOTA complète construite à partir de la version Y sera appelé $TARGET_FILES_Y.

+ +

L'outil build/tools/releasetools/ota_from_target_files va générer un fichier FOTA update.zip incrémental en se servant de $TARGET_FILES_X et de $TARGET_FILES_Y. La destination de ce fichier intermédiaire sera appelée $INTERMEDIATE_FOTA_UPDATE_FOTA_X_Y.

+ +

Après la génération de ce update.zip, la dernière étape sera de l'encapsuler dans un MAR pour le livrer au client B2G. L'outil tools/update-tools/build-fota-mar.p effectue cette opération. La destination où générer le fichier sera appelée $GENERATED_INCREMENTAL_FOTA_X_Y.

+ +

Utilisez les commandes suivantes pour achever cette étape  :

+ +
$ cd $b2g
+$ ./build/tools/releasetools/ota_from_target_files -v \
+    --incremental_from $TARGET_FILES_X \
+    --signapk_path prebuilts/sdk/tools/lib/signapk.jar \
+    --package_key $FOTA_SIGNING_KEY \
+    $TARGET_FILES_Y \
+    $INTERMEDIATE_FOTA_UPDATE_FOTA_X_Y
+$ ./tools/update-tools/build-fota-mar.py $INTERMEDIATE_FOTA_UPDATE_FOTA_X_Y --output=$GENERATED_INCREMENTAL_FOTA_X_Y
+
+ +

Les valeurs des variables employées dans les commandes listées ci-dessus devraient être remplies de la manière suivante :

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
VariableMeaning
$TARGET_FILES_XLe zip des fichiers cibles FOTA pour la version X
$TARGET_FILES_YLe zip des fichers cibles FOTA pour la version Y
$INTERMEDIATE_FOTA_UPDATE_FOTA_X_YUn fichier update.zip temporaire à partir duquel générer un MAR
$GENERATED_INCREMENTAL_FOTA_X_YLe zip destination de la mise à jour incrémentale encapsulé dans un fichier MAR pour être livré aux clients
$FOTA_SIGNING_KEYChemin vers le préfixe d'une clé privée et d'un certificat public destinés à signer le fichier update zip. $FOTA_SIGNING_ZIP.pk8 et $FOTA_SIGNING_ZIP.x509.pem doivent tous deux être présents sur le système de fichiers. Si $TARGET_FILES_X n'est pas signé, cette option peut être omise ; la clé de test par défaut sera alors récupérée. Dans le cas où $TARGET_FILES_X est une clé personnalisée, se référer à la section pour la signature du zip des fichiers cibles pour savoir comment la créer, et ne pas oublier de signer $TARGET_FILES_Y.
+ +

Hébergement des mises à jour et recherche de nouvelles versions côté client

+ +

Les clients B2G OS scrutent les mises à jour en récupérant et analysant un manifeste de mise à jour : update.xml. Les clients B2G OS sont configurés pour rechercher des mises à jour sur des serveurs spécifiques — ils interrogent un chemin construit spécialement sur le serveur. HTTPS est le protocole recommandé pour être utilisé par le client pour interroger le serveur, cependant, HTTP est aussi pris en charge. Le serveur et le chemin consultés par les clients peuvent être modifiés par la livraison aux clients existants d'une mise à jour qui change le code de scrutation.

+ +

Dans les exemples ci-dessous, nous estimerons que les mises à jour sont hébergées sur le serveur updates.b2g.com.

+ +

L'URL scrutée par le client contient habituellement les paramètres suivants :

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
ParamètreExplication
PRODUCT_MODELLe nom du modèle d'appareil. C'est la valeur ro.product.model de la base de données des propriétés de B2G.
CHANNELLe "canal" de mise à jour. Il est utile pour les tests : les serveurs peuvent être configurés pour héberger, par exemple, les canaux "nightly", "beta", et "release".
VERSIONLa version du logiciel du client. Par exemple, "18.0.2".
BUILD_IDUn ID unique, comme un horodatage, configuré pour une compilation en particulier.
+ +

Le client Firefox utilise les valeurs de son hôte de mise à jour configuré et de ces valeurs pour construire une URL à interroger pendant l'exécution. La structure est la suivante :

+ +
https://aus4.mozilla.org/update/3/%PRODUCT%/%VERSION%/%BUILD_ID%/%PRODUCT_DEVICE%/%LOCALE%/%CHANNEL%/%OS_VERSION%/%DISTRIBUTION%/%DISTRIBUTION_VERSION%/update.xml
+ +

Un exemple réel d'une telle URL est comme ceci :

+ +
https://aus4.mozilla.org/update/3/B2G/37.0a1/20141214040212/flame/en-US/nightly-b2g37/Boot2Gecko%202.2.0.0-prerelease%20%28SDK%2019%29/default/default/update.xml?force=1
+ +

Si le serveur renvoie "404 Not Found" en réponse à la requête du client, cela signifie qu'aucune mise à jour n'est disponible. S'il renvoie "200" et un fichier de manifeste, alors c'est qu'une mise à jour peut être disponible. Le manifeste décrit la version nouvellement disponible ; autrement dit, celle vers laquelle le client peut être mis à jour. Voici un exemple de manifeste :

+ +
<?xml version="1.0"?>
+<updates>
+  <update type="major" appVersion="19.0" version="19.0" extensionVersion="19.0" buildID="20121210123456"
+          licenseURL="http://www.mozilla.com/test/sample-eula.html"
+          detailsURL="http://www.mozilla.com/test/sample-details.html"
+          isOSUpdate="true">
+    <patch type="partial" URL="https://updates.b2g.com/release/unagi1/18.0/20121203123456/update.mar"
+           hashFunction="SHA512" hashValue="5111e033875752b7d9b32b4795152dea5ef954cb8a9d4a602dd19a923b464c43521287dcb5781faf3af76e6dc5e8a3dd9c13edea18c1f2c8f3bd89e17d103d6f"
+           size="41901319"/>
+  </update>
+</updates>
+
+ +

Il suit le même schéma que le manifeste de compilation B2G (voir le format updates.xml pour plus de détails). Les champs du manifeste décrivent :

+ + + +
+

Note : Il existe un script utile de mise à jour disponible sur build-update-xml.py, lequel, à partir d'un fichier MAR donné, construit un fichier B2G OS update.xml pour test.

+
+ +
+

Note : L'appareil du client ou l'utilisateur peut choisir de refuser une mise à jour.

+
+ +
+

Note :  isOSUpdate="true" est requis pour les mises à jour FOTA mais pas pour les OTA.

+
+ +

En utilisant le mécanisme décrit plus haut, les serveurs peuvent héberger des paquets de mise à jour pour que tout client avec une ancienne version puisse passer à une nouvelle version. Ou alors, ils peuvent héberger uniquement un "historique linéaire de mises à jour" à partir duquel les clients peuvent se mettre à jour via un chemin unique.

+ +

Les détails de l'interaction entre les serveurs de compilation et l'hôte de mise à jour dépassent pour l'instant la portée de ce document. Elle est très grandement dépendante de l'environnement de production. Vous pouvez trouver quelques détails supplémentaires sur notre page de wiki Software Update.

+ +

Vérifier et appliquer les mises à jour

+ +

Après qu'un client B2G OS ait détecté avec succès une mise à jour (ce qui est fait depuis le système lui-même), téléchargé celle-ci et vérifié l'intégrité du paquet de mise à jour téléchargé, l'étape finale est d'appliquer la mise à jour.

+ +

La première chose dans l'application d'une mise à jour est la vérification de la signature embarquée dans les paquets MAR (voir Generating an incremental FOTA update zip sur la façon dont elles sont créées). Cela est réalisé par le client B2G OS lui-même après le contrôle de l'intégrité du paquet téléchargé. Le code utilisé pour cette tâche est le même que ce soit pour les mises à jour FOTA ou pour celles OTA Gecko/Gaia.

+ +
+

Note : Ce n'est pas le fichier MAR qui est signé : c'est le fichier zip FOTA empaqueté dans le MAR qui est signé par build/tools/releasetools/ota_from_target_file. La signature de la mise à jour FOTA fonctionne de la même manière que sur Android ; si vous lancez simplement le script sans spécifier de clé, il utilisera les clés développeurs build/target/product/security/testkeys.*. Ça ne pose pas de problème pour des tests, mais lorsque vous créez une véritable mise à jour vous aurez besoin d'une clé sécurisée — i.e. une que personne d'autre ne connaît. Comme l'appareil va également vérifier cette signature avant d'appliquer le patch, les images initiales de l'appareil doivent elles aussi contenir la clé.

+
+ +
+

Note : Les clés mentionnées plus haut se trouvent dans les systèmes de compilation d'Android ; nous les avons dupliquées sur notre dépot platform_build.

+
+ +

Après la vérification des signatures, le processus d'application d'une mise à jour diverge selon le type de mise à jour, OTA Gecko/Gaia ou FOTA. À ce stade, voyons les différences entre les deux.

+ +

Appliquer des mises à jour OTA Gecko/Gaia

+ +

Le client B2G OS applique celles-ci grâce à l'utilisation du binaire updater. Il fait partie de la distribution Gecko et son code est le même que celui utilisé pour mettre à jour la version de bureau de Firefox. Comme cela a été décrit précédemment, la mise à jour est appliquée pendant que le client B2G OS continue de fonctionner normalement. Pendant l'application des mises à jour, les utilisateurs sont toujours en mesure de passer des appels ou d'en recevoir, de lancer des applications, de naviguer sur le web etc.

+ +

Les détails spécifiques au binaire updater dépassent le cadre de ce document mais il fonctionne approximativement de cette manière :

+ + + +

Après le redémarrage du processus b2g, l'utilisateur bénéficiera de la nouvelle version du logiciel client B2G.

+ +

Appliquer des mises à jour FOTA

+ +

Elles sont appliquées par le client FOTA. Le client Gecko se "débarrasse" de la mise à jour en appelant l'API librecovery qui se chargera de l'appliquer. Ce qui arrive après cette étape est spécifique à chaque client FOTA.

+ +

Dans l'implémentation de librecovery utilisée par le client GOTA, l'application du paquet de mise à jour téléchargé est planifiée et des commandes particulières sont mises en file d'attente pour le client de recovery. librecovery redémarre ensuite l'appareil en mode recovery. Le client recovery lance ensuite le script de mise à jour situé dans le fichier update.zip pour mettre à jour les fichiers et les partitions si nécessaire. Le client de recovery peut avoir besoin de redémarrer plusieurs fois afin de mettre à jour tous les fichiers.

+ +

Après le redémarrage final, l'appareil fonctionnera avec la nouvelle version du logiciel client B2G OS.

diff --git a/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/compiler_pour_le_flame_sur_os_x/index.html b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/compiler_pour_le_flame_sur_os_x/index.html new file mode 100644 index 0000000000..263c6b7e7c --- /dev/null +++ b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/compiler_pour_le_flame_sur_os_x/index.html @@ -0,0 +1,174 @@ +--- +title: Compiler Firefox OS pour le Flame sur Mac OS X +slug: >- + Archive/B2G_OS/Building_and_installing_Boot_to_Gecko/Compiler_pour_le_Flame_sur_OS_X +tags: + - Documentation de compilation + - Firefox OS + - Flame + - Guide + - Mac OS X +translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS/Building_for_Flame_on_OS_X +--- +

Cet article donne les instructions sur la façon de compiler Firefox OS pour les appareils Flame en utilisant un système Mac OS X comme plate-forme de compilation.

+ +
Note : Ce guide part du principe que le célèbre gestionnaire de paquets Homebrew est installé. Si ce n'est pas le cas, vous allez devoir soit l'installer, soit installer un gestionnaire de paquets équivalent et apprendre à vous en servir.
+ +

Préparation de l'environnement de compilation

+ +

La première étape consiste à installer les prérequis pour la compilation comme d'habitude. Installez ensuite binutils afin que la commande objdump soit disponible pour les builds de débogage :

+ +
brew install binutils
+ +

Créez une image disque en utilisant le système de fichiers journalisé et sensible à la casse HFS+ puis montez l'image avec les commandes suivantes.

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

Note : Comme l'image est créée en tant qu'image de type "sparse", seuls les blocs du disque réellement utilisés prendront de l'espace disque sur le support physique. Cela signifie qu'une image de 40 Go, comme celle ci-dessus, ne prendra pas vraiment jusqu'à 40 Go d'espace. Au lieu de ça, elle va croître progressivement au fur et à mesure que vous y écrirez des données.

+
+ +

Clonage du dépôt B2G

+ +

Évidemment, avant de pouvoir lancer votre première compilation, il est nécessaire de cloner le dépôt B2G. Il est important de noter que cela ne va pas tout récupérer. Seuls le système de construction et les utilitaires de configuration seront obtenus. La quasi-totalité du code proprement dit se trouve dans le principal dépôt Mercurial de Mozilla ; ces fichiers seront rapatriés plus tard lors du processus de configuration.

+ +

Pour cloner le dépôt, utilisez git :

+ +
git clone git://github.com/mozilla-b2g/B2G.git
+ +

Une fois l'opération terminée (ça ne devrait prendre qu'une minute avec une connexion rapide), utilisez cd pour aller dans le répertoire B2G :

+ +
cd B2G
+ +

Configuration de B2G pour le flame

+ +

Après avoir récupéré le cœur du système de construction de B2G, vous devez le configurer pour l'appareil sur lequel vous prévoyez de l'installer ; dans le cas présent, il s'agit du "flame". Exécutez la commande suivante depuis le répertoire B2G :

+ +
./config.sh flame-kk
+ +

C'est à ce moment que la plus grande partie du code sera téléchargée. Le code source faisant environ une quinzaine de giga-octets, le téléchargement va prendre un certain temps même avec une connexion internet rapide. Même avec une bonne connexion haut-débit, cela peut prendre une heure ou davantage.

+ +
+

Note : Sérieusement, cela prendra vraiment énormément de temps si vous avez une connexion Internet plutôt lente. Tenez-en compte (ainsi que des coûts de connexion au méga-octet que vous pourriez avoir à payer) avant d'effectuer cette étape.

+
+ +

Sauvegarde des fichiers importants de l'appareil

+ +

Avant de commencer le processus d'installation, il est important de faire une sauvegarde de certains fichiers clés de l'appareil. Ceux-ci seront nécessaires si vous avez besoin de reflasher l'appareil. 

+ +

À ce stade, branchez votre Flame s'il ne l'était pas déjà ; le processus de configuration aura besoin d'y accéder. Utilisez la commande adb devices pour vérifier s'il est connecté :

+ +
adb devices -l
+
+ +

Seront listés tous les appareils compatibles Android ou B2G connectés. Si le vôtre n'est pas dans la liste, c'est que quelque chose n'est pas connecté correctement.

+ +

Après avoir obtenu la confirmation que l'appareil est bien connecté, vous pouvez réaliser la sauvegarde avec les commandes suivantes :

+ +
mkdir flame-backup
+cd flame-backup
+adb pull /system system
+adb pull /data data
+ +

À noter, si vous compilez pour la première fois, vous pouvez décider de partir sur la version la plus récente de l'image de base du flame ; voir https://developer.mozilla.org//fr/Firefox_OS/Guide_Telephone_Developpeur/Flame/mettre_a_jour_Flame#Flashage_vers_la_dernière_image_(2.5) pour davantage de détails.

+ +

Contournement d'un problème de compilation avec Mac OS X

+ +

Un problème peut survenir lors de la compilation sur Mac OS X. La communauté Mozilla a conçu une solution pour celui-ci ; elle a été testée sur Mac OS X 10.9.4 "Mavericks."

+ +

mkfs.vfat non existant

+ +

Il est nécessaire d'installer un port de dosfstools afin de pouvoir utiliser l'image.

+ +
brew create https://github.com/sv99/dosfstools-osx.git
+ +

Éditez ensuite la formule que brew va utiliser pour construire le logiciel dosfstools :

+ +
require "formula"
+
+class Dosfstools < Formula
+  homepage "https://github.com/sv99/dosfstools-osx"
+  url "https://github.com/sv99/dosfstools-osx.git"
+  sha1 ""
+
+  def install
+    system "make", "install"
+  end
+end
+
+ +

À présent, vous êtes prêt pour l'installer :

+ +
brew install dosfstools
+ +

Modification de la configuration pour contourner les bogues

+ +

Dans certaines circonstances, des bogues du système de construction peuvent empêcher la compilation sur Mac OS X. Les cas en question sont :

+ + + +

Utilisez votre éditeur de texte préféré pour créer un fichier appelé .userconfig dans le répertoire B2G. Le contenu suivant doit être placé à l'intérieur de ce fichier .userconfig :

+ +
+
+
# .userconfig for Flame build 14.08.2014
+# osx repo change
+# Bug 1039223 - Build for flame fails complaining of missing dt.img
+# https://bugzilla.mozilla.org/show_bug.cgi?id=1039223
+pushd device/qcom/common/dtbtool
+patch -N << EOF
+--- a/dtbtool/dtbtool.c
++++ b/dtbtool/dtbtool.c
+@@ -616,7 +616,7 @@ int main(int argc, char **argv)
+        extract "qcom,msm-id" parameter
+      */
+     while ((dp = readdir(dir)) != NULL) {
+-        if ((dp->d_type == DT_REG)) {
++        if ((dp->d_type == DT_REG||dp->d_type == DT_UNKNOWN)) {
+             flen = strlen(dp->d_name);
+             if ((flen > 4) &&
+                 (strncmp(&dp->d_name[flen-4], ".dtb", 4) == 0)) {
+EOF
+
+popd
+
+# Bug 1027682 - [Flame][Build] Failed to build on Mac OS X 10.9, elf.h file not found
+# https://bugzilla.mozilla.org/show_bug.cgi?id=1027682
+if [[ ! -e /usr/local/include/elf.h ]]; then
+  cp "${B2G_DIR}/external/elfutils/libelf/elf.h" /usr/local/include
+  echo "Bug 1027682: elf.h copied into /usr/local/include"
+fi
+
+# Disable First Time User experience
+export NOFTU=1
+echo "NOFTU = ${NOFTU}"
+
+# Enable gaia developer mode
+export DEVICE_DEBUG=1
+echo "DEVICE_DEBUG = ${DEVICE_DEBUG}"
+
+# Keeping both debug and non-debug objects
+#export GECKO_PATH=${B2G_DIR}/mozilla-inbound
+echo "GECKO_PATH = ${GECKO_PATH}"
+
+export B2G_DEBUG=1
+echo "B2G_DEBUG = ${B2G_DEBUG}"
+
+#export GECKO_OBJDIR=${GECKO_PATH}/objdir-gonk
+if [[ "${B2G_DEBUG}" != "0" ]]; then
+  export GECKO_OBJDIR=${GECKO_OBJDIR}-debug
+fi
+echo "GECKO_OBJDIR = ${GECKO_OBJDIR}"
+ +

Lancement de votre première compilation

+ +

Maintenant vous êtes enfin prêt à lancer la compilation ! Lancez-la de la même manière que pour toute autre compilation de Firefox OS :

+ +
./build.sh
+
+
diff --git "a/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/configurer_votre_premi\303\250re_construction/index.html" "b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/configurer_votre_premi\303\250re_construction/index.html" new file mode 100644 index 0000000000..6840a7f37b --- /dev/null +++ "b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/configurer_votre_premi\303\250re_construction/index.html" @@ -0,0 +1,87 @@ +--- +title: Configurer votre première construction +slug: >- + Archive/B2G_OS/Building_and_installing_Boot_to_Gecko/Configurer_votre_première_construction +translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS/Configure_your_first_build +--- +

Cloner le dépôt B2G

+ +

Vous disposez de plusieurs outils utiles pour construire Firefox OS, tous contenus dans un unique dépôt. Téléchargez-les via git pour créer votre répertoire de travail.

+ +
git clone git://github.com/mozilla-b2g/B2G.git && cd B2G
+ +

Configurer B2G pour votre appareil

+ +

Nous devons à présent télécharger le code source. La commande suivante affichera une liste des cibles.

+ +
./config.sh
+
+ +

Cela montrera une liste d'appareils compatibles. Pour plus d'informations sur les appareils qu'il est possible de construire, se reporter à la page des Appareils Compatibles.

+ +
Valid devices to configure are:
+
+* [LEGACY] AOSP Ice Cream Sandwich base
+- emulator
+- emulator-x86
+
+* [LEGACY] AOSP Jellybean base
+- emulator-jb
+- emulator-x86-jb
+- nexus-4
+- flame
+
+* AOSP KitKat base
+- emulator-kk
+- emulator-x86-kk
+- nexus-4-kk
+- nexus-5
+- flame-kk
+- leo-kk    (Z3 KK)
+- aries-kk  (Z3 Compact KK)
+
+* AOSP Lollipop base
+- emulator-l
+- emulator-x86-l
+- nexus-5-l
+- nexus-6-l
+- flame-l
+- leo-l       (Z3 L)
+- aries-l     (Z3 Compact L)
+- scorpion-l  (Z3 Tablet Compact L)
+- sirius-l    (Z2 L)
+- honami-l    (Z1 L)
+- amami-l     (Z1 Compact L)
+- tianchi-l   (T2U L)
+- seagull-l   (T3 L)
+- eagle-l     (M2 L)
+- flamingo-l  (E3 L)
+
+ +

Si votre appareil n'est pas (encore) compatible avec B2G, reportez-vous au Guide de portage.

+ +

Sélectionnez votre cible en l'ajoutant à la commande ./config.sh. Si vous voyez votre cible plusieurs fois, choisissez la variante en fonction de la base AOSP la plus récente disponible. Par exemple, construire pour le Nexus 5 :

+ +
./config.sh nexus-5-l
+
+ +

Cela téléchargera beaucoup de données (jusqu'à 20Go), aussi nous vous recommandons d'effectuer cette tâche avant de manger ou même la nuit si vous avez une connexion lente.

+ +

Blobs propriétaires

+ +

Malheureusement, chaque appareil nécessite un ensemble de blobs propriétaires. Comme le système de construction va les extraire directement depuis votre appareil, vous devez le brancher avant de lancer la construction.

+ +

Pour les appareils Nexus et Sony, le processus de construction téléchargera également certains blobs directement depuis Google ou Sony, assurez-vous de bien suivre les instructions affichées à l'écran pour ces modèles ; vous aurez besoin d'accepter un accord de licence.

+ +

Construire Firefox OS

+ +

Tout ce que vous avez à faire consiste à lancer :

+ +
./build.sh
+
+ +

Étapes suivantes

+ +

Si vous compilez pour l'émulateur, voir Exécuter Firefox OS sur l'émulateur

+ +

Si vous compilez pour un appareil, voir Installer Firefox OS sur un appareil

diff --git a/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/construire_anciennes_branches/index.html b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/construire_anciennes_branches/index.html new file mode 100644 index 0000000000..47266ce72f --- /dev/null +++ b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/construire_anciennes_branches/index.html @@ -0,0 +1,79 @@ +--- +title: Construire d'anciennes branches +slug: >- + Archive/B2G_OS/Building_and_installing_Boot_to_Gecko/Construire_anciennes_branches +translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS/Build_legacy_branches +--- +

+ +

Les anciennes branches de Firefox OS nécessitent la présence des paquets multi-architectures. Ils ne sont pas installés par défaut sur les systèmes d'exploitation récents. 

+ +

Lancez ces commandes pour permettre l'utilisation de l'architecture i386 :

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

Exécutez cette commande pour installer les paquets nécessaires :

+ +
sudo apt-get install --no-install-recommends autoconf2.13 bison bzip2 ccache curl flex gawk gcc g++ g++-multilib gcc-4.7 g++-4.7 g++-4.7-multilib git lib32ncurses5-dev lib32z1-dev libgconf2-dev zlib1g:amd64 zlib1g-dev:amd64 zlib1g:i386 zlib1g-dev:i386 libgl1-mesa-dev libx11-dev make zip ia32-libs libxml2-utils lzop openjdk-7-jdk
+
+ +

Utilisez ces commandes pour faire de gcc-4.7 le compilateur par défaut :

+ +
sudo update-alternatives --install /usr/bin/gcc gcc /usr/bin/gcc-4.7 1
+sudo update-alternatives --install /usr/bin/g++ g++ /usr/bin/g++-4.7 1
+sudo update-alternatives --set gcc "/usr/bin/gcc-4.7"
+sudo update-alternatives --set g++ "/usr/bin/g++-4.7"
diff --git a/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/index.html b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/index.html new file mode 100644 index 0000000000..52afc81e6b --- /dev/null +++ b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/index.html @@ -0,0 +1,121 @@ +--- +title: Compiler et installer B2G OS +slug: Archive/B2G_OS/Building_and_installing_Boot_to_Gecko +tags: + - B2G OS + - Build documentation + - Firefox OS +translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS +--- +

+ +
+

B2G OS étant actuellement développé à un rythme très soutenu et en phase de pré-lancement, le meilleur moyen d'avoir une installation à jour est de le compiler et de l'installer par vous-même. Les articles listés sur cette page vous guideront à travers la compilation et l'installation de B2G OS sur un émulateur ou un appareil compatible, ou l'interface utilisateur Gaia dans le navigateur Firefox.

+
+ + + + + + + + +
+

Obtenir et compiler B2G OS

+ +
+
Résumé du processus de compilation de B2G OS
+
Compiler et installer B2G OS demande du temps de manière significative, de la bande passante réseau et de la puissance de calcul. Cette page décrit les objectifs du processus de compilation et les étapes de ce processus afin d'aider les utilisateurs en les guidant tout au long du processus.
+
Prérequis pour compiler B2G OS
+
Étapes à effectuer avant de compiler B2G OS pour la première fois.
+
Préparation pour votre première compilation de B2G
+
Avant que vous ne puissiez compiler B2G OS, vous devez cloner le dépôt et configurer votre compilation. Cet article explique comment le faire.
+
Compiler B2G OS
+
Comment compiler B2G OS.
+
Module complémentaire B2G installer
+
Le module complémentaire B2G installer contribue à résoudre le problème de longue date qui empêche de redistribuer des compilations systèmes complètes à cause des blobs (composants propriétaires). Cet article détaille le fonctionnement du module, et comment l'installer.
+
+ +

Davantage de ressources de référence

+ +
+
Compiler B2G OS sur Mac OS X pour un appareil Flame
+
Un guide rédigé par la communauté, pour compiler B2G OS sur Mac OS X pour l'appareil de référence Flame.
+
Appareils compatibles
+
Une liste officielle des appareils de développement qui supportent B2G OS.
+
Créer et appliquer des paquets de mise à jour B2G OS
+
Ce guide très détaillé explique comment créer des paquets de mise à jour OTA/FOTA, ceux-ci pouvant ensuite être distribués sur les appareils des utilisateurs pour fournir des mises à jour logicielles.
+
Construire et installer des builds communautaires FOTA
+
Un guide de démarrage rapide, rédigé par la communauté,  pour créer et installer des paquets FOTA.
+
Carte de référence des variables de compilation B2G
+
Une référence de toutes les variables de compilations B2G, Gaia et Gecko, et des commandes dont vous pourriez avoir besoin pendant les opérations de compilations relatives à B2G OS.
+
+ 		+

Installer B2G OS et/ou Gaia

+ +
+
Choisir comment exécuter Gaia ou B2G
+
Vous pouvez utiliser Gaia dans B2G, ou vous pouvez exécuter B2G OS sur un appareil mobile ou dans un simulateur pour ordinateur. Ce guide vous aidera à décider quelle est la solution la plus adaptée à vos besoins.
+
Compiler le simulateur B2G OS
+
Un guide pour compiler le simulateur B2G OS ; il vous permet de lancer Gaia et des Web apps dans un environnement basé sur Gecko, sur votre ordinateur de bureau, de manière similaire à un véritable appareil.
+
Utiliser les émulateurs B2G
+
Un guide pour compiler et utiliser les émulateurs B2G OS, et quand utiliser ces émulateurs.
+
Installer B2G OS sur un appareil mobile
+
Comment installer B2G OS sur un vrai appareil mobile.
+
+
+ +

 

diff --git a/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/mettre_en_place_un_environnement_de_construction/index.html b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/mettre_en_place_un_environnement_de_construction/index.html new file mode 100644 index 0000000000..ac146a4572 --- /dev/null +++ b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/mettre_en_place_un_environnement_de_construction/index.html @@ -0,0 +1,47 @@ +--- +title: Mettre en place un environnement de construction +slug: >- + Archive/B2G_OS/Building_and_installing_Boot_to_Gecko/Mettre_en_place_un_environnement_de_construction +translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS/Establish_a_Build_Environment +--- +
+

Avant de télécharger le code pour construire Firefox OS, vous devez configurer votre système de construction — cette page vous montre comment faire. Actuellement, les distributions Linux 64 bits et OS X peuvent être utilisées.

+
+ +

Prérequis pour un environnement de construction sous Linux

+ +

Pour compiler sous Linux, vous avez besoin de :

+ + + +

Ubuntu 14.04 LTS est testée et recommandée.

+ +

Installation des paquets requis

+ +
sudo apt-get install git-core gnupg flex bison gperf build-essential \
+     zip curl zlib1g-dev gcc-multilib g++-multilib libc6-dev-i386 \
+     lib32ncurses5-dev x11proto-core-dev libx11-dev lib32z-dev ccache \
+     libgl1-mesa-dev libxml2-utils xsltproc unzip autoconf2.13 lzop
+ +

Configuration de l'accès USB

+ +

Sur les systèmes Linux, par défaut, un utilisateur normal ne peut pas accéder directement aux périphériques USB. Vous devez configurer des règles udev. Créez un fichier /etc/udev/rules.d/51-android.rules avec la commande suivante :

+ +
wget -S -O - https://raw.githubusercontent.com/mozilla-b2g/B2G/master/tools/51-android.rules | sudo tee >/dev/null /etc/udev/rules.d/51-android.rules; sudo udevadm control --reload-rules
+ +

Les nouvelles règles prendront effet la prochaine fois qu'un périphérique sera branché.

+ +

Prérequis pour un environnement de construction sous OS X

+ +

Pour compiler sur OS X, vous avez besoin de :

+ + + +

Maintenant que vous avez mis en place votre machine de construction, il est temps de Configurer votre première construction.

diff --git "a/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/r\303\251sum\303\251_processus_compilation_firefox_os/index.html" "b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/r\303\251sum\303\251_processus_compilation_firefox_os/index.html" new file mode 100644 index 0000000000..bec1671e7d --- /dev/null +++ "b/files/fr/archive/b2g_os/building_and_installing_boot_to_gecko/r\303\251sum\303\251_processus_compilation_firefox_os/index.html" @@ -0,0 +1,153 @@ +--- +title: Résumé du processus de compilation de Firefox OS +slug: >- + Archive/B2G_OS/Building_and_installing_Boot_to_Gecko/Résumé_processus_compilation_Firefox_OS +tags: + - Firefox OS + - build + - install +translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS/B2G_OS_build_process_summary +--- +
+

Compiler, construire et installer Firefox OS demande du temps, une connexion Internet et de la puissance de calcul. Plusieurs obstacles peuvent poser problème en chemin. Cette page liste les différentes étapes dans leur ensemble pour aider l'utilisateur. Chacune des étapes est traitée par une page distincte, liée depuis cet article.

+
+ +
+

Note : Le processus de compilation de Firefox OS contient de nombreuses références à « B2G » ou « Boot2Gecko ». Boot2Gecko était le nom de code original du projet Firefox OS.

+
+ +

L'objectif de la compilation : quatre fichiers image

+ +

Le but général de la compilation est de construire quatre fichiers, appelés images, qui peuvent être copiés sur un appareil Firefox OS.

+ + + + + + + + + + + + + + + + + + + + +
boot.imgLe noyau Linux et l'image d'un système de fichiers racine (root filesystem). Ce dernier fournit un ensemble d'outils Unix de base.
system.imgLe cœur de Firefox OS, avec des fragments de Gonk, la version de Gecko portée et l'exécutable b2g.
userdata.imgLe profil Gecko de l'utilisateur ainsi que les applications web de Gaia pour l'appareil.
recovery.imgUn noyau Linux accompagné d'une image d'un système de fichiers racine (root filesystem) et d'un outil permettant aux utilisateurs de réparer une installation défectueuse.
+ +

Une fois que ces quatre images auront été créées, elles pourront être transférées sur l'appareil.

+ +

Firefox OS est construit sur le projet Android Open Source Project (AOSP). Les outils AOSP adb et fastboot permettent d'accéder et de manipuler l'appareil de façon efficace. On notera la commande adb reboot-bootloader qui permet de redémarrer un appareil connecté à l'ordinateur et de l'arrêter à l'étape où le chargeur d'amorçage (bootloader) rentre en jeu. Ainsi, on pourra utiliser la commande fastboot flash $partition $image pour copier une image sur une des partitions de l'appareil.

+ +

L'image boot.img

+ +

L'image d'amorce (boot) boot.img combine un noyau Linux et une partition racine initiale afin de fournir un certain nombre d'outils logiciels de base et le nécessaire pour exécuter le script d'initialisation. Ce script sera copié depuis l'image vers la mémoire de l'appareil pour être utilisé efficacement par ce dernier. C'est ce qu'on appelle un ramdisk. L'image boot.img sera copiée sur la partition 'boot' de l'appareil et les contenus du ramdisk seront visibles à la racine lorsqu'on accédera au système de fichiers lors de l'exécution (par exemple lorsqu'on utilisera adb shell).

+ +

L'image de boot permet de définir les permissions de l'utilisateur administrateur (root) dans le fichier default.prop situé à la racine.

+ +

Il est aussi possible de modifier des images de boot existantes en inspectant le fichier puis en découpant ce fichier entre le noyau (kernel) et l'image du ramdisk, puis en extrayant les contenus de l'image du ramdisk, en les modifiant avant de ré-assembler l'image du ramdisk et de reconstruire un fichier boot.img fonctionnel. Voir la page Alcatel One Touch Fire Hacking (Mini) Guide (en anglais).

+ +

Les images d'amorce peuvent être testées avant d'être installées en les téléchargeant sur l'appareil depuis l'ordinateur (sideloading). L'appareil peut être démarré et on peut faire une pause au niveau du chargeur d'amorçage pour utiliser la commande fastboot boot /un/chemin/vers/boot.img sans avoir installé l'image.

+ +

L'image système

+ +

L'image système (system.img) fournit le noyau de Firefox OS :

+ + + +
+

Voir la page concernant la plate-forme Firefox OS, pour plus de détails sur l'architecture utilisée.

+
+ +

L'image système sera copiée sur la partition system et sera visible dans le répertoire /system/ lorsqu'on accédera au système de fichiers lors de l'exécution.

+ +
+

Note : L'image système fournit également les blobs binaires pouvant être utilisés par l'appareil, notamment le blob de la RIL (Radio Interface Layer) qui permet de contrôler les composants liés à la communication radio de l'appareil.

+
+ +

L'image des données utilisateur

+ +

L'image des données utilisateur (userdata.img) fournit les applications Gaia chargées lors de l'exécution.

+ +

Cette image sera copiée sur la partition userdata de l'appareil et son contenu pourra être visible depuis le répertoire /data/ lorsque le système de fichiers sera accessible. On retrouvera notamment le dossier /data/b2g/ qui contient le profil Mozilla Gecko de l'utilisateur de l'appareil et le répertoire /data/local/webapps/ qui contient les applications web à la disposition de l'appareil.

+ +

L'image de récupération

+ +

L'image de récupération/dépannage (recovery.img) contient le même noyau Linux ainsi qu'un ramdisk semblables à ceux présents sur l'image d'amorce (boot). Cependant, l'image de récupération utilise un autre script d'initialisation qui permet à l'utilisateur de pouvoir utiliser des commandes pour dépanner/récupérer l'appareil grâce aux boutons physiques de l'appareil.

+ +

Cette image sera copiée sur la partition recovery de l'appareil. Cette partition n'est pas montée dans le système de fichiers lors d'une exécution normale.

+ +

Le processus de compilation : préparation, configuration, compilation et installation

+ +

L'ensemble de la compilation et de l'installation de Firefox OS se déroule selon quatre étapes :

+ + + + + + + + + + + + + + + + + + + + +
La préparationRécupérer les programmes utilisés lors de la compilation comme les compilateurs, les bibliothèques...
La configurationTélécharger le code source qui sera compilé et créer le fichier .configure qui définit les variables d'environnement nécessaires et d'autres valeurs utilisées lors de la compilation.
La compilationCompiler le profil Gecko de l'utilisateur ainsi que les applications Gaia pour l'appareil
L'installationInstaller les fichiers sur l'appareil.
+ +

 

+ +

La préparation

+ +

La préparation initiale permet de s'assurer que l'ordinateur possède bien l'ensemble des outils logiciels nécessaires à la compilation (tels que les compilateurs et les outils de compilation).

+ +

Cette étape peut être réalisée manuellement ou grâce à un script. Vous pourrez trouver les informations nécessaires sur la page concernant les prérequis pour construire Firefox OS.

+ +
+

Note : Sur les systèmes UNIX (ou proches d'UNIX), il est possible de vérifier la présence d'un logiciel en utilisant la commande which qui prend en argument le nom du programme.

+
+ +

La configuration

+ +

Le processus de compilation commence au moment où on obtient un exemplaire du code logiciel de Firefox OS (alias B2G), généralement en créant un clone git du projet B2G. Cette étape permettra de récupérer l'ensemble du code source à compiler et de créer un fichier .config qui permet de définir les variables liées à la compilation.

+ +

Cette étape est réalisée grâce au script config.sh. Vous pourrez trouver les informations nécessaires sur la page de préparation à la première compilation de B2G.

+ +

Le script de configuration prendra en argument le type d'appareil pour lequel compiler. Les noms utilisés ici sont des noms de code liés à l'architecture du processeur (CPU) plutôt que des noms d'appareils spécifiques. Il n'y a, pour le moment, aucun moyen de déterminer quelle version fonctionne sur quel appareil physique. La liste de ces noms de code peut être trouvée ici.

+ +

Ce sera également lors de l'étape de configuration qu'on utilisera l'outil repo du projet Android Open Source Project pour télécharger (ou mettre à jour) une copie du code utilisé lors de la compilation. Cet exemplaire sera stocké dans le répertoire .repo/projects. Cette partie de la configuration nécessitera de télécharger beaucoup de données et pourra prendre beaucoup de temps. Cela explique en grande partie pourquoi la configuration, dans son ensemble, prend beaucoup de temps.

+ +

La compilation

+ +

L'étape de compilation consiste à compiler le code source mis à disposition pour produire les images nécessaires.

+ +

Pour exécuter cette étape, on lancera le script build.sh. Vous pourrez trouver toutes les informations nécessaires sur la page dédiée à la compilation de Firefox OS.

+ +

Par défaut, l'étape de compilation est effectuée en une fois, de la compilation du projet Android AOSP, en passant par celle du noyau Linux jusqu'aux applications de Gaia. Si jamais la compilation échoue, il peut être compliqué de déterminer laquelle de ces étapes est en cause.

+ +

Pour cette raison, il est possible de ne compiler que certaines parties de la pile logicielle concernant Firefox. Ainsi, on peut compiler uniquement Gecko en appelant le script avec le paramètre gecko. On peut faire de même avec le paramètre gaia. Ces composants pourront ensuite être installés séparément sur l'appareil (voir ci-après).

+ +

On peut également compiler les fichiers pour créer les images une à une. L'image système, par exemple, peut être construite grâce à la commande ./build.sh out/platform/$target/system.img, avec le paramètre $target étant celui utilisé lors de la configuration.

+ +

L'installation

+ +

L'installation consiste à envoyer le code compilé sur l'appareil. Cette étape est exécutée grâce au script flash.sh.

+ +

Il est possible d'installer (ou de réinstaller) uniquement certains fragments en utilisant un paramètre du script. On peut par exemple installer uniquement Gaia grâce à la commande ./flash.sh gaia.

diff --git a/files/fr/archive/b2g_os/building_b2g_for_qemu_emulator/index.html b/files/fr/archive/b2g_os/building_b2g_for_qemu_emulator/index.html new file mode 100644 index 0000000000..936338ec2a --- /dev/null +++ b/files/fr/archive/b2g_os/building_b2g_for_qemu_emulator/index.html @@ -0,0 +1,37 @@ +--- +title: Construire B2G pour l'émulateur QEMU +slug: Archive/B2G_OS/Building_B2G_for_QEMU_Emulator +translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS +--- +

Obsolète
Cette fonctionnalité est obsolète. Bien qu'encore supportée par des navigateurs, son utilisation est découragée pour tout nouveau projet. Évitez de l'utiliser.

+ +

Cet article est obsolète. Voir le guide complet Compiler et installer Firefox OS pour construire Firefox OS.

+ +

Il est nécessaire d'avoir déjà configuré votre environnement de construction et cloné les dépôts.

+ +

Les étapes suivantes vous permettront de construire - et faire fonctionner - B2G sur votre émulateur.  NE les exécuter PAS en tant que root.

+ +

$ cd B2G
+ $ make sync

+ +

+ +

Construisez la configuration pour QEMU :
+ $ make config-qemu

+ +

Ensuite, construisez la sous-couche gonk puis le système lui-même :
+ $ make gonk
+ $ make
+
+ REMARQUE :   si ./emu.sh - votre émulateur - ne s'exécute pas, vous devez le rendre exécutable :
+ $ chmod +x emu.sh
+
+ Enfin, lancez l'émulateur :
+ $ ./emu.sh

+ +

REMARQUE :  Après avoir cloné vos dépôts ou avoir procédé à votre première construction, vous pouvez les nettoyer ("clean") - c'est-à-dire les mettre dans un état où la dernière récupération est identique à un nouveau clone.

+ +

Pour faire cela, depuis la racine de votre dépôt :
+ $ make sync; git clean -xfd; git submodule foreach "git clean -xfd"
+ Ou sinon, vous pouvez essayer :
+ $ make mrproper

diff --git a/files/fr/archive/b2g_os/building_the_firefox_os_simulator/index.html b/files/fr/archive/b2g_os/building_the_firefox_os_simulator/index.html new file mode 100644 index 0000000000..3347a9da08 --- /dev/null +++ b/files/fr/archive/b2g_os/building_the_firefox_os_simulator/index.html @@ -0,0 +1,264 @@ +--- +title: Compilation du Simulateur Firefox OS +slug: Archive/B2G_OS/Building_the_Firefox_OS_simulator +tags: + - Appareil + - Firefox OS + - Gaia + - Mobile + - simulateur +translation_of: Archive/B2G_OS/Building_the_B2G_OS_simulator +--- +
+

Le simulateur Firefox OS permet d'exécuter Gaia et des applications Web dans un environnement basé sur Gecko, un peu comme sur un véritable appareil. Il n'émule pas la couche matérielle et n'est donc pas adapté aux tests des APIs des appareils, et ce n'est pas une alternative pour faire des tests sur du vrai matériel. Cependant, il comporte plusieurs APIs qui ne sont pas disponibles sur Firefox comme les APIs Contacts et Settings. Il peut par conséquent être utile pendant le développement de votre application, ou lors du travail sur l'interface utilisateur Gaia elle-même. Cet article aborde le téléchargement et la compilation du simulateur Firefox OS ainsi que son utilisation.

+
+ +
+

Note : La méthode la plus simple pour utiliser le client Firefox OS pour bureau consiste à installer le module Simulateur Firefox OS via WebIDE. La compilation du simulateur par vous-même n'est pas nécessaire.

+
+ +

Téléchargement de la version nocturne

+ +

Tout comme les Nocturnes de Firefox, le simulateur Firefox OS (identifié par b2g-) est automatiquement reconstruit chaque jour à partir du code source le plus récent. La dernière version compilée est disponible sur le serveur FTP de Mozilla. Assurez-vous de prendre la dernière version et la bonne archive en fonction de votre système d'exploitation. Cela vous évitera de devoir le compiler vous-même. De plus, vous n'aurez pas à télécharger Gaia non plus.

+ +

L'application doit être installée dans un endroit accessible en écriture ; elle a besoin de pouvoir mettre à jour le profil Gaia inclus.

+ +

Vous pouvez maintenant vous rendre directement à Exécution du simulateur, sauf si vous souhaitez réellement le compiler vous-même. Vous devrez le faire dans le cas où vous voulez apporter des modifications au code et tester ces modifications.

+ +

Compilation du simulateur

+ +

La première chose nécessaire est la mise en place un environnement de construction Mozilla standard. Une fois fait, vous pouvez récupérer le code dont vous avez besoin et le configurer pour compiler le client Firefox OS pour ordinateur.

+ +

Téléchargement du code pour la première fois

+ +

Dans le répertoire où vous voulez placer le code source, clonez le dépôt mozilla-central qui contient l'ensemble de Gecko :

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

Sinon, vous pouvez télécharger le même code depuis Github :

+ +
 git clone https://github.com/mozilla/gecko-dev
+ +

Mise à jour du code

+ +

Pour les compilations ultérieures, il faut être sûr d'avoir récupéré les dernières modifications :

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

ou

+ +
cd gecko-dev
+git pull
+
+ +

Création de mozconfig

+ +

Ensuite, vous devez créer un fichier appelé .mozconfig dans le répertoire mozilla-central pour que le système de construction soit configuré pour compiler le client Boot to Gecko au lieu de Firefox. Ce fichier doit avoir le contenu suivant :

+ +
. "$topsrcdir/b2g/config/mozconfigs/common"
+
+mk_add_options MOZ_OBJDIR=../build # This line should be commented if you use gecko-dev or mozilla-central
+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
+ +

Vous devez également inclure la ligne ENABLE_MARIONETTE=1 dans le fichier si vous souhaitez exécuter Mochitests dans le client B2G pour ordinateur (soit mochitest-b2g-desktop, soit mochitest-plain) ou si vous voulez lancer les tests unitaires Gaia.

+ +

Compilation

+ +

Vous pouvez à présent construire le client pour ordinateur avec la commande suivante (exécutez-la à l'intérieur du répertoire mozilla-central) :

+ +
./mach build
+
+ +

Le client compilé sera placé dans le répertoire objdir/dist/bin (en fonction de la valeur de MOZ_OBJDIR spécifiée dans le fichier mozconfig).

+ +
+

Note : Si vous avez le moindre problème, commencez par vérifier les dépendances.

+
+ +

Téléchargement de Gaia

+ +

Par défaut, le simulateur affichera un écran vide car il ne sait pas quelle application web il doit charger au démarrage comme application système. L'ensemble des applications système et celles par défaut qui sont fournies avec Firefox OS — Gaia — doivent être téléchargés.

+ +

Pour télécharger Gaia pour la première fois, clonez le dépôt contenant le code source sur GitHub :

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

Pour actualiser une copie de Gaia déjà existante, vous pouvez récupérer les dernières modifications depuis GitHub :

+ +
cd gaia
+git pull
+
+ +

Création de custom-settings.json

+ +

Si vous savez ce que vous faîtes et que vous souhaitez définir des options de configuration, vous pouvez créer le fichier gaia/build/config/custom-settings.json pour les y ajouter, par exemple :

+ +
{
+  "lockscreen.enabled": false,
+  "lockscreen.locked": false,
+  "devtools.debugger.remote-enabled": true
+}
+ +

Cet exemple est utile pour outrepasser l'écran de verrouillage, ce dernier étant autrement impossible à passer sur ordinateur car il ne peut pas être déverrouillé avec une souris ou un pavé tactile.

+ +

Génération d'un profil

+ +

Ensuite, nous devons préparer les applications de Gaia pour le simulateur. Cela comprend le fait d'empaqueter les applications Gaia de la même façon que si elles étaient installées sur l'appareil, ainsi que la mise en place des permissions pour les applications systèmes privilégiées. Cela est réalisé par la génération d'un profil. La commande suivante (à lancer dans le dossier de téléchargement de gaia) effectuera  cette tâche :

+ +
make DESKTOP_SHIMS=1 NOFTU=1 DEBUG=1
+
+ +

Un dossier profile-debug sera créé sous le répertoire gaia. Le nouveau profil contient une extension personnalisée et d'autres éléments de configuration nécessaires au bon fonctionnement de B2G.

+ +
+

Note : Il existe actuellement un bogue (bug 1180103) qui fait qu'avec les profils de débogage de Gaia l'écran d'accueil est vide lors de l'exécution avec le Simulateur Firefox OS (depuis WebIDE, ou autre.) Il peut être contourné en compilant avec DEBUG=1 DESKTOP=0 make au lieu de DEBUG=1.

+
+ +

Exécution du simulateur

+ +

Une fois que vous avez construit le client (ou téléchargé et installé la version nocturne de l'application de bureau) et téléchargé Gaia , vous êtes prêt à lancer le simulateur.

+ +

Exécution sous Linux

+ +

Pour lancer le simulateur sur Linux en utilisant le profil Gaia qu'il contient, exécutez simplement l'exécutable b2g.  Le binaire se trouve dans l'archive téléchargée plus tôt ou dans le répertoire objdir/dist/bin si vous avez compilé le client vous-même.

+ +
b2g -profile gaia/profile-debug
+
+ +

Vous pouvez rencontrer des problèmes gênants de rendu. Pour les éviter, ajoutez la ligne suivante dans votre fichier gaia/profile/user.js :

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

Exécution sur Mac

+ +

Si vous avez téléchargé la version Nocturne, vous pouvez l'exécuter simplement à partir du Finder de manière classique. Les sorties de la console sont visibles en lançant l'utilitaire Console standard fourni avec votre Mac.

+ +

Si vous souhaitez spécifier un profil Gaia différent (tel que votre téléchargement Gaia fait plus haut), vous devez ignorer le wrapper b2g et exécuter le binaire b2g. La ligne de commandes est légèrement plus compliquée en raison de l'emplacement du binaire b2g et de l'obligation d'utiliser des chemins absolus pour indiquer le répertoire du profil :

+ +
.../B2G.app/Contents/MacOS/b2g-bin -profile /chemin/complet/vers/profile-debug/gaia
+
+ +

Exécution sous Windows

+ +

Exécuter la version Nocturne sous Windows se résume à lancer b2g.exe. Si vous voulez personnaliser l'exécution, vous pouvez le faire en lançant l'exécutable b2g.exe à la place ; cela contourne le wrapper qu'utilise automatiquement Gaia.

+ +

Options de la ligne de commandes

+ +

Il y a un certain nombre d'options de ligne de commandes qu'il est possible de préciser afin d'ajuster l'expérience lors de l'utilisation du simulateur. Vous pouvez en obtenir une liste avec l'option -help. Cette section en décrit certaines particulièrement intéressantes.

+ +

Configuration de la taille de l'écran

+ +

Vous pouvez spécifier la taille de l'écran de l'appareil à simuler avec l'option -screen :

+ +
b2g -screen <largeur>x<hauteur>@<ppp>
+ +

Où <largeur>, <hauteur>, et <ppp> sont des paramètres aux noms explicites : la largeur et la hauteur de l'écran en pixels et la résolution en PPP. Voici des exemples concrets :

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

De manière facultative, il est possible d'indiquer par leur nom des appareils spécifiques pour simuler leurs tailles d'écran et résolutions :

+ + + +

Ces appareils préréglés sont définis dans screen.js.

+ +

Afin de sélectionner des écrans différents, le chemin du profil doit être spécifié comme ceci :

+ +
+

./b2g-bin --profile ./gaia/profile/ --screen=galaxy_tab

+
+ +

Ouverture de la console JavaScript

+ +

La console JavaScript peut être ouverte lors du lancement du simulateur en l'exécutant à partir de la ligne de commandes avec l'option -jsconsole. Après la compilation, tapez :

+ +
.../b2g -jsconsole -profile /chemin/vers/votre/profil
+ +

Si vous avez installé la version Nocturne sur un Mac, vous pouvez utiliser ce qui suit :

+ +
/Applications/B2G.app/Contents/MacOS/b2g -jsconsole -profile /chemin/vers/votre/profil-debug
+ +
+

Note : Sur les versions de production de Firefox OS, la journalisation vers la console (par exemple console.log()) est désactivée par défaut. Pour l'activer, ouvrez les paramètres Développeurs et activez le paramètre Activer la console.

+
+ +

Exécution d'une application spécifique au démarrage

+ +

Vous pouvez spécifier une application à lancer automatiquement lorsque le simulateur démarre b2g. Son lancement se fera dès que le chargement du reste du système sera terminé. Dans ce but, utilisez simplement l'option -runapp, elle prend comme paramètre le nom de l'application à exécuter. Par exemple :

+ +
 .../b2g -profile /chemin/vers/votre/profil-debug/gaia -runapp email
+ +
+

Note : Le nom spécifié est normalisé en le convertissant tout en minuscules et en supprimant tous les tirets et espaces. Ce nom normalisé est ensuite comparé aux noms normalisés similaires extraits des manifestes des applications disponibles. Par exemple, le nom de l'application de courriel est actuellement "E-mail", mais -runapp email fonctionnera grâce à cette normalisation.

+
+ +

Si vous spécifiez l'option -runapp sans argument, ou avec un argument vide, le simulateur affichera sur votre terminal une liste des applications connues ainsi qu'un bref message informatif.

+ +
+

Note : L'utilisation de l'option -runapp a pour effet de bord la désactivation de l'écran de verrouillage et sa non-réactivation. Cela implique de ne pas utiliser cette commande avec un profil sur lequel vous voulez tester l'écran de verrouillage, ou le réactiver manuellement en utilisant Paramètres > Écran de verrouillage. N'hésitez pas à contribuer avec un patch pour modifier ce comportement si c'est un problème.

+
+ +

Astuces pratiques

+ +

Cette section offre quelques trucs utiles pour utiliser le client de bureau B2G.

+ + + +

Dépannage : Écran vide lors du démarrage du simulateur

+ +

Lorsque vous démarrez b2g avec b2g -profile gaia/chemin/vers/profil/gaia, un écran vide peut apparaître avec une erreur "Cannot reach app://system.gaiamobile.org". Pour résoudre ce problème, il y a plusieurs choses à vérifier :

+ + + +

Étapes suivantes

+ +

Maintenant que vous disposez d'une version simulée de Boot to Gecko fonctionnelle, vous pouvez faire des tests, du développement, ou tout autre chose avec :

+ + diff --git a/files/fr/archive/b2g_os/choisir_comment_lancer_gaia_ou_b2g/index.html b/files/fr/archive/b2g_os/choisir_comment_lancer_gaia_ou_b2g/index.html new file mode 100644 index 0000000000..fac1f61ab1 --- /dev/null +++ b/files/fr/archive/b2g_os/choisir_comment_lancer_gaia_ou_b2g/index.html @@ -0,0 +1,80 @@ +--- +title: Choisir comment exécuter Gaia ou B2G +slug: Archive/B2G_OS/Choisir_comment_lancer_Gaia_ou_B2G +tags: + - B2G + - Compilation + - Gaia +translation_of: Archive/B2G_OS/Choosing_how_to_run_Gaia_or_B2G +--- +

+ +

En fonction de vos besoins spécifiques, vous avez un large choix d'options disponibles, à prendre en considération lors d'expérimentations avec Firefox OS ou l'interface utilisateur Gaia. Vous pouvez choisir parmi les options suivantes ; chacune possède ses avantages et ses inconvénients, et certaines sont plus souples que d'autres.

+ +

Exécuter B2G sur le bureau

+ +

Il est possible de compiler un simulateur de Firefox OS et d'exécuter Gaia sur celui-ci. Ce logiciel est basé sur Firefox, mais propose une expérience semblable à un appareil sur Firefox OS. Actuellement Mozilla fournit des nightly builds de cette application pour les développeurs. Si vous êtes familier avec la construction du code de base de Firefox ou des projets C++ , vous pouvez compiler vous-même cette application.

+ +

Avantages

+ + + +

Inconvénients

+ + + +

Pourquoi exécuter le simulateur B2G ?

+ +

C'est une solution convenable pour tester tout en développant. C'est un bon moyen pour obtenir une meilleure idée de la façon dont votre application ou votre code va fonctionner dans un environnement semblable, sans avoir à flasher un téléphone à chaque fois que vous voulez tester quelque chose.

+ +
Note: Avant de proposer une application, vous devez absolument le tester sur un véritable appareil !
+ +

Variétés de simulateurs

+ +

Il y a plusieurs variétés de simulateurs Firefox OS disponibles :

+ +
+
Firefox OS Simulator add-on
+
Cette extension est le premier outil pour tester les applications sur Firefox OS et la solution recommandée pour la plupart des utilisateurs. Elle supporte les outils de développement, l'ajout d'applications à l'environement de test...
+
Developer desktop builds
+
Ces compilateurs du simulateur sont des applications stand-alone qui servent principalement d'aide aux développeurs du coeur de Firefox OS, pour vérifier les caractéristiques techniques. 
+
Localizer desktop builds
+
Les compilateurs sont utilisés par les équipes de localisation dans leur travail et pour tester leurs localisations de Firefox OS et des aplications Firefox OS.
+
+

Exécuter B2G sur un émulateur

+
+
Cette solution se situe entre les simulateurs (qui sont seulement des reproductions des plus hauts niveaux de Firefox OS) et l'appareil mobile (qui vous fait bénéficier de l'expérience complète). Par rapport aux simulateurs, les émulateurs exécutent un Firefox OS basé sur un système ARM (l'émulateur x86 étant obsolète) qui reprioduit la quasi-totalité de l'expérience sur téléphone (à l'exception de quelques évènements réseau/radio).
+
+ +

Exécuter B2G sur un appareil mobile

+ +

La meilleure façon de tester votre travail sur B2G ou Gaia est de compiler puis installer Firefox OS sur un véritable appareil mobile. C'est également le processus le plus compliqué.

+ +

Avantages

+ + + +

Inconvénients

+ + + +

Pourquoi exécuter B2G sur un appareil mobile

+ +

Il s'agit, évidemment, de la façon la plus précise pour tester tout code ou tout projet web sur B2G ou Gaia. En testant votre projet sur un véritable appareil mobile, vous pouvez vous assurer que votre projet fonctionne et s'affiche bien et utilise toutes les APIs de l'appareil correctement. De plus, vous devriez toujours tester sur du matériel réel avant d'embarquer du code ; omettre cette étape peut avoir des conséquences imprévues qui peuvent être difficiles à prévoir.

diff --git a/files/fr/archive/b2g_os/compiler/building_an_engineering_build_like_the_ones_publis/index.html b/files/fr/archive/b2g_os/compiler/building_an_engineering_build_like_the_ones_publis/index.html new file mode 100644 index 0000000000..4a600e1eaa --- /dev/null +++ b/files/fr/archive/b2g_os/compiler/building_an_engineering_build_like_the_ones_publis/index.html @@ -0,0 +1,8 @@ +--- +title: Compiler une version « engineering build officielle » +slug: Archive/B2G_OS/Compiler/Building_an_engineering_build_like_the_ones_publis +translation_of: Archive/B2G_OS/Building#Building_an_official-style_engineering_build +--- +
+

Note éditoriale : Le contenu de cette page a été déplacé vers https://developer.mozilla.org/fr/Firefox_OS/Compiler#Compiler_une_version_«_engineering_build_officielle_».

+
diff --git a/files/fr/archive/b2g_os/compiler/compiler_pour_le_fairphone/index.html b/files/fr/archive/b2g_os/compiler/compiler_pour_le_fairphone/index.html new file mode 100644 index 0000000000..1ebbcaf096 --- /dev/null +++ b/files/fr/archive/b2g_os/compiler/compiler_pour_le_fairphone/index.html @@ -0,0 +1,79 @@ +--- +title: Compiler pour le Fairphone +slug: Archive/B2G_OS/Compiler/Compiler_pour_le_Fairphone +translation_of: Archive/B2G_OS/Building/Building_for_Fairphone +--- +

EXECUTER B2GOS sur FAIRPHONE

+ +
Salut à tous les possesseurs de Fairphones !
+ Ce site va vous permettre de construire et installer tout
+ ce qu'il faut pour faire tourner B2GOS sur un Fairphone !
+ +

 

+ +

Il comporte :

+ +

Les instructions de construction pour OSX
+ Les instructions de construction pour Ubuntu 14.4
+ Les instructions de construction pour Ubuntu 16.4
+ Comment flasher un appareil sans avoir à récupérer le code !

+ +

Compiler sur OSX

+ +

En raison de calculs faux ou différents pour la somme de contrôle md5, il ne sera pas possible de compiler sur OS X. Mais vous pouvez y aller avec un Linux virtuel !

+ +

Compiler sur 14.4.

+ +

Enchaîner les commandes suivantes permet d'obtenir une version accélérée du processus.

+ +

-> ouvrez un terminal (ctrl, alt et T)

+ +

Tapez ces commandes les unes après les autres :

+ +
sudo dpkg --add-architecture i386
+sudo dpkg --add-architecture amd64
+sudo apt-get install git
+git config --global user.email " *votreemail@url.tld* "
+git config --global user.name " *votrenomdutilisateur* "
+git config --global color.ui False
+ +
Installation
+ +
sudo apt-get install --no-install-recommends autoconf2.13 bison bzip2 ccache curl flex gawk gcc g++ g++-multilib git lib32ncurses5-dev lib32z1-dev libgconf2-dev zlib1g:amd64 zlib1g-dev:amd64 zlib1g:i386 zlib1g-dev:i386 libgl1-mesa-dev libx11-dev make zip lzop libxml2-utils openjdk-7-jdk nodejs unzip python mercurial && ccache -M 50G && echo $PWD && echo "commanding: git clone git://github.com/mozilla-b2g/B2G.git" && git clone git://github.com/mozilla-b2g/B2G.git && cd B2G && echo $PWD && echo "commanding: ./config.sh fairphone2" && ./config.sh fairphone2 && echo $PWD && echo "commanding: cd .. " && cd .. && echo $PWD && echo "commanding: curl -O http://dl.google.com/android/repository/android-ndk-r11b-linux-x86_64.zip" && curl -O http://dl.google.com/android/repository/android-ndk-r11b-linux-x86_64.zip && echo "commanding: unzip android-ndk-r11b-linux-x86_64.zip -d ~/ -home dir- " && unzip android-ndk-r11b-linux-x86_64.zip -d ~/ && echo $PWD && echo "commanding: curl -O https://nodejs.org/download/release/v4.4.7/node-v4.4.7.tar.gz" && curl -O https://nodejs.org/download/release/v4.4.7/node-v4.4.7.tar.gz && echo "commanding: tar -zxvf node-v4.4.7.tar.gz" && tar -zxvf node-v4.4.7.tar.gz && echo "commanding: cd node-v4.4.7" && cd node-v4.4.7 && echo "commanding: ./configure" && ./configure && echo "commanding: make install" && sudo make install && echo $PWD && echo "commanding: back to B2G folder!" && cd ~/B2G
+
+ +

vérifiez ou faites un .userconfig dans le dossier B2G et n'oubliez pas de remplacer le texte en GRAS par votre nom d'utilisateur système :

+ +
echo "*** entering .userconfig ***"
+export B2G_ANDROID_NDK_PATH=/home/ÉCRIVEZ ICI VOTRE NOM D'UTILISATEUR SYSTÈME/android-ndk-r11b
+echo "B2G_ANDROID_NDK_PATH=$B2G_ANDROID_NDK_PATH"
+export B2G_DIR=${B2G_DIR:-$(cd $(dirname $0); pwd)}
+echo "B2G_DIR=${B2G_DIR}"
+echo "GECKO_OBJDIR = ${GECKO_OBJDIR}"
+echo "*** exit .userconfig ***"
+ +

Si vous souhaitez générer une version pour flasher votre téléphone :

+ +
./build.sh
+
+ +

Si vous voulez faire une version pour flasher votre téléphone et mettre à jour le build communautaire :

+ +
./build.sh blobfree
+
+ +

Si vous rencontrez des erreurs et que vous avez besoin d'un log de la compilation :

+ +
./build.sh showcommands 2>&1 | tee build.log
+
+ +

à chaque fois que vous lancez une nouvelle compilation, nettoyez les répertoires avec ces commandes :

+ +
sudo rm -rf out && rm -rf objdir-gecko && rm -rf gaia/profile* && ccache -C
+
+ +

 

+ +

B2G-Installer pour Fairphone

+ +

Vous n'avez pas envie de construire votre propre B2G OS ? Vous pouvez flasher votre appareil avec le module b2g-installer et un build communautaire !

diff --git a/files/fr/archive/b2g_os/compiler/fota_community_builds/index.html b/files/fr/archive/b2g_os/compiler/fota_community_builds/index.html new file mode 100644 index 0000000000..8d3a7eec38 --- /dev/null +++ b/files/fr/archive/b2g_os/compiler/fota_community_builds/index.html @@ -0,0 +1,174 @@ +--- +title: Construire et installer des builds communautaires FOTA +slug: Archive/B2G_OS/Compiler/FOTA_community_builds +tags: + - Firefox OS + - Tutoriel + - build +translation_of: Archive/B2G_OS/Building/FOTA_community_builds +--- +

Cet article peut vous aider à installer des builds communautaires de Firefox OS sur votre téléphone. Les mises à jour "firmware over the air" (FOTA) de l'OS seront activées sur ces versions.

+ +

Prérequis

+ +

Afin de compiler et installer cette build, vous devez avoir une machine sur laquelle compiler et une machine hôte. Il peut s'agir d'une seule et même machine.

+ +

Sur la machine de compilation, il est nécessaire d'avoir tous les logiciels requis pour construire une version destinée au téléphone cible (Prérequis pour construire Firefox OS apporte davantage d'informations).

+ +

Tout d'abord, vous devez vérifier l'appareil :

+ + + +

Il est possible de construire les versions nocturne, aurora et bêta ; dans ce but, créez simplement 3 dossiers différents : nightly aurora beta (si vous ne souhaitez construire qu'une branche, vous pouvez vous contenter d'un seul répertoire). Nightly est mise à jour chaque nuit, aurora correspond à la dernière version stable et beta à la version qui précède aurora.

+ +

En fonction de vos besoins, vous pouvez décider de construire toutes les branches ou seulement une ou deux. Pour chaque branche dont vous avez besoin, suivez les étapes décrites sur cette page. Lorsque vous aurez atteint le paragraphe "Compilation", les instructions seront de nouveau spécifiques selon les branches.

+ +

Préparez votre première compilation B2G avec la BRANCHE correcte, comme si vous étiez en train de créer une version pour le téléphone cible. Suivez les instructions de cette page (Se préparer pour la première construction de B2G) jusqu'à la fin de la section "Configurer B2G pour votre appareil".

+ +
+

Note : si vous avez un manifeste (xml) spécifique pour config.sh, ouvrez ce fichier et remplacez "master" par le nom de la branche que vous voulez dans les "choses spécifiques de B2G".

+
+ +

À présent, votre répertoire de travail devrait être [BRANCH]/B2G/

+ +

NE PAS COMPILER POUR L'INSTANT ! 

+ +

Il y a encore beaucoup de modifications à faire.

+ +

Signatures (seulement pour les appareils Firefox OS par défaut) :

+ +

Toutes les ROMs des appareils Firefox OS doivent être signées ; par contre, pour les appareils Android, ce n'est pas obligatoire.

+ +

Nous ne pouvons fournir que gecko et gaia ; la mise à jour sera signée pour éviter son installation sur un mauvais téléphone.

+ +

Pour cela, vous aurez besoin de la signature de la build racine ; il y a juste à récupérer build.prop depuis le téléphone :

+ +
adb pull /system/build.prop
+ +

Maintenant, cherchez dans ce fichier la valeur de ro.build.fingerprint ; il s'agit de l'empreinte.

+ +

Localisation :

+ +

Il est possible de construire une version contenant toutes les locales en ajoutant ce script (langs.sh) dans gaia/locales ou de choisir de ne cloner que certaines langues. Dans ce dernier cas, modifiez gaia/locales/languages_all.json pour que seules les langues clonées ne soient employées #TOVERIF => Compilation multilocale

+ +

Si vous compilez pour les branches aurora ou beta, remplacez git checkoutmozillaorg/master par git checkout v2.1 pour aurora et par git checkout v2.0 pour beta dans langs.sh

+ +

N'oubliez pas de mettre à jour vos dépôts avant de lancer une nouvelle compilation.

+ +

langs.sh :

+ +
 #!/bin/sh
+
+ set -e
+ GIT_ROOT="https://git.mozilla.org/releases/l10n/"
+ GIT_PROJ="/gaia.git"
+ LANGS=$(json_pp < languages_all.json | grep ':' | cut -d':' -f1 | cut -d'"' -f2)
+ for lang in ${LANGS}; do
+     echo "Syncing $lang"
+     if [ ! -d ${lang}/.git/ ]; then
+         echo "No repo for ${lang}, cloning new one"
+         git clone ${GIT_ROOT}${lang}${GIT_PROJ} $lang || true
+     else
+         echo "Updating close for ${lang}"
+     cd ${lang} && (git fetch origin && git checkout origin/master) || true && cd ..
+     fi;
+ done;
+
+ +

Configuration de la compilation

+ +

Il est aussi nécessaire d'avoir un fichier .userconfig pour votre construction :

+ +

Créez à la racine de [BRANCH]/B2G/ un fichier nommé .userconfig et collez-y ces lignes :

+ +
 export SYSTEM_PARTITION=/dev/block/platform/msm_sdcc.1/by-name/system # to specify the system partition, find info with adb shell cat /proc/mounts
+ export DATA_PARTITION=/dev/block/platform/msm_sdcc.1/by-name/userdata # to specify the data partition, find info with adb shell cat /proc/mounts
+ export VARIANT=userdebug #to include gaia
+ export PRODUCTION=1 #to have a user build
+ export B2G_UPDATER=1
+ export B2G_UPDATE_CHANNEL=aurora  #to modify [BRANCH]
+ export ENABLE_DEFAULT_BOOTANIMATION=true #to have B2G boot animation
+ export GAIA_DEV_PIXELS_PER_PX=1.5
+ export LOCALE_BASEDIR=locales/ #Languages folder
+ export LOCALES_FILE=locales/languages_all.json #all languages for the build
+ export GAIA_KEYBOARD_LAYOUTS="$((find gaia/apps/keyboard/js/layouts/*.js | sed -e 's|gaia/apps/keyboard/js/layouts/||g' -e 's/\.js$//g') | tr -s '\r\n' ',' | sed -e 's/,$//g')" #All keyboard, you can change this with keyboard you want
+ export GAIA_DEFAULT_LOCALE=fr #languages by default, fr (french) for example
+ export B2G_FOTA_DIRS="system/fonts system/b2g" #fira font bug
+ export FOTA_FINGERPRINTS="[your fingerprint]"
+
+ +

Les variables suivantes devront être éditées :

+ + + +

Le texte qui suit le symbole dièse (#) peut être supprimé (y compris le symbole lui-même). Ce sont des commentaires et leur seule raison d'être est d'expliquer à quoi sert la ligne.

+ +

Après cela, il faut définir les informations à propos de l'url de mise à jour :

+ +
 cd gecko/
+ git checkout -b [VERSION NUMBER ou master pour nightly]-local --track mozillaorg/[VERSION NUMBER ou master pour nightly]
+ éditez app.update.url dans b2g/app/b2g.js vous pouvez conserver %target% etc.. ou sinon vous pouvez juste avoir quelque chose du genre
+ pref("app.update.url", "http://[DOMAIN]/[PHONE NAME]/[BRANCH]/update.xml");
+
+ +

Ensuite, pour appliquer vos modifications, effectuez un commit :

+ +
 git commit -a
+ Répétez toutes ces étapes avec les différentes branches pour avoir une version beta/aurora/nightly.
+ +

La configuration de la compilation est à présent terminée. Toutes les étapes qui suivent devront être répétées à chaque compilation dans chacun des dossiers de branche.

+ +

Compilation

+ +

La mise en place de la construction d'une (nouvelle) mise à jour est : 

+ +
 cd [BRANCH]/B2G/ #pour se placer dans le bon dossier
+ git pull # pour actualiser le code du dépôt
+ ./repo sync #pour actualiser le code du dépôt pour android et B2G ne pas utiliser l'option -d, le faire supprimerait vos modifications
+ cd gaia/locales/ && ./langs.sh && cd ../../ #pour actualiser les langues
+
+ ./build.sh # pour construire b2g
+ ./build.sh gecko-update-fota # pour construire b2g et gaia dans des fichiers .zip et .mar
+
+ BUILDID=$(grep 'BuildID=' objdir-gecko/dist/bin/application.ini | cut -d'=' -f2) # définit la variable buildid
+ VERSION=$(grep '\nVersion=' objdir-gecko/dist/bin/application.ini | cut -d'=' -f2) # définit la variable de la version de gecko
+ python tools/update-tools/build-update-xml.py -c out/target/product/[PHONE NAME]/fota-[PHONE NAME]-update.mar -O -u http://[DOMAIN]/[PHONE NAME]/[BRANCH]/fota-[PHONE NAME]-update.mar -i $BUILDID -v $VERSION -V $VERSION | tee /var/www/[BRANCH]/update.xml # Modifiez cette commande avec vos informations : chemin correct vers .mar, chemin correct vers .mar dans l'url de update.xml, la commande produira en sortie un fichier update.xml; ce dernier ira sur votre machine hôte, il correspond au fichier appelé par le système pour chercher de nouvelles mises à jour.
+ cp out/target/product/[PHONE NAME]/fota-[PHONE NAME]-update.mar /var/www/[BRANCH]/fota-[PHONE NAME]-update.mar #pour déplacer le .mar sur le serveur
+ cp out/target/product/[PHONE NAME]/fota/partial/update.zip /var/www/[BRANCH]/update.zip #pour déplacer le .zip sur le serveur
+ pushd /var/www/[BRANCH]/ # pour aller dans les fichiers du serveur
+ sha1sum $(ls) | tee sha1.checksum #pour avoir un fichier de signature
+ popd
+
+ +

Si vous souhaitez un bot IRC, vous pouvez utiliser ii ou buildbot. J'ai réalisé un script pour ça ICI (pour plus d'informations sur ce qu'est buildbot, voir http://buildbot.net/ )

+ +

Flashez le téléphone et essayez votre build :

+ +

Pour installer la version sur un téléphone, suivez simplement ces étapes :

+ +
 adb reboot recovery
+ +

Dans le recovery, descendez avec le bouton de volume bas pour sélectionner la ligne "apply update from adb", puis appuyez sur le bouton power :

+ +
 adb sideload out/target/product/[PHONE NAME]/fota/partial/update.zip
+ +

Builds existantes par communauté

+ + diff --git a/files/fr/archive/b2g_os/compiler/index.html b/files/fr/archive/b2g_os/compiler/index.html new file mode 100644 index 0000000000..7227ce6ddd --- /dev/null +++ b/files/fr/archive/b2g_os/compiler/index.html @@ -0,0 +1,442 @@ +--- +title: Compiler Firefox OS +slug: Archive/B2G_OS/Compiler +translation_of: Archive/B2G_OS/Building +--- +
+

Une fois que vous avez mis en place votre système de compilation puis récupéré et configuré le code, vous pouvez compiler Boot to Gecko. Ce guide détaille les étapes nécessaires à la compilation.

+
+ +

Mettre à jour votre code

+ +

Si ce n'est pas la première fois que vous compilez B2G, vous pouvez récupérer la dernière version du code avant de commencer à compiler. Pour ce faire, vous devez mettre à jour les outils B2G ainsi que les dépendances grâce aux commandes suivantes :

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

L'option -d permet de récupérer les dernières versions (HEAD) des projets Android selon le manifeste de révision (c'est-à-dire la version principale, par défaut, du dépôt). Cette option est pratique si vous avez effectué des modifications mais que vous voulez revenir à l'état de la branche master de façon temporaire. Vos changements seront mis de côté (staged) le répertoire de travail ne sera pas modifié (voir la question Stack Overflow sur ce sujet ou la page de documentation sur la commande repo). Si vous n'avez pas modifié les sources, vous pouvez utiliser :

+ +
git pull
+./repo sync
+ +

Vous pouvez mettre à jour votre dépôt selon une cible donnée en indiquant son nom :

+ +
./repo sync gaia
+
+ +

La commande repo possède d'autres options qui peuvent être utilisées. Utilisez la commande repo help pour avoir plus d'informations.

+ +

Compiler Boot to Gecko

+ +
+

Note : Avant la compilation, vous pouvez utiliser un fichier .userconfig pour personnaliser votre version. Voir la page Personnaliser la version grâce au fichier .userconfig pour plus d'informations.

+
+ +

Pour compiler Boot to Gecko, il suffit d'utiliser le script build.sh :

+ +
cd B2G
+./build.sh
+
+ +

À ce moment, vous pouvez sans doute prendre une autre pause café (voire une sieste si c'est votre première compilation). Pour indication, la compilation dure environ 30 minutes sur un Core i7 avec 8 Go de RAM). Comme expliqué dans la page précédente, si vous utilisez un autre répertoire dans lequel vous avez sauvegardé des fichiers système Android, vous devrez définir la variable d'environnement ANDROIDFS_DIR avant de lancer build.sh.

+ +
+

Note : Pour plus d'informations sur l'installation (flashing) d'une nouvelle version sur un téléphone, lire la page Installer Firefox OS sur un appareil mobile.

+
+ +

Compiler des modules particuliers

+ +

Si vous souhaitez compiler uniquement un certain module, vous pouvez spécifier le nom du module souhaité comme argument du script. Ainsi, si vous souhaitez ne compiler que Gecko, vous pourrez utiliser la commande suivante :

+ +
./build.sh gecko
+
+ +

Si vous souhaitez ne rafraîchir qu'une seule application, vous pouvez compiler le module gaia et spécifier la variable d'environnement BUILD_APP_NAME avec le nom de l'application :

+ +
BUILD_APP_NAME=calendar ./build.sh gaia
+ +

Afin d'obtenir une liste des modules que vous pouvez compiler, vous pouvez utiliser la commande suivante :

+ +
./build.sh modules
+
+ +

Définir le nombre de tâches parallèles

+ +

Par défaut, les scripts B2G lancent des tâches parallèles (le nombre de tâches par défaut étant égal au nombre de cœurs plus (+) deux). Le nombre de tâches à lancer en parallèle est défini grâce au paramètre -j de build.sh. Cet argument peut s'avérer utile lorsque vous souhaitez réduire la charge CPU prise par la compilation pour pouvoir faire autre chose. De plus, n'avoir qu'une seule tâche pour la compilation permet d'interpréter beaucoup plus facilement les informations affichées par le script.

+ +

Ainsi, pour compiler en utilisant uniquement deux tâches parallèles, vous pouvez utiliser la commande suivante :

+ +
./build.sh -j2
+
+ +

Le plus souvent, ce paramètre est utilisé pour empêcher toute exécution parallèle. De cette façon, le processus peut être analysé plus simplement. Pour n'avoir qu'une seule tâche, lancer la commande suivante :

+ +
./build.sh -j1
+
+ +

Compiler une version multilocales

+ +

Pour compiler une version avec plusieurs locales, il faut réaliser les étapes suivantes :

+ +
    +
  1. Déterminer le fichier de locales à utiliser. Actuellement, ce sont les fichiers locales/languages_dev.json et locales/languages_all.json qui sont utilisés comme fichiers de locales.
    2. +
  2. Cloner les locales adéquates depuis http://hg.mozilla.org/gaia-l10n vers un répertoire. Le répertoire utilisé est gaia-l10n/. Vous pourriez très bien utiliser un répertoire locales/. Vous devrez cloner un dépôt pour chaque locale listée dans le fichier de langues.
    3. +
  3. Dans votre environnement définissez la variable d'environnement LOCALE_BASEDIR avec le chemin absolu du répertoire choisi à l'étape 2. La variable d'environnement LOCALES_FILE doit être définie avec le chemin absolu du répertoire utilisé à l'étape 1.
    4. +
  4. Vous pouvez également définir la variable d'environnement GAIA_DEFAULT_LOCALE si vous souhaitez définir une locale par défaut.
    5. +
+ +
cd gaia/locales/
+hg clone https://hg.mozilla.org/releases/gaia-l10n/v1_2/es
+ +
Définir les variables d'environnement :
+ +
 
+ +
export LOCALE_BASEDIR=$PWD/locales
+export LOCALES_FILE=$PWD/locales/languages_dev.json
+export GAIA_DEFAULT_LOCALE=fr
+
+ +

Le fichier languages-dev.json peut être remplacé par votre propre fichier mes-langues.json à condition que celui-ci respecte le format suivant (où chaque entrée correspond à une locale clonée dans le répertoire des locales) :

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

Depuis la livraison du bug 884752 (en novembre 2013), il est possible d'utiliser la variable d'environnement GAIA_KEYBOARD_LAYOUTS pour ajouter des agencements de clavier.

+ +

Voir la fiche du bug : https://bugzilla.mozilla.org/show_bug.cgi?id=884752

+ +

Voir des exemples d'agencements: https://github.com/mozilla-b2g/gaia/tree/v1.2/keyboard/layouts

+ +

Ainsi, si vous souhaitez ajouter des agencements de clavier pour l'espagnol, l'italien et l'anglais, vous pouvez définir la variable d'environnement de cette façon :

+ +
  GAIA_KEYBOARD_LAYOUTS=en,es,it
+ +

Vous pouvez alors flasher Gaia sur le téléphone. Connectez le téléphone et vérifiez que le débogage USB est activé dans l'écran Paramètres > Informations > Plus d'informations > Développeurs. Vous n'aurez pas besoin de répéter cette étape. En effet, votre version de Gaia aura le paramètre REMOTE_DEBUGGER à 1. Pour compiler une version multilocales :

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

Si vous souhaitez cloner et/ou mettre à jour l'ensemble des locales prises en charge pour une branche donnée, vous pouvez utiliser ce script.

+
+ + +

Compiler une version « engineering build officielle »

+ +
+

If this paragraph gets outdated. Please refer to the logs of the Be job in Treeherder to get the latest variables set.

+
+ +

Pour compiler une version  « engineering build officielle » comme celles publiées par Mozilla, vous devez utiliser les options suivantes sur votre ligne de commande:

+ +
VARIANT=eng MOZILLA_OFFICIAL=1 B2G_SYSTEM_APPS=1 GAIA_OPTIMIZE=1 B2G_UPDATER=1 B2G_UPDATE_CHANNEL=default MOZ_TELEMETRY_REPORTING=1 MOZ_CRASHREPORTER_NO_REPORT=1 LOCALES_FILE=locales/languages_all.json GAIA_KEYBOARD_LAYOUTS=en,pt-BR,es,de,fr,pl,zh-Hans-Pinyin,zh-Hant-Zhuyin,en-Dvorak ./build.sh
+ +

Ci-dessous l'explication des paramètres:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
VariableExplication
VARIANT=engDéfinition d'une version de type « engineering ». C'est aussi la valeur par défaut.
MOZILLA_OFFICIAL=1Génère une version affichant le logo et la marque Firefox OS. Ne pas utiliser cette option avec des versions que vous souhaitez distribuer. Mozilla se réserve ce droit.
B2G_SYSTEM_APPS=1Installe lest applications dans  le dossier /system/b2g/webapps (au lieu de /data/local/webapps).
GAIA_OPTIMIZE=1Concatène les sources de Gaia.
B2G_UPDATER=1Active les mises à jour quotidienne.
B2G_UPDATE_CHANNEL=defaultLe canal de mises à jour Firefox OS. La valeur «default» pointe vers mozilla-central.
MOZ_TELEMETRY_REPORTING=1Active la Télémétrie permettant de partager les données concernant l'utilisation du téléphone.
MOZ_CRASHREPORTER_NO_REPORT=1Désactive l'interface Firefox Desktop lors d'un crash, so the Gaia reporter only is used.
LOCALES_FILE=locales/languages_all.jsonDéfini les langues disponibles dans Gaia (l'arborescence relative part du dossier de gaia).
GAIA_KEYBOARD_LAYOUTS=en,pt-BR,es,de,fr,pl,zh-Hans-Pinyin,zh-Hant-Zhuyin,en-DvorakDéfini les dispositions de clavier inclues dans Gaia.
+ +

Générer une archive système sans aucun blob binaire

+ +

Il est possible de générer une archive de système complet sans recourrir à un seul blob binaire, qui peut être utilisée pour convertir un appareil, fonctionnant sous Android, à Firefox OS, en s'affranchissant de l'interdiction de distribution de systèmes contenant des blobs binaires. Cette possibilité doit être développée séparément pour chaque type d'appareil, avec seulement les téléphones Flame et Z3/Z3 Compact supportés initialement.

+ +
+

Note: Nous devrions pouvoir le faire pour n'importe quel appareil pour lequel nous générons déjà des systèmes, mais il faut faire des vérifications dans chaque cas avant de pouvoir l'affirmer.

+
+ +

Une telle archive est générée à l'aide de l'option suivante :

+ +
./build.sh blobfree
+ +

Ceci produit une archive zip composé de :

+ + + +

Le but de cette archive est d'être utilisée avec l'installeur d'addon B2G (voir bug 1166276.)

+ +

Erreurs fréquentes

+ +

"Build failed!"

+ +

Si vous obtenez le message générique "Build failed" (« la compilation a échoué), vous pouvez essayer de reconnecter votre téléphone à votre ordinateur. Il peut arriver que le volume du téléphone soit démonté du système.

+ +
+

Attention, configurer et compiler B2G pour un Keon ne FONCTIONNERA PAS pour Mac. Pour cet appareil, il est nécessaire d'utiliser Linux.

+
+ +

Erreurs propres à Mountain Lion

+ +
+

1. Si vous compilez sur OS X 10.8 Mountain Lion (Xcode 4.4.1 ou ultérieur) et que vous obtenez l'erreur suivante :

+ +
external/qemu/android/skin/trackball.c:130:25: error: 'M_PI' undeclared (first use in this function)
+Éditez le fichier : B2G/external/qemu/Makefile.android et ajoutez le code suivant à la ligne 78: + +
MY_CFLAGS += -DM_PI=3.14159265358979323846264338327950288   #/* B2G_fix: not finding M_PI constant */
+
+
+ +
2. Si vous utilisez Mountain Lion et que vous obtenez l'erreur suivante avec ./build.sh :
+ +
+
/System/Library/Frameworks/IOKit.framework/Headers/usb/USB.h:797:9: error: too many #pragma options align=reset
+ +

Remplacez les occurences de '#pragma options align=reset' par '#pragma pack()' dans le fichier /System/Library/Frameworks/IOKit.framework/Headers/usb/USB.h

+
+ +

Undefined symbols "_sqlite3_androidopt_handle_pragma" and "_sqlite3_androidopt_open"

+ +

Cette erreur se produit si vous compilez sur OS X 10.7 ou ultérieur avec Xcode 4.5 ou ultérieur. Pour résoudre le problème, appliquez le correctif https://groups.google.com/forum/#!msg/android-building/yAfPyUqCsiQ/7zvICk4GWjYJ au fichier external/sqlite/dist/Android.mk.

+ +

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

+ +

Cette erreur se produit lorsque la version de gcc utilisée est trop récente. Installez les versions gcc/g++/g++-multilib. Voir la page personnaliser la version compilée avec le fichier .userconfig pour plus d'informations.

+ +
+

Note : Vous pouvez utiliser gcc 4.7.x en apportant de légères modifications. En raison des priorités de développement, les bugs liés à ces modifications ne seront pas corrigés.

+
+ +

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

+ +

Si vous obtenez ce message, cela signifie probablement qu'il manque de la mémoire. Assurez-vous de disposer de suffisamment de mémoire avant de lancer ./build.sh. Si vous disposez de 4 Go, cela devrait suffire.

+ +

Erreur « ...is referenced by DSO »

+ +

Lors de la compilation de l'émulateur, si vous obtenez « /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 ».

+ +

Cela peut arriver avec certaines versions de binutils. Si vous utilisez Debian Stable, vous pouvez utiliser le linker gold en installant le paquet binutils-gold. Le linker gold est déjà installé avec binutils mais il n'est pas utilisé par défaut. binutils-gold permet de le passser en linker par défaut.

+ +

Si vous obtenez des erreurs de compilation lorsque le système de compilation exécute les tests

+ +

Certaines fois (surtout lorsque les outils de compilation et/ou le système sont mis à jour) vous pouvez obtenir certaines erreurs étranges lorsque le script effectue les tests post-compilation :

+ +
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
+ +

Pour résoudre ce problème, supprimez le répertoire gaia/xulrunner-sdk avant de récupérer le code :

+ +
rm -r gaia/xulrunner-sdk
+
+ +

Cette commande permettra de supprimer la version téléchargée, précompilée de XULRunner que le système de compilation récupère automatiquement. Lors de la prochaine compilation, le système téléchargera automatiquement une nouvelle version de XULRunner.

+ +

Impossible de récupérer platform/libcore

+ +

Si vous essayez de configurer B2G pour Nexus S (./config.sh nexus-s) et que vous obtenez une erreur liée à libcore, cela est dû à un problème avec le git linaro. Pour résoudre ce problèmé, récupérez le manifeste de B2G :

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

Puis éditez le fichier nexus-s.xml dans ce dépôt, remplacez l'entrée pour le git linaro avec une référence à l'entrée aosp. Le résultat obtenu devrait ressembler à :

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

Effectuez un commit ces modifications (git commit -a) puis modifiez le fichier config.sh dans la branche master du dépôt principal de B2G puis modifiez le pour pointer vers votre fichier de manifeste local (plutôt que celui de Mozilla) avec la commande suivante :

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

Erreurs clang lors de la compilation avec Xcode 5 sur OS X

+ +

Si vous compilez en utilisant Xcode 5 sur OS X 10.8, il est probable que vous rencontriez les erreurs suivantes :

+ +
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
+ +

Cela est dû à la modification du compilateur g++ dans le dossier /usr/bin par Xcode 5, ce qui fait planter le processus de compilation. Pour résoudre ce problème, éditer la ligne du fichier build/core/combo/HOST_darwin-x86.mk:

+ +
HOST_CXX := g++
+ +

en

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

Ensuite, désinstaller gcc avec brew (ici, on considère que vous avez utilisé le script de mise en route pour Mac OS, si ce n'est pas le cas, utiliser ce script avant de continuer) :

+ +
brew uninstall gcc-4.7
+ +

Puis réinstaller gcc avec le support multilib et c++ :

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

Assurez vous que /usr/local/bin soit bien dans votre PATH. Vous pouvez l'ajouter temporairement à votre PATH grâce à la ligne suivante :

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

Pour rendre cette modification permanente, vous pouvez ajouter cette ligne dans le fichier .bash_profile de votre répertoire home.

+ +

Une fois que vous avez bien défini votre PATH, assurez-vous de pouvoir lancer chacune d eces commandes :

+ +
gcc-4.7 -v
+
+g++-4.7 -v
+ +

Si l'une de ces commandes échoue, il faudra peut-être lier de nouveau GCC à brew grâce à la commande suivante :

+ +
brew link --overwrite gcc-4.7
+ +

Il se peut également que /usr/bin/c++ ne pointe pas vers clang++ alors que ça devrait être le cas avec Xcode 5 installé. Vous pouvez le vérifier en tapant la commande suivante :

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

Le résultat de cette commande devrait ressembler à :

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

Si c++ pointe vers autre chose que vers clang++, il faut mettre à jour avec le lien :

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

"system/core/include/log/log.h:38:20: error: stdarg.h: No such file or directory"

+ +

Cette erreur peut se produire si vous utilisez 10.6 SDK pour compiler sur Mac OSX 10.10, ou tout autre configuration SDK qui n'est pas supportée par la cible que vous essayer de compiler. Voir bug 1071266 pour plus de détails.

+ +

Impossible de récupérer les fichiers depuis le répertoire de sauvegarde

+ +

Cela peut arriver lorsque la connexion USB a été interrompue lors de la récupération des données de l'appareil vers l'ordinateur.

+ +

Lorsque vous lancez le script, vous obtenez un résultat semblable à celui-là (obtenu pour un Peak) :

+ +
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.
+ +

Pour résoudre ce problème, il n'est pas nécessaire de supprimer les répertoires objdir-gecko et out dans leur intégralité. Il suffit de supprimer le répertoire de sauvegarde avec cette commande) :

+ +
$rm -rf backup-peak
+ +

Problèmes de compilation pour l'émulateur

+ +

Si vous construisez une version d'un émulateur, vous pourrez rencontrer certains problèmes. Les informations détaillées ici permettent d'en résoudre certains.

+ +
+

Attention : l'émulateur x86 est plus difficile à installer et n'est pas très bien supporté.

+
+ +

Le système de compilation d'un émulateur construit à la fois la version 32 bits et la version 64 bits de l'émulateur. L'émulateur aura besoin d'utiliser OpenGL, cela signifie qu'il vous faudra avoir installé les bibliothèques 32 bits et 64 bits pour OpenGL. Voir la discussion à ce sujet sur le bug 897727.

+ +

Deux méthodes permettent de résoudre ce problème :

+ +

Première solution : avoir installé les deux bibliothèques OpenGL 32 bits et 64 bits et avoir construit les liens symboliques (symlinks)

+ +

Si votre distribution Linux dispose de paquets multilib pour les bibliothèques OpenGL, vous pouvez les installer manuellement. Il vous faudra peut être ajouter manuellement certains liens symboliques.

+ +

Par exemple, sur Ubuntu 12.04 LTS x86-64, le paquet libgl1-mesa-dev ne peut pas être installé simultanément pour les versions x86-64 et i386 mais la combinaison de paquets suivante peut être installée :

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

Une fois avoir lancé la commande précédente, il vous faudra créer quelques liens symboliques pour que la compilation puisse fonctionner :

+ +
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
+ +

Seconde solution : corriger le dépôt pour que l'émulateur ne soit compilé qu'en 64 bits

+ +

Il suffit d'appliquer ce correctif au dépôt git sdk/ situé sous le dépôt B2G. L'émulateur B2G ne sera ainsi compilé qu'en une version 64 bits, ce qui permettra d'éviter tout problème e gestion des bibliothèques pour différentes architectures. Dans tous les cas, l'émulateur 32 bits ne sera pas utilisé sur un système 64 bits. Cette solution est la plus simple à mettre en œuvre (sauf si le patch devient un jour corrompu...).

+ +

Prochaines étapes

+ +

Une fois la compilation achevée, la suite dépendra de votre cible : un appareil mobile « réel » ou un émulateur. Pour obtenir les informations pertinentes, vous pouvez lire les articles suivants :

+ + +
+ +

Soumettre des bugs sur B2G/Firefox OS/Gaia

+ +

Une fois que votre version de B2G/Firefox OS fonctionne, vous serez en mesure de rapporter des bogues et d'aider à l'amélioration de Firefox OS. Si vous trouvez un bug, vous pouvez le décrire sur Bugzilla, grâce au projet "Firefox OS" en spécifiant bien les éléments de version :

+ +
    +
  1. Pour commencer, indiquez le numéro de version majeur, par exemple 1.4.0.0-prerelease. Cette information se trouve dans Paramètres > Informations.
    2. +
  2. Vous pouvez fournir des identifiants de versions plus spécifiques en indiquant les hash correspondant aux dépôt gaia et gecko. Pour obtenir ces informations, vous pouvez utiliser les commanes suivantes : + 
    #!/bin/bash
+(cd gaia;  echo "gaia  $(git rev-parse HEAD)")
+(cd gecko; echo "gecko $(git rev-parse HEAD)")
    +
    3. +
diff --git a/files/fr/archive/b2g_os/customisation_avec_le_fichier_.userconfig/index.html b/files/fr/archive/b2g_os/customisation_avec_le_fichier_.userconfig/index.html new file mode 100644 index 0000000000..b9a23a766d --- /dev/null +++ b/files/fr/archive/b2g_os/customisation_avec_le_fichier_.userconfig/index.html @@ -0,0 +1,201 @@ +--- +title: Customisation avec le fichier .userconfig +slug: Archive/B2G_OS/Customisation_avec_le_fichier_.userconfig +translation_of: Archive/B2G_OS/Customization_with_the_.userconfig_file +--- +
+

Vous pouvez customiser certains aspects du processus de construction en ajoutant un peu de code dans votre source B2G, dans le fichier .userconfig.  Cet article montre ce que l'on peut faire en effectuant ces changements et comment on les réalise.

+
+ +

Le fichier .userconfig n'est pas vérifié dans le contrôle du code source, donc vos changements ne seront pas effacés quand vous mettrez a jour votre arbre source. Il a besoin d'être créé dans la base de l'arbre du B2G; qui est dans le même dossier que flash.sh, build.sh, etc... Vous devriez ajouter ceci avant de lancer votre config et de construire vos étapes.

+ +

Le fichier .userconfig, s'il existe, est créé de source par le script load-config.sh qui est lui même créé de source par ces scripts : flash.sh, build.sh (Par setup.sh), run-gdb.sh, run-emulator.sh et tools/mach_b2g_bootstrap.py. Le script run-*.sh l'utilise pour déterminer où vous devez avoir Gecko. Le script mach_b2g_boostrap.py est utilisé par toutes commandes mach en rapport avec le B2G.

+ +
+

Important : votre fichier .userconfig devrait être à la racine de votre répertoire source de B2G, non pas dans votre répertoire /home !

+
+ +

Changer l'arbre source de Gecko

+ +

Par defaut, la construction utilise l'arbre source de gecko, qui est cloné d'un autre arbre de source depuis Github. Certaines personnes préfèrent utiliser mozilla-inbound, ou mozilla-central. Pour faire ceci, créez votre clone là où vous le désirez et ajoutez une ligne dans votre .userconfig qui met en place GECKO_PATH, par exemple :

+ +
export B2G_DIR=${B2G_DIR:-$(cd $(dirname $0); pwd)}
+echo "B2G_DIR = ${B2G_DIR}"
+
+export GECKO_PATH=${B2G_DIR}/mozilla-inbound
+echo "GECKO_PATH = ${GECKO_PATH}"
+
+ +
+

Note : si vous construisez avec un Gecko modifié sue Mac OS X, le dossier mozilla-central doit être dans un fichier système sensible à la casse sinon GECKO_PATH sera ignoré. Vous pouvez vérifier si le fichier système est sensible au majuscules en lançant cette ligne de commande dans un terminal :

+ +
echo -n This file system is case->tmp; echo -n in>>TMP; echo sensitive>>tmp; cat tmp
+ +

Récupérer B2G_DIR comme fait ci-dessus permet à votre .userconfig de fonctionner sans avoir des chemins d'accès compliqués.

+
+ +

Changer les paramètres de Gaia

+ +

Parfois, vous aimeriez pouvoir changer les paramètres de Gaia. Par exemple, autoriser adb dans une construction utilisateur.

+ +

<!-- cette partie reste à traduire

+ +

The gaia Makefile passes in --override build/custom-settings.json when calling build/settings.py, so we can write some bash which will write {"devtools.debugger.remote-enabled": true} into the custom-settings.json file. We try to avoid changing custom-settings.json if we don't need to, so we actually write into custom-settings.json.new and if the contents differ from custom-settings.json then we'll replace it.

+ +

-->

+ +
export GAIA_PATH=${GAIA_PATH:-$(cd gaia; pwd)}
+export CUSTOM_SETTINGS="${GAIA_PATH}/build/config/custom-settings.json"
+cat > "${CUSTOM_SETTINGS}.new" <<EOF
+{"devtools.debugger.remote-enabled": true}
+EOF
+if [[ -f ${CUSTOM_SETTINGS} ]] && cmp "${CUSTOM_SETTINGS}" "${CUSTOM_SETTINGS}.new" >& /dev/null; then
+  rm "${CUSTOM_SETTINGS}.new"
+else
+  mv "${CUSTOM_SETTINGS}.new" "${CUSTOM_SETTINGS}"
+fi
+
+ +

Une autre façon plus simple de configurer consiste à utiliser le fichier build/config/custom-prefs.js présent dans le répertoire de Gaia, c'est-à-dire dans gaia/build/config/custom-prefs.js si vous êtes dans le répertoire B2G. Voir aussi Personnaliser les réglages utilisateurs Gaia.

+ +
+

Note:  Currently the build is not smart enough to look in a different directory based on GAIA_PATH.  This is different from how GECKO_PATH behaves.  If you wish to use a separate Gaia clone you can manually run make from that directory.

+
+ +

Créer des modèles de builds

+ +

Vous pouvez créer plusieurs types de compilations automotiques de Gaia avec la commande make en pramaétrant le fichier .userconfig - cette section dénombre quelques options.

+ +
+

Note: You can also set many different build options dynamically at build time by including different options along with the make command when you build. For a complete reference, see our make options reference article.

+
+ +

Creating production and engineering builds

+ +

To create different production builds (built with the final apps you'd want users to see) and engineering builds (built with additional test apps and other engineering features), you can add the following lines into .userconfig:

+ +
PRODUCTION=1
+ +

On its own, this creates a production build. This can also be achieved on the fly by setting the production make option.

+ +

Alternatively, there are variants, which set various levels of engineering capabilities:

+ +
VARIANT=user
+
+VARIANT=userdebug
+
+VARIANT=eng
+ +

The differences between these variants are as follows:

+ + + +
+

Note: Les deux valeurs user et userdebug impliquent PRODUCTION=1 quand la compilation est faite pour un terminal ou un émulateur.

+
+ +
+

Note: make production is really a way to build a user version of Gaia and flash it to the device. Specifying a VARIANT is the way to do this when building for Gaia in Nightly or B2G Desktop.

+
+ +

Creating a debug build

+ +

To build a debug build, put the following line in your .userconfig file:

+ +
export B2G_DEBUG=1
+ +

This can be achieved on the fly at build time by including the DEBUG=1 make option.

+ +

Creating a profiling build

+ +

To enable profiling (for best results with the built-in (SPS) platform profiler), add the following to your .userconfig file then rebuild:

+ +
export MOZ_PROFILING=1
+ +
+

Important: Do NOT pair with B2G_NOOPT. The results will be meaningless!

+
+ +

Disabling the optimizer

+ +

To disable the optimizer (which may create builds that are easier to debug), add the following to your .userconfig file then rebuild:

+ +
export B2G_NOOPT=1
+ +

Disabling First Time User experience

+ +

If you build and reflash a lot, going through the First Time User experience constantly can be annoying. You can disable this by adding the following to your .userconfig:

+ +
export NOFTU=1
+ +

This can be achieved on the fly at build time by including the NOFTU=1 make option.

+ +

Enabling Gaia developer mode

+ +

If you plan to develop apps or hack gaia, you can automatically set various usefull settings and preferences to ease working with the device. For example, it will automatically enable the remote debugging feature and disable the prompt when an incoming debugging connection starts.

+ +

What you need is the following export added to your .userconfig:

+ +
export DEVICE_DEBUG=1
+ +

Enabling Valgrind

+ +

Valgrind is useful for debugging memory or threading issues with your application. For more information on running valgrind, see Debugging B2G using valgrind [en-US].

+ +

To use valgrind under B2G, add the following to your .userconfig:

+ +
export B2G_VALGRIND=1
+ +

Changing the default host compiler

+ +

On some recent distributions which use GCC 4.7 or later as the default compiler you will need to specify an older version in order to be able to build, to do so add two lines to your .userconfig file setting the CC and CXX variables to set the alternate C and C++ compilers respectively. For example to set the GCC 4.6 compiler on Ubuntu 12.10 use:

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

Or if you're using a version built from sources provide the full path to the exectuables:

+ +
export CC=/opt/gcc-4.6.4/bin/gcc
+export CXX=/opt/gcc-4.6.4/bin/g++
+
+ +

Specifying a custom Gecko object tree location

+ +

Once you start changing gecko source trees and other build options, you may want to also modify where your objects get stored (so, for example, all of your debug objects go into a different tree from your non-debug objects). So you might do something like:

+ +
export GECKO_OBJDIR=${GECKO_PATH}/objdir-gonk-debug
+
+ +

Using ${GECKO_PATH} makes it easy to switch between different gecko trees (eg: central, beta, aurora, etc).

+ +

Keeping both debug and non-debug objects

+ +

You can use your .userconfig file to switch back and forth between debug and release builds without having to rebuild everything each time!

+ +
+
+ +
export B2G_DIR=${B2G_DIR:-$(cd $(dirname $0); pwd)}
+echo "B2G_DIR = ${B2G_DIR}"
+
+export GECKO_PATH=${B2G_DIR}/mozilla-inbound
+echo "GECKO_PATH = ${GECKO_PATH}"
+
+export B2G_DEBUG=1
+echo "B2G_DEBUG = ${B2G_DEBUG}"
+
+export GECKO_OBJDIR=${GECKO_PATH}/objdir-gonk
+if [[ "${B2G_DEBUG}" != "0" ]]; then
+  export GECKO_OBJDIR=${GECKO_OBJDIR}-debug
+fi
+if [[ "${GECKO_PATH/*mozilla-inbound*/mozilla-inbound}" == "mozilla-inbound" ]]; then
+  export GECKO_OBJDIR=${GECKO_OBJDIR}-m-i
+fi
+echo "GECKO_OBJDIR = ${GECKO_OBJDIR}"
+ +

The echo commands help remind you what your current settings are. To switch between debug and release builds, simply change the value of B2G_DEBUG on line 7.

diff --git a/files/fr/archive/b2g_os/debugging/connecting_a_firefox_os_device_to_the_desktop/index.html b/files/fr/archive/b2g_os/debugging/connecting_a_firefox_os_device_to_the_desktop/index.html new file mode 100644 index 0000000000..f96309e2ec --- /dev/null +++ b/files/fr/archive/b2g_os/debugging/connecting_a_firefox_os_device_to_the_desktop/index.html @@ -0,0 +1,64 @@ +--- +title: Connexion d'un appareil Firefox OS à un ordinateur +slug: Archive/B2G_OS/Debugging/Connecting_a_Firefox_OS_device_to_the_desktop +tags: + - ADB + - Firefox OS +translation_of: Archive/B2G_OS/Debugging/Connecting_a_Firefox_OS_device_to_the_desktop +--- +
+

Ce guide explique comment connecter un appareil Firefox OS à votre ordinateur en USB.

+
+ +
+

Note : Si vous souhaitez seulement déboguer des applications sur un appareil Firefox OS et que vous avez Firefox OS 1.2+, le meilleur choix consiste à utiliser WebIDE. Si votre version de Firefox OS est inférieure à 1.2, lisez Préparations pour déboguer sur Firefox OS avec les outils pour Développeur Web de Firefox pour découvrir comment utiliser le débogage distant classique.

+
+ +

Configuration de l'appareil

+ +

Sur votre appareil Firefox OS (voir la présentation) :

+ +
    +
  1. Ouvrez l'application Paramètres, puis Informations sur l'appareil > Plus d'informations > Développeurs.
    2. +
  2. Dans le menu développeurs, cochez "Débogage distant".
    3. +
+ +

Configuration de l'ordinateur

+ +

Pour connecter un appareil à l'ordinateur, vous devez installer Android Debug Bridge (adb). Remarquez que l'extension ADB Helper (pour utiliser avec WebIDE) intègre déjà adb.

+ +

Les instructions pour configurer votre ordinateur sont spécifiques à votre système d'exploitation et sont détaillées au point 3 de "Setting up a Device for Development" sur le site de développement d'Android. Des instructions supplémentaires sont énumérées ci-dessous.

+ +

Instructions spécifiques à Mac OS X

+ +

Si vous êtes sous Mac OS X, vous avez téléchargé un paquet dont le nom ressemble à adt-bundle-mac-x86_64-20130522. Placez-le dans le dossier Applications afin d'avoir deux répertoires dans /Applications/adt-bundle-mac-x86_64-20130522/ : eclipse et sdk. Éditez ensuite votre ~/.bashrc et ajoutez

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

(Cela sera pris en compte la prochaine fois que vous démarrerez votre shell). À l'invite du shell, vous pouvez maintenant taper :

+ +
adb devices
+
+ +

Cela affichera une liste des périphériques connectés de ce genre :

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

Instructions spécifiques à Linux

+ +

Si vous êtes sous Linux, l'ID (identifiant) vendeur à utiliser pour les appareils Geeksphone Firefox OS est 05c6, votre fichier /etc/udev/rules.d/51-android.rules doit donc contenir une entrée semblable à :

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

Instructions spécifiques à Windows

+ +

Vous pouvez télécharger les pilotes Windows du Geeksphone sur le site web de Geeksphone.

+ +

Par défaut, Windows 8 ne permet pas l'installation de pilotes non signés. Consultez le tutoriel "Comment installer un pilote non signé sous Windows 8".

+ +

Comme Windows XP Édition familiale ne comporte pas tasklist.exe, le Simulateur ne détecte pas le périphérique. Cela peut être résolu en téléchargeant ce fichier depuis le site web ComputerHope et en le plaçant dans le dossier Windows\System32.

+ +

Vérification de votre configuration

+ +

Après avoir suivi ces instructions, branchez l'appareil sur l'ordinateur avec un câble USB, ouvrez un interpréteur de commandes et tapez "adb devices" (assurez-vous que adb est dans votre path). Votre appareil Firefox OS devrait apparaître dans le résultat de la commande.

diff --git a/files/fr/archive/b2g_os/debugging/index.html b/files/fr/archive/b2g_os/debugging/index.html new file mode 100644 index 0000000000..18edc0b003 --- /dev/null +++ b/files/fr/archive/b2g_os/debugging/index.html @@ -0,0 +1,79 @@ +--- +title: Déboguer sur Firefox OS +slug: Archive/B2G_OS/Debugging +tags: + - AQ + - B2G + - Déboguer + - Firefox OS + - Tester +translation_of: Archive/B2G_OS/Debugging +--- +

Vous pouvez réaliser trois types de débogage sur Firefox OS.

+ + + +

Cette page fournit les liens vers les informations utiles sur les différents moyens de déboguer votre code Firefox OS.

+ + + + + + + + +
+

Documentation à propos du débogage sur Firefox OS

+ +
+
Déboguer des applications Firefox OS dans Firefox pour ordinateur
+
Vous pouvez utiliser Firefox sur ordinateur pour déboguer une bonne partie des applications web. Cet article fournit un guide des fonctionnalités de Firefox utiles dans ce genre de situation.
+
Préparations pour déboguer du code Firefox OS
+
Avant de pouvoir utiliser la plupart des outils intégrés à Firefox pour déboguer du code s'exécutant sur Firefox OS, vous devez faire un peu de configuration. Cet article vous explique ce qu'il faut faire.
+
Utiliser le débogueur
+
Vous pouvez utiliser le débogueur distant de Firefox pour déboguer du code s’exécutant dans Firefox OS sur un appareil avec une connexion partagée (tethered), ou dans le simulateur Firefox OS.
+
Journalisation console sur l'appareil
+
Comment activer la journalisation (log) console sur un appareil Firefox OS, et comment accéder aux journaux créés sur l'appareil pour les analyser sur ordinateur.
+
Utiliser la Console Web distante avec Firefox OS
+
La Console Web distante inclue dans Firefox vous permet de surveiller la sortie console d'un appareil Firefox OS.
+
Paramètres pour développeurs sur les appareils Firefox OS
+
Il y a plusieurs paramètres à destination des développeurs sur Firefox OS. Ce guide explique ce qu'ils font et comment en tirer partis.
+
Déboguer B2G en utilisant gdb
+
Le débogueur populaire gdb peut être utilisé pour déboguer Firefox OS et les applications tournant soit sur un appareil, soit sur un émulateur. Ce guide vous montre comme faire.
+
Déboguer en utilisant le client ordinateur B2G
+
Des fonctionnalités accessibles sur le client ordinateur B2G peuvent aider dans le débogage de vos applications. Découvrez-les dans cet article.
+
Conseils généraux pour déboguer B2G
+
Des conseils généraux qui peuvent s'appliquer à tout débogage sur B2G que vous pourriez réaliser.
+
Personnaliser le script b2g.sh
+
Vous pouvez personnaliser le script b2g.sh pour ajuster les variables d'environnement et ainsi changer le comportement de Gecko.
+
Obtenir des journaux NSPR dans B2G
+
Vous pouvez utiliser les journaux (logs) NSPR pour enregistrer HTTP et autre trafic réseaux.
+
Journalisation HTTP
+
Comment journaliser (log) votre trafic réseau HTTP pour déboguer.
+
+ +

Voir tout...

+ 		+

Obtenir de l'aide de la communautré

+ +

Si vous travaillez avec Firefox OS ou développez des applications que vous aimeriez voir fonctionner sur des appareils Firefox OS, des ressources communautaires sont à votre disposition !

+ + + +

N'oubliez pas la netiquette pour poser vos questions…

+
+ +

 

diff --git a/files/fr/archive/b2g_os/debugging/installer_adb/index.html b/files/fr/archive/b2g_os/debugging/installer_adb/index.html new file mode 100644 index 0000000000..24ed61578e --- /dev/null +++ b/files/fr/archive/b2g_os/debugging/installer_adb/index.html @@ -0,0 +1,135 @@ +--- +title: Installer et utiliser ADB +slug: Archive/B2G_OS/Debugging/Installer_ADB +translation_of: Archive/B2G_OS/Debugging/Installing_ADB +--- +
+

De nombreux aspects du développement de Firefox OS nécessitent l'installation d'ADB, (Android Debug Bridge). Cet article explique comment faire et propose quelques commandes usuelles et utiles d'ADB.

+
+ +

Installer ADB

+ +

Vous pouvez installer adb à partir du paquet Android SDK disponible pour Mac, Linux et Windows — allez sur la page Get the Android SDK.

+ +

Vous pouvez aussi installer cette extension Firefox, ce qui est plus rapide.

+ +

Si vous utilisez la dernière version stable de votre système d'exploitation, alors ADB a de grandes chances d'être maintenu par un membre de la communauté dans les dépôts :

+ +

Le résumé suivant (WIP) indique comment télécharger ADB pour les distributions utilisant les dépôts de Debian, Fedora et Archlinux ainsi que pour Mac OS X.

+ +

Debian et distributions dérivées (TAILS, *buntu, Elementary OS)

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

Fedora 19, 20, 21, et distributions dérivées

+ +
sudo yum install android-tools
+ +

Archlinux et distributions dérivées

+ +
yaourt -S android-tools android-udev
+ +

Mac OS X

+ +

Vous aurez besoin de Homebrew pour utiliser l'utilitaire adb : brew.sh.

+ +

Lancez ensuite la commande suivante :

+ +
brew install android-platform-tools
+ +

Autre

+ +

Si votre distribution ne possède pas les paquets adb (par exemple Ubuntu 12.04 ou Fedora 17/18), vous aurez besoin d'installer le paquet starter Android SDK pour votre plateforme (choisissez l'ADT Bundle, et non pas l'option SDK Tools Only). Puis démarrer le gestionnaire de paquet, $SDK_HOME/tools/android, et utiliser l'interface graphique pour installer "Android SDK Platform-tools".

+ +

Regardez où adb est installé (généralement dans usr/bin, et peut être aussi à l'intérieur de adt/platform-tools, selon où vous l'avez installé). Pensez à ajouter ce répertoire à votre PATH. Vous pouvez faire ça en ajoutant la ligne

+ +
PATH=$SDK_HOME:$PATH
+ +

en remplaçant $SDK_HOME avec l'emplacement du SDK Android, dans votre ~/.bashrc ou équivalent.

+ +

Dépannage

+ +

Installer les bibliothèques de compatibilité 32 bits

+ +

Vous pourrez traiter de données en 32 bits. Si votre système d'exploitation est en 64 bits, cela signifie qu'il vous faudra des bibliothèques de compatibilité 32 bits.

+ +

Le résumé ci-dessous (WIP) indique comment les télécharger depuis les dépôts de Debian et Archlinux :

+ +

Debian et distributions dérivées (TAILS, *buntu, Elementary OS)

+ +
sudo apt-get install ia32-libs
+ +

Archlinux et distributions dérivées

+ +

Pour intégrer des bibliothèques de compatibilité 32 bits, il faut indiquer à pacman que vous souhaitez les paquets venant de multilib.

+ +

Le dépôt multilib devrait être présent par défaut, mais vous pouvez, dans le cas contraire, modifier votre pacman.conf et décommenter ou taper les lignes suivantes :

+ +
[multilib]
+
+Include = /etc/pacman.d/mirrorlist
+ +

Installez ensuite les paquets lib32-libstdc++5 et lib32-zlib à l'aide de la commande suivante :

+ +
yaourt -S lib32-libstdc++5 lib32-zlib
+ +

Appareil non listé par 'adb devices'

+ +

Si votre appareil n'est pas affiché en tapant 'adb device', cliquez ici pour suivre les étapes de résolutions.

+ +

Commandes ADB usuelles

+ +

Les sections suivantes expliquent quelques commandes usuelles d'adb.

+ +

Redémarrer le processus b2g

+ +

b2g est l'équivalent d'une application XULRunner fonctionnant sur le téléphone sur un kernel basé sur Android. Si vous souhaitez le redémarrer, c'est une manière de mettre à zéro l'environnement applicatif sans redémarrer entièrement l'appareil. Vous pouvez faire cela en entrant la commande suivante dans votre terminal en ayant votre appareil connecté à votre ordinateur (ou lorsque le déboggeur est installé) :

+ +
adb shell killall b2g
+ +

Activer la redirection de port pour le déboggage

+ +

Pour activer simplement la redirection de port (par exemple si vous souhaitez utiliser le gestionnaire d'applications pour débogger des applications Firefox OS sur un appareil), entrez la commande suivante dans votre terminal :

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

Vous aurez besoin de faire ça à chaque fois que le téléphone est redémarré ou débranché puis rebranché. Vous pouvez changer le nombre du socket si nécessaire.

+ +

Rediriger des ports à une machine locale

+ +

Pour rediriger des ports à une machine locale, vous aurez besoin de télécharger les binaires netcat et ssh, et exécuter les commandes suivantes :

+ +
# Ceci est un hack horrible, mais il fonctionne...
+hôte$ adb forward tcp:7979 tcp:6969
+
+# Crée quelques pipes nommés pour faire un netcat bi-directionnel
+téléphone$ mknod readback p
+hôte$ mknod readback p
+
+# cela met en place une connexion utilisable une seule fois pour se connecter à l'hôte
+# écoute sur les ports 6969 et 5959 et redirige toutes les informations entre elles
+téléphone$ ./netcat -l -p 6969 < readback | ./netcat -l -p 5959 > readback
+# connecte au port 7979 (port 6969 sur l'appareil) et le serveur ssh local et redirige toutes les informations entre elles
+hôte$ ./netcat localhost 7979 < readback | ./netcat localhost 22 > readback
+
+# maintenant lorsque nous nous connectons au port 5959 sur le téléphone cela sera comme si nous nous connectons au serveur ssh sur l'hôte
+
+# utilise le reverse netcat pour paramétrer une connexion ssh de retour à l'hôte et redirige le port 9999 sur l'appareil à 'localhost:8000' (cela peut être n'importe quoi comme 'google.com:80')
+téléphone$ ./ssh localhost -p 5959 -L 9999:localhost:8000
+ +

Celà redirigera le port 9999 sur l'appareil au port 8000 de l'hôte.

+ +

Sinon vous pouvez utiliser un serveur SSH (dropbear et host_key) directement sur l'appareil en entrant les commandes suivantes :

+ +
téléphone$ DROPBEAR_PASSWORD=root ./dropbear -p 9000 -F -v -a -r host_key ./dropbear
+hôte$ adb forward tcp:8888 tcp:9000
+# l'authentification avec clé publique à été codée en dur pour fonctionner (assurez-vous que vous avez une clé publique ssh à utiliser)
+hôte$ ssh -vvv root@localhost -p 8888 -R 9999:people.mozilla.org:80
+
+ +

Plus de ressources :

+ + diff --git a/files/fr/archive/b2g_os/debugging/journalisation_console/index.html b/files/fr/archive/b2g_os/debugging/journalisation_console/index.html new file mode 100644 index 0000000000..d20e6ce712 --- /dev/null +++ b/files/fr/archive/b2g_os/debugging/journalisation_console/index.html @@ -0,0 +1,25 @@ +--- +title: Journalisation console sur l'appareil +slug: Archive/B2G_OS/Debugging/Journalisation_console +tags: + - B2G + - Console Web + - Déboguer + - Firefox OS + - Journaliser +translation_of: Archive/B2G_OS/Debugging/On-device_console_logging +--- +

En plus de la possibilité de journaliser vers la console et de lire depuis la Console Web distante, vous pouvez journaliser directement vers le stockage de fichiers de l'appareil, et ensuite récupérer les journaux plus tard depuis votre ordinateur en utilisant l'utilitaire logcat et une connection USB. Cet article explique comment activer la fonctionnalité, comment journaliser, et comment récupérer les journaux.

+

Activer la console sur Firefox OS

+

Les builds de production de Firefox ont la journalisation console (tel que console.log()) désactivée par défaut. Pour la rétablir, ouvrez l'application Paramètres, et ensuite allez dans Informations > Plus d'informations > Développeurs. Dans ce menu, sélectionnez Console activée.

+

Journaliser

+

Une fois que la journalisation est activée, cela marche comme pour Firefox sur ordinateur. Vous utilisez simplement les méthodes de l'objet console pour envoyer du texte vers la console. Par exemple :

+
console.info("Démarrage du matériel foobar !"
+var err = foobar.start();
+if (err) {
+  console.error("--Erreur %d démarrage du matériel foobar !", err);
+}
+
+

Voir console  pour plus de détails sur les fonctionnalités de journalisation qui vous sont offertes.

+

Utiliser logcat

+

Parce que les journaux sont stockés sur l'appareil Firefox OS, et qu'il n'y a pas actuellement d'interface utilisateur pour voir ces journaux sur l'appareil, vous devrez les récupérer depuis un ordinateur pour les analyser. Vous aurez besoin d'utiliser la commande logcat depuis adb, qui fait partie du SDK Android que vous avez peut-être déjà installé lors de votre préparation pour développer pour et sur Firefox OS.

diff --git "a/files/fr/archive/b2g_os/debugging/les_param\303\250tres_d\303\251veloppeurs/index.html" "b/files/fr/archive/b2g_os/debugging/les_param\303\250tres_d\303\251veloppeurs/index.html" new file mode 100644 index 0000000000..43ea1216c8 --- /dev/null +++ "b/files/fr/archive/b2g_os/debugging/les_param\303\250tres_d\303\251veloppeurs/index.html" @@ -0,0 +1,421 @@ +--- +title: Paramètres pour développeurs sur Firefox OS +slug: Archive/B2G_OS/Debugging/Les_paramètres_développeurs +tags: + - Déboguer + - Firefox OS +translation_of: Archive/B2G_OS/Debugging/Developer_settings +--- +
+

Caché au fond de l'application Paramètres de Firefox OS, se trouve le panneau Développeurs. Ce panneau offre de nombreuses options qui vous simplifieront le débogage de votre application Open Web et de Firefox OS. Cet article présente les options disponibles et explique comment les utiliser.

+
+ +

Le panneau de paramétrage à destination des développeurs est intentionnellement difficile d'accès afin d'éviter aux utilisateurs courants d'activer par erreur des options qui pourraient ralentir leur appareil ou modifier l'affichage.

+ +

Dans les versions de Firefox OS 1.4 et suivantes, pour atteindre ce panneau, il faut d'abord l'activer via Paramètres > Informations > Plus d'informations > Cocher "Menu Développeurs". Ensuite ouvrez l'application "Paramètres", et touchez le bouton "Développeurs" (dans la section "Appareil") :

+ +

capture d'écran de l'application Paramètres

+ +

Ce panneau "Développeurs" ressemble à ceci (Capture d'écran prise sur un ZTE Open C, avec Firefox OS 2.2) :

+ +

Capture d'écran du contenu du menu Développeurs

+ +

Dans les versions de Firefox OS antérieures à la 1.4, c'est via Paramètres > Informations > Plus d'informations > Développeurs.

+ +
+

Important: Ces outils sont puissants mais peuvent provoquer des bugs au cours d'une utilisation classique. Les fonctionnalités connues pour en provoquer ont été désactivées par défaut. Si vous rencontrez des problèmes, essayez de désactiver les fonctionnalités développeur que vous avez activées.

+
+ +

Options du panneau Développeurs

+ +

Débogage via USB

+ +

L'option "Débogage USB" permet le débogage à distance de votre appareil Firefox OS. Ceci permet aussi l'utilisation des commandes ADB. Dans les versions antérieures à la 1.4, il n'y a qu'une case à cocher, à partir de la version 1.4, il y a 3 options disponibles :

+ + + +

Outils de développement via Wi-Fi

+ +
+

Note: Introduit dans Firefox OS 3.0 et Firefox 39.0 (27 Mars 2015 et ultérieur)

+
+ +

Cocher cette case permet de connecter l'appareil Firefox OS à WebIDE -que vous trouverez sur Firefox Bureau- via un réseau Wi-Fi local. Cela vous permettra d'envoyer vos applications sur votre appareil Firefox OS pour les tester facilement. Pour plus de détails, voir Débogage Wi-Fi de  Firefox OS de J. Ryan Stinnett (en anglais).

+ +

Nom d'appareil Wi-Fi pour DevTools

+ +
+

Note: Introduit dans Firefox OS 3.0 et Firefox 39.0 (27 Mars 2015 et ultérieur)

+
+ +

Ce champ texte vous permet de définir le nom sous lequel votre appareil sera identifié par votre réseau Wi-Fi, lorsqu'il sera connecté aux outils de développement (voir paragraphe précédent).

+ +

Informations Développeurs

+ +

À partir de la version 1.4 de Firefox OS, toucher cette section vous amène dans le panneau "Informations Développeurs":

+ +

Contenu du panneau Informations Développeurs

+ +

Les 2 premières cases à cocher (toujours actives) sont:

+ + + +

Ensuite, il y a l'option "Outils de développement" qui gère l'accès aux options qui se trouvent dessous, chacune contrôlable par une case à cocher:

+ + + +

Images par seconde

+ +

Activer cette option affiche 3 nombres dans le coin en haut à gauche de l'affichage Firefox OS (voir capture d'écran précédente). Ces valeurs sont une moyenne des résultats récents au sein d'une fenêtre défilant. Ces valeurs sont voulues "instantanées" mais assez précises. Ces nombres sont donc des "déductions":

+ + + +

Durée de chargement

+ +

Firefox OS possède un outil aidant à la mesure de la durée de chargement, particulièrement la durée du "premier affichage". Les valeurs fournies par l'outil — dans le coin en haut à droite de l'écran (voir capture d'écran précédente) — représentent la durée écoulée entre l'instant de lancement de l'application par l'utilisateur et une estimation du premier instant où l'application s'affiche à l'écran, en millisecondes. Ce nombre est uniquement une estimation de la durée réelle d'affichage et a tendance à la sous estimer. Cependant, faire baisser cette valeur se traduit quasiment toujours par une amélioration de la durée de chargement. Cette valeur peut donc être utile pour mesurer rapidement l'efficacité de travaux d'optimisation.

+ +

Mémoire application

+ +

Affiche la quantité de mémoire que les différentes catégories sélectionnées utilisent au sein de l'application courante. Par exemple, la capture d'écran ci-dessous n'a que les options Mémoire application et Objets JS de cochées, donc l'indicateur en bas à droite de l'écran montre que l'application Paramètres utilise 1,15MB en objets JS.

+ +

Exemple d'activation de l'option Mémoire Application

+ +

Accélération graphique

+ +

Zones repeintes

+ +

Dans ce mode, chaque fois qu'une région de l'écran est peinte par Gecko, Gecko ajoute une couche translucide de couleur aléatoire sur la région. Idéalement, seules les régions de l'écran qui changent visuellement "flasheront" avec une nouvelle couleur. Mais il arrive qu'il y ait plus de régions repeintes que nécessaire, faisant "flasher" de grosses parties de l'écran. Ce symptôme peut indiquer une trop forte mise à jour de l'écran de la part de l'application, ou être le reflet de bogues de Gecko lui-même.

+ +

Capture d'écran montrant l'option Zones repeintes en action

+ +

Overscrolling

+ +

Active ou désactive le comportement des versions 2.1 et ultérieures de Firefox OS qui consiste a étirer l'affichage lorsque l'utilisateur tente de faire défiler la page au delà de la fin puis remet l'affichage à sa taille normale une fois le défilement arrêté, un peu comme le ferait un élastique. Le nom complet de ce comportement est elastic overscroll.

+ +

Tuilage (was Layers: Enable tiles)

+ +

Introduite à partir de la version 1.4 de Firefox OS, cette fonctionnalité active l'affichage de contenu sur l'écran en petites parties ("tuiles") plutôt que d'afficher tout l'écran d'un seul coup. Ceci est principalement utile pour le travail du service QA impliquant la réduction de l'effet damier et la recherche de fenêtres de régression.

+ +

Painting basse précision

+ +

Activer cette option fait dessiner à Gecko une version basse précision (floue) du contenu lors d'un défilement vraiment rapide. Ceci est utile parce que plus rapide à dessiner et aide donc à éviter d'afficher des zones blanches (effet damier) lors d'un défilement rapide. Cela ne devrait être visible que temporairement pour l'utilisateur, car le contenu basse précision sera remplacé par le contenu haute précision dès que le défilement s'arrêtera.

+ +

Transparence basse précision

+ +

Ceci est une option supplémentaire pour le "painting" basse précision qui rend le contenu basse précision à moitié transparent. Ceci rend l'effet un peu plus subtile et moins déroutant pour l'utilisateur.

+ +

Composition matérielle (was Enable hardware compositing)

+ +

Lorsque cette option est activée, l'appareil utilise son Composeur matériel pour composer les éléments visuels (surfaces) de l'écran.

+ +

Dessiner bords du tuilage (was Layers: Draw tile borders)

+ +

Ceci est similaire à l'option Dessiner_bords_du_calque, mis à part qu'elle dessine les bords des tuiles individuelles en plus des bords des calques.

+ +

Dessiner bords du calque

+ +

Lorsque cette option est activée, un bord de couleur vive est ajouté autour des différentes calques affichés à l'écran — très pratique pour investiguer les problèmes de calques.

+ +

Une capture d'écran montrant l'effet de l'option Dessiner bord du calque

+ +

Informations arbres de calques

+ +

Cette option active layers.dump, qui copie l'arbre de calque du composeur dans logcat à chaque image composée à l'écran. Ceci est principalement utile pour travailler sur les performances graphiques de la plate-forme, plutôt que pour du développement web classique.

+ +

Information layerscope

+ +

Active les traces du layerscope permettant de voir des informations concernant les calques des applications installées sur un PC. Lire Layerscope sur le wiki Mozilla (en anglais) pour avoir plus de détails et savoir comment l'utiliser.

+ +

Miniatures: captures d'écran

+ +

Dans la vue miniature, active l'affichage de capture d'écran des applications lancées. Sinon, les icônes des applications seront affichés au centre de miniatures vides.

+ +

Gestion de la fenêtre

+ +

Émuler le bouton Accueil

+ +

Crée un bouton Accueil logiciel offrant les mêmes fonctionnalités que son équivalent matériel s'il n'est pas disponible. Cette option existe pour une utilisation future par des appareils qui n'auront probablement pas de bouton Accueil matériel, comme les tablettes.

+ +

Geste de retour à l'accueil

+ +

Permet de faire un geste (partir hors de l'écran et monter vers le centre de l'écran) pour revenir à l'accueil. Encore une fois cette option propose une fonctionnalité du bouton Accueil matériel et existe pour une utilisation future par des appareils qui n'auront probablement pas de bouton Accueil matériel, comme les tablettes.

+ +

Transition continue

+ +

Cette option permet de contrôler si l'application clavier s'ouvre immédiatement ou de manière continue (avec une transition). Désactiver une telle transition peut être utile sur des appareils bas de gamme qui souffrent de mauvaises performances.

+ +

Transition d'application

+ +

Active et désactive toutes les transitions d'ouverture et de fermeture d'applications: toutes les applications s'afficheront immédiatement -sans douce animation- et les claviers apparaîtront et disparaîtront sans animation non plus. Comme l'option "Transition continue", elle a pour but d'améliorer les performances sur des appareils bas de gamme, avec des effets plus notables.

+ +

Suspension d'application

+ +

Cette option activée fait qu'une application fermée en tâche de fond sera gardée dans l'historique et ré-ouverte lorsque vous la sélectionnerez depuis l'écran d'accueil ou la vue miniature. L'option désactivée, une telle application ne sera pas gardée dans l'historique ou la vue miniature.

+ +

Copier-coller

+ +

Active la fonctionnalité, encore expérimentale, de copier-coller en cours d'implémentation dans Firefox OS.

+ +

Débogage

+ +

Pseudo-localisation

+ +

Cette option activée, pseudo-langues comme l'anglais accentué et l'anglais miroir sont sélectionnables dans Paramètres > Langue. Avec les pseudo-localisations, vous pouvez tester le support de la localisation de votre code sur une compilation classique de Gaia, sans avoir à ajouter les ressources d'une langue réelle ou devoir parler une autre langue que l'anglais. Par exemple, vous pouvez vous assurer que les calques se redimensionnent bien avec du texte plus long, prévisualiser l'application dans une fausse langue RTL, ou repérer les éléments HTML sans l'attribut data-l10n-id (ils seront affichés en anglais).

+ +

Screenshot of pseudolocales

+ +

Lors de la compilation de Gaia, vous pouvez ajouter les pseudo-langues dans la liste des langues par défaut en ajoutant la ligne suivante dans gaia/build/config/common-settings.json:

+ +
"devtools.qps.enabled": true
+ +

Selon la configuration de la compilation, les pseudo-localisations sont soit construites au moment de la compilation (ce qui prend de l'espace disque), soit générées dynamiquement au moment de l'exécution (modifiant les performances et l'empreinte mémoire).

+ + + +

Enregistrer les animations lentes

+ +

Cet outil a pour but d'aider les développeurs à comprendre pourquoi les animations ne sont pas déléguées au composeur pour être jouées le plus efficacement possible. Il rapporte des "problèmes" comme essayer d'animer des éléments trop gros, ou d'animer des propriétés CSS qui ne peuvent pas être déléguées. Les messages obtenus ressembleront à ceci:

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

Sortie géolocalisation dans ADB

+ +

Active l'enregistrement des données de géolocalisation vers adb logcat. Ceci aide à déboguer à la fois la partie GPS (à savoir les appels NMEA) et l'utilisation MLS.

+ +

Ignorer les positions GPS

+ +

Activer cette option oblige l'API de géolocalisation à ignorer les informations de localisation provenant du GPS (l'API n'obtiendra d'information que les services de localisation basés sur le réseau). Ceci est utile pour déboguer des problèmes en rapport avec le fournisseur de géolocalisation GPS de Gonk. voir bug 1056857 pour plus d'informations.

+ +

Sortie Wi-Fi dans ADB

+ +

Activer cette option ajoute des informations à propos du Wi-Fi aux log adb (les log d'erreur de la console sont accessibles via la commande adb logcat | grep "Error" dans un Terminal).

+ +

Sortie Bluetooth dans ADB

+ +

Activer cette option ajoute des informations à propos du Bluetooth aux log adb (les log d'erreur de la console sont accessibles via la commande adb logcat | grep "Error" dans un Terminal).

+ +

Bluetooth HCI Sniffing Logs to SDCard

+ +

Enabling this option causes the device's HCI sniffing logs to be recorded to its SDCard.

+ +

Sortie NFC dans ADB

+ +

Activer cette option ajoute des informations à propos du NFC aux log adb (les log d'erreur de la console sont accessibles via la commande adb logcat | grep "Error" dans un Terminal).

+ +

Sortie RIL dans ADB

+ +

Activer cette option ajoute des informations à propos du RIL aux log adb (les log d'erreur de la console sont accessibles via la commande adb logcat | grep "Error" dans un Terminal).

+ +

Sortie réseau dans ADB

+ +

Activer cette option ajoute des informations à propos du réseau aux log adb (les log d'erreur de la console sont accessibles via la commande adb logcat | grep "Error" dans un Terminal).

+ +

Activer la console

+ +

Activer cette option vous permet d'utiliser la console Web de Firefox pour accéder à distance à la sortie console de l'appareil. Sans cette option activée, la fonction console.log() ne fait rien.

+ +

Trace de débogage de Gaia

+ +

Active les traces DEBUG de Gaia. Voir bug 881672 pour plus de détails.

+ +
+

Note:  Malheureusement, toutes les applications ne supportent pas ce mécanisme pour leur trace de débug. Au lieu de ça, ces dernières gèrent un booléen "DEBUG" qui leur sont propre. Activer cette option n'assure donc PAS que vous aurez l'ensemble des log debug.

+
+ +

Paramètres du lecteur d'écran

+ +

Cette option active les paramètres du Lecteur d'écran, qui se trouve ensuite sous Paramètres > Accessibilité. Activer cette nouvelle option active le lecteur d'écran de Firefox OS. Cette technologie permet à un non voyant d'utiliser un appareil Firefox OS. Actuellement en cours de développement, le lecteur d'écran modifie la façon dont les touches de l'écran fonctionnent. Lorsque le lecteur d'écran est activé, vous devez interagir avec l'écran de la manière suivante:

+ + + +
+

Note: Si vous avez activé le lecteur d'écran et que vous souhaitez le désactiver, vous devez revenir jusqu'au panneau de paramétrage à l'aide de ces nouveaux gestes et faire une double-touche sur la case à cocher une fois qu'elle est sélectionnée. Cela restaurera le comportement par défaut.

+
+ +

À partir de la version 1.4 de Firefox OS, il y a un moyen plus rapide de changer l'état du lecteur d'écran. Appuyez sur la touche volume plus puis volume moins, et recommencez 3 fois (plus, moins, plus, moins, plus, moins). Le lecteur d'écran vous demandera de refaire cette action (plus, moins, plus, moins, plus, moins) pour l'activer s'il ne l'était pas, ou le désactiver dans l'autre cas. Si vous ne souhaitez pas modifier l'état du lecteur d'écran, faites simplement autre chose. De cette manière, vous pouvez facilement l'activer pour tester l'accessibilité de votre application Web puis le désactiver sans retourner dans le menu à chaque fois.

+ +

Volume de lecture

+ +

Un curseur contrôlant le volume de la voix.

+ +

Vitesse de lecture

+ +

Un curseur contrôlant la vitesse de lecture de la voix.

+ +

Certificats relecteur Marketplace

+ +

Les certificats de relecteur Marketplace sont utilisés au cours de processus de revue du Firefox Marketplace, pour permettre aux relecteurs d'installer des applications provenant d'autres sources que le Marketplace (e.g. les pages des relecteurs). Cette option permet à l'appareil d'utiliser ces certificats.

+ +

Secouer pour enregistrer les journaux système

+ +
+

Note: Introduit dans la version 2.2 de Firefox OS

+
+ +

Active Logshake, qui attend que l'appareil fasse des mouvements de forte accélération. Lorsqu'un tel mouvement est détecté — c'est à dire lorsque vous secouez votre appareil — il sauvegarde les journaux système présents de log/logcat sur la carte SD, dans un dossier logs/<datetime>. Voir bug 1019816 pour plus de détails.

+ +

Permissions d'applications détaillées

+ +
+

Note: Introduit dans la version 2.1 de Firefox OS

+
+ +

Cette option activée, les développeurs (ainsi que les amateurs de vie privée) peuvent modifier n'importe quelle permission donnée à une application. Le panneau "Permissions applications" dans l'application Paramètres, proposera plus de choix qu'un simple sous-ensemble compréhensible par les non-développeurs (comme géolocalisation). Par exemple, "Schedule Alarms" apparaît avec les choix Demander, Refuser et Autoriser. Notez que certaines applications peuvent ne pas supporter les changements de permissions. Si vous remarquez un comportement anormal veuillez essayer de réinitialiser les permissions, ou réinstaller l'application.

+ +

Tutoriel de prise en main

+ +

Ce bouton lance le programme "First-Time Use" (FTU), qui relance la procédure de configuration initiale ainsi que le tutoriel. C'est utile pour déboguer cette procédure, ou si vous souhaitez reconfigurer votre appareil depuis le début.

+ +

Déverrouillage des privilèges

+ +

Réinitialiser et activer les outils de développement non restreints

+ +
+

Note: Introduit dans la version 2.2 de Firefox OS

+
+ +

Ce bouton vous permet d'activer le mode de développement non restreint dans lequel vous pouvez déboguer et surcharger des applications système depuis le WebIDE. Pour des raisons de sécurité, activer ce mode supprime les données de l'appareil. Notez qu'une fois ce mode activé, il est hautement suggéré d'ajouter un code PIN pour déverrouiller votre appareil puisque ce mode permet facilement d'accéder aux données internes et aux applications système (informations privées, mots de passe, ...).

+ +

Mises à jour logicielles

+ +

Canal de mise à jour

+ +

Vous permet de définir différents canaux pour recevoir les mises à jour logicielles lors de mises à jour OTA. Les canaux sont nightly, aurora, et others.

+ +

Adresse de mise à jour

+ +

Vous permet de définir différentes adresses (URL) desquelles recevoir vos mises à jour.

+ +

Options obsolètes

+ +

Ce chapitre liste les options qui ne sont plus proposées ou qui n'existent plus en l'état, mais qui peuvent être intéressantes pour ceux qui utilisent une ancienne version de Firefox OS.

+ +

Accessibilité

+ +

Dans les versions de Firefox OS qui précèdent la 1.4, ceci contrôle les options d'accessibilité, comme expliqué dans la section Paramètres_du_lecteur_d'écran.

+ +

Grille

+ +

L'option "Grille", une fois activée, ajoute au-dessus de l'affichage de Firefox OS, un motif de grille qui vous aidera à positionner et aligner des éléments. Par exemple, vous pouvez voir ci-dessous l'application navigateur fonctionnant avec l'option Grille d'activée :

+ +

+ +

Les lignes les plus épaisses de la grille sont séparées de 32 pixels, horizontalement et verticalement.

+ +

Images par seconde

+ +

Activer cette option ajoute deux indicateurs en haut de l'affichage de Firefox OS, indiquant la fréquence à laquelle l'écran est redessiné, en images par seconde.

+ +

Show time to load

+ +

In Firefox OS versions older than newer 1.4, enabling this displays time to load information, as explained in the 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).

+ +

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. Now APZ implementation is complete, this option is 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/fr/archive/b2g_os/debugging/personnaliser_b2g.sh/index.html b/files/fr/archive/b2g_os/debugging/personnaliser_b2g.sh/index.html new file mode 100644 index 0000000000..f94c6d0a7e --- /dev/null +++ b/files/fr/archive/b2g_os/debugging/personnaliser_b2g.sh/index.html @@ -0,0 +1,46 @@ +--- +title: Personnaliser le script b2g.sh +slug: Archive/B2G_OS/Debugging/Personnaliser_b2g.sh +tags: + - B2G + - Déboguer + - Firefox OS +translation_of: Archive/B2G_OS/Developing_Firefox_OS/Customizing_the_b2g.sh_script +--- +

+

Brouillon
+ Cette page n'est pas terminée.

+ +

+

Sur téléphone, l'application b2g (qui fournit entre autres les APIs Firefox OS) est démarré à travers le script /system/bin/b2g.sh script. Vous pouvez personnaliser ce script pour changer le comportement de Firefox OS.

+

Définir les variables d'environnement

+

Si vous voulez juste définir une variable d'environnement pour un seul lancement de B2G, vous pouvez faire ceci :

+
adb shell stop b2g
+abd shell "export ENV_VAR=value && /system/bin/b2g.sh"
+
+

Si vous voulez utiliser la même variable d'environnement tout le temps, il vous faut éditer le script b2g.sh, tel que décrit dans la section suivante.

+

Éditer b2g.sh

+

Pour déboguer, vous voudrez peut-être définir des variables d'environnement pour journaliser des informations ou modifier la façon dont le programme b2g tourne. Vous pouvez le faire en éditant le script b2g.sh. Il n'y a aucun outil d'inclus sur le téléphone pour modifier ce fichier, il vous faudra d'abord le copier sur votre ordinateur.

+

Connectez le téléphone à votre ordinateur, ouvrez le Terminal, et éxecutez la commande suivante pour modifier le script :

+
adb pull /system/bin/b2g.sh
+

Modifier le script pour appliquer les changements souhaités. Par exemple, supposons que vous souhaitez voir la sortie de journalisation (ce qui nécessite une compilation de déboguage), vous pourriez rajouter quelque chose comme ceci :

+
export NSPR_LOG_FILE=/data/local/tmp/mylog.txt
+export NSPR_LOG_MODULES=Layers:5
+
+

Et maintenant pour déposer votre script b2g.sh modifié sur votre téléphone :

+
adb shell stop b2g
+adb remount
+adb push b2g.sh /system/bin
+adb shell chmod 0755 /system/bin/b2g.sh
+adb shell start b2g
+
+
+

Note : /data/local/tmp est le seul endroit dans le système de fichier accessible en écriture aux processus de contenu.

+
+

Voir aussi

+ +

 

diff --git a/files/fr/archive/b2g_os/debugging/signaler_une_erreur_firefox_os/index.html b/files/fr/archive/b2g_os/debugging/signaler_une_erreur_firefox_os/index.html new file mode 100644 index 0000000000..c1ba3e50bd --- /dev/null +++ b/files/fr/archive/b2g_os/debugging/signaler_une_erreur_firefox_os/index.html @@ -0,0 +1,121 @@ +--- +title: Signaler une erreur de Firefox OS +slug: Archive/B2G_OS/Debugging/Signaler_une_erreur_Firefox_OS +tags: + - Firefox OS + - QA + - crash + - débogage + - rapport d'erreur + - test +translation_of: Archive/B2G_OS/Debugging/Firefox_OS_crash_reporting +--- +
+

Cette page détaille comment gérer la remontée d'erreurs sur Firefox OS, y compris la récupération des rapports d'erreurs et les plantages forcés.

+
+ +
+

Note : La plupart des contributeurs de Firefox pour ordinateur se servent du tag about:crashes pour retrouver les rapports d'erreurs (lire Crash reporting pour plus de détails), mais cette méthode n'est pas supportée par Firefox OS.

+
+ +

Avant de tenter de faire autre chose

+ +

Les instructions suivantes supposent que vous avez déjà suivi ces trois étapes :

+ +
    +
  1. Assurez-vous que le débogage à distance est autorisé sur votre appareil et que ADB est installé. Ceci autorise votre ordinateur à communiquer avec votre appareil.
    2. +
  2. Connectez votre appareil à votre ordinateur via USB.
    3. +
  3. Installez ADB Helper Add-on sur le bureau Firefox pour gérer tout transfert de port nécessaire.
    4. +
+ +

Installer BusyBox

+ +

Il est également recommandé que vous installiez notre service BusyBox qui ajoute un grand nombre de commandes utiles à ADB pour aider à tester et déboguer Firefox OS.

+ +

Pour l'installer, assurez-vous que l'appareil est en marche puis :

+ +
    +
  1. Téléchargez BusyBox ;
    2. +
  2. Dézippez l'archive à un endroit précis ;
    3. +
  3. cd dans le dossier busybox-b2g extrait ;
    4. +
  4. Exécutez ./install.sh pour l'installer.
    5. +
+ +

Tous les services busybox ont des liens symboliques en /system/bin, ce qui fait que vous pouvez exécuter des commandes comme ping directement. Voici quelques exemples de commandes :

+ +
adb shell ping 8.8.8.8   => ping command
+
+adb shell ifconfig wlan0 => check tx/rx bytes
+
+adb shell cat /proc/net/route    => check the default route
+
+adb shell iptables -t nat -nvL   => check if the packets are sent from application to IP layer, check Chain OUTPUT (policy ACCEPT 2 packets, 168 bytes)
+ +

Obtenir des rapports d'erreurs depuis un appareil sous Firefox OS

+ +

Nous avons créé une application Firefox OS pour nous permettre de récupérer des rapports d'erreurs — About Crashes — qui fonctionne sur les versions 1.2+.
+
+ Pour l'installer sur votre appareil, suivez les étapes ci-dessous.

+ +
    +
  1. About Crashes est une application certifiée, vous devez donc autoriser le débogage des applications certifiées (voir les instructions de App Manager, et WebIDE).
    2. +
  2. Téléchargez le fichier zip About Crashes depuis le lien ci-dessus et l'extraire le fichier en local.
    3. +
  3. Dans le bureau Firefox, ouvrez App Manager ou WebIDE (en fonction de la version de Firefox que vous utilisez) sous Outils > Développeur Web.
    4. +
  4. Dans un des outils, ajoutez l'application About Crashes comme une application packagée (App Manager : cliquez sur le plus à côté de l'option Add Packaged App, WebIDE: ouvrez le menu déroulant de gauche et sélectionnez Add Packaged App...).
    5. +
  5. Connectez votre appareil à App Manager/WebIDE (App Manager: vous le trouverez listé au bas de l'interface utilisateur, WebIDE: vous le trouverez sous Select Runtime).
    6. +
  6. Installez et ouvrez l'application sur l'appareil (App Manager: pressez le bouton Update, WebIDE: pressez le bouton "Play" (Install and Run)).
    7. +
  7. Sur l'appareil, pressez le bouton Update dans About Crashes pour voir vos erreurs les plus récentes.
    8. +
+ +

Obtenir des IDs d'erreurs depuis la ligne de commande

+ +

Vous pouvez obtenir une liste d'IDs d'erreurs via la ligne de commande en saisissant la commande suivante dans votre terminal :

+ +
adb shell ls -l /data/b2g/mozilla/Crash\ Reports/submitted/
+ +

Si vous avez une longue liste d'erreurs et que vous voulez les trier par date, utilisez cette commande-ci :

+ +
adb shell busybox ls -ltr /data/b2g/mozilla/Crash\ Reports/submitted/
+ +

Obtenir/Vérifier le rapport d'erreur

+ +

Pour vérifier un rapport d'erreur:

+ +
    +
  1. Copiez le nom de fichier sans l'extension.
    2. +
  2. Allez sur Mozilla Crash Reports.
    3. +
  3. Collez le nom de fichier sans l'extension dans la barre de recherche dans le coin en haut à droite.
    4. +
+ +

Cela devrait afficher le rapport d'erreurs que vous avez soumis.

+ +

Comment forcer un plantage

+ +

Pour déclencher un plantage du système Firefox OS, saisissez la commande suivante dans votre terminal pour trouver l'ID du processus source :

+ +
adb shell ps | grep b2g
+ +

Vous allez devoir trouver la ligne qui commence par root, et qui finit par /system/b2g/b2g. Elle devrait ressembler à ceci :

+ +
root 109 1 191120 66024 ffffffff 400fa330 S /system/b2g/b2g
+ +

Le nombre au début de la ligne est l'ID du processus kill que vous devrez utiliser pour killer ce processus. Exécutez la commande suivante, en remplaçant l'espace de texte réservé par l'ID :

+ +
adb shell kill -11 [ENTER ID HERE]
+ +

Killer le processus root plantera votre l'appareil.

+ +

Comment exécuter le script GDB pour b2g

+ +
    +
  1. Démarrez l'application Galerie sur le téléphone, puis exécutez la commande suivante dans votre terminal : + 
    adb shell b2g-ps
    +
    2. +
  2. Notez le pid de l'application Galerie, puis exécutez la commande suivante : + 
    ./run-gdb.sh attach <pid>
    +
    3. +
  3. Provoquez le plantage.
    4. +
  4. Exécutez cette commande : + 
    (gdb) bt
    +
    5. +
diff --git "a/files/fr/archive/b2g_os/debugging/\303\251tapes_pr\303\251paratoires/index.html" "b/files/fr/archive/b2g_os/debugging/\303\251tapes_pr\303\251paratoires/index.html" new file mode 100644 index 0000000000..ac45ab39eb --- /dev/null +++ "b/files/fr/archive/b2g_os/debugging/\303\251tapes_pr\303\251paratoires/index.html" @@ -0,0 +1,59 @@ +--- +title: >- + Préparations pour déboguer sur Firefox OS avec les outils pour Développeur Web + de Firefox +slug: Archive/B2G_OS/Debugging/Étapes_préparatoires +tags: + - B2G + - Déboguer + - Firefox OS +translation_of: Archive/B2G_OS/Debugging/Setting_up +--- +

Firefox OS supporte le même protocole de débogage à distance que Firefox pour Android. Ceci veut dire que vous pouvez utiliser les outils de développement web de Firefox pour déboguer les applications Gaia lancées sur un appareil ou un émulateur Firefox OS. Afin de déboguer Firefox OS, sur votre appareil ou dans le simulateur, vous devez utiliser Firefox 18 ou plus récent. De plus, vous devrez modifier des paramètres du navigateur Firefox de votre ordinateur, ainsi que sur Firefox OS.

+ +
+

Note: Pour déboguer des applications sur un appareil Firefox OS, si c'est sur la version Firefox OS 1.2 ou postérieur, le meilleur choix est d'utiliser WebIDE.

+
+ +

Firefox pour ordinateur

+ +

Vous devez être sûr d'utiliser Firefox 18 ou plus récent afin d'avoir le support du débogage distant. Si vous n'avez pas déjà une copie récente de Firefox, téléchargez la dernière version stable, ou récupérez la version Nightly encore plus récente.

+ +

Une fois que vous avez la bonne version de Firefox sur votre ordinateur, tapez about:config dans la barre d'URL et changez la valeur de devtools.debugger.remote-enabled à true. Vous devrez redémarrer Firefox pour que le débogage distant soit activé. Vous aurez alors une nouvelle option dans le menu Développement > Se connecter...

+ +

Activer le débogage

+ +

Si vous utilisez le simulateur Firefox OS, l'activation du débogage est plutôt facile. Vous n'avez pas besoin de faire de redirection de port comme avec un appareil physique. Ouvrez simplement les paramètres pour développeurs et activez l'option Débogage USB.

+ +
+

Note : Ceci ne fonctionne plus à la date du 10 janvier 2013, car les builds pour appareils de Firefox OS ont le débogage désactivé. Il y aura éventuellement un moyen de compiler votre propre build avec le débogage réactivé, mais cela n'existe pas encore. Ce document sera mis à jour une fois que ce sera possible. De plus, le paramètre pour désactiver le support out-of-process a été supprimé. Pour l'instant, vous devrez utiliser le simulateur Firefox OS pour déboguer.

+
+ +

Sur votre appareil Firefox OS physique, ouvrez les paramètres pour développeurs, et :

+ + + +
+

Rappel : Si vous flashez votre appareil, vous devrez reproduire ces modifications.

+
+ +

Vous pouvez maintenant utiliser le débogueur !

+ +

Activer la console sur un appareil Firefox OS

+ +

Les builds de production de Firefox ont la journalisation dans la console (tel que console.log()) désactivée par défaut. Pour la rétablir, ouvrez les paramètres pour développeurs et sélectionnez Console activée.

+ +
+

Note: Voir Journalisation console sur appareil pour obtenir plus de détails concernant l'utilisation de la journalisation console sur Firefox OS.

+
+ +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/depannage/index.html b/files/fr/archive/b2g_os/depannage/index.html new file mode 100644 index 0000000000..1105fd7fe5 --- /dev/null +++ b/files/fr/archive/b2g_os/depannage/index.html @@ -0,0 +1,60 @@ +--- +title: Dépannage de Firefox OS +slug: Archive/B2G_OS/depannage +tags: + - B2G + - Firefox OS + - Mobile +translation_of: Archive/B2G_OS/Troubleshooting +--- +
+

Cet article offre des astuces pour résoudre des problèmes courants pouvant survenir lors de l'utilisation de Firefox OS. N'hésitez pas à compléter cette page !

+
+ +

Problème de réseau

+ +

Si vous avez des difficultés à vous connecter aux réseaux Wi-Fi, il peut être utile de supprimer le fichier de configuration Wi-Fi de l'appareil. Vous pouvez le faire de cette façon :

+ +
adb shell rm /data/misc/wifi/wpa_supplicant.conf
+adb reboot
+
+ +
+

Note : Ces instructions partent du principe que vous avez configuré le paramètre udev pour l'appareil.

+
+ +

Téléphone briqué

+ +

Si vous avez briqué votre téléphone, par exemple en essayant de le flasher avec de mauvaises images, essayez de redémarrer sur le bootloader (fastboot ou heimdal en fonction de votre téléphone). La séquence exacte dépend du téléphone. Retirez le câble USB. Retirez la batterie. Réinsérez la batterie. Pour Unagi et Otoro, appuyez et maintenez le bouton d'augmentation du volume ainsi que le bouton d'alimentation pendant plusieurs secondes jusqu'à voir l'écran de chargement. Vérifiez que le téléphone est dans le mode bootloader en utilisant fastboot devices (ou heimdall devices sur certains téléphones Samsung). Une fois que vous pouvez voir le téléphone en utilisant fastboot devices, positionnez-vous dans le dossier contenant une image de base, ou les fichiers fournis par le fabriquant du téléphone (pour certains téléphones). 

+ +

Vous avez deux options pour flasher :

+ + + +
fastboot flash boot boot.img
+fastboot flash userdata userdata.img
+fastboot flash system system.img
+fastboot flash recovery recovery.img
+fastboot erase cache
+fastboot reboot
+ +

LED rouge clignotante (otoro/unagi)

+ +

Ceci veut dire que la batterie est trop faible pour démarrer l'appareil. Vous pouvez la laisser se charger pendant un moment (jusqu'à ce que la LED rouge arrête de clignoter, et un petit peu plus longtemps), ou vous pouvez débrancher le câble USB, retirer la batterie, insérer le câble USB, et réinsérer la batterie.

+ +

Impossibilité de recevoir un SMS avec une carte SIM utilisée précédemment dans un iPhone

+ +

Si vous faites passer votre carte SIM d'un iPhone à un téléphone Firefox OS (ou une autre plateforme), il ce peut que vous ne puissiez plus recevoir de SMS d'utilisateurs d'iPhone. La raison est que les SMS entre iPhone sont envoyés en utilisant iMessage, qui fait passer les messages par les serveurs d'Apple au lieu de les envoyer comme de véritables SMS, dans le but de faire faire des économies aux utilisateurs. Malheureusement, lorsque vous quitter l'iPhone, iMessage ne peut pas le savoir donc les message en provenance d'autres utilisateurs d'iPhone seront toujours envoyés avec iMessage, ce qui veut dire que vous ne pourrez pas les recevoir.

+ +

Pour rectifier ce comportement, vous devez désactiver iMessage pour votre SIM. Pour savoir comment faire, veuillez lire le guide sur imore.com: Here's how to turn off iMessage.

+ +

Appareil invisible pour ADB sur OSX

+ +

Lorsque vous exécutez adb devices sur OSX, certains appareils peuvent ne pas apparaitre pas dans la liste, pour pleins de bonnes raisons. Ceci peut s'arranger en ajoutant le vendor ID de votre appareil au fichier ~/.android/adb_usb.ini , pour aider ADB à le voir.

+ +
+

Note: Voir ce post stackoverflow pour obtenir tous les détails, notamment comment trouver le vendor ID de votre appareil, et comment l'ajouter au fichier adb_usb.ini.

+
diff --git a/files/fr/archive/b2g_os/developer_preview_phone/index.html b/files/fr/archive/b2g_os/developer_preview_phone/index.html new file mode 100644 index 0000000000..83cc058f30 --- /dev/null +++ b/files/fr/archive/b2g_os/developer_preview_phone/index.html @@ -0,0 +1,23 @@ +--- +title: Mise à jour d'un téléphone développeur +slug: Archive/B2G_OS/Developer_preview_phone +translation_of: Archive/B2G_OS/Phone_guide +--- +
+

Note: Un nouveau guide, plus détaillé, pour mettre à jour les téléphones développeurs — dont le Geeksphone — est disponible. Pour le lire allez sur Mise à jour de votre Geeksphone/téléphone développeur Firefox OS.

+
+ +

Si vous avez un téléphone développeur de Geeksphone et que vous souhaitez le mettre à jour, suivez les étapes suivantes. Ces instructions ne concernent que les modèles Geeksphone Keon et Peak.

+ +
    +
  1. Assurez-vous d'avoir au moins 50% de batterie restante. C'est important car si votre téléphone s'éteint pendant la mise à jour, vous pourriez devoir le renvoyer.
    2. +
  2. Le téléphone n'étant pas connecté en USB, sélectionnez Paramètres, Informations sur l'appareil, Plus d'informations, Développeurs puis cochez Débogage distant.
    3. +
  3. Téléchargez le pilote USB et décompressez-le. Notez où vous l'avez enregistré car vous en aurez besoin plus tard.
    4. +
  4. Utilisez un câble USB pour le brancher sur votre ordinateur. Si vous utilisez Windows, le système peut vous demander d'installer des pilotes. Si Windows Update ne les trouve pas, vous pourrez indiquer le dossier que vous avez décompressé à l'étape 3.
    5. +
  5. Téléchargez le fichier de l'image appropriée à votre téléphone (Keon ou Peak). Toutes les images se trouvent sur la page de téléchargement de Geeksphone.
    6. +
  6. Décompressez le fichier image dans un dossier, entrez dans ce dossier et exécutez le script. Flash.sh est destiné à Linux, Flash.bat à Windows et flash_mac.sh à Machintosh (le SDK Android est nécessaire).
    7. +
  7. Attendez que l'appareil redémarre et affiche l'assistant de premier démarrage.
    8. +
+ +


+ En cas de problème, vous pouvez obtenir de l'aide en postant sur les forums Geeksphone.

diff --git a/files/fr/archive/b2g_os/developing_firefox_os/index.html b/files/fr/archive/b2g_os/developing_firefox_os/index.html new file mode 100644 index 0000000000..df620c1a09 --- /dev/null +++ b/files/fr/archive/b2g_os/developing_firefox_os/index.html @@ -0,0 +1,49 @@ +--- +title: Développer Firefox OS +slug: Archive/B2G_OS/Developing_Firefox_OS +tags: + - B2G + - Développer + - Firefox OS + - TopicStub +translation_of: Archive/B2G_OS/Developing_Firefox_OS +--- +
+

Cette section fournit une documentation utile couvrant différentes façons de modifier/améliorer l'expérience Firefox OS (nom de code Boot2Gecko ou B2G) pendant le processus de build, ainsi que la façon dont vous pouvez aider à développer des parties de la plateforme bas niveau telles que Gecko et Gonk.

+
+
+

Note : Si vous êtes intéressés spécifiquement par le développement de Gaia, l'interface de Firefox OS, vous devriez plutôt consulter nos pages Développer pour Gaia.

+
+

Notes de contribution générales

+

Gecko étant partie intégrante du navigateur Firefox, contribuer à des parties de Gecko relatives à Firefox OS est similaire à contribuer à Gecko de manière générale ; il en est de même pour Gonk. Pour cela, vous avez besoin de vous familiariser avec la communauté, d'apprendre le fonctionnement de l'arborescence du code, et de trouver des bugs sur lesquels travailler. La page Contribuer à Mozilla est un bon endroit pour se familiariser avec le processus de contribution.

+

Vous devriez en apprendre plus sur Gecko, comment il fonctionne et comment il est structuré. La page MDN sur Gecko y rassemble des notes utiles, de même que la page Gecko:Overview sur le Wiki Mozilla. Pour plus d'informations sur les API (spécifiques à Firefox OS), la page WebAPI du Wiki Mozilla donne un aperçu travail, et la page WebAPI du MDN rassemble les documentation de toutes les API.

+

Ensuite, regardez Gonk, le kernel sur lequel s'appuie Firefox OS. Pour faire simple, Gonk est une autre cible de portage pour Gecko, comme c'est le cas avec les versions de bureau de Firefox sur Mac OS X, Windows et Linux. Gonk en lui-même n'est qu'une version minimaliste du Android Open Source Project — nous essayons autant que possible de ne pas changer Gonk lui-même puisque nous n'avons pas le contrôle du code source, et que les partenaires avec lesquels nous travaillons pour créer les appareils Firefox OS fournissent générallement un code spéfique à leurs appareils pour faire l'interface entre l'appareil et Gecko/Gonk.

+

Cependant, il y a encore du travail à réaliser avec les API. La plupart du code Gecko spécifique Gonk utilise #ifdef MOZ_WIDGET_GONK pour ne l'activer que dans Firefox OS, et/ou est contenu dans les sous-répertoires gonk tels que gecko-dev/hal/gonk. Essayez de cloner localement le dépôt gecko-dev et d'y jeter un œil. Notre article Mozilla Source Code Directory Structure est aussi très utile.

+

Ensuite, vous devriez apprendre l'Architecture de Firefox OS, comment Compiler Firefox OS (commencez avec le Résumé du processus de compilation de Firefox OS), et comment Porter Firefox OS sur d'autres appareils.

+

Firefox OS est développé en une série de Modules séparés : regardez la page Firefox OS Modules pour vous donner une idée sur la façon dont le code est regroupé, vérifiez qui est le propriétaire du module pour savoir à qui vous adresser si vous avez besoin d'aide.

+
+

Note : Pour trouver de l'aide, les meilleurs endroits pour commencer sont la mailing list dev-b2g et l'espace de chat #b2g sur l'IRC Mozilla.

+
+

Sujets spécifiques de développement de Firefox OS

+
+
+ Rapporter de bugs à propos de Firefox OS
+
+ Cet article fournit un guide permettant de renseigner des bug sur l'ensemble des aspects de Firefox OS.
+
+ Modifier le fichier hosts
+
+ Un guide sur ce qui peut être accompli en modifiant le fichier hosts.
+
+ Customisation avec le fichier .userconfig
+
+ Comment customiser la construction et l'exécution de Firefox OS en changeant le fichier .userconfig.
+
+ Personnaliser le script b2g.sh
+
+ Une explication sur ce qui peut être accompli en personnalisant le script b2g.sh, qui fait fonctionner l'application b2g et contrôle différents aspects du système.
+
+ Porter Firefox OS
+
+ Information sur la façon de porter Firefox OS sur de nouveaux appareils.
+
diff --git a/files/fr/archive/b2g_os/developing_firefox_os/personnalisation_des_dns/index.html b/files/fr/archive/b2g_os/developing_firefox_os/personnalisation_des_dns/index.html new file mode 100644 index 0000000000..b3cc818730 --- /dev/null +++ b/files/fr/archive/b2g_os/developing_firefox_os/personnalisation_des_dns/index.html @@ -0,0 +1,65 @@ +--- +title: Personnalisation des DNS +slug: Archive/B2G_OS/Developing_Firefox_OS/Personnalisation_des_DNS +tags: + - DNS + - Firefox OS +translation_of: Archive/B2G_OS/Developing_Firefox_OS/Customizing_DNS +--- +

Cet article décrit une brève procédure pour modifier les serveurs DNS de toutes les interfaces (wifi, cellulaire, etc.) d'un appareil Firefox OS.

+ +

Préparation de votre environnement

+ +
    +
  1. Sur votre téléphone, allez dans les Paramètres Développeurs et activer les réglages suivants : + +
      +
    • Débogage distant (dans Firefox OS 1.4 et au-delà, sélectionnez ADB et outils de développement dans le menu déroulant.)
      • +
    • Activer la console
      • +
    +
    2. +
  2. Assurez-vous d'avoir ADB/Fastboot installés sur votre ordinateur.
    3. +
  3. Une fois ces étapes terminées, branchez votre téléphone sur votre ordinateur via l'USB.
    4. +
+ +

Étapes pour actualiser les DNS

+ +
    +
  1. Ouvrez une fenêtre de terminal.
    2. +
  2. Récupérez le fichier de configuration DNS sur votre ordinateur avec la commande ci-dessous : + 
    adb pull /system/etc/dhcpcd/dhcpcd-hooks/20-dns.conf 20-dns.conf
    +
    3. +
  3. Recherchez les lignes 22 à 26 dans le fichier : + 
        count=1
+    for dnsaddr in ${new_domain_name_servers}; do
+        setprop dhcp.${intf}.dns${count} ${dnsaddr}
+        count=$(($count + 1))
+    done
    +
    4. +
  4. Dans cette section, remplacez la ligne setprop par des lignes selon ce modèle (vous pouvez spécifier jusqu'à 4 serveurs DNS) : + 
        setprop dhcp.${intf}.dns1 <adresse ip du serveur DNS 1>
+    setprop dhcp.${intf}.dns2 <adresse ip du serveur DNS 2>
+    setprop dhcp.${intf}.dns3 <adresse ip du serveur DNS 3>
+    setprop dhcp.${intf}.dns4 <adresse ip du serveur DNS 4>
+
    +
    5. +
  5. Remontez la partition /system sur l'appareil pour obtenir des permissions en lecture-écriture, de cette manière : + 
    adb remount
    +
    6. +
  6. Juste au cas où, faites une sauvegarde du fichier original : + 
    adb shell mv /system/etc/dhcpcd/dhcpcd-hooks/20-dns.conf /system/etc/dhcpcd/dhcpcd-hooks/20-dns.bak.conf
    +
    7. +
  7. Envoyez le fichier édité et appliquez-lui les permissions correctes, comme ceci : + 
    adb push 20-dns.conf /system/etc/dhcpcd/dhcpcd-hooks/20-dns.conf
+adb shell chmod 644 /system/etc/dhcpcd/dhcpcd-hooks/20-dns.conf
    +
    8. +
  8. Redémarrez l'appareil et vos paramètres de serveurs DNS seront actualisés.
    9. +
+ +

Voir aussi

+ +
+ +
diff --git a/files/fr/archive/b2g_os/developing_firefox_os/quickstart_guide_to_b2g_development/index.html b/files/fr/archive/b2g_os/developing_firefox_os/quickstart_guide_to_b2g_development/index.html new file mode 100644 index 0000000000..b8ad159b13 --- /dev/null +++ b/files/fr/archive/b2g_os/developing_firefox_os/quickstart_guide_to_b2g_development/index.html @@ -0,0 +1,41 @@ +--- +title: Guide de démarrage rapide pour le développement B2G +slug: Archive/B2G_OS/Developing_Firefox_OS/Quickstart_guide_to_B2G_development +tags: + - NeedsContent + - NeedsMarkupWork +translation_of: Archive/B2G_OS/Developing_Firefox_OS +--- +

+

Brouillon
+ Cette page n'est pas terminée.

+ +

+ +

À déterminer

+ +

Éléments à aborder :

+ +
         * Travail dans l'espace de travail
+ +
         * dépôt dans l'espace de travail
+ +
         * git dans les répertoires de travail
+ +
         * liens dans des répertoires de travail séparés
+ +
         * Comment contribuer : Gaia, Gecko/Gonk, Gonk, Docs, liens vers les bogues sur lesquels travailler
+ +
 
+ +
Liens également souhaités vers
+ +
 
+ +
Traitement des bogues (comment les différentes équipes oeuvrent ensemble pour travailler sur Bugzilla)
+ +
Travailler sur les bogues de Firefox OS [en-US]
+ +
Travailler sur les bogues de Firefox OS [fr]
+ +

 

diff --git a/files/fr/archive/b2g_os/developing_firefox_os/rapporter_bug_firefox_os/index.html b/files/fr/archive/b2g_os/developing_firefox_os/rapporter_bug_firefox_os/index.html new file mode 100644 index 0000000000..35080199fc --- /dev/null +++ b/files/fr/archive/b2g_os/developing_firefox_os/rapporter_bug_firefox_os/index.html @@ -0,0 +1,199 @@ +--- +title: Rapporter des bugs à propos de Firefox OS +slug: Archive/B2G_OS/Developing_Firefox_OS/Rapporter_Bug_Firefox_OS +tags: + - Bugs + - Bugzilla + - Firefox OS + - Guide + - QA + - filing + - test +translation_of: Archive/B2G_OS/Developing_Firefox_OS/Filing_bugs_against_Firefox_OS +--- +
+

Cet article est un guide pour aider à rapporter des bugs à propos du projet Firefox OS, incluant Gaia et B2G.

+
+ +

Bugzilla

+ +

Comme pour la plupart des projets Mozilla, nous utilisons Bugzilla pour le suivi des bugs et des problèmes. Vous pouvez remplir un bug sur Bugzilla quand vous en trouvez un — nous avons un produit distinct pour Firefox OS, qui contient les composants pour tout ce qui concerne Gaia, Gonk et Gecko. Utilisez ce composant pour remplir les bugs concernant Firefox OS, Gaia, etc.

+ +
+

Note : La page B2G QA Wiki (ressource anglophone) contient également quelques ressources utiles pour la gestion des bugs Firefox OS ; les pages les plus utiles sont Bugzilla Usage (EN) et Incoming bug triage for Firefox OS (EN).

+
+ +

Remplir des bugs

+ +

Pour remplir un bug valide, vous pouvez suivre les recommandations pour l'écriture d'un bug  (voir aussi Rapporter un bug sur le blog technique mozfr).
+ Vous pouvez également utiliser ce modèle sur Bugzilla et vous référer aux instructions ci-dessous pour compléter le bug.

+ +

Champs obligatoires et optionnels

+ +

Quand vous remplissez un nouveau bug, certains champs sont obligatoires :

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ChampDescription
ComponentChoisissez la catégorie à laquelle le bug devrait être rattaché. Si vous n'avez aucune idée de la catégorie dans laquelle devrait se trouver le problème, vous pouvez mettre "General".
SummaryIndiquez une brève description du bug.
DescriptionDécrivez clairement la situation. Un bon bug doit contenir les étapes de reproduction (STR — Steps to reproduce), le résultat attendu (Expected Result), et le résultat actuel (Actual Result). Mentionnez également la fréquence de reproduction (Reproduction Frequency), c'est-à-dire le nombre de fois que le bug se manifeste si vous répétez les étapes indéfiniment.
Build InformationRendez vous dans Paramètres > Informations > Plus d'informations et rajouter les informations suivantes au bug: Version du système, Numéro de compilation, Version de la plate-forme, Identifiant de version, Canal de mise à jour et Informations Git. (Si vous êtes sur un ordinateur de type Mac/Linux, avec adb et git installés, vous pouvez lancer ce script et coller la sortie écran du script dans le bug.)
ScreenshotsVeuillez attacher une capture d'écran qui pourra aider à analyser le bug. (Sur le téléphone de développement Flame, maintenir appuyés les boutons d'Allumage et de Volume bas simultanément à peu près 2 secondes jusqu’à ce que le téléphone affiche une notification de capture d'écran. Ensuite transférez l'image sur votre ordinateur en utilisant l'USB.)
VideoSi votre bug contient des changements à l'écran, difficilement captables via une capture d'écran, veuillez filmer une vidéo. Vous pouvez transférer le fichier en attachement du bug. Vous pouvez aussi transférer la vidéo sur YouTube et copier/coller le lien dans le bug.
ADB logsSi adb est installé sur votre ordinateur, veuillez le connecter au téléphone et lancer la commande : + 
+adb logcat
+ Veuillez joindre la sortie d'écran de cette commande dans un fichier de type texte et le joindre au bug.
+ +

Les champs suivants sont optionnels :

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ChampDescription
Depends/BlockMontre la dépendance entre les bugs.
KeywordsMots-clés pour bugzilla. Les groupes spécifiques vont l'utiliser pour le suivi.
WhiteboardContient les tags. Ajoutez n'importe quel tag pour le suivi. Vous ne devriez pas supprimer les tags dans autres sans autorisation.
See AlsoDe temps en temps, deux problèmes sont liés et vous pouvez le spécifier ici.
FlagsFlags pour tracker les statuts ; le flag le plus utilisé dans les bugs Firefox OS est blocking-b2g. Si un bug est flaggé en tant que "blocking-b2g", cela signifie que nous devrions y consacrer plus d'attention car celui-ci menace de bloquer la sortie.
SecuritySi un bug est relatif à la sécurité des données personnelles, à des pertes de profits et d'autres problèmes de ce genre, vous devriez cocher la case. Ainsi, cela ne sera visible que par les employés concernés.
+ +

Pour trouver plus d'informations sur les champs de bugzilla, vous pouvez regarder la page Bugzilla Fields (EN) sur Bugzilla.

+ +

Ouvrir des bugs de traduction

+ +

Lorsque vous rencontrez une phrase non traduite, cela peut vouloir dire deux choses :

+ + + +

Comment déterminer les bugs de traduction automatique (l12y)

+ +
    +
  1. Dans Firefox OS, allez dans Paramètres > Informations > Plus d'informations et activez le Menu développeurs.
    2. +
  2. Allez dans Paramètres > Développeurs et cochez Pseudo-localization.
    3. +
  3. Allez dans Paramètres > Langue et défilez vers le bas pour choisir anglais accentué.
    4. +
  4. Regardez de nouveau la phrase non traduite. Si celle-ci apparaît en anglais normal et non en anglais accentué, il paraît plus probable que cela soit causé par un problème de traduction automatique (l12y).
    5. +
  5. Dans Bugzilla, ouvrez un bug pour le produit (product) 'Firefox OS'. Choisissez le composant (Component) pour lequel la phrase non traduite apparaît. Ajoutez 'l12y' dans le champ Mots-clés (Keyword).
    6. +
  6. Veuillez remplir tous les champs obligatoires.
    7. +
+ +

Mots-clés fréquemment utilisés

+ +

Le tableau qui suit décrit les différents mot-clés que vous pourrez trouver pour les bugs Firefox OS.

+ +

Vous devez toujours indiquer, les Versions/Systèmes/Plate-forme(s) utilisés pour vérifier le bug, dans les commentaires du bug, avant de changer le Status à Verified. Si les bug est ouvert pour plusieurs plate-formes, et que vous n'avez qu'une plate-forme pour le tester, faites le test, nottez dans le bug, mais ne changez surtout pas le Status à Verified. Toutes les plate-formes doivent être testées avant de changer le Status à Verified.

+ +

Enfin, si d'autres bugs sont marqués comme doublon (duplicate) du bug que vous vérifiez, assurez vous de les tester et de le mentionner aussi. Souvent des développeurs signalent comme doublon, des bugs qui sont similaires mais pas identiques, et ceux-ci peuvent être oubliés si non testés.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Mot-cléDescription
metaIndique que ce bug est un bug de suivi. Mozilla utilise cette étiquette pour suivre plusieurs bugs ou les différentes implémentations nécessaires à un scénario d'utilisation. Les développeurs ne sont pas censés apporter de correctifs pour ce type de bug (mais pour les bugs qui le composent). Il faut garder à l'esprit que ces meta-bugs sont utilisés par les chefs de projets et les équipes de qualité pour le suivi.
qablockerUtilisé pour des bugs qui bloquent la possibilité de faire des tests (manuels ou automatiques) et qui doivent être corrigés pour la prochaine Beta ou version.
qawantedUtilisé pour des bugs pour lesquels on souhaite avoir plus d'informations, pouvoir les reproduire, identifier le scénario, ou indiquer qu'ils sont dupliqués (au cas où on n'a pas trouvé le bug original). Le champ whiteboard contient une étiquette pour le progrès de l'équipe qualité sur ce point. Le mot-clé qawanted doit être retiré une fois ce travail terminé.
regressionIndique que le problème avait été réglé précédemment mais est survenu à nouveau (une régression logicielle). Le bug en question étant un nouveau bug permettant d'indiquer qu'il y a eu une régresion. Ce type de bug peut également faire référence aux problèmes non-identifiés dans les vérifications et dans les smoke tests, qui se produisent dans les versions compilées actuelles mais qui ne se produisaient pas avant. Suivre ces bugs permet d'identifier les points qui sont fragiles et dont les tests devraient être améliorés/augmentés.
regressionwindow-wantedIndique que le bug est une régression et qu'il serait utile de connaître à partir de quand (et éventuellement jusqu'à quand) le bug s'est produit. Cela permet d'aider à identifier le code qui a pu introduire la régression.
steps-wantedIndique un bug pour lequel les étapes de reproduction n'ont pas été suffisamment détaillées ou expliquées. On souhaite que quelqu'un identifie précisément les étapes pour reproduire le bug.
verifymeSignifie que ce bug peut être vérifié avec la dernière version de B2G par quelqu'un d'autre que la personne de l'équipe qualité indiquée. Ce bug nécessite une configuration matérielle spécifique, indiquée pour vérifier la correction. Il faut alors tenter de reproduire le bug, si la résolution est effective (Fixed est correct), il faut marquer le Status à Verified.
+
+ Dans les commentaires du bug et avant de changer le statut à Verified, veillez à toujours indiquer la version (build), le système d'exploitation et la plate-forme utilisés pour vérifier le bug. Si le bug est indiqué sur trois plates-formes et qu'il en reste une à vérifier, vous pouvez ajouter un commentaire dans le bug avec ces informations mais pas le marquer comme vérifié. Toutes les plates-formes doivent être testées avant de passer le statut d'un bug à Verified.
+
+ Enfin, si d'autres bugs ont été identifiés comme des duplicata du bug que vous vérifiez, assurez vous également de vérifier ces bugs et de les commenter. Souvent, des développeurs indiquent des bugs liés (mais pas identiques) comme duplicatas, ce qui fait que ces derniers sont parfois sous-estimés pour la vérification.
crashAjouté ce mot-clé si vous rencontrez un crash dans Firefox OS.
+ +
+

Note : Pour plus d'informations sur la gestion des bugs lors du développement de Gaia, lire la page soumettre un correctif (patch) pour Gaia.

+
+ +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/developing_gaia/apporter_modifications_gaia/index.html b/files/fr/archive/b2g_os/developing_gaia/apporter_modifications_gaia/index.html new file mode 100644 index 0000000000..a144a068de --- /dev/null +++ b/files/fr/archive/b2g_os/developing_gaia/apporter_modifications_gaia/index.html @@ -0,0 +1,87 @@ +--- +title: Apporter des modifications au code de Gaia +slug: Archive/B2G_OS/Developing_Gaia/Apporter_modifications_Gaia +tags: + - B2G + - Contributing + - Firefox OS + - Gaia + - GitHub + - Guide + - code changes +translation_of: Archive/B2G_OS/Developing_Gaia/Making_Gaia_code_changes +--- +
+

Maintenant que vous pouvez lancer Gaia dans Firefox et que vous connaissez certains éléments sur le fonctionnement du code, vous devriez pouvoir commencer à contribuer au projet. Cet article décrit comment apporter des modifications et où trouver des bugs sur lesquels travailler.

+
+ +

Bonnes pratiques Git

+ +
    +
  1. Quand vous apportez des modifications au code de Gaia, la première chose à faire est de se mettre à jour par rapport à la branche master du dépôt original (remote upstream) : + + 
    cd chemin/dossier/gaia
+git checkout master
+git pull upstream master
    +
    2. +
  2. Maintenant, allez sur une nouvelle branche en faisant un « checkout », c'est sur cette branche que vous apporterez vos corrections : + 
    git checkout -b mon-correctif
    +
    3. +
  3. Enfin, allez dans votre répertoire gaia/apps et éditez les fichiers des applications.
    4. +
+ +

Exemple de modification simple du code

+ +

Pour voir les effets de vos modifications :

+ +
    +
  1. Réalisez vos changements souhaités dans le code de Gaia, et sauvegardez les.
    2. +
  2. Arrêtez Firefox ou le simulateur lancé dans WebIDE.
    3. +
  3. Reconstruisez le profil Gaia avec la commande make.
    4. +
  4. Démarrez Firefox ou le simulateur lancé dans WebIDE.
    5. +
+ +

Voyons cela en réalisant un simple changement de couleur de texte, de l'horloge dans l'écran de verrouillage :

+ +

Gaia lockscreen showing the clock display in white text

+ +
    +
  1. Une des meilleures méthodes pour trouver comment le style est défini est d'utiliser les outils de développement. Effectuez un « Ctrl droit + clic » sur l'horloge dans Firefox (pour ordinateur) puis sélectionnez Examiner l'élément dans le menu contextuel.
    2. +
  2. Vous pouvez alors déterminer quel fichier CSS est utilisé et doit être édité. Pour cet exemple, il s'agit de gaia/apps/system/lockscreen/style/lockscreen.css. Il suffit d'éditer les styles CSS dans la partie droite de l'affichage pour obtenir l'effet souhaité.
    3. +
  3. Une fois que vous êtes satisfait-e du résultat, vous pouvez directement éditer le fichier puis le sauvegarder.
    4. +
  4. Ensuite, rafraîchissez l'onglet (ou utiliser le bouton de réactualisation), le serveur HTTP servira instantanément les changements :
    5. +
+ +

Gaia lockscreen showing the clock display modified from white to red text
+
+
+ Les limitations de la simulation dans Firefox pour lancer Gaia :

+ + + +

Où trouver des bugs à corriger

+ +

La meilleure façon de trouver des bugs Firefox OS sur lesquels travailler est de consulter l'application de Josh Matthews : Bugs Ahoy. Cette application cherche directement parmi les bugs de la plate-forme Bugzilla de Mozilla et les affiche de façon simple et organisée. Une fois que vous avez identifié un bug sur lequel vous voulez travailler, rendez-vous sur la page Bugzilla pour ce bug (créez un compte si ce n'est pas déjà fait) puis assignez-vous pour le bug dans le champ « assigned to ». Une fois que c'est fait, vous pouvez commencer à travailler avec les outils vus ci-avant.

+ +

Aide et astuces

+ + + +

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

+ +

Voir aussi

+ + diff --git "a/files/fr/archive/b2g_os/developing_gaia/bases_syst\303\250me_construction_gaia/index.html" "b/files/fr/archive/b2g_os/developing_gaia/bases_syst\303\250me_construction_gaia/index.html" new file mode 100644 index 0000000000..259c0a7747 --- /dev/null +++ "b/files/fr/archive/b2g_os/developing_gaia/bases_syst\303\250me_construction_gaia/index.html" @@ -0,0 +1,191 @@ +--- +title: Éléments de base sur le système de construction de Gaia +slug: Archive/B2G_OS/Developing_Gaia/Bases_système_construction_Gaia +tags: + - Build documentation + - Building + - Firefox OS + - Gaia + - Guide +translation_of: Archive/B2G_OS/Developing_Gaia/Build_System_Primer +--- +
+

Cet article illustrecomment fonctionne le système de construction (ou build) de Gaia. Cela inclue le fichier makefile, le processus de construction, les variables d'environnement et les éventuelles personnalisations.

+
+ +

Le travail le plus important durant les étapes de construction est effectué par les scripts contenus dans le sous-répertoire build/ de Gaia, qui sont exécutés grâce à make, node.js et XPCShell (aussi appelé JS Shell), qui est un environnement d'exécution de XULRunner. Le système de construction de Gaia contient plusieurs utilitaires pour aider à installer, tester, localiser et empaqueter les applications web sur un vrai appareil. Il permet également aux développer de personnaliser et d'adapter Gaia (par exemple en changeant le fond d'écran par défaut, les sonneries, les applications et les réglages).

+ +
+

Note : XPCShell est proche de node.js mais permet de lancer un langage de script de Mozilla proche de JavaScript. Il permet aux scripts de construction de Gaia d'être lancés dans une extension Firefox.

+
+ +

Le fichier makefile

+ +

Le fichier makefile est composé de plusieurs buts (goals). Cette section explique les buts les plus utiles.

+ +

install-gaia

+ +

Ce but enverra toutes les applications Gaia sur votre appareil. Si vous souhaitez n'envoyer qu'une application en particulier, vous devrez utiliser le drapeau (flag) APP comme suit :

+ +
APP=calendar make install-gaia
+ +

Ce répertoire doit être présent au sein d'un des répertoires de Gaia pour les applications (ex : apps).

+ +

reset-gaia

+ +

Ce but fonctionne de la même façon que install-gaia mais commence par purger puis remet les permissions par défaut après avoir installé toutes les applications. Les applications seront situées sous /data/local (comme lorsque Gaia est construit en mode engineering). Cela enverra également les tests et les applications de débogage.

+ +
+

Attention : Si vous utilisez la variable d'environnement APP avec reset-gaia, cela pourra fonctionner mais rendra l'appareil inutilisable (ce qui peut être résolu en lançant le même but sans la variable APP). À ne pas faire.

+
+ +

production

+ +

Ce but correspond à reset-gaia avec une optimisation du source code. Ce but permet généralement d'émuler les versions communiquées aux utilisateurs (user builds). Il enverra les mêmes applications qui sont installées pour les versions communiquées aux utilisateurs.

+ +
+

Attention : Si vous utilisez la variable d'environnement APP avec reset-gaia, cela pourra fonctionner mais rendra l'appareil inutilisable (ce qui peut être résolu en lançant le même but sans la variable APP). À ne pas faire.

+
+ +

reference-workloads

+ +

Ces buts envoient des volumes de données de différentes tailles sur l'appareil, aidant ainsi à déboguer et à corriger les problèmes de montées en charge. Ces buts gèrent la variable d'environnement APP ou une variable d'environnement APPS qui contient les noms d'applications séparées par des espaces :

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

Note : Pour plus d'informations, lire Bidouiller Gaia : les charges de données de référence.

+
+ +

Les variables d'environnement

+ +

Certaines variables d'environnement permettent de contrôler certains aspects de la construction et de l'installation sur l'appareil. Par exemple :

+ +

P=1

+ +

Celà active la compilation en parallèle dans le but de tirer avantage des processeurs multi-coeurs, et d'accélérer le temps nécessaire à une compilation. La valeur par défaut est 0.

+ +
+

Attention: La compilation en parallèle est une fonctionnalité expérimentale qui peut se révéler instable.

+
+ +

GAIA_OPTIMIZE=1

+ +

Cela déclenche une passe d'optimisation des fichiers JavaScript. Cette optimisation a lieu de façon automatique lorsqu'on utilise make production. Cela peut également être utilisé pour install-gaia ou reset-gaia.

+ +

PRODUCTION=1

+ +

Cette variable est un alias pour make production.

+ +

DEBUG=1

+ +

Cette variable vous permet de générer un profil de débogage à utilliser pour les tests unitaires de Gaia ou lorsque vous développer votre application Firefox OS dans Firefox. Vous devez supprimer le profil existant avant d'essayer d'en générer un nouveau.

+ +

DEVICE_DEBUG=1

+ +

Cette variable désactive l'écran de vérouillage de l'appareil.

+ +

GAIA_DEVICE_TYPE=phone

+ +

Cette variable vous permet de construire différemment en fonction du type d'appareil avec une 'app.list' différente. Tous les fichiers 'app.list' sont situés sous les dossiers /build/config/$(GAIA_DEVICE_TYPE)/ .

+ +

Par défaut, la valeur de GAIA_DEVICE_TYPE est phone (pour un téléphone).

+ +
+

Note : Pour plus de détails et d'options, voir le guide Bidouiller Gaia : options de make.

+
+ +

Processus de construction

+ +

Voici un diagramme de séquence de la construction de Gaia :

+ +

+ +

pre-app.js, app.js et post-app.js seront exécutés par le Makefile les tâches de constructions ont, pour la plupart, lieu dans des scrips xpchsell, le fichier Makefile est utilisé pour détecter le système d'exploitation et pour télécharger b2g-desktop. Pour la suite, il est prévu qu'il y ait des tâches qui soient exécutées par des scripts xpcshell plutôt que par le Makefile.

+ +

Si vous vous demandez pourquoi il y a les scripts pre-app, app et post-app : c'est parce que nous migrons des dépendances du Makefile vers les scripts xpcshell. C'est pourquoi nous avons créé  pre-app.js et post-app.js pour le bug 1021051 afin de déplacer la plupart des dépendances sur les scripts xpcshell. Au final, app.js, pre-app.js et post-app.js seront fusionnés avec le bug 1053703.

+ +

Il existe trois types de répertoires utilisés pour le système de construction de Gaia :

+ +
    +
  1. les répertoires sources : apps, dev_apps qui sont des répertoires partagés
    2. +
  2. le répertoire d'étape (stage directory) : build_stage
    3. +
  3. les répertoires de profil : profile, profile-debug ou profile-test
    4. +
+ +

Notre objectif est de ne générer aucun fichier dans les répertoires sources. Malheureusement, certains des modules génèrent des fichiers dans les répertoires sources, ce qu'il est prévu de corriger. Voici un tableau qui illustre quels modules génèrent des fichiers dans les dossiers sources, le dossier d'étape et/ou les dossiers de profil :

+ +

+ +

Voici les règles exécutées (et l'ordre dans lequel elles le sont) lorsque la construction est lancée depuis le répertoire de Gaia :

+ +
    +
  1. b2g_sdk : b2g-desktop est utilisé pour lancer les scripts xpcshell contenus dans GAIA_DIR/build/.
    2. +
  2. svoperapps : on télécharge les applcations et on génère les fichiers de configuration pour l'installation des applications, par opérateur téléphonie et par pays.
    3. +
  3. webapp-manifests : on génère des méta-données sur les applications web pour le processus de construction.
    4. +
  4. keyboard-layouts : on génère l'agencement par défaut du clavier.
    5. +
  5. settings.json (settings.js): ce fichier JavaScript génère les paramètres par défaut pour Firefox OS, qui sont lus par Gaia.
    6. +
  6. webapp-shared : on copie les fichiers des répertoires partagés qui sont utilisés pour chaque application vers le répertoire d'étape.
    7. +
  7. preferences : on génère les réglages utilisateurs par défaut pour Firefox OS ; cela génèrera un fichier user.js, l'enverra sur l'appareil afin qu'il soit lu par Gecko. Les valeurs peuvent être différentes en fonction des variables d'environnement (par exemple avec DEBUG=1).
    8. +
  8. app.js : les fichiers de construction du répertoire app sont exécutés s'ils existent. Pour chaque application, s'il n'y a pas de fichier Makefile pour l'application, le fichier Makefile de Gaia copiera le répertoire de l'application dans build_stage puis exécutera [app-directory]/build/build.js s'il existe. VoirScript de construction pour les applications pour plus d'informations.
    9. +
  9. test-agent-bootstrap & test-agent-config : la préparation des agents de test est divisée en deux règles test-agent-config et test-agent-bootstrap-apps, ces règles permettent de paramétrer des environnements de test pour chaque application.
    10. +
  10. webapp-optimize : Ce script contient diverses procédures d'optimisation comme la minification du JavaScript, la concaténation des fichiers de localisation en fichiers JSON, la génération de fichiers HTML dans la langue par défaut (si nécessaire).
    11. +
  11. webapp-zip : On compresse chaque application dans un fichier zip distinct puis on les place dans le répertoire profile/.
    12. +
  12. optimize-clean : optimize-clean nettoie les fichiers HTML pour la langue par défaut.
    13. +
  13. contacts : Copie le fichier de contacts pré-chargé dans le profil, s'il existe dans GAIA_DISTRIBUTION_DIR.
    14. +
  14. extensions : Copie les extensions (contenues dans GAIA_DIR/tools/extensions) dans votre répertoire de profil. Suivant les configurations utilisées, vous pouvez définir quelles extensions sont copiées.
    15. +
  15. installed-extensions.json (additional-extensions.js) : Enfin, ce script télécharge certaines extensions supplémentaires dans votre répertoire de profil.
    16. +
+ +

Script de construction pour les applications

+ +

Par défaut, le script de construction de l'application [répertoire app]/build/build.js sera exécuté par app.js si le script de construction existe. Si $APP/build/build.js n'existe pas, app.js copiera l'application dans build_stage.

+ +

Les fichiers contenus dans le répertoire de l'application devrait être copiés dans le répertoire d'étape build_stage par le script de construction de l'application s'il existe. En effet, si le script existe, app.js ne copiera pas les fichiers. Par exemple, l'application du calendrier (calendar) possède un script build/build.js et fait appel à utils.copyToStage().

+ +
+

A noter: Pour les sources qui se trouvent en dehors de l'application (comme dans shared/), il faut les mettre dans un noeud commenté dans la section <head> de index.html, afin que ce soit copié de shared/ vers l'application.

+
+ +

Les scripts de constructions des applications peuvent requérir n'importe quel module construit dans $GAIA_DIR/build, en particulier le module utils qui est très utile pour la construction des applications. Vous pouvez ainsi utiliser require('utils') pour bénéficier du module.

+ +

+ +

Personnaliser les réglages utilisateurs

+ +

Si vous avez un ensemble de préférences utilisateur que vous utilisez à chaque fois que vous chargez (flashez) l'appareil, vous pouvez créer un fichier appelé custom-prefs.js dans le répertoire build/config et les stocker à cet emplacement. Cela évite que les préférences soient écrasées et en dehors du gestionnaire de versions (source control).

+ +

Voici quelques réglages utilisateurs qui peuvent être utiles :

+ +
// on permet à marionette de lancer les tests de performance
+// voir https://developer.mozilla.org/fr/docs/Mozilla/Firefox_OS/Platform/Testing/Gaia_performance_tests
+user_pref("marionette.defaultPrefs.enabled", true);
+
+// on définit le port à utiliser pour déboguer l'application à distance sur l'appareil
+user_pref("devtools.debugger.remote-port", 60000);
+
+// on active le débogueur à distance
+user_pref("devtools.debugger.remote-enabled", true);
+
+// on affiche les informations de debug sur le Radio Interface Layer dans logcat
+user_pref("ril.debugging.enabled", true);
+
+ +

Ce fichier est lu à chaque fois que vous générez un profil. La façon la plus certaine d'être sûr que tout soit généré est de commencer par supprimer votre profil :

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

Vous pouvez ensuite utiliser le but install-gaia sans danger.

+ +

FAQ

+ +

L'appareil reste  avec l'écran noir après avoir été flashé

+ +

Ceci peut parfois arriver si vous flashez l'appareil lorsqu'il est en veille. Pour régler le problème, il suffit de redémarrrer B2G en utilisant la ligne de commande suivante :

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


+  

diff --git a/files/fr/archive/b2g_os/developing_gaia/comprendre_les_fondements_de_gaia/index.html b/files/fr/archive/b2g_os/developing_gaia/comprendre_les_fondements_de_gaia/index.html new file mode 100644 index 0000000000..96f3026287 --- /dev/null +++ b/files/fr/archive/b2g_os/developing_gaia/comprendre_les_fondements_de_gaia/index.html @@ -0,0 +1,156 @@ +--- +title: Comprendre la structure du code de Gaia +slug: Archive/B2G_OS/Developing_Gaia/comprendre_les_fondements_de_Gaia +tags: + - Code + - Firefox OS + - Gaia + - Guide + - JavaScript + - contribution +translation_of: Archive/B2G_OS/Developing_Gaia/Understanding_the_Gaia_codebase +--- +
+

Avant d'apporter vos modifications au code de Gaia, vous devez d'abord comprendre les bases de sa structure et connaître les conventions de codage utilisées. Cet article couvre chacun de ces points.

+
+ +

Les branches de Gaia

+ +

Il y a plusieurs branches différentes qui organisent le code source de Gaia, et en fonction de la tâche que vous cherchez à accomplir (ou de l'appareil que vous avez), vous ne voudrez pas seulement charger, modifier et compiler la branche master. Vous trouverez ici, une rapide explication, des branches les plus couramment utilisées :

+ + + +

La structure du code source de Gaia

+ +

La section qui suit présente les parties les plus importantes du code source de Gaia.

+ +

apps/

+ +

Ce répertoire contient chacune des applications principales de Gaia, celles affichées sur l'écran d'accueil - comme le calendrier ou l'appareil photo - ainsi que celles sous-jacentes - comme celle du système, celle de l'écran d'accueil, ou celle du clavier.
+
+ Les applications peuvent fonctionner de façon légèrement différente, mais ont toutes un certain nombre de points communs :

+ + + +
+

Note : Vous pouvez trouver plus d'informations à propos du fonctionnement des applications dans notre guide des applications Gaia.

+
+ +

build/

+ +

Ce répertoire contient les scripts de construction (build).

+ +

dev_apps/

+ +

Ce répertoire contient les applications à inclure lors d'une construction faite sur mesure. Par exemple, vous pouvez ajouter des applications à cet emplacement pour produire des versions sur mesures qui contiennent ces applications.

+ +
+

Note : Pour plus d'informations sur la personnalisation de Gaia, lire le guide des personnalisations possibles (Market customizations).

+
+ +

keyboard/

+ +

Ce répertoire contient les dictionnaires et agencements des claviers en fonction des différentes langues.

+ +

locales/

+ +

Ce répertoire contient un fichier JSON, languages_all.json, qui définit les langues supportées dans Gaia. Pour plus d'informations sur la façon dont les applications sont localisées, lire l'article Comment localiser une application.

+ +

shared/

+ +

Ce répertoire contient diverses ressources utilisées par plusieurs applications. Les éléments les plus notables sont :

+ + + +

tools/

+ +

Ce répertoire contient les utilitaires nécessaires pour les scripts de construction (build) et les tests.

+ +

Les conventions de style utilisées pour le code de Gaia

+ +

Gaia suit les règles de style de Google pour le JavaScript (en anglais).

+ +

Informations générales sur les règles de code :

+ + + +

Règles spécifiques

+ +
    +
  1. Assurez-vous que vos fichiers HTML soient déclarés avec <!DOCTYPE html> (autrement dit, qu'ils soient des documents HTML5). Si vous n'utilisez pas cette information, les versions Internet Explorer 9 et supérieures chargeront le site/application en mode de compatibilité.
    2. +
  2. Incluez l'instruction "use strict"; (telle quelle, avec les doubles quotes) dans vos fichiers JavaScript afin qu'ils utilisent le mode strict.
    3. +
  3. Utilisez deux espaces pour l'indentation et non pas des tabulations.
    4. +
  4. Veuillez utilisez des sauts de ligne pour séparer les fragments logiques du code !
    5. +
  5. Les noms de fichiers composés de plusieurs termes doivent utiliser les tirets bas comme ceci mon_fichier_avec_plusieurs_mot.js.
    6. +
  6. Utilisez des quotes simples pour les chaînes de caractères (plutôt que des doubles quotes).
    7. +
  7. Utilisez des structures conditionnelles développées : + 
    Incorrect
+if (expression) faireQuelqueChose();
+
+Correct
+if (expression) {
+  faireQuelqueChose();
+}
    +
    8. +
  8. Si vous travaillez sur l'application System, vérifiez la liste de conseils spécifiques.
    9. +
+ +

Vérification du style de code à chaque commit

+ +

Gaia utilise JSHint pour vérifier le style de code JavaScript utilisé et ce avant chaque commit (via un « crochet » (hook en anglais) git). Une fois que vous avez soumis votre pull request sur le dépôt de Gaia. Le serveur Travis (l'intégration continue pour Github) lancera ce « linter » pour vérifier à nouveau que le style est correct.

+ +

Le script de pre-commit est présent dans gaia/tools/pre-commit et devrait être copié dans le répertoire .git/hooks du projet une fois que la commande make a été lancée.

+ +
+

Note : Auparavant, gjslint était utilisé pour cette vérification. Il a cependant été déprécié en faveur de jshint car celui-ci est plus strict et produit de meilleurs résultats. JSHint est utilisé depuis Firefox OS 1.4, et gjslint est uniquement recommandé pour les fichiers historiques qui n'ont pas encore été migrés vers JSHint.

+
+ +

Lancer le linting manuellement avec Gaia

+ +

Avant de soumettre un correctif, il est conseillé de lancer JSHint manuellement en local afin de vérifier que vous n'avez pas d'erreurs de style dans votre code.
+
+ Pour plus de détails sur JSHint dans Gaia, vous pouvez regarder le contenu du répertoire gaia/build/jshint. Gaia fournit un script de construction que vous pouvez utiliser :

+ +
$ make lint
+ +

pour lancer automatiquement les tests de gjslint et de JSHint. Vous pouvez également lancer uniquement :

+ +
$ make hint
+ +

pour ne lancer que les vérifications effectuées par JSHint.

+ +
$ make eslint
+ +

pour lancer uniquement la vérification de style eslint.

+ +
+

Note : Pour installer JSHint sur votre installation, sans Gaia, vous pouvez utiliser les commandes suivantes :

+ +
npm install jshint -g
+jshint mon_fichier.js
+
+ +

 

diff --git a/files/fr/archive/b2g_os/developing_gaia/different_ways_to_run_gaia/index.html b/files/fr/archive/b2g_os/developing_gaia/different_ways_to_run_gaia/index.html new file mode 100644 index 0000000000..3f30dd2285 --- /dev/null +++ b/files/fr/archive/b2g_os/developing_gaia/different_ways_to_run_gaia/index.html @@ -0,0 +1,230 @@ +--- +title: Différentes façons d'exécuter Gaia +slug: Archive/B2G_OS/Developing_Gaia/Different_ways_to_run_Gaia +tags: + - ADB + - Appareil + - Firefox + - Firefox OS + - Gaia + - Gaia+Gecko + - Mac OS X + - USB + - WebIDE + - bureau + - contribuer + - débogage + - exécuter Gaia + - nightly + - simulateur + - émulateur(2) +translation_of: Archive/B2G_OS/Developing_Gaia/Different_ways_to_run_Gaia +--- +

+ +
+

Vous pouvez exécuter Gaia dans un simulateur via WebIDE, dans Firefox Mulet (une version spéciale de Firefox pour ordinateur destinée au développement Gaia), dans un émulateur ou sur un appareil mobile compatible. Cet article fournit un résumé pour réaliser chacun de ces cas, avec des liens vers des informations complémentaires.

+
+ +
+

Note : Pour faire tourner Gaia sur ordinateur, la méthode actuellement recommandée consiste à utiliser Mulet (voir Utiliser Gaia dans Firefox Mulet, ci-dessous.)

+
+ +
+

Note : Parfois, vous serez confronté à des problèmes dûŝ à certaines de vos modifications qui nécessitent des paramètres de préférences actualisés etc. Si vous rencontrez ce genre de cas, essayez de regénérer votre profil pour voir si cela corrige le problème (lancez de nouveau la commande make).

+
+ +

À quel point cela est-il proche de la réalité ?

+ +

Certaines des solutions détaillées dans cet article pour exécuter Gaia sont plus proches que d'autres de l'expérience rencontrée avec un appareil réel. Dans l'ordre de facilité d'exécution :

+ +
    +
  1. Gaia dans un Simulateur via WebIDE
    2. +
  2. Gaia dans Firefox Mulet
    3. +
  3. Gaia dans un Émulateur
    4. +
  4. Gaia flashé sur un téléphone
    5. +
  5. Gaia+Gecko flashés sur un téléphone
    6. +
+ +

L'ordre de “À quel point cela est-il proche du produit commercialisé” est exactement l'opposé de cette liste. Selon la fonctionnalité sur laquelle vous travaillez, vous devrez trouver l'ennvironnement qui répond à la problématique posée.

+ +

Explication des options de make

+ +

Dans les sections ci-dessous sur WebIDE et Mulet, il vous est demandé de construire votre propre profil Gaia en utilisant la commande suivante :

+ +
DEBUG=1 DESKTOP=0 make
+ + + +

Cela va construire votre profil dans un répertoire nommé profile-debug.

+ +

Si vous souhaitez faire un test avec une version de production de Gaia pour davantage de réalisme, lancez seulement make pour construire votre profil. Celui-ci sera créé dans un répertoire nommé profile.

+ +
+

Note : Il existe tout un tas d'options make disponibles pour Gaia — voir la référence des options make de Gaia pour beaucoup plus de détails.

+
+ +

Utiliser Gaia dans un Simulateur via WebIDE

+ +

La méthode la plus rapide pour essayer Gaia est d'utiliser WebIDE, un outil développeur disponible dans Firefox pour ordinateur. Il apporte un certain nombre d'outils utiles pour vous aider à tester, déployer et déboguer des applications web HTML5 sur les téléphones Firefox OS et dans le Simulateur Firefox OS, directement à partir de votre navigateur.
+
+ Dans le navigateur pour ordinateur Firefox 34+, ouvrez WebIDE via le menu Outils > Développement web > WebIDE. Ouvrez le menu Environnement en haut à droite pour installer et démarrer un Simulateur.

+ +

Pour faire tourner votre propre profil Gaia personnalisé, le processus est un petit peu plus complexe, mais cela reste relativement simple :

+ +
    +
  1. Avant d'essayer de faire ça, il faut construire vous-même un profil d'appareil Gaia de debug — allez dans votre clone de dépôt Gaia puis lancez DEBUG=1 DESKTOP=0 make. Cela va générer dans votre répertoire gaia un dossier appelé profile-debug, contenant votre profil.  Avec ce type de profil, vous serez en mesure de déboguer les applications internes de Gaia dans WebIDE sans avoir à configurer autre chose, et vous n'aurez pas à accepter la boîte de dialogue pour confirmer le débogage distant dans le simulateur à chaque fois que vous le lancerez. Si vous voulez faire des tests avec une version de production plus réaliste, lancez la construction avec uniquement la commande make.
    2. +
  2. Ouvrez Firefox (Nightly est recommandé.)
    3. +
  3. Ouvrez WebIDE depuis Outils > Développement web > WebIDE.
    4. +
  4. Installez un Simulateur Firefox OS en allant dans Choisir un environnement > Installer un Simulateur dans WebIDE et en choisissant une option. Assurez-vous d'utiliser les mêmes versions de simulateur et du Gaia que vous faites tourner (ainsi par exemple, si votre branche Gaia est la 2.1, vous devrez utiliser le Simulateur Firefox OS 2.1.)
    5. +
  5. Dans le menu de droite, vous pouvez voir votre simulateur dans la liste. Cliquez sur le bouton options (engrenage) qui est juste à côté pour accéder à l' écran des Options du Simulateur.
    6. +
  6. Choisissez Profil > Personnaliser profil Gaia..., puis sélectionner le dossier de votre profil Gaia dans le sélecteur de fichiers.
    7. +
  7. Ouvrez ce simulateur dans WebIDE, et il devrait alors s'ouvrir avec votre profil Gaia en cours d'exécution.
    8. +
+ +
+

Note : Si la commande ne fonctionne pas (il est possible d'avoir un message affichant "A copy of B2G is already open. Only one copy of B2G can be open at a time." — alors qu'il n'est pas déjà ouvert), vérifiez alors que le répertoire de votre profil dispose bien des permissions de lecture/écriture, par exemple avec chmod.

+
+ +
+

Note : Si vous souhaitez réinitialiser votre simulateur pour qu'il ne fasse plus tourner de profil Gaia personnalisé, vous aurez besoin d'aller dans Firefox sur about:config ; cherchez la préférence extensions.fxos_2_2_simulator@mozilla.org.gaiaProfile  (2_2 peut être différent en fonction de la version du simulateur que vous avez personnalisée), double-cliquez dessus, supprimez la valeur dans la boîte de dialogue qui s'affiche puis cliquez sur OK.

+
+ +

Utiliser Gaia dans Firefox Mulet

+ +

Il est également possible d'exécuter Gaia dans une version spéciale de Firefox appelée Firefox Mulet. Cela donne l'avantage d'avoir un cycle de développement rapide, ainsi que des outils de développement web standards et des débogueurs pour travailler avec.

+ +
    +
  1. Tout d'abord, vous devez avoir cloné le dépôt Gaia sur votre machine (voir Lancer votre compilation de Gaia pour voir la meilleure façon de le faire si vous voulez contribuer au projet.) Mulet ne fonctionnant que sur Gaia 2.2 et au-dessus, il est une bonne idée d'utiliser la branche master.
    2. +
  2. Ensuite, placez-vous dans le dépôt Gaia avec cd et construisez votre propre profil (voir référence des options make pour les différents types disponibles) avec DEBUG=1 DESKTOP=0 make. Si vous voulez faire des tests en utilisant une version de production plus réaliste, utilisez seulement la commande make.
    3. +
  3. Vous pouvez à présent installer la dernière version de mulet dans gaia/firefox grâce à la commande make mulet. Il s'agit de la méthode la plus rapide pour l'installer. +
      +
    1. Si vous voulez avoir plus de contrôle sur l'endroit où installer mulet, vous devrez le télécharger vous-même — trouvez les builds Windows et Mac sur Mozilla Central, et regardez ici pour Linux. Les builds Mulet sont les paquets dont les noms commencent par firefox-*, par exemple firefox-36.0a1.en-US.mac64.dmg. Les builds Linux sont nommés target.linux-x86_64.tar.bz2 — choisissez la version appropriée à votre machine de développement.
      2. +
    2. Une fois le build Mulet téléchargé, installez-le en lieu sûr afin de ne pas écraser votre version de Firefox Nightly normale. Par exemple, sur Mac OS X, créez un nouveau dossier dans Applications appelé "mulet", et faîtes-le glisser dedans.
      3. +
    +
    4. +
  4. Lancez maintenant le build Mulet à partir de la ligne de commande, en lui passant votre profil Gaia comme profil à utiliser lors de l'ouverture (spécifié par l'option -profile.) Par exemple, vous pouvez lancer quelque chose de ce genre depuis l'intérieur de votre dossier Applications sur Mac OS X si vous l'avez installé là : + 
    ./firefox/Contents/MacOS/firefox-bin -no-remote -profile /Users/my-home-folder/git/gaia/profile-debug/
    +
    5. +
+ +

Le build Mulet résultant devrait apparaître, comme ceci :

+ +

+ +
+

Note : Si la commande ne fonctionne pas (il est possible d'obtenir un message disant "A copy of Firefox is already open. Only one copy of Firefox can be open at a time." — alors qu'il n'est pas déjà ouvert), alors vérifiez que vous avez le droit de lancer l'exécutable firefox comme ça — vous pouvez lancer la commande ci-dessus en plaçant sudo devant, bien qu'une meilleure solution, plus sûre,consiste à faire un chmod sur votre dossier d'installation.

+
+ +
+

Note : Les nouvelles versions de Gaia ont parfois besoin d'une version de mulet plus récente ; pour faire la mise à jour vers la dernière version de mulet, vous pouvez lancer la commande rm -rf firefox && make mulet dans le répertoire gaia/.

+
+ +

Sur cet affichage, vous avez de disponible la boîte à outils standard de Firefox afin de déboguer vos applications Gaia, plus un émulateur Firefox OS fonctionnant dans la partie gauche, ainsi qu'un certain nombre d'autres outils utiles à l'environnement Gaia. Les contrôles au-dessus de l'émulateur vous permettent de :

+ + + +

Flasher Gaia sur un véritable appareil

+ +
+

Important : Si vous tentez de flasher Gaia sur un appareil doté de peu de mémoire, comme un Tarako ou un Spice Fire One, vous devez le flasher avec une branche de Gaia spéciale optimisée pour les faibles quantités de mémoire, comme la branche 1.3t. Essayer de flasher un tel appareil avec la branche principale de Gaia va probablement avoir pour résultat de rendre le téléphone inopérant.

+
+ +

Pour flasher une nouvelle version de Gaia sur un vrai appareil :

+ +
    +
  1. Assurez-vous d'abord d'avoir cloné le dépôt Gaia sur votre ordinateur et d'avoir installé ADB.
    2. +
  2. Vérifiez d'avoir activé le Débogage via USB.
    3. +
  3. Branchez votre appareil sur votre ordinateur en USB.
    4. +
  4. S'il y a un appareil détecté, vous pouvez procéder aux commandes suivantes. Sinon, vous (utilisateur de Windows ou de distribution Linux) pouvez avoir à vérifier la page des Pilotes OEM USB pour correctement configurer le pilote USB de votre ordinateur.
    5. +
  5. Pour de véritables appareils, lancez adb en tant qu'utilisateur root en utilisant la commande suivante : + 
    $ adb root
    +
    6. +
  6. Lancez la commande suivante à l'intérieur du dépôt Gaia pour réinitialiser votre téléphone et mettre à jour votre code source de Gaia : + 
    $ make reset-gaia
    +
    7. +
  7. Pour tester des applications non-systèmes, vous pouvez les installer sans redémarrer l'appareil grâce à la commande suivante : + 
    $ make install-gaia
    +
    8. +
  8. Si vous souhaitez installer une application spécifique unique, vous pouvez la passer via la variable APP comme ceci : + 
    $ make install-gaia APP=browser
    +
    9. +
+ +
+

Note : Envoyer Gaia sur votre appareil en utilisant make install-gaia / make reset-gaia construit Gaia avec une définition de résolution 1x par défaut. Pour spécifier une résolution supérieure, vous devez utiliser les options de make GAIA_DEV_PIXELS_PER_PX ou GAIA_DPPX  (voir Ressources images en haute résolution pour davantage d'informations sur ces options.) Lors de l'envoi de Gaia sur votre appareil de cette façon, vous devez indiquer les options de make correspondantes au facteur d'échelle de votre appareil ; donc par exemple make install-gaia GAIA_DEV_PIXELS_PER_PX=1.5 pour un appareil Flame (ou 2, ou 2.5, etc ; voir les valeurs de facteur d'échelle du tableau situé dans 512 icônes pour l'affichage.)

+
+ +

Pour vérifier que votre appareil est correctement branché en USB, vous pouvez taper :

+ +
$ adb devices
+ +

Vous devriez obtenir un résultat de ce genre :

+ +
List of devices attached
+emulator-5554  device
+ +

Construire Gecko et Gaia et les utiliser dans un émulateur ou sur un véritable appareil

+ +

Si vous disposez d'un appareil mobile compatible, vous pouvez construire et installer votre propre version de Firefox OS et ensuite l'exécuter sur un Émulateur ou la placer sur votre appareil.

diff --git "a/files/fr/archive/b2g_os/developing_gaia/ex\303\251cuter_des_versions_personnalis\303\251es_dans_webide/index.html" "b/files/fr/archive/b2g_os/developing_gaia/ex\303\251cuter_des_versions_personnalis\303\251es_dans_webide/index.html" new file mode 100644 index 0000000000..2203855c7a --- /dev/null +++ "b/files/fr/archive/b2g_os/developing_gaia/ex\303\251cuter_des_versions_personnalis\303\251es_dans_webide/index.html" @@ -0,0 +1,89 @@ +--- +title: Exécuter des versions personnalisées de Firefox OS/Gaia dans WebIDE +slug: >- + Archive/B2G_OS/Developing_Gaia/Exécuter_des_versions_personnalisées_dans_WebIDE +tags: + - Apps + - B2G Bureau + - Firefox OS + - Gaia + - WebIDE + - débogage +translation_of: Archive/B2G_OS/Developing_Gaia/Running_custom_builds_in_WebIDE +--- +
+

Fin février 2014, le Simulateur Firefox OS a été doté d'une fonctionnalité pour lui permettre d'exécuter un binaire B2G personnalisé et/ou un profil Gaia de votre choix. Cet article montre comment configurer votre jeu d'outils pour faire cela, exécuter le Simulateur via WebIDE.

+
+ +

Prérequis

+ +

Tout d'abord, réunissons les outils dont nous avons besoin pour exécuter nos versions personnalisées dans le Simulateur.

+ +
    +
  1. Installez Firefox, et vérifiez que WebIDE soit disponible (Outils > Développement web > WebIDE.)
    2. +
  2. Installez le simulateur B2G Desktop le plus récent, ou construisez le vôtre.
    3. +
  3. Installez l'extension Firefox OS Simulator la plus récente, version 7.0pre7.20140113 ou plus.
    4. +
  4. Construisez un profil Gaia avec le flag SIMULATOR=1.  Par exemple, vous pouvez lancer la commande make SIMULATOR=1 PROFILE_FOLDER=profile-b2g profile-b2g depuis votre répertoire Gaia pour réaliser cette opération (voir Développer pour Gaia pour plus de détails.)
    5. +
+ +

Configuration de votre simulateur

+ +

Vous devez à présent effectuer certains paramétrages afin que le simulateur puisse trouver vos Bureau B2G et Gaia personnalisés.

+ +

Avant Firefox 42

+ +
    +
  1. Ouvrez l'onglet de gestion des modules (Outils > Modules complémentaires, ou saisir about:addons dans la barre d'URL.)
    2. +
  2. Sur la liste d'onglets, cliquez sur Extensions pour lister vos extensions installées.
    3. +
  3. Cherchez la nouvelle extension Firefox OS simulator dans la liste. Elle devrait s'appeler quelque chose comme Firefox OS 1.3 Simulator 7.0pre.7.20140113.
    4. +
  4. Cliquez sur le bouton Préférences situé dans l'entrée de la liste correspondant à l'extension du simulateur.
    + the Firefox OS simulator preferences: Preferences, disable and remove.
    5. +
  5. Vous pourrez décider d'utiliser un exécutable personnalisé — la dernière version de B2G Desktop — pour faire tourner Firefox OS dans WebIDE. Cliquez sur le bouton Parcourir... juste après l'étiquette Select a custom runtime executable puis sélectionner votre exécutable B2G Desktop dans le sélecteur de fichiers. Alors que cela sera évident sous Windows/Linux,  sur Mac, il faudra le rechercher dans /Applications/B2G.app/Contents/MacOS/b2g, à condition que vous l'ayez installé dans le répertoire Applications. Reportez-vous à Construire votre binaire b2g personnalisé si vous souhaitez tester des patchs sur mozilla-central.
    6. +
  6. Vous pouvez également lancer votre profil Gaia personnalisé dans WebIDE : Cliquez sur le bouton Parcourir... après l'étiquette Select a custom Gaia profile directory et sélectionnez le répertoire de votre profil personnalisé (cela devrait être gaia/profile-b2g.)
    7. +
  7. Si vous avez besoin de revenir au simulateur non personnalisé, vous devrez réinitialiser une valeur de configuration. Le fait de simplement supprimer et réinstaller l'extension du simulateur ne fonctionnera pas. Ouvrez un nouvel onglet et tapez "about:config" dans la barre d'adresse. Dans le champ Rechercher de cette page, entrez "fxos" ou "simulator" et cherchez quelque chose qui ressemble à "extensions.fxos_2_0_simulator@mozilla.org.customRuntime" ou "extensions.fxos_2_0_simulator@mozilla.org.gaiaProfile". Faites un clic droit et choisissez "Réinitialiser". Redémarrer à présent le simulateur et vous devriez avoir récupéré la version non personnalisée.
    8. +
+ +

À partir de Firefox 42

+ +

Depuis Firefox 42, vous pouvez configurer le binaire B2G et le profil avec l'écran "Options du Simulateur" dans WebIDE.

+ +

 

+ +

Utilisation de votre simulateur configuré

+ +

Enfin, allons-y et utilisons notre simulateur personnalisé.

+ +
    +
  1. Ouvrez WebIDE (Outils > Développemet web > WebIDE) ; vous pouvez également presser Shift-F8.
    2. +
  2. Ouvrez le menu Environnement en cliquant sur le bouton en haut à droite.
    3. +
  3. Cliquez sur le bouton Firefox OS 1.3 (ou toute autre dernière version que vous avez installée). Cela devrait être la bonne option, même si vos versions de B2G desktop/Gaia sont plus récentes.
    4. +
  4. Le simulateur va maintenant démarrer ; B2G Desktop devrait se charger et exécuter vos versions B2G nocturne et Gaia personnalisées !
    5. +
+ +

a screenshot of the b2g desktop simulator

+ +

 

+ +

Construire un binaire b2g personnalisé

+ +

Il s'agit d'une étape facultative, utile si vous devez tester un patch à appliquer sur le codebase de mozilla-central.

+ +
+

Note : s'il vous est possible de soumettre des Try builds, elles généreront des extensions simulateur dans les répertoires de compilation de chaque plate-forme de B2G Desktop ; cela peut donc constituer un moyen plus simple de créer un simulateur qui utilise une plate-forme personnalisée ou des modifications de Gaia dans certains cas d'utilisation.

+
+ +
    +
  1. Faites un checkout de mozilla-central.
    2. +
  2. Appliquez le(s) patch(s) que vous voulez tester.
    3. +
  3. Vérifiez la présence des lignes suivantes dans votre mozconfig :
    + ac_add_options --enable-application=b2g
    + FXOS_SIMULATOR=1
    + GAIADIR=/home/alex/gaia    # Mandatory to set FXOS_SIMULATOR flag, it will ensure having a working xpi file
    + MOZTTDIR=/path/to/moztt   # Optional, to get the device fonts
    4. +
  4. +

    Exécutez ./mach build && ./mach package

    +
    5. +
  5. +

    Si vous avez indiqué GAIADIR, vous obtiendrez une extension xpi du simulateur dans votre obdir, à l'intérieur du dossier dist.

    +
    6. +
diff --git a/files/fr/archive/b2g_os/developing_gaia/faire_fonctionner_code_gaia/index.html b/files/fr/archive/b2g_os/developing_gaia/faire_fonctionner_code_gaia/index.html new file mode 100644 index 0000000000..e5ca34e6ce --- /dev/null +++ b/files/fr/archive/b2g_os/developing_gaia/faire_fonctionner_code_gaia/index.html @@ -0,0 +1,69 @@ +--- +title: Faire fonctionner le code de Gaia +slug: Archive/B2G_OS/Developing_Gaia/Faire_fonctionner_code_Gaia +tags: + - B2G + - Contributing + - Firefox + - Firefox OS + - Gaia + - running firefox os locally +translation_of: Archive/B2G_OS/Developing_Gaia/Running_the_Gaia_codebase +--- +
+

Cet article décrit les étapes nécessaires au lancement de Gaia en local. Il liste également les outils pouvant être utilisés.

+
+ +

Pour commencer, il est nécessaire de préciser qu'il n'est pas nécessaire de construire Gecko ou B2G pour contribuer à Gaia. Les seuls éléments obligatoires sont d'avoir téléchargé le code source de Gaia, de pouvoir le lancer et de pouvoir l'éditer.
+
+ Voici les différentes façons dont vous pouvez lancer Gaia :

+ + + +

Vous trouverez des informations plus précises sur ces méthodes sur la page concernant les différentes façons de lancer Gaia. Sur cette page, vous trouverez également des liens vers plus d'informations. En général, les différentes méthodes sont ordonnées de la plus complexe (mais la plus réaliste) à la plus simple (mais moins réaliste).

+ +

Dans cet article, nous verrons surtout comment lancer Gaia dans Firefox Mulet ou le WebIDE — pour la plupart des changements que vous souhaiterez apporter au code de Gaia, ce sera la méthode la plus rapide. En revanche, certaines fonctionnalités ne seront pas supportées (comme certaines API matérielles ainsi que les interactions avec les composants matériels du téléphone) et pour celles-ci, vous aurez besoin d'un vrai appareil.

+ +
+

Note : Pour recevoir plus d'aide sur Gaia, n'hésitez pas à vous rendre sur le canal IRC #gaia (voir Mozilla IRC pour plus d'informations) ainsi que sur la liste de diffusion dev-gaia.

+
+ +

Lancer votre compilation de Gaia

+ +
    +
  1. Tout d'abord, faites un fork du dépôt principal de Gaia sur Github.
    2. +
  2. Ensuite, clônez votre fork en local : + 
    git clone https://github.com/your-username/gaia.git
    +
    3. +
  3. Ajoutez une remote upstream comme ceci : + 
    cd gaia
+git remote add upstream https://github.com/mozilla-b2g/gaia
    +
    4. +
  4. Vous devez maintenant créer un profil de débogage  de Gaia. Lancez la commande make dans le répertoire de votre dépôt pour créer un profil dans le dossier profile (qui est réglé pour permettre un meilleur débogage). Il créera des versions hébergées (non empaquetées) des applications Gaia, qui pourront être servies directement via le serveur local HTTPD contenu dans une extension Firefox . Ainsi, quand vous effectuez un changement, il suffit juste de rafraîchir la fenêtre du navigateur pour voir le résultat (plutôt que d'avoir à reconstruire le profil, de l'envoyer à l'appareil, etc...). Cette méthode est vraiment pratique pour bidouiller rapidement du CSS/JS/HTML.
    5. +
  5. Une fois votre profil de débogage construit, vous pouvez le lancer dans Mulet ou WebIDE, en suivant les instructions de ces liens.
    6. +
+ +

Dépannage et problèmes connus

+ +

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

+ +

Avec certaines distributions Linux (ex : Archlinux), la version de python par défaut est python3. Cela fait planter npm en lançant certaines commandes commands (ex : en lançant les tests). Pour résoudre cela une fois pour toute, vous pouvez lancer la commande suivante :

+ +
npm config set python python2
+ +

Vous pouvez jeter un œil à cette page Stack Overflow pour d'autres solutions.

+ +

Vous pouvez maintenant supprimer votre répertoire node_modules et lancer une nouvelle fois la commande ayant échoué.

+ +

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

+ +

Vous pouvez rencontrer cette erreur, alors que vous êtes certain d'avoir bien installé nodejs. Il est probable que vous utilisiez Debian ou une distribution basée sur Debian comme Ubuntu. Sur ces distributions, NodeJS est contenu dans le package nodejs, et vous devez installer le package nodejs-legacy pour que tout se déroule correctement :

+ +
sudo aptitude install nodejs-legacy
+ +

Si vous rencontrer des problèmes pour installer ce package, c'est surement que vous utilisez Le PPA pour NODE de Chris Lea; veillez à le supprimer avant de continuer.

diff --git a/files/fr/archive/b2g_os/developing_gaia/gaia_tools_reference/index.html b/files/fr/archive/b2g_os/developing_gaia/gaia_tools_reference/index.html new file mode 100644 index 0000000000..395f614579 --- /dev/null +++ b/files/fr/archive/b2g_os/developing_gaia/gaia_tools_reference/index.html @@ -0,0 +1,191 @@ +--- +title: Référence des outils pour Gaia +slug: Archive/B2G_OS/Developing_Gaia/Gaia_tools_reference +tags: + - Firefox OS + - Gaia + - Outils + - Reference + - Référence(2) +translation_of: Archive/B2G_OS/Developing_Gaia/Gaia_tools_reference +--- +

+ +
+

Cet article recense quelques outils pratiques pour travailler avec Gaia.

+
+ +
+

Remarque : Des trucs et astuces très utiles pour le débogage de Firefox OS sont disponibles sur la page B2G QA Tips and tricks (en anglais).

+
+ +

MozITP

+ +

MozITP est un paquet tout-en-un regroupant des outils dédiés à Gaia. Il contient un outil de flashage (b2g_util), b2g-installer et un environnement de Test d'Intégration Gaia préconfigurés. Vous pouvez utiliser MozITP pour essayer les Tests d'Intégration Gaia sur Mulet, un émulateur ou sur de véritables appareils. Vous pouvez également flasher des builds à partir de TaskCluster ainsi que des builds sans blobs avec b2g-installer.

+ +

Foxbox

+ +

Foxbox est un script automatique de construction qui génère un environnement de développement Gaia complet. Cet environnement comprend une version de Gaia hébergée dans une VM, laquelle est également accessible depuis la machine hôte (ce qui signifie que vous pouvez toujours travailler avec pour utiliser votre éditeur de texte préféré, etc.) Cela fonctionne sur toutes les plates-formes, mais devrait surtout être pratique pour les utilisateurs de Windows car la procédure de compilation de Gaia ne fonctionne pas sur un environnement Windows standard.

+ +

Outils de sauvegarde/restauration/flashage

+ +

Outils pour sauvegarder votre profil, etc.

+ +

b2g_util

+ +

Le paquet d'outils b2g_util fournit un ensemble d'outils pour vous aider avec le débogage de Firefox OS. Ce paquet permet de :

+ + + +

Pour l'installer, vous avez besoin au préalable de Python 2.7, pip, et setuptools. Vous pouvez ensuite lancer :

+ +
sudo pip install -U b2g_util
+ +

Une fois l'installation terminée, vous pouvez connecter votre appareil et faire un test en exécutant la commande suivante pour obtenir la version de b2g installée :

+ +
b2g_check_versions
+ +

pc-sync-tool

+ +

pc-sync-tool est une application disponible sur le Marketplace Firefox. Elle permet de sauvegarder vos données/profils. Elle s'utilise conjointement avec l'extension Firefox OS assistant pour ordinateur.

+ +

Sauvegarde et restauration de profil

+ +

Pour sauvegarder et restaurer les données, vous pouvez utiliser notre outil  backup_restore_profile.py, présent dans le dépôt Git B2G-flash-tool.

+ +
    +
  1. Cloner le dépôt précité (git clone https://github.com/Mozilla-TWQA/B2G-flash-tool.)
    2. +
  2. S'assurer que le téléphone est branché à l'ordinateur en USB, et que ADB (voir Important steps to follow first ci-dessus) et Debugging via USB (dans les Paramètres développeurs de votre appareil) sont activés.
    3. +
  3. cd dans le répertoire cloné
    4. +
+ +

Pour sauvegarder les données :

+ +
python backup_restore_profile.py -b
+ +

Cela devrait enregistrer le profil de votre appareil dans un répertoire appelé mozilla-profile, situé dans le même répertoire que le script. Pour restaurer votre sauvegarde :

+ +
python backup_restore_profile.py -r
+ +
+

Remarqe : Pour afficher la liste complète des options de l'outil, exécutez-le avec l'argument -h ou --help.

+
+ +

B2G-flash-tool

+ +

Le dépôt B2G-flash-tool contient également plusieurs autres outils pour flasher rapidement de nouvelles versions sur les appareils et effectuer d'autres tâches similaires — idéal pour le contrôle qualité. Par exemple :

+ + + +

Outils de débogage

+ +

Outils pour effectuer des tâches de débogage.

+ +

WebIDE

+ +

L'outil WebIDE de Firefox mérite une mention spéciale ici — alors qu'il permet de tester et déboguer des applications, il se révèle également utile pour surveiller les performances, l'utilisation de la mémoire, etc. (voir Monitoring performance.)

+ +

get_crashreports.sh

+ +

Présent dans le dépôt B2G-flash-tool, get_crashreports.sh récupère les rapports de plantage de l'appareil (/data/b2g/mozilla/Crash Reports/.)

+ +

Outils du répertoire racine de B2G

+ +

Un certain nombre de scripts présents dans le répertoire racine de B2G permettent d'effectuer diverses opérations utiles de débogage, parmi lesquels :

+ + + +

Outils divers

+ +

D'autres outils utiles se trouvent dans le répertoire gaia/tools/ et dans d'autres endroits

+ +

png_recompress.sh

+ +

Situé dans gaia/tools/, png_recompress.sh est un outil de compression d'images PNG. Vous pouvez le lancer avec une commande de la forme suivante :

+ +
$ ./tools/png_recompress.sh -v bg.png
+ +

Cela supprimera les méta-données inutiles et compressera davantage le png ; il peut économiser jusqu'à 99,5% sur la taille du fichier, ce qui aura un impact vraiment significatif sur la taille du ZIP de l'application ainsi que sur l'empreinte mémoire.

+ +

svg_recompress.sh

+ +

Situé dans gaia/tools/, svg_recompress.sh est un outil de compression SVG.

+ +

cache_sync.py

+ +

Situé dans gaia/tools/, cache_sync.py synchronise le cache hors-ligne d'une application externe avec une structure arborescente locale. Il faut le lancer depuis le répertoire de base d'une application située dans gaia/external-apps. Il construit un répertoire pour chaque origine connue du cache hors-ligne.

+ +

edit_prefs.sh

+ +

Situé dans le répertoire racine de B2G, edit_prefs.sh offre une méthode simple pour récupérer les préférences d'un appareil.

+ +

 

diff --git "a/files/fr/archive/b2g_os/developing_gaia/guide_version_personnalis\303\251e_gaia/index.html" "b/files/fr/archive/b2g_os/developing_gaia/guide_version_personnalis\303\251e_gaia/index.html" new file mode 100644 index 0000000000..a6e6ad438c --- /dev/null +++ "b/files/fr/archive/b2g_os/developing_gaia/guide_version_personnalis\303\251e_gaia/index.html" @@ -0,0 +1,1311 @@ +--- +title: Guide pour créer une version personnalisée de Gaia +slug: Archive/B2G_OS/Developing_Gaia/Guide_version_personnalisée_Gaia +tags: + - Customization + - Firefox OS + - Gaia + - Marketplace + - build +translation_of: Archive/B2G_OS/Developing_Gaia/Market_customizations_guide +--- +
+

Il est possible de créer une version personnalisée (par exemple, choisir les applications intégrées dans la version) sans modifier le cœur du dépôt de Gaia. Vous pouvez ajouter vos éléments de personnalisation dans des dossiers distincts ou bien utiliser les répertoires existants dans le code originale. Les options de construction (build) permettent de spécifier les éléments à personnaliser. Cet article expliquera en détail comment créer et utiliser ces éléments de personnalisation.

+
+ +

Aperçu

+ +

Depuis la version 1.0.1, Firefox OS utilise le même mécanisme pour apporter les personnalisations. Toutes les fonctionnalités illustrées dans cet article fonctionnent pour Firefox OS 1.0.1 sauf mention contraire.
+
+ Une version entièrement personnalisée de Gaia fait partie du dépôt Gaia : vous pouvez explorer les différents aspects de personnalisation sur cette version et/ou suivre cet article.

+ +
+

Note : Merci d'envoyer une pull request sur le dépôt Github de Gaia pour toute suggestion permettant d'améliorer cet exemple, ou si vous trouvez des éléments de cet article qui ne sont pas exploités dans ce code.

+
+ +

Voici l'arborescence de l'exemple de personnalisation :

+ +
  customize-sample
+  ├── power
+  │   ├── carrier_power_on.png
+  │   └── carrier_power_off.png
+  ├── ringtones
+  │   ├── list.json
+  │   └── ringer_dream_theme.ogg
+  ├── wallpapers
+  │   ├── customize.png
+  │   └── list.json
+  ├── browser.json
+  ├── calendar.json
+  ├── contacts.json
+  ├── costcontrol.json
+  ├── device-features.json
+  ├── eu-roaming.json
+  ├── homescreens.json
+  ├── network.json
+  ├── settings.json
+  ├── sms-blacklist.json
+  ├── support.json
+  ├── wapuaprof.json
+  └── apps.list
+ +
+

Note : Chacun des fichiers est optionnel. Si vous ne fournissez pas un de ces fichiers, le fichier par défaut sera pris en compte.

+
+ +

Chacune de ces personnalisations sera discutée dans la suite. Le paragraphe suivant, quant à lui, explique comment appliquer ces éléments de personnalisation à Gaia.

+ +

Les étapes pour appliquer la personnalisation

+ +

Pour appliquer l'exemple de personnalisation à Gaia, il faut :

+ +
    +
  1. Clôner le dépôt de Gaia depuis https://github.com/mozilla-b2g/gaia.
    2. +
  2. Copier le répertoire gaia/customization/ dans un autre répertoire pour y apporter vos propres adaptations ou bien éditer directement le contenu du répertoire gaia/customization/. Le chemin du répertoire en question sera évoqué par  <DISTRIBUTION_PATH> dans la suite. À chaque exemple, assurez-vous de bien remplacer la variable dans les commandes.
    3. +
  3. Effectuez les changements que vous souhaitez.
    4. +
  4. Connectez un appareil Firefox OS à votre ordinateur par USB, vérifiez que celui-ci est bien reconnu par ADB.
    5. +
  5. Construisez Gaia en spécifiant l'emplacement du répertoire de personnalisation en utilisant la variable d'environnement GAIA_DISTRIBUTION_DIR avec : + 
    make production GAIA_DISTRIBUTION_DIR=<DISTRIBUTION_PATH>
    +
    6. +
  6. Vous devriez désormais disposez d'une version personnalisée de Gaia sur votre appareil Firefox OS.
    7. +
+ +

Si vous copiez le contenu du répertoire de personnalisation dans gaia/distribution/, vous pouvez lancer la commande make sans la variable d'environnement :

+ +
make production
+ +
+

Note : Certaines personnalisations ont lieu lors de l'exécution des scripts de construction. Voir la référence des options de make pour les éléments de personnalisation liés aux scripts de construction.

+
+ +
+

Note : Les éléments de personnalisation concernant la carte SIM sont inclus lors de la construction. Par contre, ils sont appliqués lors de la phase de première utilisation (FTU pour First Time Usage en anglais).

+
+ +

Les personnalisations appliquées lors de la construction

+ +

Dans la suite du paragraphe, les différentes options de l'exemple seront illustrées.

+ +

power/

+ +

Les animations (ou les images fixes) pour les écrans d'allumage/extinction de l'appareil sont à insérer ici. Les fichiers peuvent être des animations MP4 ou des images PNG.

+ +

Les noms de fichiers acceptés sont :

+ + + +

(carrier_power_on.[png/mp4] sera utilisé lors de l'allumage, carrier_power_off.[png/mp4] sera utilisé lors de l'extinction)

+ +

ringtones/

+ +

Les sonneries personnalisées peuvent être placées ici. Le fichier list.json doit contenir les noms des fichiers des différentes sonneries, dans le format suivant :

+ +
  {
+    "ringer_classic_courier.opus": "",
+    "ringer_dream_theme.ogg": "",
+    "ringer_loud_windchimes.opus": "",
+    "ringer_bitbounce.opus": ""
+  }
+ +

Les sonneries personnalisées peuvent être choisies dans les réglages de Firefox OS via Son > Sonnerie. La sonnerie par défaut doit être définie dans settings.json, avec une DataURI. Vous pouvez utiliser la commande datauri pour créer l'URI qui est disponible via Node.js/npm:

+ +
    +
  1. Installer l'utilitaire avec la commande npm install datauri -g
    2. +
  2. Convertir le fichier en DataURI avec datauri <FILE>.
    3. +
+ +

wallpapers/

+ +

Les fonds d'écran par défaut (fichiers PNG) peuvent être placés dans ce dossier et lister dans le fichier list.json. Ils pourront être sélectionné dans les réglages de Firefox OS via Affichage > Fond d'écran.

+ +

Le fond d'écran par défaut peut être défini dans le fichier settings.json grâce à la ligne suivante :

+ +
"wallpaper.image": "emplacement de l'image"
+ +
+

Note : L'image peut être définie grâce à un chemin de fichier ou grâce à une DataURI.

+
+ +

browser.json

+ +

Ce fichier permet d'ajouter des éléments personnalisés dans l'application Navigateur (par exemple des marque-pages, des moteurs de recherche par défaut). Voir la section Marque-pages et moteur de recherche par défaut pour plus d'informations sur les informations à placer dans ce fichier.

+ +

calendar.json

+ +

Ce fichier permet d'ajouter vos propres calendrier à l'application Calendrier de Firefox OS. Pour cela, il sera nécessaire de définir vous identifiants Google OAuth. De plus, vous aurez besoin de configuer un accès à l'API CalDav : pour générer la clé d'API et le secret associé, vous aurez besoin de créer votre identifiant client (client au sens informatique). Pour cela, suivez les étapes suivantes :

+ +
    +
  1. Ouvrez la console d'API.
    2. +
  2. Créez un projet puis activez Calendar CalDav API dans APIs & auth > APIs (API et authentification > API)
    3. +
  3. Cliquez sur Credentials (Identifiants)
    4. +
  4. Cliquez sur Create new client ID (Créer un nouvel identifiant de client)
    5. +
  5. Définissez le champ Application type (Type d'application) avec Installed application (application installée) et définir Installed application type avec Other (autre) puis cliquez sur Create Client ID (Créer un identifiant client). Vous devriez obtenir un identifiant et un secret de client.
    6. +
  6. Ouvrez le fichier calendar.json, modifiez les valeurs client_id et client_secret avec celles que vous avez obtenues à l'étape précédente. Sauvegardez puis fermez le fichier.
    7. +
+ +
+

Note : L'utilisation de l'API est limitée à 1 000 000 (1 millions) de requêtes par jour.

+
+ +

camera-config.json (Tailles d'image pour la galerie et l'appareil photo)

+ +
{
+  "maxImagePixelSize": 6000000,
+  "maxSnapshotPixelSize": 4000000,
+  "requiredEXIFPreviewSize": {
+    "width": 1200,
+    "height": 1222
+  }
+}
+
+ +

maxImagePixelSize et maxSnapshotPixelSize correspondent aux tailles maximales, exprimées en pixels. Par défaut, ces paramètres sont fixés à 5 mega pixels (5x220 pixels 5MP).

+ +

Vous pouvez également définir les variables nécessaires pour définir la taille minimale de l'aperçu EXIF qui sera utilisé lors de la prévisualisation plein écran en ajoutant la propriété requiredEXIFPreviewSize. Si vous ne définissez pas cette propriété, la prévisualisation EXIF ne sera faite que lorsqu'elle sera assez grande pour remplir l'écran (en largeur ou en hauteur) en paysage ou en portrait.

+ +

contacts.json

+ +

Les contacts listés dans ce fichier seront intégrés à la base de données des contacts du téléphone lors de la construction de Gaia.

+ +

Voici un exemple de fichier contacts.json :

+ +
[
+   {
+     "name": ["Jean Biche"],
+     "givenName": ["Jean"],
+     "familyName": ["Biche"],
+     "nickname": ["Johnny"],
+     "category": ["Travail", "Équipe bowling"],
+     "email": [
+       {
+         "type": ["personal"],
+         "value": "jean.biche@exemple.org",
+         "pref": true
+       },
+       {
+         "type": ["work"],
+         "value": "jbiche@société.com"
+       }
+     ],
+     "adr": [
+       {
+         "type": ["personal"],
+         "streetAddress": "123 Foopy St.",
+         "locality": "San Francisco",
+         "region": "Downtown",
+         "postalCode": "94030",
+         "countryName": "US"
+       }
+     ]
+   },
+   {
+     "name": ["Operateur"],
+     "email": [
+       {
+         "type": ["work"],
+         "value": "support@opérateurx.com"
+       }
+     ],
+     "url": [
+       {
+         "type": ["work"],
+         "value": "https://www.opérateurx.com"
+       }
+     ]
+   }
+ ]
+ +
+

Note : Voir la page sur l'API Contacts pour plus d'informations sur la structure des objets contacts.

+
+ +
+

Note : Pour des personnalisations propres à la carte SIM, lire la section Marque-pages et moteur de recherche par défaut du navigateur.

+
+ +

device-features.json

+ +

Ce fichier définit les capacités matérielles de l'appareil. Par défaut, le fichier contient :

+ +
{
+  "ambientLight": true,
+  "vibration": true,
+  "usbHotProtocolSwitch": false
+}
+ +

Pour le capteur de lumière et le vibreur, vous pouvez changer ces valeurs à false si vous souhaitez désactiver certaines fonctionnalités de l'appareil.

+ +

eu-roaming.json

+ +

Ce fichier contient la liste des opérateurs qui doivent respecter la législation européenne pour l'itinérance des données, ainsi que les APN (Access Point Name) correspondants. Le fichier est composé de trois partie. La première home, contient les codes des opérateurs qui doivent respecter cette législation. La deuxième partie, foreign, contient les codes des opérateurs étrangers pour lesquels une notification devrait être activée lors de l'itinérance des données est active dans ce pays. Enfin, la dernière partie contient le détail pour les APN par défaut dans l'Union européenne. Par défaut, le contenu du fichier est :

+ +
{
+  "home": null,
+  "foreign": null,
+  "defaultApns": []
+}
+
+ +

Si vous souhaitez que le système d'exploitation affiche une notification lors de l'itinérance des données, le fichier ressemblera à celui présenté ci-dessous. Pour cet exemple, l'utilisateur utilisant une carte SIM d'un opérateur "001, 01" recevra une notification concernant l'itinérance des données quand il utilisera le réseau de l'opérateur dont le code est "002, 02" :

+ +
{
+  "home": {
+    "001": {
+      "01": true
+    }
+  },
+  "foreign": {
+    "002": {
+      "02": true
+    }
+  },
+  "defaultApns": [{
+    "apn": "eu.apn",
+    "types": ["default"]
+  }]
+}
+
+ +
+

Note : Tous les paramètres des APN listés dans defaultApns apparaîtront également via l'application des Paramètres.

+
+ +

homescreens.json

+ +

homescreens.json définit les applications à afficher sur la partie principale de l'écran d'accueil et sur les autres pages de l'écran d'accueil, ainsi que l'ordre dans lequel elles sont affichées. Par défaut, le fichier contient :

+ +
{"homescreens": [
+   [
+     ["apps", "communications", "dialer"],
+     ["apps", "sms"],
+     ["apps", "browser"],
+     ["apps", "camera"]
+   ]
+ ]}
+ +

Avec ces informations, les quatres applications décrites seront affichées sur l'écran principal de l'écran d'accueil. Si on ajoute un autre tableau, les applications contenues apparaîtront sur la première page de l'écran d'accueil, l'ensemble suivant apparaîtra sur la deuxième page et ainsi de suite.

+ +
{"homescreens": [
+   [ // Écran principal pour l'écran d'accueil
+     ["apps", "communications", "dialer"],
+     ["apps", "sms"],
+     ["apps", "browser"],
+     ["apps", "camera"]
+   ],
+   [ // Page 1 de l'écran d'accueil
+     ["apps", "email"],
+     ["apps", "settings"],
+     ["apps", "clock"],
+     ["apps", "calendar"]
+   ],
+   [ // Page 1 de l'écran d'accueil
+     ["external-apps", "appPerso1"],
+     ["external-apps", "appPerso2"],
+     ["external-apps", "appPerso3"],
+     ["external-apps", "appPerso4"]
+   ]
+ ]}
+ +

Le premier élément de chaque sous-tableau correspond au nom du répertoire de l'application, le second correspond au nom de l'application et de son répertoire dédié.

+ +

Collections

+ +
+

Note : Avec Firefox 2.0, le répertoire collections a été déplacé de l'application homescreen vers l'application collections. Certains champs du fichier manifeste ont également été modifiés (voir le fichier de manifeste pour la collection funny par exemple) : provider_id a été modifié en  categoryId, et apps a été modifié en pinned.

+
+ +

Les collections sont des groupes d'applications avec leur propre icône qui apparaît sur l'écran d'accueil. Lorsque l'utilisateur touche l'icône, un nouvel écran apparaît et présente l'ensemble des icônes pour les applications contenues dans le groupe. Vous pouvez regarder le contenu du répertoire collections pour voir les collections disponibles par défaut :

+ + + +

Dans chacun de ces répertoires, vous trouverez les icônes pour les différentes résolutions ainsi qu'un fichier de manifeste qui définit des méta-données sur la collection comme son nom, son rôle, ainsi que l'emplacement de ces icônes.

+ +
+

Note : Des collections supplémentaires sont disponibles sur le serveur E.me (19 collections au total, incluant les 10 collections présentées ci-dessus). Vous pouvez voir ces collections en maintenant une pression sur l'écran d'accueil et en choisissant l'option "Ajouter des collections intelligentes".

+
+ +

Dans le fichier homescreens.json, vous pouvez choisir les collections que vous souhaitez charger, les pages sur lesquelles elles doivent apparaître ainsi que l'ordre de leur disposition. Par exemple, si on souhaite faire apparaître les collections shopping, social, sports et tv, on pourra avoir le fichier suivant :

+ +
{"homescreens": [
+   [
+     ["apps/collection/collections", "shopping"],
+     ["apps/collection/collections", "social"],
+     ["apps/collection/collections", "sports"],
+     ["apps/collection/collections", "tv"]
+   ], [
+     ["apps", "communications", "dialer"],
+     ["apps", "sms"],
+     ["apps", "browser"],
+     ["apps", "camera"]
+   ]
+ ]}
+ +

Chaque tableau de plus haut niveau fait référence à une des pages de l'écran d'accueil. Pour cet exemple, les collections apparaîtront sur la page principale (dock) de l'écran d'accueil et les applications individuelles apparaîtront sur la première page de l'écran d'accueil.

+ +
+

Note : Par défaut, quatre collections sont utilisées pour la première page de l'écran d'accueil de Gaia : social, games, music et entertainment.

+
+ +
+

Note : Les noms des collections sont écrits en minuscules.

+
+ +
Le contenu des collections
+ +

Les collections sont composées de deux types d'application.
+
+ Les applications locales sont définies lors de la construction grâce à une fichier de manifeste situé sous /apps/collection/collections/<nomDeLaCollection>/manifest.collection. Les applications locales contenues dans chaque collection sont définies dans le fichier de manifeste. La collection social (qui contient les applications pour le téléphone, les sms, les contacts et les e-mails) aura le fichier de manifeste suivant :

+ +
{
+  "name": "Social",
+  "role": "collection",
+  "provider_id": "289", // identifiant pour la recherche adaptative
+  "apps": [
+    ["apps", "communications", "dialer"],
+    ["apps", "sms"],
+    ["apps", "communications", "contacts"],
+    ["apps", "email"]
+  ],
+  "default_locale": "en-US",
+  "icons": {
+    "60": "/collections/social/icon.png",
+    "90": "/collections/social/icon@1.5x.png",
+    "120": "/collections/social/icon@2x.png"
+  }
+ }
+ +

Les applications distantes sont fournies par le moteur de recherche adaptative lors de l'exécution et quand l'appareil est connecté.

+ +
Traduire les collections
+ +

Les traductions pour les collections doivent être définies dans les fichiers de locales pour l'application Écran d'accueil dans le répertoire apps/collection/locales/. Chaque fichier de locale devra avoir un nom structurant avec la structure collections.<codeLangue>.properties — avec <codeLangue> qui vaut, par exemple, fr pour le français. Ce fichier contient des lignes simples qui contiennent les identifiants des chaînes anglaises associées à leur traduction. Voici un exemple pour la locale française :

+ +
# Add bookmark to homescreen
+add-to-home-screen=Ajouter à l’écran d’accueil
+add-to-home-screen-header=Ajouter un lien
+website-name=Nom du site web
+address=Adresse
+added-to-home-screen=Ajouté à l’écran d’accueil
+
+ +
Collections personnalisées
+ +

À partir de Firefox OS 1.3, vous pouvez définir vos propres collections. Pour cela, il suffit de créer la collection dans le répertoire collection, et de les référencer dans le fichier collections.json vu avant.

+ +

Les propriétés de l'écran d'accueil vertical

+ +

À partir de Firefox 2.0, il est possible de choisir une disposition verticale (plutôt que des pages horizontales) pour l'écran d'accueil. Les propriétés de l'écran d'accueil sont définies dans le fichier default-homescreens.json qui décrit les applications, les collections et les marque-pages à afficher ainsi que le nombre de colonnes pour l'écran d'accueil.

+ +

network.json (ce fichier n'apparait pas dans le dossier de personnalisation)

+ +
+

Important : Cette personnalisation n'est plus supportée depuis Firefox OS 1.4+.

+
+ +

Dans les versions de Firefox OS < 1.4, ce fichier peut être créé dans gaia/apps/settings/resources. Il permet de définir les types de réseaux supportés par l'appareil. Firefox OS fonctionne sur les types de réseaux suivants :

+ + + +

Voici un exemple de fichier :

+ +
{
+  "types":  [
+    "cdma/evdo",
+    "cdma", "evdo"
+  ]
+}
+ +

settings.json

+ + + +

Ce fichier permet de définir les valeurs par défaut pour le fond d'écran, les sonneries, l'activation ou non de l'écran de verrouillage, l'activation ou non du bluetooth, etc. Vous pouvez consulter le fichier build/config/common-settings.json pour déterminer les réglages possibles. Par exemple, vous pouvez inclure la ligne "wifi.enabled":false pour désactiver le wifi par défaut.

+ +

Les réglages personnalisés sont à placer dans le fichier customization/settings.json.

+ +

Fournisseur de recherche par défaut pour la Rocketbar

+ +

Dans Firefox OS 2.0 et les versions supérieures, les paramètres suivants peuvent être ajoutés dans le fichier settings.json, pour définir le fournisseur de recherche par défaut pour la Rocketbar :

+ +
"search.urlTemplate": "https://www.google.com/search?q={searchTerms}",
+"search.suggestionsUrlTemplate": "https://www.google.com/complete/search?client=firefox&q={searchTerms}",
+"search.iconUrl": "data:image/x-icon;base64,AAABAAIAEBAAAAAAAAB9AQAAJ [TRONQUÉ POUR L'EXEMPLE]
+
+ +

Personnaliser le moteur de recherche

+ +

À partir de Firefox 2.0+, il existe une liste par défaut pour les différents moteurs de recherches et les fichiers d'icônes associés : apps/settings/resources/search/providers.json. Vous pouvez configurer cette liste lors de la construction en éditant le fichier customization/search/providers.json et en ajoutant les fichiers d'icônes appropriés dans le même répertoire. Le contenu de ce répertoire écrasera app/settings/resources/search s'il existe et si vous avez lancé la construction avec la commande make production GAIA_DISTRIBUTION_DIR=customization.

+ +

Personnaliser les applications par défaut de l'écran d'accueil

+ +

homescreen.appName vous permet de définr des applications comme applications par défaut pour l'écran d'accueil.

+ +
{ "homescreen.appName": "homescreen-stingray" }
+
+ +

sms-blacklist.json

+ +

Ce fichier contient une liste finie de numéros de téléphone pour lesquels il ne sera pas possible d'envoyer des SMS. Cette liste surchargera le fichier blacklist.json de l'application SMS si elle existe. Les numéros de téléphone sont définis dans un tableau comme suit :

+ +
["11223344", "55667788"]
+ +

cellbroadcast

+ +

Canaux d'écoute :

+ + + +

Désactiver le rapport d'événement :

+ + + +
+

Note : Les paramètres par défaut sont disponibles dans le fichier operator_variant.xml.

+
+ +

support.json

+ +

Ce fichier contient des contacts pour l'assistance (en ligne ou téléphonique). Lorsque ce fichier est renseigné, il écrasera le fichier support.json contenu dans l'application Paramètres. Pour conserver les contacts par défaut, il faudra les copier du fichier original sur le fichier de personnalisation puis ajouter vos nouveaux contacts.

+ +

Voici un exemple de fichier JSON :

+ +
{
+   "onlinesupport": {
+     "href": "http://support.mozilla.org/",
+     "title": "Mozilla Support"
+   },
+   "callsupport": [
+     {
+       "href": "tel:12345678",
+       "title": "Assistance tél. 1"
+     },
+     {
+       "href": "tel:87654321",
+       "title": "Assistance tél. 2"
+     }
+   ]
+ }
+ +

Profil pour l'agent utilisateur WAP (wapuaprof.json)

+ +

Le profil d'agent utilisateur WAP peut surcharger l'agent utilisateur lors de l'envoi de paquets WAP. Si vous souhaitez surcharger le profil d'agent utilisateur (user agent profile) par défaut avec des informations MCC/MNC, vous pouvez utiliser ce fichier (voir les explications supplémentaires dans runtime customization).

+ +

apps.list

+ +

Ce fichier vous permet de définir les applications que vous souhaitez charger à l'exécution (de façon semblable à variant.json, comme expliqué ci-après dans le paragraphe Applications). Les applications sont listées de la façon suivante :

+ +
apps/*
+external-apps/*
+outoftree_apps/*
+ +

Vous pouvez lister des applications spécifiques plutôt que des répertoires entiers :

+ +
apps/email
+apps/settings
+ +
+

Note : Si vous souhaitez ajouter des applications externes dans votre version de Gaia, vous devrez les construire d'une certaine façon et les placer dans le répertoire gaia/external-apps/. Lire le paragraphe Building Prebundled web apps pour plus d'informations à ce sujet.

+
+ +
+

Important : Si vous distribuez une version adaptée de Firefox OS avec des applications externes intégrées, vous devez respecter l'accord de distribution avec Mozilla (Mozilla's Distribution Agreement).

+
+ +

Les autres options de personnalisation

+ +

D'autres aspects de Gaia peuvent être personnalisés. C'est aspects sont décrits ici.

+ +
+

Note : Le script de construction utilisé pour la plupart des paragraphes suivants est gaia/build/applications-data.js. Il est copié dans un fichier init.json qui se situe dans le répertoire de l'application du navigateur lors de la construction.

+
+ +

Marque-pages et moteurs de recherche par défaut du navigateur

+ + + +

Les marque-pages et moteurs de recherche par défaut peuvent être personnalisés lors de la construction et on peut avoir différentes variantes pour chacun des pays au sein d'une même version. Les données personnalisées sont insérées dans l'application du navigateur la première fois qu'il est lancé en fonction des codes MCC / MNC de la carte SIM de l'appareil à ce moment.

+ +
+

Note : Les marque-pages peuvent être personnalisés depuis la version 1.0.1 de Firefox OS mais la procédure a été modifiée avec la version 2.1 (ce qui est expliqué dans le paragraphe suivant). Les moteurs de recherches peuvent être personnalisés à partir de Firefox OS 1.2.

+
+ +

L'exemple ci-après (browser.json) illustre une configuration pour l'opérateur Vivo au Brésil (724006 avec 724 pour le Brésil et 006 pour Vivo selon la codification MCC / MNC), ainsi que le cas par défaut (000000) présent au cas où la carte SIM ne correspondrait pas à l'opérateur ou au cas où la carte SIM est absente de l'appareil.

+ +
content = {
+   '000000': {
+     'bookmarks': [
+       { 'title': 'Mozilla',
+         'uri': 'https://mozilla.org',
+         'iconUri':
+           'data:image/png;base64,AAABAAIAEBAAAAEAIABo[tronqué]'
+       },
+       { 'title': 'Firefox OS',
+         'uri': 'https://mozilla.org/firefoxos',
+         'iconUri':
+           'data:image/png;base64,AAABAAIAEBAAAAEA[tronqué]'
+       }
+     ],
+     'searchEngines' : [
+        {
+          'title': 'Google',
+          'uri': 'https://www.google.com/search?q={searchTerms}',
+          'iconUri':
+            'data:image/png;base64,AAABAAIAEBAAAAEAIABoBAA[tronqué]'
+        }
+      ],
+      'settings' : {
+        'defaultSearchEngine': 'https://www.google.com/search?q={searchTerms}'
+      }
+   },
+
+   '724006': {
+     "bookmarks": [
+       { "title": "Vivo Busca",
+         "uri": "https://www.google.com.br/m/search",
+         "iconUri": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC[tronqué]"
+       },
+       { "title": "Serviços e Downloads",
+         "uri": "http://vds.vivo.com.br",
+         "iconUri": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACA[tronqué]"
+       },
+       {
+         "title": "Site Vivo",
+         "uri": "http://www.vivo.com.br/conteudosmartphone",
+         "iconUri": "data:image/jpg;base64,/9j/4AAQSkZJRg[tronqué]"
+       }
+     ],
+     'searchEngines' : [
+        {
+          'title': 'Yahoo',
+          'uri': 'https://search.yahoo.com/search?q={searchTerms}',
+          'iconUri':
+            'data:image/png;base64,AAABAAIAEBAAAAEAIABoBAA[tronqué]'
+        }
+      ],
+      'settings' : {
+        'defaultSearchEngine': 'https://search.yahoo.com/search?q={searchTerms}'
+      }
+   }
+ };
+ +

Pour cet exemple, si la carte SIM de l'appareil est une carte de l'opérateur Vivo au Brésil, lors de la première utilisation, l'utilisateur verra les marque-pages Vivo et aura Yahoo comme moteur de recherche par défatu. Si une autre carte (ou aucune carte) est présente dans l'appareil lors de la première utilisation, l'utilisateur verra les marque-pages Mozilla ainsi que le moteur de recherche Google. Plusieurs aspects importants sont à noter :

+ + + +
+

Note : L'application du navigateur affichera les marque-pages dans le sens opposé (ex : le premier marque-page du fichier JSON sera affiché en dernier, etc.).

+
+ +

Personnalisation de la liste des fournisseurs de recherche pour la Rocketbar

+ +
    +
  1. Il est également possible d'adapter le fournisseur de recherche par défaut (et la liste des fournisseurs) pour la Rocketbar. Cette personnalisation se base également sur les codes MCC/MNC. Pour définir les fournisseurs de recherche, il faut modifier deux fichiers JSON : +
      +
    • La liste des fournisseurs par MCC/MNC qui est définie dans le fichier mobizilla_search.json pour notre exemple,
      • +
    • Le fournisseur de recherche par défaut pour la Rocketbar qui est défini dans le fichier mobizilla_default_search.json pour notre exemple.
      • +
    +
    2. +
  2. variant.json définit ensuite les fichiers .json à utiliser pour chaque paire MCC/MNC. Ainsi, dans notre exemple, aux lignes 47 et 48, on a : + 
    "search": "mobizilla/mobizilla_search.json",
+"default_search": "mobizilla/mobizilla_default_search.json",
    +
    3. +
  3. variant.json doit être placé dans le répertoire racine consacré à la distribution de votre version.
    4. +
  4. Afin d'appliquer cette configuration, pour la construction de Gaia la variable GAIA_DISTRIBUTION_DIR doit correspondre au chemin de votre répertoire consacré à la distribution de votre version.
    5. +
+ +

Réglages pour les données et les messages

+ +

Il est possible d'adapter les réglages pour les données et les messages lors de l'exécution.

+ +

Pour ajouter des réglages spécifiques, il suffit d'éditer gaia/shared/resources/apn/apns_conf_local.xml en ajoutant ou en éditant des bloc pour chaque opérateur téléphonique :

+ +
 <apn carrier="Réseau Test"
+      mcc="001"
+      mnc="01"
+      apn="internet"
+      user="user"
+      password="password"
+      proxy="127.0.0.1"
+      port="8080"
+      mmsc="http://127.0.0.1"
+      mmsproxy="127.0.0.1"
+      mmsport="8080"
+      authtype="0"
+      type="default,supl,mms"
+  />
+ +

Réglages concernant la messagerie et la diffusion cellulaire

+ +

Pour appliquer des changements spécifiques à la boîte vocale et à la diffusion cellulaire, il suffit de modifier le fichier gaia/shared/resources/apn/operator_variant.xml en ajoutant ou en éditant des blocs pour les opérateurs de la forme suivante :

+ +
   <operator carrier="Réseau Test avec variante par opérateur"
+       mcc="001"
+       mnc="01"
+       cellBroadcastSearchList="0,1,2,3"
+       voicemail="999999"
+   />
+ +

Profil de l'agent utilisateur WAP

+ +

Le profil d'agent utilisateur WAP peut également être personnalisé lors de l'exécution et surcharge les informations de l'agent utilisateur lorsque le téléphone envoie des paquets WAP. En fonction des codes MCC/MNC, le profil peut être personnalisé grâce aux propriétés url et tagname . L'implémentation actuelle ne tient compte que de la propriété url.

+ +

Le profil d'agent utilisateur WAP utilise ici le même format que pour l'application Navigateur. "000000" est utilisé comme profil par défaut. Voici un exemple :

+ +
   {
+     "000000": {
+       "url": "http://example.url/default.xml"
+     },
+     "123001": {
+       "url": "http://example.url/custom123001.xml"
+     }
+   }
+ +

Pour cet exemple, l'URL du profile par défaut est http://example.url/default.xml ; pour les codes MCC = 123 et MNC = 001, l'URL sera http://example.url/custom123001.xml. S'il y avait une autre carte dont les codes seraient MCC = 123 et MNC = 100, l'URL utilisée serait alors http://example.url/default.xml.

+ +

Si jamais l'élément dont le code est 000000 était retiré :

+ +
  {
+     "123001": {
+       "url": "http://example.url/custom123001.xml"
+     }
+   }
+ +

le profil utilisé par la carte dont les codes sont MCC = 123 et MNC = 001 serait désormais basé sur http://example.url/custom123001.xml. Les profils des autres codes ne seraient pas surchargés.

+ +

Si on gardait "000000" et que "123001" ne possèdait pas d'URL :

+ +
   {
+     "000000": {
+       "url": "http://example.url/default.xml"
+     },
+     "123001": {}
+   }
+ +

tous les profils seraient surchargés avec l'URL http://example.url/default.xml

+ +

Applications

+ +

Les applications installées dans Firefox OS peuvent être adaptées lors de l'exécution (voir personnaliser les applications présentes lors de la construction). Pour personnaliser les applications en fonction de l'opérateur, il est possible d'utiliser le fichier variant.json pour déterminer quelles applications installer et comment les placer sur l'écran d'accueil. Les applications tierces seront ajoutées à la liste avec les applications standard.

+ +

La portion intéressante du fichier variant.json ressemblera à cela :

+ +
   {
+     "apps": {
+       "puzzle":
+         {
+           "manifestURL": "https://owd.tid.es/store/packages/fe8e4a866c518a42db9d2041568684c1.webapp"
+         },
+       "store":
+         {
+           "manifestURL": "https://owd.tid.es/store/manifest.webapp",
+           "installOrigin": "https://www.openwebdevice.com"
+         }
+     },
+     "operators": [
+       {
+         "id": "movistar-co",
+         "mcc-mnc": [
+           "214-01",
+           "214-02"
+         ],
+         "apps": [
+           {
+             "id": "store",
+             "screen": 0,
+             "location": 2
+           }
+         ]
+       },
+       {
+         "id": "movistar-mx",
+         "mcc-mnc": [
+           "215-23"
+         ],
+         "apps": [
+           {
+             "id": "store",
+             "screen": 0,
+             "location": 2
+           },
+           {
+             "id": "puzzle"
+           }
+         ]
+       }
+     ]
+   }
+ + + +

Les autres personnalisations utilisant un fichier de variante

+ +

Le fichier variant.json (le même que précedemment) permet également de configurer des ressources spécifiques grâce à des attributs relatifs à chaque opérateurs. Un opérateur pourra avoir les réglages suivants :

+ +
   {
+     "apps": {
+       ...
+     },
+     "operators": [
+       {
+         "id": "movistar-co",
+           "mcc-mnc": [
+             "214-01",
+             "214-02"
+           ],
+         "apps": [
+           {
+             "id": "store",
+             "screen": 0,
+             "location": 2
+           }
+         ],
+         "support_contacts": "resources/support_contacts_movistar.json",
+         "default_contacts": "resources/contacts_movistar.json",
+         "ringtone": {
+           "path": "resources/Movistar_Mid_ABR_128kbps.ogg",
+           "name": "Tono Movistar"
+         },
+         "wallpaper": "resources/customize.jpg",
+         "keyboard": "resources/keyboard_movistar.json",
+         "network_type": "resources/network_type_movistar.json",
+         "known_networks": "resources/known_networks_movistar.json",
+         "data_ftu": true,
+         "sms": "resources/sms_movistar.json",
+         "topsites": "resources/topsites_movistar.json",
+         "bookmarks": "resources/bookmarks_movistar.json",
+         "data_roaming": true,
+         "power": {
+           "poweron": {
+             "video": "app://operatorresources/resources/power/latam_power_on.mp4"
+           },
+           "poweroff": {
+             "video": "resources/latam_power_off.mp4"
+           }
+         },
+         "nfc": true
+       }
+       ...
+     ]
+   }
+
+ +

Les différents réglages présentés dans le fichier sont détaillés ci-après :

+ +

Contacts d'assistance

+ +

La propriété support_contacts correspond à un chemin vers un fichier qui contiendra les contacts affichés sur l'écran d'aide (Paramètres > Aide). Cela permet d'avoir les mêmes fonctionnalités que support.json. Le format du fichier attendu à l'emplacement indiqué est le suivant :

+ +
   {
+     "onlinesupport": {
+       "title": "Assistance Mozilla",
+       "href": "http://test.mozilla.org/support"
+     },
+     "callsupport1": {
+       "title": "Assistance téléphonique (1)",
+       "href": "tel:14155550001"
+     },
+     "callsupport2": {
+       "title": "Assistance téléphonique (2)",
+       "href": "tel:14155550002"
+     }
+   }
+ +

Contacts par défaut

+ +

La propriété default_contacts correspond au chemin vers un fichier qui définit les contacts qui seront préchargés dans l'application Contacts en fonction des codes MCC/MNC. Les noms des différentes sections du fichier seront les codes MCC/MNC, chaque section contient un ensemble de contacts (au même format que pour contacts.json). Par exemple :

+ +
    {
+        "123123":
+        [
+            {name: ["Jean Biche"]},
+            // etc
+        ],
+    }
+
+ +

Sonnerie

+ +

La propriété ringtone permet de définir la sonnerie par défaut. Cet objet contient deux propriétés obligatoires :

+ + + +

Fond d'écran

+ +

La propriété wallpaper contient le chemin vers le fichier image (PNG) qui sera utilisé comme fond d'écran par défaut.

+ +

Paramètres clavier

+ +

La propriété keyboard contient le chemin vers un fichier qui contient les informations de configuration pour le clavier. Le format du fichier attendu est le suivant :

+ +
 {
+   "keyboard.vibration": true,
+   "keyboard.autocorrect": false,
+   "keyboard.clicksound": true,
+   "keyboard.wordsuggestion": false
+ }
+ +

Indicateurs de réseau

+ +

La propriété network_type contient le chemin d'un fichier qui contient le texte à utiliser lorsqu'un type de réseau est utilisé par l'appareil. Ce texte apparaîtra dans l'application Réglages, la barre de statut et les réglages rapides.

+ +

La barre de statut et les occurences dans l'application Réglages utiliseront le texte contenu dans le fichier. Pour l'écran des réglages rapides, le fichier devra contenir une clé intitulée  data_sprite qui pointe vers un sprite CSS qui contient les icônes pour les différents types de réseaux supportés.

+ +

La propriété data_sprite doit correspondre à une URL qui pointe vers une application de l'appareil. Voici un exemple pour un tel fichier :

+ +
 {
+  "lte": "4G",
+  "ehrpd": "4G",
+  "hspa+": "H+",
+  "hsdpa": "H",
+  "hsupa": "H",
+  "hspa": "H",
+  "evdo0": "E",
+  "evdoa": "E",
+  "evdob": "E",
+  "1xrtt": "1x",
+  "umts": "3G",
+  "edge": "E",
+  "is95a": "2G",
+  "is95b": "2G",
+  "gprs": "2G",
+  "wcdma/gsm": "2G/3G GSM auto",
+  "gsm": "2G GSM",
+  "wcdma": "3G GSM",
+  "wcdma/gsm-auto": "2G GSM Preferred",
+  "cdma/evdo": "2G/3G CDMA auto",
+  "cdma": "2G CDMA",
+  "evdo": "3G CDMA",
+  "wcdma/gsm/cdma/evdo": "2G-3G GSM/CDMA auto",
+  "data_sprite": "app://operatorresources/resources/quick_settings/images/data-sprite-latam.png"
+ }
+ +

SSID WiFi pré-paramétrés

+ +

La propriété known_networks contient un chemin vers un fichier qui liste différents réseaux WiFi. Voici un exemple de fichier :

+ +
 {
+  "OPEN": {
+    "ssid": "OPEN"
+  },
+  "WEP-WITHOUTKEY": {
+    "ssid": "wifi-WEP-WITHOUTKEY",
+    "keyType": "WEP"
+  },
+  "WEP_KEY": {
+    "ssid": "WEP-KEYOK",
+    "keyType": "WEP",
+    "capabilities": "",
+    "password": "constrasenya1"
+  },
+  "WEP_KEYOK_WPS": {
+    "ssid": "WEP-KEYOK-WPS",
+    "keyType": "WEP",
+    "capabilities":"WPS",
+    "password": "constrasenya1"
+  },
+  "wpa": {
+    "ssid": "macaFirefoxHotspot",
+    "keyType": "WPA-PSK"
+  },
+  "WPA-PSK_KEY": {
+    "ssid": "WPA-PSK-KEYOK",
+    "keyType": "WPA-PSK",
+    "capabilities":"",
+    "password": "constrasenya1"
+  },
+  "WPA-PSK_KEY_WPS": {
+    "ssid": "WPA-PSK-KEYOK-WPS",
+    "keyType": "WPA-PSK",
+    "capabilities":"WPS",
+    "password": "constrasenya1"
+  },
+  "WPA-EAP-PSK_WITHOUTEAP": {
+    "ssid": "WPA-EAP-WITHOUTKEY",
+    "keyType": "WPA-EAP"
+  },
+  "WPA-EAP_SIM": {
+    "ssid": "WPA-EAP-SIM",
+    "keyType": "WPA-EAP",
+    "eap": "SIM",
+    "password": "constrasenya1"
+  },
+  "WPA-EAP-KEYOK-WPS": {
+    "ssid": "WPA-EAP-KEYOK-WPS",
+    "keyType": "WPA-EAP",
+    "eap": "PEAP",
+    "capabilities": "WPS",
+    "password": "constrasenya1",
+    "identity": "HI\\usr"
+  },
+  "WPA-EAP-KEYOK-CAPOK-PHASE2-OK": {
+    "ssid": "WPA-EAP-KEYOK-CAPOK-PHASE2",
+    "keyType": "WPA-EAP",
+    "eap": "PEAP",
+    "capabilities":"WPS",
+    "phase2": "PAP",
+    "password": "constrasenya1",
+    "identity": "HI\\usr"
+  }
+ }
+ +

Activation/Désactivation des données par défaut lors de l'expérience de première utilisation

+ +

L'attribut data_ftu définit si oui ou non les données sont activées pendant l'expérience de première utilisation (FTU pour First Time Use). Cette propriété est une valeur booléenne.

+ +

Nombre maximum de SMS à convertir en MMS

+ +

sms contient le chemin vers un fichier permettant de paramétrer les aspects relatifs aux SMS. Actuellement le seul attribut présent correspond au nombre de SMS pouvant être convertis en MMS. Par exemple :

+ +
 {
+  "smsMaxConcat": 9
+ }
+ +

Initialiser les sites les plus visités du navigateur

+ +

La propriété topsites contient le chemin vers un fichier qui liste les sites à faire apparaître. Un objet de ce tableau contient la propriété title (chaîne de caractères), uri (l'url) et iconPath. Voici un fichier d'exemple :

+ +
{
+  "topsites": [
+    {
+      "title": "Movistar",
+      "uri": "http://www.movistar.es",
+      "iconPath": "resources/movistar.ico"
+    }
+  ]
+}
+ +

Marque-pages

+ +
+

Note : Pour plus d'informations sur la personnalisation des marque-pages pour les versions antérieures de Firefox OS, voir le paragraphe Browser bookmarks and default search engines.

+
+ +

bookmarks contient le chemin d'un fichier listant les objets marque-pages. Un objet correspondant à un marque-page contient trois paramètres : title, pour le titre, uri, pour l'URL du site marqué et iconPath pour l'icône à afficher sur le téléphone. Par exemple :

+ +
{
+  "bookmarks": [
+    {
+      "title": "Google",
+      "uri": "http://www.google.es",
+      "iconPath": "resources/google.ico"
+    }
+  ]
+}
+ +

Activation/Désactivation de l'itinérance des données par défaut

+ +

L'attribut data_roaming permet de définir si oui ou non l'itinérance des données est activée par défaut. C'est un booléen (sa valeur est true ou false).

+ +

Animation à l'allumage/extinction

+ +

Les animations d'allumage/extinction sont configurées grâce à un objet qui sera la valeur de la propriété power. Cet objet possède deux propriétés : la première concerne l'animation à utiliser quand le téléphone est démarré (poweron), la seconde correspond à l'animation à utiliser lorsque le téléphone s'éteind. Chacune de ces propriétés contient une clé permettant d'identifier la ressource à utiliser. Cette clé correspond à la propriété video dont la valeur est le chemin vers la ressource à utiliser. Ce chemin peut être local, relativement au système de fichier à utiliser lors de la construction (par exemple : resource/unfichier.png) ou une URI vers un fichier contenu dans une application Gaia qui sera installée sur l'appareil (par exemple : app://nom.domaine/chemin/vers/video.mp4).

+ +

Voici un exemple d'objet power :

+ +
"power": {
+  "poweron": {
+    "video": "app://operatorresources/resources/power/latam_power_on.mp4"
+  },
+  "poweroff": {
+    "video": "resources/Power_off_test.mp4"
+  }
+}
+ +

Activation/Désactivation du NFC par défaut

+ +

L'attribut nfc booléen définit si oui ou non le NFC (Near Field Communication ou Communication en champ proche) est activé par défaut.

+ +

Construire des applications web pré-empaquetées

+ +

Dans cet article, nous avons vu comment utiliser le fichier apps.list pour installer des applications intégrées à votre version. Ces applications doivent être construites selon un certain procédé puis ajoutées au répertoire gaia/external-apps.
+
+ Pour construire des applications web pré-empaquetées, vous devrez utiliser le script preload-app-toolkit qui permet de construire une application à partir d'une URL .webapp. Ce script peut également accepter les manifestes pour les applications web hébergées et les mini-manifestes pour les applications empaquetées.

+ +

Empaqueter une seule application

+ +

Déterminez l'URL .webapp correspondant à l'application que vous voulez empaqueter puis lancez la commande suivante :

+ +
python preload.py http://<url de l'application>
+ +

Cela génèrera un répertoire dont le nom sera celui de l'application web (par exemple accuweather).

+ +

Empaqueter plusieurs applications (traitement en lots)

+ +

Pour traiter plusieurs applications à la suite, vous pouvez créer un fichier list, contenant l'ensemble des noms des applications et des URL .webapp correspondantes et que vous souhaitez empaqueter. Le fichier ressemblera à celui-ci :

+ +
premiereAppli,https://www.premiereappli.com/manifest.webapp
+deuxièmeAppli,https://www.deuxiemeappli.com/manifest.webapp
+
+ +

Ce fichier devra être sauvegardé sous le nom list et faire partie du même répertoire que le script preload.py. Vous pouvez ensuite lancer la commande suivante :

+ +
$ python preload.py
+ +

Le script preload.py analysera le fichier fourni et traitera l'ensemble des applications à la suite.

+ +

Le fichier metadata.json pour les applications pré-empaquetées

+ +

Chaque application web pré-empaquetée devrait contenir un fichier metadata.json  au sein de son répertoire racine. Le Marketplace Firefox a besoin de ce fichier metadata.json pour gérer les mises à jour automatiques. Ce fichier est généré automatiquement par le script preload.py.
+
+ Pour une application web hébergée, les propriétés du fichier metadata.json sont :

+ + + +

Pour une application empaquetée, les propriétés de metadata.json seront :

+ + + +

Mises à jour automatique des applications empaquetées : le format update.webapp

+ +

Les applications empaquetées possèdent un fichier update.webapp utilisé pour les mises à jour automatiques. Le format de ce fichier est semblable à celui de manifest.webapp, mais possède certains attributs supplémentaires :

+ + + +
  {
+    "name": "Game Pack",
+    "icons": {
+      "60": "/icon-60.png",
+      "128": "/icon-128.png"
+    },
+    "version": "1.1.2",
+    "package_path": "/application.zip",
+    "developer": {
+      "url": "http://abc.com",
+      "name": "abc Inc."
+    },
+    "release_notes": "2nd release",
+    "locales": {
+      "es": {
+        "launch_path": "/index-es.html",
+        "description": "show me customization."
+      }
+    },
+    "size": 5460141
+  }
+ +

Application pré-empaquetée au format AppCache

+ +

Si le fichier manifest.webapp possède un attribut appcache_path inclus, le script preload.py ira chercher le fichier AppCache utilisé et ira « pré-chercher » (prefetch) les ressources décrites dans le fichier AppCache. Les applications pré-empaquetée AppCache sont légèrement différentes et Gecko les reconnaîtra dans un format différent. Cela est géré par le script preload.py.

+ +

La structure des fichiers traduits sera la suivante :

+ +
    <app name>
+       ├── manifest.webapp
+       ├── metadata.json
+       └── cache
+             ├── manifest.appcache
+             └── <resources>
+
+ +
+

Note : Si le fichier AppCache est nommé différemment dans appcache_path, il devra être renommé en manifest.appcache puis enregistré dans le répertoire cache.

+
+ +

FAQ

+ +

La liste qui suit regroupe les réponse aux questions fréquemment posées sur la personnalisation de Gaia :

+ +

Qu'est-ce qui peut être personnalisé ?

+ + + +

Comment définir une disposition des applications personnalisée ?

+ +

Cette disposition est définie actuellement dans gaia/apps/homescreen/js/init.json. customize.py génèrera la construction au bon format.

+ +

Est-il possible de définir si une application peut être retirée de l'écran d'accueil avec la configuration ?

+ +

Non. Les applications de /system/b2g ne peuvent pas être retirées, celles contenues dans /data peuvent être retirées. Les applications préchargées provenant de /system, elles doivent être déplacées sous /data si on veut les retirer.

+ +

Comment ajouter une application empaquetée préchargée ou une application hébergée à la construction ?

+ +

Ces applications doivent être ajoutées à gaia/external-apps. customize.py permetttra de gérer les URL pour les applications empaquetées et hébergées puis téléchargera les fichiers à l'emplacement adéquat puis créera metadata.json. Ce fichier servira lors de la construction.

+ +

Les méta-données permettront de différencier les applications empaquetées des applications hébergées.

+ +

Voir Building Prebundled web apps pour plus de détails.

+ +

Comment préparer une application hébergée préchargée pour qu'elle fonctionne hors ligne ?

+ +

Pour cela, il faut fournir les fichiers à fournir en cache dans le répertoire external-apps/MON_APPLICATION/cache, avec le manifeste AppCache.

+ +

Voir Building Prebundled web apps pour plus de détails.

+ +

Quelles adaptations peuvent être effectuées pour le Marketplace ?

+ + + +

D'autres problématiques sont à gérer selon les régions ou les opérateurs. Voir la page Ajouter des régions ou des opérateurs pour plus de détails.

+ +

Comment enregistrer les modifications apportées ?

+ +

Il suffit de sauvegarder uniquement les fichiers modifiés dans les différents emplacements. À l'heure actuelle, plusieurs répertoires sont utilisés au sein du système de fichiers. Pour la version 2 de B2G, ces fichiers pourront être amenés à être stockés dans un seul emplacement (de façon similaire aux répertoires des différentes marques pour Gecko).

+ +

Comment construire le produit avec une configuration spécifique ?

+ +

Copiez les fichiers modifiés dans une branche de Gaia puis lancez la construction. Pour cela, vous pouvez utiliser customize.py qui, via une interface utilisateur, vous aidera à activer ou non les différentes options, à créer les fichiers adéquats aux bons emplacements puis à construire le profil depuis Gaia.

+ +

Comment personnaliser l'animation d'allumage/extinction ?

+ + diff --git a/files/fr/archive/b2g_os/developing_gaia/index.html b/files/fr/archive/b2g_os/developing_gaia/index.html new file mode 100644 index 0000000000..b1d7092f1b --- /dev/null +++ b/files/fr/archive/b2g_os/developing_gaia/index.html @@ -0,0 +1,73 @@ +--- +title: Développer pour Gaia +slug: Archive/B2G_OS/Developing_Gaia +tags: + - Bugs + - Firefox OS + - Gaia + - Mozilla + - 'l10n:priority' +translation_of: Archive/B2G_OS/Developing_Gaia +--- +
+

Gaia comprend l'interface utilisateur de Firefox OS Gaia ainsi qu'un ensemble d'applications de base comme : l'écran de verrouillage, l'écran d'accueil, le clavier téléphonique, etc. Sur le fond, Gaia est un ensemble complexe d'applications web fonctionnant sur la plate-forme Firefox OS. Cette série d'articles illustre tous les aspects que vous devez connaître pour contribuer au projet Gaia.

+
+ +

Dans ce guide, nous verrons les étapes pour contribuer à Gaia : apporter de nouvelles fonctionnalités à Gaia et/ou corriger des bugs qui concernent le projet Gaia. Le premier ensemble d'articles peut être lu dans l'ordre pour une introduction complète, ou bien, vous pouvez aller directement à la section qui vous intéresse pour un sujet en particulier.

+ +

Les sections suivantes aborderont des documents de références ainsi que des informations supplémentaires sur des sujets connexes.

+ +

Écran d'accueil de Gaia en français

+ +

Les bases

+ +
    +
  1. Faire fonctionner le code de Gaia
    2. +
  2. Comprendre le code de Gaia
    3. +
  3. Ajouter des modifications au code de Gaia
    4. +
  4. Tester des modifications du code de Gaia
    5. +
  5. Soumettre un correctif pour Gaia
    6. +
+ +

Références des outils de construction pour Gaia

+ + + +

Voir aussi

+ + + +

 

+ +

+ +
+

Rejoignez la communauté Gaia

+
+
Choisissez votre méthode préférée pour rejoindre la discussion :
+ +
+
+ +
+
+

diff --git a/files/fr/archive/b2g_os/developing_gaia/localiser_firefox_os/index.html b/files/fr/archive/b2g_os/developing_gaia/localiser_firefox_os/index.html new file mode 100644 index 0000000000..564b9d653d --- /dev/null +++ b/files/fr/archive/b2g_os/developing_gaia/localiser_firefox_os/index.html @@ -0,0 +1,132 @@ +--- +title: Localiser Firefox OS +slug: Archive/B2G_OS/Developing_Gaia/Localiser_Firefox_OS +translation_of: Archive/B2G_OS/Developing_Gaia/Localizing_B2G_OS +--- +
+

Dans ce guide, nous vous montrerons qu'il est très facile de localiser Firefox OS et plus spécifiquement l'interface Gaia et les applications. Nous commencerons par vous aider à paramétrer votre ordinateur, puis comment traduire les chaines de Gaia et enfin comment effectuer des tests l10n sur votre travail.

+
+ +
+

A Noter: Ceci est un guide pour traducteurs voulant aider à traduire Firefox OS. Les développeurs voulant écrire des application traduisibles doivent débuter avec Traduire des application Firefox OS(en anglais), et ensuite regarder Bonnes pratiques L10n(en anglais).

+
+ +

Récupérer les outils

+ +

Afin de pouvoir récupérer les fichiers sources de Gaia et tester votre localisation sur votre ordinateur, vous devrez vous assurer d'avoir les outils et langages de programmation installés dessus :

+ +
+
GNU make
+
make est un petit outil très pratique pour créer des compilations à partir de code source. Il sera pratique quand vous serez prêt à tester votre travail de l10n sur votre ordinateur. Télécharger et installer make est facile et peut se faire directement à partir du site de GNU. Si vous utilisez Mac OS X, vous aurez besoin d'installer XCode et les outils de ligne de commande d'XCode à partir de l'App Store.
+
git
+
git est un système de gestion de versions décentralisé utilisé pour stocker le code source de Gaia activement développé. Télécharger et installer git est facile et peut se faire directement via leur site web.
+
Python
+
Python est un langage de programmation qui vous aidera aussi à créer des compilations de Firefox OS pour tester la localisation. Télécharger et installer Python est facile et peut se faire directement via leur site web.
+
Mercurial (hg)
+
Mercurial (hg) est un autre système de gestion de version qui contient les versions stables de Gaia utilisées pour la l10n, ainsi que les dépôts de locale. Télécharger et installer Mercurial est facile et peut se faire directement via leur site web.
+
compare-locales
+
compare-locales est un script Python qui aide les traducteurs à évaluer leur travail et à séparer le nouveau contenu à localiser du contenu déjà localisé (C'est un diff). Télécharger et installer compare-locales est facile et peut se faire directement à partir de la page wiki compare-locales. Cela est nécessaire seulement si vous localisez Gaia en utilisant seulement la ligne de commande ou un éditeur de texte. Si vous utilisez un outil comme Pootle, Transifex, ou Pontoon, vous n'avez pas besoin de cet outil.
+
+ +

Mis en place d'un dépôt local

+ +

Après avoir téléchargé et installé les logiciels de la liste ci-dessus, il est temps d'obtenir les sources et les chaines localisées sur votre ordinateur.

+ +
    +
  1. Dans votre outil de ligne de commande, naviguez vers l'emplacement où vous stockerez les sources de Gaia et les chaines localisées.
    2. +
  2. En utilisant hg, clonez le dépôt en-US dans l'emplacement par défaut en entrant la première commande ci-dessous. + 
    hg clone https://hg.mozilla.org/gaia-l10n/en-US
+
    +
    3. +
  3. Ensuite clonez le dépot de votre locale en utilisant une commande avec la structure ci-dessous. Par exemple, la deuxième ligne permet de cloner le dépot de Chinois traditionnel dans un dossier approprié. + 
    hg clone https://hg.mozilla.org/gaia-l10n/votre-code-de-locale
+hg clone https://hg.mozilla.org/gaia-l10n/zh-TW/ B2G/gaia/locales/zh-TW
    +
    4. +
  4. Ensuite tapez la commande suivante : + 
    LOCALE_BASEDIR=locales/ LOCALES_FILE=locales/languages_mine.json make
    +
    5. +
+ +

Les fichiers de locale devraient être listés dans le fichier languages_mine.json, qui aura une structure ressemblant à ça :

+ +
{
+  "en-US" : "English (US)",
+  "fr" : "Français (fr)"
+}
+ +

Dans ce fichier vous devriez avoir une liste des chaines prête à traduire ! Veuillez noter que si vous commencez une nouvelle localisation de Firefox OS, vous n'avez pas besoin de créer un diff car toutes les chaines sont de nouvelles chaines à traduire.

+ +
+

Note : Reportez-vous à ce gist pour un script de compilation automatique de locale.

+
+ +

 

+ +

Traduire des chaines Gaia

+ +
+
Le flux de travail pour traduire les chaînes Gaia dépend en grande partie des outils que vous utilisez pour traduire. Cette partie du processus est similaire à la phase habituelle de traduction des autres produits Mozilla. La page de phase de traduction du guide rapide de localisation contient une liste de tous les outils utilisés pour traduire des chaines dans les produits Mozilla ainsi que des tutoriels sur comment traduire avec ces outils. Cette page vous sera utile si vous faites partie d'une équipe l10n. Elle vous aidera à choisir quel outil utiliser pour traduire les chaines de Gaia et vous proposera des tutoriels sur ces outils.
+ +
 
+
+ +

Tester la localisation pour Firefox OS

+ +

Il existe deux méthodes principales pour effectuer des tests L10n sur Firefox OS : les compilations desktop et les compilations mobiles. Actuellement, la méthode desktop est la plus utilisée pour les test L10n.

+ +

Tester la l10n sur desktop

+ +
    +
  1. Téléchargez et installez la dernière compilation nocture de boot2gecko pour desktop — téléchargez le package qui correspond à votre système d'exploitation. Recherchez les paquets qui contiennent le mot localizer à l'intérieur. Cela indique que cette compilation possède toutes les locales activées listées dans languages-all.json.
    2. +
  2. Clonez la dernière version de Gaia en naviguant dans le dossier sur votre ordinateur où vous souhaiter là télécharger et entrez cette commande dans votre utilitaire de ligne de commande : git clone git://github.com/mozilla-b2g/gaia.git
    3. +
  3. Si votre équipe localise Firefox OS pour la première fois, vous aurez besoin d'activer la locale. Si non prenez un verre, pendant que tout le monde active sa locale. +
      +
    1. Dans votre terminal, naviguez à l'intérieur de votre clone de Gaia et exécutez cette commande pour cloner le dépôt de votre locale  : hg clone ssh://hg.mozilla.org/gaia-l10n/votre-code-de-locale
      2. +
    2. Ouvrez le fichier languages.json situé dans le dossier shared/resources dans le dépôt gaia que vous venez juste de cloner.
      3. +
    3. Ajoutez l'information de votre locale correspondant à ce format : "en-US" : "English (US)", et enregistrez votre fichier.
      4. +
    4. Pour finir, exécutez la commande : make multilocale. Cela active votre locale sur votre build desktop.
      5. +
    +
    4. +
  4. Create your Gaia profile by running this command: DEBUG=1 make -C gaia profile
    5. +
  5. Finally, you can run Firefox OS with your locale profile and begin testing. Do this by entering this command: b2g/b2g -profile gaia/profile. If you're using OS X, run this command: /Applications/B2G.app/Contents/MacOS/b2g -profile gaia/profile
    6. +
  6. To update your desktop builds, simply navigate to your Gaia repo clone and enter this command: git pull
    7. +
+ +

Mobile l10n testing

+ +

This section will grow as more devices that support Firefox OS become available to localizers.

+ +

What to look for when l10n testing

+ +

Localization testing for a mobile operating system has some similarites to localization testing for a desktop application. Here are some guidelines on what to look for when performing localization testing on your work:

+ +
    +
  1. See if your translations fit inside UI text elements.
    2. +
  2. Ensure that the tone, style, and terminology are consistant throughout the entire product.
    3. +
  3. Look for untranslated English strings in the UI. These may be hard-coded into Gaia or they may caused by element ID errors.
    4. +
  4. Make sure that time and dates display according your regions standards.
    5. +
+ +

Finding localization-specific bugs

+ +

Here are some links to bugzilla in order to give you examples of bugs that have been encountered while using the phones. This will give you an idea of where to look at for bugs as well as an example in filing these kinds of bugs.

+ + + +

General rules when filing a Localization bug:

+ + + +

For those of you who use Moztrap, looking at the existing test cases under the FirefoxOS "localization" tags and seeing if you can pass the tests on your device is also a good way to test Firefox OS localizations.

+ +

What's next?

+ +

Now you're ready to start localizing! So open up your favorite l10n tool and go for it! As always, if you have questions that are not covered in this document, please send them to the mozilla.dev.l10n newsgroup.

diff --git "a/files/fr/archive/b2g_os/developing_gaia/personnalisation_applications_pr\303\251sentes_construction/index.html" "b/files/fr/archive/b2g_os/developing_gaia/personnalisation_applications_pr\303\251sentes_construction/index.html" new file mode 100644 index 0000000000..1c7baba326 --- /dev/null +++ "b/files/fr/archive/b2g_os/developing_gaia/personnalisation_applications_pr\303\251sentes_construction/index.html" @@ -0,0 +1,88 @@ +--- +title: Personnaliser les applications présentes lors de la construction +slug: >- + Archive/B2G_OS/Developing_Gaia/Personnalisation_applications_présentes_construction +tags: + - Apps + - B2G + - Customization + - Firefox OS + - Gaia + - Guide +translation_of: Archive/B2G_OS/Developing_Gaia/Customizing_build-time_apps +--- +
+

Si vous êtes développeur ou vendeur d'appareil, vous voudrez personnaliser et choisir les applications qui seront présentes sur l'appareil quand il sera utilisé pour la première fois. Cet article explique les différents outils pour le faire.

+
+

Emplacement des applications dans Gaia

+

Les applications qui fonctionnent sur Firefox OS sont toutes contenues dans les dossiers de Gaia, dans l'un de ces deux répertoires :

+ +

Si vous souhaitez enlever/ajouter certaines applications pour votre construction (build) de Gaia/B2G, vous disposez de plusieurs outils décrits ci-après.

+

Méthode brute

+

La méthode « brute » consiste à supprimer les applications que vous ne souhaitez pas installer lors du build (avant de lancer le processus de construction).

+

Éditer les listes de configuration

+

Une méthode plus fine consiste à éditer les fichier apps-*.list (qui se trouve dans un répertoire différent en fonction de l'appareil et qui est sous gaia/build/config/, comme phone/ et tablet/). Dans ces fichiers, il suffit d'ajouter les applications que vous souhaitez intégrer lors de la construction. Par exemple, gaia/build/config/phone/apps-production.list ressemble à :

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

Vous pouvez également indiquer d'utiliser toutes les applications d'un répertoire, de la façon suivante :

+
apps/*
+

Le mécanisme utilisé pour déterminer quel fichier apps-*.list est utilisé pendant la construction est décrit dans le fichier gaia/Makefile, et ressemble à :

+
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
+

Au départ, la variable GAIA_APP_TARGET vaut engineering et la variable GAIA_DEVICE_TYPE vaut phone, par défaut, la construction de Gaia utilisera gaia/config/phone/app-engineering.list (qui contient l'ensemble des tests, des démos, etc.)

+

Pour définir l'utilisation souhaitée, il faut utiliser les différentes options de la commande make. Par exemple, pour construire Gaia avec gaia/build/config/phone/apps-production.list, il faut utiliser l'option suivante :

+
PRODUCTION=1 make
+

Si vous utilisez DEMO=1, le fichier apps-demo.list sera utilisé. Si vous choisissez le paramètre DOGFOOD=1, la construction utilisera le fichier apps-dogfood.list.

+

Vous pouvez totalement contrôler le choix en éditant GAIA_APP_CONFIG dans le fichier gaia/Makefile, et en fournissant votre propre fichier apps-*.list.

+

gaia/Android.mk contient ces lignes :

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

Lors de la construction, si VARIANT=user ou si VARIANT=userdebug sont choisis (et sont repercutés dans la variable TARGET_BUILD_VARIANT), PRODUCTION=1 sera automatiquement défini lors de la construction de Gaia.

+
+

Note : Pour trouver plus d'informations sur les options de make, voir la référence des options de make.

+
+

Utiliser le système de personnalisation (Market customizations)

+

La troisième méthode est la plus fine (et également la plus complexe) et utilise le système de personnalisation. Ce système permet de définir des instructions de personnalisation pour la construction et ce, sans modifier le cœur de Gaia. Vous pouvez inclure les personnalisations de votre choix dans des dossiers distincts ou bien en utilisant les répertoires existants.

+

Par exemple, en définissant l'emplacement des personnalisations grâce à la variable d'environnement GAIA_DISTRIBUTION_DIR comme ça :

+
GAIA_DISTRIBUTION_DIR=<DISTRIBUTION_PATH> make production
+

Pour plus d'exemples sur le mécanisme de distribution, voir https://github.com/mozilla-b2g/gaia/tree/master/customization

+

Les personnalisations sont un sujet à part entière, pour plus d'informations sur ce sujet, lire le guide du système de personnalisation (Market customizations).

+
+

Note : Si vous souhaitez inclure des applications externes dans votre build de Gaia, vous devrez les construire d'une certaine façon, puis les placer dans le répertoire gaia/dev-apps/. Lire l'article Construire des applications web pré-packagées pour en savoir plus.

+
+
+

Important : Si vous êtes distributeur ou fabricant de matériel et que vous souhaitez construire une version spécifique de B2G/Gaia pour la distribuer, vous devez répondre à certains critères pour avoir l'autorisation d'inclure le Marketplace Firefox sur vos téléphones/tablettes. Merci de contacter Mozilla pour plus de détails.

+
+

 

diff --git a/files/fr/archive/b2g_os/developing_gaia/personnaliser_le_clavier/index.html b/files/fr/archive/b2g_os/developing_gaia/personnaliser_le_clavier/index.html new file mode 100644 index 0000000000..46dd2b2731 --- /dev/null +++ b/files/fr/archive/b2g_os/developing_gaia/personnaliser_le_clavier/index.html @@ -0,0 +1,177 @@ +--- +title: Personnaliser le clavier dans Firefox OS +slug: Archive/B2G_OS/Developing_Gaia/Personnaliser_le_clavier +tags: + - Firefox OS + - Guide + - keyboard +translation_of: Archive/B2G_OS/Developing_Gaia/Customizing_the_keyboard +--- +
+

Ce document explique comment ajouter des agencements de clavier contenant leur propres langues/scripts à Firefox OS v1.2 et supérieur .

+
+ +

Statut de l'application clavier Gaia intégrée & architecture système

+ +

Deux fonctionnalités majeures du clavier ont été implémentées dans Firefox OS depuis octobre 2013 :

+ + + +

Pour ajouter un nouvel agencement de clavier sur votre téléphone, vous pouvez mettre un fichier d'agencement dans Gaia et compiler l'application clavier en utilisant la configuration de compilation, ou développer votre propre application clavier et l'installer sur le téléphone. Nous allons voir comment réaliser chacune de ces opérations.

+ +

Développer votre propre application clavier

+ +

Vous pouvez vous servir de l'application clavier de Gaia comme d'un modèle. Les idées de base sont :

+ + + +

Une fois que c'est fait, vous pouvez installer votre clavier et il sera affiché dans la moitié basse de l'écran à chaque fois que l'utilisateur sera sur un champ de saisie. Pour gérer l'espace pris par le clavier, vous pouvez :

+ + + +
+

À noter: La démonstration du clavier LOL doit vous aider à mieux comprendre comment les applications clavier sont conçues, et vous servir de modèle pour vos propres applications clavier.

+
+ +

Inclure un agencement personnalisé dans l'application clavier de Gaia

+ +
    +
  1. Voir le fichier CONFIGURE de l'application clavier pour plus d'informations. Selon les langues à ajouter, vous devrez éventuellement ajouter un dictionnaire ou ajouter un Input Method (IME) interactif (pour les langages asiatiques)
    2. +
  2. Si vous ajoutez des agencements pour de nouvelles langues, vous pouvez les ajouter comme agencements par défaut dans build/config/keyboard-layouts.json.
    3. +
+ +

IME Asiatiques

+ +

Les langues de l'Asie orientale (le chinois, le japonais, et le coréen) utilisent une graphie composée de milliers de caractères. Comme il est impossible d'avoir des milliers de touches sur un clavier matériel ou logiciel, les utilisateurs se servent d'un programme d'indexation appelé éditeur de méthode de saisie (ou input method editor) (IME) qui permet de convertir une série de symboles en caractères.
+
+ La façon dont les symboles doivent être convertis et l'efficacité de la méthode reposent sur l'implémentation du programme (et repose souvent sur la science du traitement du langage naturel qui ne peut être traitée entièrement ici). Pour économiser de la mémoire, il est conseillé que les données soient compilées dans un blob binaire et interprétées comme un tableau buffer. Les structures JSON complexes ne fonctionneront pas sur certains appareils.

+ +

L'Interface du moteur IM dans l'application clavier de Gaia

+ +

Si vous disposez d'une bibliothèque IME pour convertir des symboles en caractères, vous devrez utiliser l'interface définie dans l'application clavier de Gaia pour recevoir des symboles et afficher des caractères. La version de l'API est documentée sur Github.

+ +

Nous encourageons les implémentations d'IME pour affiner cette API de Gaia.

+ +

Faire fonctionner le moteur IM avec l'agencement

+ +

Pour faire fonctionner le moteur IM avec votre agencement de clavier :

+ +
    +
  1. Ajoutez un agencement dans layout.js comme décrit précédemment.
    2. +
  2. Utilisez la propriété imEngine pour faire référence au moteur IM. Lorsque l'agencement est activé, l'application de clavier chargera le script situé à  keyboard/js/imes/<moteurIM>/<moteurIM>.js.
    3. +
  3. Paramétrez les API pour recevoir/envoyer des touches/caractères lorsque le script est chargé et initialisé.
    4. +
  4. Gérez les saisies de l'utilisateur comme vous le souhaitez. Généralement, lorsque l'utilisateur utilise des touches du clavier, cela envoie des données au moteur IM.
    5. +
+ +

Implémentations connues :

+ + + +

Les nouvelles locales et la localisation

+ +

Ce qui suit peut s'appliquer aux systèmes d'écriture alphabétiques, ceux qui utilisent un alphasyllabaire (comme la devanagari) ou un système idéographique (comme le chinois) sont plus complexes.

+ +

Généralement, deux éléments sont nécessaires : un clavier et un lexique (pour la prédiction du texte).

+ +

Créer un agencement clavier

+ +

L'agencement du clavier est contenu dans un fichier JavaScript et définit les touches du clavier et la correspondances entre les touches et les lettres et les symboles, ainsi que les options de clavier utilisées avec les pressions longues. La méthode la plus simple consiste à récupérer un clavier existant sur GitHub, de le renommer et de l'ajuster.

+ +

Tout d'abord, il faut changer l'en-tête. Si, par exemple, votre clavier d'origine est proche du clavier anglais (en-US) et que vous voulez en créer un pour la locale gaélique écossaise (gd), vous pouvez éditer le fichier suivant (grâce à un éditeur comme Notepad++) :

+ +
Keyboards.en = {
+ label: 'English',
+ shortLabel: 'En',
+ imEngine: 'latin',
+ types: ['text', 'url', 'email', 'number', 'password'],
+ autoCorrectLanguage: 'en_us',
+ menuLabel: 'English',
+ +

en :

+ +
Keyboards.gd = {
+ label: 'Scottish Gaelic',
+ shortLabel: 'gd',
+ imEngine: 'latin',
+ types: ['text', 'url', 'email', 'number', 'password'],
+ autoCorrectLanguage: 'gd_gb',
+ menuLabel: 'Gàidhlig',
+ +

Le champ label doit être celui de votre langue en anglais, le champ shortLabel ne doit pas mesurer plus de trois caractères. Il sera utilisé comme abréviation sur le clavier afin que l'utilisateur sache quel langage il utilise. Vous pouvez utiliser le code ISO de la langue ou autre chose si vous pensez que c'est pertinent. Le champ menuLabel est le nom de la langue exprimé dans la langue en question : c'est ce que l'utilisateur verra dans le menu des options.

+ +

Si l'agencement du clavier est proche de celui que vous souhaitez, la seule chose à faire consiste à modifier les caractères alternatifs (auxquels on accède avec une pression longue sur la touche) :

+ +
alt: {
+  a: 'áàâäåãāæ',
+  c: 'çćč',
+  e: 'éèêëēę€ɛ',
+  i: 'ïíìîīį',
+  o: 'öõóòôōœøɵ',
+  u: 'üúùûū',
+  s: 'ßśš$',
+  S: 'ŚŠ$',
+  n: 'ñń',
+  l: 'ł£',
+  y: 'ÿ¥',
+  z: 'žźż',
+  '.': ',?!;:'
+},
+ +

Vous pouvez ainsi changer l'ordre des caractères affichés lors de la pression longue. Pour notre exemple, le gaélique utilise plus d'accents graves que d'accents aigus et on peut changer l'ordre en :

+ +
a: 'àáâäåãāæ',
+ +

On peut aussi vouloir proposer des consonnes pointées et ajouter de nouvelles lignes comme celle-ci :

+ +
b: 'ḃ',
+ +

On peut également vérifier l'agencement alternatif (celui qui propose les nombres, la ponctuation, etc.) et le symbole monétaire affiché.

+ +

Créer un lexique

+ +

Avoir un lexique permet de proposer une prédiction à la saisie (plutôt que les utilisateurs aient à taper chaque lettre de chaque mot). Pour le construire, vous avez (idéalement) besoin d'un corpus de mots classés par fréquence d'utilisation. Par exemple, le mot demain est plus fréquemment utilisé que démiurge et devrait donc être proposé avant lorsque l'utilisateur saisit un texte.

+ +

Pour le faire, on assigne des nombres de 1 (fréquence la plus faible) à 255 (fréquence la plus forte) à chaque mot (c'est-à-dire chaque ligne) du lexique (un fichier XML dont vous pouvez trouver un exemple ici). Voici ce que vous devrez créer :

+ +
<wordlist locale="gd" description="Gàidhlig" date="1401554807" version="1">
+ <w f="255" flags="">a</w>
+ <w f="254" flags="">an</w>
+ <w f="247" flags="">agus</w>
+ +

Même si le corpus est construit rapidement à partir d'un texte suffisamment important (et en comptant les fréquences des mots de ce corpus), cela permettra d'assurer la fonctionnalité de prédiction. Si vous ne disposez pas de telles données au format numérique pour votre locale, utilisez votre connaissance du lexique pour trier manuellement les termes les plus communs selon vous.

+ +

Construire les fichiers

+ +

Une fois que vous disposez du fichier javascript et du fichier de lexique, allez dans ce répertoire gaia puis ouvrez Makefile. Ajoutez le nom du dictionnaire à votre liste (si, pour l'exemple, il est nommé gd_wordlist.xml), cela sera :

+ +
ga.dict \
+gd.dict \
+ +

Assurez vous que le fichier gd_worldlist.xml soit dans le répertoire puis lancez $ make gd.dict

+ +

Si vous êtes arrivés jusqu'à ce point et que vous n'arrivez pas à passer cette dernière étape de construction, merci de remplir un bug (Composant : Gaia Keyboard) et de joindre vos fichiers en expliquant le problème. Quelqu'un devrait pouvoir vous aider. Assurez-vous de soumettre le correctif comme une pull request, et de le marquer à revoir (review) par quelqu'un, sinon, le bug pourra passer inaperçu.

+ +

Tester une nouvelle locale

+ +

Une fois que vous avez construit et envoyé les fichiers pour la nouvelle locale, vous pouvez simplement tester votre clavier et lexique sur la page web de démonstration qui utilise l'application clavier. Vous pouvez le clôner et l'essayer localement depuis ici. En cliquant sur 'En', vous pouvez parcourir les différentes locales. Si vous ne pouvez pas trouver la vôtre, cliquez sur le bouton situé en haut à droite pour cocher/décocher les claviers que vous souhaitez tester.

+ +

Discussion et QA (qualité)

+ +

Rendez-vous sur la liste de diffusion dev-gaia ou sur le canal #gaia sur irc.mozilla.org (voir Mozilla IRC (en anglais) pour plus de détails. #mozilla-taiwan est le canal chinois pour ce sujet.
+
+  

diff --git "a/files/fr/archive/b2g_os/developing_gaia/r\303\251f\303\251rence_options_make/index.html" "b/files/fr/archive/b2g_os/developing_gaia/r\303\251f\303\251rence_options_make/index.html" new file mode 100644 index 0000000000..c5670cd54c --- /dev/null +++ "b/files/fr/archive/b2g_os/developing_gaia/r\303\251f\303\251rence_options_make/index.html" @@ -0,0 +1,331 @@ +--- +title: Référence des options de make +slug: Archive/B2G_OS/Developing_Gaia/Référence_options_make +tags: + - Apps + - Firefox OS + - Gaia + - Make + - Options + - Reference + - Référence(2) +translation_of: Archive/B2G_OS/Developing_Gaia/make_options_reference +--- +
+

La commande make est utilisée à l'intérieur du dépôt Gaia pour créer un profil qui peut être chargé vers un appareil ou être lancé dans une version de B2G Desktop. Cet article illustre en détail les différentes options pour make.

+
+ +
+

Note : De nombreuses variables d'environnement sont utilisées dans le fichier Makefile. Celles-ci pouvant être supprimées à l'avenir, attention à ne pas construire d'outils qui reposeraient sur ces variables.

+
+ +

Les profils créés sont généralement enregistrés à la racine du répertoire de Gaia, par exemple /gaia/profil. Un profil contient généralement les éléments suivants :

+ + + +
+

Note : Lorsque vous souhaitez construire un nouveau profil après en avoir déjà construit un, vous devez supprimer le profil existant au préalable.

+
+ +

Utilisation par défaut

+ +
make
+ +

Cette commande créera une version neutre de Gaia, qui ne peut pas être utilisée pour le débogage. Pour construire une version avec une certaine marque, vous devrez utiliser Official Mozilla branding make ; pour construire une version de débogage, vous devrez utiliser Debug make.

+ +

Envoyer vers l'appareil

+ +
make install-gaia
+
+make reset-gaia
+
+ +

Une fois ADB (Android Debug Bridge) paramétré, ces « cibles » de make enverront Gaia sur l'appareil. install-gaia enverra uniquement les mises à jour depuis le répertoire de travail alors que reset-gaia nettoiera l'ensemble des configurations, profils, applications web et données en base avant d'envoyer Gaia sur l'appareil (cela créera une nouvelle base de données pour les réglages).

+ +
+

Note : Lorsque les commandes make install-gaia / make reset-gaia sont utilisées, Gaia est envoyée vers le téléphone avec une résolution par défaut qui est celle des ressources utilisées (1x). Pour définir un niveau de définition plus élevé, vous devrez utiliser les options GAIA_DEV_PIXELS_PER_PX ou GAIA_DPPX (voir le paragraphe Images en haute résolution pour plus de détails sur ces options.). Lorsque vous envoyez Gaia sur votre appareil de cette façon, il est nécessaire de préciser (en plus des options des autres options de make) le facteur de forme de l'appareil. Ainsi pour un Flame, on aura make install-gaia GAIA_DEV_PIXELS_PER_PX=1.5 (ou 2, ou 2.5, etc.). Pour plus d'informations, voir le tableau des facteurs de forme dans l'article icônes de 512 pixels pour l'affichage sur l'appareil.

+
+ +

Construire des applications spécifiques

+ +
APP=system make
+
+APP=system make install-gaia
+ +

Lorsqu'un profil existe déjà, l'option APP vous permet de spécifier les applications à réempaqueter plutôt que de réempaqueter puis de réenvoyer toutes les applications sur l'appareil. On notera que, bien que cette commande envoie le nouveau paquet de l'application ainsi que le manifeste, les changements du manifeste (ex. : les nouvelles permissions ou les agencements de clavier) ne sont pas détectés par Gecko.

+ +

Définir un répertoire spécifique pour le profil

+ +

Vous pouvez définir un répertoire spécifique dans lequel construire votre profil en utilisant l'option PROFILE_FOLDER. Par exemple :

+ +
PROFILE_FOLDER=profile-b2g-desktop make
+ +

Construire pour les différents types d'appareil

+ +

Il existe des options pour spécifier le type d'appareil visé.

+ +

Construire une version de Gaia pour téléphone

+ +
GAIA_DEVICE_TYPE=phone make
+ +

Les applications pour cette versions seront celles de la liste /gaia/build/config/phone/apps-engineering.list.

+ +

Construire une version de Gaia pour tablette

+ +
GAIA_DEVICE_TYPE=tablet make
+ +

Les applications utilisées pour la construction seront celles de la liste /gaia/build/config/tablet/apps-engineering.list.

+ +

Créer une version spark de Gaia

+ +
GAIA_DISTRIBUTION_DIR=distros/spark make reset-gaia
+
+ +

Installe spark sur votre appareil. L'option du build.sh de B2G est celle-ci :

+ +
GAIA_DISTRIBUTION_DIR=distros/spark ./build.sh
+
+ +

Les différents types de version

+ +

make dispose d'options pour préciser le type de version qu'on souhaite construire (chaque type de version ayant un objectif distinct) :

+ +

Version de production

+ +
PRODUCTION=1 make
+ +

Cette instruction crée une version de production de Gaia. Cela signifie que :

+ + + +
+

Note : Pour cette instruction, vous pouvez également utiliser l'alias make production.

+
+ +

Version de débogage

+ +
DEBUG=1 make
+ +

La variable DEBUG permet de lancer Gaia avec des applications hébergées sur un serveur web intégré accessible sur le port GAIA_PORT, plutôt que les applications soient empaquetés et aient besoin d'être réempaquetés à chaque modification. Cela permet de tester plus facilement. Si vous lancez ce profil avec une version de Firefox Nightly, vous pourrez utiliser une version spécifique des outils de développement adaptée à B2G.

+ +

De plus :

+ + + +
+

A noter: Il y a un bogue ouvert (bug 1180103) lors de l'utilisation de profils debogage Gaia, provoque l'affichage d'un écran d'accueil vide quand il est lancé au travers de Firefox OS Simulator (ou WebIDE, ou autre.) Cela peut être contourné en construisant avec DEBUG=1 DESKTOP=0 make à la place (voir Version_de_débogage_pour_l'appareil.)

+
+ + +

Version de débogage pour l'appareil

+ +
DEVICE_DEBUG=1 make
+ +

Cela désactive l'écran de déverrouillage et active le débogage via les outils ADB, ce qui permet de déboguer ce qui se passe sur l'appareil.

+ +

Dans Firefox OS > 1.2, il faut préciser ce paramètre si vous voulez déboguer des applications web dans le WebIDE.

+ +

Version de débogage sur ordinateur

+ +
DEBUG=1 DESKTOP=0 make
+ +

Cette option permet de créer une version de débug pour ordinateur, à utiliser avec B2G pour ordinateur (B2G desktop).

+ +

Version officielle de Mozilla

+ +
MOZILLA_OFFICIAL=1 make
+ +

Cette option permet de construire une version officielle de Mozilla.

+ +

Version pour l'utilisation en test(dogfood)

+ +
DOGFOOD=1 make
+ +

Les options et utilitaires liés à une utilisation à des fins de tests sont activés. Par exemple, l'application sur les retours/informations d'utilisation (feedback) sera activée.

+ +

Version pour les applications système

+ +
B2G_SYSTEM_APPS=1 make
+ +

Cette variable d'environnement vous permet d'envoyer une application sur /system/b2g plutôt que sur /data/local. Vous devriez utiliser cette option lorsque vous travaillez sur une version utilisateur. Cette variable est définie automatiquement lorsque vous utilisez la commande make production. Cette variable peut également être utilisée avec install-gaia ou reset-gaia.

+ +

Personnaliser et distribuer une version

+ +
GAIA_DISTRIBUTION_DIR=./dir
+ +
+

Note : Lire l'article Construire une version de Gaia customisée pour plus d'informations.

+
+ +

Les options pour le débogage/développement

+ +

Certaines options de make permettent d'activer/désactiver des fonctionnalités de débogage ou de modifier des réglages utiles pour le développement.

+ +

Activer le débogage à distance

+ +
REMOTE_DEBUGGER=1
+ +

Cela permet d'utiliser le débogage à distance pour l'appareil. Cela aura le même effet que d'activer l'option dans les options de développement.

+ +

Version avec optimisation du JavaScript

+ +
GAIA_OPTIMIZE=1 make
+ +

Cette option déclenche un processus d'optimisation sur le code JavaScript utilisé pour Gaia qui consiste à concaténer/compresser les fichiers. Cette option est automatiquement utilisée avec make production. Cette option peut également être utilisée avec install-gaia ou reset-gaia.

+ +

Ressources images en haute résolution

+ +
GAIA_DEV_PIXELS_PER_PX=1.5 make
+ +

Ou, en utilisant l'alias :

+ +
GAIA_DPPX=1.5 make
+ +

Lors de l'empaquetage de l'application, cette option remplacera les images par leurs équivalents *@1.5x.(gif|jpg|png) si ces fichiers existent. Vous aurez besoin d'utiliser l'option ci-dessus au sein d'une commande make standard, par exemple :

+ +
GAIA_DEV_PIXELS_PER_PX=1.5 make reset-gaia
+
+GAIA_DEV_PIXELS_PER_PX=1.5 make install-gaia
+ +

Pour information, voici la liste des résolutions d'écran actuellement ciblées par Gaia :

+ + + +

Utilisez l'option GAIA_DEV_PIXELS_PER_PX pour être sûr que les images s'affichent correctement sur les appareils qHD et WVGA. Voir l'article un pixel n'est pas un pixel pour plus d'informations sur les pixels physiques et les pixels CSS.

+ +

Lancer les tests d'intégration

+ +

Vous pouvez lancer les tests d'intégration de Gaia en utilisant make. Voir Gaia integration tests pour plus de détails.

+ +

Lancer les tests de performance Raptor

+ +

Vous devez effectuer une configuration permettant de lancer les tests Raptor sur votre périphérique, avant de lancer les tests. Voir Raptor pour plus de détails.

+ +
make raptor
+
+ +

Profil pour les appareils avec peu de mémoire

+ +
GAIA_MEMORY_PROFILE=low make
+ +

Cette variable permet de générer un profil de Gaia qui utilise peu de mémoire. Cela permet de construire un profil adapté aux appareils avec peu de mémoire comme le Tarako.

+ +

Désactiver l'écran de première utilisation (first time use experience - FTU)

+ +
NOFTU=1
+
+ +

Cette variable d'environnement permet de désactiver l'écran affiché lors de la première utilisation.

+ +

Désactiver l'écran de dé/verrouillage

+ +

Vous pouvez désactiver l'écran qui verrouille l'appareil en utilisant l'option NO_LOCK_SCREEN. Par exemple :

+ +
NO_LOCK_SCREEN=1 make
+ +

La montée en charge pour le volume de données

+ +

Plusieurs volumes de données de référence ont été créés pour permettre aux développeurs et aux testeurs d'installer rapidement un grand volume de données utilisées par plusieurs applications (généralement ce chargement a lieu sur un appareil nouvellement flashé).

+ +

Les commandes suivantes permettent de charger différents volumes (à lancer depuis le répertoire de Gaia) :

+ +
make reference-workload-light
+ + + +
make reference-workload-medium
+ + + +
make reference-workload-heavy
+ + + +
make reference-workload-x-heavy
+ + + +

Ces cibles peuvent être utilisées avec la variable d'environnement APP ou avec la variable APPS (contenant des noms d'applications, séparés par des espaces). Par exemple :

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

Les applications utilisables ici sont :

+ +
APPS="gallery music video communications/contacts sms communications/dialer"
+ +

Pour installer des fichiers de musique dans la charge de données, vous devez avoir installé mid3v2. Cet utilitaire peut être installé avec la commande suivante :

+ +
sudo apt-get install python-mutagen
+ +

Si vous utilisez Fedora ou RHEL, vous pouvez utiliser :

+ +
sudo yum install python-mutagen
+ +

Construire la documentation

+ +

La documentation relative à Gaia peut être construite grâce à jsdoc3. Pour générer la documentation, vous pouvez utiliser la commande suivante :

+ +
make docs
+ +

Activation des agencements de claviers et des dictionnaires

+ +

Pour activer les agencements de clavier et les dictionnaires liés au moteur de saisie (IME pour Input Method Editor en anglais), vous pouvez utiliser la commande suivante :

+ +
GAIA_KEYBOARD_LAYOUTS=en,zh-Hant-Zhuyin,el,de,fr,zh-Hans-Pinyin make
+ +

Actuellement, tous les claviers ne sont pas chargés par défaut en raison de problèmes d'espace disque. bug 1029951 est en cours de résolution pour permettre de découpler les agencements et les dictionnaires (pour permettre aux utilisateurs de télécharger le dictionnaire).

diff --git a/files/fr/archive/b2g_os/developing_gaia/soumettre_correctif_pour_gaia/index.html b/files/fr/archive/b2g_os/developing_gaia/soumettre_correctif_pour_gaia/index.html new file mode 100644 index 0000000000..323ed68cd7 --- /dev/null +++ b/files/fr/archive/b2g_os/developing_gaia/soumettre_correctif_pour_gaia/index.html @@ -0,0 +1,119 @@ +--- +title: Soumettre un correctif pour Gaia +slug: Archive/B2G_OS/Developing_Gaia/Soumettre_correctif_pour_Gaia +tags: + - Bugzilla + - Firefox OS + - Gaia + - GitHub + - contribution + - patch + - submitting +translation_of: Archive/B2G_OS/Developing_Gaia/Submitting_a_Gaia_patch +--- +
+

À cette étape, vous devriez avoir apporté une modification au code de Gaia et avoir testé que cette modification n'impacte pas Gaia. La prochaine étape consiste à soumettre votre correctif sur le dépôt central. Cet article explique ces étapes.

+
+ +

Soumettre des correctifs pour Gaia peut paraitre un peu déroutant, jusqu'à ce que vous en ayez pris l'habitude. Cela implique d'utiliser Bugzilla et Github, ainsi que l'utilisation de drapeaux spéciaux dans Bugzilla pour que tout se déroule correctement. Vous pouvez aussi voir à quoi ressemble le processus complet, dans la section Envoi_manuel_d'un_correctif; cependant, nous vous conseillons d'utiliser l'outil Autolander au quotidien, sauf si vous avez une bonne raison de ne pas le faire, voir la section suivante.

+ +

Envoi de correctif de manière aisée avec Autolander

+ +

Autolander est un outil qui prend en charge automatiquement, beaucoup d'étapes nécessaires à l'envoi d'un correctif pour Gaia (et d'autres projets qui l'utilisent), réduisant le temps, et les erreurs possibles, tout au long de la procédure. Autolander réalise l'automatisation des processus entre Bugzilla et Github en attachant les pull requests (de Github) aux bugs (de Bugzilla), et en les intégrants une fois que l'attachement à reçu un drapeau r+, et que le mot-clé autoland est ajouté au bug. Pour utiliser Autolander :

+ +
    +
  1. Tout d'abord, si le bug correspondant n'existe pas, créez-en un pour le produit Firefox OS, et donnez-lui un titre explicite détaillant le but de votre correctif.
    2. +
  2. Vous pouvez alors créer une pull request pour votre correctif. Si vous avez suivi ce guide depuis le début, vos changements devraient être présents dans une branche spécifique, unique, de votre fork en local. Pour ajouter vos modifications, faites git add . puis git commit -m 'mon message de commit'.
    3. +
  3. 'mon message de commit' devra être modifié afin de contenir le numéro de bug de Bugzilla et le titre du bug afin de donner plus d'informations sur ce que fait le correctif et qui doit l'examiner. Par exemple : + 
    Bug 9999999 - Corrige ce bug Toto R=jeanbiche
    +
    4. +
  4. Poussez votre code sur le fork de Gaia présent sur Github puis créez une pull request pour mettre à disposition le code de ce correctif.
    5. +
  5. Une fois que le pull request est ouvert, celui-ci est automatiquement attaché, au bug trouvé dans le titre du PR.
    6. +
  6. Prochainement, une fois que cet attachement aura reçu le drapeau r+ par un validateur, vous pourez ajouter le mot-clé autoland, dans le champ mots-clés "keywords" de bugzilla pour intégrer le code dans la branche master de Gaia. Autolander intègrera donc le code au master, mettra votre commit dans le bug, et marquera le bug comme résolu et corrigé "resolved fixed". Cependant, pour l'instant, cette fonctionnalité est toujours en cours de développement, donc pour le moment, vous devez ajouter le mot-clé "keyword" checkin-needed, et attendre qu'une personne intègre le code pour vous.
    7. +
+ +
+

A noter : Autolander lance des tests d'intégration avant d'intégrer un correctif au master. Si les tests d'intégration échouent, Autolander refusera d'intégrer le code. D'autres validations basiques sont effectuées, comme s'assurer que votre pull request et votre message de commit contiennent bien un numéro de bug.

+
+ +
+

A noter : Les pull request sont intégrés par ordre d'arrivé. Les pull request sont fusionnés à une branche d'intégration, et les tests d'intégration sont lancés en parallèle dans cette branche. Si un PR échoue les tests d'intégration, il est rejeté de la branche d'intégration, et nous reconstruisons la branche d'intégration avec les commits restants. Quand un commit passe, le master progresse de ce commit.

+
+ +

Envoi manuel d'un correctif

+ +

Pour soumettre manuellement votre correctif à Gaia, suivez ces étapes :

+ +
    +
  1. Tout d'abord, si le bug correspondant n'existe pas, créez-en un pour le produit Firefox OS, et donnez-lui un titre explicite détaillant le but de votre correctif.
    2. +
  2. Vous pouvez alors créer une pull request pour votre correctif. Si vous avez suivi ce guide depuis le début, vos changements devraient être présents dans une branche spécifique, unique, de votre fork en local. Pour ajouter vos modifications, faites git add . puis git commit -m 'mon message de commit'.
    3. +
  3. 'mon message de commit' devra être modifié par une phrase contenant le titre du bug, ainsi que des informations supplémentaire sur ce que fait le correctif et qui doit l'examiner. Par exemple : + 
    Corrige ce bug Toto R=jeanbiche
    + Il est vraiment préférable d'indiquer un numéro de bug dans le message du commit, mais ne pas le faire est le seul moyen de contourner Autolander. Inutile de vous dire que ce n'est pas recommandé, vous devriez vraiment utiliser Autolander.
    4. +
  4. Poussez votre code sur le fork de Gaia présent sur Github puis créez une pull request pour mettre à disposition le code de ce correctif.
    5. +
  5. Ajoutez l'URL de cette pull request comme pièce jointe du bug sur Bugzilla (utilisez le lien « Add an attachment link », choisissez le mode texte pour la pièce jointe puis saisissez l'URL de la pull request comme contenu de la pièce jointe, vous pouvez ensuite saisir une description)
    6. +
  6. Pour cette pièce jointe sur la fiche Bugzilla, demandez à ce que votre correctif soit passé en revue. Pour le faire, ajoutez l'étiquette (flag) review: ? à la pièce jointe en incluant le nom du responsable du module concerné par votre code (voir la page des responsables de module pour plus d'informations (en anglais).)
    7. +
  7. Attendez qu'une personne soit affectée pour passer en revue votre correctif. À cette étape, généralement, cette personne demandera d'ajouter ou non des modifications à la pull request (PR) sur Github et de lier ces changements sur Bugzilla.
    8. +
  8. Effectuez les modifications demandées sur la même PR que précédemment puis reliez une pièce jointe avec le flag review: ?.
    9. +
  9. Une fois que vous avez effectué les modifications demandées et que vous avez obtenu le flag r+ (qui signifie que le correctif a été revu/approuvé), vous devriez aplatir (squash) vos commits en un seul (voir le paragraphe Tips_on_Gaia_Rebasing ci-après).
    10. +
  10. Ajoutez un mot-clé checkin-needed dans le champ adéquat (keywords). Pour cette étape, vous devez désormais attendre que quelqu'un intègre (land en anglais) votre correctif au code source de Gaia.
    11. +
  11. Félicitations, votre code fait maintenant partie de Gaia et vous avez contribué à Firefox OS !
    12. +
+ +
+

Note : Il est recommandé de n'avoir qu'un seul commit par revue.

+
+ +
+

Note : Pour plus d'informations sur la soumission de correctifs, lire le fichier contributing.md sur le dépôt principal.

+
+ +

Conseils pour refonder son code de Gaia

+ +

La branche master de Gaia évolue constamment (plusieurs fois par jour). Si vous avez passé deux heures à construire un correctif, il se peut que la branche ait été modifiée.
+
+ Sur votre branche liée à votre correctif (ex : mon-correctif), vous pourrez refonder (rebase en anglais et pour git) grâce aux commandes suivantes :

+ +
git checkout -b mon-correctif-r1
+git pull --rebase upstream master
+ +

S'il n'y a pas de conflits, vous pouvez continuer avec :

+ +
git checkout mon-correctif
+git pull --rebase upstream master
+git branch -D mon-correctif-r1
+ +

Si vous avez des conflits, discutez-en avec le développeur qui a apporté les changements conflictuels puis répétez cette procédure une fois les conflits résolus.

+ +

Bugs de statut et bugs techniques

+ +

Certaines personnes chez Mozilla sont des sheriffs. Les sheriffs sont responsables de la fusion du code et de la maintenance des statuts des branches. Étant donné qu'il y a un nombre limité de sheriffs pour surveiller les échecs des tests sur Firefox OS, il est relativement difficile pour eux de détecter tous les correctifs défectueux.

+ +

C'est pourquoi, pour Firefox OS, nous préférons ouvrir un nouveau bug pour livrer de nouveaux correctifs sur un problème s'il y a des échecs lorsqu'un correctif est passé en revue. Cela entraîne quelques complications pour le suivi des statuts pour les équipes qualité et gestion de projet.

+ +

Pour cela, les bugs sont séparés entre bugs de statut et bugs techniques :

+ + + +
+

Note : Si ce bug correspond à un scénario d'utilisation (user story en anglais), le chef de projet en charge devrait compléter le champ correspondant (user story) ainsi que les critères d'acceptation.

+
+ +

Réparer la situation si vous avez intégré un correctif sur un bug de suivi de statut

+ +

Si vous avez accidentellement livré un correctif sur un bug de suivi, qui ait été revu et intégré au code commun, voici ce que vous devez faire :

+ +
    +
  1. Utilisez le bouton « Clone this bug » situé en bas à droite de Bugzilla pour créer un nouveau bug et reproduire la plupart des champs du bug initial. Vérifiez ques les champs whiteboard, keyword, et STR/user story ont bien été copiés-collés dans le nouveau bug.
    2. +
  2. Mettez ce nouveau bug comme étant bloqué par l'ancien. Ce nouveau bug sera le nouveau bug de suivi de statut.
    3. +
  3. Utilisez le flag « needinfo » pour alerte le chef de projet concerné que le bug de statut à changé. Voici la liste des adresses e-mail des différents chefs de projets pour Firefox OS sur le wiki (en anglais).
    4. +
  4. Créez un nouveau bug technique décrivant les étapes pour reproduire et/ou les critères d'acceptations. Utilisez ce bug pour bloquer le nouveau bug de suivi de statut.
    5. +
  5. Essayez d'apporter un correctif pour ce nouveau bug. Bidouillez-bien :) !!!
    6. +
+ +

Livrer des correctifs sur d'anciennes branches

+ +

Sur les bugs, vous pouvez voir les étiquettes concernant les différents versions. Si vous souhaitez soumettre un correctif pour une ancienne version de Firefox OS, vous devez vérifier que celui-ci respecte les règles d'acceptation expliquées sur la page d'intégration à B2G  (en anglais).

diff --git a/files/fr/archive/b2g_os/developing_gaia/tester_modifications_gaia/index.html b/files/fr/archive/b2g_os/developing_gaia/tester_modifications_gaia/index.html new file mode 100644 index 0000000000..29cbfc8296 --- /dev/null +++ b/files/fr/archive/b2g_os/developing_gaia/tester_modifications_gaia/index.html @@ -0,0 +1,119 @@ +--- +title: Tester les modifications du code de Gaia +slug: Archive/B2G_OS/Developing_Gaia/Tester_modifications_Gaia +tags: + - Firefox OS + - Gaia + - Guide + - Integration + - Testing + - UI +translation_of: Archive/B2G_OS/Developing_Gaia/Testing_Gaia_code_changes +--- +
+

Une fois que vous avez apporté vos changements au code de Gaia et que ça semble fonctionner, vous devez effectuer des tests pour vous assurer que vos modifications fonctionnent, y compris avec le reste du code. Une fois que c'est le cas, vous pourrez proposer un correctif pour le projet. Cet article explique cette procédure de test.

+
+ +

La procédure de test consiste généralement à :

+ + + +

La suite de l'article explique chacune de ces étapes.

+ +

Déboguer avec les outils standards

+ +

Si vous êtes développeur web, vous serez familier avec le débogage de Gaia. Dans l'article lancer Gaia dans Firefox pour ordinateur et comment apporter des modifications simples, les outils de développement nécessaires ont déjà été présentés. Pour modifier le code de façon plus complexe, vous devrez tirer pleinement parti des outils de débogage présent dans l'écran de Firefox pour ordinateur.
+
+ Note : Pour plus d'instructions sur l'utilisation de ces outils, voir la section de MDN sur les outils de développement.

+ +

Les tests automatisés

+ +

Une fois le code édité, vous devez lancer la suite de tests standards qui accompagnent Gaia avant de soumettre un correctif. Cela doit vous permettre de vous assurer que vos modifications n'affectent pas les fonctionnalités essentielles existantes du téléphone. Les tests que vous pouvez lancer sont :

+ + + +

Généralement, il est demandé que lancer ces tests avant de soumettre un correctif. Si c'est votre première contribution, vous pouvez envoyer votre correctif sans avoir fait les tests. En revanche, vous devez demander de l'aide pour pouvoir lancer les tests à l'avenir. Avant de lancer les tests, veillez à mettre à jour votre dépôt de Gaia afin de disposer de la dernière version des tests.

+ +
+

Note : Pour plus d'informations, vous pouvez lire la page sur les tests automatisés de Firefox OS.

+
+ +
+

Note : Si possible, lancez ces tests sur un vrai appareil si vous en avez un (certaines fonctionnalités ne sont pas supportées dans un émulateur). Si vous ne disposez pas d'un appareil Firefox OS, vous pouvez lancer les tests avec B2G Desktop ou Firefox Nightly.

+
+ +

Les tests unitaires

+ +

Les tests unitaires sont des tests effectués sur des fragments (unités) de code, assemblés dans une application plus large. Pour le projet Gaia, ces unités sont les applications individuelles. Gaia utilise :

+ + + +

Pour installer et mettre en place un serveur de tests unitaires, vous pouvez lancer les commandes suivantes (cela peut prendre quelques minutes, vous pouvez en profitez pour vous faire une tasse de thé) :

+ +
DEBUG=1 make
+export FIREFOX=/Applications/FirefoxNightly.app/Contents/MacOS/firefox
+bin/gaia-test
+
+ +

Celà ouvrira une page web en local, avec une liste de tests unitaires. Pour les lancer :

+ + + +

Tout en maintenant la page web local ouverte, vous pouvez lancer la suite de tests complète, dans une nouvelle fenêtre de terminal, avec la commande suivantes :

+ +
make test-agent-test
+ +
+

Note : Cela peut prendre beaucoup de temps étant donné la quantité de tests à effectuer (jusqu'à environ une heure). Dans la plupart des cas, il n'est nécessaire que de lancer les tests pour l'application que vous avez modifiée. Vous pouvez restreindre les tests en ajoutant  APP=<nom du dossier de l'application> à la fin de la commande : par exemple APP=settings.

+
+ +
+

Note : Pour plus d'informations sur les tests unitaires, vous pouvez également lire la page sur les tests unitaires de Gaia.

+
+ +

Les tests d'intégration

+ +

Tester l'intégration consiste à tester comment les différentes unités de code fonctionnent entre elles. C'est l'étape logique qui intervient après les tests unitaires. Les tests d'intégration de Gaia utilisent Marionnette qui permet de lancer un script en JavaScript avec un serveur basé sur Python. Ce script peut communiquer avec Gecko et peut donc contrôler le navigateur ainsi que l'appareil Firefox OS et les faire interagir.

+ +

Pour lancer les tests d'intégration, vous pouvez lancer la commande suivante :

+ +
make test-integration
+ +
+

Note : De même qu'avec les tests unitaires, lancer toute la suite de tests pour l'intégration peut prendre beaucoup de temps. Vous pouvez ajouter APP=<dossier de l'application> à la fin de la commande pour ne tester qu'une seule application, par exemple APP=calendar.

+
+ +
+

Note: Pour lancer les tests d'intégration sur un périphérique différent, il faut ajouter GAIA_DEVICE_TYPE=<device type="" name=""> à la commande précédente pour spécifier le type de périphérique, par exemple GAIA_DEVICE_TYPE=tv. Si ce n'est pas fait, les tests peuvent échouer.

+
+ +
+

Note : Pour plus d'informations sur les tests d'intégration, lire l'article sur les tests d'intégration de Gaia.

+
+ +

Les tests de performance

+ +

Les tests de performance de Gaia sont lancés avec l'utilitaire Raptor CLI. Raptor permet d'automatiser le lancement d'une application plusieurs fois et d'afficher des statistiques sur sa durée de démarrage. Après un test, Raptor affiche de plus les informations d'utilisation mémoire de l'application.

+ +

Pour lancer les tests de performance Raptor, voir Raptor: Bien commencer.

+ +

Les tests d'interfaces utilisateurs

+ +

Voir la page d'introduction sur les Tests d'interface utilisateur Gaia.

diff --git a/files/fr/archive/b2g_os/dual_boot_de_b2g_et_android_sur_sgs2/index.html b/files/fr/archive/b2g_os/dual_boot_de_b2g_et_android_sur_sgs2/index.html new file mode 100644 index 0000000000..3689a5cd26 --- /dev/null +++ b/files/fr/archive/b2g_os/dual_boot_de_b2g_et_android_sur_sgs2/index.html @@ -0,0 +1,110 @@ +--- +title: Dual boot de B2G et Android sur SGS2 +slug: Archive/B2G_OS/Dual_boot_de_B2G_et_Android_sur_SGS2 +tags: + - Archive + - B2G + - Mobile +translation_of: Archive/B2G_OS/Building +--- +

+ +

+

Avertissement : Cette procédure ne fonctionne plus réellement. Elle fonctionne seulement avec Android 4 (Ice Cream Sandwich) et Siyah Kernel v 5.0.1. Les versions plus récentes ne fonctionnent pas non plus. Considerez ce guide comme archivé, vous l'utilisez à vos risques et périls.

+

+ +

Si vous voulez tester B2G de temps en temps mais continuer à utiliser Android comme OS principal et vous possédez un Samsung Galaxy S2, vous pouvez installer B2G dans une partition séparée (qui est déjà présente dans le téléphone) et choisir qui booter au démarrage du système.

+ +

Prérequis

+ +

Pour installer le dual boot Android et B2G, vous devez respecter ces prérequis :

+ + + +

Liste des opérations

+ +

Il faut effectuer plusieurs opérations dans l'ordre pour obtenir un dual boot opérationel. Les instructions suivantes doivent être effectuées en premier uniquement.

+ +

Pour utiliser heimdall sans accès root, vous devez créer un fichier android.rules (la partie précédent l'extension .rules est arbitraire) et le placer dans /etc/udev/rules.d. Le fichier doit contenir la ligne suivante:

+ +
SUBSYSTEM=="usb", ATTRS{idVendor}=="04e8", MODE="0666"
+ +

Pour activer cette règle, vous devez redémarrer udev:

+ +
sudo service udev restart
+ +

et débrancher/rebrancher le téléphone. La règle ci-dessus va également autoriser adb à accèder au SGS2 sans droit root.

+ +

Flasher le kernel Siyah

+ +

Le kernel Siyah kernel est obligatoire pour le dual boot, car c'est lui qui le gère. Une fois que vous avez téléchargé et décompressé le fichier .tar, vous optiendrez un fichier nommé zImage. Pour le flasher sur votre téléphone, vous devez suivre ces étapes:

+ +
    +
  1. Eteignez votre téléphone
    2. +
  2. Redémarrez en mode Download (appuyez simultanément sur les boutons "volume bas" + "home" + "power"  puis quand le téléphone le demandera, "volume haut")
    3. +
  3. Utilisez heimdall pour flasher le kernel grâce à la commande suivante (le téléphone doit être connecté au PC): + 
    heimdall flash --kernel /path/to/zImage
    +
    4. +
+ +

Une fois le kernel flashé, le téléphone va redémarrer.

+ +

Préparer l'environnement de la rom B2G

+ +

Une fois le kernel Siyah installé, il faut utiliser ces fonctions pour préparer l'environnement à l'installation de l'image B2G dans la deuxième partition. Suivez ces étapes :

+ +
    +
  1. Eteignez votre téléphone
    2. +
  2. Redémarrez en mode recovery (Appuyez simultanément sur les boutons "volume haut" +  "home" + "power")
    3. +
  3. Dans l'interface tactile CWMR, allez dans "dual-boot options" -> Wipe 2ndROM data/cache -> Yes - Wipe. Cette opération prendra un certain temps.
    4. +
+ +

Une fois l'opération terminée, sélectionnez Retour puis faites Redémarrer maintenant pour redémarrer votre téléphone. Si vous regardez dans la carte SD de votre téléphone vous verrez qu'il y a désormais un dossier .secondrom contenant 2 fichiers nommés cache.img et data.img.

+ +

Mise à jour de B2G

+ +

Les opérations suivantes doivent être réalisées à chaque compilation d'une nouvelle version de B2G.

+ +

Afin de simplifier les instructions en ligne de commandes, il est recommandé de copier tous les fichiers nécessaires dans le même dossier (celui de votre choix). Les fichiers suivant sont nécessaires et doivent être copiés à l'intérieur du dossier:

+ + + +

Une fois que tout vos fichiers sont réunis au même endroit, effectuez les étapes suivantes:

+ +
    +
  1. Créez un fichier data.img file sur le fichier userdata.img.  Vous pouvez le faire avec la commande suivante: + 
    simg2img userdata.img data.img
    +
    2. +
  2. Mettez le fichier data.img file dans le dossier .secondrom de votre téléphone. Vous pouvez le faire soit via le mode de stockage de fichier sur votre téléphone puis en le connectant à votre PC, sinon si USB Debug est activé, vous pouvez utiliser adb: + 
    adb push /path/to/data.img /sdcard/.secondrom/data.img
    +
    3. +
  3. Eteignez votre téléphone
    4. +
  4. Redémarrez le en mode téléchargement (pressez en même temps le bouton "volume bas" + home + le bouton power ensuite, lorsque cela sera demandé appuyez sur le bouton "volume haut")
    5. +
  5. Utilisez heimdall pour flasher le firmware B2G dans la seconde partition: + 
    heimdall flash --hidden system.img
    +
    6. +
+ +

Une fois cela fait, votre téléphone va redémarrer et au démarrage vous pourrez démarrer sur votre seconde rom (B2G) en appuyant sur le bouton home pendant le décompte. Si tout s'est bien passé, une fois que vous aurez fini de démarrer sur B2G, un écran noir apparaîtra sur votre téléphone. Il vous faut maintenant installer Gaia.

+ +
Note: Tout dépend de la façon dont vous voulez tester B2G, mais vous pouvez ne pas avoir envie de mettre un nouveau fichier data.img file sur le téléphone à chaque mise à jour de B2G, sachant qu'il effacera toutes vos préférences, pour les applications installées et en général tout ce que vous aurez fait pendant l'utilisation de B2G.
+ +

Opérations de démarrage

+ +

Les opérations suivantes doivent être réalisées à chaque démarrage dans B2G.

+ +

Malheureusement, il n'y a pas de technique simple permettant d'ajouter Gaia à l'intérieur de l'image système B2G system.img , de plus il sera perdu dès que vous éteindrez votre téléphone. De ce fait, il vous faudra installer Gaia à chaque démarrage sur B2G. Pour installer Gaia effectuez les commandes suivantes dans une console après avoir démarré sur B2G (vous devez avoir un écran noir) et avoir connecté votre téléphone à votre PC:

+ +
cd B2G/gaia
+GAIA_DOMAIN=foo.org make install-gaia
+ +

Une fois le téléchargement de Gaia terminé, l'interface B2G apparaitra sur votre écran.

diff --git a/files/fr/archive/b2g_os/firefox_os_apps/building_blocks/index.html b/files/fr/archive/b2g_os/firefox_os_apps/building_blocks/index.html new file mode 100644 index 0000000000..05289045d0 --- /dev/null +++ b/files/fr/archive/b2g_os/firefox_os_apps/building_blocks/index.html @@ -0,0 +1,195 @@ +--- +title: Firefox OS Building Blocks +slug: Archive/B2G_OS/Firefox_OS_apps/Building_blocks +tags: + - Design + - Design patterns + - Firefox OS + - NeedsTranslation + - TopicStub + - UI + - building blocks +translation_of: Archive/B2G_OS/Firefox_OS_apps/Building_blocks +--- +

+ +
+

The Firefox OS Building Blocks are reusable UI components (also called 'common controls') that reflect OS-wide design patterns. Building Blocks are used to create the interfaces of all Gaia default apps. You are free to make use of these components in your own Firefox OS apps, or general Web apps.

+
+ +

Using the Firefox OS Building Blocks

+ +

The code for the Firefox OS Building Blocks can be found in the Gaia Github repo under shared/style. Here, you can find a CSS file that contains the CSS for that particular Building Block, and a sub directory containing the HTML fragments and image assets. If you are creating your own standalone Web app, you can simply copy the CSS, HTML and image asset files across into your own project; if your app is intended to be installed on Firefox OS only (or you want to use these features only when the app is being used on Firefox OS), then you can link to the versions available inside Gaia.

+ +

The pages for the individual Building Block implementations can be found under the pages for each building block — see next section. These contain instructions on how to implement each one.

+ +
+

Note: The version 2.0 building block code is used in Firefox OS releases 2.0 through 2.2. Version 2.3 sees an update, with the building blocks being reimplemented using Web components — these provide the same functionality, but implemented in a much more powerful, flexible way. You'll see 2.3 pages appear underneath the main building block pages covering these Web components as soon as the information is available.

+
+ +
+

Note: We also have an old guide covering the v1.x building blocks used in older versions of Firefox OS. This is mainly for legacy information.

+
+ +

Web components preliminary setup

+ +

This section details the preliminary setup needed to use Gaia Web components.

+ +

Web components browser support

+ +

To use Gaia Web components at all, you need to run them using a browser that supports Web components. The state of support is as follows:

+ + + +

Web components are supported in Firefox OS from v2.1 onwards, although most of them weren't actually implemented until v2.3. Be aware also that currently Web components won't work for Firefox OS apps below internal (certified) level. This restriction should be lessened in the future.

+ +
+

Note: If your app is certified, the components will just work. You don't need to set a specific manifest permission.

+
+ +

Web components installation notes

+ +

Gaia Web components are installed in your app using the Bower package manager. To install this, you first need Node.js/npm and Git installed. Once they are installed you can install Bower with

+ +
npm install -g bower
+ +

At this point you could also install the Gaia Fira Sans font that Firefox OS uses in your app , with the following command:

+ +
bower install gaia-components/gaia-fonts
+ +

You can then make use of the font by including the following in your head (along with a font-family of FiraSans):

+ +
<link rel="stylesheet" type="text/css" href="bower_components/gaia-fonts/style.css"></link>
+ +

Firefox OS Building Blocks

+ +
+
+
+
Action menu
+
An action menu presents a list of actions, related to the app's content, from which the user may make a selection.
+
Banners
+
Banners (Status, in older versions of Firefox OS) provide information to the user in a transitory fashion, typically to confirm an action or to alert the user to a system event.
+
Buttons
+
Buttons are used to perform explicit actions. Buttons may be text or images.
+
Context menu
+
Accessed via a tap and hold gesture (sometimes called a long press), the Context Menu (called the Object Menu in older versions of Firefox OS) allows users to perform actions on objects without having to leave their current view.
+
Dialog
+
A Dialog (Confirm, in older versions of Firefox OS) provides the user with some important information, asks the user to take or confirm an action, or allows the user to make a choice or enter some information.
+
Drawer
+
The drawer is a scalable way for users to navigate between views or filter views. The drawer can also include links to app settings or other tools.
+
Header
+
A header is a dedicated space at the top of the screen, most often used to display the view title. It can also include navigation, action buttons and other controls.
+
Input area
+
An input area is a data entry field, and can be as simple as a text only entry field, or as complex as a multipart entry field with text entry, value selections, and buttons.
+
Layout
+
The Layout utility will help you to create common layout structures for your Firefox OS apps. Note that Layout is only available in Firefox OS 2.1 and above.
+
List items
+
List items are typically used to navigate to a new screen, or to display information or controls.
+
+
+ +
+
+
Picker
+
The Picker is designed to select a group of items as attachments for messaging and email.
+
Progress and activity
+
Progress and activity indicators provide the user with visual feedback that a process (such as a resource loading) is active.
+
Scrolling
+
Scrolling areas allow the user to move text and/or images across the device's display.
+
Search
+
Search is used to filter a list or find context-specific content.
+
Slider
+
A Slider (which was called Seekbar in older Firefox OS versions) is used to select a value from a continuous or discrete range of values by dragging the handle.
+
Select mode
+
Select Mode (which was called Edit Mode in older Firefox OS versions) is designed to select and perform actions on items.
+
Subheader
+
Subheaders are used to describe a subsection of content.
+
Switches
+
Switches (such as checkboxes, etc.) allow users to activate and deactivate items. Switches are also used to select items within a list.
+
Tab/Filter
+
A Tab/Filter gives the user a way to easily switch between views or to filter a set of data.
+
Toolbars
+
Toolbars contain actions, indicators and navigation elements associated with the current view.
+
Value selector
+
Value Selectors let the user choose from among a list of possible values.
+
+
+
+ +
+

Note: For a detailed guide to the design pattern followed by the building blocks when the Arabic locale (bidirectional) is selected, read Firefox OS in Arabic.

+
+ +

Cross browser CSS

+ +

Arnau March wrote a CSS file called cross browser CSS, containing rules to allow Firefox 2.0 building blocks to render properly across different browsers (ie 9, Firefox 18, Chrome 24, Safari 5.1.) If you want to write hosted apps that look ok across different browsers, include this CSS in your project.

+ +

Browse Firefox OS Building Block implementations by version

+ +

The pages below list links to pages covering the Firefox OS Building Block implementations as they appear in different versions of Firefox OS.

+ + diff --git a/files/fr/archive/b2g_os/firefox_os_apps/index.html b/files/fr/archive/b2g_os/firefox_os_apps/index.html new file mode 100644 index 0000000000..0fe489e10a --- /dev/null +++ b/files/fr/archive/b2g_os/firefox_os_apps/index.html @@ -0,0 +1,84 @@ +--- +title: Firefox OS apps +slug: Archive/B2G_OS/Firefox_OS_apps +tags: + - Apps + - Building + - Components + - Firefox OS + - Installing + - TopicStub + - device APIs +translation_of: Archive/B2G_OS/Firefox_OS_apps +--- +

Cette section de la documentation de Firefox OS couvre les techniques spécifiques requises - et les outils disponibles - pour créer des applications Firefox OS. Vous trouverez ci-dessous un certain nombre de détails, des blocs de construction / composants Web de Firefox OS aux API des appareils et à l'installation d'applications.

+ +

Création d'applications Firefox OS

+ +
+
Création d'applications pour Firefox OS
+
Spécificités des applications de la plate-forme Firefox OS / Firefox, y compris les API d'installation et de gestion des applications, les fichiers manifestes, les applications packagées et hébergées, la gestion des autorisations d'API.
+
Localisation
+
Cet ensemble d'articles fournit des informations aux développeurs souhaitant fournir des versions localisées de leurs applications.
+
Performance
+
Cette page répertorie les sujets liés aux performances spécifiques à Firefox OS.
+
Comptes Firefox sur Firefox OS
+
Cet article fournit un aperçu de l'utilisation des comptes Firefox dans Firefox OS.
+
Applications de référence
+
Cette page répertorie un certain nombre d'exemples d'applications que nous avons rassemblées pour que vous puissiez télécharger, installer, jouer avec et apprendre. S'amuser!
+
Série Screencast: Principes de base des applications pour Firefox OS
+
Dans cette collection de courtes vidéos, les développeurs de Mozilla et Telenor expliquent en quelques étapes comment vous pouvez commencer à créer des applications pour Firefox OS.
+
+ +

Blocs de construction

+ +
+
Blocs de construction
+
Les blocs de construction Firefox OS sont des composants d'interface utilisateur réutilisables (également appelés «contrôles communs») qui reflètent les modèles de conception à l'échelle du système d'exploitation. Les blocs de construction sont utilisés pour créer les interfaces de toutes les applications par défaut de Gaia. Vous êtes libre d'utiliser ces composants dans vos propres applications Firefox OS ou dans vos applications Web générales.
+
+ +

Guides de style

+ +
+
Guide de style visuel de Firefox OS
+
Notre guide de style pour la conception visuelle de Firefox OS, couvrant les couleurs, la police, les arrière-plans, les icônes d'application et la conception d'éléments d'interface utilisateur spécifiques.
+
Guide de style de copie de Firefox OS
+
Ce guide décrit les règles que nous suivons pour écrire une copie d'application Firefox OS, mais peut être utilisé comme guide général pour écrire une bonne copie pour toutes les interfaces d'application.
+
Firefox OS en arabe
+
Un guide de l'implémentation de conception UX spécifique que Firefox OS a mis en place pour traiter l'arabe (et d'autres langues RTL.)
+
+ +

Éléments de conception

+ +
+
Bibliothèque d'éléments de conception de Firefox OS
+
Dans cette section, vous trouverez des éléments de conception, des illustrations, des modèles graphiques, des polices et d'autres matériaux qui vous seront utiles lors de la conception des applications Firefox OS / Gaia.
+
Police de l'icône Firefox OS
+
Firefox OS dispose de son propre jeu de polices d'icônes: cet article explique comment l'utiliser dans vos propres applications.
+
Transitions de Firefox OS
+
Une référence à certaines des transitions utilisées dans Firefox OS pour se déplacer entre différents états dans les applications, y compris des GIF animés illustrant les animations utilisées, ainsi que des exemples de code pour afficher le code d'animation CSS nécessaire pour implémenter ces animations.
+
+ +

Références

+ +
+
API des appareils Firefox OS
+
Cet article fournit une liste de pages couvrant ces API, ainsi que les autorisations du manifeste d'application pour chacune d'entre elles.
+
Outils de l'application Firefox OS
+
Cette page fournit une liste d'outils, de bibliothèques, d'exemples, etc. qui sont utiles aux développeurs d'applications Firefox OS, que vous souhaitiez copier un modèle de code ou que vous ayez besoin d'aide pour ajouter une fonctionnalité spécifique à votre application Firefox OS.
+
+ +

Autres sujets d'application

+ +
+
Portage des applications Chrome vers les applications Firefox OS
+
Cet article décrit les différences entre les applications Chrome et les applications Firefox OS, et comment vous pouvez convertir entre les deux.
+
FAQ sur le développement d'applications
+
Cette FAQ est une compilation de réponses aux questions courantes sur le développement d'applications.
+
+ +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/firefox_os_connected-devices_guide/how_to_get_started_with_tv_apps_development/index.html b/files/fr/archive/b2g_os/firefox_os_connected-devices_guide/how_to_get_started_with_tv_apps_development/index.html new file mode 100644 index 0000000000..84e03356af --- /dev/null +++ b/files/fr/archive/b2g_os/firefox_os_connected-devices_guide/how_to_get_started_with_tv_apps_development/index.html @@ -0,0 +1,173 @@ +--- +title: Comment débuter avec le développement d'application pour TV +slug: >- + Archive/B2G_OS/Firefox_OS_Connected-Devices_Guide/How_to_get_started_with_TV_apps_development +translation_of: Mozilla/Firefox_OS_for_TV +--- +

Introduction

+ +

Ce document est écrit pour les développeurs web qui sont intéressés par le développement d'applications pour TV. Nous allons parler de la façon de compiler et lancer le simulateur Firefox OS avec une application smart-TV, puis nous verrons comme  il est facile d'écrire une application et de la déployer sur une TV.

+ +

Fondamentalement, réaliser une application qui fonctionne sur les TV est similaire à faire une application classique Firefox OS, sauf pour les particularité suivantes :

+ + + +

Vous pouvez vous rendre sur l'App Center pour plus de ressources sur les constructions d'application pour Firefox. Cette article traite spécifiquement de la façon de construire un environnement de développement pour TV en utilisant une simple application Hello-World comme exemple.

+ +

Statut actuel et à venir :

+ +

Les applications conçues pour les smart TV sont stockées dans Gaia/tv_apps, avec le préfixe “smart-”, aussi connu sous le nom de smart TV apps. Au début du printemps 2015 il y aura des TV sur le marché avec les applications listées ici : https://github.com/mozilla-b2g/gaia/tree/master/tv_apps.

+

Smart-home et Smart-deck sont des applications classique pour une TV, et vous pouvez les utiliser comme base pour trouver quelques idées.

+ +

Contribuer aux applications smart TV:

+ +

Pour contribuer à une applications smart TV, il vous suffit de suivre les mêmes règles que pour contribuer au code de Gaia.

+ +

Introduction à Firefox OS:

+ +

https://developer.mozilla.org/en-US/Firefox_OS/Introduction

+ +

 

+ +

Construire des applications pour Firefox OS :

+ +

https://developer.mozilla.org/en-US/Apps/Build

+ +

Télécharger les outils

+ +

 

+ +

Nous avons besoin de 3 principaux composants pour construire l'environnement de développement : 1) Le simulateur de bureau, pour lancer votre application TV sur PC comme sur une vraie TV, 2) Firefox Nightly/Aurora comme débogueur, et 3) Le dépôt Gaia.

+ +

 

+ +

Pour la première étape, le simulateur de bureau, vous pouvez trouver nos builds nightly ou builder vous-même. Plus d'info ci-dessous :

+ +

https://developer.mozilla.org/en-US/Firefox_OS/Building_the_Firefox_OS_simulator

+ +

Firefox Nightly fonctionne aussi, mais il permet seulement de tester votre app indépendamment sans pouvoir tester tout le système smart-TV. Nous recommandons d'utiliser Firefox OS bureau pour un meilleur environnement de développement. Vous pouvez le télécharger ici : https://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/latest-mozilla-central/

+ +

 

+ +

La seconde étape consiste à récupérer Firefox Nightly/Aurora, naviguer et télécharger depuis la page officielle de release.

+ +

https://nightly.mozilla.org/

+ +

 

+ +

Pour l'étape 3 veuillez forker le dépot Gaia. Référez-vous aux étapes suisvantes : https://developer.mozilla.org/en-US/Firefox_OS/Developing_Gaia/Running_the_Gaia_codebase#Running_your_own_Gaia_build

+ +

 

+ +

Premièrement, faites un fork du dépot Gaia principal sur Github.

+ +
    +
  1. Ensuite, clonez votre fork localement:
    + git clone https://github.com/your-username/gaia.git
    2. +
  2. +

    Ajoutez un lien upstream comme cela :
    + cd gaia
    + git remote add upstream https://github.com/mozilla-b2g/gaia

    +
    3. +
+ +

Mise en place de votre environnement

+ +

Maintenant vous avez besoin de créer votre profil Gaia. Dans le dossier de votre dépôt, lancer la commande ci-dessous :

+ +

$ make GAIA_DEVICE_TYPE=tv DEVICE_DEBUG=1

+ +

Cela va crée un profil pour un débogage optimal dans votre répertoire. Cela crée des versions non-packagées (versions hébergées) des applications Gaia qui peuvent être servies directement via le serveur local HTTPD qui est contenu dans Firefox pour ordinateur de bureau comme une extension. Lorsque vous faites un changement vous avez besoin de rafraîchir la fenêtre de votre navigateur pour voir le résultat (comme nous allons vous le montrer) plutôt que de re-construire votre profil, re-pousser le profil sur l'appareil etc. C'est un bon et rapide hack CSS/JS/HTML. Donc, lancez le simulateur de bureau avec une taille d'écran précise, un serveur de debug distant, et le lien vers votre profil :

+ +

 

+ +

$ b2g-bin -screen 1920x1080 -start-debugger-server 6000 -profile /path/to/gaia/profile

+ +

 

+ +

Notez que si le paramètre de l'écran est plus grand que votre résolution de PC, cela peut casser le sapplications systèmes. Si cela arrive, réduisez la taille de l'écran comme expliqué précedemment.
+ Si tout fonctionne bien, vous allez voir l'application horloge (en remplacement temporaire de l'application de lancement).

+ +

+ +

Appuyer sur la touche accueil au bas de la fenêtre va vous amener sur l'application accueil qui est le point d'entrée pour les applications TV. Vous pouvez naviguer avec les flèches du clavier, et lancer “Apps” pour lancer le gestionnaire d'application, là ou vous lancerez vos propres applications plus tard.

+ +

+ +

L'écran "Accueil"

+ +

+ +

L'écran "gestionnaire d'application"

+ +

 

+ +

L'exemple Hello World

+ +

 

+ +

WebIDE dans Firefox Desktop

+ +

En utilisant le WebIDE, on peut facilement bootstraper une application web, faire des modifications HTML/CSS/JS, et déboguer l'application sans avoir un véritable appareil.
+ Pour ouvrir le WebIDE dans Firefox Desktop, selectionner Outils > Web Developer > WebIDE depuis le menu :

+ +

+ +

Créer une application depuis le template

+ +


+ Cliquez sur  “Open App” dans le coin gauche en haut du WebIDE et choisissez “Nouvelle application…” dans le menu. Selectionner “HelloWorld,” donnez un nom de projet, et cliquez sur “OK.” Après avoir décidé du répertoire de sauvegarde de sprojets, WebIDE va générer une application avec un template simple pour vous.

+ +

+ +

+ +

 

+ +

+ +

Maintenant vous pouvez programmer votre application dans WebIDE ou utiliser n'importe quel éditeur que vous préférez.

+ +


+  

+ +

Lancer votre application sur une TV

+ +

 

+ +

Il n'y a pas encore de build TV pour le simulateur, nous avons besoin de lancer b2g-desktop.

+ +

 

+ +
    +
  1. Suivez les instructions dans la section “Mise en place de votre environnement” pour lancer votre environnement dans b2g-desktop (n'oubliez pas d'ajouter le paramètres“-start-debugger-server 6000”).
    2. +
  2. Dans le WebIDE, cliquer sur “Select Runtime” dans le coin droit du haut et selectionner “Remote Runtime.”
    +
    3. +
  3. Remplissez la boite de dialogue avec “localhost:6000” et cliquez sur “OK.”
    +
    4. +
  4. Cliquer sur l'icone “Install and Run” . Vous verrez votre applications fonctionner dans b2g-desktop.
    +
    5. +
  5. Cliquez sur l'icone “Debug App” et la boite d'outils des DevTools apparait. Vous pouvez vous référer à la section "Debugging apps" pour déboguer votre application.
    +
    6. +
+ +

Interagir avec une télécommande TV

+ +

L'une des différences entre les téléphones et les TV est le dispositif d'entrée d'instructions. En général, les Tv n'ont pas d'écran tactile, donc les applications ne peuvent pas être controlées avec les événements de la souris ou les événement tactiles.  En revanche vos applications peuvent être contrôlées par les événements bouton qui sont envoyés à la TV par la télécommande.

+ +

 

+ +

La définition  des boutons d'une télécommande TV est documentée dans cette spécification W3C :

+ +

http://www.w3.org/TR/DOM-Level-3-Events-key/#keys-media-controller

+ +

 

+ +

Le “focus” est un autre problème qui peut être mentionné sur les TV. Il est important de vous assurer que le focus est toujours sur le bon élément, car on ne peut pas toucher les élément d'une TV directement.

+ +

 

+ +

 

diff --git a/files/fr/archive/b2g_os/firefox_os_connected-devices_guide/index.html b/files/fr/archive/b2g_os/firefox_os_connected-devices_guide/index.html new file mode 100644 index 0000000000..6775ef2d76 --- /dev/null +++ b/files/fr/archive/b2g_os/firefox_os_connected-devices_guide/index.html @@ -0,0 +1,35 @@ +--- +title: Téléviseurs et appareils connectés +slug: Archive/B2G_OS/Firefox_OS_Connected-Devices_Guide +tags: + - TopicStub +translation_of: Mozilla/Firefox_OS_for_TV +--- +

Ce document est écrit pour les développeurs Web qui sont intéressés par Firefox OS pour les téléviseurs, le travail actuel et à venir, ainsi que les applications web pour les téléviseurs. Il est montré comment construire et exécuter le simulateur Firefox OS TV, puis comment commencer à créer des applications pour les TV et les déployer.

+ +

Les principales différences entre l'utilisation de Firefox OS sur un téléviseur et un téléphone (ou un ordinateur) sont :

+ + + +

Statut actuelle et futurs projets

+ +

Gaia 2.2 et supérieur contient des fonctionnalités pour fonctionner sur la télévision. Vous pouvez trouver des applications prêtes à l'emploi pour les téléviseurs intelligents dans gaia/tv_apps; les applications avec le préfixe smart- sont appelées applications de télévision intelligente. À partir du premier semestre 2015, il y aura des appareils TV sur le marché avec des interfaces utilisateur basées sur les applications répertoriées ici.

+ +
+

Note: smart-home et smart-deck sont de bonnes applications à prendre comme modèles de départ pour vos propres applications ou pour vous faire des idées et trouver l'inspiration.

+
+ +

Développement des applications TV

+ +

Dans cette partie, vous allez découvrir comment configurer un environement de développement pour exécuter et tester vos propres applications TV et comment assembler une application simple de test.

+ +

Téléchargement des outils

+ +

Vous aurez besoin de trois composants pour construire votre environnement de développement :

+ + diff --git "a/files/fr/archive/b2g_os/firefox_os_connected-devices_guide/interagir_avec_les_t\303\251l\303\251commandes_tv/index.html" "b/files/fr/archive/b2g_os/firefox_os_connected-devices_guide/interagir_avec_les_t\303\251l\303\251commandes_tv/index.html" new file mode 100644 index 0000000000..cfbac66130 --- /dev/null +++ "b/files/fr/archive/b2g_os/firefox_os_connected-devices_guide/interagir_avec_les_t\303\251l\303\251commandes_tv/index.html" @@ -0,0 +1,27 @@ +--- +title: Interagir avec les télécommandes TV +slug: >- + Archive/B2G_OS/Firefox_OS_Connected-Devices_Guide/Interagir_avec_les_télécommandes_TV +tags: + - B2G + - Clavier + - Firefox OS + - NeedsContent + - TV + - touches + - télécommande +translation_of: Mozilla/Firefox_OS_for_TV/Interacting_with_TV_remote_controls +--- +

+

Brouillon
+ Cette page n'est pas terminée.

+ +

+ +

La disponibilité des mécanismes de saisie constitue l'une des principales différences entre les téléphones et les TV. En général, une TV ne dispose pas d'écran tactile et les applications ne peuvent donc pas être contrôlées via des événements souris ou tactiles. Au lieu de ça, vos applications devront sans doute réagir aux événements des boutons envoyés par la TV lors de l'appui sur les boutons de la télécommande. Cet article aborde les bases du développement de mécanismes de contrôle appropriés à votre application TV.

+ +

Le focus est un autre problème à souligner en ce qui concerne les applications TV. Il est important de s'assurer qu'à tout moment le focus est bien mis sur l'élément correct car il n'est pas possible de toucher les éléments directement dans l'application TV.

+ +
+

Note : les touches des télécommandes TV sont définies dans la spécification W3C DOM Level 3 KeyboardEvent key Values ; voir la section Media Controller Keys.

+
diff --git a/files/fr/archive/b2g_os/firefox_os_connected-devices_guide/simuler_firefox_os_pour_tv/index.html b/files/fr/archive/b2g_os/firefox_os_connected-devices_guide/simuler_firefox_os_pour_tv/index.html new file mode 100644 index 0000000000..9bb1c307a3 --- /dev/null +++ b/files/fr/archive/b2g_os/firefox_os_connected-devices_guide/simuler_firefox_os_pour_tv/index.html @@ -0,0 +1,126 @@ +--- +title: Simuler Firefox OS pour TV sur votre ordinateur +slug: Archive/B2G_OS/Firefox_OS_Connected-Devices_Guide/Simuler_Firefox_OS_pour_TV +translation_of: Mozilla/Firefox_OS_for_TV/Simulating_Firefox_OS_for_TV +--- +

+ +

Dans cet article, vous apprendrez comment mettre en place un simulateur pour TV sous Firefox OS sur votre ordinateur afin de lancer et tester vos propres applications TV.

+ +

Utiliser le simulateur via le WebIDE

+ +

Les outils du WebIDE de Mozilla procurent un moyen simple de créer un simulateur personnalisé pour différentes configurations de téléviseurs.

+ +
    +
  1. +

    Ouvrez le WebIDE dans Firefox Desktop en sélectionnant Outils > Développement Web > WebIDE dans le menu principal.  La zone de droite de la fenêtre du WebIDE liste les simulateurs déjà installés ainsi qu'un menu Installer un simulateur pour créer un nouveau simulateur dans le WebIDE.

    +
    2. +
  2. +

    Si vous n'avez pas encore installé de simulateur, faites-le en cliquant sur Installer un Simulateur et installé la version TV de Firefox OS de votre choix.

    + +

    +
    3. +
  3. +

    Une fois que votre simulateur a été créé et listé sous Simulators, cliquez sur l'îcone de configuration à droite du nom du simulateur. Un écran vous permettant de configurer l'appareil que vous shouaitez simuler apparaitra.

    + +

    +
    4. +
  4. +

    Un groupe TVs est disponible dans la liste déroulante Appareil, et il contient tous les modèles de TV actuellement supportés:

    + +

    +
    5. +
  5. +

    Une fois que vous avez configuré votre TV avec vos spécifications, cliquez sur le nom du simulateur et le simulateur va se lancé!  L'écran d'accueil ressemblera à celui-ci dessous:

    + +

    +
    6. +
+ +

Utiliser Mulet pour simuler Firefox OS pour TV

+ +

Si vous préférez compiler votre propre profil TV, peut être pour tester les changements dans Gaia qui n'ont pas encore été intégrés dans le simulateur officiel Firefox OS, vous pouvez lancer votre profil dans un build spécial de Firefox appelé Firefox Mulet. Regardez Utiliser Gaia dans Firefox Mulet pour apprendre comment mettre en place un environnement.

+ +
    +
  1. +

    Pour créer un profil spécial de Gaia pour TV, lancer la commande make dans votre dossier du dépôt gaia avec les options suivantes:

    + + 
    GAIA_DEVICE_TYPE=tv DEVICE_DEBUG=1 make
    + +

    Cela créé un profil TV dans le dossier profile qui est initialisé pour debugger de façon optimale.

    +
    2. +
  2. +

    Lancez Mulet depuis votre ligne de commande, en passant votre profil Gaia comme profil à utiliser pour l'ouverture (défini par l'option -profile), et la configuration de la taille de l'écran (définie par l'option -screen):

    + + 
    ./mulet/FirefoxNightly.app/Contents/MacOS/firefox-bin -no-remote -screen 1600x900 -profile /path/to/gaia/profile
    + +
    +

    Note: Si l'option -screen spécifie une résolution plus grandeque celle de la taille d'écran de votre PC, l'application système ne va pas fonctionner correctement et vous pourriez avoir une interface cassée. Réduisez la taille d'écran autant que nécessaire pour correspondre à votre système.

    +
    + +
    +

    Note: Le chemin exact passé dans l'option -profile /path/to/gaia/profile dont vous avez besoin, vous est donné quand vous créez votre profil. (en lançant la commande make, comme montrez ci-dessus.)

    +
    +
    3. +
  3. +

    Si tout va bien, vous verrez s'afficher l'application de l'écran d'accueil — éventuellement affichée incorrectement avec une rotation. C'est un bug connu (Bug 1228899):TV build runs on Mulet

    +
    4. +
  4. +

    Vous pouvez corriger ce problème en cliquant sur le bouton de rotation la barre d'outil de Mulet et en ajustant la taille de l'écran si nécessaire:

    +
    5. +
+ +

TV build runs on Mulet

diff --git a/files/fr/archive/b2g_os/firefox_os_connected-devices_guide/tv_remote_control_button_mapping_to_keyboard/index.html b/files/fr/archive/b2g_os/firefox_os_connected-devices_guide/tv_remote_control_button_mapping_to_keyboard/index.html new file mode 100644 index 0000000000..71ff7cf960 --- /dev/null +++ b/files/fr/archive/b2g_os/firefox_os_connected-devices_guide/tv_remote_control_button_mapping_to_keyboard/index.html @@ -0,0 +1,93 @@ +--- +title: Correspondance clavier des boutons de télécommande TV +slug: >- + Archive/B2G_OS/Firefox_OS_Connected-Devices_Guide/TV_remote_control_button_mapping_to_keyboard +tags: + - Clavier + - Contrôles + - Distance + - Firefox OS + - Gaia + - TV +translation_of: Mozilla/Firefox_OS_for_TV/TV_remote_control_button_mapping_to_keyboard +--- +

Cet article donne une brève description de l'utilisation du clavier pour simuler les boutons d'une télécommande.

+ +

Le clavier est utilisé pour simuler les boutons d'une télécommande lors du développement d'applications pour Firefox OS sur TV. Les tableaux suivants détaillent les équivalents clavier des boutons de télécommande pour les trois plates-formes différentes : Mac OS X, Windows et Linux.

+ +

Mac OS X

+ + + + + + + + + + + + + + + + + + + + + + + + +
TélécommandeClavier
homefn + left
backesc
enterreturn
optionfn + ctrl + I
+ +

Windows

+ + + + + + + + + + + + + + + + + + + + +
TélécommandeClavier
homehome
backesc
enterenter
+ +

Linux

+ + + + + + + + + + + + + + + + + + + + + + + + +
TélécommandeClavier
homehome
backesc
enterenter
optionshift + F10
diff --git a/files/fr/archive/b2g_os/firefox_os_faq/index.html b/files/fr/archive/b2g_os/firefox_os_faq/index.html new file mode 100644 index 0000000000..a322bd8aae --- /dev/null +++ b/files/fr/archive/b2g_os/firefox_os_faq/index.html @@ -0,0 +1,39 @@ +--- +title: Firefox OS FAQ +slug: Archive/B2G_OS/Firefox_OS_FAQ +translation_of: Archive/B2G_OS/Introduction +--- +
+
+ Comment obtenir un téléphone de développeur ?
+
+ Vous pouvez en acheter un sur le site de Geeksphone ou si vous êtes un Mozilla Reps vous pouvez demander un Keon.
+
+ Si je ne souhaite pas acheter de téléphone, puis-je tout de même développer une application pour Firefox OS ?
+
+ Absolument ! Vous pouvez tester votre application sur Android (en utilisant le Marketplace de Firefox) ou sur votre ordinateur en utilisant le simulateur Firefox OS.
+
+ En quoi sera-t-il comparable au téléphone final ?
+
+ Nous travaillons avec plusieurs partenaires pour sortir ce téléphone sur le marché grand public. Nous parlerons de ces appareils plus tard.
+
+ Où puis-je télécharger Firefox OS et l'essayer sur mon propre téléphone ?
+
+ https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Building_and_installing_Firefox_OS
+
+ Comment puis-je tester mon application sur Firefox OS ?
+
+ Sur un téléphone Android avec Firefox ou en utilisant le simulateur Firefox OS.
+
+ Qu'est-ce que Firefox OS ?
+
+ C'est un nouveau système d'exploitation mobile développé entièrement en utilisant les standards ouverts du Web. Il permet de développer toutes les fonctionnalités de l'appareil (appels, messagerie, navigation..) dans une application HTML5 qui peut accéder à toutes les fonctionnalités sous-jacentes d'un téléphone (seulement disponibles pour les applications natives dans les autres éco-systèmes).
+
+ Quelle est la liste complète des API web ? Allez-vous les standardiser ?
+
+ Un grand nombre des API web seront prises en charge dans l'implémentation initiale de Firefox OS. Une liste complète est disponible ici https://wiki.mozilla.org/WebAPI#APIs. La standardisation est en cours.
+
+ Est-ce que vos API web seront standardisées pour une utilisation multi plate-forme ?
+
+ Oui, les API sont le fruit d'un travail avec plusieurs partenaires et marques et certaines d'entre-elles sont déjà disponibles sur d'autres plate-formes. Permettre aux applications web d'accéder au matériel est un problème pour la plus part des entreprises technologiques, nous offrons un bon point de départ pour que cela se développe sur plus de plate-formes.
+
diff --git a/files/fr/archive/b2g_os/firefox_os_usage_tips/index.html b/files/fr/archive/b2g_os/firefox_os_usage_tips/index.html new file mode 100644 index 0000000000..5c9b850f65 --- /dev/null +++ b/files/fr/archive/b2g_os/firefox_os_usage_tips/index.html @@ -0,0 +1,72 @@ +--- +title: Conseils d'utilisation Firefox OS +slug: Archive/B2G_OS/Firefox_OS_usage_tips +tags: + - Astuces + - Firefox OS +translation_of: Archive/B2G_OS/Firefox_OS_usage_tips +--- +

+ +
+
Explique toutes les fonctionnalités développeur du téléphone et ce qu'elles font (Paramètres > Informations > Plus d'informations > Développeurs)
+
Débloquer votre téléphone
+
Instructions sommaires pour débloquer votre téléphone.
+
Faire des captures d'écran
+
Comment prendre des captures d'écran sur votre téléphone Firefox OS.
+
+ +

 

diff --git a/files/fr/archive/b2g_os/firefox_os_usage_tips/unlocking_your_phone/index.html b/files/fr/archive/b2g_os/firefox_os_usage_tips/unlocking_your_phone/index.html new file mode 100644 index 0000000000..135124a83e --- /dev/null +++ b/files/fr/archive/b2g_os/firefox_os_usage_tips/unlocking_your_phone/index.html @@ -0,0 +1,8 @@ +--- +title: Débloquer votre téléphone +slug: Archive/B2G_OS/Firefox_OS_usage_tips/Unlocking_your_phone +tags: + - Firefox OS +translation_of: Archive/B2G_OS/Firefox_OS_usage_tips/Unlocking_your_phone +--- +

Si votre build de Firefox OS commence par vous demander un mot de passe pour débloquer votre appareil, le code par défaut est 0000. Certaines builds vont faire cela lorsque nous développons et testons le lock screen.

diff --git a/files/fr/archive/b2g_os/gaia_hacking_guide/index.html b/files/fr/archive/b2g_os/gaia_hacking_guide/index.html new file mode 100644 index 0000000000..2abb1dd023 --- /dev/null +++ b/files/fr/archive/b2g_os/gaia_hacking_guide/index.html @@ -0,0 +1,11 @@ +--- +title: Guide de développement Gaia +slug: Archive/B2G_OS/Gaia_hacking_guide +tags: + - Gaia + - Guide + - Mobile + - NeedsContent +translation_of: Archive/B2G_OS/Developing_Gaia +--- +

Le guide de développement Gaia n'est pas encore rédigé. Cependant, vous pouvez vous référer à cet article sur le wiki Mozilla en attendant.

diff --git a/files/fr/archive/b2g_os/index.html b/files/fr/archive/b2g_os/index.html new file mode 100644 index 0000000000..f137db5d1e --- /dev/null +++ b/files/fr/archive/b2g_os/index.html @@ -0,0 +1,165 @@ +--- +title: B2G OS +slug: Archive/B2G_OS +tags: + - Aperçu + - B2G + - B2G OS + - Bases + - Débutant + - Démarrer avec b2gos + - Gaia + - Gecko + - Gonk + - Mozilla + - gecko web os + - os de mozilla basé sur le web + - os smartphone b2g +translation_of: Archive/B2G_OS +--- +
B2G OS est un système d'exploitation autonome et complet pour le web ouvert. Il s'agit d'un projet open source développé par la communauté Mozilla et qui constitue les bases des produits Firefox OS.
+ +

B2G OS est un système d'exploitation open source, maintenu par la communauté, pour les smartphones, tablettes, TVs intelligentes et autres appareils connectés. Le projet a démarré en 2011 et est basé sur le noyau Linux et le moteur de rendu Gecko. L'interface utilisateur entière est construite avec des technologies web (HTML, CSS et JavaScript) et peut être utilisée pour lancer et utiliser des applications web. Depuis que Mozilla a abandonné son programme commercial de smartphone Firefox OS, la partie smartphone du projet est intégralement maintenue par la communauté de bénévoles de Mozilla et placée sous la marque B2G OS.

+ +

+ +
+

Note : Un appel à contribution et un autre pour l'adoption d'applications ont été lancés pour mobiliser davantage de personnes, n'hésitez pas à les relayer !

+
+ +
+
+

Comment contribuer

+ +
    +
  • Signaler et corriger des bogues (le méta-bogue est le bogue 1252143)
    • +
  • Aider à corriger les tests qui échouent
    • +
  • Porter une app smartphone gaia : +
      +
    1. La convertir en webapp (ou)
      2. +
    2. La convertir vers chrome:// (pourquoi ?) et faire un retour
      3. +
    +
    • +
  • Porter B2G OS sur votre téléphone ou nous aider à maintenir un portage
    • +
  • Aider à corriger les bogues de Gecko
    • +
  • Contribuer à améliorer la traduction de cette documentation et du wiki
    • +
  • Proposer et implémenter des nouvelles caractéristiques pour les smartphones
    • +
+
+ +
+

S'impliquer

+ + + +

Pour participer aux réunions et aux Groupes de Travail communautaires, s'enregistrer sur ce Calendrier. Ils sont annoncés sur Discourse, où vous pouvez trouver des informations sur comment participer ainsi que les remarques.

+
+ +
+

Appareils compatibles

+ + + +

Pour plus d'informations, voir cette page.
+ Flashez facilement votre appareil avec B2G Installer.
+ Votre appareil ne figure pas dans la liste ? Essayez Mulet sur ordinateur de bureau

+
+
+ +
+

Note: certaines pages ont été déplacées vers l'Archive MDN — informez-nous si vous avez des difficultés à trouver quelque chose ou s'il y a des choses qui devraient selon vous être replacées dans cette section.

+
+ +

 

+ + + +
    +
  1. Architecture de B2G OS + +
      +
    1. Architecture de B2G OS
      2. +
    2. APIs de B2G OS
      3. +
    +
    2. +
  2. Gaia +
      +
    1. Vue d'ensemble de Gaia
      2. +
    2. Différentes façons d'exécuter Gaia
      3. +
    3. Faire fonctionner le code de Gaia
      4. +
    4. Développer pour Gaia +
        +
      1. Comprendre la structure du code de Gaia
        2. +
      2. Apporter des modifications au code de Gaia
        3. +
      3. Tester les modifications du code de Gaia
        4. +
      4. Soumettre un correctif pour Gaia
        5. +
      5. Éléments de base sur le système de construction de Gaia
        6. +
      6. Référence des options de Make
        7. +
      7. Référence des outils pour Gaia
        8. +
      +
      5. +
    +
    3. +
  3. Construire B2G OS +
      +
    1. Vue d'ensemble de la construction
      2. +
    2. Résumé du processus de compilation de B2G OS
      3. +
    3. Prérequis pour la compilation
      4. +
    4. Se préparer pour la première construction
      5. +
    5. Compiler B2G OS +
        +
      1. Compiler B2G OS
        2. +
      2. Compiler B2G OS pour le Flame sur Mac OS X
        3. +
      3. Compiler pour le Fairphone
        4. +
      4. Carte de référence des variables de compilation de B2G
        5. +
      +
      6. +
    +
    4. +
  4. Exécuter B2G OS sur le Bureau +
      +
    1. Choisir comment exécuter Gaia ou B2G OS
      2. +
    2. Exécuter B2G OS sur ordinateur grâce à Mulet
      3. +
    +
    5. +
  5. Installer B2G OS sur mobile +
      +
    1. Installation de B2G OS sur un appareil mobile
      2. +
    2. Module B2G installer
      3. +
    +
    6. +
  6. Appareils compatibles
    7. +
  7. Créer des mises à jour pour B2G OS +
      +
    1. Création et installation de paquets de mise à jour B2G OS
      2. +
    2. Construction et installation de build communautaire FOTA
      3. +
    +
    8. +
  8. Portage de B2G OS +
      +
    1. Aperçu du portage
      2. +
    2. Les bases du portage
      3. +
    3. Portage sur CyanogenMod
      4. +
    +
    9. +
diff --git a/files/fr/archive/b2g_os/installer_sur_un_telephone_mobile/index.html b/files/fr/archive/b2g_os/installer_sur_un_telephone_mobile/index.html new file mode 100644 index 0000000000..04be7c7794 --- /dev/null +++ b/files/fr/archive/b2g_os/installer_sur_un_telephone_mobile/index.html @@ -0,0 +1,97 @@ +--- +title: Installer Firefox OS sur un téléphone mobile +slug: Archive/B2G_OS/Installer_sur_un_telephone_mobile +tags: + - B2G + - Compilation + - Mobile + - Terminal +translation_of: Archive/B2G_OS/Installing_on_a_mobile_device +--- +

+
+

Une fois que vous avez compilé Boot to Gecko pour un téléphone mobile supporté, vous pouvez l'installer. Cet article va vous guider dans cette procédure.

+
+
+ Note : La première fois que vous flashez votre téléphone, il doit posséder la version 4 d'Android (Ice Cream Sandwich). Autrement, le processus ne se déroulera pas correctement. À partir du moment où vous avez effectué votre première installation de B2G, vous pourrez effectuer les mises à jours dessus.
+

Installer ADB

+

Sur OSX

+

Si vous avez homebrew sur OS X, effectuez :

+
brew install android-platform-tools
+

Sinon, téléchargez les Android Developer Tools et ajoutez les binaires à votre PATH.

+

Sur Ubuntu

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

 

+

Flasher votre téléphone

+

Pour flasher entièrement votre téléphone, connectez-le à votre ordinateur puis entrez simplement :

+
./flash.sh
+
+

C'est tout. Le B2G que vous aviez compilé va alors être flashé sur votre téléphone.

+

Attention : si vous mettez à jour avec une version comprenant d'importantes modification de Gaia, vous pouvez également avoir besoin de lancer les commandes suivantes:

+
cd gaia
+make reset-gaia
+
+

Cela effacera les données enregistrées dans Gaia, mais surtout les configurations et préférences obsolètes - ainsi vous lancerez une Gaia « propre ». En théorie, ./flash.sh devrait effectuer ces commandes, mais sur certains terminaux (par exemple Hamachi), ./flash.sh ne met à jour qu'un sous-ensemble des modules (./flash.sh -f forcera alors la mise à jour intégrale).

+

Configurer les règles udev pour votre appareil

+

Sous Linux, si vous obtenez ceci :

+
< waiting for device >
+

Cela signifie probablement que vous n'avez pas entré de règle udev spécifique au montage rapide (fastboot)  de votre appareil,  qui est différent de celui de adb. Vous pouvez obtenir le USB vendor ID en lançant lsusb , mais il s'agit habituellement de celui de Google : 18d1, aussi ajouter cette ligne dans votre fichier /etc/udev/rules.d/51-android.rules devrait suffire :

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

De façon plus générale, voir le paragraphe sur la configuration des règles udev dans l'article sur les prérequis.

+
+ Note : Sous Linux, si vous obtenez une erreur libusb "-3", cela signifie que vous devez être root pour accéder au périphérique USB. Relancez le script à nouveau en utilisant sudo.
+
+ Note 2: Si vous avez un téléphone Unagi ou un Geeksphone Keon; vous aurez besoin de deux lignes - une pour l'ID du vendeur de téléphone, et une pour l'ID de Google.
+

Notes destinées aux possesseurs de terminaux Hamachi, Heix et Leo

+

Si votre téléphone est un terminal Hamachi, Helix ou Leo, par défaut le script ./flash.sh ne copiera que Gecko et Gaia. Il est recommander de flasher tout d'abord l'OEM comme base afin de disposer du firmware et des couches Gonk, puis de flasher Gecko et Gaia par dessus. Si vous désirez flasher en utilisant directement les images, vous pouvez outrepasser le comportement par défaut avec

+
+

./flash.sh -f

+
+

 

+

Notes destinées aux possesseurs de Samsung Galaxy 2

+

Si votre téléphone est un Galaxy S2 et que vous utilisez Heimdall 1.3.2 (la dernière version ; utilisez heimdall version pour connaître la version que vous utilisez), vous pouvez apercevoir une erreur inquiétante "FACTORYFS upload failed!" accompagnée d'informations complémentaires. Il s'agit en fait d'un message indiquant la réussite de l'opération, que vous pouvez ignorer.

+

Pour vous débarasser de ce comportement étrange, récupérer une copie de la source d'Heimdall, en downgradant vers la version 1.3.1 (git checkout fbbed42c1e5719cc7a4dceeba098981f19f37c06 ), puis compilez-la en suivant les informations du fichier README. L'installation de cette version devrait faire disparaître cette erreur. Cette étape, bien qu'utile pour retirer ce message étrange, n'est pas nécessaire.

+

Aucune version de Heimdall ne peut flasher une image système de plus de 100 Mo. Vous pouvez vérifier si votre image n'est pas trop grosse en utilisant la commande :

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

Si elle est trop volumineuse, demandez conseil sur IRC (#b2g) ; il existe des solutions pour effectuer le flashage en deux fois.

+

Étape supplémentaire pour le Samsung Galaxy S2

+

Si vous flashez votre Galaxy S2, il vous faudra suivre cette étape supplémentaire. Gaia n'est pas flashée automatiquement par le script flash.sh ; vous aurez également besoin de lancer la commande

+
./flash.sh gaia
+
+

Flasher des partitions spécifiques vers un téléphone avec fastboot

+

Vous pouvez flasher des partitions spécifiques vers des téléphone avec fastboot (c'est à dire, autre qu'un Galaxy S 2). Par exemple :

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

Attention : Flasher la partition user peut entraîner la pertes des informations spécifiques à l'utilisateur comme les contacts et autres !

+
+

Mettre à jour des modules spécifiques

+

Vous pouvez mettre à jour des modules spécifiques en spécifiant leur nom lors de l'opération de flashage. Par exemple :

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

Pour mettre à jour uniquement une application donnée, vous pouvez utiliser la variable d'environnement BUILD_APP_NAME :

+
BUILD_APP_NAME=calendar ./flash.sh gaia
+

Si vous n'utilisez pas votre téléphone pour développer (vous n'êtes pas intéressé(e) par les applications de tests et les éventuelles optimisations), vous pouvez mettre à jour Gaia grâce à la commande suivante :

+
VARIANT=user ./flash.sh gaia
+

Étapes suivantes

+

Si vous êtes arrivés jusqu'ici, votre téléphone devrait exécuter Boot to Gecko ! C'est le moment d'expérimenter, d'écrire un peu de code, des tests, ou de faire une bonne session de débogage !

+
+ Note : Un petit conseil : si l'écran de verouillage de votre B2G nouvellement compilé demande un code de déverrouillage, le code par défaut est 0000.
+

En cas de problème...

+

Voici quelques manipulations à effectuer si votre terminal ne fonctionne plus après l'installation de B2G, ou après une mise à jour.

+

Si l'interface graphique ne se lance pas

+

Si vous mettez à jour votre téléphone et que l'interface utilisateur ne se lance pas, vous pouvez effectuer une remise à zéro pour effacer les informations de configurations périmées. Cela peut permettre de corriger le problème (attention : cela peut également supprimer les informations spécifiques à l'utilisateur comme les contacts et autres !)

+

Voici comment faire :

+
cd gaia
+make reset-gaia
+
+

Si vous souhaitez passer d'une version de développement à une version de production

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

Attention : reset-gaia peut supprimer des informations spécifiques à l'utilisateur comme les contacts et autres !

+

Message d'erreur "image is too large"  au lancement de ./flash.sh

+

Cela peut vouloir dire que vous devez rooter votre téléphone avant de le flasher, car B2G a besoin d'être installé sur la partition root.

diff --git a/files/fr/archive/b2g_os/introduction/index.html b/files/fr/archive/b2g_os/introduction/index.html new file mode 100644 index 0000000000..27428cfdf0 --- /dev/null +++ b/files/fr/archive/b2g_os/introduction/index.html @@ -0,0 +1,86 @@ +--- +title: Introduction à Firefox OS +slug: Archive/B2G_OS/Introduction +tags: + - Firefox OS + - Gaia + - Introduction +translation_of: Archive/B2G_OS/Introduction +--- +
+

Firefox OS est là pour agrandir le champ des possibles du Web sur mobile et permettre à de nouveaux pans de la population d'être connectés avec leur premier smartphone. C'est un système d'exploitation libre, pour mobile, basé sur Linux, des standards ouverts et la technologie de Mozilla : Gecko. Il s'agit d'une réinvention de ce qu'une plateforme mobile peut être.

+ +

Avec l'arrivée des WebAPIs permettant d'accéder au matériel et en proposant une interface de smartphone intuitive et élégante, Mozilla souhaite offrir aux développeurs web de nouvelles possibilités de créer d'excellents produits pour de nouveaux publics.

+
+ +

Public ciblé

+ +

Cet ensemble de documents est principalement à destination des développeurs web, ainsi qu'aux développeurs plate-forme qui veulent comprendre comment fonctionne Firefox OS, comment contribuer au projet et comment compiler et installer leur propre version sur des appareils. Pour ceux qui souhaitent créer et diffuser leurs applications web, l'App Center et Marketplace Zone sont conseillés.

+ +

La pierre angulaire de Firefox OS

+ +

Pour les développeurs web/plate-forme, la chose la plus importante à comprendre est que la totalité de l'interface utilisateur est une application web, qui est capable d'afficher et lancer d'autres applications web. Toutes les modifications que vous pourriez apporter à l'interface utilisateur, ou toute application Firefox OS que vous voudriez créer, impliqueront les technologies web standard, tout en fournissant un accès privilégié au matériel et aux services de l'appareil.

+ +

D'un point de vu produit, Firefox OS est une marque de Mozilla et ajoute une liste de services à Boot to Gecko (B2G), qui est le nom de code du système d'exploitation. L'interface utilisateur de Firefox OS est appelée Gaia, et inclut les applications essentielles ainsi que les fonctions système.

+ +

Pour en apprendre plus sur l'architecture, voir le guide de la plateforme.

+ +

Objectifs présents et futurs

+ +

Plusieurs téléphones sont disponibles, tant pour développeurs que pour le grand public. Pour en savoir plus :

+ + + +

Cycle de développement

+ +

Depuis Firefox OS 1.2, son cycle de développement est aligné, autant que possible, sur celui de Gecko et Firefox Desktop, qui ont des cycles de 6 semaines. Sachant qu'une nouvelle version de Firefox OS sort tout les 3 mois, elle sortira donc toutes les 2 versions de Gecko (cœur du navigateur Firefox).

+ +

Par exemple Gecko 30 est présent dans Firefox OS 1.4, et Gecko 32 dans Firefox OS 2.0 (anciennement 1.5). Les versions 29 et 31 de Gecko n'étant pas utilisées.

+ +
+

Note : Voir notre calendrier des sorties pour vérifier les correspondances de version entre Firefox OS et Gecko / Firefox Desktop et lire Firefox OS Release Milestones pour plus d'informations concernant notre gestion des versions et leur diffusion.

+
+ +

La communauté

+ +

Boot to Gecko et Gaia sont développés par des équipes d'ingénieurs au sein de Mozilla, ainsi que par un certain nombre de contributeurs externes appartenant à la grande communauté open source autour de Mozilla.

+ +

Pour rapporter un bug, utilisez notre Bugzilla, et associez-le à un composant Firefox OS. Si vous n'êtes pas sûr du composant à sélectionner, n'hésitez pas à demander conseil.

+ +
+

Note : Pour toute question ou remarque à propos d'une partie spécifique du code source B2G/Gaia (par exemple, une application Gaia particulière), vous pouvez trouver un contact plus spécialisé sur la page des modules Firefox.

+
+ +

Compiler le système d'exploitation

+ +

Le système d'exploitation B2G est basé sur Gecko, le moteur de rendu de Mozilla, qui se trouve au-dessus d'un noyau Linux et d'une couche d'abstraction matérielle en espace utilisateur (HAL) appelée Gonk. Le Gecko mentionné ici est essentiellement le même que le Gecko utilisé dans Firefox pour Android, ou Windows, ou Mac OS X, etc. Gonk est simplement une nouvelle cible sur laquelle Gecko doit fonctionner.

+ +

Pour apprendre à compiler et installer Firefox OS, voir Compiler et installer Firefox OS. Le code source de B2G est disponible sur Github.

+ +

Contribuer à Gaia

+ +

Pour contribuer à Gaia, pas besoin de beaucoup plus qu'une bonne connaissance du développement web. Pour apprendre à lancer et faire fonctionner Gaia, voir Développer pour Gaia.

+ +

Il existe un certain nombre d'utilitaires pratiques pour déboguer Gaia et d'autres applications web fonctionnant sous Firefox OS. Voir le guide Hacker Gaia pour en savoir plus.

+ +

Développer des applications pour Firefox OS

+ +

Les applications Firefox OS reposent sur les technologies standard du web — HTML, CSS, JavaScript, etc. — donc si vous êtes un développeur web, vous connaissez déjà une grande partie de ce dont vous aurez besoin. Il y a quelques API JavaScript spéciales à connaitre, qui permettent d'accéder au matériel et à des fonctionnalités clefs (telles que l'appareil photo, le gyroscope, le capteur de lumière, les contacts, les alarmes système et les notifications…), mais celles-ci sont bien documentées sur les pages App Center et Web Platform.

+ +
+

Note : Pour votre première application web ou Firefox OS, ou pour obtenir un aperçu des différences entre applications web et pages web traditionnelles, voir Commencer le développement d'applications web.

+
+ +

Gérer plusieurs versions de Firefox OS

+ +

En développant des applications pour Firefox OS, vous devez prendre en compte la version qu'utilisera votre client (voir notre tableau des téléphones disponibles pour la liste). Rappelez-vous qu'il n'est pas aussi simple de mettre à jour le système d'un téléphone qu'un logiciel d'ordinateur — les utilisateurs sont souvent tributaires de leur opérateur. Vous devez donc développer des applications qui prennent en charge ces versions. Comme exemple, multiline Flexbox ne fonctionne pas sur les versions de Firefox OS antérieures à 1.3, vous pourriez donc devoir utiliser une disposition plus simple ou une alternative pour ces versions.

+ +

Ce problème devrait s'estomper au fur et à mesure que de nouveaux appareils Firefox OS sortent équipés de versions plus récentes.

+ +
+

Note : Ces pages MDN contiennent des informations de compatibilité navigateur/système et vous pourrez trouver des informations de compatibilité concernant des technologies plus spécifiques aux applications sur notre page Application API Reference.

+
diff --git a/files/fr/archive/b2g_os/media_support/index.html b/files/fr/archive/b2g_os/media_support/index.html new file mode 100644 index 0000000000..c020a9bd96 --- /dev/null +++ b/files/fr/archive/b2g_os/media_support/index.html @@ -0,0 +1,59 @@ +--- +title: Support des médias dans Firefox OS +slug: Archive/B2G_OS/Media_support +tags: + - Firefox OS + - Guide + - HTML5 + - Média(2) +translation_of: Web/Media/Formats +--- +

+

Brouillon
+ Cette page n'est pas terminée.

+ +

+ +

Aucun objet connecté moderne n'est complet sans un grand support multimédia, et Firefox OS en dispose assurément, en particulier avec la version 2.0 imminente. Voyez ici quels codecs sont supportés selon les versions de Firefox OS, et quelles sont les fonctionnalités selon les appareils.

+ +

Vidéo H.264

+ +

Firefox OS 2.0 introduit le support du codage et du décodage matériel des vidéos H.264 dans les flux médias WebRTC. Cela rend possible de soutenir des vidéoconférences ou des appels face-à-face avec une consommation optimisée de la batterie.

+ +

Activation du support H.264

+ +

À l'heure actuelle, certains appareils, tel que le téléphone développeur Flame, ne disposent pas d'un support vidéo H.264 activé par défaut. Vous devez définir un paramètre pour l'activer. Pour cela, vous avez besoin de modifier le fichier prefs.js situé dans votre profil sur l'appareil. Commencez par brancher l'appareil sur votre ordinateur sur lequel ont été au préalable configurés les outils adb.

+ +

Tout d'abord, vous devez déterminer le nom du répertoire de votre profil. Vous pouvez le trouver de cette manière :

+ +
adb shell ls /data/b2g/mozilla
+ +

Parmi les informations affichées, vous verrez un répertoire dont le nom se compose de lettres et de chiffres aléatoires et qui se termine par ".default". Il s'agit du répertoire de votre profil. Utilisez ce nom lorsque vous verrez "xxxxxxxx" dans les instructions données à partir d'ici.

+ +

Ensuite, récupérez le fichier prefs.js afin de pouvoir l'éditer :

+ +
adb pull /data/b2g/mozilla/xxxxxxx.default/prefs.js
+ +

Ouvrez le fichier obtenu dans votre éditeur de texte préféré ; ajoutez la ligne suivante à la fin du fichier et enregistrez vos modifications.

+ +
user_pref("media.peerconnection.video.h264_enabled", true);
+ +

À présent, tout ce qu'il vous reste à faire est d'envoyer le fichier modifié vers l'appareil et de redémarrer le processus b2g pour prendre en compte les changements, comme ceci :

+ +
adb push pref.js /data/b2g/mozilla/xxxxxxxx.default
+adb shell stop b2g
+adb shell start b2g
+
+ +

Support des conteneurs et codecs

+ +

Cette section contiendra (bientôt, espérons) des informations sur les codecs supportés, les conteneurs (formats de fichier) qui peuvent les encapsuler, et pour chacun quels appareils et versions de l'OS les prennent en charge.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/mulet/index.html b/files/fr/archive/b2g_os/mulet/index.html new file mode 100644 index 0000000000..e2900841af --- /dev/null +++ b/files/fr/archive/b2g_os/mulet/index.html @@ -0,0 +1,122 @@ +--- +title: Mulet +slug: Archive/B2G_OS/Mulet +tags: + - B2G Mulet + - B2G OS + - Essayez b2g os + - Mulet +translation_of: Archive/B2G_OS/Mulet +--- +

En suivant ce guide, vous pourrez exécuter Gaia dans une version spéciale de Firefox appelée Firefox Mulet. Cela apporte comme avantages le fait d'avoir un cycle de développement rapide, ainsi que des outils de développement web standards et des débogueurs pour travailler avec. Tout d'abord, vous devez avoir cloné le dépôt Gaia sur votre machine et construit votre propre profil. Ensuite, il vous faut installer mulet et le lancer, en lui précisant votre profil Gaia comme profil à utiliser.

+ +
+

Le mulet et la mule sont des hybrides statistiquement stériles de la famille des équidés, engendrés par un âne (Equus asinus) et une jument (Equus caballus) - Wikipedia

+
+ +
+

D'après le wiki, "Mulet" vient du mot français désignant une "mule" et s'écrit avec un seul l !

+
+ +

Où puis-je l'obtenir ?

+ +

Comme tout autre programme, Mulet peut être lancé à partir d'un paquet précompilé : il s'agit de la méthode la plus simple pour les nouveaux utilisateurs. Ceux plus expérimentés, évidemment, peuvent toujours compiler Mulet eux-mêmes pour tester de nouvelles fonctionnalités et corrections de bogues. Quelle que soit la méthode que vous allez suivre, souvenez-vous que vous ne pourrez pas lancer Mulet sans un profil Gaia.

+ +

Exécutable seul

+ +

À l'origine, ce paquet était distribué via Discourse. C'est la façon la plus rapide de lancer Mulet pour les personnes qui ne le connaissent pas et/ou qui ne disposent pas d'un accès Internet haut débit pour cloner la totalité du dépôt Gaia. Le paquet contient Mulet et un profil Gaia précompilé, les utilisateurs n'ont pas besoin de compiler quoi que ce soit.

+ +
    +
  1. Téléchargez l'Archive (94 Mb)
    2. +
  2. Décompressez l'archive
    3. +
  3. Cd vers le dossier extrait
    4. +
  4. Attribuez des permissions au fichier start.sh dans un terminal avec chmod +x ou en faisant un clic droit sur le fichier > permissions > cochez Autoriser l'exécution du fichier comme un programme.
    5. +
  5. Lancez à présent le fichier avec ./start.sh ou en double-cliquant dessus
    6. +
+ +
+

Note : L'exécutable a été testé sur Ubuntu 16.04 64 bits et Arch Linux mais devrait sans doute tourner sur toutes les distributions linux.

+
+ +
    +
+ +
+

Si vous utilisez Gnome 3, le script ne voudra sans doute pas se lancer depuis Fichiers. Pour résoudre ce problème, ouvrez les Préférences. Sélectionnez l'onglet 'Comportement'. Sous "Fichiers texte exécutables", choisissez "Demander à chaque fois" ou "Lancer les fichiers textes exécutables lorsqu'ils sont ouverts". Fermez la fenêtre.

+
+ +

Binaires précompilés

+ +

Mulet

+ +

Vous pouvez télécharger des binaires précompilés pour Linux depuis TaskCluster de Mozilla. Pour les récupérer,

+ +
    +
  1. Rendez-vous sur https://tools.taskcluster.net/index/artifacts/#gecko.v1.mozilla-central.latest.linux.mulet/gecko.v1.mozilla-central.latest.linux.mulet.opt
    2. +
  2. Recherchez "public/build/target.tar.bz2" dans la liste d'artefacts sur la droite
    3. +
  3. Téléchargez puis décompressez l'archive quelque part
    4. +
  4. Le binaire "Firefox" qui se trouve dans ce dossier peut faire tourner mulet. Si vous le souhaitez, vous pouvez ajouter dans votre path un lien symbolique qui pointe dessus.
    5. +
+ +

Gaia

+ +

Pour exécuter Mulet il faut une copie de Gaia. Normalement, elle est récupérée à partir de Github :

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

Ensuite, vous devez construire un profil Gaia :

+ +
$ cd ~/gaia
+$ make
+
+ +

Exécution

+ +

Enfin, vous pouvez lancer Mulet :

+ +
$ chemin/vers/mulet/firefox-bin --no-remote --devtools --profile ./profile
+
+ +

 

+ +

Windows et Mac OS

+ +

Mulet

+ +

Les versions Windows et Mac sont disponibles sur Mozilla Central. Les builds Mulet sont les paquets dont les noms commencent par firefox-*, par exemple firefox-36.0a1.en-US.mac64.dmg.

+ +

Une fois téléchargé, installez le build de Mulet dans un endroit sûr afin de ne pas écraser votre version de Firefox Nightly normale. Par exemple, sur Mac OS X, créez un nouveau dossier dans Applications appelé "mulet" puis faîtes-le glisser dedans.

+ +

À présent, lancez la version de Mulet en ligne de commande, en lui précisant votre profil Gaia comme profil à utiliser lors de l'ouverture (indiqué par l'option -profile.) Par exemple, il est possible de lancer quelque chose de ce genre depuis votre dossier Applications sur Mac OS X si vous l'avez installé à cet endroit :

+ +
./firefox/Contents/MacOS/firefox-bin -no-remote -profile /Users/my-home
+ +

 

+ +

Utilisation de Mulet

+ +

+ +

Sur l'affichage, vous obtenez la Boîte à outils standard de Firefox pour le débogage de vos applications, plus un émulateur B2G OS tournant dans la partie gauche ainsi qu'un certain nombre d'autres outils utiles relatifs à Gaia. Les contrôles au-dessus de l'émulateur vous permettent de :

+ + + +

Références supplémentaires

+ + diff --git a/files/fr/archive/b2g_os/pandaboard/index.html b/files/fr/archive/b2g_os/pandaboard/index.html new file mode 100644 index 0000000000..3713db85e3 --- /dev/null +++ b/files/fr/archive/b2g_os/pandaboard/index.html @@ -0,0 +1,120 @@ +--- +title: Pandaboard +slug: Archive/B2G_OS/Pandaboard +tags: + - Boot2Gecko + - Firefox OS + - Pandaboard +translation_of: Archive/B2G_OS/Pandaboard +--- +

+ +

C'est un guide pour installer Firefox OS sur une PandaBoard. La PandaBoard est une tablette à bas prix basée sur une carte-mère OMAP 4  pour développer un système d'exploitation mobile.

+ +

Assurez-vous d'avoir une carte-mémoire SD avec au moins 4 giga disponibles.

+ +

Formater la carte SD

+ +

Suivez ce guide pour formater votre carte SD.

+ +

Communication USB

+ +

Pour activer la communication usb avec votre pandaboard, suivez ces étapes. Pour B2G, il est plus sûr d'utiliser le mode de fichier "0666".

+ +

Vérifiez que la  pandaboard est accessible en la branchant en usb à votre ordinateur et en lançant la commande suivante dans votre terminal :

+ +
lsusb
+ +

Si vous voyez s'afficher quelque chose avec Texas Instruments, alors votre pandaboard est détectée ! Si ce n'est pas le cas , essayez de débrancher tous les câbles de votre ordinateur et de laisser juste la pandaboard connectée en usb.

+ +

Construire et flasher

+ +

Après avoir tout configuré pour la pandaboard, nous allons maintenant nous lancer dans Negatus. Il s'agit d'un agent qui tourne sur l'appareil et qui permet de le déboguer/automatiser. Negatus va se construire lui-même automatiquement après que vous ayez lancé ./build.sh ; vous devrez néanmoins installer llibnspr(apt-get install libnspr4-dev). Après la construction de l'image, la partie délicate qui suit consiste à la flasher sur votre pandaboard.

+ +

Essayez de suivre les instructions présentes ici, jusqu'à 'Initial setup, part 3' inclus. Vous pouvez ignorer 'Initial setup, part 1' qui a déjà été effectuée au cours de l'étape de construction. Revenez ici après avoir terminé 'Initial setup, part 3'.

+ +

Vous pouvez à présent lancer la commande ./flash.sh et en principe tout devrait bien se passer. Si le script flash.sh essaye d'effacer la partition userdata, supprimez cette ligne. C'est un problème connu listé dans les instructions.

+ +

Après la fin du flashage, vous devez manuellement redémarrer la machine en débranchant les câbles d'alimentation et usb, puis en les rebranchant (le câble d'alimentation doit être branché en premier).

+ +

Voici comment contourner les problèmes connus :

+ +

"waiting for OMAP4XXX..." en tentant d'utiliser usbboot

+ +

Si vous voyez ce message, débranchez tous les câbles de la pandaboard. Branchez la pandaboard uniquement via l'USB. Ne branchez pas l'alimentation. Essayez à présent, puis lancez usbboot avec sudo.

+ +

Erreurs fastboot lors du flashage

+ +

Si vous rencontrez des difficultés pour exécuter des commandes dans fastboot, elles peuvent réussir en les lançant avec sudo (c'est-à-dire : sudo <commande fastboot...>)

+ +

Par ailleurs, si vous avez des problèmes pour faire entrer votre pandaboard en mode fastboot (c'est-à-dire : aucun périphérique n'est listé si vous faites un appel à fastboot devices), alors vous pouvez :

+ +
    +
  1. Débranchez tout ce qui est relié à la pandaboard
    2. +
  2. Maintenez enfoncé le bouton GPIO
    3. +
  3. Branchez l'alimentation tout en maintenant toujours le bouton enfoncé
    4. +
  4. Surveillez le voyant d'état et une fois qu'il commence à clignoter, relâchez le bouton GPIO
    5. +
+ +

Cela va faire entrer la pandaboard en mode fastboot.

+ +

Impossible de se connecter à adb

+ +

Si vous voyez l'appareil avec lsusb mais pas dans les périphériques adb/fastboot et que les voyants sont éteints, débranchez la source d'alimentation puis rebranchez-la. Si les voyants sont allumés, il faudra peut-être attendre quelques instants (30 secondes maximum) pour que l'appareil soit enregistré sur adb.

+ +

Quelquefois, le flashage sera annoncé comme ayant réussi mais ce ne sera pas le cas. Reflashez la pandaboard (c'est-à-dire : exécutez ./flash.sh) et réessayez. Je conseille de brancher l'alimentation d'abord, et de brancher le câble usb ensuite

+ +

Si vous obtenez "??????????? no permision" pour les appareils adb, même en root, vérifiez la section "Configuring USB Access" sur ce site et corrigez - ou ajoutez - les bonnes règles udev. N'oubliez pas de redémarrer le service udev après avoir fait les modifications.

diff --git a/files/fr/archive/b2g_os/phone_guide/alcatel_one_touch_fire/index.html b/files/fr/archive/b2g_os/phone_guide/alcatel_one_touch_fire/index.html new file mode 100644 index 0000000000..9f8ebb4ecb --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/alcatel_one_touch_fire/index.html @@ -0,0 +1,104 @@ +--- +title: Alcatel One Touch Fire +slug: Archive/B2G_OS/Phone_guide/Alcatel_One_Touch_Fire +tags: + - Alcatel One Touch Fire + - Client + - Firefox OS + - Téléphone +translation_of: Archive/B2G_OS/Phone_guide/Alcatel_One_Touch_Fire +--- +
+
+ +
+

Le smartphone Alcatel One Touch Fire sous Firefox OS dispose d'un processeur à 1 GHz et d'une caméra 3,2 MP. Il est disponible à différents endroits dans le monde, auprès d'une large variété d'opérateurs.

+ +

Acheter un appareil

+ +

L'Alcatel One Touch Fire est disponible via les canaux de distribution classiques.

+ +

Disponibilité

+ +
+
+
    +
  • Allemagne
    • +
  • Brésil
    • +
  • Chili
    • +
  • Colombie
    • +
  • Grèce
    • +
  • Hongrie
    • +
  • Italie
    • +
+
+ +
+
    +
  • Mexique
    • +
  • Montenegro
    • +
  • Pérou
    • +
  • Pologne
    • +
  • Serbie
    • +
  • Venezuela
    • +
+
+
+ +

Opérateurs

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

Mise à jour logicielle

+ +

L'image système de l'appareil est verrouillée, si bien qu'il n'est possible de le mettre à jour que lorsque l'opérateur téléphonique publie une mise à jour OTA.

+ +

Spécifications de l'appareil

+ +

Vous pouvez trouver plus de détails sur les caractéristiques de l'appareil sur le site Web d'Alcatel sous l'onglet Spécification

+ + + +

Coloris disponibles

+ + + +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/alcatel_one_touch_fire_c/index.html b/files/fr/archive/b2g_os/phone_guide/alcatel_one_touch_fire_c/index.html new file mode 100644 index 0000000000..8cbc4e1d8c --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/alcatel_one_touch_fire_c/index.html @@ -0,0 +1,68 @@ +--- +title: Alcatel One Touch Fire C +slug: Archive/B2G_OS/Phone_guide/Alcatel_One_Touch_Fire_C +tags: + - Alcatel One Touch Fire + - Client + - Firefox OS + - One Touch Fire C + - Téléphone + - Téléphone Alcatel Firefox +translation_of: Archive/B2G_OS/Phone_guide/Alcatel_One_Touch_Fire_C +--- +
+
 
+ +
+

Le smartphone Alcatel One Touch Fire C fonctionne sous Firefox OS ; il dispose d'un processeur double-coeur à 1,2 GHz, d'un appareil photo 2 MP et est disponible en Inde.

+ +

Acheter un appareil

+ +
    +
  • Actuellement non disponible
    • +
+ +

Disponibilité

+ +
    +
  • Inde
    • +
  • Uruguay
    • +
+
+
+ +

Mise à jour du logiciel

+ +

L'image système de l'appareil étant verrouillée, vous ne pouvez mettre à jour le logiciel que lorsque l'opérateur téléphonique publie une mise à jour OTA. L'image système de l'appareil est basée sur Firefox OS 1.2.

+ +

Spécifications de l'appareil

+ +

Vous pouvez trouver davantage de spécifications d'appareils listées sur le site Web d'Alcatel dans l'onglet Specification.

+ + + +

Coloris disponibles

+ + + +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/alcatel_one_touch_fire_e/index.html b/files/fr/archive/b2g_os/phone_guide/alcatel_one_touch_fire_e/index.html new file mode 100644 index 0000000000..9ded561a3e --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/alcatel_one_touch_fire_e/index.html @@ -0,0 +1,97 @@ +--- +title: Alcatel One Touch Fire E +slug: Archive/B2G_OS/Phone_guide/Alcatel_One_Touch_Fire_E +tags: + - Alcatel One Touch Fire E + - Firefox OS + - Mobiles Alcatel + - Spécifications de l'Alcatel One Touch Fire E +translation_of: Archive/B2G_OS/Phone_guide/Alcatel_One_Touch_Fire_E +--- +
+
+

Image of ALCATEL ONETOUCH E

+
+ +
+

Le smartphone Alcatel One Touch Fire E est propulsé par Firefox OS; il dispose d'un processeur double cœur à 1,2 GHz, d'un écran haute résolution et d'un appareil photo 5 MP + caméra frontale VGA ; il est disponible en différents endroits du globe.

+ +

Acheter un appareil

+ +

L'Alcatel One Touch Fire E est disponible via les canaux de distribution classiques.

+ +

Disponibilité

+ +
+
+
    +
  • Allemagne
    • +
  • Hongrie
    • +
  • Pologne
    • +
+
+ +
+
    +
  • République tchèque
    • +
  • Russie
    • +
+
+
+ +

Opérateurs

+ +
+
+
    +
  • Congstar
    • +
  • MegaFon
    • +
+
+ +
+
    +
  • O2
    • +
  • T-Mobile
    • +
+
+
+
+
+ +

 

+ +

Mise à jour du logiciel

+ +

L'image système de l'appareil est verrouillée, il n'est possible de mettre à jour le logiciel que lorsque l'opérateur téléphonique publie une mise à jour OTA.

+ +

Spécifications de l'appareil

+ +

Vous pouvez trouver plus d'informations sur les spécifications de l'appareil dans la section Specification du site Web d'Alcatel

+ + + +

Coloris disponibles

+ + + +

Voir également

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/alcatel_one_touch_pixi_3_(3.5)/index.html b/files/fr/archive/b2g_os/phone_guide/alcatel_one_touch_pixi_3_(3.5)/index.html new file mode 100644 index 0000000000..61a033332c --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/alcatel_one_touch_pixi_3_(3.5)/index.html @@ -0,0 +1,54 @@ +--- +title: Alcatel One Touch Pixi 3 (3.5) +slug: Archive/B2G_OS/Phone_guide/Alcatel_One_Touch_Pixi_3_(3.5) +tags: + - Firefox OS + - Landing + - Téléphones +translation_of: Archive/B2G_OS/Phone_guide/Alcatel_One_Touch_Pixi_3_(3.5) +--- +
+
+ +
+

L'Alcatel One Touch Pixi 3 (3,5) est un smartphone haut de gamme sous Firefox OS 2.0, avec un appareil photo de 2 mégapixels.

+ +

Acheter un appareil

+ +

Le téléphone peut être acheté ici :

+ + + +

Disponibilité

+ +
    +
  • Inde
    • +
+ +

 

+
+
+ +

Spécifications de l'appareil

+ + + +

Coloris disponibles

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/alcatel_onetouch_fire_c_4020d/index.html b/files/fr/archive/b2g_os/phone_guide/alcatel_onetouch_fire_c_4020d/index.html new file mode 100644 index 0000000000..3b97669202 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/alcatel_onetouch_fire_c_4020d/index.html @@ -0,0 +1,64 @@ +--- +title: Alcatel Onetouch Fire C 4020D +slug: Archive/B2G_OS/Phone_guide/Alcatel_Onetouch_Fire_C_4020D +tags: + - Alcatel + - Appareils Tarako + - Client + - Firefox OS + - Onetouch Fire C + - Téléphone +translation_of: Archive/B2G_OS/Phone_guide/Alcatel_Onetouch_Fire_C_4020D +--- +
+
Intex Cloud FX image from official website
+ +
+

L'Alcatel Onetouch Fire C 4020D est un smartphone grand public, basé sur Tarako Firefox OS, et distribué en Inde. Il a été distribué par Alcatel en août 2014.

+ +

Acheter un appareil

+ +
    +
  • Ce téléphone est abandonné.
    • +
+ +

Disponibilité

+ +

Inde

+ +

Mise à jour du logiciel

+ +

L'image système de l'appareil étant bloquée, vous ne pouvez mettre à jour le logiciel que lorsque l'opérateur téléphonique publie une mise à jour OTA. L'image système de l'appareil est basée sur Firefox OS 1.3T.

+
+
+ +

Spécifications de l'appareil

+ +

Davantage de spécifications d'appareils sont listées sur notre page de spécifications de téléphones et appareils.

+ + + +

Coloris disponibles

+ + + +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/best_practices_open_reference_devices/index.html b/files/fr/archive/b2g_os/phone_guide/best_practices_open_reference_devices/index.html new file mode 100644 index 0000000000..235f2bf40d --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/best_practices_open_reference_devices/index.html @@ -0,0 +1,84 @@ +--- +title: Les bonnes pratiques pour appareils de référence ouverts +slug: Archive/B2G_OS/Phone_guide/Best_practices_open_reference_devices +tags: + - Bonnes pratiques + - Firefox OS + - Périphériques + - Téléphones + - appareil de référence +translation_of: Archive/B2G_OS/Phone_guide/Best_practices_open_reference_devices +--- +
+

Le présent article a pour objectif de fournir un ensemble de bonnes pratiques que nous considérons comme devant être recommandées pour tout appareil de référence ouvert disponible. Tous les appareils Firefox OS récents ont respecté ces pratiques, dont le Flame.

+
+ +

Les appareils doivent avoir :

+ + + +

Des compilations facilement accessibles et installables

+ +

Les appareils de référence sont essentiellement destinés aux développeurs et aux personnes qui ont des connaissances techniques plus importantes que celles de l'utilisateur moyen de téléphone. Malgré cela, nous ne nous attendons pas à ce que les utilisateurs de ces appareils fassent leurs propres compilations s'ils ne le souhaitent pas — pour la plupart d'entre-eux c'est une simple perte de temps.

+ +

Les appareils de référence ouverts doivent disposer d'un ensemble de builds non verrouillées maintenu pour les versions actuelles et futures, simple à obtenir et à installer. Cela signifie avoir plusieurs canaux disponibles, au moins :

+ + + +

Il faudrait rendre ces builds disponibles sur une page de téléchargement dédiée, avec des mises à jour fréquentes et régulières. Des mises à jour OTA devraient aussi être mises à disposition des utilisateurs, pour chaque appareil.

+ +

Les OEMs devraient avoir la responsabilité de fournir ces mises à jour car ils sont les seuls à pouvoir légalement distribuer tous les binaires requis, etc.

+ +

Il serait logique de suivre un modèle similaire à celui du navigateur Firefox, où chacun des canaux -release, stable et nocturne- est basé sur sa branche respective du code source.

+ +

Un système d'exploitation totalement déverrouillé

+ +

La plate-forme du système d'exploitation de l'appareil doit être totalement déverrouillée afin que les développeurs du système et des applications aient une liberté de contrôle sur leurs appareils. Ceci leur permet d'effectuer tous les tests souhaités ainsi que les travaux de développement. Cela implique que :

+ + + +

Une disponibilité mondiale

+ +

Pour que les appareils de référence soient une norme universelle, il faut qu'ils soient disponibles dans le monde entier. Dans le cas contraire, les différentes populations devront faire avec des appareils différents, ce qui aboutira à des comportements différents.

+ +

Un support des fonctionnalités équivalent à celui des téléphones grand public

+ +

Il serait inutile de créer un périphérique de référence s'il ne supportait pas les mêmes technologies, fonctionnalités et applications web que les appareils grand public que vous voulez voir distribués avec Firefox OS.

+ +

Ces fonctionnalités sont représentées par :

+ + + +

Des batteries de remplacement disponibles

+ +

Les batteries de remplacement peuvent être très difficiles à trouver en fonction des appareils et peuvent rendre inutiles des appareils qui pourraient encore fonctionner. Il est ainsi souhaitable de rendre disponibles des batteries de remplacement dès que possible.

+ +

Des choix de langues faciles à faire

+ +

Ces appareils étant distribués dans le monde entier, il est important de rendre disponibles des versions traduites pour le plus de langues possible, en prenant en compte la disponibilité des ressources et les marchés locaux les plus populaires.

+ +

La solution préférable est de faire des versions de Gaia localisées ou des packs de langues qui peuvent être flashés sur l'appareil séparément. Mozilla travaille à une solution pour rendre leur création et leur installation le plus simple possible.

diff --git a/files/fr/archive/b2g_os/phone_guide/cherry_mobile_ace/index.html b/files/fr/archive/b2g_os/phone_guide/cherry_mobile_ace/index.html new file mode 100644 index 0000000000..5f56a4de26 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/cherry_mobile_ace/index.html @@ -0,0 +1,118 @@ +--- +title: Cherry Mobile Ace +slug: Archive/B2G_OS/Phone_guide/Cherry_Mobile_Ace +tags: + - Ace + - Cherry Mobile + - Firefox OS + - Mozilla + - Téléphone + - tarako + - utilisateur +translation_of: Archive/B2G_OS/Phone_guide/Cherry_Mobile_Ace +--- +

+ +

Spécifications de l'appareil

+ +

Logiciel

+ + + +

Matériel

+ + + +

Acheter un appareil

+ +

Le Cherry Mobile Ace est disponible dans les commerces de détail locaux et sur les sites de commerce en ligne.

+ +

Disponibilité

+ + + +

Coloris disponibles

+ + + +

Mises à jour du logiciel

+ +

L'image système de l'appareil est verrouillée et seules les mises à jour OTA permettent donc de l'actualiser.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/fairphone/index.html b/files/fr/archive/b2g_os/phone_guide/fairphone/index.html new file mode 100644 index 0000000000..7d67765df2 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/fairphone/index.html @@ -0,0 +1,190 @@ +--- +title: Fairphone +slug: Archive/B2G_OS/Phone_guide/Fairphone +tags: + - B2G + - Commerce équitable + - Fairphone + - Firefox OS + - Gaia + - Guide + - Terminaux + - Téléphone +translation_of: Archive/B2G_OS/Phone_guide/Fairphone +--- +
+

Attention: Cet appareil ne fonctionne PAS encore avec Firefox OS. Cette page a pour but de regrouper les informations pour coordonner le travail de portage.

+
+ +

Le Fairphone est un téléphone équitable visant une création, une production, une distribution, une réparation et un recyclage justes et respectueux de l'homme et de l'environnement. Les appareils ne sont pas complétement libres matériellement, mais ils visent l'idéal de redonner du contrôle sur le matériel à l'utilisateur.

+ +

Informations sur les sorties des appareils

+ +

Fairphone a mis à disposition deux appareils jusqu'à présent — le Fairphone v1 FP1 (première édition) est sorti le 30 décembre 2013, et le FP1U (deuxième vague de vente) le 22 Juillet 2014. Les téléphones version 1 ne sont actuellement plus vendus. Le Fairphone v2 est sorti le 16 Juillet 2015 et peut être commandé sur Fairphone.

+ + + + + + + + + + + + + + +
Fairphone v1Fairphone v2
Une image du Fairphone v1, montrant l'écran de verrouillage et le dos du téléphone. Crédit : Fairphone. CC BY-NC-SA.Fairphone 2 Black Matte
+ +
+

Note: Vous pouvez suivre les nouveautés sur le blog Fairphone, et jeter un œil à la stratégie et l'approche de Fairphone.

+
+ +

Porter Firefox OS sur les appareils Fairphone

+ +

Ce n'est pas encore achevé mais le travail est en cours.

+ +

Problèmes actuels

+ +

L'Android personnalisé utilisé par le Fairphone v1 ne peut pas être mis à jour car le fabricant du chipset refuse de mettre à disposition les mises à jour de driver pour le modem ou d'en ouvrir le code source.

+ +

Au Mobile World Congress 2015, Fairphone a fait un appel pour un possible système d'exploitation alternatif disponible pour le Fairphone v2 à venir. En dehors de ces discussions, un travail de portage de Firefox OS a débuté. Un tel portage serait un moyen de permettre d'offrir une plus grande durabilité au Fairphone V1, et montrerait l'exemple pour que cela n'arrive pas aux futures générations de téléphones. Une collaboration de Mozilla avec principaux fabricants de puces permettrait aussi de faire évoluer les mentalités ou d'éviter ce type de problèmes.

+ +

Le Fairphone v2 est orienté open source et les contributions de la communauté au Fairphone OS sont encouragées.

+ +

Évolution et solution

+ +

Le projet de port vient juste de commencer (phase de démarrage). Nous espérons pouvoir commencer rapidement — revenez sur cette page pour plus d'informations.

+ +

Contribuer

+ +

Si vous souhaitez en savoir plus ou contribuer au port, les liens suivants vous mèneront à bon port.

+ +

Outils du projet

+ + + +

Firefox OS

+ +

Si vous étes un développeur de ports ou si vous souhaitez en savoir plus à propos de Firefox OS:

+ + + +

Communauté de port XDA

+ +

Si vous êtes un développeru Firefox OS et souhaitez en savoir plus à propos du portage de Firefox OS:

+ + + +

Spécifications techniques

+ +

Fairphone v1

+ +

Vous pouvez trouver une liste détaillée des spécifications sur la page des caractéristiques du téléphone Fairphone.

+ +

Réseau

+ + + +

Matériel

+ + + +

Logiciel

+ + + +

Fairphone v2

+ +

Vous pouvez trouver une liste détaillée des spécifications sur la page des caractéristiques Fairphone.

+ +

Réseau

+ + + +

Matériel

+ + + +

Logiciel

+ + + +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/firefox_os_device_features/index.html b/files/fr/archive/b2g_os/phone_guide/firefox_os_device_features/index.html new file mode 100644 index 0000000000..0b15441a7e --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/firefox_os_device_features/index.html @@ -0,0 +1,76 @@ +--- +title: Caractéristiques des appareils Firefox OS +slug: Archive/B2G_OS/Phone_guide/Firefox_OS_device_features +tags: + - Boutons et contrôles + - Conditions requises + - Firefox OS + - Hardware +translation_of: Archive/B2G_OS/Phone_guide/Firefox_OS_device_features +--- +

Boutons et commandes

+ +

Un appareil Firefox OS classique possède un certain nombre de boutons physiques:

+ +
+
Bouton Home
+
Ce bouton est généralement centré sous l'écran. Appuyer dessus permet de revenir au lanceur d'applications. En restant appuyé dessus on ouvre la vue des différentes applications en cours. Un geste vers le haut permet de fermer l'application.
+
La barre de contrôle du volume
+
La barre de contrôle du volume est située sur le côté gauche; appuyer sur la moitié haute augmente le volume; appuyer sur la partie basse diminue le volume.
+
Bouton power
+
Le bouton power est situé en haut à droite de l'appareil.
+
+ +

Caractéristiques matérielles minimales requises

+ +

En général, les appareils mobiles basés sur ARM sont assez puissants pour supporter Firefox OS. Cette section présente les caractéristiques minimales requises ainsi que les caractéristiques minimales recommandées des smartphones fonctionnant sous Firefox OS.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ComposantMinimumRecommandé
CPUARMv6Cortex classe A5 ou mieux
+ ARMv7a avec NEON
GPU—Adreno classe 200 ou mieux
RAM128 MB512 MB
Connectivité—Wi-Fi
+ 3G
Capteurs—Accéléromètre
+ De proximité
+ De luminosité
+ A-GPS
+ +
+

Note: Pour une bonne expérience utilisateur, il est recommandé de choisir un appareil offrant des couleurs uniformes (implémentées par le pilote graphique) et intégrant le support des écouteurs pour activer/désactiver le mode silencieux ou encore pour lancer/stopper les médias. Ces fonctionnalités sont classiques sur les smartphones modernes.

+
+ +
+
 
+
diff --git a/files/fr/archive/b2g_os/phone_guide/flame/configuration/index.html b/files/fr/archive/b2g_os/phone_guide/flame/configuration/index.html new file mode 100644 index 0000000000..f0dd4ef786 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/flame/configuration/index.html @@ -0,0 +1,129 @@ +--- +title: Configuration initiale +slug: Archive/B2G_OS/Phone_guide/Flame/configuration +tags: + - B2G + - Firefox OS + - Flame + - Téléphone Développeur + - Téléphone Référence +translation_of: Archive/B2G_OS/Phone_guide/Flame/Initial_setup +--- +
+

Après vous être procuré un téléphone Flame, vous devez suivre des étapes de configuration afin qu'il puisse communiquer correctement avec votre ordinateur et votre système d'exploitation. Ces étapes sont nécessaires pour pouvoir mettre à jour votre téléphone, le déboguer ou pousser des applications en cours de développement avec nos outils.

+
+ +

Pour tous systèmes d'exploitation

+ +

Vous devez installer les outils ADB et Fastboot sur votre ordinateur. Ces applications permettent notamment d'interagir avec votre téléphone lorsque ceux-ci sont connectés par USB. Ce sont elles qui vous permettront de "flasher" votre téléphone dans une version de Firefox OS, le rétablir si il est "briqué", pousser des applications, etc...

+ +
+

Note : Si vous êtes sous ubuntu ou debian, vous pouvez installer simplement ces applications avec la commande sudo apt-get install android-tools-adb android-tools-fastboot.

+
+ +
+

Note : Si vous êtes sous Mac OS, vous pouvez installer ADB et Fastboot en utilisant Homebrew sur la ligne de commande. Voir Installer et utiliser ADB.

+
+ +

ADB et Fastboot sont disponibles sur Android Developer Toolkit:

+ +
    +
  1. Rendez-vous sur le site
    2. +
  2. Cliquez sur Download Eclipse ADT button.
    3. +
  3. Acceptez le contrat d'utilisation après l'avoir lu.
    4. +
  4. Sélectionnez la version 32-bits ou 64-bit suivant votre système d'exploitation courant (si vous ne savez pas laquelle prendre, utilisez la version 32-bit).
    5. +
  5. Cliquez sur le bouton Download Eclipse ADT with the Android SDK....
    6. +
  6. Après téléchargement du fichier dézippez le dans le répertoire de votre choix.
    7. +
  7. Le nom du dossier étant assez compliqué, vous pouvez le renommer le dossier en adt si vous le souhaitez.
    8. +
+ +

ADB est un outil qui fonctione uniquement en ligne de commande. Ouvrez une invite de ligne de commande ou un terminal de votre système et rendez-vous dans le dossier que vous venez de dézipper puis dans adt/sdk/platform-tools et lancez la commande adb. Vous devriez voir apparaitre une liste d'informations en réponse. Exécuter la commande adb devices devrait retourner la liste des appareils reliés à votre ordinateur (la liste sera vide si votre téléphone n'est pas connecté.

+ +

Afin que l'ensemble des outils fonctionnent, vous devez ajouter les outils ADB à la variable système PATH. Gràce à ça, la commande adb sera exécutable depuis n'importe quel dossier.

+ +

Pour faire cela sous Windows 8 (pour Windows 7, ce sera identique mais le nom des menus peut différer) :

+ + + +
+

Note : Pour ouvrir une ligne de commande, effectuez un clic droit sur le bouton windows en bas à gauche de votre écran et sélectionner Ligne de commande.

+
+ +

Sous Mac/Linux:

+ + + +
+

Note : sous Mac OS, si vous ne voyez pas les fichiers cachés, ouvrez un terminal et exécutez la commande suivante : defaults write com.apple.finder AppleShowAllFiles YES

+
+ +

Enable remote debugging

+ +

Assurez-vous que le débogage est activé sur votre Flame, en utilisant l'option Débogage distant/Dégogage USB de l'appareil Paramètres développeurs (L'option est nommée différemment, selon que vous ayez Firefox 1.3 et inférieur, ou Firefox 1.4+ installé).

+ +

Étapes supplémentaires pour Linux

+ +

Suivant la distribution que vous utilisez, vous devrez peut-être ajouter une nouvelle règle udev pour votre téléphone.

+ +

Afin de déterminer le vendor ID de votre téléphone, connectez-le via USB et exécutez la commande lsusb qui listera l'ensemble de vos périphériques USB. Trouvez votre téléphone dans la liste et notez les quatre derniers chiffres qui suivent le préfixe "ID". Un identifiant de Flame est habituellement 05c6, donc la règle UDEV à ajouter serait :

+ +
SUBSYSTEM=="usb", ATTRS{idVendor}=="05c6", MODE="0666"
+
+ +

Si votre téléphone est listé avec un autre identifiant, utilisez le à la place. Par exemple :

+ +
SUBSYSTEM=="usb", ATTRS{idVendor}=="18d1", MODE="0666"
+
+ +

Après modification, exécutez la commande udevadm control --reload-rules pour recharger la configuration, débranchez puis rebranchez votre téléphone avant de continuer.

+ +

Étapes supplémentaires pour Windows

+ +

Pour accéder à un téléphone Flame avec les outils ADB ainsi qu'avec les outils de développement de Mozilla comme App Manager/WebIDE , un driver USB est demandé. La suite de ce paragraphe va vous détailler les étapes d'installation de celui-ci.

+ +

Télécharger le driver

+ +

Téléchargez le driver Windows. Extrayez le fichier ZIP sur dans un répertoire.

+ +
+

Note: L'outils ADB doit être installé avant le driver : veuillez suivre les instructions fournies plus haut si vous ne l'avez pas encore fait.

+
+ +

Installer le driver USB

+ +

Connectez votre téléphone Flame à votre ordinateur avec un câble USB.

+ +

Pour installer le driver, ouvrer le répertoire Alcatel_USB_Driver_Q_4.0.0_2013_11_11_noinstall créé après extraction et exécutez le fichier DriverInstaller.exe. Vous pouvez recevoir un message d'avertissement de la part de Windows indiquant qu'il ne connait pas l'éditeur de l'application. Si c'est le cas, cliquez sur oui pour continuer.

+ +

Simple dialog box showing a picture of a phone along with install and uninstall buttons.

+ +

Cliquez sur le bouton Install pour installer le driver.

+ +

Après installation, vous pouvez contrôler que tout fonctionne correctement en ouvrant un terminal et en exécutant la commande adb devices.

+ +

Assurez-vous que le débogage à distance est activé sur votre téléphone en activant l'option Remote debugging/Debugging via USB dans les paramètres pour développeur (suivant la version que vous utilisez le nom de l'option et sa localisation dans les menus peut légèrement différer).

+ +

Le résultat de la commande doit ressembler à ça :

+ +
List of devices attached
+3561d02a          device
+ +

Si votre téléphone n'apparait pas, contrôler le gestionnaire de périphériques de Windows. Le Flame devrait apparaitre sous le nom "ACER ADB Interface". Vous pouvez confirmer sa présence en débranchant le câble USB : il devrait alors disparaitre de liste des périphériques. Désinstallez le driver en effectuant un clic droit sur "ACER ADB Interface" et cliquez sur désinstaller. Assurez-vous de bien cocher la case pour désinstaller le driver.  Relancez l'installation. Il peut être utile de désactiver la mise en veille de votre téléphone durant l'installation : Windows peut vouloir utiliser un driver par défaut quand l'écran est éteint.

diff --git a/files/fr/archive/b2g_os/phone_guide/flame/index.html b/files/fr/archive/b2g_os/phone_guide/flame/index.html new file mode 100644 index 0000000000..5fb73d826f --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/flame/index.html @@ -0,0 +1,71 @@ +--- +title: Flame +slug: Archive/B2G_OS/Phone_guide/Flame +tags: + - B2G + - Firefox OS + - Flame + - Téléphone Développeur + - appareil de référence +translation_of: Archive/B2G_OS/Phone_guide/Flame +--- +
+

Informations sur les mises à jour :  Nous vous recommandons vivement de rejoindre la liste de diffusion suivante pour vous tenir au courant de toutes les nouvautés sur les mises à jour et de toutes les informations concernant le Flame : https://mail.mozilla.org/listinfo/flamenews

+
+ +
+

Une image du Flame, présentant l’écran d’accueil de Firefox OS avec divers icônes d'applications.

+ +

Disponible sur commande

+ +

Le téléphone de référence pour les développeurs Flame est une étape importante dans la sortie des appareils Firefox OS. Les caractéristiques matérielles du Flame proposent un ensemble représentatif des spécifications – dont un écran FWVGA et un processeur double coeur – pour aider les développeurs à construire du contenu et des expériences de qualité. Une plateforme matérielle unique est également un atout pour les testeurs, facilitant les tests et permettant de résoudre les problèmes spécifiques aux logiciels sans avoir à se soucier de bogues spécifiques aux modèles d'appareils, etc.

+
+ +

Si vous avez votre téléphone en main et que vous voulez commencer à vous amuser avec, développer et distribuer des applications, ou contribuer à la plateforme Firefox, les liens suivants vous amèneront là où vous avez besoin d'aller :

+ + + +

Si vous souhaitez en savoir plus sur la mise à jour du système d'exploitation, sa récupération, l'envoi d'applications ou les caractéristiques du téléphone, vous trouverez les informations dont vous avez besoin ci-dessous.

+ +

Acheter un appareil

+ +

Le Flame n'est malheureusement plus disponible à la vente. Il existe toujours d'autres opportunités pour les développeurs d'obtenir un appareil gratuitement, y compris lors d'une prochaine session du programme Foxtrot. Si vous avez des questions sur les manières d'obtenir un appareil, vous pouvez contacter Asa Dotzler ou Marcia Knous sur IRC.

+ +

Caractéristiques réseau et matérielles

+ +

Vous pouvez trouver plus de fonctionnalités matérielles listées sur notre Page de caractéristiques des téléphones et appareils.

+ +

Réseau

+ + + +

Matériel

+ + + +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/flame/mettre_a_jour_flame/index.html b/files/fr/archive/b2g_os/phone_guide/flame/mettre_a_jour_flame/index.html new file mode 100644 index 0000000000..e3825ba9f9 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/flame/mettre_a_jour_flame/index.html @@ -0,0 +1,353 @@ +--- +title: Mettre à jour votre Flame +slug: Archive/B2G_OS/Phone_guide/Flame/mettre_a_jour_Flame +tags: + - Firefox OS + - Flame + - Smartphone développeur + - Téléphone Développeur +translation_of: Archive/B2G_OS/Phone_guide/Flame/Updating_your_Flame +--- +
+

Cet article explique comment mettre à jour la partie logicielle de votre Flame — y compris la mise à jour de Firefox OS et l'ajout de nouvelles applications sur votre téléphone — comment conserver vos données, et d'autres informations utiles. Avant toute chose, vous devriez vous assurer que vous avez suivi les étapes d'initialisation nécessaires

+
+ +

Guide rapide pour mettre à jour Firefox OS sur le Flame

+ +

Il y a beaucoup d'informations dans cet article, alors nous avons décidé de vous fournir un guide qui vous permet de maintenir votre Flame à jour. Vous trouverez ci-dessous les informations nécessaires.

+ +

Flashage vers la dernière image (2.5)

+ +

Les étapes suivantes doivent être validées avant toute autre chose.

+ +
Prérequis: Assurez vous d'avoir adb et fastboot installés et fonctionnels sur votre système (voir Installer ADB et Fastboot).
+ 
+ +
    +
  1. Télécharger la dernière image —Base image v18D_nightly_v4 — sur votre PC ou Mac.
    2. +
  2. Sur votre Flame, activer le "remote debugging" dans le menu Settings > Developer et activer le Debugging via USB dans le menu Developer.
    3. +
  3. Connecter votre Flame à votre PC / Mac via un cable USB.
    4. +
  4. Vérifier la bonne connexion en tapant la commande : + 
    adb devices  
    +
    5. +
+ +

Vous devriez avoir une réponse comme celle-ci:

+ +
List of devices attached
+94f7ce4c    device
+ + + +
    +
  1. Notes : Si le script ne parvient pas à voir votre Flame, vérifiez que vous avez correctement configuré les règles udev. Si le script flash.sh n'existe pas, vous pouvez renommer le fichier flash.bat en flash.sh et l'exécuter.
    2. +
+ +
+

Nota: Vous pouvez vérifier la qualité de l'image téléchargée en tapant la commande ci-dessous :

+ +
Checksum: SHA512(v18D_nightly_v4.zip)= 9105e29fd39da1ae487b01da4431a803d619d31482147b4383002b8a10268905fd444b108a438395a78d289cfe4e8fba10c3fb6b0d187f3535f027bf90c2391a Build id: 20150527010201
+
+ +
 
+ +

A cet instant, vous devez être en présence d'un Flame avec la version 2.5 de Firefox OS et recevoir les mises à jour OTA (Over The Air).

+ +
+

Nota: si vous voulez avoir la dernière version instable pour Flame (qui n'a pas été pleinement testée), aller dans settings -> developer, descendre vers le bas et changer le channel pour nightly-latest.  Rebooter le Flame, retourner dans settings -> device info et vérifier s'il y a des MAJ. Vous pouvez obtenir ainsi la dernière version sans "shallow flash". Pour le "shallow flashing" voir plus bas dans cet article.

+
+ +

Bug de reset de l'Update channel

+ +

Comme notifié dans le bug 1217490, plusieurs testeurs de Firefox OS essayant Firefox OS 2.5 latest OTA updates (sur Flame, mais aussi sur d'autres smartphones) ont constaté que quand ils font une MAJ OTA, leur update channel est réinitialisé à nightly, ce qui implique qu'ils ne vont plus recevoir des MAJ OTA par la suite. Pour éviter le problème, il est conseillé de mettre votre update channel à nightly-latest en utilisant WebIDE. Pour cela :

+ +
    +
  1. Brancher votre Flame au PC/Mac via USB (assurez-vous que Debugging via USB est réglé sur ADB and DevTools dans le Developer Settings)
    2. +
  2. Ouvrir le navigateur Firefox sur votre PC/mac et lancer WebIDE.
    3. +
  3. Connecter WebIDE à votre Flame en le sélectionnant dans le menu USB Devices. Accepter la connexion sur le Flame pour l'activer.
    4. +
  4. Dans le Menu Sélection de l'environnement en haut à droite de WebIDE UI, sélectionner Paramètres de l'appareil.
    5. +
  5. Chercher app.update.channel dans la liste et changer la valeur dans la textbox pour nightly-latest.
    6. +
  6. Chercher app.update.channel.backup et changer la valeur pour  nightly-latest si vous voulez restez en Nightly après les MAJ.
    7. +
+ +

Mettre à jour la partie logicielle du Flame (Firefox OS 2.0, pour plus récent voir plus haut)

+ +

Il existe deux canaux de diffusion pour les mises à jour de Firefox OS pour le Flame:

+ + + +

Images d'installation

+ +

Vous trouverez les images et outils d'installation aux adresses suivantes :

+ +

Dernières versions :

+ + + +
+

Note: Vous pouvez connaître l'image utilisée par votre périphérique en utilisant la commande: adb shell getprop ro.bootloader

+
+ +
+
+

Important: Attention, lorsque vous effectuez une installation complète ou partielle (shallow) à partir de ces images, vous perdez les informations contenues dans votre téléphone. Avant d'effectuer le "flash", vous devriez faire une sauvegarde de vos données personnelles. Vous pourrez ainsi les restaurer après. Rendez-vous à la section "sauvegarder et restaurer les données de votre Flame".

+
+
+ +

Versions précédentes :

+ +

Ces versions sont listées ici seulement pour information, vous ne devriez pas les utiliser.

+ + + +
Note: Les images de Firefox OS v180 et suivantes sont basées sur Android KK (Kitkat, 4.4); les images basées sur JB (Jellybean, 4.1-4.3) ne sont plus supportées et sont obsolètes. N'utilisez pas de version inférieure à v180.
+ +

Installation d'une image de base

+ +

Pour installer une image de base sur votre périphérique:

+ +
    +
  1. Assurez-vous que le débogage à distance soit activé en utilisant la fonction Remote debugging/Debugging via USB dans les menus de développement (cette option peut avoir un nom différent suivant la version de Firefox OS que vous utilisez actuellement).
    2. +
  2. Connectez votre téléphone via un câble USB à votre ordinateur. Vérifiez que votre téléphone est reconnu correctement en exécutant la commande adb devices depuis un terminal.
    3. +
  3. Téléchargez une archive zip référencée ci-dessus et dézippez-la dans un répertoire.
    4. +
  4. Allez dans le répertoire où vous avez extrait les fichiers et exécutez les commandes suivantes : +
      +
    • Sous Windows, placez-vous dans le répertoire depuis la ligne de commande et exécutez le script flash.bat (vous pouvez aussi double-cliquer sur le fichier depuis l'explorateur Windows).
      + Notes : Si le script flash.bat n'existe pas, vous pouvez renommer le fichier flash.sh en flash.bat et l'exécuter. Vérifiez bien que les outils adb et fastboot sont installés et ajoutés à votre variable d'environnement PATH.
      • +
    • Sous Linux / OSX, placez-vous dans le répertoire depuis la ligne de commande et exécutez le script flash.sh.
      + Attention : il est déconseillé d'exécuter la commande avec sudo car cela est très dangereux de l'utiliser avec des exécutables téléchargés depuis internet.
      + Notes : Si le script ne parvient pas à voir votre Flame, vérifiez que vous avez correctement configuré les règles udev. Si le script flash.sh n'existe pas, vous pouvez renommer le fichier flash.bat en flash.sh et l'exécuter
      • +
    +
    5. +
+ +
+

Note: Si vous rencontrez une erreur "permission denied" ou un erreur "Waiting for device" lorsque vous exécutez, il s'agit probablement d'une erreur provoquée par des droits système manquant. Vous pouvez résoudre ce problème en exécutant la commande suivante chmod +x flash.sh depuis le bon répertoire.

+
+ +
+

Note : Vous pouvez aussi essayer d'installer vos propres versions de Firefox OS sur votre Flame. Pour cela, rendez vous ici: Compiler et installer Firefox OS.

+
+ +

Régler les problèmes de font

+ +
+

Attention : cette étape est spécifique à l'image v180

+
+ +

Après avoir mis à jour Gecko et Gaia vers le canal nightly avec l'image v180, vous rencontrerez des problèmes car Gecko et Gaïa attendront des fonts qui ne sont pas dans l'image (ce bug a été corrigé avec la version v188). Pour résoudre ce problème, téléchargez notre outil de mise à jour des fonts, dézippez-le et exécutez le script flash.sh fourni.

+ +
+

Note : Vous pouvez aussi utiliser le script update_system_fonts.sh qui téléchargera et installera automatiquement les fonts manquantes.

+
+ +

Mettre à jour votre Flame avec une image du canal nightly

+ +
+

Note: Actuellement, les versions Nightly de Firefox OS ne proposent pas de support pour A-GPS ce qui peut poser des soucis de performance avec la fonctionnalité GPS de votre téléphone. Il est prévu que cela soit résolu dans une future version publiée sur ce canal.

+
+ +
+

Important: Attention, lorsque vous effectuez une installation complète ou partielle (shallow) à partir de ces images, vous perdez les informations contenues dans votre téléphone. Avant d'effectuer le "flash", vous devriez faire une sauvegarde de vos données personnelles. Vous pourrez ainsi les restaurer après. Rendez-vous à la section "sauvegarder et restaurer les données de votre Flame".

+
+ +
    +
  1. Avant de penser à installer une version Nightly, vous devriez installer la dernière image du canal stable sur votre téléphone afin d'être sûr que tous les prérequis systèmes soient remplis.
    2. +
  2. Parce que vous allez installer une image complète du système, vous devez activer le débogage à distance depuis votre Flame depuis les paramètres pour développeurs sur Firefox OS.
    3. +
  3. Sélectionnez l'image que vous voulez installer (en la sélectionnant depuis http://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/). Vous pouvez aussi utiliser une des images suivantes : + +
    4. +
  4. Sélectionnez une version et téléchargez les deux fichiers suivant b2g-XX.XX.en-US.android-arm.tar.gz et gaia.zip. Sauvegardez-les dans un dossier nommé, par exemple, fxos.
    5. +
  5. Téléchargez le script d'installation shallow flash et sauvegardez-le dans le même dossier que les deux fichiers précédents. Pour cela, suivez le lien shallow flash, cliquez sur le bouton Raw et utilisez la fonctionnalité "enregistrer sous" de votre navigateur pour sauvegarder le fichier en le nommant shallow_flash.sh.
    6. +
  6. Pour les utilisateur Windows: Téléchargez le script shallow_flash.bat et installez l'outil Cygwin qui fournit une ligne de commande typée Linux sur votre environnement Windows. Pour cela, téléchargez le fichier d'installation setup*.exe  et déposez-le dans le même répertoire que le script shallow_flash.bat . Celui-ci se chargera d'installer correctement Cygwin pour vous.
    7. +
  7. +

    Depuis le Terminal, placez-vous dans le répertoire où vous avez sauvegardé vos fichiers et exécutez les commandes suivantes :

    + +

    Linux:

    + + 
    ./shallow_flash.sh --gaia=gaia.zip --gecko=b2g-XX.XX.en-US.android-arm.tar.gz
+
    + +

    Mac:

    + + 
    ./shallow_flash.sh --gaia gaia.zip --gecko b2g-XX.XX.en-US.android-arm.tar.gz
    + +

    Windows:

    + +

    Double-cliquez sur shallow_flash.bat ou exécutez-le depuis la ligne de commande Windows. Cela aura pour effet de flasher votre téléphone avec gaia.zip et un fichier  b2g-XX.XX.en-US.android-arm.tar.gz .

    +
    8. +
+ +
+

Note: Si vous rencontrez une erreur "permission denied" ou une erreur "Waiting for device" lorsque vous exécutez l'étape ci-dessus, il s'agit probablement d'une erreur provoquée par des droits système manquants. Vous pouvez résoudre ce problème en exécutant la commande suivante: chmod +x flash.sh depuis le bon répertoire.

+
+ +
+

Note: Une installation "shallow flash" met à jour Gecko, Gaia et seulement quelques données systèmes en opposition à une installation complète qui met à jour Gecko/Gaia mais aussi Gonk avec l'ensemble des paramétrages spécifiques à votre téléphone. C'est pour cette raison qu'il est conseillé d'installer une image complète à jour avant d'effectuer une installation "shallow" : de cette manière vous êtes assuré d'avoir une version à jour de Gonk et ses paramètres.

+
+ +

Après installation, votre téléphone devrait redémarrer et vous proposer les étapes de paramétrage spécifiques à une nouvelle installation.

+ +

Passer sur le canal d'installation nightly

+ +

Depuis la version 2.2, vous pouvez directement sélectionner le canal de mise à jour depuis les paramètres pour développeurs sur Firefox OS.

+ +

Si ce paramétrage n'est pas disponible, vous pouvez utiliser la "vieille" méthode.

+ +
    +
  1. Assurez-vous que le débogage distant par USB soit activé depuis les paramètres pour développeurs sur Firefox OS.
    2. +
  2. Téléchargez le script suivant. Pour cela, suivez le lien, cliquez sur le boutton Raw et utilisez la fonctionnalité "enregistrer sous" de votre navigateur pour sauvegarder le fichier en le nommant change_channel.sh.
    3. +
  3. Depuis la ligne de commande et le répertoire où vous avez enregistré le script, vous pouvez changer le canal de mise à jour en exécutant la commande suivante :
    + + 
    ./change_channel.sh -v nightly
    +
    4. +
  4. Après redémarrage du téléphone, vous pouvez contrôler la présence d'une mise à jour OTA en vous rendant dans les menus Paramètres > Informations > Mises à jour logicielles > check for updates.
    5. +
+ +
+

Note: Vous avez le choix entre de nombreux canaux de mise à jour . Exécutez la commande "./change_channel.sh -h" pour les lister.

+
+ +

Mode Fastboot

+ +

Si l'installation d'une image échoue sur votre téléphone, votre téléphone peut ne plus fonctionner correctement et démarrer seulement en mode Fastboot. Ce mode de récupération propose peu d'options (Reboot, Update from adb, Wipe data, Wipe cache, and Update from sdcard). Malheureusement, sélectionner l'option Update from adb charge un mode spécifique de l'outil ADB (adb sideload) ne permettant pas d'exécuter les scripts nécessaires à l'installation d'une image correcte.

+ +

Pour forcer un démarrage en mode fastboot utilisable, vous pouvez exécuter les commandes suivantes :

+ +
    +
  1. +

    Éteignez votre téléphone (si vous ne pouvez pas l'éteindre, retirez la batterie et remettez-la en place).

    +
    2. +
  2. Branchez le téléphone à votre ordinateur via un câble USB.
    3. +
  3. Démarrez votre téléphone en maintenant les boutons d'allumage et "descendre le volume".
    4. +
+ +

Votre téléphone devrait s'allumer et afficher le texte "FASTBOOT" : cela signifie qu'il attend d'être connecté par USB. Si vous exécutez la commande fastboot devices vous devriez voir votre téléphone. Remarquez que la commande habituelle adb ne verra pas votre téléphone. Depuis ce mode, vous pouvez utiliser les scripts pour installer une image de base comme expliqué plus haut. Comme les scripts utilisent des commandes adb et fastboot, vous devriez voir des messages d'erreur et / ou d'avertissement apparaître mais cela n'empêchera pas l'installation de se dérouler complètement.

+ +

Outil de récupération d'urgence

+ +

Si la mise à jour échoue, que votre téléphone est inutilisable et que vous ne pouvez entrer en mode fastboot, vous pouvez utiliser l'outil de récupération d'urgence. Le câble fourni avec le téléphone qui comporte une étiquette rouge “Recovery Cable” et l'outil de récupération "Emergency Download Tool", sont nécessaires à cette opération. Contactez le fabriquant (flameservice [at] thundersoft.com) pour tout support technique.

+ +

Emergency download tool dialog box as it is when it start.

+ +
+

Note : L'outil n'est compatible qu'avec Windows.

+
+ +
+

Note : L'outil de récupération est fourni dans l'état, sans instructions supplémentaires ou documentation (tout du moins pas encore).

+
+ +

Mode Recovery

+ +

Vous pouvez entrer dans le mode recovery pour effacer les données de votre téléphone ou installer manuellement un nouveau firmware. Pour rentrer dans ce mode, vous avez deux solutions :

+ + + +

Depuis le mode recovery, vous pouvez naviguer dans les menus via les boutons monter / baisser le volume et sélectionner les options via le bouton d'allumage. Assurez vous d'avoir sauvegardé votre profil avec vos données personnelles avant d'effacer les données ou d'effectuer une mise à jour.

+ +

Sauvegarder et restaurer les données de votre Flame

+ +

Lorsque vous utilisez votre téléphone Flame couramment, vous ne voulez peut-être pas perdre vos données personnelles comme vos contacts, vos paramétrages ou vos applications en mettant à jour votre téléphone avec les images listés ci-dessus. Pour sauvegarder et restaurer votre profil, vous pouvez utiliser notre outil livré dans le dépôt Git B2G-flash-tool.

+ +
    +
  1. Ouvrez votre ligne de commande.
    2. +
  2. Clonez le dépôt suivant (vous devez avoir Git installé sur votre système). (Si vous ne possédez pas Git ou ne pouvez l'installer, un bouton "download as Zip" vous permet de télécharger le dépôt complet). + 
    git clone https://github.com/Mozilla-TWQA/B2G-flash-tool
    +
    3. +
  3. L'outil se présente sous la forme d'un script python : backup_restore_profile.py. Pour l'utiliser, vous devez avoir l'outil Python d'installé sur votre ordinateur (la version 2.7.x devrait suffire). Les systèmes Linux et Mac les installent habituellement par défaut.
    4. +
  4. Rendez-vous dans le dossier où vous avez cloné le dépôt avec un terminal de ligne de commande cd B2G-flash-tool.
    5. +
+ +
+

Note: Lorsque vous utilisez cet outil, assurez-vous d'avoir activé le mode debogage distant via USB depuis les paramètres pour développeurs sur Firefox OS et que l'outil ADB est installé sur votre ordinateur.

+
+ +
+

Note: Si vous avez un message d'erreur à propos d'autorisations manquantes pour exécuter le script, exécutez la commande suivante :

+ +
chmod +x backup_restore_profile.py
+
+ +

Sauvegarder les données de votre téléphone

+ +

Depuis le répertoire où vous avez sauvegardé le dépôt exécutez la commande suivante :

+ +
python backup_restore_profile.py -b
+ +

Cela devrait sauvegarder votre profil dans un répertoire mozilla-profile situé dans le même répertoire que le script.

+ +

Restaurer les données sur votre téléphone

+ +

Depuis le répertoire où est situé mozilla-profile, exécutez la commande suivante :

+ +
python backup_restore_profile.py -r
+ +
+

Note: Vous pouvez lister l'ensemble des options disponibles en exécutant la commande python backup_restore_profile.py -h.

+
+ +

Installer des application sur votre Flame

+ +

Les outils App Manager et WebIDE rendent facile l'installation et le débogage des applications sur votre téléphone.

+ +

Ajuster la taille de la RAM

+ +

Vous pouvez modifier la taille de la RAM de votre téléphone pour tester le comportement du système ou des applications sur des téléphones qui auraient moins de RAM que le Flame.

+ +

Cela est géré depuis le mode fastboot (installez d'abord fastboot et ADB) et exécutez les commandes suivantes :

+ +
adb reboot bootloader
+fastboot oem mem [0|256-1024]
+ +

“0” indique que la quantité de RAM sera détectée automatiquement, “256-1024” correspond à un nombre de megabytes. Par exemple, si vous voulez que votre système n'utilise que 512Mo entrez la commande fastboot oem mem 512.

+ +

Pour que les modifications soient prises en compte, vous devrez redémarrer votre téléphone en utilisant la commande suivante :

+ +
fastboot reboot
+ +

La quantité de mémoire actuellement utilisée / paramétrée peut être récupérée avec la commande suivante :

+ +
fastboot getvar mem
diff --git a/files/fr/archive/b2g_os/phone_guide/fx0/index.html b/files/fr/archive/b2g_os/phone_guide/fx0/index.html new file mode 100644 index 0000000000..a203e30eb5 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/fx0/index.html @@ -0,0 +1,108 @@ +--- +title: Fx0 +slug: Archive/B2G_OS/Phone_guide/Fx0 +tags: + - Firefox OS + - Fx0 + - KDDI + - Téléphone + - consommateur +translation_of: Archive/B2G_OS/Phone_guide/Fx0 +--- +
+
+

+
+ +
+

Le Fx0 est un smartphone Firefox OS haut de gamme et constitue le tout premier téléphone sous Firefox OS distribué au Japon. Il a été commercialisé par KDDI en décembre 2014.

+ +

Acheter un appareil

+ +

Le Fx0 est disponible à l'achat via les canaux de distribution japonais classiques. C'est un périphérique SIM-locké, il ne peut donc être utilisé qu'au Japon.

+ +

Désormais, il y a quelques téléphones SIM débloqués qui sont vendus dans des sites marchands.

+ +

Mise à jour logicielle

+ +

L'image système de l'appareil étant verrouillée, il n'est possible de mettre à jour le logiciel que lorsque l'opérateur téléphonique publie une mise à jour OTA. L'image système de l'appareil est basée sur Firefox OS 2.0.

+
+
+ +

Spécifications de l'appareil

+ +

Vous pouvez trouver davantage d'informations sur les spécifications de l'appareil sur notre page de specs des téléphones et appareils.

+ +

Matériel

+ + + +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/huawei_y300_ii/index.html b/files/fr/archive/b2g_os/phone_guide/huawei_y300_ii/index.html new file mode 100644 index 0000000000..def7cc5976 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/huawei_y300_ii/index.html @@ -0,0 +1,67 @@ +--- +title: Huawei Y300 II +slug: Archive/B2G_OS/Phone_guide/Huawei_Y300_II +tags: + - Firefox OS + - Huawei Y300II + - Téléphone + - utilisateur +translation_of: Archive/B2G_OS/Phone_guide/Huawei_Y300_II +--- +
+
+ +
+

Le Huawei Ascend Y300 II est très semblable au Ascend Y300 basé sur Android, à l'exception qu'il fait tourner Firefox OS 1.1 et non Android, de Google.

+ +

Acheter un appareil

+ +

Le Huawei Ascend Y300 II est disponible via les canaux de distribution classiques.

+ +

Disponibilité

+ +
    +
  • Philippines
    • +
  • Mexique
    • +
+ +

Opérateurs​

+ +
    +
  • Movistar
    • +
+
+
+ +

Mise à jour du logiciel

+ +

L'image système de l'appareil est verrouillée, il n'est donc possible de mettre à jour le logiciel que lorsque l'opérateur téléphonique publie une mise à jour OTA. L'image système de l'appareil est basée sur Firefox OS 1.1.

+ +

Spécifications de l'appareil

+ + + +

Coloris disponibles

+ + + +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/index.html b/files/fr/archive/b2g_os/phone_guide/index.html new file mode 100644 index 0000000000..6e20502d45 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/index.html @@ -0,0 +1,89 @@ +--- +title: Guide du téléphone pour développeur Firefox OS +slug: Archive/B2G_OS/Phone_guide +tags: + - B2G + - Bonnes pratiques de développement mobile + - Firefox OS + - Téléphone + - distribution + - liste smartphones Firefox OS +translation_of: Archive/B2G_OS/Phone_guide +--- +
+

Cette section contient des informations relatives aux téléphones spécifiques qui tournent sous Firefox OS – que ce soit des appareils pour les développeurs ou pour l'utilisateur final.

+ +

Les informations générales sont disponibles via les pages : comment compiler et installer Firefox OS et développer Firefox OS ; consultez-les pour créer et installer la plate-forme à partir de zéro.

+ +

Pour les développeurs qui possèdent des téléphones sous Firefox OS, les articles suivants peuvent néanmoins se révéler utiles.

+
+ +

A l'attention du  développeur

+ +

Les téléphones listés ici sont spécifiquement dédiés aux développeurs désirant expérimenter Firefox OS, que ce soit pour développer des applications ou contribuer au système d'exploitation lui-même. À ce titre, ils ont des cartes SIM déverouillées , des fichiers système accessibles, etc.

+ +
+
Flame
+
Le dispositif Flame, réalisé en partenariat avec T2Mobile, est la référence officielle pour développer, tester et déboguer Firefox OS ainsi que les applications web ouvertes.
+
Geeksphone
+
Dans cet article, nous donnons quelques conseils de base sur la façon de garder votre Geeksphone à jour et comment modifier les applications système de Gaia.
+
ZTE OPEN
+
Cet article contient des informations sur le téléphone ZTE OPEN sous Firefox OS.
+
ZTE OPEN C
+
Le ZTE Open C est une version du téléphone sous Firefox OS produit par ZTE, avec des composants matériels haut de gamme et les plus récents logiciels .
+
+ +

A l'attention de l'utilisateur

+ +

Les téléphones répertoriés ci-dessous sont des modèles "utilisateurs", donc pas spécialement adaptés pour les "hackers". Cependant, les informations qui suivent sont utiles pour ceux souhaitant localiser des applications ou voulant s'assurer que leurs applications fonctionnent sur un périphérique spécifique.

+ +

Pour une liste plus complète des périphériques, consultez notre page Firefox OS - Appareils et disponibilité.

+ +
+
Alcatel One Touch Fire
+
Disponible dans plus de cinq pays, l'Alcatel One Touch Fire est un smartphone sous Firefox OS 1.3.
+
Alcatel One Touch Pixi 3 (3.5)
+
Smartphone propulsé par Firefox OS 2.0, avec une caméra de 2 méga-pixels.
+
Alcatel Onetouch Fire 2C 4020D
+
L'Alcatel Onetouch Fire C est un smartphone sous Firefox OS Tarako (1.3T), lui aussi distribué en Inde.
+
Alcatel Onetouch Fire C
+
L'Alcatel One touch Fire C est un smartphone sous Firefox OS Tarako, distribué en Inde.
+
Alcatel Onetouch Fire E
+
L'Alcatel Onetouch Fire E est un smartphone sous Firefox OS, disponible dans plus de cinq pays.
+
Cherry Mobile Ace
+
Le Cherry Mobile Ace est un smartphone sous Firefox OS 1.3T, disponible aux Philippines.
+
Fx0
+
Le Fx0 est le premier appareil Firefox OS spécifique utilisateur,  sorti au Japon. Il est distribué par KDDI.
+
 Huawei Y300 II
+
Le smartphone Huawei Y300 II, basé sous la version Firefox OS 1.1, est disponible aux Philippines et au Mexique.
+
Intex Cloud FX
+
L'Intex Cloud FX est le smartphone qui propose la toute première version de Firefox OS Tarako en Inde (basée sur Firefox OS 1.3T).
+
LG Fireweb
+
Le LG Fireweb est un smartphone sous Firefox OS 1.1, distribué en Uruguay et au Brésil.
+
Spice Firefox MI FX1
+
Le Spice Fire One MI FX1 est un smartphone sous Firefox OS Tarako (1.3T),  qui est distribué en Inde.
+
Spice Firefox MI FX2
+
Le Spice Fire One MI FX2 est un smartphone utilisateur 3G haut de gamme propulsé par FirefoxOS 1.4 avec une caméra de 2 megapixel, distribué en Inde.
+
Symphony GoFox F15
+
Le Symphony GoFox F15 est le premier appareil Firefox OS avec la capacité d'appels vidéo 3G. Il a été lancé au Bangladesh.
+
Zen U105 Fire
+
Dans cet article, vous trouverez des informations sur le smartphone "budget Zen" U105 Fire, disponible en Inde.
+
ZTE Open II
+
Le ZTE Open II est un smartphone sous Firefox OS disponible dans 7 pays, ayant un processeur double-cœur de 1.2 GHz et une double caméra de 2.0 MP.
+
Orange Klif
+
L'Orange Klif est un smartphone 3G, propulsé par Firefox OS 2.0, avec une caméra de 2 méga-pixels. Il est disponible dans un certain nombre de pays africains.
+
+ +

Informations générales Firefox OS

+ +
+
Spécifications des téléphones Firefox OS
+
Cet article donne la liste des différents téléphones Firefox OS disponibles ainsi que leurs spécifications telles que : noms de code, disponibilité, caractéristiques matérielles.
+
Caractéristiques générales des appareils
+
Cette page répertorie les caractéristiques spécifiques de Firefox OS et la configuration matérielle minimale requise.
+
Dépannage
+
Cet article fournit des conseils pour résoudre les problèmes courants que vous pouvez rencontrer quand vous utilisez Firefox OS.
+
Bonnes pratiques pour les appareils de référence ouverte
+
Un ensemble de bonnes pratiques fortement recommandées pour tout téléphone largement distribué, ayant une référence ouverte.
+
Le développement de tous les périphériques Firefox OS récents, a été effectué selon ces pratiques.
+
diff --git a/files/fr/archive/b2g_os/phone_guide/intex_cloud_fx/index.html b/files/fr/archive/b2g_os/phone_guide/intex_cloud_fx/index.html new file mode 100644 index 0000000000..4a6df1d2d2 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/intex_cloud_fx/index.html @@ -0,0 +1,61 @@ +--- +title: Intex Cloud FX +slug: Archive/B2G_OS/Phone_guide/Intex_Cloud_FX +tags: + - Appareils Tarako + - Firefox OS + - Intex + - Téléphone + - utilisateur +translation_of: Archive/B2G_OS/Phone_guide/Intex_Cloud_FX +--- +
+
Intex Cloud FX image from official website
+ +
+

L'Intex Cloud FX est un smartphone utilisateur sous Firefox OS. Il est le tout premier téléphone Firefox OS Tarako distribué en Inde. Il a été commercialisé par Intex en août 2014.

+ +

Acheter un appareil

+ +
    +
  •   Actuellement non disponible
    • +
+ +

Disponibilité

+ +

Inde

+ +

Mise à jour du logiciel

+ +

L'image système de l'appareil est verrouilée, le logiciel ne peut donc être actualisé que lorsque l'opérateur téléphonique publie une mise à jour OTA. L'image système de l'appareil est basée sur Firefox OS 1.3T.

+
+
+ +

Spécifications de l'appareil

+ +

Vous pouvez trouver plus d'informations sur les spécifications des appareils sur notre page des spécifications des téléphones et appareils.

+ + + +

Coloris disponibles

+ + + +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/lg_fireweb/index.html b/files/fr/archive/b2g_os/phone_guide/lg_fireweb/index.html new file mode 100644 index 0000000000..315ac8d9c8 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/lg_fireweb/index.html @@ -0,0 +1,66 @@ +--- +title: LG fireweb +slug: Archive/B2G_OS/Phone_guide/LG_fireweb +tags: + - Firefox OS + - Fireweb + - Téléphone + - consommateur + - lg +translation_of: Archive/B2G_OS/Phone_guide/LG_fireweb +--- +
+
+ +
+

Le LG Fireweb est un smartphone haut de gamme sous Firefox 1.1 avec un appareil photo de 5 mégapixels.

+ +

Acheter un appareil

+ +

Le téléphone peut être acheté ici :

+ + + +

Disponibilité

+ +
    +
  • Brésil
    • +
  • Uruguay
    • +
+ +

 

+
+
+ +

Spécifications de l'appareil

+ +

Davantage de caractéristiques sont listées sur notre page de spécifications des téléphones et appareils.

+ + + +

Coloris disponible

+ + + +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/nexus_4/index.html b/files/fr/archive/b2g_os/phone_guide/nexus_4/index.html new file mode 100644 index 0000000000..dcf29d6338 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/nexus_4/index.html @@ -0,0 +1,47 @@ +--- +title: Nexus 4 +slug: Archive/B2G_OS/Phone_guide/Nexus_4 +tags: + - B2G + - Firefox OS + - Installation + - Nexus 4 + - flashage +translation_of: Archive/B2G_OS/Phone_guide/Nexus_4 +--- +

Cet article fournit des informations sur l'utilisation de Firefox OS sur un Nexus 4, parmi lesquelles le flashage de Firefox OS sur votre appareil.

+ +

Installation de Firefox OS sur votre Nexus 4

+ +

Cette section fournit les instructions pour flasher Firefox OS sur votre appareil Nexus 4.

+ +

Général

+ +

Tous les utilisateurs doivent avoir adb et fastboot fonctionnels. Si vous n'avez pas adb ni fastboot, vous pouvez les télécharger depuis le SDK d'Android dont ils font partie.

+ +

Les utilisateurs de Windows doivent également installer les pilotes USB de Google. Téléchargez les pilotes USB, et suivez les instructions d'installation.

+ +

Flashage de Firefox OS sous Windows

+ +
    +
  1. Téléchargez la version nexus-4-kk.zip.
    2. +
  2. Décompressez le fichier, et vérifiez que flash.bat est présent dans le dossier b2g-distro.
    3. +
  3. Éteignez votre Nexus 4 s'il était allumé.
    4. +
  4. Branchez votre Nexus 4 sur votre ordinateur avec un câble USB.
    5. +
  5. Allumez le nexus 4 en appuyant sur le bouton power, et juste après maintenez enfoncé le bouton volume bas jusqu'à ce que le message "Restart bootloader" soit affiché sur l'écran.
    6. +
  6. Double-cliquez sur le fichier flash.bat.
    7. +
+ +

Flashage de Firefox OS sous Mac/Linux

+ +
    +
  1. Téléchargez la version nexus-4-kk.zip.
    2. +
  2. Décompressez le fichier, et vérifier que flash.sh est présent dans le dossier b2g-distro.
    3. +
  3. Branchez votre Nexus 4 sur votre ordinateur avec un câble USB.
    4. +
  4. Ouvrez votre terminal et entrez dans le répertoire où se trouve flash.sh — e.g : cd nexus-4-kk/b2g-distro.
    5. +
  5. Entrez la commande adb devices pour vérifier que l'appareil est détecté. (Voir l'aide et les informations de dépannage sur la configuration de la commande adb.)
    6. +
  6. Entrez la commande chmod +x ./flash.sh pour rendre le script de flashage exécutable.
    7. +
  7. Entrez la commande ./flash.sh pour procéder à l'installation.
    8. +
+ +

Une fois le processus terminé, votre téléphone redémarrera sur Firefox OS.

diff --git a/files/fr/archive/b2g_os/phone_guide/nexus_5/index.html b/files/fr/archive/b2g_os/phone_guide/nexus_5/index.html new file mode 100644 index 0000000000..9eb57299b2 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/nexus_5/index.html @@ -0,0 +1,46 @@ +--- +title: Nexus 5 +slug: Archive/B2G_OS/Phone_guide/Nexus_5 +tags: + - B2G + - Firefox OS + - Installation + - Nexus 5 + - flashage +translation_of: Archive/B2G_OS/Phone_guide/Nexus_5 +--- +

Cet article fournit des informations sur l'utilisation de Firefox OS sur un Nexus 5, parmi lesquelles le flashage de Firefox OS sur votre appareil.

+ +

Installation de Firefox OS sur votre Nexus 5

+ +

Cette section fournit les instructions pour flasher Firefox OS sur votre appareil Nexus 5.

+ +

Généralités

+ +

Tous les utilisateurs doivent avoir adb et fastboot fonctionnels.  Si vous n'avez pas adb ni fastboot, vous pouvez les télécharger depuis le SDK d'Android dont ils font partie.

+ +

Les utilisateurs de Windows doivent également installer les pilotes USB de Google. Téléchargez les pilotes USB, et suivez les instructions d'installation.

+ +

Flashage de Firefox OS sous Windows

+ +
    +
  1. Téléchargez la version nexus-5-l.zip.
    2. +
  2. Décompressez le fichier, et vérifiez que flash.bat est présent dans le dossier b2g-distro.
    3. +
  3. Branchez votre Nexus 5 sur votre ordinateur avec un câble USB.
    4. +
  4. Vérifiez que l'appareil est allumé, et que le mode adb est activé (Firefox OS : Paramètres > Développeurs > ADB et outils de développement ; Android: Settings > Developer options > USB debugging.)
    5. +
  5. Double-cliquez sur le fichier flash.bat.
    6. +
+ +

Flashage de Firefox OS sous Mac/Linux

+ +
    +
  1. Téléchargez la version nexus-5-l.zip.
    2. +
  2. Décompressez le fichier, et vérifiez que flash.sh est présent dans le dossier b2g-distro.
    3. +
  3. Branchez votre Nexus 5 sur votre ordinateur avec un câble USB.
    4. +
  4. Ouvrez votre terminal et entrez dans le répertoire où se trouve flash.sh — e.g : cd nexus-5-l/b2g-distro.
    5. +
  5. Entrez la commande adb devices pour vérifier que l'appareil est détecté. (Voir l'aide et les informations de dépannage sur la configuration de la commande adb.)
    6. +
  6. Entrez la commande chmod +x ./flash.sh pour rendre le script de flashage exécutable.
    7. +
  7. Entrez la commande ./flash.sh pour procéder à l'installation.
    8. +
+ +

Une fois le processus terminé, votre téléphone redémarrera sous Firefox OS.

diff --git a/files/fr/archive/b2g_os/phone_guide/phone_specs/index.html b/files/fr/archive/b2g_os/phone_guide/phone_specs/index.html new file mode 100644 index 0000000000..9a9761313d --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/phone_specs/index.html @@ -0,0 +1,549 @@ +--- +title: Phone and device specs +slug: Archive/B2G_OS/Phone_guide/Phone_specs +translation_of: Archive/B2G_OS/Phone_guide/Phone_specs +--- +
+

Cet article fourni des informations sur les appareils sous Firefox OS et leurs caractéristiques techniques, noms de code, versions Firefox OS de base, et autres.

+
+ +

Téléphones Firefox OS disponible

+ +

Durant la période de développement à chaque différent stade nous avions différent téléphones. Maintenant que nous avons déployé la version commercial, nous avons différent modèles provenant de différent constructeurs partenaires. [we should develope or completely deleting this part because it's not really useful in this state]

+ +
+

Note: Pour consulter les informations sur les disponibilité des téléphones dans votre pays et chez quels opérateurs consultez la page Firefox OS près de chez vous.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+

Name / Codename

+ 		Release dateInitial FxOS
+ version		DisponibilitéCommentaires
+

Alcatel One Touch Fire

+ +

hamachi, buri

+ 		12 Juillet 20131.0.1Actuellement disponibleDisponible publiquement au Brésil, Uruguay, Italie, Allemagne, Grèce, Serbie, Hongrie et Pologne.
+ Disponible avec des revendeurs sur eBay.
otoro, unagi, inari   off the shelf ZTE phone used for development prior to the ZTE Open.
+

ZTE Open

+ +

ikura

+ 		2 Juillet 20131.0.1Actuellement disponiblesimilar to inari; publicly available on eBay.
+

LG Fireweb

+ +

leo

+ 		24 Octobre 20131.1Actuellement disponibleDisponible publiquement au Brésil.
+

Geeksphone Keon

+ +

keon

+ 		24 Avril 20131.0.1Actuellement en rupture de stockDeveloper-only devices
+

Geeksphone Peak

+ +

peak

+ 		24 Avril 20131.0.1Actuellement en rupture de stockWas codenamed "twist" for a while; developer-only devices
Geeksphone Peak+---Annulé
Geeksphone Revolution4 Mars 20141.3preActuellement disponibleDisponible en ligne
+

LG Google Nexus 4

+ +

nexus-4

+ 		   Experimental. Not supported by either LG or Google. Discontinued hardware.
+

Flame

+ +

"the reference device"

+ 		Fin Avril 20141.3 Available to pre-order
+

Spreadtrum

+ +

tarako

+ 		Fin du Q2 2014 ? Bientôt disponible 
ZTE Open C13 mai 20141.3Actuellement disponible +

Disponible en ligne et en boutique (Leclerc)

+ +

Disponible en ligne (LDLC.com)

+ +

Disponible en ligne (Materiel.net)

+
+ +

Firefox OS by version

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
VersionFeature Complete (FC) dateRelease To Partner
+ (RTP) date		Nom de CodeVersion GeckoIncluded security fixesRelease notes
1.022 Décembre 201221 Février 2013TEFGecko 18Gecko 18 
1.0.115 Janvier 20136 Septembre 2013ShiraGecko 18Gecko 20Developer
+ Consumer
1.129 Mars 20139 Octobre 2013LeoGecko 18+ (new APIs)Gecko 23Developer
+ Consumer
1.1.1 TBDHDSame as 1.1.0 with WVGAGecko 23 
1.215 Septembre 20139 Décembre 2013KoiGecko 26[39]Gecko 26Developer
+ Consumer
1.39 Décembre 2013TBD Gecko 28Gecko 28Developer
+ Consumer
1.417 Mars 2014TBD Gecko 30Gecko 30Developer
+ Consumer (TBD)
2.0TBDTBD Gecko 32Gecko 32Developer
+ Consumer (TBD)
+ +

Device specifications

+ +

Note that there are some cases where there is an upcoming device that has not been announced but where we are able to share the code-name of the device and (some of) the capabilities of the device.  DO NOT put extra info down for these devices unless Andreas Gal or someone else equally able to bless the public disclosure of the information has disclosed it.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NomVersionsResolutionAffichage (inches)CPUCamera(s), MpxRAMROMStorageBattery (mAh)
+

Alcatel One Touch Fire

+ +

hamachi, buri

+ 		v1.0.1/v1.1 +

320 x 480
+ PX=1

+ 		3.5Qualcomm Snapdragon S1 MSM7227A 1 GHzRear: 3.2256MB512MB/data: probably the same as inari; specs say 160MB "end user memory"
+ Probably no built-in DeviceStorage, MicroSD card (up to 32GB) required
+  		1400
+

ZTE Open / variants

+ +

ikura

+ 		v1.0.1 (as shipped)320 x 480
+ PX=1		3.5Qualcomm Snapdragon S1 MSM7225A 800 MHzRear: 3.2256MB512MB +

/data: 152M
+ No built-in DeviceStorage, MicroSD card required

+ 		1200
+

LG Fireweb

+ +

leo

+ 		v1.1320 x 480
+ PX=1		4Qualcomm  Snapdragon S1 MSM7227A 1 GHzRear: 5512MB4GB +

/data: 1007.90M
+ built-in DeviceStorage: yes, size unsure. possibly 3.7G, but that might be bad math.  (On an unhapy device /sys/devices/platform/msm_sdcc.3/mmc_host/mmc0/mmc0:0001/block/mmcblk0/block is 7733248, and then assuming a 512 byte block size, we get 3.7G)

+ 		1540
+

Geeksphone Keon

+ +

keon

+ 		+

v1.0.1 - nightly
+ downloads here

+ 		320 x 480
+ PX=1		3.5Qualcomm Snapdragon S1 7225AB 1 GHzRear: 3512MB4GB +

/data: 1.5G
+ built-in 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 +

Front: 2
+ Rear: 8

+ 		512MB4GB/data: 1.5G
+ built-in 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 +

Front: 1.3 Rear: 8

+ 		1GB4GB +

/data: 2G
+ built-in 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

+ 		Rear: 82GB8 or 16GBeverything exists in one big soup, there is no external (MicroSD) storage.  The size of the soup varies based on what model Nexus 4 you got.2100
+

Foxconn InFocus

+ +

flatfish

+ 		 1280 x 80010Allwinner A31, Cortex A7 Quad-Core 1.0 GHz +

Front: 2
+ Rear: 5

+ 		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 (rear only?)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 +

Front: 0.3 Rear: 2
+  

+ 		1GB8GB  
+

Flame

+ +

"the reference device"

+ 		v1.3 +

FWVGA
+ 854 × 480
+ PX=1.5
+  

+ 		4.5 capacitive touch +

Qualcomm Snapdragon 200 MSM8210, 1.2GHZ Dual core processor

+ 		Front: 2
+ Rear: 5 auto focus with flash		256MB–1GB (adjustable by developer)8GB32GB micro SD card (USB 2.0)1800
ZTE Open Cv1.3 +

800 x 480 PX=1.5

+ 		4Qualcomm Snapdragon 200 MSM8210, 1.2GHZ Dual core processorarrière: 3512MB4GB +

/data: 1G

+ 		1400
+ +

Column explanations:

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/spice_fire_one_mi_fx1/index.html b/files/fr/archive/b2g_os/phone_guide/spice_fire_one_mi_fx1/index.html new file mode 100644 index 0000000000..1891a02956 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/spice_fire_one_mi_fx1/index.html @@ -0,0 +1,59 @@ +--- +title: Spice Fire One MI FX1 +slug: Archive/B2G_OS/Phone_guide/Spice_Fire_One_MI_FX1 +tags: + - Appareils Tarako + - Firefox OS + - Spice + - Téléphone +translation_of: Archive/B2G_OS/Phone_guide/Spice_Fire_One_MI_FX1 +--- +
+
Intex Cloud FX image from official website
+ +
+

Le Spice Fire One MI FX1 est un smartphone Firefox OS, basé sur Firefox OS Tarako qui est distribué en Inde. Il a été commercialisé par Spice Smartphones en août 2014.

+ +

Acheter un appareil

+ +

Le téléphone n'est plus disponible actuellement.

+ +

Disponibilité

+ +

Inde

+ +

Mise à jour du logiciel

+ +

L'image système de l'appareil est verrouillée. Il n'est possible de mettre à jour le logiciel que lorsque l'opérateur téléphonique publie une mise à jour OTA. L'image système de l'appareil est basée sur Firefox OS 1.3T.

+
+
+ +

Spécifications de l'appareil

+ +

Vous pouvez trouver plus de détails sur les spécifications des appareils sur notre page des spécifications des téléphones et appareils.

+ + + +

Coloris disponibles

+ + + +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/spice_fire_one_mi_fx2/index.html b/files/fr/archive/b2g_os/phone_guide/spice_fire_one_mi_fx2/index.html new file mode 100644 index 0000000000..06e9548148 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/spice_fire_one_mi_fx2/index.html @@ -0,0 +1,66 @@ +--- +title: Spice Fire One MI FX2 +slug: Archive/B2G_OS/Phone_guide/Spice_Fire_One_MI_FX2 +tags: + - B2G + - Firefox OS + - Téléphones +translation_of: Archive/B2G_OS/Phone_guide/Spice_Fire_One_MI_FX2 +--- +
+
+ +
+

Le Spice Fire One MI FX2 est un smartphone 3G haut de gamme, qui tourne sur FirefoxOS 1.4  avec appareil photo 2 mégapixels, mis en vente en Inde.

+ +

Obtenez un appareil

+ +

Vous pouvez l'acheter ici :

+ + + +

Pays où il est disponible

+ +
    +
  • Inde
    • +
+ +

 

+
+
+ +

Spécifications de l'appareil

+ +

Vous pouvez trouver plus de spécifications de l'appareil sur notre page de fonctionnalités et de caractéristiques.

+ + + +

Couleurs Disponibles

+ + + +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/zen_u105_fire/index.html b/files/fr/archive/b2g_os/phone_guide/zen_u105_fire/index.html new file mode 100644 index 0000000000..903b2775c0 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/zen_u105_fire/index.html @@ -0,0 +1,60 @@ +--- +title: Zen U105 Fire +slug: Archive/B2G_OS/Phone_guide/Zen_U105_Fire +tags: + - Client + - Firefox OS + - Téléphone + - Zen + - Zen u105 + - tarako +translation_of: Archive/B2G_OS/Phone_guide/Zen_U105_Fire +--- +
+
+ +
+

Le Zen U105 Fire est un smartphone premier prix sous Firefox OS Tarako avec un processeur cadencé à 1 GHz et un appareil photo de 2 MP, disponible en Inde.

+ +

Acheter un appareil

+ +

Le téléphone est disponible ici au prix de 1999 INR :

+ + + +

Disponibilité

+ +

Inde

+
+
+ +

Spécifications de l'appareil

+ +

Vous pouvez trouver davantage d'informations sur les spécifications de l'appareil sur notre page des spécifications des téléphones et appareils.

+ + + +

Coloris disponible

+ + + +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/zte_open/index.html b/files/fr/archive/b2g_os/phone_guide/zte_open/index.html new file mode 100644 index 0000000000..3670caaf7d --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/zte_open/index.html @@ -0,0 +1,305 @@ +--- +title: ZTE OPEN +slug: Archive/B2G_OS/Phone_guide/ZTE_OPEN +tags: + - Firefox OS + - Gaia + - Gecko + - Téléphone + - zte +translation_of: Archive/B2G_OS/Phone_guide/ZTE_OPEN +--- +
+

Mozilla et ZTE sont partenaires. Ce partenariat a permis la création du ZTE OPEN, un puissant appareil basé sur Firefox OS, destiné aux développeurs et aux clients intéressés partout dans le monde. Ils ne sont pas verrouillés mais sont ouverts pour toute forme de tests et expérimentations.

+
+ +
+

Note : Ces instructions ne sont pas valables pour l'appareil ZTE Open C. Si vous avez un ZTE Open C, vous devez vous rendre sur notre page consacrée au ZTE Open C à la place.

+
+ +

Acheter un appareil

+ +

Les ventes du ZTE Open sont arrivées à leur terme et il n'est donc plus disponible. Voir ZTE Open C.

+ +

Mise à jour logicielle

+ +

Cette section fournit les instructions pour mettre à jour Firefox OS sur votre appareil ZTE OPEN.

+ +

Généralités

+ +

En général, les compilations Firefox OS, mises à jour et tests sont effectués en branchant le téléphone sur un ordinateur grâce à un câble USB et en utilisant ADB (Android Debugging Bridge) et Fastboot pour relier ensemble les périphériques et  envoyer des commandes. Il faut donc installer ADB et fastboot sur votre ordinateur de bureau à partir du kit de développement d'Android. Il n'est pas nécessaire d'installer tout le kit. adb and fastboot se trouvent dans le dossier /platform-tools/.

+ +

Ensuite, prenez votre téléphone et activer le débogage distant.

+ +

Firefox OS 1.1

+ +

Le 10 décembre 2013 : ZTE a publié une mise à jour Firefox OS 1.1 pour le ZTE OPEN. Celle-ci dispose à présent de fastboot activé, ce qui a provoqué des problèmes avec les builds publiées auparavant.

+ +

À ce stade, la meilleure chose à faire consiste à faire d'abord la mise à jour de votre téléphone en version 1.1, même si vous souhaitez avoir une version 1.2. Pour cela, téléchargez le paquet 1.1 qui correspond à votre téléphone (OPEN (Norme américaine) ou OPEN (Norme européenne)). Notez que vous devez télécharger la version dont le numéro contient la révision de votre OS (autrement dit, téléchargez "V1.1.0B02(for V1.0)" si vous effectuez la mise à jour à partir d'une V1.0). Le fichier zip que vous obtiendrez contiendra aussi de la documentation concernant la mise à niveau. Décompressez-le et copiez le ZIP du firmware (intégré au zip téléchargé) comme décrit plus bas.

+ +
+

Note : Les données de l'utilisateur seront supprimées par l'installation du paquet de la carte SD. Il est conseillé de sauvegarder vos données avant de commencer.

+
+ +

À présent, suivez ces étapes :

+ +
    +
  1. Éteignez votre téléphone, enlevez la batterie pour accéder à la carte microSD puis enlevez-la de son emplacement.
    2. +
  2. Insérez la carte microSD dans votre ordinateur de bureau.
    3. +
  3. Déplacez US_DEV_FFOS_V1.1.0B04_UNFUS_SD.zip ou EU_DEV_FFOS_V1.1.0B04_UNFUS_SD.zip (en fonction de la version que vous avez téléchargée) vers la racine de votre carte microSD. NE décompressez PAS le fichier.
    4. +
  4. Retirez la carte microSD de votre ordinateur de bureau et replacez-la dans votre téléphone.
    5. +
  5. Appuyez en même temps sur les boutons volume haut et power et maintenez-les enfoncés. Volume haut est activé en appuyant sur la partie supérieure du long bouton situé du côté gauche du téléphone. Si l'opération est correctement effectuée, vous entrerez dans le mode recovery de Firefox OS. (Note : le logo Firefox OS peut s'afficher brièvement avant d'entrer en mode recovery ; parfois, cela peut prendre un peu de temps.)
    6. +
  6. Utilisez les boutons volume haut/bas pour vous déplacer dans les options du menu, et choisissez “apply update from external storage.”
    7. +
  7. Appuyez sur le bouton power pour valider la sélection. Vous verrez apparaître un nouvel écran listant les fichiers présents sur la carte microSD.
    8. +
  8. De nouveau, utilisez les boutons volume haut/bas pour sélectionner le firmware : soit US_DEV_FFOS_V1.1.0B04_UNFUS_SD.zip, soit EU_DEV_FFOS_V1.1.0B04_UNFUS_SD.zip (selon la version téléchargée), puis pressez le bouton power pour confirmer.
    9. +
+ +

Si tout se passe bien, des messages d'état vont s'afficher jusqu'à ce que l'un d'eux indique “Install from sdcard complete.”. Vous devez sélectionner “reboot system now” une fois l'installation terminée. Votre téléphone va ensuite redémarrer puis afficher l'écran de configuration que vous avez vu la première fois que vous avez allumé votre téléphone.

+ +

Firefox OS 1.2

+ +

En janvier 2014, ZTE a publié une version bêta de Firefox OS 1.2 (fastboot activé, avec accès root). Il s'agit globalement d'une version de base 1.1 + Gecko et Gaia en version 1.2, et ne nécessite pas de placer la version sur la carte SD du téléphone.

+ +

Avec la version 1.1 installée comme décrit plus haut, ouvrez un terminal et vérifiez avec la commande suivante que la connexion est bien faite :

+ +
adb devices -l
+
+ +

En réponse, vous devriez voir votre appareil indiqué sous une forme ressemblant à ceci : "roamer2    device usb:2-1.2",.

+ +

Téléchargez la version appropriée du build à partir du compte Dropbox que ZTE a mis en place : version US ou version UK. Pour les utilisateurs de Windows, il est aussi possible de télécharger des instructions particulières, ainsi qu'un outil de mise à jour pour vous faciliter l'installation de la nouvelle version. Néanmoins, les étapes ci-dessous fonctionneront sur tous les systèmes d'exploitation – Linux, OS X et Windows – sans s'appuyer sur cet outil spécifique.

+ +

Une fois en possession du fichier, décompressez-le et ouvrez une console. Remarquez que ces étapes vont effacer vos données personnelles, assurez-vous d'en faire une (sauvegarde) avant. Placez-vous ensuite dans le dossier où se trouvent les fichiers. Toujours dans la console, tapez cette commande :

+ +
adb reboot bootloader
+ +

Pendant que le téléphone redémarre, exécutez la commande suivante. (Fastboot ne fonctionne qu'en cours de redémarrage) :

+ +
sudo fastboot devices
+
+ +

Si vous voyez : "< waiting for device >", faîtes Ctrl-C et réessayez la commande jusqu'à voir apparaître en réponse quelque chose dans le genre : "ROAMER2    fastboot".

+ +

Ensuite, toujours pendant qu'il est en train de redémarrer, exécutez rapidement les commandes suivantes :

+ +
fastboot flash boot boot.img
+fastboot flash userdata userdata.img
+fastboot flash system system.img
+fastboot flash recovery recovery.img
+fastboot erase cache
+fastboot reboot
+ +
+

Note : Si vous rencontrez à chaque fois le message "waiting device". Essayez d'ajouter sudo devant les commandes, comme "sudo fastboot flash boot boot.img".

+
+ +

(Ayant été distrait, le redémarrage s'est achevé avant que je n'ai pu saisir toutes les commandes. J'ai simplement recommencé à partir de: "adb reboot bootloader".)

+ +

Si tout s'est bien passé, votre téléphone doit redémarrer en ce moment. Vous constaterez que cette version 1.2 de ZTE contient de nombreuses applications de test ; si vous le souhaitez, vous pouvez les enlever.

+ +
+

Note : Upgrading your ZTE Open to Firefox 1.1 or 1.2 (fastboot enabled) de Frédéric Harper fournit également des explications utiles sur le processus d'installation.

+
+ +
+

Note : Le build 1.2 de ZTE pour l'Open comporte un bogue qui empêche de faire descendre/ouvrir la zone de notification. Cela peut être corrigé en flashant votre téléphone avec la dernière version engineering de Firefox OS 1.2. Vérifiez que ADB est installé et que le débogage distant est activé, lancez ensuite les commandes suivantes dans votre terminal :
+
+ git clone -b v1.2 https://github.com/mozilla-b2g/gaia.git gaia_v1.2
+ cd gaia_v1.2
+ make reset-gaia

+
+ +

Firefox OS 1.3 et suivants

+ +

À l'heure actuelle, ZTE n'a publié Firefox OS 1.3 que pour le ZTE Open commercialisé par Movistar (TME) ; ce sont les ZTE Open bleus. Le paquet se trouve sur leur site de support ou peut être téléchargé ici directement.

+ +

 

+ +
+

Note : Les builds communautaires sont fournies ici et ici.

+
+ +

En ce qui concerne le ZTE Open d'ebay, ZTE n'a pas publié de builds pour Firefox OS 1.3 et suivants. Pour les obtenir sur votre ZTE open, vous aurez besoin de compiler et installer un nouveau build de Firefox OS/B2G dessus manuellement (commencez par les instructions sur les prérequis pour construire Firefox OS, et traitez le ZTE comme s'il s'agissait d'un appareil Inari dans le but de le configurer). Vous pouvez restaurer votre téléphone si nécessaire en suivant la procédure décrite dans la section J'ai brické mon téléphone.

+ +

Caractéristiques matérielles

+ +

Vous pouvez trouver une liste plus complète des caractéristiques matérielles sur notre page de spécifications des téléphones et appareils.

+ +

Réseau

+ + + +
+

Note : les téléphones de Hong Kong supportent aussi les réseaux 3G tri-bandes — HSDPA 850/1900/2100 (850/1900 pour les USA, Canada, 850/1900/2100 pour l'Asie, Australie et 900/2100 pour l'Europe.)

+
+ +

Matériel

+ + + +

Opérateurs de téléphonie

+ +
+

Les informations de tarifs sont données pour référence uniquement et peuvent ne pas être précises. Suivez le lien associé pour les informations officielles.

+
+ +

Opérateurs US

+ +

AT&T

+ + + +
Exemples de formules prépayées chez AT&T
+ +

GoPhone® prépayé, offres smartphone

+ + + +

Aio

+ + + +
Exemples de formules prépayées chez Aio
+ + + +

Good2GO

+ + + +
Exemples de formules prépayées chez Good2GO
+ + + +

Autres MVNO d'AT&T

+ +

Ces opérateurs n'offrent pas de données 3G supplémentaires.

+ + + +

T-Mobile

+ + + +

Opérateurs canadiens

+ +

La version US du ZTE Open fonctionne également au Canada avec les opérateurs qui utilisent les réseaux Bell/Telus ou Rogers. Certains opérateurs régionaux comme Sasktel ou MTS qui utilisent UMTS devraient fonctionner eux aussi.

+ +

Il ne fonctionnera pas avec les opérateurs qui n'utilisent pas UMTS ou GSM, comme Public Mobile, ni avec ceux qui utilisent la bande de fréquences AWS comme WIND Mobile, Mobilicity, Videotron ou Eastlink.

+ +

Carte mémoire

+ +

Système de fichiers

+ +

Afin d'être reconnue par le téléphone, la carte MicroSD doit être formatée avec le système de fichiers FAT32. Si la carte est neuve ou n'a jamais été reformatée, elle devrait fonctionner telle quelle.

+ +

Révisions matérielles

+ +

Révision 01

+ +

Les téléphones produits avant le 27/09/2013 ne disposent pas de fastboot et doivent être mis à jour. Normalement, cela devrait se faire via les Mises à jour logicielles mais certains utilisateurs ont signalé avoir eu des problèmes avec cette méthode. C'est pourquoi ZTE a mis à disposition des paquets pour carte SD permettant d'activer fastboot sur ces premières versions d'appareils. Images à flasher sur :

+ + + +

Le lien vers le fichier zip se trouve sous Downloads. Notez qu'il faut télécharger la version contenant votre révision d'OS (autrement dit, téléchargez "V1.1.0B02(for V1.0)" si vous faîtes la mise à jour depuis la V1.0). Une fois le fichier téléchargé et décompressé, suivez les instructions du PDF qu'il contient pour flasher le paquet sur votre téléphone.

+ +

Questions relatives sur le Forum de Support :

+ + + +

Révision 02

+ +

Fastboot est activé par défaut sur les téléphones produits à partir du 27/09/2013. Cela inclut les téléphones de Hong Kong.

+ +
+

Note : Si vous n'êtes pas sûr de la révision de votre téléphone, vérifiez-la dans Paramètres > Information > Logiciel. Si elle est plus ancienne que celles dont les numéros de versions suivent,  il vous faudra mettre à jour votre téléphone avec les paquets SD précités pour activer fastboot.

+ + +
+ +

Support pour l'appareil

+ +

Une fois que votre téléphone dispose de fastboot activé, vous serez alors en mesure de compiler et installer de nouveaux builds Firefox OS/B2G dessus (commencez par les instructions sur les prérequis pour la construction et traitez le ZTE comme un appareil Inari dans le but de le configurer), et restaurez votre téléphone si nécessaire en utilisant la procédure citée dans la section J'ai brické mon téléphone.

+ +

Si vous rencontrez des erreurs concernant le réglage de l'heure système lors du flashage d'un build personnalisé, vous devrez peut-être télécharger une image de démarrage modifiée.

+ +

J'ai brické mon téléphone

+ +

Si vous êtes dans un processus de modification de votre téléphone et que celui-ci se retrouve “sans réaction”, vous devriez être en mesure de le restaurer grâce à fastboot en suivant cette procédure simple.

+ +

Tout d'abord, débranchez le câble USB puis enlevez la batterie du téléphone l'espace de 30 secondes. Ensuite, replacez la batterie et appuyez sur le bouton volume haut tout en maintenant enfoncé le bouton power pendant quelques secondes. Rebranchez alors le câble USB et exécutez les commandes suivantes dans une fenêtre de terminal après vous être placé dans le répertoire qui contient les fichiers des paquets SD décrits plus haut (il est toujours utile de vérifier au préalable s'il existe une mise à jour de ces fichiers) :

+ +
fastboot flash recovery recovery.img
+fastboot flash boot boot.img
+fastboot flash userdata userdata.img
+fastboot flash system system.img
+fastboot reboot
+
+ +

Ce processus devrait restaurer votre téléphone. Si cela semble ne pas fonctionner, il faudra essayer une seconde fois.

+ +

Les écouteurs ne fonctionnent pas ?

+ +

Nous avons découvert que la prise jack des écouteurs est conçue par un fabricant chinois qui a des problèmes de compatibilité avec d'autres marques d'écouteurs intégrant des microphones. Il peut y avoir des problèmes d'absence de son lorsque vous essayez d'utiliser des écouteurs de marques Apple, Samsung, HTC et autres. Vous pouvez acheter un adaptateur pour écouteurs de 3,5 mm qui inverse les broches du microphone et de masse pour éviter ce problème. Pour plus d'informations, voir le bug 812607.

+ +

Autres notes concernant le support

+ +

Certains clients ont signalé avoir rencontré un problème avec des mises à jour FOTA qui ne parviennent pas à activer fastboot ; des recherches sont toujours et nous accompagnons ZTE pour analyser tout scénario. Nous posterons plus d'informations dès qu'il y en aura.

+ +

Si votre téléphone a malencontreusement été endommagé au cours de la mise à jour FOTA parce que ZTE a fourni des fichiers de mise à jour incorrects ou avec des erreurs, vous pouvez essayer de le restaurer à sa configuration d'usine avec l'image SD appropriée et les instructions indiquées dans Révision 01. Sinon, retournez votre téléphone à la boutique eBay où vous l'avez acheté pour en obtenir un nouveau en échange. Vous pouvez contacter le propriétaire de la boutique directement via un message eBay.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/phone_guide/zte_open_c/index.html b/files/fr/archive/b2g_os/phone_guide/zte_open_c/index.html new file mode 100644 index 0000000000..142d406b51 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/zte_open_c/index.html @@ -0,0 +1,190 @@ +--- +title: ZTE OPEN C +slug: Archive/B2G_OS/Phone_guide/ZTE_OPEN_C +tags: + - Appareil + - Firefox OS + - Gaia + - Guide + - Open C + - Smartphone + - Téléphone + - zte +translation_of: Archive/B2G_OS/Phone_guide/ZTE_OPEN_C +--- +
+

Le ZTE Open C est un smartphone de la marque ZTE fonctionnant sous Firefox OS. Il intègre un appareil photo de 2 Mpx et un écran 4 pouces de 480 x 800 pixels, offrant une densité de pixels de 233ppp. Il est fourni avec Firefox OS 1.3 préinstallé. Cet article fournit des informations concernant ce smartphone, ses mises à jour et les détails pour le dépannage. 

+
+ +
+

Note: Cet article n'est pas applicable au téléphone ZTE Open. Vous devriez plutôt consulter notre page dédiée au ZTE Open si vous possédez ce modèle.

+
+ +

Open C blue nuit

+ +

 

+ +

Le ZTE Open C est le premier téléphone grand public vendu avec Firefox OS 1.3, la dernière version de Firefox OS. Celle-ci présente de nombreuses nouvelles caractéristiques comme le contrôle du lecteur de musique directement depuis l'écran de verrouillage ou la barre de notifications, mais aussi le partage Bluetooth avancé, permettant de transférer plusieurs fichiers simultanément. L'utilisateur peut à présent naviguer plus rapidement dans l'interface grâce aux "smart folders" (dossiers intelligents) qui classent automatiquement les applications et les sites de recherche en catégories. La fluidité de défilement et la vitesse de lancement des applications du système ont également été améliorées (ex. calendrier, contacts, appareil photo).

+ +

Acheter l'appareil

+ +

Ce téléphone est actuellement proposé en France par Auchan (pour un achat en ligne uniquement) au prix soldé de 29,90€ (au lieu de 59,99€).

+ + + +
+

Note: Les téléphones sont livrés sans aucune application ou service de connectivité d'opérateur téléphonique spécifique et sont déverrouillés pour tout opérateur en sortie de boîte.

+
+ +

 

+ +

Caractéristiques

+ +

Voir Caractéristiques des téléphones et appareils.

+ +

 

+ +

Mise à jour officielle

+ +

Pour mettre à jour le système de l'Open C avec une version officielle, la façon la plus simple est de vous référer à la notice que vous trouverez sur le site d'assistance de ZTE France. Pour ce faire, sélectionnez Open C dans la section "1 - MON PRODUIT", ensuite choisissez Notices en "2 - JE CHERCHE" et enfin vous trouverez la notice de mise à jour en "3 - RÉPONSES".

+ +

 

+ +

Mise à jour communautaire

+ +

Il est également possible de mettre à jour l'Open C en passant par une version communautaire. La communauté Mozilla Francophone publie ses propres builds, mettant à jour Gecko et Gaia. Pour se les procurer, il faut aller à cette adresse.

+ +
+

Il faudra au préalable rooter le téléphone, afin de bénéficier des mises à jour communautaires.

+
+ +

 

+ +

Mise à jour "manuelle"

+ +

Si vous désirez mettre à jour Gecko et/ou Gaia vous-même, le processus est un peu plus délicat, car le téléphone est verrouillé par défaut (aucun privilège administrateur, "root" en anglais). Pour déverrouiller les privilèges d'administrateur sur votre téléphone (c'est à dire "rooter" l'appareil), vous devez suivre les instructions pour utiliser l'outil de mise à niveau que vous pouvez récupérer sur le site d'assistance de ZTE France.

+ +

Mettre à niveau Gecko et Gaia

+ +

Une fois que votre téléphone permet le mode fastboot, vous allez pouvoir compiler et installer Firefox OS/B2G, les composants Gecko et Gaia sur celui-ci.

+ +
+

ATTENTION : Avant toute manipulation de votre système, réalisez une sauvegarde de votre téléphone comme indique la dernière section, "Backup the phone system partition" de la page "Prérequis pour construire Firefox OS", en lien ci-dessous.

+
+ +
    +
  1. Commencez par les prérequis pour construire Firefox OS, et faites comme si votre Open C était un téléphone Flame pour les configurations du système de construction B2G. Il faut procéder ainsi car le Open C et le Flame sont tous les deux sur la même base système, un Android Jelly Bean, mais qu'il n'existe pas encore de dépôt/branche pour le Open C.
    2. +
  2. Pendant les étapes de configuration, vous allez devoir pointer vers un fichier de manifeste personnalisé (custom manifest file) .XML dédié au Open C. Lisez ce bug et/ou téléchargez la pièce jointe et enregistrez-la sous le nom "openc.xml" dans un dossier facile à pointer (dans le dossier Téléchargements ou B2G par exemple).
    3. +
  3. Nettoyez le dossier B2G en supprimant les dossiers non désirés spécifiques au Flame : + 
    rm -rf objdir-gecko/ out/ backup-flame/
    +
    4. +
  4. Facultatif : Avant de poursuivre, vous pouvez, si vous le souhaitez, spécifier la version à compiler. Pour ce faire, éditez le fichier "openc.xml", et modifiez-y les révisions (revision) des projets gecko.git, rilproxy, librecovery, fake-libdvm, gaia, gonk-misc, et moztt. Par exemple, si vous souhaitez compiler la version 2.2, vous mettrez : + 
    <project name="gecko.git" path="gecko" remote="mozillaorg" revision="v2.2"/>
+<project name="rilproxy" path="rilproxy" remote="b2g" revision="v2.2"/>
+<project name="librecovery" path="librecovery" remote="b2g" revision="v2.2"/>
+<project name="fake-libdvm" path="dalvik" remote="b2g" revision="v2.2"/>
+<project name="gaia" path="gaia" remote="mozillaorg" revision="v2.2"/>
+<project name="gonk-misc" path="gonk-misc" remote="b2g" revision="v2.2"/>
+<project name="moztt" path="external/moztt" remote="b2g" revision="v2.2"/>
    + +
    +

    ATTENTION : Actuellement, le fait de compiler les versions 2.5 et supérieures empêche le fonctionnement du bluetooth.

    +
    +
    5. +
  5. Maintenant, configurez B2G en pointant vers le fichier "openc.xml" avec cette commande : + 
    ./config.sh flame /MON/DOSSIER/VERS/openc.xml
    +
    6. +
  6. Sur votre téléphone, vérifiez que Remote Debugging soit activé (choisissez ADB dans Firefox OS 1.3 ou ADB et Devtools dans les versions ultérieures).
    7. +
  7. Connectez votre téléphone par USB à votre ordinateur et vérifiez qu'il soit reconnu par ADB : + 
    adb devices
    +
    8. +
  8. Une fois le téléphone reconnu, vous pouvez construire le composant Gecko et l'installer sur votre téléphone en exécutant les commandes suivantes : + 
    ./build.sh gecko
+./flash.sh gecko
    +
    9. +
  9. Maintenant, vous devriez mettre à niveau Gaia pour que sa version corresponde à la version de Gecko que vous venez d'installer sur votre téléphone : + 
    cd gaia
+make reset-gaia
    +
    10. +
  10. Pour terminer, il vous faut ajouter les polices (fonts) manquantes, afin d'obtenir un affichage correct sur votre téléphone.
    11. +
+ +
+

ATTENTION : A partir de la version 2.2, un bug rend indisponible le stockage interne. Pour résoudre le problème, vous pouvez d'abord installer une version analogue des builds communautaires ou vous référer à la démarche du rapport de bug.

+
+ +
+

ATTENTION : Essayer d'installer une image système du Flame directement -sans suivre les dispositions précédentes-  sur votre téléphone Open C, bloquera votre téléphone. Si vous n’êtes pas sûr de ce que vous faites, abstenez-vous.

+
+ +

Installer votre propre version de Gaia

+ +

Pour mettre à niveau votre version modifiée de Gaia, en laissant de coté Gecko, vous aurez besoin de créer votre branche ("Fork") [ facultatif ? ], cloner le dépot Github de Gaia, pour ensuite le modifier et l'installer sur votre Open C.

+ +
    +
  1. Vérifiez que vous avez ADB d'installé sur votre machine.
    2. +
  2. Allez sur https://github.com/mozilla-b2g/gaia et cliquez sur le bouton "Fork" en haut à droite pour créer une branche dans votre propre dépôt.
    3. +
  3. Clonez le code de votre branche depuis votre dépôt sur votre machine avec cette commande : + 
    git clone https://github.com/VOTRE-PSEUDO-GITHUB/gaia.git
    +
    4. +
  4. Modifiez Gaia à votre convenance.
    5. +
  5. Ensuite, sur votre téléphone, vérifiez que Remote Debugging soit activé (cochez ADB pour Firefox OS 1.3 ou choisissez ADB et Devtools sur les versions ultérieures).
    6. +
  6. Connectez votre téléphone par USB à votre ordinateur et vérifiez qu'il soit reconnu par ADB : + 
    adb devices
+
    +
    7. +
  7. Enfin installez Gaia en lançant les commandes suivantes depuis le dossier B2G : + 
    cd gaia
+make reset-gaia
    +
    8. +
+ +

Problème de polices (font)

+ +

Après avoir mis à jour Gecko/Gaia, il se peut que vous constatiez une incohérence entre les polices attendues par Gecko et Gaia, et celles fournies lors du flash. Pour corriger cela, téléchargez notre archive de mise à jour des polices (font), extrayez-la, placez-vous dans le répertoire créé par l'extraction et exécutez le script flash.sh.
+
+ Vous pouvez également utiliser le script update_system_fonts.sh, qui se chargera de télécharger et d'envoyer automatiquement les polices sur le téléphone.

+ +

 

+ +

J'ai "brické" mon téléphone

+ +

Si votre téléphone ne réagit plus, qu’il démarre en boucle ("bootloop" en anglais), ou qu’il bloque sur le logo Firefox OS ou l'animation du renard, votre téléphone est brické. Vous devriez être en mesure de le "débricker" en utilisant une archive de mise à jour officielle (voir la partie "Mettre à jour Firefox OS" plus haut) en la flashant via une carte SD, sur le site web ZTE:

+ + + +

Vous pourrez aussi trouver des informations complémentaires en lisant ce sujet du site de support de Mozilla (en).

+ +

Cependant, si votre partition système est défectueuse, il vous faudra réparer le téléphone en utilisant l'accès direct au fastboot. En supposant que vous utilisez Ubuntu GNU/Linux il vous faudra suivre les étapes suivantes :

+ +
    +
  1. Téléchargez l'image de récupération système à partir de la page support du site ZTE. Extrayez ensuite le fichier update.zip sur votre bureau (~/Desktop/).
    2. +
  2. Extrayez l'image de récupération recovery.img à partir de l'archive de mise à jour update.zip sur votre bureau.
    3. +
  3. Créez un dossier small-system/ sur le bureau et copiez-le dans le fichier build.prop ainsi que dans le répertoire bin/. Vous trouverez le dossier system. dans l'archive update.zip.
    4. +
  4. Installez le package android-tools-fsutils (ou installez ext4_utils à partir des sources en suivant ce lien XDAdevelopers page).
    5. +
  5. Créez votre small-system.img: + 
    ./make_ext4fs -l 40M small-system.img ~/Desktop/small-system/
    +
    6. +
  6. Déplacez votre small-system.img sur le bureau et démarrez votre appareil en mode fastboot en pressant simultanément bouton démarrer + bouton volume bas.
    7. +
  7. Connectez l'appareil à votre ordinateur (fastboot devices  cette commande devrait afficher l'appareil) et flash small-system.img: + 
    fastboot flash system small-system.img
    +
    8. +
  8. Démarrez ensuite en mode récupération en utilisant recovery.img: + 
    fastboot boot recovery.img
    +
    9. +
  9. Dans le menu de démarrage, sélectionnez appliquer la mise à jour à partir des entrées ADB (utilisez les boutons de réglages du volume pour naviguer, ainsi que le bouton démarrer pour sélectionner select), ensuite faites: + 
    adb sideload update.zip
    +
    10. +
  10. +

    Une fois cela fait, redémarrez votre téléphone.

    +
    11. +
+ +

Note: Vous pouvez cliquer ici pour plus d'informations.

diff --git a/files/fr/archive/b2g_os/phone_guide/zte_open_ii/index.html b/files/fr/archive/b2g_os/phone_guide/zte_open_ii/index.html new file mode 100644 index 0000000000..e6f9e35503 --- /dev/null +++ b/files/fr/archive/b2g_os/phone_guide/zte_open_ii/index.html @@ -0,0 +1,72 @@ +--- +title: ZTE Open II +slug: Archive/B2G_OS/Phone_guide/ZTE_Open_II +tags: + - Firefox OS + - Téléphone + - ZTE Open 2 + - ZTE Open II + - consommateur +translation_of: Archive/B2G_OS/Phone_guide/ZTE_Open_II +--- +
+
ZTE_Open_II_Device_Image
+ +
+

Le ZTE Open II est un smartphone sous Firefox OS ; il dispose d'un processeur double-coeur à 1,2 GHz et d'une caméra 2,0 MP.

+ +

Acheter un appareil

+ +

Le ZTE Open II est disponible via les canaux de distribution classiques ; voir par exemple la page de Movistar.

+ +

Disponibilité par pays

+ +
    +
  • Argentine
    • +
  • Colombie
    • +
  • Guatemala
    • +
  • Nicaragua
    • +
  • Panama
    • +
  • Pérou
    • +
  • Salvador
    • +
  • Uruguay
    • +
+ +

Opérateurs

+ +
    +
  • Movistar
    • +
+
+
+ +

Mise à jour logicielle

+ +

L'image système de l'appareil est verrouillée, si bien qu'il n'est possible de le mettre à jour que si l'opérateur téléphonique publie une mise à jour OTA. L'image système de l'appareil est basée sur Firefox OS 1.2.

+ +

Caractéristiques matérielles

+ + + +

Coloris disponible

+ + + +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/platform/apps_architecture/index.html b/files/fr/archive/b2g_os/platform/apps_architecture/index.html new file mode 100644 index 0000000000..cb040b8422 --- /dev/null +++ b/files/fr/archive/b2g_os/platform/apps_architecture/index.html @@ -0,0 +1,37 @@ +--- +title: Architecture des applications Firefox OS +slug: Archive/B2G_OS/Platform/Apps_architecture +tags: + - Applications + - Firefox OS + - Guide +translation_of: Archive/B2G_OS/Platform/Apps_architecture +--- +
+

Cet article explique les fonctionnements internes du démarrage et de la gestion des applications dans Firefox OS. Ces informations seront utiles aux développeurs de la plate-forme Firefox OS, aussi bien qu'aux équipes portant le système d'exploitation sur un nouveau matériel. Ce n'est pas indispensable si vous êtes un développeur d'applications, mais cela pourrait quand même vous intéresser.

+
+ +

Processus de démarrage d'une application

+ +

Quand l'utilisateur sélectionne une application qu'il aimerait lancer, ou qu'une application doit être lancée d'une autre manière, l'application écran d'accueil commence par récupérer une référence d'application depuis l'API App, puis appelle la méthode App.launch() pour lancer l'application.

+ +

Gecko reçoit cette requête et envoie le mozChromeEvent à l'application System avec les détails de l'application. L'application System traite cet événement en insérant un nouvel <iframe> dans son arborescence DOM et en chargeant l'application dans le nouvel <iframe>. Ce conteneur sera l'hébergeur de l'application jusqu'à ce qu'elle se termine.

+ +

Chaque application a besoin d'un manifeste qui la décrit et possède une hiérarchie de fichiers spécifique au sein de son package. Pour plus de détails, voir l'article Manifeste d'application.

+ +

Communication avec Gecko

+ +

La communication entre Gecko et l'application System Gaia est faite via mozChromeEvent et mozContentEvent. Les événements mozChromeEvent sont diffusés depuis Chrome jusqu'au contenu et les événements mozContentEvent sont diffusés depuis le contenu jusqu'à Chrome. Cette communication est utilisée pour contrôler la création et la fermeture de l'interface de confiance et pour injecter les fonctions requises pour les notifications et autres tâches, incluant l'ordre pour l'application System, de démarrer une application.

+ +
+

Note: Vous trouverez plus d'informations sur le fonctionnement de ces événements en lisant notre documentation de l'application System. Vous pouvez aussi en découvrir beaucoup plus en regardant le code de b2g/chrome/content/shell.js.

+
+ +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/platform/architecture/index.html b/files/fr/archive/b2g_os/platform/architecture/index.html new file mode 100644 index 0000000000..c23c7bb25e --- /dev/null +++ b/files/fr/archive/b2g_os/platform/architecture/index.html @@ -0,0 +1,722 @@ +--- +title: Architecture de Firefox OS +slug: Archive/B2G_OS/Platform/Architecture +tags: + - Architecture + - Firefox OS + - Guide +translation_of: Archive/B2G_OS/Architecture +--- +
+

Cet article est une vue d'ensemble de l'architecture de la plate-forme Firefox OS, présentant les concepts clés et expliquant sommairement comment les composants interagissent.

+
+ +
+

Note: Gardez à l'esprit que Firefox OS est toujours un produit non finalisé ("Pre-release"). L'architecture décrite ici n'est pas forcément finalisée, et des changements peuvent survenir.

+
+ +

Terminologie Firefox OS

+ +

Voici quelques termes à connaître avant de lire la suite de notre documentation de Firefox OS.

+ +
+
B2G
+
Acronyme de Boot to Gecko.
+
Boot to Gecko
+
Le nom de code du système d'exploitation Firefox OS lors de sa conception. Vous trouverez souvent ce terme en référence à Firefox OS, car il a été longtemps utilisé avant que le projet ait un nom officiel.
+
Firefox OS
+
Firefox OS correspond aux services de support et de branding de Mozilla (et ceux de ses partenaires OEM) ajoutés au-dessus de Boot to Gecko, pour créer un produit fini.
+
Gaia
+
L'interface utilisateur de la plate-forme Firefox OS. Tout ce qui est affiché à l'écran une fois que Firefox OS est lancé, est produit par la couche Gaia. Gaia implémente l'écran de verrouillage, l'écran d'accueil et toutes les applications standards que vous attendez sur un smartphone moderne. Gaia est implémenté entièrement à l'aide de HTML, CSS et Javascript. Les seules interfaces avec le système d'exploitation sous-jacent se font au travers d'API Web libres, elles-mêmes implémentées par la couche Gecko. Les applications tierces peuvent être installées en parallèle de la couche Gaia.
+
Gecko
+
C'est l'application permettant d'exécuter Firefox OS ; c'est-à-dire, la couche permettant le support des trois standards : HTML, CSS et Javascript. Il assure que chacune de ces technologies fonctionnent sur tous les systèmes d'exploitation supportés par Gecko. Cela signifie que Gecko inclut, entre autres, une pile réseau, une pile graphique, un moteur de présentation, une machine virtuelle JavaScript et des couches de portage.
+
Gonk
+
Gonk représente la couche la plus basse du système d'exploitation de la plate-forme Firefox OS. Elle est composée d'un noyau Linux (basé sur l'Android Open Source Project (AOSP)) et une couche d'abstraction matérielle de l'espace utilisateur (HAL userspace). Le noyau et plusieurs bibliothèques en espace utilisateur font partie de projets open-source communs : Linux, libusb, bluez, et bien d'autres. D'autres parties de la HAL sont partagées avec l'AOSP : GPS, caméra et d'autres. Vous pouvez considérer Gonk comme une distribution Linux basique. Gonk est une cible de portage de Gecko, il y a un port de Gecko vers Gonk, tout comme il y a un port de Gecko vers OS X, Windows et Android. Vu que le projet Firefox OS a un contrôle total sur Gonk, nous pouvons exposer des objets à Gecko, qui ne peuvent être exposés sur d'autres systèmes d'exploitation. Par exemple, Gecko a un accès direct à la pile téléphonique complète et à l'affichage frame buffer sur Gonk, mais n'a pas ce type d'accès sur les autres systèmes d'exploitation.
+
Jank
+
Ce terme est souvent utilisé dans l'univers du mobile, pour désigner une opération qui crée un effet de latence dans une application, qui bloque le rafraîchissement de l'interface, la fait laguer ou la rend inutilisable. Nos ingénieurs Gaia utilisent des techniques d'optimisation variées pour essayer d'éradiquer cette sensation à tout prix.
+
+ +

Architecture générale

+ +

Le schéma suivant compare les architectures de plate-formes propriétaires et de 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 élimine la couche native de l'API entre le système d'exploitation et les couches applicatives. Ce design intégré réduit les couches au-dessus de la plate-forme et simplifie la sécurité sans sacrifier les performances ni l'expérience utilisateur.

+ +
    +
  1. Gaia est le noyau d'application web de l'appareil et la couche de l'interface utilisateur, en HMTL5, CSS et JavaScript, avec un certain nombre d'API exposées pour permettre le code de l'interface utilisateur d'interagir avec le matériel du téléphone et de fonctionnalité de Gecko.
    2. +
  2. Gecko est le moteur Web et la couche de présentation dans Firefox OS qui relie le matériel avec le HTML, en se servant de l'interface entre le contenu Web et le périphérique sous-jacent. Gecko fournit une analyse HTML5 et un moteur de rendu, l'accès programmatique à la fonctionnalité du matériel via des APIs Web sécurisés, une infrastructure de sécurité intelligente, la gestion de mise à jour, et d'autres services de base.
    3. +
  3. Gonk est la composante au niveau du noyau dans la pile de Firefox OS qui sert d'interface entre Gecko et le matériel sous-jacent. Gonk contrôle le matériel sous-jacent et expose les capacités matérielles aux API Web mis en œuvre dans Gecko. Gonk peut être considéré comme la «boîte noire» qui fait tout le travail complexe et détaillé dans les coulisses pour contrôler l'appareil mobile en adoptant la demande au niveau du matériel.
    4. +
  4. Le dispositif mobile est le matériel du téléphone fonctionnant avec Firefox OS. L'OEM est responsable de fournir l'appareil mobile.
    5. +
+ +

 

+ +

L'architecture spécifique de Firefox OS

+ +

Firefox OS Architecture

+ +

Déroulement du chargement de Firefox OS

+ +

Cette section décrit le processus suivi lors de l'amorçage d'un matériel sous Firefox OS, quelles parties sont impliquées et où. Pour visualiser rapidement, le schéma d'amorçage général du système passe par le chargeur de boot dans l'espace noyau, à l'init du code natif, au B2G puis au tour de Gecko dans l'espace utilisateur, pour terminer par le système d'applications, le gestionnaire de fenêtres et enfin l'application d'accueil de Gecko. Toutes les autres applications vont venir s'appuyer là-dessus.

+ +

+ +

Le processus d'amorçage

+ +

Quand un appareil Firefox OS est allumé, l'exécution commence dans le premier chargeur d'amorçage. A partir de là, le processus de chargement du système d'exploitation principal se déroule d'une manière commune : une succession de chargeurs d'amorçage de niveaux de plus en plus hauts amorcent le chargeur suivant de la chaîne. A la fin du processus, l'exécution est transférée au noyau Linux.

+ +

Il y a plusieurs points à souligner à propos du processus d'amorçage :

+ + + +

Le noyau Linux

+ +

Le noyau Linux utilisé par Gonk est très similaire au upstream Linux duquel il dérive (basé sur un projet Android Open Source). Il y a quelques changements réalisés par l'AOSP qui n'ont pas encore été upstreamed. De plus, les marchands modifient parfois le noyau et upstream ces changements dans leur propre programme. En général, cependant, le noyau Linux et proche du stock.

+ +

Le processus de démarrage pour Linux est bien documenté ailleurs sur Internet et cet article ne couvrira donc pas ce point.

+ +

Le noyau Linux (ou kernel) va soulever des appareils et exécuter des processus essentiels. Il va exécuter des processus définis dans init.rc et le successeur init.b2g.rc pour amorcer les processus essentiels comme b2g (le processus de base de FirefoxOS, qui contient Gecko) et rild (les processus relatifs à la téléphonie qui peuvent être propriétaires par différents jeux de puces) — voir ci-dessous pour plus de détails. A la fin du processus, un processus d'espace utilisateur init est lancé, comme dans la plupart des systèmes d'exploitation similaires à UNIX.

+ +

Dès que le processus init est lancé, le noyau Linux gère les appels système de l'espace utilisateur, et interrompt, et ainsi de suite les dispositifs matériels. Beaucoup de fonctions matérielles sont exposées à l'espace utilisateur au travers de sysfs. Par exemple, voici un bout de code qui lit l'état de la batterie dans 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);
+}
+ +

En savoir plus sur le processus init

+ +

Le processus init dans Gonk gère le montage des fichiers système requis et engendre les services système. Après, il reste autour pour servir de gestionnaire de processus. Ceci est assez similaire au init des autres systèmes d'exploitation ressemblant à UNIX. Il interprète des scripts (c'est-à-dire, les fichiers init*.rc) qui consistent en des commandes décrivant ce qui devrait être réalisé pour démarrer des services. Le init.rc de Firefox OS est habituellement le stock init.rc d'Android pour l'appareil patché pour inclure les éléments nécessaires à la relance de Firefox OS. Il varie toutefois selon les appareils.

+ +

Une tâche clé que gère le processus init est le démarrage du processus b2g ; c'est le cœur du système d'exploitation Firefox OS.

+ +

Le code de init.rc qui démarre ceci ressemble à :

+ +
service b2g /system/bin/b2g.sh
+    class main
+    onrestart restart media
+ +
+

Note : Savoir exactement à quel point init.rc diffère de la version Android varie selon les appareils ; parfois, init.b2g.rc est simplement ajouté; parfois les patchs sont plus significatifs.

+
+ +

L'architecture des processus de l'espace utilisateur

+ +

A présent, il est utile d'avoir un regard de plus haut niveau sur la manière dont les composants multiples de Firefox OS s'imbriquent et interagissent entre eux. Le diagramme ci-dessous montre le principal processus de l'espace utilisateur de Firefox OS.

+ +

Userspace diagram

+ +
+

Note : Gardez à l'esprit que depuis que Firefox OS est développé activement, le diagramme est susceptible de changer et pourrait ne pas être complètement exact.

+
+ +

Le processus b2g est le principal processus système. Il s'exécute avec de hauts privilèges ; il a accès à la plupart des matériels de l'appareil. b2g communique avec le modem, dessine le framebuffer affiché et échange avec les GPS, l'appareil photo et d'autres fonctions matérielles. De manière interne, b2g exécute la couche Gecko (implémentée par libxul.so). Voir Gecko pour plus de détails sur la manière dont fonctionne la couche Gecko et comment b2g communique avec elle.

+ +

b2g

+ +

Le processus b2g peut à son tour déclencher un certain nombre de processus content à faibles privilèges. Ces processus sont l'endroit où les applications web et autres contenus web sont chargés. Ces processus communiquent avec le processus serveur principal Gecko avec le protocole IPDL, un système de transmission de messages.

+ +

Le processus b2g exécute libxul, qui référence b2g/app/b2g.js pour obtenir les préférences par défaut. Avec ces préférences, il va ouvrir le ficher HTML b2g/chrome/content/shell.html, qui est compilé dans le fichier omni.ja.. shell.html inclut le fichier b2g/chrome/content/shell.js, qui déclenche l'application system de Gaia.

+ +

rild

+ +

Le processus rild est l'interface du processeur du modem. rild est le démon qui implémente la couche de l'interface radio (Radio Interface Layer ou RIL). C'est un morceau de code propriétaire qui est implémenté par le fournisseur de matériel pour échanger avec le modem matériel. rild permet au code client de se connecter avec un socket UNIX auquel il se lie. Il commence par le code suivant dans le script d'init :

+ +
service ril-daemon /system/bin/rild
+    socket rild stream 660 root radio
+ +

rilproxy

+ +

Dans Firefox OS, le client rild est le processus rilproxy. Il agit comme un simple proxy de transfert d'information entre rild et b2g. Ce proxy est nécessaire comme un détail d'implémentation ; il suffit de dire qu'il est en effet nécessaire. Le code rilproxy est accessible sur GitHub.

+ +

mediaserver

+ +

Le processus mediaserver contrôle la lecture de l'audio et de la vidéo. Gecko échange avec lui à travers un mécanisme Android de Remote Procedure Call (RPC). Une partie des médias que Gecko peut lire (OGG Vorbis audio, OGG Theora video, et WebM video) est décodée par Gecko et envoyée directement au processus mediaserver. Les autres fichiers média sont décodés par libstagefright, qui est capable d'accéder aux codecs propriétaires et aux encodeurs matériels.

+ +
+

Note : Le processus mediaserver est un composant "temporaire" de Firefox OS ; il est là pour nous aider dans notre travail initial de développement. Cependant, il est prévu qu'il disparaisse éventuellement. Toutefois, cela ne devrait pas se produire avant au moins la version 2.0 de Firefox OS.

+
+ +

netd

+ +

Le processus netd est utilisé pour configurer les interfaces réseau.

+ +

wpa_supplicant

+ +

Le processus wpa_supplicant est le démon UNIX-style standard qui gère la connectivité avec les points d'accès Wi-Fi.

+ +

dbus-daemon

+ +

Le processus dbus-daemon implémente D-Bus, un système de bus de messages que Firefox OS utilise pour la communication Bluetooth.

+ +

Gecko

+ +

Gecko, comme mentionné précédemment, est une exécution de standards web (HTML, CSS, et JavaScript). Il est utilisé pour implémenter tout ce que voit l'utilisateur dans Firefox OS et pour contrôler les interactions avec le matériel du téléphone. Les applications Web connectent le HTML5 au matériel via des APIs Web contrôlées et sécurisées, implémentées dans Gecko. L'API Web fournit un accès informatisé aux fonctionnalités présentes dans le matériel sous-jacent de l'appareil mobile (comme la batterie ou la vibration), ainsi que les données stockées sur, ou disponibles pour, un périphérique (comme le calendrier ou les contacts). Le contenu Web appelle l'API Web accessible depuis HTML5.

+ +

Une application consiste en une collection de contenus web connexes HTML5. Pour construire des applications web qui s'exécutent sur des périphériques mobiles Firefox OS, les développeurs assemblent, emballent et distribuent simplement ce contenu web. Lors de l'exécution, ce contenu web est interprété, compilé et rendu dans un navigateur web. Pour plus d'informations sur les applications, voir le App Center.

+ +
+

Note : Pour rechercher la base de code Gecko, vous pouvez utiliser http://dxr.mozilla.org. C'est plus "fancy" et cela fournit de bonnes fonctionnalités de référence, mais avec des répertoires limités. Ou vous pouvez essayer le traditionnel http://mxr.mozilla.org, qui regroupe plus de projets de Mozilla.

+
+ +

Diagramme d'architecture Gecko

+ +

+ + + +

Fichiers Gecko en rapport avec Firefox OS

+ +

b2g/

+ +

Le dossier b2g contient la plupart des fonctions en lien avec Firefox OS.

+ +
b2g/chrome/content
+ +

Contient les fichiers JavaScript exécutés sur l'application système.

+ +
b2g/chrome/content/shell.html
+ +

Le point d'entrée dans Gaia — le HTML pour l'application système shell.html arrive dans settings.js et 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 contient les paramètres par défaut de réglages du système.

+ +
b2g/chrome/content/shell.js
+ +

shell.js est le premier script à charger dans l'application system de Gaia.

+ +

shell.js importe tous les modules requis, enregistre les écouteurs de touches, définit sendCustomEvent et sendChromeEvent pour communiquer avec Gaia et fournit des aides d'installation des webapps : quota indexedDB, RemoteDebugger, clavier auxiliaire et outil d'impression écran.

+ +

Mais la fonction la plus importante de shell.js est de lancer l'application system de Gaia, puis remettre l'ensemble du travail de gestion des systèmes à l'application system de Gaia.

+ +
let systemAppFrame =
+  document.createElementNS('http://www.w3.org/1999/xhtml', 'html:iframe');
+    ...
+  container.appendChild(systemAppFrame);
+ +
b2g/app/b2g.js
+ +

Le script contient des paramètres prédéfinis -comme about:config dans un navigateur- et identique à pref.js de Gaia. Ces paramètres peuvent être modifiés depuis l'application Paramètres et peuvent être écrasés avec user.js dans le script de compilation de Gaia.

+ +

dom/{API}

+ +

Des nouvelles implémentations de l'API (post-b2g) seront placées dans dom/. Des API plus vieilles seront placées dans dom/base, par exemple Navigator.cpp.

+ +
dom/apps
+ +

.jsm sera chargé — les implementations de l'API .js comme webapp.js install, getSelf, etc.

+ +
dom/apps/src/
+ +

Toutes les autorisations sont définies dans PermissionsTable.jsm

+ +

dom/webidl

+ +

WebIDL est le langage utilisé pour définir les APIs web. Pour les attributs supportés, lisez WebIDL_bindings.

+ +

hal/gonk

+ +

Ce répertoire contient les fichiers liés à la couche de port gonk.

+ +

Les fichiers Générés

+ +
module/libpref/src/init/all.js
+ +

Contient tous les fichiers de configuration.

+ +
/system/b2g/ omni.ja and omni.js
+ +

Contient le pack de styles pour les ressources de l'appareil.

+ +

Traitement des Événements d'entrée

+ +

La plupart des actions à l'intérieur de Gecko sont déclenchées par les actions de l'utilisateur. Ces actions sont représentées par des événements d'entrée (tels que les pressions de bouton, touches à un appareil à écran tactile, et ainsi de suite). Ces événements entrent dans le Gecko par la source Implementation de de l'interface nsIAppShell, une interface de Gecko qui est utilisée pour représenter les points principaux d'entrée pour une application de Gecko; c'est-à-dire le pilote du dispositif d'entrée appelle des méthodes sur l'objet nsAppShell qui représente le sous-système de Gecko pour envoyer des événements à l'interface utilisateur.

+ +

Par exemple :

+ +
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();
+}
+ +

Ces événements viennent du système standard input_event de Linux. Firefox OS utilise une couche d'abstraction légère, celle-ci offre quelques fonctionnalités intéressantes comme le filtrage des événements. Vous pouvez voir le code qui crée des événements d'entrée dans la méthode EventHub::getEvents() dans widget/gonk/libui/EventHub.cpp.

+ +

Une fois que les événements sont reçus par Gecko, ils sont expédiés dans le DOM par 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);
+}
+
+ +

Après cela, les événements sont soit consommés par Gecko lui-même ou sont expédiés à des applications Web en tant qu' événements DOM pour un traitement ultérieur.

+ +

Graphisme

+ +

Au niveau le plus bas, Gecko utilise OpenGL ES 2.0 pour dessiner un contexte GL qui enveloppe les tampons de trame de matériel. Cela se fait dans l'implémentation Gonk de nsWindow par un code similaire à ceci :

+ +
gNativeWindow = new android::FramebufferNativeWindow();
+sGLContext = GLContextProvider::CreateForWindow(this);
+ +

La class FramebufferNativeWindow est apportée directement d'Android; voir FramebufferNativeWindow.cpp. Cette dernière utilise l'API gralloc API pour accéder au pilote graphique dans l'optique de représenter les tampons du dispositif de framebuffer dans la mémoire.

+ +

Gecko utilise son système de Couches au contenu composite élaboré à l'écran. En résumé, voici ce qui se passe :

+ +
    +
  1. Gecko dessine des régions distinctes de pages dans des tampons de mémoire. Parfois, ces tampons sont dans la mémoire système; d'autres fois, elles sont des textures mappées dans l'espace d'adresse de Gecko, ce qui signifie que Gecko dessine directement dans la mémoire vidéo. Cela se fait habituellement dans la méthode BasicThebesLayer::PaintThebes().
    2. +
  2. Gecko regroupe alors toutes ces textures à l'écran utilisant des commandes OpenGL. Cette composition se produit dans ThebesLayerOGL::RenderTo().
    3. +
+ +

Les détails sur la façon dont Gecko gère le rendu du contenu web sortent du cadre de ce document.

+ +

Couche d'Abstraction Matérielle (HAL )

+ +

La couche d'abstraction matérielle Gecko est l'une des couches de portage de Gecko. Il gère l'accès de bas niveau aux interfaces du système à travers de multiples plate-formes utilisant une API C++ qui est accessible aux plus hauts niveaux de Gecko. Ces API sont mises en œuvre selon la plate-forme à l'intérieur du Gecko HAL (Hardware Abstraction Layer) lui-même. Cette couche d'abstraction de matériel n'est pas exposée directement au code JavaScript dans Gecko --- cette partie de l'interaction est assurée par les API Web.

+ +

Regardons le processus au haut niveau. Quand un utilisateur effectue une demande pour utiliser une fonction du téléphone (comme composer un numéro, accéder à un réseau Wi-Fi local, ou se connecter via Bluetooth), toutes les couches de la pile de technologie Firefox OS sont impliquées dans la réalisation de la demande. Les applications et le contenu web dans la couche Gaia soumettent des demandes d'accès à l'appareil sous-jacent via des appels d'API Web (appelées à partir de l'intérieur de fonctions HTML5), qui sont mis en œuvre dans Gecko. Gecko, à son tour, soumet la demande à Link. Une seule demande de Gecko peut déclencher une série complexe d'opérations, lancées et gérées par Gonk, dans le téléphone mobile.

+ +

Comment fonctionne le HAL

+ +

Prenons l'API Vibration comme exemple. Le Gecko HAL pour cette API est défini dans hal/Hal.h. En substance (simplification de la signature de la méthode pour des raisons de clarté), vous avez cette fonction :

+ +
void Vibrate(const nsTArray<uint32> &pattern);
+ +

Ceci est la fonction appelée par le code Gecko pour activer le dispositif de vibration en fonction de la configuration spécifiée; une fonction correspondante existe pour annuler toute vibration continue. La mise en œuvre de ce procédé Gonk se trouve dans hal/gonk/GonkHal.cpp:

+ +
void Vibrate(const nsTArray<uint32_t> &pattern) {
+  EnsureVibratorThreadInitialized();
+  sVibratorRunnable->Vibrate(pattern);
+}
+
+ +

Ce code envoie la demande pour faire vibrer le dispositif à un autre fil d'exécution, qui est mis en œuvre dans VibratorRunnable::Run(). La boucle principale de ce fil ressemble à ceci :

+ +
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() est l'API Gonk HAL (couche d'abstraction matérielle) qui tourne sur le moteur vibrant. En interne, cette méthode envoie un message au pilote du noyau en écrivant une valeur à un objet de noyau utilisant sysfs.

+ +

Alternatives aux implémentations de l'API HAL

+ +

Les APIs HAL Gecko sont prises en charge sur toutes les plate-formes. Quand Gecko est compilé pour une plate-forme qui ne dispose pas d'une interface de moteurs vibrants (comme un ordinateur de bureau), alors une alternative à l'implémentation de l'API HAL est utilisée. Pour les vibrations, cela est mis en œuvre dans hal/fallback/FallbackVibration.cpp.

+ +
void Vibrate(const nsTArray<uint32_t> &pattern) {
+}
+ +

Implémentations Sandbox

+ +

Parce que la plupart des contenus web fonctionne dans les processus de contenu avec des privilèges faibles, nous ne pouvons pas assumer que ces processus ont les privilèges nécessaires pour être en mesure, par exemple, d'allumer et éteindre le moteur de vibration. De plus, nous voulons avoir un emplacement central pour le traitement des conditions de course potentielles. Dans le Gecko HAL, cela se fait à travers une mise en œuvre «sandbox» de la HAL. Cette mise en œuvre sandbox proxie simplement des demandes formulées par des procédés de contenu et les transmet au processus du "serveur Gecko". Les demandes de proxy sont envoyés en utilisant IPDL.

+ +

Pour les vibrations, cela est géré par la fonction Vibrate() implémenté dans 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()));
+}
+ +

Cela envoie un message défini par l'interface PHal, décrit par IPDL dans hal/sandbox/PHal.ipdl. Cette méthode est décrite plus ou moins comme suit :

+ +
Vibrate(uint32_t[] pattern);
+ +

Le destinataire de ce message est la méthode HalParent::RecvVibrate() dans hal/sandbox/SandboxHal.cpp, qui ressemble à ceci :

+ +
virtual bool RecvVibrate(const InfallibleTArray<unsigned int>& pattern,
+            const InfallibleTArray<uint64_t> &id,
+            PBrowserParent *browserParent) MOZ_OVERRIDE {
+
+  hal::Vibrate(pattern, newID);
+  return true;
+}
+ +

Ceci omet certains détails qui ne sont pas appropriés à cette documentation; Cependant, il montre comment le message progresse d'un contenu de processus de Gecko à Gonk, puis à la mise en œuvre du HAL de Gonk Vibrate() et finalement au pilote de vibration.

+ +

Les API DOM

+ +

Les interfaces du DOM sont, en substance, comment le contenu Web communique avec Gecko. Ils sont plus impliqués que cela et si vous êtes intéressés par des détails supplémentaires, vous pouvez lire la documentation sur le DOM. Les interfaces du DOM sont définies en utilisant IDL, qui comprend aussi bien l'interface de fonction étrangère (FFI) que le modèle d'objet (OM) entre le JavaScript et C++.

+ +

L'API de vibration est exposée au contenu web à travers une interface IDL, qui est prévue dans nsIDOMNavigator.idl:

+ +
[implicit_jscontext] void mozVibrate(in jsval aPattern);
+ +

L'argument jsval indique que mozVibrate() (qui est notre implémentation du fournisseur préfixée de cette spécification de vibrations non-finalisé) accepte en entrée toute valeur JavaScript. Le compilateur IDL, xpidl, génère une interface C++ qui est ensuite mise en œuvre par la classe Navigator dans Navigator.cpp.

+ +
NS_IMETHODIMP Navigator::MozVibrate(const jsval& aPattern, JSContext* cx) {
+  // ...
+  hal::Vibrate(pattern);
+  return NS_OK;
+}
+ +

Il y a beaucoup plus de code dans cette méthode que ce que vous voyez ici, mais ce n'est pas important pour le but de cette documentation. Le fait est que l'appel à hal::Vibrate() le contrôle de transferts du DOM au HAL de Gecko. De là, nous entrons dans la mise en œuvre du HAL discutée dans la section précédente et nous frayons un chemin vers le pilote graphique. Par-dessus tout, la mise en œuvre du DOM ne se soucie pas du tout sur quelle plate-forme il est exécuté (Gonk, Windows, OS X, ou autre chose). Il ne se soucie pas non-plus si le code fonctionne dans un processus de contenu ou dans le processus serveur de Gecko. Ces détails sont tous laissés à des niveaux inférieurs du système à traiter.

+ +

L'API de vibration est une API très simple, ce qui en fait un bon exemple. L'API SMS est un exemple d'une API plus complexe qui utilise sa propre couche "d'accès distant" reliant les processus de contenu au serveur.

+ +

Couche d'Interface Radio (RIL)

+ +

La Couche d'Interface Radio, ou RIL pour Radio Interface Layer en Anglais a été mentionnée dans la section L'architecture des processus de l'espace utilisateur . Cette section examinera un peu plus de détail la manière dont les différents éléments de cette couche interagissent.

+ +

Les principaux composants impliqués dans la RIL sont :

+ +
+
rild
+
Chargé de communiquer avec le firmware modem propriétaire.
+
rilproxy
+
Qui proxie les messages entre rild et Gecko (lequel est mis en œuvre dans le processus de b2g). Ceci résout le problème d'autorisation qui se pose lorsque vous essayez de parler à rild directement, lorsque rild ne peut être communiquée à l'intérieur du groupe de radio.
+
b2g
+
+ +

Ce processus, également connu comme le procédé chrome, implémente Gecko. Les parties de celui-ci qui se rapportent à la couche d'interface radio sont dom/system/gonk/ril_worker.js qui mettent en œuvre un thread (fil) de travail qui communique avec rild par le biais de rilproxy et implémentent la machine d'état de la radio; et l' nsIRadioInterfaceLayer interface, qui est le service principal XPCOM du thread qui agit principalement comme un échange de messages entre le thread ril_worker.js et divers autres composants Gecko, y compris le processus contenu Gecko.

+ +
+
Processus du contenu de Gecko
+
+ +

Au sein du processus du contenu de Gecko, l' nsIRILContentHelper interface fournit un service de XPCOM qui laisse le code mettant en œuvre les parties de DOM, comme la Téléphonie et les APIs de SMS, communiquer avec l'interface de la radio, qui est dans le processus chrome., communiquer avec l'interface de la radio, qui est dans le processus chrome.

+ +

Exemple: Communication du rild au DOM

+ +

Jetons un œil à un exemple de la façon dont les parties de niveau inférieur du système communiquent avec le code DOM. Lorsque le modem reçoit un appel entrant, il notifie au rild en utilisant un mécanisme propriétaire. rild prépare alors un message pour son client selon le protocole «ouvert», qui est décrit dans ril.h. Dans le cas d'un appel entrant, un message RIL_UNSOL_RESPONSE_CALL_STATE_CHANGED est généré et envoyé par rild à rilproxy.

+ +

rilproxy, implémenté dans le rilproxy.c, reçoit ce message dans sa boucle principale, qui sonde sa connexion à rild en utilisant le code suivant :

+ +
ret = read(rilproxy_rw, data, 1024);
+
+if(ret > 0) {
+  writeToSocket(rild_rw, data, ret);
+}
+ +

Une fois le message reçu de rild, il est ensuite expédié le long de Gecko sur la prise qui relie rilproxy Gecko. Gecko reçoit le message transmis sur son IPC thread:

+ +
int ret = read(fd, mIncoming->Data, 1024);
+// ... gestion des erreurs ...
+mIncoming->mSize = ret;
+sConsumer->MessageReceived(mIncoming.forget());
+
+ +

Le consommateur de ces messages est SystemWorkerManager, qui reconditionne les messages et les envoie au ril_worker.js thread qui implémente la machine d'état RIL; ceci est fait dans la méthode RILReceiver::MessageReceived() :

+ +
virtual void MessageReceived(RilRawData *aMessage) {
+  nsRefPtr<DispatchRILEvent> dre(new DispatchRILEvent(aMessage));
+  mDispatcher->PostTask(dre);
+}
+ +

La tâche postée à ce thread appelle à son tour la fonction onRILMessage(), qui est implémentée en JavaScript. Ceci est fait en utilisant la fonction API JavaScript JS_CallFunctionName():

+ +
return JS_CallFunctionName(aCx, obj, "onRILMessage", NS_ARRAY_LENGTH(argv),
+                           argv, argv);
+ +

onRILMessage() est mis en œuvre dans dom/system/gonk/ril_worker.js, qui traite le message octets et les découpe en parcelles. Chaque colis complet est ensuite envoyé à des méthodes de gestionnaire individuelles, le cas échéant:

+ +
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);
+  }
+}
+
+ +

Ce code fonctionne en récupérant le type de demande de l'objet, en s'assurant qu'il soit défini comme une fonction dans le code JavaScript, appelant ensuite la méthode. Depuis ril_worker.js met en œuvre chaque type de demande dans une méthode donnée, le même nom que le type de demande, ce qui est très simple.

+ +

Dans notre exemple, RIL_UNSOL_RESPONSE_CALL_STATE_CHANGED, le code suivant est appelé:

+ +
RIL[UNSOLICITED_RESPONSE_CALL_STATE_CHANGED] = function UNSOLICITED_RESPONSE_CALL_STATE_CHANGED() {
+  this.getCurrentCalls();
+};
+ +

Comme vous pouvez le voir dans le code ci-dessus, quand une notification est reçue indiquant que le call state a changé, la state machine récupère le call state courant en appelant la méthode getCurrentCall():

+ +
getCurrentCalls: function getCurrentCalls() {
+  Buf.simpleRequest(REQUEST_GET_CURRENT_CALLS);
+}
+ +

Cela envoie une request back à rild pour demander l'état de tous les appels actifs à l'instant. 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. Et la communication ainsi bidirectionnelle arrive.

+ +

Le call state est alors traité et comparé au précédent état; S'il y a un changement d'état, ril_worker.js notifie le service nsIRadioInterfaceLayer sur le thread principal:

+ +
_handleChangedCallState: function _handleChangedCallState(changedCall) {
+  let message = {type: "callStateChange",
+                 call: changedCall};
+  this.sendDOMMessage(message);
+}
+ +

nsIRadioInterfaceLayer est implémenté dans dom/system/gonk/RadioInterfaceLayer.js; le message est reçu par la méthode onmessage():

+ +
 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;
+   ...
+
+ +

Tout ce qu'il fait est d'expédier le message pour le processus de contenu en utilisant le Parent Process Message Manager (PPMM):

+ +
handleCallStateChange: function handleCallStateChange(call) {
+  [some internal state updating]
+  ppmm.sendAsyncMessage("RIL:CallStateChanged", call);
+}
+ +

Dans le processus de contenu, le message est reçu par la méthode receiveMessage() dans le service nsIRILContentHelper , depuis le 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;
+ +

Ce dernier, à son tour, appelle les méthodes nsIRILTelephonyCallback.callStateChanged() sur chaque objet telephony callback enregistré. Chaque application web qui accède à l'API window.navigator.mozTelephony a enregistré un tel objet callback que propage les événements au code JavaScript dans l'application web, either as un changement d'état d'un objet appel existant ou un nouvel événement appel entrant.

+ +
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;
+}
+ +

Les applications peuvent recevoir ces évenements et mettre à jour leur interface utilisateur etc:

+ +
handleEvent: function fm_handleEvent(evt) {
+  switch (evt.call.state) {
+    case 'connected':
+      this.connected();
+      break;
+    case 'disconnected':
+      this.disconnected();
+      break;
+    default:
+      break;
+  }
+}
+ +

Jetez un coup d'œil à la mise en œuvre de handleEvent(), dans l'application de demande de de composeur de numéro comme exemple étendu

+ +

3G data

+ +

Il y a un message RIL qui amorce(introduit) "un appel de données" au service cellulaire; ceci permet le mode de transfert de données dans le modem. Cet appel de données finit par créer et activer un Point-to-Point Protocol (PPP) le dispositif d'interface dans le noyau Linux qui peut être configuré utilisant les interfaces habituelles.

+ +
+

Note: Cette section doit être écrite.

+
+ +

API de DOM liées

+ +

Cette section inscrit les API de DOM qui sont relatées(liées) aux communications RIL :

+ + + +

Wi-Fi

+ +

L'arrière-plan Wi-Fi pour Firefox OS utilise simplement wpa_supplicant pour faire la plupart du travail. Cela signifie que le travail principal de l'arrière-plan doit simplement gérer le suppliant et faire quelques tâches auxiliaires comme le chargement du conducteur Wi-Fi et de la permission ou la mise hors de service de l'interface de réseau. En substance, cela signifie que l'arrière-plan est une machine d'état, avec les états après l'état du suppliant.

+ +
+

Note: Une grande partie du truc(de la substance) intéressant qui arrive dans le Wi-Fi dépend profondément de changements possibles d'état du processus de wpa_supplicant.

+
+ +

La mise en œuvre du composant Wi-Fi est cassée dans deux fichiers:

+ +
+
dom/wifi/DOMWifiManager.js
+
Met en œuvre l'API qui s'est exposée au contenu Web, comme défini dans nsIWifi.idl.
+
dom/wifi/WifiWorker.js
+
Met en œuvre la machine d'état et le code qui conduit le suppliant.
+
+ +

Ces deux fichiers(dossiers) communiquent entre eux par l'utilisation du manager de message. L'arrière-plan écoute pour des messages demandant certaines actions, comme "l'associé" et répond par un message quand l'action demandée a été achevée.

+ +

Le côté de DOM écoute pour les méthodes de réponse aussi bien que plusieurs messages d'événement qui indiquent des changements d'état et des mises à jour de l'information.

+ +
+

Note: N'importe quelle API de DOM synchrones est mise en œuvre par des données mises en antémémoire sur ce côté de la conduite. Des messages synchrones sont évités quand c'est possible.

+
+ +

WifiWorker.js

+ +

Ce fichier met en œuvre la logique principale derrière l'interface Wi-Fi. Il fonctionne dans le processus chromé (dans le multi-processus construit) et est instancié par le SystemWorkerManager. Le fichier est généralement cassé dans deux sections : une fonction anonyme géante et WifiWorker (et son prototype). La fonction anonyme finit étant le WifiManager en fournissant une API locale, y compris des notifications pour des événements comme la connexion au suppliant et les résultats de feuilletage étant disponibles. En général, il contient peu de logique et laisse son consommateur unique contrôler ses actions tandis qu'il répond simplement par les informations demandées et contrôle les détails du rapport(de la connexion) avec le suppliant.

+ +

L'objet de WifiWorker est assis entre le WifiManager et le DOM. Il réagit aux événements et les transfert à DOM; à son tour, il reçoit des requêtes de DOM et exécute les actions appropriées sur le suppliant. Il maintient aussi des informations d'état sur le suppliant et ce qu'il doit faire ensuite.

+ +

DOMWifiManager.js

+ +

Cela met en œuvre l'API de DOM, transmettant des messages dans les deux sens entre des interlocuteurs et le travailleur Wi-Fi réel. Il y a très peu de logique impliquée.

+ +
+

Note: Pour éviter des messages synchrones au processus chromé, le Manager Wi-Fi a vraiment besoin du cache de l'état basé sur l'événement reçu.

+
+ +

Il y a un message synchrone seul, qui est envoyé à temps à l'API DOM est instanciée, pour obtenir l'état actuel du suppliant.

+ +

DHCP

+ +

DHCP et DNS sont traités par dhcpcd, la norme Linux DHCP le client. Cependant, il ne peut pas réagir quand la connexion de réseau est perdue. À cause de ceci, Firefox OS tue et reprend dhcpcd chaque fois il connecte à un réseau sans fil donné.

+ +

Dhcpcd est aussi responsable de mettre le parcours par défaut; nous appelons dans le gestionnaire de réseau pour parler au noyau de serveurs DNS.

+ +

Gestionnaire de réseau

+ +

Le Gestionnaire de réseau configure des interfaces de réseau ouvertes par le 3G des données et des composants Wi-Fi.

+ +
+

Note: Cela doit être écrit.

+
+ +

Processus et threads

+ +

Firefox OS utilise des threads POSIX pour mettre en œuvre tous les threads d'application, ceci inclut le fil conducteur de chaque travailleur d'application aussi bien que Web et des threads d'aide. Des valeurs agréables sont utilisées priorisent au processus et l'exécution de thread comptant ainsi sur le planificateur de noyau Linux standard. Selon le statut d'un processus nous l'assignons un niveau agréable et différent. Nous avons actuellement 7 niveaux :

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Traitez des niveaux prioritaires
PrioritéNiceUtilité
MASTER0Processus de b2g principal
FOREGROUND_HIGH0Applications tenant une UC wakelock
FOREGROUND1Applications de premier plan
FOREGROUND_KEYBOARD1Application de clavier
BACKGROUND_PERCEIVABLE7Applications de fond jouant audio
BACKGROUND_HOMESCREEN18Application d'écran d'accueil
BACKGROUND18Toutes les autres applications fonctionnant en arrière-plan
+ +

Quelques niveaux partagent les mêmes valeurs agréables, c'est que ces niveaux diffèrent actuellement dans la façon qu'ils sont traités par le tueur de mémoire insuffisante. Toutes les priorités peuvent être ajustées à construisent le temps via des préférences; les entrées pertinentes peuvent être trouvées dans le fichier de b2g/app/b2g.js.

+ +
+

Note: Pour plus d'informations sur le tueur de mémoire insuffisante et comment Firefox OS gère des situations de mémoire basses, lire Mémoire insuffisante la gestion sur Firefox OS.

+
+ +

Dans un processus le thread conducteur hérite la valeur agréable du processus tandis que l'on donne aux fils de travailleur Web une valeur agréable qui est un point plus haut que le thread conducteur fonctionnant ainsi à la priorité inférieure. Ceci est fait pour empêcher des travailleurs intensifs de l'UC d'excessivement ralentir le thread conducteur. Les priorités de processus sont changées quand un événement majeur arrive comme une demande est envoyée dans le contexte ou le premier plan, une nouvelle demande est mise en marche ou une application existante saisit une UC wakelock. Quand une priorité de processus est ajustée, les priorités de tous ses fils seront aussi ajustées en conséquence.

+ +
+

Note: Ces groupes ne sont pas actuellement utilisés pour la gestion de ressource comme ils ont prouvé incertains sur certains dispositifs et des noyaux.

+
diff --git a/files/fr/archive/b2g_os/platform/gaia/gaia_apps/browser/index.html b/files/fr/archive/b2g_os/platform/gaia/gaia_apps/browser/index.html new file mode 100644 index 0000000000..2d8ff1001d --- /dev/null +++ b/files/fr/archive/b2g_os/platform/gaia/gaia_apps/browser/index.html @@ -0,0 +1,136 @@ +--- +title: Navigateur +slug: Archive/B2G_OS/Platform/Gaia/Gaia_apps/Browser +tags: + - Apps + - Firefox OS + - Gaia + - Guide + - Navigateur +translation_of: Archive/B2G_OS/Platform/Gaia/Gaia_apps/Browser +--- +
+

L'application Navigateur (qui fait maintenant partie de System) offre des fonctionnalités de navigation lorsque cela est nécessaire — cela comprend la navigation sur des pages, la recherche et les marque-pages. Cet article explique comment les fonctionnalités de base de l'application Navigateur fonctionnent, et comment elle s'intègre dans un système plus vaste.

+
+ +

Comme Gaia est construit pour s'exécuter au-dessus de Gecko, il a été possible de concevoir un Navigateur Système/application Navigateur pour naviguer sur des pages web classiques, basé sur cette instance Gecko. Cela est accessible par l'intermédiaire de l'API mozBrowser.

+ +
+

Note : Depuis Firefox OS 2.1, l'application Navigateur fait partie de System. Cela signifie que la navigation web peut se faire soit en cliquant sur l'icône Navigateur pour ouvrir l'application, soit en utilisant la fonctionnalité de navigation et de recherche universelle. Grâce à l'expérience utilisateur Haida, l'application et les onglets de navigation sont alors unifiés pour une expérience commune et sont présents dans le gestionnaire de tâches ainsi que dans la vue des miniatures (pour la navigation latérale).

+
+ + + +

Quand un utilisateur Firefox OS marque une page web pour qu'elle apparaisse sur l'écran d'accueil, cette page web s'ouvrira dans le Navigateur Système et non dans l'application Navigateur. Il comporte dans la partie inférieure une barre d'outils contenant les fonctions génériques reculer/avancer/actualiser. Dans Gaia, cela est appelé le Navigateur Chrome ou wrapper. Vous pouvez le voir en action du côté droit de l'image suivante.

+ +

A diagram showing that when a web page is opened in the system browser, it is given a toolbar.

+ +

Si vous souhaitez que votre page web dispose toujours des fonctions reculer/avancer/actualiser, vous pouvez ajouter la ligne suivante dans le manifeste de l'application pour activer le Navigateur Chrome.

+ +
declare { chrome: { navigation: true } }
+ +
+

Note : La barre d'outils du Navigateur Chrome a une incidence sur la hauteur du contenu, il est donc nécessaire de la prendre en compte pour la mise en page de vos pages web.

+
+ +

Le flux de code

+ +

Lors de l'ouverture d'une nouvelle page web dans Firefox OS, la séquence des appels est

+ +
Gecko > WrapperFactory > Window Manager > AppWindow > BrowserFrame
+ +

Les wrappers héritant de system/js/wrapper_factory recevront l'événement mozbrowseropenwindow dans le cas d'une page web en marque-page.

+ +

Dans la section handleEvent, le gestionnaire va vérifier l'événement pour déterminer si la page web doit être ouverte en tant qu'application ou dans le navigateur chrome.

+ +

Enfin, launchWrapper est appelée pour lancer la fenêtre correspondante.

+ + + +

Avec la nouvelle barre de navigation et de recherche, les utilisateurs peuvent accéder à leurs favoris, saisir une URL, ou découvrir de nouvelles applications depuis n'importe où dans Firefox OS. La barre de recherche se trouve en haut de l'écran et les utilisateurs peuvent juste toucher l'écran ou faire glisser le doigt dessus pour l'ouvrir.

+ +

Voyez cela comme une combinaison de l'Awesome Bar du navigateur et de la recherche adaptative d'applications de l'écran d'accueil. Comme Firefox OS utilise des applications web, lorsque vous trouvez ce que vous voulez, même s'il s'agit d'une nouvelle application, il l'ouvre directement. Vous n'avez pas besoin d'installer quoi que ce soit, parce que tout est de type web et instantané.

+ +

Application Navigateur

+ +

Le Navigateur est une application web certifiée qui procure une expérience de navigation web générale. La fonction principale se trouve dans apps/browser/js/browser.js :

+ +
var Browser = {
+  init: function browser_init() {
+    this.getAllElements();
+      ...
+    BrowserDB.init((function() {
+      ...
+    }
+  }
+};
+
+window.addEventListener('load', function browserOnLoad(evt) {
+  window.removeEventListener('load', browserOnLoad);
+  Browser.init();
+});
+ +

Le Navigateur appellera sa fonction init() pendant le chargement du DOM.

+ +
getAllElements: function browser_getAllElements() {
+  var elementIDs = [
+    'toolbar—start', ... 'danger—dialog'];
+
+  // Loop and add element with camel style name to Modal Dialog attribute.
+  elementIDs.forEach(function createElementRef(name) {
+    this[this.toCamelCase(name)] = document.getElementById(name);
+  }, this);
+},
+ +

La fonction getAllElements est utilisée pour obtenir tous les gestionnaires d'élément camelCase, après quoi apps/browser/js/browser_db.js est appelée pour se préparer à l'ajout du moteur de recherche par défaut et des marque-pages.

+ +

Marque-pages

+ +

À partir de Firefox OS 2.0, apps/bookmark est utilisé pour gérer les activités d'enregistrement/suppression de marque-pages.

+ +

La partie la plus intéressante, apps/bookmark/webapp.manifest, ressemble à ceci :

+ +
"activities": {
+  "save—bookmark": {
+    "filters": {
+      "type": "url",
+      "url": { "required":true, "pattern":"https?:.{1,16384}" }
+    },
+    "disposition": "inline",
+    "href": "/save.html",
+    "returnValue": true
+  },
+  "remove—bookmark": {
+    "filters": {
+      "type": "url",
+      "url": { "required":true, "pattern":"https?:.{1,16384}" }
+    },
+    "disposition": "inline",
+    "href": "/remove.html",
+    "returnValue": true
+  }
+},
+ +

Comme indiqué plus haut, l'activité est gérée par save.html et remove.html. Les deux opérations sont prises en charge par apps/bookmark/js/activity_handler.js:

+ +
var ActivityHandler = {
+  'save—bookmark': function ah_save(activity) {
+  },
+
+  'remove—bookmark': function ah_remove(activity) {
+  }
+};
+
+navigator.mozSetMessageHandler('activity', function onActivity(activity) {
+  var name = activity.source.name;
+  switch (name) {
+    case 'save—bookmark':
+    case 'remove—bookmark':
+      if (activity.source.data.type === 'url') {
+        ActivityHandler[name](activity);
+      }
+    ...
+  }
+}
+ +

Quand le gestionnaire de message en écoute navigator.mozSetMessageHandler('activity') réceptionne les activités save-bookmark ou remove-bookmark, la fonction ActivityHandler est appelée pour gérer les opérations correspondantes.

diff --git a/files/fr/archive/b2g_os/platform/gaia/gaia_apps/index.html b/files/fr/archive/b2g_os/platform/gaia/gaia_apps/index.html new file mode 100644 index 0000000000..6ac3ce3e51 --- /dev/null +++ b/files/fr/archive/b2g_os/platform/gaia/gaia_apps/index.html @@ -0,0 +1,92 @@ +--- +title: Applications Gaia +slug: Archive/B2G_OS/Platform/Gaia/Gaia_apps +tags: + - Applications + - Architecture + - Firefox + - Gaia + - OS +translation_of: Archive/B2G_OS/Platform/Gaia/Gaia_apps +--- +
+

Gaia est l'interface utilisateur de Firefox OS, elle contient la fonction d'administration du système et la suite d'applications par défaut embarquée avec les appareils Firefox OS. La totalité du code source de Gaia — même le système et les claviers IMEs (Input Method Editors) — est entièrement implémentée avec HTML5 (HTML + CSS + Javascript) & Open WebAPIs. Cette série de documents contient les informations sur comment chacune des applications disponibles par défaut dans Gaia fonctionne.

+
+ +

Catégories des fonctionnalités Gaia

+ +

 Les différentes applications à l'intérieur de Gaia peuvent être grossièrement classées dans les groupes listés ci-dessous.

+ +
+

Note: de nombreuses pages référencées afin d'apporter plus d'informations sur le fonctionnement des applications sont des pages README venant du dépôt Github Gaia. Ceci s'explique par le fait que de nombreuses applications ont des cycles de développement rapides et sont donc sujettes à de fréquentes (souvent journalières) modifications. Il serait alors peu censé d'essayer de garder les pages MDN à jour avec ces changements fréquents. Les pages README sont actuellement les sources d'informations les plus précises et les plus fiables.

+
+ +

Plate-forme

+ +

Inclut les applications Système (system), Paramètres (settings), Écran de verrouillage (lockscreen), scripts de construction (build script) et Bluetooth.

+ +

+ +

Applications de la plate-forme: explication détaillée

+ +
+
Système
+
L'application Système est la première application web chargée par Gecko lors de la procédure de démarrage de Firefox OS. Elle assume de nombreuses responsabilités qui sont généralement nécessaires pour utiliser le système et n'est donc pas prise en charge, elle-même, par d'autres applications web.
+
Navigateur
+
L'application Navigateur (qui fait maintenant partie de l'application Système) fournit des fonctionnalités semblables à un navigateur lorsque cela est nécessaire — cela inclut la navigation entre les pages, la recherche et les marque-pages.
+
Gestion des fenêtres
+
La fonctionnalité de gestion des fenêtres de Firefox OS —  incluant le cycle de vie et l'interaction d'une application, les notifications, les animations et beaucoup plus —  est gérée par une partie spécifique de l'application Système. Cet article étudie la Gestion des Fenêtres de Firefox OS en détails.
+
Paramètres
+
L'application Paramètres permet aux utilisateurs de Firefox OS de configurer les paramètres de leur appareil. Elle permet également de répondre aux appels d'activités (Web activités avec le nom configure), ce qui permet à d'autres applications d'être renvoyées vers différents panneaux à l'intérieur de l'application Paramètres, afin d'enrichir les possibilités de paramétrage (par exemple en montrant le panneau des paramètres du Wi-Fi si une connexion Internet est disponible).
+
+ +

Communication

+ +

Inclut les applications Téléphone (dialer), Contacts (contact), Messages (sms) et FTU (First Time Use).

+ +

+ +

Applications de communication: explication détaillée

+ +

TBD

+ +

Productivité

+ +

Inclut les applications Courriel (email), Agenda (calendar) et Horloge (clock).

+ +

+ +

Applications de productivité: explication détaillée

+ +
+
Agenda
+
L'application Agenda est incluse par défaut dans Firefox OS.
+
Horloge
+
L'application Horloge, présente par défaut dans Firefox OS, inclut les fonctionnalités d'alarme, de minuteur et de chronomètre.
+
Courriel
+
L'application de Gaia permettant d'envoyer et de recevoir des courriels.
+
+ +

Média

+ +

Inclut les applications Photo (camera), Galerie (gallery), Musique (music) et Vidéo (video) et quelques fonctions liées aux médias telles que les DRM et fonds d'écran (wallpaper).

+ +

+ +

Applications média: explication détaillée

+ +
+
Vidéo
+
L'application Vidéo est une simple application de lecture de vidéos qui jouera les vidéos présentes sur l'espace de stockage des médias de votre appareil Firefox OS.
+
Photo
+
L'application Photo permet aux utilisateurs de Firefox OS d'enregistrer et de gérer les vidéos et photos venant de l'appareil photo. Elle permet également de gérer les vidéos et photos qui répondent aux Web activités du type pick, c'est à dire venant des autres applications voulant obtenir un média utilisant la fonctionnalité de Caméra.
+
+ +

Autres fonctionnalités Gaia

+ +

 En plus de ces fonctions, il y a plusieurs autres fonctionnalités majeures telles que le navigateur, l'écran d'accueil, le Marketplace, le framework de test, le lecteur de PDF et le gestionnaire d'applications qui sont développées en parallèle de Gaia.

+ +
+
pdf.js
+
pdf.js est un lecteur PDF basé sur HTML5 utilisé par Gaia. Notez que le code pour pdf.js est maintenu dans un dépôt séparé, en dehors de Gaia.
+
diff --git "a/files/fr/archive/b2g_os/platform/gaia/gaia_apps/param\303\250tres/index.html" "b/files/fr/archive/b2g_os/platform/gaia/gaia_apps/param\303\250tres/index.html" new file mode 100644 index 0000000000..250917fdfe --- /dev/null +++ "b/files/fr/archive/b2g_os/platform/gaia/gaia_apps/param\303\250tres/index.html" @@ -0,0 +1,112 @@ +--- +title: Paramètres +slug: Archive/B2G_OS/Platform/Gaia/Gaia_apps/Paramètres +tags: + - Applications + - B2G + - Firefox OS + - Gaia + - JavaScript + - Paramètres +translation_of: Archive/B2G_OS/Platform/Gaia/Gaia_apps/Settings +--- +
+

L'application Paramètres permet aux utilisateurs de configurer les paramètres de leur appareil et répond aux activités entrantes qui autorisent les développeurs à afficher des vues spécifiques de paramètres (par exemple afficher le panneau des paramètres wifi si aucune connexion réseau n'est disponible). Cet article explique comment cela fonctionne.

+
+ +

mozSettings API et association de données

+ +

Techniquement, l'application Paramètres est l'interface utilisateur qui leur fournit l'accès certifié à l'API window.navigator.mozSettings.

+ +

L'application Paramètres gère automatiquement les opérations de paramétrage basique comme les champs d'association de données et les valeurs mozSettings — toutes les opérations basiques comme basculer un paramètre ou changer une valeur d'entrée vont aussi modifier la valeur mozSettings associée.

+ +

L'API window.navigator.mozSettings accède depuis Gecko aux données paramètres. L'utilisation ressemble à ceci pour mettre à jour les données :

+ +
navigator.mozSettings.createLock().set(values);
+ +
+

Note: Il faut utiliser createLock() pour verrouiller les paramètres avant de lire ou écrire des valeurs mozSettings.

+
+ +

Pour récupérer les données, il est possible d'utiliser un appel de fonction get et set pour effectuer des opérations sur les données :

+ +
var reqTimerGoBack =
+window.navigator.mozSettings.createLock().get('icc.goBackTimeout');
+reqTimerGoBack.onsuccess = function icc_getTimerGoBackSuccess() {
+  goBackTimer.timeout = reqTimerGoBack.result['icc.goBackTimeout'];
+    ...
+};
+ +

La donnée est stockée dans un emplacement instance.result.

+ +

Depuis Firefox OS 2.0, une seule instance mozSettings peut être réutilisée via js/modules/settings_cache.js :

+ +
var SettingsCache = require('modules/settings_cache');
+
+SettingsCache.getSettings(function(result){
+  var onlineSupportTitle = result['support.onlinesupport.title'];
+    ...
+});
+ + + +

Quand les utilisateurs ouvrent l'application Paramètres, ils voient plusieurs panneaux sur la page de vue d'ensemble, qui sont des pages indépendantes fonctionnellement. SettingsService.navigate (js/module/settings_service.js) contrôle la navigation entre ces pages.

+ +
+

Note: Pour les panneaux légaux (qui ne sont pas portés par la nouvelle structure), settings.currentPanel est utilisé à la place de SettingsService.navigate pour naviguer entre les panneaux.

+
+ +

Puisque Firefox OS sera supporté sur les tablettes et appareils mobiles, l'application Paramètres possède deux types d'implémentation de modèle de navigation :

+ + + +

Tant qu'il est appelé, SettingsService.navigate détermine quel modèle de navigation utiliser grâce au code suivant :

+ +
if (_isTabletAndLandscape()) {
+  PageTransitions.twoColumn(oldPanel, newPanel, callback);
+} else {
+  PageTransitions.oneColumn(oldPanel, newPanel, callback);
+}
+ +

Panneaux

+ +

Depuis bien avant Firefox OS 2.0, la structure basique d'un panneau est définie dans js/modules/panel.js. Il définit six statistiques de cycle de vie :

+ + + +

Tous les nouveaux panneaux de paramètres héritent de SettingsPanel, qui étend les fonctionnalités de Panel. Le code est contenu dans js/modules/settings_panel.js:

+ +
onInit: function(panel, initOptions) {
+  ...
+
+  PanelUtils.activate(panel);
+},
+
+onBeforeShow: function(panel, beforeShowOptions) {
+  // Preset the panel every time when it is presented.
+  PanelUtils.preset(panel);
+  _addListeners(panel);
+  ...
+},
+ +

PanelUtils.activate — défini dans js/modules/panel_utils.js — est utilisé pour parser tous les liens dans le panneau et ajoute les handlers corresponsants dans la statistique onInit, et PanelUtils.preset est utilisé pour prérégler les éléments avec les valeurs de paramétrage dans la statistique onBeforeShow.

+ +

Tous les nouveaux paramètres sont définis dans le dossier js/panels.

+ +

Module AMD et optimisation du temps de compilation

+ +

Depuis bien avant Firefox OS 2.0, l'application Paramètres utilise le AMD modules pattern pour implémenter chaque panneau. Les modules AMD modules sont chargés via Alemeda (une version plus légère de RequireJS) et compilés/optimisés avec r.js (l'optimiseur RequireJS). L'application Paramètres a toujours des dépendances sur des fichiers (shared/js) qui ne sont pas des modules AMD. Pour ces derniers, il faut utiliser les options shim définies dans settings/js/config/require.js.

+ +

Voir aussi

+ +

Le README Settings app has a build-in qui est utile pour aller plus loin sur les Paramètres (principalement écrit par Arthur Chen et Fred Lin).

diff --git "a/files/fr/archive/b2g_os/platform/gaia/gaia_apps/syst\303\250me/index.html" "b/files/fr/archive/b2g_os/platform/gaia/gaia_apps/syst\303\250me/index.html" new file mode 100644 index 0000000000..9e8749702e --- /dev/null +++ "b/files/fr/archive/b2g_os/platform/gaia/gaia_apps/syst\303\250me/index.html" @@ -0,0 +1,303 @@ +--- +title: Système +slug: Archive/B2G_OS/Platform/Gaia/Gaia_apps/Système +tags: + - Apps + - FTU + - Firefox OS + - Gaia + - JavaScript + - UI + - système + - écran de verrouillage +translation_of: Archive/B2G_OS/Platform/Gaia/Gaia_apps/System +--- +
+

L'application Système est la première application web chargée par Gecko lors de la procédure de chargement de Firefox OS ; elle gère un grand nombre de fonctionnalités qui sont requises pour le fonctionnement du système en général et ne font donc pas l'objet d'applications web individuelles. Cet article explique en détails comment Système fonctionne.

+
+ +
+

Any application that can be written in JavaScript, will eventually be written in JavaScript. -- Atwood's Law

+
+ +
+

Note : Le code source de l'application Système se trouve dans le dépôt Github de Gaia.

+
+ +

Comment est chargée l'application système

+ +

Quand Gecko essaye de démarrer l'application Système, il référence le manifest.webapp de Système et charge le fichier index.html référencé par le paramètre launch_path (launch_path vaut toujours /index.html pour les applications Gaia.) index.html contient les liens vers tous les styles et JavaScript du système dans sa globalité. Pour gérer un système mobile complet, l'application Système doit charger un grand nombre de ressources.

+ +

Le processus de démarrage est lancé à partir de bootstrap.js, avec le code suivant :

+ +
window.addEventListener('load', function startup() {
+// define safelyLaunchFTU
+function safelyLaunchFTU() {
+  ...
+}
+
+if (Applications.ready) {
+  safelyLaunchFTU();
+} else {
+  ...
+}
+
+window.addEventListener('ftudone', function doneWithFTU() {
+  window.removeEventListener('ftudone', doneWithFTU);
+
+  var lock = window.navigator.mozSettings.createLock();
+  lock.set({
+    'gaia.system.checkForUpdates': true
+  });
+}
+
+  ...
+
+// With all important event handlers in place, we can now notify
+// Gecko that we're ready for certain system services to send us
+// messages (e.g. the radio).
+var evt = new CustomEvent('mozContentEvent',
+{ bubbles: true, cancelable: false,
+  detail: { type: 'system-message-listener-ready' } });
+  window.dispatchEvent(evt);
+}
+ +

Le code fonctionne comme ceci :

+ +
    +
  1. Système est une véritable application web exécutée dans un moteur de navigateur, toutes les ressources dont elle dépend doivent être chargées — y compris les styles et les images. Nous lançons donc tout au déclenchement de l'événement window.onload.
    2. +
  2. Tout d'abord, nous préparons le lancement de l'expérience de première utilisation FTU (First Time Use) et de l'écran d'accueil avec la fonction safelyLaunchFTU(). Comme son nom l'indique, FTU n'est affichée que si l'utilisateur démarre Firefox OS pour la première fois.
    3. +
  3. Quand l'utilisateur appuie sur TERMINÉ dans le FTU, l'événement personnalisé ftudone est activé puis bootstrap.js se met en écoute sur cet événement dans l'attente de le traiter.
    4. +
  4. Ensuite, nous utilisons Settings API (navigator.mozSettings) pour définir le réglage gaia.system.checkForUpdates sur vrai, ce qui indique que le système va rechercher les mises à jour.
    5. +
  5. Enfin, nous lançons l'événement personnalisé window.dispatchEvent,  via CustomEvent. C'est un modèle très important utilisé par Gaia pour les notifications systèmes et la communication avec Gecko. Dans le cas présent, l'application Gaia Système notifie à Gecko qu'elle est prête à se mettre en écoute et à gérer les événements.
    6. +
+ +

Modularisation instanciable

+ +

Le système lui-même évolue constamment vers plus de modularité et de flexibilité. Depuis la version 1.4, une initiative est en cours pour faire évoluer le module système vers un objet instanciable.

+ +

Une fois tout le code au-dessus exécuté, les références vers chaque composant système dans bootstrap.js seront de la forme suivante :

+ +
window.telephonySettings = new TelephonySettings();
+window.telephonySettings.start();
+ +

Le squelette du code source de TelephonySettings() serait :

+ +
(function(exports) {
+  'use strict';
+  function TelephonySettings() {
+    this.init_param = false;
+  }
+
+  TelephonySettings.prototype = {
+    // Initialzes all settings.
+    start: function() {
+      ...
+    },
+
+    // Clean all settings.
+    stop: function() {
+      ...
+    },
+
+    1st_method: function ts_1st_method() {
+      ...
+    },
+
+    2nd_method: function ts_2nd_method() {
+      ...
+    }
+  };
+
+  exports.TelephonySettings = TelephonySettings;
+
+}(window));
+ +

Ce modèle contribue à la modularisation des composants systèmes et rend ces derniers davantage testables.

+ +

Animations de démarrage et d'extinction

+ +

Cette section explique comment l'application Système contrôle les animations de démarrage et d'extinction. init_logo_handler.js et sleep_menu.js gèrent ces animations de démarrage et d'arrêt du système.

+ +

Animations de démarrage

+ +

L'action de l'animation de démarrage n'est en fait pas contenue dans la procédure principale de démarrage, mais il s'agit au contraire d'un hook installé par EventListeners.

+ +

Le code de l'animation de démarrage dans init_logo_handler.js se déroule ainsi :

+ +

Pour dessiner le logo ou l'animation une fois Gecko prêt à afficher quelque chose à l'écran, nous lançons le gestionnaire système approprié après le chargement du DOM, puis le logo est caché après le lancement d'un événement ftudone ou ftuskip. La méthode _appendCarrierPowerOn, contenue dans init_logo_handler.js, montre comment Gaia se prépare à lancer l'animation ou le logo de démarrage en attendant l'événement DOMContentLoaded. Le logoLoader est défini dans logo_loader.js.

+ +
var self = this;
+document.addEventListener('DOMContentLoaded', function() {
+  self.carrierLogo.appendChild(self.logoLoader.element);
+  self._setReady();
+});
+ +

Une fois le logo préparé, le système appelle la méthode _setReady() qui met en place un écouteur en attente de l'événement spécial mozChromeEvent avec le type system-first-paint pour indiquer que le système est prêt à dessiner sur l'écran.

+ +
var elem = this.logoLoader.element;
+  ...
+window.addEventListener('mozChromeEvent', function startVideo(e) {
+  if (e.detail.type == 'system-first-paint') {
+    window.removeEventListener('mozChromeEvent', startVideo);
+    if (elem &amp;&amp; elem.ended === false) {
+      elem.play();
+    }
+  }
+});
+ +

À ce stade, l'élément graphique est animé. Après déclenchement d'un événement ftuopen ou ftuskip, init_logo_handler.js invoque la méthode par défaut handleEvent() qui appelle à son tour la méthode animate() pour faire disparaître l'animation avec comme transition un effet de fondu.

+ +
init: function ilh_init(logoLoader) {
+  window.addEventListener('ftuopen', this);
+  window.addEventListener('ftuskip', this);
+    ...
+},
+
+handleEvent: function ilh_handleEvent() {
+  this.animate();
+},
+ +

Animations d'extinction

+ +

Une fois le système prêt, un appui long sur le bouton marche/arrêt déclenche un événement holdsleep, tel que défini dans hardware_button.js. Ce script gère tous les événements "bouton physique pressé", dont marche/arrêt (veille), accueil, volume haut/bas et ainsi de suite.

+ +
HardwareButtonsSleepState.prototype.enter = function() {
+  this.timer = setTimeout(function() {
+    / * When the user holds Sleep button more than HOLD_INTERVAL. */
+    this.hardwareButtons.publish('holdsleep');
+    this.hardwareButtons.setState('base');
+  }.bind(this), this.hardwareButtons.HOLD_INTERVAL);
+};
+ +

L'animation d'extinction est traitée par sleep_menu.js ; ce script se met en écoute de l'événement holdsleep et affiche le dialogue du menu lorsqu'il est déclenché.

+ +
init: function sm_init() {
+    ...
+  window.addEventListener('holdsleep', this.show.bind(this));
+    ...
+}
+ +

Si l'utilisateur choisit d'éteindre l'appareil via les options de menu redémarrer ou éteindre, la fonction startPowerOff() est déclenchée, puis celle-ci appelle à son tour la fonction LogoLoader() qui a la charge de gérer l'affichage de l'animation d'arrêt.

+ +
handleEvent: function sm_handleEvent(evt) {
+  switch (evt.type) {
+    case 'click':
+      ...
+    this.handler(action);
+    break;
+    ...
+  }
+}
+
+handler: function sm_handler(action) {
+  switch (action) {
+    ...
+    case 'restart':
+      this.startPowerOff(true);
+      break;
+
+    case 'power':
+      this.startPowerOff(false);
+      break;
+    ...
+  }
+}
+ +

Fonctions systèmes

+ +

L'application Système gère de nombreuses fonctions et responsabilités, le fait que certaines d'entre-elles soient de son ressort pourrait vous surprendre. L'application Système s'occupe de la gestion de la barre d'état et de la zone de notifications, du verrouillage SIM, du gestionnaire de mises à jour, du lanceur de l'écran d'accueil, de la gestion des fenêtres des applis web, et d'autres choses encore. Cette section aborde quelques-unes des fonctions desservies les plus importantes.

+ +

Barre d'état et zone de notifications

+ +

La barre d'état et le menu déroulant de Système (Gaia l'appelle la zone de notification ; Android emploie le terme de barre de notification) sont gérés par statusbar.js et utility_tray.js. À l'intérieur du fichier index.html de l'application, les éléments de la barre d'état sont définis dans <div id="statusbar" data-z-index-level="statusbar"> tandis que ceux de la zone de notification résident dans la structure suivante :

+ +
<div id="utility-tray" data-z-index-level="utility-tray">
+  <div id="notifications-container">
+    ...
+  </div>
+</div>
+ +

Il existe certains panneaux spéciaux dans la zone de notification, tels que le gestionnaire de mises à jour, le gestionnaire des appels d'urgence, la notification de surveillance du stockage, les contrôles et notification de lecture de médias, l'état des transferts Bluetooth et l'outil pour changer de méthode de saisie clavier (IME). Les gestionnaires et styles correspondants sont situés dans les répertoires js/ et style/.

+ +

Lanceurs d'applications spéciaux

+ +

L'application Système dispose de trois lanceurs spéciaux qui appellent des applications web séparées lorsque c'est nécessaire :

+ + + +

Écran de verrouillage

+ +

Le principal point d'entrée de l'application Lockscreen est system/js/lockscreen.js. Sur cet écran, l'utilisateur peut procéder au déverrouillage, déclencher l'appareil photo sécurisé et contrôler le lecteur de musiques.

+ +

Appels d'urgence

+ +

Le code du téléphone d'urgence est contenu dans le répertoire gaia/apps/system/emergency-call/. Il s'agit d'une version simplifiée de l'application Téléphone (Dialer) qui permet à l'utilisateur d'y accéder depuis le Dialogue de déverrouillage PIN de la carte SIM pour composer des appels d'urgence vers des services comme la police.

+ +

Interface utilisateur du système

+ +

L'application Système assure la gestion de quasiment toute l'interface utilisateur du système, celle-ci étant constituée essentiellement de dialogues comme ceux de l'avertissement de volume, du déverrouillage PIN SIM, de la diffusion cellulaire et d'éléments d'interface utilisateur affectant le comportement des fenêtres, comme le bouton d'accueil logiciel.

+ +

Niveau z-index

+ +

Avec le fichier index.html de l'application Système, l'attribut data-z-index-level est intégré à de nombreux composants, par exemple :

+ +
<div id="sleep-menu" data-z-index-level="sleep-menu">
+  ...
+</div>
+ +

Les z-index-levels correspondants sont définis dans system/style/zindex.css, par exemple :

+ +
#screen > [data-z-index-level="sleep-menu"] {
+  z-index: 65536;
+}
+
+...
+
+#screen > [data-z-index-level="app"] > .appWindow {
+  z-index: 3;
+}
+ +

Les paramètres z-index sont organisés en fonction de l'ordre dans lequel les éléments sont affichés à l'écran — les éléments qui doivent apparaître au-dessus dans la hiérarchie visuelle se voient attribués un nombre plus élevé. C'est de cette manière que l'application Système traite à un niveau basique la gestion des fenêtres.

+ +

Le bouton d'accueil logiciel

+ +

Le bouton d'accueil logiciel est une alternative au bouton d'accueil, automatiquement activé sur les appareils dépourvus de bouton d'accueil matériel, e.g. Nexus 4. Pour contrôler son apparence, Gecko fournit une caractéristique média propriétaire appelée -moz-physical-home-button qui peut être utilisée dans une requête média afin d'appliquer des styles basés sur la présence d'un bouton d'accueil matériel. Le gestionnaire de fenêtres alloue si nécessaire un certain espace d'écran pour le bouton d'accueil logiciel.

+ +

Vous verrez ceci dans system/style/window.css (et dans beaucoup d'autres fichiers de styles systèmes) :

+ +
@media not all and (-moz-physical-home-button) {
+  #screen:not(.software-button-disabled) > #windows > .appWindow {
+    bottom: 5rem;
+  }
+ }
+ +

Geste de retour à l'accueil (mouvement du bas vers le haut de l'écran)

+ +

Le geste tactile de retour à l'accueil est une autre alternative au bouton d'accueil matériel ; il peut être activé dans les Paramètres développeurs, et le code qui le contrôle se trouve dans system/js/home_gesture.js. Le geste consiste en un glissement à partir du bas de l'écran, et peut être utilisé pour fermer des applications, par exemple.

+ +

Ce geste est automatiquement activé sur les tablettes Firefox OS. Le seuil défini dans gaia/shared/js/screen_layout.js est utilisé pour détecter si l'appareil est une tablette ou non.

+ +

Dialogue d'avertissement du volume

+ +

Le code qui contrôle le dialogue d'avertissement de volume se situe dans system/js/sound_manager.js. Ce dialogue apparaîtra quand toutes les conditions suivantes seront remplies :

+ + + +

Dialogue de déverrouillage PIN de la carte SIM

+ +

Le code qui contrôle le dialogue de déverrouillage PIN de la carte SIM est situé dans system/js/simcard_dialog.js — cette boîte de dialogue s'affiche quand l'option de verrouillage par code est activée, l'écran de verrouillage étant affiché. L'application ouvrante doit également avoir les permissions de téléphonie précisées dans son fichier manifest.webapp (ce qui est le cas de l'application Système).

+ +
+

Note : la boîte de dialogue de déverrouillage PIN de la carte SIM n'est pas affichée tant que le téléphone est en mode Avion.

+
+ +

 

diff --git a/files/fr/archive/b2g_os/platform/gaia/gaia_apps/video/index.html b/files/fr/archive/b2g_os/platform/gaia/gaia_apps/video/index.html new file mode 100644 index 0000000000..5d05ecdbcb --- /dev/null +++ b/files/fr/archive/b2g_os/platform/gaia/gaia_apps/video/index.html @@ -0,0 +1,30 @@ +--- +title: Application Gaia Vidéo +slug: Archive/B2G_OS/Platform/Gaia/Gaia_apps/Video +tags: + - Apps + - Gaia + - Vidéo(3) +translation_of: Archive/B2G_OS/Platform/Gaia/Gaia_apps/Video +--- +
+

L'application Vidéo est un lecteur de vidéos simple qui vous permet de lire les vidéos enregistrées dans l'espace de stockage des médias de votre appareil Firefox OS.

+
+ +

video app screenshot with single video shown called ha ha size 13mb, 4 minutes long, mp4

+ +

Utilisation basique

+ +

Par défaut, lorsque vous ouvrez l'application Vidéo, vous obtenez un message vous informant qu'il n'y a aucune vidéo à lire et que vous devez donc en charger. Cela peut être fait soit en enregistrant une vidéo avec l'application Photo, soit en connectant le stockage de l'appareil en tant que lecteur sur un ordinateur et en copiant des fichiers dessus. Deux boutons sont présents en bas de l'application : celui de gauche permet d'enregistrer de nouvelles vidéos ou de prendre des photos, et celui de droite vous envoie vers la galerie où vous pouvez les visualiser.
+
+ Pour copier les fichiers dessus en utilisant un ordinateur, assurez-vous d'avoir activé “Stockage USB”   (Paramètres > Stockage des médias > Stockage USB). S'il n'existe encore aucun répertoire “Videos”, créez-le avec ce nom exact.
+
+ Vous pouvez changer l'endroit où sont stockées les vidéos en modifiant l'emplacement par défaut des médias (dans Paramètres > Stockage des médias) : soit “Carte SD”, soit "Interne".

+ +
+

Remarque : Si vous rencontrez des problèmes pour lire des vidéos sur Firefox OS, il faut que vous sachiez deux choses. Tout d'abord, certaines versions de Firefox OS ignorent les fichiers vidéos s'ils sont trop lourds - cela devrait être corrigé dans une prochaine version. Deuxième point, Firefox OS peut lire la plupart des formats vidéos existants les plus répandus, mais pas tous. Vous pouvez vérifiez lesquels dans notre article sur les formats de médias pris en charge.

+
+ +

Modification de l'application Vidéo

+ +

TBD

diff --git a/files/fr/archive/b2g_os/platform/gaia/hacking/index.html b/files/fr/archive/b2g_os/platform/gaia/hacking/index.html new file mode 100644 index 0000000000..3dc1de05bf --- /dev/null +++ b/files/fr/archive/b2g_os/platform/gaia/hacking/index.html @@ -0,0 +1,126 @@ +--- +title: Hacking Gaia +slug: Archive/B2G_OS/Platform/Gaia/Hacking +translation_of: Firefox_OS/Developing_Gaia +--- +
+

This page is targeted at Gaia developers. If you're looking for information about how to build and run Firefox OS, you should consult the Building and installing Firefox OS page instead.

+
+

Gaia est une collection d' applications Web qui constituent le front end de Firefox OS. Tout ce que vous voyez à l'écran dans Firefox OS est construit en utilisant les technologies Web ouvertes. Cela comprend l'écran d'accueil et toutes les applications par défaut.

+

Obtenir les sources

+

Pour obtenir les sources de Gaia, fork us on GitHub puis clonez votre fork en utilisant git.

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

Lancer Gaia

+

Vous pouvez lancer Gaia sur votre ordinateur, dans Firefox, ou sur un téléphone compatible.

+

Le bureau B2G

+

B2G Desktop est une version bureau exécutable de l'application utilisée sur les appareils Firefox OS que vous pouvez utiliser pour exécuter Gaia sur votre ordinateur de bureau.

+

Vous pouvez télécharger une version expérimentale de B2G à partir d'ici. En fonction de la version que vous voulez, vous pourriez vouloir une version différente de test-mozilla-b2g18. Il y a des versions pour Linux (32 bit et 64 bit), Mac OS X et Windows.

+

Les versions expérimentales sont fournies avec une version récente de Gaia. Quand vous avez téléchargé l'archive, vous avez juste à l'extraire dans un dossier et à lancer le programme b2g depuis l'archive.

+
$ cd b2g
+$ ./b2g
+

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

+
$ cd /path/to/gaia
+$ DEBUG=1 DESKTOP=0 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. You can find the path to the profile directory by taking a look at last line of output after running the above command, which should look like:

+
Profile Ready: please run [b2g|firefox] -profile /path/to/gaia/profile
+

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

+
$ ./b2g /path/to/gaia/profile
+

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

+

Using Gaia in Firefox

+

It's also possible to run Gaia inside of Firefox. This gives you the advantages of having a rapid development cycle, as well as standard web development tools and debuggers. See Using Gaia in Firefox for details on how to do this.

+

Using Gaia on a device

+

If you have a compatible mobile device you can also run Gaia by flashing it with Firefox OS. See Building and installing Firefox OS for details on how to do this. We also have documentation for how to test Firefox OS.

+

Unit tests

+

See Gaia unit tests for documentation about how to create and run 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).

+

Contributing to Gaia

+

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 basics

+ +

Additional rules

+

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 "Bug XXXXX - Fix the broken Gaia and save the world"
+

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, attach the pull request to the bug in Bugzilla by 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 (very important - otherwise your bug will not likely be seem by anyone). The Github tweaks for bugzilla extension on AMO can help automate this process by automatically creating the attachment and adding it to the bug; you will still need to set the review flag on Bugzilla.

+

The reviewer may ask you to make some changes; you may need to amend the original commit and force push it to the original branch/pull request. 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, so your contribution can be tracked easily.

+

The person who merge the commit (usually the reviewer) would add a r= flag in the comment of the merge commit.

+

Make options

+

There are many undocumented nor unsupported environment variable presists in the Makefile. Do not depend on them as they may be removed in the future.

+

Default

+
make
+

Make a profile with packaged apps, lunachable by B2G Desktop and can be pushed to device.

+

Debug make

+
DEBUG=1 make
+

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. Launch the profile with the latest Firefox Nightly will also give you nice B2G specific panels on the Firefox Developer Tools.

+

Push to device

+
make install-gaia
+
+make reset-gaia
+

With adb (Android Debug Bridge) setup, these make targets will push Gaia to the device. reset-gaia will purge the profile and all other webapps before pushing the new Gaia copy.

+

Selective build

+
APP=system make
+
+APP=system make install-gaia
+

With a profile already exists, APP allow you to specify which app to re-package, instead of re-pack and re-push all the Gaia apps.

+

High resolution image assets

+
GAIA_DEV_PIXELS_PER_PX=1.5 make
+

When packaging the app, replace images with their *@1.5x.(gif|jpg|png) ones if such image exists.

+

Gaia is currently targetting HBGA (320x240), qHD (540×960) and WVGA (480×800) only; use GAIA_DEV_PIXELS_PER_PX to make sure the images looks sharp on qHD and WVGA devices. see A pixel is not a pixel for more information about device pixels per css pixels.

+

Script compression and optimization

+
GAIA_OPTIMIZE=1 make
+

Concate and optimize build-in app's javascript to improve load time.

+

Preference shortcuts

+
NOFTU=1
+
+

Disable First time user guide.

+
REMOTE_DEBUGGER=1
+

Enable debug with adb tool

+
DEVICE_DEBUG=1
+

While in OS version > 1.2, specify this param when you want debug FirefoxOS webapp with App Manager

+

Distribution and market customization build

+
GAIA_DISTRIBUTION_DIR=./dir
+

Read Customization Overview for detail.

+

Contacting the Team

+ diff --git a/files/fr/archive/b2g_os/platform/gaia/index.html b/files/fr/archive/b2g_os/platform/gaia/index.html new file mode 100644 index 0000000000..3bf84e87f4 --- /dev/null +++ b/files/fr/archive/b2g_os/platform/gaia/index.html @@ -0,0 +1,83 @@ +--- +title: Gaia +slug: Archive/B2G_OS/Platform/Gaia +tags: + - Gaia + - Mobile + - TopicStub +translation_of: Archive/B2G_OS/Platform/Gaia +--- +

Gaia est l'interface utilisateur de Firefox OS. Tout ce qui est affiché à l'écran une fois que Firefox OS est lancé est produit par la couche Gaia : l'écran de verrouillage, l'écran d'accueil, l'écran du clavier téléphonique, etc. Gaia est entièrement écrit en HTML, CSS et Javascript. Les seules interfaces avec le système d'exploitation sous-jacent et le matériel, se font au travers d'API Web standards, elles-même implémentées par la couche Gecko.

+ +

Grâce à ce design, il est non seulement possible d'utiliser Gaia sur les appareils Firefox OS, mais aussi sur d'autres systèmes d'exploitation et dans d'autres navigateurs web (éventuellement avec des fonctionnalités dégradées en fonction des capacités du navigateur).

+ +

Les applications tierces installées en parallèle de la couche Gaia peuvent être exécutées par Gaia.

+ + + + + + + + +
+

Documentation sur Gaia

+ +
+
Introduction à Gaia
+
Gaia est l'interface utilisateur des appareils Firefox OS ; c'est simplement une application Web qui fonctionne sur la pile logicielle Firefox OS. Ce guide est une introduction de haut niveau à Gaia.
+
Applications Gaia
+
Information sur toutes les applications par défaut disponibles dans la famille Gaia, incluant des conseils sur la façon de les utiliser et de les modifier.
+
Développer Gaia
+
Un guide complet pour contribuer à Gaia : corriger des bugs ou ajouter de nouvelles fonctionnalités.
+
+ +

Voir tous les articles...

+ 		+ + + + +

Ressources

+ + +
+ +
+
+

Rejoignez la communauté Gaia

+ +
+
Choisissez votre méthode préférée pour rejoindre la discussion :
+ + +
+ +
+ +
+
+
+ +

 

diff --git a/files/fr/archive/b2g_os/platform/gaia/introduction_a_gaia/index.html b/files/fr/archive/b2g_os/platform/gaia/introduction_a_gaia/index.html new file mode 100644 index 0000000000..19372bab66 --- /dev/null +++ b/files/fr/archive/b2g_os/platform/gaia/introduction_a_gaia/index.html @@ -0,0 +1,35 @@ +--- +title: Introduction à Gaia +slug: Archive/B2G_OS/Platform/Gaia/Introduction_a_Gaia +translation_of: Archive/B2G_OS/Platform/Gaia/Introduction_to_Gaia +--- +
+

Gaia est l'interface utilisateur pour "Boot to Gecko" (B2G); c'est un ensemble d'applications Web qui s'exécute localement sur un appareil B2G, un émulateur, "desktop build", ou "Firefox build". Tout ce que vous devez savoir afin d'ajouter des applications ou apporter des modifications à Gaia sont des technologies Web telles que JavaScript, HTML, and CSS.

+
+ +

L'écran de verrouillage Gaia

+ +

L'écran de verrouillage montre le réseau de l'opérateur, l'heure et la date, et une barre de défilement qui permet à l'utilisateur de déverrouiller le téléphone ou aller directement à la caméra pour prendre une photo. Si l'utilisateur a un code de verrouillage, l'écran affiche également une interface de saisie de mot de passe.

+ +

+ +

Notez que sur certains appareils le mot de passe est activée par défaut; dans ce cas, le code PIN par défaut pour déverrouiller l'appareil est "0000". Cette fonction sera probablement modifiée au fil du temps et étoffé.

+ +

L'interface par défaut Gaia

+ +

L'interface par défaut de Gaia, comme on le voit ici, est similaire à ce que vous voyez sur la plupart des smartphones du marché.

+ +

+ +

Cette copie d'écran est évidemment une version préliminaire du système d'exploitation, avec des icône placés dans un espace réservé (et quelques applications de test). La barre d'état en haut indique le réseau sur lequel le téléphone est connecté (ou "Pas de carte SIM" pour un dispositif sans réseau), la force du signal réseau, la force du signal WiFi, le niveau de la batterie et l'heure.

+ +

La zone centrale de l'écran affiche les icônes des applications; on peux glisser les pages de gauche et de droite. Vous pouvez en savoir plus sur la suite d'applications fournis par défaut avec Gaia sur notre page Gaia apps.

+ +

Au bas de l'écran ce trouve un dock pouvant accueillir jusqu'à sept de vos applications les plus couramment utilisées. Vous pouvez glisser et déposer des applications sur le dock de la zone centrale.

+ +

Voir aussi

+ + diff --git "a/files/fr/archive/b2g_os/platform/gestion_de_la_m\303\251moire_dans_firefox_os/index.html" "b/files/fr/archive/b2g_os/platform/gestion_de_la_m\303\251moire_dans_firefox_os/index.html" new file mode 100644 index 0000000000..b7cf7222bc --- /dev/null +++ "b/files/fr/archive/b2g_os/platform/gestion_de_la_m\303\251moire_dans_firefox_os/index.html" @@ -0,0 +1,74 @@ +--- +title: Gestion de la mémoire dans Firefox OS +slug: Archive/B2G_OS/Platform/Gestion_de_la_mémoire_dans_Firefox_OS +translation_of: Archive/B2G_OS/Platform/Out_of_memory_management_on_Firefox_OS +--- +
+

Firefox OS fonctionne sur certains appareils sévèrement limités en mémoire, et il est facile pour les applications d'épuiser la mémoire disponible sur de tels systèmes. Quand un processus épuise la mémoire disponible sur le système, le noyau doit "tuer" d'autres processus afin de libérer de la mémoire. Cet article explique comment low memory killer and low memory notifications travaillent - les deux systèmes sur le dispositif qui contrôlent ce processus sont tués pour maintenir le système principale en cours d'exécution quand il est à court de mémoire.

+
+ +

Une opération Firefox OS implique plusieurs processus - un "processus principal" exécutant des services de base du système, et potentiellement de nombreux "processus enfants". En général chaque application fonctionne dans son propre processus enfant. Parce que dans les applications de l'environnement Firefox OS sont rarement fermée par l'utilisateur,  le système gère automatiquement leur durée de vie pour faire place à de nouvelles applications ou des applications existantes nécessitant de la mémoire supplémentaire.

+ +

Deux sous-systèmes sont utilisés pour gérer ceci: le Low memory killer (LMK) et le Low memory notifications.

+ +

Low memory killer

+ +

Le LMK est un sous-système du noyau Android qui tue automatiquement les processus pour faire place à des demandes de mémoire. Afin de choisir quel processus est tué d'abord pour libérer de la mémoire, chaque processus est assignée une priorité par l'intermédiaire des fichiers /proc/<pid>/oom_adj ou /proc/<pid>/oom_score_adj. La priorité d'un processus est connu comme son score d'ajustement , ou oom_adj.  Les plus petites valeurs de oom_adj correspondent à des processus de priorité supérieure.

+ +

En général, plus le score d'ajustement est élévé, plus le processus est susceptible d'être tué. Le LMK offre de multiples niveaux, chacun correspondant à une certaine quantité de mémoire libre et un score d'ajustement minimum. Chaque fois que la quantité de mémoire libre dans le système tombe en dessous d'un certain seuil, tous les processus avec un score d'ajustement plus élevées que le minimum spécifié pour ce niveau sont admissibles à être tué. Le LMK commencera à tuer ces processus, les plus grandes d'abord, et continuera jusqu'à ce qu'il a libéré suffisamment de mémoire pour aller au-dessus de ce seuil.

+ +
+

Remarque: Quand une application de fond est tué par le LMK, elle est mise dans le gestionnaire de tâches / à travers des balayages de bord comme une "app zombie": la prochaine fois que vous accédez à cette application, elle sera relancé. Le nombre maximal d'applications qui peuvent être maintenu dans cet état est actuellement de 10.

+
+ +
+

Remarque: Le processus tué lorsque l'appareil manque de mémoire est pas nécessairement celui qui "a causé" la condition out-of-memory.

+
+ +

Les priorités d'un processus

+ +

Dans Firefox OS les applications sont tués dans la politique d'ordre de priorité suivant, qui est appliquée en donnant à chaque demande un niveau de priorité et en associant un score d'ajustement OOM à ces niveaux (les valeurs actuelles sont définies dans prefs):

+ +
    +
  1. Les premières applications à être tués seront les applications d'arrière-plan, en commençant par le moins récemment utilisé.
    2. +
  2. Les applications de fond qui sont perceptibles par l'utilisateur sont tués ensuite (par exemple, un lecteur de musique lecture audio en arrière-plan ou une application tenant une haute priorité ou cpu wakelock et ayant un gestionnaire enregistré pour les messages du système.)
    3. +
  3. Si l'application du clavier est en marche, elle sera tué ensuite.
    4. +
  4. Les applications de premier plan seront tués ensuite.
    5. +
  5. Enfin, les applications de premier plan qui ont demandé à haute priorité ou cpu wakelocks sont les derniers à se faire tuer.
    6. +
+ +
+

Remarque: La plupart des processus enfants s'exécutent avec oom_adj égale à 2 pendant qu'ils sont au premier plan. Les processus enfants à l'arrière-plan s'exécutent avec oom_adj entre 3 et 6 (inclus). Exactement la valeur de oom_adj qu'un processus enfant a alors en arrière-plan dépend d'un certain nombre de facteurs, à savoir que ce soit le lecteur de musique, que ce soit l'application du clavier, etc.

+
+ +

Il ya quelques exceptions à ces règles:

+ + + +

Low memory notifications

+ +

Le second mécanisme que nous utilisons pour libérer de la mémoire est low memory notifications. Le LMK fournit un seuil spécial qui, lorsqu'on les croise, peut envoyer des notifications à l'espace utilisateur qui exécute faible sur la mémoire. La fois l'application du système et des applications régulières d'utilisateurs attendent en permanence pour cette condition et vont réagir sur elle par l'envoi d'un événement mémoire pression par l'intermédiaire du service d'observateur. Cet événement est visible uniquement à code C ++ et JS chrome et non pas directement par une application. Grâce à la base de code Gecko nous utilisons cet événement pour libérer autant de mémoire que nous pouvons - normalement en purgeant les caches internes (images, DNS, sqlite, etc.), l'abandon des actifs qui peuvent être recréées (contexts WebGL par exemple) et l'exécution du garbage collector et collecteur de cycles.
+
+ Lorsqu'il rencontre une condition de mémoire faible the premier événement memory-pressure qui sera envoyé aura the low-memory payload. Si après un temps prédéfini (5s) nous sommes toujours dans une condition de mémoire faible un autre événement memory-pressure sera tiré, mais cette fois avec le low-memory-ongoing payload. Ce payload est utilisé lorsque nous continuons à connaître des conditions de mémoire faible et nous voulons vider les caches et faire d'autres formes bon marché de la mémoire minimisation, mais nous savons que les approches main lourde comme un GC est peu probable de réussir.

+ +

Comment le LMK et le low memory notifications travaillent ensemble

+ +

Actuellement, le seuil de memoire faible est réglé au dessus du niveau de LMK pour les applications en arrière. Donc l'action agrégée de la LMK et du low memory notifications est la suivante lorsqu'un périphérique est à court de mémoire:

+ +
    +
  1. Tuer des applications d'arrière-plan dans l'ordre least-recently-used.
    2. +
  2. Si nous ne libérons assez de mémoire, envoyez des événements memory-pressure à toutes les applications restantes.
    3. +
  3. Si la condition persiste, renvoyer un événement memory-pressure chaque 5 secondes, mais les marquer comme en cours de sorte que le GC / CC ne réagit pas à eux.
    4. +
  4. Tuer des applications de fond perceptibles ou hautement prioritaires.
    5. +
  5. Tuez l'application du clavier, si elle est en cours d'exécution.
    6. +
  6. Tuer des applications de premier plan.
    7. +
  7. Tuer des applications de premier plan de haute priorité.
    8. +
  8. Tuer le processus préallouée.
    9. +
diff --git a/files/fr/archive/b2g_os/platform/gonk/index.html b/files/fr/archive/b2g_os/platform/gonk/index.html new file mode 100644 index 0000000000..1e983c5d12 --- /dev/null +++ b/files/fr/archive/b2g_os/platform/gonk/index.html @@ -0,0 +1,102 @@ +--- +title: Gonk +slug: Archive/B2G_OS/Platform/Gonk +tags: + - Firefox OS + - Gonk +translation_of: Archive/B2G_OS/Platform/Gonk +--- +
+

Gonk est le système d'exploitation bas niveau de la plate-forme Firefox OS, comprenant un noyau Linux basé sur l'Android Open Source Project (AOSP) et la couche d'abstraction matérielle (HAL) userspace. Cet article a pour but d'expliquer de quoi est fait Gonk ; pour plus d'informations sur l'ensemble de l'architecture Firefox OS et comment Gonk s'y intègre, lisez notre guide l'architecture Firefox OS.

+
+ +

Vue d'ensemble de Gonk

+ +

Gonk constitue le noyau de Firefox OS, qui sert d'interface entre Gecko et la couche matérielle. Gonk contrôle le matériel et expose ses fonctionnalités aux WebAPI implémentées dans Gecko. Gonk peut être vu comme la « boîte noire » qui fait le travail complexe et minutieux de contrôler l'appareil en exécutant les requêtes sur la couche matérielle.

+ +

Gonk est tout simplement une distribution Linux incluant des composants d'Android (comme le GPS ou l'appareil photo) ainsi que des projets libres communs ajoutés par Mozilla (comme libusb ou bluez) afin de pouvoir l'intégrer facilement à toutes les couches de l'architecture de Firefox OS. Cette conception facilite, pour les OEM, le portage d'éléments logiciels développés pour Android (pilote, firmware, service daemon, etc.), dans le but de les déployer sur des smartphones Firefox OS.

+ +

Dans les sources de Gecko, il y a un dossier b2g/ qui contient le Gonk Port, qui déverrouille les capacités matérielles mobiles pour le Web. Cela consiste en un noyau Linux, HAL, et d'autres bibliothèques spécifiques aux OEM. Plusieurs des bibliothèques Gonk sont des projets open-source communs : libusb, bluez, et ainsi de suite. Certaines autres parties de la HAL sont partagées avec le projet Android : GPS, appareil photo et autres.

+ +

Gonk est une couche de portage de l'appareil : un adaptateur entre le matériel et Gecko. Gonk est une distribution Linux relativement simple qui peut être considérée comme une association de Gecko Port et des couches de portage Gecko. Gonk est ainsi une cible de portage de Gecko, tout comme il y a un portage de Gecko pour OS X, Windows et Android.

+ +
+

Note : Comme les différents matériels mobiles peuvent avoir différents chipsets et autres spécifications matérielles, les appareils peuvent contenir différentes distributions de Gonk.

+
+ +

Comme le projet Firefox OS a le contrôle total sur Gonk, nous pouvons exposer des interfaces à Gecko qui ne pourraient pas être exposées à d'autres systèmes d'exploitation. Par exemple, Gecko a un accès direct à la couche de téléphonie complète et au buffer de trame d'affichage sur Gonk.

+ +

Architecture de Gonk

+ +

Chaque modèle de téléphone possède son propre ensemble de composants Gonk, parmi les bibliothèques du système, pilotes matériels et firmwares nécessaires pour le faire fonctionner. Ces composants sont déterminés par l'OEM en collaboration avec le fabricant du chipset et l'ODM. Le schéma suivant représente un exemple d'implémentation de Gonk :

+ +

+ +

Cet exemple montre les composants principaux suivants (ce qui représente uniquement un sous-ensemble des composants que l'on peut retrouver dans n'importe quelle implémentation de Gonk).

+ + + +

Gonk s'occupe aussi de démarrer, gérer et arrêter le processus b2g, autrement dit Gecko, dans Firefox OS. Le processus b2g agit comme un client des services daemons de Gonk qui communiquent directement avec le matériel et exposent à Gecko les fonctionnalités matérielles du téléphone. Gecko communique avec ces daemons via une communication inter-process (IPC). Ces composants s'échangent des commandes et des protocoles pour demander et proposer leurs services.

+ +
+

Note : Pour plus d'informations concernant l'architecture de Gonk, voir le guide sur l'architecture de Firefox OS.

+
+ +

Portage de Gonk

+ +

Parce que Firefox OS est basé sur le noyau Android, le portage sous Firefox OS de pilotes matériels, de firmwares, de services daemons, ou d'autres composants Android ne nécessite habituellement qu'un minimum d'efforts. Si un composant spécifique (par exemple un RIL particulier ou un nouveau daemon) est nécessaire, ou si une modification doit être apportée à la conception d'un ODM, alors un supplément de travail d'intégration et de test peut être requis.

+ +

Dans b2g, les clients communiquent avec les services daemons via une communication inter-process (IPC). Le client instancie une socket de connexion vers le service daemon, y envoie sa requête (en respectant le protocole du serveur de requête), reçoit la réponse et ferme la connexion. Les OEM sont responsables de la conception et de l'implémentation de ces communications inter-processus entre clients et serveurs.

+ +
+

Note : Pour plus d'informations concernant le fonctionnement du processus de portage, voir Porter Firefox OS.

+
+ +

Comment Mozilla participe au portage de Gonk avec les OEM et fabricants de téléphones

+ +

Chaque implémentation de Gonk est le résultat d'une collaboration entre Mozilla, les OEM, et les fabricants associés (ODM, fabricant chipset).

+ +

Mozilla fournit les dépôts des sources et les fichiers nécessaires pour la prise en charge de Gonk dans ses distributions Firefox OS. Les dépôts des sources contiennent le noyau Linux de base (avec uniquement de légères modifications) et les personnalisations de Gecko (« hooks »).

+ +

Les OEM sont responsables de la compilation, du test, de la certification ainsi que de la distribution de l'image système Firefox OS pour un modèle d'appareil donné. Pour la partie Gonk de l'image système, les OEM sont responsables de la bonne intégration entre les appels aux API Web et les fonctionnalités matérielles. Le type et l'ampleur des efforts requis est hautement dépendant des choix des composants matériels du téléphone.

+ +

Composants d'un appareil

+ +

Les OEM collaborent avec les fabricants de chipset et les ODM pour fournir tous les composants spécifiques à l'appareil qui sont nécessaires à son bon fonctionnement. Par exemple, un fabricant du composant Wi-Fi doit fournir le chipset et le logiciel associé. Les composants peuvent inclure :

+ + + +

Intégration de Gonk et Gecko

+ +

Les OEM doivent s'assurer que les fonctionnalités matérielles de l'appareil sont correctement et complètement exposées aux API Web implémentées dans Gecko. Ceci nécessite de :

+ + + +

Code source de Gonk

+ +

Le principal dépôt B2G sur Github contient les portages officiels prenant en charge Gonk pour divers appareils, vous pouvez donc le considérer comme le dépôt de Gonk. La liste des appareils pris en charge est disponible dans B2G/config.sh.

+ +

La plupart du travail quotidien effectué sur Gonk implique de porter le système sur différentes cartes et de s'assurer que Gecko fonctionne correctement sur différents appareils.

+ +
+
+ +

 

diff --git a/files/fr/archive/b2g_os/platform/index.html b/files/fr/archive/b2g_os/platform/index.html new file mode 100644 index 0000000000..5af7b36d25 --- /dev/null +++ b/files/fr/archive/b2g_os/platform/index.html @@ -0,0 +1,92 @@ +--- +title: La plate-forme Firefox OS +slug: Archive/B2G_OS/Platform +translation_of: Archive/B2G_OS/Platform +--- +

La plate-forme Firefox OS regroupe de nombreux composants. Même si vous n'avez pas besoin de comprendre son architecture pour développer des applications Firefox OS, la documentation suivante pourra vous intéresser, que vous travailliez au développement ou au portage de la plate-forme — ou que vous soyez simplement curieux.

+ + + + + + + + +
+

Documentation à propos de la plate-forme Firefox OS

+ +
+
Introduction à Firefox OS
+
Introduction à la nature et au fonctionnement de Firefox OS.
+
Compiler et installer Firefox OS
+
Un guide pour compiler Firefox OS et l'installer sur votre appareil compatible. Ce guide couvre également la compilation de l'émulateur Firefox OS, pour faire fonctionner Firefox OS sur un ordinateur.
+
Gaia
+
Documentation à propos de Gaia, l'interface utilisateur des appareils Firefox OS ; c'est une application web fonctionnant au dessus de la couche logicielle de Firefox OS.
+
Gonk
+
Documentation à propos de Gonk, +
+
la couche de système d'exploitation sous Gaia. Il s'agit d'un noyau Linux et d'une couche d'abstraction matérielle avec laquelle Gecko communique.
+
+
+
Gecko
+
+
+
Gecko est la couche de Firefox OS qui fournit les mêmes standards d'applications web ouverts utilisés par Firefox Desktop et Thunderbird, ainsi que par de nombreuses autres applications.
+
+
+
Graphique des fonctionnalités
+
+
+
Un graphique des fonctionnalités disponibles dans les différents types de builds de Firefox OS.
+
+
+
Vue d'ensemble de l'architecture de Firefox OS
+
Une vue d'ensemble de la structure interne de Firefox OS ; ceci est principalement orienté pour les développeurs de la plate-forme et les gens qui travaillent sur le portage de Firefox OS.
+
Firefox OS apps architecture
+
Une vue d'ensemble du modèle d'application sur Firefox OS.
+
Tester Firefox OS
+
Un guide pour tester Firefox OS, incluant des informations sur la création de tests automatisés.
+
Portage de Firefox OS
+
Informations à propos du portage de Firefox OS sur de nouveaux appareils.
+
Personnalisation avec le fichier .userconfig
+
Comment personnaliser la compilation et l'exécution de Firefox OS en modifiant le fichier .userconfig.
+
+ +

Tous les guides...

+ 		+

Obtenir de l'aide de la communauté

+ +

Si vous travaillez avec Firefox OS ou développez des applications que vous aimeriez voir fonctionner sur des appareils Firefox OS, des ressources communautaires sont à votre disposition !

+ + + +

N'oubliez pas la netiquette pour poser vos questions…

+ + + + + +

Ressources

+ + +
+ +

 

diff --git a/files/fr/archive/b2g_os/platform/settings_list/index.html b/files/fr/archive/b2g_os/platform/settings_list/index.html new file mode 100644 index 0000000000..e20105cd79 --- /dev/null +++ b/files/fr/archive/b2g_os/platform/settings_list/index.html @@ -0,0 +1,717 @@ +--- +title: Firefox OS settings list +slug: Archive/B2G_OS/Platform/Settings_list +tags: + - API + - B2G + - Firefox OS + - Paramètres + - Reference + - Référence(2) + - WebAPI +translation_of: Archive/B2G_OS/Platform/Settings_list +--- +
+

Firefox OS offre un certain nombre de paramètres pour configurer l'appareil et ses fonctionnalités intégrées. Ces paramètres sont accessibles par les applications certifiées à l'aide de l'API Settings.

+
+
+

Note: A cause des différentes fonctionnalités fournies par les différents appareils et les différentes versions de Firefox OS, cette liste peut être exactement conforme ou non à ce qui est disponible sur chaque appareil.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Nom du paramètreTypeValeur par défaut
accessibility.invertBooléenfalse
accessibility.screenreaderBooléenfalse
alarm.enabledBooléenfalse
app.reportCrashesChaîneask
app.update.intervalNombre86400
audio.volume.alarmNombre15
audio.volume.bt_scoNombre15
audio.volume.dtmfNombre15
audio.volume.contentNombre15
audio.volume.notificationNombre15
audio.volume.ttsNombre15
audio.volume.telephonyNombre5
bluetooth.enabledBooléenfalse
bluetooth.debugging.enabledBooléenfalse
camera.shutter.enabledBooléentrue
clear.remote-windows.dataBooléenfalse
debug.grid.enabledBooléenfalse
debug.oop.disabledBooléenfalse
debug.fps.enabledBooléenfalse
debug.ttl.enabledBooléenfalse
debug.log-animations.enabledBooléenfalse
debug.paint-flashing.enabledBooléenfalse
debug.peformancedata.sharedBooléenfalse
deviceinfo.firmware_revisionChaîne 
deviceinfo.hardwareChaîne 
deviceinfo.osChaîne 
deviceinfo.platform_build_idChaîne 
deviceinfo.platform_versionChaîne 
deviceinfo.softwareChaîne 
deviceinfo.update_channelChaîne 
gaia.system.checkForUpdatesBooléenfalse
general.useragent.updates.enabledBooléentrue
geolocation.enabledBooléentrue
keyboard.layouts.englishBooléentrue
keyboard.layouts.dvorakBooléenfalse
keyboard.layouts.otherlatinsBooléenfalse
keyboard.layouts.cyrillicBooléenfalse
keyboard.layouts.arabicBooléenfalse
keyboard.layouts.hebrewBooléenfalse
keyboard.layouts.zhuyinBooléenfalse
keyboard.layouts.pinyinBooléenfalse
keyboard.layouts.greekBooléenfalse
keyboard.layouts.japaneseBooléenfalse
keyboard.layouts.polishBooléenfalse
keyboard.layouts.portugueseBooléenfalse
keyboard.layouts.spanishBooléenfalse
keyboard.vibrationBooléenfalse
keyboard.clicksoundBooléenfalse
keyboard.autocorrectBooléentrue
keyboard.wordsuggestionBooléentrue
keyboard.currentChaîneen
language.currentChaîneen-US
lockscreen.passcode-lock.codeChaîne0000
lockscreen.passcode-lock.timeoutNombre0
lockscreen.passcode-lock.enabledBooléenfalse
lockscreen.notifications-preview.enabledBooléentrue
lockscreen.enabledBooléentrue
lockscreen.lockedBooléentrue
lockscreen.unlock-sound.enabledBooléenfalse
mail.sent-sound.enabledBooléentrue
message.sent-sound.enabledBooléentrue
operatorvariant.mccChaîne0
operatorvariant.mncChaîne0
ril.iccInfo.mbdnChaîne 
ril.sms.strict7BitEncoding.enabledBooléenfalse
ril.cellbroadcast.searchlistChaîne 
debug.console.enabledBooléenfalse
phone.ring.keypadBooléentrue
powersave.enabledBooléenfalse
powersave.thresholdNombre0
privacy.donottrackheader.enabledBooléenfalse
ril.callwaiting.enabled  
ril.cf.enabledBooléenfalse
ril.data.enabledBooléenfalse
ril.data.apnChaîne 
ril.data.carrierChaîne 
ril.data.defaultServiceIdNombre0
ril.data.passwdChaîne 
ril.data.httpProxyHostChaîne 
ril.data.httpProxyPortNombre0
ril.data.mmscChaîne 
ril.data.mmsproxyChaîne 
ril.data.mmsportNombre0
ril.data.roaming_enabledBooléenfalse
ril.data.userChaîne 
ril.mms.apnChaîne 
ril.mms.carrierChaîne 
ril.mms.httpProxyHostChaîne 
ril.mms.httpProxyPortChaîne 
ril.mms.mmscChaîne 
ril.mms.mmsportChaîne 
ril.mms.mmsproxyChaîne 
ril.mms.passwdChaîne 
ril.mms.userChaîne 
ril.radio.preferredNetworkTypeChaîne 
ril.radio.disabledBooléenfalse
ril.supl.apnChaîne 
ril.supl.carrierChaîne 
ril.supl.httpProxyHostChaîne 
ril.supl.httpProxyPortChaîne 
ril.supl.passwdChaîne 
ril.supl.userChaîne 
ril.sms.strict7BitEncoding.enabledBooléenfalse
ril.sms.defaultServiceIdNombre0
ril.telephony.defaultServiceIdNombre0
ring.enabledBooléentrue
screen.automatic-brightnessBooléentrue
screen.brightnessNombre1
screen.timeoutNombre60
tethering.usb.enabledBooléenfalse
tethering.usb.ipChaîne192.168.0.1
tethering.usb.prefixChaîne24
tethering.usb.dhcpserver.startipChaîne192.168.0.10
tethering.usb.dhcpserver.endipChaîne192.168.0.30
tethering.wifi.enabledBooléenfalse
tethering.wifi.ipChaîne192.168.1.1
tethering.wifi.prefixChaîne24
tethering.wifi.dhcpserver.startipChaîne192.168.1.10
tethering.wifi.dhcpserver.endipChaîne192.168.1.30
tethering.wifi.ssidChaîneFirefoxHotspot
tethering.wifi.security.typeChaîneopen
tethering.wifi.security.passwordChaîne1234567890
tethering.wifi.connectedClientsNombre0
tethering.usb.connectedClientsNombre0
time.nitz.automatic-update.enabledBooléentrue
time.timezone  
ums.enabledBooléenfalse
ums.modeNombre0
vibration.enabledBooléentrue
wifi.enabledBooléentrue
wifi.screen_off_timeoutNombre600000
wifi.disabled_by_wakelockBooléenfalse
wifi.notificationBooléenfalse
wifi.connect_via_settingsBooléenfalse
icc.displayTextTimeoutNombre40000
icc.inputTextTimeoutNombre40000
+

Voir aussi

+ diff --git a/files/fr/archive/b2g_os/platform/support_fonctionnalites/index.html b/files/fr/archive/b2g_os/platform/support_fonctionnalites/index.html new file mode 100644 index 0000000000..8b08ea075e --- /dev/null +++ b/files/fr/archive/b2g_os/platform/support_fonctionnalites/index.html @@ -0,0 +1,160 @@ +--- +title: Support des fonctionnalités +slug: Archive/B2G_OS/Platform/support_fonctionnalites +tags: + - AQ + - B2G + - Firefox OS + - Mobile +translation_of: Archive/B2G_OS/Platform/Feature_support_chart +--- +

+ +

Il existe différents builds de Firefox OS que vous pouvez télécharger ou compiler vous même. Il y a quelques différences entre les fonctionnalités accessibles sur chaque appareil. Le tableau ci-dessous devrait vous aider à comprendre ce qui fonctionne, ou ne fonctionne pas, en fonction des différents builds.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FonctionAppareilÉmulateurOrdinateur
TéléphoneToutSeulement l'interface, pas de réseauSeulement l'interface, pas de réseau
ContactsToutToutTout
SMSToutSeulement l'interface, pas de réseauSeulement l'interface, pas de réseau
CameraToutSeulement l'interface, pas de support de la cameraSeulement l'interface, incertain sur le support de la webcam pour le moment
GallerieToutToutTout
VidéoToutSeulement l'interfaceTout
MusiqueTout Tout
Radio FMToutToutSeulement l'interface
E-mailToutToutTout
CalculetteToutToutTout
NavigateurToutToutTout
MarketplaceToutToutTout
HorlogeToutToutTout
CalendrierToutToutTout
Écran d'accueilToutToutTout
Écran verouilléToutToutTout
ClavierToutToutTout
Gestionnaire de tâcheToutToutTout
Premier lancementTout??
NotificationToutToutTout
Barre d'étatToutCertains états réseaux ne peuvent être testésCertains états réseaux ne peuvent être testés
ParamètresToutToutTout
+ +

 

diff --git a/files/fr/archive/b2g_os/portage/index.html b/files/fr/archive/b2g_os/portage/index.html new file mode 100644 index 0000000000..e463846081 --- /dev/null +++ b/files/fr/archive/b2g_os/portage/index.html @@ -0,0 +1,244 @@ +--- +title: Porter Boot to Gecko +slug: Archive/B2G_OS/Portage +tags: + - B2G + - B2GOS + - Mobile +translation_of: Archive/B2G_OS/Porting_B2G_OS/basics +--- +

+ +

B2G OS utilise un noyau dérivé d'Android, avec par dessus une interface utilisateur basée sur Gecko. Cet article fournit un guide de base sur la façon de porter le système d'exploitation sur de nouveaux appareils.

+ +

Ce guide suppose que vous faite un portage sur un nouvel appareil qui exécute déjà Android; si vous faites un portage vers un autre type d'appareil, le travail va nécessiter davantage d'investissement.

+ +
+

Note : Vous pouvez trouver de l'aide concernant le portage sur le canal IRC #fxos et sur Mozilla Discourse.

+
+ +

Configurer votre système de build

+ +

La première étape consiste à configurer votre système de buid; vous pouvez suivre le guide pré-requis pour compiler B2G OS.

+ +

Créer une sauvegarde locale du système Android d'origine

+ +

Ensuite, vous devez faire une sauvegarde de votre appareil Android avant de commencer à l'atomiser avec vos builds de test de B2G. De plus, certaines parties seront nécessaires pour le processus de build et d'installation. Pour le nom de l'appareil, nous recommandons l'utilisation de "_" au lieu de "-". Voir le bug 1243349 pour les raisons de ce choix. 

+ +
mkdir sauvegarde_de_mon_appareil
+cd sauvegarde_de_mon_appareil
+adb pull /system system
+ +

Cloner les répertoires B2G

+ +

La première étape consiste à cloner le dépôt B2G ainsi que le dépôt contenant les manifestes.

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

Ajouter un nouvel appareil à config.sh

+ +

L'étape suivante consiste à ajouter un nouvel appareil à config.sh dans le dépôt B2G;  vous pouvez utiliser un de ceux qui existent comme modèle. Ceci implique simplement de fournir les instructions permettant de récupérer les bons fichiers pour faire le build.

+ +

Créer un manifeste pour le nouvel appareil

+ +

Mainenant, vous devez ajouter un fichier manifeste pour le nouvel appareil. Utilisez l'un des manifestes existant comme modèle. Vous pouvez utiliser le manifeste hamachi comme référence. Une fois que c'est fait, vous pouvez ajouter et livrer votre nouveau manifeste dans votre dépôt local b2g-manifest :

+ +
git add mon-nouvel-appareil.xml
+git commit
+
+ +

Ensuite, il faudra indiquer au fichier config.sh d'utiliser votre dépôt local b2g-manifest à la place du dépôt officiel. Pour réaliser cela, modifiez la valeur des variables GITREPO et BRANCH dans le fichier config.sh pour qu'elles pointent vers l'emplacement de votre dépôt local et de la branche souhaitée, par exemple :

+ +
GITREPO=${GITREPO:-"file:///home/votrenom/b2g-manifest"}
+BRANCH=${BRANCH:-master}
+ +

Créer une arborescence de configuration pour le nouvel appareil

+ +

Créer une nouvelle arborescence pour le nouvel appareil. Elle doit se trouver dans device/<manufacturer>/<device_id>. Cette arborescence doit inclure au moins :

+ + + +

Ici, le contenu peut grandement différer d'un appareil à l'autre. En particulier, les fichiers BoardConfig.mk et extract-files.sh peuvent différer significativement. Cette partie nécessite pas mal de modifications, de test et de débogage pour déterminer quels blobs binaires doivent être extraits. Pour avoir une meilleure idée de qu'on est supposé trouver ici, jetez un oeil à configuration pour l'appareil hamachi. Rappelez-vous de référencer correctement votre propre arborescence de configuration dans le manifeste aue vous avez créé pour votre nouvel appareil.

+ +
+

Note: Si vous pouvez trouver une référence existante sur CyanogenMod pour votre appareil, ces informations accélèreront le processus de portage. Le forum XDA est un autre bon endroit pour discuter et vérifier des informations.

+
+ +

Reconstruire boot.img

+ +

Une fois que tout cà est fait, vous devez reconstruire l'image de boot. Ce n'est habituellement pas nécessaire pour le noyau lui-même mais pour récupérer les modifications dans init.rc.

+ +

Modifications dans init.rc

+ +

Le init.rc que vous utilisez n'est pas celui fourni par B2G; à la place, vous devez le récupérer depuis votre appareil.

+ +

Les principales choses que vous aurez besoin de modifier sont :

+ +

Importer init.b2g.rc

+ +

Ajouter les lignes suivantes pour importer init.b2g.rc:

+ +
on early-init
+    start ueventd
+    import /init.b2g.rc
+ +

Corriger les permissions

+ +

Corrigez les permissions des fichiers /system/b2g/b2g, /system/b2g/updater et /system/b2g/plugin-container; ceci doit être fait après les lignes qui montent le système de fichier en lecture/écriture:

+ +
chmod 0755 /system/b2g/b2g
+chmod 0755 /system/b2g/updater
+chmod 0755 /system/b2g/plugin-container
+ +

Vous pourriez vouloir commencer en modifiant init.rc provenent du nouvel appareil au lieu d'utiliser le init.rc fourni par le système de build; dans ce cas, vous devez vous rappeler de renseigner TARGET_PROVIDES_INIT_RC dans BoardConfig.mk.

+ +

Noyau pré-compilé vs. compiler le noyau depuis le code source

+ +

Vous pouvez utiliser un noyau pré-compilé ou vous pouvez compiler le noyau à partir du code source. Pour compiler le noyau à partir du code source, ajoutez AndroidKernel.mk et la configuration du noyau dans l'arborescence de configuration de l'appareil.

+ +

Le maguro sur l'ancien système de build est un exemple qui compile le noyau à partir du code source.

+ +

Extraire et modifier une image de boot existante

+ +

Il est possible de récupérer l'image de boot d'un téléphone en extrayant le contenu des devices /dev/mtd/mtd1 ou /dev/mtd/mtd2, le fichier image résultat peut ensuite être facilement récupéré :

+ +
adb shell 'cat /dev/mtd/mtd1 > /sdcard/boot.img'
+adb pull /sdcard/boot.img
+
+ +

Une fois que le fichier de l'image de boot a été obtenu, il peut être décompressé à l'aide d'un utilitaire tel que unmkbootimg. L'outil va extraire à la fois l'image du noyau (zimage) et le disque mémoire (ramdisk initramfs.cpio.gz) et également afficher une commande permettant de re-compiler l'image avec les mêmes paramètres que ceux utilisés pour l'image d'origine, par exemple :

+ +
$ unmkbootimg boot.img
+Kernel size 3872576
+Kernel address 0x208000
+Ramdisk size 265102
+Ramdisk address 0x1500000
+Secondary size 0
+Secondary address 0x1100000
+Kernel tags address 0x200100
+Flash page size 2048
+Board name is ""
+Command line "androidboot.hardware=aphone"
+Extracting kernel to file zImage ...
+Extracting root filesystem to file initramfs.cpio.gz ...
+All done.
+---------------
+To recompile this image, use:
+  mkbootimg --kernel zImage --ramdisk initramfs.cpio.gz --base 0x200000 --cmdline 'androidboot.hardware=aphone' -o new_boot.img
+---------------
+
+ +

Pour modifier le fichier ramdisk, créez un répertoire destination et extrayez-le dedans:

+ +
mkdir initramfs_dir
+cd initramfs_dir
+gunzip -c ../initramfs.cpio.gz | cpio -i
+
+ +

Faîtes toutes les modifications nécessaires (telles que la modification de init.rc) puis recompressez le ramdisk en utilisant mkbootfs et assurez-vous que la version a été compilée avec les outils B2G de l'hôte :

+ +
/path/vers/votre/B2G/out/host/linux-x86/bin/mkbootfs . | gzip > ../newinitramfs.cpio.gz
+
+ +

Enfin, retournez au répertoire de premier niveau et re-compressez l'image de boot en utilisant mkbootimg; assurez-vous également que vous utilisez la version compilée avec loutils de l'autre hôte B2G:

+ +
/path/vers/votre/B2G/out/host/linux-x86/bin/mkbootimg --kernel zImage --ramdisk newinitramfs.cpio.gz --base 0x200000 --cmdline 'androidboot.hardware=aphone' -o newboot.img
+
+ +

Si vous copiez maintenant votre nouvelle image de boot dans out/target/product/$DEVICE/boot.img (où $DEVICE est le nom de votre device), elle sera automatiquement flashée quand flash.sh est appelé. Alternativement, vous pouvez la flasher à la main avec les commandes suivantes :

+ +
adb reboot bootloader
+fastboot flash boot newboot.img
+fastboot reboot
+
+ +

Ajouter le nouvel appareil à flash.sh

+ +

Ajoutez le nouvel appareil à flash.sh; les spécificités sur la façon de faire cela dépendront des outils qui seront utilisés pour flasher le nouvel appareil.

+ +

Configurer, compiler et flasher le nouvel appareil

+ +

Maintenant, vous pouvez essayer de compiler et de flasher votre nouvel appareil:

+ +
ANDROIDFS_DIR=sauvegarde_de_mon_appareil ./config.sh <device_id> '../b2g-manifest/default.xml'
+./build.sh
+./flash.sh
+ +

Test et débogage

+ +

Nous avons besoin d'ajouter certains détails ici; en fait, c'est tout l'article qui pourrait nécessiter de l'aide.

+ +

FAQ

+ +

À venir.

+ +

Voir également

+ + diff --git a/files/fr/archive/b2g_os/porter_firefox_os/b2g_nexus_player/index.html b/files/fr/archive/b2g_os/porter_firefox_os/b2g_nexus_player/index.html new file mode 100644 index 0000000000..9cfa7b3962 --- /dev/null +++ b/files/fr/archive/b2g_os/porter_firefox_os/b2g_nexus_player/index.html @@ -0,0 +1,186 @@ +--- +title: Porter B2G sur le Nexus Player (Lollipop) +slug: Archive/B2G_OS/Porter_Firefox_OS/B2G_Nexus_Player +tags: + - B2G + - B2G OS + - Firefox OS + - Guide + - Nexus + - Nexus Player + - TV + - portage +translation_of: Archive/B2G_OS/Porting_B2G_OS/B2G_Nexus_Player +--- +

+ +

Cet article donne une vue d'ensemble du processus permettant à B2G OS (la version TV — sur laquelle Firefox OS pour TV est basée) d'être porté sur le Nexus Player (versions faisant touner Lollipop.)

+ +
+

Important : Le public visé par ces instructions est essentiellement les développeurs expérimentés qui sont déjà familiarisés avec la compilation de Firefox OS ou d'AOSP.

+
+ +
+

Note : Nous ne pouvons garantir la fiabilité des appareils portés. Cependant, les développeurs intéressés par le processus de portage et disposés à contribuer au programme sont encouragés à hacker leurs propres appareils. Les questions et les retours constructifs sont toujours les bienvenus : adressez-nous vos courriels à smarttv@mozilla.com.

+
+ +
+

Note : Cet article, estimant que votre Nexus Player est déverrouillé, ne vous apprendra pas comment le rooter et/ou déverrouiller.

+
+ +

Préparer l'environnement de compilation

+ +

Actuellement, la construction de B2G OS pour Nexus Player nécessite un PC sous Ubuntu 14.04 LTS x64 ou compatible.

+ +

Vous devez commencer par lancer les commandes suivantes :

+ +
sudo dpkg --add-architecture i386
+sudo dpkg --add-architecture amd64
+sudo apt-get update
+sudo apt-get install --no-install-recommends autoconf2.13 bison bzip2 ccache curl flex gawk gcc g++ g++-multilib git lib32ncurses5-dev lib32z1-dev libgconf2-dev zlib1g:amd64 zlib1g-dev:amd64 zlib1g:i386 zlib1g-dev:i386 libgl1-mesa-dev libx11-dev make zip lzop libxml2-utils openjdk-7-jdk nodejs unzip python
+ +

Configurer l'USB

+ +

Par défaut, sur les systèmes Linux, un utilisateur normal ne peut pas accéder directement aux périphériques USB. Vous devez configurer des règles udev.

+ +

Créez un fichier /etc/udev/rules.d/51-android.rules contenant la commande suivante, puis enregistrez-le :

+ +
wget -S -O - https://raw.githubusercontent.com/cm-b2g/B2G/1230463/tools/51-android.rules | sudo tee >/dev/null /etc/udev/rules.d/51-android.rules; sudo udevadm control --reload-rules
+ +

Les nouvelles règles prendront effet la prochaine fois qu'un appareil sera branché.

+ +
+

Note : Pour plus d'informations sur les environnement de compilation appropriés, veuillez vous référer aux Prérequis pour construire Firefox OS.

+
+ +

Télécharger le code source

+ +

Pour télécharger le code source pour le Nexus Player, assurez-vous au préalable d'avoir Github installé, puis exécutez les commandes suivantes:

+ +
git clone git://github.com/mozilla-b2g/B2G.git nexusplayer
+cd nexusplayer
+BRANCH=v2.6 ./config.sh nexusplayer-l
+ +

Pour télécharger manuellement le code source Gecko correspondant, exécutez la commande suivante :

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

Et suivez les instructions de Changer l'arbre source de Gecko pour en construire une version personnalisée.

+ +

Compiler

+ +

Une fois l'environnement mis en place et le code source téléchargé, sa construction se résume à exécuter la commande suivante :

+ +
./build.sh
+ +

Flasher B2G sur le Nexus Player

+ +

Flashez B2G OS sur le Nexus Player avec la commande suivante :

+ +
./flash.sh
+ +

Le flashage terminé, l'appareil devrait redémarrer et charger B2G OS. Sauf si quelque chose n'allait pas, vous devriez voir peu de temps après l'écran d'accueil TV de B2G OS.

+ +

Dépannage

+ +

Quelquefois, les choses peuvent mal se passer. Ce qui suit est une liste des problèmes connus, avec des suggestions de solutions.

+ +

Fastboot ne trouve pas le Nexus Player

+ +

Il est possible que ./flash.sh redémarre avec succès le Nexus Player en mode bootloader mais que ça se bloque indéfiniment sur le message < waiting for device >. Cela peut être résolu en remplaçant le fastboot de votre système par celui situé dans le répertoire <b2g>/out/host/linux-x86/bin/.

+ +

La fonctionnalité Bluetooth est absente

+ +

Nous ne pouvons pas construire automatiquement bluetooth.default.so ni libbt-vendor.so sur nexusplayer-l, c'est pourquoi le Bluetooth ne fonctionne pas par défaut. Une solution de contournement consiste actuellement à construire les fichiers manquants à la main et à les flasher sur nexusplayer-l, après quoi vous serez en mesure d'activer le bluetooth dans l'application Paramètres.

+ +

Les étapes de construction figurent ci-dessous :

+ +

Étapes pour construire bluetooth.default.so

+ +
    +
  1. Aller sur dir nexusplayer puis tapez source setup.sh.
    2. +
  2. Aller sur dir nexusplayer/external/tinyxml2 puis tapez mm.
    3. +
  3. Aller sur dir nexusplayer/external/bluetooth/bluedroid puis tapez mm.
    4. +
  4. Aller sur dir nexusplayer/ puis tapez la commande suivante :
    5. +
+ +
adb push out/target/product/fugu/system/lib/hw/bluetooth.default.so
+/system/lib/hw
+ +

Étapes pour construire libbt-vendor.so

+ +
    +
  1. Aller sur dir nexusplayer puis tapez source setup.sh.
    2. +
  2. Aller sur dir nexusplayer/hardware/broadcom/libbt puis tapez mm.
    3. +
  3. Aller sur dir nexusplayer puis tapez la commande suivante :
    4. +
+ +
adb push out/target/product/fugu/system/vendor/lib/libbt-vendor.so
+/system/vendor/lib
+ +

L'écran d'accueil TV ne gère pas les événements de la souris

+ +

Par défaut, l'application écran d'accueil TV ne gère pas les événements de la souris (voir bug 1260083). Pour le moment, la recommandation est de se passer de l'usage de la souris et d'utiliser la télécommande à la place.

+ +

Suivez ces étapes pour que les choses fonctionnent :

+ +
    +
  1. Utilisez le clavier physique pour démarrer le Nexus Player.
    2. +
  2. Utilisez les touches fléchées pour naviguer sur l'écran d'accueil et aller dans l'application Paramètres.
    3. +
  3. Utilisez les touches fléchées pour aller sur le panneau de configuration du Bluetooth et associez l'appareil avec la télécommande.
    4. +
+ +

Vous pouvez alors utiliser la télécommande à la place. Branchez la souris lorsque vous souhaitez naviguer dans l'application Navigateur.

diff --git a/files/fr/archive/b2g_os/porter_firefox_os/index.html b/files/fr/archive/b2g_os/porter_firefox_os/index.html new file mode 100644 index 0000000000..2b771ff313 --- /dev/null +++ b/files/fr/archive/b2g_os/porter_firefox_os/index.html @@ -0,0 +1,16 @@ +--- +title: Porter B2G OS +slug: Archive/B2G_OS/Porter_Firefox_OS +tags: + - Firefox OS + - portage +translation_of: Archive/B2G_OS/Porting_B2G_OS +--- +

Cette page liste les ressources disponibles concernant le portage de B2GOS.

+ +
+
Bases du portage
+
Informations de base sur comment porter B2G OS pour de nouveaux appareils.
+
Porter sur CyanogenMod
+
Cet article explique comment porter B2G en utilisant CyanogenMod.
+
diff --git a/files/fr/archive/b2g_os/porter_firefox_os/portage_sur_cyanogenmod/index.html b/files/fr/archive/b2g_os/porter_firefox_os/portage_sur_cyanogenmod/index.html new file mode 100644 index 0000000000..cc1038b093 --- /dev/null +++ b/files/fr/archive/b2g_os/porter_firefox_os/portage_sur_cyanogenmod/index.html @@ -0,0 +1,197 @@ +--- +title: Portage sur CyanogenMod +slug: Archive/B2G_OS/Porter_Firefox_OS/Portage_sur_CyanogenMod +tags: + - B2G + - cm-b2g + - cyanogenmod + - portage b2g cyanogenmod +translation_of: Archive/B2G_OS/Porting_B2G_OS/Porting_on_CyanogenMod +--- +

B2G OS est traditionnellement construit sur une base AOSP. Cependant, cela ne signifie pas que nous devons utiliser uniquement AOSP. Il en existe plusieurs forks qui ont pour objectif de supporter une gamme de matériel plus large. CyanogenMod, le plus populaire des forks d'AOSP, comporte des milliers d'ajouts, modifications, et bidouilles pour prendre en charge des centaines d'appareils Android du commerce. Cet article explique comment porter Firefox en utilisant CyanogenMod.

+ +

En construisant B2G OS sur une base CyanogenMod, il devient potentiellement possible de supporter autant d'appareils que le fait ce système. En raison de la multiplicité des appareils supportés par CyanogenMod, il est hautement probable que vous en ayez déjà un sur lequel il peut être compilé !

+ +
Important : Ce guide s'adresse seulement aux utilisateurs expérimentés ; vous devez savoir au préalable comment construire CyanogenMod ou AOSP.
+ +

Si vous n'avez jamais construit CyanogenMod pour votre appareil, nous vous conseillons fortement d'apprendre comment le faire avant de porter B2G OS. Cela pour deux raisons : vous apprendrez à utiliser les outils nécessaires au portage de B2G OS, et vous vérifierez la qualité du portage de CyanogenMod.

+ +

Pour être plus clair : ce guide part du principe que votre appareil est déverrouillé et que CyanogenMod est installé dessus. Ce guide ne va pas vous apprendre à rooter et/ou déverrouiller votre appareil, ni à mettre en place votre machine de compilation ou utiliser git pour résoudre des échecs de fusion.

+ +

Voici un résumé des étapes :

+ +
    +
  1. Télécharger le code source
    2. +
  2. Modifier les dépôts de l'appareil
    3. +
  3. Modifier le noyau
    4. +
  4. Compiler et installer
    5. +
+ +

Télécharger le code source

+ +
À FAIRE : Fusionner le manifeste requis avec mozilla-b2g : Bugzilla: 1211870.
+ +

Nous disposons de plusieurs outils utiles pour compiler B2G OS, tous contenus dans un unique dépôt. Téléchargez ces outils via git pour créer votre répertoire de travail.

+ +
git clone https://github.com/cm-b2g/B2G.git && cd B2G
+
+ +

À présent, nous devons télécharger le code source.

+ +
./config.sh cm-porting
+
+ +

Le script config.sh initialise l'outil repo en utilisant le manifeste base-l-cm.xml situé dans le dépôt b2g-manifest. Ce fichier XML est une liste de dépôts spécifiques à l'OS nécessaires à la compilation de B2G OS. Il fait ensuite appel à l'outil repo pour télécharger la totalité du code source.

+ +

Le téléchargement de tous ces dépôts, dont certains font plusieurs giga-octets, va prendre un certain temps, il est donc recommandé de le faire pendant la nuit si la connexion est lente, ou juste avant manger si la connexion est plus rapide.

+ +

Cette étape va également créer un fichier .config qui devra être éditer plus tard.

+ +

Manifeste local pour votre appareil

+ +

Le manifeste susmentionné ne contient aucun dépôt spécifique pour les appareils, ce qui diffère d'un manifeste classique. Nous avons besoin de créer un fichier local_manifest.xml avec tous les dépôts pour votre appareil. La manière la plus rapide de le faire consiste à utiliser breakfast, un outil automatisé écrit par CyanogenMod pour créer un manifeste local et télécharger les dépôts supplémentaires directement depuis le compte GitHub de CyanogenMod.

+ +
. build/envsetup.sh && breakfast 123
+
+ +

Remplacez 123 par le nom de code de votre appareil.

+ +

Si votre appareil n'est pas officiellement supporté par CyanogenMod mais qu'il existe un portage non officiel, vous pouvez créer manuellement le fichier local_manifest.xml dans le dossier .repo/local_manifests. Un exemple est donné plus bas.

+ +
<?xml version="1.0" encoding="UTF-8"?>
+<manifest>
+     <remote name="xyz" fetch="git://github.com/xyz/" revision="cm-12.1" />
+     <project name="device_oem_123" path="device/oem/123" remote="xyz" />
+     <project name="device_oem_1xx-common" path="device/oem/1xx-common" remote="xyz" />
+     <project name="kernel_oem_1xx" path="kernel/oem/1xx" remote="xyz" />
+     <project name="vendor_oem" path="vendor/oem" remote="xyz" />
+</manifest>
+
+ +

Rappelez-vous d'exécuter repo sync après avoir créé votre manifeste !

+ +

Modifier les dépôts de l'appareil

+ +

Une partie de la configuration des appareils se trouve dans des fichiers overlay XML utilisés par le système de compilation d'AOSP pour définir les options par défaut des applications Android. Comme B2G OS ne les utilise pas, il faut donc réimplémenter certaines de ces options, comme le bouton d'accueil, le stockage émulé etc.

+ +

Il est possible de définir les options par défaut les plus raisonnables en incluant deux fichiers issus de vendor/cm. La première ligne doit être ajoutée au début de device.mk et la seconde à la fin de BoardConfig.mk:

+ +
# Extra mk import at the top of device.mk
+$(call inherit-product, vendor/cm/config/common_full.mk)
+
+# Extra mk import at the bottom of BoardConfig.mk
+include vendor/cm/BoardConfig.mk
+
+ +

D'autres options sont encore nécessaires car beaucoup sont très spécifiques au matériel. Voici ci-dessous une liste des ajouts et suppressions habituels spécifiques aux appareils. Cette liste n'est pas exhaustive, mais l'ajout des deux lignes citées plus haut et définir tout ce qui suit vous donnera un système fonctionnel.

+ +
# for Gecko to use the correct resolution assets
+# Valid options are: 1.5 | 2 | 2.25
+GAIA_DEV_PIXELS_PER_PX := 2.25
+
+ +
# for Gecko to use the correct boot animation
+# Valid options are: hvga | fwvga | qHD | 720p | 1080p
+BOOTANIMATION_ASSET_SIZE := 1080p
+
+ +
# for Gecko to support separate internal storage partition
+# This is for legacy devices only. You must prvide your own volume.cfg file
+GECKO_BOARD_SEPARATE_STORAGE_PARTITON := true
+
+ +
# for Gecko to support virtual home button
+PRODUCT_PROPERTY_OVERRIDES += \
+    ro.moz.has_home_button=0
+
+ +
# for Gecko to support usb mass storage
+# You may need to add mass_storage to init.oem.usb.rc
+PRODUCT_DEFAULT_PROPERTY_OVERRIDES += \
+-    persist.sys.usb.config=mtp
++    persist.sys.usb.config=mass_storage
+
+ +
# for Gecko to support NFC
+PRODUCT_PROPERTY_OVERRIDES += \
+    ro.moz.nfc.enabled=true
+
+PRODUCT_PACKAGES += \
+    nfcd
+
+ +
# Changes in init.device.rc
+-on property:init.svc.bootanim=running
+-on property:init.svc.bootanim=stopped
+-on property:service.bootanim.exit=1
++on property:sys.boot_completed=1
+
+ +

Modifier le noyau

+ +

B2G OS a besoin d'avoir certaines fonctionnalités de sécurité supplémentaires activées dans le noyau. Jusqu'à Marshmallow, ces fonctionnalités étaient absentes des noyaux Android, quelques patches supplémentaires devront donc être rétroportés sur le noyau pour de nombreux appareils. Pour référence, consultez Bugzilla: 790923.

+ +

Il suffit de faire le tri dans les patches pour votre noyau ; le système de construction va automatiquement activer les nouvelles fonctionnalités. Pour un exemple fonctionnel, voir le noyau LGE MSM8994.

+ +
Important : Cette étape est obligatoire ! B2G OS ne démarrera pas sans ces fonctionnalités de sécurité !.
+ +

Compiler et installer

+ +

Vous vous souvenez du fichier .config créé précédemment ? Il faut maintenant remplacer cm-porting par le nom de code de votre appareil.

+ +
$ grep -r PRODUCT_NAME device/oem/123
+
+ +

Note : n'utilisez pas la valeur dans cm.mk, utilisez celle de device.mk, elle devrait ressembler à quelque chose du genre full_123. Vous pouvez effectuer le remplacement à la main, ou le faire simplement avec sed :

+ +
$ sed -i "s/cm-porting/full_123/g" .config
+
+ +

À présent, il est temps de lancer la compilation !

+ +
$ ./bldcm.sh
+
+ +

Cela va prendre dans tous les cas de 30 minutes à deux ou trois heures, en fonction de votre PC, ça peut donc être le bon moment pour aller faire les magasins ou acheter un peu de popcorn.

+ +

Installation de B2G OS via fastboot

+ +

Dans le cas où votre appareil supporte fastboot, il est possible de flasher directement les images de partition :

+ +
cd out/target/product/123/
+fastboot flash boot boot.img
+fastboot flash recovery recovery.img
+fastboot flash system system.img
+fastboot flash userdata userdata.img
+
+ +

Installation de B2G OS via recovery

+ +

Si votre appareil ne supporte pas fastboot, vous pouvez alors utiliser update.zip ià la place. Celui-ci peut être installé sur l'appareil en copiant le zip sur une carte SD ou via adb sideload. Entrez en mode recovery selon la méthode spécifique à votre appareil puis tapez :

+ +
adb sideload out/target/product/123/fota/fullimg/update.zip
+
+ +

Dépannage

+ +

Quelque chose ne fonctionne pas ? Il est temps de retrousser ses manches !

+ +

Essayez tout d'abord de déterminer si la fonctionnalité est disponible dans CyanogenMod. Il pourrait s'agir simplement d'une configuration manquante dans B2G OS.

+ +

Si ça ne fonctionne pas sur CyanogenMod, cela signifie alors que vous devez l'implémenter dans votre portage. Cela serait utile de soumettre votre correctif en amont également !

+ +

Appareils 64bits

+ +

La plupart des appareils fabriqués depuis mi-2015 intègrent un SoC 64 bits. B2G ne peut pas être construit sous la forme d'un exécutable 64 bits mais heureusement les exécutables 32 bits fonctionnent. Nous pouvons forcer la construction de B2G en 32 bits avec deux correctifs situés dans le bogue #1245088.

+ +

Après cela, il suffit de définir :

+ +
BUILD_MULTILIB_GECKO_AS_2ND_ARCH := true
+ +

Appareil photo

+ +

Certaines parties d'Android ont été retirées du processus de construction car elles ne sont pas nécessaires. Si le blob de l'appareil photo signale des fonctions manquantes, vérifiez frameworks/base pour voir si celles-ci ont été supprimées. Il peut être possible de les réintégrer.

+ +

WiFi

+ +

L'appareil peut ne pas voir certains points d'accès s'ils utilisent des canaux non officiels. Il semble que cela soit un problème de CyanogenMod ou même d'AOSP car différents matériels et fabricants sont concernés.

diff --git a/files/fr/archive/b2g_os/preparing_for_your_first_b2g_build/index.html b/files/fr/archive/b2g_os/preparing_for_your_first_b2g_build/index.html new file mode 100644 index 0000000000..c4006b4445 --- /dev/null +++ b/files/fr/archive/b2g_os/preparing_for_your_first_b2g_build/index.html @@ -0,0 +1,181 @@ +--- +title: Se préparer pour la première construction de B2G +slug: Archive/B2G_OS/Preparing_for_your_first_B2G_build +tags: + - B2G OS + - Build documentation + - compiler b2g os +translation_of: Archive/B2G_OS/Preparing_for_your_first_B2G_build +--- +
+

Avant de pouvoir construire B2G, vous devez cloner le dépôt et configurer votre arborescence. Cet article explique comment faire.

+
+ +

En fonction de votre connexion internet, l'étape de configuration prend un certain nombre d'heures pour télécharger les fichiers nécessaires à la construction de B2G OS. L'attente n'est pas aussi amusante que l'action, donc après avoir lu cette page et une fois lancé le script de configuration, pensez à utiliser ce temps pour mettre en place et tester le simulateur B2G OS,  commencez à vous familiariser avec la documentation pour les développeurs d'applications, y compris la conception et la construction d'une application, et à vous familiariser avec les informations sur les étapes à venir.

+ +
+

Note : Si vous utilisez OS X pour compiler B2G OS pour un Flame, rendez-vous sur la page Compiler B2G OS pour un Flame sur OS X.

+
+ +
+

Si vous êtes sur Archlinux, veuillez également consulter ce sujet sur Discourse.

+
+ +

Cloner le dépot  B2G

+ +

Nous disposons de plusieurs utilitaires pour construire B2G OS, tous inclus dans un unique dépôt. La première étape consiste à télécharger ces outils avec git pour créer notre répertoire de travail :

+ +
git clone git://github.com/mozilla-b2g/B2G.git && cd B2G
+ +

Si vous rencontrez une erreur UnicodeEncodeError: ascii codec error ici, essayez de spécifier votre utilisateur git avec

+ +
vim ~/.gitconfig
+
+ +

(tapez "i" pour passer en mode insertion) puis ces lignes :

+ +
[user]
+       name = votrenom
+       email = votre adressemail@url.tld
+[color]
+       ui = auto
+ +

Pressez la touche "échap" et quittez avec ":wq"

+ + + +
$ ./config.sh <appareil>
+ +

où appareil = flame-kk ou aries

+ + + +
$ ./build.sh
+$ ./flash.sh
+ +

Notes :

+ + + +
Note : Il ne s'agit pas de la liste complète des cibles de compilation, voyez config.sh ou vous référer à la page des Appareils compatibles.
+ +

Si votre cible de compilation ne figure pas dans la liste, vous devriez vous arrêter tout de suite et aider à porter B2G OS !

+ +

Configurer une version pour un appareil mobile

+ +
Important : Rappelez-vous que seuls les appareils fonctionnant au moins sous Android 4.3 (Jellybean, Kitkat et Lollipop) sont pris en charge. Veuillez vérifier que votre téléphone fonctionne avec la dernière version compatible, sinon ces prochaines étapes vont échouer. Référez-vous à la page Appareils compatibles pour plus de détails.
+ +

Blobs propriétaires

+ +

Lorsque vous installez B2G OS sur un appareil, vous avez besoin d'inclure un ensemble de blobs propriétaires. Ceux-ci sont extraits de l'appareil lorsque vous lancez votre première compilation, mais nous vous conseillons de faire également une sauvegarde complète dans un endroit sûr pour référence ultérieure. Une fois B2G OS installé, il n'y a plus aucun moyen de récupérer ces fichiers !

+ +

Assurez-vous d'avoir le débogage distant activé dans les paramètres développeurs de votre appareil. Vérifiez que ce dernier est visible avec la commande adb devices ; vous devriez voir quelque chose de similaire à ceci :

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

Si aucun appareil n'est listé, vérifiez vos règles UDEV.

+ +
Note : Si vous avez des problèmes de permissions, vérifiez que votre écran est déverrouillé et que vous avez autorisé l'accès à votre téléphone. Un message s'affiche sur votre appareil dans ce but. Si le problème persiste, utilisez adb root et adb remount.
+ +

Sauvegardez les partitions du téléphone avec la commande adb pull :

+ +
adb pull /system <répertoire cible de la sauvegarde>/system
+
+ +

En fonction du téléphone, vous devrez peut-être récupérer également les répertoires /data et /vendor :

+ +
adb pull /data <répertoire cible de la sauvegarde>/data
+adb pull /vendor <répertoire cible de la sauvegarde>/vendor
+
+ +

Si les commandes pull échouent avec un message "insufficient permission", essayez ce qui suit :

+ + + +

Prochaine étape

+ +

À ce stade, vous devriez être prêt à Compiler B2G OS.

+ +

Options de configuration avancées

+ +

Configurer la compilation en utilisant une sauvegarde système

+ +

Si votre téléphone n'a plus Android installé et que votre arborescence B2G ne contient pas les blobs binaires, mais que vous avez une sauvegarde des partitions systèmes, vous pourrez construire une version à partir de celle-ci de cette manière :

+ +
ANDROIDFS_DIR=<chemin absolu vers le répertoire parent du répertoire système> ./config.sh <cible>
+
+ +

Le système de compilation recherchera une sauvegarde existante dans un dossier backup-<cible>/system, il ne vous sera pas nécessaire de spécifier le répertoire si les fichiers sont placés à cet endroit.

+ +

Compiler en utilisant une version personnalisée de Gecko

+ +

Il peut arriver que vous souhaitez, ou avez besoin, de compiler une version de Boot to Gecko basée sur une version de Gecko différente de celle utilisée par défaut (définie dans le manifeste). Vous pouvez faire cela en éditant le fichier .userconfig. Par exemple, si vous souhaitez compiler une version utilisant mozilla-central :

+ +
export GECKO_PATH=/chemin/vers/mozilla-central
+export GECKO_OBJDIR=/chemin/vers/mozilla-central/objdir-gonk
+
+ +
+

Note : Sous Mac OS X, le répertoire mozilla-central doit se situer dans un système de fichiers sensible à la casse.

+
+ +

Notez que cette étape peut être faite avant ou après avoir récupéré le dépôt (i.e. avant l'étape config.sh ci-dessus) ou plus tard.  Vous pouvez également conserver plusieurs versions (avec débogage activé ou non, etc) en ayant plusieurs fichiers userconfig (avec des paramètres différents--chacun nécessitant évidemment un OBJDIR différent) et en faisant un lien symbolique .userconfig qui pointe sur la configuration que vous voulez compiler à ce moment.

+ +

Pour plus d'informations, lisez Changer l'arborescence source de Gecko.

+ +

Construction d'une branche

+ +

Si vous souhaitez compiler une branche autre que celle par défaut (remarque : la branche par défaut n'est pas forcément "master" !), vous devrez préfixer l'appel à config.sh avec le nom de la branche, comme ceci :

+ +
BRANCH=nom-branche ./config.sh <appareil>
+ +

Les noms de branches sont relativement logiques et suivent en général les noms de produits/versions, donc v1-train, v1.0.0, v1.0.1, v1.1, v1.1.0hd, v1.2, v1.3, v1.4, v2.0 et ainsi de suite au fur et à mesure. Comme exemple, pour compiler B2G OS 1.2, pour l'émulateur Arm, vous devez saisir

+ +
BRANCH=v1.2 ./config.sh emulator
+ +

Si vous avez déjà lancé config.sh, vous pouvez voir les noms des branches, en allant dans B2G/.repo/manifests et en faisant "git branch -a" (ce n'est pas renseigné temps que ce n'est pas encore fait.) Le nom de la branche est indiqué comme mot-clé final sur la ligne, e.g. "v1-train" ou "master":

+ +
  remotes/origin/master
+  remotes/origin/v1-train
+  remotes/origin/v1.0.0
+  remotes/origin/v1.0.1
+ +

Voir Personnalisation avec le fichier .userconfig pour des possibilités supplémentaires de personnalisation.

+ +

Copier votre arborescence B2G vers une nouvelle machine

+ +

Si vous avez déjà préparé une arborescence complète pour B2G et que vous devez changer de machine (chanceux !), vous vous simplifierez la vie en migrant simplement toute l'arborescence B2G de votre ancien ordinateur vers le nouveau, plutôt que de tout reconfigurer. Pour cela, montez le système de fichier de votre ancienne machine sur la nouvelle, puis faîtes ceci :

+ +
rsync -a source/ dest/
+
+ +

Où source correspond au chemin complet de l'arborescence source (avec la barre oblique / à la fin), dest correspond au chemin de destination de la copie (le / à la fin est également important !).

+ +
Note : Si vous copiez les fichiers à partir d'une machine avec une architecture différente n'oubliez pas d'éxécuter './build.sh clean' avant de démarrer la compilation. SInon, vous risquez de rencontrer des problèmes de compilation.
+ +

Si vous suivez ces étapes, vous pouvez sauter tout le reste de cet article et passer directement à la compilation.

+ +

Mettre à jour votre arborescence B2G

+ +

Quand le répertoire est mis à jour vers une nouvelle version de B2G, vous pourrez mettre à jour votre arborescence. Pour ce faire, utilisez les commandes suivantes :

+ +
git fetch origin
+git checkout origin/master
+ +

Vous pouvez vérifier que les commandes ont réussi avec :

+ +
git show HEAD
+ +

Puis en vérifiant que la modification indiquée par la commande correspond à celle donnée par : https://github.com/mozilla-b2g/B2G/commits/master

diff --git a/files/fr/archive/b2g_os/prerequis_pour_construire_firefox_os/index.html b/files/fr/archive/b2g_os/prerequis_pour_construire_firefox_os/index.html new file mode 100644 index 0000000000..08892dcdc3 --- /dev/null +++ b/files/fr/archive/b2g_os/prerequis_pour_construire_firefox_os/index.html @@ -0,0 +1,421 @@ +--- +title: Prérequis pour construire B2G OS +slug: Archive/B2G_OS/Prerequis_pour_construire_Firefox_OS +tags: + - Build Firefox OS + - Build documentation + - Build prerequisite + - Firefox OS + - Mobile + - Mobile OS +translation_of: Archive/B2G_OS/B2G_OS_build_prerequisites +--- +
+

Avant d'obtenir le code source pour compiler B2G OS, même si c'est juste pour essayer de construire Gaia, vous aurez besoin d'un système de compilation correctement configuré — cette page vous montre comment faire. Pour l'instant, vous pouvez compiler sur des distributions Linux 64 bits et sous OS X.

+
+ +

Cibles de compilation compatibles

+ +

Vous avez besoin d'un appareil compatible pour lequel effectuer la compilation, ou alors vous pouvez utiliser un émulateur.

+ +
+

Note : Le code source de B2G de Mozilla constitue l'implémentation de référence de B2G OS, bien que les vendeurs de téléphones effectuent souvent des modifications. Lorsque vous achetez un appareil dans le commerce, il intègre la version spécifique au fabricant. Cela n'affecte pas les applications installées, mais cela peut différer au niveau de la plate-forme. Le portage pour Nexus 5 est maintenu directement par Mozilla ; il possède une meilleure compatibilité avec notre version de Gecko comparé à d'autres appareils.

+
+ +

Émulateur

+ +

Deux émulateurs sont disponibles : l'un émule du code ARM tandis que l'autre exécute tout en code x86. Apprenez comment les installer et les utiliser. N'utilisez pas l'émulateur x86 — il est difficile à installer et n'est pas si compatible.

+ +

Bureau

+ +

Vous pouvez construire une version de B2G OS pour ordinateur de bureau ; elle fait fonctionner Gecko au sein d'une application XULRunner, et vous utilisez ensuite l'interface utilisateur Gaia à l'intérieur de celle-ci.

+ +

Appareils

+ +

Plusieurs appareils sont compatibles avec B2G OS, mais certains sont plus compatibles que d'autres, et la compatibilité d'un appareil peut se restreindre à des variantes spécifiques. Vérifiez la page des appareils compatibles pour plus de détails.

+ +
Important : Seuls les appareils qui font fonctionner au minimum Android 4.3 (c'est-à-dire Jellybean, Kitkat ou Lollipop) sont compatibles. Si votre appareil est listé ci-dessus mais fonctionne avec une version d'Android plus ancienne, mettez-le à jour.
+ +

Prérequis pour GNU/Linux

+ +

Pour compiler sur Linux, vous aurez besoin de :

+ + + +

Vous aurez aussi besoin de la présence des outils suivants :

+ + + + + + + + +
+
    +
  • autoconf 2.13
    • +
  • bison
    • +
  • bzip2
    • +
  • ccache
    • +
  • curl
    • +
  • flex
    • +
  • gawk
    • +
  • git
    • +
  • gcc
    • +
  • nodejs
    • +
  • python
    • +
+ 		+
    +
  • g++ / g++-multilib
    • +
  • java sdk (jdk)
    • +
  • lzop
    • +
  • make
    • +
  • OpenGL shared libraries
    • +
  • patch
    • +
  • X11 headers
    • +
  • 32-bit ncurses
    • +
  • 32-bit zlib
    • +
  • unzip
    • +
+
+ +

Ubuntu 12.04 LTS / Debian 6 / Linux Mint 13

+ +

Exécutez la commande suivante dans un Terminal :

+ +
sudo apt-get install autoconf2.13 bison bzip2 ccache curl flex gawk gcc g++ g++-multilib git ia32-libs lib32ncurses5-dev lib32z1-dev libasound-dev libgconf2-dev libgl1-mesa-dev libx11-dev lzop make zip libxml2-utils nodejs unzip python
+ +

vous pouvez installer le jdk via ce ppa.

+ +

Ubuntu 14.04 LTS / Debian 7

+ +

Tout d'abord, lancez les commandes suivantes pour définir les architectures requises :

+ +
sudo dpkg --add-architecture i386
+sudo dpkg --add-architecture amd64
+
+ +

Ensuite, exécutez la commande suivante dans un Terminal :

+ +
sudo apt-get install --no-install-recommends autoconf2.13 bison bzip2 ccache curl flex gawk gcc g++ g++-multilib git lib32ncurses5-dev lib32z1-dev libgconf2-dev zlib1g:amd64 zlib1g-dev:amd64 zlib1g:i386 zlib1g-dev:i386 libgl1-mesa-dev libx11-dev make zip lzop libxml2-utils openjdk-7-jdk nodejs unzip python
+
+ +

Ubuntu 16.04

+ +
+

Ubuntu 16.04, juin 2016, la version de make est 4.1, ce qui empêche la construction d'android ; si vous rencontrez ce cas, vous devrez ajouter le dépôt trusty (14.04) et revenir à la version 3.81 en exécutant cette commande :

+ +
sudo apt-get install make=3.81-8.2ubuntu3
+ +

ensuite, pour éviter toute mise à jour automatique, vous pouvez marquer le paquet make avec hold pour le conserver

+ +
sudo apt-mark hold make
+
+ +

Premièrement, lancez les commandes suivantes pour définir les architectures requises :

+ +
sudo dpkg --add-architecture i386
+sudo dpkg --add-architecture amd64
+
+ +

Ensuite, exécutez la commande suivanre dans un Terminal :

+ +
sudo apt-get install --no-install-recommends autoconf2.13 bison bzip2 ccache curl flex gawk gcc g++ g++-multilib git lib32ncurses5-dev lib32z1-dev libgconf2-dev zlib1g:amd64 zlib1g-dev:amd64 zlib1g:i386 zlib1g-dev:i386 libgl1-mesa-dev libx11-dev make zip lzop libxml2-utils openjdk-8-jdk nodejs unzip python
+
+ +

Ubuntu 16.10

+ +

Sur ubuntu 16.10, la version par défaut de make est la 4.1 ce qui empêche la compilation d'android ; pour résoudre ce problème, entrez les commandes suivantes dans la console :

+ +
wget http://ftp.us.debian.org/debian/pool/main/m/make-dfsg/make_3.81-8.2_amd64.deb
+
+sudo dpkg -i make_3.81-8.2_amd64.deb
+ +

Ensuite, pour éviter les mises à jour automatiques, vous pouvez marquer le paquet make comme étant à conserver :

+ +
sudo apt-mark hold make
+ +

Vous devez ansuite ajouter les architectures requises :

+ +
sudo dpkg --add-architecture i386
+
+sudo dpkg --add-architecture amd64
+ +

Puis, lancez la commande suivante dans un Terminal :

+ +
sudo apt-get install --no-install-recommends autoconf2.13 bison bzip2 ccache curl flex gawk gcc g++ g++-multilib git lib32ncurses5-dev lib32z1-dev libgconf2-dev zlib1g:amd64 zlib1g-dev:amd64 zlib1g:i386 zlib1g-dev:i386 libgl1-mesa-dev libx11-dev make zip lzop libxml2-utils openjdk-8-jdk nodejs unzip python
+ +

 

+ +

Configurer l'accès USB

+ +

Sur les systèmes Linux, par défaut, les utilisateurs classiques ne peuvent pas accéder directement aux périphériques USB. Il faut configurer des règles udev. Créez un fichier appelé /etc/udev/rules.d/51-android.rules avec la commande suivante :

+ +

À FAIRE : Fusionner avec le bogue 1230463

+ +
wget -S -O - https://raw.githubusercontent.com/cm-b2g/B2G/1230463/tools/51-android.rules | sudo tee >/dev/null /etc/udev/rules.d/51-android.rules; sudo udevadm control --reload-rules
+
+wget -S -O - https://raw.githubusercontent.com/mozilla-b2g/B2G/master/tools/51-android.rules | sudo tee >/dev/null /etc/udev/rules.d/51-android.rules; sudo udevadm control --reload-rules
+ +

Les nouvelles règles prendront effet au prochain branchement d'un périphérique.

+ +

Configurer ccache

+ +

Une tonne de code est compilée mais une grande quantité ne change pas d'une version à l'autre. Nous pouvons considérablement accélérer la construction avec l'outil de compilation ccache. Attribuez-lui un cache de 50 Go avec la commande suivante :

+ +
ccache -M 50G
+ +
+

Note : Si vous avez peu d'espace disque, vous pouvez néanmoins définir un cache inférieur à 50 Go.

+
+ +

Distributions alternatives

+ +

Fedora 22

+ +

Lancez la commande suivante dans un 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 lzop libxml2-utils
+ +

Arch Linux

+ +

Lancez la commande suivante dans un 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 lzop
+ +

Pour installer les paquets lib32-*, vous devrez activer le dépôt multilib.

+ +

Par défaut, Arch Linux utilise Python 3. Vous allez devoir le forcer à utiliser l'ancien Python 2. C'est possible en faisant un lien depuis l'exécutable python2 vers python mais cela est déconseillé et considéré comme source d'erreurs. Cela va également casser Python 3 s'il est installlé sur votre système. Une meilleure méthode consiste à utiliser virtualenv/virtualenvwrapper :

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

Ainsi, l'exécution de

+ +
python --version
+ +

Donne comme résultat "Python 2.7.12".

+ +

Gentoo Linux

+ +
Installation de ccache
+ +

Vous aurez besoin d'installer ccache, un outil pour mettre en cache des constructions partielles.

+ +
# emerge -av ccache
+
+ +

Comme ccache est connu pour souvent provoquer des problèmes, Gentoo encourage les personnes à l'utiliser de manière explicite et avec parcimonie.

+ +

Pour activer l'utilisation nécessaire de ccache, lors de l'étape suivante de ce guide où le script ./build.sh script est appelé, les utilisateurs de Gentoo doivent à la place lancer la commande avec un chemin explicite étendu, c'est-à-dire :

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

Génération des images de partitions

+ +

Si vous compilez B2G pour un véritable appareil physique, alors vous serez amené à un certain moment à générer certaines images de partitions pour les envoyer sur votre appareil. (Par exemple, pour restaurer des fichiers sauvegardés vers l'appareil via l'utilitaire fastboot)

+ +

Le format utilisé pour l'image du système de fichiers dans ce cas est YAFFS2 (Yet Another Filesystem 2). Gentoo intègre le support de la toute dernière version (ie. git HEAD) du paquet yaffs2-utils en espace utilisateur dans le portage. (Note : Vous aurez aussi besoin de correctifs noyau si vous souhaitez monter des images YAFFS2, mais ce n'est pas vraiment obligatoire car à la place vous pouvez les déconstruire puis les reconstruire.)

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

Afin de générer une telle image, placez-vous simplement dans le répertoire parent de l'arborescence du système de fichiers de la partition que vous voulez empaqueter, puis envoyez  une commande comme ceci :

+ +
mkyaffs2image system/ system.img
+ +

Branches anciennes

+ +

Si vous souhaitez compiler une ancienne branche de B2G OS, des erreurs de compilation peuvent survenir. Voir la page Construire d'anciennes branches.

+ +

Prérequis pour OS X

+ +
+

Note : La configuration et la compilation de B2G pour Keon ne fonctionne pas sur Mac. Il vous faut utiliser Linux pour construire B2G pour cet appareil.

+
+ +
+

Note : La compilation de B2G pour Fairphone2 ne fonctionne pas sur Mac. Il vous faudra utiliser Linux pour construire B2G pour cet appareil. La cause est l'échec de la vérification MD5 des blobs ; pour plus d'informations, voir : Lien

+
+ +

La construction de B2G OS sur OS X est possible, mais elle n'est ni facile ni très bien supportée. Il sera nécessaire d'installer une ancienne version de Xcode qui pourrait interférer avec la version actuelle si vous l'utilisez déjà. Pour une meilleure expérience, vous devriez compiler sur Ubuntu 14.04 LTS. Cependant, si vous insistez, essayez ces étapes :

+ +

OS X 10.11 El Capitan et OS X 10.10 Yosemite

+ +
+

Important : La construction sur OS X 10.11 El Capitan est expérimentale et peut ne pas se terminer ! Restez sur OS X 10.10 Yosemite jusqu'à ce que les instructions ci-dessous soient améliorées et que cet avertissement soit supprimé.

+
+ +

Système de fichiers sensible à la casse

+ +

L'installation par défaut d'OS X ne convient pas pour la compilation de B2G OS. Il vous faut réinstaller OS X sur un système de fichiers sensible à la casse.

+ +

Xcode 7.2

+ +
    +
  1. Installez la dernière version de Xcode à partir de l'Apple Store.
    2. +
  2. Acceptez la licence avec la commande suivante :
    3. +
+ +
sudo xcodebuild -license
+ +

Xcode Command Line Tools

+ +

Installez Xcode Command Line Tools avec la commande suivante :

+ +
xcode-select --install
+ +

Xcode 5.1.1

+ +
+

Important : Veuillez installer Homebrew et ses outils (voir la section ci-dessous) avant de passer à celle du SDK de Xcode 5.1.1 - l'installation d'Homebrew sur le SDK Xcode 5.1.1 va échouer !

+
+ +

AOSP, et par conséquent B2G OS, n'est pas compatible avec la dernière version du SDK d'Xcode. Nous avons besoin d'installer une version plus ancienne à côté de la plus récente.

+ +
    +
  1. Téléchargez Xcode 5.1.1 depuis developer.apple.com et installez-le dans /Applications/Xcode-5.1.1
    2. +
  2. Basculez vers l'utilisation du SDK Xcode 5.1.1 avec la commande suivante :
    3. +
+ +
sudo xcode-select --switch "/Applications/Xcode-5.1.1/Xcode.app/Contents/Developer"
+ +

Java SE Development Kit 7

+ +

AOSP, et par conséquent B2G OS, n'est pas compatible avec le JDK Java v8, il est donc nécessaire d'installer le JDK Java v7. Vous pouvez le télécharger depuis http://www.oracle.com/.

+ +

Profil Bash

+ +

Ajouter les lignes suivantes à votre fichier ~/.bash_profile :

+ +
export PATH=~/bin:$PATH
+export PATH=/usr/local/bin:$PATH
+export BUILD_MAC_SDK_EXPERIMENTAL=1
+export LC_CTYPE=C
+export LANG=C
+export USE_CCACHE=1
+ +

Homebrew

+ +

Nous devons installer certains outils en ligne de commande en plus car ils ne sont pas fournis par Apple. Installez Homebrew :

+ +
ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
+ +

Ensuite, installez les outils avec la commande suivante :

+ +
brew install ccache coreutils cmake findutils git gnu-tar gnu-sed gpg lzop yasm
+ +

Il faut une version spécifique d'autoconf, la version 2.13 :

+ +
brew install homebrew/versions/autoconf213
+
+ +

Configurer ccache

+ +

Beaucoup de code est compilé mais une grande partie de change pas selon les versions. La vitesse de compilation peut être considérablement accélérée avec l'outil de compilation ccache. Attribuez-lui un cache de 50 Go avec la commande suivante :

+ +
prebuilts/misc/darwin-x86/ccache/ccache -M 50G
+ +

Anciennes instructions pour OS X

+ +

Exécutez B2G OS Mac Bootstrap

+ +

Ensuite, ouvrez un terminal et lancez la commande suivante :

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

Cela va récupérer et lancer un script de bootstrap qui va s'assurer que vous disposez de tous les éléments requis pour construire l'émulateur. Il vous demandera aussi la permission d'installer ce qui pourrait manquer et fournir des avertissements et des suggestions de correction en cas de problème.

+ +

Pour développer avec B2G, vous allez avoir besoin de récupérer une branche particulière. Cette dernière est à télécharger depuis Mercurial. (en apprendre plus) Comme OSX ne dispose pas de Mercurial par défaut, vous devez l'installer avec ce code :

+ +
$ brew install mercurial
+ +

Tenez compte de la sensibilité à la casse du système de fichiers Mac

+ +

Par défaut, OS X est installé sur un système de fichiers insensible à la casse. Cela pose problème car le noyau Linux contient un certain nombre de fichiers avec des noms identiques, mais avec des casses différentes. Par exemple, les fichiers d'en-tête xt_CONNMARK.h et xt_connmark.h Cela a pour conséquence de faire paraître un certain nombre de fichiers comme ayant été modifiés dans /kernel après un tout récent ./config.sh.

+ +

Dans de nombreux cas, vous pouvez lancer la compilation sans problème ; sur certaines plateformes par contre, vous pouvez rencontrer l'erreur suivante :

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

Veuillez vous référer au bogue 867259 pour plus de détails et des correctifs éventuels pour ce problème.

+ +

Sinon, ce sera toujours plus sûr de compiler sur un système de fichiers sensible à la casse. La méthode la plus simple pour cela consiste à créer une image disque montable, distincte, avec la sensibilité à la casse activée. Faîtes attention à ne pas utiliser de lettres en capitale si vous changez le nom spécifié par -volname. L'image peut être créée avec l'application d'Apple Disk Utility ou en ligne de commande :

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

Montez le lecteur avec :

+ +
open ~/firefoxos.sparseimage
+ +

Changez de répertoire vers le lecteur monté avec :

+ +
cd /Volumes/firefoxos/
+ +

Vous pouvez ensuite récupérer le code et le compiler depuis cet emplacement sans vous préoccuper des problèmes de sensibilité à la casse.

+ +

Optionnel : Installer HAX

+ +

Intel fournit un pilote spécial qui permet à l'émulateur B2G d'exécuter son code en natif sur votre Mac au lieu de l'émuler lorsque vous utilisez l'émulateur x86. Si vous souhaitez l'utiliser, vous pouvez le télécharger et l'installer. Ce n'est pas obligatoire, mais cela peut améliorer les performances et la stabilité de l'émulation.

+ +

Avant que vous ne puissiez installer HAX, vous devez installer le SDK d'Android.

+ +

Installer adb

+ +

Le processus de construction a besoin d'extraire les blobs binaires de l'installation d'Android présente sur le téléphone avant de compiler B2G (sauf si vous construisez l'émulateur bien sûr). Dans ce but, il sera nécessaire d'avoir adb (Android Debug Bridge). Notre article Installer ADB explique comment faire.

+ +
+

Note pour plus tard lorsque vous commencerez à utiliser adb : l'écran de verrouillage du téléphone doit être déverrouillé pour qu'adb puisse voir votre téléphone (au moins dans les dernières versions de B2G OS). Vous préférerez sans doute désactiver l'écran de verrouillage (nous verrons comment plus loin dans les instructions de compilation).

+
+ +

Étapes additionnelles pour le Samsung Galaxy S2

+ +

Si vous envisagez de compiler pour le Samsung Galaxy S2, il vous sera aussi nécessaire d'avoir installé heimdall. Voir Installer heimdall pour les détails. Le script de bootstrap ne le fera pas à votre place !

+ +

De plus, vous devez garder à l'esprit les points suivants :

+ +
    +
  1. Lorsqu'éventuellement vous êtes sur le point d'installer votre build sur un appareil S2, avant de lancer le script flash.sh, vous devez remplacer toutes les occurences de factoryfs par FACTORYFS, ainsi que kernel par KERNEL (vérifiez la sortie de pit pour confirmation), sinon cela ne fonctionnera pas.
    2. +
  2. La ROM de Recovery Siyah-s2 est celle qui fonctionne le mieux. CWM fonctionne bien aussi, mais présente quelques soucis.
    3. +
  3. Flasher votre S2 avec flash.sh va permettre de faire fonctionner l'OS de base mais la version de Gaia incluse peut avoir des problèmes. La rafraîchir avec make reset-gaia PRODUCTION=1 devrait les résoudre.
    4. +
+ +
Note : Si vous avez installé l'outil Samsung Kies, lequel est utilisé pour gérer le contenu de nombreux téléphones Samsung, vous aller devoir le supprimer avant de pouvoir flasher B2G OS sur votre appareil. Vous pouvez employer le procédé classique de Windows pour désinstaller l'application ; sur Mac, le disque d'installation de Kies contient un utilitaire pour complétement supprimer Kies du système. Le flashage ne fonctionnera pas si Kies est installé. Si vous oubliez de le supprimer, le système de compilation va le détecter et vous rappeler de le désinstaller. Remarquez aussi que l'outil de désinstallation ne supprime pas correctement le dossier ~/Library/Application Support/.FUS, et y laisse une référence à un utilitaire dans votre liste d'éléments de démarrage utilisateur. Vous pourrez les supprimer manuellement.
+ +

Installer heimdall

+ +

Heimdall est un utilitaire pour flasher le Samsung Galaxy S2. Il est utilisé par l'utilitaire de flashage de Boot to Gecko aussi bien pour remplacer le contenu du téléphone par B2G OS que pour flasher des versions mises à jour de B2G et de Gaia sur l'appareil. Vous en aurez besoin si vous voulez installer B2G OS sur un Galaxy S2 ; il n'est pas nécessaire pour les autres appareils. Pour ces derniers, nous construisons et utilisons l'utilitaire fastboot à la place.

+ +
Note : Encore une fois, il est important de noter que cela est nécessaire uniquement pour installer B2G OS sur le Samsung Galaxy S2.
+ +

Il y a deux méthodes pour installer heimdall :

+ + + +
+

Note : À l'heure actuelle, compiler la dernière version d'Heimdall à partir des sources génère des erreurs. Il vaut mieux à la place utiliser la version sous forme de paquet 64 bits des dépôts Ubuntu 14.04. i.e. n'utilisez pas heimdall-flash:i386 si vous pouvez l'éviter.

+
+ +

Prochaine étape

+ +

À ce stade, vous êtes prêt pour récupérer le code source de B2G OS !

diff --git a/files/fr/archive/b2g_os/quickstart/index.html b/files/fr/archive/b2g_os/quickstart/index.html new file mode 100644 index 0000000000..197236620c --- /dev/null +++ b/files/fr/archive/b2g_os/quickstart/index.html @@ -0,0 +1,32 @@ +--- +title: Build +slug: Archive/B2G_OS/Quickstart +tags: + - Apps + - TopicStub +translation_of: Archive/B2G_OS/Quickstart +--- +
+

Informations de démarrage rapide sur le codage des applications Web ouvertes.

+
+ +
+
Introduction aux applications Web ouvertes
+
Que sont les applications Web ouvertes? En quoi diffèrent-elles des pages Web régulières? Pourquoi est-ce important? Cet article vise à répondre à ces questions et plus encore.
+
Votre première application
+
Cet article vous guide à travers les étapes de base et les connaissances supplémentaires en plus du développement Web régulier requis pour créer des applications Web ouvertes installables.
+
Introduction à Firefox OS
+
Une introduction à Firefox OS, la nouvelle plate-forme mobile ouverte basée sur les applications Web de Mozilla
+
Introduction aux manifestes
+
Une FAQ conçue pour répondre à toutes vos questions sur les manifestes, l'hébergement d'applications, les origines et d'autres sujets similaires.
+
Développement d'applications pour les développeurs Web
+
Si vous êtes un développeur Web, en quoi les applications Web ouvertes diffèrent-elles de ce à quoi vous êtes habitué? Cet article explique tout.
+
Développement d'applications pour les développeurs mobiles
+
Si vous êtes un développeur d'applications mobiles natives, quels avantages les applications Web ouvertes peuvent-elles vous apporter et en quoi diffèrent-elles de ce à quoi vous êtes habitué? Voici quelques idées.
+
Développer la fonctionnalité de l'application
+
Cette page décrit les types de fonctionnalités différentes que vous pourriez souhaiter intégrer à vos applications, avec des liens vers des informations supplémentaires.
+
Paiements
+
Comment créez-vous des fonctionnalités pour faire payer les gens pour l'installation de vos applications Web ouvertes? Voici la vérité.
+
Outils d'application
+
Enfin pour cette section, nous fournissons des liens vers plus d'informations sur les outils disponibles pour vous aider à développer d'excellentes applications Web ouvertes.
+
diff --git a/files/fr/archive/b2g_os/quickstart/votre_premier_application/index.html b/files/fr/archive/b2g_os/quickstart/votre_premier_application/index.html new file mode 100644 index 0000000000..fb7aee2781 --- /dev/null +++ b/files/fr/archive/b2g_os/quickstart/votre_premier_application/index.html @@ -0,0 +1,261 @@ +--- +title: Votre première application +slug: Archive/B2G_OS/Quickstart/Votre_premier_application +tags: + - Applications + - Débutant + - Guide +translation_of: Archive/B2G_OS/Quickstart/Your_first_app +--- +
+
+

Les Open Web apps donnent aux développeurs web ce qu'ils ont attendu pendant des années: un environnement multi-plateforme dédié aux applications installables créées avec HTML, CSS et JavaScript - avec Firefox OS qui est la première plate-forme ouverte dédiée aux applications web. Ce guide vous permet de démarrer rapidement avec une architecture de base ainsi que les   premières instructions. Vous pourrez ainsi créer la prochaine application révolutionnaire!

+
+ +

Si vous souhaitez suivre ce guide, vous pouvez télécharger nos modèles d'applications de démarrage rapide. Vous trouverez plus d'informations à propos de ce dernier en lisant notre guide sur les modèles d'applications.

+ +

Structure de l'application

+ +

Packaged vs. Hosted Apps

+ +

Il y a deux types d'applications web : packaged(empaquetées) et hosted(hébergées) . Les applications empaquetées sont essentiellement des fichiers zip contenant toutes les ressources de l'application : HTML, CSS, JavaScript, images, manifeste, etc. Les applications hébergées sont exécutées à partir d'un serveur avec un domaine donné, comme les sites web standards. Les deux types d'application nécessitent un manifeste valide. Quand vous êtes prêt à soumettre votre application au Firefox Marketplace, vous devrez soit uploader votre application sous forme de zip, soit fournir l'URL où votre application est hébergée.

+ +
+
+

Réalisé en partenariat avec Treehouse: PASSEZ CHEZ EUX !

+
+
+ +

Pour les besoins de ce tutoriel, vous allez créer une application qui sera hébergée sur votre adresse localhost. Une fois votre application prête à être postée dans le Firefox Marketplace, vous pourrez choisir la forme que prendra votre application : packaged app ou hosted app.

+ +

App Manifests

+ +

Chaque  application Firefox requiert un fichier manifest.webapp dans l'application racine. Le fichier manifest.webapp produit d'importantes informations sur l'application, comme la version, le nom, la description, les logos, les chaines locales, les domaines auquels l'application peut être installé, et beaucoup d'autres. Seulement le nom et la description sont requis. Le simple manifest inclus dans les modèles d'application est similaire à celui ci-dessous:

+ +
{
+  "version": "0.1",
+  "name": "Open Web App",
+  "description": "Your new awesome 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": "Your Name",
+    "url": "http://yourawesomeapp.com"
+  },
+  "locales": {
+    "es": {
+      "description": "Su nueva aplicación impresionante Open Web",
+      "developer": {
+        "url": "http://yourawesomeapp.com"
+      }
+    },
+    "it": {
+      "description": "Il vostro nuovo fantastico Open Web App",
+      "developer": {
+        "url": "http://yourawesomeapp.com"
+      }
+    }
+  },
+  "default_locale": "en"
+}
+ +
+
+

Fait en partenariat avec Treehouse: PASSER CHEZ EUX

+
+
+ +

 

+ +

Un manifest basique est tout ce dont vous avez besoin pour commencer. Pour plus de détails a propos des manifests, lire App Manifest.

+ +

Disposition et Design de l'application

+ +

Le Responsive design est devenu  de plus en plus important comme plusieurs résolutions d'écrans deviennent des standards sur différents appareils. Même si le principal objectif de votre application sont les plateformes mobiles comme Firefox OS, d'autres appareils y auront aussi probablement accès. CSS media queries vous autorise à l'adapter selon la disposition de votre appareil, comme le montre ce petit exemple CSS:

+ +
/* The following are examples of different CSS media queries */
+
+/* Basic desktop/screen width sniff */
+@media only screen and (min-width : 1224px) {
+  /* styles */
+}
+
+/* Traditional iPhone width */
+@media
+  only screen and (-webkit-min-device-pixel-ratio : 1.5),
+  only screen and (min-device-pixel-ratio : 1.5) {
+  /* styles */
+}
+
+/* Device settings at different orientations */
+@media screen and (orientation:portrait) {
+  /* styles */
+}
+@media screen and (orientation:landscape) {
+  /* styles */
+}
+ +

Il ya beaucoup de Frameworks JavaScript et CSS frameworks disponibles pour aider dans le responsive design et dans le développement  d'application mobile (Bootstrap, etc.) Choisissez le/les framework(s) qui est(sont) le(s) mieux adapté(s) à votre application et votre style de développement.

+ +

APIs du Web

+ +

Des APIs JavaScript ont été créés et augmentés rapidement comme les appareils. L'effort WebAPI de Mozilla apporte des dizaines de fonctionnalités mobiles standard aux APIs JavaScript . Une liste des supports et status de périphérique est disponible sur la page WebAPI. La détection de fonctionnalités JavaScript est encore aujourd'hui un bon usage, comme montré dans l'exemple suivant :

+ +
// If this device supports the vibrate API...
+if('vibrate' in navigator) {
+    // ... vibrate for a second
+    navigator.vibrate(1000);
+}
+ +

Dans l'exemple suivant, la méthode d'affichage d'un <div> est modifiée en fonction de l'état de la batterie du périphérique :

+ +
// Create the battery indicator listeners
+(function() {
+  var battery = navigator.battery || navigator.mozBattery || navigator.webkitBattery,
+      indicator, indicatorPercentage;
+
+  if(battery) {
+    indicator = document.getElementById('indicator'),
+    indicatorPercentage = document.getElementById('indicator-percentage');
+
+    // Set listeners for changes
+    battery.addEventListener('chargingchange', updateBattery);
+    battery.addEventListener('levelchange', updateBattery);
+
+    // Update immediately
+    updateBattery();
+  }
+
+  function updateBattery() {
+    // Update percentage width and text
+    var level = (battery.level * 100) + '%';
+    indicatorPercentage.style.width = level;
+    indicatorPercentage.innerHTML = 'Battery: ' + level;
+    // Update charging status
+    indicator.className = battery.charging ? 'charging' : '';
+  }
+})();
+ +

Dans le code ci-dessus, une fois qu'il est confirmé que l'API Battery est supporté, vous pouvez ajoutez des event listeners pour chargingchange et levelchange afin d'actualiser l'affichage de l'élément. Essayez d'ajouter ce qui suit au modèle de démarrage rapide, et voyez si vous pouvez le faire fonctionner.

+ +

Référez-vous fréquemment à la page WebAPI pour vous mettre à jour avec les états d'API du périphérique.

+ +

Installer la fonctionnalité API

+ +

In our sample quickstart app template, we've implemented an install button that you can click when viewing the app as a standard Web page, to install that site on Firefox OS as an app. The button markup is nothing special:

+ +
<button id="install-btn">Install app</button>
+ +

This button's functionality is implemented using the Install API (see install.js):

+ +
var manifest_url = location.href + 'manifest.webapp';
+
+function install(ev) {
+  ev.preventDefault();
+  // define the manifest URL
+  // install the app
+  var installLocFind = navigator.mozApps.install(manifest_url);
+  installLocFind.onsuccess = function(data) {
+    // App is installed, do something
+  };
+  installLocFind.onerror = function() {
+    // App wasn't installed, info is in
+    // installapp.error.name
+    alert(installLocFind.error.name);
+  };
+};
+
+// get a reference to the button and call install() on click if the app isn't already installed. If it is, hide the button.
+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);
+  };
+};
+
+ +

Let's run through briefly what is going on:

+ +
    +
  1. We get a reference to the install button and store it in the variable button.
    2. +
  2. We use navigator.mozApps.checkInstalled to check whether the app defined by the manifest at http://people.mozilla.com/~cmills/location-finder/manifest.webapp is already installed on the device. This test is stored in the variable installCheck.
    3. +
  3. When the test is successfully carried out, its success event is fired, therefore installCheck.onsuccess = function() { ... } is run.
    4. +
  4. We then test for the existence of installCheck.result using an if statement. If it does exist, meaning that the app is installed, we hide the button. An install button isn't needed if it is already installed.
    5. +
  5. If the app isn't installed, we add a click event listener to the button, so the install() function is run when the button is clicked.
    6. +
  6. When the button is clicked and the install() function is run, we store the manifest file location in a variable called manifest_url, and then install the app using navigator.mozApps.install(manifest_url), storing a reference to that installation in the installLocFind variable. You'll notice that this installation also fires success and error events, so you can run actions dependent on whether the install happened successfully or not.
    7. +
+ +

You may want to verify the implementation state of the API when first coming to Installable web apps.

+ +
+

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 allows you to install installable web apps on the desktop. See FAQs about apps manifests for more information on origins.

+
+ +

WebRT APIs (Permissions-based APIs)

+ +

There are a number of WebAPIs that are available but require permissions for that specific feature to be enabled. Apps may register permission requests within the manifest.webapp file like so:

+ +
// New key in the manifest: "permissions"
+// Request access to any number of APIs
+// Here we request permissions to the systemXHR API
+"permissions": {
+    "systemXHR": {}
+}
+ +

The three levels of permission are as follows:

+ + + +

For more information on app permission levels, read Types of packaged apps. You can find out more information about what APIs require permissions, and what permissions are required, at App permissions.

+ +
+

It's important to note that not all Web APIs have been implemented within the Firefox OS Simulator.

+
+ +

Tools & Testing

+ +

Testing is incredibly important when supporting mobile devices. There are many options for testing installable open web apps.

+ +

Firefox OS Simulator

+ +

Installing and using the Firefox OS Simulator is the easiest way to get up and running with your app. After you install the simulator, it is accessible from the Tools -> Web Developer -> Firefox OS Simulator menu. The simulator launches with a JavaScript console so you can debug your application from within the simulator.

+ +

App Manager

+ +

The new kid on the block with regards to testing tools is called the App Manager. This tool allows you to connect desktop Firefox to a compatible device via USB (or a Firefox OS simulator), push apps straight to the device, validate apps, and debug them as they run on the device.

+ +

Unit Testing

+ +

Unit tests are extremely valuable when testing on different devices and builds. jQuery's QUnit is a popular client-side testing utility, but you can use any set of testing tools you'd like.

+ +

Installing Firefox OS on a Device

+ +

Since Firefox OS is an open source platform, code and tools are available to build and install Firefox OS on your own device. Build and installation instructions, as well as notes on what devices it can be installed on, can be found on MDN.

+ +

Dedicated Firefox OS developer preview devices are also available: read our Developer preview phone page for more information.

+ +

App Submission and Distribution

+ +

Once your app is complete, you can host it yourself like a standard web site or app (read Self-publishing apps for more information), or it can be submitted to the Firefox Marketplace. Your app's manifest will be validated and you may choose which devices your app will support (e.g. Firefox OS, Desktop Firefox, Firefox Mobile, Firefox Tablet). Once validated, you can add additional details about your app (screenshots, descriptions, price, etc.) and officially submit the app for listing within the Marketplace. Once approved, your app is available to the world for purchase and installation.

+ +

More Marketplace & Listing Information

+ +
    +
  1. Submitting an App to the Firefox OS Marketplace
    2. +
  2. Marketplace Review Criteria
    3. +
  3. App Submission Video Walkthrough
    4. +
+
diff --git a/files/fr/archive/b2g_os/releases/1.0.1/index.html b/files/fr/archive/b2g_os/releases/1.0.1/index.html new file mode 100644 index 0000000000..2ed41f7a99 --- /dev/null +++ b/files/fr/archive/b2g_os/releases/1.0.1/index.html @@ -0,0 +1,128 @@ +--- +title: Firefox OS 1.0.1 pour les développeurs +slug: Archive/B2G_OS/Releases/1.0.1 +tags: + - Firefox OS + - Notes de version +translation_of: Archive/B2G_OS/Releases/1.0.1 +--- +
+

Firefox OS 1.0.1 a tout d'abord été proposé aux partenaires pour une distribution le 2 juillet 2013 ; ce fut la première version officielle de Firefox OS. Son composant Gecko est basé sur Firefox 18 (voir Firefox 18 pour les développeurs), publié le 18 janvier 2013. Pour les versions plus anciennes, consultez les notes de version des anciens Firefox pour ordinateur de bureau, en commençant par Firefox 17 pour les développeurs. Cette page détaille les fonctionnalités développeur nouvellement implémentées dans Firefox OS 1.0.1.

+
+ +

HTML

+ +

Spécifique à Firefox OS :

+ + + +

Commun à Gecko :

+ + + +

CSS

+ +

Commun à Gecko :

+ + + +

JavaScript

+ +

Spécifique à Firefox OS :

+ + + +

Commun à Gecko :

+ + + +

DOM/API

+ +

Spécifique à Firefox OS :

+ + + +

Commun à Gecko :

+ + + +

Réseau

+ +

Commun à Gecko :

+ + + +

Fonctionnalités notables de la version 1.0.1

+ + + +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/releases/1.1/index.html b/files/fr/archive/b2g_os/releases/1.1/index.html new file mode 100644 index 0000000000..14de4a6b76 --- /dev/null +++ b/files/fr/archive/b2g_os/releases/1.1/index.html @@ -0,0 +1,111 @@ +--- +title: Firefox OS 1.1 pour les développeurs +slug: Archive/B2G_OS/Releases/1.1 +tags: + - Firefox OS + - Notes de version +translation_of: Archive/B2G_OS/Releases/1.1 +--- +
+

Firefox OS 1.1 est une pré-version de Firefox OS, initialement distribuée auprès des partenaires pour être publiée le 21 octobre 2013. Son composant Gecko est basé sur Firefox 18 (voir Firefox 18 pour les développeurs) tout comme pour Firefox OS 1.0.1, mais avec certaines corrections de bogues supplémentaires et l'ajout d'APIs. Cette page détaille les fonctionnalités pour développeur nouvellement implémentées dans Firefox OS 1.1.

+
+ +

HTML

+ +

Spécifique à Firefox OS :

+ + + +

JavaScript

+ +

Spécifique à Firefox OS :

+ + + +

DOM/API

+ +

Spécifique à Firefox OS :

+ + + +

Support HD dans Firefox OS

+ +

Depuis Firefox OS 1.1, il existe des versions HD disponibles pour apporter ce support à des appareils avec écrans à haute densité. Il s'agit principalement d'un changement visuel uniquement, traité de la même façon que s'il s'agissait d'autres appareils de résolutions différentes, et rien de plus ne sera visible comme différence au niveau de la plate-forme sous-jacente.

+ +

Problèmes corrigés dans Firefox OS

+ + + +

Plantages résolus

+ +

Fonctionnalités notables de Firefox OS 1.1

+ + + +

Voir aussi

+ + + +

Anciennes versions

+ +

+ +

diff --git a/files/fr/archive/b2g_os/releases/2.0/index.html b/files/fr/archive/b2g_os/releases/2.0/index.html new file mode 100644 index 0000000000..8fd2a38ab8 --- /dev/null +++ b/files/fr/archive/b2g_os/releases/2.0/index.html @@ -0,0 +1,111 @@ +--- +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/fr/archive/b2g_os/releases/2.1/index.html b/files/fr/archive/b2g_os/releases/2.1/index.html new file mode 100644 index 0000000000..694ebf60df --- /dev/null +++ b/files/fr/archive/b2g_os/releases/2.1/index.html @@ -0,0 +1,44 @@ +--- +title: Firefox OS 2.1 for developers +slug: Archive/B2G_OS/Releases/2.1 +translation_of: Archive/B2G_OS/Releases/2.1 +--- +
+

Le composant Gecko de Firefox OS 2.1 est basé sur Firefox 33/34. Cette page détaille les fonctionnalités pour développeurs nouvellement implémentées dans Gecko et spécifiques à Firefox OS 2.1.

+
+ +
+

Note: Pour les fonctionnalités générales de Gecko, qui sont généralement aussi présentes dans Firefox OS Gecko, consulter Firefox 33 release notes for developers et Firefox 34 release notes for developers.

+
+ +

Changement de plateforme

+ +

Firefox OS est habitué à avoir une politique de sécurité  "application unique par origine", mais ceci a été levé à partir de Firefox 34/Firefox OS 2.1 (lire cette FAQ pour plus d'informations). Si vous avez quand même besoin de supporter les anciennes versions, hébergez vos applis sur des origines différentes; une stratégie consiste à  créer différents sous domaines pour vos applis.

+ +

Changement d'API web

+ + + +

Voir aussi

+ + + +

Anciennes Versions

+ +

+ +

diff --git a/files/fr/archive/b2g_os/releases/2.2/index.html b/files/fr/archive/b2g_os/releases/2.2/index.html new file mode 100644 index 0000000000..7b1699ab97 --- /dev/null +++ b/files/fr/archive/b2g_os/releases/2.2/index.html @@ -0,0 +1,125 @@ +--- +title: Firefox OS 2.2 pour les développeurs +slug: Archive/B2G_OS/Releases/2.2 +tags: + - '2.2' + - Firefox OS + - Notes de version +translation_of: Archive/B2G_OS/Releases/2.2 +--- +
+

Cette page détaille les fonctionnalités développeurs nouvellement implémentées dans Gecko et qui sont spécifiques à Firefox OS 2.2, ainsi que les fonctionnalités du produit et des outils de développement, et d'autres points notables de cette nouvelle version.

+
+ +
+

Note : Le composant Gecko de Firefox OS 2.2 est basé sur Firefox 35/36/37.

+
+ +

Fonctionnalités du produit

+ +

Cette section énumère différentes catégories de fonctionnalités nouvelles ou améliorées.

+ +

Fonctionnalités systèmes

+ +
+
Bluetooth
+
Bluedroid a été déplacé dans un processus distinct pour accroître la sécurité (bug 1005934.)
+
Sélection de texte
+
Pour prendre en charge le Copier/Coller, des possibilités de sélection de texte ont été ajoutées au système.
+
WebRTC
+
Le rendu matériel a été ajouté sur WebRTC pour améliorer la gestion de l'alimentation et économiser l'autonomie de la batterie (bug 1043558.)
+
SIM Tool Kit (STK)
+
Le support STK a été ajouté pour lire les numéros d'urgence (bug 1061130.)
+
Les icônes STK sont maintenant affichées sur les pages des services SIM (bug 1016807.)
+
Recherche
+
L'expérience utilisateur pour la recherche a été améliorée pour faciliter le choix du moteur de recherche par l'utilisateur (bug 1099157.)
+
Les suggestions de recherche basées sur du texte sont à présent obtenues depuis le moteur de recherche par défaut, ce qui permet de trouver plus facilement ce que l'utilisateur recherche (bug 1098494.)
+
Vie privée
+
Les utilisateurs peuvent désormais naviguer sans enregistrer d'historique grâce à la navigation privée (bug 1081731.)
+
La prise en charge a été ajoutée pour ajuster la précision de la position vers une position approximative d'après différents types basiques de détection de position (désactivé par défaut) (bug 1073419.)
+
Plate-forme
+
Le démarrage des applications et les performances générales ont été améliorés (bug 1074783, bug 1082262, bug 1082268 et bug 1086963.)
+
Sur les appareils disposant de peu de RAM, les utilisateurs pourront constater de meilleures performances (le support des Cgroup réduisant le swapping des processus de haute priorité) (bug 1082290.)
+
Le support d'Android L a été ajouté (bug 1094121.)
+
Le support des extensions est maintenant disponible pour étendre les fonctionnalités de Firefox OS (désactivé par défaut) (bug 923897.)
+
Langue/Localisation
+
Les langues qui se lisent de droite à gauche sont maintenant gérées par Firefox OS (bug 906270.)
+
Métriques
+
L'ajout de la possibilité d'avoir des rapports sur les utilisateurs actifs chaque mois permet de meilleures métriques (bug 1109422.)
+
NFC
+
Les applications tierces peuvent à présent employer les APIs NFC (bug 1102019.)
+
+ +

Applications système

+ +
+
Téléphone (Composeur)
+
Les appels téléphoniques peuvent être mis en attente depuis l'écran d'appel actif (bug 977588.)
+
SMS/MMS
+
Les messages MMS peuvent maintenant être envoyés vers des adresses de messagerie électronique (bug 997547 et bug 1091486.)
+
Les contacts peuvent à présent être partagés au format VCF/vCard via courriel, messages, et Bluetooth (bug 1007932.)
+
Courriel
+
Il est maintenant possible de joindre aux courriels des fichiers téléchargés présents dans le gestionnaire de téléchargement. (bug 1113152.)
+
Les comptes de courriel peuvent maintenant être configurés manuellement soit en texte clair soit avec SSL (bug 1046799.)
+
Il n'y a plus de contraintes sur les types de fichiers que l'utilisateur peut télécharger pour les pièces-jointes reçues (bug 825318.)
+
Écran d'accueil
+
Il est encore plus simple d'organiser et grouper du contenu sur l'écran d'accueil grâce à la nouvelle possibilité de grouper des applications (bug 1067435.)
+
Clavier
+
Les utilisateurs ont maintenant la possibilité de sélectionner du texte (appuyez et maintenez enfoncé pour sélectionner un mot, puis éditez la sélection avec les poignées fournies), coupez ou copiez le texte sélectionné vers le presse-papiers, et collez-en le contenu dans le texte affiché à la position actuelle.
+
+ +

Paramètres

+ +
+
Paramètres
+
Un nouveau menu  pour le filtrage d'appels a été ajouté aux paramètres (bug 910552.)
+
Vie privée
+
De nouveaux paramètres ont été ajoutés pour permettre à l'utilisateur d'ajuster les paramètres de confidentialité qui contrôlent le partage des données stockées sur le téléphone (désactivé par défaut) (bug 1083953.) Quand l'option est activée, voir Paramètres > Confidentialité navigation.
+
+ +

Nouvelles fonctionnalités des DevTools

+ +

Nous avons ajouté un bouton "Réinitialiser et activer les outils de développement" aux Paramètres Développeurs de Firefox OS pour donner de plus grandes permissions sur votre appareil — cela est important pour ceux d'entre-vous qui ne peuvent pas rooter leur appareil — cette option ne nécessite pas les privilèges root.

+ +
+

Note : Vous pouvez toujours trouver des détails sur les nouveaux outils de développement Firefox et sur ceux à venir en regardant dans la catégorie Mozilla Hacks Developer Tools.

+
+ +

Modifications de la plate-forme et ajouts en détail

+ +
+

Note : Notre présente liste comporte les fonctionnalités les plus importantes de Firefox OS. Pour une liste plus complète des ajouts aux caractéristiques générales de Gecko (qui sont en général également présentes dans Firefox OS 2.2), consultez les notes de version Firefox 35 pour développeurs, les notes de version Firefox 36 pour développeurs et les notes de version Firefox 37 pour développeurs.

+
+ +

Changements de l'API Web

+ + + +

Annonces de sécurité

+ +

Une liste complète des annonces de sécurité de Firefox OS 2.2 est disponible.

+ +

Anciennes versions

+ +

+ +

diff --git a/files/fr/archive/b2g_os/releases/2.5/index.html b/files/fr/archive/b2g_os/releases/2.5/index.html new file mode 100644 index 0000000000..387969b7ee --- /dev/null +++ b/files/fr/archive/b2g_os/releases/2.5/index.html @@ -0,0 +1,108 @@ +--- +title: Firefox OS 2.5 pour les développeurs +slug: Archive/B2G_OS/Releases/2.5 +tags: + - '2.5' + - Firefox OS + - Notes de version +translation_of: Archive/B2G_OS/Releases/2.5 +--- +
+

Cette page détaille les fonctionnalités développeurs nouvellement implémentées dans Gecko et qui sont spécifiques à Firefox OS 2.5, ainsi que les fonctionnalités du produit et des outils de développement, et d'autres points notables de cette nouvelle version.

+
+ +
+

Note : Le composant Gecko de Firefox OS 2.5 est basé sur celui de Firefox à partir de la version 38.

+
+ +

Fonctionnalités du produit

+ +

Cette section énumère différentes catégories de fonctionnalités nouvelles ou améliorées.

+ +

Nouvelles fonctionnalités systèmes

+ +
+
 
+
L'app Bugzilla Lite
+
Fournit la possibilité de signaler des bogues/demandes de fonctionnalités directement depuis l'appareil (bug 1180660.)
+
Modules
+
Fournit la possibilité de personnaliser l'expérience de l'utilisateur selon ses envies (bug 1180672.)
+
Écrans d'accueil remplaçables
+
L'utilisateur peut maintenant choisir entre plusieurs écrans d'accueil différents (bug 1180665.)
+
L'API Web Speech
+
Permet aux développeurs d'implémenter des applications qui peuvent être contrôlées par la voix (bug 1051148.)
+
Épinglage de la page web
+
Cette fonction permet de parcourir le web et d'épingler un site web sur l'écran d'accueil de sorte que les utilisateurs puissent avoir un accès facile et rapide aux contenus qui les intéressent (bug 1180669.)
+
Protection contre le pistage
+
Les utilisateurs peuvent à présent naviguer en sécurité sur le web sans être pistés (bug 1180674.)
+
Durée de démarrage et performances de l'appareil
+
Les régressions de performances/démarrage ont été éradiquées de Firefox OS 2.5, garantissant une bonne expérience dès l'allumage de l'appareil (bug 1180695, bug 1180696.)
+
Personnalisation après le premier démarrage
+
Les vendeurs d'appareils ont désormais la possibilité de proposer à leurs clients des applications de leur choix lors du premier démarrage (bug 1180707.)
+
Expérience RTL améliorée
+
Firefox OS 2.5 dispose d'un bien meilleur support des langues RTL, assurant ainsi un meilleur support des langues pour toute notre base d'utilisateurs (bug 1179459.)
+
Première implémentation de la nouvelle architecture de Gaia (NGA, soit New Gaia Architecture)
+
La première étape consiste à séparer les architectures frontend et backend des applications Gaia, ce qui permettra de nombreuses améliorations dans le futur (bug 1180716.)
+
Voir le code source
+
Quand l'appareil est en mode développeur, les utilisateurs peuvent directement voir dessus le code source des applications intégrées (bug 1188671.)
+
API Presentation
+
 Autorise le développeur à activer des contenus web pour accéder à des affichages externes de type présentation puis à les utiliser pour faire des présentations web (bug 1184073.)
+
 
+
+

Firefox OS TV–fonctionnalités spécifiques

+
+
Navigateur TV
+
 Support du facteur d'encombrement TV pour le navigateur de Firefox OS (bug 1190158.)
+
Intégration de Compte Firefox dans le Navigateur TV
+
 Permet aux utilisateurs des TV de synchroniser leurs marque-pages et historique via leur Compte Firefox dans le navigateur (bug 1194108.)
+
Récepteur de requête pour l'API Presentation
+
Permet aux TV sous Firefox OS de recevoir des URLs envoyées depuis d'autres appareils via des appels à l'API Presentation (bug 1205999.)
+
Métriques pour la TV
+
 Les métriques de Firefox OS sont maintenant activées pour le facteur d'encombrement TV (bug 1199319.)
+
+ +

Nouvelles fonctionnalités des DevTools

+ +
+

Note : Vous pouvez toujours trouver des détails sur les nouveaux outils de développement Firefox et sur ceux à venir en regardant dans la catégorie Mozilla Hacks Developer Tools.

+
+ +

Modifications de la plate-forme et ajouts en détail

+ +
+

Note : Notre présente liste comporte les fonctionnalités les plus importantes de Firefox OS. Pour une liste plus complète des ajouts aux caractéristiques générales de Gecko (qui sont en général également présentes dans Firefox OS 2.5), consultez les plus récentes notes de version de Firefox pour développeurs.

+
+ +

JavaScript

+ + + +

Changements de l'API Web

+ + + +

Bogues et régressions

+ +

Un appui long sur une image en mode édition provoque l'apparition d'un menu contextuel dont les options ne fonctionnent pas correctement à cause d'un sélecteur d'activité incorrect. Cette régression a été corrigée début octobre (voir bug 1198522.)

+ +

Annonces de sécurité

+ +

Aucune jusqu'à présent.

+ +

Anciennes versions

+ +

+ +

diff --git a/files/fr/archive/b2g_os/releases/index.html b/files/fr/archive/b2g_os/releases/index.html new file mode 100644 index 0000000000..3c4c86b0d5 --- /dev/null +++ b/files/fr/archive/b2g_os/releases/index.html @@ -0,0 +1,31 @@ +--- +title: Firefox OS developer release notes +slug: Archive/B2G_OS/Releases +tags: + - Firefox OS + - TopicStub +translation_of: Archive/B2G_OS/Releases +--- +

Notes de version de Firefox OS par version

+ +

Cette section fournit des articles couvrant chaque nouvelle version de Gaia et Gecko pour Firefox OS, expliquant quelles fonctionnalités ont été ajoutées et les bogues éliminés dans chaque mise à jour. Il existe également un tableau récapitulatif lié indiquant les API prises en charge par chaque version de Firefox OS.

+ +
+
    +
  1. Firefox OS 1.0.1 pour les développeurs
    2. +
  2. Firefox OS 1.1 pour les développeurs
    3. +
  3. Firefox OS 2.0 pour les développeurs
    4. +
  4. Firefox OS 2.1 pour les développeurs
    5. +
  5. Firefox OS 2.2 pour les développeurs
    6. +
  6. Firefox OS 2.5 pour les développeurs
    7. +
+
+ +

Autres informations complémentaires

+ +
+
Tableau de prise en charge de l'API Firefox OS
+
Répertorie les différentes API disponibles et les versions de Firefox qui les prennent en charge.
+
Permissions d'application
+
Répertorie les API hébergées, privilégiées et certifiées, ainsi que des informations sur les autorisations qu'elles doivent avoir définies dans le manifeste d'application de vos applications installables, telles que le nom de l'autorisation manifeste, le type d'application requis, la description, la propriété d'accès et l'autorisation par défaut.
+
diff --git a/files/fr/archive/b2g_os/resources/index.html b/files/fr/archive/b2g_os/resources/index.html new file mode 100644 index 0000000000..3023f24587 --- /dev/null +++ b/files/fr/archive/b2g_os/resources/index.html @@ -0,0 +1,101 @@ +--- +title: Ressources +slug: Archive/B2G_OS/Resources +tags: + - Firefox OS +translation_of: Archive/B2G_OS/Resources +--- +

Ressources pour hackers d'applications, produites par nos ateliers

+ +

Simulateur Firefox OS

+ +

Simulateur Firefox OS

+ +

https://developer.mozilla.org/fr/docs/Outils/Simulateur_Firefox_OS/
+ https://addons.mozilla.org/fr/firefox/addon/firefox-os-simulator/

+ +

Développer/installer une app

+ +

Firefox OS Boilerplate App (travail en cours)

+ +

https://github.com/robnyman/Firefox-OS-Boilerplate-App
+ http://robnyman.github.com/Firefox-OS-Boilerplate-App/
+
+ (version basique avec bouton Install, Web Activities, exemples de WebAPI, support hors-ligne facultatif etc)

+ +

Code pour version avec app empaquetée :

+ +

https://github.com/robnyman/Firefox-OS-Boilerplate-App/tree/packaged-app

+ +

FxOSStub (modèle/design pour une app avec un bouton Install) :

+ +

https://github.com/Jaxo/fxosstub
+
+     Recommandé : à héberger sur votre propre serveur ou via des pages GitHub   
+     (http://pages.github.com/). Exemple sur http://robnyman.github.com/Firefox-OS-Boilerplate-App/

+ +

Mortar :

+ +

https://hacks.mozilla.org/2013/01/writing-web-apps-quickly-with-mortar/

+ +

Design patterns :

+ +

https://marketplace.firefox.com/developers/docs/patterns

+ +

Charte graphique de Firefox OS  :

+ +

https://t.co/I9VaxvBu
+
+ droid@screen : http://blog.ribomation.com/droid-at-screen/

+ +

WebAPIs

+ +

WebAPIs en version 1 :

+ +

https://wiki.mozilla.org/WebAPI

+ +

Documentation des APIs et leur statut :

+ +

https://developer.mozilla.org/fr/docs/MDN/Doc_status/API

+ +

Diaporama de Robert sur les Web APIs

+ +

http://www.slideshare.net/robnyman/web-apis-apps-mozilla-london

+ +

Writing (good) Webapps :

+ +

http://jlongster.github.com/writing-webapps/

+ +

Firefox Marketplace & Developer Hub

+ +

Rapporter un bogue à propos de Marketplace !

+ +

https://bugzilla.mozilla.org/enter_bug.cgi?product=Marketplace&component=General

+ +

Developer Hub

+ +

https://marketplace.firefox.com/developers/

+ +

Liste de diffusion WebApps

+ +

https://lists.mozilla.org/listinfo/dev-webapps

+ +

Serveur de développement Marketplace (s'attendre à des bogues !)

+ +

http://marketplace-dev.allizom.org/

+ +

Apps de référence (Chrono, Face Value, Roller) :

+ +

https://marketplace.firefox.com/developers/docs/apps/chrono

+ +

WebPayments

+ +

https://wiki.mozilla.org/WebAPI/WebPayment
+ https://wiki.mozilla.org/WebAPI/WebPaymentProvider

+ +

Pitfalls and helpers for mobile Web apps

+ +

Diaporama de Rob Pitfalls and Helpers

+ +

http://www.slideshare.net/robhawkes/mobile-app-development-pitfalls-helpers
+  

diff --git a/files/fr/archive/b2g_os/running_tests_on_firefox_os_for_developers/index.html b/files/fr/archive/b2g_os/running_tests_on_firefox_os_for_developers/index.html new file mode 100644 index 0000000000..7219ca4082 --- /dev/null +++ b/files/fr/archive/b2g_os/running_tests_on_firefox_os_for_developers/index.html @@ -0,0 +1,90 @@ +--- +title: 'Running tests on Firefox OS: A guide for developers' +slug: Archive/B2G_OS/Running_Tests_on_Firefox_OS_for_Developers +translation_of: Archive/B2G_OS/Running_Tests_on_Firefox_OS_for_Developers +--- +
+

Les équipes behind our automation harnesses have been working hard to expand our automated testing infrastructure to accomodate Firefox OS as well as writing new harnesses to specifically target testing a phone OS rather than a browser (which our old harnesses were specialized for). Due to the architecture of Firefox OS all these test harnesses will work and will apply, but that also makes things rather complicated and you are a developer and just want to run some tests to see if your patch worked or not. This article aims to make sense of all the available testing resources at Mozilla.

+
+ +

Getting started

+ +

If you are a Gecko developer, then you should review the Firefox OS-specific documentation for the test automation you are already familar with: mochitest, reftest, and xpcshell.

+ +

If you are a Gaia or App developer, or if you're a Gecko developer interested in doing a deeper "end user" style test where you actually exercise the OS, then you'll need to look into the Gaia test suites. There are two primary test suites:

+ + + +

Which one you choose really depends on your preferred toolchain, and what things you want to test.

+ +

Let's now move and look at running these tests.

+ +

Running the Gaia UI Tests

+ +

The Gaia UI Test suite can be run on real devices and B2G Desktop builds, but in this section we'll concentrate on running them on a real device, as real devices are always best where possible.

+ +

Note that this test is destructive and as such, you should back up anything you care about on the phone before running these tests. Depending on which tests you run, they can also make phone calls. So be aware that you want to be very careful about what you run and how you back up the phone, remove the SIM card, etc.  That said, if you've already created an engineering build they are really easy to get running. Here's how.

+ +

One Time Set up

+ +

You only need to perform the following steps once, assuming you do not change the location of your Gaia directory. Create a python virtualenv (install the virtualenv tool first if you haven't already), activate it, and install the gaia UI test tool into your virtualenv. By creating the virtual environment using the steps below, you ensure that you are running the gaia UI test harness code that lives in your Gaia repo (that's useful in case you need to debug anything).

+ +
$ virtualenv gaia_ui_venv # This will create a gaia_ui_venv directory where the virtual environment lives. It can be anywhere on your system.
+$ source gaia_ui_venv/bin/activate # This activates our virtualenv
+(gaia_ui_venv)$ cd <b2groot>/gaia/tests/python/gaia-ui-tests;python setup.py develop # This installs the gaia ui harness into your virtual environment.
+ +

If you have already created a virtual environment for gaia ui tests, you can simply do the following:

+ +
$ source gaia_ui_venv/bin/activate
+ +

To Run the Tests

+ +

First you need to create the testvars file. To do this, copy the standard one over, and add in the attributes to turn off the warnings that this test will destroy all content on your phone. These are good tests, they leave no state around and as such, you will need to make sure your phone is backed up before running them. Instructions from here on will assume you've activated the virtual environment and are working in the gaia/tests/python/gaia-ui-tests directory.

+ +
(gaia_ui_venv)$ cp gaiatest/testvars_template.json testvars.json
+# Now edit your copy of testvars.json and add in the following attributes into the json:
+"acknowledged_risks": true,
+"skip_warning": true,
+ +

Now you just need to connect our phone via USB, forward the marionette port so your test runner can access it and run our tests. The tests are in gaiatest/tests and you can pick whichever one you want to run. For example, if you wanted to run contacts tests you would do the following:

+ +
(gaia_ui_venv)$ adb forward tcp:2828 tcp:2828
+(gaia_ui_venv)$ gaiatest --testvars=testvars.json --address=localhost:2828 gaiatest/tests/functional/contacts/
+ +
+

Note: To find out what UI tests are available, browse through the gaiatest directories inside the Gaia repo.

+
+ +

To get out of the python virtualenv, just use the special virtualenv command deactivate:

+ +
(gaia_ui_venv)$ deactivate
+$
+ +
+

Note: To learn more about the Gaia UI Tests and find more detailed information, move on to the Gaia UI Tests pages.

+
+ +

Running the Gaia Integration tests

+ +

To run the Gaia Integration tests tests you currently have to use a B2G Desktop build (note that these are also going to be available for devices soon as well). Let's look at how this is done.

+ +

These just require a Gaia tree and NodeJS to be installed on your computer; the following command will do the rest:

+ +
$ cd gaia $ make test-integration
+ +

That's it — this instruction will download a B2G desktop build, and start running the tests in that build.

+ +
+

Note: To learn more about Gaia Integration Tests, read the Gaia Integration Tests Github repo.

+
+ +
+

Note: To find out what integration tests are available, look in the apps directory in the Gaia repo; integration tests can be found in test/marionette/ subfolders.

+
+ +

Wrapping Up

+ +

As always, work is underway to make all our tests easier to run both locally for developers as well as in our automation systems. Feel free to drop into the #ateam channel any time you have questions about test automation for Firefox OS or any of the Mozilla automation tools.

diff --git a/files/fr/archive/b2g_os/samsung_nexus_s/index.html b/files/fr/archive/b2g_os/samsung_nexus_s/index.html new file mode 100644 index 0000000000..a23dbdacbc --- /dev/null +++ b/files/fr/archive/b2g_os/samsung_nexus_s/index.html @@ -0,0 +1,61 @@ +--- +title: Samsung Nexus S +slug: Archive/B2G_OS/Samsung_Nexus_S +tags: + - B2G + - Firefox OS + - NexusS + - Samsung + - nexus_s +translation_of: Archive/B2G_OS/Phone_guide +--- +

Le Nexus S est une plate-forme de second rang (tier 2) pour Firefox OS. Ce n'est pas une cible, mais il y a du support pour le processus de construction. Toute aide pour supporter cet équipement est la bienvenue. Notez qu'à partir de mi-mars 2015, il n'est plus utilisé activement ni maintenu.

+ +

Compatibilité

+ +

Les équipements i9020, i9020A, i9023 et SHW-M200k sont connus pour fonctionner. Une liste complète de problèmes relatifs au support de cet équipement est disponible à cette adresse : https://bugzilla.mozilla.org/show_bug.cgi?id=b2g-nexuss.

+ +

Utilisabilité (jusqu'à v1.1)

+ +

Le téléphone devrait être utilisable au quotidien sans problème bloquant. Jusqu'ici, voici ce qui doit correctement fonctionner en construisant un système Gecko 18 (BRANCH=v1-train ./config.sh nexus-s) :

+ + + +

Utilisabilité (master, depuis v1.4/2.0)

+ +

La plupart des fonctionnalités doivent marcher. La lecture et l'enregistrement vidéo ne fonctionnent pas complètement.

+ +

Problèmes à l'exécution

+ +

WiFi Tethering

+ +

Le WiFi Tethering fonctionne, mais il semble que le Wifi soit indisponible après l'avoir désactivé. Décharger puis recharger le pilote noyau Wifi ou redémarrer l'appareil permettent de contourner ce problème.

+ +
rmmod bcm4329 && insmod /system/modules/bcm4329.ko iface_name=wlan0
+ +

Dépôts de modifications

+ +

Utilisez la branche gecko-18-local (et gecko-18-local+hd) pour le dépôt mozilla-central, master-local pour les autres.

+ + + +

Plus d'informations

+ +

Vous trouverez un fil de discussion à propos de Firefox OS sur le Nexus S ici http://forum.xda-developers.com/showthread.php?t=1924367. Il devrait contenir des images relativement à jour et fonctionnelles.

diff --git a/files/fr/archive/b2g_os/screencast_series_colon__app_basics_for_firefox_os/index.html b/files/fr/archive/b2g_os/screencast_series_colon__app_basics_for_firefox_os/index.html new file mode 100644 index 0000000000..8e65a0d478 --- /dev/null +++ b/files/fr/archive/b2g_os/screencast_series_colon__app_basics_for_firefox_os/index.html @@ -0,0 +1,226 @@ +--- +title: 'Screencast series: App Basics for Firefox OS' +slug: 'Archive/B2G_OS/Screencast_series:_App_Basics_for_Firefox_OS' +tags: + - API + - Apps + - B2G + - Firefox OS + - Marketplace + - Videos +translation_of: 'Archive/B2G_OS/Firefox_OS_apps/Screencast_series:_App_Basics_for_Firefox_OS' +--- +
+

Firefox OS est un système d'exploitation qui apporte les technologies du Web aux smartphones. Au lieu d'être un nouvel OS avec de nouvelles technologies et des environnements de développements, il est construit sur des technologies web standardisées utilisées depuis des années. Si vous êtes un développeur web et que vous voulez coder une application mobile, Firefox OS vous donne les outils pour le faire, sans devoir changer votre workflow ou apprendre à utiliser un nouvel environnement de développement. Dans cette collection de petites vidéos, les développeurs de Mozilla et de Telenor se sont rencontrés à Oslo, en Norvège pour expliquer en quelques étapes comment vous pouvez commencer à coder des applications pour Firefox OS.

+
+ +

Dans cette série vous apprendrez:

+ + + +
+

Note: Chacune des vidéos est assez courte pour être regardée durant une courte pause; la série entière se regarde en moins d'une heure.

+
+ +

Code et environnement de développement
+  

+ +

En plus des vidéos, vous pouvez télécharger les exemples de codes depuis GitHub. Si vous voulez essayer les exemples vous-même, vous devrez mettre en place un environnement de développement simplifié. Vous aurez besoin de:

+ + + +

Introduction

+ +

Interviennent dans cette série Jan Jongboom (@janjongboom) et Sergi Mansilla (@sergimansilla) de Telenor Digital, de Chris Heilmann (@codepo8) de Mozilla; cette série a été tournée en trois jours à Oslo, en Norvège au siège social de Telenor, en février 2014.

+ +

Voici les trois d'entre nous qui vous parleront de cette série et ce à quoi vous attendre:

+ +

+ +

Section 1: Construire sa première application Firefox OS et la publier

+ +

Dans les cinq captures vidéos de la Section 1 nous vous montrons comment construire une application Firefox OS, comment la déboguer et la tester sur votre ordinateur — ainsi que sur un vrai appareil, et comment la mettre sur le Marketplace Firefox. Cela peut sembler être une charge de travail fastidieuse mais vous découvrirez bien assez vite que si vous savez déjà comment construire un site web, vous avez déjà accompli 90% du travail.

+ +

Plus qu'un site web

+ +

Les applications Firefox OS sont des applications HTML5. Par définition, elles utilisent les même technologies que les sites web. Vous pouvez commencer à écrire un site web et le transformer en application simplement en lui rajoutant un fichier manifeste (voir manifeste d'application pour plus de détails). Ce dernier dit à Firefox OS que vous écrivez une application et vous permet de:

+ + + +

Par essence, les applications HTML5 sont des sites web suralimentées et devraient suivre les mêmes règles, comme:

+ + + +

La principale différence est que pour qu'un site web devienne une bonne application, vous devriez vraiment prendre en compte les utilisateurs mobile. Cela signifie tout d'abord que votre application devrait:

+ + + +

Dans beaucoup de cas, cela signifie que vous devriez faire amincir votre page web et simplifier l'interface. La bonne nouvelle est que tous les utilisateurs en bénéficieront.

+ +

+ +
+

Note: Pour en apprendre plus sur le design d'une bonne application HTML5, regardez du coté de la page Applications [fr].

+
+ +

Le manifeste d'application

+ +

Le manifeste d'application dans Firefox OS est un simple fichier JSON qui donne des informations au système d'exploitation sur votre application. C'est lui qui transforme une page web en application web ouverte. Dans celui-ci, vous allez définir le nom et demander au système d'exploitation d'avoir accès à plusieurs services et au matériel. Vous pouvez aussi définir l'orientation apropriée pour votre application et si besoin, la verrouiller.

+ +

+ +

Plus d'informations sur le manifeste et les outils qui peuvent vous aider:

+ + + +

Le Gestionnaire d'application

+ +

La façon la plus simple de commencer avec Firefox OS est d'utiliser le gestionnaire d'applications. Cet outil fait parti des outils de développement de Firefox pour pc et vous permet de vous connecter à un émulateur de Firefox OS tournant sur votre ordinateur, ou sur un véritable appareil Firefox OS si vous en possédez un. De là, vous pouvez jouer avec Firefox OS, installer des applications directement sur l'émulateur ou sur un vrai appareil, et les déboguer pendant qu'elle tournent sur Firefox OS. Ceci permettra de voir immédiatement les changements sans réinstaller ou mettre à jour les applications.

+ +

La vidéo suivante montre les premiers pas avec le Gestionnaire d'application dans l'émulateur:

+ +

+ +
+

Note: Le Gestionnaire d'application vous permet de déboguer sans problème vos applications même si vous êtes hors-ligne

+
+ +

Pour plus d'informations sur le Gestionnaire d'application:

+ + + +

L'essayer sur votre appareil

+ +

Tester vos applications sur l'émulateur c'est bien, mais vous ne pourrez pas dépasser les limites de l'environnement d'émulation. Si vous voulez tester les performances d'interaction de votre appareil, ou le faire réagir à l'orientation, vous aurez besoin d'un vrai appareil. Avec le Gestionnaire d'application et les outils de développements, vous pouvez regarder en détail ce qu'il se passe dans votre application sur votre appareil pendant son utilisation.

+ +

+ +

Publier sur le Marketplace

+ +

Le Marketplace de Firefox OS est l'endroit qui convient le mieux pour ajouter votre application dans la liste et la rendre accessible aux autres personnes et à leur appareil ainsi que sur le Web. Le Marketplace vous permet aussi de mettre à disposition votre application sur d'autres plateformes comme Firefox Desktop et Firefox pour Android. Vous pouvez aussi permettre aux utilisateurs de noter votre application, vous donner des retours d'utilisation, et acheter votre application en utilisant un simple processus de vérification. Rajouter votre application est très simple:

+ + + +

+ +

Les applications soumises au Marketplace sont verifiées par l'équipe de vérification d'applications de Mozilla et vous serez notifié de l'état de votre soumission d'application dans les jours qui suivent. S'il y a des problèmes avec votre application vous recevrez un message durant la période de validation mais il se peut aussi que vous receviez des explications humaines de ce qui ne va pas et comment les réparer.

+ +
+

Note: Lisez Proposer une application sur le Firefox Marketplace pour plus d'informations sur le processus de soumission d'application.

+
+ +

Section 2: Sujets avancés du Firefox OS

+ +

Dans les première vidéos nous vous avons présenté Firefox OS et comment construire votre première application. Nous avons aussi expliqué comment déboguer votre application sur le pc, sur un vrai appareil et comment le proposer sur le Marketplace Firefox. Dans les cinq vidéos restantes nous allons aller plus loin dans l'explication des technologies qui permettent aux applications Firefox OS de gagner en puissance et vous donner accès aux fonctionnalités qui rendent le développement sur un smartphone ou une tablette intéressant pour les développeurs. Bien que certaines de ces technologies soient en cours de travaux sur le Firefox OS, elles sont toutes open-source et soumises aux standards. Travailler avec ces APIs aujourd'hui signifie que vous êtes prêt pour les prochains appareils et plateformes à venir.

+ +

APIs Web

+ +

Les smartphones contiennent de puissantes technologies: cameras, accéléromètre et un GPS pour ne nommer qu'eux. Le problème est que celles-ci n'étaient pas accessible par les technologies web, mais en créant des applications natives. Pour réparer cela, Mozilla et ses partenaires ont définit des APIs pour permettre aux développeurs de contrôler le matériel des appareils mobiles en utilisant le JavaScript de manière sécurisée. Elles sont appelées les Web APIs, elles sont libres et peuvent être implémentées. Firefox OS est la première plateforme qui les utilisent, la vidéo suivante vous en dira plus:

+ +

+ +

Plus d'informations sur les Web APIs:

+ + + +

Web Activities

+ +

Web Activities sont une alternative pour accéder au matériel d'un appareil. Au lieu d'utiliser une API pour communiquer directement avec l'appareil, les Web Activities vous permettent de créer un écosystème d'applications sur votre appareil qui communiqueront et partageront leur fonctionnalités. Par exemple, au lieu d'essayer d'accéder à la caméra directement, votre application peut utiliser une Web Activity pour demander une image et l'utilisateur utilisera son application favorite pour prendre une photo, qui sera ensuite envoyée à l'application correspondante.

+ +

Au lieu de demander aux utilisateurs l'accès à leur matériel (ce qui, en terme de sécurité est important) vous leur permettrez d'utiliser les applications auxquelles ils font déjà confiance pour s'occuper de ces fonctionnalités. Mieux encore, vous pouvez enregistrer votre application pour accomplir certaines tâches dans le système d'exploitation. Vous pouvez comparer les Web Activities à un Clic droit sur un fichier sur votre ordinateur et choisir quelle application utiliser pour ouvrir le fichier. Vous avez accès à plusieurs choix dont une pour demander au système d'exploitation de toujours utiliser cette application pour ouvrir ce type de fichier.

+ +

Les Web Activities permettent aux application de communiquer entre-elles, sur l'appareil, sans nécessiter de serveur entre. Tout ce qu'elles transmettent d'une application à l'autre sont les données finales.

+ +

+ +

Plus d'informations sur les Web Activities:

+ + + +

Push Notifications

+ +

Les Push Notifications, appelées en utilisant l'API Web SimplePush, sont un moyen de réveiller les applications quand un appareil reçoit un certain message. Cela vous permet de créer des applications qui peuvent rester éteintes, et donc qui économisent de la batterie, jusqu'à ce que vous en ayez besoin. Utiliser les notifications ainsi a aussi l'avantage de ne pas transporter de données. Ainsi Mozilla n'obtiendra jamais d'informations sur votre application et des attaquants potentiels ne pourront pas observer l'application.

+ +

+ +

Plus d'information sur les Push Notifications utilisant SimplePush:

+ + + +

Fonctionnalités hors-ligne

+ +

Les applications ne sont que peu utilisées si elles ne fonctionnent pas hors-ligne. C'est pourquoi la plupart des utilisateurs préfèrent les appliations installées plutôt que d'ouvrir un navigateur et regarder du contenu sur leur navigateur web mobile. Le nom "application web" sous-entend même qu'il faut avoir une connexion pour pouvoir l'utiliser. Nos utilisateurs seront hors-ligne parfois (dans un avion, dans un métro, là où il n'y a pas de connexion vers leur carte SIM) et nous devons nous assurer que nos applications resteront utilisable quand ça arrivera. HTML5 propose plusieurs technologies qui proposent des fonctionnalités hors-ligne, principalement AppCache et DOMStorage.

+ +

+ +

Plus d'informations sur les fonctionnalités hors-ligne:

+ + + +

Où en trouver plus

+ +

Nous espèrons que cette série de vidéos vous aura donné une introduction claire pour construire vos premières applications web ouvertes. Si vous voulez en savoir plus, il existe quelques sources supplémentaires que vous pouvez regarder:

+ +

+ + + +

En espérant vous voir par ici,

+ +

Chris, Sergi et Jan

diff --git a/files/fr/archive/b2g_os/securite/application_security/index.html b/files/fr/archive/b2g_os/securite/application_security/index.html new file mode 100644 index 0000000000..07b15909b5 --- /dev/null +++ b/files/fr/archive/b2g_os/securite/application_security/index.html @@ -0,0 +1,224 @@ +--- +title: La sécurité des applications +slug: Archive/B2G_OS/securite/Application_security +tags: + - Apps + - Firefox OS + - Guide + - Mobile + - Security +translation_of: Archive/B2G_OS/Security/Application_security +--- +
+

Cet article explique en détail le modèle de sécurité des applications Firefox OS.

+
+ +

Les contrôles de sécurité d'applications web introduites dans Firefox OS sont les suivants :

+ + + +

Types d'applications

+ +

Firefox OS supporte trois types d'applications : web, privilégiée et certifiée. Le type d'application est déclaré dans le manifeste d'application et indique la liste des permissions que chaque application peut demander.

+ + + +
+

Note : Pour plus de détails sur les différents types d'applications, voir la documentation du manifeste d'application.

+
+ +

Mettre une application à disposition

+ +

Sous Firefox OS, les applications peuvent être mises à disposition de deux façons différentes : hébergées ou empaquetées. Les applications web classiques peuvent être mises à disposition via deux mécanismes, les applications privilégiées et certifiées en revanche doivent être empaquetées.

+ +

Les applications hébergées

+ +

Une application hébergée est constituée uniquement d'un fichier manifeste sur le serveur web du développeur, qui contient un launch_path pour indiquer quelles pages doivent figurer lorsque l'application est lancée. D'un point de vue de la sécurité, les applications hébergées fonctionnent presque comme des sites web normaux. Lorsqu'une application hébergée est chargée, se sont les URL « normales » de ces pages, qui sont chargées. Elles sont chargées depuis le serveur web, ou depuis l'appareil si elles étaient stockées dans un fichier cache.

+ +

Les applications empaquetées

+ +

Une application empaquetée est un application web ayant l'ensemble de ses ressources (HTML, CSS, JavaScript, manifeste et ainsi de suite) contenues dans un fichier zip (les ressources ne sont pas présentes sur un serveur web). Pour plus de détails sur ce format, voir la page sur les applications empaquetées.

+ +

Origine de l'application

+ +

Pour les applications hébergées, l'origine de l'application correspond à l'origine du manifeste de l'application.

+ +

Pour les applications empacketées, l'origine est affectée de façon unique à l'application lors de l'installation. Les applications privilégiées et certifiées peuvent également demander une origine spécifique en spécifiant le paramètre origin dans le fichier manifeste de l'application.

+ +

Installation de l'application

+ +

Les applications sont installées grâce à l'API JavaScript Apps  :

+ + + +

Afin de garantir qu'une application est bien installée comme une application web, il faut s'assurer que le site web ne trompe pas le mécanisme avec un manifeste d'application. Pour cela, on vérifie que le type MIME du manifeste servi est application/x-web-app-manifest+json. Cette restriction est levée lorsque le manifeste de l'application a la même origine que la page demandant l'installation de l'application.

+ +

Mise à jour

+ +

Le processus de mise à jour pour les applications est décrit à la page mise à jour des applications.

+ +

Autorisations

+ +

Les applications peuvent avoir des privilèges supplémentaires par rapport à ceux accordés aux sites web normaux. Par défaut, une application possède les mêmes autorisations qu'une page web normale. Afin d'obtenir des autorisations supplémentaires, il faut tout d'abord lister les autorisations nécessaires dans le manifeste :

+ +

Déclaration de manifeste

+ +

Pour chaque autorisation supplémentaire, le manifeste doit lister cette autorisation ainsi qu'une description lisible de la raison pour laquelle l'application souhaite accéder à cette autorisation. Par exemple, si une application souhaite utiliser l'API de navigator.geolocation, le manifeste devra contenir le fragment suivant :

+ +
"permissions": {
+  "geolocation":{
+    "description": "Required for autocompletion in the share screen",
+  }
+},
+
+ +

Cela permettra à l'application de demander la permission pour utiliser la géolocalisation (de la même manière qu'une page web). Pour plus de détails sur le fichier de manifeste, voir manifeste d'application.

+ +
+

Note : À l'heure actuelle, les descriptions des autorisations ne sont pas affichées : voir le bug 823385.

+
+ +

Accorder les permissions

+ +

Lorsque les autorisations sont demandées dans le manifeste, il y a deux modes pour activer les permissions : la demande ou l'activation par défaut. L'activation par défaut est mise en place grâce au manifeste, sans autre interaction. Les permissions demandées sont affichées lors de la première utilisation et l'utilisateur peut choisir d'autoriser ou non l'API. En général, Firefox OS ne demande les autorisations que si celles-ci ont un impact sur la vie privée et qu'il est pertinent que l'utilisateur sache pourquoi l'API est utilisée. Par exemple, l'application demandera une permission pour accéder aux contacts, mais l'établissement d'une connexion TCP brute est implicitement autorisé car ici, il n'est pas nécessaire que l'utilisateur fournisse son accord. Lorsque les applications sont revues pour être intégrées au Marketplace, l'utilisation des permissions est examinée afin d'assurer la protection des utilisateurs.

+ +

Révoquer les permissions

+ +

À tout moment, les utilisateurs peuvent changer d'avis sur les permissions qui auront été demandées. Pour révoquer une permission, il faut aller dans l'application Paramètres. En revanche, les permissions activées par défaut ne sont pas paramétrables.

+ +

Application web Sandbox

+ +

Stockage des données par application

+ +

Chaque application s'exécute dans une sandbox de façon indépendante, ce qui signifie que toutes les données stockées par une application sont séparées des données stockées par les autres applications. Parmi ces données, on retrouve les cookies, les données locales et les autorisations liées au site.

+ +

A diagram showing three Firefox OS apps all open is separate sandboxes, so none of them can affect each other.

+ +
+
Cela signifie que si l'utilisateur possède deux applications installées, Appli A et Appli B, ces applications ne partageront pas les cookies, les différentes données locales et les autorisations. Ceci s'applique également si ces deux applications ouvrent un <iframe> qui pointe vers la même origine. Par exemple, si Appli A et Appli B ouvrent un <iframe> pointant vers http://www.mozilla.org, elles iront toutes les deux sur ce site, mais ce dernier sera récupéré et servi avec des cookies distincts selon les deux applications.
+ +
 
+
+ +

Ainsi, si l'utilisateur se connecte sur Facebook avec l'Appli A, cela n'aura aucun impact sur l'utilisation de Facebook par l'Appli B. Le cookie de connexion entre Facebook et l'Appli A n'est disponible que pour l'Appli A. Si l'Appli B ouvre un <iframe> pour Facebook, le cookie ne sera pas disponible. C'est pourquoi, quand l'Appli B ouvre Facebook, elle affichera la page de connexion plutôt que le compte de l'utilisateur.

+ +

Une application ne peut en ouvrir une autre

+ +

Cela signifie que les applications ne peuvent pas ouvrir d'autres applications en utilisant les iframes. Si l'application A crée une <iframe> dont le src correspond à l'URL de l'application B, cela n'ouvrira pas l'application B dans l'<iframe>. Cela ouvrira uniquement le site web situé à cet emplacement. Elle n'utilisera aucun des cookies de l'application B et le comportement observé sera le même que si l'application n'était pas installée sur l'appareil de l'utilisateur.

+ +

Cela s'applique également aux applications empaquetées (voir ci-après pour plus d'informations). Si l'application A tente d'ouvrir l'application empaquetée B en utilisant un <iframe> dirigeant vers l'URL app:// de l'application B, celle-ci ne sera pas chargée. Cela provoquera une erreur 404 ou une autre erreur. Que l'application B soit installée ou non, cela échouera car l'application A ne peut pas détecter si l'application B est installée.

+ +
+
La même chose se produit si la frame de plus haut niveau de l'application A est dirigée vers une URL de l'application B. Pour chaque frame, le système connaît l'application ouverte, ainsi, toute tentative d'ouverture de l'application B depuis une frame de l'application A échouera comme décrit précédemment et l'application A ne pourra accéder à aucune des ressources de B.
+ +
 
+
+ +

Les raisons de ce fonctionnement

+ +

Cette approche possède des avantages et des inconvénients. Un des premiers inconvénients est le suivant : si l'utilisateur interagit avec le même site web à travers plusieurs applications, il devra se connecter à toutes les applications. De même, si un site web veut stocker des données localement et que l'utilisateur interagit avec ce site web parmi les différentes applications, les données vont ainsi se dupliquer pour chaque application. Cela peut poser problème lorsque le volume de données devient conséquent.

+ +
+
Le principal avantage de cette approche est qu'il s'agit d'un modèle plus stable. Il est impossible que plusieurs applications interagissent les unes avec les autres par un site tiers de manière inattendue. Par exemple, l'installation d'une application ne peut pas empêcher le fonctionnement d'une autre application. Quand une application est désinstallée, les données utilisées par une autre application ne peuvent pas être supprimées. De même, la désinstallation d'une application ne pourra poser aucun problème de dépendance pour une autre application.
+ +
 
+ +

Cela permet aussi de bénéficier d'une meilleure sécurité. Un utilisateur peut ainsi utiliser son application SuperRéseauSocial pour se connecter à Facebook sans se soucier du fait que l'application DessineMoiUnMouton puisse exploiter des données tierces grâce à d'éventuelles failles du site.

+
+ +

Cela permet aussi de bénéficier de certains avantages en ce qui concerne la vie privée. L'utilisateur peut ainsi installer l'application MonPartiPolitique en toute sécurité sans se soucier du fait que MonAppliProfessionnelle puisse détecter les nouvelles données.

+ +

Isolement des permissions

+ +
+
De façon analogue aux données, les permissions sont isolées les unes des autres. Ainsi si l'application A charge une page de http://maps.google.com et demande à l'utilisateur la permission d'utiliser la géolocalisation, que l'utilisateur autorise la page et choisit « oui, se souvenir de cette décision », cela signifie seulement que http: //maps.google com aura accès à la géolocalisation depuis l'application A. Si l'application B utilise la page http://maps.google.com, cette page n'aura pas accès à la géolocalisation sauf si l'utilisateur accorde à nouveau la permission.
+ +
 
+
+ +
+
De façon semblable au navigateur, les permissions sont isolées selon l'origine. Si l'application A est autorisée à utiliser l'API Geolocation, cela ne signifie pas que toutes les origines présentes dans l'application A pourront utiliser l'API. Par exemple, si l'application A ouvre une <iframe> vers http://maps.google.com, alors http://docs.google.com devra demander la permission à l'utilisateur pour pouvoir utiliser l'API de géolocalisation.
+ +
 
+
+ +

Sandbox pour l'API Browser

+ +

Pour sécuriser les applications qui ouvrent un grand nombre d'URL, comme les navigateurs, nous avons ajouté un indicateur (flag) browserContent. L'indicateur browserContent permet à chaque application d'avoir non pas un, mais deux bacs à sable (sandboxes) : un pour l'application elle-même et l'autre pour tout le contenu web ouvert par l'application.

+ +

Par exemple, si l'application monNavigateur est chargée depuis https://monnavigateur.com, les scripts et ressources seront chargées dans ce bac à sable, ils appartiennent à ce domaine.

+ +

Ensuite, si une page de l'application crée un <iframe mozbrowser>, une sandbox différente sera créée et utilisée pour cette <iframe>. Cette sandbox sera différente de la première. Ainsi, si cet <iframe> dirige vers https://monnavigateur.com, cela se traduira par l'utilisation d'autres cookies pour cet <iframe mozbrowser>. De même, le contenu à l'intérieur de la <iframe mozbrowser> verra des données locales différentes de celles correspondant à l'application.

+ +

Ceci s'appliquera également si l'application monNavigateur souhaite intégrer des fonctionnalités de Google Maps pour proposer des outils de navigation basés sur la géolocalisation. Ainsi, si l'application ouvre un <iframe> vers http://maps.google.com, il recevra un ensemble de cookies pour http://maps.google.com. Si l'utilisateur navigue alors à l'intérieur du <iframe mozbrowser> contenant http://maps.google.com, cela utilisera différents cookies et d'autres autorisations au niveau le plus haut de l'application.

+ +

Voici un autre scénario où cela peut être utile : l'application Yelp. Cette application permet d'ouvrir différents sites Internet de restaurants. En utilisant <iframe mozbrowser>, afin d'ouvrir le site du restaurant, l'application Yelp s'assure que le site web du restaurant ne contiendra pas d'<iframe> pointant vers l'application Yelp. En effet, si le site du restaurant pointe d'une certaine façon vers http://yelp.com, il « verra » le site web Yelp plutôt que l'application. Ainsi, il est théoriquement impossible que le site du restaurant attaque les données de l'application Yelp.

+ +

Résumé sur la sécurité des applications

+ +
+
Le tableau ci-dessous résume les différents types d'applications de Firefox OS et décrit le format, l'installation et les processus de mise à jour pour les applications web fonctionnant sur Firefox OS.
+ +
 
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Les types d'application web
TypeMise à dispositionModèle d'autorisationsInstallationMise à jour
WebHébergée ou empaquetéeLes permissions les moins sensibles qui ont le moins d'impact lorsqu'un contenu web non autorisé est exposéPeut être installée depuis n'importe où +
+
Peut être mis à jour de façon transparente pour l'utilisateur ou explicitement grâce au Marketplace, en fonction de l'emplacement où l'application a été installée et du mécanisme de livraison
+
+
PrivilégiéEmpaquetée ou signéeLes API privilégiées ont besoin d'une validation et d'une authentification de l'applicationDoit être installée depuis le MarketplaceMise à jour via un Marketplace de confiance, l'utilisateur est invité à approuver le téléchargement et l'installation des mises à jour
CertifiéEmpaquetée +
+
Les API puissantes et dangereuses ne sont pas disponibles pour les applications tierces
+
+ 		L'application est préinstallée sur l'appareilMise à jour uniquement dans le cadre des mises à jour du système
+ +
+

Note : Pour la version 1.0 de Firefox OS, bien que les applications web puissent être installées depuis n'importe quel site ou Marketplace, certaines applications privilégiées ne peuvent être installées que depuis le Marketplace de Mozilla. La gestion des autres Marketplace de confiance n'est pas encore finalisée.

+
+ +

 

diff --git a/files/fr/archive/b2g_os/securite/index.html b/files/fr/archive/b2g_os/securite/index.html new file mode 100644 index 0000000000..d57b968b65 --- /dev/null +++ b/files/fr/archive/b2g_os/securite/index.html @@ -0,0 +1,71 @@ +--- +title: Sécurité dans Firefox OS +slug: Archive/B2G_OS/securite +tags: + - Firefox OS + - Mobile + - Sécurité +translation_of: Archive/B2G_OS/Security +--- +

Les articles suivants sont relatifs à la sécurité de Firefox OS. Ceci inclut les fonctionnalités de sécurité liées au système, la sécurité des applications, les processus d'installation d'applications sécurisés...

+ + + + + + + + +
+

Documentation à propos de la sécurité dans Firefox OS

+ +
+
Le modèle de sécurité de Firefox OS
+
Un aperçu du modèle de sécurité de Firefox OS.
+
Sécurité du système
+
Détails des mécanismes de sécurité directement inclus dans Firefox OS.
+
Sécurité des applications dans Firefox OS
+
Un aperçu de la manière dont les applications sont sécurisées dans Firefox OS.
+
Installation et mise à jour sécurisée des applications
+
Comment Firefox OS installe et met à jour les applications de manière sécurisée.
+
Permissions logicielles dans Firefox OS
+
Un guide expliquant quelles sont les permissions requises par différents types d'applications pour qu'elles puissent réaliser certaines tâches.
+
 Déboguer et tester la sécurité avec Firefox OS
+
Ce guide vous montre les étapes basiques du test de la sécurité. De l'ouverture d'un débogueur JavaScript à distance pour mettre en place un proxy d'interception HTTP(S) contre une version ordinateur de Firefox OS.
+
+ +

Voir tout...

+ 		+

Obtenir de l'aide de la communauté

+ +

Si vous travaillez avec Firefox OS ou développez des applications que vous aimeriez voir fonctionner sur des appareils Firefox OS, des ressources communautaires sont à votre disposition !

+ + + +
    +
  • Posez votre question sur le canal IRC de Mozilla : #b2g
    • +
+ +

N'oubliez pas la netiquette pour poser vos questions…

+ + + + + +
+ +

 

+ +

+Firefox OS
diff --git a/files/fr/archive/b2g_os/securite/installing_and_updating_applications/index.html b/files/fr/archive/b2g_os/securite/installing_and_updating_applications/index.html new file mode 100644 index 0000000000..e133d1e6d2 --- /dev/null +++ b/files/fr/archive/b2g_os/securite/installing_and_updating_applications/index.html @@ -0,0 +1,89 @@ +--- +title: Installation et mise à jour d'applications +slug: Archive/B2G_OS/securite/Installing_and_updating_applications +tags: + - Apps + - Firefox OS + - Guide + - Installation + - Mise à jour +translation_of: Archive/B2G_OS/Security/Installing_and_updating_applications +--- +
+

Cet article constitue un guide sur le processus de mise à jour des application Firefox OS.

+
+ +

Vue d'ensemble de l'implémentation

+ +

Types d'applications

+ +

Il existe de base trois catégories d'applications qui peuvent être mises à jour en utilisant ce mécanisme :

+ +
+
Applications centrales
+
Les applications centrales (celles qui sont livrées comme faisant partie du système Firefox OS de base, comme Téléphone) sont empaquetées, certifiées, pré-installées et non supprimables. Elles ne peuvent être mises à jour que lors de la mise à niveau du système complet ou d'une mise à jour des couches Gonk et Gaia.
+
Applications installées par l'utilisateur
+
Les applications installées par l'utilisateur sont soit empaquetées, soit hébergées. La politique de mise à jour est le principal sujet de cet article.
+
Applications tierces pré-installées
+
Ces applications sont pré-installées par l'opérateur ou le fabricant, mais ne font pas partie du cœur du système d'exploitation de la plate-forme. Leur mise à jour est soumise aux mêmes règles et conventions que pour les applications installées par l'utilisateur.
+
+ +

Suppositions concernant les utilisateurs

+ +

Pour au moins les premières versions de Firefox OS, les hypothèses suivantes sont prises en compte à propos des utilisateurs :

+ + + +

Toutes ces conditions utilisateurs sont répandues dans beaucoup de pays, il paraît donc juste de faire de telles hypothèses. Notre objectif est d'essayer d'optimiser l'expérience utilisateur lors des mises à jour pour les personnes concernées par celles-ci. En général, ces suppositions n'auront pas d'impact négatif sur les utilisateurs qui disposent d'un accès WiFi rapide et pas cher.

+ +

Paramètres de conception technique

+ +

Cette section aborde quelques principes de conception pour l'implémentation des mises à jour d'applications dans Firefox OS :

+ + + +

Considérations pour les développeurs

+ +

Il y a plusieurs choses dont les développeurs doivent prendre en considération, compte-tenu du modèle de mise à jour des applications :

+ + + +

Expérience utilisateur

+ +

Principes de conception

+ +

Afin de bénéficier de la meilleure expérience utilisateur possible lors de la mise à jour des applications, quelques principes essentiels doivent être gardés à l'esprit :

+ + + +

Types de mises à jour

+ +

Il existe trois types basiques de mise à jour :

+ +
+
Manuel : individuel
+
Une mise à jour d'une unique application, à l'initiative de l'utilisateur
+
Manuel : lot
+
Une mise à jour de plusieurs applications en une seule fois, à l'initiative de l'utilisateur
+
Silencieuse
+
Une mise à jour en arrière-plan, automatisée
+
diff --git a/files/fr/archive/b2g_os/securite/security_model/index.html b/files/fr/archive/b2g_os/securite/security_model/index.html new file mode 100644 index 0000000000..77e0212528 --- /dev/null +++ b/files/fr/archive/b2g_os/securite/security_model/index.html @@ -0,0 +1,396 @@ +--- +title: Présentation de la sécurité de Firefox OS +slug: Archive/B2G_OS/securite/Security_model +translation_of: Archive/B2G_OS/Security/Security_model +--- +
+

Ce document donne un aperçu du cadre de la sécurité de Mozilla Firefox OS, qui est conçu pour protéger les appareils mobiles contre les menaces de la plateforme, des applications et des données. Dans le Firefox OS, Mozilla a mis en place un modèle de sécurité globale, intégrée et multicouche qui offre une protection best-of-breed contre les risques de sécurité pour les téléphones mobiles.

+
+ +

Sécurité de la plate-forme

+ +

La plate-forme Firefox OS utilise un modèle de sécurité multi-couches qui est conçu pour atténuer les risques d'exploitation à tous les niveaux. Une première ligne de contre-mesures combinée avec une stratégie de sécurité en profondeur offrent une protection complète contre les menaces.

+ +

L'architecture sécurisée

+ +

Le système d'exploitation Firefox OS connecte des applications Web au matériel sous-jacent. C'est une technologie de pile intégrée, composée des niveaux suivants:

+ +

+ + + +

Gecko est le contrôleur d'accès qui applique les politiques de sécurité destinées à protéger l'appareil mobile d'une mauvaise utilisation. La couche Gecko agit comme intermédiaire entre les applications web (à la couche Gaia) et le téléphone. Gonk offre des caractéristiques du matériel du téléphone mobile sous-jacent directement à la couche Gecko. Les applications Web accèdent à des fonctionnalités du téléphone mobile uniquement via les API Web, et seulement si Gecko permet la demande d'accès — il n'y a pas d'accès direct, pas de «porte arrière» dans le téléphone. Gecko applique des autorisations et empêche l'accès aux demandes non autorisées.

+ +

le déploiement du système

+ +

Firefox OS est livré installé sur un téléphone intelligent. L'image du système d'origine est créée par une source de confiance connue — habituellement le OEM (Original Equipment Manufacturer) de l'appareil — qui est responsable de l'assemblage, la construction, les tests et la signature numérique de l'emballage de distribution.

+ +

Les mesures de sécurité sont utilisées dans la pile de technologie. Les privilèges du système de fichiers sont appliqués par les listes de contrôle d'accès de Linux (les ACL). Les applications du système sont installées sur un support de stockage qui est en lecture seule (sauf pendant les mises à jour, quand il est temporairement en lecture-écriture); généralement il n'y a que les zones contenant le contenu de l'utilisateur qui peuvent être en lecture-écriture. Divers composants dans le matériel de l'appareil sont équipés de protections qui sont mises en œuvre par défaut en tant que pratique standard de l'industrie - les fabricants de puces, par exemple, employent des techniques de durcissement pour réduire les vulnérabilités. La plate-forme de base (Gecko et Gonk) est durcie pour renforcer sa défense contre les menaces potentielles, et les caractéristiques de durcissement du compilateur sont utilisées le cas échéant. Pour plus de détails, voir Runtime security.

+ +

Mises à jour de Système Sécurisé

+ +

Les mises à jour ultérieures et les correctifs de la plate-forme Firefox OS sont déployés en utilisant un processus Mozilla sécurisé qui garantit l'intégrité continue de l'image du système sur le téléphone mobile. La mise à jour est créée par une entité connue, une source de confiance - habituellement le OEM de l'appareil - qui est responsable de l'assemblage, la construction, les tests et la signature numérique du paquet de mise à jour.

+ +

Les mises à jour du système peuvent concerner tout ou une partie de la pile Firefox OS. Si des changements à Gonk sont inclus dans la mise à jour, cependant FOTA (Firmware Over The Air) est le processus d'installation utilisé. Les mises à jour FOTA peuvent également inclure toute autre partie de la pile de Firefox OS, y compris la gestion de l'appareil (FOTA, firmware / drivers), la gestion des paramètres (paramètres de Firefox OS), les mises à jour de sécurité, Gaia, Gecko, et d'autres correctifs.

+ +

Les mises à jour qui ne comportent pas Gonk peuvent être effectuées en utilisant la mise à jour de l'utilitaire système Mozilla. Firefox OS utilise le même framework de mise à jour, les mêmes processus et le même format Mozilla ARCHIVE (MAR) (utilisé pour les packages de mise à jour) que le produit Firefox Desktop.

+ +

Un service intégré dans la mise à jour — lequel peut être fourni par le fabricant — sur le téléphone mobile vérifie périodiquement les mises à jour système. Une fois un paquet système devient disponible et est détecté par le service de mise à jour, l'utilisateur est invité à confirmer l'installation. Avant que les mises à jour soient installées sur l'appareil mobile, le stockage de l'appareil est vérifié pour un espace suffisant pour appliquer la mise à jour, et la distribution est vérifiée pour:

+ + + +

Les mesures de sécurité suivantes sont utilisées au cours du processus de mise à jour:

+ + + +

Des contrôles rigoureux sont en mis place pour veiller à ce que la mise à jour est appliquée correctement sur le téléphone mobile.

+ +
+

Note: Pour plus d'informations sur la façon dont les mises à jour fonctionnent et comment créer et distribuer des mises à jour, lire Création et application des paquets de mise à jour de Firefox OS.

+
+ +

Securité des applications

+ +

Firefox OS utilise une stratégie de sécurité de défense en profondeur pour protéger le téléphone mobile des applications intrusives ou malveillantes. Cette stratégie utilise une variété de mécanismes, y compris les niveaux d'autorisation implicites basés sur un modèle de confiance de l'application, l'exécution en sandbox au moment de l'exécution, d'un accès au matériel sous-jacent du téléphone mobile uniquement par API, un modèle d'autorisation robuste, et les processus d'installation et de mise à jour sécurisé. Pour les détails techniques, faire référence à Application security.

+ +

Dans Firefox OS, toutes les applications sont des applications Web - programmes écrits en utilisant HTML5, JavaScript, CSS, les médias, et d'autres technologies Web ouvertes (les pages en cours d'exécution dans le navigateur ne sont pas visées; que les applications Web dans ce contexte). Parce qu'il n'y a d'application binaires  («natives») installées par l'utilisateur, tous les accès au système sont strictement effectués via les API Web. Même l'accès au système de fichiers ne se produit que par le biais des API Web et une base de données SQLite back-end - il n'y a pas d'accès direct entre les applications et les fichiers stockés sur la carte SD.

+ +

Firefox OS limite et fait respecter la portée des ressources qui peuvent être consultées ou utilisées par une application, tout en soutenant un large éventail d'applications avec différents niveaux d'autorisation. Mozilla a mis en place un contrôle serré sur ce type d'applications qui peuvent accéder aux API. Par exemple, seules les applications certifiées (livrées avec le téléphone) peuvent avoir accès à l'API de téléphonie.

+ +

Cela empêche une situation, par exemple, dans laquelle une application arbitraire tiers est installée, compose un numéro de téléphone pay-per-use (900 et 910), et engrange une grosse facture de téléphone cellulaire.

+ +

D'autres applications OEM pourraient cependant être sélectionnées pour avoir accès à l'API de téléphonie. Par exemple, un opérateur pourrait fournir une application de systèmes de gestion qui permet à un client de gérer sont compte, y compris la possibilité de téléphoner au service client ou le service d'aide de l'opérateur directement.

+ +

 

+ +

Applications approuvées et non approuvées

+ +

 

+ +

Firefox OS catégorise les applications selon les types suivants:

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
TypeNiveau de confianceDescription
CertifiéTrès fiableLes applications du système qui ont été approuvées par l'opérateur ou l'OEM (en raison de risques de corruption de l'appareil ou un risque pour la fonctionnalité critique). Les applications et services système uniquement; non destinées à des applications tierces.
+ Cette désignation est réservée à un petit nombre d'applications critiques. Exemples: SMS, Bluetooth, appareil photo, horloge système, la téléphonie et le numéroteur par défaut (pour que les services d'urgence soient toujours accessibles).
PrivilégiéFiableDes applications tierces qui ont été examinées, approuvées et signées numériquement par un marché autorisé.
Web (tout le reste)appliqueNon fiableContenu Web régulier. Comprend les applications installées (stockées sur le téléphone mobile) et des applications hébergées (stockées à distance, avec seulement une application manifeste stockée sur le téléphone mobile). Le manifeste pour les applications hébergées peut être obtenu grâce à un marché.
+ +

Le niveau de confiance d'une application détermine, en partie, sa capacité à accéder aux fonctionnalités de téléphone mobile.

+ + + +

Certaines opérations, telles que l'accès au réseau, sont supposées être une autorisation implicite pour toutes les applications. En général, plus l'opération est sensible (par exemple, composer un numéro de téléphone ou accéder à la liste de contacts), plus le niveau de confiance de l'application nécessaire pour l'exécuter est élevé.

+ +
+

Remarque: pour plus d'informations sur les API disponibles et leurs niveaux d'autorisation, consulter App permissions.

+
+ +

Principe de la Moindre partie de Permissions

+ +

Pour les applications Web, le framework de sécurité de Firefox OS suit le principe des moindres autorisations: commencer avec les autorisations minimales absolues, puis accorder sélectivement des privilèges supplémentaires que lorsque cela est nécessaire et raisonnable. Par défaut, une application commence avec de très faibles autorisations, ce qui est comparable au contenu Web non sécurisé. Si l'application effectue des appels API Web qui nécessitent des autorisations supplémentaires, il doit énumérer ces autorisations supplémentaires dans son manifeste (décrit plus loin dans ce document). Gecko envisagera d'accorder l'accès de l'API Web à une application que si les privilèges applicables sont priés explicitement dans son manifeste. Gecko accordera l'autorisation demandée uniquement si le type de l'application Web (certifiée, confiance, ou Web) est suffisamment qualifié pour l'accès.

+ +

Processus d'Examen pour Applications Privilégiés dans le Marché

+ +

Pour qu'une application devienne privilégée, le fournisseur de l'application doit la soumettre pour examen sur le Marketplace. Le Marketplace soumet l'application dans un processus de révision du code rigoureux: vérification de son authenticité et de l'intégrité, veiller à ce que les autorisations demandées sont utilisées aux fins indiquées (dans la justification de l'autorisation), vérifier que l'utilisation des autorisations implicites est appropriée, et de valider que toutes les interfaces entre le contenu de l'application privilégiée et contenu externe non privilégié ont les mesures d'atténuation appropriées pour prévenir des attaques d'élévation de privilèges. Le Marketplace a la responsabilité de veiller à ce que l'application web ne se comportera pas malicieusement avec les autorisations qu'il est accordée.

+ +

Après q'une application est passé cet examen, elle est approuvée pour utilisation, le manifeste de l'application est signé numériquement par le Marketplace, et il est disponible pour les utilisateurs mobiles. La signature garantit que, si la boutique en ligne a été en quelque sorte piratée, le pirate ne pouvait pas sortir avec l'installation de contenu arbitraire ou du code malveillant sur les téléphones des utilisateurs. En raison de ce processus de vérification, Firefox OS donne des applications privilégiées obtenues à partir du Marketplace un plus haut degré de confiance tous les jours que de contenu Web.

+ +

 

+ +
+

Remarque: pour en savoir plus à propos de Marketplace, y compris le marché de Firefox, aller à la zone du Marketplace.

+
+ +

 

+ +

Applications empaquetées et hébergées

+ +

Les applications pour Firefox OS peuvent être soit empaquetées (stockées sur le téléphone mobile) ou hébergées (stockées sur un serveur web distant, avec juste un manifeste stocké sur le téléphone mobile). Il ya quelques différences dans la façon dont la sécurité est gérée pour chaque. Néanmoins, les applications empaquetées et hébergées sont toutes deux soumises à l'application sandboxing, qui est décrite plus loin dans ce document.

+ +
+

Note: Vous pouvez en savoir plus sur les applications hébergées et empaquetées à Auto-publication d'application

+
+ +

Applications empaquetées

+ +

Une application empaquetée se compose d'un fichier ZIP contenant des ressources d'application (HTML5, CSS, Javascript, images, médias), ainsi que d'un manifeste qui fournit une liste explicite des actifs et leurs valeurs de hachage correspondant. Applications certifiées et privilégiées doivent être empaquetées parce que le manifeste de l'application doit être signé numériquement. Quand un utilisateur obtient une application incluse dans le paquet, le fichier ZIP téléchargé sur le téléphone mobile, et le manifeste est lu à partir d'un emplacement connu à l'intérieur du fichier ZIP. Pendant le processus d'installation, les actifs d'applications sont dignes de confiance et restent stockés localement dans le paquet. Toutes les autorisations explicites sont demandées lors de l'exécution, montrant à l'utilisateur les intentions d'utilisation des données de l'application, et sont persistées par défaut.

+ +

Pour faire référence à des ressources d'applications dans une application empaquetée, l'URL commence par app: en utilisant le format suivant:

+ +

app://identifier/path_within_zipfile/file.html

+ +

où app:// représente le point de montage du fichier ZIP, et l'identifiant est un UUID qui est généré lorsque l'application est installée sur le téléphone mobile. Ce mécanisme garantit que les ressources appelées avec app:URL contenues dans le fichier ZIP. Le chemin au sein d'une app: est relative, donc des liens relatifs à des ressources dans le fichier ZIP sont autorisés.

+ +

Alors que les applications empaquetées sont principalement destinées à être utilisées pour les applications certifiées ou privilégiées, les applications web régulières peuvent aussi être empaquetées. Cependant, elles ne gagnent pas d'augmentation de l'accès en confiance ou autorisations simplement parce qu'elles sont empaquetées.

+ +

Applications hébergées

+ +

Les applications hébergées sont situées sur un serveur Web et chargées via HTTP. Seulement le manifeste de l'application est stocké sur le téléphone mobile. Tout le reste est stocké à distance. Certaines APIs sont disponibles uniquement aux applications privilégiées et certifiées, ce qui nécessite que l'application soit empaquetée en raison des exigences de signature. Par conséquent, une application hébergée n'aura pas accès à l'une des API Web qui nécessitent un statut d'application privilégiée ou certifiée.

+ +

Du point de vue de la sécurité, des applications hébergées fonctionnent très bien comme des sites Web normaux. Une application hébergée est chargée en invoquant un codage en dur, URL pleinement qualifiée qui pointe vers la page de démarrage dans le répertoire racine de l'application sur le serveur Web. Une fois une application hébergée est chargée, le téléphone mobile pointe vers des pages en utilisant les mêmes URL qui sont utilisées lors de la navigation sur le site web.

+ +

Manifeste d'une Application

+ +

Le manifeste d'une application Open Web contient des informations dont le navigateur Web a besoin pour interagir avec une application. Un manifeste est un fichier JSON avec (au moins) un nom et une description pour l'application. Pour plus de détails, reportez-vous à FAQs about app manifests.

+ +

Exemple de Manifeste

+ +

Les lignes de code suivantes montrent un exemple de manifeste avec les réglages de base seulement:

+ +
{
+  "name": "My App",
+  "description": "My elevator pitch goes here",
+  "launch_path": "/",
+  "icons": {
+    "128": "/img/icon-128.png"
+  },
+  "developer": {
+    "name": "Your name or organization",
+    "url": "http://your-homepage-here.org"
+  },
+  "default_locale": "en"
+}
+ +

Paramètres de sécurité dans le Manifeste de l'Application

+ +

Le manifeste peut également contenir d'autres paramètres, y compris les paramètres de sécurité suivants:

+ +

 

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
+

Champs

+ 		+

Description

+
+

permissions

+ 		+

Permissions requises par l'application. Une application doit énumérer toutes les API Web qu'elle entend utiliser qui nécessite l'autorisation de l'utilisateur. La plupart des autorisations ont du sens pour les applications privilégiées ou des applications certifiées, mais pas pour les applications hébergées. Propriétés par API:

+ +
    +
  • Description: Une chaîne spécifiant l'intention derrière la demande d'utilisation de cette API. Requis
    • +
  • Accès: Une chaîne spécifiant le type d'accès requis pour l'autorisation. Les autorisations implicites sont accordées lors de l'installation. Requis pour seulement quelques API. Les valeurs acceptées: read, readwrite, readcreate, et createonly.
    • +
+
+

installs_allowed_from

+ 		+

L'origine de l'application; peut être au singulier ou un tableau des origines (scheme+unique hostname) qui sont autorisés à déclencher l'installation de cette application. Permet aux fournisseurs d'applications de restreindre les installations à partir de seulement l'autorisation du Marketplace (https://marketplace.firefox.com/).

+
+

csp

+ 		+

Content Security Policy (CSP). Appliquée à toutes les pages chargées dans l'application. Utilisé pour durcir l'application contre les bugs qui pourraient permettre à un attaquant d'injecter du code dans l'application. Si non spécifié, les applications privilégiées et certifiées ont des réglages système par défaut. Syntaxe:
+ https://developer.mozilla.org/en-US/docs/Apps/Manifest#csp

+ +

Notez que cette directive ne peut augmenter le CSP appliqué. Vous ne pouvez pas l'utiliser, par exemple, de réduire le CSP appliqué à une application privilégiée.

+
+

type

+ 		+

Type d'application (web, privilegiée, or certifiée).

+
+ +

 

+ +

Firefox OS exige que le manifeste soit servi avec un type mime spécifique (application / x-web-app-manifeste + JSON) et à partir du même nom d'hôte pleinement qualifié (origine) à partir de laquelle l'application est servie. Cette restriction est assouplie lorsque l'application manifeste (et donc l'application manifeste) est de la même origine avec la page qui a demandé l'application à installer. Ce mécanisme est utilisé pour assurer qu'il est impossible de tromper un site Web en accueillant un manifeste d'application.

+ +

 

+ +

Exécution sandbox

+ +

 

+ +

Cette section décrit l'application et l'exécution sandboxes.

+ +

Application Sandbox

+ +

Le framework de sécurité de Firefox OS utilise sandboxing comme une stratégie de défense en profondeur pour atténuer les risques et protéger le téléphone mobile, la plate-forme, et les données. Sandboxing est une façon de mettre les frontières et les restrictions autour d'une application en cours d'exécution. Chaque application fonctionne dans son propre espace de travail et a uniquement accès aux API Web et les données dont elle a l'accès, ainsi que les ressources associées à cet espace de travail (bases de données IndexedDB, biscuits, stockage en mode déconnecté, et ainsi de suite).

+ +

La figure suivante donne un aperçu de ce modèle de sécurité.

+ +

 

+ +

 

+ +

+ +

 

+ +

En isolant chaque application, son impact est contenue dans son propre espace de travail et ne peut pas interférer avec quoi que ce soit (comme d'autres applications ou leurs données) en dehors de cet espace de travail.

+ +

Execution Sandbox

+ +

B2G (Gecko) s'exécute dans un processus de système hautement privilégiée qui a accès à des fonctionnalités matérielles dans le téléphone mobile. A l'exécution, chaque application fonctionne à l'intérieur d'un environnement d'exécution qui est un processus enfant du processus système de B2G. Chaque processus enfant a un ensemble restreint de privilège OS - par exemple, un processus enfant ne peut pas lire ou écrire des fichiers arbitraires sur le système de fichiers directement. Un accès privilégié est fourni via des API Web, qui sont médiées par le processus B2G mère. Le parent s'assure que, quand un processus enfant demande une API privilégiée, il dispose de l'autorisation nécessaire pour effectuer cette action.

+ +

Les applications communiquent uniquement avec le processus de base B2G, pas avec d'autres processus ou applications. Les applications ne fonctionnent pas indépendamment de B2G, ne peuvent ouvrir des applications de l'autre. La seule «communication» entre les applications est indirecte (par exemple, quand une application établit une alarme système et une autre application déclenche une notification du système à la suite de celui-ci), et est médiée par le processus B2G.

+ +

Hardware Access Only via the Web API

+ +

 

+ +

Les applications Web ont un seul point d'entrée pour accéder aux fonctionnalités de téléphonie mobile: les API Web de Firefox OS, qui sont mises en œuvre dans Gecko. Gecko fournit la seule porte d'entrée de l'appareil mobile et les services sous-jacents. La seule façon d'accéder à la fonctionnalité matérielle du périphérique est de faire un appel d'API Web. Il n'y a aucune API "native" et il n'y a pas d'autres façons (pas de «portes arrières") pour contourner ce mécanisme et d'interagir directement avec le matériel ou pénétrer dans la couche logicielle de bas niveau.

+ +

 

+ +

Infrastructure de sécurité

+ +

La figure suivante montre les composantes du framework de sécurité de Firefox OS:

+ +

+ + + +

Gestion des autorisations et mise en application

+ +

La sécurité de Firefox OS est conçue pour vérifier et appliquer les autorisations accordées à des applications web.

+ +

Le système accorde une autorisation particulière à une application que si le contenu lui demande, et seulement si elle a les autorisations appropriées demandées dans le manifeste de l'application. Certaines autorisations exigent en outre l'autorisation de l'utilisateur, qui est invité à accorder l'autorisation (comme dans le cas d'une application demandant l'accès à l'emplacement actuel de l'utilisateur). Ce framework app-centrique fournit un contrôle plus granulaire sur les autorisations que les approches de rôle centré traditionnelles (dont les rôles individuels sont affectés chacun un ensemble d'autorisations).

+ +

Une API Web a donné un ensemble d'actions et d'écouteurs. Chaque API Web a un niveau d'autorisation requis. Chaque fois une API Web est appelé, Gecko vérifie les exigences d'autorisation (rôle de consultation) basées sur:

+ + + +

Si la demande ne satisfait pas aux critères d'autorisation, alors Gecko rejette la demande. Par exemple, des applications non approuvées ne peuvent pas exécuter des API Web qui sont réservées pour des applications de confiance.

+ +

Inviter les utilisateurs pour Permissions

+ +

En plus des autorisations qui sont implicitement associées aux applications web, certaines opérations nécessitent l'autorisation explicite de l'utilisateur avant de pouvoir être exécutées (par exemple, "l'application web peut avoir accès à votre appareil photo?"). Pour ces opérations, les applications web sont tenues de spécifier, dans leur manifeste, leur justification pour exiger cette autorisation. Cette intention d'utilisation des données informe les utilisateurs sur ce que l'application Web a l'intention de faire avec ces données si l'autorisation est accordée, ainsi que tout risque impliqué. Cela permet aux utilisateurs de prendre des décisions éclairées et de garder le contrôle sur leurs données.

+ +

Processus de mise à jour sécurisé d'une Application

+ +

 

+ +

+ +

Pour les mises à niveau d'applications et des correctifs à une application privilégiée, les fournisseurs d'applications soumettent l'archive mis à jour pour l'autorisation du Marketplace, où elle est examinée et, si elle est approuvée, signée et mise à la disposition des utilisateurs. Sur les appareils OS Firefox, une application utilitaire de une mise à jour  vérifie périodiquement des mises à jour de l'application. Si une mise à jour est disponible, l'utilisateur est alors interroger s'ils veulent l'installer. Avant qu'une mise à jour soit installée sur l'appareil mobile, le paquet est vérifié:

+ + + +

Des contrôles rigoureux sont mises en place pour veiller à ce que la mise à jour soit appliquée correctement sur le téléphone mobile. Le package de mise à jour complète doit être téléchargé dans un emplacement spécifique et sécurisé avant le début du processus de mise à jour. L'installation ne remplace pas les données des utilisateurs.

+ +
+

Note: Pour plus d'informations sur les mises à jour d'applications, lisez Updating apps.

+
+ +

Securité de l'appareil (Hardware)

+ +

Les mécanismes de sécurité pour le matériel de l'appareil mobile sont généralement traitées par l'OEM. Par exemple, un OEM peut offrir une SIM (Subscriber Identity Module) serrures à carte, avec PUK (PIN Unlock Key) codes pour débloquer les cartes SIM qui sont devenus verrouillé les entrées suivantes de code PIN erroné. Contactez votre OEM pour plus de détails. Firefox OS ne permettent aux utilisateurs de configurer des codes d'accès et les écrans de délai d'attente, qui sont décrits dans la section suivante.

+ +

Sécurité des données

+ +

Les utilisateurs peuvent stocker des données personnelles sur leur téléphone qu'ils veulent garder privées, y compris les contacts, les informations financières (bancaires et les détails de cartes de crédit), les mots de passe, des calendriers, et ainsi de suite. Firefox OS est conçu pour protéger contre les applications malveillantes qui peuvent voler, exploiter, ou de détruire des données sensibles.

+ +

Code d'accès et Ecran de temporisation

+ +

Firefox OS permet aux utilisateurs de définir un code d'accès à leur téléphone mobile afin que ceux qui fournissent le code d'accès puissent utiliser le téléphone. Firefox OS fournit également un écran de temporisation qui est affiché après une période d'inactivité configurable depuis le téléphone , nécessitant une authentification de mot de passe avant de reprendre l'utilisation du téléphone.

+ +

Données sandbox

+ +

Comme décrit précédemment, les applications sont sandbox à l'exécution. Cela empêche les applications d'accéder aux données qui appartient à d'autres applications à moins que les données soient explicitement partagées, et que l'application dispose des autorisations suffisantes pour y accéder.

+ +

Données sérialisées

+ +

Les applications Web n'ont pas un accès direct en lecture et écriture au système de fichiers. Au lieu de cela, tous les accès au stockage se produisent uniquement via les API Web. Les API Web lisent à partir, et écrivent sur, le stockage via une base de données SQLite intermédiaire. Il n'y a pas d'accès E / S directe. Chaque application possède son propre stockage de données, qui est sérialisé sur le disque par la base de données.

+ +

 

+ +

Destruction de données

+ +

Quand un utilisateur désinstalle une application, toutes les données (cookies, localStorage, IndexedDB, etc.) associées à cette application sont supprimées.

+ +

Privacy

+ +

Mozilla est engagé à protéger la vie privée de l'utilisateur et les données utilisateur en fonction de ses principes de confidentialité (https://www.mozilla.org/privacy/), qui découlent du Manifeste Mozilla (https://www.mozilla.org/about/manifesto.html). La politique de confidentialité Mozilla Firefox décrit comment Mozilla collecte et utilise des informations sur les utilisateurs du navigateur Web Mozilla Firefox, y compris ce que Firefox envoie aux sites Web, ce que Mozilla fait pour sécuriser les données, les pratiques de données de Mozilla, et ainsi de suite. Pour plus d'informations, voir:

+ + + +

Firefox OS met en œuvre ces principes en mettant le contrôle des données de l'utilisateur dans les mains de l'utilisateur, qui doit décider où cette information est personnelle va. Firefox OS offre les fonctionnalités suivantes:

+ + diff --git a/files/fr/archive/b2g_os/securite/system_security/index.html b/files/fr/archive/b2g_os/securite/system_security/index.html new file mode 100644 index 0000000000..98ab311d64 --- /dev/null +++ b/files/fr/archive/b2g_os/securite/system_security/index.html @@ -0,0 +1,449 @@ +--- +title: Sécurité du système +slug: Archive/B2G_OS/securite/System_security +translation_of: Archive/B2G_OS/Security/System_security +--- +
+

Cet article donne un aperçu du modèle de sécurité du système de Firefox OS ; il explique comment le système d'exploitation assure la sécurité et applique des autorisations.

+
+ +

Terminologie

+ +

Avant de plonger dans le modèle de sécurité du système, voici quelques termes clés que vous devez comprendre.

+ +
+
Application web
+
Une application Web, application open web, application mozilla, ou application est un programme écrit en HTML, JavaScript, et d'autres technologies Open Web, fonctionnant sur Firefox OS (ou toute autre plate-forme qui prend en charge le même modèle d'application installable). Toutes les demandes présentées aux internautes sur B2G sont des applications web. Par exemple, le Dialer est une application Web dans Firefox OS. Pages exécutées dans le navigateur ne sont pas désignés comme des applications Web dans ce contexte.
+
Processus b2g
+
Le processus de b2g Firefox OS est généralement appelé "b2g" ou "Gecko". Ceci est, essentiellement, une application qui fonctionne avec des privilèges élevés (par exemple, s'exécute en tant que root) et contrôle l'accès que toute application Web a sur toutes les ressources et les dispositifs.
+
Content process
+
Ceci est un processus enfant engendré par le processus de B2G, et qui communique avec le processus B2G. Elle représente une application web. Ceci est un processus à faible privilégié (exemple: exécuter comme utilisateur régulier et a un accès et vue sur / pour le système d'exploitation très limitée). Il communique avec le processus de base de Firefox OS en utilisant la communication inter-processus (IPC).
+
IPDL
+
Intercommunication Protocole Définition Langue, vous pouvez aussi consulter IPDL.
+
AOSP
+
Android Open Source Project (Projet Open source Android).
+
Appel system
+
Une interface d'appel entre l'espace de l'utilisateur (processus) et le noyau. Il n'y a pas d'autre moyen direct pour un processus de l'espace pour communuquer au noyau.
+
DAC, MAC
+
Discretionary Access Control (configuré par l'utilisateur) and Mandatory Access Control (forcée par le noyau).
+
FOTA
+
Firmware Over The Air met a jour le mecanisme du système. Il décrit les mises à jour du firmware complètes, généralement envoyés "over the air", soit sur une connexion sans fil à un téléphone mobile.
+
MSU, MAR
+
Mozilla System Updater, Mozilla ARchive. Terme utilisé pour décrire les mises à jour de Gecko, en utilisant le même mécanisme de mise à jour et le format archive comme pour Firefox Desktop.
+
+ +

Objectifs et portée du modèle de sécurité du système Firefox OS

+ +

Le modèle de sécurité du système Firefox OS est conçu pour:

+ + + +

Voir les sections ci-dessous pour des explications plus détaillées de chacun de ces objectifs, et comment ils sont traités par Firefox OS.

+ +

Mettre en œuvre les permissions

+ +

Le modèle de sécurité d'application décrit comment les utilisateurs accordent des autorisations pour les applications, que ce soit directement ou par un tiers de confiance. Ces autorisations sont appliquées sur le processus contenu par l'application de tout accès à la ressource est réalisée par l'intermédiaire d'un appel IPC au processus de base.

+ + + +

Initialisation du processus de contenu

+ +

Toutes les applications web tournent dans un processus distinct doté de droits : le processus de contenu de Firefox OS. Ce processus est lancé par le processus de base b2g quand il atteint un <iframe> type spécial : <iframe mozapp>. Cela sépare l'application web du reste du contenu et est fortement associée à un manifeste (voir le modèle de sécurité des applications pour plus d'informations). Les processus de contenu sont lancés dans le récipient appelé récipient « en dehors du processus », ou un OOP (Out Of Process). Il est représenté par le processus plugin-conteneur et utilise un code similaire au plug-in-conteneur utilisé par le bureau Firefox.

+ +

Risques

+ + + +

Implémentation

+ +

Initialisation dans le processus b2g

+ +

Dans cet ordre :

+ +
    +
  1. fork()
    2. +
  2. setuid(new, different, unused user id|nobody) (which is an unprivileged user)
    3. +
  3. chrdir('/')
    4. +
  4. execve('plugin-container')
    5. +
+ +

Cela garantit que le processus de POO fonctionne dans un espace mémoire séparé (nouveau processus) et un utilisateur des droits bas ne peut pas élever ses privilèges au niveau du processus de b2g.

+ +

Gestion des descripteurs de fichier

+ +

Les descripteurs de fichiers sont traités en utilisant une méthode whitelist; une liste de descripteurs de fichiers autorisés (FDs) est créé et stocké dans l'objet mFileMap. La fonction LaunchApp() ferme avec force tous les FDS qui ne sont pas sur la liste blanche. Ceci est fait après fork() (qui est quand les FDs sont copiés) mais avant execve() (qui est quand la nouvelle application commence à courir).

+ +

Contrairement à la méthode plus traditionnelle qui utilise une liste noire (close-on-exec flag: CLOEXEC), ce qui garantit aucun FDs sont laissées ouvertes; ceci est donc plus fiable.

+ +

Content process sandboxing (processus de contenu des droits réduits)

+ +

Risques

+ + + +

Cet element a une table de modélisation des menaces avec un sandbox de permis, en plus de la rapide récapitulation des risques mentionnés ci-dessus.

+ +
+

Étendue : les menaces suivantes apparaissent si un attaquant exécute du code arbitraire dans le processus de contenu. En d'autres termes, l'attaquant a déjà trouvé une vulnérabilité au sein de gecko.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
MenaceImpact potentielFacteur(s) de vraisemblanceMesures d'atténuation proposées(s)
+

Les processus de contenu malveillants exploitent la vulnerabilité du noyau

+ +

"2 étapes attaquent".

+ 		Critique: le contrôle de l'appareil complet.Faible: Contenu processus a un nombre limité de système appelle disponibles. +
    +
  • Réduire le nombre d'appels système permi au strict minimum.
    • +
  • Utilisez des correctifs proactives pour protéger le noyau, comme PaX (Protection Against eXecution).
    • +
+
+

Elévation de privilèges au processus parent.

+ +

processus de contenu malveillant exploite processus parent par l'intermédiaire de IPDL.

+ +

"2 étapes attaquent".

+ 		Haut: Possibilité d'exécuter un nombre important d'appels système sensibles (perte de données, l'accès à la caméra, l'accès au réseau, etc.).Moyen: Une grande quantité de code dans le processus parent. Grande surface d'attaque. sanitization Minimal des données envoyées par l'intermédiaire de BNPI (il est en mesure d'envoyer des pointeurs, par exemple). +
    +
  • Exécutez le processus parent comme non-root / utilisateur non privilégié.
    • +
  • Attempt to sandbox the parent process as much as possible.
    • +
+
+

Les processus de contenu malveillant exploite le processus parent pour exploiter la vulnérabilité du noyau exposée.

+ +

"3 étapes attaquent".

+ 		Critique: le contrôle de l'appareil complet. +

Faible: Requiert un bug dans le processus parent qui peut être consulté par le biais de BNPI.

+ +

Nécessite la vulnérabilité du noyau au sein de l'appel système accessible au processus parent (beaucoup plus d'appels système sont disponibles pour le processus parent, par rapport au processus de contenu.)

+ 		+
    +
  • Exécutez le processus parent comme non-root / utilisateur non privilégié.
    • +
  • Attempt to sandbox the parent process as much as possible.
    • +
  • Utilisez des correctifs proactives pour protéger le noyau, comme PaX (Protection Against eXecution).
    • +
+
+

Contenu malveillant, processus parent ou de l'application Web exploite un bug dans le matériel de l'appareil.

+ +

"1 and 2 steps attack".

+ 		+

Haut: Possibilité d'exécuter des opérations privilégiées (comme les appels, l'envoi de SMS, etc.) jusqu'à:

+ +

Critique: Capacité d'exécuter du code au niveau du matériel, le contrôle de l'appareil complet.

+ 		Faible: Nécessite un canal de communication avec le matériel, acquis par le biais de IPDL ou d'un appel système, et un bug matériel. +
    +
  • Périphériques matériels Fuzz.
    • +
  • Travailler autour des problèmes via le noyau et / ou  patchs API de processus parents (désactiver l'accès à la fonctionnalité matérielle vulnérable ou aseptiser les données avant de passer au-dessus).
    • +
+
+ +
+

Note: PaX (Protection Against eXecution) est un patch du noyau de GrSecurity (docs), qui met en œuvre les deux «PaX» et des protections additionel tels que UDEREF et SMAP.

+ +

vulnérabilités non listés sont atténués par le sandbox lui-même.

+
+ +

Implementation

+ +
+

Superviseur n'a pas encore été mis en œuvre.

+
+ +

Process Model Sandbox

+ +
+

Remarque : Les processus en cours d'exécution de contenu sont les applications Web, et sont les processus à sandbox.

+
+ +

Implémentation des API de Gecko

+ +

Les API exposées via JavaScript dans le processus de contenu ne devrait jamais tenter d'accéder aux ressources du système de fichiers directs. Au lieu de cela, ils doivent émettre un appel IPDL pour la ressource. Cela signifie que toute API faisant accès à la ressource doit avoir une composante dans le processus parent d'accéder à la ressource pour le compte du processus de contenu.

+ +

Des précautions supplémentaires doivent être prises lors de l'implémentation des appels. Toutes les entrées doivent être désinfectés par le processus parent. Le contenu processus ne peut pas être digne de confiance, et de la IPDL messages provenant du contenu processus ne peut pas être digne de confiance.

+ +
+

Attention : Toute confiance accordée au processus de contenu peut et sera utilisé pour échapper à la sandbox.

+
+ +

Qu'est-ce que seccomp

+ +

Seccomp signifie le mode de calcul sécurisé. Il y a actuellement 2 version de seccomp:

+ +
    +
  1. +

    seccomp, disponibles dans le noyau Linux 2.6.12 et ci-dessus:

    + +
      +
    • +

      Activation seccomp limite les appels des processus du système à lire, écrire, sigreturn, et la sortie.

      +
      • +
    • +

      Utilise l'appel système prctl().

      +
      • +
    • +

      Peut être démarré après l'initialisation du processus, dans un lieu d'arbitrage.

      +
      • +
    +
    2. +
  2. +

    seccomp-bpf également appelé mode filtre seccomp ou mode 2, est disponible dans le noyau Linux 3.5 et ci-dessus:

    + +
      +
    • +

      Identique à seccomp, mais met en oeuvre BPF pour filtrer les appels système.

      +
      • +
    • +

      Peut utiliser une liste blanche des d'appels et arguments systèmes lors de l'initialisation, au lieu d'appels système codé en dur.

      +
      • +
    • +

      Plus flexible, permet une "sandbox plus permissive". Utile pour sandbox légèrement plus faibles, et pour un chemin de transition vers "sandbox stricte".

      +
      • +
    • +

      Ajoute un drapeau qui empêche les processus de traitement et de l'enfant pour revenir privilèges.

      +
      • +
    +
    3. +
+ +
+

Remarque : En raison de la flexibilité accrue qui est permi, nous avons décidé d'utiliser seccomp-bpf, avec rétroportage à tout noyau <3.5. Cela inclut la plupart des noyaux Android actuels. Un patch est déjà disponible et peut généralement être appliquée sans conflits (voir le bogue 790923).

+
+ +

Performances seccomp-bpf

+ +

Les performance seccomp-bpf à des impacts chaque fois qu'il y a un appel system . Il n'y a pas de référence exacte, comme la mesure dépend de la mise en œuvre. Nous estimons que cela peut influer sur les performances jusqu'à 1% quand un appel système est fait et seccomp-bpf est activé pour le processus en cours. Cela reste à être mesurée par QA.

+ +

Étant donné que le nombre d'appels système est considérablement réduit dans notre modèle de processus, nous prévoyons également l'impact sur les performances du monde réel qui devrait être presque nulle.

+ +

Les appels IPDL peuvent toutefois ajouter la latence et réduire les performances, en fonction de leur mise en œuvre. Il est fortement recommandé de regarder la mise en œuvre de chrome pour les API gourmandes en ressources telles que les appels OpenGL. De façon similaire à seccomp-bpf, si nous réduisons le nombre d'appel IPDL, nous allons minimiser les impacts sur les performances.

+ +

Implémentation

+ +

seccomp est activé dans Gecko avec --enable-content-sandbox.

+ +

Le reporteur, qui reporte les appel systèmes refusé (le cas échéant) ne soit jamais construit par défaut et est activé avec l'option --enable-content-sandbox-reporter.

+ +

La majeure partie du code est dans gecko/security/sandbox. Le liste blanche elle-même est stocké dans gecko/security/sandbox/seccomp_filter.h.

+ +

La liste blache peut contenir des appels système qui peuvent être utilisés les cloisonnements. En règle générale, ces appels ont des commentaires indiquant pourquoi, et devraient éventuellement être supprimés lorsque le code affecté est fixé. Par conséquent, il est presque jamais OK pour ajouter le code qui va briser le sandbox, puis ajoutez l'appel dans la liste blanche, sans un examen très attentif. Dans le doute, soulever un bug. La plupart du temps cependant, ce qui est faux, et la ressource devrait plutôt être contrôlé, accessible par le processus de b2g, puis passé au processus de contenu si l'accès est accordé et / ou les données sont filtrées.

+ +

Durcissement du système de fichiers

+ +

Risques

+ + + +

Implémentation

+ +

La raison en est que seules les zones qui contiennent du contenu d'utilisateur peut être en lecture-écriture (à moins que le système d'exploitation lui-même exige une nouvelle zone de lecture-écriture dans le futur), et doivent inclurenodev, nosuid, et noexec Les supports du système de fichiers standard sont limitées comme suit:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Point de montageSystème de fichiersOptions
/rootfsread-only
/devtmpfsread-write, nosuid, noexec, mode=0755
/dev/ptsptsfsread-write, nosuid, noexec, mode=0600
/procprocread-write, nosuid, nodev, noexec
/syssysfsread-write, nosuid, nodev, noexec
/cacheyaffs2 or ext4read-write, nosuid, nodev, noexec
/efsyaffs2 or ext4read-write, nosuid, nodev, noexec
/systemext4read-only, nodev
/dataext4read-write, nosuid, nodev, noexec
/mnt/sdcardext4 or vfatread-write, nosuid, nodev, noexec, uid=1000, fmask=0702, dmask=0702
/acctcgroupread-write, nosuid, nodev, noexec
/dev/cpuctlcgroupread-write, nosuid, nodev, noexec
+ +
+

Remarque : Les points de montage exacts peuvent varier.

+
+ +

Linux DAC

+ +

Le Linux DAC représente le modèle d'autorisation de système de fichiers de Linux bien connue.

+ +
+

Remarque : Ceci est le traditionel user/group/other modèle d'autorisation et non les Linux POSIX 1E ACLs.

+
+ + + +

Mises à jour du système sécurisé

+ +

Risques

+ + + +

Implémentation

+ +

Mises à jour ultérieures et des correctifs à la plate-forme Firefox OS sont déployés en utilisant un processus sécurisé de Mozilla qui assure l'intégrité continue de l'image du système sur le téléphone mobile. La mise à jour est créé par un connu, source de confiance - habituellement le OEM de l'appareil - qui est responsable de l'assemblage, la construction, les essais et la signature numérique du package de mise à jour.

+ +

Firmware over the air updates

+ +

Les mises à jour du système peuvent concerner tout ou une partie de la pile Firefox OS. Si des modifications à Gonk sont inclus dans la mise à jour, puis la FOTA (Firmware Over the Air) est le processus d'installation utilisé. les mises à jour FOTA peuvent également inclure toute autre partie de la pile de Firefox OS, y compris la gestion des périphériques (FOTA, firmware / pilotes), la gestion des paramètres (réglages du système d'exploitation Firefox), les mises à jour de sécurité, Gaia, Gecko, et d'autres correctifs.

+ +

Mises à jours MSU/MAR

+ +

Les mises à jour qui ne concernent pas Gonk peuvent être effectuées en utilisant l'utilitaire Mozilla System Update. Firefox OS utilise le même cadre de mise à jour, les processus et Mozilla ARchive (MAR) Format (utilisé pour les packages de mise à jour) que le produit Firefox Desktop.

+ +

Service de mise à jour

+ +
+

Remarque : Le service de mise à jour peut être fourni par l'OEM.

+
+ +

Un service de mise à jour intégrée sur le téléphone mobile vérifie périodiquement les mises à jour du système. Une fois un paquet de système devient disponible et est détecté par le service de mise à jour, l'utilisateur est invité à confirmer l'installation. Avant que les mises à jour s'installes sur l'appareil mobile, le stockage de l'appareil est vérifié pour un espace suffisant pour appliquer la mise à jour, et la distribution est vérifiée:

+ + + +

Les mesures de sécurité suivantes sont utilisées au cours du processus de mise à jour:

+ + + +

Des contrôles rigoureux sont en place pour veiller à ce que la mise à jour est appliquée correctement sur le téléphone mobile.

+ +
+

Remarque: Pour plus d'informations sur les mises à jour de la plate-forme, lisez Création et application de packages de mise à jour de Firefox OS.

+
diff --git a/files/fr/archive/b2g_os/simulator/index.html b/files/fr/archive/b2g_os/simulator/index.html new file mode 100644 index 0000000000..4c657e5d09 --- /dev/null +++ b/files/fr/archive/b2g_os/simulator/index.html @@ -0,0 +1,112 @@ +--- +title: Simulateur Firefox OS +slug: Archive/B2G_OS/Simulator +tags: + - Apps + - Firefox OS + - Tools + - WebIDE + - simulator +translation_of: Archive/B2G_OS/Simulator +--- +
+

Cette page décrit le fonctionnement du simulateur Firefox OS pour les versions de Firefox OS 1.2 et supérieures. Si vous développez des applications sur Firefox OS 1.1, consultez la documentation du simulateur pour Firefox OS 1.1.

+
+ +

Le simulateur Firefox OS (Firefox OS Simulator en anglais) est une version des couches supérieures de Firefox OS qui permet de simuler le fonctionnement d'un appareil Firefox OS sur un ordinateur de bureau. Cela signifie que, pour la plupart des cas, il n'est pas nécessaire d'avoir un vrai appareil pour déboguer l'application. Le simulateur s'affiche dans une fenêtre de la même taille qu'un appareil Firefox OS, comprend l'interface utilisateur de Firefox OS et les applications natives, il permet également de simuler plusieurs API matérielles pour Firefox OS.

+ +

Le simulateur est distribué comme un module complémentaire pour Firefox. Une fois que vous l'avez téléchargé et installé dans Firefox, vous pouvez le lancer, y envoyer des applications ainsi qu'utiliser les outils de développement avec le gestionnaire d'applications et, sous Nightly/Aurora, avec WebIDE.

+ +

Installation

+ +

Pour installer le simulateur, utilisez le panneau de gestion des simulateurs de WebIDE (disponible depuis Firefox 33). Plusieurs versions sont disponibles, et il est recommandé de toutes les installer pour plus de flexibilité.

+ +

Pour lancer le simulateur, choisissez-le dans la liste des environnements de WebIDE. Pour plus de détails, voir les instructions dans la documentation WebIDE. Une fois que le simulateur est lancé, vous pouvez y envoyer des applications et les déboguer grâce à WebIDE, comme vous le feriez avec un vrai appareil.

+ +

Si vous utilisez App Manager (l'ancien outil, disponible avant WebIDE), vous pouvez installer un simulateur en cliquant sur le bouton suivant :

+ +

Installer le simulateur

+ +

L'interface utilisateur du simulateur

+ +

Le simulateur apparaît dans une fenêtre séparée dont les dimensions sont telles que l'écran représenté mesure 320x480 pixels. Pour simuler les événements tactiles, vous pouvez cliquer avec la souris et la déplacer en maintenant le clic. Ainsi, si vous cliquez et que vous « tirez » l'écran de la droite vers la gauche avec la souris, vous devriez voir les applications natives ainsi que les applications que vous avez ajoutées :

+ +

+ +

Le simulateur possède deux boutons dans une barre d'outils située en bas :

+ + + +

Émulation de carte SD

+ +

Dans le simulateur, la carte SD est mappée au dossier "fake-sdcard" dans le profil du simulateur. Profil qui est situé dans le dossier "extensions" du profil Firefox dans lequel le simulateur est installé. Par exemple :

+ +
/path/to/Firefox/Profiles/Firefox-profile-name/extensions/fxos_2_2_simulator@mozilla.org/profile/fake-sdcard
+ +
 
+ +

Les fichiers lus ou écrits utilisant l'API getDeviceStorage apparaitront ici.

+ +

Dans les versions antérieures à la version 2.2, il fallait créer le répertoire "fake-sdcard" manuellement. Depuis la version 2.2, le répertoire est créé automatiquement.

+ +

De plus, depuis la version 2.2, il est possible de définir un répertoire différent en utilisant le simulateur en ligne de commande et en passant l'option--storage-path.

+ +

Les limites du simulateur

+ +

Le simulateur Firefox OS possède quelques limitations qui empêchent une simulation parfaitement réaliste.

+ +

Les limites matérielles

+ +

En dehors de la taille de l'écran, le simulateur ne simule aucune des limitations matérielles d'un appareil Firefox OS comme peuvent l'être la mémoire disponible ou la vitesse du processeur.

+ +

Les codecs audio/vidéo

+ +

Les codecs suivants se basent sur une accélération matérielle du décodage et ne sont donc pas supportés :

+ + + +

Cela signifie qu'il n'est pas possible d'utiliser le simulateur pour lire des vidéos en boucle ou utiliser des sites web comme YouTube qui utilisent ces codecs.

+ +

API non supportées

+ +

Certaines API qui fonctionnent sur les appareils ne fonctionneront pas avec le simulateur. La plupart du temps, cela est dû à une absence du matériel nécessaire pour ces API. Des simulations de ces API ont été faites (par exemple pour la géolocalisation). Il est prévu d'en ajouter d'autres pour les versions à venir. Malgré cela, les API qui suivent ne sont pas supportées et leur utilisation pourra renvoyer des erreurs ou des résultats incorrects :

+ + + +

Obtenir de l'aide

+ +

Si vous avez une question, vous pouvez la poser (en anglais) sur la liste de diffusiondev-developer-tools ou sur IRC sur le canal #devtools de irc.mozilla.org.

+ +

Activer les enregistrements verbeux (verbose logging)

+ +

Vous pouvez voir les messages enregistrés depuis votre application dans la console Web, que vous pouvez lier à votre application en utilisant WebIDE. Si vous souhaitez obtenir des messages pour le moment où l'application démarre, avant que la console soit connectée et fonctionne, vous devrez activer le mode verbeux pour les enregistrements (logs).

+ +

Allez dans about:config et créez une nouvelle option. Le nom de l'option est différent en fonction de la version du simulateur utilisée :

+ + + +

Fixez la valeur de cette chaîne de caractère à "all", ensuite, désactivez puis réactivez le module complémentaire dans le gestionnaire de modules complémentaires. Vous devriez maintenant pouvoir lire de nouveaux messages dans la console JavaScript du navigateur.

+ +

Compiler le Simulateur

+ +

Si vous voulez tester des patchs du code de Gecko ou de Gaia que le Simulateur contient, il est possible que vous ayez envie de modifier le Simulateur pour utiliser une version personnalisée de Gecko ou un profil personnalisé de Gaia. Il est également possible de compiler un nouveau Simulateur depuis votre checkout de Gecko.

diff --git a/files/fr/archive/b2g_os/simulator_vs_emulator_vs_device/index.html b/files/fr/archive/b2g_os/simulator_vs_emulator_vs_device/index.html new file mode 100644 index 0000000000..c6b95f5bbf --- /dev/null +++ b/files/fr/archive/b2g_os/simulator_vs_emulator_vs_device/index.html @@ -0,0 +1,74 @@ +--- +title: Simulateur vs. Émulateur vs. Appareil +slug: Archive/B2G_OS/Simulator_vs_Emulator_vs_Device +tags: + - Firefox OS + - QA + - test +translation_of: Archive/B2G_OS/Developing_Gaia/Different_ways_to_run_Gaia +--- +

Trois options de base sont possibles pour obtenir un environnement Firefox OS afin de travailler ou développer dessus. Il y a le Simulateur Firefox OS, l'Émulateur Firefox OS et enfin Firefox OS sur un téléphone compatible Firefox OS.

+ +

Les utilisateurs finaux ne sont en contact avec Firefox OS que sur un véritable appareil, néanmoins, le Simulateur et l'Émulateur offrent une alternative accessible pour les développeurs qui visent Firefox OS. Pour la majorité d'entre-eux, le Simulateur ou l'Émulateur seront suffisants, mais gardez à l'esprit qu'il y a des cas où leur comportement sera partiel ou différent de celui d'un appareil. Les descriptions ci-dessous devraient vous aider à choisir parmi les trois options celle qui sera la meilleure pour vous.

+ +

Le Simulateur Firefox OS

+ +

Le Simulateur Firefox OS est une extension pour le navigateur Firefox. Il est principalement destiné à être utilisé par les développeurs d'applications.

+ +

Avantages

+ + + +

Inconvénients

+ + + +

Le client Firefox OS pour ordinateur

+ +

Le client Firefox OS pour ordinateur, également appelé B2G desktop client, permet d'exécuter des applications Web et Gaia dans un environnement basé sur Gecko quelque peu similaire à un véritable appareil. Comme il n'émule pas le matériel de l'appareil, il n'est pas adapté pour tester les APIs des périphériques et ne remplace pas un vrai matériel pour faire des tests. Cependant, il intègre plusieurs APis qui ne sont pas disponibles dans Firefox comme les APIs Contacts et Settings. Il peut donc être utile pendant le développement de votre application, ou lors du travail sur l'interface utilisateur Gaia elle-même.

+ +

L'Émulateur Firefox OS

+ +

L'Émulateur Firefox OS est un programme compilé à partir du code source de Firefox OS et exécuté sur une machine de bureau. En général, les développeurs qui ont besoin d'un environnement Firefox OS plus complet que le Simulateur choisiront cette option. (Voir Opera Mobile Emulator pour les fonctionnalités)

+ +

Avantages

+ + + +

Inconvénients

+ + + +

Firefox OS sur un appareil

+ +

En général, les développeurs qui travaillent sur le code du coeur de Firefox OS (gonk, gecko) ou qui souhaitent tester leurs applications (ou des modifications de gaia) sur un vrai appareil choisiront cette option.

+ +

Avantages

+ + + +

Inconvénients

+ + diff --git a/files/fr/archive/b2g_os/spark/index.html b/files/fr/archive/b2g_os/spark/index.html new file mode 100644 index 0000000000..26b1466bdd --- /dev/null +++ b/files/fr/archive/b2g_os/spark/index.html @@ -0,0 +1,20 @@ +--- +title: Spark +slug: Archive/B2G_OS/Spark +translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS +--- +
+

Spark est compilé de la même manière que Firefox OS, excepté que la variable d'environnement GAIA_DISTRIBUTION_DIR=distros/spark est définie.

+
+ +

Compiler B2G avec Spark

+ +

Article principal : Compiler Boot2Gecko

+ +
GAIA_DISTRIBUTION_DIR=distros/spark ./build.sh
+ +

Compiler Gaia avec Spark

+ +

Article principal : Développer pour Gaia - référence des options de make

+ +
GAIA_DISTRIBUTION_DIR=distros/spark make
diff --git a/files/fr/archive/b2g_os/tips_and_tricks/faire_des_captures_ecran/index.html b/files/fr/archive/b2g_os/tips_and_tricks/faire_des_captures_ecran/index.html new file mode 100644 index 0000000000..8834995d79 --- /dev/null +++ b/files/fr/archive/b2g_os/tips_and_tricks/faire_des_captures_ecran/index.html @@ -0,0 +1,88 @@ +--- +title: Faire des captures d'écran +slug: Archive/B2G_OS/Tips_and_tricks/faire_des_captures_ecran +translation_of: Archive/B2G_OS/Debugging/taking_screenshots +--- +

Prendre des captures d'écran de votre application peut être utile à plusieurs égards, comme pour montrer votre travail à un client, frimer devant vos amis avec votre téléphone FxOS, ou encore publier une application sur le Marketplace. Cet article explique comment faire des captures d'écran sur votre appareil Firefox OS.

+ +
+

Note: Les développeurs Android ne seront pas perdu car les étapes sont assez similaires.

+
+ +

Préparer votre téléphone

+ +
    +
  1. Sur votre téléphone, ouvrez les paramètres pour développeurs puis cochez : Débogage distant et Console activée.
    2. +
  2. Assurez-vous qu'ADB est installé et fonctionnel sur votre ordinateur.
    3. +
  3. Branchez votre téléphone au port USB de votre ordinateur.
    4. +
+ +

Sur votre téléphone, allez dans Paramètres > Informations > Plus d'informations > Développeurs

+ +

Prendre une capture d'écran

+ +

Maintenant vous avez quatre choix possibles : le terminal, DDMS dans Eclipe, la combinaison de boutons dédiée sur le téléphone, ou le gestionnaire d'application.

+ +

Terminal

+ +

Ouvrez une fenêtre de terminal, et exécutez les trois commandes suivantes:

+ +
    +
  1. Prendre une capture d'écran (l'image s'appellera "capture.png" dans l'exemple)
    + adb shell screencap -p /sdcard/capture.png
    2. +
  2. Transférer l'image sur votre ordinateur
    + adb pull /sdcard/capture.png
    3. +
  3. Supprimer l'image de votre appareil
    + adb shell rm /sdcard/capture.png
    4. +
+ +

Vous désirez en apprendre plus sur ADB ? Regardez la documentation d'ADB.

+ +

Autrement, vous pouvez utiliser ffmpeg:

+ +
    +
  1. Assurez-vous d'avoir ffmpeg installé: +
      +
    1. Sur Mac, si vous utilisez MacPorts, vous pouvez exécuter sudo port install ffmpeg. Pour homebrew, exécutez brew install ffmpeg.
      2. +
    2. Sur Linux (Ubuntu/Debian), exécutez sudo apt-get install ffmpeg.
      3. +
    +
    2. +
  2. Placez vous dans le bon dossier :  cd B2G/gaia.
    3. +
  3. Utilisez la commande make screenshot pour réaliser la capture d'écran.
    4. +
  4. L'image créée s'appelle screenshot.png.
    5. +
+ +

DDMS

+ +

Ouvrez Eclipse.

+ +
    +
  1. Ouvrez DDMS
    + Fenêtre > Ouvrir la Perspective > Autres > DDMS
    2. +
  2. Sur le panneau de gauche dans l'onglet Appareils, cliquez sur le bouton Capture d'écran.
    3. +
  3. Une nouvelle fenêtre apparaît avec plusieurs options, cliquez sur le bouton Enregistrer pour sauvegarder votre image.
    4. +
+ +
+

Note: Pour en savoir plus sur DDMS, regardez la documentation de DDMS.

+
+ +

Boutons du téléphone

+ +
    +
  1. Sur les versions Firefox OS 2.0 et précédentes, appuyez simultanément sur les boutons Accueil et Bouton d'alimentation pendant quelques secondes.
    2. +
  2. À partir de la version Firefox OS 2.1, appuyez simultanément sur les boutons Volume moins et Bouton d'alimentation pendant quelques secondes.
    3. +
+ +

Ceci fait une capture d'écran qui est sauvegardée dans votre Galerie. Ensuite il vous suffit de récupérer l'image sur votre carte SD par la méthode de votre choix.

+ +
+

Note: La combinaison de boutons fut modifiée parce que de nombreuses personnes la trouvaient plus compliquée que nécessaire, particulièrement avec une seule main. Et aussi parce que les appareil sans bouton Accueil matériel ne sont pas très bien supportés (il n'est pas possible d'utiliser le bouton Accueil logiciel partout, comme par exemple sur l'écran de verrouillage).

+
+ +

Le gestionnaire d'application/simulateur

+ +
    +
  1. Ouvrez le gestionnaire d'application, connectez votre téléphone, et naviguez jusqu'à l'onglet Appareil sur la gauche.
    2. +
  2. Cliquez sur le bouton Capture d'écran en bas de la page (à l'endroit où vous démarrez le simulateur).
    3. +
diff --git a/files/fr/archive/b2g_os/tips_and_tricks/modifier_le_fichier_hosts/index.html b/files/fr/archive/b2g_os/tips_and_tricks/modifier_le_fichier_hosts/index.html new file mode 100644 index 0000000000..11043f1dc3 --- /dev/null +++ b/files/fr/archive/b2g_os/tips_and_tricks/modifier_le_fichier_hosts/index.html @@ -0,0 +1,38 @@ +--- +title: Modifier le fichier hosts +slug: Archive/B2G_OS/Tips_and_tricks/Modifier_le_fichier_hosts +translation_of: Archive/B2G_OS/Developing_Firefox_OS/modifying_hosts_file +--- +
+

Il est parfois nécessaire d'éditer le fichier hosts de votre machine : en cas d'attaque, pour bloquer des connexions indésirables, pour rediriger des requêtes vers une adresse spécifique, etc... Cet article vous guidera à travers les étapes à effectuer pour modifier le fichier hosts de votre téléphone Firefox OS. Ce fichier se trouve par exemple dans le dossier /system/etc pour un Linux, et dans le dossier /etc dans les nouvelles versions de Mac OS X.

+
+

Préparer votre téléphone

+

Sur le téléphone, allez à Paramètres pour développeurs et cocher :

+ +

Branchez alors votre téléphone à votre ordinateur.

+

Les étapes suivantes, pour modifier le fichier hosts, sont les mêmes que sur Android. Les développeurs Android retrouveront rapidement leurs petits !

+

Étapes dans le terminal

+
    +
  1. Ouvrez une fenêtre de terminal.
    2. +
  2. Remontez la partition /system sur le téléphone afin d'obtenir les permissions en lecture/écriture + 
    adb remount
    +
    3. +
  3. Transférez le fichier hosts vers votre ordinateur + 
    adb pull /system/etc/hosts /tmp
    +
    4. +
  4. Modifiez le fichier hosts dans /tmp/hosts selon vos besoins puis sauvegardez le. Par exemple : + 
    127.0.0.1         localhost
+ip.à.rediriger   nom_de_la_machine_distante
    +
    5. +
  5. Envoyez le fichier hosts modifié vers votre téléphone + 
    adb push /tmp/hosts /system/etc/hosts
    +
    6. +
+

Voilà, votre fichier hosts devrait maintenant être à jour.

+
+

A noter : En savoir plus sur ADB ? La documentation ADB n'attend plus que vous !

+
+

diff --git a/files/fr/archive/b2g_os/using_the_app_manager/index.html b/files/fr/archive/b2g_os/using_the_app_manager/index.html new file mode 100644 index 0000000000..91631c48f8 --- /dev/null +++ b/files/fr/archive/b2g_os/using_the_app_manager/index.html @@ -0,0 +1,293 @@ +--- +title: Utiliser le gestionnaire d'applications +slug: Archive/B2G_OS/Using_the_App_Manager +tags: + - App Manager + - Apps + - Debugging + - Firefox OS + - WebIDE + - simulator +translation_of: Archive/B2G_OS/Using_the_App_Manager +--- +
+

Le gestionnaire d'applications est un nouvel outil disponible dans Firefox pour ordinateur et qui fournit un nombre d'outils utiles pour vous aider à tester, déployer et déboguer des applications web HTML5 sur des téléphones Firefox OS ainsi que sur le simulateur de Firefox OS directement depuis votre navigateur.

+ +

Le gestionnaire d'applications est destiné aux développeurs visant Firefox OS 1.2 ou plus. Si vous développez des applications pour Firefox OS 1.1, vous devriez plutôt consulter la documentation concernant le simulateur de Firefox OS 1.1.

+
+ +

+ +

Le gestionnaire d'applications est composé de :

+ + + +

Installation rapide

+ +

Cette section est conçue pour vous permettre de démarrer rapidement. Si vous avez besoin de plus de détails, rendez-vous à la section Configuration du système et de l'appareil. Consultez également la section Dépannage, si vous rencontrez des problèmes.

+ +
    +
  1. Assurez-vous que vous avez installé Firefox 26 ou plus ;
    2. +
  2. ouvrez le gestionnaire d'applications (tapez about:app-manager dans la barre d'URL).
    3. +
  3. En fonction de votre situation :
    4. +
+ +

a.  Si vous n'avez pas d'appareil physique :

+ + + +

b. Si vous avez un appareil physique :

+ + + +

La barre du bas devrait afficher " Connecté à xxx "

+ +
    +
  1. Cliquez sur le panneau Applications et ajoutez une application (empaquetée ou hébergée) ;
    2. +
  2. le bouton Mettre à jour valide votre application et l'installe sur le simulateur ou l'appareil ;
    3. +
  3. le bouton Déboguer connecte les outils de développement à l'application en cours d'exécution.
    4. +
+ +

Consultez la section Dépannage, si vous rencontrez des problèmes.

+ +

Configuration du système et de l'appareil

+ +

La première chose que vous avez besoin de faire quand vous utilisez le gestionnaire d'applications, c'est de vous assurer que votre système et votre téléphone sont installés correctement. Cette partie va passer en revue toutes les étapes requises.

+ +

Firefox 1.2+ requis

+ +

Assurez-vous que votre appareil dispose de Firefox OS 1.2/Boot2Gecko 1.2 ou plus. Pour vérifier la version de Firefox OS que votre appareil utilise, rendez-vous dans Paramètres > Informations sur l'appareil > Logiciel.

+ +

Si votre version n'est pas assez récente, selon le téléphone que vous avez, vous aurez besoin soit d'installer une version nightly téléchargeable de Firefox OS 1.2 ou plus, soit de configurer et de compiler vous-même une version de Firefox OS depuis les sources.

+ +

Versions disponibles :

+ + + +
+

Note: Pour compiler votre propre distribution de Firefox OS 1.2+, suivez les instructions afin de Compiler et installer Firefox OS, en commençant par les Prérequis pour compiler Firefox OS.

+
+ +

Débogage distant

+ +

Ensuite, vous avez besoin d'activer le débogage distant dans Firefox OS. Pour ce faire, rendez-vous dans Paramètres > Informations sur l'appareil > Plus d'informations > Développeurs et cochez la case Débogage distant.

+ +

ADB ou ADB Helper

+ +

Le processus utilise l'Android Debug Bridge (ADB) pour la connexion et la communication entre l'ordinateur et l'appareil. Il y a deux options pour utiliser ADB :

+ + +
+

Note: Il est inutile d'exécuter cette commande si vous avez installé l'extension ADB Helper.

+
+ +

Connecter votre appareil au gestionnaire d'applications

+ +

Une fois votre configuration terminée, il est temps de brancher votre appareil sur votre ordinateur et de démarrer le gestionnaire d'applications :

+ +
    +
  1. Branchez l'appareil sur votre ordinateur via USB ;
    2. +
  2. Désactivez le verrouillage sur votre appareil en allant dans Paramètres > Verrouillage et décochez la case Écran de verrouillage. C'est pratique car quand l'écran se verrouille, la connexion avec le téléphone se perd. Il ne sera donc plus disponible pour le débogage.
    3. +
  3. Démarrez le gestionnaire d'applications — Dans Firefox pour ordinateur, sélectionnez l'option dans le menu Développement web > Gestionnaire d'applications, ou tapez about:app-manager dans la barre d'URL.
    4. +
  4. Dans l'onglet du bas du gestionnaire d'application, vous verrez une barre de statut de connexion (reportez-vous à l'image ci-dessous). Vous devriez être capable de connecter votre appareil en cliquant sur le bouton « Se connecter à localhost:6000 ».
    5. +
  5. Si cela fonctionne, une boîte de dialogue devrait apparaître sur votre appareil : « Une requête entrante pour permettre une connexion de débogage à distance a été détectée. Autoriser la connexion ? ». Appuyez sur le bouton OK ( vous aurez peut-être besoin d'appuyer sur le bouton « Power » du téléphone pour voir la boîte de dialogue). La barre de statut de connexion devrait s'actualiser pour afficher « Connecté à B2G » avec un bouton « Se déconnecter » pour permettre d'interrompre la connexion.
    6. +
+ +

+ +
+

Note : Les autres boutons dans la barre de statut de connexion vous permettent de connecter un simulateur au gestionnaire d'applications, ce que nous aborderons à la prochaine section, et de changer le port de connexion. Si vous modifiez le port de connexion, vous aurez aussi besoin d'activer la redirection sur ce port.

+
+ +

Utiliser un simulateur de Firefox OS

+ +

Si vous n'avez pas d'appareil physique disponible, vous pouvez essayer d'utiliser le gestionnaire d'applications sur un simulateur de Firefox OS. Pour commencer, installez le simulateur en utilisant le bouton suivant (plusieurs versions sont disponibles ; vous devriez toutes les installer pour pouvoir tester sur le plus de versions possible) :

+ +

Installer le simulateur

+ +

Une fois que vous avez installé le ou les simulateurs, rendez-vous dans le gestionnaire d'applications et cliquez sur le bouton « Lancer le simulateur » dans la barre de statut de connexion dans l'onglet du bas. Au moins trois boutons vont apparaître :

+ + + +

Lancer ses propres versions dans le gestionnaire d'applications

+ +

Vous pouvez lancer des versions de B2G pour ordinateur et de Gaia/Gecko que vous avez compilées dans le gestionnaire d'application avec le simulateur. Lire la page lancer ses propres versions de Firefox OS/Gaia dans le gestionnaire d'applications pour plus d'informations sur comment procéder.

+ +

Le panneau « Applications » : Tester et déboguer les applications Firefox OS

+ +

Maintenant que tout fonctionne, examinons les fonctionnalités disponibles dans le gestionnaire d'applications. Commençons avec le panneau Applications. D'ici, vous pouvez importer une application existante pour l'envoyer sur votre appareil et la déboguer :

+ + + +

Les informations à propos de votre application devraient apparaître sur le côté droit de la fenêtre, comme sur l'image ci-dessous :

+ +

+ +

L'éditeur de manifeste

+ +

Depuis Firefox 28, le panneau Applications incorpore un éditeur pour le manifeste de l'application :

+ +

+ +

Le débogage

+ +

Cliquer sur « Mettre à jour » mettra à jour (installera) l'application sur l'appareil. Cliquer sur « Déboguer » connectera les outils de développement à l'application, vous permettant ainsi de déboguer directement son code.

+ +

+ +
+

Note : Découvrez en manipulant les outils de développement — Essayez de modifier les DOM, CSS, etc., et vous verrez les modifications s'afficher sur votre appareil en temps réel. Ces modifications seront enregistrées dans le code de l'application installée ; vous les verrez la prochaine fois que vous lancerez l'application sur votre appareil.

+
+ +

Avant Firefox 28, les outils de développement se lancent dans une fenêtre séparée. Depuis Firefox 28, les outils de développement se lancent dans un onglet dans le gestionnaire d'applications lui-même auprès des onglets Applications et Appareil. L'icône de votre application s'affiche dans le nouvel onglet, il est donc facile de le repérer :

+ +

+ +

Les erreurs

+ +

Si une application ne s'ajoute pas — par exemple si l'URL est incorrecte — une entrée sera ajoutée sur la page de cette application indiquant des informations sur l'erreur.

+ +

+ +

Vous pouvez également supprimer une application depuis cette vue en survolant le nom ou la description de l'application sur la gauche de la fenêtre et en cliquant sur la croix qui apparaît. Cependant, cela ne supprime pas l'application de l'appareil. Pour ce faire, vous devez supprimer l'application manuellement en utilisant directement l'appareil.

+ +

Le panneau « Appareil »

+ +

L'onglet Appareil affiche des informations sur l'appareil connecté. Dans la fenêtre « Applications installées », les applications sur l'appareil peuvent être démarrées et déboguées.

+ +

+ +
+

Note : Par défaut, les applications certifiées ne sont pas listées. Voir comment déboguer les applications certifiées.

+
+ +

La fenêtre des « Permissions » affiche les privilèges requis pour les différentes API web sur l'appareil actuel :

+ +

+ +

Enfin, vous pouvez prendre une capture d'écran de l'appareil actuel  en cliquant sur le bouton « Capture d'écran ». La capture d'écran apparaitra alors dans un nouvel onglet de Firefox. Depuis celui-ci, vous pouvez le sauvegarder ou l'abandonner.

+ +

Déboguer des applications certifiées

+ +

Actuellement, seuls les appareils tournant sous un « build » de Firefox OS 1.2+ sont capables de déboguer les applications certifiées. Si vous avez ce type d'appareil, vous pouvez activer le débogage d'applications certifiées en changeant les préférences devtools.debugger.forbid-certified-apps à false dans votre profil. Pour ce faire , suivez les étapes décrites ci-dessous :

+ +

En utilisant un appareil

+ +
    +
  1. +

    Sur votre ordinateur, entrez la commande suivante dans le Terminal/console pour entrer dans le système de fichiers de l'appareil via l'invite de commandes :

    + + 
    adb shell
    + +

    La console devrait changer pour devenir root@android.

    +
    2. +
  2. +

    Ensuite, stoppez B2G en utilisant la commande suivante :

    + + 
    stop b2g
    +
    3. +
  3. +

    Naviguez dans le dossier suivant :

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

    Il faut maintenant mettre à jour le fichier prefs.js avec la ligne suivante :

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

    Après avoir modifié et sauvegardé le fichier, redémarrez B2G avec la commande suivante :

    + + 
    start b2g
    +
    6. +
  6. +

    Sortez du système de fichier d'Android en utilisant la commande exit. Vous retournerez au terminal normal.

    +
    7. +
  7. +

    Ensuite, reconnectez-vous au gestionnaire d'applications, vous devriez alors voir les applications certifiées disponibles pour le débogage

    +
    8. +
+ +

En utilisant le client B2G pour ordinateur

+ +

Avec le client B2G Desktop, la préférence est déjà définie dans votre profil dans greprefs.js, située à la racine du répertoire de votre client B2G pour ordinateur. Arrêtez le client puis éditez le fichier afin de passer devtools.debugger.forbid-certified-apps à false. Ensuite, redémarrer le client B2G et connectez le gestionnaire d'applications. Vous devriez désormais pouvoir toutes les applications.

+ +
+

Note : Si vous voulez ajouter cette préférence à votre " build " de Gaia, vous pouvez faire make DEVICE_DEBUG=1 reset-gaia.

+
+ +

Dépannage

+ +

Si l’appareil n’est pas reconnu :

+ + + + + +

Vous ne pouvez pas connecter votre appareil au gestionnaire d'applications ou démarrer le simulateur ? Informez-nous ou rapportez un bug.

diff --git a/files/fr/archive/b2g_os/using_the_b2g_emulators/index.html b/files/fr/archive/b2g_os/using_the_b2g_emulators/index.html new file mode 100644 index 0000000000..e21111a942 --- /dev/null +++ b/files/fr/archive/b2g_os/using_the_b2g_emulators/index.html @@ -0,0 +1,151 @@ +--- +title: Utiliser les émulateurs B2G +slug: Archive/B2G_OS/Using_the_B2G_emulators +tags: + - B2G + - Emulateur + - Firefox OS +translation_of: Archive/B2G_OS/Using_the_B2G_emulators +--- +

+ +
+

Cet article est un guide succinct qui décrit les choses à savoir si vous décidez d'utiliser les émulateurs Boot to Gecko. Il ne prétend pas à être un guide de l'utilisateur complet ; il vous présente seulement quelques petits trucs à savoir que vous ne pourriez peut-être pas découvrir par vous-même.

+
+ +

Ce guide part du principe que vous avez déjà compiler un des émulateurs. Si ce n'est pas le cas, vous pouvez vous référer à la page Compiler et installer Firefox OS !

+ +

À propos des émulateurs B2G

+ +

Il existe deux émulateurs B2G. Le premier est un émulateur ARM qui est compilé lorsque l'on configure config.sh avec le champ "emulator". Même si c'est plus lent que d'utiliser directement un processeur x86, c'est tout de même une représentation plus stable et plus précise du fonctinnement d'un terminal réel. Utiliser le champ "emulator-x86" lorsque l'on lance config.sh permet d'utiliser l'émulateur x86.

+ +
+

Note : Depuis quelques mois la Team Automation a arrêté d'utiliser l'émulateur x86 à cause de problèmes de stabilité. Il y a donc de grandes chances que cela ne marche pas du tout avec l'émulateur x86. Utilisez l'emulateur ARM à moins d'avoir une bonne raison de faire autrement.

+
+ +

Une fois que vous avez sélectionné, configuré et compilé un émulateur, le reste marche de la même façon donc le reste de ce guide est commun pour les deux.

+ +
+

Note : Sur Mac OS X, l'émulateur BG nécessite un processeur Core 2 Duo ou plus récent, c'est-à-dire un système compatible avec Mac OS X 10.7 "Lion." Vous n'avez pas besoin d'utiliser Lion, juste d'être compatible avec.

+
+ +

Démarrer l'émulateur

+ +

Pour démarrer l'émulateur B2G, tapez la commande suivante :

+ +
./run-emulator.sh
+ +

Cela va prendre en charge toutes les étapes du démarrage. Maintenant attendez pendant que l'émulateur démarre et que Boot to Gecko démarre dessus. Cela peut prendre plusieurs minutes, donc soyez patient.

+ +

Quand l'émulateur ne marche pas

+ +

Parfois l'émulateur ne réussi pas à démarrer. Voici quelques astuces pour résoudre les problèmes.

+ +

Utilisez-vous une VM ?

+ +

VirtualBox et Parallels ont un support de l'accélération graphique problématique qui peut causer l'échec du démarrage de l'émulateur, quelque chose à propos d'un terminal OpenGL. L'émulateur commence à démarrer, et redémarre en boucle ou démarre mais n'affiche rien sur l'écran. Il n'y a malheureusement pas de solutions (il y a un moyen détourné pour VirtualBox). Vous devez utiliser VMWare Player (Freeware), Workstation ou Fusion. Pour VirtualBox, n'installez pas les Guest Addons ou ne désactivez pas le module vboxvideo.

+ +

Assurez-vous que le serveur adb est lancé

+ +

Cela arrive lorsque le serveur adb qui prend en charge l'interaction avec l'émulateur soit n'est pas lancé, soit a mal fonctionné. Dans ce cas vous pourrez voir le message d'erreur suivant dans le terminal où vous avez lancé l'émulateur : 

+ +
emulator: control console listening on port 5554, ADB on port 5555
+emulator: can't connect to ADB server: Connection refused
+ +
+

Note : Si vous utilisez l'adb compilé par le processus de compilation de B2G (ce qui est probablement le cas), il est situé dans le dossier $B2G/out/host/<platform>/bin. Sur Mac, c'est le dossier $B2G/out/host/darwin-x86/bin, par exemple.

+
+ +

Regardez si adb est lancé avec : 

+ +
ps aux | grep adb
+ +

S'il y est tuez-le avec la commande suivante parce qu'il ne marche sans doute pas correctement.

+ +
adb kill-server
+ +

S'il ne l'est pas faites ceci :

+ +
adb start-server
+ +

Ensuite tentez de relancer l'émulateur. S'il ne marche toujours pas allez sur #b2g sur irc.mozilla.org pour de l'aide (en anglais).

+ +

Effacer les options de configuration

+ +

Parfois, des options de configurations obsolètes de l'émulateur peuvent causer un mauvais comportement. Vous pouvez supprimer la Base de Données IndexedDB pour résoudre le problème, comme ceci :

+ +
    +
  1.  Assurez-vous que le service adb est démarré, comme décrit ici.
    2. +
  2. Démarrez l'émulateur.
    3. +
  3. +

    Dans le terminal sur l'ordinateur hôte, allez à la racine du code de B2G pour votre émulateur et tapez : out/host/<platform>/bin/adb -e shell ; sur Mac ce serait out/host/darwin-x86/bin/adb -e shell.

    +
    4. +
  4. +

    Maintenant que vous êtes dans le shell adb, vous pouvez exécuter des commandes shell sur votre émulateur. Maintenant stoppez B2G sur l'émulateur : stop b2g.

    +
    5. +
  5. +

    Supprimez la Base de Données IndexedDB : rm -rf /data/local/indexedDB.

    +
    6. +
  6. +

    Redémarrez B2G sur l'émulateur : start b2g.

    +
    7. +
+ +

 Espérons que vous vous retrouverez avec l'interface de Gaia et tout ira bien.

+ +

Si l'émulateur démarre mais que l'écran est noir avant ou après le splash screen "mozilla technology"

+ +

Si cela arrive, c'est peut-être un bogue de pilotes sur la machine qui fait tourner l'émulateur. Cela a été observé sur le pilote Linux open source nouveau. La solution la plus simple est de changer le pilote sur la machine. Dans le cas du pilote nouveau, cela peut-être d'installer un pilote propriétaire ("additionnel" dans Ubuntu) à la place. Dans le cas de chipsets graphiques embarqués Intel graphics, le pilote Linux open source par défaut peut causer une erreur de l'émulateur de type 'eglMakeCurrent failed' dont la source semble le fait qu'il supporte une version d'OpenGL plus faible que la version 2.0 nécessaire pour l'émulation du GPU. La solution consiste à désactiver le GPU en éditant le script run-emulator.sh (l'émulateur sera plus lent).

+ +

Configurer l'émulateur

+ +

Il y a plusieurs options que vous pouvez changer pour que l'émulateur ressemble au terminal que vous voulez émuler. Cette section vous fournit des informations de base sur la façon de faire. Vous pouvez modifier la configuration de l'émulateur en éditant le script run-emulator.sh. Ou, idéalement, une copie. Seulement une partie des paramètres les plus utiles seront abordés ici. Vous pourrez aller sur le site de quemu pour obtenir des détails sur les autres.

+ +
+

Astuce : Créez une copie de run-emulator.sh pour chaque terminal que vous voulez émuler. Cela permet d'utiliser plusieurs configurations différentes facilement.

+
+ +

Changer de skins

+ +

Par défaut, l'émulateur démarre en mode HVGA, half-VGA mode, soit 320x480 pixels. Cela est spécifié par le paramètre -skin donné à l'émulateur lorsqu'il démarre. Vous pouvez passer à un mode d'affichage différent en éditant le script run-emulator.sh (ou, idéalement, une copie). Les skins fournis sont :

+ + + +

 Les skins sont situés dans le dossier $B2G/development/tools/emulator/skins. Un skin est plutôt simple, si vous regardez, il sont simplement des dossiers avec des fichiers PNG pour les objets de l'interface et un fichier texte nommé layout qui décrit l'agencement de l'interface et de l'écran. Il est plutôt simple de créer vos propres skins si besoin.

+ +

Changer la taille de la mémoire

+ +

Une autre option que vous pouvez ou devez configurer est la taille de la mémoire de l'émulateur. Par défaut elle est de 512 Mo, mais si le terminal que vous émulez à plus ou moins de mémoire, il est important que vous mettiez la bonne quantité de mémoire pour vous assurer que votre application tournera dans le terminal de base sur lequel vous voulez travailler. Pour cela, changez la valeur du paramètre -memory à la taille dont vous avez besoin en mégaoctets. En plus de 512 Mo par défaut, 256 Mo et 1024 Mo seront celles que vous utiliserez le plus probablement pour tester.

+ +

Pour changer la quantité de stockage émulé (c'est-à-dire, l'espace de stockage pour les données locales, comme la mémoire flash sur les téléphones moblies ou le disque dur d'un ordinateur), changez la valeur du paramètre -partition-size Par défaut il est de 512 Mo, mais vous pouvez spécifier n'importe quelle taille en mégaoctets pour simuler le type de terminal pour lequel vous devez tester.

+ +

Connexion réseau

+ +

Si pour certaines raisons vous ne pouvez pas connecter l'émulateur à internet, vous pouvez lancer la commande suivante depuis votre terminal :

+ +
adb shell setprop net.dns1 10.0.2.3
+ +

Si vous utilisez emulator-jb ou emulator-kk, la commande pour paramètrer le serveur DNS est différente :

+ +
adb shell ndc resolver setdefaultif eth0
+adb shell ndc resolver setifdns eth0 10.0.0.0 10.0.2.3
+ +
+
+
+
 
+ +
 
+
+
+
diff --git a/files/fr/archive/b2g_os/web_telephony_api/index.html b/files/fr/archive/b2g_os/web_telephony_api/index.html new file mode 100644 index 0000000000..e9e2d76504 --- /dev/null +++ b/files/fr/archive/b2g_os/web_telephony_api/index.html @@ -0,0 +1,40 @@ +--- +title: Web Telephony +slug: Archive/B2G_OS/Web_Telephony_API +tags: + - WebAPI +translation_of: Archive/B2G_OS/Web_Telephony_API +--- +

+ +

+

Non standard
+ Cette fonctionnalité n'est ni standard, ni en voie de standardisation. Ne l'utilisez pas pour des sites accessibles sur le Web : elle ne fonctionnera pas pour tout utilisateur. Il peut également y avoir d'importantes incompatibilités entre les implémentations et son comportement peut être modifié dans le futur.

+

+ +

+

Cette API est disponible sur Firefox OS pour des applications internes seulement.

+

+ +

WebTelephony est une API qui permet à du contenu web de gérer les appels téléphoniques (voix) à partir de code JavaScript.

+ +

Cette API est disponible en utilisant window.navigator.mozTelephony. Voir ci-après pour une liste complète d'interfaces :

+ +

Interfaces DOM

+ + + +

Exemple de code et introduction à l'API

+ +
+ +

Voir aussi

+ + diff --git a/files/fr/archive/b2g_os/writing_apps_for_boot_to_gecko/index.html b/files/fr/archive/b2g_os/writing_apps_for_boot_to_gecko/index.html new file mode 100644 index 0000000000..eed9c54562 --- /dev/null +++ b/files/fr/archive/b2g_os/writing_apps_for_boot_to_gecko/index.html @@ -0,0 +1,18 @@ +--- +title: Développement d'Applications Firefox OS +slug: Archive/B2G_OS/Writing_apps_for_Boot_to_Gecko +tags: + - Apps + - B2G + - Firefox OS +translation_of: Archive/B2G_OS/Firefox_OS_apps/Building_apps_for_Firefox_OS +--- +

Pour de l'information sur le développement d'application Firefox OS, consultez le Centre pour Développeur du Firefox Maketplace.

+

Vous pouvez aussi consulter la référence de l'API Développement d'Applications.

+

Les applications Firefox OS ne sont rien de plus que des applications Open Web installées sur un téléphone Firefox OS.

+ +
+ Note : Firefox OS s'identifie pour le moment avec le même User Agent que Firefox pour Android, sans la clause Android;. Par exemple : Mozilla/5.0 (Mobile; rv:15.0) Gecko/15.0 Firefox/15.0a1.
diff --git a/files/fr/archive/css3/index.html b/files/fr/archive/css3/index.html new file mode 100644 index 0000000000..818d53e75d --- /dev/null +++ b/files/fr/archive/css3/index.html @@ -0,0 +1,14 @@ +--- +title: CSS3 +slug: Archive/CSS3 +tags: + - CSS + - Draft + - Intermédiaire + - Reference +translation_of: Archive/CSS3 +--- +
{{draft}}
+Cette documentation n'est pas maintenue et le contenu de l'article anglais n'est plus complètement à jour.
+ +
Une meilleure ressource est actuellement disponible et récapitule l'état actuel du travail du W3C sur les spécifications relatives à CSS (en anglais).
diff --git a/files/fr/archive/deviceproximity/index.html b/files/fr/archive/deviceproximity/index.html new file mode 100644 index 0000000000..f4eea4fc98 --- /dev/null +++ b/files/fr/archive/deviceproximity/index.html @@ -0,0 +1,84 @@ +--- +title: deviceproximity +slug: Archive/deviceproximity +translation_of: Archive/API/deviceproximity +--- +

L'événement deviceproximity est déclenché lorsque de nouvelles données sont disponibles à partir d'un capteur de proximité.

+ +

Informations générales

+ +
+
Spécification
+
Proximity Sensor
+
Interface
+
DeviceProximityEvent
+
Propagation
+
Non
+
Annulable
+
Non
+
Cible
+
DefaultView (window)
+
Action par défaut
+
Aucune
+
+ +

Propriétés

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
PropertyTypeDescription
target Lecture seule EventTargetThe event target (the topmost target in the DOM tree).
type Lecture seule DOMStringThe type of event.
bubbles Lecture seule BooleanWhether the event normally bubbles or not.
cancelable Lecture seule BooleanWhether the event is cancellable or not.
value Lecture seule Double (float)The sensor data for ambient light in Lux.
min Lecture seule Double (float)The minimum value in the range the sensor detects (if available, 0 otherwise).
max Lecture seule Double (float)The maximum value in the range the sensor detects (if available, 0 otherwise).
+ +

Evénement liés

+ + + +

Voir aussi

+ + diff --git a/files/fr/archive/index.html b/files/fr/archive/index.html new file mode 100644 index 0000000000..91bf4e1cba --- /dev/null +++ b/files/fr/archive/index.html @@ -0,0 +1,21 @@ +--- +title: Archive of obsolete content +slug: Archive +tags: + - Archive + - TopicStub +translation_of: Archive +--- +

Chez MDN, nous essayons d'éviter de supprimer purement et simplement le contenu qui pourrait être utile aux personnes ciblant les plates-formes, les systèmes d'exploitation et les navigateurs hérités. Peut-être que votre public cible est constitué de personnes qui utilisent du matériel plus ancien, par exemple, et qui ne peuvent pas passer aux derniers et meilleurs navigateurs. Ou pour des «raisons», votre entreprise doit utiliser un logiciel très ancien et vous devez créer un contenu Web qui s'exécute sur ce logiciel. Ou peut-être êtes-vous simplement curieux de connaître l'historique d'une fonctionnalité ou d'une API obsolète et son fonctionnement.

+ +

Il existe de nombreuses raisons pour lesquelles une documentation plus ancienne peut être utile. Nous avons donc créé cette zone dans laquelle nous pouvons archiver une documentation plus ancienne. Le contenu de cette zone de contenu archivé ne doit pas être utilisé pour créer de nouveaux sites Web ou applications pour les navigateurs modernes. C'est ici pour référence historique seulement.

+ +
+

Note aux rédacteurs: Nous devons essayer de garder les sous-pages organisées ici au lieu de toutes les stocker dans un seul grand dossier. Essayez de créer des sous-arbres pour les catégories de matériaux. De plus, ne déplacez ici que les pages extrêmement obsolètes. Si quelqu'un a besoin de manière réaliste des informations contenues dans un produit vivant, il peut ne pas être approprié de les déplacer ici. En général, il peut être préférable d'en discuter dans la chat room MDN Web Docs avant de déplacer le contenu ici.

+
+ +

{{SubpagesWithSummaries}}

+ + + +

{{ListSubpages("", 2, 0, 1)}}

diff --git a/files/fr/archive/marketplace/api/domapplicationsregistry/getinstalled/index.html b/files/fr/archive/marketplace/api/domapplicationsregistry/getinstalled/index.html new file mode 100644 index 0000000000..c45592bda7 --- /dev/null +++ b/files/fr/archive/marketplace/api/domapplicationsregistry/getinstalled/index.html @@ -0,0 +1,37 @@ +--- +title: Apps.getInstalled +slug: Archive/Marketplace/API/DOMApplicationsRegistry/getInstalled +tags: + - API Apps + - Apps +translation_of: Archive/Marketplace/API/DOMApplicationsRegistry/getInstalled +--- +

{{ ApiRef() }}

+

{{ non-standard_header() }}

+

Résumé

+

Obtient la liste de toutes les applications installées pour cette origine. Par exemple, si appelé depuis le Firefox OS Marketplace, vous aurez la liste de toutes les application installées par le Firefox OS Marketplace.

+
+

Note : Plusieurs applications pour une même origine ne sont pas supportées. Pour héberger plusieur applications depuis un domaine, créer un sous-domaine pour chaque application. Par exemple : monapp.mondomaine.com, autreapp.mondomaine.com, et ainsi de suite.

+
+

Syntaxe

+
var requete = window.navigator.mozApps.getInstalled();
+
+

Paramètre

+

Aucun.

+

Exemple

+
var requete = window.navigator.mozApps.getInstalled();
+requete.onerror = function(e) {
+  alert("Erreur lors de l'appel de getInstalled : " + requete.error.name);
+};
+requete.onsuccess = function(e) {
+  alert("Succès, nombre d'applications : " + requete.result.length);
+  var appsRecord = requete.result;
+};
+

Il est nécessaire de définir des callbacks pour les propriétés onsuccess et onerror, tel que montré dans cet exemple. Si l'appel est réussi, un tableau d'objet App sera renvoyé dans la propriété result de l'objet renvoyé. Dans cette exemple, il s'agit de requete.result.

+

Erreurs

+

La chaîne de caractère ERROR peut être renvoyé dans DOMRequest.error.

+

Sujets en relation

+ diff --git a/files/fr/archive/marketplace/api/domapplicationsregistry/getself/index.html b/files/fr/archive/marketplace/api/domapplicationsregistry/getself/index.html new file mode 100644 index 0000000000..4c307a8d38 --- /dev/null +++ b/files/fr/archive/marketplace/api/domapplicationsregistry/getself/index.html @@ -0,0 +1,42 @@ +--- +title: Apps.getSelf +slug: Archive/Marketplace/API/DOMApplicationsRegistry/getSelf +tags: + - API Apps + - Apps +translation_of: Archive/Marketplace/API/DOMApplicationsRegistry/getSelf +--- +

{{ ApiRef() }}

+

{{ non-standard_header() }}

+

Résumé

+

Renvoie les informations sur l'application courante, ce qui veut dire une application installée dont le domaine correspond au domaine de l'application appelée.

+
+

Note : Plusieurs applications pour une même origine ne sont pas supportées. Pour héberger plusieurs applications depuis un domaine, créer un sous-domaine pour chaque application. Par exemple : monapp.mondomaine.com, autreapp.mondomaine.com, et ainsi de suite.

+
+

Syntaxe

+
var requete = window.navigator.mozApps.getSelf();
+
+

Paramètres

+

Aucun.

+

Renvoie

+

getSelf() renvoie un objet {{ domxref("DOMRequest") }}. Le champ DOMRequest.result contient un objet App, qui est un objet JavaScript décrivant l'application. Avant que l'opération soit terminée, DOMRequest.result est null.

+
+

Note : A cause du {{ Bug("806597") }}, requete.result retourne incorrectement null même sur l'application tourne sur l'ordinateur ou Firefox pour Android.

+
+

Si l'appel est un echec, DOMRequest.error contient un objet {{ domxref("DOMError") }}, qui contient des informations sur l'erreur.

+

Exemple

+

Un exemple montrant comme utiliser getSelf() avec les propriétés de callback DOMRequest.onsuccess et DOMRequest.onerror.

+
var requete = window.navigator.mozApps.getSelf();
+requete.onsuccess = function() {
+  // Affiche le nom de l'application depuis l'objet App
+  alert("Nom de l'application : " + requete.result.manifest.name);
+};
+requete.onerror = function() {
+  // Affiche le nom de l'erreur depuis l'objet DOMError
+  alert("Erreur : " + requete.error.name);
+};
+

Si l'appel est réussi, un objet {{ domxref("App") }} est renvoyé dans la propriété result de l'objet renvoyé. Dans cette exemple, il s'agit de requete.result.

+

Sujets en relation

+ diff --git a/files/fr/archive/marketplace/api/domapplicationsregistry/index.html b/files/fr/archive/marketplace/api/domapplicationsregistry/index.html new file mode 100644 index 0000000000..0a8dbc2490 --- /dev/null +++ b/files/fr/archive/marketplace/api/domapplicationsregistry/index.html @@ -0,0 +1,51 @@ +--- +title: Apps +slug: Archive/Marketplace/API/DOMApplicationsRegistry +tags: + - API Apps + - Apps + - B2G + - Firefox OS + - Interface + - Non-standard +translation_of: Archive/Marketplace/API/DOMApplicationsRegistry +--- +

{{APIRef("Apps")}}

+ +
+

Retrait du marketplace
+ La fonctionnalité décrite ici ne fonctionne plus.  Firefox Marketplace a été décommisionné pour Android, les ordinateurs de bureau, les tablettes et les paiement. Voir Future of Marketplace FAQ pour plus d'informations.

+
+ +

Permet d'installer, de gérer et de contrôler des applications Web depuis un navigateur pour une installation dans Firefox OS. Implémentée par navigator.mozApps.

+ +

Propriétés

+ +
+
DOMApplicationsRegistry.mgmt
+
Un objet mgmt qui expose les fonctions pour la gestion du tableau de bord et le lancement d'applications au nom de l'utilisateur.
+
+ +

Méthodes

+ +
+
DOMApplicationsRegistry.checkInstalled()
+
Vérifie si une application a déjà été installée avec le manifeste passé en paramètre.
+
DOMApplicationsRegistry.install()
+
Déclenche l'installation de l'application. Lors de l'installation, l'application est validée et l'utilisateur doit approuver l'installation.
+
DOMApplicationsRegistry.installPackage()
+
Installe une application empaquetée.
+
DOMApplicationsRegistry.getSelf()
+
Renvoie un objet contenant l'objet app de l'application.
+
DOMApplicationsRegistry.getInstalled()
+
Fournit une liste des applications installées.
+
+ +

Méthodes obsolètes

+ +
+
DOMApplicationsRegistry.amInstalled() {{Obsolete_Inline}}
+
Permet de vérifier si une application est installée.
+
DOMApplicationsRegistry.getInstalledBy() {{Obsolete_Inline}}
+
Renvoie les applications installées depuis le domaine appelant. Cela permet à un registre d'application de déterminer quelle application a été installée au nom de l'utilisateur.
+
diff --git a/files/fr/archive/marketplace/api/domapplicationsregistry/install/index.html b/files/fr/archive/marketplace/api/domapplicationsregistry/install/index.html new file mode 100644 index 0000000000..ba677690fa --- /dev/null +++ b/files/fr/archive/marketplace/api/domapplicationsregistry/install/index.html @@ -0,0 +1,86 @@ +--- +title: Apps.install +slug: Archive/Marketplace/API/DOMApplicationsRegistry/install +tags: + - API Apps + - Apps +translation_of: Archive/Marketplace/API/DOMApplicationsRegistry/install +--- +
+ {{ApiRef}} {{non-standard_header}}
+

Résumé

+

Déclenche l'installation d'une application. Pendant le processus d'installation, l'application est validée et l'utilisateur doit approuver l'installation.

+

Si une application a déjà été installé depuis le même domaine, appeler install() à nouveau peux écraser silencieusement, les données déjà installées. Ceci peut être utilisé pour modifier le reçu d'achat, par exemple, quand un utilisateur passe d'une application gratuite à une application premium.

+

Syntaxe

+
var request = window.navigator.mozApps.install(url, [receipts]);
+

Paramètres

+
+ Note : Il y a actuellement (Février 2013) un bug lorsque l'on passe un chemin relatif dans le paramètre url. Voir {{ Bug("745928") }}.
+
+
+ url
+
+ Une chaîne de caractères d'URL contenant l'adresse du manifeste à installer. Dans le cas d'une distribution personnel (quand l'origine d'installation est la même que celle de l'application), le site peut omettre l'origine dans l'URL et fournir un chemin absolu (commençant par /).
+
+ receipts
+
+ (facultatif) un objet JSON contenant un tableau d'un ou plusieurs reçus.
+
+ 
window.navigator.mozApps.install(url, {receipts: ["receipt1", ...]})
+
+
+ Si receipts n'est pas renseigné, il est traité comme null.
+
+

La fonction install() lève une exception si l'argument requis  (url) est absent, ou si des arguments non supportés sont présent.

+

Renvoie

+
+ Note : Il y a actuellement (Février 2013) un bug avec l'attribut DOMRequest.result affectant les appareils Android et les ordinateurs. Voir {{ Bug("806597") }}.
+

La fonction install() renvoie un objet {{ domxref("DOMRequest") }}. Le champ DOMRequest.result contient un objet App, qui est un objet JavaScript décrivant l'application venant d'être installée. Avant que l'opération soit finie, DOMRequest.result est null.

+

Si l'installation est infructueuse, DOMRequest.error contient un objet DOMError, qui a les informations à propos de l'erreur.

+

Exemple

+

Un exemple montrant comment utiliser install() avec les propriétés de callback DOMRequest.onsuccess et DOMRequest.onerror.

+
var request = window.navigator.mozApps.install(manifestUrl);
+request.onsuccess = function () {
+  // Enregistre l'objet App qui est renvoyé
+  var appRecord = this.result;
+  alert('Installation réussie !');
+};
+request.onerror = function () {
+  // Affiche le nom de l'erreur depuis l'objet DOMError
+  alert('Installation échouée, erreur : ' + this.error.name);
+};
+
+

Le callback onsuccess est appelé si l'installation est réussie. Ceci veut dire que les actions de l'installation ont eu lieu.

+

Si l'installation est un échec, le callback onerror est appelé. Sur une installation échouée, DOMRequest.error contient un objet DOMError qui a des informations sur l'erreur.

+

Le code peut vous apparaître étrange, avec les guetteurs d'évènement ajoutés après que la fonction ait été appelée. Cependant, c'est la façon dont l'objet DOMRequest opère. L'appel de la fonction attendra que les guetteurs d'évènement aient été définis, et ils seront déclenchés en fonction de la situation. La fonction install() marche aussi par elle-même sans les guetteurs d'évènement.onsuccess et .onerror.

+

Erreurs

+

Quand l'installation est un échec, l'une de ces erreurs peut être retournée dans DOMRequest.error.

+
+
+ DENIED
+
+ L'utilisateur a annulé l'installation.
+
+ INVALID_MANIFEST
+
+ Le manifeste, bien qu'étant un JSON correctement formé, n'a pas certains champs requis, ou est pour une raison quelconque non valide.
+
+ MANIFEST_URL_ERROR
+
+ Un autre code HTTP que le code statut 200 a été reçu, ou une autre erreur de connection.
+
+ MANIFEST_PARSE_ERROR
+
+ JSON mal formé pour le manifeste.
+
+ NETWORK_ERROR
+
+ Erreur de connection.
+
+ + diff --git a/files/fr/archive/marketplace/api/index.html b/files/fr/archive/marketplace/api/index.html new file mode 100644 index 0000000000..2d3a3d7bf3 --- /dev/null +++ b/files/fr/archive/marketplace/api/index.html @@ -0,0 +1,38 @@ +--- +title: Marketplace API reference +slug: Archive/Marketplace/API +tags: + - API + - Archive + - Marketplace + - Overview + - Reference + - TopicStub +translation_of: Archive/Marketplace/API +--- +

Les API liées à la marketplace ont été supprimées, les informations les concernant ont donc été archivées.

+ +
+
+
+
API d'installation et de gestion des applications
+
L'API JavaScript Open Web Apps est une interface de programmation permettant d'installer des applications Web et de gérer une collection côté client d'applications Web installées par un utilisateur. Cette collection est appelée le référentiel d'applications.
+
Gestionnaire d'applications DOM
+
Fournit une assistance pour la gestion et l'installation des applications Web ouvertes dans un navigateur. Un gestionnaire est accessible via Navigator.mozApps.mgmt
+
+ +
+
+
+ +
+
+
Registre des applications DOM
+
Fournit une assistance pour l'installation, la gestion et le contrôle des applications Web ouvertes dans un navigateur pour une installation sur Firefox OS. Actuellement implémenté en tant que navigator.mozApps.
+
Navigateur (Marketplace)
+
Extensions de navigateur spécifiques à Marketplace qui sont désormais dépréciés / obsolètes.
+
+
+
+ +

{{IncludeSubnav("/en-US/docs/Archive/Marketplace")}}

diff --git a/files/fr/archive/marketplace/index.html b/files/fr/archive/marketplace/index.html new file mode 100644 index 0000000000..29aa1090cc --- /dev/null +++ b/files/fr/archive/marketplace/index.html @@ -0,0 +1,56 @@ +--- +title: Marketplace +slug: Archive/Marketplace +tags: + - Archive + - Landing + - Marketplace + - TopicStub +translation_of: Archive/Marketplace +--- +

De nombreux aspects de Firefox Marketplace seront bientôt supprimés, d'autres suivront alors que les différents services proposés par Marketplace sont en fin de vie. La documentation associée sera déplacée ici au fur et à mesure de sa suppression. Consultez la FAQ sur le future de la Marketplace pour plus de réponses.

+ +
+
+
+
Référence de l'API marketplace
+
Les API liées à la marketplace ont été supprimées, les informations les concernant ont donc été archivées.
+
Monétisation
+
Sujets de monétisation qui ont maintenant été archivés en raison de la suppression des fonctionnalités pertinentes de Firefox Marketplace.
+
+ +
+
+
+ +
+
+
Options
+
Options de publication qui ne sont plus disponibles, d'où l'archivage des informations.
+
Publication
+
Publication de détails qui ne sont plus disponibles, d'où l'archivage des informations.
+
+
+
+ + diff --git a/files/fr/archive/mdn/index.html b/files/fr/archive/mdn/index.html new file mode 100644 index 0000000000..42ad1f3fe5 --- /dev/null +++ b/files/fr/archive/mdn/index.html @@ -0,0 +1,42 @@ +--- +title: MDN +slug: Archive/MDN +tags: + - TopicStub +translation_of: Archive/MDN +--- +
+

Obsolète
+ Cette fonctionnalité est obsolète. Bien qu'il puisse toujours fonctionner dans certains navigateurs, son utilisation est déconseillée car il peut être supprimé à tout moment. Essayez d'éviter de l'utiliser.

+
+ + + +

La documentation répertoriée ci-dessous est un matériel archivé et obsolète sur MDN lui-même.

+ + + +
+
+
+
Kits de contenu
+
Les kits de contenu MDN sont des collections de ressources techniques basées sur des sujets pour vous aider à organiser une réunion de développeurs locaux ou à faire une présentation technique lors d'un événement, d'une conférence ou d'un atelier.
+
Comment lier un compte GitHub à votre profil MDN
+
Tous les utilisateurs qui souhaitent contribuer à MDN doivent ajouter une connexion GitHub à leur compte MDN pour pouvoir modifier. Cet article décrit comment ajouter l'authentification GitHub à votre profil MDN.
+
Connexions MDN et Persona
+
À compter du 1er novembre 2016, nous ne prenons en charge que GitHub pour la connexion à MDN. Si vous n'avez pas ajouté de connexion GitHub à votre compte MDN avant que nous ayons désactivé les connexions Persona, veuillez déposer un bogue "Account Help" bug sur Bugzilla.
+
+ +
+
+
+ +
+
+
Experts en la matière
+
Le but de cet article est d'aider les rédacteurs à trouver les développeurs Mozilla qui ont des réponses aux questions sur diverses technologies. Si vous êtes ingénieur sur un projet Mozilla, s'il vous plait veuillez vous assurer que votre technologie figure sur cette liste et que les coordonnées de votre groupe sont fournies.
+
Zones
+
Une zone est une zone spéciale de MDN dont le contenu est présenté avec des éléments d'interface utilisateur supplémentaires, tels qu'une zone de navigation de zone spéciale et des éléments visuels améliorés dans la zone d'en-tête de la page.
+
+
+
diff --git a/files/fr/archive/meta_docs/index.html b/files/fr/archive/meta_docs/index.html new file mode 100644 index 0000000000..86342ad94c --- /dev/null +++ b/files/fr/archive/meta_docs/index.html @@ -0,0 +1,30 @@ +--- +title: MDN "meta-documentation" archive +slug: Archive/Meta_docs +tags: + - Archive + - MDN + - TopicStub +translation_of: Archive/Meta_docs +--- +

Vous trouverez ici la "méta-documentation" archivée; c'est-à-dire de la documentation sur la façon d'écrire de la documentation sur MDN. Les articles ici sont obsolètes et ne devraient plus être référencés; nous les conservons ici pour référence pendant que nous migrons certains contenus vers de nouveaux endroits, mais très peu de ces éléments sont utiles.

+ + + +
+
+
+
+
+ +
+
+
+ +
+
+
Classes CSS personnalisées
+
Cette page liste les classes CSS qui ont été spécifiquement créées pour MDC. Si vous avez d'autres idées de classes CSS qui pourraient être utiles pour ce wiki, n'hésitez pas à contacter Dria (en).
+
+
+
diff --git "a/files/fr/archive/misc_top_level/images,_tableaux_et_d\303\251calages_myst\303\251rieux/index.html" "b/files/fr/archive/misc_top_level/images,_tableaux_et_d\303\251calages_myst\303\251rieux/index.html" new file mode 100644 index 0000000000..508196322e --- /dev/null +++ "b/files/fr/archive/misc_top_level/images,_tableaux_et_d\303\251calages_myst\303\251rieux/index.html" @@ -0,0 +1,195 @@ +--- +title: 'Images, tableaux et décalages mystérieux' +slug: 'Archive/Misc_top_level/Images,_tableaux_et_décalages_mystérieux' +tags: + - CSS +translation_of: 'Archive/Misc_top_level/Images,_Tables,_and_Mysterious_Gaps' +--- +

 

+ +

Quelle que soit l'époque à laquelle vous avez créé vos premières pages Web, il y a de fortes chances pour vous ayez utilisé l'un ou l'autre graphisme basé sur le schéma classique « tableaux imbriqués et pléthore d'images ». Que vous ayez découpé un logo en plusieurs morceaux afin de l'adapter correctement à la mise en page, ou que vous ayez utilisé une multitude de GIF d'espacement à un seul pixel, les principes (et les dangers) restent les mêmes. Dans les premiers temps du Web, cette approche fonctionnait car les navigateurs adaptaient les dimensions des cellules de tableaux à celles des images qu'elles contenaient.

+ +

Avançons rapidement jusqu'en 2001, avec l'apparition de nombreux navigateurs respectant les standards qui affichent les pages Web en utilisant HTML et CSS plutôt que leur propre algorithme propriétaire de rendu. Grâce à une partie obscure de la spécification CSS, chaque mise en page basée sur une disposition précise de petites images dans des cellules de tableau devient un désastre visuel ne demandant qu'à se produire. Il suffit d'un navigateur moderne et du bon DOCTYPE, et badaboum !

+ +

Les composants

+ +

Regardons de plus près à l'endroit où cela se produit, et pourquoi cela pose problème. Commençons par un exemple simple, illustré par le figure 1 : un tableau d'une seule cellule contenant une image.

+ +

Figure 1

+ +

Évidemment, la plupart des mises en page sont un peu plus compliquées que cela, mais cela convient parfaitement pour notre démonstration. Une image, une cellule — c'est tout ce qu'il faut. Il n'y a apparemment aucun problème dans cet exemple. Et il n'est pas censé y en avoir puisque cet exemple reproduit le comportement traditionnel des navigateurs.

+ +

Voyons maintenant ce que cet exemple donne dans un navigateur moderne lorsque la page a un DOCTYPE strict.

+ +

Figure 2

+ +

Remarquez l'espace supplémentaire sous l'image de la figure 2. Le balisage du tableau et de la cellule n'a pas changé — c'est le mode de rendu qui est différent. Plutôt que « d'adapter » l'image elle-même, le navigateur enveloppe maintenant la ligne sur laquelle repose l'image. L'image repose sur une ligne parce que c'est, par défaut, un élément de type inline (en-ligne). Il n'en faut pas plus.

+ +

Construction d'un contenu en-ligne

+ +

Afin de comprendre ce qui se passe exactement, regardons de plus près la construction d'une boîte de type en-ligne, le placement d'une image dans une boîte en-ligne, et enfin, le placement d'une boîte en-ligne dans une cellule de tableau. Tout d'abord, prenons une boite en-ligne basique contenant du texte, telle que montrée sur la figure 3.

+ +

Figure 3

+ +

La partie la plus cruciale de la figure 3 est la ligne de référence (ou ligne de base, représentée par la ligne bleue), et sa position dans la boîte en-ligne. Le positionnement exact de cette ligne dépend de la police « par défaut » de la boîte en-ligne (représentée par le cadre rouge), qui est déterminée par la valeur de la propriété CSS font-family pour l'élément contenant la boîte en-ligne. Il n'est pas possible pour un auteur de changer directement la position de la ligne de référence, elle ne bougera pas d'où elle s'est mise. L'espace sous la ligne de base est appelé « espace descendant » car c'est l'endroit où s'affichent les jambages des lettres bas de casse comme « j » et « p ». La figure 4 montre ce qui arrive lorsqu'on ajoute une image à cet ensemble.

+ +

Figure 4

+ +

Remarquez l'endroit où se pose l'image par défaut : son bord inférieur est aligné avec la ligne de référence de la boîte en-ligne. Ce placement peut être modifié à l'aide de la propriété vertical-align — nous en reparlons plus loin — mais presque personne ne modifie sa valeur par défaut. Enlevons le texte et conservons l'image seule, comme sur la figure 5.

+ +

Figure 5

+ +

Nous avons donc une image posée sur la ligne de référence d'une boîte de type en-ligne qui ne contient que cette image. Imaginez maintenant ce que nous obtenons en mettant cette ligne dans une cellule de tableau (figure 6).

+ +

Figure 6

+ +

Et là, ça y est — des espaces s'ouvrent là où il n'y en avait pas auparavant. C'est pire avec de petites images comme celles qui ne font qu'un pixel, comme l'illustre la figure 7.

+ +

Figure 7

+ +

Maintenant, toutes sortes d'espaces s'ouvrent inopinément. C'est suffisant pour rendre fou un graphiste.

+ +

Les solutions possibles

+ +

Une solution évidente existe — arrêter de créer des mises en page dépendantes de tableaux ou utilisant des images découpées ou d'espacement de 1 pixel — mais elle n'est pas terriblement pratique pour de nombreux graphistes Web, et elle n'aide pas à corriger les anciennes conceptions qui volent en éclats dans les navigateurs récents. Une autre solution évidente consiste à vous assurer que votre document ne déclenchera pas le mode de rendu « standard ».

+ +

Cela peut ce faire à l'aide d'une déclaration DOCTYPE qui appellera le mode « quirks » ou le mode « presque standard », ou en ne mettant tout simplement pas de DOCTYPE dans votre document. L'absence de DOCTYPE empêchera la validation et ce n'est par conséquent par recommandé. Pour les auteurs qui travaillent avec des documents récupérés d'autres personnes, un DOCTYPE pour le mode « quirks » est le meilleur choix. Dans le cas où l'auteur écrit un nouveau document ou s'il désire migrer une mise en page en respectant le plus possible les standards, alors le mode « presque standard » est probablement plus adapté.

+ +

Bien sûr, les documents écrits en XHTML Strict ou en HTML Strict appelleront le mode de rendu « standard », aussi allons-nous voir deux méthodes basiques de résoudre ce problème dans les documents stricts, et un certain nombre de façons d'appeler les « corrections ».

+ +

Définir les images comme éléments de type bloc

+ +

Le premier choix, et un de ceux qui fonctionnera pour les graphismes chargés en images, est de convertir les images, qui sont par défaut des éléments en-ligne, en éléments de type bloc. Faites cela et une image ne créera plus de boîte en-ligne, ce qui résoudra le problème — en supposant que l'image est le seul élément contenu dans la cellule de tableau. Dans le cas le plus simple, il faudra ajouter une règle de style comme celle qui suit :

+ +
td img {display: block;}
+
+ +

Observons l'application de cette règle au code HTML suivant :

+ +
<table cellspacing="0" cellpadding="0" border="0" width="500">
+
+  <tr>
+    <td>
+      <img src="nav1.gif"><img src="nav2.gif"><img src="nav3.gif">
+      <img src="nav4.gif"><img src="nav5.gif">
+    </td>
+  </tr>
+
+  <tr>
+    <td style="background: red;">
+      <img src="smallred.gif" height="1" width="1">
+    </td>
+  </tr>
+
+  <tr>
+    <td>
+      <p style="margin: 0.5em;">Ce texte est dans une
+      autre cellule de tableau. Au milieu du texte se
+      trouve une icône <img src="icon2.gif"> indiquant
+      un lien externe. It's very worldly.  Lorem
+      ipsum, dolor sit amet…</p>
+    </td>
+  </tr>
+
+</table>
+
+ +

Comme on peut le voir sur la figure 8, cela fonctionne dans certain cas, mais ce n'est pas vrai toutes les images.

+ +

Figure 8

+ +

La fine ligne rouge indique que la cellule est redimensionnée à 1 pixel de hauteur par l'image GIF d'espacement de 1 pixel, comme le voulait le graphiste. Malheureusement, les boutons en haut de la cellule sont maintenant des éléments de type bloc et ils s'empilent les uns au dessus des autres au lieu de s'afficher côte-à-côte.

+ +

Une solution possible consiste à ajouter une classe CSS pour toutes les images nécessitant une redéfinition en éléments de type bloc et d'écrire la règle qui correspond :

+ +
td img.decoration {display: block;}
+
+<td>
+  <img src="reddot.gif" class="decoration">
+</td>
+
+ +

Selon le graphisme, cela pourrait conduire à ajouter de nombreuses classes pour ce simple effet. Ce sera particulièrement vrai si de nombreuses cellules de 1 pixel destinées à créer des lignes d'empilement idéales sont présentes, ou quelque chose dans ce genre. Si vous disposez d'un balisage se prêtant bien à cette approche, vous pouvez définir des classes CSS sur les rangs de tableau plutôt que sur les images. Ainsi vous auriez :

+ +
tr.decoration img { display: block; }
+
+ +

… avec la modification du code HTML suivante :

+ +
<tr class="decoration">
+  <td style="background: red;">
+    <img src="smallred.gif" height="1" width="1">
+  </td>
+</tr>
+
+ +

Le résultat obtenu est que le GIF d'espacement devient un élément de type bloc, sans que l'on touche aux autres images. Cela conduit au résultat décrit par la figure 9.

+ +

Figure 9

+ +

Vous pouvez également classer les cellules plutôt que les rangs, si c'est le meilleur choix pour vous. Dans tous les cas, définir les images en élément de type bloc peut avoir des effets inattendus si vos cellules de tableau contiennent plus d'une image, comme sur la figure 8.

+ +

Bien sûr, bien que nous ayons une cellule d'espacement de 1 pixel à la figure 9, nous avons toujours un espace indésirable sous les boutons et sur toute la largeur. Enlever cet espace pourrait être aussi facile que de mettre chaque image dans une cellule de tableau et de les définir en élément de type bloc, mais laissons-les toutes dans la même cellule que nous puissions illustrer une autre approche.

+ +

Utilisation de l'alignement vertical

+ +

L'autre solution consiste à laisser l'image comme élément en-ligne et de modifier son alignement vertical par rapport à la ligne de référence de la boîte en-ligne. Par exemple, vous pouvez essayez ce qui suit :

+ +
td img { vertical-align: bottom; }
+
+ +

Ceci alignera les bords inférieurs des images avec les bords inférieurs des boîtes de type en-ligne, plutôt qu'avec la ligne de base. Comme vous pouvez le voir sur la figure 10, nous obtenons l'effet souhaité : l'espace sous les images de la barre de navigation a disparu. Cependant, la cellule décorative est toujours trop grande, et les autres images sont mal alignées par rapport au texte qui les entoure.

+ +

Figure 10

+ +

Une fois encore, nous pourrions définir des classes d'images, de cellules ou de rangs afin de nous rapprocher de l'effet désiré. Cependant, les styles affichés ci-dessus ne surmonteront pas le problème des images d'espacement, parce que la boîte en-ligne qui les entoure aura la hauteur de la police pour la cellule, et ne rétrécira donc pas. L'image se déplacera vers le bas de la cellule, mais la cellule ne « rétractera » pas sur l'image. De plus, toute autre image de taille plus petite que la boîte en-ligne aura toujours un espace autour d'elle — comme cela se produit avec la cellule de séparation rouge. L'image d'espacement de 1 pixel est maintenant alignée dans la cellule avec le bord inférieur de celle-ci, mais la ligne de référence est de retour et elle a la taille du texte normal.

+ +

Voyez, par exemple, la figure 11, où la taille de la police a été considérablement augmentée. Les images de la barre de navigation ont maintenant un espace en dessous d'elles, et la bande rouge est bien plus large.

+ +

Figure 11

+ +

Il est difficile d'éviter cela, parce que les images sont, dans cette solution, encore des éléments de type en-ligne et participent donc toujours à la création d'une boîte de type en-ligne. Si cette boîte devient suffisamment grande, l'espace commencera à apparaître autour des images.

+ +

Voir plus loin

+ +

Grâce à l'implémentation minutieuse de CSS2 dans Mozilla, ce problème des images en-ligne dans des cellules de tableaux créant des espaces non désirés a été porté à l'attention du groupe de travail CSS du W3C. Plusieurs propositions de corrections ont été soumises, mais l'une des plus prometteuses est la propriété line-box-contain, qui a été proposée pour l'intégration dans CSS3. Si cette propriété devait être adoptée, alors tous les navigateurs la supportant pourraient émuler le comportement traditionnel de « rétrécissement », sans risquer d'autre problème d'affichage avec la règle suivante :

+ +
td {line-box-contain: font replaced;}  /* proposée pour CSS3 */
+
+ +

Il existe d'autres solutions possibles dans le brouillon de travail CSS3, comme line-height-policy (en). Évidemment, plus vite des solutions seront trouvées et implémentées, plus les auteurs seront contents.

+ +

Recommandations

+ +

En l'absence du support de CSS3, il est difficile d'établir un ensemble précis de règles permettant de résoudre chaque occurrence de ces problèmes, car la meilleure solution pour un document donné dépendra grandement de sa structure. Si votre document utilise un balisage transitionnel, assurez-vous que son DOCTYPE corresponde et qu'il n'appelle pas le mode « standard ». Cela évitera aux navigateurs d'utiliser les modes de rendu standards, et ainsi tous les problèmes liés à la disposition des images seront résolus. Si vous utilisez un balisage strict, ou si vous avez besoin pour toute autre raison d'avoir un mode de rendu « standard », alors souvenez-vous de ces conseils :

+ + + +

Avec un cocktail judicieux des différentes approches et une réduction du nombre de GIF d'espacement de 1 pixel — qui ne sont absolument pas nécessaires dans un navigateur respectant les standards CSS — il est toujours possible de contourner cet étrange effet du support des standards.

+ +

La meilleure solution est de s'assurer que les images soient toujours dans les cellules elles-mêmes, ce qui permet de les définir comme éléments de type bloc, mais comme toujours, cela dépendra de la conception de l'auteur.

+ +

Articles connexes

+ + + +
+

Informations sur le document original

+ + +
+ +

Interwiki Languages Links

+ +

diff --git a/files/fr/archive/misc_top_level/index.html b/files/fr/archive/misc_top_level/index.html new file mode 100644 index 0000000000..95bf3b61ab --- /dev/null +++ b/files/fr/archive/misc_top_level/index.html @@ -0,0 +1,8 @@ +--- +title: Misc top level +slug: Archive/Misc_top_level +translation_of: Archive/Misc_top_level +--- +

In progress. These pages were moved from the top level of MDN in a spate of furious reorganization.

+ +

diff --git a/files/fr/archive/misc_top_level/monitoring_wifi_access_points/index.html b/files/fr/archive/misc_top_level/monitoring_wifi_access_points/index.html new file mode 100644 index 0000000000..11f243a830 --- /dev/null +++ b/files/fr/archive/misc_top_level/monitoring_wifi_access_points/index.html @@ -0,0 +1,92 @@ +--- +title: Monitoring WiFi access points +slug: Archive/Misc_top_level/Monitoring_WiFi_access_points +translation_of: Archive/Misc_top_level/Monitoring_WiFi_access_points +--- +

+ +

Avec les privilèges UniversalXPConnect le code peut scruter les points d'accès WiFi disponibles afin d'obtenir des informations à leur sujet, entre autres leur SSID, adresses MAC et la force du signal. Cette fonctionnalité a été introduite principalement pour permettre aux services de geolocalisation d'utiliser les services de localisation basés sur le WiFi.

+ +

Exemple

+ +

Cette exemple affiche simplement une liste des points d'accès diponibles.

+ +
<html>
+<head>
+<title>Exemple de scrutation WiFi</title>
+<script>
+
+var count = 0;
+
+function test() {
+}
+
+test.prototype =
+{
+  onChange: function (accessPoints)
+  {
+    netscape.security.PrivilegeManager.enablePrivilege('UniversalXPConnect');
+    var d = document.getElementById("d");
+    d.innerHTML = "";
+
+    for (var i=0; i<accessPoints.length; i++) {
+      var a = accessPoints[i];
+      d.innerHTML += "<p>" + a.mac + " " + a.ssid + " " + a.signal + "</p>";
+    }
+
+    var c = document.getElementById("c");
+    c.innerHTML = "<p>" + count++ + "</p>";
+
+  },
+
+  onError: function (value) {
+     alert("error: " +value);
+  },
+
+  QueryInterface: function(iid) {
+        netscape.security.PrivilegeManager.enablePrivilege('UniversalXPConnect');
+        if (iid.equals(Components.interfaces.nsIWifiListener) ||
+            iid.equals(Components.interfaces.nsISupports))
+            return this;
+        throw Components.results.NS_ERROR_NO_INTERFACE;
+   },
+}
+
+  netscape.security.PrivilegeManager.enablePrivilege('UniversalXPConnect');
+
+  var listener = new test();
+  var wifi_service = Components.classes["@mozilla.org/wifi/monitor;1"].getService(Components.interfaces.nsIWifiMonitor);
+
+  wifi_service.startWatching(listener);
+
+</script>
+</head>
+
+<body>
+<div id="d"><p></p></div>
+<div id="c"><p></p></div>
+</body>
+</html>
+
+ +

L'objet nsIWifiListener

+ +

La première action de ce code est de prototyper l'objet écouteur qui recevra les notifications de changement dna sla liste des points d'accès. Cet objet est décrit par les lignes 11 à 40.

+ +

La méthode onChange() (lignes 13 à 27) commence par activer les privilèges UniversalXPConnect, puis vide le div (d) qui va recevoir la liste des points daccès mis à jour. La boucle lignes 19 à 22 itère ensuite sur la liste des points d'accès reçus dans le tableau accessPoints et les ajoute au contenu du div.

+ +

Par la suite le div c est mis à jour avec le nombre de fois où liste a été  renouvellée.

+ +

La méthode onError() fait simplement surgir une laert qui affiche le code erreur reçu.

+ +

Lancer la scrutation des points d'accès

+ +

Pour commencer la scrutation des points d'accès, on instancie l'écouteur (ligne 44) puis  on attrape une référence à l'interface de scrutation WiFi ligne 45. La scrutation commence ligne 47 en appelant la méthode startWatching() sur l'interface.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/misc_top_level/utilisation_de_data_islands_xml_dans_mozilla/index.html b/files/fr/archive/misc_top_level/utilisation_de_data_islands_xml_dans_mozilla/index.html new file mode 100644 index 0000000000..5e4e7d224e --- /dev/null +++ b/files/fr/archive/misc_top_level/utilisation_de_data_islands_xml_dans_mozilla/index.html @@ -0,0 +1,198 @@ +--- +title: Utilisation de Data Islands XML dans Mozilla +slug: Archive/Misc_top_level/Utilisation_de_Data_Islands_XML_dans_Mozilla +tags: + - Obsolete + - XML +translation_of: Archive/Misc_top_level/Using_XML_Data_Islands_in_Mozilla +--- +

 

+

Cet article est obsolète. S'il vous plaît voir le nouvel article en anglais.

+

Une fonctionnalité pratique d'Internet Explorer est la possibilité d'utiliser des îlots de données (Data islands, en anglais) pour lier des données aux contrôles HTML sur une page. Cette fonctionnalité n'est pas intégrée telle quelle dans Mozilla, mais on peut aisément imiter ce comportement pour créer des applications Web multi-navigateurs.

+

L'îlot de données basique que nous allons utiliser est un élément XML simple, soit lié à la page, soit codé explicitement dans celle-ci. Voici un exemple simple pour illustrer ceci :

+
<xml id="xmlDataIsland">
+   <loaninfo>
+       <borrower id="1">
+           <firstname>Brian</firstname>
+           <middlename>Ellis</middlename>
+           <lastname>Johnson</lastname>
+       </borrower>
+   </loaninfo>
+</xml>
+
+

Avec cet îlot de données, nous pouvons placer sur une page autant de contrôles que désirés en liant simplement l'îlot de données à ces contrôles à l'aide de JavaScript et du DOM.

+

Pour lier ceci, tout ce que nous avons besoin de faire est de confier le remplissage des contrôles à une fonction telle que :

+
function loadFields()
+{
+   var xmlNode = window.document.getElementsByTagName('xml');
+   var borrowerNode = xmlNode[0].childNodes[1];
+   if(borrowerNode.hasChildNodes())
+   {
+       var i = 0;
+       var xmlChildNode, nodeVal=;
+       while(borrowerNode.childNodes[i])
+       {
+           // Recherche un nœud
+           xmlChildNode = borrowerNode.childNodes[i];
+           // Vérifie le type de nœud
+           if(xmlChildNode.nodeType != 3) // #text == 3
+           {
+               // Récupère la valeur du nœud (aka texte)
+               nodeVal += xmlChildNode.firstChild.nodeValue + ' ';
+           }
+           i++;
+       }
+       // Applique la valeur du contrôle au nœud
+       window.document.getElementById('txtBorrowerName').value = nodeVal;
+   }
+}
+
+

Exemple 1

+

Voici un autre exemple d'ilot de données XML utilisable dans Mozilla ou IE :

+
<xml id="mxxdataisland">
+   <mxxdataisland>
+       <rowset tagid="DATES"></rowset>
+       <rowset tagid="SUBJPRP"></rowset>
+       <rowset tagid="PRODUCT"></rowset>
+   </mxxdataisland>
+</xml>
+
+

Le role de cet îlot de données est d'apprendre au serveur d'applications à quels tableaux cette page va accéder.

+

Les contrôles de cette page sont alors liés au moyen des attributs personnalisés MXXOBJECT et MXXPROPERTY, très semblables aux attributs DATASRC et DATAFLD utilisés par IE. Ceci permet aux données XML retournées d'être analysées et liées ou « attachées » aux contrôles.

+

Remarque : Les noms MXXOBJECT et MXXPROPERTY ont été créés pour cet article, et peuvent être différents.

+

Lier les contrôles :

+
<input
+    type="text"
+    id="PropertyStAddr1"
+    name="PropertyStAddr1"
+    style="height:21px;width:302px;text-align:left;"
+    maxlength="35"
+    class="fldDefault"
+    mxxobject="SUBJPRP" mxxproperty="PropertyStAddr1" <-- voici nos balises "d'attache"
+>
+
+<input
+    type="text"
+    class="fldZipCode"
+    name="PropertyZip"
+    id="PropertyZip"
+    size="10"
+    style="height:21px;width:69px;"
+    mxxobject="SUBJPRP" mxxproperty="PropertyZip" <-- voici nos balises "d'attache"
+    mxxxmlnode="xmldef_PropertyZip" <-- this links to a control-level data island
+    mxxtype="MXXZipCodeAutoLoadEdit" <-- type personnalisé et optionnel pour manipuler les contrôles
+>
+
+

Comme nous envoyons du XML au serveur, nous pouvons également lui envoyer certaines informations supplémentaires dont un contrôle particulier pourrait avoir besoin, ou lui signaler d'autres contrôles sur la page liés ou dirigés par un contrôle. Ci-dessous, voici un exemples de DataIsland personnalisé pour un type spécifique de contrôle :

+
<select
+    id="PropertyState"
+    name="PropertyState"
+    style="height:20px;width:48px;"
+    class="cmbDefault"
+    mxxtype="GFXStateList"
+    mxxxmlnode="xmldef_PropertyState"
+    mxxobject="GOXSUBJPRP" mxxproperty="PropertyState"
+>
+</select>
+
+<div style="width:0px; height:0px; visibility:hidden;z-index:1">
+    <xml id="xmldef_PropertyState">
+        <mxxstatelist>
+            <status value="initialize"></status>
+            <contenttype value="abbrev"></contenttype>
+            <controls>
+                <control type="countylist" tagid="PropertyCounty" contenttype="name"
+                         valuetype ="name"></control>
+            </controls>
+        </mxxstatelist>
+    </xml>
+</div>
+
+

Telles quelles, ces XMLDataIslands ne nous sont d'aucune utilité. Il nous faut d'abord accomplir deux choses.

+
    +
  1. Construire un gestionnaire de contrôle pour gérer les mises à jour et le rendu des différents types de contrôles.
    + (Note : Les types de contrôles peuvent être n'importe quoi ; objet formulaire, tableau, spans, divs, iFrames, et tout ce à quoi vous avez accès via le DOM et un ID est valide)
    2. +
  2. Construire un gestionnaire pour créer un DOM à envoyer au serveur, et transmettre la réponse une fois analysée aux contrôles.
    3. +
+

Tout ce qu'un gestionnaire de contrôle doit être capable est de mettre à jour une valeur de contrôle. Cela signifie que tous les TextInputs peuvent partager un même gestionnaire, les selects un autre, etc. Une façon d'y parvenir est de regrouper les contrôles d'une page donnée dans un tableau associatif. Puis, lorsqu'une réponse est retournée, nous pouvons analyser le code XML à l'aide d'un attribut ID pour faire correspondre les données utiles XML avec un contrôle.

+
<input type="text" id="FirstName" ...>
+
+

Exemple de fonction de collection d'objets :

+
   // Extraction de tous les éléments pour les analyser
+   var tags = window.document.body.getElementsByTagName("*");
+   var pPrevElem = null;
+   var pNextElem = null;
+   for (var i = 0; i < tags.length; i++)
+   {
+       pHTMLElement = tags[i];
+
+       switch (pHTMLElement.tagName.toLowerCase())
+       {
+           case "span":
+           case "table":
+               // this indexes by controlID and stores the elementObject
+               m_MXXPageObjectsArray[pHTMLElement.id] = pHTMLElement;
+               break;
+           case "input":
+           case "select":
+           case "textarea":
+           case "button":
+               // this indexes by controlID and stores the elementObject
+               m_MXXPageObjectsArray[pHTMLElement.id] = pHTMLElement;
+               break;
+           case "div":
+               // this indexes by controlID and stores the elementObject
+               m_MXXPageObjectsArray[pHTMLElement.id] = pHTMLElement;
+               break;
+       }
+   }
+
+

La charge XML sortante pourrait être :

+
<page id="NewUser">
+    <formcontrols>
+        <control id="FirstName">
+            <value />
+        </control>
+    </formcontrols>
+</page>
+
+

Le retour sera alors :

+
<page id="NewUser">
+    <formcontrols>
+        <control id="FirstName">
+            <value>Dennis</value>
+        </control>
+    </formcontrols>
+</page>
+
+

L'analyseur prend alors la réponse retournée, la charge dans un DOM XML, et passe chaque nœud au gestionnaire de contrôle approprié.

+
   processTextControl(control, xmlNode);
+
+

Exemple d'analyse XML retournée :

+
   // parseout to controls
+   var formControlNodes = xmlDoc.getElementsByTagName('formcontrols');
+   for(i=0; i<formControlNodes.length;++i)
+   {
+       var pFormControlNode = formControlNodes[i];
+       var pPageObject = m_MXXPageObjectsArray[pFormControlNode.getAttribute('id')];
+       if(!pPageObject)
+           continue;
+       processTextControl(pPageObject, pBoundControlNode);
+   }
+
+

Le gestionnaire de contrôles va alors extraire les données nécessaires pour remplir le contrôle. Dans ce cas, la valeur nodevalue sera utilisée pour l'attribut control.value. Un Select pourrait créer de nouvelles Options() avec ces données, ou même remplacer le noeud ou le HTML par les nouvelles données.

+

Voici une page exemple.

+

Finalement, voici un exemple simple de tableau utilisant les Data Islands XML qui fonctionne dans IE6 et dans Mozilla.

+

Pour que tout ce qui est décrit ci-dessus fonctionne, il nous faut envoyer cette information au serveur. Il y a plusieurs moyens, dont ASP, JSP et CGI. J'utilise XMLHTTP car il me permet de mettre à jour la page sans avoir à la recharger, qu'il permet aux contrôles de mettre à jour d'autres contrôles et qu'il agit comme une application 2-tiers classique en fournissant des mises à jour instantanées et la gestion des évènements.

+

 

+
+

Informations sur le document original

+ +
+

Liens Interwikis

+

 

diff --git "a/files/fr/archive/misc_top_level/utilisation_des_pr\303\251f\303\251rences_de_contenu/index.html" "b/files/fr/archive/misc_top_level/utilisation_des_pr\303\251f\303\251rences_de_contenu/index.html" new file mode 100644 index 0000000000..bba4777f31 --- /dev/null +++ "b/files/fr/archive/misc_top_level/utilisation_des_pr\303\251f\303\251rences_de_contenu/index.html" @@ -0,0 +1,38 @@ +--- +title: Utilisation des préférences de contenu +slug: Archive/Misc_top_level/Utilisation_des_préférences_de_contenu +tags: + - Firefox 3 +translation_of: Archive/Misc_top_level/Using_content_preferences +--- +

+Firefox 3 introduit le concept de préférences de contenu. Ceci permet à du code s'exécutant dans le chrome (en d'autres mots : les extensions et le navigateur lui-même, pas les sites Web) d'enregistrer localement des préférences sur une base site par site. Cela permet d'écrire une extension permettant à l'utilisateur de personnaliser l'apparence de sites Web particuliers (augmenter la taille de la police sur des sites qui utilisent des tailles très petites, par exemple). +

Le service de préférences de contenu, implémenté par nsIContentPrefService, offre des fonctions permettant de définir et de lire des préférences pour des sites particuliers ou dans l'espace global des préférences ; les préférences globales sont utilisées lorsqu'une préférence particulière à un site n'est pas disponible. +

+

Exemple : définition et lecture de préférences

+

Cet exemple montre comment enregistrer une préférence et ensuite retrouver sa valeur. +

+
var ioSvc = Components.classes["@mozilla.org/network/io-service;1"]
+            .getService(Components.interfaces.nsIIOService);
+var prefService = Components.classes["@mozilla.org/content-pref/service;1"]
+                  .getService(Components.interfaces.nsIContentPrefService);
+
+// Crée un objet URI référençant le site pour lequel enregistrer une préférence
+var uri = ioSvc.newURI("http://developer.mozilla.org/", null, null);
+
+// Définit la valeur de la préférence "devmo.somesetting" à "foo".
+
+prefService.setPref(uri, "devmo.somesetting", "foo");
+
+...
+
+// Récupère la valeur de la préférence "devmo.somesetting".
+
+var value = prefService.getPref(uri, "devmo.somesetting");
+
+

Voir également

+

nsIContentPrefService, nsIContentPrefObserver +


+

+
+
diff --git a/files/fr/archive/mozilla/drag_and_drop/index.html b/files/fr/archive/mozilla/drag_and_drop/index.html new file mode 100644 index 0000000000..bfe2d51f0e --- /dev/null +++ b/files/fr/archive/mozilla/drag_and_drop/index.html @@ -0,0 +1,118 @@ +--- +title: Drag and Drop +slug: Archive/Mozilla/Drag_and_drop +tags: + - TopicStub + - XUL +translation_of: Archive/Mozilla/Drag_and_drop +--- +

{{ Next("Drag and Drop JavaScript Wrapper") }}

+ +

{{ deprecated_header("gecko1.9.1") }}

+ +
Depuis Gecko 1.9.1 (Firefox 3.5), ces API sont officiellement obsolètes, les API portables plus récentes et plus simple doivent être utilisées à leur place.
+ +

Cette section décrit comment implémenter des objets qui peuvent être glissés et déposés sur d'autres objets.

+ +

L'interface glisser-déposer

+ +

De nombreuses interfaces utilisateur permettent de faire glisser des objets particuliers dans l'interface. Par exemple, faire glisser des fichiers vers d'autres répertoires ou faire glisser une icône vers une autre fenêtre pour ouvrir le document auquel elle fait référence. Mozilla et XUL fournissent un certain nombre d'événements qui peuvent gérer lorsque l'utilisateur tente de faire glisser des objets.

+ +

Un utilisateur peut commencer à faire glisser en maintenant le bouton de la souris enfoncé et en déplaçant la souris. Le glissement s'arrête lorsque l'utilisateur relâche la souris. Les gestionnaires d'événements sont appelés lorsque l'utilisateur démarre et termine le glissement, et à divers points intermédiaires.

+ +

Mozilla implémente le glissement en utilisant une session de glissement. Lorsqu'un utilisateur demande à faire glisser quelque chose qui peut être glissé, une session de glissement doit être lancée. La session de glissement gère la mise à jour du curseur de la souris et l'emplacement où l'objet doit être déposé. Si quelque chose ne peut pas être glissé, il ne doit pas démarrer une session de glisser. Étant donné que l'utilisateur n'a généralement qu'une seule souris, une seule session de glissement est en cours d'utilisation à la fois.

+ +

Notez que les sessions de glissement peuvent être créées depuis Mozilla lui-même ou depuis d'autres applications. Mozilla traduira les données glissées selon les besoins.

+ +

La liste ci-dessous décrit les gestionnaires d'événements qui peuvent être appelés, qui peuvent être placés sur n'importe quel élément. Il vous suffit de mettre des valeurs pour les gestionnaires là où vous devez faire quelque chose lorsque l'événement se produit.

+ +
+
ondrag {{ Fx_minversion_inline(3) }}
+
Appelé périodiquement tout au long de l'opération de glisser-déposer.
+
ondraggesture 
+
Appelé lorsque l'utilisateur commence à faire glisser l'élément, ce qui se produit normalement lorsque l'utilisateur maintient le bouton de la souris enfoncé et déplace la souris. Le script de ce gestionnaire doit configurer une session de glissement.
+
ondragstart {{ Fx_minversion_inline(3) }} 
+
Un alias pour ondraggesture; il s'agit du nom de spécification HTML 5 de l'événement et peut être utilisé en HTML ou XUL; cependant, pour une compatibilité descendante avec les anciennes versions de Firefox, vous souhaiterez peut-être continuer à utiliser ondraggesture dans XUL.
+
ondragover 
+
Ce gestionnaire d'événements est appelé pour un élément lorsque quelque chose est glissé dessus. Si l'objet peut être déposé sur l'élément, la session de glissement doit être notifiée.
+
ondragenter 
+
Appelé pour un élément lorsque le pointeur de la souris passe pour la première fois sur l'élément pendant que quelque chose est déplacé. Cela peut être utilisé pour modifier l'apparence de l'élément pour indiquer à l'utilisateur que l'objet peut être déposé dessus.
+
ondragexit 
+
Appelé pour un élément lorsque le pointeur de la souris sort d'un élément pendant que quelque chose est déplacé. Il est également appelé une fois qu'une suppression est terminée afin qu'un élément ait une chance de supprimer toute mise en évidence ou autre indication.
+
ondragdrop 
+
Ce gestionnaire d'événements est appelé pour un élément lorsque quelque chose est déposé sur l'élément. À ce stade, l'utilisateur a déjà relâché le bouton de la souris. L'élément peut simplement ignorer l'événement ou le gérer d'une manière ou d'une autre, par exemple en collant l'objet glissé sur lui-même.
+
ondragend {{ Fx_minversion_inline(3) }} 
+
Appelé lorsque l'opération de glissement est terminée.
+
+ +

Il existe deux façons de gérer les événements par glisser-déposer. Cela consiste d'abord à utiliser directement les interfaces XPCOM glisser-déposer. La seconde consiste à utiliser un objet wrapper JavaScript qui gère une partie de cela pour vous. Le code de ce wrapper se trouve dans un fichier nommé {{ Source("toolkit/content/nsDragAndDrop.js nsDragAndDrop.js") }} qui est contenu dans le package widget-toolkit (ou global).

+ +

Interfaces XPCOM Glisser-déposer

+ +

Deux interfaces sont utilisées pour prendre en charge le glisser-déposer. Le premier est un service de glissement, nsIDragService et le second est la session de glissement, nsIDragSession.

+ +

Le nsIDragService est responsable de la création de sessions de glissement lorsqu'un glissement démarre et de la suppression de la session de glissement lorsque le glissement est terminé. La fonction invokeDragSession doit être appelée pour démarrer un glissement dans un gestionnaire d'événements ondraggesture. Une fois cette fonction appelée, un glissement a commencé.

+ +

La fonction invokeDragSession prend quatre paramètres, comme décrit ci-dessous:

+ +
invokeDragSession(element,transferableArray,region,actions)
+
+ +
+
element 
+
Une référence à l'élément qui est déplacé. Cela peut être récupéré en obtenant la propriété event.target pendant le gestionnaire d'événements.
+
transferableArray 
+
Un tableau d'objets nsITransferable, un pour chaque élément glissé. Un tableau est utilisé car vous souhaiterez peut-être faire glisser plusieurs objets à la fois, comme un ensemble de fichiers.
+
region 
+
Une région utilisée pour l'indication de rétroaction. Cela devrait généralement être défini sur null.
+
actions 
+
Les actions utilisées par le glissement. Cela doit être défini sur l'une des constantes suivantes, ou sur plusieurs ajoutées. L'action peut être modifiée pendant le glissement en fonction de ce qui est glissé.
+
+ +
+
nsIDragService.DRAGDROP_ACTION_NONE 
+
+
+
Utilisé pour indiquer qu'aucun glissement n'est valide.
+
nsIDragService.DRAGDROP_ACTION_COPY 
+
L'élément déplacé doit être copié vers son emplacement de dépôt.
+
nsIDragService.DRAGDROP_ACTION_MOVE 
+
L'élément déplacé doit être déplacé vers son emplacement de dépôt.
+
nsIDragService.DRAGDROP_ACTION_LINK 
+
Un lien (ou un raccourci ou un alias) vers l'élément en cours de glissement doit être créé à l'emplacement de dépôt.
+
+
+
+ +

L'interface {{ interface("nsIDragService") }} fournit également la fonction getCurrentSession qui peut être appelée depuis les gestionnaires d'événements de glissement pour obtenir et modifier l'état du glissement. La fonction renvoie un objet qui implémente {{interface ("nsIDragSession")}}.

+ +

L'interface nsIDragSession est utilisée pour obtenir et définir les propriétés du glissement en cours. Les propriétés et méthodes suivantes sont disponibles:

+ +
+
canDrop 
+
Définissez cette propriété sur true si l'élément sur lequel se trouve actuellement la souris peut accepter que l'objet actuellement glissé soit déposé dessus. Définissez la valeur sur false si cela n'a pas de sens d'y déposer l'objet. Cela doit être modifié dans les gestionnaires d'événements ondragover et ondragenter.
+
dragAction 
+
Défini sur l'action en cours à effectuer, qui doit être une ou plusieurs des constantes décrites précédemment. Cela peut être utilisé pour fournir des commentaires supplémentaires à l'utilisateur.
+
numDropItems 
+
Le nombre d'éléments glissés. Par exemple, il sera défini sur 5 si cinq signets sont déplacés.
+
getData(transfer,index) 
+
Récupérez les données glissées. Le premier argument doit être un objet nsITransferable pour contenir les données. Le deuxième argument, index, doit être l'index de l'élément à renvoyer.
+
sourceDocument 
+
Le document où le glissement a commencé
+
sourceNode 
+
Le nœud DOM où le glissement a commencé.
+
isDataFlavorSupported(flavor) 
+
Renvoie true si les données déplacées contiennent des données de la saveur spécifiée.
+
+ +

{{ Next("Drag and Drop JavaScript Wrapper") }}

+ +
+

Informations sur le Document Original

+ + +
diff --git a/files/fr/archive/mozilla/firefox/index.html b/files/fr/archive/mozilla/firefox/index.html new file mode 100644 index 0000000000..9e61c718ff --- /dev/null +++ b/files/fr/archive/mozilla/firefox/index.html @@ -0,0 +1,8 @@ +--- +title: Firefox +slug: Archive/Mozilla/Firefox +translation_of: Archive/Mozilla/Firefox +--- +

In progress. Out-of-date information about the Firefox project.

+ +

diff --git "a/files/fr/archive/mozilla/firefox/les_\303\251tats_de_contenu_et_le_syst\303\250me_de_style/index.html" "b/files/fr/archive/mozilla/firefox/les_\303\251tats_de_contenu_et_le_syst\303\250me_de_style/index.html" new file mode 100644 index 0000000000..9d070c55b1 --- /dev/null +++ "b/files/fr/archive/mozilla/firefox/les_\303\251tats_de_contenu_et_le_syst\303\250me_de_style/index.html" @@ -0,0 +1,26 @@ +--- +title: Les états de contenu et le système de style +slug: Archive/Mozilla/Firefox/Les_états_de_contenu_et_le_système_de_style +tags: + - Développement_de_Mozilla +translation_of: Archive/Mozilla/Firefox/Content_states_and_the_style_system +--- +

+Les états de contenu sont ce que Gecko utilise pour mettre en œuvre les différentes règles CSS dépendant de l'état du contenu (comme par exemple :hover, :active, :focus, target, :checked). Nous nous concentrerons sur la description de la façon dont les changements dans ces états de contenus sont manipulés. +

Généralement, quand l'état de contenu d'un nœud change, le style doit être résolu à nouveau (recalculé) pour ce nœud et tous ses descendants. C'est une opération coûteuse cependant, c'est pourquoi le système de style essaie de minimiser le nombre de styles qu'il doit recalculer. À cette fin, quand une notification <code>ContentStatesChanged</code>(en) est acheminée pour un nœud de contenu, la première chose qui est faite est de vérifier si ce changement dans les états de contenu pourrait affecter certains styles. +

Ceci est réalisé en parcourant la liste de tous les (en) sélecteurs simples CSS2.1 dans toutes les feuilles de style appliquées à la page qui ont une pseudo-classe de dépendance d'état faisant partie du sélecteur. Cette liste est créée durant l'analyse des feuilles de style impliquées. Pour chaque sélecteur de cette liste, on vérifie s'il a pu cesser correspondre au nœud ou commencer à le faire. Si c'est le cas, le style pourrait dépendre de l'état qui a changé et ce style doit donc être recalculé. +

Pour déterminer si le sélecteur pourrait avoir arrêté ou commencé à correspondre au nœud, on vérifie en fait s'il correspond à la règle selon laquelle toutes les pseudo-classes dépendantes de l'état correspondant aux états qui ont changé doivent être traitées comme concordantes avec le nœud (le fait qu'elles concordent, et leur éventuelle inversion). Ceci est nécessaire pour obtenir à la fois les sélecteurs qui se sont mis à concorder et ceux qui ne concordent plus. +

Par exemple, supposons que nous avons les sélecteurs suivants : +

+
 a:hover
+ a:not(:hover)
+ div:hover
+
+

et que l'état hover sur certains nœuds change. On essaie alors d'appliquer au nœud ces sélecteurs, en supposant qu'à la fois :hover et :not(:hover) correspondent au nœud. L'effet sera donc identique à essayer d'appliquer à chaque nœud les sélecteurs : +

+
 a
+ a
+ div
+
+

Le code qui met en œuvre ce procédé est dans la méthode SelectorMatches(en), à qui est passée la liste des états qui ont changé dans le paramètre aStateMask. +

diff --git a/files/fr/archive/mozilla/firefox/soap_dans_les_navigateurs_gecko/index.html b/files/fr/archive/mozilla/firefox/soap_dans_les_navigateurs_gecko/index.html new file mode 100644 index 0000000000..34537b58ef --- /dev/null +++ b/files/fr/archive/mozilla/firefox/soap_dans_les_navigateurs_gecko/index.html @@ -0,0 +1,284 @@ +--- +title: SOAP dans les navigateurs Gecko +slug: Archive/Mozilla/Firefox/SOAP_dans_les_navigateurs_Gecko +tags: + - SOAP + - Services_Web_XML +translation_of: Archive/Mozilla/Firefox/SOAP_in_Gecko-based_Browsers +--- +

Cet article décrit comment accéder à un service Web en utilisant SOAP et des fonctions JavaScript disponibles dans les navigateurs Gecko récents.

+ +

Introduction

+ +

Simple Object Access Protocol(SOAP) est la base de conception des services Web. C'est un protocole XML utilisé pour communiquer et interopérer avec les services Web. Avec Mozilla 1.0 (sur lequel est basé Netscape 7.0x) et Firefox, il est maintenant possible pour le navigateur de communiquer directement avec les services Web en utilisant son implémentation SOAP de bas niveau à l'aide de JavaScript.

+ +

L'interface JavaScript de Gecko pour l'établissement des appels SOAP est une API de bas niveau qui requiert la construction de l'enveloppe SOAP en utilisant plusieurs objets JavaScript spécifiques à SOAP. Ce document couvre les opérations SOAP de base. Pour des informations plus détaillées sur l'API de bas niveau de SOAP dans Gecko, voir SOAP Scripts in Mozilla.

+ +

L'utilisation de JavaScript pour les communications avec les services Web est sujette aux mêmes politiques de sécurité que tous les autres scripts en terme d'accès inter-domaines. Par conséquent accéder à des services Web situés sur des serveurs autres que celui où est exécuté le JavaScript constitue une violation de la politique inter-domaines. Ce document montrera comment détourner temporairement ces règles pour la conduite de tests.

+ +

Paramétrer un appel SOAP

+ +

L'objet le plus basique est SOAPCall, il est utilisé pour initier et invoquer un appel SOAP.

+ +

Figure 1 : paramétrage de base et invocation d'un appel SOAP

+ +
var mySOAPCall = new SOAPCall();
+mySOAPCall.transportURI = "http-based service URI"
+
+var parameters = new Array();
+mySOAPCall.encode(SOAPCall.VERSION_1_1,
+                  // method
+                  "method", "namespaceURI",
+                  // header block
+                  0, null,
+                  // parameter
+                  parameters.length, parameters);
+
+var response = mySOAPCall.invoke();
+
+ +

Un objet SOAPCall à un membre appelé transportURI, qui est l'URI de l'emplacement où il doit envoyer l'appel SOAP. La méthode encode() requiert le nom de la méthode à appeler depuis le service Web, son namespaceURI, le nombre de SOAPParameters passé, et un tableau de SOAPParameters qui contient tous les paramètres. Tous ces paramètres peuvent sont regroupés dans le fichier WSDL du service Web, qui sera abordé dans les exemples suivants.

+ +

Les paramètres SOAP sont créés à l'aide de l'objet SOAPParameter. Ce sont des paires nom/valeur qui sont passées au service Web.

+ +

Figure 2 : Création d'un paramètre SOAP

+ +
var param = new SOAPParameter();
+param.name = "translationmode";
+param.value = "en_fr";
+
+ +

Traitement d'une réponse

+ +

Une fois que invoke() a été appelé, Gecko génère l'enveloppe SOAP et l'envoie à l'URI spécifiée. Comme la requête est synchrone, la réponse sera la valeur retournée par invoke().

+ +

Figure 3 : Traitement d'une réponse à un appel SOAP

+ +
var returnObject = mySOAPCall.invoke();
+
+if(returnObject.fault){
+  alert("An error occured: " + returnObject.fault.faultString);
+} else {
+  var response = new Array();
+  response = returnObject.getParameters(false, {});
+  alert("Return value: " + response[0].value);
+}
+
+ +

La valeur retournée par invoke() est stockée et examinée pour un membre fault. Si il existe, une erreur se produit du côté du service Web, et le message d'erreur est stocké dans fault.faultString. Si fault n'existe pas, nous appelons la fonction getParameters() sur l'objet retourné pour récupérer les SOAPParameters retournés.

+ +

Exemple

+ +

L'exemple utilise un service Web existant, Babelfish, fournit par xmethods.net. Le service Web Babelfish permet des traductions dans de nombreuses langues. Il prend deux paramètres en entrée : une chaîne au format « originalLanguage_resultLanguage » et le texte à traduire. Le fichier WSDL du service Web Babelfish est disponible à cette adresse et contient toutes les informations nécessaires au paramétrage d'un appel SOAP de bas niveau vers le service Web.

+ +

La première étape est de déterminer l'emplacement du service Web, qui sera la valeur du membre transportURI de SOAPCall. Elle peut être trouvée dans l'élément service de WSDL, et plus spécifiquement dans l'attribut location de soap:address.

+ +

Figure 4 : Détermination de l'emplacement d'un service Web depuis son WSDL

+ +
WSDL:
+  <service name="BabelFishService">
+    <documentation>
+      Traduit des textes dans de nombreuses langues.
+    </documentation>
+    <port name="BabelFishPort" binding="tns:BabelFishBinding">
+      <soap:address location="http://services.xmethods.net:80/perl/soaplite.cgi"/>
+    </port>
+  <service>
+
+JavaScript:
+  var babelFishCall = new SOAPCall();
+  babelFishCall.transportURI = "http://services.xmethods.net:80/perl/soaplite.cgi";
+  ...
+
+ +

L'étape suivante est plus complexe : déterminer exactement quels paramètres le service Web attend qu'on lui envoie. Le service Web Babelfish ne possède qu'une méthode, « BabelFish », qui est représentée dans le WSDL entre la balise operation, qui est un enfant de l'élément portType. Chaque operation WSDL possède deux enfants : les éléments d'entrée et de sortie, qui peuvent contenir les types attendus. Les types sont définis dans les éléments message, au nombre de deux : BabelFishRequest, qui est ce qu'on passe au service Web, et BabelFishResponse, le type de retour.

+ +

BabelFish attend l'opération deux dans les paramètres translationmode et sourcedata. L'exemple de la figure 5 va traduire la chaîne « I am » d'anglais en français.

+ +

Figure 5 : Définir les paramètres nécessaires

+ +
WSDL:
+  <message name="BabelFishRequest">
+    <part name="translationmode" type="xsd:string"/>
+    <part name="sourcedata" type="xsd:string"/>
+  </message>
+
+  <message name="BabelFishResponse">
+      <part name="return" type="xsd:string"/>
+  </message>
+
+  <portType name="BabelFishPortType">
+    <operation name="BabelFish">
+      <input message="tns:BabelFishRequest"/>
+      <output message="tns:BabelFishResponse"/>
+    </operation>
+  </portType>
+
+JavaScript:
+  // SOAP parameters
+  var param1 = new SOAPParameter();
+  param1.value = "en_fr";
+  param1.name = "translationmode";
+
+  var param2 = new SOAPParameter();
+  param2.value = "I am";
+
+  param2.name = "sourcedate";
+
+  // combine the 2 params into an array
+  var myParamArray = [param1,param2];
+
+ +

Ensuite, il faut définir et invoquer l'objet SOAPCall. « BabelFish » est la méthode que notre exemple veut utiliser pour le service Web. Le prochain paramètre est l'espace de nommage attendu qui doit être passé au service Web pour la méthode BabelFish.

+ +

Ceci peut être trouvé dans le l'élément WSDL binding. L'élément binding possède un enfant operation pour la méthode BabelFish. L'espace de nommage voulu est la valeur de l'attribut namespace de soap:body qui se trouve dans l'élément input.

+ +

Figure 6 : Définir la méthode d'encodage

+ +
WSDL:
+  <binding name="BabelFishBinding" type="tns:BabelFishPortType">
+    <soap:binding style="rpc" transport="http://schemas.xmlsoap.org/soap/http"/>
+    <operation name="BabelFish">
+      <soap:operation soapAction="urn:xmethodsBabelFish#BabelFish"/>
+      <input>
+        <soap:body use="encoded" namespace="urn:xmethodsBabelFish"
+                   encodingStyle="http://schemas.xmlsoap.org/soap/encoding/"/>
+      </input>
+      ...
+    </operation>
+  </binding>
+
+JavaScript:
+  babelFishCall.encode(0, "BabelFish", "urn:xmethodsBabelFish", 0, null, myParamArray.length, myParamArray);
+
+  var translation = babelFishCall.invoke();
+
+ +

Comme on l'a vu à la figure 5, la réponse de la méthode BabelFish ("BabelFishResponse") est un paramètre, à savoir une chaîne. Après avoir vérifier que fault n'a pas été retourné, la méthode getParameters() de l'objet retourné est utilisée pour récupérer un tableau de SOAPResponses. Comme on n'attend qu'un seul paramètre en retour -- le texte traduit -- la méthode alert() est utilisée pour afficher la traduction.

+ +

Figure 7 : Traitement de la réponse

+ +
JavaScript:
+  if(translation.fault){
+    // erreur retournée par le service Web
+    alert(translation.fault.faultString);
+  } else {
+    // nous attendons un seul SOAPParameter en retour - la chaîne traduite.
+    var response = new Array();
+    response = translation.getParameters(false, {});
+    alert("Translation: " + response[0].value);
+  }
+
+ +

Comme indiqué dans l'introduction, les appels SOAP obéissent à une politique d'accès inter-domaines des scripts. Il existe deux façons de contourner cette politique de sécurité pour conduire des tests :

+ +
    +
  1. +

    Exécutez le script depuis votre disque local.

    + +

    Enregistrez localement le code sur votre disque dur.

    + +

    Le modèle de sécurité inter-domaines ne concerne pas les codes exécutés depuis un disque local.

    +
    2. +
  2. +

    Activer l'accès inter-domaine

    + +

    Vous pouvez contourner la vérification inter-domaine en définissant une préférence comme expliqué dans l'article contournement des restrictions de sécurité et signature de code (à traduire) et en ajoutant une commande JavaScript pour demander une dérogation à la vérification inter-domaine.

    + +

    Après avoir contourner la vérification, démarrez le navigateur et chargez cette page exemple modifiée. Il vous sera demandé (dans une boîte de dialogue) l'autorisation de désactiver l'inter-domaine (pour cette session) de la fonction générant l'appel SOAP. Le seul changement est l'ajout de netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead"); à la fonction qui génère l'appel SOAP.

    +
    3. +
+ +

Figure 8 : Code final - Exemple local (en), Exemple inter-domaine (en)

+ +
JavaScript:
+  var babelFishCall = new SOAPCall();
+  babelFishCall.transportURI = "http://services.xmethods.net:80/perl/soaplite.cgi";
+
+  // paramètres SOAP
+  var param1 = new SOAPParameter();
+  param1.value = "en_fr";
+  param1.name = "translationmode";
+
+  var param2 = new SOAPParameter();
+  param2.value = "I am";
+  param2.name = "sourcedate";
+
+  // combinaison des 2 paramètres dans un tableau
+  var myParamArray = [param1,param2];
+
+  babelFishCall.encode(0, "BabelFish", "urn:xmethodsBabelFish", 0, null, myParamArray.length, myParamArray);
+
+  var translation = babelFishCall.invoke();
+
+  if(translation.fault){
+    // erreur retournée par le service Web
+    alert(translation.fault.faultString);
+  } else {
+   // nous attendons un seul SOAPParameter en retour - la chaîne traduite.
+   var response = new Array();
+   response = translation.getParameters(false, {});
+   alert("Translation: " + response[0].value);
+ }
+
+ +

Chemin de l'enveloppe Soap

+ +

Voici unHTTP dump (utilisant l'outil multiplate-forme Ethereal) de ce qui a été vraiment envoyé et reçu lorsque l'exemple a été exécuté :

+ +

Figure 9 : HTTP Dumps

+ +
Sent:
+POST /perl/soaplite.cgi HTTP/1.1
+Host: services.xmethods.net:80
+...
+Content-Type: text/xml
+Content-Length: 516
+
+<env:Envelope xmlns:env="http://schemas.xmlsoap.org/soap/envelope/"
+              xmlns:enc="http://schemas.xmlsoap.org/soap/encoding/"
+              env:encodingStyle="http://schemas.xmlsoap.org/soap/encoding/"
+              xmlns:xs="http://www.w3.org/1999/XMLSchema"
+              xmlns:xsi="http://www.w3.org/1999/XMLSchema-instance">
+  <env:Header/>
+  <env:Body>
+      <a0:BabelFish xmlns:a0="urn:xmethodsBabelFish">
+          <a0:translationmode xsi:type="xs:string">en_fr</a0:translationmode>
+          <a0:sourcedata xsi:type="xs:string">I am</a0:sourcedata>
+      </a0:BabelFish>
+  </env:Body>
+</env:Envelope>
+
+
+Recieved:
+HTTP/1.1 200 OK
+Date: Tue, 11 Mar 2003 20:28:11 GMT
+Server: Apache/1.3& (Unix) Enhydra-Director/3 PHP/4.0.6 DAV/1.0.3 AuthNuSphere/1.0.0
+SOAPServer: SOAP::Lite/Perl/0.52
+Content-Length: 532
+
+...
+Content-Type: text/xml; charset=utf-8
+
+<?xml version="1.0" encoding="UTF-8"?>
+<SOAP-ENV:Envelope xmlns:SOAP-ENC="http://schemas.xmlsoap.org/soap/encoding/"
+                   SOAP-ENV:encodingStyle="http://schemas.xmlsoap.org/soap/encoding/"
+                   xmlns:SOAP-ENV="http://schemas.xmlsoap.org/soap/envelope/"
+                   xmlns:xsi="http://www.w3.org/1999/XMLSchema-instance"
+                   xmlns:xsd="http://www.w3.org/1999/XMLSchema">
+  <SOAP-ENV:Body>
+    <namesp1:BabelFishResponse xmlns:namesp1="urn:xmethodsBabelFish">
+      <return xsi:type="xsd:string">je suis</return>
+    </namesp1:BabelFishResponse>
+  </SOAP-ENV:Body>
+</SOAP-ENV:Envelope>
+
+ +

Ressources

+ +

SOAP Scripts in Mozilla (en) par Ray Whitmer
+ Using the Mozilla SOAP API (en) par Scott Andrew LePera et Apple Developer Connection.
+ The Latest w3.org SOAP Specification (en)
+ Calling SOAP Servers from JS in Mozilla (en), article de OnLamp.com par Zachary Kessin
+ SOAPCall documentation on XULPlanet.com (en)
+ SOAPResponse documentation on XULPlanet.com (en)

diff --git a/files/fr/archive/mozilla/firefox/utilisation_de_microformats/index.html b/files/fr/archive/mozilla/firefox/utilisation_de_microformats/index.html new file mode 100644 index 0000000000..f45f86c6b4 --- /dev/null +++ b/files/fr/archive/mozilla/firefox/utilisation_de_microformats/index.html @@ -0,0 +1,197 @@ +--- +title: Utilisation de microformats +slug: Archive/Mozilla/Firefox/Utilisation_de_microformats +tags: + - Firefox 3 + - Microformats +translation_of: Archive/Mozilla/Firefox/Using_microformats +--- +
+ +

Les microformats permettent aux sites Web de fournir des données sémantiques au navigateur afin que celui-ci puisse présenter un résumé des informations présentes sur une page sans avoir à connaître de manière particulière d'analyser son contenu. Firefox 3 implémente un objet global Microformats permettant d'accéder aux microformats. Cet objet et l'API associée facilitent la recherche et la lecture de microformats.

+ +

Chargement de l'API des microformats

+ +

L'objet Microformats est créé à l'aide du nouveau chargeur de scripts JavaScript ajouté à Firefox 3. Pour utiliser l'API, il faut d'abord charger cet objet :

+ +
Components.utils.import("resource://gre/modules/Microformats.js");
+
+ +

Une fois l'API des microformats chargée, il est possible de gérer des microformats à l'aide des méthodes listées ici. Pour plus d'information sur l'analyse de microformats, consultez Analyse de microformats en JavaScript.

+ +

Microformats prédéfinis

+ +

Firefox 3 fournit des définitions implémentant divers microformats répandus :

+ +
+
adr
+
Représente une adresse (comme une adresse de destination ou une adresse postale).
+
geo
+
Représente un emplacement géographique en utilisant sa latitude et sa longitude.
+
hCard
+
Représente les informations de contact d'une personne.
+
hCalendar
+
Représente une entrée de rendez-vous d'un agenda.
+
tag
+
Utilisé pour ajouter des balises à d'autres microformats.
+
+ +

Méthodes

+ +

add()

+ +

Ajoute un nouveau microformat au module des microformats.

+ +

Note : Si un microformat du nom spécifié existe déjà, il sera remplacé par le nouveau.

+ +
add(nom, définition);
+
+ +
Paramètres
+ +
+
nom
+
Le nom du microformat à ajouter au module des microformats.
+
définition
+
Une structure JavaScript décrivant le microformat. Consultez Description de microformats en JavaScript pour plus de détails.
+
+ +

count()

+ +

Compte le nombre de microformats dans un document qui correspondent à des critères spécifiés.

+ +
nbMicroformats = Microformats.count(nom, élémentRacine, options);
+
+ +
Paramètres
+ +
+
nom
+
Le nom du microformat à compter.
+
élémentRacine
+
Obligatoire. L'élément DOM où doit commencer la recherche. Pour rechercher dans le document entier, utiliser content.document.
+
options
+
Facultatif. Si ce paramètre est fourni, il s'agit d'un objet JavaScript contenant une série de drapeaux parmi les suivants : +
+
recurseExternalFrames
+
Si à true, les cadres enfants font partie de la recherche. La valeur par défaut est true.
+
showHidden
+
Si à true, les microformats cachés seront ajoutés ; autrement ils sont ignorés. La valeur par défaut est false.
+
debug
+
Spécifiez true si le mode debug est utilisé ; sinon indiquez false. La valeur par défaut est false.
+
+
+
+ +
Valeur de retour
+ +

Une valeur entière indiquant le nombre de microformats correspondant aux critères spécifiés.

+ +

debug()

+ +

Renvoie une chaîne qui décrit un objet de microformat.

+ +

Note : Il est possible d'appeler simplement debug() sur un objet de microformat : objetMicroformat.debug() au lieu d'utiliser cette méthode, si cela vous convient mieux.

+ +
dumpString = debug(objetMicroformat);
+
+ +
Paramètres
+ +
+
objetMicroformat
+
L'objet de microformat à afficher.
+
+ +
Valeur de retour
+ +

Une chaîne décrivant le contenu de l'objet de microformat spécifié.

+ +

get()

+ +

Renvoie un tableau d'objets de microformat correspondant aux critères spécifiés.

+ +
microformats = Microformats.get(nom, élémentRacine, options, tableauCible);
+
+ +
Paramètres
+ +
+
nom
+
Le nom du microformat recherché.
+
élémentRacine
+
Obligatoire. L'élément DOM d'où sera lancée la recherche. Pour rechercher dans le document entier, indiquer content.document.
+
options
+
Facultatif. Si fourni, il s'agit d'un objet JavaScript contenant une série éventuellement vide des drapeaux suivants : +
+
recurseExternalFrames
+
Si défini à true, les cadres enfants référençant du contenu externe feront partie de la recherche. La valeur par défaut est true.
+
showHidden
+
Si défini à true, les microformats masqués seront ajoutés ; dans le cas contraire ils seront ignorés. La valeur par défaut est false.
+
debug
+
Indique d'utiliser le modedebug si à true. La valeur par défaut est false.
+
+
+
tableauCible
+
Facultatif. Si fourni, il s'agir d'un tableau d'objets microformat auquel ajouter les résultats de la recherche.
+
+ +
Valeur de retour
+ +

Un nouveau tableau d'objets microformat correspondant aux critères de recherche, ou le tableau spécifié par le paramètre microformats auquel les nouveaux objets microformat trouvés auront été ajoutés.

+ +

getNamesFromNode()

+ +

Renvoie une liste de noms de microformats séparés par des espaces qui correspondent au nœud de microformat spécifié.

+ +
liste = Microformats.getNamesFromNode(nœud);
+
+ +
Paramètres
+ +
+
nœud
+
Le nœud pour lequel une liste de noms de microformats doit être obtenue.
+
+ +
Valeur de retour
+ +

Si le nœud spécifié est un microformat, le résultat est une chaîne listant tous les noms de microformats, séparés par des espaces, qui correspondent à ce nœud. Si le nœud n'est pas un microformat, rien ne sera renvoyé.

+ +

getParent()

+ +

Renvoie le nœud parent du microformat ou enfant de microformat spécifié.

+ +
nœudParent = Microformats.getParent(nœud);
+
+ +
Paramètres
+ +
+
nœud
+
Le nœud dont le parent doit être retrouvé.
+
+ +
Valeur de retour
+ +

Le parent du nœud spécifié. Ne renvoie rien si le nœud spécifié n'est pas un microformat ou l'enfant d'un microformat.

+ +

isMicroformat()

+ +

Détermine si le nœud DOM spécifié est un microformat.

+ +
valeur = Microformats.isMicroformat(nœud);
+
+ +
Paramètres
+ +
+
nœud
+
Le nœud DOM dont on veut savoir s'il est un microformat.
+
+ +
Valeur de retour
+ +

true si le nœud est un microformat, false sinon.

+ +

Note : Cette méthode ne renvoiepas true si le nœud est l'enfant d'un microformat.

diff --git a/files/fr/archive/mozilla/index.html b/files/fr/archive/mozilla/index.html new file mode 100644 index 0000000000..9bdeac9114 --- /dev/null +++ b/files/fr/archive/mozilla/index.html @@ -0,0 +1,19 @@ +--- +title: Archived Mozilla and build documentation +slug: Archive/Mozilla +tags: + - TopicStub +translation_of: Archive/Mozilla +--- +

Ces articles sont des documents archivés et obsolètes sur Mozilla, Gecko et le processus de construction de projets Mozilla.

+ + + +
+
Persona
+
Mozilla Persona est un système d'identification pour le web facile à utiliser et à déployer. Il fonctionne sur tous les principaux navigateurs, vous pouvez l'utiliser dès maintenant.
+
Plug-n-Hack
+
Plug-n-Hack (PnH) est un standard proposé par l'équipe de sécurité de Mozilla pour définir comment les outils de sécurité peuvent interagir avec les navigateurs de manière plus utile et utilisable.
+
Prism
+
Prism est une application XULRunner. En plus du moteur de navigation inclus dans XULRunner, elle est constituée de :
+
diff --git "a/files/fr/archive/mozilla/nouveau_mod\303\250le_de_s\303\251curit\303\251_des_services_web/index.html" "b/files/fr/archive/mozilla/nouveau_mod\303\250le_de_s\303\251curit\303\251_des_services_web/index.html" new file mode 100644 index 0000000000..a17843a89a --- /dev/null +++ "b/files/fr/archive/mozilla/nouveau_mod\303\250le_de_s\303\251curit\303\251_des_services_web/index.html" @@ -0,0 +1,166 @@ +--- +title: Nouveau modèle de sécurité des services Web +slug: Archive/Mozilla/Nouveau_modèle_de_sécurité_des_services_Web +tags: + - SOAP +translation_of: Archive/Mozilla/New_Security_Model_for_Web_Services +--- +

Securing Resources From Untrusted Scripts Behind Firewalls

+ +

Introduction

+ +

This page describes an alternative mechanism which can be used to protect all internal resources against requests from sandboxed scripts. This should especially be implemented for SOAP calls by untrusted scripts. When an attempt is made to access a resource at a previously-unknown URI, the sandbox reads a file at that domain with declarations to determine whether access is permitted to the script. If the file is not there, access is denied.

+ +

The Problem

+ +

External untrusted scripts loaded behind a firewall are executed in a sandbox. These scripts may legitimately require access to external resources, but permitting them to access internal resources permits the compromise of these resources that would normally not be available to applications outside of the firewall. The sandbox must distinguish and protect internal resources.

+ +

Client-controlled Solutions

+ +

Several client-controlled solutions have been designed to prevent sandboxed applications loaded behind a firewall from compromising other resources protected behind the firewall.

+ +

Same Source Restriction

+ +

By restricting sandboxed scripts to access only resources in the domain from which they were loaded, any script loaded from one domain into another is prevented from accessing resources in the domain into which it has been loaded. This policy has generally been successful in sandboxing Javascript and Java applets across the web.

+ +

If the sandbox is unable to distinguish the common URI substring of the domain to be trusted from similar URIs of untrusted domains, then it could allow a script loaded from an indistinguishable domain to exploit firewall-protected resources.

+ +

Also, this technique prevents the script from accessing many legitimate external resources not provided in the same domain as the script. This prevents a script from accessing web services and data published from any domain besides its own.

+ +

White-listing

+ +

By creating a white list of trusted URIs from which scripts are trusted to not compromise internal resources, it is possible to release domains from the stricter same-source sandbox. A white list is a good tool for including always-trusted domains, but on the web, it is often a script from a relatively-untrusted domain that must be granted access to other untrusted domains, without compromising internal domains.

+ +

More-complex access lists could be created to try to establish, with finer granularity, which domains are to be accessible or permitted from which other domains, but this requires extensive management which at best is quite error-prone for the end user and easily opens holes in a firewall that do not directly hurt the user who reconfigured his browser to try to access some external service but hurts the owners of other services behind the firewall.

+ +

Signed Scripts

+ +

A certain degree of additional trust may be lent to a script by having the author digitally sign it. But signed scripts have not really caught on as they require certificates do not change the basic problem that some completely-unknown party has written a script that might now have access to internal resources.

+ +

Asking the User

+ +

Where the sandbox cannot otherwise determine whether the executing script should be permitted access to the resource, a dialog box may be raised to ask the user to grant special privileges. This is currently permitted for locally-saved scripts and signed scripts. This could be combined with the other options above such as whitelisting, signed scripts, etc. But the big problem with this is that the typical browser user really does not either understand or pay the consequences if he inadvertently opens a hole in his company's firewall. Quite complex settings may be required to permit the user to allow access to desired external services without risking other resources.

+ +

Controlling Resource Access on the Server

+ +

Access by untrusted scripts really needs to be under the control of the stake holder, which is the resource and server owner -- not the user -- to determine whether a resource should be insulated from web applications loaded from outside of the firewall.

+ +

Using a SOAP Header for Verification

+ +

SOAP messages have a distinct processing model allowing a header to be added that the recipient is required to understand and accept, which identifies the untrusted source of a script making a request. SOAP services which have not been cleared for access by untrusted scripts will reject the requests. This is offered in the Mozilla implementation of SOAP today.

+ +

Unfortunately, this does not prevent SOAP messages from being sent to non-SOAP addresses, which is a big enough problem that the verification cannot stand alone to guarantee that untrusted service requests are always properly rejected by services that should be firewall-protected.

+ +

It may also be inconvenient to modify a SOAP service to ignore the specific verification header.

+ +

Using a Declarations File

+ +

A more robust solution is to rely on getting a file named "web-scripts-access.xml" in the root directory of the server that the sandboxed script requests to communicate with. It should be fairly easy for most providers of public resources to create.

+ +

Web Scripts Access Statements

+ +

The syntax of statements of the access file are as follows.

+ +
<!ELEMENT webScriptAccess (delegate?|allow*)>
+<!ELEMENT delegate EMPTY>
+<!ELEMENT allow EMPTY>
+<!ATTLIST allow type|from CDATA #IMPLIED>.
+
+ +

L'élément racine

+ +

Le premier élément du fichier doit être le suivant :

+ +
<wsa:webScriptAccess xmlns:wsa="http://www.mozilla.org/2002/soap/security">
+
+ +

Delegation

+ +

If the <delegate/> element is present then "web-scripts-access.xml" is required in the subdirectory for URIs which are in a subdirectory. For example, if the script in question is "http://www.example.com/foo/bar.xml", then the declarations file http://www.example.com/web-scripts-access.xml which contains the "delegate" keyword delegates to http://www.example.com/foo/web-scripts-access.xml. If the URI is in a subdirectory, and the root directory's access file delegated but no access file exists in the subdirectory, then no access is granted. If the root's access file did not delegate, then that access file also handles all resources in subdirectories.

+ +

Any syntax error in the document will result in the rest of the file to be ignored. Since the commands only allow access, the order of processing the "allow" commands that were successfully parsed is never significant.

+ +

Autoriser l'accès de script Web

+ +

Pour permettre aux scripts d'accéder aux ressources de ce serveur, utiliser la commande suivante:

+ +
<wsa:allow type="<request-type>" from ="<uri-prefix>"/>
+
+ +

Le type de requête, s'il est spécifié, sera vérifié par rapport au type de requête demandé par le script, comme "soap", "soapv", ou "load". Les types ne doivent pas contenir d'espace. Le type "any" permet à n'importe quel type de requête d'accéder aux ressources.

+ +

Le principe URI du script sera vérifié par le préfixe URI spécifié.

+ +

Si "from" n'est pas spécifié, tous les scripts seront autorisés.

+ +

Note : On peut également utiliser n'importe quel(s) caractère(s) pour renseigner la valeur de "from".

+ +

Par exemple:

+ +
<wsa:allow type="soapv" from="http://www.mozilla.org"/>
+
+ +

Cette commande autorise les reqêtes SOAP avec une vérification des en-têtes des scripts chargé depuis le domaine www.mozilla.org.

+ +
<wsa:allow type="soapv" from="http://*.mozilla.org"/>
+
+ +

Cette commande autorise les requêtes SOAP avec une vérification des en-têtes des scripts chargé depuis le domaine avec un nom d'hôte contenant mozilla.org.

+ +

C'est à dire, http://www.mozilla.org/, http://lxr.mozilla.org, http://komodo.mozilla.org, etc. auront un droit d'accès.

+ +

Implementation

+ +

nsIWebScriptsAccessService

+ +

This interface provides a way to check whether the running script has access to the server that the script wishes to communicate.

+ + + +

nsWebScriptsAccess(Implements nsIWebScriptsAccessService)

+ +

Maintains access information, for servers, in an access-info-cache ( hashtable ). If an entry was not found in the cache creates one by loading the declaration file (web-scripts-access.xml) and extracting information from it (declaration file); requested type and subject princple's prefix are compared to the allowed type and prefix in order to determine access. An entry is created if and only if the declaration file is considered valid (validation based on the syntax described above); an invalid document will result in access denial. Denies script access in the event of an xml-wellformedness error, or validation error, or if the declaration file does not grant access. Reports errors (validation, wellformedness, file not found, etc.) to the console via nsIConsoleService.

+ +
+

Note: Script access is checked via declaration file only if the script security manager denies access.

+
+ +

Summary

+ +

Advantages

+ +

The proposed declaration file places the server operator, not the client in control of access to his server by untrusted scripts. The access hole is no bigger than the service in question. The access is disabled by default, and there is nothing the user needs to do to open access, and nothing that can go wrong to make a hole in his firewall. It seems fairly easy to drop an access file into the root directory of the web server to allow access.

+ +

Delegation with Mixed Ownership

+ +

Independent owners of subdirectories cannot grant web script access to these subdirectories without getting the owner of the root directory to post a delegating access file. Normally a server will be either inside or outside of a firewall, so this is not a problem. Where a server spans multiple owners, the alternative would be to scan all directories in the path looking for a web scripts access file, which seems undesirable. On the other hand, perhaps it is not so bad, since it permits independent management in domains where the top level owner may not care about providing access to web services.

+ +

Adjustments

+ +

As this new model is applied to SOAP, and potentially document.load or xml-request, it may be desirable to eliminate the same source security bypass, because it is not clear that this is always secure. Other security adjustments may be desired as well.

+ +

Feedback?

+ +

Please send me some feedback on this proposal.

+ +

See Also

+ + + +

Interwiki Language Links

diff --git a/files/fr/archive/mozilla/persona/api_de_verification/index.html b/files/fr/archive/mozilla/persona/api_de_verification/index.html new file mode 100644 index 0000000000..04a8400141 --- /dev/null +++ b/files/fr/archive/mozilla/persona/api_de_verification/index.html @@ -0,0 +1,142 @@ +--- +title: API de vérification +slug: Archive/Mozilla/Persona/API_de_verification +tags: + - Persona +translation_of: Archive/Mozilla/Persona/Remote_Verification_API +--- +

Résumé

+

Lorsqu'un utilisateur essaie de se connecter sur un site, son navigateur génère un objet de données appelé une assertion. Il s'agit essentiellement d'une adresse mail cryptée. Le navigateur envoie cette assertion au site, qui doit vérifier sa validité avant de connecter l'utilisateur.

+

Les assertions peuvent être vérifiées localement, ou en utilisant l'API disponible à l'adresse https://verifier.login.persona.org/verify. Cette page décrit comment utiliser l'API.

+

Méthode

+

Envoyez une requête HTTP POST à l'adresse https://verifier.login.persona.org/verify.

+

Paramètres

+
+
+ assertion
+
+ L'assertion est fournie par l'utilisateur. Disponible en tant que premier paramètre passé à la fonction onlogin dans navigator.id.watch().
+
+ audience
+
+ Le protocole, nom de domaine et port de votre site. Par exemple : "https://example.com:443".
+
+

Valeurs de retour

+

La requête retourne un objet JSON contenant une propriété status qui peut valoir "okay" ou "failure". En fonction de ces valeurs, l'objet peut contenir des éléments additionels listés ci-dessous.

+

"okay"

+

L'assertion est valide.

+

Dans ce cas, l'objet JSON contient en plus les propriétés suivantes :

+ + + + + + + + + + + + + + + + + + + +
"email"L'adresse mail contenue dans l'assertion, pour permettre la connexion de l'utilisateur.
"audience"La valeur audience contenue dans l'assertion. Doit être l'URL de votre propre site.
"expires"La date à laquelle expire l'assertion, exprimée The date the assertion expires, exprimé comme une valeur primitive de l'objet Date qui est le nombre de secondes écoulées depuis le 1er Janvier 1970 00h00 GMT.
"issuer"Le nom du fournisseur d'identité ayant fourni l'assertion.
+

"failure"

+

L'assertion n'est pas valide.

+

Dans ce cas, l'objet JSON contient une propriété additionnelle :

+ + + + + + + +
"reason"Une chaîne de caractère expliquant pourquoi la validation de l'assertion a échoué
+

Exemples

+

node.js

+

Cet exemple utilise un serveur node.js utilisant express.js

+
var express = require("express"),
+    app = express.createServer(),
+    https = require("https"),
+    querystring = require("querystring");
+/* ... */
+
+// La variable audience doit correspondre à ce qu'affiche la barre d'adresse du navigateur,
+// ce qui inclut le protocole, le nom de domaine et le port
+var audience = "http://localhost:8888";
+
+app.post("/authenticate", function(req, res) {
+  var vreq = https.request({
+    host: "verifier.login.persona.org",
+    path: "/verify",
+    method: "POST"
+  }, function(vres) {
+    var body = "";
+    vres.on('data', function(chunk) { body+=chunk; } )
+        .on('end', function() {
+          try {
+            var verifierResp = JSON.parse(body);
+            var valid = verifierResp && verifierResp.status === "okay";
+            var email = valid ? verifierResp.email : null;
+            req.session.email = email;
+            if (valid) {
+              console.log("l'assertion a été vérifiée avec succès pour le mail :", email);
+              res.json(email);
+            } else {
+              console.log("l'assertion n'a pas été validée pour la raison suivante :", verifierResp.reason);
+              res.send(verifierResp.reason, 403);
+            }
+          } catch(e) {
+            console.log("le verifier n'a pas renvoyé un objet JSON");
+            // bogus response from verifier!
+            res.send("bogue de la part du verifier !", 403);
+
+          }
+        });
+  });
+
+  vreq.setHeader('Content-Type', 'application/x-www-form-urlencoded');
+
+  var data = querystring.stringify({
+    assertion: req.body.assertion,
+    audience: audience
+  });
+
+  vreq.setHeader('Content-Length', data.length);
+  vreq.write(data);
+  vreq.end();
+
+  console.log("vérification de l'assertion");
+});
+
+
+

via Lloyd Hilaiel

+

PHP

+
$url = 'https://verifier.login.persona.org/verify';
+$assert = filter_input(
+    INPUT_POST,
+    'assertion',
+    FILTER_UNSAFE_RAW,
+    FILTER_FLAG_STRIP_LOW|FILTER_FLAG_STRIP_HIGH
+);
+//utiliser la superglobale $_POST pour PHP < 5.2 et écrire votre propre filtre
+$params = 'assertion=' . urlencode($assert) . '&audience=' .
+           urlencode('http://example.com:80');
+$ch = curl_init();
+$options = array(
+    CURLOPT_URL => $url,
+    CURLOPT_RETURNTRANSFER => TRUE,
+    CURLOPT_POST => 2,
+    CURLOPT_POSTFIELDS => $params
+);
+curl_setopt_array($ch, $options);
+$result = curl_exec($ch);
+curl_close($ch);
+echo $result;
+

Via Christian Heilmann

+

Note: si vous envoyez les paramètres assertion et audience en tant qu'objet JSON, ils ne doivent pas être encodés. S'ils sont envoyés en tant que paramètres normaux d'une requête HTTP POST, comme dans l'exemple ci-dessus, ils doivent être encodés.

diff --git a/files/fr/archive/mozilla/persona/bootstrapping_persona/index.html b/files/fr/archive/mozilla/persona/bootstrapping_persona/index.html new file mode 100644 index 0000000000..ed8caf194e --- /dev/null +++ b/files/fr/archive/mozilla/persona/bootstrapping_persona/index.html @@ -0,0 +1,44 @@ +--- +title: Persona Hosted Services +slug: Archive/Mozilla/Persona/Bootstrapping_Persona +translation_of: Archive/Mozilla/Persona/Bootstrapping_Persona +--- +

Pour réussir et être vraiment décentralisé, Persona a besoin du soutien de trois groupes différent :

+ + + +

Cela crée un cercle vicieux : aucun de ces groupes n'auraient un intêret significatif tant qu'il n'y avait un grand nombre d'utilisateur, mais un système distribué ne peut pas avoir un grand nombre d'utilisateur sans le soutien des groupes ci-dessus.

+ +

Pour résoudre ce problème, https://login.persona.org enregistre trois resources :

+ +
    +
  1. Un Fournisseur d'Identité de secours, qui es disponible pour les utilisateurs dont les fournisseurs d'email ne supporte pas Persona.
    2. +
  2. A cross-browser, JavaScript implementation of the navigator.id APIs for browsers without native support.
    3. +
  3. A hosted verification API to make it easy for sites to verify user credentials.
    4. +
+ +

Together, this allows web sites to offer Persona to users regardless of browser and without email providers needing to get involved.

+ +

These services are temporary, and the Persona system is designed such that they transparently and automatically drop away as native support gets added to browsers and email providers. Thus, they will become less relevant as Persona matures, and may eventually be removed all together. At that point, https://login.persona.org won't feature at all in the Persona system.

+ +

Fallback Identity Provider

+ +

Any domain can become an Identity Provider as long as relying parties are willing to trust the certificates issued by that domain. We expect email providers to act as an IdPs for the addresses they administer, making the user experience of Persona seamless for those users.  It allows the user to leverage their existing relationship with the email provider when authenticating at other sites.

+ +

However, email providers won't become IdPs until there is significant demand from their users. In the meantime, Mozilla operates a fallback IdP at https://login.persona.org. This fallback allows users to sign into sites with their existing email address, regardless of whether or not the email provider supports Persona. The fallback IdP will certify email addresses from any domain using its own authentication flow and its own password, so long as the user is able to prove control of an address by clicking a link in a verification email.

+ +

Once an email provider supports Persona natively, its users will transparently begin use it instead of the fallback IdP.

+ +

Cross-browser API Library

+ +

For Persona to work, the user's browser must support the navigator.id API. Eventually, browsers will add native support for these APIs, but until then a cross-browser implementation is available at https://login.persona.org/include.js. By including this file, web sites can already begin using Persona. Once native implementations of the API are available, the library will automatically defer to those.

+ +

Remote verification service

+ +

At https://login.persona.org Mozilla hosts a remote verification service that web sites can use to verify identity assertions sent from users. This makes it simpler for web sites to support Persona as it takes care of parsing the assertion and cryptographically verifying user identities.

+ +

Once the Persona data formats stabilize, verification will most likely be done locally on each site's server. This transition is especially important for user privacy, since it will make it impossible for the fallback IdP to track its users. Even with remote verification, users of native IdPs can't be tracked by that IdP.

diff --git a/files/fr/archive/mozilla/persona/branding/index.html b/files/fr/archive/mozilla/persona/branding/index.html new file mode 100644 index 0000000000..6baff2ccdc --- /dev/null +++ b/files/fr/archive/mozilla/persona/branding/index.html @@ -0,0 +1,44 @@ +--- +title: Ressources promotionnelles +slug: Archive/Mozilla/Persona/branding +tags: + - Persona +translation_of: Archive/Mozilla/Persona/User_interface_guidelines +--- +

Se connecter avec des boutons Persona

+

Images

+

Le bouton "Se connecter" est disponible en trois versions et trois couleurs:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
 Se connecter avec votre EmailSe connecter avec PersonaSe connecter
Noir
Bleu
Rouge
+

En CSS

+

Sawyer Hollenshead a créé une série d'excellents boutons en CSS. Télécharger (.zip)

+

Informations complémentaires

+

Vous pouvez obtenir des informations complémentaires sur la conception visuelle de Persona dans les embelissement du style de Sean Martell.

diff --git a/files/fr/archive/mozilla/persona/browser_compatibility/index.html b/files/fr/archive/mozilla/persona/browser_compatibility/index.html new file mode 100644 index 0000000000..1bdf4c4e5d --- /dev/null +++ b/files/fr/archive/mozilla/persona/browser_compatibility/index.html @@ -0,0 +1,82 @@ +--- +title: Compatibilité des navigateurs +slug: Archive/Mozilla/Persona/Browser_compatibility +tags: + - Persona +translation_of: Archive/Mozilla/Persona/Browser_compatibility +--- + +

Persona est développé, testé, et supporté avec les navigateurs suivants. Grâce à la bibliothèque JavaScript inter-plateformes de Persona, les utilisateurs n'ont pas besoin de greffons pour utiliser Persona.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Navigateurs pour ordinateur de bureau
Internet Explorer8.0*, 9.0†, 10.0** (mais voir le mode de compatibilité ci-dessous)
FirefoxVersions courante, stable, Beta, Aurora, Nightly, et ESR.
+ Précédente version stable
ChromeDernière version stable
SafariDernière version stable
OperaDernière version stable‡
Navigateurs iOS
Safari MobileiOS 5.x — 6.x
Navigateurs Android
Navigateur par défaut2.x — 4.x
FirefoxVersions stable courante, Beta, Aurora, et Nightly
+ Précédente version stable
ChromeDernière version stable
+

* : pour Windows XP. † : pour Windows Vista et Windows 7. ** : Windows 8. ‡ : selon durée de vie.

+ + +

Mode de compatibilité d'Internet Explorer

+

À partir de la version 8.0, Internet Explorer supporte une fonctionnalité appelée Mode de compatibilité, dans lequel le navigateur peut être amené à émuler une version antérieure à la 8.0, en affichant la page. Cette fonctionnalité peut être contrôlée de trois façons différentes :

+ +

Parce que les versions Internet Explorer avant la 8.0 ne sont pas supportées par Persona, toute version d'Internet Explorer qui est configurée pour émuler une version antérieure à la 8.0, ne fonctionnera pas avec Persona.

+

Autres navigateurs

+

Bien qu'ils ne soient pas explicitement supportés, un navigateur incluant aussi bien window.postMessage() que localStorage devrait fonctionner. Ces API ont été rendues disponibles dans les principaux navigateurs depuis mars 2010.

+

Problèmes connus

+ diff --git a/files/fr/archive/mozilla/persona/considerations_de_securite/index.html b/files/fr/archive/mozilla/persona/considerations_de_securite/index.html new file mode 100644 index 0000000000..d067791639 --- /dev/null +++ b/files/fr/archive/mozilla/persona/considerations_de_securite/index.html @@ -0,0 +1,57 @@ +--- +title: Considérations de sécurité +slug: Archive/Mozilla/Persona/Considerations_de_securite +tags: + - Persona +translation_of: Archive/Mozilla/Persona/Security_Considerations +--- +

Lorsque vous ajoutez Persona sur votre site, il s'occupe du fardeau que représente la sécurité tant qu'il le peut. Cependant, certains aspects de la sécurité peuvent uniquement être gérés par votre site. Ils sont listés ci-dessous.

+

Pratiques essentielles

+

Vérifier les assertions côté serveur

+

Lorsque vous utilisez Persona, les assertions d'identité sont passées à la fonction onlogin passée à navigator.id.watch(). Vous devriez toujours envoyer l'assertion au serveur pour vérification, et seul votre serveur devrait décider de donner à l'utilisateur les permissions additionnelles selon le résultat de la vérification:

+
// Dans navigator.id.watch({ ...
+onlogin: function(assertion) {
+  // Un utilisateur veut se connecter ! Vous devez:
+  // 1. Envoyer l'assertion à votre backend pour vérification et création d'une session.
+  // 2. Mettre à jour l'interface.
+},
+
+

Si vous essayez de vérifier l'assertion en utilisant le JavaScript client, un utilisateur malveillant pourrait usurper l'identité d'un utilisateur légitime en injectant localement du code et en modifiant votre JavaScript. Ceci est possible parce que vous n'êtes pas en contrôle total de ce qui se passe dans le navigateur de l'utilisateur, là où le JavaScript est exécuté.

+

Encore une fois, vous devriez systématiquement envoyer l'assertion au serveur pour vérification. Même si vous utilisez l'API de vérification locale.

+

Spécifiez explicitement le paramètre audience

+

Pour vérifier une assertion, vous pouvez envoyer une requête POST à l'adresse https://verifier.login.persona.org/verify. La requêtre inclut un paramètre appelé audience :

+
assertion=<ASSERTION>&audience=https://monsite.com:443"
+

Le paramètre audience est requis. Vous devriez toujours spécifier l'audience explicitement dans votre code, où dans votre configuration. Attention à :

+ +

Si vous faites confiance au navigateur pour vous fournir l'audience, alors il devient possible pour un site malveillant de réutiliser les assertions de son site pour se connecter sur votre site.

+

Vérifier les certificats SSL

+

Pour vérifier une assertion, vous pouvez envoyer une requête POST à l'adresse https://verifier.login.persona.org/verify. Vous devez vous assurer que la requête HTTPS vérifie le certificat envoyé par le serveur contre un certificat-racine sûr. Si vous ne le faites pas, alors un hacker pourrait se faire passer pour verifier.login.persona.org et renvoyer des vérifications erronées.

+

Vérifiez que la librairie utilisée vérifie les certicicats correctements, et que vous l'intialisez avec les certificats-racines appropriés.

+

Par exemple, le module standard de Python 2.7 ne valide pas les certificats serveurs. Nous recommandons plutôt d'utiliser les modules "requests" (en) ou "urllib3" (en) en Python 2.x, ou la classe standard http.client.HTTPSConnection en Python 3.x. En Perl, assurez-vous d'utiliser au moins la version 6.0 de libwww-perl. En fonction du langage, de la bibliothèque et du système d'exploitation utilisé, vous pourriez devoir fournir soit une liste de certificats-racines sûrs, soit le seul certificat utilisé par verifier.login.persona.org.

+

Implémenter une protection CSRF

+

Lors d'une attaque de connexion CSRF (Cross-Site Request Forgery, contrefaçon de requêtes trans-sites), un hacker utilise une contrefaçon de requête trans-site pour connecter un utilisateur sur un site en utilisant ses identifiants.

+

Par exemple : un utilisateur visite un site web malveillant contenant un élément form. L'attribut action du formulaire est défini sur une requête HTTP POST pointant vers http://www.google.com/login, en envoyant le nom d'utilisateur et le mot de passe du hacker. Lorsque l'utilisateur envoie le formulaire, sa requête est envoyée à Google, la connexion est faite avec succès et le serveur Google définit un cookie dans le navigateur de l'utilisateur. À présent, l'utilisateur est sans le savoir connecté sur le compte Google du hacker.

+

Cette attaque peut être utilisée pour récupérer des informations sensibles à propos de l'utilisateur. Par exemple, la fonctionnalité d'Historique Web de Google recense tous les mots-clefs de recherche de l'utilisateur. Si l'utilisateur est connecté sur le compte Google du hacker ayant la fonctionnalité d'Historique Web activée, alors l'utilisateur donne toutes ses informations au hacker.

+

Les attaques de connexion CSRF, et les défenses potentielles à mettre en place contre elles, sont documentées plus exhaustivement dans Défenses robustes contre les contrefaçons de requêtes trans-sites (PDF, en). Elles ne sont pas spécifiques à Persona : la plupart des mécanismes de connexion sont potentiellement vulnérables face à elles.

+

Il y a plusieurs techniques qui peuvent être utilisées pour protéger un site contre les attaques de connexion CSRF, qui sont documentées plus exhaustivement dans l'étude ci-dessus.

+

Une de ces approches est de créer un identifiant secret dans le serveur, partagé avec le navigateur et de demander au navigateur de le fournir lors de requêtes de connexions. Par exemple :

+
    +
  1. Dès que l'utilisateur arrive sur votre site, avant qu'il n'essaie de se connecter, créez une session pour lui sur le serveur. Enregistrez l'ID de la session dans un cookie de navigateur.
    2. +
  2. Sur le serveur, générez une chaîne de caractères aléatoire d'au moins 10 caractères alphanumériques. Un UUID généré aléatoirement est une bonne solution. C'est le jeton CSRF. Enregistrez-le dans la session.
    3. +
  3. Donnez le jeton CSRF au navigateur en l'incluant dans du JavaScript ou dans le HTML en tant que variable de formulaire cachée.
    4. +
  4. Assurez-vous que les envois AJAX ou les requêtes POST de formulaires incluent le jeton CSRF.
    5. +
  5. Côté serveur, avant d'accepter une assertion, assurez-vous que le jeton CSRF envoyé correspond au jeton CSRF enregistré dans la session.
    6. +
+

Améliorations

+

Politique de sécurité du contenu (CSP)

+

La Politique de sécurité du contenu (CSP) est une couche supplémentaire de sécurité qui aide à détecter et atténuer certains types d'attaques, dont le Scriptage Trans-sites (XSS) et les attaques d'injection de données. Ces attaques sont utilisées pour beaucoup de choses du vol de données à la dégradation du site ou la distribution de logiciels malveillants.

+

Si vous utilisez la CSP sur votre site, vous devriez modifier votre politique pour inclure Persona. En fonction de votre politique, vous pourriez avoir besoin de :

+ +

Une configuration Apache d'example pourrait inclure :

+
Header set X-Content-Security-Policy: "default-src 'self'; frame-src 'self' https://login.persona.org ; script-src 'self' https://login.persona.org"
diff --git a/files/fr/archive/mozilla/persona/identity_provider_overview/index.html b/files/fr/archive/mozilla/persona/identity_provider_overview/index.html new file mode 100644 index 0000000000..6a29be7c8f --- /dev/null +++ b/files/fr/archive/mozilla/persona/identity_provider_overview/index.html @@ -0,0 +1,59 @@ +--- +title: Identity Provider Overview +slug: Archive/Mozilla/Persona/Identity_Provider_Overview +translation_of: Archive/Mozilla/Persona/Identity_Provider_Overview +--- +

Un Fournisseur d'Identité (Identity Provider ou IdP) Persona  est un domaine qui enregistre et certifie directement l'identité de ses utilisateurs. Parce que les identités de Persona sont basées sur les adresses email, tous domaine offrant des emails à leurs utilisateurs peut simplement devenir un IdP.

+ +

Si vous avez un nom de domaine, vous pouvez devenir un IdP Persona en implémentant un support pour le protocole BrowserID.

+ +

If you have a domain name, you can become a Persona IdP by implementing support for the underlying BrowserID protocol.

+ +

Le document support IdP

+ +

Domains advertise their ability to act as IdPs by publishing a support document at /.well-known/browserid. This JSON-formatted document contains three values:

+ + + +

Websites use the public-key to verify the authenticity of users' identity assertions.

+ +

Browsers use the authentication and provisioning values to obtain certification of their user's identity.

+ +

For more information, including how domains can delegate to other IdPs, see the /.well-known/browserid documentation.

+ +

Comment le navigateur interagit-t-il avec les IdPs ?

+ +

Pour montrer l'interaction entre les Navigateurs et les IdPs, nous allons regarder ce qui doit se passer la première fois que alice@example.com essaie de se connecter à un site en utilisant Persona.

+ +
    +
  1. Le navigateur d'alice récupère le document support à l'url https://example.com/.well-known/browserid.
    2. +
  2. Alice's browser invisibly loads the provisioning page for example.com and asks it to sign a public key certifying Alice's identity.
    3. +
  3. Before signing the key, example.com needs proof that the user really is Alice, so it tells the browser that she needs to authenticate.
    4. +
  4. Alice's browser shows Alice the authentication page for example.com and she signs in, establishing a new session at example.com.
    5. +
  5. Alice's browser reloads the provisioning page and again asks it to sign a public key certifying Alice's identity.
    6. +
  6. The provisioning page can verify Alice's identity by inspecting the new session. Satisfied, it signs a certificate containing Alice's public key, her email address, and an expiration date for the certificate.
    7. +
+ +

For the duration of the signed certificate, Alice's browser can create valid identity assertions for alice@example.com whenever she wants to log into a web site with Persona.

+ +

Steps 3-5 can be skipped if Alice already has a valid session with example.com, for example, from logging into her webmail or an intranet portal.

+ +

Comment les Sites Web interagissent avec les IdPs ?

+ +

Let's say Alice wants to sign in to 123done.org. Her browser would generate and sign an identity assertion containing the certificate from above and present it as proof of her identity.

+ +

By comparing Alice's signature on the identity assertion with the public key inside the signed certificate, 123done can be confident that the certificate was issued to the same person that generated the identity assertion. However, 123done still needs to check that the certificate itself is valid by examining its signature.

+ +

Because the certificate was issued for alice@example.com, 123done fetches the support document from https://example.com/.well-known/browserid. It then extracts the public-key and compares that to the signature on Alice's certificate. If the key matches the signature, 123done knows that the certificate is legitimate and can finish logging Alice in.

+ +

Note that 123done never "phoned home" or otherwise revealed Alice's identity when she logged in. Rather, it only needed to request a single, cacheable document from example.com.

+ +

Security and trust

+ +

The BrowserID protocol, and thus Persona, are built on standard public key crytography techniques.

+ +

Feel free to explore our documentation on the cryptographic concepts behind how a Persona IdP works or read more detail on how IdPs are implemented.

diff --git a/files/fr/archive/mozilla/persona/index.html b/files/fr/archive/mozilla/persona/index.html new file mode 100644 index 0000000000..160cdb0e3a --- /dev/null +++ b/files/fr/archive/mozilla/persona/index.html @@ -0,0 +1,195 @@ +--- +title: Persona +slug: Archive/Mozilla/Persona +tags: + - Persona +translation_of: Archive/Mozilla/Persona +--- +
Un système de connexion simple et respectueux de la vie privée : laissez vos utilisateurs s'identifier avec leurs adresses e-mail, et libérez-vous de la gestion des mots de passe.
+ +

Mozilla Persona est un système d'identification pour le web facile à utiliser et à déployer. Il fonctionne sur tous les principaux navigateurs, vous pouvez l'utiliser dès maintenant.

+ +

Pourquoi utiliser Persona sur votre site web ?

+ +
    +
  1. Persona élimine complètement les mots de passe spécifiques à un site web, libérant les utilisateurs et les sites web du fardeau de créer, gérer et sauvegarder de manière sécurisée les mots de passe.
    2. +
  2. Persona est facile à utiliser.  En deux clics seulement, un utilisateur de Persona peut se connecter sur un site web comme Voost,  en s'affranchissant des contraintes liées à la création d'un nouveau compte.
    3. +
  3. Persona est facile à mettre en oeuvre. Les développeurs peuvent ajouter Persona à leur site web en seulement un après-midi.
    4. +
  4. Bien mieux, il n'y a pas de contrainte. Les développeurs recoivent une adresse e-mail vérifiée pour chacun de leurs utilisateurs,  et l'utilisateur peut utiliser n'importe quelle adresse e-mail avec Persona.
    5. +
+ +

De plus, Persona ne peut que s'améliorer : il est constuit sur un protocole ouvert et décentralisé, qui a été conçu pour permettre une intégration direct aux navigateurs et un support natif par les fournisseurs d'e-mail. Les sites qui implémentent Persona aujourd'hui profiteront automatiquement de ces améliorations sans avoir à modifier leur code.

+ +
+
+

Utiliser Persona sur votre site

+ + +
+

Pour commencer

+ +
+
Pourquoi Persona ?
+
Qu'est ce qui rend Persona spécial comparé aux autres systèmes d'identification et authentification.
+
Configuration rapide
+
Une rapide introduction  montrant comment ajouter Persona à votre site web.
+
+ +

Référence de l'API

+ +
+
L'API navigator.id
+
Référence pour l'objet navigator.id.
+
L'API de vérification
+
Référence pour l'API de vérification.
+
+
+ +
+

Guides

+ +
+
Considérations de sécurité
+
Pratiques et techniques pour déployer votre Persona en toute sécurité.
+
Compatibilité des navigateurs
+
Découvrez  quels navigateurs sont supportés par Persona.
+
Internationalisation
+
Découvrez comment Persona supporte différents langages.
+
Le guide de l'implémenteur
+
Des astuces par les sites qui ont ajouté le support de Persona.
+
+
+ +
+

Ressources

+ +
+
Librairies et plugins
+
Vous trouverez une drop-in librairie pour votre langage de programmation favori, web framework, blog, ou CMS.
+
Le livre d'astuces Personna
+
Exemples de codes sources pour les sites Persona. Avec des extraits en C# (MVC3), PHP, Node.JS, et autres.
+
Ressources promotionnelles
+
Boutons se connecter et autres éléments graphiques pour aider à présenter Persona à vos utilisateurs.
+
+
+
+ +
+

Devenir un fournisseur d'identité

+ +

Si vous êtes un fournisseur d'adresses de messagerie ou d'un autre service d'identification, voyez les liens ci-dessous pour apprendre comment devenir un fournisseur d'identité Persona.

+ +
+
+
+
IdP : vue d'ensemble
+
Une vue haut niveau des fournisseurs d'identité de Persona.
+
+
+ +
+
+
Implémenter un IdP
+
Un guide précis sur les  détails techniques pour devenir un IdP.
+
+
+ +
+
+
.well-known/browserid
+
Un aperçu de la structure et de l'objet du fichier .well-known/browserid que les IdPs utilisent pour signaler leur utilisation du protocole.
+
+
+
+ +
+

Le projet Persona

+ +
+
+
+
Glossaire
+
Définitions de la terminologie utilisée par BrowserID et Persona.
+
FAQ
+
Réponses aux questions fréquentes.
+
Protocole : vue d'ensemble
+
Un aperçu de niveau technique intermédiaire du protocole sous-jacent BrowserID.
+
+
+ +
+
+
Crypto
+
Un aperçu des concepts cryptographiques derrière Persona et BrowserID.
+
Les Spécifications
+
Détails techniques approfondis.
+
+
+ +
+
+
Le site web de Persona
+
Pour faire fonctionner Persona, nous hébergeons trois services sur https://login.persona.org: un fournisseur d'identité de substitution, une implémentation portable des APIs navigator.id et un service de vérification des affirmations d'identité.
+
Code source de Persona
+
Le code source de Persona pour les sites web est sur un dépot sur GitHub. Patches bienvenus !
+
+
+
+ +

+ +
+

Rejoignez la communauté Identity

+
+
Choisissez votre méthode préférée pour rejoindre la discussion :
+ +
+
+ +
+
+

+ +

 

+ + + +
    +
  1. Utiliser Persona sur votre site web + +
      +
    1. Pourquoi utiliser Persona ?
      2. +
    2. Configuration rapide
      3. +
    3. Astuces pour implémenter Persona
      4. +
    4. Considérations de sécurité
      5. +
    5. Compatibilité navigateurs
      6. +
    6. Internationalisation
      7. +
    7. L'API navigator.id
      8. +
    8. L'API de vérification à distance
      9. +
    9. Bibliothèques et plugins
      10. +
    10. Recommandations d'interface Utilisateur
      11. +
    +
    2. +
  2. Devenir un fournisseur d'identité +
      +
    1. Vue d'ensemble IdP
      2. +
    2. Implémenter un IdP
      3. +
    3. Format de .well-known-browserid
      4. +
    +
    3. +
  3. Le projet Persona +
      +
    1. Glossaire
      2. +
    2. FAQ
      3. +
    3. Services hébergés Persona
      4. +
    4. Vue d'ensemble du protocole
      5. +
    5. Cryptographie
      6. +
    +
    4. +
diff --git a/files/fr/archive/mozilla/persona/internationalisation/index.html b/files/fr/archive/mozilla/persona/internationalisation/index.html new file mode 100644 index 0000000000..0989a4d086 --- /dev/null +++ b/files/fr/archive/mozilla/persona/internationalisation/index.html @@ -0,0 +1,50 @@ +--- +title: Internationalisation +slug: Archive/Mozilla/Persona/Internationalisation +tags: + - Persona +translation_of: Archive/Mozilla/Persona/Internationalization +--- +

Qu'est-ce qui est traduit dans Persona ?

+

Dans le futur, l'interface pour se connecter sur des sites avec Persona sera intégrée directement dans le navigateur, et ainsi traduite avec la traduction du navigateur. Pour les navigateurs qui n'intégrent pas Persona, son interface consiste en une série de dialogues affichées depuis login.persona.org. Ces dialogues sont traduits par une équipe de volontaires de la communauté, et plus de 45 langues sont actuellement activées en production.

+

Comment Persona choisit la langue

+

Le service Persona sélectionne une langue en se basant sur le header Accept-Language envoyé dans les requêtes du navigateur. L'algorithme utilisé pour faire correspondre une langue au header Accept-Language est le même que celui utilisé par mozilla.org :

+
    +
  1. Pour chaque identifiant de langue dans le header Accept-Language : +
      +
    • vérifier s'il existe une correspondance exacte pour la langue associée à l'identifiant de langue
      • +
    • vérifier s'il existe une correspondance partielle de la première partie de l'identifiant de langue avec une langue
      • +
    +
    2. +
  2. Si une correspondance ne peut pas être établie en utilisant la première règle, s'en remettre à en-US. Cependant, en ou en-US est presque toujours le dernier header de langue préférée envoyé par la plupart des navigateurs.
    3. +
+

Par exemple, le tableau ci-dessous liste la langue choisie pour différents headers Accept-Language, si les langues suivantes étaient supportées : en-US, es, es-MX :

+ + + + + + + + + + + + + + + + + + + + + + + + + +
Header Accept-LanguageLangue sélectionnée
es-AR,es;q=0.8,en-us;q=0.5es
es-MX,es;q=0.8,en-us;q=0.5es-MX
es-es,en-us;q=0.5en-US
es-esen-US
+

Il n'y a pour le moment pas de possibilité pour un site de forcer le dialogue d'être dans un langage prédéfini. C'est parce que l'interface de Persona est d'un point de vue logique (et tout comme les futures implémentations natives le seront) intégrée dans l'interface du navigateur, c'est pourquoi sa langue doit être cohérente avec la langue du navigateur.

+

Comment aider

+

Persona utilise Mozilla Verbatim pour permettre aux volontaires de créer de nouvelles traductions. Si vous souhaitez aider, lisez le guide « démarrer avec Verbatim (en) » et visitez le projet « BrowserID » (en) sur Verbatim.

diff --git a/files/fr/archive/mozilla/persona/libraries_and_plugins/index.html b/files/fr/archive/mozilla/persona/libraries_and_plugins/index.html new file mode 100644 index 0000000000..54d297c63b --- /dev/null +++ b/files/fr/archive/mozilla/persona/libraries_and_plugins/index.html @@ -0,0 +1,205 @@ +--- +title: Bibliothèques et plugins +slug: Archive/Mozilla/Persona/Libraries_and_plugins +tags: + - Persona +translation_of: Archive/Mozilla/Persona/Libraries_and_plugins +--- +

Envie d'utiliser Persona sur votre site ou votre blog ? Implémenter Persona à partir de rien, c'est simple, mais les plugins et bibliothèques listées ici pourraient bien vous aider à aller plus vite !
+
+ Cette page liste trois types de bibliothèques :
+
+ 1. des plugins qui intégrent Persona dans des environnements de travail et systèmes de gestion de contenu (CMS) existants
+ 2. des bibliothèques utilitaires, utiles lorsque vous développez de nouveaux plugins ou que vous intégrez Persona dans un site à partir de rien
+ 3. n'importe quoi d'autre en rapport avec Persona, ce qui inclut des bibliothèques pour faire de votre domaine un Persona Identity Provider
+
+ Ceci est une liste maintenue par la communauté. Si vous avez créé une bibliothèque ou un plugin, merci de l'ajouter à cette page.

+ +
Cette page est actuellement en cours de tri, et certains plugins pourraient être obsolètes. N'oubliez pas de faire des recherches sur les plugins avant de les utiliser.
+ +
+

Les liens vers les plugins listés ici sont des documents rédigés en anglais

+
+ +

Plugins

+ +

Clojure

+ + + +

Cold Fusion

+ + + +

Haskell

+ + + +

Java

+ + + +

JavaScript

+ + + +

Node.js

+ + + +

PHP

+ + + +

Python

+ + + +

Ruby

+ + + +

Miscellaneous

+ + + +

Vous n'avez pas vu votre langage ou environnement de travail ici ? LoginRadius, un widget d'authentification, offre une intégration de Persona pour beaucoup de plateformes.

+ +

Bibliothèques utilitaires

+ +

C

+ + + +

Go

+ + + +

Haskell

+ + + +

.Net

+ + + +

Node.js

+ + + +

PHP

+ + + +

Python

+ + + +

Autres

+ +

Perl

+ + + +

Python

+ + + +

Ruby

+ + + +

PHP

+ + + +

Racket

+ + diff --git a/files/fr/archive/mozilla/persona/pourquoi_persona/index.html b/files/fr/archive/mozilla/persona/pourquoi_persona/index.html new file mode 100644 index 0000000000..589c24e8be --- /dev/null +++ b/files/fr/archive/mozilla/persona/pourquoi_persona/index.html @@ -0,0 +1,32 @@ +--- +title: Pourquoi Persona ? +slug: Archive/Mozilla/Persona/Pourquoi_Persona +tags: + - Persona +translation_of: Archive/Mozilla/Persona/Why_Persona +--- +

Le mécanisme le plus répandu, basé sur le couple identifiant/mot de passe, n'est pas tenable : on demande aux utilisateurs de créer et de retenir un nouveau mot de passe complexe pour chaque site ou service qu'ils utilisent, et chaque site doit stocker de son côté les mots de passe de manière sécurisée. Pourtant, des intrusions récentes montrent que même des entreprises de premier plan peuvent avoir des failles dans la sécurité de leur base de mots de passe, ce qui met en danger les informations de leurs utilisateurs.

+

Persona est un système de gestion des identités ouvert, distribué, adapté à l'échelle d'internet, qui remplace le système des mots de passe par site. Il répond aux limitations en termes d'ergonomie et de vie privée que peuvent rencontrer des systèmes comme OpenID, sans avoir recours à une infrastructure centralisée comme le fait Facebook Connect.

+

Persona : la fin des mots de passe par site

+

Au lieu d'utiliser un mot de passe pour chaque site, Persona permet aux utillisateurs de se connecter en seulement deux clics après avoir réalisé un processus simple une seule fois pour chacune de leurs identités en ligne. Le processus est totalement sécurisé et basé sur les principes de la cryptographie à clé publique. Plutôt qu'un mot de passe, le navigateur internet de l'utilisateur génère ensuite une « assertion d'identité » chiffrée, qui expire après quelques minutes et n'est valable que pour un seul site. Du fait qu'il n'y a plus de mot de passe spécifique pour chaque site, les sites utilisant Persona n'ont plus à se préoccuper du stockage sécurisé des mots de passe ou de la perte éventuelle de leur base de mots de passe.

+

Cette méthode rapide d'authentification réduit aussi la complexité lors de la première connexion d'un utilisateur à un nouveau site.

+

Les identifiants Persona sont vos adresses de courriel

+

Plutôt que des identifiants à saisie libre, Persona utilise des adresses de courriel, ce qui a plusieurs avantages pour les utilisateurs comme pour les développeurs :

+

Avantages des adresses de courriel pour les utilisateurs

+ +

Avantages des adresses de courriel pour les développeurs

+ +

Sans oublier par ailleurs que le courriel est un système qui est déjà complètement distribué, avec des milliards de comptes existant chez d'innombrables fournisseurs.

+

En quoi Persona diffère-t-il des autres systèmes d'authentification unique (Single Sign-On) ?

+

Persona est sécurisé et facile à utiliser. Il protège la vie privée des utilisateurs, leur laisse le contrôle et une liberté de choix de façon inégalée.

+

De nombreux réseaux sociaux comme Facebook ou Google+ imposent aux utilisateurs l'utilisation de leurs vrais noms et leur limitent l'accès à un compte unique. En utilisant comme identifiant de base l'adresse de courriel, Persona permet aux utilisateurs de garder séparées leurs identités de travail, de maison, d'école ainsi que leurs autres identités.

+

Persona est ouvert et distribué : toute personne ayant une adresse de courriel peut se connecter à des sites web avec Persona. Plus encore, chacun peut héberger son propre service d'authentification ou le déléguer à d'autres, exactement comme dans le cas des courriels, et contrairement aux services uniques et centralisés utilisés par les réseaux sociaux.

+

Persona propose aussi une nouvelle approche de la protection de la vie privée en mettant le navigateur internet au centre du processus d'authentification : le navigateur obtient d'un côté des certificats du fournisseur de courriel de l'utilisateur, et les présente de l'autre côté au site web. Le service de courriel ne peut pas pister l'utilisateur, et les sites tiers peuvent avoir confiance dans l'identité de l'utilisateur grâce à la signature chiffrée des certificats. La plupart des systèmes concurrents comme OpenID exigent que les sites tiers envoient un message en retour avant d'autoriser l'utilisateur à se connecter.

diff --git a/files/fr/archive/mozilla/persona/quick_setup/index.html b/files/fr/archive/mozilla/persona/quick_setup/index.html new file mode 100644 index 0000000000..ee692b5274 --- /dev/null +++ b/files/fr/archive/mozilla/persona/quick_setup/index.html @@ -0,0 +1,241 @@ +--- +title: Configuration rapide +slug: Archive/Mozilla/Persona/Quick_Setup +tags: + - Persona +translation_of: Archive/Mozilla/Persona/Quick_Setup +--- +

Seules cinq étapes sont nécessaires pour installer un système d'authentification Persona sur votre site :

+ +
    +
  1. Inclure la bibliothèque JavaScript Persona sur vos pages.
    2. +
  2. Ajouter les boutons “connexion” et “déconnexion”.
    3. +
  3. Observer les actions connexion et déconnexion.
    4. +
  4. Vérifier l'identification de l'utilisateur.
    5. +
  5. Consulter les meilleures pratiques.
    6. +
+ +

Vous devriez être en mesure de le faire fonctionner en un simple après-midi, mais chaque chose en son temps : si vous comptez utiliser Persona sur votre site, s'il vous plaît, prenez un moment pour vous inscrire sur la liste de diffusion Persona notices. Elle est à faible trafic, étant uniquement utilisée pour annoncer les changements et les problème de sécurité qui pourraient affecter votre site.

+ +

Étape 1 : Inclure la bibliothèque Persona

+ +

Persona est conçu pour ne pas être lié à un navigateur en particulier et fonctionne bien dans les principaux navigateurs de bureau et mobile.

+ +

Dans le futur nous espérons que les navigateurs fourniront un support natif de Persona, mais en attendant nous fournissons une bibliothèque JavaScript qui implémente pleinement l'interface et l'API client du protocole. En incluant cette bibliothèque, vos utilisateurs seront en mesure de se connecter avec Persona, que leur navigateur en ait un support natif ou non.

+ +

Une fois la bibliothèque chargée sur la page, les fonctions Persona dont vous avez besoin (watch(), request(), et logout()), seront accessible depuis l'objet global navigator.id.

+ +

Pour inclure la bibliothèque JavaScript Persona, vous pouvez placer cette balise  <script> tout en bas de de votre code HTML, avant la fermeture de la balise <body> :

+ +
<script src="https://login.persona.org/include.js"></script>
+
+ +

Vous devez inclure ceci dans toutes les pages qui utilisent les fonctions de navigator.id. Persona étant toujours en développement, il est déconseillé d'héberger vous-même une copie du fichier include.js.

+ +

Supprimer le Mode de Compatibilité

+ +

Vous devez vous assurer que les utilisateurs d'Internet Explorer n'utilisent pas le Mode de Compatibilité, car il cassera Persona.

+ +

Vous pouvez soit inclure cette balise <meta>, dans votre page, avant tout élément script :

+ +
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
+ +

Ou vous pouvez définir un entête HTTP sur votre page : X-UA-Compatible: IE=Edge.

+ +

Étape 2 : Ajoutez des boutons de connexion et de déconnexion

+ +

Persona étant conçu comme une API DOM, vous devez appeler des fonctions quand un utilisateur clique sur un bouton de connexion ou de déconnexion sur votre site. Pour ouvrir la boîte de dialogue Persona et demander à l'utilisateur de se connecter, vous devez appeler navigator.id.request(). Pour la déconnexion, appelez navigator.id.logout(). Notez que l'appel à logout() doit être fait depuis la fonction attachée à l'évènement.

+ +

Par exemple :

+ +
var signinLink = document.getElementById('signin');
+if (signinLink) {
+  signinLink.onclick = function() { navigator.id.request(); };
+};
+
+var signoutLink = document.getElementById('signout');
+if (signoutLink) {
+  signoutLink.onclick = function() { navigator.id.logout(); };
+};
+
+ +

À quoi devraient ressembler ces boutons ? Consultez notres page de ressources graphiques pour des exemple complets basés sur du CSS !

+ +

Étape 3 : Gérez les actions de connexion et de déconnexion

+ +

Afin que Persona puisse fonctionner, vous devez lui dire quoi faire lorsqu'un utilisateur se connecte ou se déconnecte. Pour cela, appelez la fonction navigator.id.watch() et passez lui trois paramètres :

+ +
    +
  1. L'adresse email de l'utilisateur actuellement connecté à votre site depuis cet ordinateur, ou null si aucun utilisateur n'est connecté. Par exemple, vous pouvez consulter un cookie du navigateur pour déterminer qui est connecté.
    2. +
  2. Une fonction à appeler lorsqu'une action onlogin est déclenchée. Cette fonction reçoit un seul paramètre, une "assertion d'identité" qui doit être vérifiée.
    3. +
  3. Une fonction à appeler lorsqu'une action onlogout est déclenchée. Cette fonction ne reçoit aucun paramètre.
    4. +
+ +
+

Note: Vous devez toujours inclure à la fois onlogin et onlogout lorsque vous appelez navigator.id.watch().

+
+ +

Par exemple, si vous pensez que Bob est connecté à votre site, vous pourriez faire ceci :

+ +
var currentUser = 'bob@example.com';
+
+navigator.id.watch({
+  loggedInUser: currentUser,
+  onlogin: function(assertion) {
+    // Un utilisateur est connecté ! Voici ce qu'il faut faire :
+    // 1. Envoyer l'assertion à votre backend pour vérification et pour créer la session.
+    // 2. Mettre à jour l'interface utilisateur.
+    $.ajax({
+      type: 'POST',
+      url: '/auth/login', // Ceci est une URL sur votre site web.
+      data: {assertion: assertion},
+      success: function(res, status, xhr) { window.location.reload(); },
+      error: function(xhr, status, err) {
+        navigator.id.logout();
+        alert("Login failure: " + err);
+      }
+    });
+  },
+  onlogout: function() {
+    // Un utilisateur s'est déconnecté ! Voici ce qu'il faut faire :
+    // Détruire la session de l'utilisateur en redirigeant l'utilisateur ou en appelant votre backend.
+    // Assurez vous aussi de réinitialiser loggedInUser à null sur la prochain fois où la page sera chargée
+    // (Pas false, ni 0 ou undefined. null)
+    $.ajax({
+      type: 'POST',
+      url: '/auth/logout', // Ceci est une URL sur votre site web.
+      success: function(res, status, xhr) { window.location.reload(); },
+      error: function(xhr, status, err) { alert("Logout failure: " + err); }
+    });
+  }
+});
+
+ +

Dans cet exemple, onlogin et onlogout sont tous deux implémentés en effectuant des requêtes POST asynchrones vers le backend de votre site. Le backend effectue ensuite la connexion ou la déconnexion de l'utilisateur, généralement en créant ou en effaçant des informations dans un cookie de session. Ensuite, si tout fonctionne bien, la page se recharge afin de prendre en compte le nouvel état de connexion.

+ +

Notez que si l'assertion ne peut être vérifiée, vous devez appeler navigator.id.logout(), qui indique à Persona qu'aucun utilisateur n'est actuellement connecté. Si vous ne le faîtes pas, alors Persona peut appeler onlogin immédiatement à nouveau, avec la même assertion, et entrainer une boucle infinie d'échecs de connexion.

+ +

Bien entendu vous pouvez utiliser des requêtes AJAX pour implémenter cela sans recharger la page ni rediriger l'utilisateur, mais cela ne fait pas partie du périmètre de ce tutoriel.

+ +

Voici un autre exemple, cette fois-ci sans utiliser jQuery.

+ +
function simpleXhrSentinel(xhr) {
+  return function() {
+    if (xhr.readyState == 4) {
+      if (xhr.status == 200) {
+        // recherche la page pour prendre en compte le nouveau statut de connexion
+        window.location.reload();
+      } else {
+        navigator.id.logout();
+        alert("XMLHttpRequest error: " + xhr.status);
+      }
+    }
+  };
+}
+
+function verifyAssertion(assertion) {
+  // Votre backend doit retourner un status code HTTP 200 pour indiquer la bonne
+  // vérification de l'adresse e-mail de l'utilisateur et il doit s'arranger pour que
+  // currentUser soit bien associer à cette adresse quand la page est rechargée
+  var xhr = new XMLHttpRequest();
+  xhr.open("POST", "/xhr/sign-in", true);
+  // voir http://www.openjs.com/articles/ajax_xmlhttp_using_post.php
+  var param = "assertion="+assertion;
+  xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
+  xhr.setRequestHeader("Content-length", param.length);
+  xhr.setRequestHeader("Connection", "close");
+  xhr.send(param); // pour la vérification par votre backend
+  xhr.onreadystatechange = simpleXhrSentinel(xhr);
+}
+
+function signoutUser() {
+  // Votre backend doit retourner un code statut HTTP 200 pour indique la bonne déconnexion
+  // (habituellement après la réinitialisation de plusieurs variables de session)
+  // et s'arranger pour que l'association à currentUser soit 'null' quand la page est rechargée
+  var xhr = new XMLHttpRequest();
+  xhr.open("GET", "/xhr/sign-out", true);
+  xhr.send(null);
+  xhr.onreadystatechange = simpleXhrSentinel(xhr);
+}
+
+// C'est parti !
+navigator.id.watch({
+  loggedInUser: currentUser,
+       onlogin: verifyAssertion,
+      onlogout: signoutUser
+}};
+
+ +

Vous devez appeler navigator.id.watch() sur toutes les pages comprenant un bouton de connexion ou de déconnexion. Pour gérer les améliorations de Persona comme la connexion automatique et la déconnexion globale de vos utilisateurs, il est conseillé d'appeler cette fonction sur toutes les pages de votre site.

+ +

Persona comparera l'adresse e-mail que vous passez dans loggedInUser avec celle qu'il connaît pour l'utilisateur actuellement connecté. Si elles ne correspondent pas, il peut déclencher automatiquement onlogin ou onlogout au chargement de la page.

+ +

Étape 4 : Vérifiez les identifiants de l'utilisateur

+ +

Plutôt qu'un mot de passe, Persona utilise des "assertions d'identité" qui sont une sorte de mot de passe à usage unique, lié à un seul site et combiné à l'adresse e-mail de l'utilisateur. Lorsqu'un utilisateur désire se connecter, votre fonction de callback onlogin sera appelée et recevra en paramètre une assertion de cet utilisateur. Avant d'autoriser la connexion, vous devez vérifier la validité de cette assertion.

+ +

Il est extrêmement important que vous vérifiiez cette assertion sur votre serveur et non en JavaScript (qui s'exécute dans le navigateur de votre utilisateur) car cela serait trop facile à contourner. L'exemple ci-dessous confie l'assertion au backend du site en utilisant le helper jQuery $.ajax() pour effectuer un POST de celle-ci vers /api/login.

+ +

Une fois que le serveur dispose d'une assertion, comment la vérifier ? Le moyen le plus simple est d'utiliser un helper fourni par Mozilla. Effectuez un simple POST de l'assertion vers https://verifier.login.persona.org/verify avec deux paramètres :

+ +
    +
  1. assertion: L'assertion d'identité fournie par l'utilisateur.
    2. +
  2. audience: Le nom de domaine et le port de votre site web. Vous devez coder cette valeur en dur dans votre backend ; ne la composez pas en fonction d'une quelconque donnée fournie par l'utilisateur.
    3. +
+ +

Par exemple, si vous êtes example.com, vous pouvez utiliser la ligne de commande pour tester une assertion avec :

+ +
$ curl -d "assertion=<ASSERTION>&audience=https://example.com:443" "https://verifier.login.persona.org/verify"
+
+ +

Si elle est valide, vous recevrez une réponse en JSON comme celle-ci :

+ +
{
+  "status": "okay",
+  "email": "bob@eyedee.me",
+  "audience": "https://example.com:443",
+  "expires": 1308859352261,
+  "issuer": "eyedee.me"
+}
+
+ +

Pour en apprendre plus à propos du service de vérification, lisez l'API de vérification à distance. Un exemple d'implémentation de /api/login utilisant Python, le framework web Flask, et la librairie HTTP Requests ressemblerait à ça :

+ +
@app.route('/api/login', methods=['POST'])
+def login():
+    # La requête doit avoir une assertion à vérifier
+    if 'assertion' not in request.form:
+        abort(400)
+
+    # Envoyer l'assertion au service de vérification de Mozilla.
+    data = {'assertion': request.form['assertion'], 'audience': 'https://example.com:443'}
+    resp = requests.post('https://verifier.login.persona.org/verify', data=data)
+
+    # Le vérificateur a-t-il répondu ?
+    if resp.ok:
+        # Décoder la réponse
+        verification_data = json.loads(resp.content)
+
+        # Si l'assertion est valide
+        if verification_data['status'] == 'okay':
+            # Connecter l'utilisateur en lui envoyant un cookie de session sécurisé
+            session.update({'email': verification_data['email']})
+            return resp.content
+
+    # Oups, quelque chose a échoué. Abandon.
+    abort(500)
+
+ +

La gestion de session est probablement très similaire à votre système de connexion existant. Le premier grand changement est de vérifier l'identité de l'utilisateur en vérifiant une assertion plutôt que son mot de passe. L'autre grand changement est de s'assurer que l'adresse email de l'utilisateur est disponible pour la passer dans le paramètre loggedInEmail de navigator.id.watch().

+ +

La déconnexion est simple : vous n'avez qu'à effacer le cookie de session de l'utilisateur.

+ +

Étape 5 : Consultez les bonnes pratiques

+ +

Une fois que tout fonctionne et que vous vous êtez connecté et déconnecté avec succès de votre site, vous devriez prendre un moment pour consulter les bonnes pratiques pour utiliser Persona de manière sûre et sécurisée.

+ +

Si vous construisez un site de production, consulter le guide de l'implémenteur, où nous collections les astuces pour intégrer les fonctionnalités souvent requises dans les systèmes de connexion.

+ +

Enfin, n'oubliez pas de vous inscrire à la liste de difussion Persona notices afin d'être informé des failles de sécurité ou de changements incompatibles avec de précédentes versions de l'API Persona. Cette liste a un taffic extrêmement faible : elle est uniquement utilisée pour annoncer des changements qui pourraient avoir un impact négatif sur votre site.

+ +

 

diff --git a/files/fr/archive/mozilla/persona/the_implementor_s_guide/ajouter_adresse_email_supplementaire_avec_persona/index.html b/files/fr/archive/mozilla/persona/the_implementor_s_guide/ajouter_adresse_email_supplementaire_avec_persona/index.html new file mode 100644 index 0000000000..2058fd4b0a --- /dev/null +++ b/files/fr/archive/mozilla/persona/the_implementor_s_guide/ajouter_adresse_email_supplementaire_avec_persona/index.html @@ -0,0 +1,18 @@ +--- +title: Ajouter des adresses e-mail supplémentaires avec Persona +slug: >- + Archive/Mozilla/Persona/The_implementor_s_guide/Ajouter_adresse_email_supplementaire_avec_Persona +tags: + - Persona +translation_of: >- + Archive/Mozilla/Persona/The_implementor_s_guide/Adding_extra_email_addresses_with_Persona +--- +

C'est une bonne idée de permettre à vos utilisateurs d'ajouter des adresses e-mail supplémentaires à leurs comptes. Ceci leur permet de changer leurs adresses e-mail, et d'accéder à leur compte même s'ils sont dans l'impossibilité d'accéder à leur compte e-mail principal.

+

Vous devrez vérifier les adresses supplémentaires. Vous pouvez le faire manuellement, en envoyant un e-mail contenant un lien de vérification à la nouvelle adresse, ou le faire en utilisant Persona.

+

Si vous utilisez Persona pour ajouter des adresses e-mail, il vous faut alors faire attention à plusieurs points : rendez le contexte de la requête explicite, et mettez à jour la valeur passer dans loggedInUser pour assurer que la transaction n'est pas cassée par le gestionnaire de session de Persona

+

Clarifier le context de la requête

+

Quand vous requêtez une nouvelle assertion en utilisant soit la vieille API navigator.id.get() ou l'API navigator.id.request(), Persona part du principe que l'utilisateur est en train d'essayer de se connecter au site web, et l'interface utilisateur est affiché en conséquence. Si vous utilisez Persona seulement pour vérifier une nouvelle adresse e-mail, votre site doit expliquer ceci clairement aux utilisateurs, afin qu'ils ne soient pas étonnés par la fenêtre de Persona.

+

Mettre à jour loggedInUser

+

Si vous utilisez l'API navigator.id.get() sur l'ensemble de votre site, alors vous pouvez simplement faire un nouvel appel à navigator.id.get() pour obtenir la nouvelle adresse e-mail.

+

Mais si vous utilisez navigator.id.request(), il vous faut alors utiliser navigator.id.request() pour obtenir l'adresse e-mail supplémentaire. Dans ce cas, quand vous avez vérifié l'assertion dans votre gestionnaire onlogin, vous devez mettre à jour l'argument loggedInUser de navigator.id.watch() avec la nouvelle adresse.

+

Si vous ne le faîtes pas, il y aura une mauvaise correspondance : Persona pensera que l'utilisateur connecté est nouvelle_adresseemail@example.org, mais votre site web dira que l'utilisateur connecté est vieille_adresseemail@example.org. Persona réagira en déclenchant onlogin avec une assertion pour nouvelle_adresseemail@example.org, que votre site web reconnatra sûrement comme un nouveau utilisateur souhaitant se connecter.

diff --git a/files/fr/archive/mozilla/persona/the_implementor_s_guide/appeler_request()_seulement_depuis_gestionnaire_clic/index.html b/files/fr/archive/mozilla/persona/the_implementor_s_guide/appeler_request()_seulement_depuis_gestionnaire_clic/index.html new file mode 100644 index 0000000000..fb2c27e81b --- /dev/null +++ b/files/fr/archive/mozilla/persona/the_implementor_s_guide/appeler_request()_seulement_depuis_gestionnaire_clic/index.html @@ -0,0 +1,12 @@ +--- +title: Appeler request() seulement depuis un gestionnaire de clic +slug: >- + Archive/Mozilla/Persona/The_implementor_s_guide/appeler_request()_seulement_depuis_gestionnaire_clic +tags: + - Persona +translation_of: >- + Archive/Mozilla/Persona/The_implementor_s_guide/Call_request()_only_from_a_click_handler +--- +

Le fenêtre Persona est actuellement implémentée comme une fenêtre popup. Les navigateurs web modernes bloquent les popups, sauf s'ils sont déclenchés directement depuis un clic de la souris ou depuis un touche du clavier. Ceci veut dire que vous devez appeler navigator.id.request() ou navigator.id.get() directement depuis la fonction gérant le clic ou la touche pressée. Si c'est fait en réaction à un autre évènement, le popup ne s'affichera pas et l'utilisateur ne pourra pas s'identifier.

+

Par exemple : Supposons que votre site web diffère l'identification. Les utilisateurs peuvent parcourir le contenu, mais ils ne doivent s'identifier que lorsqu'ils souhaitent éditer le contenu. Si vous implémentez ceci en appelant navigator.id.request() en réponse à un évènement focus sur un champ texte, alors la popup sera bloquée.

+

Vous pouvez toujours implémenter l'identification sur le focus de cette façon : sur l'évènement focus, affichez un dialogue avec un bouton "Identifiez-vous", et attachez le déclenchement de navigator.id.request() sur l'évènement click.

diff --git a/files/fr/archive/mozilla/persona/the_implementor_s_guide/call_logout()_after_a_failed_login/index.html b/files/fr/archive/mozilla/persona/the_implementor_s_guide/call_logout()_after_a_failed_login/index.html new file mode 100644 index 0000000000..b587288f2d --- /dev/null +++ b/files/fr/archive/mozilla/persona/the_implementor_s_guide/call_logout()_after_a_failed_login/index.html @@ -0,0 +1,21 @@ +--- +title: Appeler logout() après une connexion échouée +slug: >- + Archive/Mozilla/Persona/The_implementor_s_guide/Call_logout()_after_a_failed_login +tags: + - Persona +translation_of: >- + Archive/Mozilla/Persona/The_implementor_s_guide/Call_logout()_after_a_failed_login +--- +

Après que votre gestionnaire onlogin a été appelé avec une assertion, si pour quelque raison, vous ne pouvez utiliser cette assertion pour connecter l'utilisateur, vous devez appeler navigator.id.logout().

+

Si vous ne le faîtes pas, la prochaine que vous appelerez navigator.id.watch(), Persona appelera immédiatement, à nouveau, votre gestionnaire onlogin, avec la même assertion. Ceci amène généralement à une boucle infinie d'echec de connexion :

+
    +
  1. L'utilisateur clique sur "Se connecter"
    2. +
  2. L'utilisateur intéragit avec l'interface de Persona, et Persona génère une assertion
    3. +
  3. Persona livre l'assertion au gestionnaire onlogin de la page
    4. +
  4. Le gestionnaire onlogin rejète l'assertion, et redirige l'utilisateur vers la page de connexion
    5. +
  5. La page de connexion se charge, et appelle navigator.id.watch(). Nous retournons à l'étape 3.
    6. +
+

Ceci car Persona essaye de se souvenir de l'adresse e-mail que vous voulez utilisez pour la connexion sur un site donné. Une fois que l'utilisateur a essayé de se connecté à votre site en tant que bob@example.org, Personna se souvient que c'est l'adresse que vous souhaitez utiliser pour ce site. Quand une nouvelle page se charge et appele navigator.id.watch() avec un loggedInUser à 'null', Persona compare à nouveau avec sa valeur "bob@example.org", et envoie l'assertion à nouveau.

+

Pour que Persona oublie l'association entre votre site l'adresse e-mail, appelez navigator.id.logout() si vous ne souhaitez pas identifier l'utilisateur avec cette assertion. Ceci parce que l'assertion n'est pas valide, ou parce que vous ne voulez pas utiliser cette adresse e-mail.

+

Un scénario commun, où ce problème peut survenir, est quand un service veut autoriser ses utilisateurs à se connecter avec Persona, mais ne veut pas permettre de s'inscrire avec Persona, préférant un système d'inscription personnalisé pour les nouveaux utilisateurs. Dans ce cas, quand vous recevez l'assertion, vous vérifiez que l'adresse e-mail est bien celui d'un de vos utilisateurs, et si ce n'est pas le cas, vous rejetez la connexion. Si vous rejetez l'assertion, vous devez appeler navigator.id.logout().

diff --git a/files/fr/archive/mozilla/persona/the_implementor_s_guide/index.html b/files/fr/archive/mozilla/persona/the_implementor_s_guide/index.html new file mode 100644 index 0000000000..6057c265b6 --- /dev/null +++ b/files/fr/archive/mozilla/persona/the_implementor_s_guide/index.html @@ -0,0 +1,55 @@ +--- +title: Guide de l'implémenteur +slug: Archive/Mozilla/Persona/The_implementor_s_guide +tags: + - Persona +translation_of: Archive/Mozilla/Persona/The_implementor_s_guide +--- +

Le guide de configuration rapide peut être suffisant pour démarrer, mais quand vous construisez un site complet pour la production, vous aurez probablement besoin de fonctionnalités qui n'ont pas été couvertes par ce guide. Dans cette page, nous avons rassemblé les fonctionnalités qui sont couramment nécessaires pour les systèmes de connexion, et nous expliquons les meilleures pratiques pour les implémenter avec Persona.

+
+
+
+ Appeler logout() après une connexion échouée
+
+ Appeler toujours logout() si vous rejetez une assertion, pour évider une différence entre votre idée de l'utilisateur courant et l'idée de Persona, qui pourrait amener à une boucle infinie d'échecs de connexion.
+
+
+
+ Ajouter des adresses e-mail supplémentaires avec Persona
+
+ Comment permettre à vos utilisateurs d'ajouter une adresse e-mail secondaire en utilisant Persona.
+
+
+
+ Permettre aux utilisateurs de changer d'adresse e-mail
+
+ Comme permettre à vos utilisateurs de changer d'adresse e-mail en utilisant Persona.
+
+
+
+ Problèmes pour intégrer une protection CSRF
+
+ Un problème causé par l'intération entre un mécanisme courant de protection CSRF et l'API Observer de Persona.
+
+
+
+ Supporter les utilisateurs sans JavaScript
+
+ Persona requiert JavaScript. Cette page a quelques astuces pour supporter les utilisateurs qui n'ont pas JavaScript.
+
+
+
+
+
+ Appeler request() seulement depuis un gestionnaire de clic
+
+ Parce que Persona utilise une fenêtre popup, vous devez appeler request() ou get() seulement dans la fonction attachée à l'évènement click ou keypress, pas à un autre type d'évènement.
+
+
+
+ Tester votre système
+
+ Quelques conseils pour simuler la connexion et la déconnexion des utilisateurs sur votre site web.
+
+
+

 

diff --git a/files/fr/archive/mozilla/persona/the_implementor_s_guide/permettre_utilisateurs_changer_adresse_email/index.html b/files/fr/archive/mozilla/persona/the_implementor_s_guide/permettre_utilisateurs_changer_adresse_email/index.html new file mode 100644 index 0000000000..be06388a44 --- /dev/null +++ b/files/fr/archive/mozilla/persona/the_implementor_s_guide/permettre_utilisateurs_changer_adresse_email/index.html @@ -0,0 +1,22 @@ +--- +title: Permettre aux utilisateurs de changer d'adresse e-mail +slug: >- + Archive/Mozilla/Persona/The_implementor_s_guide/permettre_utilisateurs_changer_adresse_email +tags: + - Persona +translation_of: >- + Archive/Mozilla/Persona/The_implementor_s_guide/Enabling_users_to_change_their_email_address +--- +

Parce que les noms d'utilisateur Persona sont des adresses e-mail, il n'est pas forcément évident de savoir comment vous pouvez permettre à vos utilisateurs de changer d'adresse e-mail. Nous sommes en train de travailler pour améliorer le processus, et pour le moment, c'est un peu particulier, mais faisable en suivant ces étapes :

+
    +
  1. Utilisez un identifiant qui est indépendant de l'adresse e-mail de l'utilisateur comme clef primaire dans votre table d'utilisateurs. Elle peut ainsi rester la même lorsque l'adresse e-mail change.
    2. +
  2. Permettez aux utilisateurs d'ajouter des adresses e-mail à leurs comptes. Vous devrez vérifier leurs adresses e-mail, ce que vous pouvez faire manuellement, en envoyer un lien de vérification dans un e-mail à leur nouvelle adresse, ou en utilisant Persona. Si vous utilisez Persona, lisez Ajouter des adresses e-mail supplémentaires avec Persona.
    3. +
  3. Permettez aux utilisateurs de se connecter avec n'importe quelle adresse e-mail de leur compte.
    4. +
  4. Permettez aux utilisateurs de supprimer leurs adresses e-mail.
    5. +
+

Avec ces fonctionnalités, les utilisateurs peuvent changer leur adresse e-mail de cette façon :

+
    +
  1. Connexion à leur compte en utilisant leur adresse e-mail courante
    2. +
  2. Ajout d'une nouvelle adresse e-mail à leur compte
    3. +
  3. Suppression de l'ancienne adresse e-mail de leur compte.
    4. +
diff --git a/files/fr/archive/mozilla/persona/the_implementor_s_guide/problemes_integrer_protection_crsf/index.html b/files/fr/archive/mozilla/persona/the_implementor_s_guide/problemes_integrer_protection_crsf/index.html new file mode 100644 index 0000000000..134f7954ec --- /dev/null +++ b/files/fr/archive/mozilla/persona/the_implementor_s_guide/problemes_integrer_protection_crsf/index.html @@ -0,0 +1,21 @@ +--- +title: Problèmes pour intégrer une protection CSRF +slug: >- + Archive/Mozilla/Persona/The_implementor_s_guide/problemes_integrer_protection_CRSF +tags: + - Persona +translation_of: >- + Archive/Mozilla/Persona/The_implementor_s_guide/Problems_integrating_with_CRSF_protection +--- +

Si vous implémentez une protection particulière contre les attaques de connexion CSRF (Cross-Site Request Forgery, contrefaçon de requêtes trans-sites), vous rencontrerez des problèmes quand un utilisateur a plusieurs pages ouvertes sur votre site, et essaie ensuite de se connecter avec l'une d'elles. Ce document explique ce problème, et comment le résoudre.

+

CSRF et les attaques de connexion CSRF

+

Dans le cas normal d'une attaque CSRF, l'utilisateur est déjà connecté au site ciblé (par exemple, leur banque). L'utilisateur charge alors une page sur un autre site, construite de manière malveillante. Cette page envoie une requête HTTP vers le site web ciblé : la requête présente un intérêt particulier (par exemple, le transfert d'argent vers l'attaqueur). Le site ciblé permet la requête car il pense que puisque l'utilisateur est connecté au site, elle est faite par l'utilisateur.

+

Dans le cas d'une attaque de connexion CSRF, l'utilisateur charge une page construite de manière malveillante qui connecte l'utilisateur sur le site ciblé, mais en tant que l'attaquant : le site ciblé dépose alors un cookie de session dans le navigateur de l'utilisateur. L'attaquant peut accéder au compte plus tard, et récupérer les informations que le site a collectées sur l'utilisateur.

+

Protection contre CSRF : jetons CSRF déclinés à partir de l'identifiant de session

+

Une protection courante contre les attaques normales CSRF consiste pour les sites web de générer un jeton à partir de l'identifiant de session de l'utilisateur, et l'inclure dans les pages qu'ils servent : ensuite les requêtes POST doivent inclure ce jeton, qui est vérifié par le serveur. Ceci veut dire que les requêtes POST ne peuvent pas être faites depuis d'autres domaines, car ils ne peuvent pas accéder au jeton utilisé pour la vérification.

+

Avec les attaques de connexion CSRF, bien sûr, l'utilisateur n'est pas encore connecté au site web. Donc le site prépare une première session dès que l'utilisateur visite une page. Elle est utilisée pour générer le jeton CSRF jusqu'à ce que l'utilisateur se connecte. Une fois l'utilisateur connecté, un nouvel identifiant de session est généré, et un jeton CSRF est regénéré.

+

Le problème avec Persona

+

Le problème avec Persona survient quand l'utilisateur n'est pas encore identifié, et a des pages de votre site web dans deux différents onglets, A et B. Les pages contiennent le même jeton CSRF, généré à partir de l'identifiant de la première session. Ensuite l'utilisateur se connecte dans l'onglet A, et le site genère un nouvel identifiant de session, et de par le fait, un nouveau jeton CSRF. Mais l'onglet B a toujours l'ancienne page de chargée, contenant l'ancien jeton, maintenant invalide.

+

Dans des circonstances ordinaires cela n'aurait pas d'importance : dès que l'onglet B recharge la page, ou que l'utilisateur navigue sur une nouvelle page, le jeton CSRF inclus est mis à jour. Mais lorsque Persona a généré une assertion en réponse à un appel à navigator.id.request(), Persona appelle onlogin pour chaque onglet qui a chargé le site Web, et pas seulement pour celui qui a réclamé l'assertion. Dès l'appel du gestionnaire onlogin sur l'onglet B, il essaie d'envoyer en POST l'assertion vers le serveur qui utilise l'ancien jeton CSRF — et le serveur lance alors une erreur CSRF.

+

La solution

+

La solution consiste pour le gestionnaire de onlogin à envoyer une requête GET qui réclame un nouveau jeton CSRF et vérifie que l'utilisateur est déjà identifié. Si l'utilisateur est bien identifié, le gestionnaire n'a plus qu'à recharger la page. Sinon il utilise le nouveau jeton CSRF pour envoyer l'assertion en POST au serveur.

diff --git a/files/fr/archive/mozilla/persona/the_implementor_s_guide/supporter_utilisateurs_sans_javascript/index.html b/files/fr/archive/mozilla/persona/the_implementor_s_guide/supporter_utilisateurs_sans_javascript/index.html new file mode 100644 index 0000000000..429975768b --- /dev/null +++ b/files/fr/archive/mozilla/persona/the_implementor_s_guide/supporter_utilisateurs_sans_javascript/index.html @@ -0,0 +1,10 @@ +--- +title: Supporter les utilisateurs sans JavaScript +slug: >- + Archive/Mozilla/Persona/The_implementor_s_guide/supporter_utilisateurs_sans_javascript +tags: + - Persona +translation_of: >- + Archive/Mozilla/Persona/The_implementor_s_guide/Supporting_users_without_JavaScript +--- +

Persona requiert actuellement JavaScript. Si vous avez besoin de supporter les utilisateurs qui n'ont pas JavaScript activé, il vous faudra implémenter un système de connexion alternatif pour ces utilisateurs, et désactiver le bouton "Se connecter avec Persona", en l'activant avec le code JavaScript qui associe le bouton avec navigator.id.request().

diff --git a/files/fr/archive/mozilla/persona/the_implementor_s_guide/tester/index.html b/files/fr/archive/mozilla/persona/the_implementor_s_guide/tester/index.html new file mode 100644 index 0000000000..cc9db5711b --- /dev/null +++ b/files/fr/archive/mozilla/persona/the_implementor_s_guide/tester/index.html @@ -0,0 +1,10 @@ +--- +title: Tester +slug: Archive/Mozilla/Persona/The_implementor_s_guide/tester +tags: + - Persona +translation_of: Archive/Mozilla/Persona/The_implementor_s_guide/Testing +--- +

Si vous développez un système pour la production, vous aurez sûrement besoin d'écrire des tests d'intégration qui simuleront l'identification par un utilisateur et sa déconnexion, en utilisant Persona.

+

Si vous utilisez Selenium pour tester, considérez l'utilisation de la bibliothèque bidpom. Les sites mockmyid.com et personatestuser.org peuvent aussi être utiles.

+

Vous voudrez aussi peut-être regarder stubbyid.

diff --git a/files/fr/archive/mozilla/persona/vue_densemble_du_protocole/index.html b/files/fr/archive/mozilla/persona/vue_densemble_du_protocole/index.html new file mode 100644 index 0000000000..2b14af2b69 --- /dev/null +++ b/files/fr/archive/mozilla/persona/vue_densemble_du_protocole/index.html @@ -0,0 +1,61 @@ +--- +title: Vue d'ensemble du protocole +slug: Archive/Mozilla/Persona/vue_densemble_du_protocole +translation_of: Archive/Mozilla/Persona/Protocol_Overview +--- +

Persona est construit sur le protocole BrowserID. Cette page décrit le fonctionnement haut niveau de BrowserID.

+

Acteurs

+

Le protocole implique trois acteurs:

+ +

Persona et le protocole BrowserID utilisent les adresses e-mail comme identifiant, il est donc naturel que les fournisseurs d'e-mail deviennent des IdPs.

+

Mozilla intervient en tant qu'IdP par défaut pour que les utilisateurs puissent utiliser n'importe quelle adresse e-mail, même si son fournisseur n'est pas un IdP.

+

Étapes du protocole

+

Il y a trois étapes distinctes dans le protocole :

+
    +
  1. Fourniture du certificat de l'utilisateur
    2. +
  2. Génération de l'assertion
    3. +
  3. Vérification de l'assertion
    4. +
+

Comme prérequis, l'utilisateur doit avoir une adresse e-mail active qu'il souhaite utiliser pour se connecter. Le protocole ne requière pas que le fournisseur d'identité soit un routeur SMTP, mais il requière que l'identité soit au format utilisateur@domaine.

+

Fourniture du certificat de l'utilisateur

+

Pour se connecter à un site, un utilisateur doit prouver qu'il est le propriétaire de l'e-mail. La base de cette preuve est un certificat signé et chiffré fourni par l'IdP attestant le lien entre le navigateur d'un utilisateur et une identité donnée par l'IdP.

+

Comme Persona utilise les techniques standard de cryptographie par clef publique, le certificat de l'utilisateur est signé avec la clef privée de l'IdP et contient :

+ +

Le navigateur de l'utilisateur génére une paire de clef différente pour chaque adresse de l'utilisateur, et ces paires ne sont pas partagées entre les navigateurs. En conséquence, un utilisateur doit obtenir un nouveau certificat à chaque fois qu'un expire, ou à chaque fois qu'il utilise un nouveau navigateur ou ordinateur. Les certificats doivent expirer dans les 24h après leur emission.

+

Quand un utilisateur séléctionne une identité à utiliser quand il se connécte a un site, le navigateur vérifie s'il a un certificat valide pour cette identité. Si c'est le cas, l'étape est terminée et la navigation continue avec l'étape d'après : la génération de l'assertion.  Si le navigateur n'a pas de certificat valide, il essaye d'en obtenir un du domaine associé avec l'identité choisie.

+
    +
  1. Le navigateur va chercher le document de support /.well-known/browserid par SSL depuis le domaine de l'identité.
    2. +
  2. Avec les informations du document, le navigateur transmet l'adresse e-mail de l'utilisateur et la clef publique associée au fournisseur d'identité et demande un certificat signé.
    3. +
  3. Si nécessaire, l'utilisateur est invité à se connecter chez le fournisseur avant la fourniture du certificat.
    4. +
  4. Le fournissseur crée, signe et donne le certificat de l'utilisateur au navigateur de l'utilisateur.
    5. +
+

Le certificat en main, le navigateur peut continuer avec la génération de l'assertion et la connexion au site.

+

user-certificate-provisioning.png

+

Génération de l'assertion

+

Le certificat de l'utilisateur établie un lien vérifiable entre une adresse e-mail et une clef publique. Cependant, seul, ce n'est pas suffisant pour se connecter à un site web : l'utilisateur doit encore monter son lien avec le certificat en prouvant sa possession de la clef privée.

+

Pour cela, le navigateur de l'utilisateur crée et signe un nouveau document appelé "assertion de l'identité". Il contient :

+ +

Le navigateur présente alors à la fois le certificat de l'utilisateur et l'assertion de l'identité au site web pour la vérification.

+

Vérification de l'assertion

+

La combinaison du certificat et de l'assertion est suffisante pour confirmer l'identité d'un utilisateur.

+

D'abord, le site vérifie le domaine et la date d'expiration dans l'assertion. Si l'assertion est expirée ou destinée a un domaine different, elle est rejetée. Cela évite la réutilisation malicieuse de l'assertion

+

Ensuite, le site valide la signature de l'assertion avec la clef publique de l'utilisateur contenu dans le certificat. Si la clef et la signature correspondent, le site est assuré que l'utilisateur posséde vraiment la clef associée au certificat.

+

En dernier, le site va chercher la clef publique du fournisseur depuis son document /.well-known/browserid et verifie qu'il correspond a la signature du certificat de l'utilisateur. Si c'est le cas, le site peut etre certain que le certificat a vraiment ete issue du domaine en question.

+

Une fois cela vérifié, this is a current login attempt for the proper RP, that the user certificate matches the current user, and that the user certificate is legitimate, the RP is done and can authenticate the user as the identity contained in the certificate.

+

assertion-generation-and-verify.png

+

The Persona Fallback IdP

+

What if a user's email provider doesn't support Persona? In that case, the provisioning step would fail. By convention, the user's browser handles this by asking a trusted third party, https://login.persona.org/, to certify the user's identity on behalf of the unsupported domain. After demonstrating ownership of the address, the user would then receive a certificate issued by the fallback IdP, login.persona.org, rather than the identity's domain.

+

RPs follow a similar process when validating the assertion: the RP would ultimately request the fallback IdP's public key in order to verify the certificate.

diff --git a/files/fr/archive/mozilla/when_to_use_ifdefs/index.html b/files/fr/archive/mozilla/when_to_use_ifdefs/index.html new file mode 100644 index 0000000000..d0c04f0367 --- /dev/null +++ b/files/fr/archive/mozilla/when_to_use_ifdefs/index.html @@ -0,0 +1,28 @@ +--- +title: Quand utiliser les "ifdefs" ? +slug: Archive/Mozilla/When_To_Use_ifdefs +translation_of: Archive/Mozilla/When_To_Use_ifdefs +--- +

La base du code Mozilla est utilisée dans de nombreux projets et produits, incluant Firefox, Thunderbird, XULRunner et bien d'autres. Ce code de base est parfois utilisé dans plusieurs projets mais des différences dans certains endroits sont parfois nécessaires. Les "ifdefs", ou instructions conditionnelles, sont alors utilisées pour obtenir un code différent.

+

Qu'est-ce qu'un "ifdef" ?

+

Un "ifdef" est une directive de compilation conditionnelle pour le préprocesseur qui permet de sélectionner certains bouts de code lorsque certaines conditions sont remplies. Dans ce document, le terme est utilisé en vrac pour désigner n'importe quel type de conditions qui permettent de générer différentes configurations.

+

Quand les "ifdefs" sont utilisés ?

+

Il existe 3 principaux cas d'utilisations dans l'arborescence de Mozilla : les ifdefs pour la partie "platform/widget", les ifdefs définissant certaines fonctionnalités et les ifdefs spécifiques à une application:

+

ifdefs pour "Platform/widget"

+

Le code dans Mozilla aura fréquemment besoin d'être différent pour certaines plateformes et widgets. Ces ifdefs sont pour la plupart acceptés. La seule fois où ils peuvent poser problèmes est lorsque l'on a du code d'une extension multi-plateforme ou pour la localisation: étant donné que ces codes sont téléchargés à travers plusieurs plateformes, les ifdefs spécifiques à une seule plateforme sont interdits.

+

Pour un exemple d'ifdef spécifique à une plateforme, voir nsCRT.h.

+

ifdefs pour les fonctionnalités (ou "feature")

+

Le code dans Mozilla contient beaucoup de fonctionnalités pouvant être activées/désactivées via des flags dans un fichier configure. Par exemple, il est possible de désactiver une grande partie du moteur de rendu de XUL en spécifiant --disable-xul quand on crée une configuration pour un build. Quand on ajoute des ifdefs qui implémente ces flags de configuration, une grande attention doit être portée sur les dépendances de construction (build dependencies). Par exemple, XPCOM, le moteur Javascript SpiderMonkey et le moteur réseau ne connaissent rien de XUL et ne devraient avoir aucun ifdefs basé sur --disable-xul.

+

Un ifdef spécial mérite votre attention : "MOZ_XUL_APP". Cette variable permet de "marquer" toutes applications utilisant le "toolkit". Les ifdefs sur MOZ_XUL_APP ne sont pas acceptables pour le tier 9, mais sont tolérés (et parfois même indispensable) pour les tiers suivants.

+

Pour un exemple d'ifdef gérant des caractéristiques, voir layout/Makefile.in.

+

ifdefs spécifiques aux applications

+

Pour finir, chaque application/projet a besoin de générer différents morceaux de code. Les ifdefs liés à une application ne devraient se trouver que dans du code spécifique à cette application. C'est le ifdef le plus délicat à placer car il est souvent difficile de savoir quel code est partagé et quel code est spécifique à une application. En règle général, tout code dans le tier 2, tier 9, ou tier 50 est du code partagé et ne devrait pas contenir d'ifdef spécifique à une application. N'importe quel code dans les tiers suivants est spécifique à une application. Cette règle comporte de nombreuses exceptions dont certaines sont listées ici :

+ +

Pour un exemple d'ifdef spécifique à une application mauvais et qui devrait être supprimé, voir nsNativeAppSupportWin.cpp.

+

Types d'ifdef

+

Il existe deux grands types d'ifdef : les ifdef pour le préprocesseur et les ifdefs pour le Makefile. Les ifdefs pour le préprocesseur sont généralement facile à repérer: dans du code C, C++ on les trouve avec des instructions comme #ifdef ou #if.

+

Les ifdefs dans un Makefile sont cependant plus dur à repérer et peuvent indirectement provoquer des erreurs ce qui est bien plus grave. Les ifdefs d'un Makefile sont utilisés pour construire ou non certains répertoires. Cela signifie qu'il existe des interfaces complètement différentes mais portant le même nom qui sont construites via des conditions. Par exemple (au moment de la rédaction), il existe 2 interfaces nsIExtensionManager : {{ Source("toolkit/mozapps/extensions/public/nsIExtensionManager.idl", "toolkit version") }} et {{ Source("xpfe/components/extensions/public/nsIExtensionManager.idl", "suite version") }}. Les ifdefs du Makefile qui choisissent l'un ou l'autre ne sont pas évidents à trouver (voir {{ Source("Makefile.in") }} et {{ Source("xpfe/components/Makefile.in") }}).

+

Si vous introduisez un quelconque ifdef dans un makefile, veuillez demander une revue de votre code à un des mainteneurs du "build-config": Benjamin Smedberg sera généralement ravi de vérifier vos changements.

diff --git a/files/fr/archive/mozilla/xbl/index.html b/files/fr/archive/mozilla/xbl/index.html new file mode 100644 index 0000000000..126b055462 --- /dev/null +++ b/files/fr/archive/mozilla/xbl/index.html @@ -0,0 +1,37 @@ +--- +title: XBL +slug: Archive/Mozilla/XBL +tags: + - XBL +translation_of: Archive/Mozilla/XBL +--- +

+XML Binding Language (XBL, parfois aussi appelé langage de liaison extensible) est un langage permettant de décrire des liaisons pouvant être attachées à des éléments dans d'autres documents. L'élément auquel la liaison est attachée, appelé l'élément lié (bound element), acquiert le nouveau comportement spécifié par la liaison. +

Les liaisons peuvent contenir des gestionnaires d'évènements enregistrés sur l'élément lié, une implémentation de nouvelles méthodes et propriétés devenant accessibles depuis cet élément, et du contenu anonyme qui sera inséré par dessous l'élément lié. +

La plupart des éléments d'interface XUL sont au moins partiellement implémentés à l'aide de XBL. Vous pouvez construire vos propres éléments réutilisables à partir d'éléments XUL, HTML, SVG, et d'autres primitives à l'aide de XBL. +

+

Spécifications

+ +

Certaines des différences entre sXBL et XBL2 ont été relevées dans un article d'Anne van Kesteren (en anglais). +

Une présentation des différences entre le XBL de Mozilla et XBL2 est disponible dans ce message de Jonas Sicking (avril 2007). +

+

Voir aussi

+ +

Communauté

+ +

+

diff --git "a/files/fr/archive/mozilla/xbl/r\303\251f\303\251rence_xbl_1.0/index.html" "b/files/fr/archive/mozilla/xbl/r\303\251f\303\251rence_xbl_1.0/index.html" new file mode 100644 index 0000000000..19f7e528e9 --- /dev/null +++ "b/files/fr/archive/mozilla/xbl/r\303\251f\303\251rence_xbl_1.0/index.html" @@ -0,0 +1,106 @@ +--- +title: Référence XBL 1.0 +slug: Archive/Mozilla/XBL/Référence_XBL_1.0 +tags: + - XBL +translation_of: Archive/Mozilla/XBL/XBL_1.0_Reference +--- +

+

+

Résumé

+

Ce document décrit le langage de liaison extensible (Extensible Binding Language, XBL) 1.0 tel qu'implémenté dans les navigateurs basés sur Gecko. +

XBL est un langage de balisage basé sur XML pour implémenter des composants réutilisables (liaisons ou bindings) qui peuvent être liés à des éléments d'autres documents. L'élément pour lequel une liaison a été spécifiée, appelé l'élément lié ou bound element, reçoit un nouveau comportement spécifié par la liaison. Les liaisons peuvent être liées à des éléments à l'aide de feuilles de style en cascade (CSS) ou via le DOM. Un élément peut être lié à plusieurs liaisons différentes en même temps.

Fonctionnellement, les liaisons XBL peuvent être comparées avec les fonctionnalités Behaviors et Viewlink de Microsoft, mais implémentées comme une solution XML intégrée. +

Les liaisons peuvent contenir des gestionnaires d'évènements enregistrées sur l'élément lié, une implémentation de nouvelles méthodes et propriétés qui deviennent accessibles depuis celui-ci, et du contenu anonyme à insérer autour de cet élément. +

+
+

Différents ajustements dans l'implémentation actuelle ont été faits depuis les propositions XBL plus anciennes, et tous ne sont pas encore reflétés dans ce document. Le processus de documentation est toujours en cours : gardez cela à l'esprit lorsque vous utilisez les informations fournies. +

+
+

Éléments XBL

+

Les éléments XBL 1.0 sont dans l'espace de noms http://www.mozilla.org/xbl. +

+ +

Attachement et détachement de liaisons

+ +

Interfaces DOM

+ +

Contenu anonyme

+ +

Implémentations de liaisons

+ +

Gestionnaires d'évènements

+

Exemple - Notes

+

Mis à jour et ajusté pour l'implémentation actuelle de Firefox. +

+
+

Cet exemple est destiné à montrer l'utilisation de XBL plutôt que pour être une application utile en pratique. Pour cette raison, il contient de nombreux commentaires et certains blocs qui auraient pu être évités dans une solution plus compacte mais sont utilisés ici à des fins de démonstration. +

+
+ +

Voir cet exemple +


+Téléchargement de tous les fichiers (archive .zip) need to ask to adjust the server - it gives "Access denied" for zip files (?) +

+

Références

+ +
+

Informations sur le document original

+ +
diff --git "a/files/fr/archive/mozilla/xbl/r\303\251f\303\251rence_xbl_1.0/\303\251l\303\251ments/index.html" "b/files/fr/archive/mozilla/xbl/r\303\251f\303\251rence_xbl_1.0/\303\251l\303\251ments/index.html" new file mode 100644 index 0000000000..fffa11dcf9 --- /dev/null +++ "b/files/fr/archive/mozilla/xbl/r\303\251f\303\251rence_xbl_1.0/\303\251l\303\251ments/index.html" @@ -0,0 +1,462 @@ +--- +title: Éléments +slug: Archive/Mozilla/XBL/Référence_XBL_1.0/Éléments +translation_of: Archive/Mozilla/XBL/XBL_1.0_Reference/Elements +--- +

bindings

+ +

Cette section est testée et ajustée selon l'implémentation courante de Firefox. Veuillez ne la modifier que si le comportement réel diffère de celui qui est décrit. Veuillez ne pas le faire seulement sur base d'une autre spécification XBL.

+ +
<!ELEMENT bindings ( binding* ) >
+
+Hiérarchie :   élément racine
+Peut contenir : <binding>
+
+ +

L'élément bindings est l'élément racine de tout document XBL. Il doit habituellement déclarer XBL en tant qu'espace de noms par défaut (à moins qu'un préfixe d'espaces de noms XBL soit utilisé) et peut également déclarer d'autres préfixes d'espace de noms utilisés dans votre liaison.

+ +

bindings contient zéro ou plus éléments binding comme enfants. Chaque élément binding enfant définit une liaison unique pouvant être attachée à des éléments dans d'autres documents.

+ +

Un élément ne peut avoir qu'une liaison attachée (explicitement ou héritée) à un moment donné. Si plusieurs liaisons sont définies, seule la dernière de la séquence sera utilisée (comme avec toute règle CSS).

+ +

helloworld.html :

+ +
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
+<html>
+<head>
+<title>Hello world!</title>
+<style type="text/css">
+p {
+ -moz-binding: url(hello.xml#default);
+}
+#p03 {
+ -moz-binding: url(hello.xml#hello2);
+}
+</style>
+</head>
+<body>
+
+  <p>Default content</p>
+  <p>Default content</p>
+  <p id="p03">Default content</p>
+
+</body>
+</html>
+
+ +

hello.xml :

+ +
<?xml version="1.0"?>
+<bindings xmlns="http://www.mozilla.org/xbl"
+ xmlns:html="http://www.w3.org/1999/xhtml">
+  <binding id="default">
+    <content><html:b>Hello world! </html:b><children/></content>
+  </binding>
+  <binding id="hello2">
+    <content><html:b>Hello from my binding! </html:b><children/></content>
+  </binding>
+</bindings>
+
+ +

Vous pouvez voir le résultat en ouvrant helloworld.html dans Firefox. hello.xml doit se trouver dans le même répertoire que helloworld.html.

+ +

Suivant : bindings > élément binding.

+ +

Notes

+ + + +
<bindings xmlns="http://www.mozilla.org/xbl"
+ xmlns:html = "http://www.w3.org/1999/xhtml"
+ xmlns:xul  = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+ xmlns:svg  = "http://www.w3.org/2000/svg"
+ xmlns:xlink= "http://www.w3.org/1999/xlink">
+
+ +

binding

+ +
<!ENTITY % binding-content "(resources?,content?,implementation?,handlers?)">
+<!ELEMENT binding %binding-content;>
+<!ATTLIST binding
+   id                     ID             #REQUIRED
+   extends                CDATA          #IMPLIED
+   display                CDATA          #IMPLIED
+   inheritstyle           true           #IMPLIED
+>
+
+ +

L'élément binding décrit une seule liaison XBL. Une liaison XBL peut ajouter du contenu anonyme, des champs, des propriétés, des méthodes et des gestionnaires d'évènements à des éléments HTML/XML.

+ +

Une seule liaison XBL peut être attachée à un élément à l'aide de feuilles de style pour par script. (Consultez le bug 83830 pour les spécificités de <table>).

+ +

CSS :

+ +
div {
+ -moz-binding: url(myBinding.xml#default);
+}
+
+ +

DOM :

+ +
elementReference.style.MozBinding = "url(myBinding.xml#default)";
+
+ +

Dans les deux cas qui précèdent, on utilise binding avec id="default" dans un fichier myBinding.xml.

+ +

À partir de Firefox 3, il est également possible d'utiliser une URL data: pour intégrer la liaison directement :

+ +
div {
+  -moz-binding: url(data:text/xml;charset=utf-8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%0A%3Cbindings%20id%3D%22xbltestBindings%22%20xmlns%3D%22http%3A//www.mozilla.org/xbl%22%3E%0A%20%20%3Cbinding%20id%3D%22xbltest%22%3E%3Ccontent%3EPASS%3C/content%3E%3C/binding%3E%0A%3C/bindings%3E%0A);
+}
+
+ +

Comme les URL data: ne gèrent pas les identifiants de fragments, la première liaison trouvée dans le XML intégré est utilisée à la place. N'oubliez pas que la liaison doit toujours avoir un ID même si on ne la référence pas. De plus, les URL data: ne sont gérées que depuis du code chrome (autrement dit, depuis l'application ou une extension).

+ +
Note : La politique de même origine est utilisée pour les sites web ; ils peuvent seulement lier des fichiers XBL du même domaine, ou dans le chrome.
+ +

Pour des raisons de clarté, voici à quoi ressemble le XML intégré dans l'exemple qui précède :

+ +
<?xml version="1.0"?>
+<bindings id="xbltestBindings" xmlns="http://www.mozilla.org/xbl">
+  <binding id="xbltest"><content>PASS</content></binding>
+</bindings>
+
+ +

La seule manière simple d'attacher des liaisons à tout ensemble d'éléments est d'utiliser des déclarations CSS. Cela permet également de rendre l'implémentation des liaisons partiellement fonctionnelle si le scripting est désactivé. Dans ce dernier cas, toutes les méthodes et tous les gestionnaires d'évènements seront bloqués, mais le contenu anonyme et les styles seront toujours utilisés. C'est pourquoi que les déclarations CSS doivent toujours être utilisées — à moins que vous deviez ajouter des liaisons en cours d'exécution à des éléments particuliers.

+ +

Un élément binding peut contenur une balise resources, une balise content, une balise implementation et une balise handlers.

+ + + +

 

+ +

content

+ +
<!ELEMENT content ANY>
+<!ATTLIST content
+   id               ID           #IMPLIED
+>
+
+ +

Une liaison peut spécifier du nouveau contenu qui sera placé à l'intérieur de l'élément lié. Bien que ce contenu soit visible à l'écran comme s'il était directement dans le fichier, il est anonyme et est invisible du DOM normal. Pour accéder à des nœuds anonymes sur un élément XBL lié, vous pouvez utiliser les fonctions getAnonymousElementByAttribute et getAnonymousNodes. Le seul élément XBL pouvant apparaître dans la balise content est l'élément children. Les attributs de l'élément <content> dans la liaison sont définis sur l'élément lié.

+ + + +

children

+ +
<!ELEMENT children EMPTY>
+<!ATTLIST children
+   id               ID                           #IMPLIED
+   includes         CDATA                        #IMPLIED
+>
+
+ +

Spécifie l'emplacement où les éventuels enfants de l'élément lié seront placés dans le contenu généré.

+ +

Normalement, si l'élément lié a son propre contenu, le contenu anonyme n'est pas généré. Cependant, avec un élément children, il est possible de fusionner le contenu de l'élément HTML/XML avec le contenu XBL.

+ +

Si la balise children a elle-même un contenu, celui-ci deviendra le contenu par défaut. Si l'élément auquel la liaison est attachée a du contenu, le contenu par défaut sera ignoré. Si l'élément n'a aucun contenu, le contenu par défaut sera ajouté.

+ + + +

implementation

+ +
<!ENTITY % implementation-content "(method|property)*">
+<!ELEMENT implementation %implementation-content;>
+<!ATTLIST implementation
+   id               ID           #IMPLIED
+   name             CDATA        #IMPLIED
+   implements       CDATA        #IMPLIED
+>
+
+ +

The implementation element describes the set of methods and properties that are attached to the bound element. Once the binding is attached, these methods and properties can be invoked directly from the bound element.

+ + + +

constructor

+ +

The code inside the constructor is called when a binding has just been attached to an element. So full access to anonymous nodes generated by the binding is already possible. The constructor tag must be placed inside the implementation tag.

+ + + +
Note: Prior to Firefox 3, the constructor could be called at a time when reflow of the document layout was locked down, so that attempting to get layout information from within the constructor could return out of date information. In Firefox 3 and later, the constructor is called when reflow can take place, which results in up-to-date information being returned. See bug 398404 for details.
+ +

destructor

+ +

The code inside the destructor is called when a binding is being removed from an element. You can use this to unload resources to free memory. However the destructor is often not called when it should, see bug 230086. The destructor tag must be placed inside the implementation tag.

+ + + +

method

+ +
<!ENTITY % method-content "(parameter*,body?)">
+<!ELEMENT method %method-content;>
+<!ATTLIST method
+   id               ID           #IMPLIED
+   name             CDATA        #REQUIRED
+   type             CDATA        #IMPLIED
+>
+
+ +

The method element is used to describe a single method of a binding implementation.

+ + + +

Example

+ +
<method name="scrollTo">
+  <parameter name="index"/>
+  <body>
+    this.setAttribute("scrollpos", index);
+  </body>
+</method>
+
+ +

parameter

+ +
<!ELEMENT parameter EMPTY>
+<!ATTLIST parameter
+   id               ID           #IMPLIED
+   name             CDATA        #REQUIRED
+>
+
+ +

The parameter element is used inside a method element. It represents a single parameter of a method.

+ + + +

body

+ +
<!ELEMENT body CDATA>
+<!ATTLIST body
+   id               ID           #IMPLIED
+>
+
+ +

The body element represents the implementation of its corresponding method. Its contents are the script that is executed when the method is invoked.

+ + + +

field

+ +
<!ELEMENT field EMPTY>
+<!ATTLIST field
+   id               ID                  #IMPLIED
+   name             CDATA               #REQUIRED
+   readonly         (true|false)        #IMPLIED
+>
+
+ +

A field is similar to a property, except that it should not have a getter or setter. It is useful as a simple holder for a value. The field element must have content which is code that determines the initial value of the field. The field tag must be inside the implementation tag.

+ + + +
Note: In Firefox 3, fields are now evaluated the first time they're accessed instead of at binding attachment time. This shouldn't cause any problems in typical use cases, but there are cases in which this will impact the behavior of your code. See bug 372769 for details.
+ +

Here are some examples of cases in which the behavior of your code may change due to this change in Firefox 3:

+ +
    +
  1. If you have two fields, one named A and one named B, and field A sets .B, the value of .B will depend on whether or not .A has already been accessed.
    2. +
  2. If a proto is inserted into the proto chain after binding instantiation, doing so may affect field values (this wasn't the case in prior versions of Firefox).
    3. +
  3. At binding attachment time, <field name="parentNode">this.parentNode</field> is undefined instead of the value of parentNode.
    4. +
  4. A field no longer changes the value of a property set on the object itself (rather than a proto) before binding attachment.
    5. +
+ +

property

+ +
<!ENTITY % property-content "(getter?,setter?)">
+<!ELEMENT property %property-content;>
+<!ATTLIST property
+   id               ID                  #IMPLIED
+   name             CDATA               #REQUIRED
+   readonly         (true|false)        #IMPLIED
+   onget            CDATA               #IMPLIED
+   onset            CDATA               #IMPLIED
+>
+
+ +

The property element represents a single property of an implementation. A property consists of a pair of getter/setter functions that can be defined using onget/onset attributes or getter/setter elements underneath the property element. Like methods, once the binding is attached, the property can be obtained directly from the bound element. The property tag must be inside the implementation tag.

+ + + +

getter

+ +
<!ELEMENT getter PCDATA>
+<!ATTLIST getter
+   id               ID                  #IMPLIED
+>
+
+ +

The getter element contains script that gets executed when a specific property gets called. The getter tag must be inside the property tag.

+ + + +

setter

+ +
<!ELEMENT setter PCDATA>
+<!ATTLIST setter
+   id               ID                  #IMPLIED
+>
+
+ +

The setter element contains script that gets executed when a specific property is being set. The setter tag must be inside the property tag.

+ + + +

handlers

+ +
<!ENTITY % handlers-content "handler*">
+<!ELEMENT handlers %handlers-content;>
+<!ATTLIST handlers
+   id               ID                  #IMPLIED
+>
+
+ +

The handlers element contains event handlers that can be attached to elements within the bound document. These handlers are installed when the binding is attached and removed when the binding is detached. The handlers tag must be inside the binding tag.

+ + + +

handler

+ +
<!ENTITY % handler-content "PCDATA">
+<!ELEMENT handler %handler-content;>
+<!ATTLIST handler
+   id               ID                                  #IMPLIED
+   event            NMREF                               #REQUIRED
+   action           CDATA                               #IMPLIED
+   phase            (capturing|bubbling|target)         #IMPLIED
+   button           (1|2|3)                             #IMPLIED
+   modifiers        CDATA                               #IMPLIED
+   keycode          CDATA                               #IMPLIED
+   key              CDATA                               #IMPLIED
+   charcode         CDATA                               #IMPLIED
+   clickcount       (1|2|3)                             #IMPLIED
+   command          ID                                  #IMPLIED
+   preventdefault   false|true                          #IMPLIED
+>
+
+ +

The handler element describes a single event handler. This handler is attached to its target at the time the binding is attached and unhooked when the binding is detached from the bound element. The script inside the handler is executed when the event handler is matched. The handler tag must be inside the handlers tag.

+ + + +

resources

+ +
<!ENTITY % resources-content "(image?,stylesheet?)">
+<!ELEMENT resources %resources-content;>
+<!ATTLIST property
+   id               ID                  #IMPLIED
+>
+
+ +

Used for inclusion of image elements, to cache them for later use, and for inclusion of stylesheet elements. The resources tag must be used directly inside the binding tag.

+ + + +

stylesheet

+ +
<!ELEMENT stylesheet EMPTY>
+<!ATTLIST stylesheet
+   id               ID                  #IMPLIED
+   src              URI                 #REQUIRED
+>
+
+ +

The stylesheet element declares a style sheet used by the binding. The style rules in the style sheet will only be applied to the binding, not to other elements in the document. The stylesheet tag must be inside the resources tag.

+ + + +

image

+ +
<!ELEMENT image EMPTY>
+<!ATTLIST image
+   id               ID                  #IMPLIED
+   src              URI                 #REQUIRED
+>
+
+ +

Declares an image resource used by the binding. The image is loaded as soon as the binding is used. You can use this to preload a number of images for later use. The image tag must be inside the resources tag.

+ + diff --git a/files/fr/archive/mozilla/xpinstall/index.html b/files/fr/archive/mozilla/xpinstall/index.html new file mode 100644 index 0000000000..6c582079a1 --- /dev/null +++ b/files/fr/archive/mozilla/xpinstall/index.html @@ -0,0 +1,64 @@ +--- +title: XPInstall +slug: Archive/Mozilla/XPInstall +tags: + - XPInstall +translation_of: Archive/Mozilla/XPInstall +--- +
Cross-Platform Install (XPInstall) est une technologie utilisée par la suite d'applications Mozilla, Mozilla Firefox, Mozilla Thunderbird et d'autres applications basées sur XUL, pour l'installation d'extensions. Un module d'installation XPI (prononcez « zippy », dérivé de XPInstall) est un fichier ZIP contenant un script d'installation ou un manifeste (intitulé install.js ou install.rdf) à la racine de ce fichier.
+ + + + + + + + +
+

Documentation

+ +
+
Référence de l'API XPInstall
+
+ +
+
Apprenez à créer un installeur XPI par l'exemple
+
Cet article utilise le script de l'installeur du paquetage d'installation de browser.xpi comme base générale de la discussion autour des installations XPI (à traduire de en:Learn XPI Installer Scripting by Example).
+
+ +
+
Création de modules d'installation XPI
+
Cet article décrit le schéma de création de paquetage de Mozilla et offre un tutoriel pour la création d'un nouveau paquetage qui peut alors être redistribué, installé et rendu disponible pour les utilisateurs (à traduire de en:Creating XPI Installer Modules).
+
+ +
+
Assistants d'installation (ou Stub Installers)
+
(à traduire de en:Install Wizards (aka: Stub Installers)).
+
+ +

Tous les articles…

+ 		+

Communauté

+ +
    +
  • Voir les forums de Mozilla…
    • +
+ +

{{ DiscussionList("dev-platform", "mozilla.dev.platform") }}

+ +

Outils

+ + + +

Sujets liés

+ +
+
Extensions, XUL, XPI
+
+
+ +

Categories

+ +

Interwiki Language Links

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/codes_retourn\303\251s/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/codes_retourn\303\251s/index.html" new file mode 100644 index 0000000000..8bd22877f9 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/codes_retourn\303\251s/index.html" @@ -0,0 +1,274 @@ +--- +title: Codes retournés +slug: Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Codes_retournés +tags: + - Référence_de_l'API_XPInstall +translation_of: Archive/Mozilla/XPInstall/Reference/Return_Codes +--- +

 

+

Codes retournés

+

Les méthodes décrites dans ce document peuvent retournés tous les codes d'erreur ci-dessous. Dans Mozilla/SeaMonkey, ces constantes sont définies comme des composants de l'objet xpinstall (anciennement l'objet SoftwareUpdate dans Netscape Communicator 4.5).

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NomCodeExplication
SUCCESS0Succès.
REBOOT_NEEDED999Les fichiers ont été installés mais un ou plusieurs composants étaient en cours d'utilisation. Redémarrez l'application et votre ordinateur pour compléter l'installation. Sous Windows NT, vous ne devriez avoir besoin que de relancer l'application tant que vous n'avez pas modifié les fichiers système.
BAD_PACKAGE_NAME-200Un problème est survenu avec le nom de paquetage fourni à initInstall.
UNEXPECTED_ERROR-201Une erreur inconnue est survenue.
ACCESS_DENIED-202L'utilisateur (ou le système d'exploitation) ne possède pas les droits suffisant à l'installation.
TOO_MANY_CERTIFICATES-203Le script d'installation est signé par plus d'un certificat.
NO_INSTALL_SCRIPT-204Le script d'installation n'est pas signé.
NO_CERTIFICATE-205Le fichier extrait n'est pas signé ou le fichier (et donc son certificat) est introuvable.
NO_MATCHING_CERTIFICATE-206Le fichier extrait n'est pas signé avec le même certificat que celui utilisé pour signer le script d'installation.
CANT_READ_ARCHIVE-207Le paquetage XPI ne peut pas être lu.
INVALID_ARGUMENTS-208Les paramètres fournis à la fonction sont incorrects.
ILLEGAL_RELATIVE_PATH-209Chemin d'accès relatif illégal.
USER_CANCELLED-210L'utilisateur a annulé l'installation.
INSTALL_NOT_STARTED-211Il s'est produit un problème avec les paramètres fournis à initInstall, ou initInstall n'a pas été appelé en premier.
SILENT_MODE_DENIED-212Les droit pour une installation silencieuse ne sont pas accordés.
NO_SUCH_COMPONENT-213Le composant spécifié n'existe pas dans la + + Client Version Registry + .
DOES_NOT_EXIST-214Échec de la suppression. Le fichier spécifié n'existe pas.
READ_ONLY-215Échec de la suppression. Le fichier spécifié est en lecture seule.
IS_DIRECTORY-216Échec de la suppression. Le fichier spécifié est un répertoire.
NETWORK_FILE_IS_IN_USE-217Échec de la suppression. Le fichier spécifié est en cours d'utilisation.
APPLE_SINGLE_ERR-218Une erreur est survenue lors de la décompression d'un fichier au format AppleSingle.
INVALID_PATH_ERR-219Le chemin d'accès fourni à getFolder n'existe pas.
PATCH_BAD_DIFF-220Une erreur est survenue dans GDIFF.
PATCH_BAD_CHECKSUM_TARGET-221La somme de contrôle du fichier source ne correspond pas à celle indiquée dans le fichier XPI.
PATCH_BAD_CHECKSUM_RESULT-222La somme de contrôle du patch n'a pu être calculée.
UNINSTALL_FAILED-223Une erreur s'est produite durant la désinstallation d'un paquetage.
PACKAGE_FOLDER_NOT_SET-224Le répertoire d'installation n'est pas défini dans le script d'installation.
EXTRACTION_FAILED-225L'extraction du fichier XPI a échoué.
FILENAME_ALREADY_USED-226Un fichier portant ce nom existe déjà dans l'installation
INSTALL_CANCELLED-227L'installation est abandonnée.
DOWNLOAD_ERROR-228Problème lors du téléchargement.
SCRIPT_ERROR-229Erreur dans le script.
ALREADY_EXISTS-230Un fichier existe déjà localement.
IS_FILE-231Un fichier a été trouvé là où un répertoire cible était attendu.
SOURCE_DOES_NOT_EXIST-232Le fichier/répertoire source n'a pas été trouvé.
SOURCE_IS_DIRECTORY-233Un répertoire a été trouvé là où un fichier source était attendu.
SOURCE_IS_FILE-234Un fichier a été trouvé là où un répertoire source était attendu.
INSUFFICIENT_DISK_SPACE-235Espace disque insuffisant pour l'installation.
FILENAME_TOO_LONG-236 
UNABLE_TO_LOCATE_LIB_FUNCTION-237 
UNABLE_TO_LOAD_LIBRARY-238 
CHROME_REGISTRY_ERROR-239 
MALFORMED_INSTALL-240 
KEY_ACCESS_DENIED-241Accès refusé à la clef de registre
KEY_DOES_NOT_EXIST-242La clef de registre n'existe pas
VALUE_DOES_NOT_EXIST-243La valeur de registre n'existe pas
INVALID_SIGNATURE-260Signature du XPI invalide
OUT_OF_MEMORY-299Mémoire insuffisante pour cette opération.
GESTALT_UNKNOWN_ERROR-5550 
GESTALT_INVALID_ARGUMENT-5551 
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Return_Codes" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/file.macalias/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/file.macalias/index.html" new file mode 100644 index 0000000000..d114a737d6 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/file.macalias/index.html" @@ -0,0 +1,33 @@ +--- +title: File.macAlias +slug: Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Exemples/File.macAlias +translation_of: Archive/Mozilla/XPInstall/Reference/Examples/File.macAlias +--- +

 

+

File.macAlias

+

Dans cet exemple, on crée un alias mac pour le logiciel (AppleCD Audio Player) installé en local.

+
xpiSrc = "Miscellaneous Program";
+var vi = "1.1.1.1";
+initInstall(
+  "Macintosh Alias",
+  "misc",
+  vi,
+  0);
+f = getFolder("Program");
+g = getFolder("Mac Desktop");
+addFile(
+  "filemacalias",
+  "2.2.2.2",
+  xpiSrc,
+  f,
+  xpiSrc,
+  true);
+err = File.macAlias(f, xpiSrc, g, xpiSrc + " alias");
+logComment("File.macAlias returns: " + err);
+if (0 == getLastError())
+   performInstall();
+else
+   cancelInstall();
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Examples/File.macAlias" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/file.windowsshortcut/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/file.windowsshortcut/index.html" new file mode 100644 index 0000000000..b3877c949f --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/file.windowsshortcut/index.html" @@ -0,0 +1,52 @@ +--- +title: File.windowsShortcut +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Exemples/File.windowsShortcut +translation_of: Archive/Mozilla/XPInstall/Reference/Examples/File.windowsShortcut +--- +

 

+

File.windowsShortcut

+

Dans cet exemple, la méthode windowsShortcut est utilisée pour ajouter un raccourci dans le répertoire + + Program + ( + + Program + est un mot clef pour désigner le répertoire d'installation du programme, par exemple, C:\Program Files\Netscape\Netscape 6\" sous Microsoft Windows) au logiciel Windows (misc.exe) installé dans le répertoire + + Windows + .

+
var xpiSrc = "misc.exe";
+var vi = "1.1.1.1";
+initInstall(
+  "Windows Shortcut",
+  "test",
+  vi,
+  0);
+f = getFolder("Windows");
+g = getFolder("Temporary");
+addFile(
+  "miscshortcut",
+  "2.2.2.2",
+  xpiSrc,
+  f,
+  xpiSrc,
+  true);
+target = getFolder(f, xpiSrc);
+shortcutpath = getFolder("Program");
+err = File.windowsShortcut(
+  target,
+  shortcutpath,
+  "misc shortcut",
+  g,
+  "",
+  target,
+  0);
+logComment("file.windowsShortcut returns: " + err);
+if (0 == getLastError())
+  performInstall();
+else
+  cancelInstall();
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Examples/File.windowsShortcut" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/index.html" new file mode 100644 index 0000000000..b379807ff9 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/index.html" @@ -0,0 +1,6 @@ +--- +title: Exemples +slug: Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Exemples +translation_of: Archive/Mozilla/XPInstall/Reference/Examples +--- +

{{wiki.localize('System.API.page-generated-for-subpage')}}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/install.adddirectory/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/install.adddirectory/index.html" new file mode 100644 index 0000000000..9c7ed53d4b --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/install.adddirectory/index.html" @@ -0,0 +1,23 @@ +--- +title: Install.addDirectory +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Exemples/Install.addDirectory +translation_of: Archive/Mozilla/XPInstall/Reference/Examples/Install.addDirectory +--- +

 

+

Install.addDirectory

+

La méthode addDirectory de l'objet Install met en file d'attente un répertoire entier pour qu'il soit installé après l'appel de la méthode performInstall.

+
var vi = "10.10.10.10";
+var xpiSrc = "adddir1";
+initInstall("addFileNoVers1", "adddir_1", vi, 1);
+f = getFolder("Program");
+setPackageFolder(f);
+err = addDirectory(xpiSrc);
+logComment("the error = " + err);
+if (0 == getLastError())
+   performInstall();
+else
+   cancelInstall();
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Examples/Install.addDirectory" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/install.addfile/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/install.addfile/index.html" new file mode 100644 index 0000000000..33f1e12e8a --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/install.addfile/index.html" @@ -0,0 +1,25 @@ +--- +title: Install.addFile +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Exemples/Install.addFile +translation_of: Archive/Mozilla/XPInstall/Reference/Examples/Install.addFile +--- +

 

+

Install.addFile

+

La méthode addFile de l'objet Install est la manière standard de mettre les fichiers en file d'attente pour l'installation.

+
var xpiSrc = "file.txt";
+initInstall(
+  "Ajout d'un fihcier",
+  "testFile",
+  "1.0.1.7",
+  1);
+f = getFolder("Program");
+setPackageFolder(f);
+addFile(xpiSrc);
+if (0 == getLastError())
+   performInstall();
+else
+   cancelInstall();
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Examples/Install.addFile" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/installtrigger.installchrome/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/installtrigger.installchrome/index.html" new file mode 100644 index 0000000000..108b77fb85 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/installtrigger.installchrome/index.html" @@ -0,0 +1,18 @@ +--- +title: InstallTrigger.installChrome +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Exemples/InstallTrigger.installChrome +translation_of: Archive/Mozilla/XPInstall/Reference/Examples/InstallTrigger.installChrome +--- +

 

+

InstallTrigger.installChrome

+

Les scripts de déclenchement sont généralement invoqués par des événements JavaScript sur des hyperliens. Lorsqu'un utilisateur clique sur le lien « Installer le thème "New Blue" » dans l'exemple ci-dessous, XPInstall télécharge, enregistre et installe le thème contenu dans le fichier <tt>newblue.xpi</tt> dans le répertoire de profil de l'utilisateur.

+
<a href="#"
+  onclick="InstallTrigger.installChrome(
+     InstallTrigger.SKIN,
+     'http://wildskins/newblue.xpi',
+     'newblue/1.0');">
+  Installer le thème "New Blue"</a>
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Examples/InstallTrigger.installChrome" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/installtrigger.startsoftwareupdate/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/installtrigger.startsoftwareupdate/index.html" new file mode 100644 index 0000000000..c70d1b55b1 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/installtrigger.startsoftwareupdate/index.html" @@ -0,0 +1,20 @@ +--- +title: InstallTrigger.startSoftwareUpdate +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Exemples/InstallTrigger.startSoftwareUpdate +translation_of: >- + Archive/Mozilla/XPInstall/Reference/Examples/InstallTrigger.startSoftwareUpdate +--- +

 

+

InstallTrigger.startSoftwareUpdate

+

Ceci est un exemple très simple de la méthode principale de l'objet InstallTrigger, startSoftwareUpdate, qui prend une chaîne représentant le chemin vers le fichier <tt>xpi</tt> et l'installe sur la machine locale.

+
function triggerURL(url)
+{
+   InstallTrigger.startSoftwareUpdtate(url);
+}
+// Récupère l'URL du fichier .xpi depuis un formulaire
+// ou une entrée de champ texte. Puis exécute :
+... onclick="triggerURL(this.form.url.value);
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Examples/InstallTrigger.startSoftwareUpdate" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/scripts_de_d\303\251clenchement_et_scripts_d'installation/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/scripts_de_d\303\251clenchement_et_scripts_d'installation/index.html" new file mode 100644 index 0000000000..c46ff4a9ad --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/scripts_de_d\303\251clenchement_et_scripts_d'installation/index.html" @@ -0,0 +1,15 @@ +--- +title: Scripts de déclenchement et scripts d'installation +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Exemples/Scripts_de_déclenchement_et_scripts_d'installation +translation_of: >- + Archive/Mozilla/XPInstall/Reference/Examples/Trigger_Scripts_and_Install_Scripts +--- +

 

+

Scripts de déclenchement et scripts d'installation

+

Les scripts de déclenchement sont de simples installations qui peuvent être initialisées depuis des gestionnaires d'événements ou tout autre code JavaScript présent dans une page Web.

+

Ils utilisent les méthodes de l'objet InstallTrigger pour comparer les versions des logiciels, installer le chrome et exécuter des installations simples de logiciels.

+

Les scripts d'installation utilisent les méthodes des objets Install, File et InstallVersion ainsi que des méthodes d'objets spécifiques à chaque plate-forme pour initialiser, mettre en file d'attente, gérer et exécuter l'installation d'un ou de plusieurs paquetages de logiciels.

+

Ces scripts d'installation sont généralement localisés au plus haut niveau de l'arborescence des archives <tt>xpi</tt> dans lesquelles les installations sont stockées. Un script de déclenchement peut déclencher le téléchargement d'un <tt>xpi</tt>, qui utisera son propre script <tt>install.js</tt> pour gérer l'installation complète.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Examples/Trigger_Scripts_and_Install_Scripts" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/windows_install/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/windows_install/index.html" new file mode 100644 index 0000000000..090866a4c1 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/exemples/windows_install/index.html" @@ -0,0 +1,112 @@ +--- +title: Windows Install +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Exemples/Windows_Install +translation_of: Archive/Mozilla/XPInstall/Reference/Examples/Windows_Install +--- +

Exemple d'installation Windows

+

Cet exemple décrit l'installation d'un fichier xpi dans lequel sont contenues les informations sur le profil de l'utilisateur.

+

La vérification de l'espace disque, l'édition du registre Windows, l'écriture du journal d'installation et la vérification des erreurs se font avant l'appel des méthodes performInstall ou cancelInstall.

+
// Cette fonction vérifie l'espace disque en kio
+function verifyDiskSpace(dirPath, spaceRequired)
+{
+  var spaceAvailable;
+  // Récupère l'espace disque pour le chemin donné
+  spaceAvailable = fileGetDiskSpaceAvailable(dirPath);
+  // Convertit l'espace disque disponible en kio
+  spaceAvailable = parseInt(spaceAvailable / 1024);
+  // Fait la vérification
+  if(spaceAvailable < spaceRequired)
+  {
+    logComment("Espace disque insuffisant : " + dirPath);
+    logComment("  requis : " + spaceRequired + " kio");
+    logComment("  disponible : " + spaceAvailable + " kio");
+    return(false);
+  }
+  return(true);
+}
+
+function updateWinReg4Ren8dot3()
+{
+  var fProgram      = getFolder("Program");
+  var fTemp         = getFolder("Temporary");
+  // Notes :
+  // On ne peut pas utiliser un double backslash avant une sous-clef
+  // car Windows les met déjà.
+  // Les sous-clefs doivent exister avant d'y mettre une valeur.
+  var subkey;  // Le nom de la sous-clef dans laquelle vous voulez intervenir
+  var valname; // Le nom de la paire nom_de_valeur/valeur à modifier
+  var value;   // La nouvelle valeur chaîne
+  var winreg = getWinRegistry() ;
+  if(winreg != null)
+  {
+    // Ici, nous récupérons la version courante.
+    winreg.setRootKey(winreg.HKEY_CURRENT_USER) ;// CURRENT_USER
+    subkey  =
+      "SOFTWARE\\Microsoft\\Windows\\CurrentVersion\\RunOnce" ;
+    winreg.createKey(subkey,"");
+    valname = "ren8dot3";
+    value = fProgram + "ren8dot3.exe " + fTemp + "ren8dot3.ini";
+    err     = winreg.setValueString(subkey, valname, value);
+  }
+}
+
+function prepareRen8dot3(listLongFilePaths)
+{
+  var fTemp        = getFolder("Temporary");
+  var fProgram     = getFolder("Program");
+  var fRen8dot3Ini = getWinProfile(fTemp, "ren8dot3.ini");
+  var bIniCreated  = false;
+  var fLongFilePath;
+  var sShortFilePath;
+  if(fRen8dot3Ini != null)
+  {
+    for(i = 0; i < listLongFilePaths.length; i++)
+    {
+      fLongFilePath = getFolder(fProgram, listLongFilePaths[i]);
+      sShortFilePath  = File.windowsGetShortName(fLongFilePath);
+      if(sShortFilePath)
+      {
+        fRen8dot3Ini.writeString("rename",
+                sShortFilePath, fLongFilePath);
+        bIniCreated = true;
+      }
+    }
+    if(bIniCreated)
+      updateWinReg4Ren8dot3() ;
+  }
+  return(0);
+}
+
+// main
+var srDest;
+var err;
+var fProgram;
+srDest = 449;
+err    = initInstall(prettyName, regName, "6.0.0.2000110801");
+logComment("initInstall: " + err);
+fProgram = getFolder("Program");
+logComment("fProgram: " + fProgram);
+if(verifyDiskSpace(fProgram, srDest))
+{
+  setPackageFolder(fProgram);
+  err = addDirectory("",
+    "6.0.0.2000110801",
+    "bin", // Dans le jar, nom du répertoire à extraire
+    fProgram, // Où mettre le fichier (valeur retournée depuis GetFolder)
+     "", // Noms des sous-répertoires à créer, relativement à fProgram
+    true); // Force Flag
+  logComment("addDirectory() returned: " + err);
+  // Vérifie la valeur retournée
+  if(err == SUCCESS)
+  {
+    err = performInstall();
+    logComment("performInstall() returned: " + err);
+  }
+  else
+    cancelInstall(err);
+}
+else
+  cancelInstall(INSUFFICIENT_DISK_SPACE);
+// Fin de main
+
diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/index.html" new file mode 100644 index 0000000000..cc23e6ee7d --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/index.html" @@ -0,0 +1,193 @@ +--- +title: Référence de l'API XPInstall +slug: Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall +tags: + - Référence_de_l'API_XPInstall + - XPInstall +translation_of: Archive/Mozilla/XPInstall/Reference +--- +

Cette page fait parti de la Référence de l'API XPInstall. Notez que si vous être un développeur d'extension, de thème, ou de plug-in, vous n'avez plus besoin d'une grande partie de cette API. Plus particulièrement, le script install.js utilisé pour l'installation et l'enregistrement du contenu des XPI est déprécié en faveur du nouveau manifeste déclaratif install.rdf et du nouveau schéma de paquetage.

+ +

Objets

+ +

Install

+ +
+
Propriétés
+
Méthodes
+
+ +
+
+
+
addDirectory
+
addFile
+
alert
+
cancelInstall
+
confirm
+
deleteRegisteredFile
+
execute
+
gestalt
+
getComponentFolder
+
getFolder
+
getLastError
+
getWinProfile
+
getWinRegistry
+
initInstall
+
loadResources
+
logComment
+
patch
+
performInstall
+
refreshPlugins
+
registerChrome
+
resetError
+
setPackageFolder
+
+
+
+ +

InstallTrigger

+ +
+
Aucune propriété
+
Méthodes
+
+ +
+
+
+
compareVersion
+
enabled
+
getVersion
+
install
+
installChrome
+
startSoftwareUpdate
+
+
+
+ +

InstallVersion

+ +
+
Propriétés
+
Méthodes
+
+ +
+
+
+
compareTo
+
init
+
toString
+
+
+
+ +

File

+ +
+
Aucune propriété
+
Méthodes
+
+ +
+
+
+
copy
+
dirCreate
+
dirGetParent
+
dirRemove
+
dirRename
+
diskSpaceAvailable
+
execute
+
exists
+
isDirectory
+
isFile
+
macAlias
+
modDate
+
modDateChanged
+
move
+
remove
+
rename
+
size
+
windowsGetShortName
+
windowsRegisterServer
+
windowsShortcut
+
+
+
+ +

WinProfile

+ +
+
Aucune propriété
+
Méthodes
+
+ +
+
+
+
getString
+
writeString
+
+
+
+ +

WinReg

+ +
+
Aucune propriété
+
Méthodes
+
+ +
+
+
+
createKey
+
deleteKey
+
deleteValue
+
enumKeys
+
enumValueNames
+
getValue
+
getValueNumber
+
getValueString
+
isKeyWritable
+
keyExists
+
setRootKey
+
setValue
+
setValueNumber
+
setValueString
+
valueExists
+
+
+
+ +
+
Constructeur WinRegValue
+
+ +

Autres informations

+ +

Codes retournés

+ +
+
Voir la liste complète
+
+ +

Exemples

+ +
+
Scripts de déclenchement et scripts d'installation
+
+ +
Extraits de code
+ +
+
File.macAlias
+
File.windowsShortcut
+
Install.addDirectory
+
Install.addFile
+
InstallTrigger.installChrome
+
InstallTrigger.startSoftwareUpdate
+
Windows Install
+
diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/index.html" new file mode 100644 index 0000000000..fdfa76bd31 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/index.html" @@ -0,0 +1,14 @@ +--- +title: Objet File +slug: Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File +tags: + - Référence_de_l'API_XPInstall +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object +--- +

 

+

File

+

L'objet File s'utilise pour manipuler des fichiers et des répertoires locaux lors d'un processus d'installation.

+

Présentation

+

L'objet File a des méthodes servant à l'analyse du système de fichiers et à sa préparation (dans le cas de création de répertoires, de raccourcis, de comparaison de versions ou de suppression de fichiers) pour les logiciels nouvellement installés. L'objet File fonctionne en conjonction avec l'objet Install.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/copy/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/copy/index.html" new file mode 100644 index 0000000000..18343a62aa --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/copy/index.html" @@ -0,0 +1,38 @@ +--- +title: copy +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/copy +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/copy +--- +

 

+

copy

+

Fait une copie mise en file d'attente du fichier spécifié.

+

Méthode de

+

Objet File

+

Syntaxe

+
int copy( FileSpecObject source, FileSpecObject dest )
+
+

Paramètres

+

La méthode copy a les paramètres suivants :

+
+
+ source
+
+ Un objet + + FileSpecObject + représentant le fichier à copier.
+
+ dest
+
+ Un objet + + FileSpecObject + représentant la destination.
+
+

Retours

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Description

+

La destination peut être un nom de répertoire ou un nom de fichier. Si la destination n'existe pas, un nouveau fichier sera créé.

+

Inerwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/copy" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/dircreate/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/dircreate/index.html" new file mode 100644 index 0000000000..84f235f369 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/dircreate/index.html" @@ -0,0 +1,36 @@ +--- +title: dirCreate +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/dirCreate +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/dirCreate +--- +

 

+

dirCreate

+

Crée un nouveau répertoire.

+

Méthode de

+

Objet File

+

Syntaxe

+
int dirCreate( FileSpecObject dirToCreate );
+
+

Paramètres

+

La méthode dirCreate a le paramètre suivant:

+
+
+ dirToCreate
+
+ Un + + FileSpecObject + représentant le chemin du répertoire à créer.
+
+

Retours

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Description

+

Le paramètre d'entrée est un FileSpecObject précédemment créé avec la méthode getFolder de l'objet Install. L'exemple suivant montre l'utilisation de la méthode dirCreate. On remarque que la méthode getFolder ne nécessite pas que le dossier ou répertoire spécifié existe pour que la référence objet soit valide.

+

Exemple

+
f = getFolder("Program", "myNewDirectory");
+err = File.dirCreate(f);
+
+


+ Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/dirCreate" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/dirgetparent/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/dirgetparent/index.html" new file mode 100644 index 0000000000..eadcae9762 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/dirgetparent/index.html" @@ -0,0 +1,34 @@ +--- +title: dirGetParent +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/dirGetParent +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/dirGetParent +--- +

 

+

dirGetParent

+

Retourne un objet représentant le répertoire parent du répertoire ou du fichier courant.

+

Méthode de

+

Objet File

+

Syntaxe

+
FileSpecObject dirGetParent( FileSpecObject fichierOuRépertoire );
+
+

Paramètres

+

La méthode dirGetParent a le paramètre suivant :

+
+
+ fichierOuRépertoire
+
+ Un + + FileSpecObject + représentant le chemin du fichier ou du répertoire dont il faut retourner le parent.
+
+

Retours

+

Un FileSpecObject si réussite ; null dans le cas contraire.

+

Exemple

+
f = getFolder("Program", "myNewDirectory");
+err = File.dirCreate(f);
+err = File.getParent(f) // retourne "Program"
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/dirGetParent" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/dirremove/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/dirremove/index.html" new file mode 100644 index 0000000000..d6030a3719 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/dirremove/index.html" @@ -0,0 +1,32 @@ +--- +title: dirRemove +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/dirRemove +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/dirRemove +--- +

 

+

dirRemove

+

Supprime un répertoire.

+

Méthode de

+

Objet File

+

Syntaxe

+
int dirRemove( FileSpecObject dirToRemove [, booléen recursive] );
+
+

Paramètres

+

La méthode dirRemove a les paramètres suivants :

+
+
+ dirToRemove
+
+ Un objet + + FileSpecObject + représentant le répertoire à supprimer.
+
+ recursive
+
+ Une valeur booléenne optionnelle indiquant si l'opération de suppression doit être exécutée récursivement (1) ou non (0).
+
+

Retour

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/dirRemove" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/dirrename/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/dirrename/index.html" new file mode 100644 index 0000000000..c86cd38cb4 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/dirrename/index.html" @@ -0,0 +1,33 @@ +--- +title: dirRename +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/dirRename +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/dirRename +--- +

 

+

dirRename

+

Renomme un répertoire.

+

Méthode de

+

Objet File

+

Syntaxe

+
int dirRename( FileSpecObject répertoire, Chaîne nouveauNom );
+
+

Paramètres

+

La méthode dirRename a les paramètres suivants :

+
+
+ répertoire
+
+ Un objet + + FileSpecObject + représentant le répertoire à renommer.
+
+ nouveauNom
+
+ Le nouveau nom terminal (ou nœud terminal) du répertoire.
+
+

Retours

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/dirRename" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/diskspaceavailable/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/diskspaceavailable/index.html" new file mode 100644 index 0000000000..62847a38d4 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/diskspaceavailable/index.html" @@ -0,0 +1,48 @@ +--- +title: diskSpaceAvailable +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/diskSpaceAvailable +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/diskSpaceAvailable +--- +

 

+

diskSpaceAvailable

+

Retourne la taille de l'espace disque disponible, en octets, sur le disque local.

+

Méthode de

+

Objet File

+

Syntaxe

+
double diskSpaceAvailable ( String NativeFolderPath );
+
+

Paramètres

+

La méthode diskSpaceAvailable a le paramètre suivant :

+
+
+ NativeFolderPath
+
+ Une chaîne représentant le chemin de la partition, un fichier ou un répertoire sur la partition, dont on veut connaître l'espace disponible.
+
+

Retour

+

Un nombre à double précision représentant la taille de l'espace disponible, en octets, du disque vérifié.

+

Description

+

Cette méthode est utilisée pour s'assurer qu'il y a assez d'espace disque pour l'extraction et l'installation des fichiers (voir l'exemple ci-dessous).

+

On peut utiliser une chaîne représentant n'importe quel fichier sur le disque à vérifier et XPInstall résoudra de lui-même la référence à la partition.

+

Exemple

+
var diskAmtNeeded = 10000;
+f = getFolder("Program");
+diskSpace = File.diskSpaceAvailable(f);
+g = getFolder(f, "myfile.txt");
+if (diskSpace > diskAmtNeeded)
+{
+  err = addFile(..., ... g, ...);
+  if (err == 0)
+     performInstall();
+  else
+    cancelInstall();
+}
+else
+{
+  alert("Espace disque insuffisant. Aucune installation);
+  cancelInstall();
+}
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/diskSpaceAvailable" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/execute/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/execute/index.html" new file mode 100644 index 0000000000..fb929d6424 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/execute/index.html" @@ -0,0 +1,41 @@ +--- +title: execute +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/execute +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/execute +--- +

 

+

execute

+

Met en attente l'exécution d'un fichier local.

+

Méthode de

+

Objet File

+

Syntaxe

+
int execute ( FileSpecObject executableFile, [Chaîne aParameters] );
+
+

Paramètres

+

La méthode execute a les paramètres suivants :

+
+
+ executableFile
+
+ Un objet + + FileSpecObject + représentant le fichier local, déjà présent sur le disque, à exécuter. Les noms de fichier sont sensibles à la casse.
+
+ aParameters
+
+ Une chaîne optionnelle passée à l'exécutable (ignoré sous Mac OS).
+
+

Retours

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Description

+

Le fichier spécifié ne sera pas exécuté jusqu'à l'appel de la méthode performInstall. Pour plus d'informations sur la mise en attente des commandes pendant le processus d'installation, voir performInstall.

+

Exemple

+
f = getFolder("Program", "myTextEditor.exe");
+err = File.execute(f, "myfile.txt");
+// indique que 'myfile.txt' sera
+// ouvert dans l'éditeur
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/execute" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/exists/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/exists/index.html" new file mode 100644 index 0000000000..35fb3b658f --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/exists/index.html" @@ -0,0 +1,33 @@ +--- +title: exists +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/exists +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/exists +--- +

 

+

exists

+

Retourne un valeur indiquant si le fichier ou le répertoire spécifié existe.

+

Méthode de

+

Objet File

+

Syntaxe

+
boolean exists( FileSpecObject cible )
+
+

Paramètres

+

La méthode exists a le paramètre suivant :

+
+
+ cible
+
+ Un + + FileSpecObject + représentant le fichier ou le répertoire dont on veut tester l'existence.
+
+

Retours

+

Une valeur booléenne indiquant si le fichier ou le répertoire existe ou pas.

+

Exemple

+
f = getFolder( "Program", "sample.txt" );
+if ( File.exists(f) ) // fait quelque chose avec le fichier
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/exists" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/index.html" new file mode 100644 index 0000000000..7476871a02 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/index.html" @@ -0,0 +1,86 @@ +--- +title: Méthodes +slug: Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes +tags: + - Référence_de_l'API_XPInstall +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods +--- +

Méthodes

+
+
+ dirCreate
+
+ Crée un nouveau répertoire.
+
+ dirGetParent
+
+ Retourne un objet représentant le répertoire parent.
+
+ dirRemove
+
+ Supprime un répertoire.
+
+ dirRename
+
+ Renomme le répertoire spécifié.
+
+ copy
+
+ Copie le fichier spécifié.
+
+ diskSpaceAvailable
+
+ Retourne l'espace disque disponible en octets.
+
+ exists
+
+ Retourne une valeur booléenne indiquant l'existence ou non du fichier spécifié.
+
+ execute
+
+ Met un fichier en file d'attente pour son exécution lors du processus d'installation.
+
+ isFile
+
+ Retourne une valeur booléenne indiquant si un objet est un fichier.
+
+ modDate
+
+ Retourne un nombre représentant la dernière date de modification du fichier spécifié.
+
+ modDateChanged
+
+ Spécifie si la dernière modification d'un fichier est antérieure à la date spécifiée.
+
+ move
+
+ Déplace un fichier d'un répertoire vers un autre.
+
+ remove
+
+ Supprime un fichier.
+
+ rename
+
+ Renomme un fichier.
+
+ size
+
+ Retourne la taille du fichier en octets.
+
+ windowsShortcut
+
+ Crée un raccourci Windows pour un fichier.
+
+ macAlias
+
+ Crée un alias Macintosh pour un fichier.
+
+ windowsGetShortName
+
+ Retourne le nom Windows du chemin.
+
+ windowsRegisterServer
+
+ Enregistre les DLL dans le registre.
+
diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/isdirectory/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/isdirectory/index.html" new file mode 100644 index 0000000000..ad2c6f5d29 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/isdirectory/index.html" @@ -0,0 +1,26 @@ +--- +title: isDirectory +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/isDirectory +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/isDirectory +--- +

 

+

isDirectory

+

Retourne une valeur booléenne indiquant si l'objet FileSpecObject spécifié est un répertoire ou non.

+

Méthode de

+

Objet File

+

Syntaxe

+
boolean isDirectory ( FileSpecObject NativeFolderPath );
+
+

Paramètres

+

La méthode isDirectory a le paramètre suivant :

+
+
+ NativeFolderPath
+
+ Un objet FileSpecObject représentant le répertoire questionné.
+
+

Retours

+

Une valeur booléenne indiquant si l'objet FileSpecObject spécifié est un répertoire ou non.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/isDirectory" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/isfile/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/isfile/index.html" new file mode 100644 index 0000000000..19aca8da63 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/isfile/index.html" @@ -0,0 +1,30 @@ +--- +title: isFile +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/isFile +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/isFile +--- +

 

+

isFile

+

Retourne une valeur booléenne indiquant si le FileSpecObject donné est un fichier ou non.

+

Méthode de

+

Objet File

+

Syntaxe

+
boolean isFile (FileSpecObject NativeFolderPath);
+
+

Paramètres

+

La méthode isFile a le paramètre suivant :

+
+
+ NativeFolderPath
+
+ Un FileSpecObject représentant l'objet fichier demandé.
+
+

Retours

+

Une valeur booléenne indiquant si FileSpecObject est un fichier ou pas.

+

Exemple

+
f = getFolder( "Program", "sample.txt" );
+if ( File.isFile(f) ) // the object represents a file
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/isFile" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/macalias/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/macalias/index.html" new file mode 100644 index 0000000000..1011ebfbe9 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/macalias/index.html" @@ -0,0 +1,46 @@ +--- +title: macAlias +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/macAlias +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/macAlias +--- +

 

+

macAlias

+

Méthode de

+

Objet File

+

Syntaxe

+
int macAlias(
+   FileSpecObject destDir,
+   Chaîne fileName,
+   FileSpecObject aliasDir,
+   Chaîne aliasName );
+
+

Paramètres

+

La méthode macAlias a les paramètres suivants :

+
+
+ destDir
+
+ Un FileSpecObject représentant le répertoire dans lequel le fichier programme sera installé.
+
+ fileName
+
+ Une chaîne représentant le nom du fichier à installer.
+
+ aliasDir
+
+ Un FileSpecObject représentant le répertoire dans lequel le fichier alias sera installé (par exemple, + + Mac Desktop + ).
+
+ aliasName
+
+ Une chaîne représentant le nom de l'alias lui-même.
+
+

Retours

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Exemple

+

Voir File.macAlias dans les exemples de scripts.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/macAlias" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/moddate/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/moddate/index.html" new file mode 100644 index 0000000000..c333050427 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/moddate/index.html" @@ -0,0 +1,31 @@ +--- +title: modDate +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/modDate +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/modDate +--- +

 

+

modDate

+

Retourne la dernière date de modification du fichier ou du répertoire spécifié.

+

Méthode de

+

Objet File

+

Syntaxe

+
double modDate ( FileSpecObject NativeFolderPath );
+
+

Paramètres

+

La méthode modDate a le paramètre suivant :

+
+
+ NativeFolderPath
+
+ Un FileSpecObject représentant le fichier demandé.
+
+

Retour

+

Un nombre à double précision représentant la date de dernière modification du fichier.

+

Exemple

+
f = getFolder("Program");
+fileSource = getFolder(f, "myfile.txt");
+err = File.modDate(fileSource);
+
+

Voir modDateChanged pour un exemple de comparaison des dates de deux fichiers.

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/modDate" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/moddatechanged/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/moddatechanged/index.html" new file mode 100644 index 0000000000..87bc66f2ba --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/moddatechanged/index.html" @@ -0,0 +1,54 @@ +--- +title: modDateChanged +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/modDateChanged +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/modDateChanged +--- +

 

+

modDateChanged

+

Retourne si le fichier a été modifié depuis une certaine date.

+

Méthode de

+

Objet File

+

Syntaxe

+
boolean modDateChanged (FileSpecObject aSourceFolder, Number anOldDate);
+
+

Paramètres

+

La méthode modDateChanged a les paramètres suivants :

+
+
+ aSourceFolder
+
+ Un objet + + FileSpecObject + représentant le fichier à interroger.
+
+ anOldDate
+
+ Un nombre à double précision représentant la date.
+
+

Retour

+

Une valeur booléenne indiquant si le fichier a été modifié ou non depuis la date spécifiée.

+

Description

+

Le plus souvent, la date passée comme second paramètre de la méthode modDateChanged est la valeur retournée par une méthode modDate appliquée à un fichier séparé, comme dans l'exemple ci-dessous, dans lequel on compare les dates de modification des deux fichiers.

+

Exemple

+
fileSource1 = getFolder("Program", "file1.txt");
+fileSource2 = getFolder("Program", "file2.txt");
+err1 = File.modDate(fileSource1);    // retourne la valeur de base
+
+err2 = File.modDateChanged(fileSource1, err1);
+logComment("File.modDateChanged doit retourner 'false' = " + err2);
+// La raison pour laquelle False est attendu, est que
+// nous comparons la valeur de date retournée pour
+// file1.txt avec le fichier réel file1.txt lui-même.
+// Ainsi, il n'y a pas de changement de la valeur de date (time stamp)
+
+err3 = File.modDateChanged(fileSource2, err1);
+logComment("File.modDateChanged doit retourner 'true' = " + err2);
+// La raison pour laquelle True est attendu, est que
+// nous comparons la valeur de date retournée pour
+// file1.txt avec un autre fichier, file2.txt, avec
+// une valeur de date différente.
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/modDateChanged" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/move/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/move/index.html" new file mode 100644 index 0000000000..901530fde2 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/move/index.html" @@ -0,0 +1,46 @@ +--- +title: move +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/move +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/move +--- +

 

+

move

+

Déplace un fichier d'un emplacement vers un autre.

+

Méthode de

+

Objet File

+

Syntaxe

+
int move( FileSpecObject source, FileSpecObject dest );
+
+

Paramètres

+

La méthode move a les paramètres suivants :

+
+
+ source
+
+ Un objet + + FileSpecObject + représentant le fichier source.
+
+ dest
+
+ Un objet + + FileSpecObject + représentant le répertoire de destination.
+
+

Retour

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Description

+

Il faut créer un objet + + FileSpecObject + pour le répertoire de destination à passer à cette fonction. Si la destination n'existe pas, on suppose qu'elle correspond à un nom de fichier.

+

Exemple

+
source = getFolder("Program", "file.txt");
+dest = getFolder("Chrome");
+err = File.move(source, dest);
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/move" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/remove/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/remove/index.html" new file mode 100644 index 0000000000..0838d0a68d --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/remove/index.html" @@ -0,0 +1,29 @@ +--- +title: remove +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/remove +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/remove +--- +

 

+

remove

+

Efface un fichier spécifié.

+

Méthode de

+

Objet File

+

Syntaxe

+
int remove( FileSpecObject file )
+
+

Paramètres

+

La méthode remove a le paramètre suivant :

+
+
+ file
+
+ Un objet + + FileSpecObject + représentant le fichier à effacer.
+
+

Retours

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/remove" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/rename/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/rename/index.html" new file mode 100644 index 0000000000..f4c9147a62 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/rename/index.html" @@ -0,0 +1,33 @@ +--- +title: rename +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/rename +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/rename +--- +

 

+

rename

+

Renomme le fichier spécifié.

+

Méthode de

+

Objet File

+

Syntaxe

+
int rename( FileSpecObject fichier, Chaîne nouveauNom )
+
+

Paramètres

+

La méthode rename a les paramètres suivants :

+
+
+ fichier
+
+ Un objet + + FileSpecObject + représentant le fichier à renommer.
+
+ nouveauNom
+
+ Le nouveau nom terminal (ou nœud terminal) du fichier.
+
+

Retours

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/rename" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/size/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/size/index.html" new file mode 100644 index 0000000000..752f615dc5 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/size/index.html" @@ -0,0 +1,26 @@ +--- +title: size +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/size +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/size +--- +

 

+

size

+

Retourne la taille en octets du fichier spécifié.

+

Méthode de

+

Objet File

+

Syntaxe

+
int size (Chaîne NativeFolderPath);
+
+

Paramètres

+

La méthode size a le paramètre suivant :

+
+
+ NativeFolderPath
+
+ Le chemin complet vers le fichier.
+
+

Retours

+

Un nombre représentant la taille, en octets, du fichier spécifié.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/size" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/windowsgetshortname/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/windowsgetshortname/index.html" new file mode 100644 index 0000000000..c81608787b --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/windowsgetshortname/index.html" @@ -0,0 +1,34 @@ +--- +title: windowsGetShortName +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/windowsGetShortName +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/windowsGetShortName +--- +

 

+

windowsGetShortName

+

Retourne un chemin conforme à la convention de nommage des fichiers de Windows, version 8.3.

+

Méthode de

+

Objet File

+

Syntaxe

+
string windowsGetShortName( Object localDirSpec )
+
+

Paramètres

+

La méthode windowsRegisterServer a le paramètre suivant :

+
+
+ localDirSpec
+
+ Un FileSpecObject représentant un répertoire obtenu par les méthodes getComponentFolder ou getFolder.
+
+

Retours

+

Une chaîne avec le nom raccourci windows. Si le chemin est déjà conforme à la convention de nommage 8.3, la valeur retournée est NULL.

+

Exemple

+
fLongFilePath  = getFolder(fProgram, "LongFileName.File");
+sShortFilePath = File.windowsGetShortName(fLongFilePath);
+if(sShortFilePath)
+{
+    // fait quelque chose
+}
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/windowsGetShortName" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/windowsregisterserver/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/windowsregisterserver/index.html" new file mode 100644 index 0000000000..1dc5de1345 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/windowsregisterserver/index.html" @@ -0,0 +1,30 @@ +--- +title: windowsRegisterServer +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/windowsRegisterServer +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/windowsRegisterServer +--- +

 

+

windowsRegisterServer

+

windowsRegisterServer enregistre, dans la base de registre Windows, les <tt>dll</tt> installées.

+

Méthode de

+

Objet File

+

Syntaxe

+
int windowsRegisterServer( Objet localDirSpec )
+
+

Paramètres

+

La méthode windowsRegisterServer a le paramètre suivant :

+
+
+ localDirSpec
+
+ Un FileSpecObject représentant un répertoire obtenu par les méthodes getComponentFolder ou getFolder.
+
+

Retours

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Exemple

+
fileCdTool = getFolder("file:///", fAoD + "cdTool.dll");
+err = File.windowsRegisterServer(fileCdTool);
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/windowsRegisterServer" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/windowsshortcut/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/windowsshortcut/index.html" new file mode 100644 index 0000000000..1d96217e38 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_file/m\303\251thodes/windowsshortcut/index.html" @@ -0,0 +1,71 @@ +--- +title: windowsShortcut +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_File/Méthodes/windowsShortcut +translation_of: Archive/Mozilla/XPInstall/Reference/File_Object/Methods/windowsShortcut +--- +

 

+

windowsShortcut

+

Crée un raccourci Windows vers le logiciel installé.

+

Méthode de

+

Objet File

+

Syntaxe

+
int WindowsShortcut(
+  FolderObject aTarget,
+  FolderObject aShortcutPath,
+  String aDescription,
+  FolderObject aWorkingPath,
+  String aParams,
+  FolderObject aIcon,
+  Number aIconId);
+
+

Paramètres

+

La méthode windowsShortcut a les paramètres suivants :

+
+
+ aTarget
+
+ Un objet + + FileSpecObject + représentant le chemin absolu (nom de fichier inclus) vers le fichier pour lequel on veut créer un raccourci.
+
+ aShortcutPath
+
+ Un objet + + FileSpecObject + représentant le chemin absolu (nom de fichier exclu) vers l'emplacement où le raccourci sera créé.
+
+ aDescription
+
+ Chaîne de description du raccourci à utiliser comme nom de raccourci, avec l'extension <tt>.lnk</tt> (ne pas mettre l'extension dans la chaîne).
+
+ aWorkingPath
+
+ Un objet + + FileSpecObject + représentant le chemin absolu vers le répertoire de travail depuis lequel aTarget sera exécuté.
+
+ aParams
+
+ Paramètres requis par aTarget.
+
+ aIcon
+
+ Un objet + + FileSpecObject + représentant le chemin absolu (nom de fichier inclus) vers un fichier contenant l'icône. Le format de fichier peut être <tt>.ico</tt>, <tt>.dll</tt>, <tt>.exe</tt> ou tout autre fichier binaire contenant des icônes.
+
+ aIconId
+
+ Index de l'icône depuis aIcon à utiliser pour ce raccourci.
+
+

Retour

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Exemple

+

Voir File.windowsShortcut dans les exemples de scripts.

+

Interwiki Langages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/File_Object/Methods/windowsShortcut" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/index.html" new file mode 100644 index 0000000000..c2ef84f7a1 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/index.html" @@ -0,0 +1,45 @@ +--- +title: Objet Install +slug: Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install +tags: + - Référence_de_l'API_XPInstall +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object +--- +

 

+ +

Install

+ +

Utilisez l'objet Install pour gérer le téléchargement et l'installation d'un logiciel à partir du gestionnaire d'installations XPI.

+ +

Présentation

+ +

L'objet Install est principalement utilisé dans les scripts d'installation. Dans tous les cas, l'objet Install est implicite, comme l'objet window dans les scripts de pages Web, et n'a pas besoin d'être mis en préfixe des méthodes de l'objet. Les deux lignes suivantes, par exemple, sont équivalentes :

+ +
f = getFolder("Program");
+f = Install.getFolder("Program");
+
+ +

Un script d'installation est composé d'appels à l'objet Install et possède généralement la structure suivante :

+ +
+
Initialisation de l'installation
+
Appelle initInstall avec le nom de l'installation et les informations nécessaires d'enregistrement et de version.
+
Ajout des fichiers pour l'installation
+
Ajoute les fichiers à installer en appelant getFolder pour obtenir les objets fichier et passe ces références objet à addFile autant de fois que nécessaire.
+
Exécution de l'installation
+
Vérifie que les fichiers ont été ajoutés avec succès (c'est-à-dire, en vérifiant les codes d'erreur retournés depuis les principales méthodes de l'installation), et poursuit l'installation si tout est correct :
+
+ +
performOrCancel();
+function performOrCancel()
+{
+  if (0 == getLastError())
+     performInstall();
+   else
+     cancelInstall();
+}
+
+ +

Pour des exemples de scripts complets, voir des exemples de scripts.

+ +

Interwiki Languages Links

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/adddirectory/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/adddirectory/index.html" new file mode 100644 index 0000000000..00aebd4753 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/adddirectory/index.html" @@ -0,0 +1,84 @@ +--- +title: addDirectory +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/addDirectory +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/addDirectory +--- +

 

+

addDirectory

+

Extrait un répertoire entier dans un emplacement temporaire.

+

Méthode de

+

Objet Install

+

Syntaxe

+
public int addDirectory (
+   Chaîne xpiSourcePath);
+
+public int addDirectory (
+   Chaîne registryName,
+   Chaîne xpiSourcePath,
+   Objet localDirSpec,
+   Chaîne relativeLocalPath);
+
+public int addDirectory (
+   Chaîne registryName,
+   Chaîne version,
+   Chaîne xpiSourcePath,
+   Objet localDirSpec,
+   Chaîne relativeLocalPath);
+
+public int addDirectory (
+   Chaîne registryName,
+   Chaîne version,
+   Chaîne xpiSourcePath,
+   Objet localDirSpec,
+   Chaîne relativeLocalPath,
+   Booléen forceUpdate);
+
+public int addDirectory (
+   Chaîne registryName,
+   InstallVersion version,
+   Chaîne xpiSourcePath,
+   Objet localDirSpec,
+   Chaîne relativeLocalPath,
+   Booléen forceUpdate);
+
+

Paramètres

+

La méthode addDirectory a les paramètres suivants :

+
+
+ registryName
+
+ Le chemin, dans la + + Client Version Registry + , du répertoire racine dans lequel les fichiers seront installés. Ce paramètre peut être un chemin absolu (commençant par un /), tel que /royalairways/RoyalSW/executable ou un chemin relatif (ne commençant pas par un /), tel que executable. Un chemin absolu est utilisé comme spécifié. Un chemin relatif est ajouté au nom d'enregistrement du paquetage comme spécifié par la paramètre package de la méthode initInstall. Ce paramètre peut également être vide, dans ce cas le paramètre xpiSourcePath est utilisé comme un chemin relatif. Remarquez que le chemin de registre n'est pas l'emplacement du logiciel sur l'ordinateur, il s'agit de l'emplacement des informations concernant le logiciel dans la + + Client Version Registry + .
+
+ version
+
+ Un objet InstallVersion ou une Chaîne de 1 à 4 valeurs entières délimitées par des points, telle que 1.17.1999.1517. Pour les variantes de cette méthode, sans argument de version, la valeur de initInstall sera utilisée.
+
+ xpiSourcePath
+
+ Une chaîne spécifiant l'emplacement du répertoire dans l'archive <tt>xpi</tt>. Une chaîne vide ("") entraîne la création d'un sous-répertoire dans le registre sans extraire aucun fichier, ce qui peut être utile lors de la mise à jour d'un paquetage contenant des sous-composants, qui peuvent être mis à jour séparément. Lorsque xpiSourcePath est une chaîne vide, registryName ne peut pas être nul.
+
+ localDirSpec
+
+ Un objet représentant un répertoire. Le fichier est installé dans ce répertoire sur la machine de l'utilisateur. Vous pouvez créer cet objet en passant une chaîne représentant le répertoire à la méthode getFolder.
+
+ subdir
+
+ Le nom d'un répertoire à ajouter à localDirSpec, en utilisant '/' comme séparateur de chemin sans considération des conventions d'écriture de la plate-forme. Si subdir est absent, null ou "", les noms de fichiers sont ajoutés directement au nom du répertoire spécifié par localDirSpec.
+
+ flags
+
+ Un champ optionnel, réservé pour un usage futur. Passe 0 comme valeur par défaut.
+
+

Retour

+

Un code d'erreur entier. Pour la liste complète des valeurs possibles, voir Codes retournés. Dans certains cas, addDirectory peut retourner d'autres erreurs.

+

Description

+

La méthode addDirectory met les fichiers du répertoire spécifié dans un emplacement temporaire. Pour déplacer les fichiers et tous les autres sous-composants vers leurs emplacements finaux, appelez la méthode performInstall après avoir ajouté avec succès tous les sous-composants. Voir également les notes à propos des binaires Macintosh dans addFile.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/addDirectory" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/addfile/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/addfile/index.html" new file mode 100644 index 0000000000..daf8850363 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/addfile/index.html" @@ -0,0 +1,103 @@ +--- +title: addFile +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/addFile +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/addFile +--- +

 

+

addFile

+

Extrait un sous-composant unique dans un répertoire temporaire. Met en file d'attente le sous-composant pour son ajout dans la + + Client Version Registry + et son installation dans le répertoire final.

+

Méthode de

+

Objet Install

+

Syntaxe

+
public int addFile (
+   Chaîne registryName,
+   InstallVersion version,
+   Chaîne xpiSourcePath,
+   Objet localDirSpec,
+   Chaîne relativeLocalPath,
+   Booléen forceUpdate);
+
+public int addFile (
+   Chaîne registryName,
+   Chaîne version,
+   Chaîne xpiSourcePath,
+   Objet localDirSpec,
+   Chaîne relativeLocalPath,
+   Booléen forceUpdate);
+
+public int addFile (
+   Chaîne xpiSourcePath);
+
+public int addFile (
+   Chaîne registryName,
+   Chaîne xpiSourcePath,
+   Objet localDirSpec,
+   Chaîne relativeLocalPath);
+
+public int addFile (
+   Chaîne registryName,
+   Chaîne version,
+   Chaîne xpiSourcePath,
+   Objet localDirSpec,
+   Chaîne relativeLocalPath);
+
+

Paramètres

+

La méthode addFile a les paramètres suivants :

+
+
+ registryName
+
+ Le chemin dans la + + Client Version Registry + concernant le fichier. Ce paramètre peut être un chemin absolu (commençant par /), tel que /royalairways/RoyalSW/executable ou un chemin relatif (ne commençant pas par /), tel que executable. Généralement, les chemins absolus ne sont utilisés que pour composants partagés, ou les composants provenant d'autres éditeurs, tel que /Microsoft/shared/msvcrt40.dll. Généralement, les chemins relatifs le sont par rapport au chemin principal spécifié dans la méthode initInstall. Ce paramètre peut également être vide, dans ce cas le paramètre xpiSourcePath est utilisé comme un chemin relatif. Remarquez que le chemin de registre n'est pas l'emplacement du logiciel sur l'ordinateur, il s'agit de l'emplacement des informations concernant le logiciel dans la + + Client Version Registry + .
+
+ version
+
+ Un objet InstallVersion ou une Chaîne de 1 à 4 valeurs entières délimitées par des points, telle que 1.17.1999.1517. Pour les variantes de cette méthode sans argument de version, la valeur de initInstall sera utilisée.
+
+ xpiSourcePath
+
+ Une chaîne spécifiant l'emplacement du fichier dans l'archive <tt>xpi</tt>.
+
+ localDirSpec
+
+ Un objet représentant un répertoire. Le fichier est installé dans ce répertoire sur la machine de l'utilisateur. Vous pouvez créer cet objet en passant une chaîne représentant le répertoire à la méthode getFolder.
+
+ relativeLocalPath
+
+ Un chemin relatif au paramètre localDirSpec. Le fichier est installé dans ce répertoire sur la machine de l'utilisateur. Vous devez toujours utiliser des barres obliques (/) dans ce chemin, sans considération pour les conventions d'écritures du système d'exploitation. Si ce paramètre n'est pas renseigné ou NULL, xpiSourcePath est utilisé.
+
+ flags
+
+ Un champ optionnel, réservé pour un usage futur. Passe 0 comme valeur par défaut.
+
+

Retour

+

Un code d'erreur entier. Pour la liste des valeurs possibles, voir Codes retournés.

+

Description

+

La méthode addFile met le fichier dans un répertoire temporaire. Pour le déplacer, ainsi que tous les autres fichiers, vers son emplacement final, appelez la méthode performInstall après avoir ajouté avec succès tous les fichiers.

+
+ Note : Si vous installez des fichiers binaires sur un Macintosh, soyez attentif à ce que le format binaire de ces fichiers doit être AppleSingle pour que les informations de ressources soient installées proprement. Certains logiciels de transfert de fichiers convertissent les binaires Apple dans ce format si vous les transférez d'un Macintosh vers une machine Unix/Windows avant de compresser ces fichiers sur la machine de destination.
+

Exemple

+
var xpiSrc = "file.txt";
+initInstall("Ajout d'un fichier",
+   "addFile",
+   "1.0.1.7",
+   1);
+f = getFolder("Program");
+setPackageFolder(f);
+addFile(xpiSrc);
+if (0 == getLastError())
+   performInstall();
+else
+   cancelInstall();</pre>
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/addFile" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/alert/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/alert/index.html" new file mode 100644 index 0000000000..dbc61fd1c0 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/alert/index.html" @@ -0,0 +1,20 @@ +--- +title: alert +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/alert +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/alert +--- +

 

+

alert

+

La fonction alert affiche une boîte de dialogue modale avec un message représentant l'entrée.

+

Méthode de

+

Objet Install

+

Syntaxe

+
void alert ( chaîne de message );
+
+

Paramètres

+

Bien qu'il soit plus courant d'entrer une chaîne pour afficher une boîte d'alerte, l'unique paramètre d'entrée de alert() peut être une valeur de n'importe quel type de données. Vous pouvez, par exemple, entrer une référence à un objet et voir cet objet affiché comme une chaîne dans la boîte d'alerte.

+

Retours

+

Rien.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/alert" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/cancelinstall/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/cancelinstall/index.html" new file mode 100644 index 0000000000..26b6e38789 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/cancelinstall/index.html" @@ -0,0 +1,32 @@ +--- +title: cancelInstall +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/cancelInstall +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/cancelInstall +--- +

 

+

cancelInstall

+

Annule l'installation d'un logiciel, exécute un nettoyage des fichiers temporaires.

+

Méthode de

+

Objet Install

+

Syntaxe

+
void cancelInstall()
+void cancelInstall( int errorCode )
+
+

Paramètres

+

Aucun.

+

Retour

+

Un nombre entier correspondant à un code d'erreur. L'argument optionnel est un code d'erreur qui peut être retourné à la page de déclenchement. Pour la plupart des cas, il est recommandé d'utiliser l'un des codes standards. Mais un script peut, en fait, retourner tout entier valide. Pour une liste des valeurs possibles, et les errorCode personnalisés créés par l'auteur du script d'installation, voir Codes retournés.

+

Exemple

+

Utilisez le code suivant pour annuler ou pour finaliser une installation, basé sur une variable que vous aurez définie précédemment dans votre code :

+
initInstall("Royal Airways TripPlanner","/RoyalAirways/
+TripPlanner","1.0.0.0");
+...
+err = getLastError();
+if (!err)
+   performInstall();
+else
+   cancelInstall(err);
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/cancelInstall" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/confirm/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/confirm/index.html" new file mode 100644 index 0000000000..5f34e55971 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/confirm/index.html" @@ -0,0 +1,212 @@ +--- +title: confirm +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/confirm +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/confirm +--- +

 

+

confirm

+

Affiche une boîte de dialogue modale de confirmation.

+

Méthode de

+

Objet Install

+

Syntaxe

+
int confirm( Chaîne aText );
+
+
int confirm( Chaîne aText,
+             Chaîne aDialogTitle,
+             Nombre aButtonFlags,
+             Chaîne aButton0Title,
+             Chaîne aButton1Title,
+             Chaîne aButton2Title,
+             Chaîne aCheckMsg,
+             Objet aCheckState );
+
+

Paramètres

+

Pour la seconde syntaxe, la méthode étendue confirm() est supportée depuis Gecko 1.8. Elle accepte jusqu'à 8 paramètres. Dans les versions précédentes de Gecko seule la première syntaxe était supportée, méthode à un paramètre, qui retournera une erreur pour la forme étendue. Voir les notes à la fin de ce document pour une manière sûre d'implémenter une procédure de secours.

+
+
+ aText
+
+ La chaîne à afficher dans la boîte de confirmation. Cette chaîne est généralement sous la forme d'un message pour l'utilisateur (par exemple : « Êtes-vous sûr de vouloir effacer le(s) fichier(s) sélectionné(s) ? »).
+
+
+
+ aDialogTitle
+
+ La chaîne à utiliser comme titre de la boîte de dialogue. La valeur par défaut est + + Confirm + (ou son équivalent localisé).
+
+
+
+ aButtonFlags
+
+ Un ensemble de + + flags + définissant les boutons devant s'afficher dans la boîte de dialogue. La valeur est calculée en multipliant la position correspondante du bouton avec une constante de titre de bouton pour chaque bouton, puis en ajoutant les résultats et toutes autres options (voir Autre constantes).
+
+
+
+ Constantes de position des boutons +
    +
  • BUTTON_POS_0: Le premier bouton logique
    • +
  • BUTTON_POS_1: Le deuxième bouton logique
    • +
  • BUTTON_POS_2: Le troisième bouton logique
    • +
+
+
+
+
+ Constantes des titres des boutons +
    +
  • BUTTON_TITLE_OK: Un bouton + + OK +
    • +
  • BUTTON_TITLE_CANCEL: Un bouton + + Annuler +
    • +
  • BUTTON_TITLE_YES: Un bouton + + Oui +
    • +
  • BUTTON_TITLE_NO: Un bouton + + Non +
    • +
  • BUTTON_TITLE_SAVE: Un bouton + + Enregistrer +
    • +
  • BUTTON_TITLE_DONT_SAVE: Un bouton + + Ne pas enregistrer +
    • +
  • BUTTON_TITLE_REVERT: Un bouton + + Précédent +
    • +
  • BUTTON_TITLE_IS_STRING: Titre personnalisé spécifié par le paramètre correspondant aButtonXTitle
    • +
+
+
+
+
+ Autres constantes +
    +
  • BUTTON_POS_0_DEFAULT: Définit le bouton 0 comme bouton par défaut. Sauf indication contraire, c'est la valeur par défaut.
    • +
  • BUTTON_POS_1_DEFAULT: Définit le bouton 1 comme bouton par défaut.
    • +
  • BUTTON_POS_2_DEFAULT: Définit le bouton 2 comme bouton par défaut.
    • +
  • BUTTON_DELAY_ENABLE: Spécifie que les boutons ne doivent être actifs que passé un certain délai. Ceci ne s'applique qu'aux bouton 0 et 2, mais pas au bouton 1 (le bouton + + Annuler + ).
    • +
  • STD_OK_CANCEL_BUTTONS: Utilisez cela plutôt que les constantes ci-dessus pour avoir les boutons standard + + OK + et + + Annuler + . Si vous n'utilisez pas aButtonFlags, c'est l'argument par défaut.
    • +
  • STD_YES_NO_BUTTONS: Utilisez cela plutôt que les constantes ci-dessus pour avoir les boutons standard + + Oui + et + + Non + .
    • +
+
+
+
+
+ Avertissement : Ne faites aucune hypothèse quant au placement des boutons, l'implémentation de base peut librement décider de la place de chacun des trois boutons. Les exemples suivants montrent le résultat de l'appel de la fonction confirm() avec trois boutons 0='A', 1='B' et 2='C'. +
+
+ Firefox sous Linux
+
+ Suite Mozilla sous Win32
+
+
+
+ Il est donc recommandé de n'utiliser que deux boutons dans la mesure du possible, et de garder à l'esprit que le bouton 1 à la même valeur de retour que « fenêtre fermée » (voir ci-dessous).
+
+
+
+ aButton0Title
+
+ Titre personnalisé pour le bouton 0.
+
+
+
+ aButton1Title
+
+ Titre personnalisé pour le bouton 1.
+
+
+
+ aButton2Title
+
+ Titre personnalisé pour le bouton 2.
+
+
+
+ aCheckMsg
+
+ Une chaîne à afficher comme étiquette d'une case à cocher.
+
+
+
+ aCheckState
+
+ Un objet avec une propriété + + valeur + booléenne représentant l'état de la case à cocher : lorsque la boîte de dialogue s'affiche, sa case à cocher sera cochée lorsque la valeur de cet objet est true. Après la sélection d'un bouton (ou la fermeture de la fenêtre) par l'utilisateur, la propriété est mise à jour selon l'état de la case à cocher.
+
+
var check = { value: false };
+var button = confirm("Êtes-vous sûr de vouloir installer FooBar 0.1?",
+                     "Confirmation",
+                     STD_YES_NO_BUTTONS,
+                     null,
+                     null,
+                     null,
+                     "Install FluxCompensator 0.4 as well",
+                     check);
+
+

Retour

+

La valeur retournée est un entier indiquant quel bouton l'utilisateur a sélectionné :

+ + + + + + + + + + + + + + + + + + + +
ValeurBouton
0'Annuler' ou bouton 1. Également: l'utilisateur a fermé la fenêtre de dialogue
1'OK' ou bouton 0
2Le troisème bouton
+

Les versions précédentes de l'API XPInstall mentionnaient que la valeur de retour de confirm() était un booléen. C'est incorrect, confirm() retourne toujours un nombre entier (0 ou 1 dans les versions antérieures à pre-Gecko-1.8).

+

Notes

+

La meilleure méthode pour détecter le support des boîtes de dialogue personnalisées est de déterminer l'existence des constantes de bouton. Les autres approches (par exemple, comparaison des buildID) ne sont pas recommandées.

+
if ("BUTTON_POS_0" in Install) {
+  // Utilisation de la méthode étendue de confirm()
+} else {
+  // Utilisation de la méthode classique de confirm()
+}
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/confirm" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/deleteregisteredfile/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/deleteregisteredfile/index.html" new file mode 100644 index 0000000000..91ca177e45 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/deleteregisteredfile/index.html" @@ -0,0 +1,40 @@ +--- +title: deleteRegisteredFile +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/deleteRegisteredFile +translation_of: >- + Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/deleteRegisteredFile +--- +

 

+

deleteRegisteredFile

+

(Netscape 6 et Mozilla ne supportent pas cette méthode)

+

Efface le fichier spécifié et supprime son entrée dans la + + Client Version Registry + .

+

Méthode de

+

Objet Install

+

Syntaxe

+
int deleteRegisteredFile
+   (Chaîne registryName);
+
+

Paramètres

+

La méthode deleteRegisteredFile a la paramètre suivant :

+
+
+ registryName
+
+ Le chemin dans la + + Client Version Registry + du fichier à effacer.
+
+

Retour

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Description

+

La méthode deleteRegisteredFile efface le fichier spécifié et supprime son entrée dans la + + Client Version Registry + . Si le fichier est en cours d'utilisation, le nom du fichier qui doit être effacé est enregistré et Netscape 6 essaiera de l'effacer à chaque lancement jusqu'à ce qu'il arrive à l'effacer. Cette méthode est utilisée pour effacer des fichiers qui ne peuvent pas être supprimés par la méthode uninstall, pour supprimer des fichiers qui ne sont plus utilisés ou dont le nom a changé.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/deleteRegisteredFile" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/execute/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/execute/index.html" new file mode 100644 index 0000000000..c1053c5399 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/execute/index.html" @@ -0,0 +1,71 @@ +--- +title: execute +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/execute +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/execute +--- +

 

+

execute

+

Lance un fichier dans l'archive d'installation.

+

Méthode de

+

Objet Install

+

Syntaxe

+
int execute (
+   Chaîne xpiSourcePath [, Booléen blocking]);
+
+
int execute (
+   Chaîne xpiSourcePath,
+   Chaîne args [, Booléen blocking]);
+
+

Paramètres

+

La méthode execute a les paramètres suivants :

+
+
+ xpiSourcePath
+
+ Le chemin du fichier à extraire et à exécuter. Notez que ce chemin pointe dans l'archive <tt>xpi</tt> elle-même.
+
+ args
+
+ Un paramètre chaîne passé à l'exécutable. Ignoré sous Mac OS. Voir les notes ci-dessous.
+
+ blocking
+
+ Une valeur booléenne qui spécifie si l'installation doit ou non attendre la fin de l'exécution du fichier avant de continuer. La valeur par défaut est false. Voir les notes ci-dessous. Le paramètre blocking n'est pas disponible comme partie de cette méthode dans les versions antérieures de Netscape 6.1/Mozilla 0.9.3.
+
+

Retour

+

Un code d'erreur entier. Pour la liste des valeurs possibles, voir Codes retournés.

+

Description

+

La méthode execute extrait le fichier spécifié depuis l'archive <tt>xpi</tt> vers un fichier temporaire.

+

Le code doit appeler la méthode performInstall pour réellement exécuter le fichier. Cette méthode peut être utilisée pour lancer un installeur + + InstallShield + ou tout autre exécutable d'installation stocké dans l'archive <tt>xpi</tt>.

+
Exécution des fichiers installés
+
+ Note : Si le fichier qu'on veut exécuter est l'un de ceux à installer (contrairement à un installeur exécutable qui sera effacé après utilisation), alors, il faut utiliser la méthode execute de l'objet File. File.execute() exécute un fichier installé (tel que le navigateur) après son installation et est généralement placé à la fin du script d'installation et en dehors du bloc principal.
+

La méthode execute de l'objet Install, d'un autre côté, efface l'exécutable de son emplacement temporaire une fois son exécution achevée. L'argument optionnel blocking, lorsqu'il est défini à true, spécifie que l'installation doit attendre que l'exécutable finisse avant de procéder à la prochaine commande d'installation mise en file d'attente. Si ce paramètre n'est pas défini et qu'un exécutable ne faisant pas partie de l'installation est lancé, une erreur survient lors du redémarrage du navigateur.

+
Passage d'arguments à l'exécutable
+

Le paramètre args, lorsqu'il est présent, passe une chaîne à l'exécutable comme paramètres de ligne de commande. La ligne suivante, par exemple, passe le paramètre de ligne de commande -c à l'exécutable :

+
err = file.execute(myfile, "-c", true);
+
+

Lorsqu'on désire passer plus d'un paramètre à l'exécutable, il est nécessaire de formater la chaîne args de façon particulière afin que les paramètres puissent être cassés et passés séparément comme requis. En général, il est possible d'utiliser les guillemets uniques pour la chaîne args et les doubles guillemets pour délimiter les arguments de ligne de commande dans la chaîne. Les règles d'analyse suivantes s'appliquent :

+ +

Cela signifie qu'afin de passer trois arguments en ligne de commande (-c, -d et -s) à l'exécutable, il est nécessaire de formater la chaîne args comme suit :

+
err = file.execute(myfile, '"-c""-d""-s"', true);
+
+

Techniquement, en considérant les règles ci-dessus, il est possible de passer les mêmes arguments avec la ligne suivante, mais le résultat sera moins lisible :

+
err = file.execute(myfile, "\"-c\"\"-d\"\"-s\"", true);
+
+

Voir également la note sur les binaires Macintosh dans addFile.

+

Interwiki Language Links

+
+  
+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/execute" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/gestalt/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/gestalt/index.html" new file mode 100644 index 0000000000..f3b597571d --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/gestalt/index.html" @@ -0,0 +1,29 @@ +--- +title: gestalt +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/gestalt +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/gestalt +--- +

 

+

gestalt

+

(Macintosh Uniquement)
+ Récupère les informations sur le système d'exploitation.

+

Méthode de

+

Objet Install

+

Syntaxe

+
int gestalt ( Chaîne selecteur );
+
+

Paramètres

+

La méthode gestalt a le paramètre suivant :

+
+
+ selecteur
+
+ Le code sélecteur de l'information que vous voulez.
+
+

Retour

+

Retourne l'information demandée. Le format dépend du code sélecteur spécifié dans le paramètre selecteur.

+

Description

+

La méthode gestalt est une classe enveloppante pour la fonction gestalt de la boîte à outils Macintosh. Pour plus d'informations, voir Inside Macintosh: Operating System Utilities (en) (obsolète). Cette méthode retourne null sur les plate-formes Unix et Microsoft Windows.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/deleteRegisteredFile" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getcomponentfolder/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getcomponentfolder/index.html" new file mode 100644 index 0000000000..b97f211388 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getcomponentfolder/index.html" @@ -0,0 +1,40 @@ +--- +title: getComponentFolder +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/getComponentFolder +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/getComponentFolder +--- +

 

+

getComponentFolder

+

Retourne un objet représentant le répertoire dans lequel le composant est installé.

+

Méthode de

+

Objet Install

+

Syntaxe

+
Object getComponentFolder
+   (Chaîne registryName);
+
+Object getComponentFolder (
+   Chaîne registryName,
+   Chaîne subDirectory);
+
+

Paramètres

+

La méthode getComponentFolder a les paramètres suivants :

+
+
+ registryName
+
+ Dans la + + Client Version Registry + , le chemin du composant dont on veut obtenir le répertoire d'installation.
+
+ subDirectory
+
+ Une chaîne qui spécifie le nom d'un sous-répertoire. Si le sous-répertoire spécifié n'existe pas, il est créé. Ce paramètre est disponible dans Netscape 6 et peut être sensible à la casse (selon le système d'exploitation).
+
+

Retour

+

Un objet représentant le répertoire dans lequel le composant est installé ou NULL si le composant ne peut pas être trouvé ou si subDirectory se réfère à un fichier qui existe déjà.

+

Description

+

La méthode getComponentFolder récupère l'emplacement d'un paquetage logiciel précédemment installé. Généralement, cette méthode est utilisée avec les méthodes addFile ou addDirectory.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/getComponentFolder" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getfolder/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getfolder/index.html" new file mode 100644 index 0000000000..fa87bbb90e --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getfolder/index.html" @@ -0,0 +1,127 @@ +--- +title: getFolder +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/getFolder +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/getFolder +--- +

 

+

getFolder

+

Retourne un objet représentant l'un des répertoires standard.

+

Méthode de

+

Objet Install

+

Syntaxe

+
FileSpecObject getFolder (
+   Chaîne FolderName);
+
+
FileSpecObject getFolder (
+   Chaîne folderName,
+   Chaîne subDirectory);
+
+
FileSpecObject getFolder (
+   Objet localDirSpec,
+   Chaîne subDirectory);
+
+

Paramètres

+

La méthode getFolder a les paramètres suivants :

+
+
+ folderName
+
+ Une chaîne représentant l'un des répertoires standard de Netscape. Il y a deux ensembles de valeurs possibles pour ce paramètre. Le premier ensemble contient tous les emplacements indépendants de la plate-forme. Le second ensemble contient les emplacements spécifiques à une plate-forme donnée. Vous êtes encouragés à utiliser des emplacements indépendants à la plate-forme. Voir la liste des emplacements des deux ensembles dans la section Description.
+
+ subDirectory
+
+ Une chaîne qui définit le nom d'un sous-répertoire. Si ce dernier n'existe pas, il est créé. Ce paramètre est disponible dans Netscape 6 et ultérieur et peut être sensible à la casse (en fonction du système d'exploitation).
+
+ localDirSpec
+
+ Un objet FileSpecObject représentant un répertoire obtenu par les méthodes getComponentFolder ou getFolder.
+
+

Retour

+

Un code d'erreur entier. Pour la liste des valeurs possibles, voir Codes retournés.

+

Description

+

La méthode getFolder obtient un objet représentant l'un des répertoires standard de Netscape, qui sera utilisé avec les méthodes addFile et getWinProfile. La valeur de folderName doit être l'une des valeurs suivantes (informations basées sur la branche stable Mozilla 1.7, peuvent également être valables pour d'autres versions) :

+ + + + + + + + + + + + +
+

"Chrome"
+ "Components"
+ "Current User"
+ "Defaults"
+ "file:///"
+ "OS Drive"
+ "Plugins"
+ "Preferences"
+ "Profile"
+ "Program"
+ "Temporary"

+ 		+

"Mac Apple Menu"
+ "Mac Control Panel"
+ "Mac Desktop"
+ "Mac Documents"
+ "Mac Extension"
+ "Mac Fonts"
+ "Mac Shutdown"
+ "Mac Startup"
+ "Mac System"
+ "Mac Trash"
+ "Mac Preferences"

+ 		+

"MacOSX Default Download"
+ "MacOSX Home"
+ "MacOSX Internet Sites"
+ "MacOSX Local Applications"
+ "MacOSX Local Desktop"
+ "MacOSX Local Documents"
+ "MacOSX Local Frameworks"
+ "MacOSX Local Internet PlugIn"
+ "MacOSX Local Preferences"
+ "MacOSX Movie Documents"
+ "MacOSX Music Documents"
+ "MacOSX Picture Documents"
+ "MacOSX User Applications"
+ "MacOSX User Desktop"
+ "MacOSX User Documents"
+ "MacOSX User Frameworks"
+ "MacOSX User Internet PlugIn"
+ "MacOSX User Preferences"

+ 		+

"Unix Lib"
+ "Unix Local"

+
+

"Windows"
+ "Win AppData"
+ "Win Common Files"
+ "Win Desktop"
+ "Win Desktop Common"
+ "Win Program Files"
+ "Win Programs"
+ "Win Programs Common"
+ "Win StartMenu"
+ "Win StartMenu Common"
+ "Win Startup"
+ "Win Startup Common"
+ "Win System"

+
+

La forme file:/// n'est valide que lorsque le paramètre subDirectory est utilisé. Elle doit être au format URL file: amputée de la partie file:///. Par exemple :

+
mydir = getFolder("file:///", "c|/mysoftco/somedir");
+
+

Remarquez l'utilisation de barre oblique (/), quelque soit la plate-forme.

+

Les dossiers dont les noms commencent par <tt>Win</tt>, <tt>Mac</tt> ou <tt>Unix</tt> sont spécifiques à leur plate-forme respective. Il faut donc faire attention à leur utilisation, car ils rendent l'installation spécifique à une plate-forme.

+

Exemple

+

Pour récupérer un objet représentant le répertoire standard des plugins, on peut utiliser l'appel suivant :

+
plugindir = getFolder("Plugins");
+
+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/getFolder" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getlasterror/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getlasterror/index.html" new file mode 100644 index 0000000000..a937cbb5e5 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getlasterror/index.html" @@ -0,0 +1,30 @@ +--- +title: getLastError +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/getLastError +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/getLastError +--- +

 

+

getLastError

+

Retourne le plus récent code d'erreur non nul.

+

Méthode de

+

Objet Install

+

Syntaxe

+
int getLastError ();
+
+

Paramètres

+

Aucun.

+

Retour

+

Le plus récent code d'erreur non nul. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Description

+

La méthode getLastError est utilisée pour obtenir le plus récent code d'erreur non nul survenu depuis l'appel de initInstall ou de resetError. Cette méthode permet de différer la vérification des codes d'erreur chaque fois que addFile ou addDirectory sont appelées jusqu'au dernier appel de addFile ou de addDirectory.

+

La méthode getLastError ne retourne pas d'erreur pour les méthodes qui retournent des objets, telle que la méthode getFolder.

+

Exemple

+

L'exemple suivant appelle la méthode getLastError après une série d'appels addFile :

+
addFile("npplug", ...);
+addFile("/MS/Shared/ctl3d.dll", ...);
+addFile("/NetHelp/royalplug/royalhelp.html",...);
+err = getLastError();
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/getLastError" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getwinprofile/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getwinprofile/index.html" new file mode 100644 index 0000000000..2f0f4ca506 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getwinprofile/index.html" @@ -0,0 +1,40 @@ +--- +title: getWinProfile +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/getWinProfile +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/getWinProfile +--- +

 

+

getWinProfile

+

(Microsoft Windows uniquement)

+

Construit un objet pour travailler avec un fichier <tt>.ini</tt> de Windows.

+

Méthode de

+

Objet Install

+

Syntaxe

+
WinProfile getWinProfile (
+   Objet dossier,
+   Chaîne fichier);
+
+

Paramètres

+

La méthode getWinProfile a les paramètres suivants :

+
+
+ dossier
+
+ Un objet représentant un répertoire. Cet objet est créé en passant une chaîne représentant le répertoire à la méthode getFolder.
+
+ fichier
+
+ Un chemin relatif vers un fichier d'initialisation dans le répertoire spécifié par le paramètre dossier, tel que royal/royal.ini.
+
+

Retour

+

Un objet WinProfile.

+

Description

+

La méthode getWinProfile crée un objet pour manipuler le contenu d'un fichier <tt>.ini</tt> de Windows. Une fois cet objet créé, on peut appeler cette méthode pour récupérer des chaînes du fichier ou lui en ajouter. Pour plus d'informations sur l'objet retourné, voir WinProfile.

+

Cette méthode retourne null sur les plate-formes Unix et Macintosh.

+

Exemple

+

Pour éditer le fichier win.ini, on crée un WinProfile par cet appel :

+
var myWinProfileObj =
+   getWinProfile (getFolder("Windows"), "win.ini");
+
+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/getWinProfile" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getwinregistry/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getwinregistry/index.html" new file mode 100644 index 0000000000..d38d05deb0 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/getwinregistry/index.html" @@ -0,0 +1,23 @@ +--- +title: getWinRegistry +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/getWinRegistry +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/getWinRegistry +--- +

 

+

getWinRegistry

+

(Windows uniquement) Construit un objet pour travailler avec le registre de Microsoft Windows.

+

Méthode de

+

Objet Install

+

Syntaxe

+
WinReg getWinRegistry();
+
+

Paramètres

+

Aucun.

+

Retours

+

Un objet WinReg.

+

Description

+

La méthode getWinRegistry est utilisée pour créer un objet qui permettra de manipuler le contenu de la base de registre de Microsoft Windows. Une fois cet objet créé, on peut appeler sa méthode pour récupérer ou modifier le contenu du registre. Pour plus d'informations sur l'objet retourné, voir WinReg.

+

Cette méthode retourne NULL sur les plate-formes Unix et Macintosh.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/getWinRegistry" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/index.html" new file mode 100644 index 0000000000..ea30f5f01e --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/index.html" @@ -0,0 +1,101 @@ +--- +title: Méthodes +slug: Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes +tags: + - Référence_de_l'API_XPInstall +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods +--- +

Méthodes

+
+
+ addDirectory
+
+ Décompacte un sous-répertoire entier.
+
+ addFile
+
+ Décompacte un fichier unique.
+
+ alert
+
+ Affiche une boîte de dialogue contenant un message d'alerte et un bouton « OK ».
+
+ cancelInstall
+
+ Abandonne l'installation du logiciel.
+
+ confirm
+
+ Affiche une boîte de dialogue de confirmation contenant le message spécifié et les boutons « OK » et «Annuler ». Permet également des intitulés de bouton personnalisés et les cases à cocher.
+
+ deleteRegisteredFile
+
+ Efface le fichier spécifié et son entrée dans le + + Client Version Registry + .
+
+ execute
+
+ Extrait un fichier de l'archive <tt>xpi</tt> dans un répertoire temporaire et le programme pour une exécution ultérieure.
+
+ gestalt
+
+ Récupère les informations concernant le système d'exploitation (Mac OS uniquement).
+
+ getComponentFolder
+
+ Retourne un objet représentant le répertoire dans lequel le composant est installé.
+
+ getFolder
+
+ Retourne un objet représentant un répertoire, à utiliser avec la méthode addFile.
+
+ getLastError
+
+ Retourne le code d'erreur non nul le plus récent.
+
+ getWinProfile
+
+ Construit un objet pour travailler avec un fichier .ini de Windows.
+
+ getWinRegistry
+
+ Construit un objet pour travailler avec la base de registre de Windows.
+
+ initInstall
+
+ Initialise l'installation du logiciel et de la version indiqués.
+
+ loadResources
+
+ Retourne un objet dont les propriétés sont des chaînes localisées, chargées depuis le fichier de propriétés spécifié.
+
+ logComment
+
+ Ajoute une ligne de commentaire au rapport d'installation.
+
+ patch
+
+ Applique un ensemble de différences entre deux versions.
+
+ performInstall
+
+ Finalise l'installation du logiciel.
+
+ refreshPlugins
+
+ Rafraîchit la liste des plugins disponibles pour le navigateur.
+
+ registerChrome
+
+ Enregistre le chrome avec le registre chrome.
+
+ resetError
+
+ Réinitialise à zéro un code d'erreur sauvegardé.
+
+ setPackageFolder
+
+ Définit le dossier par défaut du paquetage qui est enregistré avec le nœud racine
+
diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/initinstall/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/initinstall/index.html" new file mode 100644 index 0000000000..a5a8394f71 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/initinstall/index.html" @@ -0,0 +1,87 @@ +--- +title: initInstall +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/initInstall +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/initInstall +--- +

 

+

initInstall

+

Initialise l'installation du logiciel spécifié et de sa version.

+

Méthode de

+

Objet Install

+

Syntaxe

+
int initInstall (
+   Chaîne displayName,
+   Chaîne package,
+   InstallVersion version,
+   int flags);
+
+
int initInstall (
+   Chaîne displayName,
+   Chaîne package,
+   Chaîne version,
+   int flags);
+
+
int initInstall (
+   Chaîne displayName,
+   Chaîne package,
+   Chaîne version);
+
+

int initInstall (

+
  String displayName,
+  String package,
+  InstallVersion version);
+
+

Paramètres

+

La méthode initInstall a les paramètres suivants :

+
+
+ displayName
+
+ Une chaîne qui contient le nom du logiciel à installer. Le nom du logiciel est visible par l'utilisateur.
+
+ package
+
+ Le chemin dans la + + Client Version Registry + concernant le logiciel (par exemple : Plugins/Adobe/Acrobat ou /royalairways/RoyalPI/).
+
+ Fournir un nom vide ou null est une erreur.
+
+ Le chemin peut être absolu ou relatif. Un chemin relatif est relatif à l'espace de nommage de Netscape 6. Un chemin relatif doit débuter par plugins/, pour être relatif à la partie plugins de cet espace de nommage ou par java/download/, pour être relatif à la partie Java. Toutes les autres parties de l'espace de nommage de Netscape 6 sont réservées à l'usage de Netscape.
+
+ La + + Client Version Registry + est une description hiérarchique du logiciel enregistré pour être utilisé par Netscape 6. Le chemin fourni ici n'est pas l'emplacement du logiciel sur le disque local, il correspond aux informations concernant le logiciel dans le registre. La distinction est importante lorsque vous ajoutez des composants avec la méthode addFile.
+
+ version
+
+ Un objet InstallVersion ou une Chaîne représentant la version du paquetage à installer. Lorsque version est une Chaîne il peut contenir jusqu'à quatre nombres entiers, délimités par des points, tel que 1.17.1999.1517.
+
+ flags
+
+ Un champ optionnel, réservé pour un usage futur. Passe 0 comme valeur par défaut.
+
+

Retour

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Description

+

La méthode initInstall initialise l'installation du logiciel spécifié. Elle doit être appelée immédiatement après le constructeur. Il est erroné d'appeler toute autre méthode de l'objet Install avant l'appel de initInstall.

+

Après l'appel de la méthode initInstall, le script d'installation doit appeler les méthodes performInstall ou cancelInstall avant qu'il ne se termine. Si ces appels ne sont pas faits, Netscape 6 ne sera pas en mesure de nettoyer proprement les fichiers temporaires après la fin de l'exécution du script.

+

Exemple

+

Pour débuter l'installation du plugin + + Royal Airways + , on peut utiliser ce code :

+
initInstall("Royal Airways TripPlanner","/RoyalAirways/
+TripPlanner","1.0.0.0");
+...
+err = getLastError();
+if (!err)
+   performInstall();
+else
+   cancelInstall(err);
+
+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/initInstall" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/loadresources/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/loadresources/index.html" new file mode 100644 index 0000000000..55aa01674d --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/loadresources/index.html" @@ -0,0 +1,33 @@ +--- +title: loadResources +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/loadResources +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/loadResources +--- +

 

+

loadResources

+

Charge un fichier de propriétés.

+

Méthode de

+

Objet Install

+

Syntaxe

+
Object loadResources( Chaîne xpiPath );
+
+

Paramètres

+

L'unique paramètre d'entrée de la méthode loadResources est une chaîne représentant le chemin vers le fichier de propriétés dans une archive <tt>xpi</tt> dans laquelle les paires clefs/valeurs sont définies.

+

Retours

+

Un objet JavaScript dont les noms des propriétés sont des clefs de ce fichier et dont les valeurs sont les chaînes.

+

Description

+

Le format du fichier de propriétés attendu par la méthode loadResources est le même que celui des fichiers de propriétés du chrome local. Cette méthode est utilisée pour internationaliser les scripts d'installation en permettant à l'installeur de récupérer les valeurs des chaînes localisées depuis un fichier annexe. Faites attention à ce que le paramètre spécifie correctement le fichier de l'archive <tt>xpi</tt> et non celui du système de fichiers, comme indiqué dans l'exemple ci-dessous.

+

Exemple

+

Soit un <tt>xpi</tt> avec la structure interne suivante :

+
install.js
+bin/res_eg_2.properties
+bin/somefile.exe
+bin/...
+
+

Les lignes suivantes récupèrent les propriétés comme objet JavaScript et rendent les valeurs accessibles avec la syntaxe habituelle des fichiers <tt>.property</tt> :

+
resEg2Obj = loadResources("bin/res_eg_2.properties");
+dump( resEg2Obj.title )
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/loadResources" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/logcomment/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/logcomment/index.html" new file mode 100644 index 0000000000..5647853f3e --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/logcomment/index.html" @@ -0,0 +1,28 @@ +--- +title: logComment +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/logComment +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/logComment +--- +

 

+

logComment

+

Ajoute une ligne de commentaire dans le journal d'installation.

+

Méthode de

+

Objet Install

+

Syntaxe

+
int logComment( Chaîne aComment );
+
+

Paramètres

+

L'unique paramètre d'entrée de la méthode logComment est une chaîne dont la valeur sera écrite dans le journal pendant le processus d'installation.

+

Retour

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Description

+

Le journal d'installation est créé, par défaut, dans le répertoire du produit si c'est possible (où se trouve l'exécutable du navigateur). Si l'installation n'a pas les droits requis, le journal d'installation est créé dans le répertoire du profile utilisateur. Respectivement, ces répertoires correspondent aux mots clefs + + Program + et + + Current User + pour la méthode getFolder.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/logComment" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/patch/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/patch/index.html" new file mode 100644 index 0000000000..eaa583ee2c --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/patch/index.html" @@ -0,0 +1,80 @@ +--- +title: patch +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/patch +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/patch +--- +

 

+

patch

+

Met à jour un composant existant.

+

Méthode de

+

Objet Install

+

Syntaxe

+
int patch (
+   Chaîne registryName,
+   Chaîne xpiSourcePath,
+   Objet localDirSpec,
+   Chaîne relativeLocalPath);
+
+
int patch (
+   Chaîne registryName,
+   InstallVersion version,
+   Chaîne xpiSourcePath,
+   Objet localDirSpec,
+   Chaîne relativeLocalPath);
+
+
int patch (
+   Chaîne registryName,
+   Chaîne version,
+   Chaîne xpiSourcePath,
+   Objet localDirSpec,
+   Chaîne relativeLocalPath);
+
+

Paramètres

+

La méthode patch a les paramètres suivants :

+
+
+ registryName
+
+ Le chemin dans la + + Client Version Registry + du composant à patcher. Ce paramètre peut être un chemin absolu, tel que /royalairways/RoyalSW/executable ou un chemin relatif, tel que executable.
+
+ Généralement, les chemins absolus ne sont utilisés que pour les composants partagés, ou ceux qui proviennent d'un autre éditeur, tel que /Microsoft/shared/msvcrt40.dll.
+
+ Généralement, les chemins relatifs sont relatifs au chemin principal spécifié dans la méthode initInstall. Ce paramètre peut également être vide, auquel cas le paramètre xpiSourcePath est utilisé comme un chemin relatif.
+
+ Le chemin du registre n'est pas l'emplacement du logiciel sur le disque local, il correspond à l'emplacement des informations concernant le logiciel dans la + + Client Version Registry + .
+
+ version
+
+ Un objet InstallVersion ou une Chaîne comportant jusqu'à quatre nombres entiers délimités par des points, tel que "1.17.1999.1517". Pour les variantes de cette méthode sans argument version, la valeur de initInstall sera utilisée.
+
+ xpiSourcePath
+
+ Une chaîne spécifiant l'emplacement des différents fichiers contenus dans l'archive <tt>xpi</tt>.
+
+ localDirSpec
+
+ Un objet représentant le répertoire où se trouve le sous-composant à patcher. Cet objet est créé en passant un chaîne représentant le répertoire à la méthode getFolder.
+
+ relativeLocalPath
+
+ Un chemin relatif vers le paramètre localDirSpec qui identifie le sous-composant à patcher. Il faut toujours utiliser des barres obliques (/) dans ce chemin, sans considération pour les conventions du système d'exploitation. Si ce paramètre est blanc ou NULL, xpiSourcePath est utilisé.
+
+

Retour

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Description

+

La méthode patch met à jour un composant en appliquant un ensemble de différences entre les deux versions connues. L'ensemble des différences est au format GDIFF et est créé à l'aide de l'utilitaire NSDiff.

+

Un patch ne peut être appliqué qu'entre deux versions connues. Si la version existante du fichier ne correspond pas à la somme de contrôle stockée dans le fichier GDIFF, patch retourne une erreur sans appliquer le patch.

+

Après avoir appliqué les différences, la méthode patch compare la somme de vérification ( + + checksum + en anglais) du fichier résultant par rapport à celle stockée dans le fichier GDIFF. Si les sommes ne correspondent pas, la version originale du fichier est préservée, la version patchée est supprimée et un code d'erreur est retourné.

+

Tout processus d'installation unique peut appliquer plusieurs patches sur un même fichier. Si la méthode performInstall indique qu'un redémarrage est nécessaire, patch peut ne pas fonctionner dans le processus XPInstall en cours jusqu'à ce qu'un redémarrage soit exécuté.

+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/patch" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/performinstall/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/performinstall/index.html" new file mode 100644 index 0000000000..cd90e320fd --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/performinstall/index.html" @@ -0,0 +1,35 @@ +--- +title: performInstall +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/performInstall +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/performInstall +--- +

 

+

performInstall

+

Exécute l'installation réelle du logiciel. Déplace tous les composants vers leur emplacement final, lance toutes les exécutions différées et enregistre le paquetage et tous ses composants dans la + + Client Version Registry + .

+

Méthode de

+

Objet Install

+

Syntaxe

+
int performInstall();
+
+

Paramètres

+

Aucun.

+

Retours

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés. Dans certains cas, cette méthode peut retourner d'autres codes d'erreur. Il peut arriver d'obtenir une erreur d'enregistrement.

+

Exemple

+

Le code suivant est utilisé pour annuler ou pour finaliser une installation, il est basé sur une variable définie précédemment dans le code :

+
initInstall("Royal Airways TripPlanner",
+   "/RoyalAirways/TripPlanner",
+   "1.0.0.0");
+...
+err = getLastError();
+if (!err)
+   performInstall();
+else
+   cancelInstall(err);
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/performInstall" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/refreshplugins/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/refreshplugins/index.html" new file mode 100644 index 0000000000..b8c13894e8 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/refreshplugins/index.html" @@ -0,0 +1,52 @@ +--- +title: refreshPlugins +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/refreshPlugins +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/refreshPlugins +--- +

 

+

refreshPlugins

+

Rafraîchit la liste des plugins enregistrés pour le navigateur.

+

Méthode de

+

Objet Install

+

Syntaxe

+
int refreshPlugins( [ aReloadPages ] );
+
+

Paramètres

+

La méthode refreshPlugins a le paramètre suivant :

+
+
+ aReloadPages
+
+ aReloadPages est une valeur booléenne optionnelle indiquant si vous voulez ou non recharger les pages Web ouvertes après le rafraîchissement de la liste des plugins.
+
+

Retours

+

Aucun.

+

Description

+

refreshPlugins permet d'enregistrer de nouveaux plugins sans avoir à redémarrer le navigateur. Lorsque cette méthode est utilisée dans un script d'installation, comme dans l'exemple ci-dessous, on peut installer de nouveaux plugins et les utiliser pour afficher les média demandés dans une page Web sans interrompre l'expérience utilisateur.

+
+ Note : La méthode refreshPlugins doit être appelée après la méthode performInstall qui initie l'installation réelle.
+

Exemple

+
// Installe une DLL dans le répertoire "Plugins"
+ // Installe un XPT dans le répertoire "Components"
+  var xpiSrc  = "NPMCult3DP.dll";
+  var xpiSrc2 = "nsIC3DPScriptablePeer.xpt";
+  initInstall(
+   "Cult3D Plugin File",
+   "@cycore.com/Cult3D;version=1.0.0",
+   "1.0.0");
+  setPackageFolder(getFolder("Plugins"));
+  addFile(xpiSrc);
+  addFile("",xpiSrc2,getFolder("Components"),"");
+  var err = getLastError();
+  if (err == SUCCESS)
+  {
+     err = performInstall();
+     if (err == SUCCESS)
+        refreshPlugins();
+  }
+  else
+     cancelInstall(err);</pre>
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/refreshPlugins" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/registerchrome/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/registerchrome/index.html" new file mode 100644 index 0000000000..2248e87d1d --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/registerchrome/index.html" @@ -0,0 +1,61 @@ +--- +title: registerChrome +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/registerChrome +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/registerChrome +--- +

 

+

registerChrome

+

Enregistre chrome dans le registre Chrome.

+

Méthode de

+

Objet Install

+

Syntaxe

+
int registerChrome(
+  SWITCH,
+  srcDir,
+  xpiPath);
+
+

Paramètres

+

La méthode registerChrome a les paramètres suivants :

+
+
+ SWITCH
+
+ SWITCH est le switch chrome indiquant le type de fichier à enregistrer. SKIN est utilisé pour les thèmes, LOCALE est utilisé pour les paquetages de localisation. PACKAGE, un troisième type possible, est équivalent à SKIN AND/OR LOCALE et assure que tout dans le <tt>xpi</tt> sera enregistré. Une option finale pour ce paramètre est DELAYED_CHROME, qui enregistre le switch uniquement après un redémarrage du navigateur.
+
+

Il est possible de combiner les switches comme dans l'exemple ci-dessous.

+
+
+ srcDir
+
+ srcDir est un objet FileSpecObject représentant la destination source de l'installation. Les + + FileSpecObjects + requis par cette fonction, sont créés en utilisant la méthode getFolder de l'objet Install.
+
+
+
+ xpiPath
+
+ xpiPath est le chemin, dans le <tt>xpi</tt>, où se trouve le fichier contents.rdf définissant le chrome. Par exemple, + + locale/myLocale/aim + pointe vers le sous-répertoire locale/myLocale/aim du même fichier <tt>xpi</tt> que le script d'installation.
+
+

Retour

+

Un nombre entier correspondant à un code d'erreur. Pour la liste complète des valeurs possibles, voir Codes retournés. Dans certains cas, cette méthode peut retourner d'autres codes d'erreur. Il peut arriver d'obtenir une erreur d'enregistrement.

+

Description

+

Lorsque le troisième paramètre est omis (pointage vers un emplacement précis dans l'archive <tt>xpi</tt>), cette fonction est utilisée de façon dépréciée. Dans ce cas, registerChrome supporte l'ancien format des archives d'installation, dans lequel le fichier manifest.rdf était toujours situé au plus haut niveau de l'archive d'installation. registerChrome ne nécessite alors pas de chemin dans l'archive, comme il le requiert maintenant afin de localiser le format plus flexible du fichier contents.rdf des archives d'installation.

+

Il est possible de regarder dans le fichier installed-chrome.txt du répertoire chrome pour savoir où et comment la fonction registerChrome a enregistré le paquetage dans le registre chrome.

+

Exemple

+

Cet exemple suppose que votre archive xpi se trouve dans le dossier Plugins et que le fichier RDF est dans le sous-dossier resources de l'archive.

+
+

Vous devriez évitez cet appel (au cas où vous feriez un copier/coller depuis un ancien script d'installation) pour l'installation de plugin pour Firefox 2.x. Il n'est pas certain de ce que produira cet « enregistrement chrome ».

+
+
registerChrome(
+  PACKAGE | DELAYED_CHROME,
+  getFolder("Plugins"),
+  "resources");
+
+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/registerChrome" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/reseterror/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/reseterror/index.html" new file mode 100644 index 0000000000..1b5c5d56ed --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/reseterror/index.html" @@ -0,0 +1,26 @@ +--- +title: resetError +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/resetError +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/resetError +--- +

 

+

resetError

+

Réinitialise à zéro un code d'erreur enregistré.

+

Méthode de

+

Objet Install

+

Syntaxe

+
void resetError ();
+
+

Paramètres

+

Aucun.

+

Retour

+

Aucun.

+

Description

+

La méthode resetError réinitialise à zéro tout code d'erreur enregistré. Pour plus d'informations, voir getLastError.

+

Exemple

+

Pour réinitialiser à zéro le dernier code d'erreur :

+
resetError();
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/resetError" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/setpackagefolder/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/setpackagefolder/index.html" new file mode 100644 index 0000000000..73ab053260 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/m\303\251thodes/setpackagefolder/index.html" @@ -0,0 +1,33 @@ +--- +title: setPackageFolder +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Méthodes/setPackageFolder +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Methods/setPackageFolder +--- +

 

+

setPackageFolder

+

Définit le dossier par défaut du paquetage.

+

Méthode de

+

Objet Install

+

Syntaxe

+
void setPackageFolder (
+   Objet dossier);
+
+

Paramètres

+

La méthode setPackageFolder a le paramètre suivant :

+
+
+ dossier
+
+ Un objet représentant un répertoire. Cet objet est créé en passant une chaîne représentant le répertoire aux méthodes getFolder ou getComponentFolder.
+
+

Retour

+

Aucun.

+

Description

+

La méthode setPackageFolder définit le dossier par défaut du paquetage qui est enregistré avec le nœud racine. Lorsque le dossier du paquetage est défini, il est utilisé comme dossier par défaut pour les formulaires de la méthode addFile et de toutes celles qui ont un paramètre optionnel localDirSpec.

+

Cette méthode ne devrait être appelée qu'une seule fois, et devrait toujours l'être immédiatement après l'appel de initInstall. Au cas où elle serait appelée plusieurs fois, le dernier dossier défini est le dossier qui sera enregistré dans la + + Client Version Registry + et utilisé par défaut pour les autres installations.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Methods/setPackageFolder" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/propri\303\251t\303\251s/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/propri\303\251t\303\251s/index.html" new file mode 100644 index 0000000000..65e0ccaa9f --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_install/propri\303\251t\303\251s/index.html" @@ -0,0 +1,38 @@ +--- +title: Propriétés +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_Install/Propriétés +tags: + - Référence_de_l'API_XPInstall +translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Properties +--- +

 

+

Propriétés

+
+
+ archive
+
+ Le chemin local complet de l'archive après son téléchargement dans le dossier temporaire spécifique de la plate-forme (par exemple C:\TEMP\argstest.xpi)
+
+ arguments
+
+ Les arguments peuvent être passés par les API de déclenchement en attachant un ? puis la chaîne de l'argument à l'URL du xpi : startSoftwareUpdate("http://webserver/argstest.xpi?ARGUMENT_STRING") donnera ARGUMENT_STRING # comme valeur de Install.arguments. Remarquez que les espaces dans la chaîne de l'argument sont autorisés. Tout ce qui ce trouve après le point d'interrogation est traité comme une chaîne qui devient la propriété Install.arguments.
+
+ buildID
+
+ L'ID de compilation de l'application, sous la forme 20041231. Remarquez qu'à cause des différentes branches de développement (différentes versions de Gecko avec différentes fonctionnalités peuvent être compilées le même jour), l'utilisation de cette propriété pour « détecter » la version de l'application peut produire un résultat erroné. De plus, cet ID peut être égale à 0 pour les compilations personnalisées.
+
+ jarfile
+
+ Alias pour archive
+
+ platform
+
+ Contient les informations sur la plate-forme de compilation et d'exécution de XPInstall. Par exemple, la valeur peut débuter par « Windows », « Macintosh » ou « X11 » (pour Unix/Linux). Pour plus de détails, voir le code correspondant dans la méthode GetInstallPlatform de la classe nsInstall.
+
+ url
+
+ L'URL pleinement qualifiée du xpi (URL de fichier, URL http, URL ftp, etc.). Par exemple http://dolfin/sgehani/zzz/ip.xpi. Remarquez que, même si elle est déclenchée en utilisant des URL relatives, cela affichera l'URL complète (après qualification).
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/Install_Object/Properties" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installtrigger/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installtrigger/index.html" new file mode 100644 index 0000000000..0c7e9f279b --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installtrigger/index.html" @@ -0,0 +1,20 @@ +--- +title: Objet InstallTrigger +slug: Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_InstallTrigger +tags: + - Référence_de_l'API_XPInstall +translation_of: Web/API/InstallTrigger +--- +

 

+

InstallTrigger

+

Un script de déclenchement sur une page Web utilise un objet InstallTrigger pour télécharger et installer un logiciel.

+

Présentation

+

Pour les installations simples, la méthode install sur l'objet InstallTrigger peut être la seule chose nécessaire dans le script d'installation.

+

Pour des installations plus complexes, vous pouvez avoir besoin d'utiliser les objet d'installation Install et/ou File. Dans tous les cas, vous devez déclencher le processus d'installation en créant un script sur une page Web dans lequel les méthodes InstallTrigger téléchargent le fichier <tt>xpi</tt> spécifié et « déclenchent » l'exécution du script <tt>install.js</tt> situé à la racine du <tt>xpi</tt>.

+

La principale méthode sur l'objet InstallTrigger est install, qui télécharge et installe un ou plusieurs paquetages logiciels archivés dans un fichier au format <tt>xpi</tt>. Ce qui suit est un exemple simple d'installation depuis une page Web :

+
xpi={'XPInstall Dialog Display Name':'simple.xpi'};
+InstallTrigger.install(xpi);
+
+

Vous pouvez également utiliser l'objet InstallTrigger pour vérifier les versions de logiciels, installer des thèmes Netscape6/Mozilla et des paquetages de langues, et exécuter des installations multi-paquetages avec install.

+

Interwiki Langiages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/InstallTrigger_Object", "ja": "ja/XPInstall_API_Reference/InstallTrigger_Object" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/index.html" new file mode 100644 index 0000000000..c3a6bcd3fa --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/index.html" @@ -0,0 +1,29 @@ +--- +title: Objet InstallVersion +slug: Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_InstallVersion +tags: + - Référence_de_l'API_XPInstall +translation_of: Archive/Mozilla/XPInstall/Reference/InstallVersion_Object +--- +

 

+

InstallVersion

+

Les objets InstallVersion sont utilisés pour stocker des informations sur la version du logiciel.

+

Présentation

+

Cet objet et ses méthodes sont utilisés aussi bien lors du déclenchement d'un téléchargement, afin de vérifier si une version particulière doit être installée, que lors de l'installation d'un logiciel.

+
+
+ init()
+
+ Associe une version particulière à un objet InstallVersion.
+
+ toString()
+
+ Convertit les différents formats de version en chaînes.
+
+ compareTo()
+
+ Compare ces chaînes et indique les relations entre les deux versions.
+
+

Chacun des paramètres de version est également disponible en tant que propriété séparée de l'objet InstallVersion.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/InstallVersion_Object" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/m\303\251thodes/compareto/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/m\303\251thodes/compareto/index.html" new file mode 100644 index 0000000000..7c27d6d29e --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/m\303\251thodes/compareto/index.html" @@ -0,0 +1,104 @@ +--- +title: compareTo +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_InstallVersion/Méthodes/compareTo +translation_of: Archive/Mozilla/XPInstall/Reference/InstallVersion_Object/Methods/compareTo +--- +

 

+

compareTo

+

Compare les informations de version spécifiées dans cet objet à celles spécifiées dans le paramètre version.

+

Méthode de

+

Objet InstallVersion

+

Syntaxe

+
compareTo ( InstallVersion version);
+
+
compareTo ( String version);
+
+
compareTo ( int major, int minor, int release, int build);
+
+

Paramètres

+

La méthode compareTo a les paramètres suivants :

+
+
+ maj
+
+ Le numéro de version majeur.
+
+ min
+
+ Le numéro de version mineur.
+
+ rev
+
+ Le numéro de révision.
+
+ bld
+
+ Le numéro de compilation.
+
+ version
+
+ Une chaîne représentant les informations de version au format 4.1.2.1234.
+
+

Retour

+

Si les versions sont les mêmes, cette méthode retourne 0. Si la version de cet objet représente une version plus petite (précédente) que celle représentée dans le paramètre version, cette méthode retourne un nombre négatif. Autrement, elle retourne un nombre positif. En particulier, cette méthode retourne l'un des nombres suivants :

+
+
+ -4 
+
+ La version de l'objet a un numéro majeur plus petit (plus ancien) que le paramètre version.
+
+ -3 
+
+ La version de l'objet a un numéro mineur plus petit (plus ancien) que le paramètre version.
+
+ -2 
+
+ La version de l'objet a un numéro de version plus petit (plus ancien) que le paramètre version.
+
+ -1 
+
+ La version de l'objet a un numéro de compilation plus petit (plus ancien) que le paramètre version.
+
+ 0 
+
+ Les numéros de version sont égaux ; les deux objets représentent la même version.
+
+ 1 
+
+ La version de l'objet a un numéro de compilation plus grand (plus récent) que le paramètre version.
+
+ 2 
+
+ La version de l'objet a un numéro de version plus grand (plus récent) que le paramètre version.
+
+ 3 
+
+ La version de l'objet a un numéro mineur plus grand (plus récent) que le paramètre version.
+
+ 4 
+
+ La version de l'objet a un numéro majeur plus grand (plus récent) que le paramètre version.
+
+

Les constantes suivantes sont définies et disponible pour vérifier la valeur retournée par compareTo :

+ +

Exemple

+

Ce code est utilise la méthode compareTo pour déterminer si oui ou non la version 3.2.1 du logiciel « Royal Airways » a été précédemment installée :

+
existingVI = InstallTrigger.getVersion("/royalairways/royalsw");
+
+if ( existingVI.compareTo("3.2.1") <= 0 ) {
+   // ... procède à la mise à jour ...
+   }
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/InstallVersion_Object/Methods/compareTo" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/m\303\251thodes/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/m\303\251thodes/index.html" new file mode 100644 index 0000000000..1b8e8ec247 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/m\303\251thodes/index.html" @@ -0,0 +1,26 @@ +--- +title: Méthodes +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_InstallVersion/Méthodes +tags: + - Référence_de_l'API_XPInstall +translation_of: Archive/Mozilla/XPInstall/Reference/InstallVersion_Object/Methods +--- +

 

+

Méthodes

+
+
+ compareTo()
+
+ Compare les informations de version spécifiée dans l'objet à celles spécifiées dans le paramètre version.
+
+ init()
+
+ Initialise un objet InstallVersion.
+
+ toString()
+
+ Convertit un objet InstallVersion en chaîne.
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/InstallVersion_Object/Methods" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/m\303\251thodes/init/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/m\303\251thodes/init/index.html" new file mode 100644 index 0000000000..df326e2a0f --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/m\303\251thodes/init/index.html" @@ -0,0 +1,43 @@ +--- +title: init +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_InstallVersion/Méthodes/init +translation_of: Archive/Mozilla/XPInstall/Reference/InstallVersion_Object/Methods/init +--- +

 

+

init

+

Initialise un objet init.

+

Méthode de

+

Objet InstallVersion

+

Syntaxe

+
init ( int maj, int min, int rev, int bld );
+
+
init ( String version );
+
+

Paramètres

+

La méthode init a les paramètres suivants :

+
+
+ maj
+
+ Le numéro de version majeur.
+
+ min
+
+ Le numéro de version mineur.
+
+ rev
+
+ Le numéro de révision.
+
+ bld
+
+ Le numéro de compilation.
+
+ version
+
+ Une chaîne représentant les informations de version au format 4.1.2.1234.
+
+

Lorsque maj, min, rev et bld sont donnés comme paramètres, ils sont tout quatre obligatoires, mais ils peuvent tous être égaux à 0.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/InstallVersion_Object/Methods/init" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/m\303\251thodes/tostring/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/m\303\251thodes/tostring/index.html" new file mode 100644 index 0000000000..8063509a39 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/m\303\251thodes/tostring/index.html" @@ -0,0 +1,32 @@ +--- +title: toString +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_InstallVersion/Méthodes/toString +translation_of: Archive/Mozilla/XPInstall/Reference/InstallVersion_Object/Methods/toString +--- +

 

+

toString

+

Convertit un objet InstallVersion init en chaîne.

+

Méthode de

+

Objet InstallVersion

+

Syntaxe

+
String version = InstallVersion.toString ( initObj );
+
+

Paramètres

+

La méthode toString a le paramètre suivant :

+
+
+ initObj
+
+ initObj est un objet InstallVersion dont la méthode init a été appelée.
+
+

Retour

+

Les nombres majeurs, mineurs, de révision et de compilation représentés dans une chaîne unique.

+

La fonction init() peut entrer le numéro de version comme une chaîne unique ou comme une série de paramètres représentant les numéros de versions de l'installation. Pour sortir le numéro de version d'un objet InstallVersion afin de la comparer avec les autres versions, on peut appeler toString() et récupérer la version sous forme de chaîne au format ""maj.min.rev.bld".

+

Exemple

+
var vi = new InstallVersion();
+vi.init("999.888.777.666"); //Chaîne aléatoire
+viString = vi.toString();
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/InstallVersion_Object/Methods/toString" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/propri\303\251t\303\251s/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/propri\303\251t\303\251s/index.html" new file mode 100644 index 0000000000..01c7a3cf90 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_installversion/propri\303\251t\303\251s/index.html" @@ -0,0 +1,36 @@ +--- +title: Propriétés +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_InstallVersion/Propriétés +tags: + - Référence_de_l'API_XPInstall +translation_of: Archive/Mozilla/XPInstall/Reference/InstallVersion_Object/Properties +--- +

 

+

Propriétés

+
+
+ major
+
+ Élément le plus significatif de l'objet InstallVersion. Par exemple, la version majeure de Netscape 6 est 6.
+
+
+
+ minor
+
+ Second élément significatif de l'objet InstallVersion. Par exemple la version mineure de Netscape Communicator 4.7 est 7.
+
+
+
+ release
+
+ Second élément de moindre signification de l'objet InstallVersion.
+
+
+
+ build
+
+ Élément de moindre signification de l'objet InstallVersion. Par exemple, le buildID, ou ID de compilation, de Netscape 6 est représenté par un datage au format AAAAMMJJHH : 2001031808 signifie que la compilation date de 2001, au mois de mars, le 18e jour du mois, à 8h00.
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/InstallVersion_Object/Properties" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winprofile/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winprofile/index.html" new file mode 100644 index 0000000000..2b3678e354 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winprofile/index.html" @@ -0,0 +1,13 @@ +--- +title: Objet WinProfile +slug: Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinProfile +tags: + - Référence_de_l'API_XPInstall +translation_of: Archive/Mozilla/XPInstall/Reference/WinProfile_Object +--- +

WinProfile

+

(Microsoft Windows uniquement)

+

Cet objet peut être utilisé par les développeurs Windows pour manipuler le contenu d'un fichier .ini de Windows.

+

Présentation

+

Cet objet n'a pas de constructeur publique. À la place, vous construisez une instance de cet objet en appelant la méthode getWinProfile de l'objet Install.

+

Les deux méthodes de l'objet WinProfile, getString et writeString, permettent de lire et d'écrire des données dans les paires de clefs/valeurs d'un fichier .ini de Windows.

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winprofile/m\303\251thodes/getstring/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winprofile/m\303\251thodes/getstring/index.html" new file mode 100644 index 0000000000..8d9f80bb76 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winprofile/m\303\251thodes/getstring/index.html" @@ -0,0 +1,37 @@ +--- +title: getString +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinProfile/Méthodes/getString +translation_of: Archive/Mozilla/XPInstall/Reference/WinProfile_Object/Methods/getString +--- +

 

+

getString

+

Récupère une valeur d'un fichier .ini.

+

Méthode de

+

Objet WinProfile

+

Syntaxe

+
String getString ( String section, String key);
+
+

Paramètres

+

Cette méthode a les paramètres suivants :

+
+
+ section
+
+ Le nom d'une section du fichier, tel que boot ou drivers.
+
+ key
+
+ La clef de la section dont il faut retourner la valeur.
+
+

Retour

+

La valeur de la clef ou une chaîne vide si rien n'a été trouvé.

+

Description

+

Cette méthode getString est semblable à la fonction getPrivateProfileString de l'API de Windows. Contrairement à cette dernière, cette méthode ne supporte pas l'utilisation d'une clef vide pour retourner les listes des clefs de la section.

+

Exemple

+

Pour récupérer le nom du fichier de fond d'écran depuis la section desktop du fichier win.ini, on utilise l'appel :

+
ini = getWinProfile (getFolder("Windows"), "win.ini");
+var wallpaperValue = ini.getString ("Desktop", "Wallpaper");
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinProfile_Object/Methods/getString" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winprofile/m\303\251thodes/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winprofile/m\303\251thodes/index.html" new file mode 100644 index 0000000000..0c325a8588 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winprofile/m\303\251thodes/index.html" @@ -0,0 +1,22 @@ +--- +title: Méthodes +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinProfile/Méthodes +tags: + - Référence_de_l'API_XPInstall +translation_of: Archive/Mozilla/XPInstall/Reference/WinProfile_Object/Methods +--- +

 

+

Méthodes

+
+
+ getString
+
+ Récupère une valeur dans un fichier .ini.
+
+ writeString
+
+ Modifie une valeur dans un fichier .ini.
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinProfile_Object/Methods" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winprofile/m\303\251thodes/writestring/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winprofile/m\303\251thodes/writestring/index.html" new file mode 100644 index 0000000000..46ec4c3801 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winprofile/m\303\251thodes/writestring/index.html" @@ -0,0 +1,41 @@ +--- +title: writeString +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinProfile/Méthodes/writeString +translation_of: Archive/Mozilla/XPInstall/Reference/WinProfile_Object/Methods/writeString +--- +

 

+

writeString

+

Changes a value in a .ini file.

+

Méthode de

+

Objet WinProfile

+

Syntaxe

+
Boolean writeString ( String section, String key, String value);
+
+

Paramètres

+

Cette méthode a les paramètres suivants :

+
+
+ section
+
+ Le nom d'une section du fichier, telle que boot ou drivers.
+
+ key
+
+ La clef dans cette section dont on veut modifier la valeur.
+
+ value
+
+ La nouvelle valeur.
+
+

Retour

+

True si correctement programmé, autrement, false.

+

Description

+

La méthode writeString est similaire à la fonction WritePrivateProfileString de l'API de Windows. Pour effacer une valeur existante, fournissez une valeur vide pour le paramètre value. Contrairement à la fonction WritePrivateProfileString, cette méthode ne supporte pas l'utilisation d'une clef vide pour effacer une section entière. Les valeurs ne seront écrites qu'après l'appel de la méthode performInstall.

+

Exemple

+

Pour définir le nom du fichier de fond d'écran depuis la section Desktop du fichier win.ini, on utilise cet appel :

+
ini = getWinProfile (getFolder("Windows"), "win.ini");
+ini.writeString ("Desktop", "Wallpaper", "newpathname");
+
+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinProfile_Object/Methods/writeString" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/index.html" new file mode 100644 index 0000000000..84bff48cfa --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/index.html" @@ -0,0 +1,19 @@ +--- +title: Objet WinReg +slug: Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg +tags: + - Référence_de_l'API_XPInstall +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object +--- +

 

+

WinReg

+

(Microsoft Windows uniquement)

+

Cet objet peut être utilisé par les développeurs pour manipuler le contenu de la base de registre Windows.

+

Présentation

+

Cet objet n'a pas de constructeur public. À la place, vous devez construire une instance de cet objet en appelant la méthode getWinRegistry de l'objet Install.

+

Ce document suppose que vous êtes déjà familier avec la base de registre de Windows. Pour plus d'informations sur elle, voir la documentation de l'API pour Windows.

+

Lors de la construction d'un objet WinReg, il est définit pour opérer avec HKEY_CLASSES_ROOT comme clef racine. Pour utiliser une clef racine différente, il faut utiliser la méthode setRootKey.

+

Généralement, les valeurs de la base de registre sont des chaînes. Pour manipuler de telles chaînes, il faut utiliser les méthodes getValueString et setValueString. Pour manipuler des valeurs d'un autre type, il faut utiliser les méthodes getValue et setValue.

+

La lecture des valeurs de registre est immédiate. Cependant, l'écriture dans la base de registre est retardée jusqu'à l'appel de performInstall.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/createkey/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/createkey/index.html" new file mode 100644 index 0000000000..79b12fcd7e --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/createkey/index.html" @@ -0,0 +1,32 @@ +--- +title: createKey +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/Méthodes/createKey +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/Methods/createKey +--- +

 

+

createKey

+

Ajoute une clef à la base de registre.

+

Méthode de

+

Objet WinReg

+

Syntaxe

+
int createKey ( Chaîne subkey, Chaîne classname);
+
+

Paramètres

+

La méthode createKey a les paramètres suivants :

+
+
+ subkey
+
+ Le chemin de la clef vers l'emplacement approprié dans la hiérarchie de clefs, tel que "Software\\Netscape\\Navigator\\Mail".
+
+ classname
+
+ Habituellement, une chaîne vide. Pour plus d'informations sur ce paramètre, voir la description de RegCreateKeyEx dans la documentation de l'API Windows.
+
+

Retour

+

0 en cas de succès ou un nombre non nul si l'ordonnancement de la création a échoué. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Description

+

La méthode createKey ajoute une clef à la base de registre. Il faut ajouter une clef au registre avant de pouvoir lui assigner une valeur.

+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/Methods/createKey" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/deletekey/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/deletekey/index.html" new file mode 100644 index 0000000000..e05e7dabc8 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/deletekey/index.html" @@ -0,0 +1,26 @@ +--- +title: deleteKey +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/Méthodes/deleteKey +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/Methods/deleteKey +--- +

 

+

deleteKey

+

Supprime une clef de la base de registre.

+

Méthode de

+

Objet WinReg

+

Syntaxe

+
int deleteKey ( String subkey);
+
+

Paramètres

+

La méthode deleteKey a le paramètre suivant :

+
+
+ subkey
+
+ Le chemin de la clef vers l'emplacement approprié dans la hiérarchie de clef, tel que"Software\\Netscape\\Navigator\\Mail".
+
+

Retours

+

0 en cas de succès ; un nombre non nul si l'ordonnancement de la suppression a échoué. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/Methods/deleteKey" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/deletevalue/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/deletevalue/index.html" new file mode 100644 index 0000000000..a69f08bcd9 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/deletevalue/index.html" @@ -0,0 +1,30 @@ +--- +title: deleteValue +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/Méthodes/deleteValue +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/Methods/deleteValue +--- +

 

+

deleteValue

+

Supprime la valeur d'un clef arbitraire.

+

Méthode de

+

Objet WinReg

+

Syntaxe

+
int deleteValue ( Chaîne subkey, Chaîne valname);
+
+

Paramètres

+

La méthode deleteValue a les paramètres suivants :

+
+
+ subkey
+
+ Le chemin de la clef vers l'emplacement approprié dans la hiérarchie de clefs, tel que "Software\\Netscape\\Navigator\\Mail".
+
+ valname
+
+ Le nom de la paire nom_de_valeur/valeur à supprimer.
+
+

Retours

+

0 en cas de succès ou un nombre non nul si la suppression a échouée.

+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/Methods/deleteValue" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/enumkeys/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/enumkeys/index.html" new file mode 100644 index 0000000000..760d620dcd --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/enumkeys/index.html" @@ -0,0 +1,48 @@ +--- +title: enumKeys +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/Méthodes/enumKeys +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/Methods/enumKeys +--- +

 

+

enumKeys

+

Énumère les sous-clefs de registre de la clef donnée.

+

Méthode de

+

Objet WinReg

+

Syntaxe

+
String enumKeys ( Chaîne key, int subkeyIndex );
+
+

Paramètres

+

La méthode enumKeys a les paramètres suivants :

+
+
+ key
+
+ Le chemin de la clef vers l'emplacement approprié dans la hiérarchie de clefs, tel que "Software\\Netscape\\Navigator\\Mail".
+
+ subkeyIndex
+
+ Un entier représentant l'index base 0 de la clef dont on cherche la valeur.
+
+

Retour

+

Le nom en cas de succès ou NULL si la valeur référencée n'existe pas.

+

Description

+

La méthode enumKeys peut être utilisée pour définir une itération dans les sous-clefs d'une clef donnée. L'exemple suivant montre comment utiliser la méthode enumKeys pour trouver le sous-répertoire des plugins dans les différentes installations des navigateurs basés sur Mozilla :

+
var winreg = getWinRegistry();
+winreg.setRootKey(winreg.HKEY_LOCAL_MACHINE);
+var index = 0;
+var baseKey = "Software\\Mozilla";
+while ( (MozillaVersion = winreg.enumKeys(baseKey,index)) != null )
+{
+  logComment("MozillaVersion = " + MozillaVersion);
+  subkey = baseKey + "\\" + MozillaVersion + "\\Extensions";
+  pluginsDir = winreg.getValueString ( subkey, "Plugins" );
+  if ( pluginsDir )
+    logComment("pluginsDir = " +  pluginsDir);
+  else
+    logComment("No plugins dir for " + baseKey + "\\" + MozillaVersion);
+  index++;
+}
+
+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/Methods/enumKeys" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/enumvaluenames/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/enumvaluenames/index.html" new file mode 100644 index 0000000000..8eddf182b8 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/enumvaluenames/index.html" @@ -0,0 +1,39 @@ +--- +title: enumValueNames +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/Méthodes/enumValueNames +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/Methods/enumValueNames +--- +

 

+

enumValueNames

+

Énumère la valeur d'une clef donnée.

+

Méthode de

+

Objet WinReg

+

Syntaxe

+
String enumValueNames ( Chaîne key, int subkeyIndex );
+
+

Paramètres

+

La méthode enumValueNames a les paramètres suivants

+
+
+  
+
+ key
+
+ Le chemin de la clef vers l'emplacement approprié dans la hiérarchie de clefs, tel que "Software\\Netscape\\Navigator\\Mail".
+
+ subkeyIndex
+
+ Un entier représentant l'index base 0 de la clef dont on cherche la valeur.
+
+

Retour

+

La valeur de la clef en tant que chaîne si l'opération réussit ou NULL si la sous-clef indiquée n'existe pas.

+

Description

+

La méthode enumValueNames peut être utilisée pour exécuter une itération dans les valeurs d'une clef donnée. L'exemple suivant récupère la valeur d'une clef à l'aide de cette méthode :

+
var winreg = getWinRegistry();
+winreg.setRootKey(winreg.HKEY_LOCAL_MACHINE);
+v1 = winreg.enumValueNames("SOFTWARE\\Mozilla\\", 0);
+logComment("The first subkey value of the Mozilla key: " + v1)
+
+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/Methods/enumValueNames" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/getvalue/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/getvalue/index.html" new file mode 100644 index 0000000000..09accbd416 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/getvalue/index.html" @@ -0,0 +1,33 @@ +--- +title: getValue +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/Méthodes/getValue +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/Methods/getValue +--- +

 

+

getValue

+

(Netscape 6 et Mozilla ne supportent pas cette méthode)

+

Récupère la valeur d'une clef arbitraire.

+

Méthode de

+

Objet WinReg

+

Syntaxe

+
WinRegValue getValue ( Chaîne subkey, Chaîne valname);
+
+

Paramètres

+

La méthode getValue a les paramètres suivants :

+
+
+ subkey
+
+ Le chemin de la clef vers l'emplacement approprié dans la hiérarchie de clefs, tel que "Software\\Netscape\\Navigator\\Mail".
+
+ valname
+
+ Le nom de la paire nom_de_la_valeur/valeur dont on veut récupérer la valeur.
+
+

Retour

+

Un objet WinRegValue représentant la valeur de la paire nom_de_la_valeur/valeur ou null s'il n'y a pas de valeur ou s'il se produit une erreur. Pour plus d'informations sur ces valeurs, voir WinRegValue.

+

Description

+

La méthode getValue récupère la valeur d'une clef arbitraire. Cette méthode est utilisée si la valeur voulue n'est pas une chaîne. Si la valeur est une chaîne, la méthode getValueString est plus adpatée.

+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/Methods/getValue" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/getvaluenumber/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/getvaluenumber/index.html" new file mode 100644 index 0000000000..72730a84dc --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/getvaluenumber/index.html" @@ -0,0 +1,32 @@ +--- +title: getValueNumber +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/Méthodes/getValueNumber +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/Methods/getValueNumber +--- +

 

+

getValueNumber

+

Récupère la valeur d'un clef lorsque cette valeur est un nombre.

+

Méthode de

+

Objet WinReg

+

Syntaxe

+
Number getValueNumber ( Chaîne subkey, Chaîne valname);
+
+

Paramètres

+

La méthode getValueString a les paramètres suivants :

+
+
+ subkey
+
+ Le chemin de la clef vers l'emplacement approprié dans la hiérarchie de clefs, tel que "Software\\Netscape\\Navigator\\Mail".
+
+ valname
+
+ Le nom de la paire nom_de_la_valeur/valeur dont on veut récupérer la valeur.
+
+

Retour

+

La valeur du nombre de la clef spécifiée ou null s'il se produit une erreur, la valeur n'a pas été trouvée ou cette valeur n'est pas un nombre.

+

Description

+

La méthode getValueNumber récupère la valeur d'une clef. Si cette valeur n'est pas un nombre, on utilise la méthode getValue.

+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/Methods/getValueNumber" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/getvaluestring/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/getvaluestring/index.html" new file mode 100644 index 0000000000..176746ce8a --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/getvaluestring/index.html" @@ -0,0 +1,32 @@ +--- +title: getValueString +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/Méthodes/getValueString +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/Methods/getValueString +--- +

 

+

getValueString

+

Récupère la valeur d'une clef lorsque cette valeur est une chaîne.

+

Méthode de

+

Objet WinReg

+

Syntaxe

+
String getValueString ( Chaîne subkey, Chaîne valname);
+
+

Paramètres

+

La méthode getValueString a les paramètres suivants :

+
+
+ subkey
+
+ Le chemin de la clef vers l'emplacement approprié dans la hiérarchie de clefs, tel que "Software\\Netscape\\Navigator\\Mail".
+
+ valname
+
+ Le nom de la paire nom_de_la_valeur/valeur dont on veut récupérer la valeur.
+
+

Retour

+

Une chaîne représentant la valeur de la paire nom_de_la_valeur/valeur ou null si cela produit une erreur, si la valeur n'a pas été trouvée ou si la valeur n'est pas une chaîne.

+

Description

+

La méthode getValueString récupère la valeur d'une chaîne. Si cette valeur n'est pas une chaîne, on utilise la méthode getValue.

+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/Methods/getValueString" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/index.html" new file mode 100644 index 0000000000..df9d96ff76 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/index.html" @@ -0,0 +1,74 @@ +--- +title: Méthodes +slug: Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/Méthodes +tags: + - Référence_de_l'API_XPInstall +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/Methods +--- +

 

+

Méthodes

+
+
+ createKey
+
+ Ajoute une clef.
+
+ deleteKey
+
+ Supprime une clef.
+
+ deleteValue
+
+ Supprime la valeur d'un clef arbitraire.
+
+ enumKeys
+
+ Récupère les sous-clefs de registre de la clef donnée.
+
+ enumValueNames
+
+ Récupère la valeur de la sous-clef donnée.
+
+ getValue
+
+ Récupère la valeur d'un clef arbitraire.
+
+ getValueNumber
+
+ Récupère la valeur d'une clef, lorsque cette valeur est un nombre entier.
+
+ getValueString
+
+ Récupère la valeur d'une clef, lorsque cette valeur est une chaîne.
+
+ isKeyWritable
+
+ Retourne si la clef donnée est modifiable ou non.
+
+ keyExists
+
+ Retourne si la clef donnée existe ou si elle est lisible.
+
+ setRootKey
+
+ Change la clef racine à laquelle accéder.
+
+ setValue
+
+ Définit la valeur d'une clef arbitraire.
+
+ setValueNumber
+
+ Définit la valeur d'un clef, lorsque cette valeur est un nombre entier.
+
+ setValueString
+
+ Définit la valeur d'une clef, lorsque cette valeur est une chaîne.
+
+ valueExists
+
+ Retourne si la valeur donnée existe ou non.
+
+

Le constructeur WinRegValue crée un objet WinRegValue.

+

Interwiki Languages Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/Methods" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/iskeywritable/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/iskeywritable/index.html" new file mode 100644 index 0000000000..8a95f850ed --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/iskeywritable/index.html" @@ -0,0 +1,40 @@ +--- +title: isKeyWritable +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/Méthodes/isKeyWritable +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/Methods/isKeyWritable +--- +

 

+

isKeyWritable

+

Retourne si la clef est accessible en écriture ou non.

+

Méthode de

+

Objet WinReg

+

Syntaxe

+
boolean isKeyWritable( chaîne key);
+
+

Paramètres

+

La méthode isKeyWritable a le paramètre suivant :

+
+
+ key
+
+ Une chaîne représentant le chemin de la clef.
+
+

Retours

+

Une valeur booléenne : true si la clef est accessible en écriture ; false dans le cas contraire.

+

Exemple

+
winreg = getWinRegistry();
+if ( winreg != null )
+{
+    winreg.setRootKey ( winreg.HKEY_LOCAL_MACHINE );
+    if(winreg.isKeyWritable("SOFTWARE"))
+    {
+        //isKeyWritable retourne true
+    }
+    else
+    {
+        //isKeyWritable retourne false
+    }
+
+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/Methods/isKeyWritable" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/keyexists/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/keyexists/index.html" new file mode 100644 index 0000000000..e13a16cde3 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/keyexists/index.html" @@ -0,0 +1,45 @@ +--- +title: keyExists +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/Méthodes/keyExists +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/Methods/keyExists +--- +

 

+

keyExists

+

Indique si la clef existe ou non.

+

Méthode de

+

Objet WinReg

+

Syntaxe

+
boolean keyExists ( Chaîne key);
+
+

Paramètres

+

La méthode keyExists a le paramètre suivant :

+
+
+ key
+
+ Une chaîne représentant le chemin de la clef.
+
+

Retours

+

Une valeur booléenne.

+

Description

+

Si l'utilisateur n'a pas d'accès en lecture à la clef donnée, cette méthode retourne false.

+

Exemple

+
winreg = getWinRegistry();
+if ( winreg != null )
+{
+    winreg.setRootKey( winreg.HKEY_LOCAL_MACHINE);
+    if(winreg.keyExists("SOFTWARE\\mozilla"))
+    {
+
+    //keyExists retourne true
+
+    } else {
+
+    //keyExists retourne false
+
+    }
+}
+
+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/Methods/keyExists" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/setrootkey/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/setrootkey/index.html" new file mode 100644 index 0000000000..df3bb58d97 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/setrootkey/index.html" @@ -0,0 +1,42 @@ +--- +title: setRootKey +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/Méthodes/setRootKey +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/Methods/setRootKey +--- +

 

+

setRootKey

+

Change la clef racine à laquelle on veut accéder.

+

Méthode de

+

Objet WinReg

+

Syntaxe

+
void setRootKey ( int key );
+
+

Paramètres

+

La méthode setRootKey a le paramètre suivant :

+
+
+ key
+
+ Un nombre entier représentant la clef racine dans la base de registre.
+
+

Retour

+

Aucun.

+

Description

+

La méthode setRootKey change la clef racine.

+

Lorsqu'on crée un objet WinReg, il est défini pour accéder aux clefs de la section HKEY_CLASSES_ROOT de la base de registre. Si on désire accéder à des clefs d'une autre section, il est nécessaire d'utiliser cette méthode pour changer la clef racine.

+

Sur les plate-formes Windows 16-bits, HKEY_CLASSES_ROOT est l'unique valeur validerel et cette méthode n'a aucun effet.

+

Ces clefs racines sont représentées comme champs de l'objet WinReg. Les valeurs possibles sont :

+ +

Exemple

+

Pour utiliser la section HKEY_USERS section, utiliser ce code :

+
winreg = getWinRegistry();
+winreg.setRootKey(winreg.HKEY_USERS);
+
+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/Methods/setRootKey" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/setvalue/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/setvalue/index.html" new file mode 100644 index 0000000000..c225685d24 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/setvalue/index.html" @@ -0,0 +1,42 @@ +--- +title: setValue +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/Méthodes/setValue +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/Methods/setValue +--- +

 

+

setValue

+

(Netscape 6 and Mozilla ne supporte pas cette méthode)

+

Définit la valeur d'une clef arbitraire.

+

Méthode de

+

Objet WinReg

+

Syntaxe

+
String setValue ( Chaîne subkey, Chaîne valname, valeur WinRegValue);
+
+

Paramètres

+

La méthode setValue a les paramètres suivants :

+
+
+  
+
+ Le chemin de la clef vers l'emplacement approprié dans la hiérarchie de clef, tel que"Software\\Netscape\\Navigator\\Mail".
+
+ valname
+
+ Le nom de la paire nom_de_valeur/valeur à modifier.
+
+ value
+
+ Un objet WinRegValue représentant une nouvelle valeur différente d'une chaîne. Pour plus d'informations sur ces valeurs, voir WinRegValue.
+
+
+
+ subkey
+
+

Retours

+

0 en cas de succès ; un nombre non nul si l'ordonnancement de la modification a échoué. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

 

+

Description

+

La méthode setValue définit la valeur d'une clef arbitraire. Elle est utilisée si la valeur n'est pas une chaîne. Si la valeur est une chaîne, la méthode setValueString est plus appropriée.

+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/Methods/setValue" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/setvaluenumber/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/setvaluenumber/index.html" new file mode 100644 index 0000000000..f50c659e14 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/setvaluenumber/index.html" @@ -0,0 +1,36 @@ +--- +title: setValueNumber +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/Méthodes/setValueNumber +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/Methods/setValueNumber +--- +

 

+

setValueNumber

+

Définit la valeur d'une clef lorsque cette valeur est un nombre.

+

Méthode de

+

Objet WinReg

+

Syntaxe

+
int setValueNumber ( Chaîne subkey, Chaîne valname, Nombre value );
+
+

Paramètres

+

La méthode a les paramètres suivants :

+
+
+ subkey
+
+ Le chemin de la clef vers l'emplacement approprié dans la hiérarchie de clefs, tel que"Software\\Netscape\\Navigator\\Mail".
+
+ valname
+
+ Le nom de la paire nom_de_valeur/valeur à modifier.
+
+ value
+
+ Un nombre représentant la nouvelle valeur.
+
+

Retour

+

0 en cas de succès ou un nombre non nul si l'ordonnancement de la modification a échoué. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Description

+

La méthode setValueNumber définit la valeur d'une clef lorsque cette valeur est un nombre. Cette méthode est utilisée si la valeur à définir est un nombre. Si la valeur n'est pas un nombre, il faut utiliser les méthodes setValue ou setValueString.

+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/Methods/setValueNumber" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/setvaluestring/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/setvaluestring/index.html" new file mode 100644 index 0000000000..bb0b166bd4 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/setvaluestring/index.html" @@ -0,0 +1,36 @@ +--- +title: setValueString +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/Méthodes/setValueString +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/Methods/setValueString +--- +

 

+

setValueString

+

Définit la valeur d'une clef lorsque cette valeur est une chaîne.

+

Méthode de

+

Objet WinReg

+

Syntaxe

+
int setValueString ( Chaîne subkey, Chaîne valname, Chaîne value);
+
+

Paramètres

+

La méthode setValueString a les paramètres suivants :

+
+
+ subkey
+
+ Le chemin de la clef vers l'emplacement approprié dans la hiérarchie de clefs, tel que "Software\\Netscape\\Navigator\\Mail".
+
+ valname
+
+ Le nom de la paire nom_de_valeur/valeur à modifier.
+
+ value
+
+ La nouvelle valeur chaîne.
+
+

Retour

+

0 en cas de succès ou un nombre non nul si l'ordonnancement de la modification a échoué. Pour la liste complète des valeurs possibles, voir Codes retournés.

+

Description

+

La méthode setValueString définit la valeur d'une clef lorsque cette valeur est une chaîne. Cette méthode est utilisée si la valeur qu'on veut définir est une chaîne. Dans le cas contraire, il faut utiliser la méthode setValue.

+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/Methods/setValueString" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/valueexists/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/valueexists/index.html" new file mode 100644 index 0000000000..c879f01034 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/m\303\251thodes/valueexists/index.html" @@ -0,0 +1,43 @@ +--- +title: valueExists +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/Méthodes/valueExists +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/Methods/valueExists +--- +

 

+

valueExists

+

Retourne si une valeur existe pour une clé données.

+

Méthode de

+

Objet WinReg

+

Syntaxe

+
boolean valueExists ( chaîne key, chaîne value );
+
+

Paramètres

+

La méthode valueExists a les paramètres suivants :

+
+
+ key
+
+ Une chaîne représentant le chemin de la clef.
+
+ value
+
+ Une chaîne représentant la valeur à chercher.
+
+

Retour

+

Une valeur booléenne : true si la clef existe et si l'utilisateur a accès en lecture, false dans le cas contraire.

+

Exemple

+
winreg = getWinRegistry();
+if ( winreg != null )
+{
+    winreg.setRootKey( winreg.HKEY_LOCAL_MACHINE);
+    if(winreg.valueExists("SOFTWARE\\mozilla", "value name"))
+    {
+    //valueExists retourne true
+    } else {
+    //valueExists retourne false
+    }
+}
+
+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/Methods/valueExists" } ) }}

diff --git "a/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/winregvalue/index.html" "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/winregvalue/index.html" new file mode 100644 index 0000000000..2d3fe83cb1 --- /dev/null +++ "b/files/fr/archive/mozilla/xpinstall/r\303\251f\303\251rence_de_l_api_xpinstall/objet_winreg/winregvalue/index.html" @@ -0,0 +1,62 @@ +--- +title: WinRegValue +slug: >- + Archive/Mozilla/XPInstall/Référence_de_l_API_XPInstall/Objet_WinReg/WinRegValue +translation_of: Archive/Mozilla/XPInstall/Reference/WinReg_Object/WinRegValue +--- +

 

+

Constructeur winRegValue

+

(Microsoft Windows uniquement)

+

Crée un objet WinRegValue.

+

Syntaxe

+
WinRegValue ( int datatype, byte[] regdata);
+
+

Paramètres

+

Le contructeur WinRegValue a les paramètres suivants :

+
+
+ datatype
+
+ Un nombre entier indiquant le type de données compris dans cet objet. Les valeurs possibles sont : +
+
+ WinRegValue.REG_SZ = 1
+
+ WinRegValue.REG_EXPAND_SZ = 2
+
+ WinRegValue.REG_BINARY = 3
+
+ WinRegValue.REG_DWORD = 4
+
+ WinRegValue.REG_DWORD_LITTLE_ENDIAN = 4
+
+ WinRegValue.REG_DWORD_BIG_ENDIAN = 5
+
+ WinRegValue.REG_LINK = 6
+
+ WinRegValue.REG_MULTI_SZ = 7
+
+ WinRegValue.REG_RESOURCE_LIST = 8
+
+ WinRegValue.REG_FULL_RESOURCE_DESCRIPTOR = 9
+
+ WinRegValue.REG_RESOURCE_REQUIREMENTS_LIST = 10
+
+
+
+
+
+ regdata
+
+ Un tableau Java + + bytes + contenant les données.
+
+

Retour

+

Un nouvel objet WinRegValue, avec le type de données compris et les données définies aux valeurs passées à ce constructeur.

+

Description

+

Les développeurs Windows avancés peuvent utiliser cet objet pour manipuler des valeurs qui ne sont pas des chaînes dans la base de registre de Microsoft Windows.

+

Un objet de ce type a deux champs : le type des données et la valeur. Pour plus d'informations sur les types des données possibles pour une valeur du registre, voir la documentation de l'API Windows. Vous fournissez la valeur de ces champs au constructeur de cette classe.

+

Interwiki Language Links

+

{{ languages( { "en": "en/XPInstall_API_Reference/WinReg_Object/WinRegValue" } ) }}

diff --git a/files/fr/archive/mozilla/xul/attributs/acceltext/index.html b/files/fr/archive/mozilla/xul/attributs/acceltext/index.html new file mode 100644 index 0000000000..c48e829509 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/acceltext/index.html @@ -0,0 +1,18 @@ +--- +title: acceltext +slug: Archive/Mozilla/XUL/Attributs/acceltext +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/acceltext +--- +
+ « Accueil de la référence XUL
+
+
+ acceltext
+
+ Type : chaîne de caractères
+
+ Texte qui apparaîtra à côté du label d'un menu pour indiquer la touche de raccourci (accélérateur) à utiliser pour invoquer la commande. Si cette valeur est définie, elle écrase une clé assignée dans l'attribut key. Cet attribut ne s'applique pas aux menus directement sur la Barre de menus (menubar).
+
diff --git a/files/fr/archive/mozilla/xul/attributs/accesskey/index.html b/files/fr/archive/mozilla/xul/attributs/accesskey/index.html new file mode 100644 index 0000000000..4b89962e66 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/accesskey/index.html @@ -0,0 +1,26 @@ +--- +title: accesskey +slug: Archive/Mozilla/XUL/Attributs/accesskey +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/accesskey +--- +
« Accueil de la référence XUL
+
accesskey
+
Attribut de : button, checkbox, caption, description, label, listitem, menu, menuitem, menulist, tab, radio, toolbarbutton, textbox (autocomplétion de Firefox)
+
Type : caractère +
Cet attribut doit être une lettre utilisée comme touche de raccourci. Cette lettre doit être un des caractères apparaissant dans l'attribut label de l'élément.
Elle sera généralement affichée soulignée, mais ce comportement est spécifique à la plateforme et au thème. Lorsque l'utilisateur appuie sur ALT (ou une touche similaire variant d'une plateforme à l'autre) et la touche d'accès, l'élément sera activé depuis n'importe où dans la fenêtre. Bien que la valeur ne soit pas sensible à la casse, la lettre correspondant à la casse de l'attribut accesskey sera utlisée si les deux casses existent dans le label. +
+

Exemple

+
Image:XUL_ref_accesskey_attr.png
+
<vbox>
+  <label value="Entrez votre nom" accesskey="e" control="myName"/>
+  <textbox id="myName"/>
+  <button label="Annuler" accesskey="n"/>
+  <button label="OK" accesskey="O"/>
+</vbox>
+
+

Voir également

+

Les attributs label et acceltext +

diff --git a/files/fr/archive/mozilla/xul/attributs/align/index.html b/files/fr/archive/mozilla/xul/attributs/align/index.html new file mode 100644 index 0000000000..46e84c1900 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/align/index.html @@ -0,0 +1,36 @@ +--- +title: align +slug: Archive/Mozilla/XUL/Attributs/align +tags: + - Attributs_XUL + - Référence_XUL + - XUL +translation_of: Archive/Mozilla/XUL/Attribute/align +--- +
+ « Accueil de la référence XUL
+
+
+ align
+
+ Type : + + une des valeurs ci-dessous +
+
+ L'attribut align spécifie la manière dont les éléments enfants de la boîte sont alignés lorsque la taille de celle-ci est plus grande que la taille totale de ses enfants. Pour les boîtes orientées horizontalement, il spécifie la manière dont les enfants seront alignés verticalement. Pour les boîtes dont l'orientation est verticale, il est utilisé pour indiquer la manière dont ils seront alignés horizontalement. L'attribut pack est lié à l'alignement mais est utilisé pour spécifier la position dans la direction opposée. Il est également possible de spécifier la valeur d'align à l'aide de la propriété de style -moz-box-align.
+
+ +
+

Voir également

+

L'attribut pack.

+
diff --git a/files/fr/archive/mozilla/xul/attributs/allowevents/index.html b/files/fr/archive/mozilla/xul/attributs/allowevents/index.html new file mode 100644 index 0000000000..79ccf6cd21 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/allowevents/index.html @@ -0,0 +1,19 @@ +--- +title: allowevents +slug: Archive/Mozilla/XUL/Attributs/allowevents +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/allowevents +--- +
« Accueil de la référence XUL
+
allowevents +
Type : booléen +
Si défini à true, les évènements sont passés aux enfants de l'élément. Dans le cas contraire, ils ne sont passés qu'à l'élément lui-même. +
+
+

Sur les éléments listitem et titlebar, les évènements souris ne sont normalement pas envoyés aux enfants ; ils sont plutôt redirigés vers les éléments listitem et titlebar eux-mêmes. Cela signifie que les éléments placés dans un listitem ne répondent pas aux évènements, et qu'un clic de la souris sélectionne simplement cet objet dans la liste. En définissant l'attribut allowevents à true, ce comportement particulier est désactivé, et les évènements sont dirigés de la même manière que pour les autres éléments. +

Pour les éléments menu, menuseparator, menuitem et treecol, ainsi que les boutons de menus et le popup datepicker, les évènements souris sont également redirigés vers l'élément lui-même. Cependant, l'attribut allowevents est traité d'une manière différente. Il peut alors être défini à true sur un descendant à la place. C'est ce qui permet aux évènements d'être ciblés normalement, mais d'être différents pour chaque descendant. +

Ce comportement est notamment utilisé pour des menus, afin de permettre à un bouton de menu de se comporter comme un menu lors d'un clic, tandis qu'une partie du menu pourra se comporter comme un bouton. Pour cette dernière, l'attribut allowevents est défini à true pour qu'un clic sur le bouton enfant reçoive les évènements plutôt qu'il soient tous dirigés vers le menu. +

+
diff --git a/files/fr/archive/mozilla/xul/attributs/allownegativeassertions/index.html b/files/fr/archive/mozilla/xul/attributs/allownegativeassertions/index.html new file mode 100644 index 0000000000..f45b88d10c --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/allownegativeassertions/index.html @@ -0,0 +1,17 @@ +--- +title: allownegativeassertions +slug: Archive/Mozilla/XUL/Attributs/allownegativeassertions +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/allownegativeassertions +--- +
« Accueil de la référence XUL
+
allownegativeassertions +
Type : booléen +
Valide sur tout élément disposant d'un attribut datasources. Lorsque plusieurs sources de données sont utilisées, l'une d'entre-elles peut écraser une assertion provenant d'une autre. Si cet attribut est à true, ce qui est sa valeur par défaut, une source de données peut contredire une assertion précédente. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/buttondisabledaccept/index.html b/files/fr/archive/mozilla/xul/attributs/buttondisabledaccept/index.html new file mode 100644 index 0000000000..0e465ffa3a --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/buttondisabledaccept/index.html @@ -0,0 +1,18 @@ +--- +title: buttondisabledaccept +slug: Archive/Mozilla/XUL/Attributs/buttondisabledaccept +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/buttondisabledaccept +--- +
« Accueil de la référence XUL
+
buttondisabledaccept +
Type : booléen +
Si défini à true, le bouton d'acceptation est initialement désactivé. +
+


+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/checked/index.html b/files/fr/archive/mozilla/xul/attributs/checked/index.html new file mode 100644 index 0000000000..688f898817 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/checked/index.html @@ -0,0 +1,24 @@ +--- +title: checked +slug: Archive/Mozilla/XUL/Attributs/checked +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/checked +--- +
+ « Accueil de la référence XUL
+
+
+ checked
+
+ Type : + + booléen +
+
+ Indique si l'élément est coché ou non.
+
+ Utilisez hasAttribute() pour déterminer si cet attribut est défini plutôt que getAttribute().
+ Pour les boutons, l'attribut type doit etre mis à checkbox ou à radio pour qu'un effet soit perceptible.
+
diff --git a/files/fr/archive/mozilla/xul/attributs/class/index.html b/files/fr/archive/mozilla/xul/attributs/class/index.html new file mode 100644 index 0000000000..04ee6410f4 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/class/index.html @@ -0,0 +1,15 @@ +--- +title: class +slug: Archive/Mozilla/XUL/Attributs/class +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/class +--- +
« Accueil de la référence XUL
+
class +
Type : chaîne de caractères +
La classe de style de l'élément. Plusieurs classes peuvent être spécifiées en les séparant par des espaces. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/coalesceduplicatearcs/index.html b/files/fr/archive/mozilla/xul/attributs/coalesceduplicatearcs/index.html new file mode 100644 index 0000000000..83dff23276 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/coalesceduplicatearcs/index.html @@ -0,0 +1,17 @@ +--- +title: coalesceduplicatearcs +slug: Archive/Mozilla/XUL/Attributs/coalesceduplicatearcs +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/coalesceduplicatearcs +--- +
« Accueil de la référence XUL
+
coalesceduplicatearcs +
Type : booléen +
Valide sur tout élément disposant d'un attribut datasources. Lorsque plusieurs sources de données sont utilisées, l'une d'entre-elles peut écraser une assertion provenant d'une autre. Si cet attribut est à true, ce qui est sa valeur par défaut, une source de données peut contredire une assertion précédente. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/collapsed/index.html b/files/fr/archive/mozilla/xul/attributs/collapsed/index.html new file mode 100644 index 0000000000..c6b879a729 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/collapsed/index.html @@ -0,0 +1,17 @@ +--- +title: collapsed +slug: Archive/Mozilla/XUL/Attributs/collapsed +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/collapsed +--- +
« Accueil de la référence XUL
+
collapsed +
Type : booléen +
Si défini à true, l'élément est réduit et n'est pas visible. C'est l'équivalent de définir la propriété CSS visibility à « collapse ». +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/command/index.html b/files/fr/archive/mozilla/xul/attributs/command/index.html new file mode 100644 index 0000000000..e240ec9f15 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/command/index.html @@ -0,0 +1,23 @@ +--- +title: command +slug: Archive/Mozilla/XUL/Attributs/command +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/command +--- +
« Accueil de la référence XUL
+
command +
Type : id d'élément +
Défini à la valeur de l'id d'un élément command observé par l'élément. +
+
+

Exemple

+
<command id="cmd_openhelp" oncommand="alert('Aide');"/>
+<button label="Aide" command="cmd_openhelp"/>
+<button label="Plus d'aide" command="cmd_openhelp"/>
+
+

Voir également

+

L'élément command, l'attribut oncommand et l'élément commandset. +

+
diff --git a/files/fr/archive/mozilla/xul/attributs/container/index.html b/files/fr/archive/mozilla/xul/attributs/container/index.html new file mode 100644 index 0000000000..da385d1751 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/container/index.html @@ -0,0 +1,17 @@ +--- +title: container +slug: Archive/Mozilla/XUL/Attributs/container +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/container +--- +
« Accueil de la référence XUL
+
container +
Type : booléen +
Défini à true si l'élément doit agir comme un conteneur pouvant avoir des éléments enfants. Ceci peut être utilisé pour des dossiers. Cet attribut sera défini par le constructeur de template si nécessaire. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/containment/index.html b/files/fr/archive/mozilla/xul/attributs/containment/index.html new file mode 100644 index 0000000000..47d917f06b --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/containment/index.html @@ -0,0 +1,19 @@ +--- +title: containment +slug: Archive/Mozilla/XUL/Attributs/containment +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/containment +--- +
« Accueil de la référence XUL
+
containment +
Type : URI d'un prédicat RDF +
Cet attribut spécifie des propriétés RDF indiquant qu'ne ressource est un conteneur. Lors de la génération de contenu depuis un template, ceci est utilisé pour déterminer quelles ressources de la source de données sont des conteneurs et peuvent donc avoir des nœuds enfants, et lesquelles ne le sont pas. +
+
Cet attribut doit être placé sur le même élément que les attributs datasources et ref. Il peut être défini comme une liste de propriétés ou ressources RDF séparées par des espaces. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/context/index.html b/files/fr/archive/mozilla/xul/attributs/context/index.html new file mode 100644 index 0000000000..13e130ea04 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/context/index.html @@ -0,0 +1,17 @@ +--- +title: context +slug: Archive/Mozilla/XUL/Attributs/context +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/context +--- +
« Accueil de la référence XUL
+
context +
Type : id de l'élément popup +
Doit être défini à la valeur de l'id de l'élément popup devant apparaître lorsque l'utilisateur fait un clic contextuel sur l'élément. La manière de réaliser un clic contextuel diffère selon la plateforme. Habituellement il s'agira d'un clic droit. La valeur spéciale « _child » peut être utilisée pour indiquer le premier menupopup enfant de l'élément. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/contextmenu/index.html b/files/fr/archive/mozilla/xul/attributs/contextmenu/index.html new file mode 100644 index 0000000000..9f11c2f1d6 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/contextmenu/index.html @@ -0,0 +1,17 @@ +--- +title: contextmenu +slug: Archive/Mozilla/XUL/Attributs/contextmenu +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/contextmenu +--- +
« Accueil de la référence XUL
+
contextmenu +
Type : id d'un élément popup +
Nom alternatif pour l'attribut context, mais dispose également d'une propriété de script correspondante « contextmenu ». +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/crop/index.html b/files/fr/archive/mozilla/xul/attributs/crop/index.html new file mode 100644 index 0000000000..6ee6cd1d52 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/crop/index.html @@ -0,0 +1,26 @@ +--- +title: crop +slug: Archive/Mozilla/XUL/Attributs/crop +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/crop +--- +
« Accueil de la référence XUL
+
crop +
Type : une des valeurs ci-dessous +
Si le label de l'élément est trop long pour être contenu dans son espace donné, le texte sera tronqué du côté indiqué par l'attribut crop. Une ellipse (…) sera utilisée à la place du texte tronqué. Si la direction de la boîte est inversée, le tronquage l'est également. +
+ +
+
Selon la plateforme et le thème utilisé, certains éléments auront une largeur maximale définie de sorte qu'ils seront toujours tronqués. Si vous décidez d'utiliser la valeur none et que le texte est plus grand que cette valeur maximale, vous pouvez faire usage de la propriété CSS max-width (ou de l'attribut maxwidth) pour agrandir cette taille. Par exemple, pour un élément de menu vous pouvez ajouter la règle CSS suivante lorsque vous désirez utiliser la valeur none : +
+
menupopup > menuitem, menupopup > menu { max-width: none; }
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/datasources/index.html b/files/fr/archive/mozilla/xul/attributs/datasources/index.html new file mode 100644 index 0000000000..98dd93bbe1 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/datasources/index.html @@ -0,0 +1,21 @@ +--- +title: datasources +slug: Archive/Mozilla/XUL/Attributs/datasources +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/datasources +--- +
« Accueil de la référence XUL
+
datasources +
Type : liste d'URI datasource séparées par des espaces +
Une liste séparée par des espaces de sources de données que le template d'un élément utilisera pour la génération de contenu. Il peut s'agir tant de sources de données internes comme rdf:bookmarks que de l'URL d'un fichier RDF. L'attribut datasources peut être placé sur la plupart des éléments, bien qu'il se trouve le plus souvent sur des arbres (tree) et menupopups. L'élément doit avoir un élément de template comme enfant. +
+
Les sources de données spécifiées sont combinées en une source de données composite unique qui conserve les données de toutes les sources. Cette source composite est accessible via un script au travers de la propriété database. +
+
Si vous envisagez d'ajouter une source de données à un élément mais ne désirez pas l'ajouter immédiatement, définissez cette propriété à « rdf:null ». Cela préparera l'élément à ce que son contenu soit généré depuis une source de données. Autrement, il ne sera pas possible d'en ajouter une par la suite. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/datepicker.type/index.html b/files/fr/archive/mozilla/xul/attributs/datepicker.type/index.html new file mode 100644 index 0000000000..6046455950 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/datepicker.type/index.html @@ -0,0 +1,40 @@ +--- +title: datepicker.type +slug: Archive/Mozilla/XUL/Attributs/datepicker.type +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/datepicker.type +--- +
+ « Accueil de la référence XUL
+
+
+ type
+
+ Type : une des valeurs suivantes
+
+ L'attribut type peut avoir l'une des valeurs ci-dessous afin de spécifier le type de sélecteur de date à utiliser :
+
+ +
+
+
+ Type normal
+
+ Image:Controlsguide-datepicker.png
+
+ Type grid
+
+ Image:Controlsguide-datepicker-grid.png
+
+ Type popup
+
+ Image:Controlsguide-datepicker-popup.png
+
+
+

 

diff --git a/files/fr/archive/mozilla/xul/attributs/datepicker.value/index.html b/files/fr/archive/mozilla/xul/attributs/datepicker.value/index.html new file mode 100644 index 0000000000..a05c4e5b51 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/datepicker.value/index.html @@ -0,0 +1,18 @@ +--- +title: datepicker.value +slug: Archive/Mozilla/XUL/Attributs/datepicker.value +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/datepicker.value +--- +
+ « Accueil de la référence XUL
+
+
+ value
+
+ Type : chaîne
+
+ La valeur initiale du sélecteur de date sous la forme AAAA/MM/JJ.
+
diff --git a/files/fr/archive/mozilla/xul/attributs/dir/index.html b/files/fr/archive/mozilla/xul/attributs/dir/index.html new file mode 100644 index 0000000000..a2f4cce3d4 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/dir/index.html @@ -0,0 +1,32 @@ +--- +title: dir +slug: Archive/Mozilla/XUL/Attributs/dir +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/dir +--- +
+ « Accueil de la référence XUL
+
+
+ dir
+
+ Type : + + une des valeurs ci-dessous +
+
+ La direction dans laquelle les éléments enfants de l'élément seront placés.
+
+ +
+

Voir également

+ +
+

 

diff --git a/files/fr/archive/mozilla/xul/attributs/disabled/index.html b/files/fr/archive/mozilla/xul/attributs/disabled/index.html new file mode 100644 index 0000000000..a397863950 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/disabled/index.html @@ -0,0 +1,21 @@ +--- +title: disabled +slug: Archive/Mozilla/XUL/Attributs/disabled +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/disabled +--- +
« Accueil de la référence XUL
+
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
L'élément répondra cependant encore aux évènements souris. Pour activer l'élément, ne spécifiez simplement pas cet attribut plutôt que de définir sa valeur à false. +
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
diff --git a/files/fr/archive/mozilla/xul/attributs/empty/index.html b/files/fr/archive/mozilla/xul/attributs/empty/index.html new file mode 100644 index 0000000000..0dc77fd889 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/empty/index.html @@ -0,0 +1,15 @@ +--- +title: empty +slug: Archive/Mozilla/XUL/Attributs/empty +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/empty +--- +
« Accueil de la référence XUL
+
empty +
Type : booléen +
Défini à true si l'élément est un conteneur qui ne contient aucun enfant. Il sera défini par le constructeur de template si nécessaire. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/equalsize/index.html b/files/fr/archive/mozilla/xul/attributs/equalsize/index.html new file mode 100644 index 0000000000..c9af38b1aa --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/equalsize/index.html @@ -0,0 +1,18 @@ +--- +title: equalsize +slug: Archive/Mozilla/XUL/Attributs/equalsize +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/equalsize +--- +
« Accueil de la référence XUL
+
equalsize +
Type : une des valeurs ci-dessous +
Cet attribut peut être utilisé pour rendre les enfants d'un élément égaux en taille. +
+ +
+
diff --git a/files/fr/archive/mozilla/xul/attributs/firstdayofweek/index.html b/files/fr/archive/mozilla/xul/attributs/firstdayofweek/index.html new file mode 100644 index 0000000000..c94dc80095 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/firstdayofweek/index.html @@ -0,0 +1,17 @@ +--- +title: firstdayofweek +slug: Archive/Mozilla/XUL/Attributs/firstdayofweek +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/firstdayofweek +--- +
« Accueil de la référence XUL
+
firstdayofweek +
Type : entier +
Indique le jour de la semaine à afficher comme premier jour dans la grille. Les valeurs vont de 0 à 6, où 0 est dimanche et 6 est samedi. La valeur par défaut est déterminée par la locale, n'utilisez donc cet attribut que si vous désirez l'écraser. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/flags/index.html b/files/fr/archive/mozilla/xul/attributs/flags/index.html new file mode 100644 index 0000000000..28e4635cac --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/flags/index.html @@ -0,0 +1,20 @@ +--- +title: flags +slug: Archive/Mozilla/XUL/Attributs/flags +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/flags +--- +
« Accueil de la référence XUL
+
flags +
Type : liste de valeurs (voir ci-dessous) séparées par des espaces +
Un ensemble de drapeaux destinés à différentes utilisations. Deux sont définis, et peuvent être la valeur de cet attribut. +
+ +


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/flex/index.html b/files/fr/archive/mozilla/xul/attributs/flex/index.html new file mode 100644 index 0000000000..cd561f66c1 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/flex/index.html @@ -0,0 +1,14 @@ +--- +title: flex +slug: Archive/Mozilla/XUL/Attributs/flex +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/flex +--- +
« Accueil de la référence XUL
+
flex +
Type : chaîne de caractères (représentant un entier) +
Indique la flexibilité de l'élément, c'est-à-dire la façon dont le conteneur d'un élément distribue l'espace libre restant parmi ses enfants. Les éléments flexibles s'étendent et rétrécissent pour remplir leur espace donné. Les éléments qui ont les plus grandes valeurs pour flex seront plus grands que ceux qui ont des valeurs plus petites, selon un rapport déterminé par les valeurs données par chaque élément. La valeur réelle n'est pas indicative, à moins qu'il y ait d'autres éléments flexibles dans le même conteneur. Une fois que les tailles par défaut des éléments dans une boîte ont été calculées, l'espace restant est divisé entre les éléments flexibles, selon leurs coefficients pour flex. Indiquer une valeur de 0 pour flex équivaut à ne pas préciser du tout d'attribut flex.
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/height/index.html b/files/fr/archive/mozilla/xul/attributs/height/index.html new file mode 100644 index 0000000000..967d50b72f --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/height/index.html @@ -0,0 +1,15 @@ +--- +title: height +slug: Archive/Mozilla/XUL/Attributs/height +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/height +--- +
« Accueil de la référence XUL
+
height +
Type : chaîne de caractères (représentant un entier) +
La hauteur préférée de l'élément en pixels. La hauteur réellement affichée peut être différentes si l'élément ou son contenu ont une hauteur minimum ou maximum. La propriété CSS height peut également être utilisée. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/helpuri/index.html b/files/fr/archive/mozilla/xul/attributs/helpuri/index.html new file mode 100644 index 0000000000..e168011f5e --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/helpuri/index.html @@ -0,0 +1,18 @@ +--- +title: helpURI +slug: Archive/Mozilla/XUL/Attributs/helpURI +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/helpURI +--- +
+ « Accueil de la référence XUL
+
+
+ helpURI
+
+ Type : URI
+
+ L'URI de la page d'aide associée avec un panneau de préférences. Celle-ci sera ouverte dans une fenêtre d'aide lors de l'appui sur le bouton d'aide.
+
diff --git a/files/fr/archive/mozilla/xul/attributs/hidden/index.html b/files/fr/archive/mozilla/xul/attributs/hidden/index.html new file mode 100644 index 0000000000..ad1afbfed5 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/hidden/index.html @@ -0,0 +1,15 @@ +--- +title: hidden +slug: Archive/Mozilla/XUL/Attributs/hidden +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/hidden +--- +
« Accueil de la référence XUL
+
hidden +
Type : booléen +
Si défini à true, l'élément n'est pas affiché. Cet attribut est similaire à la valeur « none » de la propriété CSS display. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/hidechrome/index.html b/files/fr/archive/mozilla/xul/attributs/hidechrome/index.html new file mode 100644 index 0000000000..9793b3aced --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/hidechrome/index.html @@ -0,0 +1,15 @@ +--- +title: hidechrome +slug: Archive/Mozilla/XUL/Attributs/hidechrome +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/hidechrome +--- +
« Accueil de la référence XUL
+
hidechrome +
Type : booléen +
Définissez cet attribut à true pour que le chrome, en ce compris la barre de titre, soit caché. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/hideseconds/index.html b/files/fr/archive/mozilla/xul/attributs/hideseconds/index.html new file mode 100644 index 0000000000..1ba80accbe --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/hideseconds/index.html @@ -0,0 +1,18 @@ +--- +title: hideseconds +slug: Archive/Mozilla/XUL/Attributs/hideseconds +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/hideseconds +--- +
+ « Accueil de la référence XUL
+
+
+ hideseconds
+
+ Type : booléen
+
+ Indique si le champ des secondes doit être masqué.
+
diff --git a/files/fr/archive/mozilla/xul/attributs/id/index.html b/files/fr/archive/mozilla/xul/attributs/id/index.html new file mode 100644 index 0000000000..5c27d4d48d --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/id/index.html @@ -0,0 +1,38 @@ +--- +title: id +slug: Archive/Mozilla/XUL/Attributs/id +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/id +--- +
« Accueil de la référence XUL
+
id +
Type : id d'élément, doit être unique dans la fenêtre +
Un identifiant unique permettant d'identifier l'élément. Celui-ci peut être utilisé comme paramètre pour getElementById() et d'autres fonctions DOM et pour référencer l'élément dans des feuilles de style. +
+
+

Exemple

+
<button id="foo" label="Cliquez ici" oncommand="doSomething()"/>
+
+<script>
+function doSomething(){
+    var myButton = document.getElementById('foo');
+    myButton.setAttribute('label','On a cliqué sur le bouton');
+}
+</script>
+
+

Une version plus abstraite de ce code serait un +

+
<button id="foo" label="Cliquez ici" oncommand="setWidgetLabel(this, 'On m\' a cliqué dessus')"/>
+<script>
+function setWidgetLabel(idName, newCaption){
+   document.getElementById( idName.id ).setAttribute('label',newCaption)
+}
+
+</script>
+
+

Voir également

+

name +

+
diff --git a/files/fr/archive/mozilla/xul/attributs/image/index.html b/files/fr/archive/mozilla/xul/attributs/image/index.html new file mode 100644 index 0000000000..b9e988be89 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/image/index.html @@ -0,0 +1,18 @@ +--- +title: image +slug: Archive/Mozilla/XUL/Attributs/image +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/image +--- +
« Accueil de la référence XUL
+
image +
Type : URL d'une image +
L'URL de l'image devant apparaître sur l'élément. Si cet attribut est vide ou omis, aucune image n'apparaîtra. La position de l'image est déterminée par les attributs dir et orient. +
+
+

Voir également

+ +
diff --git a/files/fr/archive/mozilla/xul/attributs/increment/index.html b/files/fr/archive/mozilla/xul/attributs/increment/index.html new file mode 100644 index 0000000000..7c279c8953 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/increment/index.html @@ -0,0 +1,21 @@ +--- +title: increment +slug: Archive/Mozilla/XUL/Attributs/increment +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/increment +--- +
+ « Accueil de la référence XUL
+
+
+ increment
+
+ Type : + + entier +
+
+ La quantité dont l'attribut value (pour les boîtes numériques et les échelles) or curpos<magic name="\"PAGENAME\"/"> (pour les barres de défilement) </magic> change lorsque l'on clique sur les flèches. La valeur par défaut est 1.
+
diff --git a/files/fr/archive/mozilla/xul/attributs/index.html b/files/fr/archive/mozilla/xul/attributs/index.html new file mode 100644 index 0000000000..ca4be7d5ed --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/index.html @@ -0,0 +1,281 @@ +--- +title: Attributs +slug: Archive/Mozilla/XUL/Attributs +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute +--- +

« Accueil de la référence XUL

+ +
+ +
+ +
 
diff --git a/files/fr/archive/mozilla/xul/attributs/insertafter/index.html b/files/fr/archive/mozilla/xul/attributs/insertafter/index.html new file mode 100644 index 0000000000..8c5d0db612 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/insertafter/index.html @@ -0,0 +1,17 @@ +--- +title: insertafter +slug: Archive/Mozilla/XUL/Attributs/insertafter +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/insertafter +--- +
« Accueil de la référence XUL
+
insertafter +
Type : id d'élément +
Lorsqu'un élément est un overlay, l'attribut insertafter spécifie l'id de l'élément dans la fenêtre de base après lequel l'élément overlay doit apparaitre. Cet attribut a priorité sur l'attribut insertbefore. Cette valeur peut être une liste d'id séparés par des virgules, et c'est alors le premier d'entre-eux trouvé dans la fenêtre qui sera utilisé. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/insertbefore/index.html b/files/fr/archive/mozilla/xul/attributs/insertbefore/index.html new file mode 100644 index 0000000000..ad0d6731d2 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/insertbefore/index.html @@ -0,0 +1,17 @@ +--- +title: insertbefore +slug: Archive/Mozilla/XUL/Attributs/insertbefore +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/insertbefore +--- +
« Accueil de la référence XUL
+
insertbefore +
Type : id d'élément +
Lorsqu'un élément est un overlay, l'attribut insertafter spécifie l'id de l'élément dans la fenêtre de base avant lequel l'élément overlay doit apparaitre. Cette valeur peut être une liste d'id séparés par des virgules, et c'est alors le premier d'entre-eux trouvé dans la fenêtre qui sera utilisé. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/instantapply/index.html b/files/fr/archive/mozilla/xul/attributs/instantapply/index.html new file mode 100644 index 0000000000..2b4c0b74bf --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/instantapply/index.html @@ -0,0 +1,17 @@ +--- +title: instantApply +slug: Archive/Mozilla/XUL/Attributs/instantApply +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/instantApply +--- +
« Accueil de la référence XUL
+
instantApply +
Type : booléen +
Si sa valeur est true, la préférence sera modifiée dès que l'élément d'interface utilisateur est modifié. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/inverted/index.html b/files/fr/archive/mozilla/xul/attributs/inverted/index.html new file mode 100644 index 0000000000..0b5241236e --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/inverted/index.html @@ -0,0 +1,17 @@ +--- +title: inverted +slug: Archive/Mozilla/XUL/Attributs/inverted +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/inverted +--- +
« Accueil de la référence XUL
+
inverted +
Type : booléen +
Pour les préférences booléennes, l'indication de cet attribut à true indique que la valeur de la préférence est l'inverse de celle de l'élément d'interface utilisateur qui y est attaché. Par exemple, elle fait en sorte que cocher une case désactive la préférence associée au lieu de l'activer. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/label/index.html b/files/fr/archive/mozilla/xul/attributs/label/index.html new file mode 100644 index 0000000000..afe9b0ed31 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/label/index.html @@ -0,0 +1,33 @@ +--- +title: label +slug: Archive/Mozilla/XUL/Attributs/label +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/label +--- +
« Accueil de la référence XUL
+
label +
Type : chaîne de caractères +
Le label qui apparaîtra sur l'élément. S'il n'est pas spécifié, aucun texte n'apparaîtra. +
+
+

Voir également

+ +

Exemples en JavaScript

+
<label value="Whaw" id="the-big-label" command="the-big-button"/>
+<button id="the-big-button" label="Cliquez ici"
+	oncommand="alert(document.getElementById('the-big-label').value)"/>
+
+<label id="myLabel" value="Mon label"/>
+<button label="Cliquez ici"
+	oncommand="document.getElementById('myLabel').setAttribute('value','Valeur modifiée');" />
+
+<checkbox label="ma case à cocher" id="myCheckboX"/>
+<button label="Un autre clic"
+	oncommand="document.getElementById('myCheckboX').setAttribute('label','Toujours pas cochée');"/>
+<button label="Afficher le label de la checkbox"
+	oncommand="alert( document.getElementById('myCheckboX').getAttribute('label') )"/>
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/left/index.html b/files/fr/archive/mozilla/xul/attributs/left/index.html new file mode 100644 index 0000000000..1a4529d526 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/left/index.html @@ -0,0 +1,15 @@ +--- +title: left +slug: Archive/Mozilla/XUL/Attributs/left +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/left +--- +
« Accueil de la référence XUL
+
left +
Type : chaîne de caractères (représentant un entier) +
Pour les éléments placés directement dans un stack, spécifie la distance en pixels du bord gauche de l'élément par rapport au bord gauche du stack. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/max/index.html b/files/fr/archive/mozilla/xul/attributs/max/index.html new file mode 100644 index 0000000000..5d671a265e --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/max/index.html @@ -0,0 +1,21 @@ +--- +title: max +slug: Archive/Mozilla/XUL/Attributs/max +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/max +--- +
+ « Accueil de la référence XUL
+
+
+ max
+
+ Type : + + entier +
+
+ La valeur maximum que peut prendre l'élément scale ou number box. La valeur par défaut est 100 pour les éléments scale et Infinity pour les boîtes numériques
+
diff --git a/files/fr/archive/mozilla/xul/attributs/maxheight/index.html b/files/fr/archive/mozilla/xul/attributs/maxheight/index.html new file mode 100644 index 0000000000..57b9480a9a --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/maxheight/index.html @@ -0,0 +1,15 @@ +--- +title: maxheight +slug: Archive/Mozilla/XUL/Attributs/maxheight +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/maxheight +--- +
« Accueil de la référence XUL
+
maxheight +
Type : chaîne de caractères (représentant un entier) +
La hauteur maximum de l'élément. Ceci correspond à la propriété CSS max-height. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/maxwidth/index.html b/files/fr/archive/mozilla/xul/attributs/maxwidth/index.html new file mode 100644 index 0000000000..3bb415967d --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/maxwidth/index.html @@ -0,0 +1,15 @@ +--- +title: maxwidth +slug: Archive/Mozilla/XUL/Attributs/maxwidth +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/maxwidth +--- +
« Accueil de la référence XUL
+
maxwidth +
Type : chaîne de caractères (représentant un entier) +
La largeur maximum de l'élément. Ceci correspond à la propriété CSS max-width. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/menu/index.html b/files/fr/archive/mozilla/xul/attributs/menu/index.html new file mode 100644 index 0000000000..d1c01d2937 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/menu/index.html @@ -0,0 +1,15 @@ +--- +title: menu +slug: Archive/Mozilla/XUL/Attributs/menu +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/menu +--- +
« Accueil de la référence XUL
+
menu +
Type : id d'un élément popup +
Nom alternatif pour l'attribut popup, mais dispose également d'une propriété de script « menu ». +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/min/index.html b/files/fr/archive/mozilla/xul/attributs/min/index.html new file mode 100644 index 0000000000..4bdf8e4479 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/min/index.html @@ -0,0 +1,21 @@ +--- +title: min +slug: Archive/Mozilla/XUL/Attributs/min +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/min +--- +
+ « Accueil de la référence XUL
+
+
+ min
+
+ Type : + + entier +
+
+ La valeur minimum que peut prendre l'élément. La valeur par défaut est 0.
+
diff --git a/files/fr/archive/mozilla/xul/attributs/minheight/index.html b/files/fr/archive/mozilla/xul/attributs/minheight/index.html new file mode 100644 index 0000000000..95ea9f8ffb --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/minheight/index.html @@ -0,0 +1,15 @@ +--- +title: minheight +slug: Archive/Mozilla/XUL/Attributs/minheight +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/minheight +--- +
« Accueil de la référence XUL
+
minheight +
Type : chaîne de caractères (représentant un entier) +
La hauteur minimum de l'élément. Ceci correspond à la propriété CSS min-height. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/minwidth/index.html b/files/fr/archive/mozilla/xul/attributs/minwidth/index.html new file mode 100644 index 0000000000..d1984bdb6b --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/minwidth/index.html @@ -0,0 +1,15 @@ +--- +title: minwidth +slug: Archive/Mozilla/XUL/Attributs/minwidth +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/minwidth +--- +
« Accueil de la référence XUL
+
minwidth +
Type : chaîne de caractères (représentant un entier) +
La largeur minimum de l'élément. Ceci correspond à la propriété CSS min-width. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/mousethrough/index.html b/files/fr/archive/mozilla/xul/attributs/mousethrough/index.html new file mode 100644 index 0000000000..c178218f19 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/mousethrough/index.html @@ -0,0 +1,25 @@ +--- +title: mousethrough +slug: Archive/Mozilla/XUL/Attributs/mousethrough +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/mousethrough +--- +
« Accueil de la référence XUL
+
mousethrough +
Type : une des valeurs ci-dessous +
Détermine si les évènements souris sont passés à l'élément. Si cet attribut n'est pas spécifié, la valeur est héritée du parent de l'élément. Si aucun ancêtre n'a d'attribut mousethrough défini, la valeur par défaut est never. +
+ +
+

L'attribut mousethrough est typiquement utilisé en conjonction avec un stack pour permettre aux éléments d'être empilés au dessus d'autres tout en permettant aux évènements souris d'être envoyés aux éléments les plus bas. Dans l'exemple suivant, l'image apparait au dessus du bouton, cependant l'attribut mousethrough spécifié sur l'image permet aux évènements souris d'être ignorés sur celle-ci et d'être plutôt renvoyés vers le bouton. Si cet attribut n'avait pas été utilisé, l'image aurait reçu tous les évènements souris et il n'aurait pas été possible d'appuyer sur le bouton. +

+
<stack>
+  <button label="En dessous"/>
+  <image src="happy.png" mousethrough="always"/>
+</stack>
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/name/index.html b/files/fr/archive/mozilla/xul/attributs/name/index.html new file mode 100644 index 0000000000..04b80a0c2c --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/name/index.html @@ -0,0 +1,14 @@ +--- +title: name +slug: Archive/Mozilla/XUL/Attributs/name +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/name +--- +
« Accueil de la référence XUL +

Voir également

+ +
diff --git a/files/fr/archive/mozilla/xul/attributs/noautofocus/index.html b/files/fr/archive/mozilla/xul/attributs/noautofocus/index.html new file mode 100644 index 0000000000..307a2db967 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/noautofocus/index.html @@ -0,0 +1,17 @@ +--- +title: noautofocus +slug: Archive/Mozilla/XUL/Attributs/noautofocus +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/noautofocus +--- +
« Accueil de la référence XUL
+
noautofocus +
Type : booléen +
Si mis à false, la valeur par défaut, l'élément ayant actuellement le focus le perdra si le popup est ouvert ou fermé. Si mis à true, le focus ne sera pas modifié. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/observes/index.html b/files/fr/archive/mozilla/xul/attributs/observes/index.html new file mode 100644 index 0000000000..7d50606f14 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/observes/index.html @@ -0,0 +1,17 @@ +--- +title: observes +slug: Archive/Mozilla/XUL/Attributs/observes +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/observes +--- +
« Accueil de la référence XUL
+
observes +
Type : id d'un élément diffuseur +
Défini à l'id d'un élément diffuseur (broadcaster) observé par l'élément. Si un attribut du broadcaster est modifié, il sera également modifié dans l'observateur. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/onchange/index.html b/files/fr/archive/mozilla/xul/attributs/onchange/index.html new file mode 100644 index 0000000000..003e5162cb --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/onchange/index.html @@ -0,0 +1,17 @@ +--- +title: onchange +slug: Archive/Mozilla/XUL/Attributs/onchange +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/onchange +--- +
« Accueil de la référence XUL
+
onchange +
Type : code de script +
Le code figurant dans l'attribut onchange est appelé lorsque la valeur de l'élément est modifiée. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/oncommand/index.html b/files/fr/archive/mozilla/xul/attributs/oncommand/index.html new file mode 100644 index 0000000000..947dae79d8 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/oncommand/index.html @@ -0,0 +1,21 @@ +--- +title: oncommand +slug: Archive/Mozilla/XUL/Attributs/oncommand +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/oncommand +--- +
« Accueil de la référence XUL
+
oncommand +
Type : code de script +
Ce gestionnaire d'évènement est appelé lorsque la commande est activée. Cela se produit quand un utilisateur sélectionne un élément de menu ou active un raccourci clavier attaché à la commande. +
+
+

Exemple

+
<button label="Cliquez ici" oncommand="alert('Salut')"/>
+
+

Voir également

+

L'élément command. +

+
diff --git a/files/fr/archive/mozilla/xul/attributs/onpaneload/index.html b/files/fr/archive/mozilla/xul/attributs/onpaneload/index.html new file mode 100644 index 0000000000..edaf560356 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/onpaneload/index.html @@ -0,0 +1,18 @@ +--- +title: onpaneload +slug: Archive/Mozilla/XUL/Attributs/onpaneload +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/onpaneload +--- +
+ « Accueil de la référence XUL
+
+
+ onpaneload
+
+ Type : code de script
+
+ Le code défini ici est appelé après le chargement du panneau, de manière similaire à l'évènement load pour une fenêtre.
+
diff --git a/files/fr/archive/mozilla/xul/attributs/onpopuphidden/index.html b/files/fr/archive/mozilla/xul/attributs/onpopuphidden/index.html new file mode 100644 index 0000000000..83e7d64685 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/onpopuphidden/index.html @@ -0,0 +1,15 @@ +--- +title: onpopuphidden +slug: Archive/Mozilla/XUL/Attributs/onpopuphidden +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/onpopuphidden +--- +
« Accueil de la référence XUL
+
onpopuphidden +
Type : code de script +
Cet évènement est envoyé à un popup après qu'il a été caché. http://www.langue-fr.net/index/A/apres-que.htm +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/onpopuphiding/index.html b/files/fr/archive/mozilla/xul/attributs/onpopuphiding/index.html new file mode 100644 index 0000000000..454023d1a0 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/onpopuphiding/index.html @@ -0,0 +1,15 @@ +--- +title: onpopuphiding +slug: Archive/Mozilla/XUL/Attributs/onpopuphiding +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/onpopuphiding +--- +
« Accueil de la référence XUL
+
onpopuphiding +
Type : code de script +
Cet évènement est envoyé à un popup lorsqu'il est sur le point d'être masqué. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/onpopupshowing/index.html b/files/fr/archive/mozilla/xul/attributs/onpopupshowing/index.html new file mode 100644 index 0000000000..42f6d71edb --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/onpopupshowing/index.html @@ -0,0 +1,15 @@ +--- +title: onpopupshowing +slug: Archive/Mozilla/XUL/Attributs/onpopupshowing +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/onpopupshowing +--- +
« Accueil de la référence XUL
+
onpopupshowing +
Type : code de script +
Cet évènement est envoyé à un popup juste avant son ouverture. On l'utilise généralement pour définir dynamiquement le contenu lorsque l'utilisateur demande son affichage. Si ce gestionnaire d'évènement renvoie false, le popup ne s'affichera pas. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/onpopupshown/index.html b/files/fr/archive/mozilla/xul/attributs/onpopupshown/index.html new file mode 100644 index 0000000000..07314e2894 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/onpopupshown/index.html @@ -0,0 +1,15 @@ +--- +title: onpopupshown +slug: Archive/Mozilla/XUL/Attributs/onpopupshown +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/onpopupshown +--- +
« Accueil de la référence XUL
+
onpopupshown +
Type : code de script +
Cet évènement est envoyé à un popup après son ouverture, de la même manière qu'un évènement onload est envoyé à une fenêtre à son ouverture. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/open/index.html b/files/fr/archive/mozilla/xul/attributs/open/index.html new file mode 100644 index 0000000000..fe008056f6 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/open/index.html @@ -0,0 +1,16 @@ +--- +title: open +slug: Archive/Mozilla/XUL/Attributs/open +tags: + - Attributs_XUL + - Référence_XUL + - needsattention +translation_of: Archive/Mozilla/XUL/Attribute/open +--- +
« Accueil de la référence XUL
+
open +
Type : booléen +
Pour les boutons de type menu, l'attribut open est défini à true lorsque le menu est ouvert. L'attribut open n'est pas présent si le menu est fermé. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/ordinal/index.html b/files/fr/archive/mozilla/xul/attributs/ordinal/index.html new file mode 100644 index 0000000000..a9b8b0facc --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/ordinal/index.html @@ -0,0 +1,15 @@ +--- +title: ordinal +slug: Archive/Mozilla/XUL/Attributs/ordinal +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/ordinal +--- +
« Accueil de la référence XUL
+
ordinal +
Type : chaîne de caractères (représentant un entier) +
Un entier spécifiant la position de l'élément au sein de son parent. Par défaut, les éléments sont affichés dans leur ordre d'apparition dans le code XUL. L'attribut ordinal peut être utilisé pour modifier cet ordre. Notez que la valeur par défaut d'ordinal pour les éléments est 1. L'ordre d'affichage peut être retrouvé à l'aide des propriétés de l'objet boxObject du conteneur. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/orient/index.html b/files/fr/archive/mozilla/xul/attributs/orient/index.html new file mode 100644 index 0000000000..0313690837 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/orient/index.html @@ -0,0 +1,21 @@ +--- +title: orient +slug: Archive/Mozilla/XUL/Attributs/orient +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/orient +--- +
« Accueil de la référence XUL
+
orient +
Type : une des valeurs ci-dessous +
Utilisé pour spécifier si les enfants de l'élément sont orientés horizontalement ou verticalement. La valeur par défaut dépend de l'élément. Il est également possible d'utiliser la propriété de style -moz-box-orient. +
+ +
+

Voir également

+ +
diff --git a/files/fr/archive/mozilla/xul/attributs/pack/index.html b/files/fr/archive/mozilla/xul/attributs/pack/index.html new file mode 100644 index 0000000000..08f444a3f3 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/pack/index.html @@ -0,0 +1,22 @@ +--- +title: pack +slug: Archive/Mozilla/XUL/Attributs/pack +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/pack +--- +
« Accueil de la référence XUL
+
pack +
Type : une des valeurs ci-dessous +
L'attribut pack spécifie où les éléments enfants de la boîte box sont placés lorsque celle-ci est plus grande que la taille de ses enfants. Pour les boîtes dont l'orientation est horizontale, il est utilisé pour indiquer la position verticale des enfants. Pour les boîtes dont l'orientation est verticale, il est utilisé pour indiquer la position horizontale des enfants. L'attribut align est utilisé pour spécifier la position dans la direction opposée. Il est également possible de spécifier la valeur de pack à l'aide de la propriété de style -moz-box-pack. +
+ +
+

Voir également

+

Plus de détails sur l'empaquetage des boîtes dans le Tutoriel XUL +

+
diff --git a/files/fr/archive/mozilla/xul/attributs/pageincrement/index.html b/files/fr/archive/mozilla/xul/attributs/pageincrement/index.html new file mode 100644 index 0000000000..17c3a22c10 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/pageincrement/index.html @@ -0,0 +1,21 @@ +--- +title: pageincrement +slug: Archive/Mozilla/XUL/Attributs/pageincrement +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/pageincrement +--- +
+ « Accueil de la référence XUL
+
+
+ pageincrement
+
+ Type : + + entier +
+
+ La quantité de laquelle la valeur de l'attribut curpos ou value change lorsque l'utilisateur clique dans la colonne de la barre de défilement (la zone dans laquelle le curseur de la barre se déplace), ou lorsque les touches PgUp ou PgDown sont utilisées. La valeur par défaut est 10.
+
diff --git a/files/fr/archive/mozilla/xul/attributs/persist/index.html b/files/fr/archive/mozilla/xul/attributs/persist/index.html new file mode 100644 index 0000000000..9fe5feb99a --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/persist/index.html @@ -0,0 +1,15 @@ +--- +title: persist +slug: Archive/Mozilla/XUL/Attributs/persist +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/persist +--- +
« Accueil de la référence XUL
+
persist +
Type : liste de noms d'attributs séparés par des espaces +
Une liste séparée par des espaces d'attributs à maintenir lorsque la fenêtre est fermée. À sa réouverture, les valeurs des attributs persistants sont restaurées. Dans Mozilla, les attributs persistants sont conservés dans le fichier localstore.rdf du profil. La persistance peut également être stockée à l'aide de la fonction document.persist. Afin qu'elle puisse fonctionner, l'élément doit également avoir un id. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/popup.left/index.html b/files/fr/archive/mozilla/xul/attributs/popup.left/index.html new file mode 100644 index 0000000000..bf6ab7d045 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/popup.left/index.html @@ -0,0 +1,17 @@ +--- +title: popup.left +slug: Archive/Mozilla/XUL/Attributs/popup.left +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/popup.left +--- +
« Accueil de la référence XUL
+
left +
Type : entier +
Remplace la position horizontale du popup spécifiée par la méthode showPopup. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/popup.position/index.html b/files/fr/archive/mozilla/xul/attributs/popup.position/index.html new file mode 100644 index 0000000000..bcaf43a628 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/popup.position/index.html @@ -0,0 +1,30 @@ +--- +title: popup.position +slug: Archive/Mozilla/XUL/Attributs/popup.position +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/popup.position +--- +
« Accueil de la référence XUL
+
position +
Type : une des valeurs ci-dessous +
L'attribut position détermine où le popup apparaît par rapport à l'élément sur lequel l'utilisateur a cliqué pour l'invoquer. C'est ce qui permet de placer le popup sur le bord d'un bouton. +
+ +
+

Voir également

+ +
diff --git a/files/fr/archive/mozilla/xul/attributs/popup.top/index.html b/files/fr/archive/mozilla/xul/attributs/popup.top/index.html new file mode 100644 index 0000000000..a451ed325b --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/popup.top/index.html @@ -0,0 +1,17 @@ +--- +title: popup.top +slug: Archive/Mozilla/XUL/Attributs/popup.top +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/popup.top +--- +
« Accueil de la référence XUL
+
top +
Type : entier +
Remplace la position verticale du popup spécifiée par la méthode showPopup. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/popup/index.html b/files/fr/archive/mozilla/xul/attributs/popup/index.html new file mode 100644 index 0000000000..eccbe7f03e --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/popup/index.html @@ -0,0 +1,22 @@ +--- +title: popup +slug: Archive/Mozilla/XUL/Attributs/popup +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/popup +--- +
« Accueil de la référence XUL
+
popup +
Type : id d'élément popup +
Doit être défini à la valeur de l'id de l'élément popup devant apparaitre lorsque l'utilisateur clique sur l'élément. +
+
+

Voir également

+

Plus d'informations sur l'élément popup dans le tutoriel XUL +

+
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/position/index.html b/files/fr/archive/mozilla/xul/attributs/position/index.html new file mode 100644 index 0000000000..2d59e59231 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/position/index.html @@ -0,0 +1,17 @@ +--- +title: position +slug: Archive/Mozilla/XUL/Attributs/position +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/position +--- +
« Accueil de la référence XUL
+
position +
Type : chaîne de caractères (représentant un entier) +
Lorsqu'un élément est un overlay, la position est un indice où l'enfant sera inséré. Les indices commencent à 1, utilisez donc une valeur de 1 pour placer un élément au début. Cet attribut est ignoré si un attribut insertbefore ou insertafter correspond à un élément. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/preference-editable/index.html b/files/fr/archive/mozilla/xul/attributs/preference-editable/index.html new file mode 100644 index 0000000000..d81a8aae06 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/preference-editable/index.html @@ -0,0 +1,16 @@ +--- +title: preference-editable +slug: Archive/Mozilla/XUL/Attributs/preference-editable +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/preference-editable +--- +
« Accueil de la référence XUL
+
preference-editable +
Mozilla 1.8 +
Type : booléen +
Si défini à true, l'élément peut être utilisé pour modifier une préférence dans une prefwindow. L'attribut preference peut être utilisé pour se connecter à un élément preference. Cela peut servir aux éléments personnalisés implémentés en XBL. L'élément doit déclencher des évènements change ou select lorsque la valeur est modifiée afin que la préférence soit mise à jour en conséquence. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/preference.name/index.html b/files/fr/archive/mozilla/xul/attributs/preference.name/index.html new file mode 100644 index 0000000000..1fd04497a2 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/preference.name/index.html @@ -0,0 +1,18 @@ +--- +title: preference.name +slug: Archive/Mozilla/XUL/Attributs/preference.name +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/preference.name +--- +
« Accueil de la référence XUL
+
name +
Type : chaîne de caractères +
Le nom de la préférence à modifier. Par exemple, la page d'accueil du navigateur est définie par la préférence browser.startup.homepage. +
+
+

Voir également

+ +
diff --git a/files/fr/archive/mozilla/xul/attributs/preference.type/index.html b/files/fr/archive/mozilla/xul/attributs/preference.type/index.html new file mode 100644 index 0000000000..06e0ae3242 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/preference.type/index.html @@ -0,0 +1,13 @@ +--- +title: preference.type +slug: Archive/Mozilla/XUL/Attributs/preference.type +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/preference.type +--- +
« Accueil de la référence XUL
+
type
Type : une des valeurs ci-dessous
Le type de préférence qui doit être une des valeurs suivantes.
+
+ diff --git a/files/fr/archive/mozilla/xul/attributs/preference/index.html b/files/fr/archive/mozilla/xul/attributs/preference/index.html new file mode 100644 index 0000000000..f4be11503a --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/preference/index.html @@ -0,0 +1,15 @@ +--- +title: preference +slug: Archive/Mozilla/XUL/Attributs/preference +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/preference +--- +
« Accueil de la référence XUL
+
preference +
Type : id d'élément +
Connecte l'élément à une préférence (élément preference) correspondante. Cet attribut n'a d'effet qu'utilisé au sein d'un prefwindow. La valeur de la préférence sera mise à jour pour correspondre à la propriété value de l'élément. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/prefpane.selected/index.html b/files/fr/archive/mozilla/xul/attributs/prefpane.selected/index.html new file mode 100644 index 0000000000..ddb5f5de30 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/prefpane.selected/index.html @@ -0,0 +1,24 @@ +--- +title: prefpane.selected +slug: Archive/Mozilla/XUL/Attributs/prefpane.selected +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/prefpane.selected +--- +
+ « Accueil de la référence XUL
+
+
+ selected
+
+ Type : booléen
+
+ Cet attribut sera défini à true pour l'élément prefpane actuellement sélectionné. Pour changer le panneau sélectionné, utilisez la méthode showPane de prefwindow.
+
+
+

Voir également

+ +
diff --git a/files/fr/archive/mozilla/xul/attributs/prefpane.src/index.html b/files/fr/archive/mozilla/xul/attributs/prefpane.src/index.html new file mode 100644 index 0000000000..f51cb011d3 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/prefpane.src/index.html @@ -0,0 +1,25 @@ +--- +title: prefpane.src +slug: Archive/Mozilla/XUL/Attributs/prefpane.src +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/prefpane.src +--- +
+ « Accueil de la référence XUL
+
+
+ src
+
+ Type : URL d'un overlay
+
+ L'URL du contenu du panneau de préférences. Si cet attribut n'est pas spécifié, le contenu de l'élément prefpane sera utilisé.
+
+ +
+

Voir également

+ +
diff --git a/files/fr/archive/mozilla/xul/attributs/properties/index.html b/files/fr/archive/mozilla/xul/attributs/properties/index.html new file mode 100644 index 0000000000..9939e0557f --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/properties/index.html @@ -0,0 +1,15 @@ +--- +title: properties +slug: Archive/Mozilla/XUL/Attributs/properties +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/properties +--- +
« Accueil de la référence XUL
+
properties +
Type : liste de noms de propriétés séparés par des espaces +
Définit les propriétés de l'élément, qui peuvent être utilisées pour le styler. Pour plus d'informations, consultez Styler un arbre. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/querytype/index.html b/files/fr/archive/mozilla/xul/attributs/querytype/index.html new file mode 100644 index 0000000000..a1be9285d1 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/querytype/index.html @@ -0,0 +1,15 @@ +--- +title: querytype +slug: Archive/Mozilla/XUL/Attributs/querytype +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/querytype +--- +
« Accueil de la référence XUL
+
querytype +
Type : chaîne de caractères +
Indique le type de source de données (datasource) utilisé dans un template. Firefox 3 fournit les types de données intégrés suivants : 'rdf', default, 'xml' et 'storage'. Des extensions peuvent ajouter une gestion d'autres types de données. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/readonly/index.html b/files/fr/archive/mozilla/xul/attributs/readonly/index.html new file mode 100644 index 0000000000..b9c4ee4a7a --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/readonly/index.html @@ -0,0 +1,15 @@ +--- +title: readonly +slug: Archive/Mozilla/XUL/Attributs/readonly +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/readonly +--- +
« Accueil de la référence XUL
+
readonly +
Type : booléen +
Si défini à true, l'utilisateur ne peut pas modifier la valeur de l'élément. Cependant, celle-ci peut toujours être modifiée par un script. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/ref/index.html b/files/fr/archive/mozilla/xul/attributs/ref/index.html new file mode 100644 index 0000000000..33ad444997 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/ref/index.html @@ -0,0 +1,15 @@ +--- +title: ref +slug: Archive/Mozilla/XUL/Attributs/ref +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/ref +--- +
« Accueil de la référence XUL
+
ref +
Type : URI d'une ressource RDF +
Pour les éléments générés par des templates, cet attribut est utilisé pour indiquer le nœud racine RDF où la génération de contenu commence. Ceci correspondra à la valeur d'un attribut about sur un conteneur RDF. Cet attribut doit être placé en même temps que l'attribut datasources. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/removeelement/index.html b/files/fr/archive/mozilla/xul/attributs/removeelement/index.html new file mode 100644 index 0000000000..e818afecba --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/removeelement/index.html @@ -0,0 +1,17 @@ +--- +title: removeelement +slug: Archive/Mozilla/XUL/Attributs/removeelement +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/removeelement +--- +
« Accueil de la référence XUL
+
removeelement +
Type : id d'élément +
Lorsque cet attribut est placé sur un élément dans un overlay, il indique que l'élément du fichier de base doit être retiré de la fenêtre. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/rows/index.html b/files/fr/archive/mozilla/xul/attributs/rows/index.html new file mode 100644 index 0000000000..5f871bd6bc --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/rows/index.html @@ -0,0 +1,15 @@ +--- +title: rows +slug: Archive/Mozilla/XUL/Attributs/rows +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/rows +--- +
« Accueil de la référence XUL
+
rows +
Type : entier +
Le nombre de lignes à afficher dans l'élément. Si l'élément contient plus que ce nombre de lignes, une barre de défilement apparaitra afin que l'utilisateur puisse consulter les autres lignes. Pour obtenir le nombre réel de lignes dans l'élément, utilisez la méthode getRowCount. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/screenx/index.html b/files/fr/archive/mozilla/xul/attributs/screenx/index.html new file mode 100644 index 0000000000..3ec8680474 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/screenx/index.html @@ -0,0 +1,15 @@ +--- +title: screenX +slug: Archive/Mozilla/XUL/Attributs/screenX +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/screenX +--- +
« Accueil de la référence XUL
+
screenX +
Type : entier +
La position horizontale à laquelle la fenêtre apparaît à l'écran. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/screeny/index.html b/files/fr/archive/mozilla/xul/attributs/screeny/index.html new file mode 100644 index 0000000000..1cc65ea6d2 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/screeny/index.html @@ -0,0 +1,17 @@ +--- +title: screenY +slug: Archive/Mozilla/XUL/Attributs/screenY +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/screenY +--- +
« Accueil de la référence XUL
+
screenY +
Type : entier +
La position verticale à laquelle la fenêtre apparaît à l'écran. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/selected/index.html b/files/fr/archive/mozilla/xul/attributs/selected/index.html new file mode 100644 index 0000000000..a1b6c466f8 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/selected/index.html @@ -0,0 +1,19 @@ +--- +title: selected +slug: Archive/Mozilla/XUL/Attributs/selected +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/selected +--- +
« Accueil de la référence XUL
+
selected +
Type : booléen +
Indique si l'élément est sélectionné ou non. Cette valeur est en lecture seule. Pour changer la sélection, utilisez la propriété selectedIndex ou selectedItem de l'élément conteneur. +
+
+

Voir également

+ +
diff --git a/files/fr/archive/mozilla/xul/attributs/seltype/index.html b/files/fr/archive/mozilla/xul/attributs/seltype/index.html new file mode 100644 index 0000000000..fcb9957382 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/seltype/index.html @@ -0,0 +1,26 @@ +--- +title: seltype +slug: Archive/Mozilla/XUL/Attributs/seltype +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/seltype +--- +
+ « Accueil de la référence XUL
+
+
+ seltype<magic name="\"PAGENAME\"/"></magic>
+
+ Type : + + une des valeurs ci-dessous +
+
+ Utilisé pour indiquer si les sélections multiples sont permises.
+
+ +

<magic name="\"PAGENAME\"/">Des cellules individuelles peuvent être sélectionnées.</magic><magic name="\"PAGENAME\"/"> Des lignes sont sélectionnées, cependant, l'indicateur de sélection n'est visible que sur le texte de la colonne principale.</magic>

diff --git a/files/fr/archive/mozilla/xul/attributs/sizemode/index.html b/files/fr/archive/mozilla/xul/attributs/sizemode/index.html new file mode 100644 index 0000000000..552e358e5f --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/sizemode/index.html @@ -0,0 +1,21 @@ +--- +title: sizemode +slug: Archive/Mozilla/XUL/Attributs/sizemode +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/sizemode +--- +
« Accueil de la référence XUL
+
sizemode +
Type : une des valeurs ci-dessous +
L'état de la fenêtre (window). Les valeurs suivantes peuvent être utilisées : +
+ +


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/sortdirection/index.html b/files/fr/archive/mozilla/xul/attributs/sortdirection/index.html new file mode 100644 index 0000000000..c563a7b193 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/sortdirection/index.html @@ -0,0 +1,21 @@ +--- +title: sortDirection +slug: Archive/Mozilla/XUL/Attributs/sortDirection +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/sortDirection +--- +
« Accueil de la référence XUL
+
sortDirection +
Type : une des valeurs ci-dessous +
Cet attribut indique la direction dans laquelle le contenu généré par un template est trié. Utilisez l'attribut sortResource pour spécifier la clé de tri. +
+ +


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/sortresource/index.html b/files/fr/archive/mozilla/xul/attributs/sortresource/index.html new file mode 100644 index 0000000000..ac33419cef --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/sortresource/index.html @@ -0,0 +1,17 @@ +--- +title: sortResource +slug: Archive/Mozilla/XUL/Attributs/sortResource +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/sortResource +--- +
« Accueil de la référence XUL
+
sortResource +
Type : URI d'un prédicat RDF +
Pour du contenu généré par un template, spécifie la clé de tri si le contenu doit être trié. La clé doit être l'URI complète de la ressource par laquelle trier, par exemple « http://home.netscape.com/NC-rdf#Name ». Placez cet attribut sur le même élément que l'attribut datasources. Utilisez sortResource2 pour spécifier une clé de tri secondaire. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/sortresource2/index.html b/files/fr/archive/mozilla/xul/attributs/sortresource2/index.html new file mode 100644 index 0000000000..e1e156e2fd --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/sortresource2/index.html @@ -0,0 +1,17 @@ +--- +title: sortResource2 +slug: Archive/Mozilla/XUL/Attributs/sortResource2 +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/sortResource2 +--- +
« Accueil de la référence XUL
+
sortResource2 +
Type : URI d'un prédicat RDF +
Une clé secondaire de tri pour le contenu. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/src/index.html b/files/fr/archive/mozilla/xul/attributs/src/index.html new file mode 100644 index 0000000000..adabab20d0 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/src/index.html @@ -0,0 +1,34 @@ +--- +title: src +slug: Archive/Mozilla/XUL/Attributs/src +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/src +--- +
+ « Accueil de la référence XUL
+
+
+ src
+
+ Type : URL
+
+ L'adresse URL du contenu devant apparaître dans l'élément.
+
+
+

Exemples

+ 
<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"/>
+
+

Voir également

+ +
diff --git a/files/fr/archive/mozilla/xul/attributs/statustext/index.html b/files/fr/archive/mozilla/xul/attributs/statustext/index.html new file mode 100644 index 0000000000..dcbd921f3a --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/statustext/index.html @@ -0,0 +1,39 @@ +--- +title: statustext +slug: Archive/Mozilla/XUL/Attributs/statustext +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/statustext +--- +
« Accueil de la référence XUL
+
statustext +
Type : chaîne de caractères +
Utilisé pour définir le texte apparaissant dans la barre d'état lorsque l'utilisateur passe le pointeur par dessus l'élément. Mozilla ne mettra cependant pas à jour la barre d'état automatiquement. Cet attribut sert juste à conserver le texte. Dans Firefox, celui-ci sera automatiquement placé dans l'élément statusbar pour les éléments menuitem de la barre de menus. +
+
+

Exemple

+
<!-- change le message d'état lorsque la souris survole les boutons -->
+<button label="Connexion" statustext="Se connecter au serveur distant"
+      onmouseover="setStatusMessage(this)" onmouseout="clearStatusMessage()"/>
+<button label="Ping" statustext="Envoyer un ping au serveur"
+      onmouseover="setStatusMessage(this)" onmouseout="clearStatusMessage()"/>
+
+<statusbar>
+  <statusbarpanel id="myStatusPanel" label="" flex="1"/>
+  <spacer flex="1"/>
+</statusbar>
+
+<script>
+function setStatusMessage(obj){
+  document.getElementById('myStatusPanel').label = obj.getAttribute('statustext');
+}
+function clearStatusMessage(obj){
+  document.getElementById('myStatusPanel').label = '';
+}
+</script>
+
+

Voir également

+

statusbar et statusbarpanel +

+
diff --git a/files/fr/archive/mozilla/xul/attributs/style/index.html b/files/fr/archive/mozilla/xul/attributs/style/index.html new file mode 100644 index 0000000000..60fa847962 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/style/index.html @@ -0,0 +1,15 @@ +--- +title: style +slug: Archive/Mozilla/XUL/Attributs/style +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/style +--- +
« Accueil de la référence XUL
+
style +
Type : style CSS inline +
Règles de style CSS à appliquer à l'élément. La syntaxe est identique à celle de l'attribut HTML style. Il est préférable de placer les règles de style dans des feuilles de style séparées. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/suppressonselect/index.html b/files/fr/archive/mozilla/xul/attributs/suppressonselect/index.html new file mode 100644 index 0000000000..5f8cb6b1d5 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/suppressonselect/index.html @@ -0,0 +1,22 @@ +--- +title: suppressonselect +slug: Archive/Mozilla/XUL/Attributs/suppressonselect +tags: + - Attributs_XUL + - Référence_XUL + - XUL +translation_of: Archive/Mozilla/XUL/Attribute/suppressonselect +--- +
+ « Accueil de la référence XUL
+
+
+ suppressonselect
+
+ Type : + + booléen +
+
+ Si cet attribut n'est pas spécifié, un évènement select est déclenché dès qu'un élément est sélectionné, que ce soit par l'utilisateur ou par l'appel d'une des méthodes de sélection. Si la valeur de l'attribut est true, l'évènement select n'est jamais déclenché.
+
diff --git a/files/fr/archive/mozilla/xul/attributs/tabindex/index.html b/files/fr/archive/mozilla/xul/attributs/tabindex/index.html new file mode 100644 index 0000000000..16d1e7e367 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/tabindex/index.html @@ -0,0 +1,15 @@ +--- +title: tabindex +slug: Archive/Mozilla/XUL/Attributs/tabindex +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/tabindex +--- +
« Accueil de la référence XUL
+
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/template/index.html b/files/fr/archive/mozilla/xul/attributs/template/index.html new file mode 100644 index 0000000000..8b88020822 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/template/index.html @@ -0,0 +1,15 @@ +--- +title: template +slug: Archive/Mozilla/XUL/Attributs/template +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/template +--- +
« Accueil de la référence XUL
+
template +
Type : id d'élément +
Pour les éléments générés par des templates, cet attribut peut éventuellement être placé sur le nœud racine (l'élément disposant de l'attribut datasources) pour faire référence à un template existant autre part dans le code XUL. L'attribut template doit être défini à l'id de l'élément template. Celui-ci peut être utilisé pour partager un même template entre différents arbres ou menus. Si cet attribut n'est pas spécifié, il doit y avoir un élément template directement dans le nœud. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/timepicker.increment/index.html b/files/fr/archive/mozilla/xul/attributs/timepicker.increment/index.html new file mode 100644 index 0000000000..53d622d39f --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/timepicker.increment/index.html @@ -0,0 +1,18 @@ +--- +title: timepicker.increment +slug: Archive/Mozilla/XUL/Attributs/timepicker.increment +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/timepicker.increment +--- +
+ « Accueil de la référence XUL
+
+
+ increment
+
+ Type : entier
+
+ Indique le nombre de minutes à passer chaque fois que les flèches sont actionnées. Cet attribut est à utiliser en combinaison avec une définition de hideseconds à true.
+
diff --git a/files/fr/archive/mozilla/xul/attributs/timepicker.value/index.html b/files/fr/archive/mozilla/xul/attributs/timepicker.value/index.html new file mode 100644 index 0000000000..4cc2d5f336 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/timepicker.value/index.html @@ -0,0 +1,18 @@ +--- +title: timepicker.value +slug: Archive/Mozilla/XUL/Attributs/timepicker.value +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/timepicker.value +--- +
+ « Accueil de la référence XUL
+
+
+ value
+
+ Type : chaîne
+
+ La valeur initiale du sélecteur de date au format HH:MM:SS ou HH:MM.
+
diff --git a/files/fr/archive/mozilla/xul/attributs/title/index.html b/files/fr/archive/mozilla/xul/attributs/title/index.html new file mode 100644 index 0000000000..2f123af87d --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/title/index.html @@ -0,0 +1,17 @@ +--- +title: title +slug: Archive/Mozilla/XUL/Attributs/title +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/title +--- +
« Accueil de la référence XUL
+
title +
Type : chaîne de caractères +
Le texte qui doit apparaître dans la barre de titre de la fenêtre ou boîte de dialogue. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/tooltip/index.html b/files/fr/archive/mozilla/xul/attributs/tooltip/index.html new file mode 100644 index 0000000000..8eb387f689 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/tooltip/index.html @@ -0,0 +1,15 @@ +--- +title: tooltip +slug: Archive/Mozilla/XUL/Attributs/tooltip +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/tooltip +--- +
« Accueil de la référence XUL
+
tooltip +
Type : id d'un élément tooltip +
Doit être défini à la valeur de l'id de l'élément popup à utiliser comme fenêtre tooltip (bulle d'information) lorsque l'élément est survolé un certain temps par le pointeur de la souris. Le tooltip disparaîtra automatiquement lors d'un nouveau déplacement de la souris. Si cet attribut est défini à « _child », le premier élément tooltip enfant de l'élément sera utilisé. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/tooltiptext/index.html b/files/fr/archive/mozilla/xul/attributs/tooltiptext/index.html new file mode 100644 index 0000000000..f719b5b76a --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/tooltiptext/index.html @@ -0,0 +1,15 @@ +--- +title: tooltiptext +slug: Archive/Mozilla/XUL/Attributs/tooltiptext +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/tooltiptext +--- +
« Accueil de la référence XUL
+
tooltiptext +
Type : chaîne de caractères +
Utilisé pour définir le texte qui apparaîtra dans la bulle d'information lorsque l'utilisateur place le pointeur de la souris sur l'élément. Ceci peut être utilisé à la place de la définition d'un tooltip vers un popup pour le cas habituel où celui-ci contient uniquement du texte. Le texte est par défaut affiché dans un simple label. Pour modifier le type de tooltip par défaut, définissez l'attribut default sur un élément tooltip. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/top/index.html b/files/fr/archive/mozilla/xul/attributs/top/index.html new file mode 100644 index 0000000000..994e4a27e2 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/top/index.html @@ -0,0 +1,17 @@ +--- +title: top +slug: Archive/Mozilla/XUL/Attributs/top +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/top +--- +
« Accueil de la référence XUL
+
top +
Type : chaîne de caractères (représentant un entier) +
Pour les éléments placés directement dans un stack, spécifie la distance en pixels entre le bord supérieur de l'élément et le bord supérieur du stack. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/type/index.html b/files/fr/archive/mozilla/xul/attributs/type/index.html new file mode 100644 index 0000000000..a2d6628e11 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/type/index.html @@ -0,0 +1,21 @@ +--- +title: type +slug: Archive/Mozilla/XUL/Attributs/type +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/type +--- +
+

Voir

+ +
+

 

diff --git a/files/fr/archive/mozilla/xul/attributs/uri/index.html b/files/fr/archive/mozilla/xul/attributs/uri/index.html new file mode 100644 index 0000000000..2879d1f18c --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/uri/index.html @@ -0,0 +1,19 @@ +--- +title: uri +slug: Archive/Mozilla/XUL/Attributs/uri +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/uri +--- +
« Accueil de la référence XUL
+
uri +
Type : chaîne de caractères +
Pour du contenu généré par un template, l'attribut doit être placé sur l'élément où la génération de contenu doit commencer. Donc, il doit être placé sur un élément qui est le descendant d'un template. La valeur doit être définie à rdf:*. +
+
Les éléments qui apparaissent à l'intérieur de l'élément portant cet attribut seront répétés pour chaque nœud dans la source de données RDF. Les éléments qui sont à l'extérieur n'apparaîtront qu'une seule fois. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/value/index.html b/files/fr/archive/mozilla/xul/attributs/value/index.html new file mode 100644 index 0000000000..86904f020b --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/value/index.html @@ -0,0 +1,22 @@ +--- +title: value +slug: Archive/Mozilla/XUL/Attributs/value +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/value +--- +
« Accueil de la référence XUL
+
value +
Type : chaîne +
Cet attribut chaîne permet d'associer une valeur de données avec un élément. Il n'est destiné à aucune utilisation particulière, mais vous pouvez y accéder avec un script pour votre usage propre.. +
+
+

Voir également

+ +

.value]] +

+
diff --git a/files/fr/archive/mozilla/xul/attributs/wait-cursor/index.html b/files/fr/archive/mozilla/xul/attributs/wait-cursor/index.html new file mode 100644 index 0000000000..23677d8118 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/wait-cursor/index.html @@ -0,0 +1,15 @@ +--- +title: wait-cursor +slug: Archive/Mozilla/XUL/Attributs/wait-cursor +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/wait-cursor +--- +
« Accueil de la référence XUL
+
wait-cursor +
Type : booléen +
Définissez cet attribut à true pour que le curseur devienne un curseur d'attente lorsqu'il survole l'élément. Habituellement, on ne l'utilisera que sur l'élément window ou d'autres éléments de premier plan. +
+
+
diff --git a/files/fr/archive/mozilla/xul/attributs/width/index.html b/files/fr/archive/mozilla/xul/attributs/width/index.html new file mode 100644 index 0000000000..bee18c2365 --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/width/index.html @@ -0,0 +1,30 @@ +--- +title: width +slug: Archive/Mozilla/XUL/Attributs/width +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/width +--- +
« Accueil de la référence XUL
+
width +
Type : chaîne de caractères (représentant un entier) +
La largeur préférée de l'élément. La valeur ne doit pas préciser d'unité car elle est toujours exprimée en pixels. La largeur réellement affichée peut être différente si l'élément ou son contenu ont une largeur minimum ou maximum, ou que la taille est ajustée selon la flexibilité ou l'alignement de son parent. La propriété CSS width peut également être utilisée. +
+
+

Dans cet exemple, la largeur préférée de la boîte hbox intérieure sera de 40 pixels. La largeur affichée est également 40 pixels puisqu'aucun ajustement de flexibilité ou d'alignement ne s'applique. +

+
<hbox>
+  <hbox width="40" style="background-color: red;">
+    <label value="40"/>
+  </hbox>
+</hbox>
+
+

Cependant, dans l'exemple qui sit, malgré une largeur préférée de 30 pixels pour la boîte, sa largeur affichée sera plus grande pour prendre en compte le label plus grand. +

+
<vbox width="30" align="start" style="background-color: red;">
+  <label value="vbox xul width 10px red"/>
+</vbox>
+
+
Note : Lorsqu'il est utilisé sur des objets treecol l'attribut width peut permettre à ceux-ci d'être défilables horizontalement si la largeur additionnée des colonnes est supérieure à celle de l'objet conteneur.
+
diff --git a/files/fr/archive/mozilla/xul/attributs/windowtype/index.html b/files/fr/archive/mozilla/xul/attributs/windowtype/index.html new file mode 100644 index 0000000000..6eb500663d --- /dev/null +++ b/files/fr/archive/mozilla/xul/attributs/windowtype/index.html @@ -0,0 +1,17 @@ +--- +title: windowtype +slug: Archive/Mozilla/XUL/Attributs/windowtype +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Attribute/windowtype +--- +
« Accueil de la référence XUL
+
windowtype +
Type : chaîne de caractères +
Définit une chaîne pouvant être utilisée pour identifier le type de fenêtre. Celle-ci peut être utilisée, par exemple, pour faire la distinction entre une fenêtre de navigation et une fenêtre d'édition. Certaines des fonctions de gestion de fenêtres de Mozilla utilisent cet attribut pour grouper les fenêtres du même type. +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/box/index.html b/files/fr/archive/mozilla/xul/box/index.html new file mode 100644 index 0000000000..a2b2cc6dd4 --- /dev/null +++ b/files/fr/archive/mozilla/xul/box/index.html @@ -0,0 +1,100 @@ +--- +title: box +slug: Archive/Mozilla/XUL/box +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/box +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +
+

Un élément conteneur qui peut contenir n'importe quel nombre d'éléments enfants. Si l'élément box a un attribut orient défini à horizontal, les éléments enfants sont disposés de gauche à droite dans l'ordre de leur apparition dans l'élément box. Si orient est défini à vertical, ils seront positionnés de haut en bas. Les éléments enfants ne se superposent pas. L'orientation par défaut est horizontal.

+

Vous trouverez plus d'informations dans le Tutoriel XUL.

+

Exemples

+
Image:XUL_ref_box.png
+
<box orient="horizontal">
+  <label value="Zéro"/>
+  <box orient="vertical">
+    <label value="Un"/>
+    <label value="Deux"/>
+  </box>
+  <box orient="horizontal">
+    <label value="Trois"/>
+    <label value="Quatre"/>
+  </box>
+</box>
+
+

Attributs

+ + + + + + +

Hérités de 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

+
+

Propriétés

+ +

Héritées de XUL element
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
+

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+

Sujets liés

+
Éléments
vbox, hbox
diff --git a/files/fr/archive/mozilla/xul/button/index.html b/files/fr/archive/mozilla/xul/button/index.html new file mode 100644 index 0000000000..adce204aab --- /dev/null +++ b/files/fr/archive/mozilla/xul/button/index.html @@ -0,0 +1,287 @@ +--- +title: button +slug: Archive/Mozilla/XUL/button +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/button +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un bouton qui peut être activé par l'utilisateur. Des gestionnaires d'évènements peuvent être utilisés pour capturer des évènements souris, claviers ou autres. Un bouton est typiquement affiché sous la forme d'un rectangle gris en relief. Le label d'un bouton peut être spécifié à l'aide de l'attribut label ou en plaçant du contenu dans l'élément button. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
accesskey, autoCheck, checkState, checked, command, crop, dir, disabled, dlgtype, group, icon, image, label, open, orient, tabindex, type +
+
Propriétés +
accessKey, accessibleType, autoCheck, checkState, checked, command, crop, dir, disabled, dlgType, group, image, label, open, orient, tabIndex, type +
+

Exemples

+
Image:XUL_ref_button.png
+
<button label="Appuyez"
+        oncommand="alert('Vous avez appuyé.');"/>
+
+

Attributs

+

+

+ +
accesskey
+
Type : caractère +
Cet attribut doit être une lettre utilisée comme touche de raccourci. Cette lettre doit être un des caractères apparaissant dans l'attribut label de l'élément.
+

Exemple

+
Image:XUL_ref_accesskey_attr.png
+
<vbox>
+  <label value="Entrez votre nom" accesskey="e" control="myName"/>
+  <textbox id="myName"/>
+  <button label="Annuler" accesskey="n"/>
+  <button label="OK" accesskey="O"/>
+</vbox>
+
+

Voir également

+

Les attributs label et acceltext +

+
+
+ +
+
+ +
+
+ +
+
+ checked
+
+ Type : + + booléen +
+
+ Indique si l'élément est coché ou non.
+
+ Utilisez hasAttribute() pour déterminer si cet attribut est défini plutôt que getAttribute().
+ Pour les boutons, l'attribut type doit etre mis à checkbox ou à radio pour qu'un effet soit perceptible.
+
+
+
+ +
command +
Type : id d'élément +
Défini à la valeur de l'id d'un élément command observé par l'élément. +
+ + +
+
+ +
crop +
Type : une des valeurs ci-dessous +
Si le label de l'élément est trop long pour être contenu dans son espace donné, le texte sera tronqué du côté indiqué par l'attribut crop. Une ellipse (…) sera utilisée à la place du texte tronqué. Si la direction de la boîte est inversée, le tronquage l'est également. +
+ + + +
+
+ +
+
+ dir
+
+ Type : + + une des valeurs ci-dessous +
+
+ La direction dans laquelle les éléments enfants de l'élément seront placés.
+
+ + +

 

+
+
+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
+
+ +
+
+ +
+
+ +
image +
Type : URL d'une image +
L'URL de l'image devant apparaître sur l'élément. Si cet attribut est vide ou omis, aucune image n'apparaîtra. La position de l'image est déterminée par les attributs dir et orient. +
+ + +
+
+ +
label +
Type : chaîne de caractères +
Le label qui apparaîtra sur l'élément. S'il n'est pas spécifié, aucun texte n'apparaîtra. +
+ + +
+
+ +
open +
Type : booléen +
Pour les boutons de type menu, l'attribut open est défini à true lorsque le menu est ouvert. L'attribut open n'est pas présent si le menu est fermé. +
+ + +
+
+ +
orient +
Type : une des valeurs ci-dessous +
Utilisé pour spécifier si les enfants de l'élément sont orientés horizontalement ou verticalement. La valeur par défaut dépend de l'élément. Il est également possible d'utiliser la propriété de style -moz-box-orient. +
+ + + +
+
+ +
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+ + +
+
+ +
+ +

Propriétés

+

+

+
accessKey +
Type : caractère +
Obtient et définit la valeur de l'attribut accesskey. +
+


+

+ +
+
+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+
+
+
+
+
+
crop +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut crop. +
+ +
+
+
dir +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut dir. +
+ +
+
+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
+
+
image +
Type : URL d'image +
Obtient et définit la valeur de l'attribut image. +
+ +
+
+
label +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut label. +
+ +
+
+
open +
Type : booléen +
Obtient et définit la valeur de l'attribut open. +
+ +
+
+
orient +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut orient. +
+ +
+
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+ +
+
+
type +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut type. +
+ +
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+
Interfaces +
nsIAccessibleProvider, nsIDOMXULButtonElement +
diff --git "a/files/fr/archive/mozilla/xul/caract\303\250res_internationaux_dans_du_javascript_xul/index.html" "b/files/fr/archive/mozilla/xul/caract\303\250res_internationaux_dans_du_javascript_xul/index.html" new file mode 100644 index 0000000000..756592e74b --- /dev/null +++ "b/files/fr/archive/mozilla/xul/caract\303\250res_internationaux_dans_du_javascript_xul/index.html" @@ -0,0 +1,27 @@ +--- +title: Caractères internationaux dans du JavaScript XUL +slug: Archive/Mozilla/XUL/Caractères_internationaux_dans_du_JavaScript_XUL +tags: + - Internationalisation + - JavaScript +translation_of: Archive/Mozilla/XUL/International_characters_in_XUL_JavaScript +--- +

 

+

Introduction

+

Gecko 1.8, qui est utilisé dans Firefox 1.5 et d'autres applications, a ajouté un support pour les caractères non-ASCII dans les fichiers JavaScript chargés depuis des fichiers XUL.

+

Cela signifie que de tels fichiers de script sont capables d'utiliser virtuellement tous les caractères de n'importe quelle langue dans le monde. Par exemple, ils pourraient contenir une ligne :

+
var text = "Ein schönes Beispiel eines mehrsprachigen Textes: 日本語";
+
+

Celle-ci mélange des caractères allemands et japonais.

+

Les versions précédentes interprétaient toujours les fichiers JS chargés depuis XUL en ISO-8859-1 (Latin-1) aussi bien en local qu'en fichiers distants. Les échappements Unicode, comme expliqué ci-dessous, ont toujours fonctionné.

+

Comment l'encodage des caractères est déterminé depuis Gecko 1.8

+

Lorsque le fichier JavaScript est chargé depuis une URL chrome://, un Byte Order Mark) est utilisé pour déterminer l'encodage des caractères du script. Autrement, l'encodage sera le même que celui utilisé par le fichier XUL (et spécifié par l'attribut encoding dans la balise <?xml?>). Par défaut, l'encodage sera l'UTF-8 qui peut représenter virtuellement l'ensemble des caractères dans le monde.

+

Si le fichier de script est chargé via HTTP, l'en-tête HTTP peut contenir une déclaration d'encodage de caractères comme faisant partie de Content-Type, par exemple :

+
Content-Type: application/x-javascript; charset=UTF-8
+
+

Si aucun paramètre charset n'est spécifié, les mêmes règles que précédemment sont appliquées.

+

Compatibilité inter-versions

+

Si vous voulez que le même code fonctionne à la fois avec Gecko 1.8 et ses versions antérieures, vous devez vous limiter à l'ASCII. Toutefois, vous pouvez employer les échappements unicode. Le précédent exemple réécrit deviendrait :

+
var text = "Ein sch\u00F6nes Beispiel eines mehrsprachigen Textes: \u65E5\u672C\u8A9E";
+
+

Une alternative serait d'utiliser des fichiers de propriétés via nsIStringBundle ou l\'élément XUL <stringbundle> ; ils permettent la localisation du XUL. Ce n'est toutefois pas permis dans des fichiers XUL chargés depuis le Web mais seulement dans un code avec privilèges, c'est-à-dire dans des extensions.

diff --git a/files/fr/archive/mozilla/xul/checkbox/index.html b/files/fr/archive/mozilla/xul/checkbox/index.html new file mode 100644 index 0000000000..cdb848ef56 --- /dev/null +++ b/files/fr/archive/mozilla/xul/checkbox/index.html @@ -0,0 +1,194 @@ +--- +title: checkbox +slug: Archive/Mozilla/XUL/checkbox +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/checkbox +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un élément qui peut être activé ou non. Il est le plus généralement affiché sous la forme d'une case vide lorsque l'élément est désactivé et une case avec une coche lorsqu'il est activé. L'utilisateur peut changer l'état de la case à cocher en la sélectionnant avec la souris. Un label, spécifié avec l'attribut label, peut être ajouté à côté de la case à cocher. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
accesskey, checked, command, crop, disabled, src, label, preference, tabindex +
+
Propriétés +
accessKey, accessibleType, checked, command, crop, disabled, src, label, tabIndex +
+

Exemples

+
Image:XUL_ref_checkbox.png
+
<checkbox label="Activer JavaScript" checked="true"/>
+<checkbox label="Activer Java" checked="false"/>
+
+

Attributs

+

+

+ +
accesskey
+
Type : caractère +
Cet attribut doit être une lettre utilisée comme touche de raccourci. Cette lettre doit être un des caractères apparaissant dans l'attribut label de l'élément.
+

Exemple

+
Image:XUL_ref_accesskey_attr.png
+
<vbox>
+  <label value="Entrez votre nom" accesskey="e" control="myName"/>
+  <textbox id="myName"/>
+  <button label="Annuler" accesskey="n"/>
+  <button label="OK" accesskey="O"/>
+</vbox>
+
+

Voir également

+

Les attributs label et acceltext +

+
+
+ +
+
+ checked
+
+ Type : + + booléen +
+
+ Indique si l'élément est coché ou non.
+
+ Utilisez hasAttribute() pour déterminer si cet attribut est défini plutôt que getAttribute().
+ Pour les boutons, l'attribut type doit etre mis à checkbox ou à radio pour qu'un effet soit perceptible.
+
+
+
+ +
command +
Type : id d'élément +
Défini à la valeur de l'id d'un élément command observé par l'élément. +
+ + +
+
+ +
crop +
Type : une des valeurs ci-dessous +
Si le label de l'élément est trop long pour être contenu dans son espace donné, le texte sera tronqué du côté indiqué par l'attribut crop. Une ellipse (…) sera utilisée à la place du texte tronqué. Si la direction de la boîte est inversée, le tronquage l'est également. +
+ + + +
+
+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
+
+ +
label +
Type : chaîne de caractères +
Le label qui apparaîtra sur l'élément. S'il n'est pas spécifié, aucun texte n'apparaîtra. +
+ + +
+
+ +
preference +
Type : id d'élément +
Connecte l'élément à une préférence (élément preference) correspondante. Cet attribut n'a d'effet qu'utilisé au sein d'un prefwindow. La valeur de la préférence sera mise à jour pour correspondre à la propriété value de l'élément. +
+ + +
+
+ +
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+ + +
+ +

Propriétés

+

+

+
accessKey +
Type : caractère +
Obtient et définit la valeur de l'attribut accesskey. +
+


+

+ +
+
+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+
+
+
+
crop +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut crop. +
+ +
+
+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
+
label +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut label. +
+ +
+
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+ +
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+
Interfaces
nsIAccessibleProvider, nsIDOMXULCheckboxElement +
+
+
diff --git a/files/fr/archive/mozilla/xul/command/index.html b/files/fr/archive/mozilla/xul/command/index.html new file mode 100644 index 0000000000..73dcad8053 --- /dev/null +++ b/files/fr/archive/mozilla/xul/command/index.html @@ -0,0 +1,81 @@ +--- +title: command +slug: Archive/Mozilla/XUL/command +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/command +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un élément command peut être utilisé pour invoquer une opération pouvant provenir de plusieurs sources différentes. Par exemple, une opération Coller depuis le Presse-papiers peut venir du menu Édition, d'un menu contextuel, ou d'un raccourci clavier. Le code s'attache à une commande avec l'attribut oncommand. Il sera appelé quelle que soit la manière dont la commande est invoquée par l'utilisateur. De plus, la désactivation de la commande désactivera automatiquement les éléments de menus et raccourcis clavier associés. +

Les commandes sont identifiées par leur attribut id. Si le script chrome://global/content/globalOverlay.js est inclus dans votre fenêtre, vous pouvez utiliser la fonction goDoCommand pour invoquer la commande. L'avantage est que la commande sera envoyée à la partie de l'interface utilisateur qui y répondra. Typiquement, il s'agira de l'élément ayant actuellement le focus. +

Comme avec un broadcaster, les commandes envoient des attributs à d'autres éléments. +

Vous trouverez plus d'informations dans le Tutoriel XUL. Voir également : l'attribut command, l'élément commandset. +

+
Attributs +
disabled, label, oncommand +
+

Exemples

+

Le code suivant enverra une commande Coller (cmd_paste) à l'élément détenant actuellement le focus : +

+
 // Inclure d'abord chrome://global/content/globalOverlay.js
+ goDoCommand("cmd_paste");
+
+

Exemple avec deux boutons +

+
<command id="cmd_openhelp" oncommand="alert('Aide');"/>
+<button label="Aide" command="cmd_openhelp"/>
+<button label="Plus d'aide" command="cmd_openhelp"/>
+
+

Attributs

+

+

+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
label +
Type : chaîne de caractères +
Le label qui apparaîtra sur l'élément. S'il n'est pas spécifié, aucun texte n'apparaîtra. +
+ + +
+
+ +
oncommand +
Type : code de script +
Ce gestionnaire d'évènement est appelé lorsque la commande est activée. Cela se produit quand un utilisateur sélectionne un élément de menu ou active un raccourci clavier attaché à la commande. +
+ + +
+ +

Propriétés

+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+ diff --git a/files/fr/archive/mozilla/xul/datepicker/index.html b/files/fr/archive/mozilla/xul/datepicker/index.html new file mode 100644 index 0000000000..0425ec07fb --- /dev/null +++ b/files/fr/archive/mozilla/xul/datepicker/index.html @@ -0,0 +1,231 @@ +--- +title: datepicker +slug: Archive/Mozilla/XUL/datepicker +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/datepicker +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un élément datepicker permet à l'utilisateur d'entrer une date. Trois types sont disponibles, ce qui peut être spécifié à l'aide de l'attribut type. +

+ +

Plusieurs manières de définir le jour sélectionné existent. En XUL, l'attribut value peut être défini à une valeur de la forme AAAA/MM/JJ pour initialiser le sélecteur de date à une certaine date. S'il n'est pas spécifié, il affichera par défaut le jour actuel. +

Pour changer la date sélectionnée, la propriété value peut être utilisée pour définir une nouvelle valeur de la forme AAAA/MM/JJ. La propriété dateValue peut être utilisée pour obtenir et définir la date à l'aide d'un objet Date. En outre, les propriétés date, month et year peuvent être utilisées pour obtenir et modifier chaque composant de la date séparément. +

+
Attributs +
disabled, firstdayofweek, readonly, type, tabindex, value +
+
Propriétés +
date, dateLeadingZero, dateValue, disabled, month, monthLeadingZero, open, readOnly, tabIndex, value, year, yearLeadingZero +
+

Exemples

+

Image:Controlsguide-datepicker-grid.png +

+
<datepicker type="grid" value="2007/03/26"/>
+
+

Attributs

+

+

+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
firstdayofweek +
Type : entier +
Indique le jour de la semaine à afficher comme premier jour dans la grille. Les valeurs vont de 0 à 6, où 0 est dimanche et 6 est samedi. La valeur par défaut est déterminée par la locale, n'utilisez donc cet attribut que si vous désirez l'écraser. +
+


+

+ + +
+
+ +
readonly +
Type : booléen +
Si défini à true, l'utilisateur ne peut pas modifier la valeur de l'élément. Cependant, celle-ci peut toujours être modifiée par un script. +
+ + +
+
+ +
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+ + +
+
+ +
+
+ type
+
+ Type : une des valeurs suivantes
+
+ L'attribut type peut avoir l'une des valeurs ci-dessous afin de spécifier le type de sélecteur de date à utiliser :
+
+ + +

 

+
+
+ +
+
+ value
+
+ Type : chaîne
+
+ La valeur initiale du sélecteur de date sous la forme AAAA/MM/JJ.
+
+
+ +

Propriétés

+

+

+
+
+ date
+
+ Type : entier
+
+ Le jour du mois actuellement sélectionné, entre 1 et 31. Modifiez cette propriété pour changer la date sélectionnée.
+
+
+
+
+ dateLeadingZero
+
+ Type : booléen
+
+ Une valeur en lecture seule indiquant si un zéro doit être affiché avant la date lorsqu'elle est inférieure à 10.
+
+
+
+
+ dateValue
+
+ Type : Date
+
+ La date actuellement entrée ou sélectionnée dans le sélecteur de date sous la forme d'un objet Date.
+
+
+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
+
+ month
+
+ Type : entier
+
+ Le mois actuellement sélectionné entre 0 (janvier) et 11 (décembre). Définissez cette propriété pour changer le mois sélectionné.
+
+
+
+
+ monthLeadingZero
+
+ Type : booléen
+
+ Une valeur en lecture seule indiquant si un zéro doit être affiché devant le mois s'il est inférieur à 10.
+
+
+
+
+ open
+
+ Type : booléen
+
+ Pour les sélecteurs de date de type popup, spécifie si celui-ci est ouvert. Définissez cette propriété pour ouvrir ou fermer le popup. Pour les autres types de sélecteurs de date, cette propriété est toujours à false.
+
+
+
+
+ readonly
+
+ Type : booléen
+
+ Si définie à true, l'utilisateur ne peut pas modifier la valeur de l'élément.
+
+
+ Cette propriété toute en minuscules n'est utilisée qu'avec l'élément preference et sera peut-être renommée en readOnly dans des versions ultérieures. D'autres éléments utilisent la propriété readOnly. L'attribut correspondant est cependant readonly en minuscules.
+
+
+
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+ +
+
+
+
+ value
+
+ Type : chaîne
+
+ La date actuellement sélectionnée au format AAAA/MM/JJ. Contrairement à la propriété month, les mois varient ici dans l'intervalle 01 à 12. Définissez cette propriété pour changer la date sélectionnée.
+
+
+
+
+ year
+
+ Type : entier
+
+ L'année actuellement sélectionnée entre 1 et 9999. Définissez cette propriété pour changer la date sélectionnée.
+
+
+
+
+ yearLeadingZero
+
+ Type : booléen
+
+ Une valeur en lecture seule indiquant si un zéro doit être affiché devant l'année si elle est inférieure à 1000.
+
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+
Interfaces +
nsIDOMXULControlElement +
+
+
diff --git a/files/fr/archive/mozilla/xul/description/index.html b/files/fr/archive/mozilla/xul/description/index.html new file mode 100644 index 0000000000..2895ae7922 --- /dev/null +++ b/files/fr/archive/mozilla/xul/description/index.html @@ -0,0 +1,150 @@ +--- +title: description +slug: Archive/Mozilla/XUL/description +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/description +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Cet élément sert à créer un bloc de texte. Celui-ci peut être défini soit avec l'attribut value, soit en plaçant le texte entre les balises d'ouverture et de fermeture de l'élément description. L'attribut value sert à définir du texte apparaissant sur une seule ligne. Si du texte apparait comme enfant de l'élément description, il s'étalera éventuellement sur plusieurs lignes. Il peut contenir du balisage arbitraire, qui peut être stylé le cas échéant. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
crop, disabled, tabindex value +
+
Propriétés +
accessibleType, crop, disabled, tabIndex, value +
+
Classes de style +
header, indent, monospace, plain, small-margin +
+

Exemples

+
Image:XUL_ref_description.png
+
<description>
+  Ceci est une longue section de texte qui sera affichée.
+</description>
+
+

Attributs

+

+

+ +
crop +
Type : une des valeurs ci-dessous +
Si le label de l'élément est trop long pour être contenu dans son espace donné, le texte sera tronqué du côté indiqué par l'attribut crop. Une ellipse (…) sera utilisée à la place du texte tronqué. Si la direction de la boîte est inversée, le tronquage l'est également. +
+ + + +
+
+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+ + +
+
+ +
value +
Type : chaîne +
Cet attribut chaîne permet d'associer une valeur de données avec un élément. Il n'est destiné à aucune utilisation particulière, mais vous pouvez y accéder avec un script pour votre usage propre.. +
+ + +
+ +

Propriétés

+

+

+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+
+
crop +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut crop. +
+ +
+
+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+ +
+
+
value +
Type : chaîne +
Obtient et définit la valeur de l'attribut value. +
+ +
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Classes de style

+
+
header
+
A class used for headings. Typically, this will cause the text to appear bold.
+
+
+
indent
+
This class causes the text to be indented on its left side.
+
+
+
monospace
+
This class causes the text to be displayed in a monospace font.
+
+
+
plain
+
This class causes the element to be displayed with no border or margin.
+
+
+
small-margin
+
This class causes the text to be displayed with a smaller margin.
+
+ +

Sujets liés

+

À faire. +

diff --git a/files/fr/archive/mozilla/xul/dropmarker/index.html b/files/fr/archive/mozilla/xul/dropmarker/index.html new file mode 100644 index 0000000000..88f32fb59d --- /dev/null +++ b/files/fr/archive/mozilla/xul/dropmarker/index.html @@ -0,0 +1,88 @@ +--- +title: dropmarker +slug: Archive/Mozilla/XUL/dropmarker +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/dropmarker +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un dropmarker est un bouton avec une flèche qui révèle plus de détails lorsque l'on appuie dessus. Il n'est pas prévu pour être utilisé comme un élément séparé, mais comme partie d'un autre élément. Par exemple, l'élément menulist et le type « popup » d'un sélecteur de date utilisent un dropmarker qui, lorsqu'on clique dessus, fera apparaître un menu popup. +

+

Attributs

+ + + + + + +

Hérités de 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

+
+ +

Propriétés

+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +
+
diff --git "a/files/fr/archive/mozilla/xul/faq_et_r\303\250gles_pour_les_accesskeys_en_xul/index.html" "b/files/fr/archive/mozilla/xul/faq_et_r\303\250gles_pour_les_accesskeys_en_xul/index.html" new file mode 100644 index 0000000000..12a2836539 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/faq_et_r\303\250gles_pour_les_accesskeys_en_xul/index.html" @@ -0,0 +1,74 @@ +--- +title: FAQ et règles pour les accesskeys en XUL +slug: Archive/Mozilla/XUL/FAQ_et_règles_pour_les_accesskeys_en_XUL +tags: + - XUL +translation_of: Archive/Mozilla/XUL/XUL_Accesskey_FAQ_and_Policies +--- +

+

+

Qu'est-ce qu'une accesskey ?

+

Une accesskey ou touche mnémonique est une lettre soulignée dans une page Web, un menu ou un dialogue qui indique à l'utilisateur un raccourci clavier rapide simulant un clic sur cet élément. Par exemple, un bouton « Appliquer » peut avoir la lettre « A » soulignée. Sous Windows et UNIX, appuyer sur les touches <kbd>ALT+A</kbd> est une façon pratique de pousser le bouton. Sous Macintosh, les accesskeys ne sont disponibles qu'en HTML et pas en XUL, et elles sont activées en utilisant la touche <kbd>CTRL+</kbd> lettre au lieu de <kbd>ALT</kbd>. +

+

Comment une accesskey est-elle ajoutée à un contrôle de formulaire ?

+

Une accesskey peut être ajoutée à un contrôle ou libellé de formulaire HTML ou XUL en utilisant l'attribut accesskey. Par exemple, voici comment on peut ajouter une accesskey à un bouton XUL : +

+ + + + +
<button label="Appliquer maintenant" accesskey="A" /> +Appliquer maintenant +
- ou - +
<button label="Appliquer maintenant" accesskey="a" /> +Appliquer maintenant +
+

Dans Mozilla, nous utilisons des DTD pour rajouter une autre couche d'abstraction à des fins d'internationalisation. L'exemple ci-dessus devrait donner : +

<button label="Appliquer maintenant" accesskey="&applyInstantly.accesskey" /> +

(Utilisez toujours accesskey au lieu de akey). +

Si des méthodes comme confirm(), confirmEx() ou prompt() sont utilisées pour créer un dialogue, utilisez un « & » devant le texte du bouton ou de la case à cocher fait du caractère qui suit une accesskey. Par exemple, &Maintenant transforme « M » en accesskey soulignée. Pour insérer un véritable caractère esperluète, utilisez &&. +

+

Comment choisir une lettre d'accesskey ?

+ +

Y a-t-il des bogues critiques que je devrais connaître ?

+ +

Où les accesskeys doivent-elles être ajoutées ?

+

Recherchez les dépendances du bug 129179 (le méta bogue de gestion des accesskeys XUL), ou recherchez les bogues avec « accesskey » ou « mnemonic » dans le résumé, ou recherchez les dialogues où il n'y a pas d'éléments avec des lettres soulignées. +

Ouvrez les bogues sous le composant « Keyboard Navigation », et rendez le méta bug 129179 dépendant de ceux-ci. +

+
+
diff --git a/files/fr/archive/mozilla/xul/guide_des_popups/index.html b/files/fr/archive/mozilla/xul/guide_des_popups/index.html new file mode 100644 index 0000000000..aaebd62a1b --- /dev/null +++ b/files/fr/archive/mozilla/xul/guide_des_popups/index.html @@ -0,0 +1,69 @@ +--- +title: Guide des popups +slug: Archive/Mozilla/XUL/Guide_des_popups +translation_of: Archive/Mozilla/XUL/PopupGuide +--- +

+

+

Popups et menus

+

Différents types de popups et menus peuvent être créés. Un popup est un menu ou une fenêtre flottante sans barre de titre, bordures ou autres décorations de fenêtre qui peut s'étendre au-delà des limites de la fenêtre principale. +

+

Types de popups

+

XUL fournit un certain nombre de types d'éléments différents qui peuvent être utilisés pour créer des menus popups ou d'autres types de widgets popups, qui varient selon la manière dont ils sont attachés à un élément et de s'ouvrir. Un aperçu rapide de chaque type est donné ici ; plus de détails pour chacun des types peuvent être obtenus en suivant les liens correspondants. +

Dans ce guide, le terme « popup » fait référence à tous les types de popups, tandis que le terme « menu » fait référence à un type particulier de popup. En particulier, les deux premiers types de la liste ci-dessous sont des menus. +

+
Menus +
Un menu s'utilise lorsque l'on désire avoir une série de commandes pouvant être activées par l'utilisateur, mais sans devoir utiliser la place que prendrait un bouton pour chaque commande. Un menu est normalement masqué, et lorsqu'il est activé un popup contenant la liste des commandes apparaît. L'utilisateur peut sélectionner une commande et le menu disparaît à nouveau. +
On crée un menu avec l'élément menupopup. Il affiche des éléments dans une liste, peut afficher des sous-menus et fournit une navigation au clavier entre les différents éléments. Un menu ne doit contenir que des éléments liés aux menus. +
Menus contextuels +
Un menu contextuel est comme un menu normal, sauf que les commandes qu'il contient s'appliquent à ce sur quoi l'utilisateur a cliqué pour ouvrir le menu. Souvent, selon l'élément sur lequel on a cliqué, certaines commandes seront masquées si elles ne sont pas applicables à cet élément.
Panels +
Un panel peut contenir tout type de contenu. Il est utile lorsque l'on veut afficher certains contrôles temporairement par dessus l'interface utilisateur existante. Par exemple, un champ de recherche dans un popup peut être utilisé pour permettre une recherche et disparaître dès qu'un terme de recherche a été entré. +
Un panel se crée à l'aide de l'élément panel. +
Tooltips +
Lorsque le pointeur de la souris est positionné au dessus d'un contrôle d'interface utilisateur, un tooltip fournit une bulle d'aide ou d'information, une petite boîte avec un texte descriptif concernant ce contrôle. Lorsque le pointeur est déplacé en dehors du contrôle, le tooltip disparaît automatiquement. +
Un tooltip peut être créé en définissant l'attribut tooltiptext sur un élément ou à l'aide de l'élément tooltip. +
+

Utilisation de popups

+

Les informations complémentaires suivantes sont disponibles concernant la manipulation de menus et de popups. +

+
Ouverture d'un menu ou d'un popup +
La plupart des menus et des popups sont ouverts automatiquement lorsqu'ils sont associés avec un élément. Pour ouvrir un popup à l'aide d'un script, utilisez les méthodes openPopup ou openPopupAtScreen. Pour des informations détaillées sur la manière d'ouvrir un popup, consultez Ouverture d'un popup ou Ouverture d'un menu. +
+
Fermeture d'un menu ou d'un popup +
Pour des informations sur la fermeture d'un popup, consultez Fermeture d'un popup ou Fermeture d'un menu. +
+
Comment sont placés les popups +
Pour en savoir plus sur la manière dont la position d'un popup à l'écran est déterminée, et comment aligner des popups sur d'autres éléments, consultez Positionnement des popups. +
+
Determiner si un popup est ouvert +
Pour déterminer si un popup ou un menu est ouvert, consultez Déterminer si un popup est ouvert. +
+
Déplacement d'un popup +
Les popups peuvent être déplacés à l'aide de la méthode moveTo. Consultez Déplacement d'un popup. +
+
Redimensionnement d'un popup +
La taille d'un popup peut être ajustée à l'aide de la méthode sizeTo. Consultez Redimensionnement d'un popup. +
+
Attacher des menus à un bouton +
Pour en savoir plus sur l'ouverture d'un menu lorsqu'un bouton est enfoncé, consultez Boutons de menus. +
+
Fonctionnalités des éléments d'un menu +
Pour en savoir plus sur les diverses fonctionnalités des éléments d'un menu, consultez Fonctionnalités de l'élément menuitem +
+
Modification des éléments d'un menu +
Pour ajouter, insérer et retirer des éléments d'un menu, consultez Modification d'un menu. +
+
Évènements d'ouverture ou fermeture de popups +
Les évènements popupshowing et popupshown se déclenchent lorsqu'un menu ou un popup s'ouvre. Les évènements popuphiding et popuphidden se déclenchent lorsqu'un menu ou un popup se ferme. Pour plus d'informations sur ces évènements, consultez Évènements des popups. +
+
Gestion des touches du clavier dans les popups +
Pour des informations sur la manière dont les touches du clavier sont gérées au sein des menus et panels, consultez Gestion des touches du clavier dans les popups. +
+
Considérations liées à la plateforme +
Consultez les considérations spéciales des menus par plateforme pour quelques notes concernant la gestion des menus sur certaines plateformes, par exemple la création d'un menu Application sur un Macintosh. +
+

Utilisation des popups dans des extensions

+

Les extensions peuvent ajouter des éléments de menus supplémentaires à un menu de la barre de menus ou au menu contextuel. De plus une extension peut ajouter un tout nouveau menu complet. Par exemple, une extension peut vouloir ajouter une nouvelle commande dans le menu Outils pour ouvrir un dialogue spécifique à l'extension. Une autre tâche courante est de créer une extension ajoutant un élément au menu contextuel du navigateur. Consultez Utilisation de menus et popups dans des extensions pour plus de détails. +

+
+
diff --git a/files/fr/archive/mozilla/xul/guide_des_popups/ouverture_et_fermeture/index.html b/files/fr/archive/mozilla/xul/guide_des_popups/ouverture_et_fermeture/index.html new file mode 100644 index 0000000000..ee61ae1e5f --- /dev/null +++ b/files/fr/archive/mozilla/xul/guide_des_popups/ouverture_et_fermeture/index.html @@ -0,0 +1,174 @@ +--- +title: Ouverture et fermeture +slug: Archive/Mozilla/XUL/Guide_des_popups/Ouverture_et_fermeture +tags: + - Guide Popup XUL + - XUL +translation_of: Archive/Mozilla/XUL/PopupGuide/OpenClose +--- +

Ouverture et fermeture de popups

+ +

Les popups et menus peuvent être ouverts et fermés depuis un script.

+ +

Ouverture d'un menu

+ +

Les menus s'afficheront d'eux-mêmes automatiquement dès que nécessaire sans aucun travail supplémentaire. Par exemple, le popup d'un menu s'ouvrira lors d'un clic sur le label de menu, et un sous-menu s'ouvrira lors du passage de la souris sur l'élément du menu parent.

+ +

Cependant, vous pourrez vouloir ouvrir un menu manuellement dans certaines situations. L'élement menu a une propriété open qui peut être définie à true pour ouvrir le menu, ou false pour le fermer. Un exemple simple :

+ +
un_menu.open = true;
+
+ +

Cette unique ligne de code ouvrira un menu référencé par la variable « un_menu ». Notez que la propriété open s'applique au menu ou au bouton, pas à l'élément menupopup. Voici un exemple complet utilisant un bouton pour ouvrir un menu :

+ +
<button label="Ouvrir un menu"
+        oncommand="document.getElementById('editMenu').open = true;"/>
+
+<menu id="editMenu" label="Édition">
+  <menupopup>
+    <menuitem label="Couper"/>
+    <menuitem label="Copier"/>
+    <menuitem label="Coller"/>
+  </menupopup>
+</menu>
+
+ +

Cette technique peut être utilisée pour les menupopups qui utilisent la balise menu tant que pour ceux qui utilisent les balises button et toolbarbutton. Pour les menupopups attachés à d'autres éléments à l'aide des attributs popup ou context, consultez Ouverture d'un popup plus bas.

+ +

Comme avec les autres manières d'ouvrir un menu, l'évènement popupshowing sera déclenché pour permettre de personnaliser les commandes apparaissant dans le menu.

+ +

Dans certaines situations, il n'est pas permis d'ouvrir un menu :

+ + + +

Fermeture d'un menu

+ +

Un menu se fermera automatiquement une fois que l'utilisateur a fait une sélection depuis celui-ci. Lorsqu'un élément de menu est sélectionné, il déclenche un évènement de commande afin que du code puisse être utilisé pour effectuer une action. L'utilisateur peut annuler la sélection d'une commande en appuyant sur la touche Échap. Ceci fermera un menu simple, mais s'il avait un menu parent, celui-ci restera ouvert. Un utilisateur peut également annuler la sélection en cliquant end ehors du menu. Dans ce cas, non seulement le menu sera fermé, mais tous les menus parents le seront également.

+ +

Un menu peut être fermé par un script en définissant la propriété open à false, le contraire de ce qu'on ferait pour ouvrir le menu. La propriété open s'applique au menu ou au bouton, mais pas au menupopup.

+ +
un_menu.open = false;
+
+ +

Cette commande fermera uniquement un seul niveau de menus, de sorte que tout menu parent devra être fermé avec une commande semblable si nécessaire. Cependant, les éventuels menus enfants de « un_menu » dans cet exemple seront fermé puisque celui-ci ne sera plus ouvert. Par exemple, disons qu'un menu Fichier a un sous-menu contenant une liste de fichiers récemment utilisés. Si les deux menus sont ouverts et que l'on met la propriété open du sous-menu à false, celui-ci sera fermé mais le menu Fichier parent restera ouvert. D'un autre côté, si c'est la propriété open du menu Fichier qui est mise à false, les deux menus se fermeront.

+ +

Cette technique peut être utilisée tant pour les menupopups qui utilisent les balises menu et button que toolbarbutton. Pour les menupopups attachés à d'autres éléments à l'aide des attributs popup ou context, consultez Fermeture d'un popup plus bas.

+ +

Lorsqu'un menu est fermé, l'évènement popuphiding est déclenché sur celui-ci. On peut donc attacher un écouteur sur cet évènement pour retirer toute commande qui avait été ajoutée au cours de l'évènement popupshowing.

+ +

Les menus et popups seront également fermés lorsque le document ou la fenêtre dans lesquels ils sont contenus seront fermés, ou si l'élément menupopup est retiré du document. Ce sont des situations dans lesquelles les évènements popuphiding et popuphidden peuvent ne pas se déclencher étant donné que les éléments concernés ne sont plus disponibles. Si des actions spécifiques doivent être effectués à ce moment-là, il vaut mieux utiliser un évènement unload.

+ +

Test de l'état d'ouverture d'un menu

+ +

Pour vérifier si un menu est ouvert, vérifiez l'état de sa propriété open. Si celle-ci vaut true, le menu est ouvert, sinon il est fermé.

+ +
var open = un_menu.open;
+
+ +

Ouverture d'un popup

+ +

Pour ouvrir des popups de menu utilisant les balises menu, button et toolbarbutton, consultez Ouverture d'un menu plus haut.

+ +

Les popups attachés à l'aide de l'attribut popup sont ouverts lors d'un clic gauche de la souris par l'utilisateur. Il n'y a pas moyen d'effectuer la même action à partir du clavier, vous devrez donc toujours fournir une manière alternative d'accéder aux fonctionnalités du menu. Cela peut se faire soit en plaçant des commandes alternatives ailleurs dans l'interface, ou en fournissant un raccourci clavier permettant d'ouvrir le menu. Une fois que celui-ci est ouvert, le clavier peut être utilisé pour y naviguer et sélectionner des éléments de la manière habituelle.

+ +

Les popups attachés à l'aide de l'attribut context sont ouvert lorsque l'utilisateur effectue une action essayant d'ouvrir un menu contextuel. Cette action diffère selon la plateforme, mais en général il s'agit de cliquer sur l'élément avec le bouton de droite de la souris. Sur les systèmes Macintosh avec un seul bouton, un menu contextuel peut être ouvert soit en maintenant le bouton de la souris enfoncé, soit en appuyant sur la touche Control lors du clic sur le bouton. Sous Windows, le menu contextuel peut également être ouvert à l'aide de la touche menu sur le clavier (Il s'agit de la touche figurant sur de nombreux claviers à côté de la touche Ctrl de droite avec une image de menu) ou en appuyant sur Shift+F10. Pour cette raison, il ne faut pas supposer que l'utilisateur a forcément utilisé la souris pour ouvrir le menu contextuel.

+ +
La méthode openPopup
+ +

Quel que soit le type de popup, il peut être nécessaire de l'ouvrir programmatiquement. Pour ce faire, utilisez la méthode openPopup du popup. Cette méthode peut être utilisée pour tout type de popup, qu'il s'agisse d'un menupopup, d'un panel ou un tooltip, même ceux qui peuvent être ouverts par d'autres moyens, par exemple un popup attaché par l'attribut context.

+ +

La méthode openPopup peut recevoir six paramètres qui sont utilisés pour indiquer comment et où le popup doit être positionné. Ils seront décrits plus loin. La méthode openPopup est définie comme suit :

+ +
void openPopup(in DOMElement anchorElement,
+               in String position,
+               in long x,
+               in long y,
+               in boolean estMenuContextuel,
+               in boolean ecraserAttributs);
+
+ +

Tout d'abord, un exemple :

+ +
un_popup.openPopup(ancre, "after_start", 0, 0, false, false);
+
+ +

Cet exemple ouvrira un popup situé juste sous un autre élément référencé par « ancre ». Ceci émula la façon dont s'ouvre un menu, où « ancre » serait l'élément menu. Il est possible d'utiliser la méthode openPopup avec un menu, cependant il est plus facile de définir simplement l'attribut open du menu à true, ce qui gèrera le positionnement du menu à votre place. Notez que si l'attribut open s'applique au menu ou bouton parent, la méthode openPopup s'applique à l'élément menupopup.

+ +

L'ancre d'un popup est le nœud élément à côté duquel le popup sera affiché. Par exemple, pour qu'un popup apparaisse à côté d'un bouton, passez une référence au bouton comme premier paramètre de la méthode openPopup. Dans cet exemple, le popup sera ouvert relativement à l'élément du document.

+ +
un_popup.openPopup(document.documentElement, "end_before", 0, 0, false, false);
+
+ +

Le second paramètre d'openPopup est la position par rapport à l'ancre, qui indique de quel côté de celle-ci le popup sera positionné. Par exemple, la valeur « end_before » utilisée dans l'exemple précédent indique de placer le côté gauche du popup le long du bord droit de l'élément d'ancrage, avec les deux bords supérieurs alignés. Cela peut être compliqué à comprendre, consultez alors Positionnement d'un popup qui décrit ce processus plus en détail et fournit des images montrant les valeurs possibles et la façon dont serait aligné un popup pour chacune des valeurs.

+ +

Les troisième et quatrième paramètres d'openPopup sont des décalages x et y. Après le positionnement initial du popup, il est possible de l'ajuster en spécifiant des valeurs non nulles pour ces décalages. Ceci permet de contrôler précisément le popup tout en étant toujours ancré à un élément particulier. Des valeurs positives peuvent être utilisées pour ajuster le popup vers la droite ou vers le bas et des valeurs négatives pour l'ajuster vers la gauche ou le haut.

+ +

Dans l'exemple qui suit, le popup est ancré sous un élément, tout en étant décalé de 10 pixels vers la droite et de 2 pixels vers le haut.

+ +
un_popup.openPopup(ancre, "after_start", 10, -2, false, false);
+
+ +

Notez que l'ancre et les décalages spécifient uniquement la position lors de l'ouverture du popup. Si l'ancre est déplacée ou supprimée tandis que le popup est ouvert, le popup ne suivra pas. Cependant, il est possible de déplacer un popup pendant qu'il est ouvert, consultez Déplacement et redimensionnement d'un popup.

+ +

Le cinquième paramètre d'openPopup, isContextMenu, indique si le popup est ouvert comme un menu contextuel. Passez true si c'est le cas et false dans le cas contraire. Le valeur à passer devrait être évidente selon l'endroit dont vous appelez openPopup. Notez que le même menu peut être ouvert des deux manières, ce paramètre n'influe donc pas sur la manière dont le popup apparaît. Ce qu'il modifie est la manière dont le focus et la sélection du menu sont gérés. Tant que vous passez la bonne valeur par rapport à la situation, il n'est pas très important de connaître les différences particulières entre les deux cas.

+ +

Cependant, vous pouvez voir l'effet de ce paramètre en utilisant les marque-pages de Firefox. Essayez d'ouvrir un sous-menu des marque-pages et notez comme la sélection change toujours lorsque la souris est déplacé vers d'autres menus, et la manière dont le sous-menu est fermé lorsque la souris le quitte. Ouvrez à présent un menu contextuel sur le même marque-page et remarquez que les autres menus ne sont pas affectés par le mouvement de la souris. C'est cette différence qui est gérée par le paramètre isContextMenu.

+ +

Enfin, le dernier paramètre de la méthode openPopup, ecraserAttributs indique si les attributs placés sur l'élément popup écrasent les paramètres fournis. Ceci permet à un popup d'utiliser un comportement particulier de positionnement avec les attributs position, left et top à la place. Plus de détails sur ces attributs peuvent être trouvés dans la section Positionnement d'un popup.

+ +
Popups non ancrés avec openPopup
+ +

Si le premier paramètre de la méthode openPopup vaut null, un popup non ancré est créé. Dans ce cas, le deuxième argument de positionnement n'est pas utilisé et une chaîne vide peut être utilisée. Voici un exemple :

+ +
un_popup.openPopup(null, "", 60, 50, false, false);
+
+ +

Un popup non ancré utilise les décalages x et y, dans ce cas 60 et 50 sont des décalages depuis le coin de la fenêtre ou du cadre. De cette manière, un popup peut être positionné relativement à la fenêtre plutôt qu'à un nœud spécifique. Par exemple, il peut être intéressant d'ouvrir un popup à la position courante de la souris au moment du clic. Voici un exemple de gestionnaire d'évènement de clic de souris :

+ +
function mouseClicked(event)
+{
+  var panel = document.getElementById("un-panel");
+  panel.openPopup(null, "", event.clientX, event.clientY, false, false);
+}
+
+ +
La méthode openPopupAtScreen
+ +

Une seconde méthode, openPopupAtScreen, peut être utilisée pour ouvrir un popup et le placer à des coordonnées précise sur l'écran. Dans ce cas, le popup n'est pas ancré à un élément et apparaît simplement à l'emplacement spécifié par les paramètres x et y passés à cette méthode.

+ +
void openPopupAtScreen(in long x, in long y, in boolean estMenuContextuel);
+
+ +

Le paramètre ecraserAttributs indique qu'un menu contextuel est ouvert et fonctionne de la même façon que pour la méthode openPopup. Dans l'exemple qui suit, le popup est ouvert à la position horizontale 100 et à la position verticale 200 :

+ +
popup.openPopupAtScreen(100, 200, false);
+
+ +

Notez que si les coordonnées fournies auraient conduit à un popup situé partiellement ou totalement hors de l'écran, celui-ci sera déplacé de manière à être totalement visible, et pourra être redimensionné si nécessaire.

+ +

Fermeture d'un popup avec la méthode hidePopup

+ +

Un menu popup est fermé par l'utilisateur en appuyant sur la touche Échap ou en cliquant quelque part en dehors du popup.

+ +

Pour fermer des menupopups utilisant les balises menu, button et toolbarbutton, consultez Fermeture d'un menu plus haut.

+ +

Pour fermer un menu depuis un script utilisez sa méthode hidePopup. Elle ne prend aucun paramètre.

+ +
popup.hidePopup();
+
+ +

Déterminer si un popup est ouvert

+ +

Pour les menus, il est possible de vérifier la propriété open de l'élément menu, button ou toolbarbutton. Si celle-ci vaut true, le menu est ouvert.

+ +

Pour les autres types de popups, la propriété state peut être examinée à cette fin. Elle est disponible pour tous les types de popups, qu'il s'agisse de menus, panels ou de tooltips. Lorsqu'un menu est fermé, la propriété state aura la valeur closed, tandis que pour un popup visible, elle aura la valeur open. Cette propriété est en lecture seule et s'applique aux éléments menupopup, panel ou tooltip.

+ +

La propriété state peut également avoir deux autres valeurs, utilisées lorsqu'un popup est en train de passer de l'état ouvert à l'état fermé et vice versa. Lorsqu'un popup est en train de s'ouvrir, la propriété state a une valeur de showing tandis qu'elle aura une valeur hiding au cours de de sa fermeture. La première se rencontrera au cours de l'évènement popupshowing, tandis que la seconde se rencontrera au cours de l'évènement popuphiding.

+ +

Par exemple, la propriété state pourrait être utilisée pour déterminer si un panel est déjà ouvert. Si c'est le cas, vous pouvez vouloir éviter de manipuler l'interface utilisateur de la fenêtre principale, étant donné que l'utilisateur ne sera plus directement en train d'interagir avec elle.

+ +
 
diff --git a/files/fr/archive/mozilla/xul/guide_des_popups/panels/index.html b/files/fr/archive/mozilla/xul/guide_des_popups/panels/index.html new file mode 100644 index 0000000000..8ebe7d2ea8 --- /dev/null +++ b/files/fr/archive/mozilla/xul/guide_des_popups/panels/index.html @@ -0,0 +1,128 @@ +--- +title: Panneaux (panels) +slug: Archive/Mozilla/XUL/Guide_des_popups/Panels +tags: + - Guide Popup XUL + - XUL +translation_of: Archive/Mozilla/XUL/PopupGuide/Panels +--- +

Un panneau est une fenêtre contextuelle pouvant gérer n'importe quel type de contenu. On l'utilise notamment comme support d'affichage temporaire pour la sélection ou la saisie de données.

+ +

L'élément panel

+ +

L'élément panel sert à créer des panneaux permettant d'afficher une série d'éléments quelconques, placés comme enfants de l'élément "panel". Par exemple, le "panel" suivant affichera une boîte de texte pour entrer un nom. Notez que le panneau n'est pas placé dans un fichier distinct et est placé à l'intérieur d'une autre fenêtre.

+ +
<?xml-stylesheet href="chrome://global/skin" type="text/css"?>
+<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+<button label="Details" type="panel">
+  <panel id="search-panel">
+    <label control="name" value="Name:"/>
+    <textbox id="name"/>
+  </panel>
+</button>
+
+</window>
+ +

De nombreux panneaux seront associés à un bouton, comme dans cet exemple. Lorsque vous appuyez sur le bouton, le panneau est ouvert. En cliquant à l'extérieur du panneau ou en appuyant sur "Escape" (échappe), le panneau se ferme. Vous pouvez également placer un bouton de fermeture dans le panneau qui le fermera avec un script, si vous le souhaitez. Lorsque vous voulez associer un panneau à un bouton, placez l'élément <panel> directement à l'intérieur de l'élément button .  Vous devez aussi déterminer un attribut "type" avec la valeur "panel", ou le bouton se comportera comme un bouton régulier.

+ +

Le panneau contextuel apparaît par défaut dans le coin en haut à gauche, juste sous le bord inférieur du bouton, comme le ferait un menu. Toutefois, la position peut être modifiée. Pour plus d'informations sur la position du panneau contextuel, voir Positioning Popups (en).

+ +

Seuls les boutons (et les boutons de la barre d'outils) ont ce comportement automatique d'ouverture de la fenêtre contextuelle lorsqu'ils sont pressés. Pour d'autres types d'éléments, vous devrez utiliser une technique différente comme dans l'exemple suivant :

+ +
label value="Search" popup="search-panel"/>
+
+<panel id="search-panel">
+  <label control="search" value="Terms:"/>
+  <textbox id="search"/>
+</panel>
+ +

Image:Popupguide-panel.png

+ +

Pour attacher un panneau à un élément qui n'est pas un bouton, par exemple pour qu'il s'ouvre lors de l'appui sur une étiquette, utilisez l'attribut popup. Celui-ci doit être défini comme l'id d'un "panel" au sein du même document. Lors d'un clic gauche sur l'élément portant l'attribut popup, le panneau correspondant s'affichera. Par exemple, pour attacher le panneau contextuel défini plus haut à une étiquette, utilisez le code qui suit :

+ +
<label value="Rechercher" popup="search-panel"/>
+
+ +

Le résultat est un bouton de recherche ouvrant un panneau permettant d'entrer des termes de recherche. Celui-ci apparaîtra avec son coin supérieur gauche à la position de la souris. Dans ce cas, il serait sans doute préférable qu'il apparaisse plutôt en dessous de l'étiquette. L'attribut position peut être utilisé afin de contrôler le placement du panneau contextuel. Voici un exemple complet :

+ +
<panel id="search-panel" position="after_start">
+  <label control="search" value="Termes :"/>
+  <textbox id="search"/>
+</panel>
+
+<label value="Recherche" popup="search-panel"/>
+
+ +

L'attribut position a été ajouté à l'élément "panel" avec la valeur « after_start ». Le résultat en est que le panel n'est plus affiché là où l'on a cliqué, mais le long du bord inférieur de l'étiquette. Pour plus d'informations concernant cet attribut et les autres valeurs possibles, consultez Positionnement des popups (en).

+ +

Il est également possible d'ouvrir un panneau comme un menu contextuel à l'aide de l'attribut context à la place de l'attribut "popup". Celui-ci fonctionne de la même manière qu'un menu contextuel, à part qu'on utilise un élément "panel" à la place d'un élément "menupopup". Consultez Menus contextuels (en) pour plus de détails à ce sujet.

+ +

Ouverture d'un panneau par script

+ +

Un panneau, comme toutes les fenêtres contextuelles, dispose d'une méthode openPopup pouvant être utilisée pour son ouverture à partir d'un script. Par exemple, le code suivant ouvrirait un panneau sous un bouton :

+ +
panel.openPopup(button, "after_start", 0, 0, false, false);
+ +

De manière similaire, la méthode openPopupAtScreen ouvrira un panneau à une position précise de l'écran. Pour plus de détails concernant ces deux méthodes, consultez Ouverture et fermeture de fenêtres contextuelles.

+ +

Fermeture d'un panneau

+ +

Un panneau est fermé automatiquement lorsque l'utilisateur clique en dehors de celui-ci. Il est cependant courant d'avoir un élément comme un bouton de fermeture dans le panneau. Par exemple, dans le panneau de recherche présenté plus haut, nous pourrions ajouter un bouton fermant le panneau lorsqu'il est utilisé :

+ +
<script>
+function doSearch() {
+  document.getElementById("search-panel").hidePopup();
+}
+</script>
+
+<toolbarbutton label="Rechercher" type="panel">
+  <panel id="search-panel" position="after_start">
+    <textbox id="search"/>
+    <button label="Rechercher" oncommand="doSearch();"/>
+  </panel>
+</toolbarbutton>
+ +

Dans cet exemple, la fonction doSearch est appelée lors d'un clic sur le bouton "Rechercher". La fonction identifie le panneau contextuel et appelle sa méthode hidePopup. Naturellement, cette fonction devrait également comprendre des instructions pour lancer l'opération de recherche proprement dite.

+ +

Interdiction de fermeture automatique des panneaux

+ +

Un panneau contextuel est fermé  par un clic de l'utilisateur en-dehors de celui-ci ou l'appui sur la touche Échap. C'est la manière habituelle, pour un utilisateur, d'annuler l'opération. Il peut également être utile de placer un bouton d'annulation ou de fermeture dans le panneau, en particulier si celui-ci est grand et contient un grand nombre de contrôles.

+ +

Cependant parfois, vous voudrez peut-être que le panneau reste ouvert même si l'utilisateur clique en dehors de celui-ci. C'est notamment utile pour créer des panneaux d'outils flottants. Pour ce faire, positionnez son attribut noautohide sur "true" (vrai).

+ +
<panel id="search-panel" noautohide="true">
+  <textbox id="search"/>
+  <button label="Rechercher" oncommand="doSearch();"/>
+  <button label="Annuler" oncommand="this.parentNode.hidePopup();"/>
+</panel>
+
+ +

Comme le panneau ne peut plus être fermé en cliquant ailleurs, il doit toujours fournir un moyen de le faire. Dans cet exemple, on a ajouté un bouton Annuler.

+ +

Focus sur les panneaux

+ +

Les éléments se trouvant dans des panneaux peuvent recevoir le focus de la souris, et l'élément ayant le focus peut changer en appuyant sur la touche Tab. Lors de l'ouverture d'un panneau contextuel, si un élément de la fenêtre principale a le focus, il le perd et reçoit un évènement blur. Bien qu'aucun élément du panneau ne reçoive le focus par défaut, l'utilisateur peut le donner à son premier élément en appuyant sur la touche Tab. Si vous désirez qu'il se trouve sur un élément particulier par défaut, lors de l'ouverture de panneau, modifiez le focus dans le gestionnaire d'évènement popupshown. Par exemple, pour que la boîte de texte de l'exemple précédent reçoive le focus initial :

+ +
<panel id="search-panel" onpopupshown="document.getElementById('search').focus()">
+
+ +

Pour désactiver l'ajustement du focus à l'ouverture d'un panneau, définissez l'attribut noautofocus à true :

+ +
<panel noautofocus="true">
+
+ +

Dans ce cas, le focus restera sur l'élément de la fenêtre principale qui avait le focus à l'ouverture du panneau. Notez que cela maintient également le focus à l'intérieur du panneau quand celui-ci est fermé.

+ +

Lors de la fermeture d'un panneau, l'élément au sein de celui-ci, qui avait éventuellement le focus, le perd. L'élément qui avait le focus avant l'ouverture de la fenêtre contextuelle, quel qu'il soit, le récupère. Vous pouvez empêcher la suppression du focus avec l'attribut noautofocus  défini à true. De plus, l'attribut XULAttr("norestorefocus") }}  positionné sur true empêche le retour du focus sur l'élément qui l'avait avant. Normalement, seul ce dernier sera défini si besoin.

+ +

Ce processus de perte du focus à l'ouverture et à la fermeture d'un popup se déroule après le déclenchement des évènements popupshowing ou popuphiding, ce qui signifie que si ces évènements sont annulés, le focus ne sera pas perdu.

+ +
+

Letting panels be dragged by grabbing the background

+ Requires Gecko 7.0(Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4) +
(faire glisser les panneaux sur l'arrière-plan) + +

À partir de Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4), vous pouvez utiliser l'attribut backdrag pour créer des panneaux que l'utilisateur peut faire glisser (cliquer/glisser) n'importe où sur l'arrière-plan. C'est un simple attribut  booléen, avec lequel vous pouvez activer cette fonctionnalité comme ceci :

+ +
panel backdrag="true">
diff --git a/files/fr/archive/mozilla/xul/hbox/index.html b/files/fr/archive/mozilla/xul/hbox/index.html new file mode 100644 index 0000000000..f0168f08d0 --- /dev/null +++ b/files/fr/archive/mozilla/xul/hbox/index.html @@ -0,0 +1,98 @@ +--- +title: hbox +slug: Archive/Mozilla/XUL/hbox +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/hbox +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un élément conteneur pouvant contenir un nombre illimité d'éléments enfants. C'est l'équivalent de l'élément box. +

Vous trouverez plus d'informations dans le Tutoriel XUL.

+

Exemple

+
<!-- Deux boutons à droite -->
+<hbox>
+  <spacer flex="1"/>
+  <button label="Connection"/>
+  <button label="Ping" />
+</hbox>
+
+

Attributs

+ + + + + + +

Hérités de 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

+
+ +

Propriétés

+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+
Éléments +
box, vbox +
diff --git "a/files/fr/archive/mozilla/xul/ic\303\264nes_de_fen\303\252tre/index.html" "b/files/fr/archive/mozilla/xul/ic\303\264nes_de_fen\303\252tre/index.html" new file mode 100644 index 0000000000..f851d2c685 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/ic\303\264nes_de_fen\303\252tre/index.html" @@ -0,0 +1,17 @@ +--- +title: Icônes de fenêtre +slug: Archive/Mozilla/XUL/Icônes_de_fenêtre +tags: + - API_du_toolkit + - Extensions + - XPInstall + - XUL +translation_of: Archive/Mozilla/XUL/Window_icons +--- +

+

À partir de Firefox 1.5, Thunderbird 1.5 et XULRunner 1.8, il est possible de spécifier une icône pour une fenêtre XUL en plaçant des fichiers nommés <tt>mafenetre.ico</tt> (pour Windows) et <tt>mafenetre.xpm</tt> (Linux), où mafenetre est l'id de l'élément <window> de la fenêtre à laquelle vous voulez attacher l'icône, dans le sous-dossier <tt>chrome/icons/default</tt> de votre paquet installable. +

Ces icônes prendront le pas sur les fichiers d'icônes globaux, qui sont situés dans <tt>app_dir/chrome/icons/default</tt>. +

+

Anciennes versions

+

Pour gérer les anciennes applications comme Firefox 1.0, vous devrez copier manuellement les icônes dans <tt>app_dir/chrome/icons/default</tt> au premier démarrage (exemple de code). +

diff --git a/files/fr/archive/mozilla/xul/index.html b/files/fr/archive/mozilla/xul/index.html new file mode 100644 index 0000000000..14c9dad0bd --- /dev/null +++ b/files/fr/archive/mozilla/xul/index.html @@ -0,0 +1,116 @@ +--- +title: XUL +slug: Archive/Mozilla/XUL +tags: + - XUL +translation_of: Archive/Mozilla/XUL +--- +
Tutoriel XUL
+Ce tutoriel vous guidera dans vos premiers pas avec XUL. Il est tiré de la version anglaise de XULPlanet.
+ +
XUL est le langage d'interface utilisateur pour Mozilla basé sur XML. Il permet de construire des applications multiplatesformes riches en fonctionnalités, pouvant être ou non connectées à Internet. Ces applications peuvent facilement être personnalisées au niveau du texte, des graphiques et de leur mise en page et peuvent ainsi être facilement rhabillées selon leur destination et être fournies en plusieurs langues. Les développeurs Web qui sont déjà familiarisés avec le HTML dynamique peuvent apprendre le XUL rapidement et être opérationnels immédiatement.
+ +

Vous pouvez essayer une démonstration XUL grâce à cette table périodique des éléments XUL.

+ + + + + + + + +
+

Documentation

+ +
+
Référence des éléments XUL
+
Consultez également la documentation en français sur xulfr ainsi que la documentation de MDC sur prefwindow.
+
+ +
+
Les contrôles XUL
+
Une liste rapide de tous les contrôles XUL disponibles.
+
+ +
+
Vulgarisation XUL
+
Un tutoriel clair sur le développement de modules complémentaire Mozilla.
+
+ +
+
Présentation de XUL
+
Décrit les fonctionnalités et composants clés de XUL.
+
+ +
+
Guide sur les menus et popups
+
Un guide sur l'utilisation des menus et panneaux popup.
+
+ +
+
Comment réussir vos gabarits
+
Un guide détaillé sur les gabarits XUL (templates), qui sont un moyen de générer du contenu depuis une source de données. (à migrer vers XUL:Réussir vos gabarits)
+
+ +
+
Adaptation des applications XUL pour Firefox 3.0
+
Une liste des changements dans Firefox 3 qui affectent les développeurs XUL.
+
+ +
+
Adaptation des applications XUL pour Firefox 2.0
+
Une liste des changements dans Firefox 2 qui affectent les développeurs XUL.
+
+ +
+
Adaptation des applications XUL pour Firefox 1.5
+
Une liste des changements dans Firefox 1.5 qui affectent les développeurs XUL.
+
+ +

Tous les articles…

+ +
+
+ 		+

Communauté

+ +
    +
  • Voir les forums de Mozilla…
    • +
+ +

+ + + +

Outils

+ + + +

Tous les outils…

+ +

Sujets liés

+ +
+
JavaScript, XBL, CSS, RDF, Extensions, XULRunner
+
+
+ +

Categories

+ +

Interwiki Language Links

diff --git "a/files/fr/archive/mozilla/xul/introduction_\303\240_xul/index.html" "b/files/fr/archive/mozilla/xul/introduction_\303\240_xul/index.html" new file mode 100644 index 0000000000..27d8f9b784 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/introduction_\303\240_xul/index.html" @@ -0,0 +1,46 @@ +--- +title: Introduction à XUL +slug: Archive/Mozilla/XUL/Introduction_à_XUL +tags: + - Aide_pour_les_éditeurs_de_MDC + - Traduction_en_cours + - XUL +translation_of: Archive/Mozilla/XUL/Introduction_to_XUL +--- +

Introduction

+ +

Mozilla possède des "chromes" configurables et téléchargeables, ce qui veut dire que la position et même la présence ou l'absence d'un contrôle dans la fenêtre principale n'est pas figé dans l'application, mais chargé à partir de fichier d'interface IU (IU = Interface utilisateur). En effet, la plupart des fenêtres (principale et/ou dialogue) de Mozilla sont décrites en utilisant ce mécanisme. XUL, pour "XML User Interface Language" (Langage d'Interface Utilisateur format XML), est le nom pour le langage dans lequel ces descriptions d'interface sont faites.

+ +

Les fichiers de "chrome" sont affichés et gérés par le même moteur que celui qui affiche les pages HTML dans le navigateur. Les description d'IU font très bon ménage avec le HTML 4. Le XUL est une application de XML. En effet, c'est juste du XML avec des éléments spécifiques qui peuvent être implémentés dans du HTML.

+ +

Termes

+ +

"XPFE" est le terme qu'utilise l'organisation Mozilla pour décrire la Cross Platform Front End du Navigateur de Mozilla, car X et C semblent être semblables si on les tape longtemps et fortement avec un marteau (humour américain...). Le but est de construire des applications cross-platform  comme des navigateurs et des clients de courrier électronique à partir d'un kit d'outils créés pour cet usage. L'intention n'est pas d'implanter un framework générique pour application toutes plateformes confondues. Cela a déjà été fait, et au prix d'un grand travail. Nous voulons fournir un sous-ensemble de fonctionnalités inter-plateformes approprié pour construire des applications réseau comme les navigateurs, améliorant les fonctionnalités inter-plateformes déjà inclues dans Gecko, le moteur de rendu HTML de Mozilla.

+ +

Le terme de "cross-platform UI" est quelque peu trompeur. Les créateurs d'interface devront être capable de créer des IU qui marcheront sur des multiples plate-formes. Mais des descriptions claires d'UI, qui prennent en considération de nombreuses plateformes, diffèrent sur l'idée de la place correcte des divers contrôles comme les boutons de dialogue qui nécessitent des spécifications par rapport à chaque système. Un spécification XUL est seulement compatible à hauteur d'un "degree". Les designers d'UI ainsi que les ingénieurs doivent maintenir séparément les versions spécifiques à chaque plateforme.

+ +

"XPToolkit" est plutôt synonyme de XPFE. Même si l'ancien terme parait plus expressif que l'autre, et pourtant ce n'est pas son remplaçant ; personne ne sais pourquoi il existe les deux.

+ +

"XUL" déjà présenté, est une application du XML utilisé pour décrire la présentation de la plupart des fenêtres dans le navigateur Mozilla, incluant aussi la fenêtre principale, la fenêtre du navigateur.

+ +

Portée

+ +

Cet article n'est pas une tentative d'expliquer les exigences systèmes. Nous n'avons pas de document actuel sur les "exigences" . XPToolkit Architecture est un meilleur moyen pour comprendre de telles choses. Cet article contient une courte introduction à l'architecture Mozilla front-end , en se concentrant sur la tache de construire des UIs. Il est, comme toujours, incomplet.

+ +

Les applications Mozilla seront construites de "petits" composants comme des boutons "dialogue" et des dossiers de boite de réception mail, que l'on appelle couramment "widgets." Avec un widget, le dessin et les interactions utilisateur sont complètement sous le contrôle d'un widget indépendant, et faites quand le widget est construit. Le placement relatif des widgets, leurs interactions entre les uns les autres, et en option une partie de leur configuration, sera contrôlé par un UI layout spécifié dans un script dont la structure est définie dans les documents connexes et présents.

+ +

Les widgets sont des morceaux of the application largely self-contained, generally corresponding to a rectangle of window real estate. Widgets will generally live grouped in separate, dynamically loaded libraries. A widget may expect to own a piece of a window (a toolbar or toolbar set), or it may be expected to work within or without a window (menubars, depending on the platform). It may not be a part of the application UI at all.

+ +

Widgets will have predefined behaviour, set at compilation. Buttons will respond to the mouse; toolbars will act as containers for buttons. The effect a widget will have on its application will be defined as a combination of predefined application behaviour and linkage between the widgets. This linkage can be accomplished by including JavaScript in the XUL, or by application code which walks the content model after it has been built from XUL, and hooks up event listeners. Generally a real application will use some combination of the two.

+ +

Applications, for instance, will have preconceived notions of what to do when they receive an "open file" command. An "open" button is simply a button. It will send its command to the application for processing, generally using some simple JavaScript for linkage.

+ +

We are at first primarily concerned with the obvious UI components: toolbars, menus and dialogs. Conceptually, the XUL language will allow someone with a text editor, given a package of components which can work together, the ability to put together an application by specifying something like this (for an application on an OS using menubars across the top of its applications' windows):

+ +
main window containing
+  menubar area at top across width of window containing
+    menubar (and its contents)
+  toolbar area below menubar across width of window containing
+    main toolbar (and its contents)
+  application-specific content area below toolbar area
+
diff --git a/files/fr/archive/mozilla/xul/label/index.html b/files/fr/archive/mozilla/xul/label/index.html new file mode 100644 index 0000000000..fab098ae82 --- /dev/null +++ b/files/fr/archive/mozilla/xul/label/index.html @@ -0,0 +1,183 @@ +--- +title: label +slug: Archive/Mozilla/XUL/label +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/label +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Cet élément est utilisé pour fournit un label pour un élément de contrôle. Si l'utilisateur clique sur le label, le focus se placera sur le contrôle associé, tel que spécifié avec l'attribut control. +

Pour plus d'informations, consultez le Tutoriel XUL. +

+
Attributs +
accesskey, control, crop, disabled, href, value +
+
Propriétés +
accessKey, accessibleType, control, crop, disabled, value +
+
Classes de style +
header, indent, monospace, plain, small-margin, text-link
+

Exemples

+
Image:XUL_ref_label.png
+
<label value="Email address" control="email"/>
+<textbox id="email"/>
+
+

Attributs

+

+

+ +
accesskey
+
Type : caractère +
Cet attribut doit être une lettre utilisée comme touche de raccourci. Cette lettre doit être un des caractères apparaissant dans l'attribut label de l'élément.
+

Exemple

+
Image:XUL_ref_accesskey_attr.png
+
<vbox>
+  <label value="Entrez votre nom" accesskey="e" control="myName"/>
+  <textbox id="myName"/>
+  <button label="Annuler" accesskey="n"/>
+  <button label="OK" accesskey="O"/>
+</vbox>
+
+

Voir également

+

Les attributs label et acceltext +

+
+
+ +
+
+ +
crop +
Type : une des valeurs ci-dessous +
Si le label de l'élément est trop long pour être contenu dans son espace donné, le texte sera tronqué du côté indiqué par l'attribut crop. Une ellipse (…) sera utilisée à la place du texte tronqué. Si la direction de la boîte est inversée, le tronquage l'est également. +
+ + + +
+
+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
+
+ +
+ +

Propriétés

+

+

+
accessKey +
Type : caractère +
Obtient et définit la valeur de l'attribut accesskey. +
+


+

+ +
+
+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+
+
+
crop +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut crop. +
+ +
+
+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
value +
Type : chaîne +
Obtient et définit la valeur de l'attribut value. +
+ +
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Classes de style

+

Les classes suivantes peuvent être utilisées pour styler l'élément. Ces classes doivent être utilisées plutôt que de changer directement le style de l'élément, car elles s'intègreront plus naturellement dans le thème sélectionné par l'utilisateur. +

+
header
+
A class used for headings. Typically, this will cause the text to appear bold.
+
+
+
indent
+
This class causes the text to be indented on its left side.
+
+
+
monospace
+
This class causes the text to be displayed in a monospace font.
+
+
+
plain
+
This class causes the element to be displayed with no border or margin.
+
+
+
small-margin
+
This class causes the text to be displayed with a smaller margin.
+
+
+
text-link
+
Labels with this class may be focused and the click handler run or the address in the href attribute opened on a mouse click or Enter key press. Labels will appear like a link (blue and underlined).
+
+ +

Sujets liés

+
Éléments +
description +
+
Attributs +
label +
+
Interfaces
nsIAccessibleProvider, nsIDOMXULLabelElement +
+

Notes d'utilisation

+

N'oubliez pas que l'élément label a un attribut « value », contrairement au HTML où les boutons et cases à cocher utilisent label="valeur" comme attribut. +

+
<label label="Une légende"/> <-- incorrect -->
+<label value="Une légende"/>
+
+<label value="Cliquez sur le bouton"/>
+<button label="Un bouton"/>
+<checkbox label="Une décision" value="1"/>
+
+
+
diff --git "a/files/fr/archive/mozilla/xul/les_contr\303\264les_xul/index.html" "b/files/fr/archive/mozilla/xul/les_contr\303\264les_xul/index.html" new file mode 100644 index 0000000000..0277692977 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/les_contr\303\264les_xul/index.html" @@ -0,0 +1,550 @@ +--- +title: Les contrôles XUL +slug: Archive/Mozilla/XUL/Les_contrôles_XUL +tags: + - XUL +translation_of: Archive/Mozilla/XUL/XUL_controls +--- +

Le tableau suivant propose le listing des contrôles utilisateurs mis à disposition par XUL. Reportez-vous à la section Tutoriel XUL pour un guide pas-à-pas sur leurs utilisations et Référence XUL pour les informations de référence.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
<button> + +

Un bouton pouvant être pressé par l'utilisateur.

+ + 
+<button label="Save" accesskey="S"/>
+
+ +

 

+ + + 		Image:Controlsguide-button.png
<button type="menu"> +

Un bouton ayant un menu déroulant attaché. Appuyez sur le bouton pour ouvrir le menu.

+ + 
+<button type="menu" label="View">
+  <menupopup>
+    <menuitem label="List"/>
+    <menuitem label="Details"/>
+  </menupopup>
+</button>
+
+ + + 		Image:Controlsguide-button-menu.png
<button type="menu-button"> +

Un bouton associé à un bouton-flèche qui ouvre un menu déroulant. Le bouton-flèche est séparé du bouton principal. Contrairement au le type 'menu', des actions différentes peuvent être effectués en cliquant sur le bouton ou sur le bouton-flèche.

+ + 
+<button type="menu-button" label="New">
+  <menupopup>
+    <menuitem label="New Document"/>
+    <menuitem label="New Image"/>
+  </menupopup>
+</button>
+
+ + + 		Image:Controlsguide-button-menu-button.gif
<checkbox> +

Un contrôle pouvant être coché ou non ; typiquement utilisé pour créer des options pouvant être activées ou désactivées.

+ + 
+<checkbox label="Show Toolbar Labels" checked="true"/>
+
+ + + 		Image:Controlsguide-checkbox.png
<colorpicker> +

Un sélectionneur de couleurs pouvant être utilisé pour sélectionner une couleur.

+ + 
+<colorpicker color="#FF0000"/>
+
+ + + 		Image:Controlsguide-colorpicker.png
<colorpicker type="button"> +

Un bouton qui affiche la couleur sélectionnée. Lorsqu'on clique sur le bouton, un sélecteur de couleurs spécialisé s'affiche.

+ + 
+<colorpicker type="button" color="#CC0080"/>
+
+ + + 		Image:Controlsguide-colorpicker-button.png
<datepicker> + + +

Une série de boîtes de texte qui peuvent être utilisées pour saisir une date.

+ + 
+<datepicker value="2007/03/26"/>
+
+ + + 		Image:Controlsguide-datepicker.png
<datepicker type="grid"> + + +

Un sélecteur de date qui affiche un calendrier pour la sélection.

+ + 
+<datepicker type="grid" value="2007/02/20"/>
+
+ + + 		Image:Controlsguide-datepicker-grid.png
<datepicker type="popup" > + + +

Un sélecteur de date qui affiche une série de boîtes de texte pour la saisie et un bouton pour afficher un sélecteur de date sous forme de calendrier.

+ + 
+<datepicker type="popup" value="2008/08/24"/>
+
+ + + 		 
<description> +

L'élément description permet d'ajouter un texte descriptif.

+ + 
+<description>
+  Sélectionner l'heure du début de l'évènement
+</description>
+
+ + + 		Image:Controlguide-description.png
<groupbox> +

Un élément groupbox regroupe plusieurs contrôles d'interface usager et affiche une étiquette à l'aide de l'élément caption.

+ + 
+<groupbox>
+  <caption label="Network"/>
+</groupbox>
+
+ + + 		Image:Controlguide-groupbox.png
<image> +

Une image spécifiée par une URL.

+ + 
+<image src="start.png"/>
+
+ + + 		Image:Controlguide-image.png
<label> +

L'élément label permet d'ajouter une étiquette à côté d'un champ de saisie.

+ + 
+<label control="volume" value="Volume:"/>
+
+ + + 		Image:Controlguide-label.png
<listbox> +

Une liste permet la sélection d'items textuels.

+ + 
+<listbox>
+  <listitem label="Chocolat"/>
+  <listitem label="Bonbon"/>
+</listbox>
+
+ + + 		Image:Controlguide-listbox.png
<menulist> +

Une zone combinée est un contrôle texte attaché à une liste déroulante. La valeur est sélectionnée à l'aide de la liste déroulante. Aussi connu sous les noms de menulist, combobox et <select> en HTML.

+ + 
+<menulist>
+  <menupopup>
+    <menuitem label="Lions" value="l"/>
+    <menuitem label="Tigres" value="t"/>
+    <menuitem label="Ours" value="o"/>
+  </menupopup>
+</menulist>
+
+ + + 		Image:Controlguide-menulist.png
<menulist editable="true"> +

Une zone combinée éditable est comme une zone combinée standard, excepté que la valeur actuellement sélectionnée est affichée dans une zone de saisie où l'on peut  sélectionner directement une valeur, ou l'on peut entrer des valeurs absentes de la liste.

+ + 
+<menulist editable="true">
+  <menupopup>
+    <menuitem label="Elephants" value="Elephants"/>
+    <menuitem label="Kangaroos" value="Kangaroos"/>
+    <menuitem label="Bats" value="Bats"/>
+  </menupopup>
+</menulist>
+
+ + + 		Image:Controlguide-menulist-editable.png
<progressmeter> +

Une barre de progression est utilisée pour montrer la progression d'une tâche lente.

+ + 
+<progressmeter value="40"/>
+
+ + + 		Image:Controlguide-progressmeter.png
<radio> +

Un bouton radio est utilisé pour sélectionner uniquement une seule valeur d'une liste d'options à la fois.

+ + 
+<radiogroup>
+  <radio label="Light" value="light"/>
+  <radio label="Heavy" value="heavy"/>
+</radiogroup>
+
+ + + 		Image:Controlguide-radio.png
<richlistbox> +

The richlistbox displays a list of items where one or more may selected. Unlike the listbox which is designed to display only text, the richlistbox may display any type of content.

+ + 
+<richlistbox>
+  <richlistitem>
+    <image src="happy.png"/>
+  </richlistitem>
+  <richlistitem>
+    <image src="sad.png"/>
+  </richlistitem>
+  <richlistitem>
+    <image src="angry.png"/>
+  </richlistitem>
+</richlistbox>
+
+ + + 		Image:Controlguide-richlistbox.png
<scale> + + +

A scale displays a bar with a thumb that may be slid across the bar to select between a range of values.

+ + 
+<scale min="1" max="10"/>
+
+ + + 		Image:Controlguide-scale.png
<textbox> +

A textbox which allows a single line of text to be entered.

+ + 
+<textbox value="firefox"/>
+
+ + + 		Image:Controlguide-textbox.png
<textbox multiline="true"> +

A textbox which allows multiple lines of text to be entered.

+ + 
+<textbox multiline="true"/>
+
+ + + 		Image:Controlguide-textbox-multiline.png
<textbox type="autocomplete"> +

A textbox which provides a dropdown showing matches that would complete what the user types. The user can select one to have it filled into the textbox.

+ + 
+<textbox type="autocomplete" autocompletesearch="history"/>
+
+ + + 		 
<textbox type="number"> + + +

A textbox for entering numbers. Two arrow buttons are displayed for cycling through values.

+ + 
+<textbox type="number" min="1" max="20"/>
+
+ + + 		Image:Controlguide-textbox-number.png
<textbox type="password"> +

A textbox that hides the characters typed, used for entering passwords.

+ + 
+<textbox type="password"/>
+
+ + + 		Image:Controlguide-textbox-password.png
<timepicker> + + +

A timepicker displays a set of textboxes for entering a time.

+ + 
+<timepicker value="12:05"/>
+
+ + + 		Image:Controlguide-timepicker.png
<toolbarbutton> +

A button that is displayed on a toolbar.

+ + 
+<toolbarbutton label="Reload"/>
+
+ + + 		Image:Controlguide-toolbarbutton.png
<toolbarbutton type="menu"> +

A button that is displayed on a toolbar with a drop down menu attached to it.

+ + 
+<toolbarbutton type="menu" label="Show">
+  <menupopup>
+    <menuitem label="Toolbars"/>
+    <menuitem label="Status Bar"/>
+  </menupopup>
+</toolbarbutton>
+
+ + + 		 
<toolbarbutton type="menu-button"> +

A button on a toolbar that that has a separate arrow button with a menu attached to it. Unlike with the 'menu' type, a separate action may be performed when the main part of the button is pressed.

+ + 
+<toolbarbutton type="menu-button" label="Open">
+  <menupopup>
+    <menuitem label="Open Changed Files"/>
+    <menuitem label="Open All"/>
+  </menupopup>
+</toolbarbutton>
+
+ + + 		 
<tree> +

A tree displays a hierarchy of items in multiple columns.

+ + 
+<tree>
+  <treecols>
+    <treecol label="Name" flex="1"/>
+    <treecol label="Size" flex="1"/>
+  </treecols>
+  <treechildren>
+    <treeitem>
+      <treerow>
+        <treecell label="Popcorn"/>
+        <treecell label="Large"/>
+      </treerow>
+    </treeitem>
+    <treeitem>
+      <treerow>
+        <treecell label="Root Beer"/>
+        <treecell label="Small"/>
+      </treerow>
+    </treeitem>
+  </treechildren>
+</tree>
+
+ + + 		Image:Controlguide-tree.png
diff --git a/files/fr/archive/mozilla/xul/les_joies_de_xul/index.html b/files/fr/archive/mozilla/xul/les_joies_de_xul/index.html new file mode 100644 index 0000000000..0d713c2334 --- /dev/null +++ b/files/fr/archive/mozilla/xul/les_joies_de_xul/index.html @@ -0,0 +1,142 @@ +--- +title: Les joies de XUL +slug: Archive/Mozilla/XUL/Les_joies_de_XUL +tags: + - XUL +translation_of: Archive/Mozilla/XUL/The_Joy_of_XUL +--- +

Public visé : Les développeurs d'application et les chefs développeurs qui cherchent à mieux comprendre XUL et pourquoi il est à la base de la plate-forme Mozilla.

+ +

Introduction

+ +

XUL (prononcez « zoul ») est le langage d'interface utilisateur de Mozilla basé sur XML permettant de développer des applications multiplate-formes riches en fonctionnalités et pouvant tourner connectée ou non à Internet. Ces applications sont facilement modifiables avec des textes, graphismes, et mises en page alternatifs, de telle manière qu'elles peuvent être facilement marquées ou localisées pour différents marchés. Les développeurs Web déjà familiers avec le HTML Dynamique (DHTML) pourront développer tout des suite des applications .

+ +

Ce document décrira les irrésistibles raisons pour les développeurs d'application de choisir XUL et la technologie Mozilla pour développer des applications multiplate-formes. Cette même enquête donnera des explications suffisantes des motivations de Mozilla dans le développement XUL et pourquoi la plate-forme de Mozilla est basée dessus. Les fonctionnalités clé et les avantages de XUL seront explorés suivis d'un tour d'horizon des technologies soutenues par Mozilla. Enfin, une petite étude de cas d'un logiciel calendrier écrit avec XUL montrera les avantages de développer une application avec Mozilla.

+ +

Fonctionnalités clés et avantages

+ + + + + + + + + + + + + + + + + + + + + + + + +
Langage de balisage puissant basé sur les widgetsLe but de XUL est de construire des applications multiplate-formes, a contrario du DHTML qui est conçu pour développer des pages Web. C'est pour cela que XUL est orienté vers des artefacts présents dans les applications comme les fenêtres, les labels et les boutons, au lieu d'être orienté vers les pages, niveaux de titre, et liens hypertextes. +

En fait, beaucoup de développeurs investissent des efforts considérables pour obtenir un résultat comparable dans leurs applications Web DHTML au prix de la complexité, des performances, et du respect des standards.

+
Basé sur des standards existantsXUL est un langage basé sur le standard XML 1.0 du W3C. Les applications écrites en XUL aussi sont basées sur d'autres standards du W3C tels que HTML 4.0; les Feuilles de Style en Cascade (CSS) 1 et 2; le modèle de document objet (DOM) niveaux 1 et 2; JavaScript 1.5, incluant ECMA-262 Edition 3 (ECMAscript); XML 1.0. +

Mozilla.org va plus loin en cherchant à obtenir une standardisation du W3C pour l'eXtensible Binding Language (XBL) (voir Technologies supportées, ci-dessous).

+
Portabilité de la plate-forme +

À l'instar du HTML, XUL est conçu pour être indépendant de la plate-forme, rendant ainsi les applications facilement portables à tous les systèmes d'exploitation sur lesquels Mozilla tourne. Si l'on considère le large éventail de plate-formes qui supportent actuellement Mozilla, cela peut être une des caractéristiques intéressantes de XUL en tant que technologie pour développer des applications.

+ +

Puisque XUL donne une abstraction des composants de l'interface utilisateur, il tient la promesse d'écrire une fois, exécuter partout (NdT : write-once, run anywhere pour les anglophones). L'interface de toutes les applications phares de Mozilla (navigateur, client de messagerie, carnet d'adresse, etc.) est écrite en XUL avec un seul code fonctionnant sur toutes les plate-formes Mozilla.

+
Séparation de l'aspect et de la logique de l'applicationL'un des inconvénients majeurs de la plupart des application Web est le lien étroit entre les éléments de l'interface et la logique de l'application. Cela pose un problème qui n'est pas insignifiant lorsque que l'on travaille en équipe, parce que les compétences requises pour développer ces deux aspects appartiennent souvent à des personnes différentes. +

XUL donne une séparation clair entre la définition de l'application et la logique de programmation ("contenu" constitué de XUL, XBL, et JavaScript), la présentation (« skin » constitué de CSS et d'images), et les labels spécifiques au langage (« locale » constitué de DTDs, paquets de chaînes de caractères dans des fichiers .properties). La mise en page et l'apparence des applications XUL peuvent être transformées indépendamment de la définition de l'application et de sa logique. Encore mieux, l'application peut être localisée en différentes langues et régions indépendamment de sa logique ou de sa présentation.

+ +

Ce degré de séparation permet d'avoir des applications plus faciles à maintenir par les programmeurs et rapidement modifiables pour les designers et les localisateurs.

+ +

La superposition de ces deux activités indépendantes est plus facilement coordonnée qu'avec des applications basées sur du HTML, avec un impact moindre sur la stabilité générale et la qualité du système.

+
Modification, localisation ou marquage facilesUn autre bénéfice très pratique de la séparation entre ce que XUL fournit et la logique, la présentation, et le « texte du langage » est la facilité d'adaptation pour différents clients ou groupes d'utilisateurs. +

Un développeur peut maintenir une base de code primaire pour son application et adapter le logo et l'appellation pour chacun de ses clients en distribuant plusieurs skins. Une application qui est écrite et déployée avec une interface utilisateur en anglais peut être traduite en français pour le même client. Bien que ces changements soit extensifs et affectent la plus grande partie (sinon la totalité) de l'application, ils sont aussi isolés les uns des autres par la définition même de XUL et le partage de la logique de l'application entre toutes les versions personnalisées.

+
+ +

Technologies supportées

+ +

Il y a beaucoup d'autres technologies introduites par Mozilla qui complètent XUL pour développer des applications web multiplate-formes.

+ + + + + + + + + + + + + + + + + + + + +
XBL +

L'eXtensible Bindings Language (XBL) est un langage de balisage qui définit de nouveaux éléments spéciaux, ou bindings pour les widgets XUL. Avec XBL, les développeurs peuvent définir du contenu nouveau pour les widgets XUL, ajouter des gestionnaires d'événement additionnel à un widget XUL, et ajouter aussi de nouvelles propriétés et méthodes d'interface. En bref, XBL octroie au développeur la capacité d'étendre XUL en modifiant des balises existantes ou en créant ses propres balises.

+ +

En utilisant XBL, les développeurs peuvent facilement façonner des interfaces utilisateur de widgets personnalisées, comme des compteurs de progression, des menus pop-up fantaisistes, et même des barres d'outils et des formulaires de recherche. Ces composants personnalisés sont utilisable dans les applications XUL en spécifiant la balise personnalisée et les attributs qui y sont associés.

+
OverlaysLes overlays sont des fichiers XUL utilisés pour décrire un contenu supplémentaire pour l'interface utilisateur. Ils sont un mécanisme général pour ajouter des composants additionnels à l'interface, remplacer des portions de code XUL, sans avoir à modifier toute l'interface, et réutiliser des parties spécifiques de l'interface utilisateur. +

Ils fournissent un mécanisme puissant de personnalisation et d'extension des applications existantes parce qu'ils fonctionnent de deux manières complémentaires mais très différentes. Dans un sens, les overlays sont identiques aux fichiers include qu' on trouve dans d'autres langages parce qu'une application peut spécifier qu'un overlay est présent dans sa définition. Mais les overlays peuvent également être spécifié extérieurement, permettant à un concepteur de le superposer à une application sans modifier le code source original.

+ +

En pratique, cela permet aux développeurs de maintenir un code unique pour une application donnée, puis d'y appliquer une marque particulière ou pour inclure des fonctionnalités spécifiques pour un client particulier, le tout dans un code complètement indépendant. Cela conduit à une solution globale qui est plus facile et moins coûteux de maintenir à long terme.

+ +

Un bénéfice supplémentaires des overlays pour les développeurs de logiciels qui désirent ajouter des fonctionnalités aux logiciels Mozilla qu'ils désirent garder sous licence propriétaire. La Netscape Public License (NPL) et la Mozilla Public License (MPL) exige des développeurs qui modifie le code original (le code source fournit pas Mozilla) de fournir le code source de ces modifications à leurs clients. Les overlays peuvent être utilisés pour ajouter des fonctionnalités aux logiciels Mozilla sans contaminer le code source libre original avec des portions de code propriétaire.

+
XPCOM/XPConnectXPCOM et XPConnect sont des technologies complémentaires qui permettent l'intégration de bibliothèques externes dans les applications XUL. +

XPCOM, qui signifie Cross Platform Component Object Model, est un framework d'écriture de logiciels multiplate-forme et modulaires. Les composants XPCOM peuvent être écrit en C, C++ et JavaScript, et ils peuvent être utilisés avecs C, C++, JavaScript, Python, Java et Perl.

+ +

XPConnect est une technologie qui autorise des interactions entre XPCOM et JavaScript. XPConnect permet aux objets JavaScript d'accéder de façon transparente aux objets XPCOM et de les manipuler. Elle permet également aux objets JavaScript de présenter des interfaces conformes à XPCOM qui pourront être appelées par des objets XPCOM.

+ +

Ensemble, XPCOM et XPConnect permettent aux développeurs de créer des applications XUL qui applications exigent la puissance de traitement brut de langages compilés (C/C++) ou l'accès au système d'exploitation sous-jacent.

+
XPInstallXPInstall, l'utilitaire d'installation multiplate-forme de Mozilla, fournit un moyen standard d'empaquetage des composants d'un application XUL avec un script d'installation que Mozilla peut télécharger et exécuter. +

XPInstall permet aux utilisateurs d'installer sans effort une nouvelle applications XUL depuis Internet ou depuis des serveurs intranet d'entreprises. Pour installer une nouvelle application, l'utilisateur n'a besoin que de cliquer sur un lien hypertexte dans une page Web ou dans un courriel et d'accepter l'installation du nouveau paquetage.

+
+ +

todo: describe cool toolkit and xul runner features

+ +

Étude de cas : Un logiciel de calendrier pour Mozilla

+ +

This mini case study describes how OEone Corporation (http://www.oeone.com) integrated its Calendar application with the core Mozilla product. The Calendar application is comprised of a XUL front end and an XPCOM component that leverages libical, a native library written in C, for date operations and calendar data storage. The Calendar was initially developed exclusively for Linux but was successfully ported to both Macintosh and Windows within a week.

+ +

XUL provides a rich set of UI components. The user interface for the Calendar is written entirely in XUL, JavaScript, and CSS, which is a testament to the power and flexibility of this application building framework. It uses simple XUL components like boxes, grids, and stacks to compose views for the weeks, days, and months. The initial implementation of Calendar did not exploit XBL because the developers involved were not experienced with this complementary technology. But future plans for the Calendar include converting many of these UI components to XBL widgets to further simplify their implementation.

+ +

XPCOM/XPConnect enables integration of native code. A fully-featured open source calendar library, libical (http://www.softwarestudio.org/libical/), was harvested for the Calendar project. Libical is an Open Source implementation of the IETF's iCalendar Calendaring and Scheduling protocols. (RFC 2445, 2446, and 2447). It parses iCal components and provides a C API for manipulating the component properties, parameters, and subcomponents. The library was initially integrated by writing an XPCOM wrapper to adapt its interface. To improve performance a greater proportion of application logic was migrated from JavaScript to the XPCOM component.

+ +

Separation of presentation from logic makes applications resilient to change. The original UI implementation made extensive use of graphics for rendering the month and week views. Later, as the developers learned more about XUL and the implementation of the basic components matured, better ways were identified to simplify the composition of the UI. This lead to increased screen drawing performance and reduced memory and disk footprint requirements of the application. The UI for the month and week views was practically rewritten while the application logic remained virtually unchanged.

+ +

Porting XUL applications to other platforms is trivial. The Calendar originated as a Linux application with no consideration given to porting it to other platforms. But later, when the original developer (OEone Corporation) contributed the source to the Mozilla project, the Calendar had to be migrated to the Windows and Macintosh platforms. The UI for the XUL application required zero porting effort because it worked with almost no alteration on both new platforms. Similarly, since the UI code is written in JavaScript, the interaction logic worked with no effort. However, since the libical library is written in C, more significant effort was required to migrate this component to the other platforms.

+ +

Fortunately an implementation of the libical library was already available for Macintosh so, with the cross platform nature of XPCOM, a Macintosh calendar implementation was working within a few days. However, there was no existing Win32 port available, so developers had to undertake a porting effort to migrate libical to Windows. Within a week this too was complete and Mozilla had a working calendar for all three primary platforms: Linux, Macintosh, and Windows.

+ +

XPInstall is easy for developers and for users. The Calendar is not a planned deliverable for the Mozilla 1.0 release, and therefore is not included as a standard component in regular nightly and milestone release builds. Developers who are equipped with the software and knowledge required to compile Mozilla can set an optional environment variable and build the Calendar themselves. But many Mozilla users who want to try out the Calendar can't afford this luxury. Using XPInstall it was easy for the developers to package a version of Calendar that could be installed directly over the Internet by clicking a link.

+ +

Conclusion

+ +

Mozilla, grâce à XUL, fournit une technologie irrésistible pour le développement d'applications multiplate-forme avec une même interface utilisateur riche et une expérience utilisateur identique aux applications natives. Les designers ayant l'expérience de la conception d'applications Web basées sur les technologies standard du W3C peuvent tirer parti de cette expérience directement du navigateur au bureau.

+ +

Avant qu'Internet ne devienne le moyen privilégié de distribution des applications aux utilisateurs utilisant des architectures matérielles et logicielles disparates, ce problème était réglé à l'aide d'outils client-serveur multiplate-forme. Mais ces offres, invariablement propriétaires, coûtaient très cher en développeurs et le montant des licences vous liait solidement pour un certain temps au vendeur. Mozilla fournit much of the same value que ces outils multiplate-forme, mais avec des licences libres.

+ +

As a rapidly maturing cross platform technology, XUL peut combler un vide intéressant pour des technologies telles que Java J2EE et Microsoft. Net qui sont axés sur l'activation de l'accès au réseau pour les objets distribués. La logique d'application dynamique peut bénéficier largement d'un niveau de présentation de l'interface utilisateur qui est basée sur des normes, des scripts, extensibles et de même distribuables sur Internet.

+ +

XUL réduit la distinction entre les applications de bureau et le navigateur Internet, car il est bien implanté dans deux mondes. Certaines applications Web bénéficieront d'une migration vers XUL du fait de l'accroissement des capacités de l'interface utilisateur, d'une implémentation cohérente de la spécification à travers les plate-formes supportées et de l'accès aux ressources natives telles que les bibliothèques partagées et les fichiers locaux du système.

+ +

Que vous désiriez migrer une application Web existante vers une application desktop, que cherchiez une technologie qui vous permettra facilement de porter vos applications sur différentes plate-formes ou que vous vouliez intégrer vos propres fonctionnalités au navigateur, XUL mérite d'être sérieusement considéré.

+ +

Références

+ +
    +
  1. Documentation XUL sur MDC, comprenant Tutoriel XUL et la Référence XUL
    2. +
  2. Overlays XUL
    3. +
  3. Documentation XBL: XBL introduction, XBL reference
    4. +
  4. Documentation XPCOM
    5. +
  5. Documentation XPConnect (Composants scriptables). Voir également XPConnect (Scriptable Components) (en)
    6. +
  6. Documentation sur les Extensions, comprenant un tutoriel de prise en main Construire une extension
    7. +
  7. Projet Calendar sur Mozilla .org (en)
    8. +
diff --git a/files/fr/archive/mozilla/xul/listbox/index.html b/files/fr/archive/mozilla/xul/listbox/index.html new file mode 100644 index 0000000000..7f793d544a --- /dev/null +++ b/files/fr/archive/mozilla/xul/listbox/index.html @@ -0,0 +1,276 @@ +--- +title: listbox +slug: Archive/Mozilla/XUL/listbox +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/listbox +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Cet élément est utilisé pour créer une liste d'éléments dont l'un ou plusieurs d'entre-eux peuvent être sélectionnés. Une listbox peut contenir plusieurs colonnes. Différentes méthodes permettent aux éléments de la liste d'êtres récupérés et modifiés. +

Vous pouvez spécifier le nombre de lignes à afficher dans la liste à l'aide de l'attribut rows. Les lignes supplémentaires peuvent être consultées avec une barre de défilement. Une listbox est supposée contenir des éléments listitem. Toutes les lignes dans la listbox ont la même hauteur, qui est la hauteur du plus grand élément de la liste. Si vous désirez créer une liste dont les hauteurs de lignes sont variables, ou avec du contenu non textuel, utilisez plutôt l'élément richlistbox. +

Consultez le Tutoriel XUL pour plus d'informations.

+
Attributs +
disabled, disableKeyNavigation, preference, rows, seltype, suppressonselect, tabindex, value +
+
Propriétés +
accessibleType, currentIndex, currentItem, disabled, disableKeyNavigation, itemCount, listBoxObject, selectedCount, selectedIndex, selectedItem, selectedItems, selType, tabIndex, value +
+
Méthodes +
addItemToSelection, appendItem, clearSelection, ensureElementIsVisible, ensureIndexIsVisible, getIndexOfFirstVisibleRow, getIndexOfItem, getItemAtIndex, getNumberofVisibleRows, getRowCount, getSelectedItem, insertItemAt, invertSelection, moveByOffset, removeItemAt, removeItemFromSelection, scrollToIndex, selectAll, selectItem, selectItemRange, suppressOnSelect, timedSelect, toggleItemSelection +
+

Exemple

+
Image:XUL_ref_listbox.png
+
 <listbox id="theList">
+   <listitem label="Rubis"/>
+   <listitem label="Émeraude"/>
+   <listitem label="Saphir" selected="true"/>
+   <listitem label="Diamant"/>
+ </listbox>
+
+

Attributs

+

+

+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
+
+ +
preference +
Type : id d'élément +
Connecte l'élément à une préférence (élément preference) correspondante. Cet attribut n'a d'effet qu'utilisé au sein d'un prefwindow. La valeur de la préférence sera mise à jour pour correspondre à la propriété value de l'élément. +
+ + +
+
+ +
rows +
Type : entier +
Le nombre de lignes à afficher dans l'élément. Si l'élément contient plus que ce nombre de lignes, une barre de défilement apparaitra afin que l'utilisateur puisse consulter les autres lignes. Pour obtenir le nombre réel de lignes dans l'élément, utilisez la méthode getRowCount. +
+ + +
+
+ +
+
+ seltype<magic name="\"PAGENAME\"/"></magic>
+
+ Type : + + une des valeurs ci-dessous +
+
+ Utilisé pour indiquer si les sélections multiples sont permises.
+
+ +

<magic name="\"PAGENAME\"/">Des cellules individuelles peuvent être sélectionnées.</magic><magic name="\"PAGENAME\"/"> Des lignes sont sélectionnées, cependant, l'indicateur de sélection n'est visible que sur le texte de la colonne principale.</magic>

+
+
+ +
+
+ suppressonselect
+
+ Type : + + booléen +
+
+ Si cet attribut n'est pas spécifié, un évènement select est déclenché dès qu'un élément est sélectionné, que ce soit par l'utilisateur ou par l'appel d'une des méthodes de sélection. Si la valeur de l'attribut est true, l'évènement select n'est jamais déclenché.
+
+
+
+ +
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+ + +
+
+ +
value +
Type : chaîne +
Cet attribut chaîne permet d'associer une valeur de données avec un élément. Il n'est destiné à aucune utilisation particulière, mais vous pouvez y accéder avec un script pour votre usage propre.. +
+ + +
+ +

Propriétés

+

+

+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+
+
+
currentItem +
Type : élément listitem +
Renvoie le dernier élément sélectionné dans la liste de sélection, ce qui n'est utile que dans une liste à sélection multiple. +
+ +
+
+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
+
+
listBoxObject +
Type : nsIListBoxObject +
L'objet nsIListBoxObject derrière la liste de sélection. Cette propriété est en lecture seule. La plupart des fonctionnalités de la liste de sélection sont déjà disponibles directement dans l'élément listbox, il sera donc rarement nécessaire d'utiliser cet objet de boîte directement. +
+ +
+
+
+
selectedIndex +
Type : entier +
Renvoie l'indice de l'élément actuellement sélectionné. Un élément peut être sélectionné en assignant son indice à cette propriété. En lui assignant -1, tous les éléments seront désélectionnés. +
+ +
+
+
selectedItem +
Type : élément +
Conserve l'élément actuellement sélectionné. Si aucun élément n'est sélectionné, sa valeur sera null. Vous pouvez sélectionner un élément en définissant cette valeur. Un évènement select sera envoyé à cet élément lorsqu'il est sélectionné en modifiant cette propriété, la propriété selectedIndex, ou par l'utilisateur. +
+ +
+
+
+
+
+ selType<magic name="\"PAGENAME\"/"></magic>
+
+ Type : + + chaîne de caractères +
+
+ Obtient et définit la valeur de l'attribut seltype.
+
+ +
+
+
+
+ suppressOnSelect
+
+ Type : + + booléen +
+
+ Obtient et définit la valeur de l'attribut suppressonselect.
+
+
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+ +
+
+
value +
Type : chaîne +
Obtient et définit la valeur de l'attribut value. +
+ +
+ +

Méthodes

+ + + + + + +
+

Héritées de XUL element
+ blur, click, doCommand, focus, getElementsByAttribute getElementsByAttributeNS

Héritées de DOM element
+ addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()

+ +
+ + + + + + + + + +
getRowCount() +
Type de retour : entier +
Renvoie le nombre total de lignes dans l'élément, quel que soit le nombre de lignes affichées. +
+ + + + + + + +
selectAll() +
Type de retour : aucune valeur renvoyée +
Sélectionne tous les éléments. Un évènement de sélection est envoyé après l'exécution de la sélection. +
+
selectItem( item ) +
Type de retour : aucune valeur renvoyée +
Désélectionne tous les éléments actuellement sélectionnés, puis sélectionne l'élément donné en argument. Un évènement de sélection est envoyé après l'exécution de la sélection. +
+
selectItemRange( startItem, endItem) +
Type de retour : aucune valeur renvoyée +
Sélectionne tous les éléments compris entre les deux éléments donnés en paramètre, y compris les éléments de début et de fin. Tous les autres éléments sont désélectionnés. Cette méthode n'a aucun effet sur les listes en mono-sélection. Un évènement de sélection est envoyé après l'exécution de la sélection. +
+
timedSelect( item, timeout ) +
Type de retour : aucune valeur renvoyée +
Sélectionne un élément spécifié par l'argument item après un nombre de millisecondes définit par l'argument timeout. Tous les autres éléments sont désélectionnés. +
+
toggleItemSelection( item ) +
Type de retour : aucune valeur renvoyée +
Modifie l'état de sélection de l'élément spécifié. S'il est sélectionné, il devient désélectionné. S'il est désélectionné, il devient sélectionné. Les autres éléments de la liste ne sont pas affectés et ils conservent leur état de sélection. +
+ +

Sujets liés

+
Éléments +
listcell, listcol, listcols, listhead, listheader, listitem +
+
Interfaces +
nsIAccessibleProvider, nsIDOMXULMultiSelectControlElement +
+
+
diff --git a/files/fr/archive/mozilla/xul/listitem/index.html b/files/fr/archive/mozilla/xul/listitem/index.html new file mode 100644 index 0000000000..cf28e6472b --- /dev/null +++ b/files/fr/archive/mozilla/xul/listitem/index.html @@ -0,0 +1,265 @@ +--- +title: listitem +slug: Archive/Mozilla/XUL/listitem +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/listitem +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Une ligne unique dans un élément listbox. Le texte de la ligne est généralement spécifié soit en utilisant des éléments listcell, soit en plaçant un attribut label directement sur l'élément listitem. Par défaut, contient un seul élément listcell du type et de la classe appropriées pour le listitem. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
accesskey, checked, command, crop, current, disabled, image, label, preference, selected, tabindex, type, value +
+
Propriétés +
accessKey, accessible, checked, control, crop, current, disabled, image, label, selected, tabIndex, value +
+
Classes de style +
listitem-iconic
+

Exemples

+
Image:XUL_ref_listbox.png
+
 <listbox id="laListe">
+   <listitem label="Rubis"/>
+   <listitem label="Émeraude"/>
+   <listitem label="Saphir" selected="true"/>
+   <listitem label="Diamant"/>
+ </listbox>
+
+

Attributs

+

+

+ +
accesskey
+
Type : caractère +
Cet attribut doit être une lettre utilisée comme touche de raccourci. Cette lettre doit être un des caractères apparaissant dans l'attribut label de l'élément.
+

Exemple

+
Image:XUL_ref_accesskey_attr.png
+
<vbox>
+  <label value="Entrez votre nom" accesskey="e" control="myName"/>
+  <textbox id="myName"/>
+  <button label="Annuler" accesskey="n"/>
+  <button label="OK" accesskey="O"/>
+</vbox>
+
+

Voir également

+

Les attributs label et acceltext +

+
+
+ +
+
+ checked
+
+ Type : + + booléen +
+
+ Indique si l'élément est coché ou non.
+
+ Utilisez hasAttribute() pour déterminer si cet attribut est défini plutôt que getAttribute().
+ Pour les boutons, l'attribut type doit etre mis à checkbox ou à radio pour qu'un effet soit perceptible.
+
+
+
+ +
command +
Type : id d'élément +
Défini à la valeur de l'id d'un élément command observé par l'élément. +
+ + +
+
+ +
crop +
Type : une des valeurs ci-dessous +
Si le label de l'élément est trop long pour être contenu dans son espace donné, le texte sera tronqué du côté indiqué par l'attribut crop. Une ellipse (…) sera utilisée à la place du texte tronqué. Si la direction de la boîte est inversée, le tronquage l'est également. +
+ + + +
+
+ +
+
+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
image +
Type : URL d'une image +
L'URL de l'image devant apparaître sur l'élément. Si cet attribut est vide ou omis, aucune image n'apparaîtra. La position de l'image est déterminée par les attributs dir et orient. +
+ + +
+
+ +
label +
Type : chaîne de caractères +
Le label qui apparaîtra sur l'élément. S'il n'est pas spécifié, aucun texte n'apparaîtra. +
+ + +
+
+ +
preference +
Type : id d'élément +
Connecte l'élément à une préférence (élément preference) correspondante. Cet attribut n'a d'effet qu'utilisé au sein d'un prefwindow. La valeur de la préférence sera mise à jour pour correspondre à la propriété value de l'élément. +
+ + +
+
+ +
selected +
Type : booléen +
Indique si l'élément est sélectionné ou non. Cette valeur est en lecture seule. Pour changer la sélection, utilisez la propriété selectedIndex ou selectedItem de l'élément conteneur. +
+ + +
+
+ +
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+ + +
+
+ +
+
+ +
value +
Type : chaîne +
Cet attribut chaîne permet d'associer une valeur de données avec un élément. Il n'est destiné à aucune utilisation particulière, mais vous pouvez y accéder avec un script pour votre usage propre.. +
+ + +
+ +

Propriétés

+

+

+
accessKey +
Type : caractère +
Obtient et définit la valeur de l'attribut accesskey. +
+


+

+ +
+
+
accessible +
Type : nsIAccessible +
Renvoie l'objet d'accessibilité pour l'élément. +
+


+

+ +
+
+
+
+
crop +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut crop. +
+ +
+
+
+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
image +
Type : URL d'image +
Obtient et définit la valeur de l'attribut image. +
+ +
+
+
label +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut label. +
+ +
+
+ +
+
selected
+
Type : booléen
+
La valeur de cette propriété est true si cet élément est sélectionné, ou false s'il ne l'est pas. Cette propriété est en lecture seule.
+
+
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+ +
+
+
value +
Type : chaîne +
Obtient et définit la valeur de l'attribut value. +
+ +
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Classes de style

+

Les classes suivantes peuvent être utilisées pour styler l'élément. Il convient de les utiliser plutôt que de changer le style de l'élément directement afin de s'intégrer plus naturellement dans le thème choisi par l'utilisateur. +

+
listitem-iconic
+
Use this class to have an image appear on the listitem. Specify the image using the image attribute.
+
+ +

Sujets liés

+
Éléments +
listbox, listcell, listcol, listcols, listhead, listheader +
+
Interfaces +
nsIAccessibleProvider, nsIDOMXULSelectControlItemElement +
+
+
diff --git a/files/fr/archive/mozilla/xul/menu/index.html b/files/fr/archive/mozilla/xul/menu/index.html new file mode 100644 index 0000000000..2a78b15497 --- /dev/null +++ b/files/fr/archive/mozilla/xul/menu/index.html @@ -0,0 +1,196 @@ +--- +title: menu +slug: Archive/Mozilla/XUL/menu +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/menu +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un élément, tout à fait semblable à un élément button, qui est placé dans un élément menubar. Lorsque l'utilisateur clique sur l'élément menu, le menupopup enfant du menu sera affiché. Cet élément est également utilisé pour créer des sous-menus. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
acceltext, accesskey, allowevents, command, crop, disabled, image, label, menuactive, open, sizetopopup, tabindex, value +
+
Propriétés +
accessibleType, accessKey, command, control, crop, disabled, image, itemCount, label, labelElement, menupopup, open, parentContainer, selected, tabIndex, value +
+
Méthodes +
appendItem, getIndexOfItem, getItemAtIndex, insertItemAt, removeItemAt +
+

Exemple

+
  <menubar id="sample-menubar">
+    <menu id="file-menu" label="Fichier">
+      <menupopup id="file-popup">
+        <menuitem label="Nouveau"/>
+        <menuitem label="Ouvrir"/>
+        <menuitem label="Enregistrer"/>
+        <menuseparator/>
+        <menuitem label="Quitter"/>
+      </menupopup>
+    </menu>
+    <menu id="edit-menu" label="Édition">
+      <menupopup id="edit-popup">
+        <menuitem label="Annuler"/>
+        <menuitem label="Rétablir"/>
+      </menupopup>
+    </menu>
+  </menubar>
+
+

Attributs

+

+

+ +
+
+ acceltext
+
+ Type : chaîne de caractères
+
+ Texte qui apparaîtra à côté du label d'un menu pour indiquer la touche de raccourci (accélérateur) à utiliser pour invoquer la commande. Si cette valeur est définie, elle écrase une clé assignée dans l'attribut key. Cet attribut ne s'applique pas aux menus directement sur la Barre de menus (menubar).
+
+
+
+ +
accesskey
+
Type : caractère +
Cet attribut doit être une lettre utilisée comme touche de raccourci. Cette lettre doit être un des caractères apparaissant dans l'attribut label de l'élément.
+

Exemple

+
Image:XUL_ref_accesskey_attr.png
+
<vbox>
+  <label value="Entrez votre nom" accesskey="e" control="myName"/>
+  <textbox id="myName"/>
+  <button label="Annuler" accesskey="n"/>
+  <button label="OK" accesskey="O"/>
+</vbox>
+
+

Voir également

+

Les attributs label et acceltext +

+
+
+ +
allowevents +
Type : booléen +
Si défini à true, les évènements sont passés aux enfants de l'élément. Dans le cas contraire, ils ne sont passés qu'à l'élément lui-même. +
+ + +
+
+ +
crop +
Type : une des valeurs ci-dessous +
Si le label de l'élément est trop long pour être contenu dans son espace donné, le texte sera tronqué du côté indiqué par l'attribut crop. Une ellipse (…) sera utilisée à la place du texte tronqué. Si la direction de la boîte est inversée, le tronquage l'est également. +
+ + + +
+
+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
label +
Type : chaîne de caractères +
Le label qui apparaîtra sur l'élément. S'il n'est pas spécifié, aucun texte n'apparaîtra. +
+ + +
+
+ +
+
+ +
open +
Type : booléen +
Pour les boutons de type menu, l'attribut open est défini à true lorsque le menu est ouvert. L'attribut open n'est pas présent si le menu est fermé. +
+ + +
+
+ +
+
+ +
value +
Type : chaîne +
Cet attribut chaîne permet d'associer une valeur de données avec un élément. Il n'est destiné à aucune utilisation particulière, mais vous pouvez y accéder avec un script pour votre usage propre.. +
+ + +
+ +

Propriétés

+

+

+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+
+
+
+
+
+
+
value +
Type : chaîne +
Obtient et définit la valeur de l'attribut value. +
+ +
+ +

Méthodes

+ + + + + + +
+

Héritées de XUL element
+ blur, click, doCommand, focus, getElementsByAttribute getElementsByAttributeNS

Héritées de DOM element
+ addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()

+ +
+ + + + + + +

Sujets liés

+
Éléments +
menubar, menuitem, menulist, menupopup, menuseparator +
+
Interfaces +
nsIAccessibleProvider, nsIDOMXULContainerElement, nsIDOMXULContainerItemElement, nsIDOMXULSelectControlItemElement +
diff --git a/files/fr/archive/mozilla/xul/menubar/index.html b/files/fr/archive/mozilla/xul/menubar/index.html new file mode 100644 index 0000000000..2d8a8d5660 --- /dev/null +++ b/files/fr/archive/mozilla/xul/menubar/index.html @@ -0,0 +1,77 @@ +--- +title: menubar +slug: Archive/Mozilla/XUL/menubar +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/menubar +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un conteneur généralement destiné à des éléments menu. Sur les ordinateurs Macintosh, la barre de menus est affichée en haut de l'écran, et tous les éléments non liés à un menu dans l'élément menubar seront ignorés. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
grippyhidden, statusbar +
+
Propriétés +
accessibleType, statusbar +
+

Exemples

+
Image:XUL_ref_menu.png
+
<menubar id="sample-menubar">
+  <menu id="action-menu" label="Action">
+    <menupopup id="action-popup">
+      <menuitem label="Nouvelle"/>
+      <menuitem label="Enregistrer" disabled="true"/>
+      <menuitem label="Fermer"/>
+      <menuseparator/>
+      <menuitem label="Quitter"/>
+    </menupopup>
+  </menu>
+  <menu id="edit-menu" label="Édition">
+    <menupopup id="edit-popup">
+      <menuitem label="Annuler"/>
+      <menuitem label="Rétablir"/>
+    </menupopup>
+  </menu>
+</menubar>
+
+

Attributs

+

+

+ +
+
+ +
+ +

Propriétés

+
+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+
+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+
Éléments +
menu, menuitem, menulist, menupopup, menuseparator +
+
Interfaces +
nsIAccessibleProvider +
+
+
diff --git a/files/fr/archive/mozilla/xul/menuitem/index.html b/files/fr/archive/mozilla/xul/menuitem/index.html new file mode 100644 index 0000000000..813096fdc4 --- /dev/null +++ b/files/fr/archive/mozilla/xul/menuitem/index.html @@ -0,0 +1,293 @@ +--- +title: menuitem +slug: Archive/Mozilla/XUL/menuitem +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/menuitem +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un choix particulier dans un élément menupopup. Il agit de manière semblable à un élément button, mais est affiché dans un menu. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
acceltext, accesskey, allowevents, autocheck, checked, command, crop, description, disabled, image, key, label, name, selected, tabindex, type, validate, value +
+
Propriétés +
accessibleType, accessKey, command, control, crop, disabled, image, label, labelElement, parentContainer, selected, tabIndex, value +
+
Classes de style +
menuitem-iconic, menuitem-non-iconic +
+

Exemple

+
<menu id="edit-menu" label="Edit">
+  <menupopup id="edit-popup">
+     <menuitem label="Undo"/>
+     <menuitem label="Redo"/>
+  </menupopup>
+</menu>
+
+

Attributs

+

+

+ +
+
+ acceltext
+
+ Type : chaîne de caractères
+
+ Texte qui apparaîtra à côté du label d'un menu pour indiquer la touche de raccourci (accélérateur) à utiliser pour invoquer la commande. Si cette valeur est définie, elle écrase une clé assignée dans l'attribut key. Cet attribut ne s'applique pas aux menus directement sur la Barre de menus (menubar).
+
+
+
+ +
accesskey
+
Type : caractère +
Cet attribut doit être une lettre utilisée comme touche de raccourci. Cette lettre doit être un des caractères apparaissant dans l'attribut label de l'élément.
+

Exemple

+
Image:XUL_ref_accesskey_attr.png
+
<vbox>
+  <label value="Entrez votre nom" accesskey="e" control="myName"/>
+  <textbox id="myName"/>
+  <button label="Annuler" accesskey="n"/>
+  <button label="OK" accesskey="O"/>
+</vbox>
+
+

Voir également

+

Les attributs label et acceltext +

+
+
+ +
allowevents +
Type : booléen +
Si défini à true, les évènements sont passés aux enfants de l'élément. Dans le cas contraire, ils ne sont passés qu'à l'élément lui-même. +
+ + +
+
+ +
+
+ +
+
+ checked
+
+ Type : + + booléen +
+
+ Indique si l'élément est coché ou non.
+
+ Utilisez hasAttribute() pour déterminer si cet attribut est défini plutôt que getAttribute().
+ Pour les boutons, l'attribut type doit etre mis à checkbox ou à radio pour qu'un effet soit perceptible.
+
+
+ +
Note : si l'attribut checked est défini à true, et que sa valeur est rendue persistante avec l'attribut persist, Mozilla ne pourra pas conserver cette valeur lorsque l'élément menuitem est désélectionné suite au bug 15232. Pour contourner ceci, définissez l'attribut autocheck à false, puis définissez programmatiquement l'attribut checked lorsque l'utilisateur clique sur l'élément, et définissez-le à false au lieu de retirer l'attribut (c'est-à-dire qu'il faut faire menuitem.setAttribute("checked", "false") au lieu de menuitem.removeAttribute("checked")) lorsque l'utilisateur désélectionne le menuitem, car une valeur à false masquera correctement la marque cochée et conservera son état invisible.
+
+ +
command +
Type : id d'élément +
Défini à la valeur de l'id d'un élément command observé par l'élément. +
+ + +
+
+ +
crop +
Type : une des valeurs ci-dessous +
Si le label de l'élément est trop long pour être contenu dans son espace donné, le texte sera tronqué du côté indiqué par l'attribut crop. Une ellipse (…) sera utilisée à la place du texte tronqué. Si la direction de la boîte est inversée, le tronquage l'est également. +
+ + + +
+
+ +
+
+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
image +
Type : URL d'une image +
L'URL de l'image devant apparaître sur l'élément. Si cet attribut est vide ou omis, aucune image n'apparaîtra. La position de l'image est déterminée par les attributs dir et orient. +
+ + +
+
+ +
+
+ +
label +
Type : chaîne de caractères +
Le label qui apparaîtra sur l'élément. S'il n'est pas spécifié, aucun texte n'apparaîtra. +
+ + +
+
+ +
+
+ +
selected +
Type : booléen +
Indique si l'élément est sélectionné ou non. Cette valeur est en lecture seule. Pour changer la sélection, utilisez la propriété selectedIndex ou selectedItem de l'élément conteneur. +
+ + +
+
+ +
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+ + +
+
+ +
+
+ +
+
+ +
value +
Type : chaîne +
Cet attribut chaîne permet d'associer une valeur de données avec un élément. Il n'est destiné à aucune utilisation particulière, mais vous pouvez y accéder avec un script pour votre usage propre.. +
+ + +
+ +

Propriétés

+
+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+
+
accessKey +
Type : caractère +
Obtient et définit la valeur de l'attribut accesskey. +
+


+

+ +
+
+
+
+
crop +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut crop. +
+ +
+
+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
image +
Type : URL d'image +
Obtient et définit la valeur de l'attribut image. +
+ +
+
+
label +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut label. +
+ +
+
+
+
+ +
+
selected
+
Type : booléen
+
La valeur de cette propriété est true si cet élément est sélectionné, ou false s'il ne l'est pas. Cette propriété est en lecture seule.
+
+
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+ +
+
+
value +
Type : chaîne +
Obtient et définit la valeur de l'attribut value. +
+ +
+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Classes de style

+
+
menuitem-iconic
+
Use this class to have an image appear on the menuitem. Specify the image using the image attribute.
+
+
+
menuitem-non-iconic
+
Normally, menuitems have a margin to the left for an image or checkmark. This class may be used to remove this margin so that the menuitem appears on the left edge of the menupopup.
+
+ +

Sujets liés

+
Éléments +
menu, menubar, menulist, menupopup, menuseparator
+
Interfaces +
nsIAccessibleProvider, nsIDOMXULContainerItemElement, nsIDOMXULSelectControlItemElement +
+


+

+
+
diff --git a/files/fr/archive/mozilla/xul/menulist/index.html b/files/fr/archive/mozilla/xul/menulist/index.html new file mode 100644 index 0000000000..1f88ef35db --- /dev/null +++ b/files/fr/archive/mozilla/xul/menulist/index.html @@ -0,0 +1,276 @@ +--- +title: menulist +slug: Archive/Mozilla/XUL/menulist +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/menulist +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un élément pouvant être utilisé pour des listes de choix déroulantes. L'utilisateur peut sélectionner l'un des éléments affichés dans la liste menulist. Le choix actuellement sélectionné est affiché sur l'élément menulist lui-même. Pour créer la liste déroulante, ajoutez un élément menupopup dans l'élément menulist, avec les différents choix comme éléments menuitem. L'évènement command peut être utilisé pour exécuter du code lorsque la sélection change dans la liste. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
accesskey, crop, disableautoselect, disabled, editable, focused, image, label, oncommand, open, preference, readonly, sizetopopup, tabindex, value +
+
Propriétés +
accessibleType, crop, description, disableautoselect, disabled, editable, editor, image, inputField, itemCount, label, menuBoxObject, menupopup, open, selectedIndex, selectedItem, tabIndex, value +
+
Méthodes +
appendItem, contains, getIndexOfItem, getItemAtIndex, insertItemAt, removeAllItems, removeItemAt, select +
+

Exemples

+
  <menulist>
+    <menupopup>
+      <menuitem label="option 1" value="1"/>
+      <menuitem label="option 2" value="2"/>
+      <menuitem label="option 3" value="3"/>
+      <menuitem label="option 4" value="4"/>
+    </menupopup>
+  </menulist>
+
+

Attributs

+

+

+ +
accesskey
+
Type : caractère +
Cet attribut doit être une lettre utilisée comme touche de raccourci. Cette lettre doit être un des caractères apparaissant dans l'attribut label de l'élément.
+

Exemple

+
Image:XUL_ref_accesskey_attr.png
+
<vbox>
+  <label value="Entrez votre nom" accesskey="e" control="myName"/>
+  <textbox id="myName"/>
+  <button label="Annuler" accesskey="n"/>
+  <button label="OK" accesskey="O"/>
+</vbox>
+
+

Voir également

+

Les attributs label et acceltext +

+
+
+ +
crop +
Type : une des valeurs ci-dessous +
Si le label de l'élément est trop long pour être contenu dans son espace donné, le texte sera tronqué du côté indiqué par l'attribut crop. Une ellipse (…) sera utilisée à la place du texte tronqué. Si la direction de la boîte est inversée, le tronquage l'est également. +
+ + + +
+
+ +
+
+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
+
+ +
+
+ +
image +
Type : URL d'une image +
L'URL de l'image devant apparaître sur l'élément. Si cet attribut est vide ou omis, aucune image n'apparaîtra. La position de l'image est déterminée par les attributs dir et orient. +
+ + +
+
+ +
label +
Type : chaîne de caractères +
Le label qui apparaîtra sur l'élément. S'il n'est pas spécifié, aucun texte n'apparaîtra. +
+ + +
+
+ +
oncommand +
Type : code de script +
Ce gestionnaire d'évènement est appelé lorsque la commande est activée. Cela se produit quand un utilisateur sélectionne un élément de menu ou active un raccourci clavier attaché à la commande. +
+ + +
+
+ +
open +
Type : booléen +
Pour les boutons de type menu, l'attribut open est défini à true lorsque le menu est ouvert. L'attribut open n'est pas présent si le menu est fermé. +
+ + +
+
+ +
preference +
Type : id d'élément +
Connecte l'élément à une préférence (élément preference) correspondante. Cet attribut n'a d'effet qu'utilisé au sein d'un prefwindow. La valeur de la préférence sera mise à jour pour correspondre à la propriété value de l'élément. +
+ + +
+
+ +
readonly +
Type : booléen +
Si défini à true, l'utilisateur ne peut pas modifier la valeur de l'élément. Cependant, celle-ci peut toujours être modifiée par un script. +
+ + +
+
+ +
+
+ +
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+ + +
+
+ +
value +
Type : chaîne +
Cet attribut chaîne permet d'associer une valeur de données avec un élément. Il n'est destiné à aucune utilisation particulière, mais vous pouvez y accéder avec un script pour votre usage propre.. +
+ + +
+ +

Propriétés

+

+

+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+
+
crop +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut crop. +
+ +
+
+
+
+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
+
+
+
+
+
label +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut label. +
+ +
+
+
+
+
open +
Type : booléen +
Obtient et définit la valeur de l'attribut open. +
+ +
+
+
selectedIndex +
Type : entier +
Renvoie l'indice de l'élément actuellement sélectionné. Un élément peut être sélectionné en assignant son indice à cette propriété. En lui assignant -1, tous les éléments seront désélectionnés. +
+ +
+
+
selectedItem +
Type : élément +
Conserve l'élément actuellement sélectionné. Si aucun élément n'est sélectionné, sa valeur sera null. Vous pouvez sélectionner un élément en définissant cette valeur. Un évènement select sera envoyé à cet élément lorsqu'il est sélectionné en modifiant cette propriété, la propriété selectedIndex, ou par l'utilisateur. +
+ +
+
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+ +
+
+
value +
Type : chaîne +
Obtient et définit la valeur de l'attribut value. +
+ +
+ +

Méthodes

+ + + + + + +
+

Héritées de XUL element
+ blur, click, doCommand, focus, getElementsByAttribute getElementsByAttributeNS

Héritées de DOM element
+ addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()

+ +
+ + + + + + + + + +

Sujets liés

+
Éléments +
menu, menubar, menuitem, menupopup, menuseparator +
+
Interfaces +
nsIAccessibleProvider, nsIDOMXULMenuListElement +
+
+
diff --git a/files/fr/archive/mozilla/xul/menupopup/index.html b/files/fr/archive/mozilla/xul/menupopup/index.html new file mode 100644 index 0000000000..b71b919590 --- /dev/null +++ b/files/fr/archive/mozilla/xul/menupopup/index.html @@ -0,0 +1,229 @@ +--- +title: menupopup +slug: Archive/Mozilla/XUL/menupopup +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/menupopup +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un conteneur utilisé pour afficher le contenu d'un menu popup. Lorsqu'un menupopup est ouvert, il flotte par dessus la fenêtre et peut s'étendre en dehors de celle-ci. Les menupopups peuvent être utilisés de plusieurs manières : +

+
  1. On peut les placer dans un élément menu, menulist ou button avec l'attribut type défini à « menu » pour créer un popup qui s'ouvrira lors d'un clic sur le bouton ou menu. +
  2. On peut les attacher à n'importe quel élément à l'aide de l'attribut popup. Lors d'un clic gauche sur l'élément, le menupopup sera affiché. +
  3. On peut les attacher à n'importe quel élément à l'aide de l'attribut context. Lors de l'ouverture d'un menu contextuel, le menupopup sera affiché. Un menu contextuel peut être ouvert par un clic droit sur l'élément ou l'appui sur la touche menu du clavier.
+

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
ignorekeys, left, onpopuphidden, onpopuphiding, onpopupshowing, onpopupshown, position, top +
+
Propriétés +
accessibleType, popupBoxObject, popup, state +
+
Méthodes +
hidePopup, moveTo, openPopup, openPopupAtScreen, showPopup, sizeTo +
+

Exemples

+

L'exemple suivant montre l'attachement d'un menupopup à un élément menulist. +

+
<menulist>
+  <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>
+
+

L'exemple qui suit montre l'utilisation d'un menupopup comme menu contextuel d'un élément. Lors d'un clic droit sur le label, le menu sera affiché. +

+
Image:XUL_ref_popup.png
+
<menupopup id="clipmenu">
+  <menuitem label="Couper"/>
+  <menuitem label="Copier"/>
+  <menuitem label="Coller"/>
+</menupopup>
+<label value="Clic droit pour ouvrir un popup" context="clipmenu"/>
+
+

Attributs

+

+

+ +
+
+ +
left +
Type : entier +
Remplace la position horizontale du popup spécifiée par la méthode showPopup. +
+


+

+ + +
+
+ +
onpopuphidden +
Type : code de script +
Cet évènement est envoyé à un popup après qu'il a été caché. http://www.langue-fr.net/index/A/apres-que.htm +
+ + +
+
+ +
onpopuphiding +
Type : code de script +
Cet évènement est envoyé à un popup lorsqu'il est sur le point d'être masqué. +
+ + +
+
+ +
onpopupshowing +
Type : code de script +
Cet évènement est envoyé à un popup juste avant son ouverture. On l'utilise généralement pour définir dynamiquement le contenu lorsque l'utilisateur demande son affichage. Si ce gestionnaire d'évènement renvoie false, le popup ne s'affichera pas. +
+ + +
+
+ +
onpopupshown +
Type : code de script +
Cet évènement est envoyé à un popup après son ouverture, de la même manière qu'un évènement onload est envoyé à une fenêtre à son ouverture. +
+ + +
+
+ +
position +
Type : une des valeurs ci-dessous +
L'attribut position détermine où le popup apparaît par rapport à l'élément sur lequel l'utilisateur a cliqué pour l'invoquer. C'est ce qui permet de placer le popup sur le bord d'un bouton. +
+ + + +
+
+ +
top +
Type : entier +
Remplace la position verticale du popup spécifiée par la méthode showPopup. +
+


+

+ + +
+ +

Propriétés

+

+

+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+
+
popupBoxObject +
Type : nsIPopupBoxObject +
Cette propriété en lecture seule conserve le nsIPopupBoxObject qui implémente le popup. Il n'est normalement pas nécessaire d'utiliser cette propriété étant donné que toutes ses fonctions sont disponibles via le popup lui-même. +
+ +
+
+
position +
Type : chaîne +
Obtient et définit la valeur de l'attribut position. +
+ +
+
+
state +
Type : chaîne +
Cette propriété en lecture seule indique si le popup est ouvert ou non. Quatre valeurs sont possibles : +
+ + +
+ +

Méthodes

+ + + + + + +
+

Héritées de XUL element
+ blur, click, doCommand, focus, getElementsByAttribute getElementsByAttributeNS

Héritées de DOM element
+ addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()

+ +
+
hidePopup()
+
Type de retour : pas de valeur de retour +
Ferme le popup immédiatement. +
+
moveTo( x, y ) +
Type de retour : pas de valeur de retour +
Déplace le popup vers un nouvel emplacement. +
+
openPopup( anchor , position , x , y , isContextMenu, attributesOverride ) +
Type de retour : pas de valeur de retour +
+

Ouvre le popup relativement à un nœud spécifié à un emplacement spécifique. +

Le popup peut soit être ancré à un autre nœud ou ouvert librement. Pour ancrer un popup à un nœud, fournissez un nœud d'accrochage dans le paramètre anchor et définissez la position par une chaîne indiquant la manière dont le popup doit être ancré. +

Les valeurs possibles pour le paramètre position sont : before_start, before_end, after_start, after_end, start_before, start_after, end_before, end_after, overlap, after_pointer +

Le nœud d'accrochage ne doit pas nécessairement être dans le même document que le popup. +

Si le paramètre attributesOverride vaut true, l'attribut position sur le nœud popup a priorité sur la valeur du paramètre position. Si attributesOverride vaut false, l'attribut n'est utilisé que si le paramètre position est vide. +

Pour un popup ancré, les paramètres x et y peuvent être utilisés pour décaler le popup de sa position d'ancrage de quelques pixels (mesurés en pixels CSS). +

Les popups non ancrés peuvent être créés en fournissant null comme paramètre anchor. Un popup non ancré apparait à la position spécifiée par x et y relativement à la zone visible (viewport) du document contenant le nœud popup. Dans ce cas, les paramètres position et attributesOverride sont ignorés. +

+
openPopupAtScreen( x, y, isContextMenu ) +
Type de retour : pas de valeur de retour +
+

Ouvre le popup à une position spécifique sur l'écran spécifiée par x et y. Cette position peut être ajustée s'il s'avère qu'elle provoquerait l'apparition du popup en dehors de l'écran. Les coordonnées x et y sont mesurées en pixels CSS. +

+
showPopup( element, x, y, popupType, anchor, align ) Déprécié dans Mozilla 1.9 +
Type de retour : aucune valeur de retour +
Ouvre un élément popup. Deux moyens de spécifier l'emplacement où s'affichera la fenêtre popup existent, soit en spécifiant une position spécifique de l'écran, soit par rapport à un autre élément de la fenêtre. Si x ou y sont définies par une valeur, le popup apparaîtra aux coordonnées (x,y) de l'écran. Si x et y sont définies à -1, le popup sera positionné par rapport à l'element spécifié dans le premier paramètre. C'est cette dernière méthode qu'il faut utiliser, par exemple, pour afficher un popup sous un bouton. Dans ce cas, les paramètres anchor et align peuvent être utilisés pour contrôler plus avant l'endroit où apparaîtra le popup par rapport à l'élément. Le paramètre anchor correspond à l'attribut popupanchor de l'élément et le paramètre align correspond à l'attribut popupalign. Les paramètres anchor et align sont ignorés si ni x ni y ne valent -1. +
+
Pour qu'un popup apparaisse à une position relative à un autre élément tout en étant décalé de quelques pixels, déterminez la position réelle de l'élément à l'aide de ses propriétés boxObject.screenX et boxObject.screenY, et utilisez celles-ci comme paramètres x et y en y ajoutant les décalages souhaités. +
+
Le paramètre popupType doit être une des chaînes popup, context ou tooltip. Chaque type de popup est destiné à être affiché temporairement ; ils ne sont pas censés être affichés de façon permanente. On ne peut afficher qu'un popup à la fois. +
+
sizeTo( <i>largeur</i>, <i>hauteur</i> ) +
Type de retour : aucune valeur de retour +
Modifie la taille actuelle de la fenêtre popup avec les nouvelles dimensions largeur et hauteur. +
+ +

Sujets liés

+
Éléments
menu, menubar, menuitem, menulist, menuseparator
+
Interfaces +
nsIAccessibleProvider, nsIDOMXULPopupElement +
+
+
diff --git a/files/fr/archive/mozilla/xul/menuseparator/index.html b/files/fr/archive/mozilla/xul/menuseparator/index.html new file mode 100644 index 0000000000..59a1fe1dda --- /dev/null +++ b/files/fr/archive/mozilla/xul/menuseparator/index.html @@ -0,0 +1,242 @@ +--- +title: menuseparator +slug: Archive/Mozilla/XUL/menuseparator +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/menuseparator +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Utilisé pour créer un séparateur entre des éléments de menu. Typiquement affiché sous la forme d'une fine ligne. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
acceltext, accesskey, allowevents, command, crop, disabled, image, label, selected, tabindex, value +
+
Propriétés +
accessibleType, accessKey, command, control, crop, disabled, image, label, labelElement, parentContainer, selected, tabIndex, value +
+

Exemples

+
<menu label="Aide">
+  <menupopup>
+    <menuitem label="Rubriques d'aide"/>
+    <menuseparator/>
+    <menuitem label="Notes de version"/>
+  </menupopup>
+</menu>
+
+

Attributs

+

+

+ +
+
+ acceltext
+
+ Type : chaîne de caractères
+
+ Texte qui apparaîtra à côté du label d'un menu pour indiquer la touche de raccourci (accélérateur) à utiliser pour invoquer la commande. Si cette valeur est définie, elle écrase une clé assignée dans l'attribut key. Cet attribut ne s'applique pas aux menus directement sur la Barre de menus (menubar).
+
+
+
+ +
accesskey
+
Type : caractère +
Cet attribut doit être une lettre utilisée comme touche de raccourci. Cette lettre doit être un des caractères apparaissant dans l'attribut label de l'élément.
+

Exemple

+
Image:XUL_ref_accesskey_attr.png
+
<vbox>
+  <label value="Entrez votre nom" accesskey="e" control="myName"/>
+  <textbox id="myName"/>
+  <button label="Annuler" accesskey="n"/>
+  <button label="OK" accesskey="O"/>
+</vbox>
+
+

Voir également

+

Les attributs label et acceltext +

+
+
+ +
allowevents +
Type : booléen +
Si défini à true, les évènements sont passés aux enfants de l'élément. Dans le cas contraire, ils ne sont passés qu'à l'élément lui-même. +
+ + +
+
+ +
command +
Type : id d'élément +
Défini à la valeur de l'id d'un élément command observé par l'élément. +
+ + +
+
+ +
crop +
Type : une des valeurs ci-dessous +
Si le label de l'élément est trop long pour être contenu dans son espace donné, le texte sera tronqué du côté indiqué par l'attribut crop. Une ellipse (…) sera utilisée à la place du texte tronqué. Si la direction de la boîte est inversée, le tronquage l'est également. +
+ + + +
+
+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
image +
Type : URL d'une image +
L'URL de l'image devant apparaître sur l'élément. Si cet attribut est vide ou omis, aucune image n'apparaîtra. La position de l'image est déterminée par les attributs dir et orient. +
+ + +
+
+ +
label +
Type : chaîne de caractères +
Le label qui apparaîtra sur l'élément. S'il n'est pas spécifié, aucun texte n'apparaîtra. +
+ + +
+
+ +
selected +
Type : booléen +
Indique si l'élément est sélectionné ou non. Cette valeur est en lecture seule. Pour changer la sélection, utilisez la propriété selectedIndex ou selectedItem de l'élément conteneur. +
+ + +
+
+ +
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+ + +
+
+ +
value +
Type : chaîne +
Cet attribut chaîne permet d'associer une valeur de données avec un élément. Il n'est destiné à aucune utilisation particulière, mais vous pouvez y accéder avec un script pour votre usage propre.. +
+ + +
+ +

Propriétés

+

+

+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+
+
accessKey +
Type : caractère +
Obtient et définit la valeur de l'attribut accesskey. +
+


+

+ +
+
+
+
+
crop +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut crop. +
+ +
+
+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
image +
Type : URL d'image +
Obtient et définit la valeur de l'attribut image. +
+ +
+
+
label +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut label. +
+ +
+
+
+
+ +
+
selected
+
Type : booléen
+
La valeur de cette propriété est true si cet élément est sélectionné, ou false s'il ne l'est pas. Cette propriété est en lecture seule.
+
+
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+ +
+
+
value +
Type : chaîne +
Obtient et définit la valeur de l'attribut value. +
+ +
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+
Éléments +
menu, menubar, menuitem, menulist, menupopup +
+
Interfaces +
nsIAccessibleProvider, nsIDOMXULContainerItemElement, nsIDOMXULSelectControlItemElement +
+
+
diff --git a/files/fr/archive/mozilla/xul/modification_dynamique_d'interfaces_utilisateur_en_xul/index.html b/files/fr/archive/mozilla/xul/modification_dynamique_d'interfaces_utilisateur_en_xul/index.html new file mode 100644 index 0000000000..5275b8d97f --- /dev/null +++ b/files/fr/archive/mozilla/xul/modification_dynamique_d'interfaces_utilisateur_en_xul/index.html @@ -0,0 +1,98 @@ +--- +title: Modification dynamique d'interfaces utilisateur en XUL +slug: Archive/Mozilla/XUL/Modification_dynamique_d'interfaces_utilisateur_en_XUL +tags: + - DOM + - Extensions + - NeedsUpdate + - XUL +translation_of: Archive/Mozilla/XUL/Dynamically_modifying_XUL-based_user_interface +--- +

Cet article traite de la manipulation d'interfaces en XUL, à l'aide du DOM et d'autres API. Il explique le concept desdocuments DOM, présente quelques exemples simples d'appels DOM utilisés pour effectuer des manipulations basiques sur un document, et ensuite la façon de travailler avec ducontenu XBL anonyme à l'aide de méthodes spécifiques à Mozilla.

+ +

Il est écrit pour des développeurs XUL débutants et de niveau moyen. Nous supposons que le lecteur a des connaissances de base à la fois en XUL et en JavaScript. Il peut également être intéressant de consulter quelques documents d'introduction relatifs au DOM, comme l'article À propos du Document Object Model ou la page d'introduction de la Référence du DOM Gecko.

+ +

Introduction

+ +

Comme vous le savez, XUL est un langage XML utilisé dans plusieurs applications basées sur Mozilla, comme Firefox et Thunderbird, pour décrire l'interface utilisateur. Dans les applications XUL, JavaScript définit le comportement, à l'aide des API DOM pour accéder au document XUL.

+ +

En quoi consistent ces API DOM ?

+ +

Ce sont les interfaces utilisées dans toute interaction entre un script et un document. Si vous avez écrit n'importe quel script interagissant avec un document XUL (ou HTML), vous avez déjà utilisé des appels DOM. La méthode DOM la plus connue est probablement document.getElementById(), qui renvoie un élément depuis son id. Vous avez peut-être utilisé d'autres appels, comme element.setAttribute(), ou, si vous avez écrit une extension, la méthode addEventListener(). Toutes celles-ci sont définies dans le DOM.

+ +

D'autres méthodes DOM permettent également de créer, déplacer ou supprimer des éléments d'un document. Celles-ci seront présentées dans une section ultérieure. Pour l'instant, préoccupons-nous de ce qu'est undocument .

+ +

Définition d'un document

+ +

Un document est une structure de données manipulée à l'aide des API DOM. Une structure logique de tout élément est un arbre, dont les nœuds sont les éléments, attributes, instructions de traitement, commentaires, etc. Utilisez l'outil Inspecteur DOM pour voir la représentation sous forme d'arbre de n'importe quel document. Todo: simple example of a XUL document and a tree

+ +

Vous pouvez penser à un document comme à une représentation en mémoire de HTML valide ou de XML bien formé (en ce compris du XUL).

+ +

Il est important de se souvenir de différentes pages Web (et même différentes instances de la même page Web) correspondent à différents documents. Chaque fenêtre XUL possède son propre document distinct, et il peut même y avoir un certain nombre de documents différents dans une même fenêtre, lorsqu'uil y a des élements <iframe>, <browser>, ou encore <tabbrowser>. Vous devez vous assurer de toujours manipuler le bon document. (Consultez Travailler avec des fenêtres dans le chrome pour en savoir plus.) Lorsque votre script est inclus à l'aide d'une balise <script>, la propriété document référence le document DOM dont le script fait partie.

+ +

Exemples : utilisation de méthodes DOM

+ +

Cette section présente l'utilisation des méthodes DOM appendChild(), createElement(), insertBefore(), et removeChild().

+ +

Suppression de tous les enfants d'un élément

+ +

Cet exemple supprime tous les enfants d'un élément dont l'id est "unCertainElement" du document courant, en appelant la méthode removeChild() pour supprimer le premier enfant et ce jusqu'à ce que plus aucun d'entre-eux ne reste.

+ +

Notez que hasChildNodes() et firstChild font également partie de l'API DOM.

+ +
var element = document.getElementById("unCertainElement");
+while(element.hasChildNodes())
+  element.removeChild(element.firstChild);
+
+ +

Insertion d'éléments de menu dans un menu

+ +

Cet exemple ajoute deux nouveaux élements de menu à un <menupopup>, au début et à la fin de celui-ci. Il utilise la méthode document.createElementNS() pour créer les éléments, et insertBefore() avec appendChild() pour insérer les éléments créés dans le document.

+ +

Notes :

+ + + +
function createMenuItem(aLabel) {
+  const XUL_NS = "http://www.mozilla.org/keymaster/gat...re.is.only.xul";
+  var item = document.createElementNS(XUL_NS, "menuitem"); // crée un nouvel élément de menu XUL
+  item.setAttribute("label", aLabel);
+  return item;
+}
+var popup = document.getElementById("myPopup"); // un élément <menupopup>
+var first = createMenuItem("Premier choix");
+var last = createMenuItem("Dernier choix");
+popup.insertBefore(first, popup.firstChild);
+popup.appendChild(last);
+
+ +

Il est également possible d'utiliser appendChild() et insertBefore() pour déplacer des éléments existants. Par exemple, vous pouvez déplacer l'élément nommé « First item » vers la fin du menu en ajoutant cette ligne à la fin du bout de code ci-dessus :

+ +
popup.appendChild(first);
+
+ +

Cette instruction supprimerait le nœud de sa position courante dans le document et le réinsèrerait à la fin du menu.

+ +

Contenu anonyme (XBL)

+ +

XBL est le langage utilisé dans Mozilla pour définir de nouveaux éléments d'interface. Ces outils définis en XBL peuvent choisir de définir un certain contenu qui sera inséré dans l'élément conteneur lorsque la liaison (binding) est attachée. Ce contenu, appelécontenu anonyme , n'est pas accessible à travers les méthodes DOM normales.

+ +

Il est nécessaire d'utiliser les méthodes de l'interface nsIDOMDocumentXBL à la place. Par exemple :

+ +
// récupère le premier enfant anonyme du nœud donné
+document.getAnonymousNodes(node)[0];
+
+// renvoie une NodeList d'éléments anonymes dont l'attribut anonid vaut el1
+document.getAnonymousElementByAttribute(node, "anonid", "el1");
+
+ +

Une fois que vous avez une référence à un nœud anonyme, vous pouvez utiliser les méthodes DOM normales pour naviguer et manipuler les autres nœuds de cette liaison XBL.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/mozilla/xul/modifications_xul_pour_firefox_1.5/index.html b/files/fr/archive/mozilla/xul/modifications_xul_pour_firefox_1.5/index.html new file mode 100644 index 0000000000..851dd7ae7a --- /dev/null +++ b/files/fr/archive/mozilla/xul/modifications_xul_pour_firefox_1.5/index.html @@ -0,0 +1,59 @@ +--- +title: Modifications XUL pour Firefox 1.5 +slug: Archive/Mozilla/XUL/Modifications_XUL_pour_Firefox_1.5 +tags: + - XUL +translation_of: Archive/Mozilla/XUL/XUL_Changes_for_Firefox_1.5 +--- +

+

Cette page répertorie les modifications les plus remarquables au XUL dans Firefox 1.5 (Gecko 1.8). Pour les autres changements à connaître, voir Adaptation des applications XUL pour Firefox 1.5. +

+

<scrollcorner>

+

Un nouvel élément <scrollcorner> sert à créer une petite boîte à l'intersection entre les ascenseurs horizontal et vertical. +

+

<richlistbox> et <richlistitem>

+

Les éléments <richlistbox> et <richlistitem> sont utilisés pour la création de liste avec du contenu arbitraire. Cet élément fonctionne de manière similaire à <listbox> qui est principalement dédié aux listes de texte. Le <richlistbox> supporte presque la même API que le <listbox> et des items uniques créés avec l'élément <richlistitem> peuvent y être sélectionnés. Consultez XUL:Richlistbox pour plus d'information. +

+

Système de préférences

+

Plusieurs éléments ont été ajoutés pour la création de fenêtre de gestion des préférences. Ces fenêtres sont des types spéciaux de boîtes de dialogues supportant plusieurs panneaux qui peuvent être contenus dans le même fichier ou des fichiers séparés. Une série d'icônes apparaîtront en haut de la boîte de dialogue pour permettre à l'utilisateur de changer de panneaux. En plus de ces nouveaux éléments, quelques attributs supplémentaires pour des éléments existants ont été ajoutés pour rendre plus simple la configuration de préférences sans avoir à utiliser de code. Pour plus d'information, consultez Système de préférences. +

+

bfcache

+

Mozilla mémorise maintenant les résultats du DOM d'une page, afin de ne pas avoir à recharger la page en navigant vers l'arrière ou vers l'avant, ce qui rend la navigation beaucoup plus efficace. Les évènements pageshow et pagehide sont utilisés lors du basculement vers une page dans le cache, tandis que les évènements load et unload servent uniquement lorsqu'une page est chargée ou déchargée. +

Pour plus d'information, consultez Utilisation du cache de Firefox 1.5 +

+

tabIndex

+

La propriété tabIndex s'applique maintenant à plus d'éléments. +

+

<radiogroup>

+

L'affectation de la propriété value sur un élément <radiogroup> sélectionne directement l'élément <radio> du groupe ayant la valeur correspondante. +

+

Boîte de dialogue : propriété defaultButton

+

La liaison <dialog> supporte maintenant la propriété defaultButton. L'affectation de cette propriété modifie le bouton par défaut de la boîte de dialogue. Il peut être défini soit à l'un des boutons de la liaison <dialog> (en utilisant leurs noms) ou soit à none auquel cas aucun bouton ne sera défini par défaut. +

+

Bouton : propriété icon

+

La propriété icon d'un bouton peut servir à définir un stock d'icônes prédéfinies sur un bouton et utilisées sur certaines plateformes. Par exemple, <button icon="help"> va créer un bouton avec une icône d'aide. Les systèmes GNOME utilisent habituellement cette pratique où les valeurs possibles sont : +

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>

+

Les items dans un <menulist> supporte l'attribut description permettant d'inclure du texte descriptif à côté du libellé d'un item. Les méthodes appendItem et insertItemAt utilisées pour pour la création d'items dans un menulist prennent un argument supplémentaire pour cette description. +

+

<stringbundle>

+

L'élément <stringbundle> a une propriété strings servant à récupérer une énumération de toutes les chaînes de caractères dans le bundle. +

+

Onglets repositionnables

+

L'utilisateur peut maintenant réarranger les onglets de navigation en les faisant glisser. +

+

<tabbox>

+

L'élément <tabbox> supporte maintenant l'attribut selectedIndex pour définir l'onglet sélectionné par défaut. +

+

Chargement dynamique des overlays

+

XUL supporte maintenant le chargement dynamique des overlays grâce à la fonction document.loadOverlay. +

+
+

Informations sur le document d'origine

+ +
+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/blur/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/blur/index.html" new file mode 100644 index 0000000000..c8078d98c9 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/blur/index.html" @@ -0,0 +1,14 @@ +--- +title: blur +slug: Archive/Mozilla/XUL/Méthodes/blur +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/blur +--- +
« Accueil de la référence XUL
+
blur() +
Type de retour : aucune valeur de retour +
Si le focus est sur l'élément, il sera retiré. Le focus n'est placé automatiquement sur aucun autre élément. Utilisé essentiellement pour appeler le gestionnaire d'évènement onblur. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/click/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/click/index.html" new file mode 100644 index 0000000000..ef23173bfb --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/click/index.html" @@ -0,0 +1,14 @@ +--- +title: click +slug: Archive/Mozilla/XUL/Méthodes/click +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/click +--- +
« Accueil de la référence XUL
+
click() +
Type de retour : aucune valeur de retour +
Appelle le gestionnaire d'évènement onclick pour l'élément. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/decrease/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/decrease/index.html" new file mode 100644 index 0000000000..7e3bc38bfd --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/decrease/index.html" @@ -0,0 +1,26 @@ +--- +title: decrease +slug: Archive/Mozilla/XUL/Méthodes/decrease +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/decrease +--- +
+ « Accueil de la référence XUL
+
+
+
+ Méthode de : scale, textbox
+
+
+
+
+ decrease()
+
+ Type de retour : + + aucune valeur de retour +
+
+ Diminue la valeur de<magic name="\"PAGENAME\"/"> la boîte numérique l'échelle, l'échelle ou la boîte numérique</magic> de la valeur de l'incrément.
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/decreasepage/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/decreasepage/index.html" new file mode 100644 index 0000000000..3d83d6c860 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/decreasepage/index.html" @@ -0,0 +1,17 @@ +--- +title: decreasePage +slug: Archive/Mozilla/XUL/Méthodes/decreasePage +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/decreasePage +--- +
« Accueil de la référence XUL
+
decreasePage()
+
Méthode de : scale
+
Type de retour : aucune valeur de retour +
Diminue la valeur de l'échelle de la valeur de pageIncrement. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/docommand/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/docommand/index.html" new file mode 100644 index 0000000000..362e53a578 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/docommand/index.html" @@ -0,0 +1,14 @@ +--- +title: doCommand +slug: Archive/Mozilla/XUL/Méthodes/doCommand +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/doCommand +--- +
« Accueil de la référence XUL
+
doCommand() +
Type de retour : aucune valeur renvoyée +
Exécute l'évènement command pour l'élément. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/focus/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/focus/index.html" new file mode 100644 index 0000000000..9f936eba19 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/focus/index.html" @@ -0,0 +1,14 @@ +--- +title: focus +slug: Archive/Mozilla/XUL/Méthodes/focus +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/focus +--- +
« Accueil de la référence XUL
+
focus() +
Type de retour : aucune valeur de retour +
Assigne le focus à l'élément, si celui-ci peut l'accepter. Le gestionnaire d'évènement onfocus est appelé. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/getelementsbyattribute/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/getelementsbyattribute/index.html" new file mode 100644 index 0000000000..1eceb74073 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/getelementsbyattribute/index.html" @@ -0,0 +1,14 @@ +--- +title: getElementsByAttribute +slug: Archive/Mozilla/XUL/Méthodes/getElementsByAttribute +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/getElementsByAttribute +--- +
« Accueil de la référence XUL
+
getElementsByAttribute( attrib, value ) +
Type de retour : liste de nœuds DOM (NodeList) +
Renvoie un tableau contenant tous les éléments enfants de l'élément disposant de l'attribut donné comme premier paramètre avec la valeur donnée comme second paramètre. Si le second paramètre est « * », l'attribut peut avoir n'importe quelle valeur. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/getrowcount/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/getrowcount/index.html" new file mode 100644 index 0000000000..3ffe5f059b --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/getrowcount/index.html" @@ -0,0 +1,14 @@ +--- +title: getRowCount +slug: Archive/Mozilla/XUL/Méthodes/getRowCount +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/getRowCount +--- +
« Accueil de la référence XUL
+
getRowCount() +
Type de retour : entier +
Renvoie le nombre total de lignes dans l'élément, quel que soit le nombre de lignes affichées. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/hasuservalue/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/hasuservalue/index.html" new file mode 100644 index 0000000000..e0c2b8202f --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/hasuservalue/index.html" @@ -0,0 +1,16 @@ +--- +title: hasUserValue +slug: Archive/Mozilla/XUL/Méthodes/hasUserValue +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/hasUserValue +--- +
« Accueil de la référence XUL
+
hasUserValue() +
Type de retour : booléen +
Renvoie true si la préférence a été modifiée par rapport à sa valeur par défaut. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/hidepopup/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/hidepopup/index.html" new file mode 100644 index 0000000000..d900d650db --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/hidepopup/index.html" @@ -0,0 +1,15 @@ +--- +title: hidePopup +slug: Archive/Mozilla/XUL/Méthodes/hidePopup +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/hidePopup +--- +
« Accueil de la référence XUL
+
hidePopup()
+
Méthode de : popup, menupopup, tooltip
+
Type de retour : pas de valeur de retour +
Ferme le popup immédiatement. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/increase/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/increase/index.html" new file mode 100644 index 0000000000..c2308982af --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/increase/index.html" @@ -0,0 +1,29 @@ +--- +title: increase +slug: Archive/Mozilla/XUL/Méthodes/increase +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/increase +--- +
+ « Accueil de la référence XUL
+
+
+
+ Méthode de : scale textbox
+
+
+
+
+ increase()
+
+ Type de retour : + + aucune valeur de retour +
+
+ Augmente la valeur de <magic name="\"PAGENAME\"/">la boîte numérique, XUL:scale = l'échelle, l'échelle ou la boîte numérique</magic> de la valeur de l'incrément.
+
+

 

+
+  
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/increasepage/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/increasepage/index.html" new file mode 100644 index 0000000000..9d3cbac780 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/increasepage/index.html" @@ -0,0 +1,17 @@ +--- +title: increasePage +slug: Archive/Mozilla/XUL/Méthodes/increasePage +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/increasePage +--- +
« Accueil de la référence XUL
+
increasePage()
+
Méthode de : scale
+
Type de retour : aucune valeur de retour +
Augmente la valeur de l'échelle de la valeur de pageIncrement. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/index.html" new file mode 100644 index 0000000000..72e3cb3146 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/index.html" @@ -0,0 +1,186 @@ +--- +title: Méthodes +slug: Archive/Mozilla/XUL/Méthodes +tags: + - Aide_pour_les_éditeurs_de_MDC + - Méthodes_XUL + - Traduction_en_cours +translation_of: Archive/Mozilla/XUL/Method +--- +

« Accueil de la référence XUL

+ + + diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/moveto/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/moveto/index.html" new file mode 100644 index 0000000000..af8c9b8a47 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/moveto/index.html" @@ -0,0 +1,14 @@ +--- +title: moveTo +slug: Archive/Mozilla/XUL/Méthodes/moveTo +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/moveTo +--- +
« Accueil de la référence XUL
+
moveTo( x, y ) +
Type de retour : pas de valeur de retour +
Déplace le popup vers un nouvel emplacement. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/openpopup/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/openpopup/index.html" new file mode 100644 index 0000000000..0dbebe88b9 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/openpopup/index.html" @@ -0,0 +1,21 @@ +--- +title: openPopup +slug: Archive/Mozilla/XUL/Méthodes/openPopup +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/openPopup +--- +
« Accueil de la référence XUL
+
openPopup( anchor , position , x , y , isContextMenu, attributesOverride ) +
Type de retour : pas de valeur de retour +
+

Ouvre le popup relativement à un nœud spécifié à un emplacement spécifique. +

Le popup peut soit être ancré à un autre nœud ou ouvert librement. Pour ancrer un popup à un nœud, fournissez un nœud d'accrochage dans le paramètre anchor et définissez la position par une chaîne indiquant la manière dont le popup doit être ancré. +

Les valeurs possibles pour le paramètre position sont : before_start, before_end, after_start, after_end, start_before, start_after, end_before, end_after, overlap, after_pointer +

Le nœud d'accrochage ne doit pas nécessairement être dans le même document que le popup. +

Si le paramètre attributesOverride vaut true, l'attribut position sur le nœud popup a priorité sur la valeur du paramètre position. Si attributesOverride vaut false, l'attribut n'est utilisé que si le paramètre position est vide. +

Pour un popup ancré, les paramètres x et y peuvent être utilisés pour décaler le popup de sa position d'ancrage de quelques pixels (mesurés en pixels CSS). +

Les popups non ancrés peuvent être créés en fournissant null comme paramètre anchor. Un popup non ancré apparait à la position spécifiée par x et y relativement à la zone visible (viewport) du document contenant le nœud popup. Dans ce cas, les paramètres position et attributesOverride sont ignorés. +

+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/openpopupatscreen/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/openpopupatscreen/index.html" new file mode 100644 index 0000000000..56e83bb9c6 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/openpopupatscreen/index.html" @@ -0,0 +1,15 @@ +--- +title: openPopupAtScreen +slug: Archive/Mozilla/XUL/Méthodes/openPopupAtScreen +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/openPopupAtScreen +--- +
« Accueil de la référence XUL
+
openPopupAtScreen( x, y, isContextMenu ) +
Type de retour : pas de valeur de retour +
+

Ouvre le popup à une position spécifique sur l'écran spécifiée par x et y. Cette position peut être ajustée s'il s'avère qu'elle provoquerait l'apparition du popup en dehors de l'écran. Les coordonnées x et y sont mesurées en pixels CSS. +

+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/reset/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/reset/index.html" new file mode 100644 index 0000000000..2e573454aa --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/reset/index.html" @@ -0,0 +1,17 @@ +--- +title: reset +slug: Archive/Mozilla/XUL/Méthodes/reset +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/reset +--- +
« Accueil de la référence XUL
+
reset() +
Type de retour : aucune valeur renvoyée +
Réinitialise la préférence à sa valeur par défaut. +
Pour un élément textbox, la liste de transactions d'annulation est également vidée (Gecko 1.9). +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/select/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/select/index.html" new file mode 100644 index 0000000000..79d85de4e9 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/select/index.html" @@ -0,0 +1,16 @@ +--- +title: select +slug: Archive/Mozilla/XUL/Méthodes/select +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/select +--- +
« Accueil de la référence XUL
+
select() +
Type retourné : aucune valeur retournée +
Sélectionne l'intégralité du texte d'une boîte texte. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/selectall/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/selectall/index.html" new file mode 100644 index 0000000000..ff10b60952 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/selectall/index.html" @@ -0,0 +1,14 @@ +--- +title: selectAll +slug: Archive/Mozilla/XUL/Méthodes/selectAll +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/selectAll +--- +
« Accueil de la référence XUL
+
selectAll() +
Type de retour : aucune valeur renvoyée +
Sélectionne tous les éléments. Un évènement de sélection est envoyé après l'exécution de la sélection. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/selectitem/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/selectitem/index.html" new file mode 100644 index 0000000000..2131fd8738 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/selectitem/index.html" @@ -0,0 +1,14 @@ +--- +title: selectItem +slug: Archive/Mozilla/XUL/Méthodes/selectItem +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/selectItem +--- +
« Accueil de la référence XUL
+
selectItem( item ) +
Type de retour : aucune valeur renvoyée +
Désélectionne tous les éléments actuellement sélectionnés, puis sélectionne l'élément donné en argument. Un évènement de sélection est envoyé après l'exécution de la sélection. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/selectitemrange/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/selectitemrange/index.html" new file mode 100644 index 0000000000..36913d700c --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/selectitemrange/index.html" @@ -0,0 +1,14 @@ +--- +title: selectItemRange +slug: Archive/Mozilla/XUL/Méthodes/selectItemRange +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/selectItemRange +--- +
« Accueil de la référence XUL
+
selectItemRange( startItem, endItem) +
Type de retour : aucune valeur renvoyée +
Sélectionne tous les éléments compris entre les deux éléments donnés en paramètre, y compris les éléments de début et de fin. Tous les autres éléments sont désélectionnés. Cette méthode n'a aucun effet sur les listes en mono-sélection. Un évènement de sélection est envoyé après l'exécution de la sélection. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/setselectionrange/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/setselectionrange/index.html" new file mode 100644 index 0000000000..6a527b231f --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/setselectionrange/index.html" @@ -0,0 +1,18 @@ +--- +title: setSelectionRange +slug: Archive/Mozilla/XUL/Méthodes/setSelectionRange +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/setSelectionRange +--- +

« Accueil de la référence XUL +

+
setSelectionRange( début, fin ) +
Type retourné : aucune valeur retournée +
Cette méthode sélectionne une portion de texte dans une zone de texte (textbox ou textarea) où l'argument début est le premier caractère de la sélection et l'argument fin le dernier caractère de la sélection.
Renseigner les deux arguments avec la même valeur équivaut à déplacer le curseur d'écriture sans rien sélectionner. +
+


+Interwiki Language Links +

+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/showpane/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/showpane/index.html" new file mode 100644 index 0000000000..fdb76134d5 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/showpane/index.html" @@ -0,0 +1,16 @@ +--- +title: showPane +slug: Archive/Mozilla/XUL/Méthodes/showPane +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/showPane +--- +
« Accueil de la référence XUL
+
showPane( <i>prefpane</i> ) +
Type retourné : aucune valeur retournée +
Bascule vers un panneau en particulier. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/showpopup/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/showpopup/index.html" new file mode 100644 index 0000000000..f320227bdb --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/showpopup/index.html" @@ -0,0 +1,20 @@ +--- +title: showPopup +slug: Archive/Mozilla/XUL/Méthodes/showPopup +tags: + - Méthodes_XUL + - NeedsRewrite + - NeedsTechnicalReview +translation_of: Archive/Mozilla/XUL/Method/showPopup +--- +
« Accueil de la référence XUL
+
showPopup( element, x, y, popupType, anchor, align ) Déprécié dans Mozilla 1.9 +
Type de retour : aucune valeur de retour +
Ouvre un élément popup. Deux moyens de spécifier l'emplacement où s'affichera la fenêtre popup existent, soit en spécifiant une position spécifique de l'écran, soit par rapport à un autre élément de la fenêtre. Si x ou y sont définies par une valeur, le popup apparaîtra aux coordonnées (x,y) de l'écran. Si x et y sont définies à -1, le popup sera positionné par rapport à l'element spécifié dans le premier paramètre. C'est cette dernière méthode qu'il faut utiliser, par exemple, pour afficher un popup sous un bouton. Dans ce cas, les paramètres anchor et align peuvent être utilisés pour contrôler plus avant l'endroit où apparaîtra le popup par rapport à l'élément. Le paramètre anchor correspond à l'attribut popupanchor de l'élément et le paramètre align correspond à l'attribut popupalign. Les paramètres anchor et align sont ignorés si ni x ni y ne valent -1. +
+
Pour qu'un popup apparaisse à une position relative à un autre élément tout en étant décalé de quelques pixels, déterminez la position réelle de l'élément à l'aide de ses propriétés boxObject.screenX et boxObject.screenY, et utilisez celles-ci comme paramètres x et y en y ajoutant les décalages souhaités. +
+
Le paramètre popupType doit être une des chaînes popup, context ou tooltip. Chaque type de popup est destiné à être affiché temporairement ; ils ne sont pas censés être affichés de façon permanente. On ne peut afficher qu'un popup à la fois. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/sizeto/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/sizeto/index.html" new file mode 100644 index 0000000000..162f0dab6a --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/sizeto/index.html" @@ -0,0 +1,14 @@ +--- +title: sizeTo +slug: Archive/Mozilla/XUL/Méthodes/sizeTo +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/sizeTo +--- +
« Accueil de la référence XUL
+
sizeTo( <i>largeur</i>, <i>hauteur</i> ) +
Type de retour : aucune valeur de retour +
Modifie la taille actuelle de la fenêtre popup avec les nouvelles dimensions largeur et hauteur. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/stop/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/stop/index.html" new file mode 100644 index 0000000000..673344cdcf --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/stop/index.html" @@ -0,0 +1,19 @@ +--- +title: stop +slug: Archive/Mozilla/XUL/Méthodes/stop +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/stop +--- +
+

« Accueil de la référence XUL +

+
+
stop() +
Type retourné : aucune valeur retournée +
Équivalent au clic sur le bouton Stop, cette méthode arrête le chargement en cours du document. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/syncsessions/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/syncsessions/index.html" new file mode 100644 index 0000000000..de76541536 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/syncsessions/index.html" @@ -0,0 +1,19 @@ +--- +title: syncSessions +slug: Archive/Mozilla/XUL/Méthodes/syncSessions +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/syncSessions +--- +
+

« Accueil de la référence XUL +

+
+
syncSessions( autoCompleteElement ) +
Type retourné : ??? +
Copie les sessions depuis un autre élément autocomplété. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/timedselect/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/timedselect/index.html" new file mode 100644 index 0000000000..2a30e67317 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/timedselect/index.html" @@ -0,0 +1,14 @@ +--- +title: timedSelect +slug: Archive/Mozilla/XUL/Méthodes/timedSelect +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/timedSelect +--- +
« Accueil de la référence XUL
+
timedSelect( item, timeout ) +
Type de retour : aucune valeur renvoyée +
Sélectionne un élément spécifié par l'argument item après un nombre de millisecondes définit par l'argument timeout. Tous les autres éléments sont désélectionnés. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/m\303\251thodes/toggleitemselection/index.html" "b/files/fr/archive/mozilla/xul/m\303\251thodes/toggleitemselection/index.html" new file mode 100644 index 0000000000..d6dac62e00 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/m\303\251thodes/toggleitemselection/index.html" @@ -0,0 +1,14 @@ +--- +title: toggleItemSelection +slug: Archive/Mozilla/XUL/Méthodes/toggleItemSelection +tags: + - Méthodes_XUL +translation_of: Archive/Mozilla/XUL/Method/toggleItemSelection +--- +
« Accueil de la référence XUL
+
toggleItemSelection( item ) +
Type de retour : aucune valeur renvoyée +
Modifie l'état de sélection de l'élément spécifié. S'il est sélectionné, il devient désélectionné. S'il est désélectionné, il devient sélectionné. Les autres éléments de la liste ne sont pas affectés et ils conservent leur état de sélection. +
+
+
diff --git a/files/fr/archive/mozilla/xul/panel/index.html b/files/fr/archive/mozilla/xul/panel/index.html new file mode 100644 index 0000000000..64daec52df --- /dev/null +++ b/files/fr/archive/mozilla/xul/panel/index.html @@ -0,0 +1,222 @@ +--- +title: panel +slug: Archive/Mozilla/XUL/panel +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/panel +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un panel est une fenêtre popup pouvant contenir n'importe quel type de contenu. Il n'a aucune décoration de fenêtre. Lorsqu'il est ouvert, il flotte par dessus la fenêtre et peut déborder même de la fenêtre principale. Typiquement, il sera attaché à un élément à l'aide de l'attribut popup afin d'apparaitre lorsque l'on clique avec le bouton de gauche de la souris sur l'élément. Un panel peut également être ouvert via un script à l'aide de la méthode openPopup. +

Le panel sera fermé lorsque l'utilisateur cliquera en dehors de celui-ci ou que sa méthode hidePopup sera appelée. +

+
Attributs +
left, noautofocus, onpopuphidden, onpopuphiding, onpopupshowing, onpopupshown, position, top +
+
Propriétés +
accessible, popupBoxObject, popup, state +
+
Méthodes +
hidePopup, moveTo, openPopup, openPopupAtScreen, sizeTo +
+

Exemples

+

L'exemple qui suit montre comment un panel peut être attaché à un label. +

+
<panel id="thepanel">
+  <hbox align="start">
+    <image src="warning.png"/>
+    <vbox>
+      <description value="Vous avez 6 nouveaux messages."/>
+      <hbox>
+        <button label="Lire le courrier"/>
+        <button label="Nouveau message"/>
+      </hbox>
+    </vbox>
+  </hbox>
+</panel>
+<description value="6 nouveaux messages" popup="thepanel"/>
+
+

Attributs

+

+

+ +
left +
Type : entier +
Remplace la position horizontale du popup spécifiée par la méthode showPopup. +
+


+

+ + +
+
+ +
noautofocus +
Type : booléen +
Si mis à false, la valeur par défaut, l'élément ayant actuellement le focus le perdra si le popup est ouvert ou fermé. Si mis à true, le focus ne sera pas modifié. +
+


+

+ + +
+
+ +
onpopuphidden +
Type : code de script +
Cet évènement est envoyé à un popup après qu'il a été caché. http://www.langue-fr.net/index/A/apres-que.htm +
+ + +
+
+ +
onpopuphiding +
Type : code de script +
Cet évènement est envoyé à un popup lorsqu'il est sur le point d'être masqué. +
+ + +
+
+ +
onpopupshowing +
Type : code de script +
Cet évènement est envoyé à un popup juste avant son ouverture. On l'utilise généralement pour définir dynamiquement le contenu lorsque l'utilisateur demande son affichage. Si ce gestionnaire d'évènement renvoie false, le popup ne s'affichera pas. +
+ + +
+
+ +
onpopupshown +
Type : code de script +
Cet évènement est envoyé à un popup après son ouverture, de la même manière qu'un évènement onload est envoyé à une fenêtre à son ouverture. +
+ + +
+
+ +
position +
Type : une des valeurs ci-dessous +
L'attribut position détermine où le popup apparaît par rapport à l'élément sur lequel l'utilisateur a cliqué pour l'invoquer. C'est ce qui permet de placer le popup sur le bord d'un bouton. +
+ + + +
+
+ +
top +
Type : entier +
Remplace la position verticale du popup spécifiée par la méthode showPopup. +
+


+

+ + +
+ +

Propriétés

+

+

+
accessible +
Type : nsIAccessible +
Renvoie l'objet d'accessibilité pour l'élément. +
+


+

+ +
+
+
popupBoxObject +
Type : nsIPopupBoxObject +
Cette propriété en lecture seule conserve le nsIPopupBoxObject qui implémente le popup. Il n'est normalement pas nécessaire d'utiliser cette propriété étant donné que toutes ses fonctions sont disponibles via le popup lui-même. +
+ +
+
+
position +
Type : chaîne +
Obtient et définit la valeur de l'attribut position. +
+ +
+
+
state +
Type : chaîne +
Cette propriété en lecture seule indique si le popup est ouvert ou non. Quatre valeurs sont possibles : +
+ + +
+ +

Méthodes

+ + + + + + +
+

Héritées de XUL element
+ blur, click, doCommand, focus, getElementsByAttribute getElementsByAttributeNS

Héritées de DOM element
+ addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()

+ +
+
hidePopup()
+
Type de retour : pas de valeur de retour +
Ferme le popup immédiatement. +
+
moveTo( x, y ) +
Type de retour : pas de valeur de retour +
Déplace le popup vers un nouvel emplacement. +
+
openPopup( anchor , position , x , y , isContextMenu, attributesOverride ) +
Type de retour : pas de valeur de retour +
+

Ouvre le popup relativement à un nœud spécifié à un emplacement spécifique. +

Le popup peut soit être ancré à un autre nœud ou ouvert librement. Pour ancrer un popup à un nœud, fournissez un nœud d'accrochage dans le paramètre anchor et définissez la position par une chaîne indiquant la manière dont le popup doit être ancré. +

Les valeurs possibles pour le paramètre position sont : before_start, before_end, after_start, after_end, start_before, start_after, end_before, end_after, overlap, after_pointer +

Le nœud d'accrochage ne doit pas nécessairement être dans le même document que le popup. +

Si le paramètre attributesOverride vaut true, l'attribut position sur le nœud popup a priorité sur la valeur du paramètre position. Si attributesOverride vaut false, l'attribut n'est utilisé que si le paramètre position est vide. +

Pour un popup ancré, les paramètres x et y peuvent être utilisés pour décaler le popup de sa position d'ancrage de quelques pixels (mesurés en pixels CSS). +

Les popups non ancrés peuvent être créés en fournissant null comme paramètre anchor. Un popup non ancré apparait à la position spécifiée par x et y relativement à la zone visible (viewport) du document contenant le nœud popup. Dans ce cas, les paramètres position et attributesOverride sont ignorés. +

+
openPopupAtScreen( x, y, isContextMenu ) +
Type de retour : pas de valeur de retour +
+

Ouvre le popup à une position spécifique sur l'écran spécifiée par x et y. Cette position peut être ajustée s'il s'avère qu'elle provoquerait l'apparition du popup en dehors de l'écran. Les coordonnées x et y sont mesurées en pixels CSS. +

+
sizeTo( <i>largeur</i>, <i>hauteur</i> ) +
Type de retour : aucune valeur de retour +
Modifie la taille actuelle de la fenêtre popup avec les nouvelles dimensions largeur et hauteur. +
+ +

Sujets liés

+
Interfaces +
nsIAccessibleProvider, nsIDOMXULPopupElement +
+
+
diff --git a/files/fr/archive/mozilla/xul/popup/index.html b/files/fr/archive/mozilla/xul/popup/index.html new file mode 100644 index 0000000000..4ee85f8e85 --- /dev/null +++ b/files/fr/archive/mozilla/xul/popup/index.html @@ -0,0 +1,19 @@ +--- +title: popup +slug: Archive/Mozilla/XUL/popup +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/popup +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

L'élément popup est équivalent à l'élément menupopup qu'il vaut mieux utiliser. Consultez la documentation sur l'élément menupopup pour plus d'informations. +


+

+
+
diff --git a/files/fr/archive/mozilla/xul/preference/index.html b/files/fr/archive/mozilla/xul/preference/index.html new file mode 100644 index 0000000000..ba56b6bb08 --- /dev/null +++ b/files/fr/archive/mozilla/xul/preference/index.html @@ -0,0 +1,219 @@ +--- +title: preference +slug: Archive/Mozilla/XUL/preference +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/preference +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Déclare une préférence qui peut être ajustée dans un prefpane. Cet élément doit être placé à l'intérieur d'un élément preferences. Chaque élément preference correspond à une préférence qui est stockée dans le fichier de préférences de l'utilisateur. Il est possible de connecter un élément d'interface utilisateur comme une case à cocher à un élément de préférence à l'aide de l'attribut preference de l'élément d'interface utilisateur. +

Pour plus d'informations, consultez l'article Système de préférences. +

+
Attributs +
disabled, instantApply, inverted, name, onchange, readonly, tabindex, type +
+
Propriétés +
disabled, inverted, locked, name, preferences, readonly, tabIndex, type, value +
+
Méthodes +
hasUserValue, reset +
+

Exemples

+

(exemple nécessaire) +

+

Attributs

+

+

+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
instantApply +
Type : booléen +
Si sa valeur est true, la préférence sera modifiée dès que l'élément d'interface utilisateur est modifié. +
+


+

+ + +
+
+ +
inverted +
Type : booléen +
Pour les préférences booléennes, l'indication de cet attribut à true indique que la valeur de la préférence est l'inverse de celle de l'élément d'interface utilisateur qui y est attaché. Par exemple, elle fait en sorte que cocher une case désactive la préférence associée au lieu de l'activer. +
+


+

+ + +
+
+ +
name +
Type : chaîne de caractères +
Le nom de la préférence à modifier. Par exemple, la page d'accueil du navigateur est définie par la préférence browser.startup.homepage. +
+ + +
+
+ +
onchange +
Type : code de script +
Le code figurant dans l'attribut onchange est appelé lorsque la valeur de l'élément est modifiée. +
+


+

+ + +
+
+ +
readonly +
Type : booléen +
Si défini à true, l'utilisateur ne peut pas modifier la valeur de l'élément. Cependant, celle-ci peut toujours être modifiée par un script. +
+ + +
+
+ +
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+ + +
+
+ +
type
Type : une des valeurs ci-dessous
Le type de préférence qui doit être une des valeurs suivantes.
+
+ + + +
+ +

Propriétés

+

+

+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
inverted +
Type : booléen +
Obtient et définit la valeur de l'attribut inverted. +
+


+

+ +
+
+
locked +
Type : booléen +
Si définie à true, la préférence a été verrouillée et désactivée dans la configuration système, ce qui empêche de changer sa valeur. Cette propriété est en lecture seule. +
+


+

+ +
+
+
name +
Type : chaîne de caractères +
Le nom de la préférence (élément preference) à modifier. Par exemple, la page d'accueil du navigateur est définie par la préférence browser.startup.homepage. +
+


+

+ +
+
+
preferences +
Type : élément +
Référence à l'élément preferences conteneur. +
+


+

+ +
+
+
+
+ readonly
+
+ Type : booléen
+
+ Si définie à true, l'utilisateur ne peut pas modifier la valeur de l'élément.
+
+
+ Cette propriété toute en minuscules n'est utilisée qu'avec l'élément preference et sera peut-être renommée en readOnly dans des versions ultérieures. D'autres éléments utilisent la propriété readOnly. L'attribut correspondant est cependant readonly en minuscules.
+
+
+
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+ +
+
+
type +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut type. +
+ +
+
+
value +
Type : chaîne +
Obtient et définit la valeur de l'attribut value. +
+ +
+ +

Méthodes

+
hasUserValue() +
Type de retour : booléen +
Renvoie true si la préférence a été modifiée par rapport à sa valeur par défaut. +
+


+

+
reset() +
Type de retour : aucune valeur renvoyée +
Réinitialise la préférence à sa valeur par défaut. +
Pour un élément textbox, la liste de transactions d'annulation est également vidée (Gecko 1.9). +
+


+

+ + +

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+

À faire +

+
+
+ diff --git a/files/fr/archive/mozilla/xul/preferences/index.html b/files/fr/archive/mozilla/xul/preferences/index.html new file mode 100644 index 0000000000..ac1884d0eb --- /dev/null +++ b/files/fr/archive/mozilla/xul/preferences/index.html @@ -0,0 +1,95 @@ +--- +title: preferences +slug: Archive/Mozilla/XUL/preferences +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/preferences +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Utilisé pour regrouper un ensemble d'éléments preference. +

Pour plus d'informations, consultez l'article Système de préférences. +

+

Exemples

+

(example needed) +

+

Attributs

+ + + + + + +

Hérités de 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

+
+ +

Propriétés

+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+

À faire +

+
+
diff --git a/files/fr/archive/mozilla/xul/prefpane/index.html b/files/fr/archive/mozilla/xul/prefpane/index.html new file mode 100644 index 0000000000..eb01688a7a --- /dev/null +++ b/files/fr/archive/mozilla/xul/prefpane/index.html @@ -0,0 +1,135 @@ +--- +title: prefpane +slug: Archive/Mozilla/XUL/prefpane +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/prefpane +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un seul panneau de préférences dans une prefwindow. Un prefpane est constitué de deux parties, les descriptions de préférences qui spécifient l'ensemble des préférences à modifier, et l'interface utilisateur permettant d'ajuster ces préférences. La première est spécifiée à l'aide d'un élément preferences tandis que la seconde peut être spécifiée avec d'autres éléments XUL. +

Chacune de ces parties peut être spécifiée directement comme enfant de l'élément prefpane, ou l'attribut src peut être utilisé pour placer un panneau dans un fichier séparé. Dans ce dernier cas, le fichier séparé doit utiliser une balise overlay comme racine, étant donné qu'il sera chargé comme overlay de la fenêtre de préférences principale. +

Pour plus d'informations, consultez l'article Système de préférences. +

+
Attributs +
helpURI, image, label, onpaneload, selected, src +
+
Propriétés +
image, label, preferenceElements, preferences, selected, src +
+
Méthodes +
preferenceForElement
+

Exemples

+

(exemple nécessaire) +

+

Attributs

+

+

+ +
+
+ helpURI
+
+ Type : URI
+
+ L'URI de la page d'aide associée avec un panneau de préférences. Celle-ci sera ouverte dans une fenêtre d'aide lors de l'appui sur le bouton d'aide.
+
+
+
+ +
image +
Type : URL d'une image +
L'URL de l'image devant apparaître sur l'élément. Si cet attribut est vide ou omis, aucune image n'apparaîtra. La position de l'image est déterminée par les attributs dir et orient. +
+ + +
+
+ +
label +
Type : chaîne de caractères +
Le label qui apparaîtra sur l'élément. S'il n'est pas spécifié, aucun texte n'apparaîtra. +
+ + +
+
+ +
+
+ onpaneload
+
+ Type : code de script
+
+ Le code défini ici est appelé après le chargement du panneau, de manière similaire à l'évènement load pour une fenêtre.
+
+
+
+ +
+
+ selected
+
+ Type : booléen
+
+ Cet attribut sera défini à true pour l'élément prefpane actuellement sélectionné. Pour changer le panneau sélectionné, utilisez la méthode showPane de prefwindow.
+
+ +
+
+ +
+
+ src
+
+ Type : URL d'un overlay
+
+ L'URL du contenu du panneau de préférences. Si cet attribut n'est pas spécifié, le contenu de l'élément prefpane sera utilisé.
+
+ + +
+ +

Propriétés

+

+

+
image +
Type : URL d'image +
Obtient et définit la valeur de l'attribut image. +
+ +
+
+
label +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut label. +
+ +
+
+
+
+ +
+
selected
+
Type : booléen
+
La valeur de cette propriété est true si cet élément est sélectionné, ou false s'il ne l'est pas. Cette propriété est en lecture seule.
+
+
+ +

Méthodes

+

+ +

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+

À faire +

+
+
diff --git a/files/fr/archive/mozilla/xul/prefwindow/index.html b/files/fr/archive/mozilla/xul/prefwindow/index.html new file mode 100644 index 0000000000..970f7c07a7 --- /dev/null +++ b/files/fr/archive/mozilla/xul/prefwindow/index.html @@ -0,0 +1,144 @@ +--- +title: prefwindow +slug: Archive/Mozilla/XUL/prefwindow +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/prefwindow +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Une fenêtre spécialisée utilisée pour les dialogues de préférences. Cet élément devrait être utilisé à la place de la balise window et contenir un ou plusieurs éléments prefpane. Une rangée de boutons apparait dans tout le dialogue de préférences, un par prefpane. Chaque panneau servira généralement à regrouper un ensemble de préférences liées. Si il n'y a qu'un prefpane, la zone de navigation n'apparaitra pas. +

Sur les plateformes où la convention est d'appliquer les changements immédiatement, les préférences sont ajustées dès que l'élément d'interface utilisateur a changé. Sur les autres plateformes, les préférences ne sont pas appliquées tant que le dialogue n'est pas fermé. +

Il est possible d'ouvrir une fenêtre de préférences à l'aide de la méthode openDialog d'une fenêtre comme pour d'autres dialogues. L'id d'un panneau particulier peut être passé comme quatrième paramètre de openDialog pour ouvrir un panneau particulier par défaut. Il est également possible de définir l'attribut lastSelected sur la balise prefwindow en lui donnant l'id du panneau avec lequel démarrer. Cet attribut n'est normalement pas défini, comme il sera positionné automatiquement afin que le panneau par défaut soit le dernier que celui qui était affiché la dernière fois que le dialogue a été fermé. +

Pour plus d'informations, consultez l'article Système de préférences. +

+
Attributs +
buttonalign, buttondir, buttonorient, buttonpack, buttons, defaultButton, lastSelected, onbeforeaccept, ondialogaccept, ondialogcancel, ondialogdisclosure, ondialoghelp, onpanelload, title, type +
+
Propriétés +
buttons, currentPane, defaultButton, lastSelected, preferencePanes, type +
+
Méthodes +
acceptDialog, addPane, cancelDialog, centerWindowOnScreen, getButton, openSubDialog, openWindow, showPane +
+

Exemples

+
   <prefwindow xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+     <prefpane id="saveoptions" label="Backups">
+       <preferences>
+         <preference id="pref-backup" name="myapp.mybackups" type="bool"/>
+         <preference id="pref-backupduration" name="myapp.mybackups.duration" type="int"/>
+       </preferences>
+       <checkbox label="Automatically Save Backups" preference="pref-backup"/>
+       <textbox label="Duration:" preference="pref-backupduration"/>
+     </prefpane>
+   </prefwindow>
+
+

Attributs

+

+

+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
title +
Type : chaîne de caractères +
Le texte qui doit apparaître dans la barre de titre de la fenêtre ou boîte de dialogue. +
+


+

+ + +
+
+ +

 

+
+ +

Propriétés

+

+

+
+
+
+
+
+
type +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut type. +
+ +
+ +

Méthodes

+ + + + + + +
+

Héritées de XUL element
+ blur, click, doCommand, focus, getElementsByAttribute getElementsByAttributeNS

Héritées de DOM element
+ addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()

+ +
+ + + + + + + +
showPane( <i>prefpane</i> ) +
Type retourné : aucune valeur retournée +
Bascule vers un panneau en particulier. +
+


+

+ +

Sujets liés

+

À faire +

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/accessible/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/accessible/index.html" new file mode 100644 index 0000000000..8a78202c56 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/accessible/index.html" @@ -0,0 +1,16 @@ +--- +title: accessible +slug: Archive/Mozilla/XUL/Propriétés/accessible +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/accessible +--- +
« Accueil de la référence XUL
+
accessible +
Type : nsIAccessible +
Renvoie l'objet d'accessibilité pour l'élément. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/accessibletype/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/accessibletype/index.html" new file mode 100644 index 0000000000..5a9527e78d --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/accessibletype/index.html" @@ -0,0 +1,58 @@ +--- +title: accessibleType +slug: Archive/Mozilla/XUL/Propriétés/accessibleType +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/accessibleType +--- +
« Accueil de la référence XUL
+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+

Les valeurs possibles sont : +

+ +
ConstanteValeur +
XULAlert1001 +
XULButton1002 +
XULCheckbox1003 +
XULColorPicker1004 +
XULColorPickerTile1005 +
XULCombobox1006 +
XULDropmarker1007 +
XULGroupbox1008 +
XULImage1009 +
XULLink100A +
XULListbox100B +
XULListCell1026 +
XULListHead1024 +
XULListHeader1025 +
XULListitem100C +
XULMenubar100D +
XULMenuitem100E +
XULMenupopup100F +
XULMenuSeparator1010 +
XULPane1011 +
XULProgressMeter1012 +
XULScale1013 +
XULStatusBar1014 +
XULRadioButton1015 +
XULRadioGroup1016 +
XULTab1017 +
XULTabBox1018 +
XULTabs1019 +
XULText101A +
XULTextBox101B +
XULThumb101C +
XULTree101D +
XULTreeColumns101E +
XULTreeColumnItem101F +
XULToolbar1020 +
XULToolbarSeparator1021 +
XULTooltip1022 +
XULToolbarButton1023 +
+

</div> +

diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/accesskey/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/accesskey/index.html" new file mode 100644 index 0000000000..18c8cb6110 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/accesskey/index.html" @@ -0,0 +1,16 @@ +--- +title: accessKey +slug: Archive/Mozilla/XUL/Propriétés/accessKey +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/accessKey +--- +
« Accueil de la référence XUL
+
accessKey +
Type : caractère +
Obtient et définit la valeur de l'attribut accesskey. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/align/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/align/index.html" new file mode 100644 index 0000000000..ade556771a --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/align/index.html" @@ -0,0 +1,14 @@ +--- +title: align +slug: Archive/Mozilla/XUL/Propriétés/align +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/align +--- +
« Accueil de la référence XUL
+
align +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut align. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/allowevents/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/allowevents/index.html" new file mode 100644 index 0000000000..3a89398e48 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/allowevents/index.html" @@ -0,0 +1,16 @@ +--- +title: allowEvents +slug: Archive/Mozilla/XUL/Propriétés/allowEvents +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/allowEvents +--- +
« Accueil de la référence XUL
+
allowEvents +
Type : booléen +
Obtient et définit la valeur de l'attribut allowevents. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/amindicator/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/amindicator/index.html" new file mode 100644 index 0000000000..3118629abd --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/amindicator/index.html" @@ -0,0 +1,16 @@ +--- +title: amIndicator +slug: Archive/Mozilla/XUL/Propriétés/amIndicator +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/amIndicator +--- +
« Accueil de la référence XUL
+
amIndicator +
Type : chaîne +
La valeur chaîne affichée pour les heures entre minuit et midi, par défaut « AM ». Cette valeur est déterminée selon la locale de l'utilisateur. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/boxobject/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/boxobject/index.html" new file mode 100644 index 0000000000..68284b25f9 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/boxobject/index.html" @@ -0,0 +1,16 @@ +--- +title: boxObject +slug: Archive/Mozilla/XUL/Propriétés/boxObject +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/boxObject +--- +
« Accueil de la référence XUL
+
boxObject +
Type : nsIBoxObject +
Cette propriété est disponible pour les éléments dérivés de boîtes, ce qui est le cas de la plupart des éléments XUL visibles. L'objet boxObject pour les éléments non-XUL peut être obtenu à l'aide de la méthode getBoxObjectFor. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/builder/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/builder/index.html" new file mode 100644 index 0000000000..78acdbec0d --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/builder/index.html" @@ -0,0 +1,16 @@ +--- +title: builder +slug: Archive/Mozilla/XUL/Propriétés/builder +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/builder +--- +
« Accueil de la référence XUL
+
builder +
Type : nsIXULTemplateBuilder +
Pour le contenu généré depuis un template, il s'agit de l'objet XPCOM responsable de la génération du contenu. Pour les scripts il est uniquement nécessaire dans le cas où vous voulez forcer le contenu du template à être régénéré. Vous pouvez en avoir besoin si vous avez ajusté les règles manuellement. Pour reconstruire le contenu, appelez la méthode rebuild du builder. +
+
Par exemple, à partir d'une référence à un arbre myTree, ce code reconstruira son contenu : myTree.builder.rebuild(); +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/classname/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/classname/index.html" new file mode 100644 index 0000000000..af031bec76 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/classname/index.html" @@ -0,0 +1,14 @@ +--- +title: className +slug: Archive/Mozilla/XUL/Propriétés/className +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/className +--- +
« Accueil de la référence XUL
+
className +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut class. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/collapsed/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/collapsed/index.html" new file mode 100644 index 0000000000..95dd04a07a --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/collapsed/index.html" @@ -0,0 +1,14 @@ +--- +title: collapsed +slug: Archive/Mozilla/XUL/Propriétés/collapsed +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/collapsed +--- +
« Accueil de la référence XUL
+
collapsed +
Type : booléen +
Obtient et définit la valeur de l'attribut collapsed. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/contextmenu/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/contextmenu/index.html" new file mode 100644 index 0000000000..611425d9c8 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/contextmenu/index.html" @@ -0,0 +1,14 @@ +--- +title: contextMenu +slug: Archive/Mozilla/XUL/Propriétés/contextMenu +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/contextMenu +--- +
« Accueil de la référence XUL
+
contextMenu +
Type : id d'élément popup +
Obtient et définit la valeur de l'attribut contextmenu. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/controllers/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/controllers/index.html" new file mode 100644 index 0000000000..28ca9b2f5e --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/controllers/index.html" @@ -0,0 +1,14 @@ +--- +title: controllers +slug: Archive/Mozilla/XUL/Propriétés/controllers +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/controllers +--- +
« Accueil de la référence XUL
+
controllers +
Type : nsIControllers +
Une liste de contrôleurs attachés à l'élément. Les contrôleurs servent à répondre à des commandes. Le répartiteur de commandes du document identifiera les contrôleurs pour gérer une commande à l'aide de la liste de l'élément ayant le focus. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/crop/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/crop/index.html" new file mode 100644 index 0000000000..01aa418b56 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/crop/index.html" @@ -0,0 +1,14 @@ +--- +title: crop +slug: Archive/Mozilla/XUL/Propriétés/crop +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/crop +--- +
« Accueil de la référence XUL
+
crop +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut crop. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/currentitem/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/currentitem/index.html" new file mode 100644 index 0000000000..66ca8b4596 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/currentitem/index.html" @@ -0,0 +1,14 @@ +--- +title: currentItem +slug: Archive/Mozilla/XUL/Propriétés/currentItem +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/currentItem +--- +
« Accueil de la référence XUL
+
currentItem +
Type : élément listitem +
Renvoie le dernier élément sélectionné dans la liste de sélection, ce qui n'est utile que dans une liste à sélection multiple. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/database/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/database/index.html" new file mode 100644 index 0000000000..a8ef04ee8b --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/database/index.html" @@ -0,0 +1,14 @@ +--- +title: database +slug: Archive/Mozilla/XUL/Propriétés/database +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/database +--- +
« Accueil de la référence XUL
+
database +
Type : nsIRDFCompositeDataSource +
Renvoie la source de données composite créée lorsque toutes les sources de données de l'élément sont combinées. Défini à null pour les éléments qui n'ont pas d'attribut datasources. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/datasources/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/datasources/index.html" new file mode 100644 index 0000000000..567dd397fe --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/datasources/index.html" @@ -0,0 +1,14 @@ +--- +title: datasources +slug: Archive/Mozilla/XUL/Propriétés/datasources +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/datasources +--- +
« Accueil de la référence XUL
+
datasources +
Type : liste d'URIs de sources de données séparée par des espaces +
Lit et définit la valeur de l'attribut datasources. Dans les nouvelles versions de Mozilla (>1.7), les sources de données seront rechargées et le gabarit reconstruit. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/date/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/date/index.html" new file mode 100644 index 0000000000..b82437977f --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/date/index.html" @@ -0,0 +1,17 @@ +--- +title: date +slug: Archive/Mozilla/XUL/Propriétés/date +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/date +--- +
+ « Accueil de la référence XUL
+
+
+ date
+
+ Type : entier
+
+ Le jour du mois actuellement sélectionné, entre 1 et 31. Modifiez cette propriété pour changer la date sélectionnée.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/dateleadingzero/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/dateleadingzero/index.html" new file mode 100644 index 0000000000..2de143aeaa --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/dateleadingzero/index.html" @@ -0,0 +1,17 @@ +--- +title: dateLeadingZero +slug: Archive/Mozilla/XUL/Propriétés/dateLeadingZero +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/dateLeadingZero +--- +
+ « Accueil de la référence XUL
+
+
+ dateLeadingZero
+
+ Type : booléen
+
+ Une valeur en lecture seule indiquant si un zéro doit être affiché avant la date lorsqu'elle est inférieure à 10.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/datepicker.open/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/datepicker.open/index.html" new file mode 100644 index 0000000000..bd302b35f1 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/datepicker.open/index.html" @@ -0,0 +1,17 @@ +--- +title: datepicker.open +slug: Archive/Mozilla/XUL/Propriétés/datepicker.open +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/datepicker.open +--- +
+ « Accueil de la référence XUL
+
+
+ open
+
+ Type : booléen
+
+ Pour les sélecteurs de date de type popup, spécifie si celui-ci est ouvert. Définissez cette propriété pour ouvrir ou fermer le popup. Pour les autres types de sélecteurs de date, cette propriété est toujours à false.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/datepicker.value/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/datepicker.value/index.html" new file mode 100644 index 0000000000..0342ffd158 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/datepicker.value/index.html" @@ -0,0 +1,17 @@ +--- +title: datepicker.value +slug: Archive/Mozilla/XUL/Propriétés/datepicker.value +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/datepicker.value +--- +
+ « Accueil de la référence XUL
+
+
+ value
+
+ Type : chaîne
+
+ La date actuellement sélectionnée au format AAAA/MM/JJ. Contrairement à la propriété month, les mois varient ici dans l'intervalle 01 à 12. Définissez cette propriété pour changer la date sélectionnée.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/datevalue/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/datevalue/index.html" new file mode 100644 index 0000000000..4872d60184 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/datevalue/index.html" @@ -0,0 +1,17 @@ +--- +title: dateValue +slug: Archive/Mozilla/XUL/Propriétés/dateValue +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/dateValue +--- +
+ « Accueil de la référence XUL
+
+
+ dateValue
+
+ Type : Date
+
+ La date actuellement entrée ou sélectionnée dans le sélecteur de date sous la forme d'un objet Date.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/defaultvalue/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/defaultvalue/index.html" new file mode 100644 index 0000000000..cd6be12cb3 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/defaultvalue/index.html" @@ -0,0 +1,16 @@ +--- +title: defaultValue +slug: Archive/Mozilla/XUL/Propriétés/defaultValue +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/defaultValue +--- +
« Accueil de la référence XUL
+
defaultValue +
Type : chaîne de caractères +
Définit et obtient la valeur par défaut d'une boîte de texte. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/dir/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/dir/index.html" new file mode 100644 index 0000000000..440727c354 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/dir/index.html" @@ -0,0 +1,14 @@ +--- +title: dir +slug: Archive/Mozilla/XUL/Propriétés/dir +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/dir +--- +
« Accueil de la référence XUL
+
dir +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut dir. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/disabled/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/disabled/index.html" new file mode 100644 index 0000000000..03a25bf5ba --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/disabled/index.html" @@ -0,0 +1,14 @@ +--- +title: disabled +slug: Archive/Mozilla/XUL/Propriétés/disabled +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/disabled +--- +
« Accueil de la référence XUL
+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/flex/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/flex/index.html" new file mode 100644 index 0000000000..5514de566a --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/flex/index.html" @@ -0,0 +1,16 @@ +--- +title: flex +slug: Archive/Mozilla/XUL/Propriétés/flex +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/flex +--- +
« Accueil de la référence XUL
+
flex +
Type : entier +
Obtient et définit la valeur de l'attribut flex. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/height/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/height/index.html" new file mode 100644 index 0000000000..db9a532281 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/height/index.html" @@ -0,0 +1,14 @@ +--- +title: height +slug: Archive/Mozilla/XUL/Propriétés/height +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/height +--- +
« Accueil de la référence XUL
+
height +
Type : entier +
Obtient et définit la valeur de l'attribut height. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/hidden/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/hidden/index.html" new file mode 100644 index 0000000000..d05bc8715b --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/hidden/index.html" @@ -0,0 +1,14 @@ +--- +title: hidden +slug: Archive/Mozilla/XUL/Propriétés/hidden +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/hidden +--- +
« Accueil de la référence XUL
+
hidden +
Type : booléen +
Obtient et définit la valeur de l'attribut hidden. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/hideseconds/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/hideseconds/index.html" new file mode 100644 index 0000000000..f5711a3e24 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/hideseconds/index.html" @@ -0,0 +1,17 @@ +--- +title: hideSeconds +slug: Archive/Mozilla/XUL/Propriétés/hideSeconds +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/hideSeconds +--- +
+ « Accueil de la référence XUL
+
+
+ hideSeconds
+
+ Type : booléen
+
+ Indique si le champ des secondes doit être masqué.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/hour/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/hour/index.html" new file mode 100644 index 0000000000..0b8d5607d6 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/hour/index.html" @@ -0,0 +1,17 @@ +--- +title: hour +slug: Archive/Mozilla/XUL/Propriétés/hour +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/hour +--- +
+ « Accueil de la référence XUL
+
+
+ hour
+
+ Type : entier
+
+ La valeur de l'heure actuellement sélectionnée entre 0 et 23. Modifiez cette propriété pour changer l'heure sélectionnée.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/hourleadingzero/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/hourleadingzero/index.html" new file mode 100644 index 0000000000..88ac335836 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/hourleadingzero/index.html" @@ -0,0 +1,17 @@ +--- +title: hourLeadingZero +slug: Archive/Mozilla/XUL/Propriétés/hourLeadingZero +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/hourLeadingZero +--- +
+ « Accueil de la référence XUL
+
+
+ hourLeadingZero
+
+ Type : booléen
+
+ Une valeur en lecture seule indiquant si un zéro initial doit être affiché avant l'heure lorsque celle-ci est inférieure à 10.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/id/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/id/index.html" new file mode 100644 index 0000000000..d5e6613076 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/id/index.html" @@ -0,0 +1,16 @@ +--- +title: id +slug: Archive/Mozilla/XUL/Propriétés/id +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/id +--- +
« Accueil de la référence XUL
+
id +
Type : id d'élément, doit être unique dans la fenêtre +
Obtient et définit la valeur de l'attribut id. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/image/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/image/index.html" new file mode 100644 index 0000000000..b180fa1bff --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/image/index.html" @@ -0,0 +1,14 @@ +--- +title: image +slug: Archive/Mozilla/XUL/Propriétés/image +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/image +--- +
« Accueil de la référence XUL
+
image +
Type : URL d'image +
Obtient et définit la valeur de l'attribut image. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/increment/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/increment/index.html" new file mode 100644 index 0000000000..ee048522a2 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/increment/index.html" @@ -0,0 +1,17 @@ +--- +title: increment +slug: Archive/Mozilla/XUL/Propriétés/increment +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/increment +--- +
+ « Accueil de la référence XUL
+
+
+ increment
+
+ Type : entier
+
+ Obtient et définit la valeur de l'attribut increment.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/index.html" new file mode 100644 index 0000000000..046b0478cc --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/index.html" @@ -0,0 +1,224 @@ +--- +title: Propriétés +slug: Archive/Mozilla/XUL/Propriétés +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property +--- +

« Accueil de la référence XUL +

+ +

Propriétés de DOM element liées

+ diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/inverted/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/inverted/index.html" new file mode 100644 index 0000000000..658135805f --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/inverted/index.html" @@ -0,0 +1,16 @@ +--- +title: inverted +slug: Archive/Mozilla/XUL/Propriétés/inverted +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/inverted +--- +
« Accueil de la référence XUL
+
inverted +
Type : booléen +
Obtient et définit la valeur de l'attribut inverted. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/is24hourclock/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/is24hourclock/index.html" new file mode 100644 index 0000000000..74e27b6c04 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/is24hourclock/index.html" @@ -0,0 +1,17 @@ +--- +title: is24HourClock +slug: Archive/Mozilla/XUL/Propriétés/is24HourClock +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/is24HourClock +--- +
+ « Accueil de la référence XUL
+
+
+ is24HourClock
+
+ Type : booléen
+
+ Une valeur en lecture seule indiquant si l'heure est affichée à l'aide d'une horloge à 24 ou 12 heures. Avec une horloge à 12 heures, un champ supplémentaire permet à l'utilisateur de choisir entre AM et PM.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/ispm/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/ispm/index.html" new file mode 100644 index 0000000000..37be41eafc --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/ispm/index.html" @@ -0,0 +1,17 @@ +--- +title: isPM +slug: Archive/Mozilla/XUL/Propriétés/isPM +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/isPM +--- +
+ « Accueil de la référence XUL
+
+
+ isPM
+
+ Type : booléen
+
+ Si cette propriété est à false, l'heure est entre 0 et 11. Si elle est à true, l'heure est supérieure ou égale à 12.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/label/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/label/index.html" new file mode 100644 index 0000000000..c913db90bc --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/label/index.html" @@ -0,0 +1,14 @@ +--- +title: label +slug: Archive/Mozilla/XUL/Propriétés/label +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/label +--- +
« Accueil de la référence XUL
+
label +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut label. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/left/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/left/index.html" new file mode 100644 index 0000000000..eca1301f70 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/left/index.html" @@ -0,0 +1,16 @@ +--- +title: left +slug: Archive/Mozilla/XUL/Propriétés/left +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/left +--- +
« Accueil de la référence XUL
+
left +
Type : entier +
Obtient et définit la valeur de l'attribut left. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/listboxobject/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/listboxobject/index.html" new file mode 100644 index 0000000000..4d5b75170a --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/listboxobject/index.html" @@ -0,0 +1,14 @@ +--- +title: listBoxObject +slug: Archive/Mozilla/XUL/Propriétés/listBoxObject +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/listBoxObject +--- +
« Accueil de la référence XUL
+
listBoxObject +
Type : nsIListBoxObject +
L'objet nsIListBoxObject derrière la liste de sélection. Cette propriété est en lecture seule. La plupart des fonctionnalités de la liste de sélection sont déjà disponibles directement dans l'élément listbox, il sera donc rarement nécessaire d'utiliser cet objet de boîte directement. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/locked/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/locked/index.html" new file mode 100644 index 0000000000..5c097897c0 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/locked/index.html" @@ -0,0 +1,16 @@ +--- +title: locked +slug: Archive/Mozilla/XUL/Propriétés/locked +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/locked +--- +
« Accueil de la référence XUL
+
locked +
Type : booléen +
Si définie à true, la préférence a été verrouillée et désactivée dans la configuration système, ce qui empêche de changer sa valeur. Cette propriété est en lecture seule. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/max/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/max/index.html" new file mode 100644 index 0000000000..d8fd66793d --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/max/index.html" @@ -0,0 +1,16 @@ +--- +title: max +slug: Archive/Mozilla/XUL/Propriétés/max +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/max +--- +
« Accueil de la référence XUL
+
max +
Type : entier +
Obtient et définit la valeur de l'attribut max. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/maxheight/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/maxheight/index.html" new file mode 100644 index 0000000000..5a36481266 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/maxheight/index.html" @@ -0,0 +1,14 @@ +--- +title: maxHeight +slug: Archive/Mozilla/XUL/Propriétés/maxHeight +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/maxHeight +--- +
« Accueil de la référence XUL
+
maxHeight +
Type : entier +
Obtient et définit la valeur de l'attribut maxheight. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/maxwidth/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/maxwidth/index.html" new file mode 100644 index 0000000000..48d245dac9 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/maxwidth/index.html" @@ -0,0 +1,14 @@ +--- +title: maxWidth +slug: Archive/Mozilla/XUL/Propriétés/maxWidth +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/maxWidth +--- +
« Accueil de la référence XUL
+
maxWidth +
Type : entier +
Obtient et définit la valeur de l'attribut maxwidth. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/menu/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/menu/index.html" new file mode 100644 index 0000000000..a9dbbade7f --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/menu/index.html" @@ -0,0 +1,14 @@ +--- +title: menu +slug: Archive/Mozilla/XUL/Propriétés/menu +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/menu +--- +
« Accueil de la référence XUL
+
menu +
Type : id d'élément popup +
Obtient et définit la valeur de l'attribut menu. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/min/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/min/index.html" new file mode 100644 index 0000000000..cc96380d54 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/min/index.html" @@ -0,0 +1,16 @@ +--- +title: min +slug: Archive/Mozilla/XUL/Propriétés/min +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/min +--- +
« Accueil de la référence XUL
+
min +
Type : entier +
Obtient et définit la valeur de l'attribut min. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/minheight/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/minheight/index.html" new file mode 100644 index 0000000000..fc67f0823a --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/minheight/index.html" @@ -0,0 +1,16 @@ +--- +title: minHeight +slug: Archive/Mozilla/XUL/Propriétés/minHeight +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/minHeight +--- +
« Accueil de la référence XUL
+
minHeight +
Type : entier +
Obtient et définit la valeur de l'attribut minheight. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/minute/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/minute/index.html" new file mode 100644 index 0000000000..f9a70a888a --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/minute/index.html" @@ -0,0 +1,17 @@ +--- +title: minute +slug: Archive/Mozilla/XUL/Propriétés/minute +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/minute +--- +
+ « Accueil de la référence XUL
+
+
+ minute
+
+ Type : entier
+
+ Les minutes de l'heure actuellement sélectionnée entre 0 et 59. Modifiez cette propriété pour changer la minute sélectionnée.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/minuteleadingzero/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/minuteleadingzero/index.html" new file mode 100644 index 0000000000..47911a397d --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/minuteleadingzero/index.html" @@ -0,0 +1,17 @@ +--- +title: minuteLeadingZero +slug: Archive/Mozilla/XUL/Propriétés/minuteLeadingZero +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/minuteLeadingZero +--- +
+ « Accueil de la référence XUL
+
+
+ minuteLeadingZero
+
+ Type : booléen
+
+ Une valeur en lecture seule indiquant si un zéro initial doit être affiché avant la valeur des minutes lorsque celle-ci est inférieure à 10.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/minwidth/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/minwidth/index.html" new file mode 100644 index 0000000000..384dc60350 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/minwidth/index.html" @@ -0,0 +1,14 @@ +--- +title: minWidth +slug: Archive/Mozilla/XUL/Propriétés/minWidth +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/minWidth +--- +
« Accueil de la référence XUL
+
minWidth +
Type : integer +
Obtient et définit la valeur de l'attribut minwidth. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/month/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/month/index.html" new file mode 100644 index 0000000000..2bca180dc7 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/month/index.html" @@ -0,0 +1,17 @@ +--- +title: month +slug: Archive/Mozilla/XUL/Propriétés/month +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/month +--- +
+ « Accueil de la référence XUL
+
+
+ month
+
+ Type : entier
+
+ Le mois actuellement sélectionné entre 0 (janvier) et 11 (décembre). Définissez cette propriété pour changer le mois sélectionné.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/monthleadingzero/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/monthleadingzero/index.html" new file mode 100644 index 0000000000..942edc6094 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/monthleadingzero/index.html" @@ -0,0 +1,17 @@ +--- +title: monthLeadingZero +slug: Archive/Mozilla/XUL/Propriétés/monthLeadingZero +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/monthLeadingZero +--- +
+ « Accueil de la référence XUL
+
+
+ monthLeadingZero
+
+ Type : booléen
+
+ Une valeur en lecture seule indiquant si un zéro doit être affiché devant le mois s'il est inférieur à 10.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/name/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/name/index.html" new file mode 100644 index 0000000000..879ae4a5a0 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/name/index.html" @@ -0,0 +1,16 @@ +--- +title: name +slug: Archive/Mozilla/XUL/Propriétés/name +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/name +--- +
« Accueil de la référence XUL
+
name +
Type : chaîne de caractères +
Le nom de la préférence (élément preference) à modifier. Par exemple, la page d'accueil du navigateur est définie par la préférence browser.startup.homepage. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/observes/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/observes/index.html" new file mode 100644 index 0000000000..642fd59922 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/observes/index.html" @@ -0,0 +1,14 @@ +--- +title: observes +slug: Archive/Mozilla/XUL/Propriétés/observes +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/observes +--- +
« Accueil de la référence XUL
+
observes +
Type : id d'élément broadcaster +
Obtient et définit la valeur de l'attribut observes. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/open/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/open/index.html" new file mode 100644 index 0000000000..4d8deac2fb --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/open/index.html" @@ -0,0 +1,14 @@ +--- +title: open +slug: Archive/Mozilla/XUL/Propriétés/open +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/open +--- +
« Accueil de la référence XUL
+
open +
Type : booléen +
Obtient et définit la valeur de l'attribut open. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/ordinal/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/ordinal/index.html" new file mode 100644 index 0000000000..df77eb113a --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/ordinal/index.html" @@ -0,0 +1,16 @@ +--- +title: ordinal +slug: Archive/Mozilla/XUL/Propriétés/ordinal +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/ordinal +--- +
« Accueil de la référence XUL
+
ordinal +
Type : entier +
Obtient et définit la valeur de l'attribut ordinal. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/orient/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/orient/index.html" new file mode 100644 index 0000000000..f965b07278 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/orient/index.html" @@ -0,0 +1,14 @@ +--- +title: orient +slug: Archive/Mozilla/XUL/Propriétés/orient +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/orient +--- +
« Accueil de la référence XUL
+
orient +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut orient. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/pack/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/pack/index.html" new file mode 100644 index 0000000000..fd555d4c49 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/pack/index.html" @@ -0,0 +1,14 @@ +--- +title: pack +slug: Archive/Mozilla/XUL/Propriétés/pack +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/pack +--- +
« Accueil de la référence XUL
+
pack +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut pack. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/pageincrement/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/pageincrement/index.html" new file mode 100644 index 0000000000..17ccd723cd --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/pageincrement/index.html" @@ -0,0 +1,16 @@ +--- +title: pageIncrement +slug: Archive/Mozilla/XUL/Propriétés/pageIncrement +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/pageIncrement +--- +
« Accueil de la référence XUL
+
pageIncrement +
Type : entier +
Obtient et définit la valeur de l'attribut pageincrement. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/persist/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/persist/index.html" new file mode 100644 index 0000000000..bdc1c330db --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/persist/index.html" @@ -0,0 +1,16 @@ +--- +title: persist +slug: Archive/Mozilla/XUL/Propriétés/persist +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/persist +--- +
« Accueil de la référence XUL
+
persist +
Type : liste de noms d'attributs séparés par des espaces +
Obtient et définit la valeur de l'attribut persist. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/pmindicator/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/pmindicator/index.html" new file mode 100644 index 0000000000..e35b07ba7b --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/pmindicator/index.html" @@ -0,0 +1,17 @@ +--- +title: pmIndicator +slug: Archive/Mozilla/XUL/Propriétés/pmIndicator +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/pmIndicator +--- +
+ « Accueil de la référence XUL
+
+
+ pmIndicator
+
+ Type : chaîne
+
+ La valeur chaîne affichée pour les heures entre midi et minuit, par défaut « PM ». Cette valeur est déterminée selon la locale de l'utilisateur.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/popupboxobject/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/popupboxobject/index.html" new file mode 100644 index 0000000000..73c7b44900 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/popupboxobject/index.html" @@ -0,0 +1,14 @@ +--- +title: popupBoxObject +slug: Archive/Mozilla/XUL/Propriétés/popupBoxObject +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/popupBoxObject +--- +
« Accueil de la référence XUL
+
popupBoxObject +
Type : nsIPopupBoxObject +
Cette propriété en lecture seule conserve le nsIPopupBoxObject qui implémente le popup. Il n'est normalement pas nécessaire d'utiliser cette propriété étant donné que toutes ses fonctions sont disponibles via le popup lui-même. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/position/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/position/index.html" new file mode 100644 index 0000000000..a48b08003e --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/position/index.html" @@ -0,0 +1,14 @@ +--- +title: position +slug: Archive/Mozilla/XUL/Propriétés/position +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/position +--- +
« Accueil de la référence XUL
+
position +
Type : chaîne +
Obtient et définit la valeur de l'attribut position. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/preference.preferences/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/preference.preferences/index.html" new file mode 100644 index 0000000000..04e39427d6 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/preference.preferences/index.html" @@ -0,0 +1,16 @@ +--- +title: preference.preferences +slug: Archive/Mozilla/XUL/Propriétés/preference.preferences +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/preference.preferences +--- +
« Accueil de la référence XUL
+
preferences +
Type : élément +
Référence à l'élément preferences conteneur. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/readonly/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/readonly/index.html" new file mode 100644 index 0000000000..f6fd6c6c5a --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/readonly/index.html" @@ -0,0 +1,21 @@ +--- +title: readonly +slug: Archive/Mozilla/XUL/Propriétés/readOnly +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/readOnly +--- +
+ « Accueil de la référence XUL
+
+
+ readonly
+
+ Type : booléen
+
+ Si définie à true, l'utilisateur ne peut pas modifier la valeur de l'élément.
+
+
+ Cette propriété toute en minuscules n'est utilisée qu'avec l'élément preference et sera peut-être renommée en readOnly dans des versions ultérieures. D'autres éléments utilisent la propriété readOnly. L'attribut correspondant est cependant readonly en minuscules.
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/ref/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/ref/index.html" new file mode 100644 index 0000000000..68f38ce84b --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/ref/index.html" @@ -0,0 +1,14 @@ +--- +title: ref +slug: Archive/Mozilla/XUL/Propriétés/ref +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/ref +--- +
« Accueil de la référence XUL
+
ref +
Type : URI d'une ressource RDF +
Obtient et définit la valeur de l'attribut ref. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/resource/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/resource/index.html" new file mode 100644 index 0000000000..d791d97a80 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/resource/index.html" @@ -0,0 +1,14 @@ +--- +title: resource +slug: Archive/Mozilla/XUL/Propriétés/resource +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/resource +--- +
« Accueil de la référence XUL
+
resource +
Type : nsIRDFResource +
Renvoie une ressource RDF avec la valeur de l'attribut ref de l'élément. Si cet élément ref n'est pas spécifié, l'attribut id sera utilisé à la place. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/second/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/second/index.html" new file mode 100644 index 0000000000..ae2c271580 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/second/index.html" @@ -0,0 +1,17 @@ +--- +title: second +slug: Archive/Mozilla/XUL/Propriétés/second +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/second +--- +
+ « Accueil de la référence XUL
+
+
+ second
+
+ Type : entier
+
+ La valeur des secondes de l'heure actuellement sélectionnée, entre 0 et 59. Modifiez cette propriété pour changer la seconde sélectionnée.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/secondleadingzero/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/secondleadingzero/index.html" new file mode 100644 index 0000000000..72d843df5d --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/secondleadingzero/index.html" @@ -0,0 +1,17 @@ +--- +title: secondLeadingZero +slug: Archive/Mozilla/XUL/Propriétés/secondLeadingZero +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/secondLeadingZero +--- +
+ « Accueil de la référence XUL
+
+
+ secondLeadingZero
+
+ Type : booléen
+
+ Une valeur en lecture seule indiquant si un zéro initial doit être affiché avant la valeur des secondes si celle-ci est inférieure à 10.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/selected/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/selected/index.html" new file mode 100644 index 0000000000..680f617876 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/selected/index.html" @@ -0,0 +1,14 @@ +--- +title: selected +slug: Archive/Mozilla/XUL/Propriétés/selected +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/selected +--- +
« Accueil de la référence XUL
+ +
+
selected
+
Type : booléen
+
La valeur de cette propriété est true si cet élément est sélectionné, ou false s'il ne l'est pas. Cette propriété est en lecture seule.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/selectedindex/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/selectedindex/index.html" new file mode 100644 index 0000000000..6d9e555cf2 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/selectedindex/index.html" @@ -0,0 +1,14 @@ +--- +title: selectedIndex +slug: Archive/Mozilla/XUL/Propriétés/selectedIndex +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/selectedIndex +--- +
« Accueil de la référence XUL
+
selectedIndex +
Type : entier +
Renvoie l'indice de l'élément actuellement sélectionné. Un élément peut être sélectionné en assignant son indice à cette propriété. En lui assignant -1, tous les éléments seront désélectionnés. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/selecteditem/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/selecteditem/index.html" new file mode 100644 index 0000000000..221bd2cf1a --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/selecteditem/index.html" @@ -0,0 +1,14 @@ +--- +title: selectedItem +slug: Archive/Mozilla/XUL/Propriétés/selectedItem +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/selectedItem +--- +
« Accueil de la référence XUL
+
selectedItem +
Type : élément +
Conserve l'élément actuellement sélectionné. Si aucun élément n'est sélectionné, sa valeur sera null. Vous pouvez sélectionner un élément en définissant cette valeur. Un évènement select sera envoyé à cet élément lorsqu'il est sélectionné en modifiant cette propriété, la propriété selectedIndex, ou par l'utilisateur. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/seltype/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/seltype/index.html" new file mode 100644 index 0000000000..7c2cb97223 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/seltype/index.html" @@ -0,0 +1,22 @@ +--- +title: selType +slug: Archive/Mozilla/XUL/Propriétés/selType +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/selType +--- +
+ « Accueil de la référence XUL
+
+
+ selType<magic name="\"PAGENAME\"/"></magic>
+
+ Type : + + chaîne de caractères +
+
+ Obtient et définit la valeur de l'attribut seltype.
+
+
+  
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/state/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/state/index.html" new file mode 100644 index 0000000000..0539f20aea --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/state/index.html" @@ -0,0 +1,20 @@ +--- +title: state +slug: Archive/Mozilla/XUL/Propriétés/state +tags: + - Attributs_XUL + - Référence_XUL +translation_of: Archive/Mozilla/XUL/Property/state +--- +
« Accueil de la référence XUL
+
state +
Type : chaîne +
Cette propriété en lecture seule indique si le popup est ouvert ou non. Quatre valeurs sont possibles : +
+ +
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/statustext/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/statustext/index.html" new file mode 100644 index 0000000000..e8d0c5f93c --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/statustext/index.html" @@ -0,0 +1,14 @@ +--- +title: statusText +slug: Archive/Mozilla/XUL/Propriétés/statusText +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/statusText +--- +
« Accueil de la référence XUL
+
statusText +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut statustext. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/style/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/style/index.html" new file mode 100644 index 0000000000..2ac332eb3b --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/style/index.html" @@ -0,0 +1,14 @@ +--- +title: style +slug: Archive/Mozilla/XUL/Propriétés/style +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/style +--- +
« Accueil de la référence XUL
+
style +
Type : style CSS inline +
Obtient et définit la valeur de l'attribut style. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/suppressonselect/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/suppressonselect/index.html" new file mode 100644 index 0000000000..fb43cec3fe --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/suppressonselect/index.html" @@ -0,0 +1,20 @@ +--- +title: suppressOnSelect +slug: Archive/Mozilla/XUL/Propriétés/suppressOnSelect +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/suppressOnSelect +--- +
+ « Accueil de la référence XUL
+
+
+ suppressOnSelect
+
+ Type : + + booléen +
+
+ Obtient et définit la valeur de l'attribut suppressonselect.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/tabindex/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/tabindex/index.html" new file mode 100644 index 0000000000..cb59c74840 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/tabindex/index.html" @@ -0,0 +1,14 @@ +--- +title: tabIndex +slug: Archive/Mozilla/XUL/Propriétés/tabIndex +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/tabIndex +--- +
« Accueil de la référence XUL
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/timepicker.value/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/timepicker.value/index.html" new file mode 100644 index 0000000000..2629a7774d --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/timepicker.value/index.html" @@ -0,0 +1,17 @@ +--- +title: timepicker.value +slug: Archive/Mozilla/XUL/Propriétés/timepicker.value +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/timepicker.value +--- +
+ « Accueil de la référence XUL
+
+
+ value
+
+ Type : chaîne
+
+ L'heure actuellement entrée sous la forme HH:MM:SS. Modifiez cette propriété pour changer cette heure.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/tooltip/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/tooltip/index.html" new file mode 100644 index 0000000000..0b2a5e95e3 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/tooltip/index.html" @@ -0,0 +1,14 @@ +--- +title: tooltip +slug: Archive/Mozilla/XUL/Propriétés/tooltip +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/tooltip +--- +
« Accueil de la référence XUL
+
tooltip +
Type : id d'élément tooltip +
Obtient et définit la valeur de l'attribut tooltip. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/tooltiptext/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/tooltiptext/index.html" new file mode 100644 index 0000000000..0ad5b618ee --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/tooltiptext/index.html" @@ -0,0 +1,24 @@ +--- +title: tooltipText +slug: Archive/Mozilla/XUL/Propriétés/tooltipText +tags: + - Propriétés_XUL + - XUL +translation_of: Archive/Mozilla/XUL/Property/tooltipText +--- +
+ « Accueil de la référence XUL
+
+
+ tooltipText
+
+ Type : + + chaîne de caractères +
+
+ Obtient et définit la valeur de l'attribut tooltiptext.
+
+
+  
+

 

diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/top/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/top/index.html" new file mode 100644 index 0000000000..204e928123 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/top/index.html" @@ -0,0 +1,16 @@ +--- +title: top +slug: Archive/Mozilla/XUL/Propriétés/top +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/top +--- +
« Accueil de la référence XUL
+
top +
Type : entier +
Obtient et définit la valeur de l'attribut top. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/type/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/type/index.html" new file mode 100644 index 0000000000..450c40e124 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/type/index.html" @@ -0,0 +1,17 @@ +--- +title: type +slug: Archive/Mozilla/XUL/Propriétés/type +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/type +--- +
« Accueil de la référence XUL
+
type +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut type. +
+
+

Voir également

+ +
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/value/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/value/index.html" new file mode 100644 index 0000000000..ff5257202b --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/value/index.html" @@ -0,0 +1,14 @@ +--- +title: value +slug: Archive/Mozilla/XUL/Propriétés/value +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/value +--- +
« Accueil de la référence XUL
+
value +
Type : chaîne +
Obtient et définit la valeur de l'attribut value. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/width/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/width/index.html" new file mode 100644 index 0000000000..9b58bd9c1a --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/width/index.html" @@ -0,0 +1,16 @@ +--- +title: width +slug: Archive/Mozilla/XUL/Propriétés/width +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/width +--- +
« Accueil de la référence XUL
+
width +
Type : entier +
Obtient et définit la valeur de l'attribut width. +
+


+

+
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/year/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/year/index.html" new file mode 100644 index 0000000000..0c01e08e7a --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/year/index.html" @@ -0,0 +1,17 @@ +--- +title: year +slug: Archive/Mozilla/XUL/Propriétés/year +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/year +--- +
+ « Accueil de la référence XUL
+
+
+ year
+
+ Type : entier
+
+ L'année actuellement sélectionnée entre 1 et 9999. Définissez cette propriété pour changer la date sélectionnée.
+
diff --git "a/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/yearleadingzero/index.html" "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/yearleadingzero/index.html" new file mode 100644 index 0000000000..ef949e53e4 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/propri\303\251t\303\251s/yearleadingzero/index.html" @@ -0,0 +1,17 @@ +--- +title: yearLeadingZero +slug: Archive/Mozilla/XUL/Propriétés/yearLeadingZero +tags: + - Propriétés_XUL +translation_of: Archive/Mozilla/XUL/Property/yearLeadingZero +--- +
+ « Accueil de la référence XUL
+
+
+ yearLeadingZero
+
+ Type : booléen
+
+ Une valeur en lecture seule indiquant si un zéro doit être affiché devant l'année si elle est inférieure à 1000.
+
diff --git "a/files/fr/archive/mozilla/xul/recommandations_accessibilit\303\251_pour_xul/index.html" "b/files/fr/archive/mozilla/xul/recommandations_accessibilit\303\251_pour_xul/index.html" new file mode 100644 index 0000000000..000f7b13c8 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/recommandations_accessibilit\303\251_pour_xul/index.html" @@ -0,0 +1,484 @@ +--- +title: Recommandations d'accessibilité pour XUL +slug: Archive/Mozilla/XUL/Recommandations_accessibilité_pour_XUL +tags: + - Accessibilité + - XUL +translation_of: Archive/Mozilla/XUL/XUL_accessibility_guidelines +--- +

Introduction

+ +

Bienvenue dans les recommandations d'accessibilité pour XUL. En suivant ces principes et pratiques, vous pourrez écrire des applications XUL de manière à ce que tous les utilisateurs, même ceux souffrant de handicaps physiques, sensoriels ou communicatifs puissent l'utiliser et l'apprécier. L'accessibilité n'a rien de difficile, mais nécessite une compréhension basique des différents types de handicaps, des technologies assistives courantes et des fonctionnalités spéciales d'accessibilité fournies par le langage XUL. Plus que tout, l'accessibilité a besoin d'un effort conscient de votre part, et d'un désir d'intégrer tout le monde.

+ +

Nous espérons que ces recommandations seront suffisamment claires et détaillées pour que tout le monde — même ceux qui n'ont aucune expérience dans le domaine de l'accessibilité — puisse les comprendre. Il existe également une communauté de développeurs spécialisés dans l'accessibilité au sein du projet Mozilla qui n'hésiteront pas à vous aider pour toutes les inquiétudes et questions suscitées par le fait de rendre vos applications XUL entièrement accessibles.

+ + + + + + + + + + + + + + + +
Pour en savoir plus
AccessibilitéFonctionnalités de la plateformeCommunauté Mozilla
Software Accessibility - Where Are We Today? Introduction à l'accessibilité, aux technologies assistives et ressources concernant Mozilla. +

Introduction to Web Accessibility. Aperçu de l'accessibilité Web de WebAIM.

+ +

Dive Into Accessibility. Livre téléchargeable sur l'accessibilité Web avec astuces et mises en situation.

+ +

Technology Compatibility. Liste de technologies assistives courantes et de leurs niveaux de compatibilité respectifs avec XUL.

+ #accessibility. Canal IRC sur l'accessibilité pour des discussions générales autour de l'accessibilité sur Internet. Utile lors de conférences.		Apple Accessibility. Portail d'accessibilité d'Apple. +

LARS (Linux Accessibility Resource Site). Portail sur l'accessibilité générale sous Linux.

+ Microsoft Accessibility. Portail pour l'accessibilité chez Microsoft.		Accessibilité - MDC. Centre d'accessibilité sur le Mozilla Developer Center. +

mozilla.support.accessibility. Newsgroup sur l'accessibilité dans Mozilla.

+ #accessibility. Canal sur l'accessibilité sur le serveur IRC de Mozilla.
+ +

 

+ +

Recommandations

+ +

Accès au clavier

+ +

L'accès au clavier est important pour les utilisateurs ne pouvant pas utiliser de souris. Beaucoup d'utilisateurs de lecteurs d'écran et de handicapés physiques s'appuient sur le clavier comme outil d'entrée principal. Ces utilisateurs ont besoin d'un contrôle au clavier aisé, prévisible et bien documenté.

+ +

Ordre de tabulation

+ +

Fournissez un ordre de tabulation logique et assurez-vous que les utilisateurs puissent naviguer parmi tout le contenu à l'aide d'un clavier. Par défaut, l'ordre de tabulation est déterminé par l'ordre des éléments dans le code sous-jacent. Il peut également être redéfini programmatiquement à l'aide de l'attribut tabindex si nécessaire, mais cela doit se faire avec modération et être testé en profondeur lorsqu'on l'utilise. L'ordre de navigation doit être logique, généralement de gauche à droite et de haut en bas. L'ordre de navigation peut varier selon la nature de l'application ou le sens de lecture de la langue utilisée.

+ +

Assurez-vous que l'ordre de tabulation est logique et que l'on puisse accéder à tous les éléments interactifs simplement sans utiliser de souris. Vous devriez arriver à effectuer toutes les tâches possibles, que ce soit directement dans l'application ou depuis des éléments du menu ou de menus contextuels.

+ +

Arbres

+ +

Fournissez une manière alternative d'effectuer les opérations inaccessibles. Le sélecteur de colonne et les en-têtes de colonne dans les arbres XUL ne sont pas accessibles au clavier, pour respecter le comportement standard des arbres sur la plupart des systèmes d'exploitations actuels. Il est donc nécessaire de fournir une alternative accessible au clavier pour accéder à ces fonctions.

+ +
Aperçu du menu Affichage de la gestion des marque-pages de Firefox.
+ +

Un exemple d'arbre plus accessible est visible dans le gestionnaire de marque-pages de Firefox. Celui-ci permet aux utilisateurs de trier les marque-pages selon une certaine colonne d'information et de choisir les colonnes à afficher. Comme les en-têtes de colonne et le sélecteur de colonne, dans le coin supérieur droit de l'arbre, ne peuvent pas recevoir le focus, ils ne sont pas accessibles au clavier. Dans le gestionnaire de marque-pages, cette fonctionnalité est rendue accessible au clavier via le menu Affichage.

+ +

Boutons de barres d'outils

+ +

Par défaut, les boutons de barres d'outils ne peuvent pas recevoir le focus depuis le clavier. La manière conseillée de remédier à ce problème est de dupliquer toute fonctionnalité associée avec une barre d'outils ailleurs dans l'application, via un élément de menu principal ou contextuel par exemple. Dans les cas où cette duplication n'est pas possible (comme dans une fenêtre sans barre de menus), il est possible de permettre aux boutons de barres d'outils d'obtenir le focus en ajoutant la règle CSS spéciale -moz-user-focus: normal. (La fenêtre d'aperçu avant impression de Firefox utilise cette technique de secours.) Cela ne doit se faire qu'en dernier ressort, et être cohérent au sein d'une même fenêtre (c'est-à-dire que soit tous les boutons sont accessibles au clavier, soit aucun ne l'est).

+ +

Raccourcis clavier

+ +

Les raccourcis clavier sont très utiles pour les utilisateurs devant naviguer au clavier. Il existe de nombreuses manières d'en fournir. Celles-ci sont bien documentées dans le Tutoriel XUL:Raccourcis clavier.

+ +

Il convient de faire particulièrement attention lors du choix des raccourcis clavier. Lors de la création d'une extension (que ce soit pour Firefox ou une autre application XUL), assurez-vous que les raccourcis clavier que vous définissez n'interfèrent pas avec ceux déjà définis par l'application de base. Reportez-vous aux ressources suivantes lors de la définition de raccourcis clavier.

+ +
+ + + + + + + + + + +
En savoir plus
Raccourcis clavier et touches d'accès rapides
Mozilla Keyboard Planning FAQ and Cross Reference. Un excellent guide pour déterminer les combinaisons de touches non utilisées et les problèmes dépendant de la plateforme. +

Mozilla Keyboard Shortcuts. Une liste complète des raccourcis clavier des diverses applications Mozilla.

+ Mozilla's accesskey FAQ. Une courte référence sur l'utilisation de l'attribut accesskey.
+
+ + + +

Le menu contextuel est le petit menu activé par un clic droit de la souris sur une zone de contenu ou un élément (ou à l'aide de Shift + F10 ou VK_APPS sous Windows et Ctrl + Click ou Ctrl + Espace sur un Mac). Utilisez le gestionnaire d'évènement oncontextmenu ou l'attribut context pour créer des menus contextuels. Ne les codez pas pour s'ouvrir spécifiquement lors d'un clic-droit. L'évènement oncontextmenu et l'attribut context fonctionnent avec les déclencheurs de menus spécifiques à chaque plateforme, que ce soient les touches du clavier ou les clics de souris appropriés.

+ +

Scripts dépendant de la souris

+ +

Les fonctions associées aux évènements souris comme onmouseover, onmousemove et ondrag peuvent uniquement être activés à l'aide de la souris. Fournissez des points d'accès alternatifs au clavier pour ces fonctions. Envisagez d'utiliser des éléments de menus contextuels ou d'autres éléments XUL parallèlement aux raccourcis clavier.

+ +

Défilement

+ +

Assurez-vous que le défilement est possible au clavier. Beaucoup d'éléments XUL peuvent être rendus défilables à l'aide de CSS. D'autres éléments, comme arrowscrollbox et listbox, sont conçus pour défiler automatiquement. En règle générale, les éléments prévus pour défiler sont inaccessibles si l'utilisateur ne peut pas faire défiler tout le contenu à l'aide du clavier. L'élément arrowscrollbox, par exemple, ne peut pas recevoir le focus ni défiler à l'aide du clavier. Un élément listbox, par contre, peut recevoir le focus et son contenu peut défiler. À peu près tous les éléments XUL peuvent être rendus défilables en définissant un style "overflow: auto" ou "overflow: scroll". Cette flexibilité doit être utilisée de manière réfléchie.

+ +

Maintien du focus

+ +

L'utilisateur doit typiquement pouvoir contrôler l'endroit où se trouve le focus actuel. Évitez de changer le focus automatiquement. Cependant, désactiver, masquer ou détruire l'élément qui a le focus (ou l'un de ses éléments parents) peut provoquer la perte du focus. Pour empêcher cela, déplacez le focus à l'élément suivant avant de désactiver, masquer ou détruire l'élément qui a le focus.

+ +

L'exemple qui suit montre une fonction JavaScript qui peut être appelée avant de détruire un élément pour vérifier s'il a le focus et le déplacer si nécessaire.

+ +
function moveFocus(element)
+{
+    if(element == document.commandDispatcher.focusedElement)
+    {
+        document.commandDispatcher.advanceFocus();
+        return true;
+    }
+
+    return false;
+}
+
+ +


+ Les changements de focus inattendus peuvent embrouiller ou désorienter les utilisateurs. Un exemple récurrent concerne les numéros de téléphones à entrer dans des champs de formulaire. Les numéros de téléphone aux États-Unis sont souvent affichés dans un format XXX-XXX-XXXX ou (XXX) XXX-XXXX. Pour conserver ce format, certains formulaires contiennent trois champs différents. Le problème se pose lorsqu'un développeur décide d'ajouter une fonctionnalité sautant vers le second champ du formulaire dès que 3 chiffres ont été entrés dans le premier champ de formulaire. Ce comportement se répète pour le champ suivant du formulaire. Les utilisateurs qui ont l'habitude de se déplacer eux-mêmes dans les champs de formulaire se retrouvent souvent à répéter l'opération de passage au champ suivant et passent donc au dessus d'un des champs du formulaire.

+ +

Focus initial dans un dialogue

+ +

Le focus initial dans une fenêtre de dialogue XUL (c'est-à-dire le focus à l'ouverture de la fenêtre) devrait toujours se trouver sur un contrôle spécifique et non sur le dialogue lui-même. Dans un dialogue comportant des onglets, le focus doit généralement commencer au premier contrôle de l'onglet sélectionné. Dans tous les autres dialogues, le focus doit commencer au premier contrôle (bien qu'il puisse s'agir de n'importe quel autre contrôle s'il y a une bonne raison de le faire, du moment que ce n'est pas le dialogue lui-même).

+ +

Test de l'accès au clavier

+ +

Pour tester l'accessibilité au clavier débranchez ou désactivez simplement votre souris et essayez d'utiliser votre application uniquement avec le clavier. Vérifiez que l'ordre de tabulation est logique. Assurez-vous de pouvoir accéder à toutes les fonctions soit directement, soit par des moyens alternatifs comme des choix de menus ou des menus contextuels. Assurez-vous également que l'utilisateur puisse lire tout le contenu.

+ +

Informations assistives

+ +

Les utilisateurs de technologies assistives ont souvent besoin d'un balisage supplémentaire pour comprendre des significations et associations qui peuvent être intuitives pour les utilisateurs valides. Ce balisage supplémentaire est appelé information assistive. Il est aisé de fournir ces informations, mais on l'oublie souvent car elles ne produisent que très peu de changements visuels, voire aucun.

+ +

Texte alternatif

+ +

Fournissez un texte alternatif pour les images significatives. Il n'est pas nécessaire d'ajouter un texte alternatif lorsqu'une image assure une fonction purement décorative. Utilisez l'attribut alt pour décrire les images HTML et l'attribut tooltiptext pour les éléments XUL utilisant des images (c'est-à-dire les éléments image et les boutons avec images). Pour les boutons de barres d'outils avec images, on recommande d'utiliser à la fois une étiquette textuelle dans l'attribut label et un texte alternatif pour l'image dans l'attribut tooltiptext. Voyez les exemples de code ci-dessous.

+ +
<image src="stop.png" tooltiptext="Stop" />
+
+<html:img src="stop.jpg" alt="Stop" />
+<html:img src="image_decorative.jpg" alt="" /> <!-- En HTML, l'attribut alt est obligatoire. -->
+
+<toolbarbutton label="Stop" image="stop.png" tooltiptext="Arrêter le chargement de la page" />
+
+ +

Titres

+ +

Fournissez des titres uniques aux éléments conteneurs des fenêtres, assistants et dialogues. Les titres fournissent aux utilisateurs les informations les informations les plus basiques concernant l'application. Le titre est souvent la première chose qui est prononcée par un lecteur d'écran lorsqu'une application est ouverte ou activée. Les utilisateurs peuvent également se référer au titre pour comprendre où ils se situent. Les titres sont affichés dans la barre supérieure d'une application. Voyez les exemples de code ci-dessous.

+ +
<dialog id="print_dialog" title="Imprimer"                  ...>
+<window id="mywindow"     title="Mon application"           ...>
+<wizard id="reg_window"   title="Enregistrer le logiciel"   ...>
+
+ +

Labels de formulaires

+ +

Les labels ne sont pas automatiquement associés aux éléments de formulaires. Utilisez l'attribut control pour lier une étiquette texte (d'un élément label ou de description) à un élément de formulaire. Les lecteurs d'écran liront alors le label lors du remplissage d'un champ de forumlaire.

+ +
<label control="login-username" value="Utilisateur :"/>
+<textbox id="login-username"/>
+
+<description control="login-password">Mot de passe :</description>
+<textbox id="login-password" type="password"/>
+
+ +

Les formulaires plus grand peuvent être difficiles à mettre en page et à structurer. Bien qu'il y ait toujours de nombreuses manières de structurer un formulaire visuellement, fournissez toujours un label texte pour chaque élément de formulaire. Il ne faut pas utiliser des éléments de formulaire pour en décrire d'autres.

+ +
Capture d'écran du panneau Vie privé des options de Firefox.
+ +

Lorsque des éléments de formulaire sont intégrés dans un groupbox avec une étiquette, les technologies assistives comme les lecteurs d'écran liront cette étiquette suivie du label de l'élément de formulaire. Par exemple, dans la section Vie privée des options, il y a trois groupes appelés Historique, Cookies et Vie privée. Si l'utilisateur se déplace avec la tabulation vers le bouton « Exceptions... », il entendra « cookies {pause} exceptions {pause} bouton. » L'élément suivant dira « cookies {pause} les conserver jusqu'à {pause} leur expiration {pause} un sur trois {pause} liste déroulante ». Si le lecteur d'écran lisait uniquement le label, l'utilisateur devrait deviner à quoi se référait le bouton « exceptions » ou la liste déroulante « les conserver jusqu'à ».

+ +

Les groupes de contrôles sont essentiels pour les boutons radios ou groupes de cases à cocher concernant un thème similaire (c'est-à-dire où il faut cocher toutes celles qui s'appliquent). Si vous trouvez que des groupes de contrôles imbriqués sont peu agréables visuellement, utilisez CSS pour cacher la bordure du groupe interne afin qu'il reste visible dans le code pour servir aux utilisateurs de technologies assistives.

+ +

Les formulaires complexes ont souvent besoin d'un système d'étiquetage plus avancé que ce qui est possible avec les attributs XUL standards. Par exemple, le premier élément du panneau Vie privée des options de Firefox (montré et décrit plus haut) est [case à cocher] Se souvenir des pages visitées lors des [textbox] derniers jours. La difficulté ici provient du fait que le label correct pour la case à cocher (« Se souvenir des pages visitées lors des x derniers jours ») est composé de trois pièces différentes, dont la seconde est la valeur actuellement entrée dans la boîte de texte. Le label correct pour la boîte de texte est en fait le même, mais on ne voudrait pas que les technologies assistives le lisent ou le montrent deux fois de suite. Ce qu'il faut, c'est une manière de spécifier dans le code source que la case à cocher, le champ d'édition et les labels textuels autour font tous partie d'une seule entité, et qu'ils s'étiquettent en quelque sorte l'un l'autre.

+ +

Pour résoudre ce problème, on entourera d'abord tous ces contrôles dans un seul élément conteneur, comme (dans ce cas-ci) un hbox. On importe ensuite ce qu'on appelle « l'Accessible, Adaptable Applications Module » (du groupe WAI-ARIA du WC3) en ajoutant xmlns:aaa="http://www.w3.org/2005/07/aaa" comme attribut sur l'élément conteneur. Ceci nous permet d'utiliser l'attribut labelledby (notez le double L — aaa utilise l'orthographe anglaise du Royaume-Uni) pour spécifier que la case à cocher et la boîte de texte sont toutes deux décrites par l'ensemble du groupe de composants. Dans XUL, cela ressemblera à ce qui suit.

+ +
<hbox id="historyBox" xmlns:aaa="http://www.w3.org/2005/07/aaa">
+  <checkbox id="rememberHistoryDays" aaa:labelledby="historyBox" label="Se souvenir des pages visitées lors des"/>
+  <textbox  id="historyDays"         aaa:labelledby="historyBox"/>
+  <label>derniers jours.</label>
+</hbox>
+
+ +

Test des informations assistives

+ +

La meilleure manière de tester est pour de nombreuses raisons de faire le test avec un lecteur d'écran, car la navigation au clavier et la structure sémantique sous-jacente de l'interface utilisateur peuvent être testées simultanément. C'est un excellent indicateur concernant l'accessibilité d'une interface utilisateur, mais en aucun cas un test complet. En fin de compte, pour les applications qui doivent être entièrement accessibles, il est préférable que l'application soit testée par un large panel d'utilisateurs disposant de différentes configurations logicielles et de différentes technologies assistives.

+ +

Si vous ne disposez pas d'un logiciel lecteur d'écran (et ne connaissez personne dont c'est le cas), votre meilleure option est de vérifier attentivement le code source pour vous assurer que toutes les règles ci-dessus ont été suivies, et ensuite que les utilisateurs ont un moyen de vous contacter en retour sur l'accessibilité (et d'autres aspects) de votre application.

+ +

Affichage

+ +

On entend souvent que « la présentation fait tout ». Bien qu'il soit vrai que la présentation est quelque chose d'essentiel, les documents doivent également être structurés de manière à ce que l'utilisateur puisse appeler des préférences d'affichage qui peuvent être nécessaires pour l'accessibilité. La présentation doit aussi être flexible pour s'adapter au redimensionnement des fenêtres et polices. Les applications coopératives s'adaptent bien à l'environnement de l'utilisateur.

+ +

Paramètres par défaut du système

+ +

Respectez les réglages par défaut du système. Beaucoup d'utilisateurs configurent leur ordinateur pour utiliser des polices plus grandes et/ou des thèmes de couleur particuliers. Par défaut, les menus XUL, labels et autres contrôles obtiennent leur police, taille et paramètres de couleur des réglages de l'utilisateur spécifiés par le système d'exploitation. Respectez ces réglages à moins d'avoir une raison particulière et inévitable de les changer. Le cas échéant, utilisez CSS pour dimensionner les éléments par rapport à leurs tailles par défaut (par exemple, utilisez des tailles en % ou em plutôt que des tailles spécifiques en points ou en pixels).

+ +

Couleurs

+ +

La couleur est un outil important. Des couleurs différentes peuvent donner des significations différentes aux objets et au texte. Cependant, la couleur seule est inadéquate pour communiquer un sens ou une information particulière à l'utilisateur. Certains, principalement ceux qui sont aveugles ou ne voient pas les couleurs, n'arriveront pas à discerner certaines couleurs. Certains utilisateurs peuvent modifier le schéma de couleurs par défaut de votre application. La couleur doit uniquement être utilisée pour souligner la signification d'un objet ou d'un texte après avoir donné cette signification à l'utilisateur d'une autre manière.

+ +

Tailles flexibles

+ +

Un des avantages d'XUL est que l'apparence visuelle est très facile à contrôler. Sur le Web, la mise en page est souvent contrainte dans une taille spécifique. Avec XUL, vous pouvez permettre aux éléments de s'étendre lorsque la fenêtre de l'application est redimensionnée. Utilisez l'attribut flex pour fournir cette fonctionnalité.

+ +

Test de l'affichage

+ +

Vérifiez que votre application est fonctionnelle et que son apparence est plaisante en utilisant des polices et couleurs définies par l'utilisateur. Pour cela, changez les paramètres d'affichage du système en un thème accessible (comme le thème Contraste élevé sous Windows, disponible par Alt-Gauche + Maj-Gauche + Impr. Écran). Assurez-vous que le texte est mis en évidence correctement que que la couleur n'est pas utilisée comme seule manière de communiquer une signification. Assurez-vous également que lorsque les fenêtres sont redimensionnées, votre application s'adapte de bonne grâce.

+ +

Interaction entre l'homme et la machine

+ +

Lorsque vous utilisez une application, vous vous attendez à disposer d'un certain contrôle et d'un retour sur ce qui se passe. Fournissez aux utilisateurs des instructions et indications claires, et permettez-leur de corriger leurs erreurs. Certains utilisateurs handicapés ont des difficultés lorsqu'on leur demande une réponse rapide. Donnez-leur un temps adéquat pour effectuer leurs tâches.

+ +

Instructions

+ +

Fournissez une documentation d'aide aux utilisateurs. Même des applications très simples devraient contenir un document d'aide ou un manuel de référence pour l'utilisateur. Décrivez les raccourcis claver et toutes autres considérations concernant l'accessibilité. Les utilisateurs doivent avoir la possibilité de consulter une description complète de toutes les fonctionnalités majeures d'une application. Fournissez également des détails sur l'utilisation de la documentation d'aide lorsqu'elle est longue ou complexe.

+ +

Avertissements

+ +

Utilisez des avertissements accessibles pour présenter des informations importantes à l'utilisateur. Utilisez des scripts ou l'élément notificationbox pour déclencher des alertes.

+ +

Évitez d'utiliser uniquement des alertes audio ou visuelles pour signaler des évènements urgents. Les utilisateurs qui ont réduit ou coupé le son, ou qui sont sourds ou malentendants ne pourront pas reconnaître des alertes uniquement sonores. Les utilisateurs souffrant de déficiences visuelles ne verront pas non plus les alertes qui sont purement visuelles (à moins que celles-ci soient présentées dans un texte fonctionnel également accessible à un lecteur d'écran).

+ +

Éléments interactifs

+ +

Évitez les petites cibles, qui sont difficiles à voir et à atteindre avec un clic de souris. Vérifiez que la mise en page et le contraste sont suffisants pour distinguer les éléments interactifs les un des autres et par rapport aux parties statiques de l'application.

+ +

Récupération en cas d'erreur

+ +

Lorsque l'utilisateur provoque une erreur dans une application, permettez une récupération aisée. Par exemple, si l'utilisateur entre des lettres là où un nombre est attendu dans un formulaire, cela ne doit pas faire planter l'application. L'utilisateur doit être averti du problème et pouvoir corriger l'erreur.

+ +

Temps de réponse

+ +

Le cas échéant, avertissez l'utilisateur des limites de temps et permettez-lui d'ajuster la limite ou de demander plus de temps. Un des miracles de la technologie moderne est qu'elle permet aux personnes souffrant même des plus sévères limitations physiques d'utiliser des ordinateurs. Certains utilisent des contrôles à la bouche ou des périphériques de détection de mouvements comme des capteurs oculaires pour entrer des informations. Ce processus peut être lent. D'autres utilisateurs ont simplement besoin de temps pour comprendre ce qui se produit dans l'application.

+ +

Test de l'interaction homme machine

+ +

Assurez-vous que la documentation d'aide est à jour. Vérifiez que les avertissements sont affichés à l'aides des éléments XUL appropriés. Assurez-vous que l'utilisateur est informé de toutes ses erreurs et que des instructions et la possibilité d'effectuer à nouveau l'opération correcte sont fournies. Assurez-vous également que les utilisateurs ont le contrôle de leur temps de réponse.

+ +

Médias

+ +

Audio

+ +

Des fichiers audio d'information comme des podcasts peuvent être rendus accessibles en fournissant une transcription mot-à-mot. Les transcriptions doivent identifier correctement les intervenants et décrire les autres sons significatifs comme les rires ou les chansons. Ces transcriptions peuvent prendre du temps à réaliser, mais c'est la seule manière de rendre du contenu sonore accessible.

+ +

Vidéos

+ +

Un fichier vidéo peut être rendu accessible en ajoutant des sous-titres synchronisés. La plupart des formats vidéo fournissent un moyen d'afficher des sous-titres. Les vidéos devraient également être accompagnées de transcriptions descriptives. En général, ces deux opérations vont ensemble, une fois que vous avez l'une, il est facile de produire l'autre.

+ + + + + + + + + + + +
En savoir plus
Sous-titrage
Article de WebAIM : Web Captioning Overview
+
+ WebAIM : Captioning Resources
+ +

Animations

+ +

Les animations, le mouvement et les sons peuvent être dérangeantes pour certains utilisateurs souffrants de troubles de l'attention. Fournissez un mécanisme pour désactiver les médias et les mouvements.

+ +

Les tremblements ou clignotements ne sont pas uniquement ennuyeux pour tout le monde, mais à une vitesse de plus de 3 cycles par seconde, ils peuvent provoquer un malaise chez les utilisateurs souffrant d'épilepsie photosensible. Si des tremblement ou clignotements sont nécessaires, avertissez l'utilisateur au préalable avant de les provoquer.

+ +

Test de médias

+ +

Assurez-vous que des alternatives aux médias sont disponibles dans un format accessible.

+ +

Autres problèmes

+ +

Contrôles personnalisés

+ +

Évitez de recréer des fonctionnalités qui existent déjà. Assurez-vous que vos composants personnalisés sont construits en pensant à l'accessibilité. Utilisez les couleurs système CSS pour vous assurer que les nouveaux contrôles interagiront bien avec les autres contrôles ainsi qu'avec les thèmes et couleurs définis par l'utilisateur.

+ + + + + + + + + + + +
En savoir plus
Contrôles personnalisés accessibles
ARIA : Applications riches Internet accessibles
+
+ Réalisation de composants personnalisés accessibles en XUL
+ +

Liste de contrôle d'accessibilité pour XUL

+ +

Utilisez la liste de contrôle suivante pour vérifier rapidement l'accessibilité d'une nouvelle application XUL, ou comme point de départ pour régler les problèmes d'accessibilité dans une application existante.

+ +

Accès au clavier

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Point à vérifierCorrectIncorrect
Ordre de tabulationUn ordre de tabulation logique est fourni.L'ordre de tabulation saute de manière inattendue.
ArbresUn accès au clavier est fourni pour les fonctions inaccessibles comme le sélecteur de colonnes ou le tri par colonnes.Aucun accès au clavier n'est fourni pour le choix des colonnes ou d'autres fonctionnalités.
Boutons de barres d'outilsDes alternatives au clavier sont fournies pour les fonctionnalités des boutons de barres d'outils.Aucune alternative au clavier n'est fournie pour les fonctionnalités des boutons de barres d'outils.
Raccourcis clavierDes raccourcis clavier sont présents pour les fonctionnalités importantesAucun raccourci clavier n'est fourni.
Menus contextuelsLes menus contextuels sont déclenchés par le gestionnaire d'évènement oncontextmenu.Les menus contextuels sont déclenchés directement par un clic droit de la souris ou un autre déclencheur spécifique.
Scripts dépendants de la sourisToutes les opérations à la souris ont des équivalents accessibles au clavier.Certaines opérations ne peuvent être réalisées qu'avec une souris.
DéfilementTous les éléments défilables peuvent être contrôlés au clavier.Le défilement ne peut pas se faire au clavier.
FocusLe focus clavier est conservé et ne se déplace pas de manière inattendue.Le focus se déplace ou est désactivé de manière inattendue.
+ +

Informations assistives

+ + + + + + + + + + + + + + + + + + + + + + + + +
Point à vérifierCorrectIncorrect
Texte alternatifUn texte alternatif est fourni pour les images significatives.Le texte alternatif est manquant sur des images significatives, o n'est pas approprié pour la fonction d'une image.
TitresToutes les fenêtres, y compris les dialogues et les assistants, ont un titre descriptif.Des fenêtres n'ont pas de titre ou un titre incorrect.
Labels de formulairesChaque élément de formulaire a un label associé et les boutons radios sont intégrés dans un groupbox.Des éléments de formulaire n'ont pas de label ou ces labels ne sont pas connectés programmatiquement, ou des boutons radios ne font pas partie d'un groupbox.
+ +

Affichage

+ + + + + + + + + + + + + + + + + + + + + + + + +
Point à vérifierCorrectIncorrect
Réglages par défaut du systèmeLes paramètres systèmes sont respectés.Les paramètres systèmes ne sont pas respectés.
CouleursLa couleur seule n'est pas utilisée pour donner une signification, et le contraste entre le texte et la couleur de fond est suffisant.La couleur seule est utilisée pour donner une signification, ou le contraste entre le texte et la couleur de fond est insuffisant.
FlexibilitéLes éléments visuels et leurs conteneurs se redimensionnent.Les éléments visuels et leurs conteneurs ne se redimensionnent pas.
+ +

Interaction homme-machine

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Point à vérifierCorrectIncorrect
InstructionsUne documentation d'aide est fournie, avec une description des raccourcis clavier.Aucune documentation d'aide n'est fournie, ou celle-ci est incomplète.
AvertissementsLes alertes sont affichées à l'aide de la fonction de script alert() ou l'élément notificationbox.Les alertes sont uniquement visuelles ou audifives, ou utilisent une autre méthode que la fonction de script alert() ou l'élément notificationbox.
Éléments interactifsLes éléments interactifs sont suffisamment grands et visibles.Les éléments interactifs sont trop petits ou insuffisamment contrastés par rapport aux autres parties de l'application.
Récupération en cas d'erreurDes avertissements sont affichés lorsque l'utilisateur commet une erreur. Il reçoit ensuite la possibilité et des instructions pour la corriger.Aucun message d'erreur n'existe, ou des instructions inadéquates sont fournies.
Temps de réponseL'utilisateur est informé des limites des temps et a le contrôle de cette limite lorsque c'est possible.L'utilisateur n'est pas informé des limites de temps et/ou n'a aucun contrôle sur celles-ci.
+ +

Médias

+ + + + + + + + + + + + + + + + + + + + + + + + +
Point à vérifierCorrectIncorrect
AudioDes transcriptions sont fournies pour les pistes sonores.Aucune transcription n'est fournie.
VidéosLes vidéos sont sous-titrées et une transcription est fournie.Aucun sous-titre ou transcription n'est fourni.
AnimationsL'utilisateur peut contrôler les animations et est prévenu lorsque le contenu va clignoter.Il n'existe pas de contrôle pour les animations ni d'avertissements pour les clignotements.
+ +

Autres

+ + + + + + + + + + + + + + +
Point à vérifierCorrectIncorrect
Contrôles personnalisésLes contrôles personnalisés sont accessibles.Les contrôles personnalisés ne sont pas accessibles.
diff --git a/files/fr/archive/mozilla/xul/richlistbox/index.html b/files/fr/archive/mozilla/xul/richlistbox/index.html new file mode 100644 index 0000000000..db0f4dacc7 --- /dev/null +++ b/files/fr/archive/mozilla/xul/richlistbox/index.html @@ -0,0 +1,268 @@ +--- +title: richlistbox +slug: Archive/Mozilla/XUL/richlistbox +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/richlistbox +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Cet élément est utilisé pour créer une liste d'éléments, de manière semblable à une listbox, mais est conçu pour être utilisé lorsque les éléments ne contiennent pas du simple contenu texte.

Note : Dans les versions de Firefox antérieures à Firefox 3, les richlistbox supportaient uniquement les sélections simples. Firefox 3 y permet les sélections multiples.
+ +
Attributs +
disabled, disableKeyNavigation, preference, rows, seltype, suppressonselect, tabindex, value +
+
Propriétés +
accessibleType, currentIndex, currentItem, disabled, disableKeyNavigation, itemCount, selectedCount, selectedIndex, selectedItem, selectedItems, selType, suppressOnSelect, tabIndex, value +
+
Méthodes +
addItemToSelection, appendItem, clearSelection, ensureElementIsVisible, ensureIndexIsVisible, getIndexOfFirstVisibleRow, getIndexOfItem, getItemAtIndex, getNumberofVisibleRows, getRowCount, getSelectedItem, insertItemAt, invertSelection, moveByOffset, removeItemAt, removeItemFromSelection, scrollToIndex, selectAll, selectItem, selectItemRange, timedSelect, toggleItemSelection +
+

Exemples

+
<richlistbox>
+  <richlistitem>
+    <description>Une description XUL !</description>
+  </richlistitem>
+  <richlistitem>
+    <button label="Un bouton XUL"/>
+  </richlistitem>
+</richlistbox>
+
+

L'élément richlistbox contient plusieurs éléments richlistitem, qui peuvent contenir tout type de contenu. On peut cliquer sur n'importe quel élément richlistitem et utiliser le clavier pour déplacer la sélection. +

+

Attributs

+

+

+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
+
+ +
preference +
Type : id d'élément +
Connecte l'élément à une préférence (élément preference) correspondante. Cet attribut n'a d'effet qu'utilisé au sein d'un prefwindow. La valeur de la préférence sera mise à jour pour correspondre à la propriété value de l'élément. +
+ + +
+
+ +
rows +
Type : entier +
Le nombre de lignes à afficher dans l'élément. Si l'élément contient plus que ce nombre de lignes, une barre de défilement apparaitra afin que l'utilisateur puisse consulter les autres lignes. Pour obtenir le nombre réel de lignes dans l'élément, utilisez la méthode getRowCount. +
+ + +
+
+ +
+
+ seltype<magic name="\"PAGENAME\"/"></magic>
+
+ Type : + + une des valeurs ci-dessous +
+
+ Utilisé pour indiquer si les sélections multiples sont permises.
+
+ +

<magic name="\"PAGENAME\"/">Des cellules individuelles peuvent être sélectionnées.</magic><magic name="\"PAGENAME\"/"> Des lignes sont sélectionnées, cependant, l'indicateur de sélection n'est visible que sur le texte de la colonne principale.</magic>

+
+
+ +
+
+ suppressonselect
+
+ Type : + + booléen +
+
+ Si cet attribut n'est pas spécifié, un évènement select est déclenché dès qu'un élément est sélectionné, que ce soit par l'utilisateur ou par l'appel d'une des méthodes de sélection. Si la valeur de l'attribut est true, l'évènement select n'est jamais déclenché.
+
+
+
+ +
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+ + +
+
+ +
value +
Type : chaîne +
Cet attribut chaîne permet d'associer une valeur de données avec un élément. Il n'est destiné à aucune utilisation particulière, mais vous pouvez y accéder avec un script pour votre usage propre.. +
+ + +
+ +

Propriétés

+

+

+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+
+
+
currentItem +
Type : élément listitem +
Renvoie le dernier élément sélectionné dans la liste de sélection, ce qui n'est utile que dans une liste à sélection multiple. +
+ +
+
+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
+
+
+
selectedIndex +
Type : entier +
Renvoie l'indice de l'élément actuellement sélectionné. Un élément peut être sélectionné en assignant son indice à cette propriété. En lui assignant -1, tous les éléments seront désélectionnés. +
+ +
+
+
selectedItem +
Type : élément +
Conserve l'élément actuellement sélectionné. Si aucun élément n'est sélectionné, sa valeur sera null. Vous pouvez sélectionner un élément en définissant cette valeur. Un évènement select sera envoyé à cet élément lorsqu'il est sélectionné en modifiant cette propriété, la propriété selectedIndex, ou par l'utilisateur. +
+ +
+
+
+
+
+ selType<magic name="\"PAGENAME\"/"></magic>
+
+ Type : + + chaîne de caractères +
+
+ Obtient et définit la valeur de l'attribut seltype.
+
+ +
+
+
+
+ suppressOnSelect
+
+ Type : + + booléen +
+
+ Obtient et définit la valeur de l'attribut suppressonselect.
+
+
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+ +
+
+
value +
Type : chaîne +
Obtient et définit la valeur de l'attribut value. +
+ +
+ +

Méthodes

+ + + + + + +
+

Héritées de XUL element
+ blur, click, doCommand, focus, getElementsByAttribute getElementsByAttributeNS

Héritées de DOM element
+ addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()

+ +
+ + + + + + + + + +
getRowCount() +
Type de retour : entier +
Renvoie le nombre total de lignes dans l'élément, quel que soit le nombre de lignes affichées. +
+ + + + + + + +
selectAll() +
Type de retour : aucune valeur renvoyée +
Sélectionne tous les éléments. Un évènement de sélection est envoyé après l'exécution de la sélection. +
+
selectItem( item ) +
Type de retour : aucune valeur renvoyée +
Désélectionne tous les éléments actuellement sélectionnés, puis sélectionne l'élément donné en argument. Un évènement de sélection est envoyé après l'exécution de la sélection. +
+
selectItemRange( startItem, endItem) +
Type de retour : aucune valeur renvoyée +
Sélectionne tous les éléments compris entre les deux éléments donnés en paramètre, y compris les éléments de début et de fin. Tous les autres éléments sont désélectionnés. Cette méthode n'a aucun effet sur les listes en mono-sélection. Un évènement de sélection est envoyé après l'exécution de la sélection. +
+
timedSelect( item, timeout ) +
Type de retour : aucune valeur renvoyée +
Sélectionne un élément spécifié par l'argument item après un nombre de millisecondes définit par l'argument timeout. Tous les autres éléments sont désélectionnés. +
+
toggleItemSelection( item ) +
Type de retour : aucune valeur renvoyée +
Modifie l'état de sélection de l'élément spécifié. S'il est sélectionné, il devient désélectionné. S'il est désélectionné, il devient sélectionné. Les autres éléments de la liste ne sont pas affectés et ils conservent leur état de sélection. +
+ +

Sujets liés

+
Interfaces +
nsIAccessibleProvider, nsIDOMXULMultiSelectControlElement +
+
+
diff --git a/files/fr/archive/mozilla/xul/richlistitem/index.html b/files/fr/archive/mozilla/xul/richlistitem/index.html new file mode 100644 index 0000000000..ee24a5cf8e --- /dev/null +++ b/files/fr/archive/mozilla/xul/richlistitem/index.html @@ -0,0 +1,128 @@ +--- +title: richlistitem +slug: Archive/Mozilla/XUL/richlistitem +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/richlistitem +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un élément individuel dans une richlistbox. +

+
Attributs +
disabled, selected, tabindex, value +
+
Propriétés +
accessible, control, disabled, label, selected, tabIndex, value +
+

Exemples

+

(exemple nécessaire) +

+

Attributs

+

+

+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
selected +
Type : booléen +
Indique si l'élément est sélectionné ou non. Cette valeur est en lecture seule. Pour changer la sélection, utilisez la propriété selectedIndex ou selectedItem de l'élément conteneur. +
+ + +
+
+ +
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+ + +
+
+ +
value +
Type : chaîne +
Cet attribut chaîne permet d'associer une valeur de données avec un élément. Il n'est destiné à aucune utilisation particulière, mais vous pouvez y accéder avec un script pour votre usage propre.. +
+ + +
+ +

Propriétés

+

+

+
accessible +
Type : nsIAccessible +
Renvoie l'objet d'accessibilité pour l'élément. +
+


+

+ +
+
+
+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
label +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut label. +
+ +
+
+ +
+
selected
+
Type : booléen
+
La valeur de cette propriété est true si cet élément est sélectionné, ou false s'il ne l'est pas. Cette propriété est en lecture seule.
+
+
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+ +
+
+
value +
Type : chaîne +
Obtient et définit la valeur de l'attribut value. +
+ +
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+
Interfaces +
nsIAccessibleProvider, nsIDOMXULSelectControlItemElement +
+
+
diff --git "a/files/fr/archive/mozilla/xul/r\303\251f\303\251rence_xul/index.html" "b/files/fr/archive/mozilla/xul/r\303\251f\303\251rence_xul/index.html" new file mode 100644 index 0000000000..0ab0677e2f --- /dev/null +++ "b/files/fr/archive/mozilla/xul/r\303\251f\303\251rence_xul/index.html" @@ -0,0 +1,165 @@ +--- +title: Référence XUL +slug: Archive/Mozilla/XUL/Référence_XUL +tags: + - Aide_pour_les_éditeurs_de_MDC + - Référence_XUL + - Traduction_en_cours + - XUL +translation_of: Archive/Mozilla/XUL/XUL_Reference +--- +

« XUL Reference «Consultez également la Référence XUL du wiki XULfr.org.

+ + + + + + + + + + + + +
Tous les éléments XUL
+

action (en, xulfr)
+ arrowscrollbox (en, xulfr)
+ assign (en)
+ bbox (en, xulfr)
+ binding (en, xulfr)
+ bindings (en, xulfr)
+ box (en, xulfr)
+ broadcaster (en, xulfr)
+ broadcasterset (en, xulfr)
+ button (en, xulfr)
+ browser (, xulfr)
+ checkbox (en, xulfr)
+ caption (en, xulfr)
+ colorpicker (en, xulfr)
+ column (en, xulfr)
+ columns (en, xulfr)
+ commandset (en, xulfr)
+ command (en, xulfr)
+ conditions (en, xulfr)
+ content (en, xulfr)
+ datepicker
+ deck (en, xulfr)
+ description (en, xulfr)
+ dialog (en, xulfr)
+ dialogheader (en)
+ dropmarker
+ editor (en, xulfr)
+ grid (en, xulfr)
+ grippy (en, xulfr)
+ groupbox (en, xulfr)
+ hbox (en, xulfr)
+ iframe (en, xulfr)
+ image (en, xulfr)
+ key (en, xulfr)
+ keyset (en, xulfr)
+ label (en, xulfr)
+ listbox (en, xulfr)
+ listcell (en, xulfr)
+ listcol (en, xulfr)
+ listcols (en, xulfr)
+ listhead (en, xulfr)
+ listheader (en)
+ listitem (en, xulfr)

+ 		+

member (en, xulfr)
+ menu (en, xulfr)
+ menubar (en, xulfr)
+ menuitem (en, xulfr)
+ menulist (en, xulfr)
+ menupopup (en, xulfr)
+ menuseparator (en, xulfr)
+ notification (en)
+ notificationbox (en)
+ observes (en, xulfr)
+ overlay (en, xulfr)
+ page (en, xulfr)
+ panel
+ param (en)
+ popup (en, xulfr)
+ popupset (en, xulfr)
+ preference
+ preferences
+ prefpane
+ prefwindow
+ progressmeter (en, xulfr)
+ query (en)
+ queryset (en)
+ radio (en, xulfr)
+ radiogroup (en, xulfr)
+ resizer (en)
+ richlistbox
+ richlistitem
+ row (en, xulfr)
+ rows (en, xulfr)
+ rule (en, xulfr)
+ scale
+ script (en, xulfr)
+ scrollbar (en, xulfr)
+ scrollbox (en, xulfr)
+ scrollcorner (en)
+ separator (en, xulfr)
+ spacer (en, xulfr)
+ spinbuttons
+ splitter (en, xulfr)
+ stack (en, xulfr)
+ statusbar (en, xulfr)

+ 		+

statusbarpanel (en, xulfr)
+ stringbundle (en, xulfr)
+ stringbundleset (en, xulfr)
+ tab (en, xulfr)
+ tabbrowser (en, xulfr) (Firefox uniquement
+ à partir de Firefox 3/Gecko 1.9)
+ tabbox (en, xulfr)
+ tabpanel (en, xulfr)
+ tabpanels (en, xulfr)
+ tabs (en, xulfr)
+ template (en, xulfr)
+ textnode (en, xulfr)
+ textbox (en, xulfr)
+ textbox (autocomplétion de Firefox) (en)
+ textbox (autocomplétion de Mozilla) (en)
+ timepicker
+ titlebar (en, xulfr)
+ toolbar (en, xulfr)
+ toolbarbutton (en, xulfr)
+ toolbargrippy (en, xulfr)
+ toolbaritem (en, xulfr)
+ toolbarpalette (en, xulfr)
+ toolbarseparator (en, xulfr)
+ toolbarset (en, xulfr)
+ toolbarspacer ({en)
+ toolbarspring (en)
+ toolbox (en, xulfr)
+ tooltip ({en, xulfr)
+ tree (en, xulfr)
+ treecell ({en, xulfr)
+ treechildren (en, xulfr)
+ treecol (en, xulfr)
+ treecols (en, xulfr)
+ treeitem ({en, xulfr)
+ treerow (en, xulfr)
+ treeseparator (en, xulfr)
+ triple ({en, xulfr)
+ vbox (en, xulfr)
+ where (en)
+ window (en, xulfr)
+ wizard (en, xulfr)
+ wizardpage (en, xulfr)

+
+ +

Autres listes sur XUL

+ + diff --git a/files/fr/archive/mozilla/xul/scale/index.html b/files/fr/archive/mozilla/xul/scale/index.html new file mode 100644 index 0000000000..a4ae7e44e9 --- /dev/null +++ b/files/fr/archive/mozilla/xul/scale/index.html @@ -0,0 +1,255 @@ +--- +title: scale +slug: Archive/Mozilla/XUL/scale +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/scale +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un élément scale (parfois appelé slider) permet à l'utilisateur de sélectionner une valeur dans un intervalle. Une barre affichée horizontalement ou verticalement lui permet de choisir une valeur en glissant une poignée sur la barre. +

Utilisez l'attribut orient pour spécifier l'orientation de l'échelle. La valeur par défaut est <tt>horizontal</tt> qui affiche une barre horizontale. Les valeurs inférieures sont à gauche et les valeurs supérieurs à droite. Pour utiliser une échelle verticale, définissez l'attribut orient à <tt>vertical</tt>. +

L'utilisateur peut utiliser les touches fléchées du clavier pour incrémenter ou décrémenter la valeur d'une unité, ou les touches PagePréc et PageSuiv pour incrémenter ou décrémenter la valeur d'une page, telle que spécifiée par l'attribut pageincrement. Les touches Origine et Fin définissent respectivement la valeur au minimum et au maximum. Un évènement change sera déclenché par l'élément chaque fois que sa valeur est modifiée. +

+
Attributs +
dir, disabled, increment, max, min, pageincrement, tabindex, value +
+
Propriétés +
disabled, max, min, increment, pageIncrement, tabIndex, value,
+
Méthodes +
decrease, decreasePage, increase, increasePage, +
+

Exemples

+

Échelle horizontale : +

+
<scale min="1" max="10"/>
+
+

Image:Controlguide-scale.png +

Échelle verticale : +

+
<scale min="1" max="10" orient="vertical"/>
+
+

Attributs

+

+

+ +
+
+ dir
+
+ Type : + + une des valeurs ci-dessous +
+
+ La direction dans laquelle les éléments enfants de l'élément seront placés.
+
+ + +

 

+
+
+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
+
+ increment
+
+ Type : + + entier +
+
+ La quantité dont l'attribut value (pour les boîtes numériques et les échelles) or curpos<magic name="\"PAGENAME\"/"> (pour les barres de défilement) </magic> change lorsque l'on clique sur les flèches. La valeur par défaut est 1.
+
+
+
+ +
+
+ min
+
+ Type : + + entier +
+
+ La valeur minimum que peut prendre l'élément. La valeur par défaut est 0.
+
+
+
+ +
+
+ max
+
+ Type : + + entier +
+
+ La valeur maximum que peut prendre l'élément scale ou number box. La valeur par défaut est 100 pour les éléments scale et Infinity pour les boîtes numériques
+
+
+
+ +
+
+ pageincrement
+
+ Type : + + entier +
+
+ La quantité de laquelle la valeur de l'attribut curpos ou value change lorsque l'utilisateur clique dans la colonne de la barre de défilement (la zone dans laquelle le curseur de la barre se déplace), ou lorsque les touches PgUp ou PgDown sont utilisées. La valeur par défaut est 10.
+
+
+
+ +
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+ + +
+
+ +
value +
Type : chaîne +
Cet attribut chaîne permet d'associer une valeur de données avec un élément. Il n'est destiné à aucune utilisation particulière, mais vous pouvez y accéder avec un script pour votre usage propre.. +
+ + +
+ +

Propriétés

+

+

+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
+
+ increment
+
+ Type : entier
+
+ Obtient et définit la valeur de l'attribut increment.
+
+
+
min +
Type : entier +
Obtient et définit la valeur de l'attribut min. +
+


+

+ +
+
+
max +
Type : entier +
Obtient et définit la valeur de l'attribut max. +
+


+

+ +
+
+
pageIncrement +
Type : entier +
Obtient et définit la valeur de l'attribut pageincrement. +
+


+

+ +
+
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+ +
+
+
value +
Type : chaîne +
Obtient et définit la valeur de l'attribut value. +
+ +
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+
+
+ decrease()
+
+ Type de retour : + + aucune valeur de retour +
+
+ Diminue la valeur de<magic name="\"PAGENAME\"/"> la boîte numérique l'échelle, l'échelle ou la boîte numérique</magic> de la valeur de l'incrément.
+
+
decreasePage()
+
Type de retour : aucune valeur de retour +
Diminue la valeur de l'échelle de la valeur de pageIncrement. +
+


+

+
+
+ increase()
+
+ Type de retour : + + aucune valeur de retour +
+
+ Augmente la valeur de <magic name="\"PAGENAME\"/">la boîte numérique, XUL:scale = l'échelle, l'échelle ou la boîte numérique</magic> de la valeur de l'incrément.
+
+

 

+ + +
increasePage()
+
Type de retour : aucune valeur de retour +
Augmente la valeur de l'échelle de la valeur de pageIncrement. +
+


+

+ +

Sujets liés

+
Interfaces +
nsIDOMXULControlElement +
+
+
diff --git a/files/fr/archive/mozilla/xul/spacer/index.html b/files/fr/archive/mozilla/xul/spacer/index.html new file mode 100644 index 0000000000..259c7f355f --- /dev/null +++ b/files/fr/archive/mozilla/xul/spacer/index.html @@ -0,0 +1,100 @@ +--- +title: spacer +slug: Archive/Mozilla/XUL/spacer +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/spacer +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un élément qui occupe de l'espace mais n'affiche rien. On l'utilise généralement pour occuper de la place dans un conteneur. Si l'on ne spécifie pas de taille ou de flexibilité à cet élément, le spacer n'occupe aucune place. Si vous voulez créer un léger espacement, pensez à utiliser plutôt un élément separator. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+

Exemples

+
<box>
+  <button label="Gauche"/>
+  <spacer flex="1"/>
+  <button label="Droite"/>
+</box>
+
+

Attributs

+ + + + + + +

Hérités de 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

+
+ +

Propriétés

+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+
Éléments +
separator, splitter +
+
+
diff --git a/files/fr/archive/mozilla/xul/spinbuttons/index.html b/files/fr/archive/mozilla/xul/spinbuttons/index.html new file mode 100644 index 0000000000..e493ea9919 --- /dev/null +++ b/files/fr/archive/mozilla/xul/spinbuttons/index.html @@ -0,0 +1,93 @@ +--- +title: spinbuttons +slug: Archive/Mozilla/XUL/spinbuttons +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/spinbuttons +--- +

+

+
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +
+


+Les spinbuttons sont constitués de deux flèches, une pour augmenter une valeur et une autre pour la diminuer. Ils ne sont pas utilisés comme des éléments distincts, mais en combinaison avec d'autres éléments pour créer un contrôle dont la valeur peut être augmentée et diminuée. +

Par exemple, on utilise les spinbuttons pour les boîtes texte (textbox) de type numérique, ainsi qu'avec les éléments timepicker et datepicker. +

+

Attributs

+ + + + + + +

Hérités de 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

+
+ +

Propriétés

+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +
+
diff --git a/files/fr/archive/mozilla/xul/stack/index.html b/files/fr/archive/mozilla/xul/stack/index.html new file mode 100644 index 0000000000..ac42647df3 --- /dev/null +++ b/files/fr/archive/mozilla/xul/stack/index.html @@ -0,0 +1,93 @@ +--- +title: stack +slug: Archive/Mozilla/XUL/stack +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/stack +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un élément qui affiche ses enfants en pile les uns au dessus des autres. Le premier élément est placé en bas et chacun des enfants successifs est placé au dessus du précédent. Tous les éléments sont affichés en une fois. Des éléments enfants peuvent également être placés à des positions absolues dans la pile. +

Les attributs left et top sur un enfant de l'élément stack spécifient la position de cet élément.

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+

Exemples

+

(exemple nécessaire) +

+

Attributs

+ + + + + + +

Hérités de 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

+
+ +

Propriétés

+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+

deck +

diff --git a/files/fr/archive/mozilla/xul/tabpanels/index.html b/files/fr/archive/mozilla/xul/tabpanels/index.html new file mode 100644 index 0000000000..9c55a5f6dc --- /dev/null +++ b/files/fr/archive/mozilla/xul/tabpanels/index.html @@ -0,0 +1,126 @@ +--- +title: tabpanels +slug: Archive/Mozilla/XUL/tabpanels +translation_of: Archive/Mozilla/XUL/tabpanels +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +
+ +

Conteneur pour maintenir l'ensemble des pages dans tabbox. tabpanels doit être placé dans tabbox bien qu'il n'a pas besoin d'être un enfant direct. Les enfants de tabpanels deviennent les panneaux de tabbox. Dans la plupart des cas vous pouvez utilisez vbox, mais ils peuvent être des éléments quelconques. En cliquant sur le premier onglet, le premier panneau sera affiché. En cliquant sur le deuxième onglet, le deuxième panneau sera affiché et ainsi de suite. Il devrait y avoir le même nombre de panneaux que d'onglets. Les panneaux ne doivent jamais être cachés; le masquage d'un onglet suffit pour rendre son panneau inaccessible.

+ +

Plus d'informations sont disponibles dans le tutoriel XUL .

+ +
+
Attributs
+
selectedIndex
+
+ +
+
Propriétés
+
selectedIndex, selectedPanel
+
+ +

Exemples

+ +

(Exemple nécessaire)

+ +

Attributs

+ +
+ +
+ + + + + +

Hérités de 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

+
+ +

Propriétés

+ +

+
accessible +
Type : nsIAccessible +
Renvoie l'objet d'accessibilité pour l'élément. +
+


+

+ +
+
selectedIndex +
Type : entier +
Renvoie l'indice de l'élément actuellement sélectionné. Un élément peut être sélectionné en assignant son indice à cette propriété. En lui assignant -1, tous les éléments seront désélectionnés. +
+ +
+ +

Méthodes

+ +

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ + + +
+
Elements
+
tabbox, tabs, tab, tabpanel.
+
diff --git a/files/fr/archive/mozilla/xul/textbox/index.html b/files/fr/archive/mozilla/xul/textbox/index.html new file mode 100644 index 0000000000..7511b915f2 --- /dev/null +++ b/files/fr/archive/mozilla/xul/textbox/index.html @@ -0,0 +1,348 @@ +--- +title: textbox +slug: Archive/Mozilla/XUL/textbox +tags: + - Méthodes_XUL + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/textbox +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un champ dans lequel l'utilisateur peut entrer du texte. Il est similaire à l'élément HTML input. Par défaut, une seule ligne de texte est affichée. L'attribut multiline peut être spécifié pour afficher un champ multiligne. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
cols, decimalplaces, disabled, empty, emptytext, hidespinbuttons, increment, label, max, maxlength, min, multiline, newlines, onchange, oninput, preference, readonly, rows, size, spellcheck, tabindex, timeout, type, value, wrap, wraparound +
+
Propriétés +
accessibleType, clickSelectsAll, decimalPlaces, decimalSymbol, defaultValue, disabled, editor, emptyText, increment, inputField, label, max, maxLength, min, readOnly, selectionEnd, selectionStart, size, spinButtons, tabIndex, textLength, timeout, type, value, valueNumber, wrapAround +
+
Méthodes +
decrease, increase, reset, select, setSelectionRange +
+
Classes de style +
plain +
+

Exemples

+
Image:XUL_ref_textbox.png
+
<vbox>
+<label control="your-name" value="Enter your name:"/>
+<textbox id="your-name" value="John"/>
+</vbox>
+
+

Attributs

+

+

+ +
+
+ +
+
+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
+
+ +
+
+ +
+
+ +
+
+ increment
+
+ Type : + + entier +
+
+ La quantité dont l'attribut value (pour les boîtes numériques et les échelles) or curpos<magic name="\"PAGENAME\"/"> (pour les barres de défilement) </magic> change lorsque l'on clique sur les flèches. La valeur par défaut est 1.
+
+
+
+ +
+
+ +
+
+ max
+
+ Type : + + entier +
+
+ La valeur maximum que peut prendre l'élément scale ou number box. La valeur par défaut est 100 pour les éléments scale et Infinity pour les boîtes numériques
+
+
+
+ +
+
+ +
+
+ min
+
+ Type : + + entier +
+
+ La valeur minimum que peut prendre l'élément. La valeur par défaut est 0.
+
+
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
preference +
Type : id d'élément +
Connecte l'élément à une préférence (élément preference) correspondante. Cet attribut n'a d'effet qu'utilisé au sein d'un prefwindow. La valeur de la préférence sera mise à jour pour correspondre à la propriété value de l'élément. +
+ + +
+
+ +
readonly +
Type : booléen +
Si défini à true, l'utilisateur ne peut pas modifier la valeur de l'élément. Cependant, celle-ci peut toujours être modifiée par un script. +
+ + +
+
+ +
rows +
Type : entier +
Le nombre de lignes à afficher dans l'élément. Si l'élément contient plus que ce nombre de lignes, une barre de défilement apparaitra afin que l'utilisateur puisse consulter les autres lignes. Pour obtenir le nombre réel de lignes dans l'élément, utilisez la méthode getRowCount. +
+ + +
+
+ +
+
+ +
+
+ +
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+ + +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+ +

Propriétés

+

+

+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+
+
+
+
+
defaultValue +
Type : chaîne de caractères +
Définit et obtient la valeur par défaut d'une boîte de texte. +
+


+

+ +
+
+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
+
+
+
+ increment
+
+ Type : entier
+
+ Obtient et définit la valeur de l'attribut increment.
+
+
+
+
+
max +
Type : entier +
Obtient et définit la valeur de l'attribut max. +
+


+

+ +
+
+
+
min +
Type : entier +
Obtient et définit la valeur de l'attribut min. +
+


+

+ +
+
+
+
+ readonly
+
+ Type : booléen
+
+ Si définie à true, l'utilisateur ne peut pas modifier la valeur de l'élément.
+
+
+ Cette propriété toute en minuscules n'est utilisée qu'avec l'élément preference et sera peut-être renommée en readOnly dans des versions ultérieures. D'autres éléments utilisent la propriété readOnly. L'attribut correspondant est cependant readonly en minuscules.
+
+
+
+
+
+
+
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+ +
+
+
+
+
type +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut type. +
+ +
+
+
+
+ +

Méthodes

+
+
+ decrease()
+
+ Type de retour : + + aucune valeur de retour +
+
+ Diminue la valeur de<magic name="\"PAGENAME\"/"> la boîte numérique l'échelle, l'échelle ou la boîte numérique</magic> de la valeur de l'incrément.
+
+
+
+ increase()
+
+ Type de retour : + + aucune valeur de retour +
+
+ Augmente la valeur de <magic name="\"PAGENAME\"/">la boîte numérique, XUL:scale = l'échelle, l'échelle ou la boîte numérique</magic> de la valeur de l'incrément.
+
+

 

+ + +
reset() +
Type de retour : aucune valeur renvoyée +
Réinitialise la préférence à sa valeur par défaut. +
Pour un élément textbox, la liste de transactions d'annulation est également vidée (Gecko 1.9). +
+


+

+
select() +
Type retourné : aucune valeur retournée +
Sélectionne l'intégralité du texte d'une boîte texte. +
+


+

+

« Accueil de la référence XUL +

+
setSelectionRange( début, fin ) +
Type retourné : aucune valeur retournée +
Cette méthode sélectionne une portion de texte dans une zone de texte (textbox ou textarea) où l'argument début est le premier caractère de la sélection et l'argument fin le dernier caractère de la sélection.
Renseigner les deux arguments avec la même valeur équivaut à déplacer le curseur d'écriture sans rien sélectionner. +
+


+Interwiki Language Links +

+ + +

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Classes de style

+

Les classes suivantes peuvent être utilisées pour styler l'élément. Ces classes devraient être utilisées au lieu de changer le style de l'élément directement, car elles s'accorderont plus naturellement avec le thème sélectionné par l'utilisateur. +

+
plain
+
This class causes the element to be displayed with no border or margin.
+
+ +

Sujets liés

+
Interfaces +
nsIAccessibleProvider, nsIDOMXULTextboxElement +
+
+
+ diff --git a/files/fr/archive/mozilla/xul/timepicker/index.html b/files/fr/archive/mozilla/xul/timepicker/index.html new file mode 100644 index 0000000000..7dda702b6b --- /dev/null +++ b/files/fr/archive/mozilla/xul/timepicker/index.html @@ -0,0 +1,264 @@ +--- +title: timepicker +slug: Archive/Mozilla/XUL/timepicker +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/timepicker +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

L'élément timepicker est utilisé pour permettre à l'utilisateur d'entrer une heure. Il contient trois champs pour entrer les heures, les minutes et les secondes. Des boutons fléchés à côté de ces champs permettent d'ajuster les valeurs à la souris. Une quatrième boîte de texte apparaît pour les horloges à 12 heures, permettant de sélectionner AM ou PM. +

Pour spécifier la valeur initiale, utilisez l'attribut value sous une forme HH:MM:SS ou HH:MM. La valeur peut être obtenue et modifiée à l'aide des propriétés value ou dateValue. La première spécifie l'heure sous la forme d'une chaîne de la forme HH:MM:SS tandis que la seconde le fait sous la forme d'un objet Date. En outre, les propriétés hour, minute et second peuvent être utilisées pour obtenir ou modifier chaque composante individuellement. +


+

+
Attributs +
disabled, hideseconds, increment, readonly, tabindex, value +
+
Propriétés +
amIndicator, dateValue, disabled, hideSeconds, hour, hourLeadingZero, increment, is24HourClock, isPM, minute, minuteLeadingZero, pmIndicator, readOnly, second, secondLeadingZero, tabIndex, value +
+

Exemples

+
<timepicker value="12:05"/>
+
+

Image:Controlguide-timepicker.png +

+

Attributs

+

+

+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
+
+ hideseconds
+
+ Type : booléen
+
+ Indique si le champ des secondes doit être masqué.
+
+
+
+ +
readonly +
Type : booléen +
Si défini à true, l'utilisateur ne peut pas modifier la valeur de l'élément. Cependant, celle-ci peut toujours être modifiée par un script. +
+ + +
+
+ +
+
+ increment
+
+ Type : entier
+
+ Indique le nombre de minutes à passer chaque fois que les flèches sont actionnées. Cet attribut est à utiliser en combinaison avec une définition de hideseconds à true.
+
+
+
+ +
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+ + +
+
+ +
+
+ value
+
+ Type : chaîne
+
+ La valeur initiale du sélecteur de date au format HH:MM:SS ou HH:MM.
+
+
+ +

Propriétés

+

+

+
amIndicator +
Type : chaîne +
La valeur chaîne affichée pour les heures entre minuit et midi, par défaut « AM ». Cette valeur est déterminée selon la locale de l'utilisateur. +
+


+

+ +
+
+
+
+ dateValue
+
+ Type : Date
+
+ La date actuellement entrée ou sélectionnée dans le sélecteur de date sous la forme d'un objet Date.
+
+
+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
+
+ hideSeconds
+
+ Type : booléen
+
+ Indique si le champ des secondes doit être masqué.
+
+
+
+
+ hour
+
+ Type : entier
+
+ La valeur de l'heure actuellement sélectionnée entre 0 et 23. Modifiez cette propriété pour changer l'heure sélectionnée.
+
+
+
+
+ hourLeadingZero
+
+ Type : booléen
+
+ Une valeur en lecture seule indiquant si un zéro initial doit être affiché avant l'heure lorsque celle-ci est inférieure à 10.
+
+
+
+
+ increment
+
+ Type : entier
+
+ Obtient et définit la valeur de l'attribut increment.
+
+
+
+
+ is24HourClock
+
+ Type : booléen
+
+ Une valeur en lecture seule indiquant si l'heure est affichée à l'aide d'une horloge à 24 ou 12 heures. Avec une horloge à 12 heures, un champ supplémentaire permet à l'utilisateur de choisir entre AM et PM.
+
+
+
+
+ isPM
+
+ Type : booléen
+
+ Si cette propriété est à false, l'heure est entre 0 et 11. Si elle est à true, l'heure est supérieure ou égale à 12.
+
+
+
+
+ minute
+
+ Type : entier
+
+ Les minutes de l'heure actuellement sélectionnée entre 0 et 59. Modifiez cette propriété pour changer la minute sélectionnée.
+
+
+
+
+ minuteLeadingZero
+
+ Type : booléen
+
+ Une valeur en lecture seule indiquant si un zéro initial doit être affiché avant la valeur des minutes lorsque celle-ci est inférieure à 10.
+
+
+
+
+ pmIndicator
+
+ Type : chaîne
+
+ La valeur chaîne affichée pour les heures entre midi et minuit, par défaut « PM ». Cette valeur est déterminée selon la locale de l'utilisateur.
+
+
+
+
+ readonly
+
+ Type : booléen
+
+ Si définie à true, l'utilisateur ne peut pas modifier la valeur de l'élément.
+
+
+ Cette propriété toute en minuscules n'est utilisée qu'avec l'élément preference et sera peut-être renommée en readOnly dans des versions ultérieures. D'autres éléments utilisent la propriété readOnly. L'attribut correspondant est cependant readonly en minuscules.
+
+
+
+
+
+ second
+
+ Type : entier
+
+ La valeur des secondes de l'heure actuellement sélectionnée, entre 0 et 59. Modifiez cette propriété pour changer la seconde sélectionnée.
+
+
+
+
+ secondLeadingZero
+
+ Type : booléen
+
+ Une valeur en lecture seule indiquant si un zéro initial doit être affiché avant la valeur des secondes si celle-ci est inférieure à 10.
+
+
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+ +
+
+
+
+ value
+
+ Type : chaîne
+
+ L'heure actuellement entrée sous la forme HH:MM:SS. Modifiez cette propriété pour changer cette heure.
+
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+
Interfaces +
nsIDOMXULControlElement +
+
+
diff --git "a/files/fr/archive/mozilla/xul/toolbars/cr\303\251ation_de_boutons_de_barre_d'outils/index.html" "b/files/fr/archive/mozilla/xul/toolbars/cr\303\251ation_de_boutons_de_barre_d'outils/index.html" new file mode 100644 index 0000000000..0b38c79357 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/toolbars/cr\303\251ation_de_boutons_de_barre_d'outils/index.html" @@ -0,0 +1,127 @@ +--- +title: Création de boutons de barre d'outils +slug: Archive/Mozilla/XUL/Toolbars/Création_de_boutons_de_barre_d'outils +tags: + - Extensions +translation_of: Archive/Mozilla/XUL/Toolbars/Creating_toolbar_buttons +--- +

 

+

Cet article explique comment ajouter un bouton à la barre d'outils d'une application (comme Firefox, Thunderbird, Nvu, etc.) en utilisant la technique des overlays. Cet article s'adresse aux développeurs d'extensions connaissant les bases de XUL et CSS.

+

Le lecteur est supposé être familiarisé avec les bases de la création d'extensions pour Firefox et avoir fait fonctionner sa première extension. Un tutoriel vous guidant à travers le processus depuis le début est également disponible.

+

 

+

Création d'un overlay

+

Avant tout, vous devez créer un overlay pour le document qui contient la barre d'outils que vous souhaitez améliorer. Le but de ce tutoriel n'est pas d'expliquer les overlays — vous pouvez trouver de précieuses informations à ce sujet dans le Tutoriel XUL.

+

Pour créer un overlay sur un document, vous devez connaître son URI. Vous trouverez en bas de cette page la liste des documents où les overlays sont créés le plus fréquemment.

+
+ Note : certains placent un overlay sur + + chrome://messenger/content/mailWindowOverlay.xul + . Cela devrait faire apparaitre le bouton sur toutes les fenêtres auxquelles mailWindowOverlay.xul s'applique (c'est-à-dire la fenêtre principale et la fenêtre de messages). Cela doit être vérifié.
+

Ajout d'un bouton à la barre d'outils

+

Les applications toolkit ont une barre d'outils personnalisable. La méthode la plus pratique dans une extension est donc d'ajouter les boutons de la barre d'outils dans la palette plutôt que de les ajouter directement dans la barre d'outils. Cette dernière option est possible mais peu recommandée et plus difficile à mettre en œuvre.

+

L'ajout d'un bouton à la palette de la barre d'outils est très simple. Il suffit d'ajouter ce code à l'overlay :

+
+<toolbarpalette id="BrowserToolbarPalette">
+  <toolbarbutton id="myextension-button" class="toolbarbutton-1"
+    label="&toolbarbutton.label;" tooltiptext="&toolbarbutton.tooltip;"
+    oncommand="MyExtension.onToolbarButtonCommand(event);"/>
+</toolbarpalette>
+
+

Notes :

+ +
onclick: function(event) {
+  switch(event.button) {
+    case 0:
+      // Clic gauche
+      break;
+    case 1:
+      // Clic milieu
+      break;
+    case 2:
+      // Clic droit
+      break;
+  }
+}
+
+

Pour ajouter plus de boutons, il suffit de mettre d'autres éléments <toolbarbutton> dans l'élément <toolbarpalette>. Placez les éléments autres que des boutons de barre d'outils dans un élément <toolbaritem>.

+

Application d'un style sur le bouton

+

Le plus souvent, les boutons ont des icônes. Pour attacher une image à un bouton, on utilise une des fonctionnalités standard de Mozilla pour le personnaliser. Si vous n'êtes pas familier avec celle-ci, lisez la section skinning de l'excellent Toolbar Tutorial de Jonah Bishop (en anglais). Bien que l'article décrive la création d'une barre d'outils complètement personnalisée plutôt que d'un simple bouton, il contient une très bonne explication des techniques que nous allons employer.

+

Taille des icônes

+

Les boutons pour la barre d'outils peuvent avoir deux tailles différentes — grande et petite. Ceci implique que vous allez devoir fournir de icônes différentes pour chaque bouton de votre barre d'outils. Vous trouverez ci-dessous les dimensions des icônes dans diverses applications (n'hésitez pas à en ajouter d'autres) :

+

<tr> <td>Firefox 1.0 (Winstripe)</td> <td>24x24</td> <td>16x16</td> </tr> <tr> <td>Thunderbird 1.0 (Qute)</td> <td>24x24</td> <td>16x16</td> </tr> </table>

+

Feuille de style

+

Pour paramétrer l'image de votre bouton de barre d'outils, utilisez les règles CSS suivantes :

+
/*  skin/toolbar-button.css  */
+
+#myextension-button {
+  list-style-image: url("chrome://myextension/skin/btn_large.png");
+}
+
+toolbar[iconsize="small"] #myextension-button {
+  list-style-image: url("chrome://myextension/skin/btn_small.png");
+}
+
+

Appliquer la feuille de style

+

Souvenez-vous d'associer la feuille de style que vous avez créée à la fois à l'overlay et à la fenêtre de personnalisation de la barre d'outils.

+
<?xml-stylesheet href="chrome://myextension/skin/toolbar-button.css" type="text/css"?>
+
+

Pour l'associer à la fenêtre de personnalisation (chrome://global/content/customizeToolbar.xul), vous pouvez utiliser <tt>skin/contents.rdf</tt>, comme ceci :

+
<?xml version="1.0"?>
+<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+     xmlns:chrome="http://www.mozilla.org/rdf/chrome#">
+
+  <Seq about="urn:mozilla:skin:root">
+    <li resource="urn:mozilla:skin:classic/1.0"/>
+  </Seq>
+
+  <Description about="urn:mozilla:skin:classic/1.0">
+    <chrome:packages>
+      <Seq about="urn:mozilla:skin:classic/1.0:packages">
+        <li resource="urn:mozilla:skin:classic/1.0:myextension"/>
+      </Seq>
+    </chrome:packages>
+  </Description>
+
+  <Seq about="urn:mozilla:stylesheets">
+    <li resource="chrome://global/content/customizeToolbar.xul"/>
+  </Seq>
+
+  <Seq about="chrome://global/content/customizeToolbar.xul">
+    <li>chrome://myextension/skin/toolbar-button.css</li>
+  </Seq>
+</RDF>
+
+

Les extensions pour Firefox et Thunderbird 1.5 doivent plutôt utiliser quelque chose de semblable à ceci dans le chrome.manifest :

+
skin	myextension	classic/1.0	chrome/skin/
+style	chrome://global/content/customizeToolbar.xul	chrome://myextension/skin/toolbar-button.css
+
+

Erreurs fréquentes

+

Voici une liste des erreurs fréquemment commises par les auteurs d'extensions, avec leurs symptômes et leurs solutions.

+

Problème : un assemblage de tous les boutons standards est dessiné à la place de votre propre icône.

+

Cause : feuille de style mal formée ou non appliquée.

+

Solution : vérifiez votre feuille de style, vérifiez si votre content.rdf (ou chrome.manifest) est correct, assurez-vous que vous n'avez pas oublié d'appliquer la feuille de style à customizeToolbar.xul.

+

Liste des fenêtres où les overlays de la barre d'outils sont fréquents

+ + + + + + +
Application (nom du thème)</th> + 
+   <td class="header">Taille de la grande icône</th>
+   <td class="header">Taille de la petite icône</th>
+
+
+

URL Applications et fenêtres modifiées Id de la palette chrome://browser/content/browser.xulFirefox - Fenêtre principaleBrowserToolbarPalette chrome://messenger/content/messenger.xulThunderbird - Fenêtre principaleMailToolbarPalette chrome://messenger/content/ messengercompose/messengercompose.xulThunderbird - Fenêtre de rédaction MsgComposeToolbarPalette chrome://messenger/content/addressbo...ddressbook.xulThunderbird - Carnet d'adressesAddressBookToolbarPalette chrome://editor/content/editor.xulNvu - Fenêtre principaleNvuToolbarPalette chrome://calendar/content/calendar.xulSunbird - Fenêtre principalecalendarToolbarPalette

+

Plus d'informations

+ diff --git a/files/fr/archive/mozilla/xul/toolbars/index.html b/files/fr/archive/mozilla/xul/toolbars/index.html new file mode 100644 index 0000000000..7e4f743d2a --- /dev/null +++ b/files/fr/archive/mozilla/xul/toolbars/index.html @@ -0,0 +1,72 @@ +--- +title: Toolbars +slug: Archive/Mozilla/XUL/Toolbars +tags: + - TopicStub +translation_of: Archive/Mozilla/XUL/Toolbars +--- +

Les barres d'outils, implémentées à l'aide de l'élément XUL toolbar, sont des conteneurs pour les boutons de la barre d'outils et d'autres objets d'interface utilisateur. Les articles suivants fournissent des détails sur l'implémentation et l'utilisation des barres d'outils.

+ + + + + + + + +
+

Documentation

+ +
+
XUL School: Ajout de barres d'outils et de boutons de barre d'outils
+
Un didacticiel utile pour créer des barres d'outils et des boutons de barre d'outils.
+
Événements de personnalisation de la barre d'outils
+
Un aperçu des événements envoyés lors de la personnalisation de la barre d'outils; vous pouvez les utiliser pour être informé des modifications apportées aux barres d'outils.
+
Création de boutons de barre d'outils
+
Comment utiliser les superpositions pour ajouter des boutons de barre d'outils aux applications Mozilla.
+
Bouton de la barre d'outils personnalisée
+
Un autre exemple de création d'un bouton de barre d'outils, avec un exemple d'extension que vous pouvez télécharger et essayer.
+
Extraits de code: barre d'outils
+
Extraits de code utiles lorsque vous utilisez des barres d'outils.
+
+
+ +

Afficher toutes les pages marquées avec "Barres d'outils"...

+ 		+

Communauté

+ + + +

Outils

+ + + +

... plus d'outils ...

+ + + + +
diff --git a/files/fr/archive/mozilla/xul/toolbox/index.html b/files/fr/archive/mozilla/xul/toolbox/index.html new file mode 100644 index 0000000000..459d64989d --- /dev/null +++ b/files/fr/archive/mozilla/xul/toolbox/index.html @@ -0,0 +1,127 @@ +--- +title: toolbox +slug: Archive/Mozilla/XUL/toolbox +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/toolbox +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un conteneur pour les éléments toolbar. C'est un type de boîte dont l'orientation par défaut est verticale. Si un élément toolbar est placé dans un toolbox, une poignée (élément grippy) est affichée sur son bord gauche ou supérieur. L'utilisateur peut cliquer sur le grippy pour réduire l'élément toolbar. Si plusieurs barres d'outils sont placées dans le même toolbox, elles seront toutes réduites dans la même ligne. Le navigateur Firefox n'a pas ces contrôles grippy, les barres d'outils ne peuvent donc pas y être réduites. +

Vous trouverez plus d'informations dans le Tutoriel XUL.

+
Propriétés +
accessible, customToolbarCount, palette, toolbarset +
+
Méthodes +
appendCustomToolbar, collapseToolbar, expandToolbar +
+

Exemples

+

(exemple nécessaire) +

+

Attributs

+ + + + + + +

Hérités de 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

+
+ +

Propriétés

+

+

+
accessible +
Type : nsIAccessible +
Renvoie l'objet d'accessibilité pour l'élément. +
+


+

+ +
+
+
+
+ +

Méthodes

+ + + + + + +
+

Héritées de XUL element
+ blur, click, doCommand, focus, getElementsByAttribute getElementsByAttributeNS

Héritées de DOM element
+ addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()

+ +
+ + + + +

Sujets liés

+
Éléments +
toolbar, toolbarbutton, toolbargrippy, toolbaritem, toolbarpalette, toolbarseparator, toolbarset, toolbarspacer, toolbarspring +
+
Interfaces +
nsIAccessibleProvider +
+
+
diff --git a/files/fr/archive/mozilla/xul/tooltip/index.html b/files/fr/archive/mozilla/xul/tooltip/index.html new file mode 100644 index 0000000000..abc9a0ffbd --- /dev/null +++ b/files/fr/archive/mozilla/xul/tooltip/index.html @@ -0,0 +1,225 @@ +--- +title: tooltip +slug: Archive/Mozilla/XUL/tooltip +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/tooltip +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Cet élément est utilisé pour les popups de bulles d'information. Pour les tooltip texte, il n'est pas nécessaire d'utiliser cet élément ; vous pouvez dans ce cas simplement ajouter un attribut tooltiptext à l'élément.

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
crop, default, label, noautohide, onpopuphidden, onpopuphiding, onpopupshowing, onpopupshown, position +
+
Propriétés +
accessibleType, label, popupBoxObject, position, state +
+
Méthodes +
hidePopup, moveTo, openPopup, openPopupAtScreen, showPopup, sizeTo +
+

Exemples

+
Image:XUL_ref_tooltip.png
+
<tooltip id="moretip" orient="vertical" style="background-color: #33DD00;">
+  <label value="Cliquez ici pour obtenir plus d'infomations"/>
+  <label value="Vraiment !" style="color: red;"/>
+</tooltip>
+
+<vbox>
+  <button label="Simple" tooltiptext="Un popup simple"/>
+  <button label="Plus" tooltip="moretip"/>
+</vbox>
+
+

Attributs

+

+

+ +
crop +
Type : une des valeurs ci-dessous +
Si le label de l'élément est trop long pour être contenu dans son espace donné, le texte sera tronqué du côté indiqué par l'attribut crop. Une ellipse (…) sera utilisée à la place du texte tronqué. Si la direction de la boîte est inversée, le tronquage l'est également. +
+ + + +
+
+ +
+
+ +
label +
Type : chaîne de caractères +
Le label qui apparaîtra sur l'élément. S'il n'est pas spécifié, aucun texte n'apparaîtra. +
+ + +
+
+ +
+
+ +
onpopuphidden +
Type : code de script +
Cet évènement est envoyé à un popup après qu'il a été caché. http://www.langue-fr.net/index/A/apres-que.htm +
+ + +
+
+ +
onpopuphiding +
Type : code de script +
Cet évènement est envoyé à un popup lorsqu'il est sur le point d'être masqué. +
+ + +
+
+ +
onpopupshowing +
Type : code de script +
Cet évènement est envoyé à un popup juste avant son ouverture. On l'utilise généralement pour définir dynamiquement le contenu lorsque l'utilisateur demande son affichage. Si ce gestionnaire d'évènement renvoie false, le popup ne s'affichera pas. +
+ + +
+
+ +
onpopupshown +
Type : code de script +
Cet évènement est envoyé à un popup après son ouverture, de la même manière qu'un évènement onload est envoyé à une fenêtre à son ouverture. +
+ + +
+
+ +
position +
Type : une des valeurs ci-dessous +
L'attribut position détermine où le popup apparaît par rapport à l'élément sur lequel l'utilisateur a cliqué pour l'invoquer. C'est ce qui permet de placer le popup sur le bord d'un bouton. +
+ + + +
+ +

Propriétés

+

+

+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+
+
label +
Type : chaîne de caractères +
Obtient et définit la valeur de l'attribut label. +
+ +
+
+
popupBoxObject +
Type : nsIPopupBoxObject +
Cette propriété en lecture seule conserve le nsIPopupBoxObject qui implémente le popup. Il n'est normalement pas nécessaire d'utiliser cette propriété étant donné que toutes ses fonctions sont disponibles via le popup lui-même. +
+ +
+
+
position +
Type : chaîne +
Obtient et définit la valeur de l'attribut position. +
+ +
+
+
state +
Type : chaîne +
Cette propriété en lecture seule indique si le popup est ouvert ou non. Quatre valeurs sont possibles : +
+ + +
+ +

Méthodes

+ + + + + + +
+

Héritées de XUL element
+ blur, click, doCommand, focus, getElementsByAttribute getElementsByAttributeNS

Héritées de DOM element
+ addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()

+ +
+
hidePopup()
+
Type de retour : pas de valeur de retour +
Ferme le popup immédiatement. +
+
moveTo( x, y ) +
Type de retour : pas de valeur de retour +
Déplace le popup vers un nouvel emplacement. +
+
openPopup( anchor , position , x , y , isContextMenu, attributesOverride ) +
Type de retour : pas de valeur de retour +
+

Ouvre le popup relativement à un nœud spécifié à un emplacement spécifique. +

Le popup peut soit être ancré à un autre nœud ou ouvert librement. Pour ancrer un popup à un nœud, fournissez un nœud d'accrochage dans le paramètre anchor et définissez la position par une chaîne indiquant la manière dont le popup doit être ancré. +

Les valeurs possibles pour le paramètre position sont : before_start, before_end, after_start, after_end, start_before, start_after, end_before, end_after, overlap, after_pointer +

Le nœud d'accrochage ne doit pas nécessairement être dans le même document que le popup. +

Si le paramètre attributesOverride vaut true, l'attribut position sur le nœud popup a priorité sur la valeur du paramètre position. Si attributesOverride vaut false, l'attribut n'est utilisé que si le paramètre position est vide. +

Pour un popup ancré, les paramètres x et y peuvent être utilisés pour décaler le popup de sa position d'ancrage de quelques pixels (mesurés en pixels CSS). +

Les popups non ancrés peuvent être créés en fournissant null comme paramètre anchor. Un popup non ancré apparait à la position spécifiée par x et y relativement à la zone visible (viewport) du document contenant le nœud popup. Dans ce cas, les paramètres position et attributesOverride sont ignorés. +

+
openPopupAtScreen( x, y, isContextMenu ) +
Type de retour : pas de valeur de retour +
+

Ouvre le popup à une position spécifique sur l'écran spécifiée par x et y. Cette position peut être ajustée s'il s'avère qu'elle provoquerait l'apparition du popup en dehors de l'écran. Les coordonnées x et y sont mesurées en pixels CSS. +

+
showPopup( element, x, y, popupType, anchor, align ) Déprécié dans Mozilla 1.9 +
Type de retour : aucune valeur de retour +
Ouvre un élément popup. Deux moyens de spécifier l'emplacement où s'affichera la fenêtre popup existent, soit en spécifiant une position spécifique de l'écran, soit par rapport à un autre élément de la fenêtre. Si x ou y sont définies par une valeur, le popup apparaîtra aux coordonnées (x,y) de l'écran. Si x et y sont définies à -1, le popup sera positionné par rapport à l'element spécifié dans le premier paramètre. C'est cette dernière méthode qu'il faut utiliser, par exemple, pour afficher un popup sous un bouton. Dans ce cas, les paramètres anchor et align peuvent être utilisés pour contrôler plus avant l'endroit où apparaîtra le popup par rapport à l'élément. Le paramètre anchor correspond à l'attribut popupanchor de l'élément et le paramètre align correspond à l'attribut popupalign. Les paramètres anchor et align sont ignorés si ni x ni y ne valent -1. +
+
Pour qu'un popup apparaisse à une position relative à un autre élément tout en étant décalé de quelques pixels, déterminez la position réelle de l'élément à l'aide de ses propriétés boxObject.screenX et boxObject.screenY, et utilisez celles-ci comme paramètres x et y en y ajoutant les décalages souhaités. +
+
Le paramètre popupType doit être une des chaînes popup, context ou tooltip. Chaque type de popup est destiné à être affiché temporairement ; ils ne sont pas censés être affichés de façon permanente. On ne peut afficher qu'un popup à la fois. +
+
sizeTo( <i>largeur</i>, <i>hauteur</i> ) +
Type de retour : aucune valeur de retour +
Modifie la taille actuelle de la fenêtre popup avec les nouvelles dimensions largeur et hauteur. +
+ +

Sujets liés

+

À faire +

+
+
diff --git a/files/fr/archive/mozilla/xul/tree/index.html b/files/fr/archive/mozilla/xul/tree/index.html new file mode 100644 index 0000000000..22056c4d02 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tree/index.html @@ -0,0 +1,313 @@ +--- +title: tree +slug: Archive/Mozilla/XUL/tree +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/tree +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Représente un arbre, un conteneur pouvant être utilisé pour un ensemble de lignes d'éléments tabulaires ou hiérarchiques. L'arbre peut contenir un nombre quelconque de lignes et de colonnes. Chaque ligne de l'arbre peut contenir des lignes filles qui seront affichées avec un décalage par rapport à leur parent. Contrairement aux autres éléments, les données à afficher à l'intérieur de l'arbre ne sont pas spécifiées à l'aide de balises, mais sont déterminées par un objet de vue. L'objet de vue implémente l'interface nsITreeView. La vue est interrogée pour les données à afficher dans l'arbre. Les arbres sont utilisées de différentes manières, comme montré dans la table ci-dessous. La deuxième colonne liste les interfaces disponibles via la propriété view de l'arbre. La troisième colonne indique si l'élément treeitem est utilisé. +

Si vous désirez que l'arbre puisse défiler horizontalement, définissez simplement l'attribut width pour chaque colonne de sorte que l'arbre soit plus large que son objet conteneur. +

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Type d'arbreInterfaces de la vueA des nœuds DOM ?Description
Arbre de contenunsITreeView, nsITreeContentViewOuiCet arbre dispose d'éléments treeitem placés au sein de l'élément treechildren. Dans cette situation, une vue de contenu (qui implémente l'interface nsITreeContentView) qui est un type de vue plus spécialisé, utilise les éléments treeitem et leurs descendants pour déterminer les données à afficher dans l'arbre. Toutefois, les éléments treeitem ne sont pas affichés directement ; ils ne sont utilisés que comme données pour la vue de contenu. La vue de contenu mettra cependant automatiquement à jour l'arbre si les éléments treeitem sont modifiés.
Arbre RDFnsITreeView, nsIXULTreeBuilderNonCet arbre est généré depuis une source de données RDF. Il est utilisé lorsqu'un arbre a un attribut datasources, ainsi que la valeur dont-build-content dans son attribut flags. Pour cet arbre, les données viennent directement de la source de données RDF. Aucun élément DOM treeitem n'est créé. Même si le template utilise des éléments treeitem pour définir le contenu, aucun nœud DOM correspondant ne sera créé. C'est le type à utiliser pour les arbres générés par RDF avec beaucoup de lignes.
Arbre de contenu RDFnsITreeView, nsIXULTreeBuilder, nsITreeContentViewOuiCet arbre est généré depuis une source de données RDF. Il est similaire au type précédent, mais est utilisé lorsque l'arbre n'a pas la valeur dont-build-content dans son attribut flags. Des éléments treeitem sont créés dans le DOM, afin de pouvoir y accéder à l'aide de fonctions RDF ou DOM. Ce type convient aux arbres générés par RDF qui n'ont pas beaucoup de lignes.
Vue d'arbre personnaliséensITreeViewNonPour ce type d'arbre, vous implémentez vous-même l'interface nsITreeView. Les données de l'arbre sont obtenues depuis cette vue personnalisée. La vue personnalisée doit être attachée à l'arbre à l'aide de la propriété view.
+

Vous trouverez plus d'informations dans le Tutoriel XUL. Consultez également Changements dans les contrôles d'arbres. +

+ +
Recommandations d'accessibilité liées +
  • Fournissez un accès alternatif (par exemple via des menus) aux sélecteurs de colonnes et pour les actions sur les en-têtes comme les tris (ceux-ci ne sont pas accessible au clavier par défaut). +
+
+
Attributs +
disableKeyNavigation, disabled, editable, enableColumnDrag, flags, hidecolumnpicker, onselect, rows, seltype, statedatasource, tabindex +
+
Propriétés +
accessibleType, builderView, columns, contentView, currentIndex, disableKeyNavigation, disabled, editingColumn, editingRow, enableColumnDrag, firstOrdinalColumn, inputField, selType, selstyle, tabIndex, treeBoxObject, view +
+

Exemples

+
<tree flex="1">
+
+  <treecols>
+    <treecol id="sender" label="Expéditeur" flex="1"/>
+    <treecol id="subject" label="Sujet" flex="2"/>
+  </treecols>
+
+  <treechildren>
+    <treeitem>
+      <treerow>
+        <treecell label="pat@example.com"/>
+        <treecell label="Plans top secrets"/>
+      </treerow>
+    </treeitem>
+    <treeitem>
+      <treerow>
+        <treecell label="mel@example.com"/>
+        <treecell label="Allons manger quelque part"/>
+      </treerow>
+    </treeitem>
+  </treechildren>
+
+</tree>
+
+
Image:trees1.png
+

Un arbre avec des éléments imbriqués : +

+
<tree id="myTree" flex="1" hidecolumnpicker="false" seltype="single" class="tree">
+  <treecols id="myTree2-treeCols">
+    <treecol id="myTree2-treeCol0" primary="true" flex="2" label="Colonne A"
+             persist="width" ordinal="1"/>
+    <splitter class="tree-splitter" ordinal="2"/>
+    <treecol id="myTree2-treeCol1" flex="1" label="Colonne B"
+             persist="width" ordinal="3"/>
+  </treecols>
+  <treechildren>
+    <treeitem>
+      <treerow>
+        <treecell label="1"/>
+        <treecell label="a"/>
+      </treerow>
+    </treeitem>
+    <!-- Assurez-vous de mettre container="true" -->
+    <treeitem container="true" open="true">
+      <treerow>
+        <treecell label="2"/>
+        <treecell label="b"/>
+      </treerow>
+      <treechildren>
+        <treeitem>
+          <treerow>
+            <treecell label="2a"/>
+            <treecell label="ba"/>
+          </treerow>
+        </treeitem>
+      </treechildren>
+    </treeitem>
+  </treechildren>
+</tree>
+
 +

Attributs

+

+

+ +
disabled +
Type : booléen +
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.
+


+

+
Image:XUL_ref_attr_disabled.png
+
<!-- La case à cocher active/désactive le bouton -->
+<checkbox label="Enable button"
+    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
+<button id="buttRemove" label="Remove All" disabled="true"/>
+
+
+
+ +
+
+ +
+
+ +
+
+ +
flags +
Type : liste de valeurs (voir ci-dessous) séparées par des espaces +
Un ensemble de drapeaux destinés à différentes utilisations. Deux sont définis, et peuvent être la valeur de cet attribut. +
+ +


+

+ + +
+
+ +
+
+ +
+
+ +
rows +
Type : entier +
Le nombre de lignes à afficher dans l'élément. Si l'élément contient plus que ce nombre de lignes, une barre de défilement apparaitra afin que l'utilisateur puisse consulter les autres lignes. Pour obtenir le nombre réel de lignes dans l'élément, utilisez la méthode getRowCount. +
+ + +
+
+ +
+
+ seltype<magic name="\"PAGENAME\"/"></magic>
+
+ Type : + + une des valeurs ci-dessous +
+
+ Utilisé pour indiquer si les sélections multiples sont permises.
+
+ +

<magic name="\"PAGENAME\"/">Des cellules individuelles peuvent être sélectionnées.</magic><magic name="\"PAGENAME\"/"> Des lignes sont sélectionnées, cependant, l'indicateur de sélection n'est visible que sur le texte de la colonne principale.</magic>

+
+
+ +
+
+ +
tabindex +
Type : entier +
L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le tabindex est plus haut se trouvent plus tard dans la séquence de tabulation. +
+ + +
+ +

Propriétés

+

+

+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+
+
+
+
+
+
disabled +
Type : booléen +
Obtient et définit la valeur de l'attribut disabled. +
+ +
+
+
+
+
+
+
+
+
+
+ selType<magic name="\"PAGENAME\"/"></magic>
+
+ Type : + + chaîne de caractères +
+
+ Obtient et définit la valeur de l'attribut seltype.
+
+ +
+
+
+
tabIndex +
Type : entier +
Obtient et définit la valeur de l'attribut tabindex. +
+ +
+
+
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ + + +

Sujets liés

+
Éléments +
treecols, treecol, treechildren, treeitem, treerow, treecell et treeseparator. +
Interfaces +
nsIAccessibleProvider, nsIDOMXULTreeElement, nsIDOMXULMultiSelectControlElement +
+

Exemples de scripts

+

Pour alterner les couleurs de fond pour chaque ligne, utilisez des règles de styles comme les souvantes : pma at daffodil dot uk dot com +

+
treechildren::-moz-tree-row(selected) { background-color: #FFFFAA; }
+treechildren::-moz-tree-row(odd) { background-color: #EEEEEE; }
+treechildren::-moz-tree-row(odd, selected) { background-color: #FFFFAA; }
+treechildren::-moz-tree-cell-text(selected) { color: #000000; }
+treechildren::-moz-tree-cell-text(odd, selected) { color: #000000; }
+
 +

Si vous utilisez une vie d'arbre de contenu, utilisez le code suivant pour obtenir la valeur de l'attribut id de chacune des lignes sélectionnées de l'arbre : tcooper_mont at yahoo dot com +

+
var rangeCount = tree.view.selection.getRangeCount();
+for (var i = 0; i < rangeCount; i++)
+{
+   var start = {};
+   var end = {};
+   tree.view.selection.getRangeAt(i, start, end);
+   for (var c = start.value; c <= end.value; c++)    {
+      idList.push(tree.view.getItemAtIndex(c).firstChild.id);
+   }
+}
+
 +

Le code qui soit renvoie un tableau des indices de lignes pour lesquelles la valeur est cochée dans une colonne de type checkbox : +jfabre at ismans dot fr +

+
function getCellChecked(tree, columnid)
+{
+  var arr = [];
+  var column = tree.columns.getNamedColumn(columnid);
+  for (var i = 0; i < tree.view.rowCount; i++) {
+    if (tree.view.getCellValue(i, column) == 'true')
+      arr.push(i);
+  }
+  return arr;
+}
+
 +

Pour obtenir la valeur textuelle d'une colonne particulière (par exemple la colonne age) de la ligne ayant actuellement le focus dans l'arbre : +

+
var t = document.getElementById('mytree');
+document.title = t.view.getCellText(t.currentIndex, t.columns.getNamedColumn('age'));
+
 diff --git a/files/fr/archive/mozilla/xul/treecell/index.html b/files/fr/archive/mozilla/xul/treecell/index.html new file mode 100644 index 0000000000..b54c0485bd --- /dev/null +++ b/files/fr/archive/mozilla/xul/treecell/index.html @@ -0,0 +1,83 @@ +--- +title: treecell +slug: Archive/Mozilla/XUL/treecell +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/treecell +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Une cellule unique dans un arbre (élément tree). Cet élément doit être placé dans un treerow. Le texte de la cellule peut être défini à l'aide de l'attribut label. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
editable, label, mode, properties, ref, src, value +
+

Attributs

+

+

+ +
+
+ +
label +
Type : chaîne de caractères +
Le label qui apparaîtra sur l'élément. S'il n'est pas spécifié, aucun texte n'apparaîtra. +
+ + +
+
+ +
+
+ +
properties +
Type : liste de noms de propriétés séparés par des espaces +
Définit les propriétés de l'élément, qui peuvent être utilisées pour le styler. Pour plus d'informations, consultez Styler un arbre. +
+ + +
+
+ +
ref +
Type : URI d'une ressource RDF +
Pour les éléments générés par des templates, cet attribut est utilisé pour indiquer le nœud racine RDF où la génération de contenu commence. Ceci correspondra à la valeur d'un attribut about sur un conteneur RDF. Cet attribut doit être placé en même temps que l'attribut datasources. +
+ + +
+
+ +
+
+ +
value +
Type : chaîne +
Cet attribut chaîne permet d'associer une valeur de données avec un élément. Il n'est destiné à aucune utilisation particulière, mais vous pouvez y accéder avec un script pour votre usage propre.. +
+ + +
+ +

Propriétés

+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+
Éléments +
tree treecols, treecol, treechildren, treeitem, treerow et treeseparator. +
+
+
diff --git a/files/fr/archive/mozilla/xul/treechildren/index.html b/files/fr/archive/mozilla/xul/treechildren/index.html new file mode 100644 index 0000000000..a0e1d2a21a --- /dev/null +++ b/files/fr/archive/mozilla/xul/treechildren/index.html @@ -0,0 +1,101 @@ +--- +title: treechildren +slug: Archive/Mozilla/XUL/treechildren +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/treechildren +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Cet élément est le corps d'un élément tree. Pour les arbres de contenu, celui-ci sera placé dans cet élément. Cet élément est également utilisé pour définir des lignes de contenu dans l'arbre. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
alternatingbackground +
+

Exemples

+

(exemple nécessaire)

+

Attributs

+
+ +
+ + + + + + +

Hérités de 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

+
+ +

Propriétés

+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+
Éléments +
tree, treecols, treecol, treeitem, treerow, treecell et treeseparator. +
+
+
diff --git a/files/fr/archive/mozilla/xul/treecol/index.html b/files/fr/archive/mozilla/xul/treecol/index.html new file mode 100644 index 0000000000..4073cfd1ce --- /dev/null +++ b/files/fr/archive/mozilla/xul/treecol/index.html @@ -0,0 +1,187 @@ +--- +title: treecol +slug: Archive/Mozilla/XUL/treecol +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/treecol +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Une colonne dans un élément tree. Cet élément affiche l'en-tête de colonne et conserve la taille et d'autres informations sur la colonne. VOus pouvez également placer des éléments splitter entre les colonnes pour permettre leur redimensionnement. Placez toujours un attribut id sur un élément treecol pour vous assurer que son positionnement sera géré correctement. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
crop, cycler, dragging, editable, fixed, hidden, hideheader, ignoreincolumnpicker, label, primary, sort, sortActive, sortDirection, src, type, width +
+
Propriétés +
accessibleType +
+
Classes de style +
treecol-image +
+

Exemples

+
Image:Xul_tree_col_checked.png
+

Cet exemple montre une case à cocher dans la première colonne, et utilise le style présenté plus bas. +

+
<tree flex="1">
+
+  <treecols>
+    <treecol label="Actif" type="checkbox" editable="true"/>
+    <treecol label="Nom" 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>
+
+

Pour rendre la case à cocher visible sur certaines plateformes, les styles suivants doivent être ajoutés à la feuille de style (voir treecol.type). Dans Firefox 2.x et 3.x, tous les systèmes autres que Mac OS X utilisent déjà ces styles par défaut. Si vous visez Firefox sous Mac OS X, assurez-vous d'utiliser ces styles tout en fournissant votre propre image de case à cocher. Notez que chrome://global/skin/checkbox/cbox-check.gif est disponible dans SeaMonkey sous Mac OS X. +

+
treechildren::-moz-tree-checkbox {
+  /* cases à cocher non cochées dans des treecells. Ce style DOIT être avant treechildren::-moz-tree-checkbox(checked), autrement il n'aura aucun effet.  */
+  list-style-image: none;
+}
+
+treechildren::-moz-tree-checkbox(checked){
+  /* style pour les cases cochées. cbox-check.gif n'est pas disponible dans Firefox 1, 2 et 3 sous Mac OS X, vous devrez donc spécifier l'URL d'une image
+     dans votre extension ou ailleurs. */
+  list-style-image: url("chrome://global/skin/checkbox/cbox-check.gif");
+}
+
+

Attributs

+

+

+ +
crop +
Type : une des valeurs ci-dessous +
Si le label de l'élément est trop long pour être contenu dans son espace donné, le texte sera tronqué du côté indiqué par l'attribut crop. Une ellipse (…) sera utilisée à la place du texte tronqué. Si la direction de la boîte est inversée, le tronquage l'est également. +
+ + + +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
hidden +
Type : booléen +
Si défini à true, l'élément n'est pas affiché. Cet attribut est similaire à la valeur « none » de la propriété CSS display. +
+ + +
+
+ +
+
+ +
+
+ +
label +
Type : chaîne de caractères +
Le label qui apparaîtra sur l'élément. S'il n'est pas spécifié, aucun texte n'apparaîtra. +
+ + +
+
+ +
+
+ +
+
+ +
+
+ +
sortDirection +
Type : une des valeurs ci-dessous +
Cet attribut indique la direction dans laquelle le contenu généré par un template est trié. Utilisez l'attribut sortResource pour spécifier la clé de tri. +
+ +


+

+ + +
+
+ +
+
+ +
+
+ +
+ +

Propriétés

+
+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Classes de style

+

La classe suivante peut être utilisée pour styler l'élément. Cette classe doit être utilisée plutôt que de changer le style de l'élément directement, car elle s'adaptera plus naturellement au thème sélectionné par l'utilisateur. +

+
+ treecol-image
+
+ Use this class to have an image appear on the tree column header. Specify the image using the src attribute.
+
+ +

Sujets liés

+
Éléments +
tree, treecols, treechildren, treeitem, treerow, treecell et treeseparator. +
Interfaces +
nsIAccessibleProvider +
+
+
diff --git a/files/fr/archive/mozilla/xul/treecols/index.html b/files/fr/archive/mozilla/xul/treecols/index.html new file mode 100644 index 0000000000..439ef88631 --- /dev/null +++ b/files/fr/archive/mozilla/xul/treecols/index.html @@ -0,0 +1,112 @@ +--- +title: treecols +slug: Archive/Mozilla/XUL/treecols +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/treecols +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un groupe d'éléments treecol. Il doit y avoir un et un seul élément treecols dans un tree. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
pickertooltiptext
+
Propriétés +
accessibleType +
+

Exemples

+

(exemple nécessaire) +

+

Attributs

+
+ +
+ + + + + + +

Hérités de 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

+
+ +

Propriétés

+
+
accessibleType +
Type : entier +
Une valeur indiquant le type d'objet d'accessibilité pour l'élément. +
+
+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+
Éléments +
tree, treecol, treechildren, treeitem, treerow, treecell et treeseparator. +
Interfaces +
nsIAccessibleProvider +
+
+
diff --git a/files/fr/archive/mozilla/xul/treeitem/index.html b/files/fr/archive/mozilla/xul/treeitem/index.html new file mode 100644 index 0000000000..d52ffb8260 --- /dev/null +++ b/files/fr/archive/mozilla/xul/treeitem/index.html @@ -0,0 +1,87 @@ +--- +title: treeitem +slug: Archive/Mozilla/XUL/treeitem +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/treeitem +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un treeitem doit être placé dans un élément treechildren et contenir des éléments treerow. L'utilisateur peut cliquer sur l'élément treeitem pour sélectionner la ligne de l'arbre. L'élément treeitem contient une seule ligne et tout ce qui apparait à l'utilisateur comme les descendants de cette ligne. +

Dans une condition de template, utilisez un treeitem plutôt qu'un élément content lorsque le paramètre dont-build-content est spécifié. Définissez l'attribut uri au nom de variable à lier à un nœud de contenu lors de la correspondance. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
container, empty, label, open, uri +
+

Exemples

+

(exemple nécessaire) +

+

Attributs

+

+

+ +
container +
Type : booléen +
Défini à true si l'élément doit agir comme un conteneur pouvant avoir des éléments enfants. Ceci peut être utilisé pour des dossiers. Cet attribut sera défini par le constructeur de template si nécessaire. +
+


+

+ + +
+
+ +
empty +
Type : booléen +
Défini à true si l'élément est un conteneur qui ne contient aucun enfant. Il sera défini par le constructeur de template si nécessaire. +
+ + +
+
+ +
+
+ +
open +
Type : booléen +
Pour les boutons de type menu, l'attribut open est défini à true lorsque le menu est ouvert. L'attribut open n'est pas présent si le menu est fermé. +
+ + +
+
+ +
uri +
Type : chaîne de caractères +
Pour du contenu généré par un template, l'attribut doit être placé sur l'élément où la génération de contenu doit commencer. Donc, il doit être placé sur un élément qui est le descendant d'un template. La valeur doit être définie à rdf:*. +
+
Les éléments qui apparaissent à l'intérieur de l'élément portant cet attribut seront répétés pour chaque nœud dans la source de données RDF. Les éléments qui sont à l'extérieur n'apparaîtront qu'une seule fois. +
+


+

+ + +
+ +

Propriétés

+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+
Éléments +
tree, treecols, treecol, treechildren, treerow, treecell et treeseparator. +
+
+
diff --git a/files/fr/archive/mozilla/xul/treerow/index.html b/files/fr/archive/mozilla/xul/treerow/index.html new file mode 100644 index 0000000000..d14176ddcc --- /dev/null +++ b/files/fr/archive/mozilla/xul/treerow/index.html @@ -0,0 +1,108 @@ +--- +title: treerow +slug: Archive/Mozilla/XUL/treerow +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/treerow +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Une ligne unique dans un arbre (élément tree). Cet élément doit être placé dans un élément treeitem. Les enfants de treerow doivent être des éléments treecell. Si des lignes filles sont nécessaires, il convient de les placer dans un élément treechildren au sein de l'élément treeitem parent. +

Vous trouverez plus d'informations dans le Tutoriel XUL. +

+
Attributs +
properties +
+

Exemples

+

(exemple nécessaire) +

+

Attributs

+
+ +
properties +
Type : liste de noms de propriétés séparés par des espaces +
Définit les propriétés de l'élément, qui peuvent être utilisées pour le styler. Pour plus d'informations, consultez Styler un arbre. +
+ + +
+ + + + + + +

Hérités de 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

+
+ +

Propriétés

+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+
Éléments +
tree, treecols, treecol, treechildren, treeitem, treecell et treeseparator. +
+
+
diff --git a/files/fr/archive/mozilla/xul/treeseparator/index.html b/files/fr/archive/mozilla/xul/treeseparator/index.html new file mode 100644 index 0000000000..7e6af95185 --- /dev/null +++ b/files/fr/archive/mozilla/xul/treeseparator/index.html @@ -0,0 +1,107 @@ +--- +title: treeseparator +slug: Archive/Mozilla/XUL/treeseparator +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/treeseparator +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Utilisé pour placer une nouvelle ligne séparatrice dans un tree. +

+
Attributs +
properties +
+

Exemples

+

(exemple nécessaire) +

+

Attributs

+
+ +
properties +
Type : liste de noms de propriétés séparés par des espaces +
Définit les propriétés de l'élément, qui peuvent être utilisées pour le styler. Pour plus d'informations, consultez Styler un arbre. +
+ + +
+ + + + + + +

Hérités de 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

+
+ +

Propriétés

+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+
Éléments +
tree, treecols, treecol, treechildren, treeitem, treerow et treecell. +
+
+
diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/ajout_d'\303\251l\303\251ments_html/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/ajout_d'\303\251l\303\251ments_html/index.html" new file mode 100644 index 0000000000..6dfeea624f --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/ajout_d'\303\251l\303\251ments_html/index.html" @@ -0,0 +1,153 @@ +--- +title: Ajout d'éléments HTML +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Ajout_d'éléments_HTML +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Adding_HTML_Elements +--- +
+

« PrécédentSuivant »

+
+ +

Maintenant que nous avons ajouté quelques boutons, ajoutons d'autres éléments.

+ +

Ajout d'éléments HTML dans une fenêtre

+ +

En plus de tous les éléments XUL déjà disponibles, vous pouvez également ajouter des éléments HTML directement dans un fichier XUL. En réalité, vous pouvez ajouter n'importe quel élément HTML dans des fichiers XUL, ce qui signifie que des applets Java ou des tableaux peuvent être placés directement dans une fenêtre. Vous devriez proscrire l'emploi de ces éléments HTML dans vos fichiers XUL dès que vous le pouvez (il existe plusieurs raisons à cela, et la principale concerne la mise en page qui sera décrite plus tard). Cette section va néanmoins décrire comment les employer. Souvenez-vous que le langage XML est sensible à la casse, et que de ce fait vous devrez taper les balises et les attributs en minuscules.

+ +

Espace de nommage XHTML

+ +

Afin de pouvoir utiliser des éléments HTML dans un fichier XUL, vous devez déclarer l'espace de nommage XHTML correspondant (NdT : namespace). De cette façon, Mozilla peut faire la distinction entre les balises de HTML de celles de XUL. L'attribut ci-dessous doit être ajouté à la balise window du fichier XUL, ou à l'élément HTML le plus extérieur.

+ +
xmlns:html="http://www.w3.org/1999/xhtml"
+
+ +

Il s'agit d'une déclaration HTML comme celle que nous avons utilisée pour déclarer XUL. Pour fonctionner, elle doit être saisie exactement comme indiquée ci-dessus.

+ +
Notez qu'en réalité, Mozilla ne télécharge pas cette URL, mais il la reconnaît comme étant une déclaration HTML.
+ +
+

Voici un exemple qui peut être ajouté à notre fenêtre de Recherche de fichiers :

+ +
<?xml version="1.0" encoding="ISO-8859-1"?>
+<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+<window
+   id="findfile-window"
+   title="Recherche de fichiers"
+   orient="horizontal"
+   xmlns:html="http://www.w3.org/1999/xhtml"
+   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+ +

Ensuite, vous pouvez employer des balises HTML comme vous le feriez normalement, en gardant à l'esprit ceci :

+ + + +

Utilisation d'éléments HTML

+ +

Vous pouvez utiliser n'importe quelle balise HTML bien que certaines comme head et body ne soient d'aucune utilité. Des exemples d'emploi des éléments HTML sont montrés ci-dessous :

+ +
<html:img src="banner.jpg"/>
+
+<html:input type="checkbox" value="true"/>
+
+<html:table>
+  <html:tr>
+    <html:td>
+       Un tableau simple
+    </html:td>
+  </html:tr>
+</html:table>
+
+ +

Ces exemples vont créer une image à partir du fichier 'banner.jpg', une case à cocher et un tableau avec une unique cellule. Vous devriez toujours employer des éléments XUL s'ils sont disponibles et vous ne devriez pas employer des tableaux pour la mise en page sous XUL (des éléments XUL permettent de le faire).

+ +
Notez que le préfixe html: a été ajouté au début de chaque balise, pour que Mozilla sache qu'il s'agit d'une balise HTML et non d'une balise XUL. Si vous oubliez un préfixe html:, le navigateur croira qu'il s'agit d'un élément XUL et il n'affichera probablement rien car les balises img, input, table, etc. ne sont pas des balises XUL valides.
+ +

En XUL, vous pouvez ajouter des libellés avec l'élément description ou label. Vous devriez utiliser ces éléments dès que vous le pouvez. Vous pouvez également ajouter des libellés à des contrôles soit en utilisant la balise HTML label, soit en mettant simplement le texte dans un autre élément bloc HTML (tel que p ou div) comme dans l'exemple ci-dessous.

+ +

Exemple 1: Source Voir

+ +
<html:p>
+  Rechercher :
+  <html:input id="find-text"/>
+  <button id="okbutton" label="OK"/>
+</html:p>
+
+ +

Ce code va afficher le texte 'Rechercher :', suivi d'un champ de saisie de texte et d'un bouton « OK ». Notez que le bouton XUL peut apparaître dans un bloc de balise HTML, comme c'est le cas ici. Du texte ne sera affiché que s'il est placé à l'intérieur de balises HTML qui sont normalement employées pour afficher du texte (comme une balise p). Tout texte placé en dehors de balises ne sera pas affiché, sauf si l'élément XUL contenant le texte le permet (l'élément description par exemple).

+ +

Les exemples suivants vont vous aider.

+ +

Exemple d'éléments HTML

+ +

Les exemples suivants illustrent l'ajout de balises HTML dans une fenêtre. Dans chaque cas, l'élément window et d'autres informations basiques ont été retirés pour plus de clarté.

+ +

Une boîte de dialogue avec une case à cocher

+ +

Exemple 2: Source Voir

+ +
<html:p>
+  Cliquez sur la boîte ci-dessous pour mémoriser cette décision.
+  <html:p>
+    <html:input id="rtd" type="checkbox"/>
+    <html:label for="rtd">Mémoriser cette décision</html:label>
+  </html:p>
+</html:p>
+
+ +
Image:xultu_htmlelem1.png
+ +

Dans ce cas, une première balise p a été utilisée pour placer du texte et une autre a été utilisée pour séparer le texte en plusieurs lignes. (NdT : selon la norme XHTML, une balise p ne peut pas inclure une autre balise p, l'exemple est donc en principe erroné.)

+ +

Texte en dehors de blocs HTML

+ +

Exemple 3: Source Voir

+ +
<html:div>
+   Voulez-vous sauvegarder les documents suivants ?
+   <html:hr/>
+</html:div>
+Rapport de dépense 1 que j'ai fait l'été dernier
+<button id="yes" label="Oui"/>
+<button id="no" label="Non"/>
+
+ +
Image:xultu_htmlelem2.png
+ +

Comme vous pouvez le voir sur cette image, le texte placé à l'intérieur des balises div a été affiché mais l'autre texte ('Rapport de dépense 1' et 'que j'ai fait l'été dernier') ne l'a pas été. Ceci est dû au fait qu'il n'y a pas d'éléments HTML ou XUL entourant le texte à afficher et capables de le faire. Pour rendre ce texte apparent, vous devez le placer à l'intérieur de balises div, ou l'inclure dans une balise description.

+ +

Les éléments HTML invalides

+ +
<html:po>Cas 1</html:po>
+<div>Cas 2</div>
+<html:description value="Cas 3"/>
+
+ +

Aucun des trois cas ci-dessus ne s'affichera pour les raisons suivantes :

+ +
+
Cas 1 
+
po n'est pas une balise HTML valide et Mozilla n'a aucune idée de ce qu'il faut en faire.
+
Cas 2 
+
div est une balise valide mais seulement en HTML. Pour qu'elle fonctionne, vous devez ajouter le qualificateur 'html:'.
+
Cas 3 
+
un élément description est valide en XUL mais pas en HTML. Il ne devrait pas avoir de qualificateur 'html:'.
+
+ +
+

Dans la page suivante, nous apprendrons comment ajouter de l'espace entre les éléments.

+ +
+

« PrécédentSuivant »

+
+Interwiki
+ +

 

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/ajout_de_gestionnaire_d_\303\251v\303\250nements/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/ajout_de_gestionnaire_d_\303\251v\303\250nements/index.html" new file mode 100644 index 0000000000..9eab0ef687 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/ajout_de_gestionnaire_d_\303\251v\303\250nements/index.html" @@ -0,0 +1,139 @@ +--- +title: Ajout de gestionnaire d'évènements +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Ajout_de_gestionnaire_d_évènements +tags: + - Tutoriel_XUL + - Tutoriels + - XBL + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Adding_Event_Handlers_to_XBL-defined_Elements +--- +
+

« PrécédentSuivant »

+
+ +

Nous allons voir comment ajouter des gestionnaires d'événements aux éléments XBL.

+ +

Les gestionnaires d'événements

+ +

Comme vous pouvez le prévoir, des clics de souris, des touches pressées et d'autres événements sont passés à chacun des éléments à l'intérieur du contenu. Cependant, vous voudrez maîtriser les événements et les gérer à votre façon. Vous pouvez ajouter des gestionnaires d'événements aux éléments au sein du contenu si besoin. Le dernier exemple de la section précédente en faisait une démonstration. Dans cet exemple, des gestionnaires oncommand avaient été ajoutés sur quelques boutons.

+ +

Gestionnaires d'événements

+ +

Toutefois, vous pouvez vouloir ajouter un gestionnaire d'événement à tout le contenu, ce qui représente tous les éléments définis au sein de la balise content. Cela pourrait être utile pour maîtriser les événements de sélection et de désélection. Pour définir un gestionnaire d'événement, utilisez l'élément handler. Chacun de ces éléments décrit l'action d'un seul gestionnaire d'événement. Vous pouvez utiliser plus d'un gestionnaire si nécessaire. Si un événement ne correspond pas à l'un des événements handler, il est passé simplement dans le contenu comme d'habitude.

+ +

La syntaxe générale du gestionnaire est la suivante :

+ +
<binding id="nom-liaison">
+  <handlers>
+    <handler event="nom-evenement" action="script"/>
+  </handlers>
+</binding>
+
+ +

Placez tous vos gestionnaires dans l'élément handlers. Chaque élément handler définit l'action prise pour un événement particulier grâce à son attribut event. Les événements valides sont ceux supportés par XUL et JavaScript, tels que 'click' et 'focus'. Utilisez le nom de l'événement sans son préfixe 'on'.

+ +

La principale raison nécessitant la déclaration de gestionnaires est la modification des propriétés personnalisées lorsqu'un événement se produit. Par exemple, une case à cocher personnalisée pourrait avoir une propriété checked qui doit être modifée lorsque l'utilisateur clique sur la case à cocher :

+ +
<handlers>
+  <handler event="mouseup" action="this.checked=!this.checked"/>
+</handlers>
+
+ +

Lorsque l'utilisateur clique et relâche le bouton de la souris au dessus de la case à cocher, l'événement 'mouseup' lui est envoyé, et le gestionnaire défini ici est appelé, entraînant le renversement de l'état de la propriété checked. De même, vous pouvez modifier une propriété lorsque l'élément est sélectionné. Vous devrez ajouter des gestionnaires pour ajuster les propriétés lors de sollicitations de la souris ou du clavier.

+ +

Gestionnaire d'événements de souris

+ +

Pour des événements concernant la souris, vous pouvez utiliser l'attribut button pour que le gestionnaire n'accepte que les événements qui correspondent à un certain bouton. Sans cet attribut, le gestionnaire intercepterait tous les événements concernant la souris sans se soucier du bouton qui a été pressé. L'attribut button doit être défini à '0' pour le bouton gauche de la souris, '1' pour le bouton du milieu de la souris ou '2' pour le bouton droit de la souris.

+ +
<handlers>
+  <handler event="click"   button="0" action="alert('Le bouton gauche est pressé');"/>
+  <handler event="mouseup" button="1" action="alert('Le bouton du milieu est pressé')"/>
+  <handler event="click"   button="2" action="alert('Le bouton droit est pressé');"/>
+</handlers>
+
+ +

Gestionnaire d'événements clavier

+ +

Pour les événements provenant des touches du clavier, vous pouvez utiliser plusieurs attributs similaires à ceux de l'élément key pour les faire correspondre à une touche spécifique et seulement lorsque certaines touches alternatives sont pressées. L'exemple précédent pourrait être complété de telle sorte que la propriété checked de la case à cocher soit modifiée lorsque la barre d'espacement est pressée.

+ +
<handlers>
+  <handler event="keypress" key=" " action="this.checked=!checked"/>
+</handlers>
+
+ +

Vous pouvez aussi utiliser l'attribut keycode pour tester les touches non imprimables. La section sur les raccourcis clavier fournit plus d'informations. Les touches alternatives peuvent être vérifiées en ajoutant un attribut modifiers. Il peut être défini avec l'une des valeurs suivante :

+ +
+
'alt' 
+
L'utilisateur doit presser la touche Alt.
+
'control' 
+
L'utilisateur doit presser la touche Ctrl.
+
'meta' 
+
L'utilisateur doit presser la touche Meta.
+
'shift' 
+
L'utilisateur doit presser la touche Maj.
+
'accel' 
+
L'utilisateur doit presser la touche alternative spéciale qui est habituellement utilisée pour les raccourcis clavier sur sa plateforme.
+
+ +

S'il est déclaré, le gestionnaire est appelé uniquement lorsque la touche alternative est pressée. Vous pouvez combiner plusieurs touches modificatrices en les séparant par des espaces.

+ +

La syntaxe alternative suivante peut être utilisée lorsque le code dans un gestionnaire est plus complexe :

+ +
<binding id="nom-liaison">
+  <handlers>
+    <handler event="nom-evenement">
+      -- le code du gestionnaire vient ici --
+    </handler>
+  </handlers>
+</binding>
+
+ +

Exemple de gestionnaires

+ +

L'exemple suivant ajoute des gestionnaires de touches pour créer un presse-papiers local très primitif :

+ +

Exemple 1 : Source

+ +
<binding id="clipbox">
+  <content>
+    <xul:textbox/>
+  </content>
+  <implementation>
+    <field name="clipboard"/>
+  </implementation>
+  <handlers>
+    <handler event="keypress" key="x" modifiers="control"
+      action="this.clipboard=document.getAnonymousNodes(this)[0].value; document.getAnonymousNodes(this)[0].value='';"/>
+    <handler event="keypress" key="c" modifiers="control"
+      action="this.clipboard=document.getAnonymousNodes(this)[0].value;"/>
+    <handler event="keypress" key="v" modifiers="control"
+      action="document.getAnonymousNodes(this)[0].value=this.clipboard ? this.clipboard : '';"/>
+  </handlers>
+</binding>
+
+ +

Le contenu est un champ de saisie simple. Un champ clipboard lui a été ajouté pour stocker le contenu du presse-papiers. Il signifie que les opérations de presse-papiers sont limitées à ce seul champ de saisie. Le tampon sera propre à ce champ.

+ +

Trois gestionnaires ont été ajoutés, un pour couper, un pour copier et l'autre pour coller. Chacun d'eux a sa propre combinaison de touche appelante. Le premier gestionnaire est l'opération Couper et est appelé lorsque la touche Ctrl est pressée suivie de la touche x. Le script à l'intérieur de l'attribut action est utilisé pour couper le texte du champ de saisie et pour le mettre dans le champ du presse-papiers. Pour faire simple, le texte entier est coupé et pas seulement le texte sélectionné. Le code fonctionne comme suit :

+ +
    +
  1. + 
    this.clipboard=document.getAnonymousNodes(this)[0].value;
    + On récupère le premier élément du tableau de contenu anonyme qui donne une référence à l'élément textbox qui s'avère être le premier (et le seul) élément au sein de l'élément content. On récupère la propriété value qui fournira le texte du champ de saisie. Elle est ainsi assignée au champ du presse-papiers. Le résultat est que le texte qui se trouve dans la champ de saisie est copié dans ce presse-papiers spécial.
    2. +
  2. + 
    document.getAnonymousNodes(this)[0].value=''
    + On assigne ainsi au texte de l'élément textbox une chaîne de caractères vide. Elle efface le texte dans le champ de saisie.
    3. +
+ +

Une opération de copie est similaire mais n'efface pas le texte. Le collage est l'opération inverse si ce n'est que la valeur du champ de saisie est assignée à partir de la valeur du champ du presse-papiers. Si nous étions en train de créer une réelle implémentation de ces raccourcis clavier de presse-papiers, nous utiliserions probablement l'interface réelle du presse-papiers et nous gèrerions également la sélection courante.

+ +
+

Dans la prochaine section, nous verrons comment étendre les définitions XBL existantes.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/ajout_de_gestionnaires_d'\303\251v\303\250nements/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/ajout_de_gestionnaires_d'\303\251v\303\250nements/index.html" new file mode 100644 index 0000000000..df33636311 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/ajout_de_gestionnaires_d'\303\251v\303\250nements/index.html" @@ -0,0 +1,140 @@ +--- +title: Ajout de gestionnaires d'évènements +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Ajout_de_gestionnaires_d'évènements +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Adding_Event_Handlers +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

La boîte de dialogue de recherche de fichiers est tout à fait correcte à ce stade. Nous ne l'avons pas beaucoup optimisée mais nous avons facilement créé une interface utilisateur. Dans ce qui suit, nous allons montrer comment lui ajouter des scripts.

+ +

Utilisation de scripts

+ +

Pour rendre la boîte de dialogue de recherche de fichiers fonctionnelle, nous avons besoin d'ajouter des scripts qui vont s'exécuter quand l'utilisateur interagira avec le dialogue. Nous voudrions ajouter un script pour gérer le bouton « Rechercher », le bouton « Annuler » et pour gérer chaque commande du menu. Nous écrirons ces scripts en utilisant des fonctions JavaScript de la même manière qu'en HTML.

+ +

Vous pouvez utiliser l'élément script pour inclure des scripts dans des fichiers XUL. Vous pouvez aussi inclure le script directement dans le fichier XUL entre les balises script ouvrante et fermante, mais il est préférable de placer le code dans un fichier séparé. Votre fenêtre XUL se chargera un peu plus rapidement. Nous utiliserons alors l'attribut src pour lier un fichier de script externe.

+ +
+

Notre exemple de recherche de fichiers

+ +

Ajoutons un script au dialogue de recherche de fichiers. Bien que le nom du fichier de script n'ait pas d'importance, il est courant de lui donner le même nom que celui du fichier XUL, avec l'extension 'js'. Dans ce cas, on utilisera 'findfile.js'. Ajoutez la ligne ci-dessous juste après la balise window ouvrante et AVANT tout autre élément.

+ +
<script src="findfile.js"/>
+
+ +

Nous créerons le fichier de script plus tard, quand nous connaîtrons son contenu. Nous y définirons des fonctions que nous pourrons appeler dans des gestionnaires d'événements.

+
+ +

Nous pouvons inclure de multiples scripts dans un fichier XUL en utilisant de multiples balises script, chacune pointant vers un script différent. Nous pouvons utiliser des URLs relatives ou absolues. Par exemple, nous pouvons utiliser des URLs sous les formes suivantes :

+ +
<script src="findfile.js"/>
+<script src="chrome://findfiles/content/help.js"/>
+<script src="http://www.example.com/js/items.js"/>
+
+ +

Ce tutoriel n'a pas pour but de décrire comment écrire du JavaScript. C'est un sujet vaste et il existe déjà beaucoup de documentation le traitant.

+ +
Par défaut, la console JavaScript n'affiche que les erreurs provenant des contenus Web. Pour voir les erreurs JavaScript du chrome, il est nécessaire de modifier la préférence javascript.options.showInConsole à 'true'. Vous pouvez également faire du débogage en modifiant la préférence javascript.options.strict. En la définissant à 'true', les erreurs causés par des codes non standard, mal écrits, ou syntaxiquement erronés seront affichés dans la console d'erreurs.
+ +

Réponse aux événements

+ +

Le script contiendra le code qui répondra aux différents événements déclenchés par l'utilisateur ou par d'autres situations. Il existe environ une trentaine d'événements pouvant être gérés de différentes manières. Un événement classique est le bouton de souris ou la touche pressée par l'utilisateur. Chaque élément XUL a la capacité de déclencher certains événements dans des situations différentes. Quelques déclenchements d'événements sont spécifiques à certains éléments.

+ +

Chaque événement a un nom, par exemple, 'mousemove' est le nom de l'événement qui est déclenché quand l'utilisateur passe la souris au-dessus d'un élément d'interface utilisateur. XUL utilise le mécanisme d'événement défini par le DOM Events (Version traduite). Quand survient une action devant déclencher un événement, telle que le déplacement de la souris par l'utilisateur, un objet 'event' correspondant à ce type d'événement est créé. Des propriétés sont assignées à cet objet event telles que la position de la souris, la touche pressée, etc.

+ +

L'événement est ensuite envoyé au XUL par phases.

+ + + +

Vous pouvez réagir à un événement pendant la phase de capture ou de diffusion. Une fois que l'événement a terminé de se propager, l'action correspondant au comportement natif de l'élément est déclenchée.

+ +

Par exemple, quand la souris passe sur un bouton inclus dans une boîte, un événement 'mousemove' est généré et envoyé d'abord à la fenêtre, puis au document et ensuite à la boîte. Cela complète la phase de capture. Ensuite, l'événement 'mousemove' est envoyé au bouton. Enfin la phase de diffusion se traduit par le renvoi de l'événement vers la boîte, puis le document et enfin la fenêtre. La phase de diffusion est par essence l'inverse de la phase de capture. Notez que certains événements ne passent pas par la phase de diffusion.

+ +

Vous pouvez attacher des scrutateurs à chaque élément pour être à l'écoute des événements pendant chaque étape de leur propagation. Étant donné qu'un simple événement est passé à tous les ancêtres, vous pouvez attacher un scrutateur à un élément spécifique ou à un élément supérieur dans la hiérarchie. Naturellement, un événement attaché à un élément parent recevra une notification de tous les éléments qu'il contient, alors qu'un événement attaché à un bouton recevra seulement des événements concernant ce bouton. C'est utile si vous désirez gérer plusieurs éléments avec un code identique ou similaire.

+ +

Une fois que vous gérez un événement, sans vous souciez du stade de sa propagation, vous voudrez probablement le stopper avant qu'il ne soit envoyé à d'autres éléments, ce qui, en substance, signifie que vous voulez interrompre les phases de capture et de diffusion. Il existe plusieurs façons d'y parvenir, en fonction de la manière avec laquelle vous avez attaché le scrutateur d'événement à un élément.

+ +

L'événement le plus utilisé est l'événement 'command'. L'événement 'command' est déclenché quand l'utilisateur active un élément, par exemple en pressant un bouton, en cochant une case ou en sélectionnant une entrée d'un menu. L'événement 'command' est pratique car il gère automatiquement les différentes méthodes d'activation d'un élément. Par exemple, l'événement 'command' se produira indifféremment si l'utilisateur utilise sa souris pour cliquer le bouton ou s'il presse la touche Entrée.

+ +

Il y a deux manières d'attacher un scrutateur d'événement à un élément. Premièrement, en utilisant un attribut avec un script comme valeur. Deuxièmement, en appelant la méthode addEventListener d'un élément. La première manière peut seulement gérer les événements en phase de diffusion mais est plus simple à écrire. La seconde peut gérer les événements sur chaque phase et peut aussi être utilisée pour attacher plusieurs scrutateurs pour un événement à un élément. L'utilisation de la « forme par attribut » est une manière plus commune pour la plupart des événements.

+ +

Scrutateurs d'événements par attributs

+ +

Pour utiliser la forme par attribut, placez un attribut sur un élément à l'endroit que vous voulez, son nom devra être le nom de l'événement précédé par le mot « on ». Par exemple, l'attribut correspondant à l'événement 'command' est oncommand. La valeur de l'attribut devra être le code à exécuter quand l'événement se produira. Typiquement, ce code sera court et appellera une fonction définie dans un script séparé. Voici un exemple de réponse lorsqu'un bouton est pressé :

+ +

Exemple 1: Source Voir

+ +
<button label="OK" oncommand="alert('Le bouton a été pressé !');"/>
+ +

Puisque l'événement 'command' va se diffuser, il est également possible de placer le scrutateur d'événement sur un élément conteneur. Dans l'exemple ci-dessous, le scrutateur a été placé sur une boîte et il recevra les événements pour tous ses éléments.

+ +

Exemple 2: Source Voir

+ +
<vbox oncommand="alert(event.target.tagName);">
+   <button label="OK"/>
+   <checkbox label="Voir les images"/>
+</vbox>
+
+ +

Dans cet exemple, l'événement 'command' va se diffuser du bouton ou de la case à cocher jusqu'à la boîte, où il sera traité. Si un second scrutateur (l'attribut oncommand) était placé sur le bouton, son code serait appelé en premier, suivi par le gestionnaire de la boîte. L'objet event est transmis aux gestionnaires d'événements comme un argument implicite nommé 'event'. Il est utilisé pour obtenir des informations spécifiques à propos de l'événement. Une des plus utilisées est la propriété 'target' (cible) de l'événement, qui cible l'élément à partir duquel l'événement s'est produit. Dans l'exemple, nous affichons une alerte contenant le nom de l'élément cible. La cible est très utile lors de l'utilisation d'un événement en diffusion dans le cas où vous auriez une série de boutons gérée par un même script.

+ +

Vous noterez que la syntaxe de l'attribut est identique à celle utilisée pour les événements dans les documents HTML. En fait, HTML et XUL partagent le même mécanisme d'événement. Une différence importante est que l'événement 'click' (ou l'attribut onclick) est utilisé en HTML pour répondre aux boutons, alors qu'on devra utiliser l'événement 'command' en XUL. XUL possède un événement 'click', mais il répond uniquement aux clics de souris, pas à l'utilisation du clavier. Ainsi, l'événement 'click' devra être évité en XUL, sauf si vous avez une raison d'avoir un élément uniquement géré avec la souris. De plus, tandis que l'événement 'command' ne sera pas envoyé si un élément est désactivé, l'événement 'click' sera envoyé sans tenir compte de l'état activé ou non de l'élément.

+ +
+

Notre exemple de recherche de fichiers

+ +

Un gestionnaire oncommand peut être placé sur les boutons « Rechercher » et « Annuler » dans le dialogue de recherche de fichiers. L'appui sur le bouton « Rechercher » devrait démarrer la recherche. Comme nous n'implémenterons pas cette partie, nous l'omettrons. En revanche, l'appui sur le bouton « Annuler » devrait fermer la fenêtre. Le code ci-dessous montre comment le faire. Pendant que nous y sommes, ajoutons le même code à l'item de menu « Fermer ».

+ +
<menuitem label="Fermer" accesskey="c" oncommand="window.close();"/>
+...
+
+<button id="cancel-button" label="Annuler"
+     oncommand="window.close();"/>
+
+Deux gestionnaires ont été ajoutés ici. L'attribut oncommand a été ajouté à l'item de menu « Fermer ». En utilisant ce gestionnaire, l'utilisateur pourra fermer la fenêtre en cliquant sur l'item de menu ou en le sélectionnant par le clavier. Le gestionnaire oncommand a également été ajouté au bouton « Annuler ».
+ +

Scrutateurs d'événements DOM

+ +

La seconde façon d'ajouter un gestionnaire d'événement est d'appeler la méthode addEventListener d'un élément. Celle-ci vous permet d'attacher dynamiquement un scrutateur d'événement et de scruter les événements durant la phase de capture. La syntaxe est la suivante :

+ +

Exemple 3: Source Voir

+ +
<button id="okbutton" label="OK"/>
+
+<script>
+function buttonPressed(event) {
+   alert('Le bouton a été pressé !');
+}
+
+var button = document.getElementById("okbutton");
+button.addEventListener('command', buttonPressed, true);
+</script>
+
+ +

La fonction getElementById() retourne l'élément ayant un identifiant id, dans notre cas, le bouton. La fonction addEventListener() est appelée pour ajouter un nouveau scrutateur d'événement en phase de capture. Le premier argument est le nom de l'événement à scruter. Le deuxième argument est la fonction du scrutateur d'événement qui sera appelée quand l'événement se produira. Enfin, le dernier argument devra être 'true' pour les scrutateurs en phase de capture. Vous pouvez également scruter durant la phase de diffusion en donnant la valeur 'false' au dernier argument. La fonction scrutateur d'événement passée comme deuxième argument devra avoir un argument, l'objet 'event', comme vous le voyez dans la déclaration de la fonction buttonPressed ci-dessus.

+ +
+
+

Le dialogue de recherche de fichiers à ce stade : Source Voir

+
+ +

Dans la prochaine section, nous aborderons plus en détail l'objet event.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

+ +

 

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/ajout_de_m\303\251thodes/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/ajout_de_m\303\251thodes/index.html" new file mode 100644 index 0000000000..c0adc86eaa --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/ajout_de_m\303\251thodes/index.html" @@ -0,0 +1,194 @@ +--- +title: Ajout de méthodes +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Ajout_de_méthodes +tags: + - Tutoriel_XUL + - Tutoriels + - XBL + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Adding_Methods_to_XBL-defined_Elements +--- +
+

« PrécédentSuivant »

+
+ +

Nous allons voir comment ajouter des méthodes personnalisées aux éléments définis en XBL.

+ +

Les méthodes

+ +

En plus d'ajouter des propriétés de script à l'élément défini en XBL, vous pouvez aussi y ajouter des méthodes. Ces méthodes peuvent être appelées à partir d'un script. Les méthodes sont des fonctions d'objets, comme window.open(). Vous pouvez définir des méthodes personnalisées pour vos éléments en utilisant l'élément method. La syntaxe générale des méthodes est définie comme suit :

+ +
<implementation>
+  <method name="method-name">
+    <parameter name="parameter-name1"/>
+    <parameter name="parameter-name2"/>
+    .
+    .
+    .
+    <body>
+      -- le script de la méthode vient ici --
+    </body>
+  </method>
+</implementation>
+
+ +

Une déclaration de méthode se fait au travers de l'élément implementation, comme pour les champs et les propriétés. L'élément method contient deux types d'éléments fils, les éléments parameter qui décrivent les paramètres de la méthode et body qui contient le script de la méthode.

+ +

La valeur de l'attribut name devient le nom de la méthode. De même, les attributs name des éléments parameter deviennent les noms de chaque paramètre. Chaque élément parameter est utilisé pour déclarer l'un des paramètres pour la méthode. Par exemple, si la méthode a trois paramètres, il y aura trois éléments parameter. Si vous n'avez pas besoin d'en avoir, la méthode n'aura pas de balise parameter.

+ +

L'élément body contient le script qui est exécuté lorsque la méthode est appelée. Les noms des paramètres sont définis comme des variables dans le script comme s'ils étaient passés en paramètre. Par exemple, la fonction JavaScript suivante serait écrite en tant que méthode XBL comme ceci :

+ +
function getMaximum(num1,num2)
+{
+  if (num1<=num2) return num2;
+  else return num1;
+}
+
+XBL:
+
+<method name="getMaximum">
+  <parameter name="num1"/>
+  <parameter name="num2"/>
+  <body>
+    if (num1&lt;=num2) return num2;
+    else return num1;
+  </body>
+</method>
+
+ +

Cette fonction, getMaximum, retourne la plus grande des valeurs passées chacune comme un paramètre dans la méthode. Notez que le symbole inférieur doit être un caractère d'échappement parce qu'autrement il ressemblerait au commencement d'une balise. Vous pouvez aussi utiliser une section CDATA pour échapper le bloc entier de code. Vous pouvez appeler la méthode en utilisant un code comme element.getMaximum(5,10) où element est une référence à un élément défini par l'élément XBL contenant la méthode getMaximum (L'élément de liaison).

+ +

La balise parameter vous permet de définir des paramètres pour une méthode. Comme Mozilla utilise JavaScript pour son langage de script, et que JavaScript est un langage non typé, vous n'avez pas besoin de spécifier le type des paramètres. Cependant, dans le futur, d'autres langages devraient être utilisés avec XBL.

+ +

Accès au contenu anonyme

+ +

Il peut y avoir des fois où vous voulez modifier certains aspects des éléments définis dans l'élément content, que ce soit à partir d'une méthode body ou d'ailleurs. Ces éléments sont créés anonymement et ne sont pas accessibles à partir des fonctions habituelles du DOM (Modèle Objet de Document). Elles sont cachées de telle sorte que les développeurs n'aient pas besoin de savoir comment l'élément est implémenté pour l'utiliser. Cependant, il existe un moyen spécial pour obtenir ce contenu anonyme.

+ +

Les éléments auxquels un comportement XBL est attaché ont une propriété spéciale qui contient un tableau des éléments fils anonymes. Chaque élément du tableau stocke chaque élément fils direct de l'élément XBL défini. Cette propriété spéciale ne peut pas être accessible directement. À la place, vous devez appeler la méthode getAnonymousNodes du document.

+ +
var value=document.getAnonymousNodes(element);
+ +

Ici, 'element' devrait être une référence à l'élément dont vous voulez obtenir le contenu anonyme. La fonction retourne un tableau d'éléments qui est le contenu anonyme. Pour obtenir des éléments en-dessous de celui-ci, vous pouvez utiliser les fonctions habituelles du DOM (Modèle Objet de Document) car elles ne sont pas cachées. Notez qu'il est possible pour un élément XBL lié d'être placé à l'intérieur d'un autre, auquel cas vous devrez utiliser une nouvelle fois la fonction getAnonymousNodes.

+ +

L'exemple suivant crée une rangée de boutons :

+ +
<binding id="buttonrow">
+  <content>
+    <button label="Oui"/>
+    <button label="Non"/>
+    <button label="Trier par"/>
+  </content>
+</binding>
+
+ +

Pour vous référer à chaque bouton, vous pouvez utiliser la fonction getAnonymousNodes, en lui passant une référence à l'élément auquel la liaison est attachée, en tant que paramètre. Dans le tableau renvoyé, le premier bouton est stocké dans le premier item du tableau (getAnonymousNodes(element)[0]), le deuxième bouton est stocké dans le deuxième item du tableau et le troisième est stocké dans le troisième item du tableau. Pour coder à l'intérieur d'une méthode de liaison, vous pouvez passer this comme paramètre à getAnonymousNodes.

+ +

Le prochain exemple peut être utilisé pour créer un texte avec un libellé. La méthode showTitle sert à montrer ou à cacher un libellé. Elle fonctionne en obtenant une référence à l'élément titre en utilisant le tableau anonyme et en changeant sa visibilité.

+ +
XUL:
+
+<box id="num" class="labeledbutton" title="Plusieurs choses :" value="52"/>
+
+<button label="Montrer" oncommand="document.getElementById('num').showTitle(true)"/>
+<button label="Cacher" oncommand="document.getElementById('num').showTitle(false)"/>
+
+XBL:
+
+<binding id="labeledbutton">
+  <content>
+    <xul:label xbl:inherits="value=title"/>
+    <xul:label xbl:inherits="value"/>
+  </content>
+  <implementation>
+    <method name="showTitle">
+      <parameter name="state"/>
+      <body>
+        if (state) document.getAnonymousNodes(this)[0].
+          setAttribute("style","visibility: visible");
+        else document.getAnonymousNodes(this)[0].
+          setAttribute("style","visibility: collapse");
+      </body>
+    </method>
+  </implementation>
+</binding>
+
+ +

Les deux boutons ajoutés dans le contenu XUL ont des gestionnaires oncommand qui sont utilisés pour changer la visibilité du libellé. Chacun d'eux appelle la méthode showTitle. Cette méthode vérifie le paramètre state pour voir si l'élément sera caché ou montré. Dans un cas comme dans l'autre, elle récupère le premier élément du tableau anonyme. Celui-ci se rapporte au premier fils de l'élément content qui ici est le premier élément label de l'élément graphique. La visibilité est changée en modifiant le style de l'élément.

+ +

Accès depuis l'intérieur du contenu anonyme

+ +

Pour aller dans l'autre sens, et obtenir l'élément XUL liée depuis l'intérieur du contenu anonyme, utilisez la propriété parentNode du DOM (Modèle Objet de Document). Elle permet d'obtenir l'élément parent d'un élément. Par exemple, nous pourrions déplacer les boutons 'Montrer' et 'Cacher' dans le fichier XBL et faire la chose suivante :

+ +

Exemple 1 : Source

+ +
<binding id="labeledbutton">
+  <content>
+    <xul:label xbl:inherits="value=title"/>
+    <xul:label xbl:inherits="value"/>
+    <xul:button label="Montrer" oncommand="parentNode.showTitle(true);"/>
+    <xul:button label="Cacher" oncommand="parentNode.showTitle(false);"/>
+  </content>
+  <implementation>
+    <method name="showTitle">
+      <parameter name="state"/>
+      <body>
+        if (state) document.getAnonymousNodes(this)[0].setAttribute("style","visibility: visible");
+        else document.getAnonymousNodes(this)[0].setAttribute("style","visibility: collapse");
+      </body>
+    </method>
+  </implementation>
+</binding>
+
+ +

Les gestionnaires oncommand obtiennent ici d'abord une référence à leur élément parent. Il ne s'agit pas de l'élément content mais de l'élément XUL auquel l'élément XBL est lié (Dans cet exemple, c'est la boîte avec la classe 'labeledbutton'). Ainsi, la méthode showTitle est appelée, et fonctionne comme avant.

+ +

Les propriétés et méthodes personnalisées sont ajoutées seulement à l'élément XUL externe auquel l'élément XBL est lié. Aucun des éléments déclarés au sein de la balise content n'ont ces propriétés ou méthodes. C'est pourquoi nous devons obtenir l'élément parent d'abord.

+ +

Les fils d'un élément placés dans le fichier XUL peuvent être récupérés par la voie normale et ne bougent pas même si vous utilisez la balise children. Par exemple :

+ +
XUL:
+
+<box id="outer" class="container">
+  <button label="Un"/>
+  <button label="Deux"/>
+  <button label="Trois"/>
+  <button label="Quatre"/>
+</box>
+
+XBL:
+
+<binding id="labeledbutton">
+  <content>
+    <description value="Une pile :"/>
+    <stack>
+      <children/>
+    </stack>
+  </content>
+</binding>
+
+ +

Si vous utilisez les fonctions du DOM (Modèle Objet de Document) telles que childNodes pour obtenir les fils d'un élément, vous verrez que la boîte XUL qui a l'id 'outer', a 4 fils. Ceux-ci correspondent à ses 4 boutons, même si ces boutons sont dessinés à l'intérieur de la pile (stack). La pile n'a qu'un seul fils, l'élément children lui-même. La longueur du tableau anonyme de la boîte externe est de deux, le premier élément étant l'élément description et le second étant l'élément stack.

+ +

Constructeurs et Destructeurs

+ +

XBL supporte deux méthodes spéciales créées avec des balises séparées, constructor et destructor. Un constructeur est appelé chaque fois qu'une liaison est attachée à un élément. Il est utilisé pour initialiser le contenu tel que le chargement de préférences ou l'initialisation des valeurs par défaut de champs. Le destructeur est appelé lorsqu'une liaison est enlevée d'un élément. Il peut s'avérer utile pour sauvegarder des informations.

+ +

Il y a deux points à savoir lorsqu'une liaison est attachée à un élément. Le premier se produit lorsqu'une fenêtre est affichée. Tous les constructeurs des éléments qui ont un contenu XBL attaché seront invoqués. L'ordre dans lequel ils sont appelés ne devrait pas être pris en compte, car ils sont chargés à partir divers fichiers. Le gestionnaire de chargement de la fenêtre (onload) n'est pas appelé tant que toutes les liaisons n'ont pas été attachées et leurs constructeurs exécutés. Le second point quand une liaison est attachée, est lorsque vous changez la propriété de style -moz-binding d'un élément. Après que son destructeur ait été appelé, la liaison existante sera enlevée. Ainsi, la nouvelle liaison sera ajoutée à sa place et son constructeur sera invoqué.

+ +

Le script pour un constructeur ou un destructeur devrait être placé directement à l'intérieur de la balise appropriée. Il ne doit y avoir qu'un seul de chaque par liaison et ils ne prennent aucun argument. Voici quelques exemples :

+ +
<constructor>
+  if (this.childNodes[0].getAttribute("open") == "true"){
+    this.loadChildren();
+  }
+</constructor>
+
+<destructor action="saveMyself(this);"/>
+
+ +
+

La prochaine section montre comment ajouter des gestionnaires d'événements aux éléments XBL définis.

+ +
+

« PrécédentSuivant »

+
diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/ajout_de_propri\303\251t\303\251s/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/ajout_de_propri\303\251t\303\251s/index.html" new file mode 100644 index 0000000000..0294706900 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/ajout_de_propri\303\251t\303\251s/index.html" @@ -0,0 +1,168 @@ +--- +title: Ajout de propriétés +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Ajout_de_propriétés +tags: + - Tutoriel_XUL + - Tutoriels + - XBL + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Adding_Properties_to_XBL-defined_Elements +--- +
+

« PrécédentSuivant »

+
+ +

Nous allons voir comment ajouter des propriétés personnalisées aux éléments XBL (eXtended Binding Language).

+ +

L'interface XBL

+ +

JavaScript et le DOM fournissent un moyen pour obtenir et définir les propriétés des éléments. Avec XBL, vous pouvez définir vos propres propriétés pour les éléments que vous créez. Vous pouvez aussi ajouter des méthodes qui peuvent être appelées. De cette façon, tout ce dont vous avez besoin est d'obtenir une référence à l'élément (en utilisant getElementById ou une fonction similaire) et ainsi obtenir ou modifier ses propriétés additionnelles et appeler ses méthodes.

+ +

Il y a trois types d'items que vous pouvez ajouter.

+ + + +

Chacun des trois est défini dans un élément implementation, qui doit être un fils de l'élément de liaison binding. À l'intérieur de la balise implementation, vous définirez pour chacun d'eux un élément field, un élément property et un élément method selon ce que vous voulez. La syntaxe générale est celle-ci :

+ +
<binding id="nom-élément">
+  <content>
+    -- le contenu vient ici --
+  </content>
+  <implementation>
+    <field name="nom-champ-1"/>
+    <field name="nom-champ-2"/>
+    <field name="nom-champ-3"/>
+
+    <property name="nom-propriété-1"/>
+    <property name="nom-propriété-2"/>
+    <property name="nom-propriété-3"/>
+    .
+    .
+    .
+    <method name="nom-méthode-1">
+      -- le contenu vient ici --
+    </method>
+    .
+    .
+    .
+  </implementation>
+</binding>
+
+ +

Les champs

+ +

Chaque champ est défini en utilisant l'élément field. Souvent, les champs correspondent à un attribut placé sur l'élément comme label ou disabled, mais ils ne le devraient pas.

+ +

L'attribut name de field est utilisé pour indiquer le nom du champ. Vous pouvez utiliser le nom dans un script pour obtenir et déterminer une valeur. L'exemple ci-dessous crée un bouton qui génère et stocke un nombre aléatoire. Vous pouvez rechercher ce même nombre plusieurs fois en obtenant la propriété number du bouton. Le plus gros du travail ici est fait par les gestionnaires oncommand. Plus tard, nous verrons comment transformer cela en XBL.

+ +
XUL:
+
+<box id="random-box" class="randomizer"/>
+
+<button label="Générer"
+           oncommand="document.getElementById('random-box').number=Math.random();"/>
+<button label="Voir"
+           oncommand="alert(document.getElementById('random-box').number)"/>
+
+XBL:
+
+<binding id="randomizer">
+  <implementation>
+    <field name="number"/>
+  </implementation>
+</binding>
+
+ +

Un champ number mémorisant le nombre aléatoire a été défini dans la liaison. Les deux boutons spéciaux définissent et obtiennent la valeur de ce champ. La syntaxe est très similaire pour obtenir et définir les propriétés des éléments HTML. Dans cet exemple, aucun contenu n'a été placé à l'intérieur que ce soit la boîte XUL ou sa définition dans XBL, ce qui est parfaitement valide.

+ +

Cet exemple n'est pas tout à fait correct car il n'y a pas de valeur par défaut assignée dans le champ. Pour en mettre une, ajoutez la valeur par défaut dans le contenu de la balise field. Par exemple :

+ +
<field name="number">
+  25
+</field>
+
+ +

Ici, la valeur '25' sera affectée comme valeur par défaut du champ "number". En fait, vous pourriez aussi insérer un script au sein de la balise field pour calculer la valeur par défaut. Cela pourrait être nécessaire si la valeur a besoin d'être calculée. Par exemple, le champ suivant donne une valeur par défaut égale à l'heure courante :

+ +
<field name="currentTime">
+  new Date().getTime();
+</field>
+
+ +

Les propriétés

+ +

Parfois vous voulez valider la donnée qui est assignée à une propriété. Ou bien, vous souhaitez que la valeur soit calculée dynamiquement lorsqu'on le lui demande. Par exemple, si vous souhaitez une propriété qui prenne en compte l'heure courante, vous voudrez que sa valeur soit générée au besoin. Dans ces cas là, vous avez besoin d'utiliser une balise property à la place de la balise field. Sa syntaxe est similaire mais comporte des particularités supplémentaires.

+ +

Attributs onget et onset

+ +

Vous pouvez utiliser les attributs onget et onset pour que le code soit exécuté lorsque la propriété est lue ou modifiée. Ajoutez les à l'élément property et définissez leur valeur dans un script qui, au choix, obtient ou déclare la valeur de la propriété.

+ +

Par exemple, vous pouvez assigner un script à la valeur de onget pour calculer le temps courant. Chaque fois qu'un script tente d'accéder à la valeur de la propriété, le script onget sera appelé pour fournir la valeur. Le script devra retourner la valeur qui devrait être traitée comme étant la valeur de la propriété.

+ +

Le gestionnaire onset est similaire mais est appelé chaque fois qu'un script tente d'assigner une nouvelle valeur à la propriété. Ce script devrait stocker la valeur quelque part, ou la valider. Par exemple, certaines propriétés pourraient juste être capables de stocker des nombres. Les tentatives pour assigner des caractères alphabétiques à ce genre de propriétés ne devraient pas fonctionner.

+ +
<property name="size"
+          onget="return 77;"
+          onset="alert('Modifié en :'+val); return val;"/>
+
+ +

Cette propriété retournera toujours '77' lorsqu'elle sera récupérée. Lorsqu'elle sera affectée, un message d'alerte s'affichera et indiquera la valeur à assigner à la propriété. La variable spéciale val contient cette valeur. Utilisez-la pour la valider ou la stocker. La propriété onset devrait aussi retourner la nouvelle valeur.

+ +

Ce qui suit décrit le comportement d'un cas typique :

+ +

Il y a deux éléments, l'un appelé "banana" et l'autre "orange". Chacun d'eux a une propriété spécifique appelée 'size'. Lorsque la ligne de script suivante est exécutée :

+ +
banana.size = orange.size;
+
+ +
    +
  1. Le script onget est appelé pour la propriété "size" de "orange". Il calcule la valeur et la retourne.
    2. +
  2. Le gestionnaire onset de la propriété "size" de "banana" est appelé. Ce script utilise la valeur passée dans la variable val et l'assigne à la propriété "size" de "banana" de façon quelconque.
    3. +
+ +

Notez que contrairement à un champ, une propriété ne contient pas de valeur. Tenter de définir une propriété qui n'a pas de gestionnaire onset provoquera une erreur. Vous utiliserez souvent un champ séparé pour mémoriser la valeur actuelle de la propriété. Il est aussi commun que les propriétés correspondent à un attribut dans l'élément défini XBL. L'exemple suivant fait correspondre une propriété à un attribut sur un élément.

+ +
<property name="size"
+          onget="return this.getAttribute('size');"
+          onset="return this.setAttribute('size',val);"
+/>
+
+ +

Chaque fois qu'un script tente d'obtenir la valeur de la propriété, elle est récupérée d'un attribut de même nom de l'élément XUL. Chaque fois qu'un script tente de définir la valeur de la propriété, elle est affectée à l'attribut 'size' de l'élément. C'est pratique parce qu'ainsi vous pouvez modifier la propriété ou l'attribut et tous les deux auront la même valeur.

+ +

Éléments getter et setter

+ +

Vous pouvez utiliser une syntaxe alternative pour les attributs onget et onset pouvant être utile pour des scripts plus longs. Vous pouvez remplacer l'attribut onget par l'élément fils nommé getter. De même, vous pouvez remplacer l'attribut onset par l'élément setter. L'exemple ci-dessous le montre :

+ +
<property name="number">
+  <getter>
+    return this.getAttribute('number');
+  </getter>
+  <setter>
+    var v = parseInt(val,10);
+    if (!isNaN(v)) return this.setAttribute('number',''+v);
+    else return this.getAttribute('number');"
+  </setter>
+</property>
+
+ +

La propriété dans cet exemple ne pourra contenir que des valeurs d'entiers. Si d'autres caractères sont entrés, ils sont supprimés. S'il n'y a aucun chiffre, la valeur n'est pas modifiée. Ces opérations sont effectuées dans le code au sein de l'élément setter. La valeur réelle de la propriété est stockée dans l'attribut number.

+ +

Vous pouvez utilisez l'une ou l'autre syntaxe pour créer des gestionnaires de lecture et d'affectation.

+ +

Attribut readonly

+ +

Vous pouvez rendre un champ ou une propriété en lecture seule en ajoutant un attribut readonly à la balise field ou à la balise property, et en le déclarant à 'true'. Toute tentative d'affecter une valeur à une propriété en lecture seule échouera.

+ +
+

La prochaine section montre comment ajouter des méthodes aux éléments définis en XBL.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/ajouter_des_boutons/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/ajouter_des_boutons/index.html new file mode 100644 index 0000000000..33d1b2f376 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/ajouter_des_boutons/index.html @@ -0,0 +1,106 @@ +--- +title: Ajouter des boutons +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Ajouter_des_boutons +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Adding_Buttons +--- +
+

« PrécédentSuivant »

+
+ +

Dans cette section, nous regarderons comment ajouter quelques boutons simples dans une fenêtre.

+ +

Ajouter des boutons dans une fenêtre

+ +

La fenêtre que nous avons créée jusqu'ici était vide, aussi n'est-elle pas encore très intéressante. Dans cette section, nous y ajouterons deux boutons, un bouton de recherche et un bouton d'annulation. Nous apprendrons également une manière simple de les positionner dans la fenêtre.

+ +

Comme pour HTML, XUL dispose d'un certain nombre de balises qui peuvent être utilisées pour créer des éléments d'interface utilisateur. Le plus basique d'entre eux est l'élément button. Cet élément sert à créer de simples boutons.

+ +

L'élément bouton a deux propriétés principales : un libellé label et une image image. Vous avez besoin soit de l'un, soit de l'autre, soit des deux en même temps. Ainsi, un bouton peut avoir seulement un libellé, seulement une image ou un libellé et une image à la fois. Les boutons sont souvent utilisés dans une boîte de dialogue pour valider ou annuler, par exemple.

+ +

Syntaxe des boutons

+ +

L'élément button a la syntaxe suivante :

+ +
<button
+       id="identifier"
+       class="dialog"
+       label="OK"
+       image="images/image.jpg"
+       disabled="true"
+       accesskey="t"/>
+
+ +

Les attributs sont définis comme suit, et ils sont tous optionnels :

+ +
+
id 
+
Identifiant unique vous permettant d'identifier le bouton. Vous verrez cet attribut sur tous les éléments XUL. Vous pouvez l'utiliser pour vous référer au bouton dans une feuille de style ou dans un script. Cependant, vous devriez ajouter cet attribut à presque tous les éléments. Notez que pour des raisons de simplicité, il n'est pas toujours spécifié dans les exemples de ce tutoriel.
+
class 
+
La classe de style du bouton. Elle fonctionne de la même manière qu'en HTML. Elle indique l'aspect du bouton dans la fenêtre. Dans le cas présent, la valeur 'dialog' est utilisée. Dans la plupart des cas, vous n'emploierez pas de classe pour un bouton.
+
label 
+
Le libellé qui apparaîtra sur le bouton. Par exemple : 'OK' ou 'Annuler'. S'il est omis, aucun texte n'apparaît.
+
image 
+
L'URL de l'image qui apparaît sur le bouton. Si cet attribut est omis, aucune image n'apparaîtra. Vous pouvez également indiquer l'image dans une feuille de style en utilisant la propriété list-style-image.
+
disabled 
+
Si cet attribut prend la valeur true, le bouton est désactivé. Celui-ci est habituellement dessiné avec le texte écrit en gris. Si le bouton est désactivé, la fonction du bouton ne peut pas être exécutée. Si cet attribut est omis, le bouton est activé. Vous pouvez commuter l'état d'activation du bouton en utilisant Javascript.
+
accesskey 
+
Cet attribut doit spécifier une lettre qui est employée comme raccourci clavier. Cette lettre doit apparaître, généralement soulignée, dans le libellé. Quand l'utilisateur presse la touche alt (ou une touche équivalente, qui varie en fonction de la plate-forme) et la touche de raccourci, à partir de n'importe où dans la fenêtre, le focus sera mis sur le bouton.
+
+ +
Notez qu'un bouton supporte plus d'attributs que ceux énumérés ci-dessus. Les autres seront abordés plus tard.
+ +

Quelques exemples de boutons :

+ +

Exemple 1: Source Voir

+ +
<button label="Normal"/>
+<button label="Désactivé" disabled="true"/>
+
+ +
Image:xultu_buttons1.png
+ +

Les exemples ci-dessus produiront des boutons comme dans la capture. Le premier bouton est un bouton normal. Le second bouton est désactivé, aussi apparaît-il grisé.

+ +

Nous commencerons par créer un bouton simple de recherche qui permettra de lancer la recherche de fichiers. Le code de l'exemple ci-dessous nous montre comment faire :

+ +
<button id="find-button" label="Rechercher"/>
+
+ +
Notez que Firefox ne vous permet pas d'ouvrir des fenêtres chrome à partir de pages Web. Aussi les liens « voir » dans le tutoriel s'ouvriront dans une fenêtre normale de navigation. À cause de cela, les boutons apparaîtront agrandis le long de la fenêtre. Vous pouvez ajouter align="start" sur l'élément window pour éviter cette déformation.
+ +
+

L'exemple findfile.xul

+ +

Ajoutons ce code au fichier findfile.xul que nous avons créé dans la section précédente. Le code doit être inséré entre les balises window. Le code à ajouter est mis en rouge ci-dessous :

+ +
<?xml version="1.0"?>
+<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+<window id="findfile-window"
+        title="Recherche de fichiers"
+        orient="horizontal"
+        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+  <button id="find-button" label="Rechercher"/>
+  <button id="cancel-button" label="Annuler"/>
+
+</window>
+
+ +
Image:buttons2.png
+Vous noterez que le bouton 'Annuler' a été également ajouté. La fenêtre a une orientation horizontale de sorte que les deux boutons apparaissent l'un à côté de l'autre. Si vous ouvrez le fichier dans Mozilla, vous devriez obtenir quelque chose de similaire à l'image montrée ici.
+ +
Notez que nous ne devrions pas mettre le texte des libellés directement dans le fichier XUL. Nous devrions plutôt employer des entités de sorte que le texte puisse être facilement traduit.
+ +

PAS SUR MDC L'exemple de la boîte de recherche&nbsp;: <a href='exemples/findfile/findfile-buttons.xul.txt'>Source</a> <a href="exemples/findfile/findfile-buttons.xul" onclick="window.open(this.href,'xulff','chrome,resizable'); return false;">Voir</a>

+ +
+

Dans la section suivante, nous découvrirons comment ajouter des libellés et des images dans une fenêtre XUL.

+ +


+

+

« PrécédentSuivant »

+
diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/ajouter_des_feuilles_de_style/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/ajouter_des_feuilles_de_style/index.html new file mode 100644 index 0000000000..e357b89163 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/ajouter_des_feuilles_de_style/index.html @@ -0,0 +1,107 @@ +--- +title: Ajouter des feuilles de style +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Ajouter_des_feuilles_de_style +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Adding_Style_Sheets +--- +

 

+
+

« PrécédentSuivant »

+
+

Jusqu'à présent, nous avons à peine modifier l'aspect visuel des éléments que nous avons créés. XUL utilise CSS (Cascading Style Sheets) pour personnaliser les éléments.

+

Feuilles de styles

+

Une feuille de styles est un fichier qui contient des informations de style pour les éléments. Les styles ont été conçus au départ pour des éléments HTML mais ils peuvent également être appliqués à des éléments XUL ou à n'importe quels éléments XML. La feuille de styles contient des informations telles que les polices, couleurs, bordures et taille des éléments.

+

Mozilla applique une feuille de styles par défaut pour chaque fenêtre XUL. Dans la plupart des cas, il sera suffisant de laisser les valeurs par défaut telles quelles. Toutefois, vous pouvez fournir une feuille de styles personnalisée. En général vous associerez une seule feuille de styles à chaque fichier XUL.

+

Vous pouvez placer une feuille de styles où vous le désirez. Si votre fichier XUL se trouve sur un serveur distant et doit être accédé via une URL HTTP, vous pouvez également stocker la feuille de styles à distance. Si vous créez un paquetage XUL destiné à faire partie du système chrome, vous avez deux choix. Premièrement, vous pouvez placer la feuille de styles dans le même répertoire que le fichier XUL. Cette méthode a l'inconvénient d'interdire le changement du thème graphique de votre application. La seconde méthode consiste à placer vos fichiers à l'intérieur d'un thème.

+
Imaginons que nous construisions la boîte de dialogue de recherche de fichiers pour permettre le choix d'un thème. Comme la fenêtre peut être appelée par l'URL 'chrome://findfile/content/findfile.xul', la feuille de styles sera enregistrée dans 'chrome://findfile/skin/findfile.css'.
+

Tous les exemples XUL ont utilisé une feuille de styles jusqu'à présent. La seconde ligne a toujours été :

+
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+

Cette ligne indique que nous voulons utiliser le style fourni par chrome://global/skin/. Sous Mozilla, elle sera traduit par le fichier global.css qui contient les informations du style par défaut pour les éléments XUL. Si vous enlevez cette ligne, les éléments fonctionneront, toutefois ils apparaîtront dans un style plus simple. La feuille de styles utilise diverses polices, couleurs et bordures pour rendre l'apparence des éléments plus appropriée.

+

Modifier les styles

+

Il arrivera toutefois que l'apparence par défaut des éléments ne soit pas celle désirée. Dans ces cas, nous devons ajouter notre propre feuille de styles. Jusqu'à présent, nous avons appliqué différents styles en utilisant l'attribut style sur des éléments. Bien que ce soit une technique fonctionnelle, elle n'est pas la meilleure. Il est de loin préférable de créer une feuille de styles séparée. La raison est que des styles ou des thèmes différents peuvent êtres appliqués très facilement.

+

Il peut y avoir des cas où l'utilisation de l'attribut style est acceptable. Un bon exemple serait lorsqu'un script modifie le style d'un élément, ou quand une différence d'agencement pourrait modifier la signification de l'élément. Cependant vous devriez l'éviter autant que possible.

+

Pour des fichiers installés, vous aurez à créer ou à modifier un fichier manifeste et installer le thème.

+
+

Notre exemple de recherche de fichiers

+

Modifions la boîte de dialogue de recherche de fichiers pour que son style provienne d'un fichier style séparé. Tout d'abord, voici les lignes modifiées de findfile.xul  :

+
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+<?xml-stylesheet href="findfile.css" type="text/css"?>
+  ...
+<spacer class="titlespace"/>
+  <groupbox orient="horizontal">
+    <caption label="Critères de recherche"/>
+
+      <menulist id="searchtype">
+        <menupopup>
+          <menuitem label="Nom"/>
+          <menuitem label="Taille"/>
+          <menuitem label="Date de modification"/>
+        </menupopup>
+      </menulist>
+      <spacer class="springspace"/>
+      <menulist id="searchmode">
+        <menupopup>
+          <menuitem label="Est"/>
+          <menuitem label="N'est pas"/>
+        </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"/>
+  ...
+<spacer class="titlespace"/> <hbox>    <progressmeter id="progmeter" value="50%" style="display:none;"/>
+
+

La nouvelle ligne xml-stylesheet est utilisée afin d'importer la feuille de styles. Elle contiendra les styles au lieu de les avoir directement dans le fichier XUL. Vous pouvez inclure un nombre indéterminé de feuilles de styles de la même façon. Ici la feuille de styles est placée dans le même répertoire que findfile.xul.

+

Certains des styles dans le code ci-dessus ont été enlevés. La propriété display du progressmeter ne l'a pas été. Elle sera modifiée par un script donc, le style a été maintenu, car la barre de progression n'a pas à être visible au lancement. Vous pouvez toujours mettre le style dans une feuille de styles séparée si vous le souhaitez vraiment. Une classe a été ajoutée aux éléments spacer pour qu'ils puissent être appelés.

+

Une feuille de styles a également besoin d'être créée. Créez un fichier findfile.css dans le même répertoire que le fichier XUL (Il devrait normalement être mis dans un thème séparé). Dans ce fichier, nous allons ajouter la déclaration de styles, comme indiqué ci-dessous :

+
#find-text {
+  min-width: 15em;
+}
+
+#progmeter {
+  margin: 4px;
+}
+
+.springspace {
+  width: 10px;
+}
+
+.titlespace {
+  height: 10px;
+}
+
+

Remarquez que ces styles sont équivalents aux styles que nous avions précédemment. Cependant, il est beaucoup plus facile pour quelqu'un de changer l'apparence de la boîte de dialogue de recherche de fichiers maintenant car il est possible d'ajouter ou modifier la déclaration de styles en modifiant le fichier ou en changeant le thème. Si l'utilisateur change le thème, les fichiers dans un répertoire autre que celui par défaut seront utilisés.

+
+

Importer des feuilles de styles

+

Nous avons déjà vu comment importer des feuilles de styles. Un exemple est montré ci-dessous :

+
<?xml-stylesheet href="chrome://bookmarks/skin/" type="text/css"?>
+

Cette ligne peut être la première d'une fenêtre 'bookmarks'. Elle importe la feuille de style bookmarks, qui est 'bookmarks.css'. Le système de thème de Mozilla est assez intelligent pour savoir quelle feuille de styles utiliser, car le nom spécifique du fichier n'a pas été indiqué ici. Nous avons fait une chose similaire avec la feuille de styles globale (chrome://global/skin).

+

Une feuille de styles peut importer des styles d'une autre feuille en utilisant la directive import. Normalement, vous n'importerez qu'une seule feuille de styles de chaque fichier XUL. La feuille de styles globale peut être importée à partir de celle associée avec le fichier XUL. Ceci peut être fait grâce au code ci-dessous, vous permettant de retirer l'import du fichier XUL :

+
Importation de styles à partir de XUL :
+<?xml-stylesheet href="chrome://global/skin/"  type="text/css"?>
+
+Importation de styles à  partir de CSS :
+@import url(chrome://global/skin/);
+
+

La seconde syntaxe est préférable car elle réduit le nombre de dépendances à l'intérieur du fichier XUL lui-même.

+
+

Retirez l'importation de la feuille de styles globale dans findfile.xul et ajoutez l'importation dans findfile.css.

+
+

Tous les éléments peuvent être décorés à l'aide de CSS. Vous pouvez utiliser des sélecteurs pour sélectionner l'élément que vous souhaitez styler (Le sélecteur est la partie avant l'accolade dans une règle de style). La liste suivante résume quelques-uns des sélecteurs disponibles :

+
button 
Désigne toutes les balises button.
#special-button 
Désigne les éléments avec un id de 'special-button'
.bigbuttons 
Désigne tous les éléments avec une classe 'bigbuttons'
button.bigbuttons 
Désigne tous les éléments button avec une classe à 'bigbuttons'
toolbar > button 
Désigne tous les boutons directement insérés dans un élément toolbar.
toolbar > button.bigbuttons 
Désigne tous les éléments button avec une classe 'bigbuttons', directement insérés dans un élément toolbar.
button.bugbuttons:hover 
Désigne tous les éléments button avec une classe 'bigbuttons' mais seulement lorsque la souris se trouve au dessus d'eux.
button#special-button:active 
Désigne tous les éléments button avec un id 'special-button' mais seulement lorsqu'ils sont actifs (en train d'être cliqués).
box[orient="horizontal"] 
Désigne tous les éléments box avec un attribut orient réglé sur 'horizontal'.
+
+

Vous pouvez combiner ces règles comme vous le désirez. C'est toujours une bonne idée d'être aussi précis que possible lorsque vous spécifiez ce qui doit être décoré et comment. C'est bien plus efficace et réduit également les risques de décorer un mauvais élément.

+
+

La boîte de dialogue de recherche de fichiers à ce stade : Source Voir

+
+
+

Dans la prochaine section, nous verrons comment appliquer des styles aux arbres.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/ajouter_des_libell\303\251s_et_des_images/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/ajouter_des_libell\303\251s_et_des_images/index.html" new file mode 100644 index 0000000000..691fda155e --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/ajouter_des_libell\303\251s_et_des_images/index.html" @@ -0,0 +1,64 @@ +--- +title: Ajouter des libellés et des images +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Ajouter_des_libellés_et_des_images +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Adding_Labels_and_Images +--- +
+

« PrécédentSuivant »

+
+

Cette section décrit la façon d'ajouter des libellés et des images dans une fenêtre. En complément, nous verront comment inclure des éléments dans des groupes.

+

Éléments de texte

+

Vous ne pouvez pas écrire du texte directement dans un fichier XUL sans le placer entre des balises, et espérer qu'il s'affiche. Vous avez deux éléments XUL à votre disposition pour cela.

+

Élément label

+

La façon la plus basique pour inclure du texte dans une fenêtre est d'utiliser l'élément label. Il sert à placer un libellé à côté d'un contrôle, tel qu'un bouton. Voici un exemple :

+

Exemple 1: Source Voir

+
<label value="ceci est du texte"/>
+

L'attribut value sert à spécifier le texte à afficher. Le texte ne sera pas coupé, et donc apparaîtra sur une seule ligne. Il s'agit de la syntaxe la plus courante pour des libellés.

+

Si le texte doit être coupé, vous pouvez placer son contenu à l'intérieur de balises ouvrantes et fermantes comme dans l'exemple suivant :

+

Exemple 2 :

+
<label>Ceci est un texte plus long qui peut être coupé sur plusieurs lignes.</label>
+

Comme en HTML, les césures de ligne et espaces supplémentaires sont réduits à un simple espace. Plus tard, nous verrons comment imposer la largeur des éléments pour que la césure se voit plus facilement.

+

Attribut control

+

Vous pouvez utiliser l'attribut control pour définir quel contrôle est associé au libellé. Lorsque l'utilisateur clique sur le libellé associé, le contrôle obtient le focus. Cette association est également importante pour l'accessibilité, permettant aux lecteurs vocaux de lire le libellé du contrôle que l'utilisateur a tabulé. Définissez la valeur de l'attribut control avec l'id de l'élément obtiendra le focus.

+

Exemple 2: Source Voir

+
<label value="Cliquez ici" control="open-button" />
+<button id="open-button" label="Ouvrir"/>
+
+

Dans l'exemple du dessus, en cliquant sur le libellé, le focus sera mis sur le bouton.

+

Élément description

+

Pour du texte descriptif non associé avec un contrôle particulier, vous pouvez utiliser l'élément description. Cet élément est utile pour du texte informatif placé en haut d'une boîte de dialogue ou d'un groupe de contrôles par exemple. Comme pour l'élément label, vous pouvez soit utiliser l'attribut value pour une seule ligne de texte, soit placer le contenu du texte dans des balises ouvrantes et fermantes description pour des blocs de texte plus long. L'usage veut que la syntaxe avec attribut serve pour les libellés et que celle avec le contenu de texte serve pour des descriptions.

+

Exemple 4: Source Voir

+
<description>
+     Cette longue section de texte est affichée.
+</description>
+
+

Intrinsèquement, les deux éléments label et description sont les mêmes. Les éléments label sont généralement utilisés pour des libellés, tels que ceux des champs de saisie. L'élément description est généralement employé pour d'autres textes descriptifs telle qu'une information placée en haut d'une boîte de dialogue.

+

Les images

+

Comme en HTML, XUL a un élément pour afficher des images à l'intérieur d'une fenêtre. Cet élément est nommé naturellement image. Notez que le nom de la balise est différent de celle en HTML (image au lieu de img). Vous pouvez utiliser l'attribut src pour indiquer l'URL de l'image. L'exemple suivant le montre :

+
<image src="images/banner.jpg" />
+
+

Bien que vous pouvez utiliser cette syntaxe, il est préférable d'utiliser une feuille de styles pour spécifier une URL. Une section ultérieure vous décriera comment utiliser des feuilles de styles, mais l'exemple ci-dessous vous permettra d'appréhender le sujet. Vous pouvez utiliser le style CSS list-style-image pour définir l'URL de l'image. Voici des exemples :

+
XUL:
+ <image id="image1"/>
+ <image id="search"/>
+
+
Style Sheet:
+ #image1 {
+   list-style-image: url("chrome://findfile/skin/banner.jpg");
+ }
+
+ #search {
+   list-style-image: url("http://example.com/images/search.png");
+ }
+
+

Ces images proviennent du répertoire chrome, dans le thème du paquetage findfile. Comme les images varient selon le thème graphique, vous devez normalement mettre les images dans le répertoire skin.

+
+

Dans la section suivante, nous apprendrons comment ajouter des contrôles de saisie à une fenêtre.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/ajouter_plus_d'\303\251l\303\251ments/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/ajouter_plus_d'\303\251l\303\251ments/index.html" new file mode 100644 index 0000000000..d7ca633691 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/ajouter_plus_d'\303\251l\303\251ments/index.html" @@ -0,0 +1,73 @@ +--- +title: Ajouter plus d'éléments +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Ajouter_plus_d'éléments +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Adding_More_Elements +--- +

 

+
+

« PrécédentSuivant »

+
+

Nous allons conclure ce chapitre en ajoutant des boîtes sur notre fenêtre de recherche de fichiers.

+
+

Ajout d'éléments à notre exemple de recherche de fichiers

+

Nous allons ajouter maintenant des éléments à notre boîte de dialogue de recherche de fichiers. Premièrement, nous allons ajouter la possiblité de faire une recherche sur d'autres informations, comme la taille et la date du fichier.

+ 
<hbox>
+  <menulist id="searchtype">     <menupopup>       <menuitem label="Nom"/>       <menuitem label="Taille"/>       <menuitem label="Date de modification"/>     </menupopup>   </menulist>   <spacer style="width: 10px;"/>   <menulist id="searchmode">     <menupopup>       <menuitem label="Est"/>       <menuitem label="N'est pas"/>     </menupopup>   </menulist>   <spacer style="width: 10px;"/>
+  <textbox id="find-text" flex="1" style="min-width: 15em;"/>
+</hbox>
+
+
+ Image:xultu_boxfinal1.png
+

Deux listes déroulantes ont été ajoutées à la boîte de dialogue. Un espacement (spacer) a été inséré entre chaque élément pour les séparer. Ces espacements ont une taille explicite de 10 pixels chacun. Vous noterez que si la fenêtre est redimensionnée, le champ de saisie s'agrandit mais pas les autres composants. Vous noterez également que le libellé a été enlevé.

+

Si vous redimensionnez la fenêtre verticalement, les éléments ne changeront pas de taille. C'est parce qu'ils sont à l'intérieur de boîtes horizontales. Ce serait mieux si les boutons « Rechercher » et « Annuler » restaient toujours en bas de la fenêtre. Il est facile de le faire en ajoutant un spacer entre les deux boîtes horizontales.

+ 
<spacer style="height: 10px"/>
+<hbox>
+  <menulist id="searchtype">
+    <menupopup>
+      <menuitem label="Nom"/>
+      <menuitem label="Taille"/>
+      <menuitem label="Date de modification"/>
+    </menupopup>
+  </menulist>
+  <spacer style="width: 10px;"/>
+  <menulist id="searchmode">
+    <menupopup>
+      <menuitem label="Est"/>
+      <menuitem label="N'est pas"/>
+    </menupopup>
+  </menulist>
+  <spacer style="width: 10px;"/>
+  <textbox id="find-text" flex="1" style="min-width: 15em;"/>
+</hbox>
+
+<spacer style="height: 10px" flex="1"/>
+
+<hbox>
+
+

Maintenant, quand la boîte de dialogue est redimensionnée, les deux boutons resteront en place tout en bas de la boîte de dialogue. Le premier spacer ajoute un espacement entre le titre du libellé et les éléments des critères de recherche.

+

Il serait plus joli d'avoir une bordure autour des critères de recherche. Il y a deux moyens pour le faire. Vous pouvez utiliser la propriété CSS border ou vous pouvez utiliser l'élément groupbox. La première méthode nécessite que nous appliquions le style sur la boîte elle-même. Nous utiliserons plutôt l'autre méthode. Un élément groupbox a l'avantage de dessiner une boîte avec un joli effet d'incrustation, en adéquation avec le thème courant.

+

Changeons maintenant la boîte box en groupbox :

+ 
<groupbox orient="horizontal">
+  <caption label="Critères de recherche"/>
+  <menulist id="searchtype">
+  .
+  .
+  .
+  <spacer style="width: 10px;"/>
+  <textbox id="find-text" flex="1" style="min-width: 15em;"/>
+</groupbox>
+
+

Source Voir

+

Image:xultu_boxfinal2.png

+

Il reste d'autres problèmes cosmétiques. Nous pourrions avoir un groupbox qui s'étend verticalement vers le bas de la boîte. Mais aussi, nous pourrions modifier quelques marges afin de mieux positionner les éléments.

+
+
+

Nous verrons dans la suite comment créer des piles.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/arbres/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/arbres/index.html new file mode 100644 index 0000000000..e566557c9a --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/arbres/index.html @@ -0,0 +1,105 @@ +--- +title: Arbres +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Arbres +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Trees +--- +

 

+
+

« PrécédentSuivant »

+
+

XUL fournit un moyen de créer des listes tabulaires ou hiérarchiques en utilisant un arbre.

+

L'élément tree

+

Un des éléments les plus complexes de XUL est l'arbre. Un arbre peut être utilisé pour afficher des lignes de texte en colonnes. Il peut servir pour des listes tabulaires ou arrangées hiérarchiquement. Un arbre permet également à l'utilisateur de réarranger, redimensionner et masquer individuellement certaines colonnes. Les messages dans une application courrier ou les marque-pages dans Mozilla sont des exemples d'utilisation d'arbres.

+

D'une certaine manière, un arbre a des similitudes avec une boîte de liste listbox. Tous deux peuvent être utilisés pour créer des tableaux de données avec des lignes et des colonnes multiples, et ils peuvent contenir des en-têtes de colonnes. Les arbres supportent également les lignes imbriquées, alors que les boîtes de liste ne le peuvent pas. Toutefois, les boîtes de liste peuvent contenir n'importe quel type de contenu, alors que les arbres ne peuvent contenir que du texte et des images (par le biais de fonctionnalités avancées, des barres de progression et cases à cocher peuvent également être mis dans un arbre).

+

Un arbre comporte deux parties : un ensemble de colonnes et le corps de l'arbre.

+ +

L'arbre est un élément XUL particulier dans le sens où son corps est constitué d'un seul composant graphique qui dessine toutes les données dans l'arbre. Cette définition contraste avec la boîte de liste où des balises individuelles listitem et listcell sont utilisées pour spécifier chaque ligne dans l'élément listbox. Dans un arbre, toutes les données à afficher sont fournies par un objet séparé, appelé la vue d'arbre. Lorsqu'une cellule doit être affichée, le composant graphique de l'arbre fait appel à cet objet de vue d'arbre pour déterminer ce qui doit être affiché, et le dessine ensuite dans l'arbre. L'arbre est suffisamment intelligent pour ne solliciter les informations de la vue que pour les lignes qui ont besoin d'être affichées. Ainsi, l'affichage est optimisé par le chargement des données le nécessitant réellement. Par exemple, un arbre peut contenir des milliers de lignes, la plupart d'entre elles étant en dehors du cadre de l'arbre, cachées à la vue. Ainsi, l'arbre peut contenir un grand nombre de lignes sans rien perdre en performance. Bien entendu, ceci est indépendant de la performance de l'objet de vue lui-même.

+

L'objet vue d'arbre implémente l'interface nsITreeView. Cette interface contient trente propriétés et fonctions que vous pourrez implémenter. Ces fonctions seront appelées par l'arbre, au besoin, pour récupérer les données et les états de l'arbre. Par exemple, la fonction getCellText() sera appelée pour obtenir le libellé d'une cellule particulière dans l'arbre.

+

L'utilisation d'une vue a l'avantage de vous permettre de stocker vos données d'une façon plus adaptée à l'arbre, ou de charger les données sur demande seulement lorsque les lignes sont affichées. Elle offre une plus grande souplesse dans l'utilisation des arbres.

+

Naturellement, devoir implémenter une vue d'arbre avec une trentaine de propriétés et méthodes peut être très encombrant, surtout pour des arbres simples. Fort heureusement, XUL fournit un ensemble d'implémentations natives réalisant le gros du travail pour vous. Pour la plupart des arbres, surtout lorsque vous débutez, vous utiliserez un de ces types natifs. Cependant, vous pouvez créer également une vue d'arbre entièrement de A à Z. Dans ce cas, vous devrez stocker vos données dans un tableau ou une structure JavaScript, ou les charger à partir d'un fichier XML.

+

Comme le corps de l'arbre dans sa totalité est un unique élément graphique, vous ne pouvez pas modifier le style des lignes ou des cellules individuellement de manière classique. En fait, il n'existe pas d'éléments affichant des cellules individuelles comme il en existe avec les boîtes de liste. À la place, tout l'affichage est effectué par le corps de l'arbre grâce aux données fournies par la vue de l'arbre. Ce point important peut dérouter bien des développeurs XUL. Pour modifier l'apparence d'une cellule d'un arbre, la vue doit associer un jeu de mots clefs pour une ligne et une cellule. Une syntaxe CSS spéciale est employée entre les composants de styles du corps d'un arbre grâce à ces mots clefs. Dans un sens, le mécanisme est similaire aux classes CSS. L'application d'un style à un arbre sera détaillée dans une section ultérieure.

+

Les éléments d'arbre

+

Les arbres sont créés avec l'élément tree qui sera décrit dans les prochaines sections. Il existe également deux éléments définissant l'affichage des colonnes dans l'arbre.

+
tree 
L'élément entourant d'un arbre
treecols 
L'élément initialisant une série de treecol
treecol 
Cet élément déclare une colonne d'arbre. Avec l'utilisation de cet élément, vous pouvez spécifier des informations supplémentaires sur le tri des données en colonne ou encore la possibilité ou non pour l'utilisateur de redimensionner les colonnes. Vous devez toujours placer un attribut id sur une colonne, car Mozilla utilise cet identifiant pour les colonnes à réarranger ou à masquer. Il n'est plus nécessaire sous les versions 1.8 et suivantes de Mozilla, mais c'est une bonne habitude à conserver.
treechildren 
Cet élément contient le corps principal de l'arbre, là où les lignes individuelles de données seront affichées
+
+

Voici un exemple d'arbre avec deux colonnes :

+

Exemple 1 : Source Voir

+
<tree flex="1">
+
+  <treecols>
+    <treecol id="nameColumn" label="Nom" flex="1"/>
+    <treecol id="addressColumn" label="Adresse" flex="2"/>
+  </treecols>
+
+  <treechildren/>
+
+</tree>
+
+

Tout d'abord, l'ensemble du tableau est entouré avec l'élément tree. Il déclare un élément qui servira de tableau ou d'arbre. Comme avec les tables HTML, les données d'un arbre sont toujours organisées en lignes. Les colonnes sont spécifiées grâce à la balise treecols.

+

Vous pouvez mettre dans un arbre autant de colonnes que vous le souhaitez. Comme pour les boîtes de listes, une ligne d'en-tête apparaîtra avec les libellés des colonnes. Un menu déroulant apparaîtra dans le coin supérieur droit de l'arbre et permettra à l'utilisateur d'afficher ou de masquer les colonnes individuellement. Chaque colonne est créée avec l'élément treecols. Vous pouvez définir le libellé d'en-tête en utilisant l'attribut label. Vous pouvez également rendre vos colonnes flexibles si votre arbre l'est aussi, ainsi les colonnes s'ajusteront en fonction de l'arbre. Dans cet exemple, la seconde colonne sera deux fois plus large que la première. Toutes les colonnes doivent être définies à l'intérieur de l'élément treecols.

+

Dans ce cas, nous n'avons pas indiqué à la vue les données de l'arbre, seuls les en-têtes de colonnes et un arbre vide seront visibles. Vous pouvez redimensionner la fenêtre, mais rien n'apparaîtra puisqu'il n'y a aucune donnée à afficher. Puisque la flexibilité de l'arbre a été spécifiée, son corps s'ajustera à l'espace disponible. La flexibilité d'un arbre est couramment appliquée, car les données de l'arbre sont souvent les informations les plus significatives affichées, donc il est logique que l'arbre puisse ajuster sa dimension. Toutefois, vous pouvez spécifier un nombre de lignes à afficher dans l'arbre en affectant l'attribut rows sur l'élément tree. Notez que cet attribut indique le nombre de lignes qui seront affichées dans l'interface utilisateur et non le nombre de lignes de données. Le nombre total de lignes de données est fourni par la vue d'arbre. S'il y a trop de lignes de données à afficher dans l'arbre, une barre de défilement apparaîtra pour permettre à l'utilisateur de visualiser le reste. Si vous ne spécifiez aucun attribut rows, la valeur par défaut sera '0' signifiant qu'aucune ligne ne s'affichera. Dans ce cas, vous devrez rendre votre arbre flexible. Si votre arbre est flexible, il n'a pas besoin d'un attribut rows puisqu'il s'ajustera toujours à l'espace disponible.

+

Le contenu de la vue d'arbre

+

Nous avons vu que les données à afficher dans un arbre proviennent d'une vue et non de balises XUL, en passant par une construction interne de la vue d'arbre à partir des balises XUL. Ce mécanisme peut paraître légèrement confus. Retenez simplement que la construction des vues d'arbre emploie une série de balises servant à définir l'information sur les données dans l'arbre. Les éléments suivants sont utilisés :

+
treeitem 
Il contient une unique ligne de niveau supérieur et tous ses descendants. Il sert également d'item pouvant être sélectionné par l'utilisateur. La balise treeitem entoure toute une ligne en permettant de la sélectionner entièrement.
treerow 
Une seule ligne d'un arbre devant être placée à l'intérieur d'une balise treeitem.
treecell 
Une seule cellule d'un arbre. Cet élément est placé à l'intérieur d'un élément treerow.
+
+

Par convention, ces balises peuvent être placées directement à l'intérieur de la balise treechildren, imbriquées dans l'ordre mentionné ci-dessus. Ces balises définissent les données à afficher dans le corps de l'arbre. Dans ce cas, l'arbre utilise la construction interne de la vue d'arbre, appelée le contenu de la vue d'arbre, qui utilise les libellés et les valeurs spécifiés sur ces éléments comme données pour l'arbre. Lorsque l'arbre a besoin d'afficher une ligne, il demande à la vue d'arbre le libellé de la cellule en appelant la fonction getCellText() de la vue qui, dans la continuité, obtient la donnée de l'élément treecell correspondant.

+

Cependant, les trois éléments listés ci-dessus ne sont pas affichés directement. Ils ne sont utilisés que comme source de données pour la vue. Ainsi, seuls des attributs utiles sont appliqués sur l'élément treeitem et les éléments associés. Par exemple, vous ne pouvez pas modifier l'apparence des lignes d'un arbre en utilisant un attribut style ou d'autres propriétés CSS, et les fonctionnalités existantes pour les boîtes, telles que la flexibilité et l'orientation, ne peuvent pas être employées.

+

En fait, à part quelques attributs spécifiques aux arbres, les seuls qui auront un effet sont l'attribut label pour définir un texte libellé d'une cellule et l'attribut src pour définir une image. Toutefois, dans les sections ultérieures, nous verrons des moyens spéciaux de modifier le style d'un arbre et d'appliquer d'autres fonctionnalités.

+

De même, les événements ne sont pas générés par un élément treeitem et ses enfants ; en revanche, ils seront générés par l'élément treechildren.

+

Le fait que les éléments treeitem soient si différents des autres éléments XUL est une source classique de confusion pour les développeurs XUL. Essentiellement, le contenu de la vue d'arbre est une vue où les données des cellules sont fournies à partir des balises placées à l'intérieur de l'arbre. Naturellement, si vous utilisez un type différent de vue, les données seront fournies par une autre source, et il n'y aura aucun élément treeitem du tout.

+

Commençons par regarder comment créer un arbre simple avec des colonnes multiples en utilisant la vue d'arbre de contenu. Il pourrait servir à créer une liste de messages mél (mails). Il y aura plusieurs colonnes, telles que l'expéditeur et le sujet.

+

Exemple avec treechildren

+

Exemple 2: Source Voir

+

Image:xultu_trees1.png

+
<tree flex="1">
+
+  <treecols>
+    <treecol id="sender" label="Expéditeur" flex="1"/>
+    <treecol id="subject" label="Sujet" flex="2"/>
+  </treecols>
+
+  <treechildren>
+    <treeitem>
+      <treerow>
+        <treecell label="joe@somewhere.com"/>
+        <treecell label="Plans Top secret"/>
+      </treerow>
+    </treeitem>
+    <treeitem>
+      <treerow>
+        <treecell label="mel@whereever.com"/>
+        <treecell label="Invitation à déjeuner"/>
+      </treerow>
+    </treeitem>
+  </treechildren>
+
+</tree>
+
+

Comme vous pouvez le voir sur cette image, l'arbre a été créé avec deux lignes de données.

+

Cet arbre a deux colonnes dont la seconde occupe plus de place que la première. Vous rendrez généralement les colonnes flexibles. Vous pouvez également imposer les largeurs grâce à l'attribut width. Vous devez inclure le même nombre d'éléments treecol qu'il y a de colonnes dans l'arbre. Dans le cas contraire, des choses étranges pourraient se produire.

+

Les en-têtes sont créés automatiquement. Le bouton situé dans le coin supérieur droit sert à afficher ou à masquer les colonnes. Vous pouvez placer un attribut hidecolumnpicker sur l'élément tree et le définir à 'true' si vous désirez masquer ce bouton. Si ce bouton est masqué, l'utilisateur ne sera pas en mesure de masquer des colonnes.

+

Assurez-vous d'avoir défini un attribut id sur chaque colonne, sinon les actions de masquage et d'affichage ne fonctionneront pas avec toutes les versions de Mozilla.

+

L'élément treechildren entoure toutes les lignes. Les lignes individuelles à l'intérieur du corps peuvent contenir d'autres lignes. Pour l'arbre le plus simple, chaque ligne est créée avec les éléments treeitem et treerow. L'élément treerow entoure toutes les cellules d'une ligne, tandis que l'élément treeitem entoure une ligne et tous ses enfants. Les arbres avec des lignes imbriquées seront décrits dans la section suivante.

+

Dans les cellules, vous placerez les cellules individuelles. Elles sont créées avec l'élément treecell. Vous pouvez définir un texte dans une cellule en utilisant l'attribut label. Le premier élément treecell d'une ligne détermine le contenu qui apparaîtra dans la première colonne, le deuxième élément treecell détermine le contenu qui apparaîtra dans la deuxième colonne, et ainsi de suite.

+

L'utilisateur peut sélectionner les items de l'arbre en cliquant sur eux avec la souris, ou en mettant en surbrillance avec le clavier. Il peut en sélectionner plusieurs en maintenant la touche Maj ou Ctrl appuyée et en cliquant sur d'autres lignes. Pour désactiver la sélection multiple, placez un attribut seltype sur l'élément tree avec la valeur 'single'. Ainsi, l'utilisateur ne pourra sélectionner qu'une seule ligne à la fois.

+
+

Ajout d'un arbre sur notre exemple de recherche de fichiers

+

Ajoutons un arbre à notre exemple de recherche de fichiers dans lequel les résultats de la recherche seront affichés. L'arbre utilisera une vue de contenu d'arbre. Le code suivant doit être ajouté à la place de la balise iframe.

+

Exemple : Source Voir

+
<tree flex="1">
  <treecols>
    <treecol id="name" label="Nom de fichier" flex="1"/>
    <treecol id="location" label="Emplacement" flex="2"/>
    <treecol id="size" label="Taille" flex="1"/>
  </treecols>

  <treechildren>
   <treeitem>
     <treerow>
       <treecell label="mozilla"/>
       <treecell label="/usr/local"/>
       <treecell label="2520 bytes"/>
     </treerow>
   </treeitem>
  </treechildren>
</tree>
+
+<splitter collapse="before" resizeafter="grow"/>
+
+

Nous avons ajouté un arbre avec les trois colonnes 'Nom de fichier', 'Emplacement' et 'Taille'. La deuxième colonne sera deux fois plus large grâce à une flexibilité plus grande. Une seule ligne a été ajoutée pour les besoins de la démonstration de l'apparence du tableau avec une ligne. Dans une implémentation réelle, les lignes seront ajoutées par un script à l'issue de la recherche, ou une vue personnalisée sera créée pour contenir les données.

+
+
+

Nous verrons ensuite comment créer des arbres plus complexes.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/arbres_et_gabarits/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/arbres_et_gabarits/index.html new file mode 100644 index 0000000000..34bbdd2a6c --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/arbres_et_gabarits/index.html @@ -0,0 +1,93 @@ +--- +title: Arbres et Gabarits +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Arbres_et_Gabarits +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Trees_and_Templates +--- +

 

+
+

« PrécédentSuivant »

+
+

Nous allons voir maintenant comment utiliser un gabarit avec un arbre.

+

Ajout de sources de données aux arbres

+

Avec un arbre, vous utiliserez souvent un gabarit pour construire son contenu, pour manipuler un grand volume de données hiérarchisées. L'utilisation d'un gabarit avec un arbre est très proche au niveau de la syntaxe aux autres éléments. Vous avez besoin d'ajouter un attribut datasources et ref à la balise tree, ce qui spécifie la source des données et le nœud racine à afficher. De nombreuses règles peuvent être utilisées pour indiquer différents contenus pour différents types de données.

+

L'exemple suivant utilise l'historique comme source de données :

+
<tree datasources="rdf:history" ref="NC:HistoryByDate"
+          flags="dont-build-content">
+
+

Comme il est décrit dans la section précédente, l'arbre peut utiliser un constructeur d'arbre pour la génération du gabarit à la place du constructeur normal de contenu. Les éléments ne seront pas créés pour chacune des lignes dans l'arbre, afin de le rendre plus performant. Lorsque l'attribut flags a pour valeur 'dont-build-content', comme dans l'exemple ci-dessus, il indique que le constructeur de l'arbre doit être utilisé. Si l'attribut n'est pas renseigné, le constructeur de contenu sera utilisé. Vous pouvez voir la différences en utilisant l'inspecteur DOM de Mozilla sur un arbre avec, puis sans l'attribut.

+

Si vous utilisez le constructeur normal à la place, notez que le contenu ne sera pas construit avant qu'il soit nécessaire. Avec les arbres hiérarchiques, les enfants ne sont pas générés avant que le nœud parent ne soit ouvert par l'utilisateur.

+

Dans le gabarit, il n'y aura qu'une cellule treecell pour chaque colonne dans l'arbre. Les cellules devront avoir un attribut label afin de mettre un libellé à la cellule. Normalement, une propriété RDF se charge de récupérer le libellé à partir de la source de données.

+

Exemple d'arbre construit par un gabarit

+

L'exemple suivant montre un arbre construit à partir d'un gabarit, dans ce cas le système de fichier.

+

Exemple 1 : Source

+
<tree id="my-tree" flex="1"
+       datasources="rdf:files" ref="file:///" flags="dont-build-content">
+  <treecols>
+    <treecol id="Name" label="Nom" primary="true" flex="1"/>
+    <splitter/>
+    <treecol id="Date" label="Date" flex="1"/>
+  </treecols>
+
+    <template>
+      <rule>
+        <treechildren>
+          <treeitem uri="rdf:*">
+            <treerow>
+              <treecell label="rdf:http://home.netscape.com/NC-rdf#Name"/>
+              <treecell label="rdf:http://home.netscape.com/WEB-rdf#LastModifiedDate"/>
+            </treerow>
+          </treeitem>
+        </treechildren>
+      </rule>
+    </template>
+</tree>
+
+

Ici, un arbre est créé avec deux colonnes, pour le nom et la date d'un fichier. L'arbre doit afficher une liste de fichiers situés dans le répertoire racine. Une seule règle est utilisée, mais vous pouvez en ajouter d'autres si vous en avez besoin. Comme avec les autres gabarits, l'attribut uri d'un élément indique où commencer pour générer du contenu. Les deux cellules puisent le nom et la date dans la source et place les valeurs dans le libellé de la cellule.

+

Cet exemple montre pourquoi l'attribut uri devient utile. Notez comment il a été placé dans le treeitem dans l'exemple, même si ce n'est pas un descendant direct de l'élément rule. Nous avons besoin de mettre cet attribut seulement sur les éléments que nous voulons répéter pour chaque ressource. Comme nous ne voulons pas des éléments treechildren multiples, l'attribut est placé ailleurs. Nous le mettons plutôt dans l'élément treeitem. En fait, les éléments à l'extérieur (ou au-dessus) de l'élément qui a l'attribut uri ne sont pas dupliqués tandis que les éléments avec l'attribut uri et les éléments à l'intérieur sont répétés pour chaque ressource.

+
Image:xultu_rdfoutl1.jpg
+

Comme un constructeur d'arbre est utilisé et non un constructeur de contenu, la structure des éléments dans l'exemple ci-dessus doit être comme indiqué, avec l'élément treechildren à l'intérieur de rule. Bien que le constructeur d'arbres ne génère pas ces éléments, cette structure est nécessaire pour déterminer comment les générer correctement.

+

Notez dans l'image que des éléments fils additionnels ont été ajoutés automatiquement sous les éléments du niveau supérieur. XUL sait comment ajouter des éléments fils quand les modèles ou règles contiennent des éléments arbre ou menu. Il génère alors les éléments d'arbre imbriqués selon les données disponibles dans le RDF.

+

Une partie intéressante des sources de données RDF est que les valeurs sont déterminées seulement quand les données sont requises. Les valeurs qui sont plus profondes dans la hiérarchie de ressource ne sont pas déterminées jusqu'à ce que l'utilisateur atteigne ce nœud dans l'arbre. Ce mécanisme devient utile pour certaines sources où les données sont déterminées dynamiquement.

+

Trier les colonnes

+

Si vous essayez l'exemple précédent, vous pouvez noter que la liste de dossiers n'est pas triée. Les arbres qui produisent leurs données à partir d'une source ont la capacité facultative de trier leurs données. Vous pouvez trier de façon croissante ou décroissante sur n'importe quelle colonne. L'utilisateur peut changer la colonne de tri et la direction de tri en cliquant sur les en-têtes de colonne. Ce dispositif de tri n'est pas disponible pour des arbres dont le contenu est statique, bien que vous puissiez écrire un script pour trier ces données.

+

Le tri implique trois attributs, qui doivent être placés sur les colonnes. Le premier attribut, sort, doit être placé sur une propriété de RDF qui est employée alors comme critère de tri. Habituellement, c'est la même que celle utilisée pour le libellé de la cellule de cette colonne. Si vous le placez sur une colonne, les données seront triées dans cette colonne. L'utilisateur peut changer la direction de tri en cliquant sur l'en-tête de colonne. Si vous ne placez pas l'attribut sort sur une colonne, les données ne pourront pas être triées par cette colonne.

+

L'attribut sortDirection (notez la casse mixte) est utilisé pour définir la direction dans laquelle la colonne sera triée par défaut. Trois valeurs sont possibles :

+
ascending 
les données sont affichées par ordre croissant.
descending 
les données sont affichées par ordre décroissant.
natural 
les données sont affichées dans le sens "naturel", c'est-à-dire l'ordre dans lequel elles sont apparaissent dans la source RDF.
+
+

Le dernier attribut, sortActive, doit être défini à 'true' sur une seule colonne, celle qui sera triée par défaut.

+

Bien que le tri fonctionnera correctement avec seulement ces attributs, vous pouvez également utiliser la classe de style sortDirectionIndicator sur une colonne qui peut être triée. Un petit triangle apparaîtra dans l'en-tête de colonne et indiquera le sens du tri. Sans cela, l'utilisateur pourra toujours trier les colonnes mais il n'aura pas d'indication sur la colonne triée.

+

L'exemple suivant modifie les colonnes de l'exemple précédent pour inclure les fonctionnalités supplémentaires :

+
<treecols>
+  <treecol id="Name" label="Nom" flex="1" primary="true"
+            class="sortDirectionIndicator" sortActive="true"
+            sortDirection="ascending"
+            sort="rdf:http://home.netscape.com/NC-rdf#Name"/>
+  <splitter/>
+  <treecol id="Date" label="Date" flex="1" class="sortDirectionIndicator"
+           sort="rdf:http://home.netscape.com/WEB-rdf#LastModifiedDate"/>
+</treecols>
+
+

L'état persistant des colonnes

+

Une chose supplémentaire que vous voudrez faire est de rendre persistant la colonne qui est actuellement triée, ainsi cet état est mémorisé entre chaque session. Pour ce faire, nous utilisons l'attribut persist sur chaque élément treecol. Il peut être utile de rendre persistant cinq attributs : la taille de la colonne, l'ordre des colonne, la visibilité de la colonne, quelle colonne est actuellement triée et dans quel ordre. L'exemple suivant montre une simple colonne :

+
<treecol id="Date" label="Date" flex="1"
+             class="sortDirectionIndicator"
+             persist="width ordinal hidden sortActive sortDirection"
+             sort="rdf:http://home.netscape.com/WEB-rdf#LastModifiedDate"/>
+
+

D'autres détails sur l'attribut persist seront décrits dans une section ultérieure.

+

Attributs supplémentaires pour les règles

+

Deux attributs supplémentaires peuvent être ajoutés sur l'élément rule, lui permettant d'appliquer des correspondances dans certaines circonstances. Les deux sont des booléens.

+
iscontainer 
Si cet attribut est mis à 'true', alors la règle s'appliquera sur toutes les ressources qui peuvent avoir des enfants. Par exemple, nous pouvons appliquer cette règle pour récupérer les dossiers des marque-pages. Il est utile car la source de données n'a pas besoin d'inclure un attribut spécial pour l'indiquer.
isempty 
Si cet attribut est mis à 'true', alors la règle s'appliquera sur toutes les ressources qui n'ont pas d'enfants.
+
+

Une ressource pourrait être un conteneur et être vide en même temps. Toutefois, c'est différent pour une ressource qui n'est pas un conteneur. Par exemple, un dossier de marque-pages est un conteneur mais il peut avoir ou ne pas avoir d'enfants. Cependant, un simple marque-page ou un séparateur n'est pas un conteneur.

+

Vous pouvez combiner ces deux éléments avec d'autres attributs de critères pour des règles plus spécifiques.

+
+

Dans la section suivante, nous verrons quelques unes des sources de données fournies par Mozilla.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/assistant_avan\303\247\303\251/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/assistant_avan\303\247\303\251/index.html" new file mode 100644 index 0000000000..1c1073bd15 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/assistant_avan\303\247\303\251/index.html" @@ -0,0 +1,66 @@ +--- +title: Assistant avançé +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Assistant_avançé +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/More_Wizards +--- +

 

+
+

« PrécédentSuivant »

+
+

Cette section décrit quelques fonctionnalités supplémentaires sur les assistants.

+

Une navigation plus complexe

+

Normalement, un assistant affiche chaque page dans l'ordre où vous les placez dans le fichier XUL. Dans certains cas cependant, vous pouvez vouloir que les pages de l'assistant apparaissent en fonction des choix effectués par l'utilisateur sur les pages précédentes.

+

Dans ce cas, placez un attribut pageid sur chacune des pages. Un identifiant devra être placé sur chaque page. Ensuite, pour naviguer d'une page à l'autre, utilisez une des deux méthodes suivantes :

+
  1. Affectez à l'attribut next de chaque page la valeur de l'identifiant de la page qui doit la suivre. Vous pouvez changer ces attributs comme vous le souhaitez pour naviguer vers d'autres pages.
  2. Appelez la méthode goTo() de l'assistant. Elle prend comme unique argument l'identifiant de la page suivante. Vous pouvez appeler cette méthode dans les gestionnaires onpageadvanced ou onwizardnext. Dans ce cas, n'oubliez pas de retourner la valeur 'false', car vous avez déjà changé la page par vous-même. Notez que la méthode goTo() charge une nouvelle page, par conséquent les événements liés sont lancés. Vous devez donc vous assurer d'avoir prévu ce cas.
    3. +
+

Par exemple, nous avons ici un ensemble de pages d'assistant (le contenu interne a été omis) :

+
<wizardpage pageid="type" next="font">
+<wizardpage pageid="font" next="done">
+<wizardpage pageid="color" next="done">
+<wizardpage pageid="done">
+
+ +

Un script ajustera la valeur de l'attribut next dès qu'il sera nécessaire d'aller sur la page identifiée 'color'.

+

Fonctions d'assistant

+

L'assistant fonctionne presque comme un panneau d'onglets, sauf que les onglets ne sont pas affichés et que l'utilisateur navigue entre les pages en utilisant les boutons de bas de page. Comme toutes les pages font parties d'un même fichier, toutes les valeurs des champs sur toutes les pages sont conservées. Par conséquent, il est inutile de sauvegarder ou charger ces informations entre les pages.

+

Cependant, vous pourriez vouloir faire quelques validations sur chaque champ de chaque page. Pour ce faire, utilisez les gestionnaires décrits dans la section précédente. Si un champ est invalide, vous pouvez afficher un message d'alerte. Dans certains cas, il serait plus judicieux de désactiver le bouton 'Suivant' jusqu'à ce qu'une valeur valide soit saisie.

+

L'assistant possède une propriété canAdvance qui, quand elle est mise a 'true', indique que le bouton 'Suivant' doit être actif. Si elle a la valeur 'false', le bouton 'Suivant' est désactivé. Vous pouvez changer cette propriété en fonction de la validité des données saisies.

+

Dans l'exemple suivant, l'utilisateur doit entrer un code secret dans le champ de saisie sur la première page de l'assistant. La fonction checkCode() est appelée dés que la première page est affichée comme indiqué par l'attribut onpageshow. Elle est aussi appelée dès qu'une touche est pressée dans le champ textbox, pour déterminer si le bouton 'Suivant' doit être à nouveau actif.

+

Exemple d'assistant

+

Exemple 1 : Source

+
<?xml version="1.0"?>
+<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+
+<wizard id="theWizard" title="Code secret de l'assistant"
+  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+<script>
+function checkCode(){
+  document.getElementById('theWizard').canAdvance = (document.getElementById('secretCode').value == "cabbage");
+}
+</script>
+
+  <wizardpage onpageshow="checkCode(); return true;">
+       <label value="Saisir le code secret:"/>
+       <textbox id="secretCode" onkeyup="checkCode();"/>
+  </wizardpage>
+
+  <wizardpage>
+       <label value="Le code est correct."/>
+  </wizardpage>
+
+</wizard>
+
+

Il existe aussi une propriété correspondante canRewind que vous pouvez utiliser pour activer ou désactiver le bouton 'Précédent'. Les deux propriétés sont ajustées automatiquement dès que vous changez de page. Par conséquent, le bouton 'Précédent' sera désactivé sur la première page, vous n'avez pas à le faire.

+

Une autre propriété utile de l'assistant est currentPage qui donne une référence à la page wizardpage actuellement affichée. Vous pouvez aussi changer la page courante en modifiant cette propriété. Si vous modifiez sa valeur, les différents événements de changement de page seront invoqués.

+
+

Ensuite, nous allons voir comment utiliser les overlays pour gérer du contenu.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/autres_caract\303\251ristiques_des_arbres/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/autres_caract\303\251ristiques_des_arbres/index.html" new file mode 100644 index 0000000000..5852dbcfd7 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/autres_caract\303\251ristiques_des_arbres/index.html" @@ -0,0 +1,109 @@ +--- +title: Autres caractéristiques des arbres +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Autres_caractéristiques_des_arbres +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/More_Tree_Features +--- +

 

+
+

« PrécédentSuivant »

+
+

Nous allons voir ici des caractéristiques supplémentaires sur les arbres.

+

Arbres hiérarchiques

+

L'élement tree est aussi utilisé pour créer des listes hiérarchiques, comme on en trouve dans un gestionnaire de fichiers ou dans les listes de marque-pages d'un navigateur. La vue d'arbre a plusieurs fonctions qui spécifient la hiérarchie des éléments dans un arbre. Chaque élément dans l'arbre possède un niveau commençant à 0. Les éléments les plus élevés dans l'arbre auront un niveau à 0, Les fils de ces éléments auront un niveau à 1, les fils en dessous auront un niveau à 2, et ainsi de suite. L'arbre demandera l'affichage pour le niveau de chaque élément afin de déterminer comment dessiner les rangées.

+

L'arbre dessinera les flèches d'ouverture et de fermeture pour ouvrir et fermer un élément parent ainsi que les lignes reliant les fils à leurs parents. L'arbre se chargera aussi de dessiner les rangées avec le niveau correct d'indentation. Cependant, la vue devra s'assurer de conserver l'état des niveaux de chaque ligne si nécessaire. Ce travail peut parfois être un peu délicat, mais heureusement, le module natif de vue d'arbre réalise tout le travail difficile pour nous.

+

Pour créer un ensemble de rangées imbriquées, tout ce que nous devons faire est d'ajouter un second treechildren élément à l'intérieur du parent treeitem. Vous pouvez ensuite ajouter des éléments à l'intérieur pour spécifier les rangées filles d'un élément. Ne mettez pas d'élément treechildren à l'intérieur de treerow car ceci ne marchera pas.

+

Vous pouvez répéter ce processus pour créer les arbres profondément imbriqués. Essentiellement, un élément treeitem peut contenir soit une simple ligne déclarée avec l'élément treerow, soit un ensemble de lignes déclarées avec l'élément treechildren.

+

Il y a deux autres choses à faire pour vous assurer que la hiérarchie fonctionne correctement. Premièrement, vous devez marquer l'élément treeitem possédant des fils comme conteneur. Il vous suffit d'ajouter l'attribut container comme ceci :

+
<treeitem container="true"/>
+

Cet attribut permet à l'utilisateur de double-cliquer sur le treeitem pour déplier ou replier les lignes intérieures. Vous pouvez faire que les lignes filles soient initialement affichées en ajoutant l'attribut open. Quand l'utilisateur déplie ou replie le parent, la fonction toggleOpenState de la vue est appelée pour basculer l'item de l'état ouvert vers l'état fermé. Pour une vue d'arbre de type contenu, il sera ajouté un attribut open pour refleter l'état courant.

+

Le second changement vous impose de mettre l'attribut primary sur la première colonne. Il fait apparaître un petit triangle ou un signe + devant les cellules dans cette colonne pour indiquer les cellules pouvant être dépliées. De plus, les lignes filles sont indentées. Notez aussi que l'utilisateur ne peut pas cacher cette colonne via le petit menu déroulant à droite des colonnes.

+

Exemple d'arbre hiérarchique

+

Voici un exemple simple :

+

Exemple 1: Source Voir

+
Image:xultu_advtrees1.png
+
<tree rows="6">
+  <treecols>
+      <treecol id="firstname" label="Prénoms" primary="true" flex="3"/>
+      <treecol id="lastname" label="Noms" flex="7"/>
+  </treecols>
+
+  <treechildren>
+    <treeitem container="true" open="true">
+      <treerow>
+        <treecell label="Personnes"/>
+      </treerow>
+
+      <treechildren>
+        <treeitem>
+          <treerow>
+            <treecell label="Bob"/>
+            <treecell label="Carpenter"/>
+          </treerow>
+        </treeitem>
+        <treeitem>
+          <treerow>
+            <treecell label="Jerry"/>
+            <treecell label="Hodge"/>
+          </treerow>
+        </treeitem>
+      </treechildren>
+    </treeitem>
+  </treechildren>
+</tree>
+
+

Cet exemple crée un arbre hiérarchique. Comme on peut le voir sur l'image, un petit signe plus ou moins (souvent appelé « twisty ») est apparu sur la première ligne, indiquant qu'elle contient des lignes filles. En double-cliquant sur la ligne, l'utilisateur ouvre ou ferme la liste. Les lignes filles sont indentées. Notez comment la ligne « Personnes » n'a besoin que d'une colonne.

+

L'élément treeitem externe contient un seul élément treerow et un élément treechildren. Le premier crée la donnée pour la ligne parente et le deuxième contient les items fils.

+

Vous pouvez imbriquer autant de lignes que vous le désirez. Souvenez-vous que vous devez utiliser l'attribut container sur les lignes qui ont des lignes filles. La simple présence de lignes filles n'est pas suffisante pour l'indiquer, car vous pourriez avoir un conteneur sans enfants mais qui devrait quand même être traité comme un conteneur. Par exemple, un répertoire sans fichier devrait être traité comme un conteneur alors qu'un fichier ne le devrait pas.

+

Plus sur les colonnes d'arbres

+

enableColumnDrag est un attribut supplémentaire que vous pouvez ajouter à l'arbre. S'il est mis à 'true', l'utilisateur peut alors déplacer les en-têtes de colonne afin de réarranger l'ordre des colonnes.

+

Un utilisateur peut également vouloir modifier la largeur des colonnes. Il vous suffit de placer un élément splitter entre chaque élément treecol. Une petite encoche apparaissant entre chaque en-tête de colonne pourra être déplacée par l'utilisateur pour changer la largeur d'une colonne. Vous pouvez utiliser la classe de style 'tree-splitter' pour masquer l'encoche bien que la colonne puisse encore être retaillée.

+

Vous pouvez affecter une largeur minimale ou maximale à une colonne, en utilisant les attributs minwidth et maxwidth sur les en-têtes de colonnes.

+

Vous pouvez mettre l'attribut hidden à 'true' pour cacher par défaut une colonne. L'utilisateur pourra afficher la colonne en la sélectionnant dans la liste déroulante au bout de la ligne des en-têtes de colonne.

+

mémorisation de l'état des colonnes

+
Image:xultu_advtrees2.png
+

Comme avec tous les éléments XUL, l'attribut persist peut être utilisé pour sauvegarder l'état des colonnes entre chaque session. Ainsi, la façon dont l'utilisateur aura choisi l'affichage des colonnes sera automatiquement sauvegardé pour sa prochaine session. Vous pouvez sauvegarder plusieurs attributs, comme indiqué dans l'exemple ci-dessous :

+

Exemple 2: Source Voir

+
<tree enableColumnDrag="true" flex="1">
+  <treecols>
+    <treecol id="runner" label="Coureur" flex="2" persist="width ordinal hidden"/>
+    <splitter class="tree-splitter"/>
+    <treecol id="city" label="Ville" flex="2" persist="width ordinal hidden"/>
+    <splitter class="tree-splitter"/>
+    <treecol id="starttime" label="Heure de départ" flex="1" persist="width ordinal hidden"/>
+    <splitter class="tree-splitter"/>
+    <treecol id="endtime" label="Heure d'arrivée" flex="1" persist="width ordinal hidden"/>
+  </treecols>
+
+  <treechildren>
+    <treeitem>
+      <treerow>
+        <treecell label="Joshua Granville"/>
+        <treecell label="Vancouver"/>
+        <treecell label="7:06:00"/>
+        <treecell label="9:10:26"/>
+      </treerow>
+    </treeitem>
+    <treeitem>
+      <treerow>
+        <treecell label="Robert Valhalla"/>
+        <treecell label="Seattle"/>
+        <treecell label="7:08:00"/>
+        <treecell label="9:15:51"/>
+      </treerow>
+    </treeitem>
+  </treechildren>
+</tree>
+
+

Trois attributs des colonnes doivent être persistants,

+ +
+

Dans la prochaine section, nous allons voir comment récupérer ou spécifier une sélection sur un arbre.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/barres_de_d\303\251filement/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/barres_de_d\303\251filement/index.html" new file mode 100644 index 0000000000..16ab8ccae4 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/barres_de_d\303\251filement/index.html" @@ -0,0 +1,39 @@ +--- +title: Barres de défilement +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Barres_de_défilement +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Scroll_Bars +--- +

 

+
+

« PrécédentSuivant »

+
+

Maintenant, voyons comment ajouter des barres de défilement à une fenêtre.

+

Ajout de barres de défilement

+

Une barre de défilement est typiquement employée pour permettre à un utilisateur de parcourir un grand document. Vous pouvez aussi l'utiliser quand vous avez besoin de demander une valeur comprise entre un certain intervalle. Les barres de défilement peuvent être créées de différentes manières. Sous XUL, l'une d'entre elle nécessite l'emploi de la balise scrollbar. Certains éléments, comme des champs de saisie, vont également ajouter des barres de défilement si nécessaire lorsque leur contenu devient trop grand.

+

Dans cette section, nous verrons la création d'une barre de défilement seule. L'utilisateur choisira une valeur en déplaçant la barre de défilement. Vous n'utiliserez probablement pas très souvent cette méthode. Une barre de défilement est constituée de plusieurs partie, l'ascenseur, qui est la partie centrale de la barre, et les deux flèches boutons à chaque extrémités. Une barre de défilement crée tous ces éléments automatiquement.

+

Image:xultu_scroll1.jpg

+

La syntaxe d'une barre de défilement est la suivante :

+
<scrollbar
+   id="identifier"
+   orient="horizontal"
+   curpos="20"
+   maxpos="100"
+   increment="1"
+   pageincrement="10"/>
+
+

Les attributs sont les suivants :

+
id 
L'identifiant unique de la barre de défilement.
orient 
Il spécifie l'orientation de la barre de défilement. Sa valeur par défaut 'horizontal' crée une barre qui s'étend de gauche vers la droite. Vous pouvez également spécifier 'vertical' qui crée une barre s'étendant du haut vers le bas.
curpos 
Il indique la position actuelle de l'ascenseur (le rectangle que vous pouvez déplacer). La valeur s'étend de '0' à la valeur de maxpos. Cette valeur n'a pas besoin d'unité. La valeur par défaut est de '0'.
maxpos 
Il indique la valeur de la position maximale de l'ascenseur. Il s'agit d'une valeur numérique qui n'a pas d'unité. La valeur par défaut est de '100'.
increment 
Ici, le nombre spécifie de combien la valeur de curpos doit être changée quand l'utilisateur clique sur une des flèches de la barre de défilement. La valeur par défaut est de '1'.
pageincrement 
Ici, le nombre spécifie de combien la valeur de curpos doit être changée quand l'utilisateur clique sur la page à travers la barre de défilement, c'est à dire dans la zone entre l'ascenseur et les flèches. La valeur par défaut est de '10'.
+
+

L'exemple donné ci-dessus crée une barre de défilement qui s'étend des valeurs de '0' à '100'. La valeur de '100' peut être considérée comme le nombre de ligne d'une liste, mais elle peut représenter n'importe quoi d'autre. La valeur initiale de cet exemple est de '20'. Quand l'une des flèches de la barre de défilement est cliquée, la valeur incrémente ou décrémente de '1'. En cliquant à travers la barre de défilement, la valeur change de '10'.

+

Lorsque l'utilisateur clique sur l'une des flèches de la barre de défilement, l'ascenseur se déplace d'autant qu'indiqué par la valeur increment. Augmenter la valeur de cet attribut fera que la barre défilera plus vite à chaque clic. Les positions la plus à gauche et la plus élevée de l'ascenseur ont une valeur de '0', et celles la plus à droite et la plus basse ont une valeur donnée par maxpos.

+

En ajustant les valeurs de la barre de défilement, vous pouvez positionner et contrôler le déplacement de l'ascenseur comme vous le souhaitez.

+
+

Ensuite, nous verrons comment créer des barres d'outils.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/barres_de_menus_simples/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/barres_de_menus_simples/index.html new file mode 100644 index 0000000000..31800f91cb --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/barres_de_menus_simples/index.html @@ -0,0 +1,127 @@ +--- +title: Barres de menus simples +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Barres_de_menus_simples +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Simple_Menu_Bars +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Dans cette section, nous allons voir comment créer une barre de menu avec des menus dessus.

+ +

Créer un menu

+ +

XUL dispose de plusieurs façons différentes de créer des menus. Le moyen le plus basique est d'ajouter une barre de menu avec une ligne de menus dessus comme sur de nombreuses applications. Vous pouvez aussi créer des menus surgissants. Les fonctionnalités de menu XUL se composent de différents éléments qui vous permettent de créer des barres de menus ou des menus surgissants. Les items des menus peuvent être personnalisés assez facilement. Nous avons déjà vu en partie comment faire des menus en utilisant menulist. Cette section sera construite là-dessus.

+ +

Les barres de menu sont généralement créées de la même façon que les barres d'outils. La barre de menu peut-être placée dans une toolbox et le menu fonctionne juste comme n'importe quel autre barre d'outils. XUL a quelques éléments spéciaux qui fournissent des fonctionnalités spéciales propres aux menus.

+ +

Il y a cinq éléments associés à la création d'une barre de menu et de ses menus, qui sont expliqués brièvement ici et en détail après :

+ +
+
menubar 
+
Le container de la ligne de menu.
+
menu 
+
En dépit du nom, il s'agit en fait seulement du titre du menu sur la barre de menu. Cet élément peut être placé sur une barre de menu ou séparément.
+
menupopup 
+
La boîte déroulante qui apparaît quand vous cliquez sur le titre du menu. Cette boîte contient la liste des commandes de menu.
+
menuitem 
+
Une commande individuelle sur un menu. Il est placé dans un menupopup.
+
menuseparator 
+
Une barre de séparation sur un menu. Il est placé dans un menupopup.
+
+ +
+

Vous pouvez personnaliser les menus sur la barre de menu comme vous le souhaitez pour toutes les plates-formes excepté pour le Macintosh. C'est parce que le Macintosh a son propre menu spécial en haut de l'écran contrôlé par le système. Bien que vous puissiez créer des menus personnalisés, toutes règles spéciales de style ou éléments non-menu que vous placez sur un menu peuvent ne pas être appliqués. Vous devez garder cette notion à l'esprit quand vous créez des menus.

+
+ +

Exemple d'une simple barre de menu

+ +

Exemple 1: Source Voir

+ +
Image:xultu_menubar_1.png
+ +
<toolbox flex="1">
+  <menubar id="sample-menubar">
+    <menu id="file-menu" label="Fichier">
+      <menupopup id="file-popup">
+        <menuitem label="Nouveau"/>
+        <menuitem label="Ouvrir"/>
+        <menuitem label="Enregistrer"/>
+        <menuseparator/>
+        <menuitem label="Quitter"/>
+      </menupopup>
+    </menu>
+    <menu id="edit-menu" label="Edition">
+      <menupopup id="edit-popup">
+        <menuitem label="Annuler"/>
+        <menuitem label="Refaire"/>
+      </menupopup>
+    </menu>
+  </menubar>
+</toolbox>
+
+ +

Ici, une simple barre de menu est créée en utilisant l'élément menubar. Il va créer une ligne pour y placer des menus. Deux menus, Fichier et Edition ont été créés ici. L'élément menu crée le titre en haut du menu, qui apparaît sur la barre de menu. Les menus déroulants sont créés en utilisant l'élément menupopup. Le menu va s'ouvrir quand l'utilisateur cliquera sur le titre du menu parent. La taille du menu sera suffisamment large pour que les commandes tiennent à l'intérieur. Les commandes elles-mêmes sont créées en utilisant l'élément menuitem. Chacune d'elles représente une unique commande dans le menu déroulant.

+ +

Vous pouvez aussi créer des séparateurs sur les menus en utilisant l'élément menuseparator. Il est utilisé pour séparer des groupes d'items de menu.

+ +

Élément menubar

+ +

La barre de menu est une boîte contenant des menus. Notez qu'elle a été placée dans une toolbox flexible. La barre de menu n'a pas d'attributs spéciaux mais c'est un type de boîte. De ce fait, vous pouvez créer une barre de menu verticale en affectant la valeur 'vertical' à l'attribut orient.

+ +

Élément menu

+ +

L'élément menu fonctionne comme l'élément button. Il accepte certains attributs semblables plus quelques autres :

+ +
+
id 
+
L'identifiant unique du bouton de titre du menu.
+
label 
+
Le texte qui apparaît sur le menu, comme Fichier ou Edition.
+
disabled 
+
Cet attribut booléen détermine si le menu est désactivé. Bien que ce soit permis, il est rarement utile de désactiver un menu entier. Cet attribut peut être mis à 'true' (vrai) ou 'false' (faux). Bien sûr, cette dernière valeur est celle par défaut.
+
accesskey 
+
Il s'agit de la touche que l'utilisateur peut presser pour activer le menu. Cette lettre est habituellement soulignée dans le titre du menu. Mozilla va regarder dans l'attribut label et ajouter un caractère soulignement au caractère spécifié ici. Pour cette raison, vous devez spécifier un caractère qui existe dans le texte (bien que la touche fonctionnera toujours si ce n'est pas le cas).
+
+ +
Image:xultu_menubar_2.png
+ +

L'élément menu est normalement placé sur une barre de menu, bien que ce ne soit pas nécessaire. Cependant, il donnera une autre apparence. L'image montre à quoi l'exemple précédent ressemblerait sans la barre de menu.

+ +

Élément menupopup

+ +

L'élément menupopup crée la fenêtre déroulante contenant les commandes de menu. C'est un type de boîte qui est orienté verticalement par défaut. Vous pouvez passer en orientation horizontale si vous le voulez, les menuitems seront alors placés sur une même ligne. Normalement seuls les menuitems et les menuseparators sont placés dans un menupopup. Vous pouvez placer n'importe quel élément dans un menupopup, cependant ils seront ignorés sur un Macintosh.

+ +

Élément menuitem

+ +

L'élément menuitem est comme l'élément menu et comporte quelques attributs semblables.

+ +
+
id 
+
L'identifiant unique du bouton du menu.
+
label 
+
Le texte qui apparaît sur l'item de menu, comme Ouvrir ou Enregistrer.
+
disabled 
+
Cet attribut booléen détermine si l'item de menu est désactivé. Cet attribut peut être mis à 'true' (vrai) ou 'false' (faux), qui est la valeur par défaut.
+
accesskey 
+
Il s'agit de la touche que l'utilisateur peut presser pour activer l'item de menu. Cette lettre est habituellement soulignée dans le libellé de l'item de menu. Mozilla va regarder dans l'attribut label et ajouter un caractère soulignement au caractère spécifié ici. Pour cette raison, vous devez spécifier un caractère qui existe dans le texte.
+
acceltext 
+
Cet attribut spécifie le texte de la touche de raccourci qui apparaît près du texte de la commande de menu. Cependant, il n'associe pas de touche d'action avec l'item de menu. Nous verrons comment faire cela plus tard.
+
+ +

Élément menuseparator

+ +

Le menuseparator n'a pas d'attribut spécial. Il crée juste une barre horizontale entre les items de menu.

+ +
+

Nous allons maintenant voir quelques autres fonctions de menu.

+ +
+

« PrécédentSuivant »

+
diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/bo\303\256te_de_dialogue_de_fichier/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/bo\303\256te_de_dialogue_de_fichier/index.html" new file mode 100644 index 0000000000..8e22677407 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/bo\303\256te_de_dialogue_de_fichier/index.html" @@ -0,0 +1,103 @@ +--- +title: Boîte de dialogue de fichier +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Boîte_de_dialogue_de_fichier +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Open_and_Save_Dialogs +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Un type commun de boîtes de dialogue est celui avec lequel un utilisateur peut sélectionner un fichier à ouvrir où à enregistrer.

+ +

Sélecteurs de fichiers

+ +

Un sélecteur de fichiers est une boîte dialogue qui permet à l'utilisateur de sélectionner un fichier. Il est fréquemment utilisé pour les commandes de menu « Ouvrir... » ou « Enregistrer sous... », mais vous pouvez l'utiliser dès que l'utilisateur a besoin de sélectionner un fichier. L'appel à l'interface XPCOM nsIFilePicker est nécessaire pour implémenter un sélecteur de fichiers.

+ +
Notez que le sélecteur de fichiers ne fonctionne qu'avec des URLs chrome.
+ +

Vous pouvez utiliser le sélecteur de fichiers dans l'un de ces trois modes :

+ + + +

L'apparence de la boîte de dialogue sera différente pour chaque type et variera selon la plateforme. Une fois que l'utilisateur aura sélectionné le fichier ou le répertoire/dossier, celui-ci pourra être lu ou enregistré.

+ +

L'interface du sélecteur de fichiers nsIFilePicker est responsable de l'affichage de la boîte de dialogue dans l'un des trois modes. Vous pouvez définir plusieurs fonctionnalités de la boîte de dialogue en utilisant cette interface. Une fois que la boîte de dialogue est fermée, vous pouvez utiliser les fonctions de l'interface pour obtenir le fichier qui a été sélectionné.

+ +

Création d'un sélecteur de fichier

+ +

Pour commencer, vous devez créer un composant du sélecteur de fichiers et l'initialiser.

+ +
var nsIFilePicker = Components.interfaces.nsIFilePicker;
+var fp = Components.classes["@mozilla.org/filepicker;1"].createInstance(nsIFilePicker);
+fp.init(window, "Sélectionnez un fichier", nsIFilePicker.modeOpen);
+
+ +

Tout d'abord, un nouvel objet sélecteur de fichiers est créé et stocké dans une variable fp. La fonction init est utilisée pour initialiser le sélecteur de fichiers. Cette fonction prend trois arguments : la fenêtre qui ouvre la boîte de dialogue, le titre de la boîte de dialogue et son mode. Ici, le mode est 'modeOpen' qui est utilisé pour une boîte de dialogue Ouvrir. Vous pouvez aussi utiliser 'modeGetFolder' et 'modeSave' pour les deux autres modes. Ces modes sont des constantes de l'interface nsIFilePicker.

+ +

Répertoire par défaut et filtres

+ +

Il y a deux fonctionnalités que vous pouvez définir pour la boîte de dialogue avant qu'elle ne soit affichée.

+ + + +

Vous pouvez définir le répertoire par défaut en renseignant la proprieté displayDirectory de l'objet du sélecteur de fichiers. Le répertoire doit être un objet nslLocalFile. Si vous ne le définissez pas, un répertoire par défaut sera sélectionné pour vous. Pour appliquer des filtres, appelez la fonction appendFilters() pour définir les types de fichiers que vous souhaitez voir s'afficher.

+ +
fp.appendFilters(nsIFilePicker.filterHTML | nsIFilePicker.filterImages);
+fp.appendFilters(nsIFilePicker.filterText | nsIFilePicker.filterAll);
+
+ + + +

Vous pouvez aussi utiliser 'filterXML' et 'filterXUL' pour filtrer les fichiers XML et XUL. Si vous voulez filtrer des fichiers personnalisés, vous pouvez utiliser la fonction appendFilter() :

+ +
fp.appendFilter("Fichiers Audio","*.wav; *.mp3");
+
+ +

Cette ligne ajoutera un filtre pour les fichiers audio Wav et MP3. Le premier argument est le titre du type de fichier et le second est une liste de masques de fichiers séparés par un point virgule. Vous pouvez mettre autant de masques que vous le souhaitez. Vous pouvez appeler appendFilter autant de fois que nécessaire pour ajouter les filtres supplémentaires. L'ordre dans lequel vous les ajoutez détermine leur priorité. Habituellement, le premier ajouté est sélectionné par défaut.

+ +

Obtention du fichier sélectionné

+ +

Enfin, vous pouvez afficher la boîte de dialogue en appelant la fonction show(). Elle ne prend aucun argument mais retourne un code d'état qui indique ce que l'utilisateur a sélectionné. Notez que la fonction ne retourne aucune valeur tant que l'utilisateur n'a pas sélectionné un fichier. La fonction retourne une des trois constantes suivantes :

+ +
+
'returnOK' 
+
 : l'utilisateur a sélectionné un fichier et a pressé le bouton « OK ». Le fichier que l'utilisateur a sélectionné sera stocké dans la propriété file du sélecteur de fichiers.
+
'returnCancel' 
+
 : l'utilisateur a pressé le bouton « Annuler ».
+
'returnReplace' 
+
 : dans le mode enregistrement, cette valeur de retour signifie que l'utilisateur a sélectionné un fichier à remplacer ('returnOK' sera retournée lorsque l'utilisateur aura rentré le nom d'un nouveau fichier).
+
+ +

Vous devrez tester la valeur de retour et ensuite utiliser l'objet file du sélecteur de fichiers en utilisant la propriété file.

+ +
var res = fp.show();
+if (res == nsIFilePicker.returnOK){
+  var thefile = fp.file;
+  // --- faire quelque chose avec le fichier ici ---
+}
+
+ +
+

Par la suite, nous verrons comment créer un assistant.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/broadcasters_et_observateurs/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/broadcasters_et_observateurs/index.html new file mode 100644 index 0000000000..dd1a8bbbae --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/broadcasters_et_observateurs/index.html @@ -0,0 +1,86 @@ +--- +title: Broadcasters et Observateurs +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Broadcasters_et_Observateurs +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Broadcasters_and_Observers +--- +

 

+
+

« PrécédentSuivant »

+
+

Parfois, vous voulez que plusieurs éléments répondent à des événements ou changent d'état aisément. Pour cela, nous pouvons utiliser les « broadcasters » (diffuseurs).

+

Commandes de transmission d'attributs

+

Nous avons vu précédemment que les éléments tels que les boutons peuvent être ancrés à des commandes. De plus, si vous placez l'attribut disabled sur l'élément command, tous les éléments ancrés sur celui-ci seront eux aussi désactivés automatiquement. C'est une façon utile de diminuer la taille du code nécessaire. Cette technique fonctionne aussi pour les autres attributs. Par exemple, si vous placez un attribut label sur un élément command, chaque bouton attaché à la commande partagera ce libellé.

+

Exemple 1: Source Voir

+
<command id="ma_commande" label="Ouvrir"/>
+
+<button command="ma_commande"/>
+<checkbox label="Ouvrir une nouvelle fenêtre" command="ma_commande"/>
+
+

Dans cet exemple, le bouton n'a pas d'attribut label, néanmoins il est attaché à une commande qui en possède un. Le bouton va donc le partager avec la commande. La case à cocher a déjà un libellé, néanmoins, il va être surchargé par celui de la commande. Le résultat est que le bouton et la case à cocher auront le même libellé 'Ouvrir'.

+

Si vous modifiez l'attribut label de la commande, les libellés du bouton et de la case à cocher changeront eux aussi. Nous avons vu une application similaire dans une section précédente où l'attribut disabled était défini puis propagé aux autres éléments.

+

Cette transmission d'attribut est relativement utile pour plusieurs raisons. Par exemple, disons que nous voulons désactiver l'action « Page précédente » dans un navigateur. Nous aurions besoin de désactiver cette action dans le menu, dans la barre des tâches, le raccourci clavier (Alt+Gauche par ex.) et chaque commande « Page précédente » des menus déroulants. Écrire un script pour le faire n'est pas très simple. Le désavantage est de devoir prévoir tous les endroits où pourraient se trouver les boutons « Page précédente ». Si quelqu'un a ajouté un nouveau bouton « Page précédente » en utilisant une extension, il ne serait pas pris en compte. Il est plus pratique de désactiver simplement l'action « Page précédente » et que tous les éléments utilisant cette action se désactivent eux-mêmes. Nous pouvons utiliser la transmission d'attributs des commandes pour accomplir cela.

+

Broadcasters

+

Il y existe un élément similaire appelé broadcaster. Les broadcasters supportent la transmission d'attributs de la même manière que les commandes. Ils fonctionnent de la même manière excepté le fait qu'une commande est utilisée pour les actions, alors qu'un broadcaster est utilisé pour contenir l'information d'un état. Par exemple, un élément command serait utilisé pour une action comme « Page précédente », « Couper » ou « Supprimer ». Un broadcaster serait utilisé pour contenir, par exemple, un drapeau indiquant si l'utilisateur est en ligne ou non. Dans le premier cas, les éléments du menu et de la barre des tâches nécessiteraient d'être désactivés lorsqu'il n'y a pas de page de retour, ou aucun texte à couper, à effacer. Dans le second cas, plusieurs éléments de l'interface auraient besoin d'être mis à jour lorsque l'utilisateur passerait du mode en ligne au mode hors ligne.

+

Le broadcaster le plus simple est défini ci-dessous. Vous devriez toujours utiliser un attribut id afin qu'il puisse être référencé à partir d'autres éléments.

+
<broadcasterset>
+   <broadcaster id="isOffline" label="Hors ligne"/>
+</broadcasterset>
+
+

Tous les éléments qui « observent » le broadcaster seront modifiés automatiquement chaque fois que l'attribut label du broadcaster change. Ces éléments auront comme résultat un nouveau libellé. Tout comme d'autres éléments non affichés, l'élément broadcasterset est un conteneur pour les broadcasters. Vous devez déclarer tous vos broadcasters dans un élément broadcasterset afin de les réunir.

+

Création d'éléments observateurs

+

Les éléments qui observent le broadcaster sont appelés observateurs car ils « observent » l'état du broadcaster. Pour qu'un élément devienne un observateur, ajoutez lui un attribut observes. Il est analogue à l'attribut command utilisé pour attacher un élément à un élément command. Par exemple, pour qu'un bouton devienne un observateur du broadcaster décrit ci-dessus :

+
<button id="offline_button" observes="isOffline"/>
+

L'attribut observes a été placé sur le bouton et sa valeur a été affectée à la valeur de l'id du broadcaster à observer. Ici, le bouton va observer le broadcaster avec l'id 'isOffline' qui a été défini un peu plus haut dans le code. Si la valeur de l'attribut label du broadcaster change, les observateurs mettront à jour leur valeur de l'attribut label.

+

Nous pourrions continuer avec d'autres éléments. Autant d'éléments que vous voulez peuvent observer le même broadcaster. Vous pouvez aussi n'avoir qu'un seul élément observateur, mais cela ne servirait pas à grand chose puisque la raison principale d'utiliser les broadcasters est d'avoir des attributs transmis à de multiples endroits. Vous ne devriez utiliser les broadcasters que lorsque vous avez besoin que plusieurs éléments aient à observer un attribut. D'autres observateurs sont décrits ci-dessous :

+
<broadcaster id="offline_command" label="Hors ligne" accesskey="f"/>
+
+<keyset>
+  <key id="goonline_key" observes="offline_command" modifiers="accel" key="O"/>
+</keyset>
+<menuitem id="offline_menuitem" observes="offline_command"/>
+<toolbarbutton id="offline_toolbarbutton" observes="offline_command"/>
+
+

Dans cet exemple, label et l'accesskey seront transmis par le broadcaster au raccourci clavier, à l'item de menu et au bouton de la barre d'outils. Le raccourci clavier n'utilisera aucun des attributs reçus, mais il sera désactivé lorsque le broadcaster le sera.

+

Vous pouvez utiliser un broadcaster pour observer n'importe quel attribut désiré. Les observateurs récupèreront les valeurs de chaque attribut, via les broadcasters, dès qu'ils changeront. Si jamais la valeur d'un seul attribut change, les observateurs seront avisés et ajusteront leurs propres attributs en conséquence. Les attributs des observateurs que le broadcaster ne possède pas lui-même ne sont pas modifiés. Les seuls attributs qui ne sont pas modifiés sont les attributs id et persist ; ces attributs ne sont jamais partagés. Vous pouvez également utiliser vos propres attributs si vous le désirez.

+

Les broadcasters ne sont pas fréquemment utilisés, car les commandes peuvent en général convenir à la majorité des usages. Une chose à préciser est qu'il n'y a pas vraiment de différence entre l'élément command et l'élément broadcaster. Ils font tous les deux la même chose. La différence est plutôt sémantique. Utilisez les commandes pour les actions et utilisez les broadcasters pour les états. En fait, chaque élément peut agir comme un broadcaster, tant que vous l'observez en utilisant l'attribut observes.

+

L'élément Observes

+

Il existe un moyen de spécifier plus précisemment les attributs du broadcaster à observer. Cela implique un élément observes. Tout comme son attribut l'indique, il vous permet d'indiquer à un élément qu'il est un observateur. L'élément observes doit être placé en tant qu'enfant de l'élément qui doit être l'observateur. Voici un exemple :

+

Exemple 2: Source Voir

+
<broadcasterset>
+  <broadcaster id="isOffline" label="Hors ligne" accesskey="f"/>
+</broadcasterset>
+
+<button id="offline_button">
+  <observes element="isOffline" attribute="label"/>
+</button>
+
+

Deux attributs ont été ajoutés à l'élément observes. Le premier, element, spécifie l'identifiant du broadcaster à observer. Le second, attribute, spécifie l'attribut à observer. Le résultat est que le bouton recevra son libellé du broadcaster, et quand l'attribut label sera modifié, le libellé du bouton sera changé. L'élément observes ne change pas, contrairement à l'élément qui le contient, qui est dans ce cas un button. Notez que l'attribut accesskey n'est pas transmis au bouton, puisque il n'est pas observé. Si vous voulez que ce soit le cas, un autre élément observes devra être ajouté. Si vous n'utilisez aucun élément observes, et qu'à la place vous utilisez l'attribut observes directement sur le bouton, tous les attributs seront observés.

+

Événement broadcast

+

Il existe un gestionnaire d'événements supplémentaire, onbroadcast, que nous pouvons placer sur l'élément observes. L'événement est appelé dès que l'observateur détecte un changement dans l'attribut du broadcaster qu'il observe. Un exemple est décrit ci-dessous :

+

Exemple 3: Source Voir

+
<broadcasterset>
+  <broadcaster id="colorChanger" style="color: black"/>
+</broadcasterset>
+
+<button label="Test">
+  <observes element="colorChanger" attribute="style" onbroadcast="alert('La couleur a changé');"/>
+</button>
+
+<button label="Observer"
+  oncommand="document.getElementById('colorChanger').setAttribute('style','color: red');"
+/>
+
+

Deux boutons ont été créés, un nommé 'Test' et l'autre 'Observateur'. Si vous cliquez sur le bouton « Test », rien ne se produit. En revanche, si vous cliquez sur le bouton « Observateur », deux choses surviennent. Premièrement, le texte du bouton devient rouge, deuxièmement, un message d'alerte apparaît avec le message 'La couleur a changé'.

+

Voilà ce qui se passe : le gestionnaire oncommand du second bouton est appelé lorsque l'utilisateur appuie dessus. Le script dispose ici d'une référence au broadcaster et change le style de celui-ci afin qu'il ait une couleur (color) rouge. Le broadcaster n'est pas affecté par le changement de style car il n'est pas affiché à l'écran. Néanmoins, le premier bouton a un observateur qui tient compte du changement de style. Les attributs element et attribute sur la balise observes détecte le changement de style. Le style est appliqué automatiquement au premier bouton.

+

Ensuite, puisque la transmission se fait, le gestionnaire d'événement onbroadcast est appelé. Il en résulte l'affichage d'un message d'alerte. Notez que la transmission ne se fait que si les attributs de l'élément broadcaster sont modifiés. Changer le style du bouton directement ne déclenchera aucune diffusion d'événement et le message d'alerte ne s'affichera pas.

+

Si vous essayez de dupliquer le code du premier bouton (button) plusieurs fois, vous verrez une série de messages d'alerte, un pour chaque bouton, car chaque bouton est un observateur et sera prévenu du changement de style.

+
+

Nous verrons dans la section suivante l'utilisation du Modèle Objet de Document (DOM) avec les éléments XUL.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/cadres_de_contenu/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/cadres_de_contenu/index.html new file mode 100644 index 0000000000..d63d0e1d7c --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/cadres_de_contenu/index.html @@ -0,0 +1,86 @@ +--- +title: Cadres de contenu +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Cadres_de_contenu +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Content_Panels +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Dans cette section, nous regarderons comment ajouter des cadres qui peuvent afficher des pages HTML ou d'autres fichiers XUL.

+ +

Ajout de cadres enfants

+ +

Parfois, vous souhaitez qu'une partie d'un document soit chargée à partir d'une autre page. D'autres fois, vous voulez changer une partie de la fenêtre. Un bon exemple est un assistant qui vous guide pas-à-pas à travers un certain nombre d'écrans, en vous posant une série de questions. Chaque fois que l'utilisateur clique sur le bouton suivant, l'écran suivant de l'assistant est affiché.

+ +

Vous pouvez créer une interface d'assistant en ouvrant une fenêtre différente pour chaque écran. Cette approche pose trois problèmes. Premièrement, chaque fenêtre peut apparaître à une position différente sur l'écran (bien qu'il existe une alternative à cela). Deuxièmement, les éléments tels que les boutons suivant ou précédent sont les mêmes tout au long de l'interface. Ce serait bien mieux si seul le contenu de l'assistant changeait. Troisièmement, il sera difficile de coordonner les scripts tournant dans les différentes fenêtres.

+ +
Notez que XUL a un élément wizard qui peut être utilisé pour créer des assistants. Il sera décrit dans une prochaine section.
+ +

Une meilleure approche est d'utiliser l'élément iframe, qui fonctionne comme l'élément HTML du même nom. Il crée un document séparé dans la fenêtre. Il a l'avantage de pouvoir être placé n'importe où et son contenu chargé à partir d'un fichier différent. Indiquez l'URL que vous souhaitez afficher dans le cadre avec l'attribut src. Cette URL peut pointer sur n'importe quelle sorte de fichiers, bien qu'elle pointe habituellement sur un fichier HTML ou un autre fichier XUL. Vous pouvez utiliser un script pour changer le contenu de ce cadre sans affecter la fenêtre principale.

+ +

Dans la fenêtre du navigateur Mozilla, l'endroit où la page Web doit être affichée est créé en utilisant un cadre iframe. Lorsque l'utilisateur entre une URL ou clique sur un lien du document, la source du cadre est changée.

+ +

Exemple iframe

+ +

Exemple 1: Source Voir

+ +
<toolbox>
+   <toolbar id="nav-toolbar">
+     <toolbarbutton label="Précédent"/>
+     <toolbarbutton label="Suivant"/>
+     <textbox id="urlfield"/>
+   </toolbar>
+</toolbox>
+
+<iframe id="content-body" src="http://www.mozilla-europe.org/fr/" flex="1"/>
+
+ +
Image:xultu_cpanels1.png
+ +

Ici, l'exemple crée une interface très simple pour un navigateur Web. Une boîte contenant deux éléments a été créée : un élément toolbox et un élément iframe. Un bouton « Précédent », un bouton « Suivant » et un champ de saisie des URLs ont été ajoutés sur la barre d'outils. Les pages Web apparaissent à l'intérieur du cadre iframe. Dans ce cas, c'est la page d'accueil du site qui apparaîtra par défaut.

+ +

Cet exemple n'est pas fonctionnellement complet. Par la suite, nous ajouterons un script qui changera l'attribut de src au moment désiré, par exemple quand l'utilisateur appuie sur la touche Entrée.

+ + + +

Il existe un second type de cadre de contenu, utilisant la balise browser. Vous l'utiliserez quand vous voudrez créer un cadre qui montre le contenu comme un navigateur. En réalité, l'élément iframe peut aussi le faire, mais le navigateur (browser) possède certaines caractéristiques supplémentaires. Par exemple, l'élément browser conserve un historique pour utiliser les boutons « Précédent » et « Suivant ». Le navigateur peut aussi charger des pages avec des referers et d'autres états. La balise browser doit être utilisée essentiellement lorsque vous voulez créer une interface semblable au navigateur, mais l'iframe peut être utilisé lorsque vous avez juste besoin d'un cadre simple.

+ +

Un élément similaire, tabbrowser, fournit la fonctionnalité du browser, mais fournit également une barre d'onglets pour basculer entre de multiples pages. C'est le composant graphique utilisé par le navigateur Mozilla pour son interface de navigation par onglets. L'élément tabbrowser est en réalité implémenté comme un tabbox contenant un ensemble d'éléments browser. Ces deux types de navigateur offrent un contrôle similaire sur les pages à afficher.

+ +

Exemple de browser

+ +

Exemple 2: Source Voir.

+ +
<browser src="http://www.mozilla.org" flex="1"/>
+ +

Comme avec l'iframe, vous pouvez indiquer l'URL dans un navigateur utilisant l'attribut src. Pour un tabbrowser, vous ne pouvez pas définir l'url directement comme ceci, étant donné qu'il n'affiche pas qu'une seule URL. À la place, vous devez utiliser un script et appeler la fonction loadURI.

+ +

Il y a trois catégories de navigateurs, selon le genre de contenu que vous voulez afficher. Le type peut être indiqué en utilisant l'attribut type.

+ +

Le premier type est le type par défaut utilisé si vous omettez cet attribut. Dans ce cas, le contenu chargé à l'intérieur du navigateur est traité comme s'il faisait partie de la même application et avait accès à la fenêtre extérieure. Cela signifie que lorsqu'un script chargé à l'intérieur du navigateur essaie d'obtenir la fenêtre la plus élevée, il obtiendra la fenêtre XUL extérieure.

+ +

Ce comportement conviendrait pour un cadre XUL fils qui fait partie de votre application, mais il ne serait pas adapté pour un navigateur qui chargerait des pages Web. À la place, vous voudrez restreindre la page Web au seul accès de son contenu. Vous pouvez noter qu'une fenêtre de navigateur Mozilla possède du contenu XUL pour les barres d'outils et de statut et ainsi de suite avec un tabbrowser formant la zone principale. Cette zone interne affiche une page Web, mais celle-ci ne peut pas accéder au XUL l'entourant. C'est parce le second type de navigateur est utilisé en définissant l'attribut type avec la valeur 'content'. Il empêche le contenu de remonter jusqu'à la fenêtre XUL. Un exemple :

+ +
<browser src="http://www.mozilla.org" type="content" flex="1"/>
+ +
Il est important que vous définissiez l'attribut type correctement si vous envisagez d'afficher des sites Web distants à l'intérieur de l'élément browser.
+ +

Le tabbrowser définit le type 'content' automatiquement sur tous les onglets de navigation qu'il crée. Vous n'avez donc pas à le définir explicitement pour les onglets de navigation.

+ +

Le troisième type sert lorsque votre fenêtre contient plusieurs éléments browser, comme par exemple si vous aviez un panneau latéral affichant du contenu supplémentaire. Renseignez l'attribut type sur l'élément browser principal avec la valeur 'content-primary' pour spécifier le contenu primaire. Il fonctionne comme avec la valeur 'content' excepté le fait que le contenu à l'intérieur est accessible en utilisant la propriété 'content' de la fenêtre XUL. L'accès au contenu du navigateur principal en utilisant un script s'en trouve simplifié. tabbrowser définit automatiquement l'attribut type avec cette valeur 'content-primary' pour tous les navigateurs visibles, ce qui vous permet de cette manière de toujours pouvoir avoir accès au contenu visible.

+ +
+

Dans la section suivante, nous allons voir comment créer des séparateurs.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/caract\303\251ristiques_d'une_fen\303\252tre/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/caract\303\251ristiques_d'une_fen\303\252tre/index.html" new file mode 100644 index 0000000000..4f063b5790 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/caract\303\251ristiques_d'une_fen\303\252tre/index.html" @@ -0,0 +1,76 @@ +--- +title: Caractéristiques d'une fenêtre +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Caractéristiques_d'une_fenêtre +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Features_of_a_Window +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Nous avons déjà vu quelques caractéristiques de fenêtres. Nous allons en aborder d'autres dans cette section.

+ +

Créer une autre fenêtre

+ +

Vous pouvez créer une seconde fenêtre pour votre application de la même manière que vous avez créé la première. Il suffit de créer un second fichier XUL contenant le code de la nouvelle fenêtre. Comme en HTML, vous pouvez utiliser la fonction window.open() pour ouvrir la seconde fenêtre. Cette fonction retournera une référence à la fenêtre nouvellement ouverte. Vous pouvez utiliser cette référence pour appeler des fonctions de l'autre fenêtre.

+ +

La fonction open prend trois arguments. Le premier est l'URL du fichier que vous souhaitez ouvrir. Le deuxième est le nom interne de la fenêtre. Le troisième est une liste de drapeaux de paramètres d'affichage. Le drapeau chrome est important pour ouvrir la fenêtre comme un fichier chrome. Si vous n'ajoutez pas le drapeau chrome, le fichier sera ouvert dans une nouvelle fenêtre du navigateur.

+ +

Par exemple :

+ +
var myWin = window.open("chrome://findfile/content/findfile.xul","findfile","chrome");
+ +

Spécifier la largeur et la hauteur

+ +

Vous aurez noté que lorsque des éléments sont ajoutés à une fenêtre, la largeur de la fenêtre s'étend pour s'adapter aux nouveaux éléments. La fenêtre n'est en fait qu'une boîte flexible et qui prend par défaut une orientation verticale. Vous pouvez également spécifier la largeur et la hauteur directement dans la balise window. Cela, bien sûr, oblige la fenêtre à prendre une taille spécifique. Si vous ôtez ces spécifications, la taille sera déterminée par les éléments qui la constituent.

+ +
<window
+  id="findfile-window"
+  title="Recherche de fichiers"
+  width="400"
+  height="450"
+  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+ +

Dans cet exemple, la fenêtre sera ouverte avec une largeur de 400 pixels et une hauteur de 450 pixels. Même s'il n'y a pas assez d'éléments pour lui faire adopter cette taille, la fenêtre s'ouvrira toujours à cette taille et il y aura un espace vierge dans l'espace restant. S'il y a trop d'éléments, la fenêtre n'adaptera pas ses dimensions pour en tenir compte. L'utilisateur devra alors redimensionner la boîte de dialogue. Vous devez faire attention, lorsque vous spécifiez une largeur et une hauteur, à ce que la fenêtre ne soit ni trop petite, ni trop grande. Vous devez considérer les thèmes graphiques ou la langue propres à l'utilisateur.

+ +
Notez que vous devez spécifier à la fois la largeur et la hauteur. Si vous ne spécifiez qu'une des deux valeurs, l'autre sera mise à '0'. Pour que la fenêtre détermine sa taille automatiquement, omettez les toutes les deux.
+ +

La largeur et la hauteur déterminent seulement la taille initiale de la fenêtre. L'utilisateur peut toujours redimensionner la fenêtre, à condition que celle-ci soit redimensionnable.

+ +

Autres propriétés de fenêtre

+ +

Les drapeaux ci-après peuvent être utilisés comme troisième argument de la fonction window.open. Votre système d'exploitation peut ne pas les supporter tous. Vous pouvez également utiliser un des drapeaux pré-existants, que vous devriez trouver dans une référence JavaScript. Vous pouvez désactiver une propriété en la réglant sur 'no', par exemple dialog='no'.

+ +
+
alwaysLowered
+
La fenêtre apparaîtra toujours derrière les autres fenêtres.
+
alwaysRaised
+
La fenêtre apparaîtra toujours devant les autres fenêtres.
+
centerscreen
+
À son ouverture, la fenêtre sera centrée à l'écran.
+
dependent
+
La position de la fenêtre sera toujours relative à la fenêtre qui l'a ouverte. Si la position de la fenêtre initiale est modifiée, la seconde fenêtre bougera automatiquement de même manière.
+
dialog
+
la fenêtre est une boîte de dialogue pouvant apparaître différemment.
+
modal
+
La boite de dialogue est modale. La fenêtre qui a ouvert la fenêtre modale ne peut pas être utilisée tant que la fenêtre modale n'est pas fermée.
+
resizable
+
L'utilisateur peut redimensionner la fenêtre.
+
+ +

Voir également la référence DOM de window.open().

+ +
+

Nous allons voir ensuite comment ouvrir des boîtes de dialogue secondaires.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/commandes/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/commandes/index.html new file mode 100644 index 0000000000..baedcbfcdf --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/commandes/index.html @@ -0,0 +1,119 @@ +--- +title: Commandes +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Commandes +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Commands +--- +

 

+
+

« PrécédentSuivant »

+
+

Une commande est une opération qui peut être invoquée.

+

Les éléments de commande

+

L'élément command est utilisé pour créer des commandes qui pourront être utilisées pour exécuter des opérations. Vous n'avez pas besoin d'utiliser les commandes si vous avez juste à appeler un script pour manipuler des choses. Cependant, une commande a l'avantage de pouvoir être désactivée automatiquement quand c'est nécessaire, et de pouvoir être invoquée de l'extérieur sans avoir besoin de connaître les détails de son implémentation. Les commandes fournissent un moyen pour séparer de façon abstraite les opérations et le code. Elles deviennent très utiles pour les grosses applications.

+

Par exemple, pour implémenter les commandes de menus du presse-papiers, couper, copier et coller, vous pouvez utiliser les commandes. Si vous ne les utilisiez pas, vous devriez trouver quel champ a le focus, ensuite s'assurer que l'opération est valable pour cet élément. De plus, les commandes de menus devraient être activées ou désactivées selon que l'élément cible a du texte sélectionné ou pas, et pour les opérations de collage, si le presse-papiers contient quelque chose qui peut être collé. Comme vous pouvez le voir, cela devient compliqué. En utilisant les commandes, votre travail est simplifié.

+

Vous pouvez utiliser une commande pour n'importe quelle opération. Mozilla les utilise la plupart du temps pour les menus. De plus, les champs de saisie de texte et autres composants graphiques disposent de plusieurs commandes natives que vous pouvez invoquer. Vous devriez les utiliser quand les opérations dépendent de l'élément sélectionné.

+

Une commande est identifiée par son attribut id. Mozilla utilise une convention : les id de commandes commencent par 'cmd_'. Vous voudrez probablement utiliser le même identifiant que celui d'une commande déjà utilisée, cependant, pour vos propres commandes, vous pouvez utiliser n'importe quel id de commande souhaité. Pour éviter les conflits, il est préférable d'inclure le nom de l'application dans l'id de la commande. Un moyen simple d'utilisation des commandes est montré ci-après :

+

Exemple : command simple

+

Exemple 1: Source Voir.

+
<command id="cmd_openhelp" oncommand="alert('Aide !');"/>
+<button label="Aide" command="cmd_openhelp"/>
+
+

Dans cet exemple, au lieu de placer l'attribut oncommand sur l'élément button, nous le plaçons sur un élément command. Les deux sont alors liés en utilisant l'attribut command qui a la valeur de l'id de la commande. Ainsi, quand le bouton est pressé, la commande 'cmd_openhelp' est invoquée.

+

Cette approche présente deux avantages.

+ +

De plus,

+ +

Exemple : Activer/Désactiver command

+

Exemple 2: Source Voir

+
<command id="cmd_openhelp" oncommand="alert('Aide');"/>
+<button label="Aide" command="cmd_openhelp"/>
+<button label="Plus d'aide" command="cmd_openhelp"/>
+
+<button label="Désactiver" oncommand="document.getElementById('cmd_openhelp').setAttribute('disabled','true');"/>
+<button label="Activer" oncommand="document.getElementById('cmd_openhelp').removeAttribute('disabled');"/>
+
+

Dans cet exemple, les deux boutons utilisent la même commande. Quand le bouton « Désactiver » est pressé, la commande est désactivée en définissant son attribut disabled, et les deux boutons seront aussi désactivés.

+

Habituellement, un groupe de commandes se place à l'intérieur d'un élément commandset, près du début du fichier XUL, comme dans l'exemple suivant :

+
<commandset>
+   <command id="cmd_open" oncommand="alert('Ouvrir !');"/>
+   <command id="cmd_help" oncommand="alert('Aide !');"/>
+</commandset>
+
+

Une commande est invoquée quand l'utilisateur active le bouton ou les autres éléments rattachés à la commande. Vous pouvez aussi invoquer une commande en appelant la méthode doCommand, que ce soit de l'élément command ou d'un élément rattaché à la commande, comme un bouton.

+

Le répartiteur de commandes

+

Vous pouvez aussi utiliser les commandes sans utiliser l'élément command, ou, au moins, sans ajouter un attribut oncommand sur la commande. Dans ce cas, la commande n'invoquera pas un script directement, mais recherchera plutôt un élément ou une fonction qui traitera la commande. Cette fonction peut être séparée du XUL lui-même, et peut être embarquée par un élément graphique en interne. Afin de trouver ce qui traitera la commande, XUL utilise un objet appelé répartiteur de commande (NdT : command dispatcher). Cet objet localise le gestionnaire d'une commande. Le gestionnaire d'une commande est appelé contrôleur. Ainsi, quand une commande est invoquée, le répartiteur de commande localise un contrôleur qui traite la commande. Vous pouvez déduire que l'élément command est un type de contrôleur pour une commande.

+

Le répartiteur de commandes localise un contrôleur en regardant l'élément sélectionné pour voir s'il a un contrôleur qui gère la commande. Les éléments XUL ont une propriété controllers qui est utilisée pour la vérification. Vous pouvez l'utiliser pour ajouter vos propres contrôleurs. Vous pourriez l'utiliser pour avoir une boîte de liste qui répond aux opérations de couper, copier et coller. Un exemple sera fourni plus tard. Par défaut, seuls les champs de saisie (textbox) ont un contrôleur fonctionnel. Ce contrôleur gère aussi bien les opérations de presse-papiers, sélection, défaire et refaire, que les opérations d'édition. Notez qu'un élément peut avoir plusieurs contrôleurs, qui seront alors tous pris en compte.

+

Si l'élément courant sélectionné n'a pas le contrôleur attendu, la fenêtre sera alors vérifiée. L'élément window a aussi une propriété controllers que vous pouvez modifier comme bon vous semble. Si le focus est à l'intérieur d'un cadre frame, chaque cadre parent est également vérifié. Ainsi, les commandes fonctionneront même si le focus est à l'intérieur d'un cadre. Ce mécanisme fonctionne bien pour un navigateur ; les commandes d'édition invoquées à partir du menu principal fonctionneront à l'intérieur de la zone de contenu. Notez que HTML a aussi un système de commandes et de contrôleur, bien que vous ne puissiez pas l'utiliser sur des pages Web sans privilèges. Mais vous pouvez l'utiliser, par exemple, dans une extension du navigateur. Si la fenêtre ne fournit pas un contrôleur capable de gérer la commande, rien ne se passera.

+

Vous pouvez récupérer le répartiteur de commande en utilisant la propriété commandDispatcher de l'objet document, ou à partir des contrôleurs listés dans un élément ou la fenêtre. Le répartiteur de commande contient des méthodes pour récupérer les contrôleurs pour les commandes et pour récupérer et modifier le focus.

+

Ajout de contrôleurs

+

Vous pouvez implémenter vos propres contrôleurs pour répondre aux commandes. Vous pouvez tout aussi bien surcharger la gestion par défaut d'une commande en plaçant le contrôleur correctement. Un contrôleur doit implémenter quatre méthodes qui sont listées ci-dessous :

+
supportsCommand (command) 
Cette méthode doit renvoyer 'true' si le contrôleur gère la commande. Si vous renvoyez 'false', la commande n'est pas gérée et le répartiteur de commande interrogera un autre contrôleur. Un contrôleur peut gérer plusieurs commandes.
+
+
isCommandEnabled (command) 
Cette méthode doit renvoyer 'true' si la commande est activée, 'false' sinon. Les boutons correspondants seront désactivés automatiquement.
+
+
doCommand (command) 
exécute la commande. C'est ici que vous mettrez le code pour gérer la commande.
+
+
onEvent (event) 
Cette méthode gère un événement.
+
+

Exemple : implémentation d'un contrôleur

+

Imaginons que nous voulions implémenter une boîte de liste (listbox) qui gère la commande « Supprimer ». Quand un utilisateur sélectionne « Supprimer » dans le menu, la boîte de liste efface la ligne sélectionnée. Dans ce cas, vous avez juste à attacher un contrôleur à l'élément listbox qui exécutera l'action correspondante dans sa méthode doCommand.

+

Essayez d'ouvrir l'exemple qui suit (Source Voir) dans une fenêtre du navigateur et sélectionnez des items de la liste. Vous noterez que la commande « Supprimer » du menu « Edition » du navigateur est activée et qu'elle effacera la ligne sélectionnée. L'exemple n'est cependant pas complet. Nous devrions nous assurer que la sélection et le focus soient ajustés comme il faut après l'effacement.

+
<window id="controller-example" title="Exemple de contrôleur" onload="init();"
+        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+<script>
+function init()
+{
+  var list = document.getElementById("theList");
+
+  var listController = {
+    supportsCommand : function(cmd){ return (cmd == "cmd_delete"); },
+    isCommandEnabled : function(cmd){
+      if (cmd == "cmd_delete") return (list.selectedItem != null);
+      return false;
+    },
+    doCommand : function(cmd){
+      list.removeItemAt(list.selectedIndex);
+    },
+    onEvent : function(evt){ }
+  };
+
+  list.controllers.appendController(listController);
+}
+</script>
+
+<listbox id="theList">
+  <listitem label="Océan"/>
+  <listitem label="Désert"/>
+  <listitem label="Jungle"/>
+  <listitem label="Marécage"/>
+</listbox>
+
+</window>
+
+

Le contrôleur listController implémente les quatre fonctions décrites plus haut. La méthode supportsCommand renvoie 'true' pour la commande 'cmd_delete', qui est le nom de la commande utilisée lorsque l'item de menu « Supprimer » est sélectionné. Pour les autres commandes, 'false' est renvoyé puisque le contrôleur ne gère aucune autre commande. Si vous voulez gérer d'autres commandes, vous devrez les tester ici, car il est fréquent d'un simple contrôleur gère de multiples commandes apparentées.

+

La méthode isCommandEnabled renvoie 'true' si la commande est activée. Dans le cas présent, nous vérifions s'il y a un item sélectionné dans la liste et renvoyons 'true' si c'est le cas. S'il n'y a pas de sélection, 'false' est renvoyé. Si vous effacez toutes les lignes dans l'exemple, la commande « Supprimer » deviendra inactive. Vous devrez cliquer sur la liste pour mettre à jour le menu dans cet exemple simple. La méthode doCommand sera appelée lorsque l'item de menu « Supprimer » sera sélectionné, et elle provoquera l'effacement de la ligne sélectionnée dans la liste. Rien ne doit se produire pour la méthode onEvent, aussi nous n'ajouterons pas de code pour celle-ci.

+

Surcharger un contrôleur par défaut

+

Nous attachons ce contrôleur à l'élément listbox en appelant la méthode appendController des objets contrôleurs de la liste. L'objet controller a un certain nombre de méthodes qui peuvent être utilisées pour manipuler les contrôleurs. Par exemple, il possède une méthode insertControllersAt qui insère un contrôleur dans un élément avant les autres. Elle peut être utile pour surcharger des commandes. Par exemple, le code suivant désactivera le collage du presse-papiers dans un champ de saisie.

+
var tboxController = {
+  supportsCommand : function(cmd){ return (cmd == "cmd_paste"); },
+  isCommandEnabled : function(cmd){ return false; },
+  doCommand : function(cmd){ },
+  onEvent : function(evt){ }
+};
+
+document.getElementById("tbox").controllers.insertControllerAt(0,tboxController);
+
+

Dans cet exemple, nous insérons le contrôleur à l'index '0', c'est-à-dire avant tous les autres. Le nouveau contrôleur supporte la commande 'cmd_paste' et indique qu'elle est désactivée. Le contrôleur par défaut de textbox ne sera jamais appelé parce que le répartiteur de commande trouve un contrôleur avant celui-ci, prenant en charge la commande en premier.

+
+

Dans la section suivante, nous allons voir comment mettre à jour les commandes.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/contenu_anonyme/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/contenu_anonyme/index.html new file mode 100644 index 0000000000..92fc00f9e5 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/contenu_anonyme/index.html @@ -0,0 +1,214 @@ +--- +title: Contenu anonyme +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Contenu_anonyme +tags: + - Tutoriel_XUL + - Tutoriels + - XBL + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Anonymous_Content +--- +
+

« PrécédentSuivant »

+
+ +

Dans cette section, nous allons voir comment créer un contenu avec XBL (eXtended Binding Language).

+ +

Le contenu XBL

+ +

XBL peut être utilisé pour ajouter automatiquement un ensemble d'éléments à l'intérieur d'un autre élément. Le fichier XUL a uniquement besoin de spécifier l'élément externe tandis que l'élément interne est décrit dans un fichier XBL. C'est utile pour créer un élément graphique simple qui est construit à partir d'un ensemble d'autres éléments, mais qui peut être référencé comme un seul élément graphique. Des mécanismes sont fournis pour ajouter des attributs aux éléments internes qui étaient spécifiés dans l'élément externe.

+ +

Exemple de déclaration d'une barre de défilement

+ +

L'exemple ci-dessous montre comment une barre de défilement pourrait être déclarée (il a été un peu simplifié par rapport à la réalité) :

+ +
<bindings xmlns="http://www.mozilla.org/xbl"
+          xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+  <binding id="scrollbarBinding">
+    <content>
+      <xul:scrollbarbutton type="decrement"/>
+      <xul:slider flex="1">
+        <xul:thumb/>
+      </xul:slider>
+      <xul:scrollbarbutton type="increment"/>
+    </content>
+  </binding>
+</bindings>
+
+ +

Ce fichier contient une seule liaison, déclarée avec l'élément binding. L'attribut id doit être déclaré avec l'identifiant de la liaison. De cette façon il y est fait référence au travers de la propriété CSS -moz-binding.

+ +

La balise content est utilisée pour déclarer le contenu anonyme qui sera ajouté à la barre de défilement. Tous les éléments à l'intérieur de la balise content seront ajoutés au sein de l'élément auquel la liaison est liée. Cette liaison sera vraisemblablement liée à une barre de défilement, bien qu'elle puisse ne pas l'être. Chaque élément dont la propriété CSS -moz-binding est déclarée avec l'URL de la liaison, va l'utiliser.

+ +

L'utilisation de la liaison ci-dessus a pour résultat que la ligne de XUL ci-dessous soit interprétée comme suit, en supposant que la barre de défilement est liée au XBL ci-dessus :

+ +
<scrollbar>
+
+devient :
+
+<scrollbar>
+  <xul:scrollbarbutton type="decrement"/>
+    <xul:slider flex="1">
+      <xul:thumb/>
+    </xul:slider>
+  <xul:scrollbarbutton type="increment"/>
+</scrollbar>
+
+ +

Les éléments au sein de la balise content sont ajoutés anonymement à la barre de défilement. Bien que le contenu anonyme soit affiché à l'écran, vous ne pouvez pas y accéder à l'aide d'un script par la voie normale. Dans XUL, c'est comme s'il n'y avait qu'un seul élément, bien qu'il se compose en réalité de plusieurs éléments.

+ +

Si vous observez une barre de défilement dans une fenêtre Mozilla, vous verrez qu'elle est composée d'un bouton en forme de flèche, d'une zone de coulissement, d'une poignée à l'intérieur et d'un second bouton en forme de flèche à la fin, ce sont les éléments qui apparaissent dans le contenu XBL ci-dessus. Ces éléments pourraient à leur tour être liés à d'autres liaisons qui utilisent les éléments XUL de base. Notez que les éléments de contenu ont besoin de l'espace de nommage de XUL (ils apparaissent précédés de xul:), parce que ce sont des éléments de XUL et qu'ils ne sont pas valides dans XBL. Cet espace de nommage a été déclaré dans la balise bindings. Si vous n'utilisez pas l'espace de nommage sur les éléments de XUL, Mozilla supposera que ce sont des éléments XBL et il ne les comprendra pas, et vos éléments ne fonctionneront pas correctement.

+ +

Exemple d'un champ de saisie de nom de fichier

+ +

Un autre exemple, cette fois pour un champ dans lequel vous pourriez entrer un nom de fichier :

+ +
<binding id="fileentry">
+  <content>
+    <textbox/>
+    <button label="Parcourir..."/>
+  </content>
+</binding>
+
+ +

L'attachement de cette liaison sur un élément lui fera contenir un champ de saisie de texte, suivi d'un bouton 'Parcourir...'. Ce contenu interne est créé anonymement et ne peut être vu en utilisant le DOM (Modèle Objet de Document).

+ +

Remplacement de l'élément de liaison

+ +

Le contenu anonyme est créé automatiquement chaque fois qu'une liaison est attachée à un élément. Si vous placez des éléments fils à l'intérieur du contenu XUL, ils vont écraser les éléments fournis par la liaison. Par exemple, prenez cet extrait XUL, en supposant qu'il soit lié à la barre de défilement XBL de tout à l'heure :

+ +
<scrollbar/>
+
+<scrollbar>
+  <button label="Écraser"/>
+</scrollbar>
+
+ +

Puisque la première barre de défilement n'a pas de contenu qui lui est propre, celui-ci sera généré à partir de la définition de la liaison du fichier XBL. La seconde barre de défilement a son propre contenu donc elle l'utilisera à la place du contenu XBL, ce qui a pour résultat quelque chose qui ne ressemble plus à une barre de défilement. Notez que beaucoup d'éléments natifs de construction, comme les barres de défilement, ont leur définition XBL stockée dans des fichiers situés dans le répertoire "bindings" du paquetage toolkit.jar.

+ +

Ce mécanisme s'applique seulement aux éléments définis à l'intérieur de la balise content. Les propriétés, les méthodes et d'autres aspects d'XBL restent disponibles, que le contenu provienne d'XBL ou que XUL fournisse son propre contenu.

+ +

Utilisation de l'élément children

+ +

Il peut y avoir des fois où vous souhaitez que soient montrés à la fois le contenu XBL et celui fournit par le fichier XUL. Il vous suffit d'utiliser l'élément children. Les éléments fils dans XUL sont ajoutés en lieu et place de l'élément children. C'est pratique pour créer des éléments graphiques de menu personnalisés. Par exemple, une version simplifiée d'un élément menulist éditable, pourrait être créée comme ceci :

+ +
XUL:
+
+<menu class="dropbox">
+  <menupopup>
+    <menuitem label="1000"/>
+    <menuitem label="2000"/>
+  </menupopup>
+</menu>
+
+CSS:
+
+menu.dropbox {
+    -moz-binding:  url('chrome://example/skin/example.xml#dropbox');
+}
+
+XBL:
+
+<binding id="dropbox">
+  <content>
+    <children/>
+    <xul:textbox flex="1"/>
+    <xul:button src="chrome://global/skin/images/dropbox.jpg"/>
+  </content>
+</binding>
+
+ +

Cet exemple crée un champ de saisie suivi d'un bouton. Le menupopup sera ajouté au contenu à l'emplacement spécifié par l'élément children. Notez que pour les fonctions du DOM, le contenu apparaîtra comme s'il était dans le fichier XUL, ainsi le menupopup sera un fils du menu. Le contenu XBL est caché ainsi le développeur d'une application sous XUL n'a même pas besoin de savoir qu'il est là.

+ +

Le contenu résultant serait :

+ +
<menu class="dropbox">
+  <menupopup>
+    <menuitem label="1000"/>
+    <menuitem label="2000"/>
+  </menupopup>
+  <textbox flex="1"/>
+  <button src="chrome://global/skin/images/dropbox.jpg"/>
+</menu>
+
+ +

Attribut includes

+ +

Dans certains cas, vous souhaiterez n'inclure que des types de contenus spécifiques et non d'autres. Ou bien, vous souhaiterez placer différents types de contenus à différents endroits. L'attribut includes peut être utilisé pour n'autoriser que certains éléments à apparaître dans le contenu. Sa valeur doit être déclarée pour un simple nom de balise, ou pour une liste de balises séparées par des barres verticales (Le symbole |).

+ +
<children includes="button">
+ +

Cette ligne va ajouter tous les boutons qui sont fils de l'élément lié en lieu et place de la balise children. Les autres éléments ne correspondront pas avec cette balise. Vous pouvez placer plusieurs éléments children dans une liaison pour placer différents types de contenus à différents endroits. Si un élément dans XUL ne correspond pas aux éléments children, cet élément (et les autres n'y correspondant pas) sera utilisé à la place du contenu lié.

+ +

Voici un autre exemple. Disons que nous voulions créer un élément graphique qui affiche une image avec un bouton de zoom "Agrandir" et un bouton de zoom "Réduire" de part et d'autre. Il pourrait être créé avec une boîte qui contiendrait l'image et deux boutons. L'élément image doit être placé à l'extérieur du fichier XBL car il sera différent selon l'usage.

+ +
XUL:
+
+<box class="zoombox">
+  <image src="images/happy.jpg"/>
+  <image src="images/angry.jpg"/>
+</box>
+
+XBL:
+
+<binding id="zoombox">
+  <content>
+    <xul:box flex="1">
+      <xul:button label="Agrandir"/>
+      <xul:box flex="1" style="border: 1px solid black">
+        <children includes="image"/>
+      </xul:box>
+      <xul:button label="Réduire"/>
+    </xul:box>
+  </content>
+</binding>
+
+ +

Les fils explicites dans le fichier XUL seront placés à l'endroit où se trouve la balise children. Il y a deux images, ainsi toutes les deux seront ajoutées à côté de l'une et l'autre. Cela a pour conséquence un affichage équivalent au code suivant :

+ +
<binding id="zoombox">
+  <content>
+    <xul:box flex="1">
+      <xul:button label="Agrandir"/>
+      <xul:box flex="1" style="border: 1px solid black">
+        <image src="images/happy.jpg"/>
+        <image src="images/angry.jpg"/>
+      </xul:box>
+      <xul:button label="Réduire"/>
+    </xul:box>
+  </content>
+</binding>
+
+ +

D'un point de vue du DOM, les éléments fils sont toujours à leur emplacement original. En effet, la boîte XUL externe a deux fils qui sont les deux images. La boîte interne avec la bordure a un fils, la balise children. C'est une distinction importante lorsqu'on utilise le DOM avec XBL. Elle s'applique également aux règles du sélecteur CSS.

+ +

Les éléments fils multiples

+ +

Vous pouvez également utiliser plusieurs éléments children et avoir certains éléments placés à un endroit et d'autres éléments placés à un autre. En ajoutant l'attribut includes contenant une liste de nom de balises séparés par des barres verticales, vous pouvez placer uniquement les éléments correspondants à cet endroit. Par exemple, le fichier XBL suivant va faire apparaître des libellés et des boutons à un endroit différent des autres éléments :

+ +

Exemple 1 : Source

+ +
<binding id="navbox">
+  <content>
+    <xul:vbox>
+      <xul:label value="Libellés et boutons"/>
+      <children includes="label|button"/>
+    </xul:vbox>
+    <xul:vbox>
+      <xul:label value="Autres éléments"/>
+      <children/>
+    </xul:vbox>
+  </content>
+</binding>
+
+ +

Le premier élément children n'inclut que les éléments label et button, comme indiqué dans son attribut includes. Le second élément children, parce qu'il n'a pas d'attribut includes, ajoute tous les éléments restants.

+ +
+

Dans la prochaine section, nous verrons comment des attributs peuvent être hérités dans le contenu anonyme.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251ation_d'un_assistant/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251ation_d'un_assistant/index.html" new file mode 100644 index 0000000000..8ca985799e --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251ation_d'un_assistant/index.html" @@ -0,0 +1,141 @@ +--- +title: Création d'un assistant +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Création_d'un_assistant +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Creating_a_Wizard +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Beaucoup d'applications utilisent des assistants pour aider l'utilisateur dans des tâches complexes. XUL fournit un moyen de créer des assistants facilement.

+ +

L'élément wizard

+ +

Un assistant est un type spécial de boîte de dialogue, contenant un certain nombre de pages. Des boutons de navigation apparaissent en bas de la boîte de dialogue pour passer d'une page à l'autre. Les assistants sont habituellement utilisés pour aider l'utilisateur à effectuer des tâches complexes. Chaque page contient une seule question ou un ensemble de questions associées. À la dernière page, l'opération est effectuée.

+ +

XUL fournit un élément wizard qui peut être utilisé pour créer des assistants. Le contenu à l'intérieur de l'élément wizard inclut tout le contenu de chaque page. Les attributs placés sur l'élément wizard sont utilisés pour contrôler la navigation. Quand vous créez un assistant, utilisez la balise wizard à la place de la balise window.

+ +
Notez que pour le moment les assistants ne fonctionnent correctement qu'à partir d'URLs chrome.
+ +

Un assistant consiste en un ensemble de sections, bien que la mise en page exacte variera pour chaque plateforme. L'aspect visuel de l'assistant s'adaptera à la plateforme de l'utilisateur. Une mise en page type inclura un titre en haut, un ensemble de boutons de navigations en bas, et le contenu de la page entre les deux.

+ +

Le titre du haut est créé en utilisant l'attribut title comme on le ferait pour les fenêtres normales. Les boutons de navigation sont créés automatiquement. Les pages de l'assistant sont créées en utilisant l'élément wizardpage. Vous pouvez y placer tout contenu que vous voulez.

+ +

Exemple d'assistant

+ +

Exemple 1 : Source

+ +
<?xml version="1.0" encoding="iso-8859-1"?>
+
+<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+
+<wizard id="example-window" title="Assistant de sélection de chien"
+  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+  <wizardpage>
+    <description>
+      Cet assistant vous aidera à sélectionner le type de chien qui sera le mieux pour vous.
+    </description>
+    <label value="Pourquoi voulez vous un chien ?"/>
+    <menulist>
+      <menupopup>
+        <menuitem label="Pour faire peur aux gens"/>
+        <menuitem label="Pour se débarrasser d'un chat"/>
+        <menuitem label="J'ai besoin d'un meilleur ami"/>
+      </menupopup>
+    </menulist>
+  </wizardpage>
+
+  <wizardpage description="Détails sur le chien">
+    <label value="Fournissez plus de détails sur le chien que vous désirez :"/>
+    <radiogroup>
+      <caption label="Taille"/>
+      <radio value="small" label="Petit"/>
+      <radio value="large" label="Grand"/>
+    </radiogroup>
+    <radiogroup>
+      <caption label="Sexe"/>
+      <radio value="male" label="Male"/>
+      <radio value="female" label="Femelle"/>
+    </radiogroup>
+  </wizardpage>
+
+</wizard>
+
+ +
Image:xultu_wizard1.jpg
+ +

L'assistant a deux pages, une qui a une liste déroulante et une autre qui a un ensemble de boutons radios. L'assistant sera formaté automatiquement, avec un titre en haut et un ensemble de boutons le long du bas de la fenêtre. L'utilisateur peut naviguer entre les pages de l'assistant avec les boutons 'Précédent' et 'Suivant'. Ces boutons s'activeront ou se désactiveront eux-mêmes aux moments appropriés. De plus, sur la dernière page, le bouton 'Terminer' apparaîtra. Tout ceci est automatique, aussi, vous n'avez rien à faire pour manipuler les pages.

+ +

L'attribut description peut être éventuellement placé sur l'élément wizardpage pour fournir un sous-titre pour la page concernée. Dans l'exemple du dessus, il est placé sur la seconde page, mais pas sur la première.

+ +

Gestion des changements de page

+ +

Généralement, vous souhaitez réaliser une action après que le bouton 'Terminer' ait été pressé. Vous pouvez mettre un attribut onwizardfinish sur l'élément wizard pour accomplir cette tâche. Spécifiez-y un script qui exécutera ce que vous voulez et qui renverra 'true'. Le script peut être utilisé pour sauvegarder les informations que l'utilisateur a saisi dans l'assistant. Par exemple :

+ +
<wizard id="example-window" title="Assistant de sélection de chien"
+  onwizardfinish="return saveDogInfo();"
+  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+ +

Quand l'utilisateur clique sur le bouton 'Terminer', la fonction saveDogInfo définie dans un script sera appelée pour sauvegarder les informations saisies. Si la fonction renvoie 'true', l'assistant se fermera. Si elle renvoie 'false', alors l'assistant ne se fermera pas, ce qui pourrait signifier par exemple que la fonction saveDogInfo a rencontré une saisie invalide.

+ +

Il existe également les attributs similaires onwizardback, onwizardnext et onwizardcancel qui sont appelés quand les boutons 'Précédent', 'Suivant' et 'Annuler' sont respectivement pressés. Ces fonctions sont appelées quelque soit la page en cours affichée.

+ +

Pour appeler un code différent en fonction de la page où vous êtes, utilisez les attributs onpagerewound ou onpageadvanced sur un élément wizardpage. Ils fonctionnent de manière similaire aux autres fonctions, excepté que vous pouvez utiliser un script différent pour chaque page. Cette méthode vous permet de valider les informations saisies sur chaque page avant que l'utilisateur ne continue.

+ +

Une troisième méthode est l'utilisation des attributs onpagehide et onpageshow sur l'élément wizardpage. Ils sont appelés lorsque la page est cachée ou affichée, indifféremment du bouton pressé (excepté quand le bouton 'Annuler' est pressé ; vous devez utiliser onwizardcancel pour le vérifier).

+ +

Ces trois méthodes devraient fournir suffisamment de souplesse pour gérer la navigation comme vous le souhaitez. Ce qui suit est un résumé des fonctions d'attributs appelées quand l'utilisateur presse 'Suivant', dans l'ordre dans lequel elles sont vérifiées. Dés que l'une renvoie 'false', la navigation est annulée.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
AttributPlacé sur la baliseQuand est-il appelé ?
pagehidewizardpageAppelé sur la page que l'utilisateur quitte.
pageadvancedwizardpageAppelé sur la page que l'utilisateur quitte.
wizardnextwizardAppelé sur l'assistant.
pageshowwizardpageAppelé sur la page sur laquelle l'utilisateur entre.
+ +

Un processus similaire existe pour le bouton 'Précédent'.

+ +
À chaque fois que vous utiliserez une fonction dans un des événements ci-dessus, tel que pageadvanced, vous devrez utiliser return NomFonct() au lieu de simplement appeler NomFonct(). + +
<wizardpage pageadvanced='return NomFonct()'></wizardpage>
+
+ +
+

Dans la prochaine section, nous verrons des fonctionnalités supplémentaires sur les assistants.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251ation_d'un_programme_d'installation/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251ation_d'un_programme_d'installation/index.html" new file mode 100644 index 0000000000..c83ee8d774 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251ation_d'un_programme_d'installation/index.html" @@ -0,0 +1,115 @@ +--- +title: Création d'un programme d'installation +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Création_d'un_programme_d'installation +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Creating_an_Installer +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +
NdT : Attention, cette section décrit le mécanisme XPInstall propre à la suite Mozilla et à des versions anciennes de Mozilla Firefox. Pour les versions récentes de Mozilla Firefox, ce mode d'installation n'est plus le même, mais il n'est pas encore décrit dans ce tutoriel. Voir comment faire des extensions pour firefox sur xulfr.org.
+ +

Cette section va décrire le paquetage d'une application XUL dans un programme d'installation.

+ +

Paquetages d'installation XPI

+ +

Mozilla propose un mécanisme qui peut être utilisé pour empaqueter des fenêtres XUL, des scripts, des thèmes graphiques et d'autres fichiers dans un seul installateur. Il suffit de placer le fichier d'installation quelque part où les utilisateurs pourront le télécharger. Un simple script peut être utilisé pour assurer le téléchargement et l'installation du paquetage. Ce mécanisme est appelé XPInstall (Cross Platform Install).

+ +

Les installateurs XPI sont empaquetés dans des fichiers JAR. À l'intérieur d'un fichier JAR, vous pouvez ajouter toutes sortes de fichiers que vous voulez voir installés. De plus, les installateurs doivent contenir un script (un fichier nommé install.js) qui décrit le processus d'installation. Ce script a accès à quelques fonctions d'installation qui peuvent être employées pour installer des fichiers et des composants.

+ +

Les fichiers d'installation JAR ont typiquement l'extension .xpi (prononcez zippy) pour les distinguer des autres fichiers d'archives. Les installateurs seront habituellement utilisés pour installer des composants Mozilla tels que des thèmes graphiques, des extensions et d'autres paquetages.

+ +

Il y a plusieurs étapes pour démarrer et installer les composants. Elles sont décrites pas à pas ci dessous :

+ +
    +
  1. Créer une page Web à partir de laquelle l'utilisateur peut charger l'application à installer. La page doit contenir un déclencheur d'installation qui est un petit script lançant l'installation.
    2. +
  2. Une boîte de dialogue présente à l'utilisateur le paquetage qui doit être installé. Il est possible pour le déclencheur de lancer de multiples installations. Dans ce cas, elles seront présentées dans une liste. L'utilisateur doit choisir de continuer ou d'annuler.
    3. +
  3. Si l'utilisateur choisit de continuer, le fichier d'installation XPI est téléchargé. Une barre de progression est affichée durant le processus.
    4. +
  4. Le fichier install.js est extrait de l'archive et exécuté. Le script va appeler les fonctions d'installation qui indiqueront quels fichiers de l'archive doivent être installés.
    5. +
  5. Une fois le script terminé, le nouveau paquetage a été installé. Si de multiples paquetages doivent être installés, leurs scripts se lanceront l'un après l'autre.
    6. +
+ +

Déclencheurs d'installation

+ +

Comme indiqué ci-dessus, le processus d'installation est lancé par un déclencheur d'installation. Il requiert l'utilisation de l'objet global spécial InstallTrigger. Il contient un certain nombre de méthodes qui peuvent être utilisées pour démarrer une installation. Vous pouvez utiliser cet objet dans un contenu local ou à distance, ce qui signifie qu'il est adapté pour un téléchargement à partir d'un site Web.

+ +

Créons un exemple de déclencheur d'installation. Il nécessite l'utilisation de la fonction InstallTrigger.install(). Cette fonction a deux arguments, le premier est la liste des paquetages à installer, et le second est la référence à une fonction de rappel qui sera appelée lorsque l'installation est terminée. Voici un exemple :

+ +
function doneFn ( name , result ){
+  alert("Le paquetage " + name + " a été installé avec un résultat de " + result);
+}
+
+var xpi = new Object();
+xpi["Calendar"] = "calendar.xpi";
+InstallTrigger.install(xpi,doneFn);
+
+ +

Premièrement, nous définissons la fonction doneFn() qui sera appelée lorsque l'installation est terminée. Bien entendu, vous pouvez nommer cette fonction comme vous le souhaitez. Cette fonction a deux arguments. Le premier argument est le nom du paquetage qui vient juste d'être installé. Celui ci est important si vous installez de multiples composants. Le second argument est un code de résultat. Un code de valeur '0' signifie que l'installation s'est terminée avec succès. Si le code de résultat n'est pas nul, une erreur a eu lieu et la valeur représente un code d'erreur. Ici, la fonction doneFn() affiche simplement une boîte d'alerte à l'utilisateur.

+ +

Ensuite, nous créons un tableau xpi qui contient le nom ('Calendar') et l'URL ('calendar.xpi') du programme d'installation. Vous pouvez ajouter une ligne similaire pour chaque paquetage que vous souhaitez installer. Finalement, nous appelons la fonction d'installation.

+ +

Lorsque cette portion de script sera exécutée, le fichier calendar.xpi sera installé.

+ +
+

Notre exemple de recherche de fichiers

+ +

Essayons ce script avec notre exemple de recherche de fichiers.

+ +
function doneFn ( name , result ){
+  if (result) alert("L'erreur suivante a eu lieu: " + result);
+}
+
+var xpi = new Object();
+xpi["Find Files"] = "findfile.xpi";
+InstallTrigger.install(xpi,doneFn);
+
+
+ +

L'archive XPI

+ +
Note : Si vous créez une nouvelle application XULRunner, extension, ou thème, consultez la page Bundles.
+ +

Le fichier d'installation XPI doit obligatoirement contenir au minimum un fichier appelé install.js qui est un fichier JavaScript exécuté lors de l'installation. Les autres fichiers sont les fichiers à installer. Ces derniers sont typiquement placés dans des répertoires de l'archive mais ils n'ont pas lieu de l'être. Pour des fichiers chrome, ils devraient être structurés comme le répertoire chrome.

+ +

Souvent, les seuls fichiers trouvés dans une archive XPI sont le script d'installation (install.js) et un fichier JAR. Ce fichier JAR contient tous les fichiers utilisés par votre application. Les composants de Mozilla sont installés de cette manière.

+ +

Parce que les fichiers XPI ne sont rien d'autres que des fichiers ZIP, vous pouvez les créer en utilisant un utilitaire zip (NdT : les fichiers JAR sont également des fichiers ZIP).

+ +
+

Notre exemple de recherche de fichiers

+ +

Pour notre exemple de recherche de fichiers, nous créerons une structure dans l'archive comme ce qui suit :

+ +
install.js
+findfile
+  content
+    contents.rdf
+    findfile.xul
+    findfile.js
+  skin
+    contents.rdf
+    findfile.css
+  locale
+    contents.rdf
+    findfile.dtd
+
+ +

Un répertoire a été ajouté pour chaque partie du paquetage, pour le contenu, pour le thème graphique et pour la localisation. Des fichiers 'contents.rdf' ont également été ajoutés car ils sont nécessaires pour l'enregistrement des fichiers chrome.

+
+ +
+

Dans la section suivante, nous aborderons le script d'installation.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

+ +

 

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251er_des_bo\303\256tes_de_dialogue/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251er_des_bo\303\256tes_de_dialogue/index.html" new file mode 100644 index 0000000000..cc2a63e092 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251er_des_bo\303\256tes_de_dialogue/index.html" @@ -0,0 +1,152 @@ +--- +title: Créer des boîtes de dialogue +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Créer_des_boîtes_de_dialogue +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Creating_Dialogs +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Une application XUL requiert souvent l'affichage de boîtes de dialogue. Cette section décrit comment les construire.

+ +

Création d'une boîte de dialogue

+ +

La fonction openDialog() est utilisée pour ouvrir une fenêtre. Une fonction apparentée est open(). Cette fonction a plusieurs différences importantes. Au lieu d'une fenêtre (window), elle affiche une boîte de dialogue (dialog), ce qui implique qu'elle demande quelque chose à l'utilisateur. Elle peut avoir des différences subtiles dans sa manière de fonctionner et d'apparaître à l'utilisateur suivant les différentes plateformes.

+ +

De plus, la fonction openDialog() peut prendre des arguments additionnels en plus des trois premiers habituels. Ces arguments sont passés à la nouvelle boîte de dialogue et placés dans un tableau stocké dans la propriété arguments de la nouvelle fenêtre. Vous pouvez passer autant d'arguments que nécessaire. C'est un moyen pratique de fournir des valeurs par défaut aux champs de la boîte de dialogue.

+ +
var somefile=document.getElementById('enterfile').value;
+
+window.openDialog("chrome://findfile/content/showdetails.xul","showmore",
+                  "chrome",somefile);
+
+ +

Dans cet exemple, la boîte de dialogue showdetails.xul sera affichée. L'argument 'somefile' provenant d'un élément d'id 'enterfile' lui est transmis. Dans un script utilisé par la boîte de dialogue, nous pouvons alors faire référence à l'argument en utilisant la propriété arguments de la fenêtre. Par exemple :

+ +
var fl = window.arguments[0];
+
+document.getElementById('thefile').value = fl;
+
+ +

C'est un moyen efficace de passer des valeurs à la nouvelle fenêtre. Vous pouvez renvoyer des valeurs de la fenêtre ouverte vers la fenêtre originelle de deux manières. Première méthode : vous pouvez utiliser la propriété window.opener qui contient une référence à la fenêtre qui a ouvert la boîte de dialogue. Seconde méthode : vous pouvez passer une fonction ou un objet en argument, puis appeler la fonction ou modifier l'objet dans la boîte de dialogue ouverte.

+ +
Note : openDialog() nécessite un privilège UniversalBrowserWrite. Cela signifie que cette méthode ne fonctionnera pas sur des sites distants ; pour ces sites, utilisez la méthode window.open() à la place.
+ +

L'élément dialog

+ +

L'élément dialog doit être utilisé à la place de l'élément window lors de la création d'une boîte de dialogue. Il offre la possibilité de construire jusqu'à quatre boutons au bas de la boîte de dialogue, pour « OK », « Annuler », etc. Vous n'avez pas besoin d'inclure le code XUL pour chaque bouton mais vous devez fournir le code à exécuter quand l'utilisateur les presse. Ce mécanisme est nécessaire car les différentes plateformes ont un ordre d'affichage spécifique de ces boutons.

+ +

Exemple de boîte de dialogue

+ +

Exemple 1: Source Voir

+ +
<?xml version="1.0" encoding="iso-8859-1"?>
+<?xml-stylesheet href="chrome://global/skin/global.css" type="text/css"?>
+
+<dialog id="donothing" title="Ne fait rien"
+        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+        buttons="accept,cancel"
+        ondialogaccept="return doOK();"
+        ondialogcancel="return doCancel();">
+
+<script>
+function doOK(){
+  alert("Vous avez appuyé sur OK !");
+  return true;
+}
+
+function doCancel(){
+  alert("Vous avez appuyé sur Annuler !");
+  return true;
+}
+</script>
+
+<description value="Veuillez sélectionner un bouton"/>
+
+</dialog>
+
+ +

Vous pouvez placer tous les éléments que vous souhaitez dans une boîte de dialogue. L'élément dialog a des attributs que les fenêtres n'ont pas. L'attribut buttons, par exemple, est utilisé pour spécifier quels boutons doivent apparaître dans la boîte de dialogue. Les valeurs suivantes peuvent être utilisées en les séparant par des virgules :

+ + + +

Vous pouvez exécuter du code lors de l'appui des boutons en utilisant les attributs ondialogaccept, ondialogcancel, ondialoghelp et ondialogdisclosure. Si vous essayez l'exemple ci-dessus, vous remarquerez que la fonction doOK est appelée quand le bouton 'OK' est pressé et que la fonction doCancel est appelée quand le bouton 'Annuler' est pressé.

+ +

Les deux fonctions doOK et doCancel renvoient 'true', ce qui indique que la boîte de dialogue doit être fermée. Si la valeur 'false' était renvoyée, la boîte de dialogue resterait ouverte. Ce fonctionnement pourrait être utilisé dans le cas où une valeur invalide serait entrée dans un champ de la boîte de dialogue.

+ +

Voici d'autres attributs utiles :

+ + + +
Note : Les attributs label sont nécessaires pour les sites distants et ont probablement été omis dans les exemples précédents à cause du bug 224996.
+ +

Exemple de dialogue avec plus de fonctionnalités

+ +
<?xml version="1.0" encoding="iso-8859-1?>
+<?xml-stylesheet href="chrome://global/skin/global.css" type="text/css"?>
+
+<dialog id="myDialog" title="Mon dialogue"
+        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+        onload="window.sizeToContent();"
+        buttons="accept,cancel"
+        buttonlabelaccept="Choix favori"
+        buttonaccesskeyaccept="S"
+        ondialogaccept="return doSave();"
+        buttonlabelcancel="Annuler"
+        buttonaccesskeycancel="n"
+        ondialogcancel="return doCancel();">
+
+<script>
+function doSave(){
+ //faireTraitement()
+ return true;
+}
+function doCancel(){
+  return true;
+}
+</script>
+
+<dialogheader title="Mon dialogue" description="Exemple de dialogue"/>
+<groupbox flex="1">
+  <caption label="Sélectionnez votre fruit préféré"/>
+  <radio id="orange" label="Des oranges car elles sont juteuses"/>
+  <radio id="violet" selected="true" label="Des frises à cause de leur couleur"/>
+  <radio id="yellow" label="Des bananes car elles sont déjà emballées"/>
+</groupbox>
+
+</dialog>
+
+ +

Les éléments correspondants aux boutons sont accessibles en JavaScript par le script suivants :

+ +
// le bouton d'acceptation
+var acceptButt = document.documentElement.getButton("accept")
+
+ +

Autres exemples

+ +

D'autres exemples sont disponibles dans Dialogues et invites.

+ +
+

Dans la prochaine section, nous allons voir comment ouvrir des boîtes de dialogue de sélection de fichiers.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251er_un_th\303\250me/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251er_un_th\303\250me/index.html" new file mode 100644 index 0000000000..55430426d5 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251er_un_th\303\250me/index.html" @@ -0,0 +1,205 @@ +--- +title: Créer un thème +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Créer_un_thème +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Creating_a_Skin +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +
+

Cette documentation n'a pas été mise à jour pour Firefox Quantum. Il n'y aucune garantie que la modification du fichier userChrome.css fonctionne encore d'une version à l'autre de Firefox. Celle-ci pourrait également provoquer la survenue de bugs difficiles à diagnostiquer. À utiliser à vos risques et périls !

+
+ +

Cette section décrit comment créer un thème simple. Nous ne l'appliquerons qu'à la fenêtre de recherche de fichiers.

+ +

Un thème simple

+ +

L'image ci-dessous montre la boîte de dialogue de recherche de fichiers actuelle. Créons un thème que nous pourrons lui appliquer. Normalement, un thème doit s'appliquer à l'application entière, mais, pour plus de facilité, nous allons nous concentrer sur la boîte de dialogue de recherche de fichiers. Pour cette raison, nous n'allons modifier que le fichier 'findfile.css' plutôt que le fichier 'global.css'. Cette section suppose que vous démarriez avec le thème Classic. Si vous le souhaitez, faites une copie des fichiers utilisés par la boîte de dialogue de recherche de fichiers avant de les modifier.

+ +

Image:xultu_cskin1.jpg

+ +
Note du traducteur : Pour les versions récentes de mozilla (> 1.6) et de firefox (>0.8), avec le fichier findfile.css tel qu'il est, il se peut que vous n'obteniez pas un design identique à ce que montre l'image. En effet, dans le thème classic, des styles -moz-appearance ont été ajoutés depuis aux différents éléments, leur permettant d'avoir le même aspect que les éléments natifs de l'interface graphique utilisée (windows ou kde, macos, etc.). Ce style empêche certains styles d'être appliqués correctement. Pour pouvoir modifier complètement l'apparence des éléments utilisés dans notre exemple et afin de suivre le tutoriel, il a été rajouté le code suivant dans la feuille de styles de l'exemple : + +
tab, button, menulist, menubar,menupopup,toolbar,tabpanels {
+   -moz-appearance:none;
+}
+
+
+ +

Vous devez créer un fichier 'findfile.css' dans un thème personnalisé, ou vous pouvez placer ce fichier temporairement dans le répertoire "content" et y faire référence en utilisant une directive de la feuille de styles. Vous pouvez modifier le fichier 'findfile.css' existant directement pour voir à quoi cela ressemble, ou vous pouvez créer un thème personnalisé et y faire un lien.

+ +

Création d'un paquetage de thème personnalisé

+ +

Pour créer un thème, faites ce qui suit : (si vous utilisez Firefox 1.5 ou supérieur, consultez plutôt les fichiers manifest)

+ +
    +
  1. Créez un répertoire quelque part où vous placerez les fichiers du thème.
    2. +
  2. Copiez un fichier manifeste (contents.rdf) du thème Classic ou Modern dans ce nouveau répertoire.
    3. +
  3. Modifiez les références dans le fichier manifeste à un nom personnalisé pour votre thème. Par exemple, changez les références de 'classic/1.0' vers 'blueswayedshoes/1.0'.
    4. +
  4. Ajoutez une ligne de la forme suivante au fichier 'chrome/installed-chrome.txt' :
    + skin,install,url,file:///stuff/blueswayedshoes/
    + où la dernière partie pointe vers le répertoire que vous avez créé. Vérifiez bien que vous avez mis un slash à la fin.
    5. +
+ +

Copiez le fichier 'findfile.css' original dans le nouveau répertoire. Nous l'utiliserons comme base pour le nouveau thème. Nous pourrons y faire référence par la suite en utilisant l'URL 'chrome://findfile/skin/findfile.css'.

+ +

Ajout de règles de styles

+ +

Décidons d'abord quels types de changements nous voulons effectuer. Nous allons faire de simples changements de couleurs, modifier les styles des boutons et modifier un peu l'espacement. Commençons par les menus, les barres d'outils et le panneau global des onglets.

+ +

L'ajout des règles de styles suivantes à 'findfile.css' provoquera les changements montrés dans l'image qui suit.

+ +
window > box {
+  background-color: #0088CC;
+}
+
+menubar,menupopup,toolbar,tabpanels {
+  background-color: lightblue;
+  border-top: 1px solid white;
+  border-bottom: 1px solid #666666;
+  border-left: 1px solid white;
+  border-right: 1px solid #666666;
+}
+
+caption {
+  background-color: lightblue;
+}
+
+ +

Image:xultu_cskin2.jpg

+ + + +

La première règle au-dessus (pour window > vbox) spécifie que la boîte enfant de la fenêtre principale a une couleur différente. Ce n'est probablement pas la meilleure façon de procéder. Nous devrions plutôt modifier la fenêtre et plutôt utiliser une classe de style. C'est ce que nous allons faire. De cette manière, nous pourrons modifier le code XUL sans avoir besoin de conserver la boîte comme premier élément enfant de la fenêtre.

+ +
CSS:
+.findfilesbox {
+  background-color: #0088CC;
+}
+
+XUL:
+<vbox class="findfilesbox" orient="vertical" flex="100%">
+<toolbox>
+
+ +

Arrondis sur les onglets

+ +

Ensuite, modifions les onglets. Nous allons rendre l'onglet sélectionné en gras et changer les arrondis sur les onglets.

+ +
tab:first-child {
+  -moz-border-radius: 4px 0px 0px 0px;
+}
+
+tab:last-child {
+  -moz-border-radius: 0px 4px 0px 0px;
+}
+
+tab[selected="true"] {
+  color: #000066;
+  font-weight: bold;
+  text-decoration: underline;
+}
+
+ +
Image:xultu_cskin3.jpg
+ +

Deux règles changent l'apparence normale de l'élément tab. La première met un arrondi sur le premier onglet et la seconde met un arrondi sur le dernier. On utilise ici une règle de styles propre à Mozilla, -moz-border-radius, qui crée des coins arrondis. La bordure supérieure gauche du premier onglet et la bordure supérieure droite du second onglet sont arrondies de quatre pixels et les autres coins sont arrondis de zéro pixels, ce qui équivaut à aucun arrondi. Augmentez ces valeurs pour un arrondi plus prononcé et diminuez-les pour une apparence plus rectangulaire.

+ +

La dernière règle ne s'applique qu'aux onglets qui ont leur attribut selected à la valeur 'true'. Elle met le texte d'un onglet sélectionné en gras, souligné et bleu foncé. Notez dans l'image que ce style n'est appliqué qu'au premier onglet, puisqu'il est sélectionné.

+ +

Ajout des icônes de barres d'outils

+ +

Il est assez difficile de distinguer les boutons de la barre d'outils des commandes du menu. Nous pourrions ajouter des icônes aux boutons pour les rendre plus clairs. L'éditeur Mozilla Composer fournit des icônes pour les boutons ouvrir et sauvegarder que nous utilisons pour gagner du temps. Nous pouvons choisir l'image d'un bouton en utilisant la propriété CSS list-style-image.

+ +
#opensearch {
+  list-style-image: url("chrome://editor/skin/icons/btn1.gif");
+  -moz-image-region: rect(48px 16px 64px 0);
+  -moz-box-orient: vertical;
+}
+
+#savesearch {
+  list-style-image: url("chrome://editor/skin/icons/btn1.gif");
+  -moz-image-region: rect(80px 16px 96px 0);
+  -moz-box-orient: vertical;
+}
+
+ +
Image:xultu_cskin4.jpg
+ +

Mozilla met à disposition une propriété de style spécifique, -moz-image-region, qui permet à un élément d'utiliser une partie d'une image. Vous pouvez vous la représenter comme un découpage de l'image. Vous mettez comme valeur de la propriété une position et une taille comprise dans une image et le bouton n'affichera que cette section de l'image. Cette technique vous permet d'utiliser la même image pour plusieurs boutons et de mettre une portion différente pour chacun d'entre eux. Quand vous avez beaucoup de boutons, avec chacun d'eux des états pour hover, active et disabled, elle fait gagner de l'espace qui serait sinon occupé par plusieurs images. Dans le code ci-dessus, nous utilisons la même image pour tous les boutons, mais nous mettons une portion différente de l'image pour chacun. Si vous regardez cette image (btn1.gif), vous remarquerez qu'elle contient une grille d'images plus petites, de 16 fois 16 pixels chacune.

+ +
Note du traducteur : étant donné que l'image en question fait partie de Mozilla Composer, si vous ouvrez l'exemple avec Firefox, vous ne verrez pas les images des boutons, car Mozilla Composer n'est livré qu'avec la suite Mozilla.
+ +

La propriété -moz-box-orient est utilisée pour orienter le bouton verticalement, pour que l'image apparaisse au-dessus de son libellé. Cette propriété a la même signification que l'attribut orient. Elle est pratique puisque le thème ne peut pas modifier le code XUL. La plupart des attributs de l'élément box ont des propriétés CSS qui leur correspondent.

+ +

Autres modifications

+ +

Nous allons maintenant faire quelques changements aux boutons situés en bas de la boîte de dialogue, en réutilisant des icônes de Mozilla pour gagner du temps. Si vous créez votre propre thème, vous aurez besoin de créer de nouvelles icônes ou de copier les icônes dans de nouveaux fichiers. Si vous suivez l'exemple de cette section, copiez juste les fichiers vers votre nouveau thème et modifiez les URL en conséquence.

+ +
#find-button {
+  list-style-image: url("chrome://global/skin/checkbox/images/cbox-check.jpg");
+  font-weight: bold;
+}
+
+#cancel-button {
+  list-style-image: url("chrome://global/skin/icons/images/close-button.jpg");
+}
+
+button:hover {
+  color: #000066;
+}
+
+ +
Image:xultu_cskin5.jpg
+ +

Nous ajoutons des images aux boutons et mettons le texte du bouton « Rechercher » en gras pour indiquer que c'est le bouton par défaut. La dernière règle s'applique aux boutons quand la souris les survole (état hover). Nous mettons une couleur de texte bleu foncé dans ce cas. Finalement, quelques changements mineurs de l'espacement autour des éléments, par l'utilisation de marges :

+ +
tabbox {
+  margin: 4px;
+}
+
+toolbarbutton {
+  margin-left: 3px;
+  margin-right: 3px;
+}
+
+ +

Après ces changements, la boîte de dialogue de recherche de fichiers apparaît maintenant comme ceci :

+ +

Image:xultu_cskin-fin.jpg

+ +

Comme vous pouvez le voir, de simples changements des règles de styles apportent une apparence assez différente à la fenêtre de recherche de fichiers. Nous pourrions continuer en modifiant les menus, les poignées sur la barre d'outils et les éléments textbox et checkbox.

+ +

Création d'un thème global

+ +

Le thème créé ci-dessus est simple et ne s'applique qu'à la boîte de dialogue de recherche de fichiers. Certaines des modifications du thème pourraient être placées dans les feuilles de styles globales (situées dans le répertoire global du thème) pour s'appliquer à toutes les applications. Par exemple, il serait peu cohérent d'avoir des images différentes entre les cases à cocher de la fenêtre de recherche de fichiers et celles d'autres fenêtres. Ce changement devrait vraiment être intégré dans la feuille de styles globale.

+ +

Essayez de déplacer les styles CSS de 'findfile.css' dans 'global.css' puis regardez les fenêtres de dialogue de Mozilla (Le visualisateur de cookie est un bon exemple). Vous remarquerez qu'elles ont adopté les règles que nous avons ajoutées. Certaines des règles entrent en conflit avec celles déjà dans les feuilles de styles globales. Par exemple, des règles sont déjà définies pour les boutons, les onglets, etc., et nous avons défini des règles additionnelles pour ces éléments. Quand vous modifiez le thème global, vous devez fusionner les changements avec les règles existantes.

+ +

Pour une meilleure adaptation du thème graphique, il vaut mieux déclarer les règles de styles liées à l'apparence dans le répertoire global plutôt que dans des fichiers de styles séparés. Les couleurs, les polices de caractère et l'apparence générale des composants graphiques doivent y être inclus. Si vous modifiez la couleur d'un élément dans un fichier de thème local (comme 'findfile.css'), la fenêtre de dialogue peut paraître bizarre si l'utilisateur change son style global. N'espérez pas que l'utilisateur utilise le thème par défaut.

+ +
+

L'exemple du dialogue de recherche de fichier avec ce thème : Source Voir

+
+ +
+

La section suivante explique comment rendre une application XUL localisable.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251er_une_fen\303\252tre/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251er_une_fen\303\252tre/index.html" new file mode 100644 index 0000000000..3cff976726 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/cr\303\251er_une_fen\303\252tre/index.html" @@ -0,0 +1,104 @@ +--- +title: Créer une fenêtre +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Créer_une_fenêtre +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Creating_a_Window +--- +
+

« PrécédentSuivant »

+
+ +

Nous allons créer un simple outil de recherche de fichiers tout au long de ce tutoriel. Avant tout, cependant, nous devons étudier la syntaxe de base d'un fichier XUL.

+ +

Création d'un fichier XUL

+ +

Un fichier XUL peut avoir n'importe quel nom mais il doit avoir l'extension .xul. Le fichier XUL le plus simple a la structure suivante :

+ +
<?xml version="1.0" encoding="ISO-8859-1"?>
+<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+
+<window
+       id="findfile-window"
+       title="Recherche de fichiers"
+       orient="horizontal"
+       xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+...
+</window>
+
+ +

Cette fenêtre ne sert à rien puisqu'elle ne comporte pas d'élements d'interface utilisateur. Ceux ci seront ajoutés dans la section suivante. Voici l'analyse ligne par ligne du code ci-dessus :

+ +
    +
  1. <?xml version="1.0"?>
    + Cette ligne déclare simplement qu'il s'agit d'un fichier XML. Vous devrez normalement ajouter cette ligne à l'identique au début de chaque fichier xul, tout comme vous mettriez la balise HTML au début d'un fichier HTML.
    2. +
  2. <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
    + Cette ligne est utilisée pour spécifier la feuille de style à utiliser pour le fichier. C'est la syntaxe que les fichiers XML emploient pour importer des feuilles de style. Dans ce cas, nous importons les styles trouvés dans le répertoire chrome global/skin. Nous n'avons pas indiqué de fichier spécifique ainsi Mozilla déterminera quels fichiers du dossier il emploiera. Ici, le fichier le plus important, global.css, est sélectionné. Ce fichier contient toutes les déclarations par défaut pour tous les éléments XUL. Puisque XML ne connaît pas la manière dont les éléments doivent être affichés, ce fichier s'en charge. De façon générale, vous mettrez cette ligne au debut de chaque fichier XUL. Vous pouvez également importer d'autres feuilles de style en utilisant la même syntaxe. Notez que vous devrez normalement importer la feuille de style globale à l'intérieur du fichier de votre propre feuille de style.
    3. +
  3. <window
    + Cette ligne déclare que vous allez décrire une fenêtre window. Chaque fenêtre d'interface utilisateur est décrit dans un fichier différent. Cette balise s'apparente à une balise HTML qui entoure l'ensemble d'un document HTML, sauf qu'elle décrit une interface utilisateur au lieu d'un document. Plusieurs attributs peuvent être placés dans la balise window -- dans ce cas, ils sont au nombre de quatre. Dans cet exemple, chaque attribut est placé sur une ligne séparée bien que ce ne soit pas une obligation.
    4. +
  4. id="findfile-window"
    + L'attribut id est utilisé comme un identifiant, de sorte que des scripts puissent y faire référence. Vous mettrez normalement un attribut id sur tous les éléments. Vous êtes libre de choisir n'importe quel nom, toutefois, il est préférable qu'il soit pertinent.
    5. +
  5. title="Recherche de fichiers"
    + L'attribut title décrit le texte qui apparaîtra dans la barre de titre de la fenêtre quand elle sera affichée. Dans le cas présent, le texte 'Recherche de fichiers' sera affiché.
    6. +
  6. orient="horizontal"
    + L'attribut orient spécifie l'arrangement des éléments de la fenêtre. La valeur 'horizontal' indique que les éléments doivent être placés horizontalement dans la fenêtre. Vous pouvez également utiliser la valeur 'vertical' signifiant que les éléments seront affichés en colonne. Comme c'est la valeur par défaut, vous pouvez omettre cet attribut si vous souhaitez avoir l'orientation verticale.
    7. +
  7. xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
    + Cette ligne déclare l'espace de nommage pour XUL que vous devrez mettre dans l'élément window pour indiquer que tous ses enfants sont du XUL. Notez que cette URL n'est jamais téléchargée réellement. Mozilla reconnaîtra cette URL en interne.
    8. +
  8. ...
    + Mettez ici les éléments (les boutons, les menus et les autres composants de l'interface utilisateur) à afficher dans la fenêtre. Nous en ajouterons quelques uns dans les prochaines sections.
    9. +
  9. </window>
    + Et enfin, nous devons fermer la balise window à la fin du fichier. +

    Ouverture d'une fenêtre

    + +

    Afin d'ouvrir une fenêtre XUL, plusieurs méthodes peuvent être employées. Si vous n'êtes qu'à l'étape de développement, vous pouvez juste taper l'URL (commençant par chrome:, file: ou d'autre type d'URL) dans la barre d'adresses du navigateur Mozilla. Vous pouvez également double-cliquer sur le fichier dans votre gestionnaire de fichiers, en supposant que les fichiers XUL soient associés à Mozilla. La fenêtre XUL apparaîtra cependant dans la fenêtre de navigateur et non dans une nouvelle, mais c'est souvent suffisant durant les premières étapes de développement.

    + +

    La manière correcte, naturellement, est d'ouvrir la fenêtre en utilisant JavaScript. Aucune nouvelle syntaxe n'est nécessaire, vous pouvez employer la fonction window.open() comme pour tout document HTML. Cependant, une option additionnelle, appelée 'chrome' est nécessaire pour indiquer au navigateur que le document à ouvrir est un chrome. Celle-ci s'ouvrira sans barre d'outils, sans menu et sans aucun élément qu'une fenêtre de navigateur dispose normalement. La syntaxe est décrite ci-dessous :

    + + 
    window.open(url,windowname,flags);
+
+où l'argument flags contient "chrome" comme dans cet exemple :
+
+window.open("chrome://navigator/content/navigator.xul", "bmarks", "chrome,width=600,height=300");
    + +
    +

    L'exemple findfile.xul

    + +

    Commençons par créer le fichier de base pour la boîte de dialogue de recherche de fichiers. Créez un fichier appelé findfile.xul et mettez le dans le répertoire content spécifié dans le fichier findfile.manifest (nous l'avons créé dans la section précédente). Ajoutez au fichier le squelette XUL montré au début de cette page et sauvegardez le.

    + +

    Vous pouvez utiliser le paramètre en ligne de commande '-chrome' pour indiquer le fichier XUL à ouvrir au démarrage de mozilla. S'il n'est pas spécifié, la fenêtre par défaut s'ouvrira (habituellement la fenêtre de navigateur). Par exemple, nous pourrions ouvrir la boite de dialogue de recherche de fichiers avec l'une des commandes suivantes :

    + + 
    mozilla -chrome chrome://findfile/content/findfile.xul
+mozilla -chrome resource:/chrome/findfile/content/findfile/findfile.xul
+
    + Si vous utilisez cette commande en ligne (dans l'hypothèse que cela soit possible sur votre plateforme), la boite de dialogue de recherche de fichiers s'ouvrira par défaut au lieu de la fenêtre de navigateur de Mozilla. Naturellement, puisque nous n'avons pas mis d'éléments graphiques dans la fenêtre, vous ne verrez rien. Dans la section suivante, quelques éléments y seront ajoutés.
    + +

    Pour en voir quand même l'effet, la commande en ligne suivante ouvrira la fenêtre des marque-pages :

    + + 
    mozilla -chrome chrome://communicator/content/bookma...rksManager.xul
+
+Si vous utilisez Firefox, essayez :
+firefox -chrome chrome://browser/content/places/places.xul
    + +

    L'option '-chrome' ne donne aucun privilège supplémentaire au fichier. Au lieu de cela, il entraine l'ouverture du fichier spécifié dans une fenêtre racine sans aucune interface chrome de navigation, comme la barre d'adresses ou le menu. Seules les URLs chrome ont des privilèges supplémentaires.

    + +
    L'Éditeur dynamique XUL vous permet de taper du code XUL et de voir immédiatement le résultat dans Mozilla !
    + +

    Problèmes

    + +
      +
    • Si la fenêtre XUL ne se montre pas sur le bureau mais a un icône sur la barre de tâches, vérifiez la déclaration xml-stylesheet. Assurez vous que vous avez inclus correctement la feuille de style :
      • +
    + + 
    <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+
    + +
    +

    Dans la section suivante, nous ajouterons des boutons dans la fenêtre.

    + +
    +

    « PrécédentSuivant »

    +
    +
    10. +
diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/document_object_model/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/document_object_model/index.html new file mode 100644 index 0000000000..6b269306e4 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/document_object_model/index.html @@ -0,0 +1,138 @@ +--- +title: Document Object Model +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Document_Object_Model +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Document_Object_Model +--- +

 

+
+

« PrécédentSuivant »

+
+

Le Document Object Model (DOM, modèle objet d'un document) peut être utilisé pour modifier les éléments XUL ou obtenir des informations à leur propos.

+

Introduction au DOM

+

Le DOM est utilisé pour stocker l'arbre des nœuds XUL. Quand un fichier XUL est chargé, les balises sont interprétées et converties dans une structure hiérarchique de nœuds du document, un pour chaque balise et bloc de texte. La structure DOM peut être examinée et modifiée en utilisant des méthodes dédiées. Des éléments XUL spécifiques fournissent également des fonctions additionnelles pouvant être utilisées.

+

Chaque fichier XUL chargé aura son propre document affiché dans une fenêtre ou un cadre. Bien qu'il ne puisse y avoir qu'un seul document associé à une fenêtre à un moment donné, vous pouvez charger des documents supplémentaires en utilisant plusieurs méthodes.

+

Dans Mozilla, on peut accéder au DOM et le manipuler en utilisant JavaScript. Les divers objets DOM possèdent des fonctions accessibles par script, pourtant, il est important de noter que le DOM est une API qui est accessible par JavaScript. JavaScript lui-même n'est jamais qu'un langage de script pouvant accéder à ces objets parce que Mozilla fournit ces objets à l'utilisation.

+

Dans JavaScript, il existe un unique objet global toujours disponible. Vous pouvez vous reférer aux propriétés et méthodes de l'objet global sans avoir à les qualifier avec un objet. Par exemple, si l'objet global possède une propriété name, vous pouvez changer le nom avec le code name=7 sans avoir à spécifier l'objet à utiliser. Dans un contexte de navigateur, la fenêtre est l'objet global. Il en va de même pour XUL. Naturellement, l'objet global sera différent pour chaque fenêtre. Chaque cadre aura également un objet window séparé.

+

On se refère souvent à la fenêtre en utilisant la propriété window, bien que ce soit optionnel. Quelquefois, cette pratique sert uniquement à clarifier la portée de la méthode à laquelle vous vous reférez. Par exemple, les deux lignes suivantes qui ouvrent une nouvelle fenêtre, sont fonctionnellement équivalentes :

+
window.open("test.xul","_new");
+open("test.xul","_new");
+
+

Lorsque vous déclarez une fonction ou une variable en tête de script, en dehors d'une fonction, vous êtes en train de déclarer une propriété de l'objet global. En XUL, chaque fonction que vous déclarez sera définie comme une propriété de l'objet window. Par exemple, le code suivant affichera deux fois le texte 'message' dans une alerte.

+
function getText(){
+  return "Message";
+}
+
+alert(getText());
+alert(window.getText());
+
+

De fait, si vous vouler accéder à des variables ou appeler une fonction déclarée dans un script utilisé par une autre fenêtre, vous pouvez y accéder juste en utilisant l'objet window de l'autre fenêtre. Par exemple, si nous avions combiné les deux derniers exemples dans un seul fichier, nous pourrions appeler la fonction getText au sein de l'autre fenêtre (par ex. la fenêtre test.xul). Pour cela, nous pouvons faire la chose suivante :

+
alert(window.opener.getText());
+

Chaque fenêtre possède une propriété opener contenant l'objet window l'ayant ouverte. Dans cet exemple, nous récupérons la fenêtre responsable de l'ouverture et appelons la fonction getText déclarée dans un script situé dans celle-ci. Notez que nous qualifions la propriété avec l'identifiant window uniquement pour plus de clarté.

+

La méthode open() de la fenêtre retourne également une référence à la nouvelle fenêtre, donc vous pouvez appeler des fonctions de la nouvelle fenêtre à partir de l'ouvrante. Toutefois, il est important de noter que la méthode open() renvoie sa valeur de retour avant que la fenêtre soit complètement chargée, donc les fonctions ne seront pas forcément disponibles pour autant.

+

L'objet window n'est défini par aucune spéficication DOM, mais est quelquefois considéré, dans Mozilla, comme faisant partie du DOM niveau 0, un nom utilisé par des développeurs pour se reférer aux fonctions assimilées DOM avant que celles-ci ne soient ajoutées aux spécifications. Le document actuel affiché dans une fenêtre peut être récupéré en utilisant la propriété document du document. Depuis qu'elle est devenue la propriété de la fenêtre la plus couramment utilisée, la propriété document est habituellement utilisée sans le qualifieur document.

+

Mozilla founit divers objets de document en fonction de son type. Les trois documents principaux sont les HTMLDocument, XMLDocument et XULDocument, respectivement pour les documents HTML, XML et XUL. Évidemment, c'est ce dernier type de document qui est utilisé pour le XUL. Les trois types de document sont très similaires. Concrètement, ils partagent tous la même implémentation de base. Mais il existe des fonctions spécifiques à chacun de ces documents.

+

Récupérer des éléments

+

La méthode la plus courante pour récupérer un élément dans un document est de lui affecter un attribut id et d'utiliser la méthode getElementById() du document. Nous avons ajouté l'attribut id à un certain nombre d'éléments dans la boîte de recherche de fichiers. Par exemple, nous pouvons obtenir l'état de la case à cocher en utilisant le code ci-dessous :

+
var state = document.getElementById('casecheck').checked;
+

La valeur 'casecheck' correspond à l'id de la case à cocher définissant la sensibilité à la casse. Une fois que nous savons si elle est cochée ou non, nous pouvons utiliser cette indication pour effectuer la recherche. Nous pourrions procéder de façon similaire pour l'autre case à cocher, ou n'importe quel autre élément qui a un attribut id. Nous aurons par exemple besoin de récupérer le texte dans le champ de saisie.

+
+

Notre exemple de recherche de fichiers

+

Il n'est pas nécessaire d'afficher la barre de progression et l'arbre de données vide quand la boîte de dialogue pour la recherche de fichiers est affichée pour la première fois. Ceux-ci ont été ajoutées de façon à ce que nous puissions les voir. Retirons-les maintenant, et affichons-les seulement lorsque le bouton « Rechercher » sera pressé. Au départ, nous devons les rendre invisible. L'attribut hidden est utilisé pour contrôler la visibilité d'un élément.

+

Nous allons modifier la barre de progression de façon à ce qu'elle soit cachée au départ. Nous allons aussi lui ajouter un attribut id pour qu'un script puisse y faire référence pour pouvoir la cacher ou l'afficher. Profitons-en pour cacher aussi le séparateur et l'arbre des résultats, puisque nous n'en aurons besoin qu'après avoir effectué une recherche.

+
<tree id="results" hidden="true" flex="1">
+  .
+  .
+  .
+<splitter id="splitbar" resizeafter="grow" hidden="true"/>
+
+<hbox>
+
+  <progressmeter id="progmeter" value="50%"
+    style="margin: 4px;" hidden="true"/>
+
+

Nous avons ajouté l'attribut hidden et mis sa valeur à 'true'. L'élément est ainsi caché lors de sa première apparition.

+

Ensuite, ajoutons une fonction qui sera appelée quand le bouton « Rechercher » sera pressé. Nous mettrons les scripts dans le fichier séparé 'findfile.js'. Dans une section précédente, nous avons ajouté l'élément script dans le fichier XUL. Si vous ne l'avez pas encore fait, faites-le maintenant, comme ci-dessous. Nous ajouterons aussi un gestionnaire oncommand au bouton « Rechercher ».

+
<script src="findfile.js"/>
+  .
+  .
+  .
+<button id="find-button" label="Rechercher"
+   oncommand="doFind();"/>
+
+

À présent, créez un autre fichier nommé 'findfile.js' dans le même répertoire que 'findfile.xul'. Nous ajouterons la fonction doFind() dans ce fichier. La balise script de ce fichier XUL peut contenir du code. Cependant, pour diverses raisons, notamment pour de meilleures performances, vous devriez toujours mettre vos scripts dans des fichiers séparés, excepté pour les courts morceaux de code qui peuvent se trouver directement dans les gestionnaires d'événement.

+
function doFind(){
+  var meter = document.getElementById('progmeter');
+  meter.hidden = false;
+}
+
+

Cette fonction récupère d'abord une référence à la barre de progression en utilisant son id, 'progmeter'. La seconde ligne du corps de la fonction change l'état de hidden pour rendre l'élément visible.

+

Finalement, ajoutons une boîte de dialogue qui affiche ce que nous sommes en train de rechercher. Évidemment nous n'en voudrons pas dans la version finale, mais ajoutons la maintenant pour nous assurer que quelque chose se produise.

+
function doFind(){
+  var meter=document.getElementById('progmeter');
+  meter.hidden = false;
+  var searchtext=document.getElementById('find-text').value;   alert("Recherche de \"" + searchtext + "\"");
+}
+
+

Maintenant, avec cette boîte d'alerte placée ici, nous saurons ce qui se produit quand nous cliquons sur le bouton « Rechercher ». Nous pouvons ajouter du code pour obtenir aussi ce qui est sélectionné dans les listes déroulantes.

+

Source Voir

+
+

Le DOM des éléments XUL

+

Chaque élément XUL possède un lot d'attributs, un lot de propriétés et un lot d'enfants.

+ +

Il est possible de manipuler dynamiquement les attributs, propriétés et enfants d'un élément en utilisant les méthodes du DOM.

+

Il est important de noter que les attributs et les propriétés sont deux choses différentes. Tout simplement car le fait qu'un attribut avec un nom donné existe ne signifie pas qu'il existe une propriété correspondante ayant le même nom. Pourtant, c'est souvent le cas. Par exemple, pour obtenir le flex d'un élément, vous pouvez utiliser la propriété flex. Dans ce cas, le code implicite retourne simplement la valeur de l'attribut. Pour d'autres propriétés, XUL accomplira des calculs plus complexes.

+

Vous pouvez manipuler les attributs d'un élément en utilisant l'une des méthodes suivantes :

+
getAttribute ( nomAttribut ) 
Renvoie la valeur de l'attribut 'nomAttribut'
hasAttribute ( nomAttribut ) 
Renvoie 'true' si l'attribut de nom 'nomAttribut' a une valeur
setAttribute ( nomAttribut , valeurAdonner ) 
Fixe la valeur de l'attribut 'nomAttribut' à la valeur 'valeurAdonner'
removeAttribute ( nomAttribut ) 
Supprime l'attribut 'nomAttribut'
+
+

Ces fonctions vous permettent d'obtenir ou de modifier la valeur d'un attribut à tout moment. Par exemple, pour utiliser la valeur de l'attribut flex, vous pourriez utiliser le code suivant :

+
 var box = document.getElementById('uneboite');
+ var flex = box.getAttribute("flex");
+
+ var box2 = document.getElementById('uneautreboite');
+ box2.setAttribute("flex", "2");
+
+

Pourtant, l'attribut flex a une propriété de script correspondante pouvant être utilisée à la place. Ce n'est pas plus efficace, mais c'est légèrement plus court à écrire. L'exemple suivant fait la même chose qu'au-dessus, en utilisant la propriété flex à la place :

+
 var box = document.getElementById('uneboite');
+ var flex = box.flex;
+
+ var box2 = document.getElementById('uneautreboite');
+ box2.flex = 2;
+
+

Une fois que vous avez une référence à un élément, vous pouvez appeler les propriétés de cet élément. Par exemple, pour obtenir la propriété hidden d'un élément, vous pouvez utiliser la syntaxe element.hidden où "element" est une référence à l'élément. Notez que la plupart des propriétés listées dans la référence est en corrélation avec les attributs communs des éléments. Il y a des différences, bien sûr, par exemple, alors que getAttribute("hidden") retournera la chaîne '"true"' pour un élément caché, la propriété hidden retournera une valeur 'true' booléenne. Dans ce cas, la conversion de type est faite pour vous, donc la propriété est plus commode.

+

Comme pour chaque document, l'objet "element" pour les éléments XUL n'est pas le même que pour des éléments HTML et XML. Chaque élément XUL implémente l'interface XULElement. Un élément XUL est un élément déclaré avec l'espace de nommage (namespace) XUL. Ainsi, les éléments XUL auront cette interface même s'ils sont ajoutés à d'autres documents XML, et les éléments non-XUL ne l'auront pas. L'interface XULElement possède un certain nombre de propriétés et méthodes spécifiques aux éléments XUL, pour beaucoup héritées de l'interface générique des éléments DOM.

+

Un espace de nommage est un URI qui spécifie le type d'élément. Voici quelques exemples :

+
<button xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"/>
+<button xmlns="http://www.w3.org/1999/xhtml"/>
+<html:button xmlns:html="http://www.w3.org/1999/xhtml"/>
+<html:button xmlns:html="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"/>
+
+

Les espaces de nommages sont spécifiés en utilisant l'attribut xmlns.

+ +

C'est une distinction importante. En fait, le texte utilisé pour le préfixe n'est pas significatif lorsqu'il détermine quel type d'élément est utilisé.

+

Le DOM fournit un certain nombre de fonctions relatives aux espaces de nommage, similaires aux fonctions de base. Par exemple, la fonction getAttributeNS() est similaire à la fonction getAttribute(), excepté un argument supplémentaire pouvant être fourni pour spécifier un attribut dans un espace de nommage spécifique.

+

Quelques éléments XUL disposent de leurs propres propriétés qui leurs sont spécifiques. Reportez-vous à la référence pour un guide complet des attributs et propriétés disponibles pour un élément.

+ +

Le DOM est une structure en arbre composé d'un unique nœud racine avec ses enfants. Vous pouvez obtenir une référence au nœud racine en utilisant la propriété documentElement du document. Le nœud racine est toujours un élément, mais ce n'est pas le cas pour tous les nœuds de l'arbre. Un élément correspond à une balise dans la source XUL, mais vous pouvez également trouver des nœuds de texte, des nœuds de commentaire et quelques autres types dans un arbre de document. Dans le cas de XUL, l'élément racine sera la balise window dans le document XUL. Chaque nœud de l'arbre peut avoir des enfants et ces enfants peuvent avoir des nœuds fils à leur tour. Comme le DOM est une structure en arbre, vous pouvez naviguer au sein de cet arbre en utilisant une grande variété de propriétés. Quelques méthodes, parmi les plus communes, sont listées ci-après :

+
firstChild 
Référence au premier nœud fils d'un élément
lastChild 
Référence au dernier nœud fils d'un élément
childNodes 
Contient la liste des enfants d'un élément
parentNode 
Référence au père d'un nœud
nextSibling 
Référence au prochain nœud de même niveau
previousSibling 
Référence au nœud précédent de même niveau
+
+

Ces propriétés vous permettent de naviguer de diverses manières au sein d'un document. Par exemple, vous pouvez obtenir un premier enfant d'un élément en utilisant la propriété firstChild et ensuite, naviguer au sein de tous ses enfants en utilisant la propriété nextSibling. Ou vous pourriez accomplir la même chose en parcourant les items du tableau childNodes listant tous les enfants. Dans Mozilla, la dernière façon est plus efficace.

+

L'exemple suivant montre comment parcourir tous les enfants du n½ud racine :

+
var childNodes = document.documentElement.childNodes;
+for (var i = 0; i < childNodes.length; i++) {
+  var child = childNodes[i];
+  // faire quelque chose avec child
+}
+
+

La variable 'childNodes' contiendra les enfants de l'élément racine du document. Nous pouvons donc utiliser une boucle for pour parcourir les enfants, en accédant à chaque item comme pour un tableau.

+
+

Dans la prochaine section, nous découvrirons comment modifier le DOM.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/donn\303\251es_persistantes/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/donn\303\251es_persistantes/index.html" new file mode 100644 index 0000000000..696401deaf --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/donn\303\251es_persistantes/index.html" @@ -0,0 +1,51 @@ +--- +title: Données persistantes +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Données_persistantes +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Persistent_Data +--- +

 

+
+

« PrécédentSuivant »

+
+

Cette section décrit comment sauvegarder l'état d'une fenêtre XUL.

+

Mémorisation d'un état

+

Lors de la création d'une application importante, il est fréquent de vouloir sauvegarder l'état d'une fenêtre tout au long des sessions. Par exemple, la fenêtre doit se souvenir quelles étaient les barres d'outils masquées après que l'utilisateur l'ait quitté.

+

Une possibilité serait d'écrire un script chargé de collecter l'information que vous voulez sauvegarder et de l'enregistrer dans un fichier. Toutefois, cette opération deviendrait pénible à chaque application. Heureusement, XUL propose un mécanisme pour sauvegarder les états d'une fenêtre.

+

L'information est collectée et stockée dans un fichier RDF (localstore.rdf) dans le même répertoire que les autres préférences de l'utilisateur. Ce fichier retient les états de chaque fenêtre. Cette méthode a l'avantage de fonctionner avec les profils utilisateurs de Mozilla, ainsi chaque utilisateur a ses propres paramètres.

+

XUL vous permet de sauvegarder l'état de n'importe quel élément. Typiquement, vous pouvez sauvegarder les états des barres d'outils, les positions des fenêtres et si certains panneaux sont affichés ou non, mais vous pouvez sauvegarder presque tout.

+

Attribut persist

+

Pour permettre la sauvegarde d'états, vous devez simplement ajouter l'attribut persist à l'élément qui contient la valeur que vous voulez sauvegarder. L'attribut persist doit être affecté par une liste d'éléments séparés par des espaces. L'élément concerné doit également avoir un attribut id pour permettre de l'identifier.

+

Par exemple, pour sauvegarder la position d'une fenêtre, vous devrez procéder comme ceci :

+
<window
+  id="someWindow"
+  width="200"
+  height="300"
+  persist="width height"
+  .
+  .
+  .
+
+

Les deux attributs de l'élément window, width et height, seront sauvegardés. Vous pourriez ajouter à l'attribut persist des attributs supplémentaires à mémoriser tout en les séparant par un espace. Vous pouvez ajouter l'attribut persist à n'importe quel élément et mémoriser n'importe quel attribut. Vous pouvez utiliser des valeurs inhabituelles si vous ajustez les attributs par un script.

+
+

Exemple de recherche de fichiers

+

Ajoutons un attribut persist à quelques éléments de notre boîte de dialogue de recherche de fichiers. Pour sauvegarder la position de la fenêtre, nous devons modifier l'élément window :

+
<window
+  id="findfile-window"
+  title="Recherche de fichiers"
+  persist="screenX screenY width height"
+  orient="horizontal"
+  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+

Cette modification va sauvegarder la position x et y de la fenêtre, sa largeur et sa hauteur. Nous poursuivrons plus tard la mémorisation de l'état du séparateur. La mémorisation de l'onglet sélectionné n'aurait aucun sens.

+

Exemple de recherche de fichiers : Source Voir

+
+
+

Dans la section suivante, nous verrons comment appliquer des feuilles de styles à des fichiers XUL.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/d\303\251tails_sur_le_mod\303\250le_de_bo\303\256te/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/d\303\251tails_sur_le_mod\303\250le_de_bo\303\256te/index.html" new file mode 100644 index 0000000000..974efe3272 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/d\303\251tails_sur_le_mod\303\250le_de_bo\303\256te/index.html" @@ -0,0 +1,92 @@ +--- +title: Détails sur le modèle de boîte +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Détails_sur_le_modèle_de_boîte +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Box_Model_Details +--- +

 

+
+

« PrécédentSuivant »

+
+

Nous avons déjà vu beaucoup de fonctionnalités sur le modèle de boîtes. Dans cette section, nous verrons quelques détails supplémentaires en nous appuyant sur des exemples.

+

Plus de détails sur la mise en page

+

Les propriétés de style comme min-width et max-height peuvent être appliquées à n'importe quels éléments. Nous les avons ajouté aux boutons et aux champs de saisie, mais nous pouvons aussi les ajouter aux éléments d'espacement ou aux boîtes. De même, l'attribut flex peut être appliqué à n'importe quel élément.

+

Exemple 1: Source Voir

+
<hbox flex="1">
+   <button label="Gauche" style="min-width: 100px;" flex="1"/>
+   <spacer flex="1"/>
+   <button label="Droite" style="min-width: 100px;" flex="1"/>
+</hbox>
+
+

Dans l'exemple ci-dessus, les trois éléments se redimensionnent eux-mêmes car il sont tous flexibles. Les deux boutons ont une largeur minimum de 100 pixels. Les deux boutons ne seront jamais plus petits que cette taille mais ils pourront toujours s'élargir. Ici, la fenêtre doit apparaître avec une largeur d'un peu plus de 200 pixels. C'est suffisant pour les deux boutons. Car si les trois éléments sont flexibles, ils ne nécessitent pas pour autant plus de place, la flexibilité n'ajoute pas d'espace supplémentaire.

+
Image:xultu_boxdet1.png
+

Comme il est montré dans l'image ci-dessus, il y a deux boutons qui s'étirent verticalement pour remplir leur élément conteneur, qui dans ce cas est le hbox. L'attribut align contrôle ce comportement sur une boîte horizontale. Vous pouvez aussi empêcher cet étirement en précisant une hauteur maximale sur l'élément ou mieux, sur la boîte elle-même. Si une boîte a une hauteur maximale, les éléments qu'elle contient sont limités en hauteur par celle-ci. Cependant, le problème est que vous devez connaître au préalable la taille d'un élément pour pouvoir le spécifier à la boîte.

+

Exemple 2: Source Voir

+
<hbox flex="1" align="top">
+   <button label="Gauche" style="min-width: 100px;" flex="1"/>
+   <spacer flex="1"/>
+   <button label="Droite" style="min-width: 100px;" flex="1"/>
+</hbox>
+
+

Résumé du modèle de boîte

+

Pour parfaire une mise en page complexe, vous devrez généralement ajouter des boîtes imbriquées, spécifier une taille minimale et maximale pour quelques éléments, et rendre certains éléments flexibles. La meilleure interface est celle qui peut être affichée sans problème dans différentes tailles. Le modèle de boîte peut être difficile à appréhender si vous n'essayez pas différentes choses par vous-même.

+

Voici une courte description des deux types de boîtes :

+

Boîtes horizontales

+
  1. Affichent chaque élément les uns à coté des autres horizontalement.
  2. Les éléments flexibles le sont horizontalement.
  3. Le groupement (NdT : attribut pack) contrôle le placement horizontal des éléments fils.
  4. L'alignement contrôle la manière dont les lignes d'éléments seront alignées verticalement.
    5. +
+

Boîtes verticales

+
  1. Affichent chaque élément verticalement en colonnes.
  2. Les éléments flexibles le sont verticalement.
  3. Le groupement contrôle le placement vertical des éléments fils.
  4. L'alignement contrôle la manière dont les colonnes d'éléments seront alignées horizontalement.
    5. +
+

Vous pouvez mettre des boîtes n'importe où dans un fichier XUL, même dans un élément HTML comme une table. Cependant, l'affichage sera en partie dépendant de l'élément HTML. Cela signifie que l'attribut flex risque de ne pas réagir exactement comme vous le voudriez. Rappelez-vous que la flexibilité n'a de sens que pour les éléments qui sont directement à l'intérieur d'une boîte, ou d'un élément qui est assimilé à une boîte.

+

Exemples de mise en page

+

1. Utiliser les spacers

+

Exemple 3: Source Voir

+
<hbox>
+   <button label="Un"/>
+   <spacer style="width: 5px"/>
+   <button label="Deux"/>
+</hbox>
+
+

Ici, un espacement est utilisé comme séparateur entre deux boutons, en précisant une largeur de 5 pixels. Vous pouvez aussi utiliser les marges de la propriété CSS margin.

+

2. Centrer des boutons

+

Exemple 4: Source Voir

+
<hbox pack="center" align="center" flex="1">
+   <button label="Regardez Moi!"/>
+   <button label="Cliquez Moi!"/>
+</hbox>
+
+

Cet exemple propose une boîte horizontale flexible contenant deux boutons. La boîte possède l'attribut pack qui est utilisé pour centrer les boutons horizontalement. L'attribut align, quant à lui, aligne verticalement les boutons. Le résultat est que les boutons seront centrés dans la boîte dans les deux directions. Cet exemple fonctionnera aussi avec une boîte verticale, sauf que le second bouton sera alors sous le premier, au lieu d'être à coté de lui.

+

3. Une fenêtre de recherche dans le texte

+

Exemple 5: Source Voir

+
<?xml version="1.0" encoding="iso-8859-1" ?>
+<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+
+<window id="findtext" title="Recherche dans un texte" orient="horizontal"
+        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+  <vbox flex="3">
+    <label control="t1" value="Mots clés :"/>
+    <textbox id="t1" style="min-width: 100px;" flex="1"/>
+  </vbox>
+
+  <vbox style="min-width: 150px;" flex="1" align="start">
+    <checkbox id="c1" label="Ignorer la casse"/>
+    <spacer flex="1" style="max-height: 30px;"/>
+    <button label="Rechercher"/>
+  </vbox>
+
+</window>
+
+
Image:xultu_boxdet-ex3.png
+

Ici, deux boîtes verticales sont créées, une pour le champ texte et l'autre pour la case à cocher et le bouton de recherche. La boîte de gauche a une flexibilité 3 fois plus grande que celle de droite donc elle prendra toujours 3 fois plus de place quand la taille de la fenêtre augmentera. La boîte de droite impose une largeur minimum de 150 pixels.

+

Le champ de saisie est flexible donc il s'ajustera à la taille de la fenêtre. Il impose aussi une largeur minimum de 100 pixels. La case à cocher apparaît dans la boîte de droite avec son libellé. Juste en dessous de la case à cocher, il y a un spacer (espacement). L'espacement s'agrandira ou se rétrécira mais n'excédera pas 30 pixels. Le résultat est que la case à cocher et le bouton de recherche seront séparés par un espace qui ne fera pas plus de 30 pixels.

+

La seconde boîte a un alignement de valeur 'start'. Les trois éléments fils seront par conséquent alignés sur le bord gauche. Si l'alignement n'était pas précisé, sa valeur par défaut serait 'stretch', ce qui aurait pour effet de positionner les éléments fils les uns à coté des autres horizontalement. Puisque nous ne voulons pas que le bouton de recherche change de taille, nous devons préciser un alignement.

+
+

Dans la prochaine section, nous allons en apprendre un peu plus sur un type de boîte plus spécifique, le groupe de boîte.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/d\303\251tails_sur_les_vues_d'arbres/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/d\303\251tails_sur_les_vues_d'arbres/index.html" new file mode 100644 index 0000000000..d9257abad2 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/d\303\251tails_sur_les_vues_d'arbres/index.html" @@ -0,0 +1,298 @@ +--- +title: Détails sur les vues d'arbres +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Détails_sur_les_vues_d'arbres +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Tree_View_Details +--- +

 

+
+

« PrécédentSuivant »

+
+

Cette section décrit quelques fonctionnalités supplémentaires des vues d'arbre.

+

Création d'une vue hiérarchique personnalisée

+

Dans la section précédente, nous avons créé une vue d'arbre simple qui était implémentée avec un minimum de fonctionnalités. À présent, regardons quelques fonctions supplémentaires que les vues peuvent implémenter. Ici, nous examinerons comment créer un ensemble hiérarchique d'items utilisant la vue. C'est un processus relativement astucieux qui implique de conserver une trace des items qui sont des enfants et une trace de l'état des lignes, ouvertes ou fermées.

+

Imbrication de niveaux

+

Chaque ligne dans l'arbre possède un niveau d'imbrication. Les lignes les plus hautes ont un niveau 0, les enfants de ces lignes ont un niveau 1, leurs enfants le niveau 2 et ainsi de suite. L'arbre interroge la vue pour chaque ligne en appelant sa méthode getLevel() pour connaître le niveau de cette ligne. La vue devra retourner 0 pour les premiers parents et des valeurs plus élevées pour les lignes intérieures. L'arbre utilisera cette information pour déterminer la structure hiérarchique de ces lignes.

+

En complément de la méthode getLevel(), la fonction hasNextSibling() retourne pour une ligne donnée la valeur 'true' si elle est suivie d'une autre ligne de même niveau qu'elle. Cette fonction est spécifiquement utilisée pour dessiner l'imbrication des lignes sur le côté de la vue de l'arbre.

+

La méthode getParentIndex() est supposée retourner la ligne parente d'une ligne donnée, c'est-à-dire : la ligne précédente qui a un niveau d'imbrication inférieur. Toutes ces méthodes doivent être implémentées par la vue pour que les enfants soient manipulés correctement.

+

Conteneurs

+

Trois autres fonctions, isContainer, isContainerEmpty et isContainerOpen sont utilisées pour manipuler un item parent dans l'arbre.

+ +

Notez que l'arbre n'appellera ni isContainerEmpty, ni isContainerOpen pour les lignes qui ne sont pas conteneurs en se basant sur la valeur de retour de la méthode isContainer.

+

Un conteneur peut être affiché différemment d'un non-conteneur. Par exemple, un conteneur peut avoir un icône de dossier devant lui. Une feuille de styles peut être utilisée pour personnaliser l'aspect des items en se basant sur diverses propriétés telles que l'ouverture d'une ligne conteneur. La stylisation sera décrite dans une prochaine section. Un conteneur non vide sera agrémenté d'une poignée (NdT&nbsp;: "twisty", petit '+' ou '-' ou un triangle sur les Macintosh) permettant à l'utilisateur d'ouvrir ou de fermer la ligne pour voir les items enfants. Les conteneurs vides n'auront pas de poignées, mais seront toujours considérés comme des conteneurs.

+

Lorsque l'utilisateur clique sur la poignée pour ouvrir une ligne, l'arbre appellera la méthode toggleOpenState(). La vue met alors en œuvre les opérations nécessaires pour intégrer les lignes enfants et mettre à jour l'arbre avec les nouvelles lignes.

+

Résumé des méthodes

+

Voici un récapitulatif des méthodes nécessaires pour implémenter des vues hiérarchiques :

+
getLevel(ligne)
+hasNextSibling(ligne, apresIndex)
+getParentIndex(ligne)
+isContainer(ligne)
+isContainerEmpty(ligne)
+isContainerOpen(ligne)
+toggleOpenClose(ligne)
+
+

L'argument apresIndex de la fonction hasNextSibling est utilisée pour une raison d'optimisation, afin de démarrer la recherche à partir de la prochaine ligne sœur (ligne de même niveau d'imbrication). Par exemple, l'appelant pourrait déjà connaître la position de la prochaine ligne sœur. Imaginez une situation où une ligne possède des sous-lignes et que ces sous-lignes aient des lignes enfants dont quelques-unes sont ouvertes. Dans ce cas, la détermination de l'index de la prochaine ligne sœur prendrait du temps dans certaines implémentations.

+

Exemple d'une vue personnalisée hiérarchique

+

Voyons tous ces points dans un exemple simple qui construit un arbre à partir d'un tableau. Cet arbre ne supporte qu'un niveau parent avec un seul niveau enfant, mais il est possible de l'étendre facilement avec d'autres niveaux. Nous l'examinerons portion par portion.

+
<window onload="init();"
+        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+<tree id="elementList" flex="1">
+  <treecols>
+    <treecol id="element" label="Élément" primary="true" flex="1"/>
+  </treecols>
+  <treechildren/>
+</tree>
+
+</window>
+
+

Nous utilisons un arbre simple qui ne contient pas de données dans treechildren. La fonction init est appelée au chargement de la fenêtre pour initialiser l'arbre. Elle définit simplement la vue personnalisée en récupérant l'arbre et en définissant sa propriété view. Nous définirons treeView plus tard.

+
function init() {
+  document.getElementById("elementList").view = treeView;
+}
+
+

La vue d'arbre personnalisée aura besoin d'implémenter un certain nombre de méthodes dont les plus importantes seront examinées individuellement. Cet arbre supporte un seul niveau de parenté avec un niveau enfant interne, mais il peut être étendu pour intégrer sans trop d'effort des niveaux supplémentaires. Tout d'abord, nous définirons deux structures pour conserver les données de l'arbre, la première contiendra une carte relationnelle entre les parents et leurs éventuels enfants, et la seconde contiendra un tableau des lignes visibles. Souvenez-vous qu'une vue doit conserver elle-même une trace des lignes visibles.

+
var treeView = {
+  childData : {
+    Solids: ["Argent", "Or", "Plomb"],
+    Liquids: ["Mercure"],
+    Gases: ["Hélium", "Azote"]
+  },
+
+  visibleData : [
+    ["Solides", true, false],
+    ["Liquides", true, false],
+    ["Gaz", true, false]
+  ],
+
+

La structure childData contient un tableau des enfants pour chacun des trois nœuds parents. Le tableau visibleData commence avec seulement trois items visibles, les trois items de haut niveau. Des items seront ajoutés et supprimés depuis ce tableau quand les items sont ouverts ou fermés. Le principe est le suivant : lorsqu'une ligne parente est ouverte, ses enfants sont récupérés depuis la carte childData et insérés dans le tableau visibleData. Par exemple, si la ligne 'Liquides' est ouverte, son enfant unique dans le tableau childData, l'enfant 'Mercure', sera inséré dans le tableau visibleData après 'Liquides' mais avant 'Gaz'. La taille du tableau sera incrémentée de un. Les deux valeurs booléennes présentes dans chaque ligne dans la structure visibleData indiquent respectivement si une ligne est un conteneur et si elle est ouverte. Évidemment, le nouvel enfant inséré aura ces deux valeurs initialisées à 'false'.

+

Implémentation de l'interface de vue d'arbre

+

Ensuite, nous avons besoin d'implémenter l'interface de vue de l'arbre. Tout d'abord, les fonctions simples :

+
  treeBox: null,
+  selection: null,
+
+  get rowCount()                     { return this.visibleData.length; },
+  setTree: function(treeBox)         { this.treeBox = treeBox; },
+  getCellText: function(idx, column) { return this.visibleData[idx][0]; },
+  isContainer: function(idx)         { return this.visibleData[idx][1]; },
+  isContainerOpen: function(idx)     { return this.visibleData[idx][2]; },
+  isContainerEmpty: function(idx)    { return false; },
+  isSeparator: function(idx)         { return false; },
+  isSorted: function()               { return false; },
+  isEditable: function(idx, column)  { return false; },
+
+

La fonction rowCount retournera la taille du tableau visibleData. Notez qu'elle devrait retourner le nombre courant de lignes visibles, pas le nombre total de lignes. Donc, au début, seulement trois items sont visibles et la valeur retournée par rowCount devrait être trois, même si six lignes sont cachées.

+

La fonction setTree sera appelée pour définir l'objet boîte de l'arbre. L'objet boîte de l'arbre est un type spécialisé d'objet boîte propre aux arbres qui sera examiné en détail dans la prochaine section. Il est utilisé pour aider à la représentation graphique de l'arbre. Dans cet exemple, nous avons seulement besoin d'une fonction de l'objet boîte capable de redessiner l'arbre quand des items sont ajoutés ou supprimés.

+

Les fonctions getCellText, isContainer et isContainerOpen retournent juste l'élément correspondant dans le tableau visibleData. Enfin, les fonctions restantes peuvent retourner 'false' puisque nous n'avons pas besoin de leurs fonctionnalités. Si nous avions eu des lignes parents sans enfant, nous aurions implémenté la fonction isContainerEmpty pour quelle retourne 'true' pour ces éléments.

+
  getParentIndex: function(idx) {
+    if (this.isContainer(idx)) return -1;
+    for (var t = idx - 1; t >= 0 ; t--) {
+      if (this.isContainer(t)) return t;
+    }
+  },
+
+

La fonction getParentIndex sera nécessaire pour retourner l'index du parent d'un item donné. Dans notre exemple simple, il y a seulement deux niveaux d'imbrication, donc nous savons que les conteneurs n'ont pas de parents, la valeur '-1' est retournée pour ces items. Dans le cas contraire, nous devons parcourir les lignes en arrière pour rechercher celle qui est un conteneur. Ensuite, la fonction getLevel.

+
  getLevel: function(idx) {
+    if (this.isContainer(idx)) return 0;
+    return 1;
+  },
+
+

La fonction getLevel est simple. Elle retourne juste '0' pour une ligne conteneur et '1' pour une ligne non-conteneur. Si nous voulions ajouter un niveau d'imbrication supplémentaire, ces lignes enfants auraient un niveau de '2'.

+
  hasNextSibling: function(idx, after) {
+    var thisLevel = this.getLevel(idx);
+    for (var t = idx + 1; t < this.visibleData.length; t++) {
+      var nextLevel = this.getLevel(t)
+      if (nextLevel == thisLevel) return true;
+      else if (nextLevel < thisLevel) return false;
+    }
+  },
+
+

La fonction hasNextSibling doit retourner 'true' quand une ligne donnée est suivie d'une ligne de même niveau (une sœur). Le code ci-dessus utilise une méthode basique qui consiste à parcourir les lignes après celle donnée, en retournant 'true' si une ligne de même niveau est trouvée et 'false' si une ligne de niveau inférieur est rencontrée. Dans cet exemple simple, cette méthode est bonne, mais un arbre avec davantage de données aura besoin d'utiliser une méthode optimisée pour déterminer s'il existe une ligne suivante sœur.

+

Ouverture ou fermeture d'une ligne

+

La dernière fonction est toggleOpenState. C'est la plus complexe. Elle a besoin de modifier le tableau visibleData lorsqu'une ligne est ouverte ou fermée.

+
  toggleOpenState: function(idx) {
+    var item = this.visibleData[idx];
+    if (!item[1]) return;
+
+    if (item[2]) {
+      item[2] = false;
+
+      var thisLevel = this.getLevel(idx);
+      var deletecount = 0;
+      for (var t = idx + 1; t < this.visibleData.length; t++) {
+        if (this.getLevel(t) > thisLevel) deletecount++;
+        else break;
+      }
+      if (deletecount) {
+        this.visibleData.splice(idx + 1, deletecount);
+        this.treeBox.rowCountChanged(idx + 1, -deletecount);
+      }
+    }
+    else {
+      item[2] = true;
+
+      var label = this.visibleData[idx][0];
+      var toinsert = this.childData[label];
+      for (var i = 0; i < toinsert.length; i++) {
+        this.visibleData.splice(idx + i + 1, 0, [toinsert[i], false]);
+      }
+      this.treeBox.rowCountChanged(idx + 1, toinsert.length);
+    }
+  },
+
+

D'abord nous vérifions si la ligne est un conteneur. Si elle ne l'est pas, la fonction retourne juste que les non-conteneurs ne peuvent pas être ouverts ou fermés. Comme le troisième élément du tableau (celui avec l'index 2) indique si une ligne est ouverte ou fermée, nous utilisons deux blocs de code, le premier pour fermer une ligne et le second pour ouvrir une ligne. Examinons chaque bloc de code, mais en commençant par le second, chargé d'ouvrir une ligne.

+
      item[2] = true;
+
+      var label = this.visibleData[idx][0];
+      var toinsert = this.childData[label];
+      for (var i = 0; i < toinsert.length; i++) {
+        this.visibleData.splice(idx + i + 1, 0, [toinsert[i], false]);
+      }
+      this.treeBox.rowCountChanged(idx + 1, toinsert.length);
+
+

La première ligne de code définit la ligne item comme étant ouverte dans le tableau, ainsi le prochain appel de la fonction toggleOpenState saura qu'elle doit fermer la ligne. Ensuite, regardons les données pour la ligne dans la carte childData. Le résultat est que la variable 'toinsert' sera définie avec un des tableaux enfants, par exemple '["Argent", "Or", "Plomb"]' si la ligne 'Solides' est celle qu'on demande d'ouvrir. Ensuite, nous utilisons la fonction de tableau splice pour insérer une nouvelle ligne pour chaque item. Pour 'Solides', trois items seront insérés.

+

Enfin, la fonction de boîte d'arbre rowCountChanged a besoin d'être appelée. Rappelez-vous que l'objet treeBox est un objet de boîte d'arbre qui a été défini plus tôt par un appel de la fonction setTree. L'objet de boîte d'arbre sera créé par l'arbre pour vous et vous pourrez appeler ses fonctions. Dans ce cas, nous utilisons la fonction rowCountChanged pour informer l'arbre que quelques lignes de données ont été ajoutées. L'arbre redessinera son contenu avec pour résultat que les lignes enfants apparaîtront à l'intérieur du conteneur. Les autres fonctions implémentées ci-dessus, telles que getLevel et isContainer, sont utilisées par l'arbre pour déterminer son affichage.

+

La fonction rowCountChanged prend deux arguments, l'index de la ligne où doit se faire l'insertion et le nombre de lignes à insérer. Dans le code ci-dessus nous indiquons que la ligne de départ est la valeur de 'idx' + 1, elle sera la première ligne enfant sous le parent. L'arbre utilisera cette information et ajoutera l'espace nécessaire pour le nombre approprié de lignes en poussant les lignes suivantes vers le bas. Assurez-vous de fournir le nombre correct, ou l'arbre pourrait se redessiner incorrectement ou essayer de dessiner plus de lignes que nécessaire.

+

Le code suivant est utilisé pour supprimer des lignes quand une ligne est fermée.

+
      item[2] = false;
+
+      var thisLevel = this.getLevel(idx);
+      var deletecount = 0;
+      for (var t = idx + 1; t < this.visibleData.length; t++) {
+        if (this.getLevel(t) > thisLevel) deletecount++;
+        else break;
+      }
+      if (deletecount) {
+        this.visibleData.splice(idx + 1, deletecount);
+        this.treeBox.rowCountChanged(idx + 1, -deletecount);
+      }
+
+

Premièrement, l'item est déclaré fermé dans le tableau. Ensuite, nous scannons les lignes suivantes jusqu'à ce que nous atteignions une ligne de même niveau. Toutes celles qui ont un niveau supérieur auront besoin d'être supprimées, mais une ligne de même niveau sera le prochain conteneur qui ne devra pas être supprimé.

+

Enfin, nous utilisons la fonction splice pour supprimer les lignes du tableau visibleData et appelons la fonction rowCountChanged pour redessiner l'arbre. Lors de la suppression des lignes, vous aurez besoin de fournir un chiffre négatif correspondant au nombre de lignes à supprimer.

+

Exemple en entier

+

Il existe plusieurs autres fonctions de vue pouvant être implémentées mais nous n'en avons pas l'utilité dans cet exemple, donc nous créons des fonctions qui ne font rien ici. Elles sont placées à la fin de notre exemple complet :

+
<?xml version="1.0" encoding="iso-8859-1?>
+<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+
+<window onload="init();"
+        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+<tree id="elementList" flex="1">
+  <treecols>
+    <treecol id="element" label="Élément" primary="true" flex="1"/>
+  </treecols>
+  <treechildren/>
+</tree>
+
+<script>
+<![CDATA[
+
+var treeView = {
+  childData : {
+    Solids: ["Argent", "Or", "Plomb"],
+    Liquids: ["Mercure"],
+    Gases: ["Hélium", "Azote"]
+  },
+
+  visibleData : [
+    ["Solides", true, false],
+    ["Liquides", true, false],
+    ["Gaz", true, false]
+  ],
+
+  treeBox: null,
+  selection: null,
+
+  get rowCount()                     { return this.visibleData.length; },
+  setTree: function(treeBox)         { this.treeBox = treeBox; },
+  getCellText: function(idx, column) { return this.visibleData[idx][0]; },
+  isContainer: function(idx)         { return this.visibleData[idx][1]; },
+  isContainerOpen: function(idx)     { return this.visibleData[idx][2]; },
+  isContainerEmpty: function(idx)    { return false; },
+  isSeparator: function(idx)         { return false; },
+  isSorted: function()               { return false; },
+  isEditable: function(idx, column)  { return false; },
+
+  getParentIndex: function(idx) {
+    if (this.isContainer(idx)) return -1;
+    for (var t = idx - 1; t >= 0 ; t--) {
+      if (this.isContainer(t)) return t;
+    }
+  },
+  getLevel: function(idx) {
+    if (this.isContainer(idx)) return 0;
+    return 1;
+  },
+  hasNextSibling: function(idx, after) {
+    var thisLevel = this.getLevel(idx);
+    for (var t = idx + 1; t < this.visibleData.length; t++) {
+      var nextLevel = this.getLevel(t)
+      if (nextLevel == thisLevel) return true;
+      else if (nextLevel < thisLevel) return false;
+    }
+  },
+  toggleOpenState: function(idx) {
+    var item = this.visibleData[idx];
+    if (!item[1]) return;
+
+    if (item[2]) {
+      item[2] = false;
+
+      var thisLevel = this.getLevel(idx);
+      var deletecount = 0;
+      for (var t = idx + 1; t < this.visibleData.length; t++) {
+        if (this.getLevel(t) > thisLevel) deletecount++;
+        else break;
+      }
+      if (deletecount) {
+        this.visibleData.splice(idx + 1, deletecount);
+        this.treeBox.rowCountChanged(idx + 1, -deletecount);
+      }
+    }
+    else {
+      item[2] = true;
+
+      var label = this.visibleData[idx][0];
+      var toinsert = this.childData[label];
+      for (var i = 0; i < toinsert.length; i++) {
+        this.visibleData.splice(idx + i + 1, 0, [toinsert[i], false]);
+      }
+      this.treeBox.rowCountChanged(idx + 1, toinsert.length);
+    }
+  },
+
+  getImageSrc: function(idx, column) {},
+  getProgressMode : function(idx,column) {},
+  getCellValue: function(idx, column) {},
+  cycleHeader: function(col, elem) {},
+  selectionChanged: function() {},
+  cycleCell: function(idx, column) {},
+  performAction: function(action) {},
+  performActionOnCell: function(action, index, column) {},
+  getRowProperties: function(idx, column, prop) {},
+  getCellProperties: function(idx, column, prop) {},
+  getColumnProperties: function(column, element, prop) {},
+};
+
+function init() {
+  document.getElementById("elementList").view = treeView;
+}
+
+]]></script>
+
+</window>
+
+
+

Ensuite, nous verrons plus en détails l'objet de boîte d'arbre.

+
+

« PrécédentSuivant »

+
+

Interwiki

+

 

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/exemple_xbl/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/exemple_xbl/index.html new file mode 100644 index 0000000000..b8b61c00ae --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/exemple_xbl/index.html @@ -0,0 +1,205 @@ +--- +title: Exemple XBL +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Exemple_XBL +tags: + - Tutoriel_XUL + - Tutoriels + - XBL + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/XBL_Example +--- +
+

« PrécédentSuivant »

+
+ +

Cette section va décrire un exemple d'élément XBL.

+ +

Un élément de diaporama

+ +

Construisons un exemple complet d'un élément XBL. Il s'agira de créer un élément graphique qui stocke un paquet d'objets, en les affichant un par un. Des boutons de navigation situés sur le bas permettront à l'utilisateur d'afficher les objets les uns aprés les autres tandis qu'un élément graphique textuel entre les boutons affichera le numéro de la page courante. Vous pourriez mettre n'importe quoi dans les pages, cependant, cet élément graphique pourrait être utile pour afficher une série d'images. Nous l'appellerons élément de diaporama.

+ +

Contenu du diaporama

+ +

Tout d'abord, déterminons quels sont les éléments qui ont besoin d'aller dans le contenu XBL. Puisque nous voulons un changement de page, un élément deck sera le plus approprié pour contenir les pages. Le contenu des pages sera spécifié dans le fichier XUL, et non dans XBL, mais nous aurons besoin de l'ajouter au sein du paquet (deck). La balise children devra être utilisée. En bas, nous aurons besoin d'un bouton pour aller à la page précédente, d'un élément graphique pour afficher la numéro de la page courante, et d'un bouton pour aller à la page suivante.

+ +

Exemple 1 : Source

+ +
<binding id="slideshow">
+  <content>
+    <xul:vbox flex="1">
+      <xul:deck xbl:inherits="selectedIndex" selectedIndex="0" flex="1">
+        <children/>
+      </xul:deck>
+      <xul:hbox>
+        <xul:button xbl:inherits="label=previoustext"/>
+        <xul:label flex="1"/>
+        <xul:button xbl:inherits="label=nexttext"/>
+      </xul:hbox>
+    </xul:vbox>
+  </content>
+</binding>
+
+ +

Cette liaison crée la stucture de la présentation que nous souhaitons. L'attribut flex a été ajouté à plusieurs éléments pour qu'ils s'étendent de la bonne manière. Les attributs label sur les deux boutons héritent des valeurs de l'élément qui leur est attaché. Ici, ils héritent de deux attributs personnalisés, previoustext et nexttext. Ils rendent le changement des libellés des boutons simple. Les fils de l'élément auquel l'élément XBL est relié seront placés au sein de l'élément deck. L'attribut selectedIndex est hérité par le paquet, ainsi nous pouvons déclarer la page initiale dans XUL.

+ +

Le fichier XUL suivant produit le résultat affiché dans l'image.

+ +
<box class="slideshow" previoustext="Précédent" nexttext="Suivant" flex="1">
+  <button label="Bouton 1"/>
+  <checkbox label="Case à cocher 2"/>
+  <textbox/>
+</box>
+
+ +

Le style CSS utilisé ici est :

+ +
.slideshow {
+  -moz-binding: url("slideshow.xml#slideshow");
+}
+
+ +
Image:xultu_xblex1.jpg
+ +

Le premier bouton, 'Bouton 1' a été utilisé comme première page du paquet. L'élément graphique label n'est pas apparu puisqu'aucun attribut value ne lui a été spécifié. Nous pourrions déclarer une valeur, mais elle sera plutôt calculée plus tard.

+ +

Propriété page

+ +

Ensuite, une propriété contenant le numéro de la page courante est ajoutée. Pour lire cette propriété personnalisée, il est nécessaire de rechercher la valeur de l'attribut selectedIndex du paquet qui contient le numéro de la page affichée. De même, lorsqu'on modifiera cette propriété, il sera nécessaire de changer l'attribut selectedIndex du paquet. De plus, l'élément graphique textuel devra être mis à jour pour afficher le numéro de la page courante.

+ +
<property name="page"
+    onget="return parseInt(document.getAnonymousNodes(this)[0].childNodes[0].getAttribute('selectedIndex'));"
+    onset="this.setPage(val);"/>
+
+ +

La propriété page obtient sa valeur en observant le premier élément du tableau anonyme. Elle renvoie la boîte verticale, donc, pour obtenir le paquet, nous devons obtenir le premier nœud fils de la boîte. Le tableau anonyme n'est pas utilisé puisque le paquet n'est pas anonyme à partir de la boîte. Finalement, la valeur de l'attribut selectedIndex est récupérée. Pour spécifier la page, une méthode setPage qui sera définie plus tard est appelée.

+ +

Un gestionnaire oncommand devra être ajouté aux boutons 'Précédent' et 'Suivant' pour que la page soit changée lorsque les boutons sont pressés. Nous pouvons changer facilement la page en utilisant la propriété personnalisée page qui vient d'être ajoutée :

+ +
<xul:button xbl:inherits="label=previoustext"
+               oncommand="parentNode.parentNode.parentNode.page--;"/>
+<xul:description flex="1"/>
+<xul:button xbl:inherits="label=nexttext"
+               oncommand="parentNode.parentNode.parentNode.page++;"/>
+
+ +

Étant donné que la propriété page est dans l'élément XUL externe, nous devons utiliser la propriété parentNode pour l'obtenir. La première propriété parentNode retourne l'élément parent du bouton qui est la boîte horizontale, la seconde son parent, la boîte verticale, et la dernière son parent qui est la boîte externe. La propriété page est incrémentée ou décrémentée. Elle va appeler le script onget pour obtenir la valeur, incrémentera ou décrémentera la valeur, et enfin appellera le gestionnaire onset pour enregistrer la valeur.

+ +

Méthode setPage

+ +

Définissons à présent la méthode setPage. Elle prendra un paramètre, le numéro de page qui sert à spécifier la page. Il sera nécessaire de vérifier que le numéro de page n'est pas en dehors des limites et ensuite modifier les attributs selectedIndex du paquet et l'attribut label de l'élément graphique textuel.

+ +
<method name="setPage">
+  <parameter name="newidx"/>
+  <body>
+    <![CDATA[
+      var thedeck=document.getAnonymousNodes(this)[0].childNodes[0];
+      var totalpages=this.childNodes.length;
+
+      if (newidx<0) return 0;
+      if (newidx>=totalpages) return totalpages;
+      thedeck.setAttribute("selectedIndex",newidx);
+      document.getAnonymousNodes(this)[0].childNodes[1].childNodes[1]
+              .setAttribute("value",(newidx+1)+" of "+totalpages);
+      return newidx;
+    ]]>
+  </body>
+</method>
+
+ +

Cette fonction est appelée setPage et prend un paramètre newidx. Le corps de la méthode a été encapsulé entre '<![CDATA[' et ']]>'. C'est le mécanisme général dans tous les fichiers XML qui peut être utilisé pour échapper tout le texte à l'intérieur. De cette manière, vous n'avez pas besoin d'échapper tous les signes "inférieur" et "supérieur" à l'intérieur.

+ +

Décomposons le code morceau par morceau.

+ +
+
var thedeck=document.getAnonymousNodes(this)[0].childNodes[0];
+
Récupère le premier élément du tableau de contenu anonyme qui sera la boîte verticale, puis obtient son premier fils qui sera le paquet deck.
+
var totalpages=this.childNodes.length;
+
Récupère le nombre de fils que détient la boîte qui est liée. Cela donnera le nombre total de pages qui s'y trouve.
+
if (newidx<0) return 0;
+
Si le nouvel index est avant la première page, ne pas changer la page et retourner '0'. La page ne devrait pas donner une valeur plus petite que la première page.
+
if (newidx>=totalpages) return totalpages;
+
Si le nouvel index est après la dernière page, ne pas changer la page et retourner le dernier index de page. La page ne devrait pas devenir celle qui est après la dernière.
+
thedeck.setAttribute("selectedIndex",newidx);
+
Changer l'attribut selectedIndex du paquet. Cela entraîne l'affichage de la page demandée.
+
document.getAnonymousNodes(this)[0].childNodes[1].childNodes[1].setAttribute("value", (newidx+1)+" sur "+totalpages);
+
Cette ligne modifie l'élément label pour qu'il affiche l'index de la page courante. L'élément label peut être récupéré en obtenant le premier élément du contenu anonyme (la boîte verticale), le second fils de cet élément (la boîte horizontale), et enfin le second élément de cette boîte. L'attribut value est modifié pour indiquer '1 sur 3' ou quelque chose de similaire. Notez que l'index est incrémenté de un parce que les indices commence à '0'.
+
+ +

Constructeur

+ +

Nous allons aussi avoir besoin d'un constructeur pour initialiser l'élément label afin qu'il s'affiche correctement la première fois que la présentation est affichée. Nous utilisons un code similaire à la méthode ci-dessus pour déclarer le numéro de page. La référence à 'this.page' va appeler le script onget de la propriété page qui à son tour va recupérer la page initiale à partir de l'attribut selectedIndex.

+ +
<constructor>
+  var totalpages=this.childNodes.length;
+  document.getAnonymousNodes(this)[0].childNodes[1].childNodes[1]
+          .setAttribute("value",(this.page+1)+" of "+totalpages);
+</constructor>
+
+ +

Fonctionnalités supplémentaires

+ +

Nous pouvons aussi ajouter quelques caractéristiques supplémentaires. Certains raccourcis claviers peuvent être utilisés pour les boutons 'Précédent' et 'Suivant', (disons l'effacement arrière et la touche Entrée). Des boutons 'Premier' et 'Dernier' peuvent être ajoutés pour aller à la première et à la dernière page. L'élément label pourrait être transformé en un champ de saisie où l'utilisateur pourrait entrer la page à afficher, ou une fenêtre surgissante pourrait être ajoutée pour permettre la sélection de la page à partir d'un menu. Nous pourrions aussi ajouter une bordure autour de la boîte avec un style CSS pour la rendre plus jolie.

+ +

Le code final

+ +

Le code final est le suivant :

+ +

Exemple 2 : Source

+ +
<binding id="slideshow">
+  <content>
+    <xul:vbox flex="1">
+      <xul:deck xbl:inherits="selectedIndex" selectedIndex="0" flex="1">
+        <children/>
+      </xul:deck>
+      <xul:hbox>
+        <xul:button xbl:inherits="label=previoustext"
+                    oncommand="parentNode.parentNode.parentNode.page--;"/>
+        <xul:description flex="1"/>
+        <xul:button xbl:inherits="label=nexttext"
+                    oncommand="parentNode.parentNode.parentNode.page++;"/>
+      </xul:hbox>
+    </xul:vbox>
+  </content>
+
+  <implementation>
+
+    <constructor>
+      var totalpages=this.childNodes.length;
+      document.getAnonymousNodes(this)[0].childNodes[1].childNodes[1]
+              .setAttribute("value",(this.page+1)+" sur "+totalpages);
+    </constructor>
+
+    <property name="page"
+          onget="return parseInt(document.getAnonymousNodes(this)[0].childNodes[0].getAttribute('selectedIndex'));"
+          onset="this.setPage(val);"/>
+
+    <method name="setPage">
+      <parameter name="newidx"/>
+      <body>
+        <![CDATA[
+          var thedeck=document.getAnonymousNodes(this)[0].childNodes[0];
+          var totalpages=this.childNodes.length;
+
+          if (newidx<0) return 0;
+          if (newidx>=totalpages) return totalpages;
+          thedeck.setAttribute("selectedIndex",newidx);
+          document.getAnonymousNodes(this)[0].childNodes[1].childNodes[1]
+                  .setAttribute("value",(newidx+1)+" sur "+totalpages);
+          return newidx;
+        ]]>
+      </body>
+    </method>
+  </implementation>
+
+</binding>
+
+ +
+

Nous allons voir ensuite quelques propriétés additionnelles d'une fenêtre.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/exemples_xpcom/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/exemples_xpcom/index.html new file mode 100644 index 0000000000..50bd44eb6e --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/exemples_xpcom/index.html @@ -0,0 +1,157 @@ +--- +title: Exemples XPCOM +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Exemples_XPCOM +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/XPCOM_Examples +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Cette section donne quelques exemples d'utilisation de la technologie XPCOM avec de nouvelles interfaces.

+ +

Gestion de Fenêtres

+ +
Cet exemple contient une source de données RDF qui sera décrite dans une prochaine section. Vous devriez passer cet exemple pour l'instant, à moins d'en savoir suffisamment sur le sujet.
+ +

Création d'un menu de fenêtre

+ +

La liste des fenêtres Mozilla ouvertes peut être utilisée comme une source de données RDF. Elle vous permet de créer dans votre application un menu donnant la liste des fenêtres courantes ouvertes. La source de données correspondante est 'rdf:window-mediator' dont voici un exemple d'utilisation :

+ +

Exemple 1 : Source

+ +
<toolbox>
+ <menubar id="windowlist-menubar">
+  <menu label="Fenêtres">
+   <menupopup id="window-menu" datasources="rdf:window-mediator" ref="NC:WindowMediatorRoot">
+    <template>
+     <rule>
+      <menuitem uri="rdf:*" label="rdf:http://home.netscape.com/NC-rdf#Name"/>
+     </rule>
+    </template>
+   </menupopup>
+  </menu>
+ </menubar>
+</toolbox>
+
+ +

Un menu contenant la liste de toutes les fenêtres ouvertes sera créé. Essayez cet exemple en ouvrant plusieurs fenêtres, et vous les verrez toutes dans le menu.

+ +

Composant mediator

+ +

Cet exemple peut être amélioré de telle façon que lorsque l'on clique sur un élément du menu, la fenêtre correspondante soit affichée. Cette tâche sera rendue possible grâce au composant "window mediator" qui implémente l'interface nsIWindowDataSource. Le code suivant montre comment il fonctionne :

+ +
var wmdata = Components.classes["@mozilla.org/rdf/datasource;1?name=window-mediator"].getService();
+wmdata.QueryInterface(Components.interfaces.nsIWindowDataSource);
+
+ +

Ce code récupère le composant "window mediator". Le composant utilisé ici est le même que celui qui gère la source de données RDF "Window-mediator". Vous pouvez également récupérer ce composant au travers du service RDF qui est un autre service de gestion des sources de données RDF.

+ +

L'interface nsIWindowDataSource possède une fonction getWindowForResource qui nous donne une fenêtre à partir d'une ressource. Dans un exemple précédent, nous avons généré une liste de fenêtres que nous avons ajoutée à un menu via une balise template. Celle-ci génère un attribut id pour chaque élément menuitem. La valeur de cet attribut peut être utilisée comme ressource. Ainsi pour donner le focus à la fenêtre sélectionnée, nous pouvons procéder de la manière suivante :

+ +
    +
  1. Déterminer l'élément que l'utilisateur a sélectionné.
    2. +
  2. Récupérer la valeur de l'attribut id de cet élément.
    3. +
  3. Passer cette valeur à getWindowForResource() pour avoir l'objet "window".
    4. +
  4. Mettre le focus sur celle-ci.
    5. +
+ +

L'exemple ci-dessous nous montre comment procéder :

+ +
<toolbox>
+ <menubar id="windowlist-menubar">
+  <menu label="Fenêtre" oncommand="switchFocus(event.target);">
+   <menupopup id="window-menu" datasources="rdf:window-mediator" ref="NC:WindowMediatorRoot">
+    <template>
+     <rule>
+      <menuitem uri="rdf:*" label="rdf:http://home.netscape.com/NC-rdf#Name"/>
+     </rule>
+    </template>
+   </menupopup>
+  </menu>
+ </menubar>
+</toolbox>
+
+<script>
+function switchFocus(elem)
+{
+  var mediator = Components.classes["@mozilla.org/rdf/datasource;1?name=window-mediator"].getService();
+  mediator.QueryInterface(Components.interfaces.nsIWindowDataSource);
+
+  var resource = elem.getAttribute('id');
+  switchwindow = mediator.getWindowForResource(resource);
+
+  if (switchwindow){
+    switchwindow.focus();
+  }
+}
+</script>
+
+ +

Un gestionnaire de commande a été ajouté à l'élément menu. Ce gestionnaire appelle la fonction switchFocus() avec comme paramètre l'élément du menu que nous avons sélectionné. La fonction switchFocus() :

+ + + +

Cookies

+ +

Maintenant, nous allons récupérer la liste des cookies sauvegardés par le navigateur. Nous allons utiliser le service "Cookie" qui implémente l'interface nsICookieManager utilisée pour énumérer tous les cookies. Voici un exemple qui alimente la liste d'un menu avec le nom de tous les cookies provenant du site MozillaZine.

+ +
<script>
+
+function getCookies()
+{
+  var menu = document.getElementById("cookieMenu");
+  menu.removeAllItems();
+
+  var cookieManager = Components.classes["@mozilla.org/cookiemanager;1"]
+                        .getService(Components.interfaces.nsICookieManager);
+
+  var iter = cookieManager.enumerator;
+  while (iter.hasMoreElements()){
+    var cookie = iter.getNext();
+    if (cookie instanceof Components.interfaces.nsICookie){
+      if (cookie.host == "www.mozillazine.org")
+        menu.appendItem(cookie.name,cookie.value);
+    }
+  }
+}
+</script>
+
+<hbox>
+  <menulist id="cookieMenu" onpopupshowing="getCookies();"/>
+</hbox>
+
+ +

La fonction getCookies() sera appelée à chaque ouverture du menu, comme indiqué par l'attribut onpopupshowing de l'élément menulist. Les deux premières lignes de getCookies() récupèrent l'élément menulist et suppriment tous les items existants. En effet comme cette fonction est appelée à chaque fois que nous l'ouvrons, nous ne voulons pas garder les anciens éléments.

+ +

Ensuite, le gestionnaire de cookie est récupéré. Celui-ci a une méthode qui renvoie un objet énumérateur implémentant nsISimpleEnumerator. Il nous permet de parcourir tous les cookies. Un énumérateur dispose d'une méthode hasMoreElements() retournant 'true' jusqu'à ce que le dernier cookie soit récupéré. La méthode getNext() renvoie un cookie et incrémente l'index de l'énumérateur. Comme l'énumérateur ne renvoie qu'un objet générique, nous devons lui indiquer que nous voulons utiliser l'interface nsICookie. Dans ce cas, l'opérateur instanceof permet d'accomplir cette vérification.

+ +

Finalement, un élément est ajouté au menu pour chaque cookie ( NdT : dont le site hôte est "www.mozillazine.org"). Les propriétés hôte, nom et valeur du cookie sont alors utilisées. Les menus ont une fonction appendItem() qui ajoute un élément avec un libellé et une valeur.

+ +

Voir aussi

+ +

D'autres exemples sont disponibles ici :

+ + + +
+

Dans la section suivante, nous allons voir comment utiliser le presse papier.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/focus_et_selection/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/focus_et_selection/index.html new file mode 100644 index 0000000000..84e67cec8b --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/focus_et_selection/index.html @@ -0,0 +1,122 @@ +--- +title: Focus et Selection +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Focus_et_Selection +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Focus_and_Selection +--- +

 

+
+

« PrécédentSuivant »

+
+

Cette section va décrire comment manipuler le focus et la sélection des éléments.

+

Éléments focalisés

+

L'élément focalisé est l'élément qui reçoit les événements entrants. S'il y a trois champs de saisie sur une fenêtre, celui qui détient le focus est celui dans lequel l'utilisateur peut taper du texte. Un seul élément à la fois peut détenir le focus.

+

L'utilisateur peut changer le focus en cliquant sur un élément avec la souris ou en appuyant sur la touche Tab (tabulation). Lorsque la touche tabulation est appuyée, le focus passe à l'élément suivant. Pour revenir en arrière, il suffit d'appuyer sur les touches Maj (shift) et Tab simultanément.

+

Réarrangement de l'ordre des tabulations

+

Vous pouvez changer l'ordre dans lequel les éléments seront focalisés quand l'utilisateur appuiera sur la touche Tab en ajoutant un attribut tabindex à un élément. Cet attribut doit être renseigné avec un nombre. Lorsque l'utilisateur appuiera sur la touche Tab, le focus sera donné à l'élément ayant l'index de tabulation consécutif le plus haut. Cela implique que vous pouvez ordonner les éléments en définissant des indices pour séquencer les éléments. Toutefois, vous n'aurez normalement pas à définir l'attribut tabindex. Dans ce cas, un appui sur la touche tabulation donnera le focus à l'élément suivant affiché. Vous avez seulement besoin de définir des indices de tabulation si vous voulez utiliser un ordre différent. Voici un exemple :

+

Exemple 1 : Source Voir

+
<button label="Bouton 1" tabindex="2"/>
+<button label="Bouton 2" tabindex="1"/>
+<button label="Bouton 3" tabindex="3"/>
+
+

L'événement focus

+

L'événement 'focus' est utilisé pour réagir lorsqu'un élément obtient le focus. L'événement 'blur' est utilisé pour réagir lorsqu'un un élément perd le focus. Vous pouvez réagir aux changements de focus en ajoutant un attribut onfocus ou onblur à un élément. Ils fonctionnent de la même façon que leurs homologues HTML. Vous pouvez utiliser ces événements pour mettre un élément en surbrillance ou afficher un texte dans la barre d'état. L'exemple suivant peut s'appliquer à une fonction de gestion des événements de focus.

+

Exemple 2: Source Voir

+
<script>
+
+function displayFocus(){
+  var elem=document.getElementById('sbar');
+  elem.setAttribute('value','Entrez votre numéro de téléphone.');
+}
+
+</script>
+
+<textbox id="tbox1"/>
+<textbox id="tbox2" onfocus="displayFocus();"/>
+<description id="sbar" value=""/>
+
+

Quand l'événement 'focus' est déclenché, il va appeler la fonction displayFocus. Cette fonction va changer la valeur du libellé texte. Nous pourrions développer cet exemple pour effacer le texte quand l'événement 'blur' a lieu. Généralement, vous utiliserez les événements focus et blur pour mettre à jour certaines parties de votre interface, quand l'utilisateur sélectionne des éléments. Par exemple, vous pouvez mettre à jour un total quand l'utilisateur entre des valeurs dans d'autres champs, ou utiliser les événements de focus pour vérifier certaines valeurs. N'affichez pas de messages d'alerte pendant un événement focus ou blur, car ils pourraient distraire l'utilisateur et ils dégradent le design de l'interface.

+

Vous pouvez aussi ajouter dynamiquement des gestionnaires d'événements en utilisant la fonction DOM addEventListener. Vous pouvez l'utiliser pour n'importe quel élément et type d'événement. Elle prend trois paramètres : le type d'événement, une fonction à exécuter quand l'événement est produit et un booléen indiquant la phase de capture de l'événement.

+

Obtention de l'élément actuellement focalisé

+

L'élément ayant le focus est pris en charge par un objet appelé « répartiteur de commandes », dont il ne peut y avoir qu'une instance par fenêtre. Le répartiteur de commandes garde la trace de l'objet qui a le focus pendant que l'utilisateur se sert de l'interface. Le répartiteur de commandes a d'autres rôles, qui seront abordés plus tard dans la section des commandes. Pour le moment, nous allons nous intéresser à quelques fonctions relatives au focus du répartiteur de commandes.

+

Vous pouvez récupérer le répartiteur de commandes d'une fenêtre en utilisant la propriété commandDispatcher du document. À partir de là, vous pouvez obtenir l'élément focalisé avec la propriété focusedElement du répartiteur. L'exemple ci-dessous illustre ce cas.

+

Exemple 3: Source Voir

+
<window id="focus-example" title="Exemple Focus"
+        onload="init();"
+        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+<script>
+function init(){
+  addEventListener("focus",setFocusedElement,true);
+}
+
+function setFocusedElement(){
+  var focused = document.commandDispatcher.focusedElement;
+  document.getElementById("focused").value = focused.tagName;
+}
+</script>
+
+<hbox>
+  <label control="username" value="Nom d'utilisateur:"/>
+  <textbox id="username"/>
+</hbox>
+
+<button label="Bonjour"/>
+<checkbox label="Se souvenir de ce choix"/>
+
+<label id="focused" value="-pas de focus-"/>
+
+</window>
+
+

Dans cet exemple, un gestionnaire d'événement de focus est attaché à la fenêtre. Nous voulons utiliser un gestionnaire de capture d'événements, donc la méthode addEventListener doit être utilisée. Elle associe un gestionnaire de capture d'événements à la fenêtre qui appellera la méthode setFocusedElement. Cette méthode récupère l'élément focalisé depuis le répartiteur de commandes et modifie un libellé avec le nom de sa balise. Quand l'élément focalisé change, le libellé montre le nom de l'élément.

+

Plusieurs choses sont à noter :

+ +

Rendre un libellé focalisable

+

Si vous créez des éléments personnalisés, vous pouvez décider si un élément peut prendre le focus ou non. Il vous suffit d'utiliser la propriété de style spéciale -moz-user-focus. Cette propriété détermine si un élément peut être focalisé ou non. Par exemple, vous pouvez rendre un libellé focalisable, comme dans l'exemple ci-dessous.

+

Exemple 4: Source Voir

+
<label id="focused" style="-moz-user-focus: normal;"
+      onkeypress="alert('Étiquette focalisée');" value="Focalise moi"/>
+
+

La propriété de style est réglée à 'normal'. Vous pouvez aussi la définir à 'ignore' pour désactiver le focus pour un élément. Toutefois, elle ne doit pas être utilisée pour désactiver un élément ; l'attribut ou la propriété disabled doit être utilisée dans ce cas, car elle a été conçue pour. Dans l'exemple, une fois le libellé focalisé, il peut réagir aux événements du clavier. Évidemment, le libellé ne donne aucune indication sur son focus, car il n'est normalement pas prévue pour cet usage.

+

Changer le focus

+

Il existe plusieurs façons de changer d'élément focalisé. La plus simple est d'appeler la méthode focus de l'élément XUL que vous voulez focaliser. La méthode blur peut être employée afin d'enlever le focus d'un élément. L'exemple suivant met en pratique ces principes :

+

Exemple 5: Source Voir

+
<textbox id="addr"/>
+
+<button label="Focus" oncommand="document.getElementById('addr').focus()"/>
+
+

Vous pouvez aussi utiliser les méthodes advanceFocus et rewindFocus du répartiteur de commandes. Ces méthodes changent le focus respectivement vers l'élément suivant ou précédent de la séquence de tabulation. Elles correspondent aux actions réalisées lorsque l'utilisateur appuie sur Tab ou Maj+Tab.

+

Pour les champs de saisie, un attribut spécial, focused est ajouté quand l'élément obtient le focus. Vous pouvez vérifier la présence de cet attribut pour déterminer si l'élément a le focus, soit depuis un script, soit depuis une feuille de styles. Il aura la valeur 'true' si le champ de saisie a le focus, et le cas échéant, l'attribut ne sera pas présent.

+

Supposons que vous souhaitez déplacer le focus vers le prochain emplacement connu par le navigateur. pour y arriver, un utilisateur va typiquement appuyer sur la touche Tab. Vous pouvez faire la même chose dès lors que vous disposez d'un document de navigation XUL en faisant :

+
   document.commandDispatcher.advanceFocus();
+
+

En fait, l'objet commandDispatcher implémente simplement l'interface nsIDOMXULCommandDispatcher. D'autres fonctions peuvent également vous intéressez si vous manipulez des focus.

+

Comportements spécifiques de plate-forme

+
Mac OS X 
Il existe une préférence appelée « Full Keyboard Access » (FKA - Accès au clavier complet). XUL respecte ce mécasnisme. Cela signifie que si la préférence FKA est sur 'off', seuls les champs de saisie, les listes et les arbres peuvent recevoir le focus au clavier, ainsi que vos scripts utilisant focus().
+
+

Gestion des modifications de texte

+

Deux événements peuvent être utilisés lorsque l'utilisateur modifie la le contenu d'un champ de saisie. Naturellement, ces événements seront uniquement transmis au champ de saisie ayant le focus.

+ +

Sélection de texte

+

Lorsque vous travaillez avec un champ de saisie, vous pouvez récupérer uniquement le texte que l'utilisateur a sélectionné. Ou alors vous pouvez changer la sélection.

+

Les champs de saisie XUL offrent la possibilité de récupérer et de modifier une sélection. La plus simple et de sélectionner tout le texte du champ. Cela implique l'utilisation de la méthode select du champ de saisie.

+
tbox.select();
+

Toutefois, vous pouvez aussi sélectionner seulement une partie du texte. Il vous suffit d'utiliser la fonction setSelectionRange. Elle prend deux paramètres, le premier représente le caractère de départ et le second le caractère suivant le dernier que vous voulez sélectionner. Les valeurs commencent à zéro, donc le premier caractère est indicé à '0', le second à '1' et ainsi de suite.

+
tbox.setSelectionRange(4,8);
+

Cet exemple va sélectionner le cinquième caractère affiché, ainsi que le sixième, le septième et le huitième. S'il n'y avait que six caractères présents dans le champ, seuls le cinquième et le sixième auraient été sélectionnés. Aucune erreur ne serait signalée.

+

Si vous utilisez la même valeur pour les deux paramètres, le début et la fin de la sélection changent pour la même position. Le résultat revient à changer la position du curseur dans le champ de saisie. Par exemple, la ligne ci-dessous peut être utilisée pour ramener le curseur au début du texte.

+
tbox.setSelectionRange(0,0);
+

Vous pouvez récupérer la sélection en cours en utilisant les propriétés selectionStart et selectionEnd. Ces propriétés définissent respectivement le début et la fin de la sélection. Si les deux sont définies à la même valeur, aucun texte n'est sélectionné, mais les valeurs représentent la position du curseur. Une fois que vous avez les valeurs de début et de fin, vous pouvez récupérer la section de chaîne du texte.

+

Vous pouvez récupérer et modifier le contenu du champ de saisie en utilisant la propriété value.

+

Une autre propriété utile des champs de saisie est la propriété textLength qui contient le nombre total de caractères dans le champ.

+
+

Dans la prochaine section, nous découvrirons comment utiliser les commandes.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/fonctions_additionnelles_d'installation/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/fonctions_additionnelles_d'installation/index.html new file mode 100644 index 0000000000..693b2faeca --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/fonctions_additionnelles_d'installation/index.html @@ -0,0 +1,72 @@ +--- +title: Fonctions additionnelles d'installation +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Fonctions_additionnelles_d'installation +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Additional_Install_Features +--- +

 

+ +
+

« Précédent

+
+ +
NdT : Attention, cette section décrit le mécanisme XPInstall propre à la suite Mozilla et à des versions anciennes de Mozilla Firefox. Pour les versions récentes de Mozilla Firefox, ce mode d'installation n'est plus le même, mais il n'est pas encore décrit dans ce tutoriel. Voir comment faire des extensions pour firefox sur xulfr.org.
+ +

Cette section décrit quelques spécificités supplémentaires des programmes d'installation.

+ +

Manipulation de fichiers lors de l'installation

+ +

La section précédente décrivait un programme d'installation simple. Vous pouvez souhaiter réaliser quelques opérations plus élaborées pendant l'installation. Par exemple, vous voulez installer un paquetage seulement si certaines conditions sont réunies, comme d'avoir une librairie particulière installée.

+ +

En complément de l'objet Install, l'objet File est également disponible pendant le script d'installation. Il fournit quelques fonctions qui peuvent être employées pour examiner et modifier des fichiers sur le disque. Vous pouvez les utiliser pour déplacer, copier ou effacer des fichiers avant ou après que les fichiers du paquetage soient installés. Par exemple, vous voulez peut être faire une sauvegarde de quelques fichiers d'abord.

+ +

Le code ci dessous fera une copie du fichier "/bin/grep" dans le répertoire "/main".

+ +
var binFolder=getFolder("file:///","bin");
+var grep=getFolder(binFolder,"grep");
+
+var mainFolder=getFolder("file:///","main");
+
+File.copy(grep,mainFolder);
+
+ + + +

Des fonctions existent également pour déplacer (move()), renommer (rename()) et exécuter (execute()) des fichiers. Ainsi, vous pouvez déplacer des fichiers qui peuvent se trouver en conflit avec votre paquetage.

+ +

Interception des erreurs

+ +

Vous voulez certainement intercepter d'éventuelles erreurs proprement. Elles peuvent se produire si un fichier ou un répertoire ne peut pas être trouvé, si la capacité du disque n'est pas suffisant ou pour toutes autres raisons.

+ +

Il vous suffit d'appeler la fonction getLastError() pour déterminer si une erreur a été rencontrée. Si elle renvoie 'SUCCESS', aucune erreur ne s'est produite. Autrement, elle renvoie un nombre qui indique le code d'erreur. Vous pouvez appeler cette fonction en tout point de votre script d'installation pour déterminer si une erreur est survenue lors de la dernière opération effectuée.

+ +

Si une erreur se produit, vous voulez sûrement interrompre l'installation. Vous pouvez également vouloir afficher un message d'erreur pour l'utilisateur. Par exemple, vous pourriez mettre le script suivant à la fin de votre script d'installation :

+ +
if (getLastError() == SUCCESS){
+  performInstall();
+}
+else {
+  cancelInstall();
+}
+
+ +

Les codes d'erreurs susceptibles d'être renvoyés par la fonction getLastError() sont listés dans le fichier source de Mozilla nsInstall.h. Pendant l'installation, un suivi d'événements contenant les opérations réalisées est créé. Il contiendra également toutes les erreurs qui se sont produites. Ces événements peuvent être trouvés dans le fichier 'install.log' dans le répertoire d'installation de Mozilla. Un bloc de texte sera ajouté à ce fichier à chaque installation effectuée.

+ +

La fonction logComment() peut être utilisée pour écrire un texte dans ce fichier d'événements. Elle nécessite un seul argument qui est le contenu du texte.

+ +
+

Le Tutoriel XUL est terminé.

+ +
+

« Précédent

+
+ +

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/gabarits/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/gabarits/index.html new file mode 100644 index 0000000000..72a5b71bbc --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/gabarits/index.html @@ -0,0 +1,205 @@ +--- +title: Gabarits +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Gabarits +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Templates +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Dans cette section, nous allons voir comment peupler des éléments avec des données.

+ +

Peuplement des éléments

+ +

XUL apporte une méthode permettant de créer des éléments à partir de données fournies par RDF, que ce soit à partir d'un fichier RDF ou à partir d'une source de données interne. Plusieurs sources de données sont déjà fournies avec Mozilla comme les marque-pages, l'historique et les messages mails. Plus de détails seront donnés dans une prochaine section.

+ +

Habituellement, les éléments tels que les treeitem et menuitem seront peuplés avec des données. Cependant, vous pouvez utiliser d'autres éléments si vous le voulez, bien qu'ils soient utilisés pour des cas spécifiques. Néanmoins nous commencerons avec ces autres éléments parce que les arbres et menus nécessitent plus de code.

+ +

Pour permettre la création d'éléments basés sur des données RDF, vous avez besoin de fournir un gabarit simple (Ndt : template) qui sera dupliqué pour chaque élément devant être créé. En gros, vous fournissez juste le premier élément et les suivants seront construits sur le même modèle.

+ +

Le gabarit est créé en utilisant l'élément template. À l'intérieur de celui-ci, vous pouvez placer les éléments que vous voulez utiliser pour chaque élément construit. L'élément template doit être placé à l'intérieur du conteneur qui contiendra les éléments construits. Par exemple, si vous utilisez un arbre tree, vous devez placer l'élément template à l'intérieur de l'élément tree.

+ +

Exemple simple de gabarit

+ +

C'est mieux d'expliquer avec un exemple. Prenons un exemple simple où nous voulons créer un bouton pour chaque marque-page principal. Mozilla fournit une source de données pour les marque-pages, pouvant être ainsi utilisée pour récupérer les données. Cet exemple ne récupérera que les marque-pages principaux (ou les dossiers des marque-pages) car nous allons créer des boutons. Pour les marque-pages fils, nous devrions utiliser un élément qui affiche une hiérarchie tel qu'un arbre ou un menu.

+ +
Cet exemple et tous les autres qui font référence à des sources de données RDF interne, et ils ne fonctionneront que si vous les chargez à partir d'une url chrome. Pour des raisons de sécurité, Mozilla ne permet pas d'y accéder à partir de fichiers extérieurs.
+ +

Pour voir cet exemple, vous devrez créer un paquet chrome contenant le fichier à charger (vous pouvez le faire facilement, consultez les fichiers manifest). Vous pouvez alors entrer l'URL chrome dans le champ de saisie des URLs du navigateur.

+ +

Exemple 1 : Source

+ +
<vbox datasources="rdf:bookmarks" ref="NC:BookmarksRoot" flex="1">
+  <template>
+    <button uri="rdf:*" label="rdf:http://home.netscape.com/NC-rdf#Name"/>
+  </template>
+</vbox>
+
+ +
Image:xultu_templates1.jpg
+ +

Ici une boîte verticale a été créée contenant une colonne de boutons, un pour chaque marque-page principal. Vous pouvez voir que le template ne contient qu'un seul button. Cet unique bouton est utilisé comme modèle pour tout les autres boutons qu'il sera nécessaire de créer. Vous pouvez voir sur l'image qu'un ensemble de boutons a été créé, un pour chaque marque-page.

+ +

Essayez d'ajouter un marque-page dans le navigateur pendant que vous avez cet exemple ouvert dans une fenêtre. Vous noterez que les boutons seront mis à jour instantanément (Vous devez donner le focus à la fenêtre pour voir le changement).

+ +

Conteneurs et sources de données

+ +

Le gabarit lui-même est placé à l'intérieur d'une boîte verticale. La boîte a deux attributs qui lui permet d'être utilisée pour les gabarits, indiquant d'où les données proviennent. Le premier attribut de la boîte est datasources. Il est utilisé pour déclarer la source de données RDF qui fournira les données pour créer les éléments. Dans le cas présent, 'rdf:bookmarks' est indiqué. Vous devinez probablement qu'il signifie qu'il faut utiliser la source de données des marque-pages. Cette source de données est fournie par Mozilla. Pour utiliser votre propre source de données, spécifiez l'URL d'un fichier RDF dans l'attribut datasources, comme le montre l'exemple suivant :

+ +
<box datasources="chrome://zoo/content/animals.rdf"
+     ref="http://www.some-fictitious-zoo.com/all-animals">
+
+ +

Vous pouvez spécifier plusieurs sources de données à la fois, en les séparant avec un espace dans la valeur de l'attribut. Ainsi, l'affichage de données provenant de multiples sources est possible.

+ +

L'attribut ref indique l'endroit dans la source de données à partir duquel vous voulez récupérer les données. Dans le cas des marque-pages, la valeur 'NC:BookmarksRoot' est utilisée pour indiquer la racine de la hiérarchie des marque-pages. Les autres valeurs que vous pouvez indiquer dépendront de la source de données que vous utiliserez. Si vous utilisez votre propre fichier RDF, la valeur correspondra à la valeur d'un attribut about d'un élément RDF Bag, Seq ou Alt.

+ +

À l'intérieur d'un gabarit

+ +

En ajoutant ces deux attributs à la boîte du dessus, vous permettez la génération d'éléments en utilisant le gabarit. Cependant, les éléments à l'intérieur du gabarit nécessite une déclaration différente. Vous noterez dans l'exemple du dessus que le bouton a un attribut uri et a une valeur inhabituelle pour l'attribut label.

+ +

Un attribut à l'intérieur d'un gabarit qui commence par 'rdf:' indique que la valeur doit être prise à partir de la source de données. Dans l'exemple plus haut, c'est le cas de l'attribut label. Le reste de la valeur réfère au nom de la propriété dans la source de données. Elle est construite en prenant l'URL de l'espace de nom utilisé par la source de données et en y ajoutant le nom de la propriété. Ici, nous utilisons seulement le nom du marque-page mais d'autres champs sont disponibles.

+ +

L'attribut label des boutons est renseigné avec cet URI spécial parce que nous voulons que les libellés des boutons aient le nom des marque-pages. Nous pouvons mettre cet URI sur n'importe quel attribut de l'élément button, ou n'importe quel élément. Les valeurs de ces attributs sont remplacées par les données fournies par la source de données qui, ici, sont les marque-pages. Pour finir, les libellés des boutons sont définis par les noms des marque-pages.

+ +

L'exemple du dessous montre comment nous pourrions assigner d'autres attributs d'un bouton à partir de la source de données. Bien sûr, cela implique que la source de données fournisse les ressources appropriées. Si une ressource particulière est inexistante, la valeur de l'attribut sera une chaîne vide.

+ +
<button class="rdf:http://www.example.com/rdf#class"
+        uri="rdf:*"
+        label="rdf:http://www.example.com/rdf#name"
+        crop="rdf:http://www.example.com/rdf#crop"/>
+
+ +

Comme vous pouvez le voir, vous pouvez générer dynamiquement une liste d'éléments avec les attributs fournis par une source de données séparée.

+ +

L'attribut uri est utilisé pour spécifier l'élément où la génération du contenu commencera. Le contenu extérieur ne sera généré qu'une seule fois, tandis que le contenu intérieur sera généré pour chaque ressource. Nous en verrons plus à ce propos quand nous créerons des gabarits pour les arbres.

+ +

Plus d'exemples

+ +

En ajoutant ces fonctionnalités au conteneur dans lequel est le gabarit, qui dans ce cas est une boîte, et aux éléments à l'intérieur du gabarit, nous pouvons générer de multiples listes de contenu à partir de données externes. Nous pouvons bien sûr mettre plus d'un élément à l'intérieur du gabarit, et ajouter une référence RDF spéciale dans les attributs sur n'importe quel élément. L'exemple suivant le montre :

+ +

Exemple 2 : Source

+ +
<vbox datasources="rdf:bookmarks" ref="NC:BookmarksRoot" flex="1">
+  <template>
+    <vbox uri="rdf:*">
+      <button label="rdf:http://home.netscape.com/NC-rdf#Name"/>
+      <label value="rdf:http://home.netscape.com/NC-rdf#URL"/>
+    </vbox>
+  </template>
+</vbox>
+
+ +

Cet exemple crée une boîte verticale avec un bouton et un libellé pour chaque marque-page. Le bouton contiendra le nom du marque-page et le libellé contiendra l'URL.

+ +

Les nouveaux éléments qui sont créés ne sont fonctionnellement pas différents de ceux que vous mettez directement dans le fichier XUL. L'attribut id est ajouté à tous les éléments créés au travers du gabarit, et il est assigné à la valeur qui identifie la ressource. Vous pouvez l'utiliser pour identifier la ressource.

+ +

Vous pouvez aussi spécifier de multiples ressources dans le même attribut en les séparant avec un espace, comme dans l'exemple qui suit (en savoir plus sur la syntaxe des ressources).

+ +

Exemple 3 : Source

+ +
<vbox datasources="rdf:bookmarks" ref="NC:BookmarksRoot"
+     flex="1">
+  <template>
+    <label uri="rdf:*" value="rdf:http://home.netscape.com/NC-rdf#Name rdf:http://home.netscape.com/NC-rdf#URL"/>
+  </template>
+</vbox>
+
+ +

Comment sont construits les gabarits

+ +

Quand un élément a un attribut datasources, cela indique que l'élément est susceptible d'être généré à partir d'un gabarit. Notez que ce n'est pas la balise template qui détermine si le contenu sera généré, mais bien l'attribut datasources. Quand cet attribut est présent, un objet que l'on appelle un constructeur est ajouté à l'élément. C'est cet objet qui est responsable de la génération du contenu à partir du gabarit. En javascript, vous pouvez accéder à l'objet constructeur par la propriété builder, bien qu'habituellement vous en aurez seulement besoin pour régénérer le contenu dans les situations où il ne le fait pas automatiquement.

+ +

Il y a deux différents types de constructeur. Le premier est un constructeur de contenu utilisé dans la plupart des situations, et l'autre est un constructeur d'arbres utilisé uniquement avec les éléments tree.

+ +

Constructeur de contenu

+ +

Le constructeur de contenu prend le contenu situé à l'intérieur de l'élément template et le duplique pour chaque ligne. Par exemple, si l'utilisateur a dix marque-pages dans l'exemple du dessus, dix éléments label seront créés et ajoutés en tant que fils à l'élément vbox. Si vous utilisez les fonctions DOM pour traverser l'arbre, vous trouverez ces éléments à ces emplacements et pourrez récupérer leurs propriétés. Ces éléments sont affichés, mais pas l'élément template, bien qu'il existe encore dans l'arbre du document. De plus, l'attribut id de chaque libellé sera initialisé avec la ressource RDF de la ligne correspondante.

+ +

Le constructeur de contenu démarre toujours à partir de l'élément qui à l'attribut uri="rdf:*". Si l'attribut uri est placé à l'intérieur d'autres éléments, ces derniers ne seront créés qu'une seule fois. Dans l'exemple ci-dessous, un hbox sera créé et rempli avec un label pour chaque item.

+ +
<template>
+  <hbox>
+    <label uri="rdf:*" value="rdf:http://home.netscape.com/NC-rdf#Name"/>
+  </hbox>
+</template>
+
+ +

S'il y a du contenu à l'intérieur de l'élément qui a l'attribut datasources mais en dehors de l'élément template, ce contenu apparaîtra également. Ce faisant, vous pouvez mélanger du contenu statique et dynamique dans un gabarit.

+ +

Constructeur d'arbres

+ +

Le constructeur d'arbres, d'autre part, ne génère pas d'éléments DOM pour chaque ligne. À la place, il récupère les données directement à partir de la source de données RDF quand il en a besoin. Comme les arbres ont souvent besoins d'afficher des centaines de lignes de données, c'est plus efficace comme ceci. Créer un élément pour chaque cellule serait trop coûteux. Cependant, en contre partie, ces arbres ne peuvent afficher que du texte (NdT : ainsi que des images et des cases à cocher), et comme aucun élément n'est créé, vous ne pouvez pas utiliser les propriétés CSS de manière habituelle pour décorer les cellules de l'arbre.

+ +

Le constructeur d'arbres est utilisé seulement pour les arbres. Les autres éléments n'utilisent que le constructeur de contenu. Ceci n'est pas un problème étant donné que les autres éléments comme les menus n'ont généralement pas besoin d'afficher beaucoup d'items. Il est possible également d'utiliser le constructeur de contenu pour les arbres, ainsi un élément treeitem et d'autres seront crées pour chaque ligne.

+ +

Règles

+ +

Dans l'image du précédent exemple, vous avez pu noter que le troisième bouton est simplement un bouton avec des tirets comme libellé. C'est un séparateur dans la liste des marque-pages. Au cas où nous l'utiliserions, la source de données RDF des marque-pages stocke les séparateurs comme si ils étaient des marque-pages normaux. Ce que nous voulons faire est d'ajouter un petit espace à la place d'un bouton pour les ressources "séparateur". Ce qui signifie que nous voulons avoir deux différents types de contenu à créer, un type pour les marque-pages normaux, et un autre type pour les séparateurs.

+ +

Nous pouvons le faire en utilisant un élément rule. Nous définissons une règle pour chaque variation des éléments que nous avons à créer. Dans notre cas, nous aurons besoin d'une règle pour les marque-pages, et une règle pour les séparateurs. Les attributs placés sur l'élément rule déterminent quelle règle s'applique sur quelle ressource RDF.

+ +

Pour savoir quelle règle s'applique sur les données, chaque élément rule est analysé en séquence pour une vérification de concordance. De fait, l'ordre dans lequel vous définissez les règles est important. Les règles du début ont priorité sur les règles suivantes.

+ +

Exemple de règles

+ +

L'exemple suivant modifie l'exemple précédant avec deux règles.

+ +

Exemple 4 : Source

+ +
<window
+  id="example-window"
+  title="Liste des marque-pages"
+  xmlns:html="http://www.w3.org/1999/xhtml"
+  xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+ <vbox datasources="rdf:bookmarks" ref="NC:BookmarksRoot" flex="1">
+   <template>
+
+    <rule rdf:type="http://home.netscape.com/NC-rdf#BookmarkSeparator">
+     <spacer uri="rdf:*" height="16"/>
+    </rule>
+
+    <rule>
+      <button uri="rdf:*" label="rdf:http://home.netscape.com/NC-rdf#Name"/>
+    </rule>
+
+  </template>
+ </vbox>
+
+</window>
+
+ +
Image:xultu_templates2.jpg
+ +

En utilisant deux règles, nous permettont au contenu du gabarit d'être généré sélectivement. Dans le premier rule, les séparateurs de marque-pages sont sélectionnés, comme nous pouvons le voir par l'attribut rdf:type. Le second rule n'ayant aucun attribut, il sélectionne tout le reste.

+ +

Tous les attributs placés dans l'élément rule, sont utilisés comme critère de sélection. Dans notre cas, la source de données des marque-pages fournit une propriété rdf:type pour distinguer les séparateurs. Cet attribut contient une valeur spéciale pour les séparateurs dans la source de données RDF. C'est ainsi qu'on peut les distinguer des marque-pages. Vous pouvez utiliser une technique similaire pour n'importe quel attribut que l'on peut mettre sur un élément RDF Description.

+ +

La valeur spéciale d'URL donnée dans l'exemple du dessus pour la première règle, est utilisée pour les séparateurs. Elle signifie que les séparateurs s'appliqueront à la première règle en générant un élément spacer d'une hauteur de 16 pixels. Les éléments qui ne sont pas des séparateurs ne correspondront pas à la première règle, et atterriront dans la deuxième règle. Celle-ci n'a aucun attribut. Elle correspond à n'importe quelle donnée. Ce qui bien sûr, est ce que nous voulons pour le reste des données.

+ +

Vous avez dû noter que, parce que nous voulons un attribut provenant de l'espace de nommage du RDF (rdf:type), nous avions besoin d'ajouter la déclaration de cet espace de nommage dans la balise window. Si nous n'avions pas fait cela, l'attribut serait attribué à l'espace de nommage XUL. Parce qu'il n'existe pas dans cet espace, la règle ne s'appliquerait pas. Si nous utilisons des attributs provenant de notre propre espace de nommage, vous devez ajouter la déclaration de votre espace de nommage pour qu'ils soient reconnus.

+ +

Vous devez deviner ce qui arriverait si la seconde règle était enlevée. Le résultat serait alors un simple spacer, sans aucun marque-page puisqu'ils ne correspondent à aucune règle.

+ +

Dit plus simplement, une règle correspond si tous les attributs placés dans l'élément rule correspondent aux attributs de la ressource RDF. Dans le cas d'un fichier RDF, les ressources seraient les éléments Description.

+ +

Il y a cependant quelques petites exceptions. Vous ne pouvez pas faire la correspondance avec les attributs XULAttr|id, rdf:property ou rdf:instanceOf. Mais puisque vous utiliserez vos propres attributs dans votre propre espace de nommage, ces exceptions n'auront probablement pas d'importance de toute façon.

+ +

Notez qu'un gabarit sans règle, comme dans le premier exemple, est équivalent fonctionnellement à un gabarit qui possède un seul rule sans attribut.

+ +
+

Nous allons voir maintenant l'utilisation des gabarits avec les arbres.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/grilles/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/grilles/index.html new file mode 100644 index 0000000000..ba5a11d3b6 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/grilles/index.html @@ -0,0 +1,200 @@ +--- +title: Grilles +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Grilles +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Grids +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

XUL dispose d'une série d'éléments pour créer des grilles sous forme de tableaux.

+ +

Disposition tabulaire XUL

+ +

XUL dispose d'un jeu d'éléments pour la mise en page sous la forme d'une grille en utilisant l'élément grid. Il a quelques similitudes avec la balise HTML table. La grille n'affiche rien du tout ; elle ne sert qu'à positionner d'autres éléments en ligne et en colonne.

+ +

Une grille contient des éléments qui sont alignés comme avec des tableaux. À l'intérieur d'un élément grid, vous déclarez deux choses : les colonnes et les lignes qui sont utilisées. À l'instar des tableaux HTML, vous pouvez mettre du contenu tels que des libellés et des boutons à l'intérieur des lignes. Toutefois, la grille permet un arrangement de votre contenu soit en ligne, soit en colonne. Il est fréquent de l'utiliser en ligne comme avec un tableau. Mais vous pouvez utiliser des colonnes pour définir la taille et l'apparence des colonnes dans une grille. Autrement, vous pouvez mettre du contenu à l'intérieur de colonnes, et utiliser les lignes pour définir l'apparence. Nous étudierons d'abord l'organisation des éléments en ligne.

+ +

Déclaration d'une grille

+ +

Pour déclarer une série de lignes, utilisez l'élément rows, qui doit être un élément enfant de grid. À l'intérieur, vous devez ajouter les éléments row, qui représentent chacun des lignes. À l'intérieur d'un élément row, vous devez mettre le contenu que vous souhaitez sur cette ligne.

+ +

De la même façon, les colonnes sont déclarées avec l'élément columns, qui doit être un élément enfant de grid. À l'intérieur de cet élément viennent les éléments individuels column, un pour chaque colonne que vous voulez dans la grille.

+ +

Un exemple sera plus clair :

+ +

Exemple 1: Source Voir

+ +
Image:xultu_grids1.png
+ +
<grid flex="1">
+
+  <columns>
+    <column flex="2"/>
+    <column flex="1"/>
+  </columns>
+
+  <rows>
+    <row>
+      <button label="Lapin"/>
+      <button label="Éléphant"/>
+    </row>
+    <row>
+      <button label="Koala"/>
+      <button label="Gorille"/>
+    </row>
+  </rows>
+
+</grid>
+
+ +

Deux lignes et deux colonnes ont été ajoutées dans une grille. Chaque colonne est déclarée avec l'élément column. Un attribut flex a été assigné à chacune de ces colonnes. Chaque ligne contient deux éléments qui sont des boutons. Le premier élément de chaque élément row est placé dans la première colonne de la grille, et le second élément de chaque ligne est placé dans la seconde colonne.

+ +
Notez que vous n'avez pas d'élément pour définir une cellule (il n'y a pas d'équivalent à l'élément HTML td). Au lieu de cela, vous placez vos contenus de cellules directement dans les éléments row.
+ +

Grille avec d'autres éléments

+ +

Bien entendu, vous pouvez utiliser n'importe quel autre élément que l'élément button. Si vous voulez une cellule particulière contenant de multiples éléments, vous pouvez utiliser une boîte imbriquée hbox ou tout autre élément boîte. Une boîte hbox représente un seul élément, mais elle peut contenir autant d'éléments que vous le souhaitez. Par exemple :

+ +

Exemple 2: Source Voir

+ +
<grid flex="1">
+
+  <columns>
+    <column/>
+    <column flex="1"/>
+  </columns>
+
+  <rows>
+    <row>
+      <label control="doctitle" value="Titre du document:"/>
+      <textbox id="doctitle" flex="1"/>
+    </row>
+    <row>
+      <label control="docpath" value="Répertoire:"/>
+      <hbox flex="1">
+        <textbox id="docpath" flex="1"/>
+        <button label="Parcourir..."/>
+      </hbox>
+    </row>
+  </rows>
+
+</grid>
+
+ +
Image:xultu_grids2.png
+ +

Remarquez sur l'image ci-contre comment la première colonne contenant les libellés a seulement un unique élément pour chaque ligne. La seconde colonne contient sur sa seconde ligne une boîte qui elle-même contient deux éléments, textbox et button. Vous pouvez ajouter d'autres boîtes imbriquées ou une autre grille dans une simple cellule.

+ +

Si vous redimensionnez la fenêtre du dernier exemple, vous verrez que les champs de saisie s'ajustent en conséquence, mais pas les autres éléments. En effet, des attributs flex ont été ajoutés à ces champs de saisie et à la seconde colonne. La première colonne n'a pas besoin d'être flexible car les libellés n'ont pas besoin de changer de taille.

+ +

La largeur initiale d'une colonne est déterminée par le plus large de ses éléments. De même, la hauteur d'une ligne est déterminée par la taille des éléments de cette ligne. Vous pouvez employer des propriétés CSS minwidth, maxwidth et des propriétés similaires pour affiner les dimensions.

+ +

Organisation en colonnes

+ +

Vous pouvez également placer des éléments à l'intérieur des éléments column au lieu des éléments row. En procédant de la sorte, les lignes sont ajoutées seulement pour définir leur nombre.

+ +

Exemple 3: Source Voir

+ +
<grid>
+  <rows>
+    <row/>
+    <row/>
+    <row/>
+  </rows>
+
+  <columns>
+    <column>
+      <label control="first" value="Premier nom:"/>
+      <label control="middle" value="Nom central:"/>
+      <label control="last" value="Dernier nom:"/>
+    </column>
+    <column>
+      <textbox id="first"/>
+      <textbox id="middle"/>
+      <textbox id="last"/>
+    </column>
+  </columns>
+
+</grid>
+
+ +

Cette grille a trois lignes et deux colonnes. Les éléments row servent juste à définir combien de lignes la grille contient. Vous pouvez ajouter un attribut flex à une ligne pour la rendre flexible. Le contenu est placé dans chaque colonne. Le premier élément de chaque élément column est placé sur la première ligne, le second élément sur la deuxième ligne et le troisième élément sur la troisième ligne.

+ +

Si vous placez du contenu à la fois sur les colonnes et sur les lignes, le contenu de l'un va se superposer à l'autre, même s'il est aligné correctement dans la grille. Cet effet correspondrait à une grille d'éléments stack.

+ +

L'ordre des éléments dans la grille détermine lequel est affiché au premier plan et lequel est affiché à l'arrière-plan. Si l'élément rows est placé après l'élément columns, le contenu des lignes est affiché au premier plan. Si l'élément columns est placé après l'élément rows, le contenu des colonnes est affiché au premier plan. De même, les événements tels que les clics de souris et les touches de clavier sont seulement envoyés aux objets de premier plan. C'est pour cela que les colonnes sont définies après les lignes dans l'exemple ci-dessus. Si les colonnes avaient été placées en premier, les lignes auraient capturées les événements et aucun texte n'aurait pu être saisi dans les champs de saisie.

+ +

Flexibilité des grilles

+ +

Un des avantages des grilles par rapport à une série de boîtes imbriquées est que vous pouvez créer des cellules qui sont flexibles aussi bien horizontalement que verticalement. Il vous suffit de mettre un attribut flex sur les lignes et colonnes concernées. L'exemple suivant en fait la démonstration :

+ +

Exemple 4: Source Voir

+ +
<grid flex="1">
+ <columns>
+  <column flex="5"/>
+  <column/>
+  <column/>
+ </columns>
+ <rows>
+  <row flex="10">
+    <button label="Cerise"/>
+    <button label="Citron"/>
+    <button label="Raisin"/>
+  </row>
+  <row flex="1">
+    <button label="Fraise"/>
+    <button label="Framboise"/>
+    <button label="Pêche"/>
+  </row>
+ </rows>
+</grid>
+
+ +

La première colonne et l'ensemble des lignes ont été rendus flexibles. Ainsi, chaque cellule de la première colonne est flexible horizontalement. De plus, chaque cellule est flexible verticalement car l'ensemble des lignes dispose de l'attribut flex. La cellule de la première colonne de la première ligne (le bouton 'Cerise') sera flexible horizontalement d'un facteur 5 et verticalement d'un facteur 10. La cellule suivante (le bouton 'Citron') ne sera flexible que verticalement.

+ +

L'attribut flex a également été ajouté à l'élément grid afin que toute la grille soit flexible. Dans le cas contraire, elle ne s'agrandirait que dans une seule direction.

+ +

Étendre une colonne

+ +

Cela n'a aucun sens d'étendre une cellule sur un nombre particulier de colonnes ou de lignes multiples. Toutefois, il est possible de faire qu'une ligne ou qu'une colonne s'étende sur toute la largeur ou la hauteur de la grille. Il vous suffit d'ajouter un élément à l'intérieur d'un élément rows qui ne soit pas à l'intérieur d'un élément row. Par exemple, vous pouvez utiliser un type de boîte et y placer d'autres éléments si vous voulez en utiliser plusieurs. Voici un exemple simple :

+ +

Exemple 5: Source Voir

+ +
<grid>
+  <columns>
+    <column flex="1"/>
+    <column flex="1"/>
+  </columns>
+
+  <rows>
+    <row>
+      <label value="Nord Ouest"/>
+      <label value="Nord Est"/>
+    </row>
+    <button label="Équateur"/>
+    <row>
+      <label value="Sud Ouest"/>
+      <label value="Sud Est"/>
+    </row>
+  </rows>
+</grid>
+
+ +

Le bouton va s'étendre pour s'ajuster sur toute la largeur de la grille comme s'il n'était pas à l'intérieur d'une ligne de la grille. Vous pouvez utiliser une technique similaire pour ajouter un élément entre deux colonnes. Il s'étendra pour s'ajuster sur toute la hauteur de la grille. Vous pouvez combiner les deux si vous le souhaitez.

+ +
+

Dans la section suivante, nous verrons comment ajouter des panneaux de contenu.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/h\303\251ritage_d'attributs_xbl/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/h\303\251ritage_d'attributs_xbl/index.html" new file mode 100644 index 0000000000..e7071aad31 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/h\303\251ritage_d'attributs_xbl/index.html" @@ -0,0 +1,100 @@ +--- +title: Héritage d'attributs XBL +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Héritage_d'attributs_XBL +tags: + - Tutoriel_XUL + - Tutoriels + - XBL + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/XBL_Attribute_Inheritance +--- +

 

+
+

« PrécédentSuivant »

+
+

Dans cette section, nous verrons comment les attributs peuvent être hérités.

+

l'héritage d'attributs

+

XBL permet de construire des éléments graphiques composites tout en cachant leur implémentation réelle. Cependant, avec les fonctionnalités mentionnées jusque présent, le contenu anonyme est toujours créé de la même façon. Il serait utile de pouvoir ajouter des attributs aux éléments extérieurs pour modifier les éléments intérieurs. Par exemple :

+
XUL:
+
+<searchbox/>
+
+XBL:
+
+<binding id="searchBinding">
+  <content>
+    <xul:textbox/>
+    <xul:button label="Rechercher"/>
+  </content>
+</binding>
+
+

Dans cet exemple, l'attribut label est placé directement sur l'élément button. Le problème avec cette technique est que le libellé sera le même à chaque fois que la liaison sera utilisée. Dans ce cas, il serait préférable que l'attribut soit plutôt défini sur la balise searchbox. XBL fournit un attribut inherits permettant l'héritage des attributs de l'élément extérieur. Il devra être placé sur l'élément qui héritera de ces attributs, dans notre cas sur le bouton. Sa valeur devra être initialisée par une liste des noms des attributs à hériter, séparés par des virgules.

+
<xul:textbox xbl:inherits="flex"/>
+<xul:button xbl:inherits="label"/>
+
+

Lorsque le contenu est généré, textbox obtient l'attribut flex à partir de searchbox et button obtient l'attribut label à partir de searchbox. Ils permettent à la flexibilité du champ de saisie et au libellé du bouton d'être différents à chaque utilisation de la liaison. De plus, le changement de la valeur des attributs de la balise searchbox avec un script mettra aussi à jour la balise textbox et la balise button. Vous pouvez ajouter un attribut inherits sur autant d'éléments que vous le souhaitez, pour hériter de n'importe quel nombre d'attributs.

+

Remarquez comment l'attribut inherits a été placé dans l'espace de nommage XBL, en utilisant le préfixe 'xbl:'. L'espace de nommage devrait être déclaré quelque part avant, généralement dans l'élément bindings, comme dans l'exemple suivant :

+
<bindings xmlns:xbl="http://www.mozilla.org/xbl"
+          xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+<xbl:binding id="buttonBinding">
+  <xbl:content>
+    <xul:button label="OK" xbl:inherits="label"/>
+  </xbl:content>
+</xbl:binding>
+
+

Dans cet exemple, le bouton hérite de l'attribut label, mais cet attribut a aussi une valeur assignée directement dans le XBL. Cette technique est utilisée pour définir une valeur par défaut si l'attribut n'est pas présent. Ce bouton héritera son attribut label de l'élément extérieur. Cependant, si aucun label n'est présent, la valeur 'OK' par défaut lui sera donnée.

+

Il peut arriver que deux éléments générés aient besoin d'hériter d'un attribut qui a le même nom. Par exemple, pour créer un champ de saisie muni d'un libellé, contenant donc un élément label et un élément textbox, le libellé (label) aura besoin d'hériter son texte à partir de l'attribut value et le champ de saisie (textbox) aura aussi besoin d'hériter sa valeur par défaut également à partir de l'attribut value. Pour résoudre cela, nous aurons besoin d'utiliser un attribut différent et le faire pointer sur le bon. L'exemple suivant montre comment procéder :

+
XUL:
+
+<box class="labeledtextbox" title="Entrer du texte:" value="OK"/>
+
+CSS:
+
+box.labeledtextbox {
+    -moz-binding: url('chrome://example/skin/example.xml#labeledtextbox');
+}
+
+XBL:
+
+<binding id="labeledtextbox">
+  <content>
+    <xul:label xbl:inherits="value=title"/>
+    <xul:textbox xbl:inherits="value"/>
+  </content>
+</binding>
+
+

L'élément textbox hérite directement de l'attribut value. Pour initialiser l'attribut value du libellé, nous aurons besoin d'utiliser un nom différent d'attribut et le faire pointer vers le vrai attribut. L'attribut inherits sur la balise label obtient son attribut title à partir de l'élément extérieur et le fait pointer vers l'attribut value de l'élément label. La syntaxe <attribut intérieur>=<attribut extérieur> est utilisée ici pour faire pointer un attribut vers un autre. Voici un autre exemple :

+
XUL:
+
+<box class="okcancel" oktitle="OK" canceltitle="Annuler" image="happy.png"/>
+
+CSS:
+
+box.okcancel {
+    -moz-binding: url('chrome://example/skin/example.xml#okcancel');
+}
+
+XBL:
+
+<binding id="okcancel">
+  <content>
+    <xul:button xbl:inherits="label=oktitle,image"/>
+    <xul:button xbl:inherits="label=canceltitle"/>
+  </content>
+</binding>
+
+

La valeur de l'attribut oktitle est projetée vers l'attribut label du premier bouton. L'attribut canceltitle est projeté vers l'attribut label du second bouton. Le premier bouton hérite aussi de l'attribut image. Le résultat est le suivant :

+
<box class="okcancel" oktitle="OK" canceltitle="Annuler" image="happy.png">
+  <button label="OK" image="happy.png"/>
+  <button label="Annuler"/>
+</box>
+
+

Remarquez que les attributs sont dupliqués dans le contenu intérieur (anonyme). La modification des attributs de la boîte avec la classe 'okannuler' affectera automatiquement les valeurs des boutons. Vous avez probablement aussi remarqué que nous avons créé nos propres noms d'attribut. Ceci est valide en XUL.

+
+

Dans la section suivante, nous regarderons l'ajout de propriétés, méthodes et événements à une liaison.

+
+

« PrécédentSuivant »

+
+

Interwiki

+

 

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/h\303\251ritage_xbl/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/h\303\251ritage_xbl/index.html" new file mode 100644 index 0000000000..a2edf8e9ba --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/h\303\251ritage_xbl/index.html" @@ -0,0 +1,60 @@ +--- +title: Héritage XBL +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Héritage_XBL +tags: + - Tutoriel_XUL + - Tutoriels + - XBL + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/XBL_Inheritance +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Dans cette section, nous verrons comment étendre des définitions XBL existantes.

+ +

Héritage

+ +

Parfois vous pouvez vouloir créer un élément graphique XBL qui est similaire à un élément existant. Par exemple, disons que vous souhaitez créer un bouton XBL avec une fenêtre surgissante. Une manière de faire pour le créer est de dupliquer le code XBL existant des boutons. Cependant, il serait préférable de simplement étendre ce code.

+ +

N'importe quelle liaison peut être étendue avec une autre. La liaison fille peut ajouter des propriétés, des méthodes et des gestionnaires d'événements. La liaison fille aura toutes les caractéristiques qui la définissent en plus des caractéristiques de la liaison dont elle hérite (et celles dont cette liaison aura elle même hérité et ainsi de suite dans l'arbre).

+ +

Pour étendre une liaison existante, ajoutez un attribut extends à l'intérieur de la balise binding. Par exemple, la liaison suivante crée un champ de saisie qui ajoute le texte 'http://www' au début de sa valeur lorsque la touche F4 est pressée.

+ +

Exemple 1 : Source

+ +
<binding id="textboxwithhttp"
+         extends="chrome://global/content/bindings/textbox.xml#textbox">
+  <handlers>
+    <handler event="keypress" keycode="VK_F4">
+      this.value="http://www"+value;
+    </handler>
+  </handlers>
+</binding>
+
+ +

L'élément XBL étend ici les fonctionnalités du champ de saisie XUL textbox. L'URL donnée dans l'attribut extends ci-dessus est l'URL de la liaison de la balise textbox. Elle signifie que la liaison hérite de tous les contenu et comportement fournis par la liaison de textbox. En plus, nous ajoutons un gestionnaire qui répond à l'événement 'keypress'.

+ +

Champ de saisie semi-automatique

+ +

L'exemple ci-dessus est similaire au dispositif de saisie semi-automatique qui fonctionne sous Mozilla. Un champ de saisie qui supporte la saisie semi-automatique n'est qu'un champ de saisie basique étendu avec une liaison XBL.

+ +

Le champ de saisie semi-automatique ajoute une gestion spéciale d'événement de telle sorte que lorsqu'une URL est tapée, un menu va surgir proposant des suites de saisies possibles. Vous pouvez aussi l'utiliser dans vos propres applications. Créez simplement un textbox avec deux attributs spéciaux.

+ +
<textbox type="autocomplete" searchSessions="history"/>
+ +

Déclarez l'attribut type à 'autocomplete' pour ajouter un dispositif de saisie semi-automatique à un champ de saisie existant. Déclarez searchSessions pour indiquer le type de données à surveiller. Dans ce cas, la valeur 'history' surveillant les URLs dans l'historique est utilisée (Vous pouvez aussi utiliser la valeur 'addrbook' pour surveiller les adresses dans le carnet d'adresses.)

+ +
Firefox utilise un mécanisme d'autocomplétion différent de celui de la suite Mozilla, consultez XUL:textbox (autocomplétion de Firefox).
+ +
+

Dans la prochaine section, nous verrons un exemple d'élément graphique défini en XBL.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/index.html new file mode 100644 index 0000000000..5924573c00 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/index.html @@ -0,0 +1,179 @@ +--- +title: Tutoriel XUL +slug: Archive/Mozilla/XUL/Tutoriel_XUL +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial +--- +

 

+ +

Ce tutoriel décrit le langage XUL (XML User-interface Language). Ce langage a été créé pour l'application Mozilla afin de décrire son interface utilisateur.

+ +
Introduction
+ + + +
Éléments simples
+ + + +
Le modèle de boîte
+ + + +
Éléments communs
+ + + + + + + +
Évènements et scripts
+ + + +
Modèle Objet de Document (DOM)
+ + + +
Arbres
+ + + +
RDF et templates
+ + + +
Thèmes et localisation
+ + + +
Liaisons XBL
+ + + +
Fenêtres spécialisées
+ + + +
Installation
+ + + +
+

Ce tutoriel XUL a été initialement créé par Neil Deakin. Il a généreusement accepté de l'inclure dans MDC.

+
+ +
+
Information du document original
+ + +
+ +

Interwiki Language Links

+ +

 

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/indicateurs_de_progression/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/indicateurs_de_progression/index.html new file mode 100644 index 0000000000..af289aeecf --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/indicateurs_de_progression/index.html @@ -0,0 +1,48 @@ +--- +title: Indicateurs de progression +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Indicateurs_de_progression +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Progress_Meters +--- +
+

« PrécédentSuivant »

+
+

Dans cette section, nous étudierons la création d'indicateurs de progression.

+

Ajout d'un indicateur de progression

+

Un indicateur de progression est une barre qui indique l'état d'avancement d'une tâche. Typiquement, vous la voyez lors du téléchargement de fichiers ou quand une longue opération s'exécute. XUL a un élément qui peut être utilisé pour la création d'un indicateur de progression (NdT : progressmeter). Il y a deux types d'état pour un indicateur : déterminé et indéterminé.

+

Les indicateurs de progression déterminés sont utilisés quand vous connaissez la durée d'une opération. L'indicateur de progression va se remplir, et une fois plein, l'opération doit être terminée. Il peut être utilisé pour une boîte de dialogue de téléchargement lorsque la taille des fichiers est connue.

+

Les indicateurs de progression indéterminés sont utilisés quand vous ne connaissez pas la durée d'une opération. Une animation visuelle représentera cet indicateur, sous la forme d'un rectangle zébré ou un cylindre hachuré tournant, et elle sera dépendante de votre système d'exploitation et du thème graphique utilisé.

+

Indicateur de progression déterminé : 

+
Image:xultu_prog-det.jpg
+

Indicateur de progression indéterminé : 

+
Image:xultu_prog-udet.jpg
+

Un indicateur de progression a la syntaxe suivante :

+
<progressmeter
+   id="identifier"
+   mode="determined"
+   value="0%"/>
+
+

Ses attributs sont les suivants :

+
id 
L'identifiant unique de l'indicateur de progression.
mode 
Le type d'indicateur de progression. Si sa valeur est 'determined', l'indicateur de progression est déterminé et se remplit au fur et à mesure de la tâche en cours. Si sa valeur est 'undetermined', l'indicateur de progression est indéterminé et vous ne connaissez pas la durée de la tâche en cours. La valeur par défaut est 'determined' si vous n'avez pas spécifié cet attribut.
value 
La valeur courante de l'indicateur de progression. Vous ne devez utiliser cet attribut que pour un indicateur de progression déterminé. La valeur doit être un pourcentage compris entre '0%' et '100%'. La valeur sera changée par un script selon l'avancement de la tâche.
+
+
+

Ajoutons maintenant un indicateur de progression à notre boîte de dialogue 'Recherche de fichiers'. Nous devrions normalement mettre un indicateur de progression indéterminé car nous ne connaissons pas le nombre de fichiers recherchés ou combien de temps prendra la recherche. Toutefois, nous ajouterons un indicateur normal pour l'instant car un indicateur animé risque d'être perturbant lors du développement. L'indicateur de progression devrait normalement n'apparaître que lorsque la recherche est lancée. Nous ajouterons plus tard un script pour l'afficher ou non.

+
<hbox>
+
+  <progressmeter value="50%" style="margin: 4px;">
+
+  <spacer flex="1"/>
+</hbox>
+
+
Image:xultu_progress1.png
+

La valeur a été mise à '50%' afin que vous puissiez voir la barre de progression dans la fenêtre. Une marge de 4 pixels a été définie pour séparer l'indicateur du bord de la fenêtre. Comme nous l'avons mentionné précédemment, nous voulons simplement que la barre de progression soit affichée pendant la recherche. Un script l'affichera et la masquera si nécéssaire.

+Exemple 'Recherche de fichiers' : Source Voir
+
+

Nous allons voir dans la prochaine section comment ajouter des éléments additionnels à une fenêtre en utilisant HTML.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/interfaces_xpcom/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/interfaces_xpcom/index.html new file mode 100644 index 0000000000..5f7b8e5f1b --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/interfaces_xpcom/index.html @@ -0,0 +1,190 @@ +--- +title: Interfaces XPCOM +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Interfaces_XPCOM +tags: + - Tutoriel_XUL + - Tutoriels + - 'XPCOM:Liaisons_de_langage' + - XPConnect + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/XPCOM_Interfaces +--- +
+

« PrécédentSuivant »

+
+ +

Dans cette section, nous allons faire une brève présentation de XPCOM ("Modèle de composants objets multi plate-forme"), qui est le système d'objets utilisé par Mozilla.

+ +

Appel des objets natifs

+ +

En utilisant XUL, nous pouvons construire des interfaces utilisateurs complexes. En y joignant des scripts, on peut modifier l'interface et réaliser des actions. Cependant, il y a un certain nombre de choses qui ne peuvent pas être réalisées directement en javascript. Par exemple, si nous voulons créer une application gérant des courriels, nous avons besoin d'écrire des scripts permettant de se connecter au serveur de courriels, afin de les retirer ou d'en envoyer. Le langage Javascript ne permet pas de faire ce genre de choses.

+ +

Le seul moyen pour le faire est d'écrire du code natif implémentant ces fonctionnalités avancées. Nous avons aussi besoin d'un moyen pour pouvoir appeler ce code natif aisément à partir de nos scripts. Mozilla fournit une telle possibilité en utilisant XPCOM.

+ +
Mozilla fournit déjà plusieurs composants et interfaces XPCOM. Donc, dans la plupart des cas, il sera inutile d'écrire votre propre code natif. Après avoir lu cette section, vous pourrez rechercher des interfaces en utilisant la référence XPCOM de XULPlanet.
+ +

À propos d'XPCOM

+ +

Mozilla est construit à partir d'une multitude de composants, où chacun d'eux réalise une tâche précise. Par exemple, il y a un composant pour chaque menu, bouton et élément. Ces composants sont construits à partir de plusieurs définitions appelées interfaces.

+ +

Une interface dans Mozilla est une définition d'un ensemble de fonctions que peuvent implémenter des composants. Les composants sont ce qui permet au code de Mozilla de réaliser des traitements. Chaque composant implémente les fonctions conforme à une interface. Un composant peut implémenter plusieurs interfaces. Et plusieurs composants peuvent implémenter la même interface.

+ +

Prenons l'exemple d'un composant de fichier. Une interface sera créée décrivant les propriétés et les fonctions que l'on veut pouvoir appliquer sur un fichier. Les propriétés seront le nom du fichier, sa date de dernière modification ou sa taille. Les fonctions permettront d'effacer, de déplacer ou de copier le fichier.

+ +

L'interface "Fichier" décrit uniquement les caractéristiques du fichier, elle ne les implémente pas. L'implémentation est laissé au composant. Celui-ci contiendra le code qui permettra de récupérer le nom du fichier, sa date, sa taille. Il contiendra également le code pour le copier ou le renommer.

+ +

Nous n'avons pas à s'intéresser sur la manière dont l'implémentation est faite par le composant, du moment qu'il respecte l'interface correctement. Bien sûr, nous aurons une implémentation différente pour chaque plate-forme. Entre les versions Macintosh et Windows, les composants de fichier seront très différents. Cependant ils implémentent la même interface et par conséquent on peut accéder au composant en utilisant les fonctions de cette interface.

+ +

Dans Mozilla, les interfaces sont préfixées par 'nsI' ou 'mozI' ainsi elles sont facilement reconnaissables. Par exemple, nsIAddressBook est l'interface qui interagit avec le carnet d'adresses, nsISound est celle utilisée pour écouter des fichiers et nsILocalFile pour manipuler des fichiers. Pour plus de détails, consultez les interfaces de Mozilla.

+ +

Typiquement, les composants XPCOM sont implémentés nativement, ce qui signifie qu'ils font des choses que le langage Javascript ne peut pas réaliser. Par contre, on peut les appeler à partir de scripts. C'est ce que l'on va voir maintenant. Nous pouvons appeler n'importe laquelle des fonctions fournies par le composant telles que décrites par les interfaces qu'il implémente. Par exemple, si vous avez un composant à votre disposition, vous vérifiez alors s'il implémente l'interface nsISound, et si c'est le cas, vous pouvez jouer un son grâce lui.

+ +

Le processus d'appel de composants XPCOM à partir d'un script se nomme XPConnect : une couche qui traduit les objets du script en objets natifs.

+ +

Création d'objets XPCOM

+ +

L'appel d'un composant XPCOM se fait en trois étapes :

+ +
    +
  1. Récupérer un composant.
    2. +
  2. Récupérer la partie du composant qui implémente l'interface que l'on veut utiliser.
    3. +
  3. Appeler la fonction que l'on a besoin.
    4. +
+ +

Une fois que les deux premières étapes sont réalisées, nous pouvons effectuer la dernière autant de fois que nécessaire. Prenons le cas du renommage d'un fichier. La première étape est de récupérer le composant "fichier". Puis on interroge ledit composant pour récupérer la portion qui implémente l'interface nsILocalFile. Enfin, on appelle les fonctions fournies par l'interface. Cette interface est utilisée pour représenter un unique fichier.

+ +

Nous avons vu que les noms d'interfaces commencent toujours par 'nsI' ou 'mozI'. Par contre, la désignation des composants utilise la syntaxe URI. Mozilla stocke une liste de tous les composants disponibles dans son propre registre. Un utilisateur peut installer de nouveaux composants si besoin est. Ce mécanisme fonctionne comme les plugins.

+ +

Mozilla fournit un composant "fichier" c'est-à-dire implémentant nsILocalFile. Ce composant est désigné par la chaîne '@mozilla.org/file/local;1'. Cette chaîne est appelée un contractID. La syntaxe d'un contractID est :

+ +
@<internetdomain>/module[/submodule[...]];<version>[?<name>=<value>[&<name>=<value>[...]]]
+ +

D'autres composants peuvent être appelés de la même manière.

+ +

Le contractID du composant sert à obtenir le composant. Voici en Javascript le code correspondant :

+ +
var aFile = Components.classes["@mozilla.org/file/local;1"].createInstance();
+ +

Le composant "fichier" est récupéré et stocké dans la variable aFile. Dans l'exemple, Components fait référence à un objet global fournissant les fonctions relatives à certains composants. Ici la classe d'un composant est récupérée en utilisant la propriété classes. Cette propriété est un tableau de tous les composants disponibles. Pour obtenir un composant différent, il suffit de remplacer l'URI par celui du composant voulu. Finalement, une instance est créée avec la fonction createInstance().

+ +

Vous devez vérifier que la valeur de retour de createInstance() est différente de 'null', valeur qui indiquerait que le composant n'existe pas.

+ +

Pour l'instant, nous avons seulement une référence sur le composant "fichier". Pour appeler ses fonctions, nous avons besoin de récupérer une de ces interfaces, dans notre cas nsILocalFile. Une seconde ligne est ajoutée à notre code comme suit :

+ +
var aFile = Components.classes["@mozilla.org/file/local;1"].createInstance();
+if (aFile) aFile.QueryInterface(Components.interfaces.nsILocalFile);
+
+ +

La fonction QueryInterface() est fournie par tous les composants, elle permet d'obtenir une interface précise du composant. Elle prend un seul paramètre, le nom de l'interface souhaitée. La propriété interfaces de Components contient une liste de toutes les interfaces des composants. Ici on utilise l'interface nsILocalFile que l'on passe en paramètre à QueryInterface(). Ainsi aFile fera référence à la partie du composant qui implémente l'interface nsILocalFile.

+ +

Ces deux lignes de Javascript peuvent être utilisées pour obtenir n'importe quelle interface de n'importe quel composant. Il suffit de remplacer le nom du composant et le nom de l'interface que vous voulez utiliser. Vous pouvez bien sûr choisir n'importe quel nom pour la variable. Par exemple si vous voulez utiliser l'interface pour le son, notre code pourrait être comme suit :

+ +
var sound = Components.classes["@mozilla.org/sound;1"].createInstance();
+if (sound) sound.QueryInterface(Components.interfaces.nsISound);
+
+ +

Les interfaces XPCOM peuvent hériter d'autres interfaces. L'interface héritière possède ses propres fonctions mais aussi toutes celles des interfaces parentes. Ainsi toute interface hérite de l'interface principale nsISupports qui fournit la fonction QueryInterface(). Comme tout composant doit implémenter nsISupports, la fonction QueryInterface() est disponible sur tous les composants.

+ +

Plusieurs composants peuvent implémenter la même interface. Typiquement ce sont des sous-classes de l'original mais pas nécessairement. N'importe quel composant peut implémenter les fonctionnalités de nsILocalFile. De plus, un composant peut implémenter plusieurs interfaces. C'est pour ces raisons que l'on doit procéder en deux étapes pour appeler les fonctions d'une interface.

+ +

Cependant, il existe un raccourci pour réduire ces deux étapes en une seule ligne de code :

+ +
var aLocalFile = Components.classes["@mozilla.org/file/local;1"].createInstance(Components.interfaces.nsILocalFile);
+
+ +

Ce code effectue la même action qu'avec les deux lignes, mais en une seule ligne. Il élimine le besoin de créer une instance et ensuite de l'interroger pour obtenir une interface précise, en deux étapes séparées.

+ +

Un appel à QueryInterface() sur un objet qui ne fournit pas l'interface demandée lance une exception. Si vous n'êtes pas sûr que le composant supporte une interface, vous pouvez utiliser l'opérateur instanceof comme suit :

+ +
var aFile = Components.classes["@mozilla.org/file/local;1"].createInstance();
+if (aFile instanceof Components.interfaces.nsILocalFile){
+  // faire quelque chose si il s'agit d'une instance du bon type
+}
+
+ +

L'opérateur instanceof renvoie 'true' si aFile implémente l'interface nsILocalFile, et il effectue également l'appel de la méthode QueryInterface, ce qui fournit par la suite un objet nsILocalFile aFile valide.

+ +

Appel des fonctions de l'interface

+ +

Maintenant que nous avons un objet qui fait référence à un composant avec l'interface nsILocalFile, nous pouvons appeler les fonctions de celle-ci à travers l'objet. La liste suivante montre quelques propriétés et méthodes de l'interface nsILocalFile.

+ +
+
initWithPath 
+
Cette méthode est utilisée pour initialiser le chemin et le nom du fichier pour l'interface nsILocalFile. Le premier paramètre doit être le chemin du fichier, comme par exemple '/usr/local/mozilla'.
+
leafName 
+
Le nom du fichier sans son chemin complet.
+
fileSize 
+
La taille du fichier.
+
isDirectory() 
+
Renvoie 'true' si nsILocalFile représente un répertoire.
+
remove(recursif) 
+
Efface un fichier. Si le paramètre recursif est 'true', le répertoire et tous ses fichiers et sous-répertoires sont effacés.
+
copyTo ( repertoire, nouveauNom ) 
+
Copie un fichier dans un autre répertoire, et optionnellement renomme le fichier. La variable repertoire doit être un objet nsILocalFile représentant le répertoire où l'on veut copier le fichier.
+
moveTo ( repertoire, nouveauNom ) 
+
Déplace le fichier dans un autre répertoire ou le renomme. La variable repertoire doit être un objet nsILocalFile représentant le répertoire où l'on va mettre le fichier.
+
+ +

Pour effacer un fichier, on doit d'abord l'assigner à un objet nsILocalFile. Nous appelons la méthode initWithPath() pour définir le fichier en question, en indiquant juste le chemin de celui-ci. Puis nous appelons la fonction remove() avec le paramètre recursif à 'false'. Voici le code correspondant :

+ +
var aFile = Components.classes["@mozilla.org/file/local;1"].createInstance();
+if (aFile instanceof Components.interfaces.nsILocalFile){
+  aFile.initWithPath("/mozilla/testfile.txt");
+  aFile.remove(false);
+}
+
+ +

Ce code prend le fichier '/mozilla/testfile.txt' et l'efface. Essayez cet exemple en ajoutant le code à un gestionnaire d'évènements. Vous devez changer le nom du fichier pour qu'il corresponde à un fichier existant que vous voulez effacer sur votre poste local.

+ +

Dans la liste ci-dessus, nous avons vu deux fonctions copyTo() et moveTo(). Ces fonctions sont utilisées pour respectivement copier et déplacer des fichiers.

+ +
Notez que ces fonctions ne prennent pas en paramètre une chaîne de caractères pour désigner un répertoire mais un objet nsILocalFile. Cela signifie que nous devons récupérer les deux composants "fichier".
+ +

L'exemple suivant montre comment copier un fichier :

+ +
function copyFile(sourcefile,destdir)
+{
+  // récupérer un composant pour le fichier à copier
+  var aFile = Components.classes["@mozilla.org/file/local;1"]
+    .createInstance(Components.interfaces.nsILocalFile);
+  if (!aFile) return false;
+
+  // récupérer un composant pour le répertoire où la copie va s'effectuer.
+  var aDir = Components.classes["@mozilla.org/file/local;1"]
+    .createInstance(Components.interfaces.nsILocalFile);
+  if (!aDir) return false;
+
+  // ensuite, on initialise les chemins
+  aFile.initWithPath(sourcefile);
+  aDir.initWithPath(destdir);
+
+  // Au final, on copie le fichier sans le renommer
+  aFile.copyTo(aDir,null);
+}
+
+copyFile("/mozilla/testfile.txt","/etc");
+
+ +

Les services XPCOM

+ +

Certains composants XPCOM spéciaux sont appelés services. Vous ne pouvez pas créer plusieurs instances d'un service parce qu'il doit être unique. Les services fournissent des fonctions manipulant des données globales ou effectuent des opérations sur d'autres objets. Au lieu d'utiliser createInstance(), vous devez appeler getService() pour récupérer une référence sur le composant de type "service". À part ça, les services ne diffèrent pas des autres composants.

+ +

Un exemple de service fournit par Mozilla est le service pour les marque-pages. Il vous permet d'ajouter un marque-page à la liste courante des marque-pages de l'utilisateur. Voici un exemple :

+ +
var bmarks = Components.classes["@mozilla.org/browser/bookmarks-service;1"].getService();
+bmarks.QueryInterface(Components.interfaces.nsIBookmarksService);
+bmarks.addBookmarkImmediately("http://www.mozilla.org","Mozilla",0,null);
+
+ +

Tout d'abord, le composant '@mozilla.org/browser/bookmarks-service;1' est récupéré et son service est placé dans la variable bmarks. Nous utilisons QueryInterface() pour récupérer l'interface 'nsIBookmarksService'. La fonction addBookmarkImmediately() fournie par cette interface peut être utilisée pour ajouter des marque-pages. Les deux premiers paramètres de cette fonction sont l'URL et le titre du marque-page. Le troisième paramètre est le type de marque-page qui doit normalement être '0', et le dernier paramètre est l'encodage des caractères du document correspondant au marque-page, qui peut être nul.

+ +
+

Dans la section suivante, nous verrons quelques-unes des interfaces que l'on peut utiliser, fournies par Mozilla.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

+ +

 

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/introduction/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/introduction/index.html new file mode 100644 index 0000000000..c19e397929 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/introduction/index.html @@ -0,0 +1,52 @@ +--- +title: Introduction +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Introduction +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Introduction +--- +
+

Suivant »

+
+

Ce tutoriel est destiné à vous guider dans l'apprentissage de XUL (XML User-interface Language) qui est un langage multi plates-formes permettant de décrire les interfaces utilisateurs des applications.

+

Ce tutoriel vous montrera la création d'une simple interface utilisateur de recherche de fichiers, comme celle fournie par l'interface Sherlock du Macintosh, ou la boîte de dialogue de recherche de fichier de Windows.

+

Notez que seule l'interface utilisateur sera créée avec quelques fonctionnalités limitées. La recherche de fichiers proprement dite ne sera pas implémentée. Une ligne bleue apparaîtra sur la gauche des paragraphes où la boîte de dialogue de recherche de fichier sera modifiée. Vous pourrez suivre cela à travers les sections.

+

Qu'est ce que XUL et pourquoi a-t-il été créé ?

+

XUL (prononcez zool, cela rime avec cool) a été créé pour avoir un développement du navigateur Mozilla plus facile et plus rapide. C'est un langage XML donc toutes les caractéristiques disponibles dans XML le sont également dans XUL.

+

La plupart des applications ont besoin d'être développées en utilisant les caractéristiques d'une plate-forme spécifique, rendant l'adaptation multi plate-forme consommatrice en temps et coûteuse. Un certain nombre de solutions multi plates-formes ont été développées dans le passé. Java, par exemple, a comme principal argument de vente la portabilité. XUL est l'un de ces langages conçus spécialement pour créer des interfaces utilisateurs portables. Cela prend beaucoup de temps pour bâtir une application, même pour une seule plate-forme. Le temps requis pour compiler et débugger peut être long. Avec XUL, une interface peut être implémentée et modifiée rapidement et facilement.

+

XUL a tous les avantages des autres langages XML. Par exemple, XHTML ou d'autres langages XML comme Math-ML ou SVG peuvent y être insérés. De plus, les textes affichés avec XUL sont aisément localisables, ce qui signifie qu'ils peuvent être traduits dans d'autres langues avec peu d'effort.

+

Quels types d'interface utilisateurs peuvent être réalisés avec XUL ?

+

XUL offre la possibilité de créer la plupart des éléments habituels que l'on rencontre dans des interfaces graphiques modernes. Voici quelques éléments pouvant être créés :

+ +

Le contenu affiché peut être créé à partir du contenu d'un fichier XUL ou à partir d'une source de données. Dans Mozilla, de telles sources de données sont utilisées pour les messages des boîtes aux lettres, les marque-pages, et les résultats de recherche. Les contenus des menus, arbres, et autres éléments peuvent être remplis avec ces données, ou avec vos propres données fournies dans des fichiers RDF.

+

Il existe plusieurs cas où des applications XUL sont créées :

+ +

Les trois premiers types nécessitent chacun une installation sur la machine de l'utilisateur. De ce fait, ces types d'applications n'ont aucune restriction de sécurité et peuvent accéder au système de fichiers local, ou lire et écrire des préférences par exemple. Pour des extensions, les fichiers XUL et leurs scripts et images associés seront empaquetés dans un unique fichier qui sera téléchargé et installé par l'utilisateur. Des applications Mozilla telle que Firefox fournissent un gestionnaire d'extensions permettant l'installation de paquetages sans avoir à écrire beaucoup de code complexe.

+

Il est possible d'ouvrir des fichiers XUL directement depuis le système de fichiers ou à partir d'un site Web distant. Cependant, ils seront restreints dans les types d'opérations qu'ils peuvent effectués, et certains aspects de XUL ne fonctionneront pas. Toutefois, si vous voulez charger du contenu XUL à partir d'un site distant, le serveur Web doit être configuré pour envoyer les fichiers XUL avec le type de contenu 'application/vnd.mozilla.xul+xml'. XUL est habituellement stocké dans des fichiers avec l'extension .xul. Vous pouvez ouvrir un fichier XUL avec Mozilla comme vous le feriez avec d'autres fichiers, en utilisant la commande 'Ouvrir un fichier…' du menu 'Fichier', ou en tapant l'URL dans la barre d'adresse.

+

Que dois-je savoir pour comprendre le tutoriel ?

+

Vous devez connaître HTML et avoir au moins des connaissances de base sur XML et CSS. Voici quelques indications à garder à l'esprit :

+ +

XUL est supporté dans Mozilla et les navigateurs basés sur le moteur Gecko, comme Netscape 6 ou plus, et Mozilla Firefox. À cause des différents changements dans la syntaxe XUL au fil du temps, vous devriez avoir la dernière version pour que les exemples fonctionnent correctement. La plupart des exemples devraient fonctionner dans Mozilla 1.0 et plus. XUL est pratiquement similaire dans Firefox que dans les autres navigateurs, bien qu'il y ait des différences spécifiques, comme le support des barres de boutons personnalisables.

+

Ce tutoriel tente de couvrir la plupart des fonctionnalités de XUL. Cependant, toutes les spécificités ne seront pas examinées. Une fois que vous vous serez familiarisés avec XUL, vous pourrez utiliser la référence des éléments XUL pour trouver les autres fonctionnalités supportées par d'autres éléments spécifiques.

+
+

Suivant »

+
+

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/introduction_\303\240_rdf/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/introduction_\303\240_rdf/index.html" new file mode 100644 index 0000000000..6bbbb8e7a4 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/introduction_\303\240_rdf/index.html" @@ -0,0 +1,147 @@ +--- +title: Introduction à RDF +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Introduction_à_RDF +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Introduction_to_RDF +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Dans cette section, nous allons nous intéresser à RDF (Resource Description Framework).

+ +

Resource Description Framework

+ +

Nous pouvons utiliser l'élément tree pour afficher un ensemble de données, telles que des marque-pages ou des courriels. Cependant, il ne serait pas pratique de le faire en entrant les données directement dans le fichier XUL. Il serait très difficile de modifier les marque-pages s'ils étaient directement dans le fichier XUL. Le moyen de résoudre cette difficulté est d'utiliser des sources de données RDF.

+ +

RDF (Resource Description Framework) est un format qui peut être utilisé pour stocker des ressources telles que des marque-pages ou des courriels. Alternativement, on peut utiliser des données dans d'autres formats et écrire du code qui va lire le fichier et créer le fichier de données RDF. C'est de cette façon que Mozilla fonctionne quand il lit des données telles que les marque-pages, l'historique ou les messages de courriel. Mozilla fournit des sources de données pour ces données communes pour que vous puissiez facilement les utiliser.

+ +

Vous pouvez utiliser n'importe quelles sources de données RDF fournies pour peupler les arbres tree avec des données ou vous pouvez désigner un fichier RDF au format XML contenant les données. Elles sont très commodes pour afficher des arbres contenant beaucoup de lignes. RDF peut aussi peupler d'autres éléments XUL comme les listbox et les menu. Nous verrons cela dans la prochaine section.

+ +

Un très bref aperçu de RDF sera fourni ici. Pour un guide de RDF plus détaillé, lisez Introduction to the RDF Model (en). Il est recommandé de lire ce guide si vous êtes débutant en RDF.

+ +

Pour plus d'information sur le RDF, consultez les spécifications RDF (en).

+ +

RDF/XML

+ +

RDF consiste en un modèle, qui est une représentation des données sous forme de graphe. RDF/XML est un langage XML utilisé pour représenter des données RDF. Il contient un ensemble assez simple d'éléments. L'exemple ci-dessous montre un gabarit RDF minimal.

+ +
<?xml version="1.0"?>
+<RDF:RDF
+  xmlns:RDF="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
+  ...
+</RDF:RDF>
+
+ +

Il a quelques similitudes avec l'en-tête XUL. À la place de l'élément window, l'élément RDF est utilisé. Vous pouvez voir que l'espace de nommage pour RDF a été déclaré pour que les éléments RDF soient reconnus proprement. À l'intérieur de l'élément RDF, vous placerez les données. Pour voir quelques exemples de fichiers RDF/XML, regardez ceux présents avec Mozilla. Ils ont une extension .rdf.

+ +

Base de données RDF

+ +

Prenons l'exemple d'une liste de marque-pages générée à partir de RDF. Une liste de marque-pages contient un ensemble d'enregistrements, chacun avec un ensemble de données associées, telles que l'URL, le titre et une date de visite.

+ +

Pensez aux marque-pages comme une base de données qui est stockée comme une grande table avec de nombreux champs. Dans le cas de RDF cependant, les listes peuvent être hiérarchisées. C'est nécessaire pour que nous puissions avoir des dossiers ou des catégories de marque-pages. Chacun des champs dans la base de données RDF est une ressource, avec un nom associé. Le nom est décrit par un URI.

+ +

Par exemple, une selection de champs dans la liste de marque-pages de Mozilla est décrite par les URIs ci-dessous :

+ + + + + + + + + + + + + + + + + + + + + + + + +
Namehttp://home.netscape.com/NC-rdf#NameNom du marque-page
URLhttp://home.netscape.com/NC-rdf#URLURL correspondante
Descriptionhttp://home.netscape.com/NC-rdf#Descriptiondescription du marque-page
Last Visitedhttp://home.netscape.com/WEB-rdf#LastVisitDateDate de dernière visite
+ +

Ils sont générés en prenant le nom de l'espace de nommage (NdT : exemple : 'http://home.netscape.com/NC-rdf') et en ajoutant le nom du champ (NdT : exemple : '#Name'). Dans la prochaine section, nous verrons comment les utiliser pour remplir les valeurs des champs automatiquement. Notez que la dernière date de visite a un espace de nommage légèrement différent des trois autres.

+ +

Exemple de fichier RDF/XML

+ +

Voici maintenant un exemple de fichier RDF/XML listant une table avec trois enregistrements et trois champs.

+ +
<RDF:RDF xmlns:RDF="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+         xmlns:ANIMALS="http://www.some-fictitious-zoo.com/rdf#">
+
+  <RDF:Seq about="http://www.some-fictitious-zoo.com/all-animals">
+    <RDF:li>
+       <RDF:Description about="http://www.some-fictitious-zoo.com/mammals/lion">
+         <ANIMALS:name>Lion</ANIMALS:name>
+         <ANIMALS:species>Panthera leo</ANIMALS:species>
+         <ANIMALS:class>Mammifère</ANIMALS:class>
+       </RDF:Description>
+    </RDF:li>
+    <RDF:li>
+       <RDF:Description about="http://www.some-fictitious-zoo.com/arachnids/tarantula">
+         <ANIMALS:name>Tarantule</ANIMALS:name>
+         <ANIMALS:species>Avicularia avicularia</ANIMALS:species>
+         <ANIMALS:class>Arachnide</ANIMALS:class>
+       </RDF:Description>
+    </RDF:li>
+    <RDF:li>
+       <RDF:Description about="http://www.some-fictitious-zoo.com/mammals/hippopotamus">
+         <ANIMALS:name>Hippopotame</ANIMALS:name>
+         <ANIMALS:species>Hippopotamus amphibius</ANIMALS:species>
+         <ANIMALS:class>Mammifère</ANIMALS:class>
+       </RDF:Description>
+    </RDF:li>
+  </RDF:Seq>
+</RDF:RDF>
+
+ +
NdT : les spécifications du format RDF précisent qu'il faut toujours indiquer l'espace de nom RDF pour les attributs du langage RDF comme ID about, resource etc. Pour être en conformité avec ces spécifications, vous devrez toujours déclarer un alias d'espace de nom (comme 'RDF' dans l'exemple précédent : xmlns:RDF="http://www.w3.org/1999/02/22-rdf-syntax-ns#") et l'utiliser pour les attributs RDF (ex : RDF:about="...").
+ +

Ici, trois enregistrements ont été décrits, un pour chaque animal. Chaque balise RDF:Description décrit un seul enregistrement. À l'intérieur de chaque enregistrement, trois champs sont décrits, 'name', 'species' et 'class'. Il n'est pas nécessaire que tous les enregistrements aient les mêmes champs mais cela donne plus de sens.

+ +

À chacun des trois champs a été donné un espace de nommage appelé 'ANIMALS', dont l'URL a été déclarée dans la balise RDF. Ce nom a été choisi pour sa signification dans ce cas précis, mais nous aurions pu en choisir un autre. La fonctionnalité d'espace de nommage est utile car le champ 'class' peut entrer en conflit avec celui utilisé pour les styles.

+ +

Les éléments Seq et li sont utilisés pour indiquer que les enregistrements sont dans une liste. C'est la même façon dont les listes HTML sont déclarées. L'élément Seq est utilisé pour indiquer que les éléments sont ordonnés. À la place de l'élément Seq, vous pouvez aussi utiliser l'élément Bag pour indiquer des données non ordonnées, et Alt pour indiquer des données où chaque enregistrement spécifie des valeurs alternatives (telles que des URLs mirroirs).

+ +

À l'intérieur d'un fichier XUL, il est fait référence aux ressources en combinant l'URL de l'espace de nommage suivit du nom du champ. Dans l'exemple ci-dessus, les URIs suivants générés peuvent être utilisés pour référer aux champs spécifiques :

+ + + + + + + + + + + + + + + + +
Nomhttp://www.www.some-fictitious-zoo.com/rdf#name
Espècehttp://www.www.some-fictitious-zoo.com/rdf#species
Classehttp://www.www.some-fictitious-zoo.com/rdf#class
+ +
+

Dans la suite, nous allons voir comment utiliser RDF pour peupler des éléments XUL

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

+ +

 

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/introduction_\303\240_xbl/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/introduction_\303\240_xbl/index.html" new file mode 100644 index 0000000000..7730e47a24 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/introduction_\303\240_xbl/index.html" @@ -0,0 +1,78 @@ +--- +title: Introduction à XBL +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Introduction_à_XBL +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Introduction_to_XBL +--- +

 

+
+

« PrécédentSuivant »

+
+

XUL a un langage qui lui est parent, XBL (eXtensible Bindings Language). Ce langage est utilisé pour déclarer le comportement des éléments graphiques de XUL.

+

Liaisons

+

Vous pouvez utiliser XUL pour définir la mise en page de l'interface utilisateur d'une application. Vous pouvez adapter l'apparence des éléments en leur appliquant des styles. Vous pouvez aussi créer de nouveaux thèmes en modifiant les styles. L'apparence basique de tous les éléments, comme les barres de défilement et les cases à cocher pourrait être modifiée en ajustant le style ou en déclarant des attributs à l'élément. Cependant, XUL ne fournit aucun moyen de vous permettre de changer le fonctionnement d'un élément. Par exemple, vous pourriez vouloir changer le fonctionnement des composants d'une barre de défilement. Pour cela, vous avez besoin de XBL.

+

Un fichier XBL contient un ensemble de liaisons. Chaque liaison décrit le comportement d'un élément graphique de XUL. Par exemple, une liaison pourrait être attachée à une barre de défilement. Le comportement décrit les propriétés et méthodes de la barre de défilement en plus de décrire les éléments de XUL qui la composent.

+

Comme XUL, XBL est un langage XML, ainsi il a des règles syntaxiques similaires. L'exemple suivant montre le squelette basique d'un fichier XBL :

+
<?xml version="1.0"?>
+<bindings xmlns="http://www.mozilla.org/xbl">
+  <binding id="binding1">
+    <!-- le contenu, propriétés, méthodes et descriptions d'évènements viennent ici -->
+  </binding>
+  <binding id="binding2">
+    <!-- le contenu, propriétés, méthodes et descriptions d'évènements viennent ici -->
+  </binding>
+</bindings>
+
+

L'élément bindings est l'élément racine d'un fichier XBL et contient un ou plusieurs élément binding. Chaque élément binding déclare une seule liaison. L'attribut id peut être utilisé pour identifier la liaison, comme dans l'exemple ci-dessus. Le modèle a deux liaisons, l'une appelée 'liaison1' et l'autre appelée 'liaison2'. L'une pourrait être attachée à une barre de défilement et l'autre à un menu. Une liaison peut être attachée à n'importe quel élément de XUL. Si vous utilisez des classes CSS, vous pouvez utiliser autant de liaisons que vous avez besoin. Notez l'espace de nommage de l'élément bindings dans le modèle ci-dessus. Il déclare que nous sommes en train d'utiliser une syntaxe XBL.

+

Vous assignez une liaison à un élément en déclarant la propriété CSS -moz-binding avec l'URL des fichiers de liaisons. Par exemple :

+
scrollbar {
+    -moz-binding: url('chrome://findfile/content/findfile.xml#binding1');
+}
+
+

L'URL pointe vers la liaison avec l'id 'binding1' dans le fichier 'chrome://findfile/content/findfile.xml'. La syntaxe '#binding1' est utilisée pour pointer vers une liaison spécifique, de la même façon que si vous pointiez vers une ancre dans un fichier HTML. Vous mettrez habituellement toutes vos liaisons dans un seul fichier. Le résultat dans cet exemple, est que toutes les barres de défilement auront leur comportement décrit par la liaison "binding1".

+

Une liaison déclare cinq types de choses :

+
  1. Le contenu : les éléments fils qui sont ajoutés à l'élément auquel la liaison est attachée.
  2. Les propriétés : les propriétés ajoutées à l'élément. Elles sont accessibles par un script.
  3. Les méthodes : les méthodes ajoutées à l'élément. Elles peuvent être appelées à partir d'un script.
  4. Les événements : les événements, comme les clics de souris et les appuis sur les touches auxquels l'élément répondra. La liaison peut ajouter des scripts pour fournir la manipulation par défaut. En plus de cela, de nouveaux événements peuvent être définis.
  5. Le style : adapte les propriétés de style que l'élément XBL possède.
    6. +
+

Exemple de liaison

+

L'élément box est suffisamment générique pour que vous l'utilisiez afin de créer des éléments graphiques personnalisés (bien que vous puissiez utiliser d'autres éléments, même un élément composé par vous-même). En assignant un attribut class à une balise box, vous associez une liaison aux boîtes qui possèdent cette classe. L'exemple suivant le démontre :

+
XUL (example.xul):
+
+<?xml version="1.0"?>
+<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+<?xml-stylesheet href="chrome://example/skin/example.css" type="text/css"?>
+
+<window
+     xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+  <box class="okcancelbuttons"/>
+</window>
+
+CSS (example.css):
+
+box.okcancelbuttons {
+    -moz-binding: url('chrome://example/skin/example.xml#okcancel');
+}
+
+XBL (example.xml):
+
+<?xml version="1.0"?>
+<bindings xmlns="http://www.mozilla.org/xbl"
+         xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+  <binding id="okcancel">
+    <content>
+      <xul:button label="OK"/>
+      <xul:button label="Annuler"/>
+    </content>
+  </binding>
+</bindings>
+
+

Cet exemple crée une fenêtre avec une seule boîte. La boîte a été déclarée pour avoir un attribut class de valeur 'okcancelbuttons'. La feuille de styles associée au fichier indique que les boîtes avec les classes 'okcancelbuttons' ont une liaison spécialisée, définie dans le fichier XBL. Vous pouvez employer d'autres éléments derrière l'élément box, même pour votre propre balise adaptée.

+

Nous verrons plus de détails concernant la partie XBL dans la section suivante. Cependant, pour récapituler, cet exemple entraîne l'ajout automatique de deux boutons dans la boîte, un bouton 'Ok' et un autre 'Annuler'.

+
+

Dans la prochaine section, nous verrons comment créer un contenu avec XBL.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/l'url_chrome/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/l'url_chrome/index.html new file mode 100644 index 0000000000..603447d0d8 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/l'url_chrome/index.html @@ -0,0 +1,45 @@ +--- +title: L'URL Chrome +slug: Archive/Mozilla/XUL/Tutoriel_XUL/L'URL_Chrome +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/The_Chrome_URL +--- +
+

« PrécédentSuivant »

+
+

Cette section décrit comment faire référence à des documents XUL et d'autres fichiers chrome.

+

L'URL Chrome

+

Les fichiers XUL peuvent être référencés par une URL HTTP habituelle tout comme les fichiers HTML (ou tout autre type d'URL). En revanche, les paquetages qui sont installés sur le système chrome de Mozilla doivent être référencés avec des URLs spéciales appelées « chrome ». Les paquetages livrés avec Mozilla seront déjà installés mais vous pouvez déclarer les votres.

+

Les paquetages installés ont l'avantage de ne pas avoir de restrictions de sécurité, ce qui est nécessaire pour de nombreuses applications. Un autre avantage comparé aux autres types d'URLs est qu'ils manipulent automatiquement les thèmes graphiques (NdT : skins) et les localisations (NdT : locales). Par exemple, une URL chrome vous permet d'adresser un fichier dans le thème, comme une image, sans avoir besoin de connaître le thème utilisé par l'utilisateur. Tant que les noms de fichiers sont identiques dans chaque thème, vous pouvez vous y faire référence via une URL chrome. Mozilla déterminera où le fichier est situé et renverra la bonne donnée. Cela signifie aussi que l'emplacement où le paquetage est installé n'est pas important pour être capable d'y accéder. Les URLs chrome sont indépendantes du lieu où les fichiers sont stockés physiquement. Il est donc simple d'écrire des applications contenant beaucoup de fichiers sans vous soucier des détails concernant leurs chemins d'accès.

+

La syntaxe de base d'une URL chrome est la suivante :

+
chrome://<paquetage>/<partie>/<fichier.xul>
+
+

Le texte <paquetage> est le nom du paquetage, tel que messenger ou editor. Le texte <partie> vaut soit 'content', soit 'skin', soit 'locale', selon la partie que vous voulez. <fichier.xul> est simplement le nom du fichier.

+

Exemple : chrome://messenger/content/messenger.xul

+

Ici, l'exemple se réfère à la fenêtre de messagerie. Vous pouvez pointer vers un fichier qui fait partie d'un thème en remplaçant 'content' par 'skin' et en changeant le nom du fichier. De même, vous pouvez pointer vers un fichier qui fait partie de la localisation en utilisant 'locale' au lieu de 'content'.

+

Quand vous ouvrez une URL chrome, Mozilla consulte sa liste de paquetages installés et essaie de trouver le fichier JAR qui correspond au nom et à la partie recherchés. Le lien entre des URLs et des fichiers JAR est précisé dans les fichiers manifest situés dans le répertoire chrome. Si vous déplaciez le fichier messenger.jar autre part et que vous modifiez le fichier manifest en conséquence, Thunderbird fonctionnerait encore puisque ce fichier n'est pas dépendant de l'emplacement de son installation. En utilisant des URLs chrome, ce genre de détails est secondaire pour Mozilla. De même, si les utilisateurs changent leur thème graphique, la partie 'skin' de l'URL chrome va pointer vers une autre série de fichiers sans que le XUL et les scripts en soient affectés.

+

Voici quelques exemples. Notez qu'aucunes URLs ne précisent un thème, une langue ou bien des répertoires spécifiques.

+
chrome://messenger/content/messenger.xul
+chrome://messenger/content/attach.js
+chrome://messenger/skin/icons/images/folder-inbox.gif
+chrome://messenger/locale/messenger.dtd
+
+

Pour des sous-répertoires, vous pouvez simplement les ajouter à la fin des URLs chrome. Les URLs suivantes font référence à la fenêtre des marque-pages, aussi bien pour la suite Mozilla que pour Firefox, puisque les noms des paquetages sont différents :

+
chrome://communicator/content/bookma...rksManager.xul (Mozilla)
+chrome://browser/content/bookmarks/b...rksManager.xul (Firefox)
+
+

Vous pouvez entrer des URLs chrome partout où des URLs normales peuvent être utilisées. Vous pouvez même les entrer directement dans la barre d'adresse d'une fenêtre du navigateur Mozilla. Si vous entrez une des URLs mentionnées ci-dessus dans la barre d'adresse du navigateur, vous devriez voir cette fenêtre apparaître comme une page Web le ferait et, dans la plupart des cas, elle sera fonctionnelle comme si elle était dans une fenêtre séparée. Cependant, quelques boîtes de dialogue pourraient ne pas bien fonctionner, si elles nécessitent des arguments fournis par la fenêtre qui les a ouvertes.

+

Vous pourriez voir également des URLs chrome sans noms de fichiers spécifiés, tel que :

+
chrome://navigator/content/
+
+

Dans le cas présent, seul le nom du paquetage et la partie sont spécifiés. Ce type de référence sélectionnera automatiquement un fichier approprié depuis le bon répertoire. Pour le contenu, un fichier avec le même nom que le paquetage et une extension xul sont choisis. Dans l'exemple ci-dessus, le fichier browser.xul est choisi. Pour messenger, messenger.xul serait sélectionné. Lorsque vous créez vos propres applications, vous devriez créer un fichier pour votre fenêtre principale avec le même nom que votre paquetage. Ainsi, elle pourra être appelée en utilisant cette syntaxe plus courte. C'est commode car alors, tout ce qu'a besoin de connaître un utilisateur pour pouvoir ouvrir l'application, c'est le nom du paquetage. Bien sûr, pour les extensions qui modifient l'interface du navigateur, l'utilisateur n'aura pas besoin de connaître l'URL car l'extension sera présente elle-même dans l'interface utilisateur.

+

Pour un thème, le fichier <paquetage>.css est choisi ; pour une localisation, le fichier <paquetage>.dtd est choisi.

+

Souvenez-vous, l'URL chrome n'est pas dépendante à un emplacement sur le disque. Les deux premières pièces sont le nom du paquetage et la partie ('content', 'skin', ou 'locale'). Bien qu'il soit courant de mettre les fichiers de contenu dans un répertoire appelé 'content', c'est une simple convention, et ces fichiers peuvent être placés dans une structure totalement différente.

+
+

Dans la section suivante, nous verrons comment créer des fichiers .manifest et des paquetages.

+
+

« PrécédentSuivant »

+
diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/la_structure_xul/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/la_structure_xul/index.html new file mode 100644 index 0000000000..30da6fedbc --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/la_structure_xul/index.html @@ -0,0 +1,158 @@ +--- +title: La structure XUL +slug: Archive/Mozilla/XUL/Tutoriel_XUL/La_structure_XUL +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/XUL_Structure +--- +
+

« PrécédentSuivant »

+
+ +

Nous commencerons par regarder comment le système de fichiers de XUL est organisé sous Mozilla.

+ +

Comment XUL est géré

+ +

Dans Mozilla, XUL est géré pratiquement de la même manière que du HTML ou d'autres types de contenu. Lorsque vous entrez l'URL d'une page HTML dans le champs de saisie d'adresse du navigateur, ce dernier localise le site Web et télécharge le contenu. Le moteur d'affichage de Mozilla traite le contenu du code source HTML, et le transforme en un arbre de document. L'arbre est alors converti en un ensemble d'objets qui peuvent être affichés sur l'écran. Des styles CSS, des images et d'autres technologies sont utilisés pour contrôler la présentation. XUL fonctionne de la même manière.

+ +

En fait, sous Mozilla, tous les types de documents, qu'il soit HTML ou XUL, ou même SVG, sont tous traités par le même code sous-jacent. Cela signifie que les mêmes propriétés CSS peuvent être utilisées pour styler à la fois du XUL et du HTML, et beaucoup de spécificités peuvent être partagées entre les deux. Cependant, quelques fonctionnalités restent spécifiques au HTML, comme les formulaires, et d'autres restent spécifiques au XUL, comme les overlays. Puisque les fichiers XUL et HTML sont traités de la même manière, vous pouvez les charger à partir du système de fichiers local, d'une page Web, d'une extension, ou d'une application autonome XULRunner.

+ +

Les contenus provenant de sources distantes, comme par exemple http://localhost/~username/, qu'ils soient en HTML, XUL ou tout autre type de document, sont limités dans les opérations qu'ils peuvent réaliser pour des raisons de sécurité. C'est pour cela que Mozilla fournit une méthode pour installer localement du contenu et de l'enregistrer dans son système chrome. Une adresse URL spéciale chrome:// est alors employée. Les fichiers ouverts depuis une adresse chrome reçoivent des privilèges plus élevés pour accéder aux fichiers locaux, ils peuvent accéder aux préférences et aux marque-pages, et réaliser d'autres opérations nécessitant certains privilèges. Bien entendu, les pages Web ne disposent pas de ces privilèges, à moins qu'ells soient signées avec un certificat numérique et que l'utilisateur ait obtenu un accès pour cela.

+ +

La déclaration de paquetage chrome est la méthode par laquelle les extensions de Firefox ajoutent des fonctionnalités au navigateur. Les extensions sont de petits paquetages de fichiers XUL, Javascript, feuilles de styles et images, rassemblés en un seul fichier. Ce fichier peut être créé en utilisant un outil ZIP. Quand l'utilisateur le télécharge, il est installé sur sa machine. Il sera intégré dans le navigateur en utilisant une fonctionnalité spécifique appelée overlay, qui permet au XUL de l'extension et au XUL du navigateur de se combiner ensemble. Pour l'utilisateur, c'est comme si l'extension avait modifié le navigateur, mais en réalité, le code est séparé et l'extension peut être désinstallée facilement.

+ +

Les paquetages déclarés ne sont pas nécessaires pour utiliser les overlays, bien sûr. Si ils ne le sont pas, vous ne pourrez pas y accéder via l'interface principale du navigateur, mais vous pourrez toujours y accéder depuis une URL chrome, si vous la connaissez.

+ +

Des applications XUL autonomes peuvent également employer du code XUL inclus de façon similaire, mais il fera partie intégrante de l'application plutôt que de devoir être installé séparément comme une extension. Cependant, ce code XUL devra être déclaré dans le système chrome pour pouvoir s'afficher dans l'interface utilisateur de l'application.

+ +

Il faut savoir que le navigateur Mozilla lui même regroupe en réalité toute une série de paquetages contenant des fichiers XUL, du JavaScript et des feuilles de styles. Ces fichiers sont ouverts depuis une URL chrome et ils ont des privilèges accrus et fonctionnent comme dans tous autres paquetages. Bien sûr, le navigateur est bien plus conséquent et plus sophistiqué que la plupart des extensions. Firefox et Thunderbird contiennent de nombreux composants qui sont tous écris en XUL et qui sont tous acceesibles via des URLs chrome. Vous pouvez examiner ces paquetages en parcourant le sous répertoire chrome où Firefox ou une application XUL a été installé.

+ +

L'URL chrome commence toujours par 'chrome://'. De la même manière que les URLs 'http://' réfèrent toujours aux sites Web distants, et que les URL 'file://' réfèrent toujours aux fichiers locaux, les URL 'chrome://' réfèrent toujours aux paquetages installés et aux extensions. Nous en verrons plus sur la syntaxe des URL chrome dans la prochaine section. Il est important de noter que lorsque l'on accède à du contenu depuis une URL chrome, il obtient les privilèges avancés tel que décrit plus haut contrairement aux autres types d'URL. Par exemple, une URL HTTP n'a pas de privilèges particuliers et une erreur apparaîtrait si une page Web essaie, par exemple, de lire un fichier local, alors qu'un fichier chargé depuis une URL chrome pourra lire des fichiers sans restrictions.

+ +

Cette distinction est importante. Elle signifie qu'il y a certaines choses que le contenu des pages Web ne peut pas faire, comme lire les marque-pages de l'utilisateur. Cette distinction n'est pas basée sur le type du contenu affiché ; seul le type de l'URL est important. HTML et XUL placés sur un site Web n'ont pas de permissions supplémentaires. Mais HTML et XUL chargés avec une URL chrome obtiennent des permissions avancées.

+ +

Si vous désirez utiliser XUL sur un site Web, il vous suffit de mettre les fichiers XUL sur le site Web comme vous le feriez avec un fichier HTML, et indiquer leurs URLs dans un navigateur (http://localhost/xul.php). Assurez vous que votre serveur Web est configuré pour transmettre les fichiers XUL avec le type mime application/vnd.mozilla.xul+xml (par ex en PHP header('content-type: application/vnd.mozilla.xul+xml');). Ce type mime permet à Mozilla de faire la différence entre HTML et XUL. Mozilla ne tient pas compte de l'extension du fichier sauf pour lire les fichiers locaux, mais vous devriez utiliser l'extension .xul pour tous les fichiers XUL. Vous pouvez ouvrir les fichiers XUL sur votre propre machine en les ouvrant dans le navigateur, ou en double cliquant sur le fichier dans votre gestionnaire de fichiers.

+ +
Souvenez vous que les fichiers XUL distants ont des restrictions significatives sur ce qu'ils peuvent faire.
+ +

Type de documents : HTML XML XUL CSS

+ +

Tandis que la plupart des fonctionnalités sont partagées entre HTML et XUL, Mozilla utilise différents types de document pour chacun d'eux. Il y a trois principaux types de document dans Mozilla : HTML, XML et XUL. Bien entendu, le type HTML est utilisé pour les documents HTML, le type XUL est utilisé pour les documents XUL, et le type XML est utilisé pour les autres documents en XML. Puisque XUL est aussi du XML, il correspond à un sous-type du type générique XML. Il y a de subtiles différences dans les fonctionnalités. Par exemple, alors que les contrôles de formulaire dans les pages HTML sont accessibles via la propriété document.forms, cette propriété n'est pas disponible pour les documents XUL puisque XUL n'a pas de formulaire dans le sens HTML du terme. D'un autre coté, les fonctionnalités spécifiques de XUL comme les overlays ou les gabarits ne sont utilisables que dans les documents XUL.

+ +

La distinction entre les documents est importante. Certaines fonctionnalités XUL sont utilisables dans des documents HTML ou XML si elles ne sont pas spécifiques au type de document  mais d'autres seront liées au type du document. Par exemple, vous pourrez vous servir des types de mise en page XUL dans d'autres documents car ils ne reposent pas sur le type de document pour fonctionner.

+ +

Pour résumer les points précédents :

+ + + +

Les prochaines sections décrivent la structure de base d'un paquetage chrome qui peut être installé dans Mozilla. Cependant, si vous voulez seulement démarrer la création d'une simple application, rendez vous directement sur la page Créer une fenêtre et revenez sur cette section plus tard.

+ +

Organisation d'un paquetage

+ +

Mozilla est conçu de telle manière que vous pouvez pré-installer autant de composants que vous le souhaitez. Chaque extension est également un composant muni d'une adresse chrome différente. Il y a également un composant par thèmes graphiques ou langues. Chacun de ces composants, ou paquetages, est constitué d'un ensemble de fichiers décrivant l'interface utilisateur. Par exemple, le composant de messagerie décrit la fenêtre listant les messages des courriers, la fenêtre de rédaction et les boîtes de dialogues du carnet d'adresses.

+ +

Les paquetages inclus dans Mozilla sont situés dans le répertoire chrome situé dans le répertoire d'installation de Mozilla. Ce répertoire chrome est l'endroit où sont situés tous les fichiers qui décrivent l'interface utilisateur employée par Mozilla, tels que le client de messagerie et d'autres applications. Typiquement pour une application, vous placerez vos fichiers XUL dans ce répertoire, sauf pour les extensions où les fichiers sont placés dans le répertoire extensions du profil utilisateur. La simple copie d'un fichier XUL dans le répertoire 'chrome' ne lui donne pas de droits supplémentaires et ne le rend pas accessible depuis une URL chrome. Pour que des droits supplémentaires lui soit attribués, vous devrez créer un fichier manifest et le placez dans le répertoire chrome. Ce fichier est facile à créer car il n'est composé que de quelques lignes. Il sert orienter une URL chrome vers l'emplacement d'un fichier ou d'un répertoire sur le disque où les fichiers XUL sont situés. Vous trouverez plus de détails sur la manière de créer ce fichier dans une prochaine section.

+ +

La seule manière pour du contenu d'être accessible depuis une URL chrome est de créer un paquetage comme décrit dans les prochaines sections. Ce répertoire est nommé 'chrome' en référence aux répertoires où sont placés les paquetages chrome de Mozilla.

+ +

Pour augmenter la confusion, il y a deux autres endroits où le mot "chrome" peut apparaître. Il y a l'argument en ligne de commande -chrome et le modificateur "chrome" de la fonction window.open(). L'appel à l'une de ces deux fonctionnalités n'autorise pas plus de privilèges. Elles sont plutôt utilisées pour ouvrir une nouvelle fenêtre principale sans l'interface utilisateur du navigateur comme les menus ou la barre d'outils. Vous utiliserez en général ces caractéristiques dans des applications XUL plus complexes lorsque vous ne voulez pas de fenêtre de navigation autour de vos boîtes de dialogue.

+ +

Les fichiers d'un paquetage sont généralement combinés dans un simple fichier JAR. Un fichier JAR peut être créé et examiné en utilisant un utilitaire ZIP. Par exemple, ouvrez quelques uns des fichiers JAR du répertoire chrome de Mozilla pour voir la structure de leurs paquetages. Bien qu'il soit normal de combiner les fichiers dans un fichier JAR, les paquetages peuvent également être accessibles dans une forme décompressée à l'intérieur d'un ensemble de répertoire. Généralement, vous ne distribuerez pas un paquetage de cette façon, mais c'est une méthode pratique pendant le développement puisque vous pouvez éditer les fichiers du répertoire et ensuite les recharger sans avoir à ré-empaqueter ou réinstaller l'ensemble.

+ +

Par défaut, les applications Mozilla analysent les fichiers XUL et les scripts, et mémorisent une version pré-compilée dans une session de l'application afin d'améliorer les performances. De ce fait, les fichiers XUL ne seront pas rechargés même si les fichiers sources ont été modifiés. Pour modifier ce mécanisme, il est nécessaire de modifier la préférence nglayout.debug.disable_xul_cache. Dans Firefox, cette préférence doit être ajoutée et définie à 'true' dans les préférences de l'utilisateur en tapant "about:config" dans la barre d'adresse. Vous pouvez aussi éditer manuellement le fichier des préférences user.js et y ajouter la ligne suivante :

+ +
pref("nglayout.debug.disable_xul_cache", true);
+
+ +

Il y a habituellement trois parties différentes dans un paquetage chrome, bien qu'elles soient facultatives. Chaque partie est enregistrée dans un répertoire différent. Ces trois ensembles décris en dessous sont le contenu, le thème graphique et la localisation. Un paquetage particulier pourrait fournir un ou plusieurs thèmes et localisations, mais un utilisateur peut les remplacer par les siens. De plus, un paquetage peut inclure plusieurs applications différentes, chacune accessible via des URLs chrome différentes. Le système de paquetage est suffisamment souple pour n'inclure que les parties dont vous avez besoin, et permettre le téléchargement séparé d'autres parties, comme le texte pour les différentes langues.

+ +

Les trois types de paquetages chrome sont :

+ +

 

+ +
+
Content - Fenêtres et scripts
+
Contient les déclarations des fenêtres et des éléments d'interface utilisateur. Ceux-ci sont stockés dans les fichiers XUL, qui ont l'extension xul. Il peut y avoir plusieurs fichiers XUL, mais la fenêtre principale devrait toujours avoir un nom de fichier identique au nom du paquetage. Par exemple, le paquetage editor contiendra un fichier appelé editor.xul. Les scripts (NdT : javascript) sont placés dans des fichiers séparés à côté des fichiers XUL.
+
Skin - feuilles de style, images et autres fichiers de thèmes
+
Les feuilles de style décrivent des détails de l'aspect d'une fenêtre. Elles sont stockées séparément des fichiers XUL pour faciliter la modification du thème d'une application. Toutes les images utilisées sont également stockées ici.
+
Locale - fichiers spécifiques de langues
+
Tous les textes qui sont affichés dans une fenêtre sont stockés séparément. De cette façon, un utilisateur peut avoir une configuration pour sa propre langue.
+
+ +

Paquetages de contenu

+ +

Le nom du fichier JAR devrait décrire ce qu'il contient, mais vous pouvez vous en assurer en regardant son contenu. Examinons par exemple le paquetage du navigateur inclus avec Firefox. Si vous décompressez les fichiers de browser.jar, vous verrez qu'ils forment une structure de répertoire ressemblant à :

+ +
content
+   browser
+      browser.xul
+      browser.js
+      --d'autres fichiers XUL et JS ici--
+      bookmarks
+         --les fichiers pour les marque-pages ici--
+      preferences
+         --les fichiers pour les préférences ici--
+.
+.
+.
+ +

On peut facilement identifier cela comme le contenu d'un paquetage, car le dossier supérieur s'appelle content. Pour les thèmes, le dossier aurait été appelé skin et pour les localisations, il aurait été appelé locale. En fait, ce n'est pas une obligation mais vous devriez suivre cette convention pour rendre votre paquetage plus clair. Certains paquetages peuvent inclure une section content, skin et locale. Dans ces paquetages, vous trouverez un sous-répertoire pour chaque section. Par exemple, Chatzilla est distribué de cette manière.

+ +

Le dossier content/browser contient un certain nombre de fichiers avec les extensions .xul et .js. Les fichiers XUL sont ceux qui ont une extension .xul. Les fichiers avec l'extension .js sont des fichiers de JavaScript contenant les scripts qui gèrent les fonctionnalités d'une fenêtre. Beaucoup de fichiers XUL ont un ou plusieurs fichiers de script qui leur est associé.

+ +

Dans la liste ci-dessus, deux fichiers ont été montrés. Il y en a évidemment d'autres, mais qui n'apparaissent pas pour des raisons de simplicité. Le fichier browser.xul est le fichier XUL qui décrit la fenêtre principale du navigateur. La fenêtre principale du contenu d'un paquetage devrait toujours porter le même nom que le nom du paquetage, avec une extension .xul. Dans ce cas, le paquetage étant nommé 'browser', le fichier sera browser.xul. D'autres fichiers XUL vont décrire des fenêtres différentes, comme par exemple le fichier pageInfo.xul qui décrit la boîte de dialogue 'Information sur la page'.

+ +

Tous les paquetages contiennent un fichier contents.rdf qui décrit le paquetage, son auteur et les overlays qu'il utilise. Ce fichier est cependant devenu obsolète et a été remplacé par une mécanisme plus simple. Cette nouvelle méthode est le fichier manifest mentionné précédemment, et vous trouverez ce fichier dans le répertoire chrome avec une extension .manifest. Par exemple, browser.manifest décrit le paquetage browser.

+ +

Plusieurs sous-répertoires, tels que bookmarks et preferences, décrivent des sections complémentaires au composant du navigateur. Ils sont placés dans des répertoires différents pour une meilleure organisation des fichiers.

+ +

Styles et thèmes graphiques

+ +

Bien que le code sous-jacent de Mozilla les appelle skins et que l'interface utilisateur les appelle thèmes, ils désignent la même chose. Le fichier classic.jar décrit le thème graphique inclus par défaut avec Firefox. La structure est semblable aux paquetages de contenu. Examinons par exemple le fichier classic.jar :

+ +
skin
+   classic
+      browser
+         browser.css
+         -- les autres fichiers thèmes du navigateur sont ici --
+      global
+         -- les fichiers thèmes globaux sont ici --
+.
+.
+.
+ +

Ici encore, le respect de cette structure de répertoires n'est pas nécessaire, mais elle est conventionnelle. En réalité, vous pouvez mettre les fichiers dans un seul répertoire de niveau supérieur sans aucun sous-répertoire. Cependant, pour des applications plus importantes, des sous-répertoires servent à séparer les différents composants. Dans l'exemple précédent, un répertoire est dédié aux fichiers du thème graphique du navigateur et un autre pour les fichiers du thème global. Le répertoire global contient les fichiers de styles applicables à tous les paquetages. Ces fichiers s'appliquent à tous les composants et seront inclus à toutes vos applications autonomes. La partie globale définit l'apparence de tous les éléments graphiques communs, tandis que les autres répertoires contiennent les fichiers propres à ces applications. Firefox inclut à la fois les fichiers du thème graphique global et du navigateur dans une seule archive, mais ils pourraient être inclus séparément.

+ +

Un thème se compose de fichiers CSS et d'un certain nombre d'images utilisés pour définir l'aspect d'une interface. Le fichier browser.css est utilisé par browser.xul et contient les styles pour définir l'apparence des différences parties de l'interface du navigateur. À nouveau, notez le nom du fichier browser.css, qui a le même nom que le paquetage. En changeant de fichier CSS, vous pouvez modifier l'apparence d'une fenêtre sans changer son fonctionnement. C'est ainsi que vous pouvez créer un nouveau thème. La partie XUL est toujours la même, mais la partie contenant le thème peut varier indépendamment.

+ +

Localisation

+ +

Le fichier en-US.jar décrit l'information de langage pour chaque composant, dans le cas présent pour l'anglais des États-Unis. Comme pour les thèmes, chaque fichier de langue contient les fichiers qui indiquent le texte utilisé par le paquetage pour une langue spécifique. La structure de 'locale' étant similaire aux autres, elle ne sera pas listée ici.

+ +

Le texte localisé est stocké dans deux types de fichiers, des fichiers DTD et des fichiers de propriétés. Les fichiers DTD ont une extension .dtd et contiennent les déclarations d'entités, une pour chaque chaîne de caractères qui est utilisée dans une fenêtre. Par exemple, le fichier browser.dtd contient des déclarations d'entités pour chaque commande du menu. En outre, des raccourcis clavier pour chaque commandes sont également définis, parce qu'ils peuvent être différents selon la langue. Les fichiers DTD sont utilisés par des fichiers XUL, et donc en général, vous en aurez un par fichier XUL. La partie 'locale' contient également des fichiers de propriétés qui sont similaires, mais qui sont utilisés par les fichiers de script. Le fichier browser.properties contient quelques chaînes de caractères de ce type.

+ +

Cette structure vous permet de traduire Mozilla ou un composant dans une langue différente en ajoutant juste une nouvelle partie 'locale' pour cette langue. Vous n'avez pas à modifier le code XUL. De plus, d'autres personnes peuvent fournir des paquetages séparés qui appliquent des thèmes ou des localisations à votre partie contenu, apportant ainsi un nouveau thème ou une nouvelle langue sans avoir à modifier le paquetage original.

+ +

Autres paquetages

+ +

Il existe un paquetage spécial appelé toolkit (ou global). Nous avions déjà vu le répertoire global pour des thèmes. Le fichier toolkit.jar contient la partie du contenu lui correspondant. Il contient quelques boîtes de dialogues et définitions globales. Il définit également l'aspect par défaut et les fonctionnalités des divers éléments graphiques tels que des champs de saisie et des boutons. Les fichiers situés dans la partie globale de l'archive du thème contiennent l'apparence par défaut de tous les éléments XUL d'interface. Le paquetage toolkit est utilisé par toutes les applications XUL.

+ +

Ajouter un paquetage

+ +

Mozilla place dans le répertoire chrome les paquetages qui sont inclus avec l'installation, mais il n'y a pas d'obligation à cela. Lors de l'installation d'un autre paquetage, vous pouvez le placer n'importe où sur le disque dès lors que son fichier manifest pointe vers lui. Il est commun d'installer les nouveaux paquetages dans le répertoire chrome simplement par convenance. Cependant ils fonctionneront aussi bien à partir d'un autre répertoire, ou de quelque part sur votre réseau local. Vous ne pouvez pas les placer sur un site distant, à moins que le site distant soit monté sur le système de fichiers local.

+ +

Il y a deux répertoires chrome utilisés par les applications XUL : l'un est au même emplacement que l'application, l'autre fait partie du profil utilisateur. Le premier permet aux paquetages d'être partagés à tous les utilisateurs tandis que le second permet un accès aux paquetages à un utilisateur spécifique. Les extensions qui sont installées dans un répertoire extension séparé ne sont également accessibles qu'à un utilisateur spécifique. Chaque fichiers manifest situés dans l'un ou l'autre des répertoires chrome seront examinés pour voir quels paquetages sont installés.

+ +
+

Dans la prochaine section, nous regarderons comment se référer aux paquetages en utilisant les URL chrome.

+ +
+

« PrécédentSuivant »

+
diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/le_mod\303\250le_de_bo\303\256te/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/le_mod\303\250le_de_bo\303\256te/index.html" new file mode 100644 index 0000000000..0075e90f94 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/le_mod\303\250le_de_bo\303\256te/index.html" @@ -0,0 +1,146 @@ +--- +title: Le modèle de boîte +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Le_modèle_de_boîte +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/The_Box_Model +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Dans cette section, nous allons voir comment XUL gère la mise en page.

+ +

Introduction aux boîtes

+ +

La forme principale de mise en page dans XUL s'appelle le « Modèle de Boîte ». Ce modèle vous permet de diviser une fenêtre en une série de boîtes. Les éléments à l'intérieur d'une boîte se placeront horizontalement ou verticalement. En combinant une série de boîtes, d'éléments spacer et d'éléments avec des attributs flex, vous pouvez contrôler la mise en page d'une fenêtre.

+ +

Bien qu'une boîte soit la partie fondamentale de la disposition d'éléments dans XUL, elle suit quelques règles très simples. Une boîte peut présenter ses enfants dans une des deux orientations, soit horizontalement, soit verticalement. Une boîte horizontale aligne ses éléments horizontalement et une boîte verticale place ses éléments verticalement. Vous pouvez vous représenter une boîte comme étant une rangée ou une colonne d'un tableau HTML. Divers attributs placés sur les éléments enfants, en plus de certaines propriétés de style CSS, contrôlent la position et la taille exactes des enfants.

+ +

Éléments de boîte

+ +

La syntaxe de base d'une boîte est la suivante :

+ +
<hbox>
+   <!-- éléments horizontaux -->
+</hbox>
+
+<vbox>
+   <!-- éléments verticaux -->
+</vbox>
+
+ +

L'élément hbox est utilisé pour créer une boîte orientée horizontalement. Chaque élément placé dans la hbox sera placé horizontalement sur une rangée. L'élément vbox est utilisé pour créer une boîte orientée verticalement. Les éléments ajoutés seront placés les uns en dessous des autres en colonne.

+ +

Il existe également un élément box générique qui s'oriente horizontalement par défaut, ce qui veut dire qu'il est similaire à l'élément hbox. Cependant, vous pouvez utiliser l'attribut orient pour contrôler l'orientation dans la boîte. Vous pouvez positionner cet attribut à la valeur 'horizontal' pour créer une boîte horizontale et à la valeur 'vertical' pour créer une boîte verticale.

+ +

Ainsi, les deux lignes ci-dessous sont équivalentes :

+ +
<vbox></vbox>
+
+<box orient="vertical"></box>
+
+ +

L'exemple suivant montre comment placer trois boutons verticalement.

+ +

Exemple 1 : Source Voir

+ +
Image:xultu_boxes-ex1.png
+ +
<vbox>
+   <button id="yes" label="Oui"/>
+   <button id="no" label="Non"/>
+   <button id="maybe" label="Peut-être"/>
+</vbox>
+
+ +

Ces trois boutons sont orientés verticalement comme le spécifie la boîte. Pour faire en sorte que les boutons soient orientés horizontalement, tout ce que vous avez à faire est de remplacer l'élément vbox par l'élément hbox.

+ +

Exemple d'invite de login

+ +

Vous pouvez ajouter autant d'éléments que vous le souhaitez à l'intérieur de la boîte, y compris d'autres boîtes. Dans le cas d'une boîte horizontale, chaque élément additionnel sera placé à la droite du précédent. Les éléments ne se chevauchent pas, donc plus vous ajoutez d'éléments, plus large est la fenêtre. De même, chaque élément ajouté dans une boîte verticale sera placé sous le précédent. L'exemple ci-dessous montre une simple demande de login :

+ +

Exemple 2 : Source Voir

+ +
Image:xultu_boxes-ex2.png
+ +
<vbox>
+   <hbox>
+     <label control="login" value="Login :"/>
+     <textbox id="login"/>
+   </hbox>
+   <hbox>
+     <label control="pass" value="Mot de passe :"/>
+     <textbox id="pass"/>
+   </hbox>
+   <button id="ok" label="OK"/>
+   <button id="cancel" label="Annuler"/>
+</vbox>
+
+ +

Ici quatre éléments ont été orientés verticalement, deux balises hbox internes et deux éléments button. Notez que seuls les éléments qui sont des descendants directs de la boîte sont orientés verticalement. Les libellés et les boîtes de texte sont à l'intérieur d'éléments hbox, donc ils sont orientés suivant ces boîtes, lesquelles sont horizontales. Vous pouvez voir sur l'image que chaque libellé et leur champ de saisie est orienté horizontalement.

+ +

Alignement des champs de saisie

+ +

Si vous regardez attentivement l'image de la boîte de dialogue de login, vous verrez que les deux champs de saisie ne sont pas alignés horizontalement. Ce serait certainement mieux s'ils l'étaient. Pour y parvenir, nous devons ajouter quelques boîtes supplémentaires.

+ +

Exemple 3 : Source Voir

+ +
Image:xultu_boxes-ex3.png
+ +
<vbox>
+   <hbox>
+     <vbox>
+       <label control="login" value="Login :"/>
+       <label control="pass" value="Mot de passe :"/>
+     </vbox>
+     <vbox>
+       <textbox id="login"/>
+       <textbox id="pass"/>
+     </vbox>
+   </hbox>
+   <button id="ok" label="OK"/>
+   <button id="cancel" label="Annuler"/>
+</vbox>
+
+ +

Notez que les champs de saisie sont maintenant alignés l'un avec l'autre. Pour cela, il nous a fallu ajouter des boîtes à l'intérieur de la boîte principale. Les deux libellés et les champs de saisie sont placés à l'intérieur d'une boîte horizontale. Ensuite, les libellés sont placés à l'intérieur d'une autre boîte, une verticale cette fois, de même que les champs de saisie. C'est cette boîte interne qui oriente verticalement les éléments. La boîte horizontale est nécessaire puisque nous voulons que la vbox des libellés et que la vbox des champs de saisie soient placées l'une à côté de l'autre. Si cette boîte était enlevée, les champs de saisie apparaîtraient sous les libellés.

+ +

L'ennui est que le libellé « Mot de passe » est désormais trop haut. Il nous faudra utiliser l'élément grid pour résoudre ce phénomène, ce que nous verrons dans une prochaine section.

+ +
+

Des boîtes dans la boîte de dialogue de recherche de fichiers

+ +

Ajoutons quelques boîtes à la boîte de dialogue de recherche de fichiers. Une boîte verticale sera ajoutée autour de tous les éléments, et une boîte horizontale sera ajoutée autour du champ de saisie et des boutons. Le résultat sera que les boutons apparaîtront sous le champ de saisie.

+ +

Source Voir

+ +
<vbox flex="1">    <description>     Entrez votre critère de recherche ci-dessous et sélectionnez le bouton      Rechercher pour démarrer la recherche.   </description>      <hbox>
+    <label value="Rechercher :" control="find-text"/>
+    <textbox id="find-text"/>
+  </hbox>    <hbox>     <spacer flex="1"/>
+
+    <button id="find-button" label="Rechercher"/>
+    <button id="cancel-button" label="Annuler"/>
+  </hbox> </vbox>
+
+ +
Image:xultu_boxes1.png
+ +

La boîte verticale entraîne l'orientation verticale du texte principal, de la boîte contenant le champ de saisie ainsi que de la boîte avec les deux boutons. Les boîtes internes orientent leurs éléments horizontalement. Comme vous pouvez le voir sur l'image, le libellé et le champ de saisie de texte sont placés côte à côte. L'élément spacer et les deux boutons sont aussi placés horizontalement dans leur boîte.

+ +
Notez que l'élément spacer, parce qu'il est flexible, force les boutons à apparaître sur le côté droit.
+
+ +
+

Dans la prochaîne section, nous verrons comment spécifier les tailles des éléments individuellement et comment contraindre leurs tailles.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/les_bo\303\256tes_de_groupe/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/les_bo\303\256tes_de_groupe/index.html" new file mode 100644 index 0000000000..bba6701791 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/les_bo\303\256tes_de_groupe/index.html" @@ -0,0 +1,101 @@ +--- +title: Les boîtes de groupe +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Les_boîtes_de_groupe +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Groupboxes +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Cette section décrit la façon d'inclure des éléments dans des groupes.

+ +

Les boîtes de groupes

+ +

HTML fournit un élément, fieldset, qui peut être utilisé pour regrouper plusieurs éléments. Une bordure est affichée autour des éléments pour montrer qu'ils sont en relation. Un exemple pourrait être un groupe de cases à cocher. XUL fournit un élément équivalent, groupbox, qui peut être utilisé pour un usage similaire.

+ +

Comme son nom l'indique, groupbox est un type de boîte. Ce qui signifie que les éléments à l'intérieur sont alignés selon l'application des règles des boîtes. Il y a deux différences entre les boîtes de groupes et les boîtes normales :

+ + + +

Puisque les boîtes de groupe sont des types de boîtes, vous pouvez utiliser les mêmes attributs tels que orient et flex. Vous pouvez mettre tous les éléments que vous voulez à l'intérieur de la boîte, mais il devra typiquement y avoir un rapport entre eux.

+ +

Le libellé en haut de la boîte de groupe peut être créé en utilisant l'élément caption. Il fonctionne comme l'élément HTML legend. Un simple élément caption placé en tant que première balise fille est suffisant.

+ +

Un simple exemple groupbox

+ +

L'exemple ci-dessous montre un groupbox simple :

+ +

Exemple 1: Source Voir

+ +
Image:xultu_titledbox1.png
+ +
<groupbox>
+   <caption label="Réponse"/>
+   <description value="Banane"/>
+   <description value="Mandarine"/>
+   <description value="Cabine téléphonique"/>
+   <description value="Kiwi"/>
+</groupbox>
+
+ +

Cet exemple affiche quatre bouts de texte entourés par la boîte avec le libellé Réponse. Notez que la boîte de groupe a une orientation verticale par défaut nécessaire pour avoir les éléments texte empilés en une seule colonne.

+ +

Légendes plus complexes

+ +

Vous pouvez aussi ajouter des éléments fils à l'interieur de l'élément caption pour créer une légende plus complexe. Par exemple, le panneau de préférence des polices de caractères de mozilla utilise un liste déroulante comme légende. Bien que vous puissiez utiliser n'importe quel contenu, vous utiliserez la plupart du temps une case à cocher ou une liste déroulante.

+ +

Exemple 2: Source Voir

+ +
Image:xultu_groupbox2.png
+ +
<groupbox flex="1">
+   <caption>
+     <checkbox label="Activer la sauvegarde"/>
+   </caption>
+   <hbox>
+     <label control="dir" value="Répertoire :"/>
+     <textbox id="dir" flex="1"/>
+   </hbox>
+   <checkbox label="Compresser les fichiers archivés"/>
+</groupbox>
+
+ +

Dans cet exemple, une case à cocher a été utilisée comme légende. Nous devons utiliser un script pour activer et désactiver le contenu de la boîte de groupe, quand la case est cochée ou décochée. La boîte de groupe contient une boîte horizontale avec un libellé et un champ de saisie. Ces deux éléments sont flexibles donc le champ de saisie s'agrandit quand la fenêtre s'agrandit. La case à cocher supplémentaire apparait en dessous du champ de saisie à cause de l'orientation verticale de la boîte de groupe. Nous ajouterons une boîte de groupe à notre exemple de recherche de fichiers dans la prochaine section.

+ +

Les groupes de boutons radio

+ +

Vous pouvez utiliser l'élément radiogroup pour regrouper des éléments boutons radios. radiogroup est un type de boîte. Vous pouvez y mettre n'importe quel élément, et à part le comportement spécial sur les boutons radios, il fonctionne comme n'importe quelle autre boîte.

+ +

Tous les boutons radios placés à l'intérieur d'un radiogroup seront groupés ensemble, même s'ils sont à l'intérieur de boîtes imbriquées. Ce fonctionnement est utilisé pour ajouter des éléments supplémentaires à l'intérieur de la structure, comme dans l'exemple suivant :

+ +

Exemple 3: Source Voir

+ +
<radiogroup>
+   <radio id="no" value="no" label="Pas de nombre"/>
+   <radio id="random" value="random" label="Nombre aléatoire"/>
+   <hbox>
+     <radio id="specify" value="specify" label="Nombre spécifique :"/>
+     <textbox id="specificnumber"/>
+   </hbox>
+</radiogroup>
+
+ +
Notez que l'élément radiogroup n'a pas de bordure. Vous devez placer un élément groupbox autour si vous voulez une bordure et une légende.
+ +
+

Maintenant, nous allons utiliser tout ce que nous avons appris pour ajouter des éléments supplémentaires dans la boîte de dialogue de recherche de fichiers.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/les_champs_de_saisie/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/les_champs_de_saisie/index.html new file mode 100644 index 0000000000..6b2501c9fc --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/les_champs_de_saisie/index.html @@ -0,0 +1,126 @@ +--- +title: Les champs de saisie +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Les_champs_de_saisie +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Input_Controls +--- +
+

« PrécédentSuivant »

+
+ +

 

+ +

XUL possède des éléments qui sont similaires aux champs des formulaires HTML.

+ +

Les champs de saisie de texte

+ +

Le HTML possède une balise input pouvant être utilisée comme champ de saisie de texte. XUL possède un élément similaire, textbox, utilisé comme champ de saisie de texte. Sans aucun attribut, l'élément textbox crée une boîte dans laquelle l'utilisateur peut entrer du texte. Les boîtes de texte acceptent plusieurs attributs similaires à la balise input de l'HTML. En voici quelques uns :

+ +
+
id 
+
Un identifiant unique permettant d'identifier la boîte de texte.
+
class 
+
La classe du style de la boîte de texte.
+
value 
+
Si vous voulez donner une valeur par défaut à la boîte de texte, renseignez l'attribut value.
+
disabled 
+
Mettez la valeur 'true' pour empêcher l'insertion de texte.
+
type 
+
Vous pouvez renseigner cet attribut avec la valeur spéciale 'password' pour créer une boîte de texte dans laquelle tout ce qui est saisi est caché. Il est utilisé habituellement pour les champs de saisie de mot de passe.
+
maxlength 
+
Le nombre maximum de caractères que l'on peut saisir dans la boîte de texte.
+
+ +
Notez que, tandis qu'en HTML différentes sortes de champs peuvent être créées avec l'élément input, il y a un élément différent pour chaque type de champs en XUL.
+ +

L'exemple suivant montre quelques boîtes de texte :

+ +

Exemple 1: Source Voir

+ +
<label control="some-text" value="Entrez du texte"/>
+<textbox id="some-text"/>
+<label control="some-password" value="Entrez un mot de passe"/>
+<textbox id="some-password" type="password" maxlength="8"/>
+
+ +

Boîte de texte multiligne

+ +

Les exemples de boîtes de texte ci-dessus créent des champs de saisie qui ne peuvent être utilisés que pour la saisie d'une seule ligne de texte. Le HTML possède aussi un élément textarea pour créer une zone de saisie plus grande. Dans XUL, vous pouvez utiliser l'élément textbox de la même façon -- deux éléments distincts ne sont pas nécessaires. Si vous mettez l'attribut multiline à la valeur 'true', le champ de saisie de texte affichera plusieurs lignes.

+ +

Par exemple :

+ +

Exemple 2: Source Voir

+ +
<textbox multiline="true"
+         value="Voici du texte qui pourrait s'étaler sur plusieurs lignes."/>
+
+ +

Comme avec la balise textarea du HTML, vous pouvez utiliser les attributs rows et cols pour définir la taille. Ils vous permettent d'ajuster le nombre de lignes et de colonnes de caractères à afficher.

+ +
+

Notre exemple de recherche de fichiers

+ +

Maintenant, ajoutons un champ de saisie de recherche à la boîte de dialogue de recherche de fichiers. Nous allons utiliser l'élément textbox.

+ +

Source Voir

+ +
<label value="Chercher :" control="find-text"/>
+<textbox id="find-text"/>
+
+<button id="find-button" label="Rechercher"/>
+
+ +
Image:xultu_inputs1.png
+ +

Ajoutez ces lignes avant les boutons que nous avons créés dans la section précédente. Si vous ouvrez cette fenêtre, vous verrez quelque chose ressemblant à l'image ci-dessous.

+Notez que le libellé et le champ de saisie de texte sont maintenant apparus dans la fenêtre. La boîte de texte est complètement fonctionnelle et vous pouvez taper et sélectionner du texte dedans. Notez aussi que l'attribut control a été utilisé. Ainsi, le champ de saisie est sélectionnée lorsque l'on clique sur son libellé.
+ +

Les cases à cocher et les boutons radio

+ +

Deux éléments supplémentaires sont utilisés pour la création des cases à cocher et des boutons radio. Ce sont des variantes de boutons. La case à cocher est utilisée pour des options qui peuvent être activées ou désactivées. Les boutons radio peuvent être utilisés dans un but similaire quand il y a un ensemble de boutons où un seul d'entre eux peut-être sélectionné à la fois.

+ +

Vous pouvez employer la plupart des attributs des boutons avec les cases à cocher et les boutons radio. L'exemple ci-dessous montre des cases à cocher et boutons radio simples.

+ +
<checkbox id="case-sensitive" checked="true" label="Sensible à la casse"/>
+<radio id="orange" label="Orange"/>
+<radio id="violet" selected="true" label="Violet"/>
+<radio id="yellow" label="Jaune"/>
+
+ +

La première ligne crée une simple case à cocher. Quand l'utilisateur clique sur la case à cocher, son état coché et décoché s'inverse. L'attribut checked peut être utilisé pour indiquer l'état par défaut. Il vous faudra l'initialiser soit à 'true', soit à 'false'. L'attribut label peut être utilisé pour ajouter un libellé qui apparaitra à côté de la case à cocher. Pour les boutons radio, vous utiliserez l'attribut selected à la place de l'attribut checked. Initialisez le à 'true' pour avoir un bouton radio sélectionné par défaut, ou ne le mettez pas pour les autres boutons radio.

+ +

Élement radiogroup

+ +

Pour grouper des boutons radio ensemble, vous devez utiliser l'élément radiogroup. Un seul bouton radio peut-être sélectionné dans un radiogroup. Cliquez sur l'un deux désélectionnera tous les autres du même groupe. C'est ce que démontre l'exemple suivant.

+ +

Exemple 3: Source Voir

+ +
<radiogroup>
+  <radio id="orange" label="Orange"/>
+  <radio id="violet" selected="true" label="Violet"/>
+  <radio id="Jaune" label="Jaune"/>
+</radiogroup>
+
+ +

Attributs

+ +

Comme pour les boutons, les cases à cocher et les boutons radio sont constitués d'un libellé et d'une image, où l'image change en fonction de l'état coché ou décoché. Les cases à cocher ont certains attributs communs aux boutons :

+ +
+
label 
+
Le libellé de la case à cocher ou du bouton radio.
+
disabled 
+
Mettez la valeur à 'true' ou à 'false' pour désactiver ou activer la case à cocher ou le bouton radio.
+
accesskey 
+
La touche clavier pouvant être utilisée comme raccourci pour sélectionner l'élément. La lettre spécifiée est habituellement soulignée dans le libellé.
+
+ +
+

Dans la prochaine section, nous allons voir quelques éléments pour la création de boîtes de listes.

+ +
+

« PrécédentSuivant »

+
diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/les_contr\303\264les_de_listes/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/les_contr\303\264les_de_listes/index.html" new file mode 100644 index 0000000000..3a5349caa9 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/les_contr\303\264les_de_listes/index.html" @@ -0,0 +1,134 @@ +--- +title: Les contrôles de listes +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Les_contrôles_de_listes +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/List_Controls +--- +
+

« PrécédentSuivant »

+
+

XUL dispose de nombreux types d'éléments pour créer des boîtes de listes.

+

Zones de listes

+

Une zone de liste est utilisée pour afficher un nombre d'items dans une liste. L'utilisateur doit pouvoir choisir un des item de la liste.

+

XUL propose deux types d'éléments pour créer des listes, un élément listbox pour créer des zones de liste multi-lignes, et un élément menulist pour créer des zones de listes déroulantes. Ils fonctionnent de la même manière que l'élément select du langage HTML qui réalise ces deux fonctions, mais les élements XUL ont plus de fonctionnalités.

+

La zone de liste la plus simple utilise l'élément listbox pour créer la boîte, et l'élément listitem pour chacun des items. Par exemple, cette zone de liste a quatre lignes, une pour chaque item.

+

Exemple 1: Source Voir

+
<listbox>
+  <listitem label="Beurre de cacahuète"/>
+  <listitem label="Chocolat à tartiner"/>
+  <listitem label="Confiture de fraise"/>
+  <listitem label="Crême chantilly"/>
+</listbox>
+
+
+ Image:xultu_list1.png
+

À l'instar de la balise option du langage HTML, vous pouvez assigner une valeur à chaque item en utilisant l'attribut value. Vous pouvez ensuite utiliser cette valeur dans un script. Par défaut, la zone de liste ajustera sa taille à son contenu, mais vous pouvez contrôler sa taille avec l'attribut rows. Affectez lui le nombre de lignes que vous souhaitez voir apparaître dans la zone de liste. Un ascenseur apparaîtra pour permettre à l'utilisateur d'afficher les lignes supplémentaires.

+

L'exemple suivant montre ces fonctionnalités supplémentaires :

+

Exemple 2: Source Voir

+
<listbox rows="3">
+  <listitem label="Beurre de cacahuète" value="becacah"/>
+  <listitem label="Chocolat à tartiner" value="chotart"/>
+  <listitem label="Confiture de fraise" value="confraise"/>
+  <listitem label="Creme chantilly" value="crchant"/>
+</listbox>
+
+

L'exemple a été modifié pour n'afficher que 3 lignes à la fois. Des valeurs ont également été ajoutées à chaque item de la liste. Les zones de liste ont beaucoup d'autres fonctionnalités qui seront décrites plus tard.

+

Boîte de liste multi-colonnes

+

Les boîtes de liste supportent également les colonnes multiples. Chaque cellule peut avoir un contenu arbitraire bien qu'il s'agisse souvent seulement de texte. Quand un utilisateur sélectionne un item dans la liste, la ligne entière est sélectionnée. Il n'est pas possible de sélectionner une seule cellule.

+

Deux balises sont utilisées pour spécifier les colonnes dans une boîte de liste. L'élément listcols est utilisé pour contenir l'information sur les colonnes, chacune d'elles est spécifiée en utilisant un élément listcol Vous aurez besoin d'un élément listcol pour chaque colonne de la liste.

+

L'élément listcell doit être utilisé pour chaque cellule dans une ligne. Si vous voulez avoir trois colonnes, vous aurez besoin d'ajouter trois éléments listcell à l'intérieur de chaque listitem. Pour spécifier le contenu d'un texte de la cellule, placez un attribut label sur cet élément listcell. Dans le cas simple où il n'y a qu'une seule colonne, vous pouvez aussi placer l'attribut label directement sur l'élément listitem et omettre complètement les éléments listcell, comme cela a été montré dans les exemples de listes précédents.

+

L'exemple suivant est une boîte de liste de deux colonnes et trois lignes.

+

Exemple 3: Source Voir

+
<listbox>
+  <listcols>
+    <listcol/>
+    <listcol/>
+  </listcols>
+  <listitem>
+    <listcell label="George"/>
+    <listcell label="Peintre en bâtiment"/>
+  </listitem>
+  <listitem>
+    <listcell label="Mary Ellen"/>
+    <listcell label="Fabriquant de bougies"/>
+  </listitem>
+  <listitem>
+    <listcell label="Roger"/>
+    <listcell label="Bravache"/>
+  </listitem>
+</listbox>
+
+

Lignes d'en-tête

+

Les boîtes de liste permettent également l'utilisation d'une ligne d'en-tête spéciale. Elle n'est rien d'autre qu'une ligne normale, sauf qu'elle est affichée différemment. Elle servira à créer des en-têtes de colonnes grâce à deux nouveaux éléments.

+

L'élément listhead est utilisé pour définir la ligne d'en-tête, comme l'élément listitem est utilisé pour définir une ligne normale. La ligne d'en-tête n'est toutefois pas une ligne normale, ainsi un script permettant de lire la première ligne d'une boîte de liste ne tiendra pas compte de cette ligne d'en-tête.

+

L'élément listheader est utilisé pour chaque cellule de l'en-tête. Utilisez l'attribut label pour définir le libellé de la cellule d'en-tête.

+

Voici l'exemple précédent avec une ligne d'en-tête :

+

Exemple 4: Source Voir

+
<listbox>
+
+  <listhead>
+    <listheader label="Nom"/>
+    <listheader label="Activité"/>
+  </listhead>
+
+  <listcols>
+    <listcol/>
+    <listcol flex="1"/>
+  </listcols>
+
+  <listitem>
+    <listcell label="George"/>
+    <listcell label="Peintre en bâtiment"/>
+  </listitem>
+  <listitem>
+    <listcell label="Mary Ellen"/>
+    <listcell label="Fabriquant de bougies"/>
+  </listitem>
+  <listitem>
+    <listcell label="Roger"/>
+    <listcell label="Bravache"/>
+  </listitem>
+
+</listbox>
+
+
+ Image:xultu_lists_3.png
+

Dans cet exemple, l'attribut flex est utilisé pour rendre la colonne flexible. Cet attribut sera décrit dans une section ultérieure, mais ici, il permet à la colonne de remplir tout l'espace disponible horizontalement. Vous pouvez retailler la fenêtre pour voir que la colonne s'adapte en même temps que la fenêtre. Si vous diminuez la taille horizontalement, les libellés sur les cellules seront raccourcis automatiquement, en affichant des points de suite. Vous pouvez utiliser l'attribut crop sur les cellules ou sur les items, avec une valeur 'none' pour désactiver cette coupure.

+

Zones de listes déroulantes

+

Des listes déroulantes peuvent être créées en HTML avec la balise select. L'utilisateur ne voit qu'un unique choix dans une boîte de texte et doit cliquer sur une flèche ou un bouton similaire à côté de la boîte de texte pour changer la sélection. Les autres choix apparaitront alors dans une fenêtre surgissante. XUL dispose de l'élément menulist qui peut servir à cet usage. Il est formé d'une boîte de texte avec un bouton à son côté. Son nom a été choisi parce qu'il propose un menu surgissant pour le choix.

+

Trois éléments sont nécessaires pour former une liste déroulante. Le premier est l'élément menulist qui crée la boîte de texte avec son bouton à côté. Le second, menupopup, crée la fenêtre surgissante qui apparaît lorsque le bouton est cliqué. Le troisième, menuitem, crée les choix individuels.

+

Cette syntaxe est mieux décrite dans l'exemple ci-dessous :

+

Exemple 5: Source Voir

+
<menulist label="Bus">
+  <menupopup>
+    <menuitem label="Voiture"/>
+    <menuitem label="Taxi"/>
+    <menuitem label="Bus" selected="true"/>
+    <menuitem label="Train"/>
+  </menupopup>
+</menulist>
+
+
+ Image:xultu_list2.png
+

Ce menu contient quatre choix, un pour chaque élément menuitem. Pour voir les choix possibles, cliquez sur le bouton flèche du menu. Lorsqu'un item est sélectionné, il apparaît comme le choix fait dans le texte du menu. L'attribut selected est utilisé pour définir la valeur sélectionnée par défaut.

+ +

Par défaut, vous ne pouvez sélectionner que des choix proposés dans la liste. Vous ne pouvez pas entrer votre propre sélection en la tapant au clavier. Une variante de menulist le permet. Par exemple, le champ URL du navigateur dispose d'une liste déroulante pour afficher les adresses précédemment utilisées, mais vous pouvez aussi la saisir vous même.

+

Pour créer une liste déroulante éditable, ajoutez l'attribut editable comme ceci :

+

Exemple 6: Source Voir

+
<menulist '''editable="true"'''>
+  <menupopup>
+   <menuitem label="www.mozilla.org"/>
+   <menuitem label="www.xulplanet.com"/>
+   <menuitem label="www.dmoz.org"/>
+  </menupopup>
+</menulist>
+
+

Le champ URL créé ici a trois adresses pré-saisies que l'utilisateur peut sélectionner ou alors il peut taper la sienne dans le champ. Le texte entré par l'utilisateur ne sera pas ajouté comme un futur choix à cette liste. Comme l'attribut label n'a pas été utilisé dans cet exemple, sa valeur par défaut sera vide.

+
+

Dans la section suivante, nous apprendrons comment ajouter des indicateurs de progression.

+
+

« PrécédentSuivant »

+
diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/les_contr\303\264les_num\303\251riques/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/les_contr\303\264les_num\303\251riques/index.html" new file mode 100644 index 0000000000..73c81e4d9f --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/les_contr\303\264les_num\303\251riques/index.html" @@ -0,0 +1,63 @@ +--- +title: Les contrôles numériques +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Les_contrôles_numériques +tags: + - Firefox 3 + - Traduction_à_relire + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Numeric_Controls +--- +
+

« PrécédentSuivant »

+
+ +

XUL comprend deux éléments servant aux entrées de valeurs ou de plages numériques, ainsi que de deux éléments pour la saisie des dates et heures. Ces éléments ne sont disponibles que dans Firefox 3 et suivant.

+

Champs numérique

+

Une boîte de texte peut servir à la saisie de nombres en lui définissant un attribut type avec la valeur number. Ce type de boîte ne peut servir que pour entrer des nombres. Tout autre caractère tapé ne sera pas accepté et sera ignoré. De plus, des flèches apparaitront à côté de la boîte de texte pour permettre à l'utilisateur de faire défiler les valeurs.

+
+ Image:Controlguide-textbox-number.png
+

Comme avec les autres boîtes de texte, la valeur par défaut peut être définie avec l'attribut value. Naturellement, cette valeur doit être un nombre. Toutefois, les valeurs minimale et maximale peuvent être définies avec les attributs min et max. S'ils sont précisés, vous pouvez contrôler l'intervalle de valeurs permis par la boîte de texte. Si l'utilisateur tente d'entrer une valeur inférieure ou supérieure à cet intervalle, elle sera réinitialisée avec le minimum ou le maximum. Par exemple, la boîte de texte suivante a un intervalle de 1 à 20.

+
<textbox type="number" min="1" max="20"/>
+
+

Comme la valeur par défaut n'est pas définie, la boîte aura la valeur 1, la valeur minimum. L'attribut min est défini à 1 pour indiquer la plus petite valeur possible, et l'attribut max est défini à 20 pour indiquer la plus grande valeur possible. Si la valeur minimale n'est pas définie, elle aura une valeur par défaut de 0. La valeur maximale par défaut est la valeur spéciale Infinity signifiant qu'il n'y a aucune limite.

+

Autres attributs des champs numériques

+

L'attribut increment peut servir à spécifier de combien est modifiée la valeur lorsque les flèches sont pressées. La valeur par défaut est 1, mais une valeur différente permettra au nombre de changer d'une plus grosse valeur. L'exemple suivant effectue des écarts de multiples de 10.

+
<textbox type="number" increment="10" max="100"/>
+
+

Cette boîte de texte change par multiples de 10 de 0 à 100. Comme l'attribut min n'a pas été défini, sa valeur par défaut est 0. Notez que l'utilisateur peut parfaitement entrer une autre valeur. L'attribut increment n'affecte que les flèches. L'utilisateur peut également incrémenter ou décrémenter la valeur en utilisant les flèches haut et bas du clavier lorsque la boîte de texte à le focus.

+

L'attribut decimalplaces indique le nombre de décimales à afficher. La valeur par défaut est 0, ce qui signifie que la boîte n'affiche que des entiers. Une valeur différente permet d'afficher des nombres décimaux.

+
<textbox type="number" decimalplaces="2"/>
+
+

Dans cet exemple, deux chiffres après la virgule sont affichés. Les valeurs comportant d'autres décimales sont arrondies à 2 chiffres après la virgule.

+

Échelles de valeurs

+

Un élément scale peut également être utilisé pour sélectionner une plage de valeurs. Plutôt que d'avoir une boîte de texte, un curseur glissant est utilisé. L'utilisateur peut déplacer le curseur de l'échelle pour ajuster la valeur.

+
+ Image:Controlguide-scale.png
+

La plupart des attributs de la boîte de texte numérique peuvent servir avec une échelle : value, min, max et increment peuvent servir de la même façon. L'échelle de valeur n'affiche en fait aucune valeur, mais peut le faire grâce à un script. Une échelle déclenche un événement change à chaque fois que sa valeur est modifiée.

+
<scale value="40" min="1" max="50"/>
+
+

La valeur par défaut de cette échelle est 40, et elle a une plage comprise entre 1 et 50.

+

Une boîte de texte numérique est employée généralement lorsque la valeur est importante pour l'utilisateur, comme un champs pour saisie un nombre de jours ou la taille maximale d'un fichier. Une échelle de valeur servira plutôt lorsque la valeur n'est pas très importante, comme l'augmentation ou la diminution d'un état, par exemple pour le volume sonore ou un zoom.

+

La disposition par défaut d'une échelle est horizontale avec à gauche les valeurs les plus basses et à droite, les plus hautes. Vous pouvez toutefois modifier cette orientation avec les attributs orient et dir.

+
<scale orient="vertical" dir="reverse"/>
+
+

Cette échelle de valeurs s'affichera verticalement avec les valeurs les plus basses en bas, et les plus élevées en haut.

+

Champs de saisie de date et heure

+

Les éléments datepicker et timepicker permettent à l'utilisateur d'entrer des dates et des heures. À leur utilisation, ils affichent une série de boîtes de texte numérique pour entrer chaque composants de la date et de l'heure.

+
<datepicker value="2004/3/24"/>
+<timepicker value="15:30:00"/>
+
+
+ Image:Controlguide-timepicker.png
+

L'attribut value permet de définir la valeur par défaut ; et si cet attribut est omis, le champ sera initialisé avec la date et l'heure courante. Le format de l'attribut est exactement comme ci-dessus, c'est-à-dire que les dates sont de la forme YYY/MM/DD et les heures sont de la forme HH:MM:SS (bien que les secondes et les autres colonnes peuvent être omises).

+

Ces deux éléments garantissent que l'utilisateur a bien entré une valeur date et une heure. De cette manière, vous n'avez pas à vous soucier qu'il s'agit d'une date valide, en vérifiant que le jour n'est pas supérieur au nombre de jour dans le mois, en gérant les années bissextiles, et ainsi de suite.

+

Tandis que timepicker ne possède qu'un seul style, datepicker possède trois variations différentes. Le style par défaut affiche trois champs pour l'année, le mois et le jour. L'attribut type permet de choisir les deux autres. Une valeur de grid utilise une grille de calendrier, comme affichée dans l'image ci-dessous.

+

Image:Controlsguide-datepicker-grid.png

+

Vous pouvez également utiliser la valeur popup pour créer une combinaison des deux types. Ce type a trois champs pour entrer l'année, le mois et la date, ainsi qu'un bouton pour afficher un calendrier surgissant pour choisir un jour.

+
<datepicker type="popup"/>
+
+
+

« PrécédentSuivant »

+
diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/les_fichiers_de_propri\303\251t\303\251s/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/les_fichiers_de_propri\303\251t\303\251s/index.html" new file mode 100644 index 0000000000..a644660bf3 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/les_fichiers_de_propri\303\251t\303\251s/index.html" @@ -0,0 +1,81 @@ +--- +title: Les fichiers de propriétés +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Les_fichiers_de_propriétés +tags: + - Localisation + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Property_Files +--- +

 

+
+

« PrécédentSuivant »

+
+

 

+

Dans un script, les entités ne peuvent être utilisées. On utilise alors plutôt les fichiers de propriétés.

+

Propriétés

+

Les fichiers DTD sont adaptés à des chaînes issues d'un fichier XUL. Néanmoins, dans un script, les entités ne sont pas analysées pour être remplacées. De plus, vous pourriez souhaiter afficher un message généré par un script, sans par exemple connaître à l'avance son contenu. Les fichiers de propriétés peuvent être utilisés dans ce but.

+

Un fichier de propriétés contient une suite de chaînes de caractères. Vous trouverez les fichiers de propriétés aux côtés des fichiers DTD avec l'extension .properties. Les propriétés dans un de ces fichiers sont déclarées selon une structure nom=valeur. Un exemple est décrit ci-dessous :

+
notFoundAlert=Aucun fichier trouvé correspondant aux critères.
+deleteAlert=Cliquez sur OK pour effacer tous vos fichiers.
+resultMessage=%2$S fichiers trouvés dans le répertoire %1$S.
+
+

Ici, le fichier de propriétés contient deux propriétés. Elles pourront être lues par un script et affichées.

+

Stringbundles

+

Vous pouvez écrire le code de lecture des propriétés vous-mêmes, néanmoins XUL fournit l'élément stringbundle qui le fait pour vous. Cet élément dispose de plusieurs fonctions pouvant être utilisées pour récupérer les chaînes de caractères des fichiers de propriétés et d'autres informations de localisation. Cet élément lit le contenu des fichiers de propriétés et construit une liste de ces propriétés pour vous. Vous pouvez donc ensuite y accéder par leur nom.

+
<stringbundleset id="strbundles">
+<stringbundle id="strings" src="strings.properties"/>
+</stringbundleset>
+
+

L'inclusion de cet élément permettra de lire les propriétés via le fichier 'strings.properties' dans le même répertoire que le fichier XUL. Utilisez une URL chrome pour lire un fichier de localisation. Comme pour d'autres éléments non affichables, vous devriez déclarer tous les stringbundles à l'intérieur d'un élément stringbundleset pour les regrouper.

+

Obtention d'une chaîne d'une collection

+

L'élément stringbundle a plusieurs propriétés. La première est getString pouvant être utilisée dans un script pour lire une chaîne de caractères de la collection.

+
var strbundle = document.getElementById("strings");
+var nofilesfound=strbundle.getString("notFoundAlert");
+
+alert(nofilesfound);
+
+ +
À propos de l'obtention d'une chaîne d'une collection
+

Si vous souhaitez utiliser l'élément stringbundle au sein d'un <overlay>, merci de faire attention. Vous devrez placer votre stringbundle dans un élément <window>, d'identifiant 'main-window'. Sinon, vous ne serez pas à même de récupérer les chaînes depuis votre code JavaScript, sans comprendre pourquoi. Ainsi, le code que vous auriez écrit aurait pu être :

+
<overlay id="OverLayId">
+    <stringbundleset id="strbundles">
+        <stringbundle id="strings" src="strings.properties"/>
+    </stringbundleset>
+</overlay>
+
+

Il sera donc :

+
<overlay id="OverLayId">
+    <window id="main-window">
+        <stringbundleset id="strbundles">
+            <stringbundle id="strings" src="strings.properties"/>
+        </stringbundleset>
+    </window>
+</overlay>
+
+

Formatage de texte

+

La méthode suivante est getFormattedString(). Elle permet également d'obtenir avec une clef donnée une chaîne de la collection. Mais en plus, chaque occurrence de code de formatage (par ex. %S) est remplacée par chaque élément successif dans le tableau transmis.

+
var dir = "/usr/local/document";
+var count = 10;
+
+var strbundle = document.getElementById("strings");
+var result = strbundle.getFormattedString("resultMessage", [ dir, count ]);
+
+alert(result);
+
+

Cet exemple affichera le message suivant dans une boîte d'alerte.

+
10 fichiers trouvés dans le répertoire /usr/local/document.
+

Vous noterez que les codes de formatage %1$S et %2$S sont utilisés, et sont remplacés par les différents membres dans le tableau. Un code de formatage %n$S spécifie directement la position du paramètre correspondant. Bien que l'ordre des mots soit différent dans tous les langages, l'utilisation de getFormattedString() permet de préciser l'ordre dans les fichiers de propriétés.

Échappement de caractères non-ASCII

+

 

+

Avant Gecko 1.8

+

Bien que la plupart des langages nécessitent des caractères non-ASCII, les fichiers de propriétés doivent être écrits en n'utilisant que des caractères ASCII. Cependant, les fichiers de propriétés supportent d'autres caractères grâce à des séquences échappées de la forme : \uXXXX où XXXX est le code du caractère. Ainsi, si votre fichier de propriété contient des caractères non-ASCII, vous devrez le convertir au format 'échappement-unicode'. Pour faire cela, vous pouvez utiliser l'utilitaire en ligne de commande native2ascii fourni avec le kit de développement Java de Sun (JDK).

+

À partir de Gecko 1.8.x (et versions ultérieures)

+

Les fichiers .properties encodés en UTF-8 sont pris en charge. Vous pouvez donc utiliser des caractères non-ASCII sans avoir à les "échapper".

+
+

Dans la prochaine section, nous découvrirons XBL qui peut être utilisé pour définir le comportement d'un élément.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/les_fichiers_manifest/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/les_fichiers_manifest/index.html new file mode 100644 index 0000000000..50ea0d2e3e --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/les_fichiers_manifest/index.html @@ -0,0 +1,108 @@ +--- +title: Les fichiers manifest +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Les_fichiers_manifest +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Manifest_Files +--- +
+

« PrécédentSuivant »

+
+

Dans cette section, nous allons voir comment mettre des fichiers XUL et chrome dans un paquetage et créer les fichiers manifest associés.

+

Paquetages

+

Un paquetage est un ensemble de fichiers XUL et de scripts qui définissent la fonctionnalité d'une interface utilisateur. Les paquetages peuvent être installés dans Mozilla et référencés avec des URLs chrome. Un paquetage peut contenir tous les fichiers que l'on veut et peut-être découpé en sous-répertoires pour les différentes parties du paquetage. Un paquetage peut-être enregistré soit comme un répertoire ou soit comme une archive JAR.

+

Les fichiers manifest

+

Un fichier manifest décrit un paquetage et relie son emplacement sur le disque à son adresse URL chrome. Les fichiers manifest situés dans le répertoire chrome sont examinés au lancement d'une application Mozilla pour déterminer les paquetages installés. Cela signifie que tout ce que vous avez à faire pour installer un nouveau paquetage est d'ajouter un fichier manifest soit dans le répertoire chrome de l'application, soit dans le répertoire chrome du profil de l'utilisateur. Le second emplacement est normalement le seul utilisé puisque les permissions ne devraient pas être suffisantes pour écrire dans le répertoire de l'application.

+

Si vous voulez tester un code XUL à privilèges dans le navigateur Firefox, un simple fichier manifest contenant une seule ligne est nécessaire :

+
    +
  1. Créez un nouveau répertoire quelque part. Par exemple, sur une plateforme Windows, utilisez C:\testfiles.
    2. +
  2. Créez un nouveau fichier ASCII (un format UTF-8 avec BOM ne fonctionnera pas) appelé test.manifest dans le répertoire chrome. Le nom du fichier importe peu dès lors qu'il possède une extension .manifest.
    3. +
  3. Ajoutez la ligne suivante à ce fichier :
    4. +
+
content tests file:///C:/testfiles/
+
+

Le chemin mentionné dans cette ligne doit pointer vers le répertoire créé plus haut. Si vous avez un doute sur la syntaxe de ce chemin, ouvrez ce répertoire dans un navigateur et copiez l'URL obtenue dans la barre d'adresse.

+

C'est fait ! Maintenant, tout ce qu'il vous reste à faire est d'ajouter des fichiers XUL dans ce nouveau répertoire, et vous serez capable de les charger en tapant une URL chrome de la forme chrome://tests/content/<filename>. Bien entendu, vous devrez redémarrer votre navigateur pour les changements soient pris en compte. Si le fichier ne se charge pas, vérifiez que le chemin vers le répertoire est correct.

+

La syntaxe de base des lignes du manifest du paquetage de contenu est :

+

'content <nom_du_paquetage> <chemin_vers>'

+

Le premier mot 'content' indique qu'il s'agit d'un paquetage de contenu. Pour les thèmes graphiques, le mot serait 'skin' et pour les fichiers de langue, il serait 'locale'. Le nom du paquetage dans l'exemple ci-dessus est 'tests', donc le premier champ dans l'URL chrome est 'tests' comme dans chrome://tests/content/exemple.xul. Si le nom du paquetage était 'browser', l'URL chrome serait chrome://browser/content. Le dernier champ <chemin_vers> correspond à l'emplacement des fichiers. Il peut être soit un une URL file vers un répertoire local, soit une URL jar vers une archive JAR qui sera décrit plus tard. Vous pouvez déclarer plusieurs paquetages dan le même fichier manifest en ajoutant des lignes.

+

Le fichier browser.manifest utilisé par Firefox ressemble à ceci :

+
content branding jar:browser.jar!/content/branding/ xpcnativewrappers=yes
+content browser jar:browser.jar!/content/browser/ xpcnativewrappers=yes
+overlay chrome://global/content/viewSource.xul chrome://browser/content/viewSourceOverlay.xul
+overlay chrome://global/content/viewPartialSource.xul chrome://browser/content/viewSourceOverlay.xul
+overlay chrome://browser/content/pageInfo.xul chrome://pippki/content/PageInfoOverlay.xul
+
+

Deux paquetages sont déclarés ici : 'branding' et 'browser'. Trois overlays sont également spécifiés pour permettre aux différents paquetages de se combiner entre eux. Les extensions font un large usage des overlays pour fusionner leurs interfaces à celle du navigateur.

+

Les deux chemins des paquetages branding et browser utilisent des URLs jar car leur contenu se trouve dans une archive. Une archive JAR peut être créée avec un utilitaire ZIP. Pour un fichier JAR situé dans un répertoire chrome, la syntaxe est assez simple :

+

jar:<nom_de_fichier.jar>!<chemin_dans_archive>

+

Pour le paquetage du navigateur, l'archive est browser.jar et elle est située à côté du fichier manifest dans le répertoire chrome. Le chemin 'content/browser' spécifie le chemin à l'intérieur de l'archive où les fichier XUL sont situés. Il n'est pas nécessaire de préciser un chemin s'il n'y a aucun répertoire dans l'archive. Sur notre exemple, il y en a un puisque les fichiers du paquetage branding sont enregistrés dans un chemin différent de la même archive.

+

Pour le paquetage 'tests' créé ci-dessus, les fichiers ne sont pas empaquetés dans une archive, donc un chemin direct vers les fichiers est utilisé à la place. Cette méthode est bonne pour le développement puisque vous n'avez pas à réempaqueter tous les fichiers à chaque modification. Cependant, pour distribuer une application ou une extension, vous devriez les empaqueter dans une archive pour éviter l'installation d'une multitudes de petits fichiers.

+

La partie xpcnativewrappers=yes à la fin de la ligne du fichier manifest est un drapeau optionnel. En JavaScript, une page Web peut remplacer des fonctions natives avec son propre code. La présence de ce drapeau xpcnativewrappers=yes indique aux scripts tournant dans un contexte à privilèges de ne pas appeler ses versions remplacées, mais plutôt leurs versions natives. Sans cela, une extension pourrait tenter d'appeler ses versions modifiées et mal fonctionner, ou pire, ouvrir un trou de sécurité. Ce drapeau a été ajouté pour éviter ce genre de problème et devrait toujours être utilisé pour de nouvelles extensions, mais des anciennes extensions pourraient ne plus fonctionner sans lui. Pour plus d'informations concernant cette fonctionnalité, consultez XPCNativeWrapper.

+

Thèmes graphiques et langues

+

La syntaxe pour les thèmes et les langues est similaire aux paquetages de contenu, mais vous devrez préciser à quel paquetage de contenu ils s'appliquent. Par exemple :

+
skin browser classic/1.0 jar:classic.jar!/skin/classic/browser/
+locale browser en-US jar:en-US.jar!/locale/browser/
+

Pour cet exemple, le champ supplémentaire a été ajouté pour indiquer que le thème graphique et la langue s'applique au navigateur (browser). Le nom du thème est 'classic/1.0'. Dans le cas présent, un numéro de version est indiqué avec le nom du thème mais il est facultatif si vous développez votre propre thème. Mozilla n'effectue aucun traitement sur ce numéro qui est simplement une partie du nom du thème graphique. La langue est 'en-US'. Les adresses URLs résultant de cet exemple seront 'chrome://browser/skin' et 'chrome://browser/locale'. Si vous créez votre propre thème graphique ou langue, il vous suffit d'adapter ces deux lignes en conséquence.

+

Pour plus d'informations sur les thèmes graphiques, consultez Thèmes. Pour plus d'informations sur la localisation, consultez Localisation.

+
+

Notre exemple de recherche de fichiers

+

Créons un fichier manifest pour notre boîte de dialogue de recherche de fichiers. Vous pouvez mettre ces trois types dans un même fichier. Lors de la création d'une extension, assurez vous que tous les types soient déclarés. Nous procèderons ainsi pour notre exemple. Créez un fichier findfile.manifest dans le répertoire chrome et ajoutez-y les lignes suivantes :

+ 
content findfile file:///findfile/content/
+skin findfile classic/1.0 file:///findfile/skin/
+locale findfile en-US file:///findfile/locale/
+
+

Créez les nouveaux répertoires listés ci-dessus. Peu importe où vous les créez, mais leurs emplacements doivent être indiqués dans le fichier manifest. Naturellement, vous adapterez les chemins en fonction de votre système de fichiers. Si nous voulions distribuer le paquetage, nous le placerions dans un fichier JAR en modifiant les chemins. Pour l'instant, il s'agit d'un exemple de création d'un fichier manifest et une préparation des répertoires pour les exemples à venir dans les sections suivantes.

+

Notez que les deuxièmes champs pour les lignes 'skin' et 'locale' sont 'findfile'. Elles signifient que le thème graphique et la langue modifient le paquetage 'findfile' défini à la première ligne. Les trois chemins mentionnés correspondent chacun à un sous répertoire différent. Vous devrez procéder ainsi pour séparer les fichiers de chaque catégorie.

+
+

Installer un paquetage

+

Pour installer une application, vous devez soit lui créer un installeur, soit l'inclure dans une autre application. La méthode dépend du type d'application que vous créez. Pour des extensions, vous devez créer un fichier d'installation install.rdf décrivant ce qui doit être installé, l'auteur de l'extension et avec quelles versions du navigateur ou d'autres applications elles sont compatibles. Une structure de répertoires bien spécifique est nécessaires car l'emplacement des fichiers des extensions est limité. Une extension est paquetagée dans un fichier XPI. XPI est le raccourci pour XPInstall utilisé par Mozilla pour l'installation de composants. Comme pour un fichier JAR, un fichier XPI n'est autre qu'un fichier ZIP avec une extension différente, donc il vous suffit de disposer d'un utilitaire ZIP pour créer ou visualiser un XPI.

+

Le gestionnaire d'extensions de Firefox gère automatique les fichiers XPI pour installer les extensions. Il est recommandé de transférer les extensions sur le Mozilla Add-ons où les utilisateurs pourront les retrouver. Elles peuvent être installées depuis n'importe quel site, mais la configuration par défaut devra être modifiée pour permettre d'autres sites.

+

Il est également possible d'utiliser un script d'installation écrit en JavaScript. Cela vous permet de copier des fichiers vers d'autres emplacements et de réaliser d'autres tâches de gestion de fichiers. Cependant, les extensions installées avec un script ne seront pas listées dans le gestionnaire d'extensions, et il n'existe aucune méthode automatisée pour les désinstaller. Pour cette raison, les scripts d'installation ne sont pas souvent utilisés.

+

Les applications autonomes peuvent être empaquetées en utilisant XULRunner. Ceci permet d'obtenir un fichier exécutable séparé, et l'application peut être distribuée indépendamment d'un navigateur.

+

Pour plus d'informations sur la création d'extensions, consultez la page Extensions. Pour plus d'informations sur XULRunner, consultez la page XULRunner.

+

Applications anciennes

+

Si vous créez des applications pour des logiciels Mozilla plus anciens, c'est-à-dire précédent Firefox 1.5 ou Mozilla 1.8, le processus est un peu plus élaboré. Les explications qui suivent décrivent comment définir un paquetage pour des anciennes versions. Ce chapitre peut être omis si vous écrivez de nouvelles extensions ou applications XUL.

+
+ Note : Cet ancien processus s'applique également à SeaMonkey 1.0 qui n'a pas encore adopté le format des "manifest".
+
    +
  1. Créez un répertoire n'importe où sur votre disque. De nombreuses personnes le placent dans un sous répertoire du répertoire chrome de Mozilla, mais ce n'est pas nécessaire. Le répertoire peut être ailleurs. Placez-y vos fichiers XUL.
    2. +
  2. Créez un fichier appelé contents.rdf et placez le dans ce répertoire. Copiez le texte suivant dans ce fichier contents.rdf. Ce fichier sert à identifier l'id de l'application, son nom, son auteur, sa version, etc. + 
    <?xml version="1.0"?>
+
+<RDF:RDF xmlns:RDF="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:chrome="http://www.mozilla.org/rdf/chrome#">
+
+<RDF:Seq about="urn:mozilla:package:root"> <RDF:li resource="urn:mozilla:package:<span style="color:red">monapplication</span>"/> </RDF:Seq>
+
+<RDF:Description about="urn:mozilla:package:<span style="color:red">monapplication</span>" chrome:displayName="<span style="color:blue">Titre de l'application</span>" chrome:author="<span style="color:blue">Nom de l'auteur</span>" chrome:name="<span style="color:red">monapplication</span>" chrome:extension="true"/>
+
+</RDF:RDF>
    +
    3. +
  3. Modifiez les textes surlignés du fichier ci-dessus avec vos propres informations. Le texte rouge monapplication devrait être l'ID de votre application. Habituellement, l'ID est le même que le nom de votre application. Remplacez le texte en bleu avec le titre et l'auteur de votre application.
    4. +
  4. Si le champ 'chrome:extension' est à 'true', l'application est une extension de Mozilla Firefox qui apparaîtra dans la fenêtre des extensions du navigateur. S'il est à 'faux', elle n'apparaîtra pas.
    5. +
  5. Sauvegardez le fichier contents.rdf et assurez vous qu'il se trouve bien dans le répertoire que vous avez créé à l'étape 1.
    6. +
  6. Ouvrez le fichier <mozilla-directory>/chrome/installed-chrome.txt, où <mozilla-directory> est le répertoire dans lequel est installé Mozilla. Quittez Mozilla avant cette opération.
    7. +
  7. Ensuite, vous allez enregistrer la nouvelle application pour que Mozilla sache la localiser. Ajoutez une ligne à la fin du fichier installed-chrome.txt pointant vers le nouveau répertoire que vous avez créé à l'étape 1. Modifiez le texte surligné correspondant au chemin du répertoire. Assurez vous que son URL finisse par un slash, et que vous avez appuyé sur Entrée en fin de ligne. Si vous n'êtes pas certain de l'écriture de cette URL, ouvrez le répertoire que vous avez créé à l'étape 1 dans le navigateur Mozilla et recopiez l'URL de la barre d'adresse. Notez que la référence doit toujours être un répertoire, pas un fichier. content,install,url,file:///main/app/
    8. +
  8. Effacez le fichier <mozilla-directory>/chrome/chrome.rdf.
    9. +
  9. Démarrez Mozilla. Vous devriez être capable de visualiser les fichiers XUL que vous avez placé dans ce répertoire en utilisant une URL de la forme : chrome://applicationid/content/file.xul où file.xul est le nom du fichier. Le nom de votre fichier principal doit être applicationid.xul, et il sera automatiquement chargé depuis l'URL raccourcie chrome://applicationid/content/.
    10. +
+

Si vous créez des portions de skin ou de locale, répétez les étapes précédentes à l'exception du format du fichier contents.rdf qui est légèrement différent. Regardez des fichiers contents.rdf dans d'autres applications pour plus de détails.

+

Problèmes

+

La création de paquetage chrome peut parfois s'avérer difficile et il est difficile de diagnostiquer les problèmes. Voici quelques astuces au cas où vous bloquez.

+ +

Pour plus d'information concernant les fichiers manifest, consultez la page Enregistrement chrome.

+

Dans la section suivante, nous aborderons le langage XUL.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/les_objets_bo\303\256tes/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/les_objets_bo\303\256tes/index.html" new file mode 100644 index 0000000000..98826074eb --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/les_objets_bo\303\256tes/index.html" @@ -0,0 +1,159 @@ +--- +title: Les objets boîtes +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Les_objets_boîtes +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Box_Objects +--- +
+

« PrécédentSuivant »

+
+ +

Cette section décrit l'objet boîte qui contient des informations relatives à l'affichage et à la mise en page d'une boîte XUL aussi bien que des détails sur la mise en page XUL.

+ +

À propos de la mise en page XUL

+ +

Mozilla divise son fonctionnement en deux séries d'arbres, l'arbre du contenu et l'arbre de mise en page. L'arbre de contenu stocke les nœuds trouvés tels quels dans le code source. L'arbre de mise en page contient un arbre différent des nœuds pour chaque composant individuel pouvant être affiché. L'arbre de mise en page contient la structure d'affichage des nœuds. Il n'y a pas forcément de relation directe entre le contenu et la mise en page des nœuds. Certains nœuds de contenu peuvent avoir plusieurs objets de mise en page, par exemple, chaque ligne d'un paragraphe a un objet de mise en page séparé. Réciproquement, certains nœuds de contenu n'ont aucun objet de mise en page. Par exemple, l'élément key n'a aucun objet de mise en page puisqu'il n'est jamais affiché. De même, tout élément masqué n'aura plus d'objet de mise en page.

+ +

DOM est généralement utilisé pour récupérer et modifier des informations concernant le contenu ou la structure d'un document. Il est relativement simple de déterminer quelle sorte de nœud de l'arbre sera créé pour un élément donné. Un élément XUL, par exemple, aura un type de nœud de contenu XULElement.

+ +

Les objets de mise en page qui seront créés sont déterminés de manière plus complexe. Diverses parties d'information sont utilisées telles que le nom de la balise, les attributs d'un élément, diverses propriétés CSS, les éléments et les objets de mise en page autour de l'élément, et les liaisons XBL associées à un élément (les XBL seront décrites dans une section ultérieure). À moins que vous ne changiez le style d'un élément, la plupart des éléments XUL utilisent habituellement l'objet de boîte de mise en page ou un de ses sous-types. Souvenez-vous que tous les éléments XUL sont des types de boîtes, et que les boîtes sont la base de l'affichage de tous les éléments XUL. Toutefois, Il y a un certain nombre de sous-types, environ 25 ou plus, pour des éléments XUL spécifiques. Certains de ces sous-types, tels que les piles ou les boîtes de liste ont besoin d'une mise en page plus complexe qu'une simple boîte, tandis que d'autres, tels que les boutons, ne sont utilisés que pour ajouter la gestion des événements souris ou clavier.

+ +

L'objet de mise en page associé à un élément peut être enlevé pour créer un objet de type complètement différent en changeant simplement la propriété display CSS. Par exemple, l'affectation de la valeur 'block' à la propriété display d'un élément bouton va effacer l'objet de mise en page et créer un objet 'block' à la place. Naturellement, ce changement modifiera l'apparence et les fonctionnalités de cet élément.

+ +

Il n'est pas nécessaire de connaître les détails de la construction des objets de mise en page, mais il est quand même utile d'avoir la connaissance de comment est décrit la mise en page XUL pour aborder un développement avancé sous XUL.

+ +

Les objets de boîte

+ +

Les objets de mise en page ne peuvent pas être manipulés par les développeurs. Ils font partie des composants internes à la mise en page XUL. Toutefois, XUL fournit quelques objets d'aide, appelés objets de boîte, qui fournissent quelques informations concernant la mise en page. Comme leurs noms l'indiquent, ils sont disponibles pour tous éléments de type boîte.

+ +

Il y a plusieurs sous-types d'objet boîte, bien que seul un petit nombre d'entre eux soit généralement employé. Les autres ont des fonctions plus accessibles par des méthodes liées directement à l'élément, car ces types sont généralement seulement utilisés avec un élément particulier. L'objet de boîte, ou l'interface BoxObject, toutefois, a un nombre de propriétés pouvant être utile pour le développement XUL.

+ +

L'objet de boîte de base a deux fonctionnalités utiles. Premièrement, vous pouvez récupérer la position et les dimensions d'un élément XUL affiché, et deuxièmement, vous pouvez déterminer l'ordre d'affichage des éléments dans une boîte, au lieu de leurs ordres d'enregistrement dans le DOM.

+ +

Récupérer la position et les dimensions

+ +

L'objet de boîte fournit quatre propriétés, x, y, width et height, pour déterminer la position et les dimensions d'un élément. Les coordonnées x et y sont relatives au coin haut à gauche du document dans la fenêtre (en excluant le bord de la fenêtre et son titre). Elles sont mesurées en pixels. Les propriétés width et height sont également mesurées en pixels et retournent la largeur et la hauteur d'un élément en incluant les styles CSS padding et border, s'ils existent.

+ +

Les valeurs sont toujours la position et les dimensions correspondant à l'affichage en cours, donc ces valeurs peuvent être différentes si l'élément est déplacé ou redimensionné. Par exemple, un élément flexible changera de taille et les dimensions de son objet de boîte seront mises à jour en conséquence. L'exemple suivant en offre une illustration :

+ +

Exemple 1: Source Voir

+ +
<button label="Cliquez ici"
+        oncommand="alert('La largeur est ' + this.boxObject.width);"/>
+
+ +

Vous pouvez utiliser les attributs width et height pour définir respectivement la largeur et la hauteur d'un élément. Normalement, ces attributs n'ont pas à être modifiés et l'élément ajuste ses dimensions pour s'adapter au contenu. Ainsi, la définition de ces attributs substitue les valeurs spécifiées aux dimensions par défaut. Les propriétés width et height correspondantes peuvent être employées pour ajuster les dimensions d'un élément à tout moment, si vous souhaitez afficher un élément à une dimension précise. La récupération des valeurs de ces propriétés vous donnera les dimensions explicitement indiquées. Notez que ces propriétés renverront une chaîne vide si les attributs ou propriétés width et height n'ont pas encore été initialisées. Par conséquent, vous ne pouvez pas récupérer les dimensions actuelles avec ces propriétés ; vous devrez utiliser les propriétés de l'objet de boîte à la place.

+ +

Cela doit vous sembler un peu confus, mais la clef est de se souvenir que les propriétés width et height d'un élément retournent les dimensions qui ont été définies dans le fichier XUL, tandis que les propriétés width et height de l'objet de boîte retournent les dimensions courantes réelles.

+ +

Élément caché et réduit

+ +

L'attribut hidden cachera un élément de telle sorte qu'il ne sera pas affiché. Comme il n'est pas affiché, les quatre propriétés de position et de dimensions de l'objet de boîte auront une valeur '0'. Lorsqu'un élément est caché, il est supprimé de l'affichage et ses objets de mise en page sont effacés. Ainsi, comme il n'est affiché nulle part, il n'aura ni position ni dimensions.

+ +

L'attribut collapsed aura le même effet visuel sur cet élément pour l'utilisateur, excepté le fait qu'il laisse l'élément sur l'écran et conserve les objets de mise en page intacts, mais en mettant ses dimensions à '0'. Cela signifie que même si les éléments cachés et réduits ont une largeur et une hauteur de '0', les éléments cachés auront une position x et y de '0' tandis que les éléments réduits conserveront leur position dans la fenêtre.

+ +

Pour rechercher ou modifier les états hidden ou collapsed, utilisez leurs propriétés respectives comme dans l'exemple suivant.

+ +

Exemple 2: Source Voir

+ +
<script>
+function showPositionAndSize()
+{
+  var labelbox = document.getElementById('thelabel').boxObject;
+
+  alert("La position est (" + labelbox.x + "," + labelbox.y +
+        ") et les dimensions sont (" + labelbox.width + "," +
+        labelbox.height + ")");
+}
+</script>
+
+<button label="Caché"
+        oncommand="document.getElementById('thelabel').hidden = true;"/>
+<button label="Montré"
+        oncommand="document.getElementById('thelabel').hidden = false;"/>
+<button label="Réduit"
+        oncommand="document.getElementById('thelabel').collapsed = true;"/>
+<button label="Non réduit"
+        oncommand="document.getElementById('thelabel').collapsed = false;"/>
+<button label="Montrer la position et les dimensions
+        oncommand="showPositionAndSize();"/>
+<label id="thelabel" value="Je suis un libellé"/>
+
+ +
Notez que si vous cachez ou réduisez le libellé, il sera invisible. Vous devrez changer ses attributs hidden ou colapsed pour le voir réapparaître.
+ +

Ordonnancement des éléments XUL

+ +

L'objet de boîte peut également être employé pour déterminer l'ordre d'affichage des éléments, qui peut ne pas être le même que dans la source. Souvenez-vous que les propriétés DOM telles que childNodes, firstChild et nextSibling peuvent être utilisées pour parcourir l'arbre de document. L'objet de boîte permet de naviguer de façon similaire mais retourne les éléments dans leur ordre d'affichage.

+ +

L'objet de boîte fournit plusieurs propriétés, firstChild, lastChild, nextSibling, previousSibling et parentBox. Leurs noms devraient vous expliquer d'eux-même leur fonctionnement. Ces propriétés renvoient des éléments, par exemple, la propriété firstChild renvoie le premier élément enfant affiché. Il n'y a pas de propriété childNodes correspondante pour naviguer entre les boîtes ; à la place, vous devez utiliser les propriétés nextSibling et previousSibling pour parcourir les frères et sœurs.

+ +

Contrairement à la navigation dans l'arbre DOM, les éléments cachés ne sont pas inclus dans la navigation avec les objets de boîte. Donc, si une boîte a six enfants dont les deux premiers sont cachés, la propriété firstChild renverra le troisième élément. Toutefois, les éléments réduits seront inclus car ils sont affichés même sans avoir de dimensions. Par exemple, la boîte sœur suivant le bouton 1 de l'exemple suivant sera le bouton 3, parce que le bouton 2 est caché. Mais la boîte sœur suivant le bouton 3 sera le bouton 4 qui est seulement réduit.

+ +

Exemple 3: Source Voir

+ +
<hbox>
+  <button label="Bouton 1"
+          oncommand="alert('Le suivant est : ' + this.boxObject.nextSibling.label);"/>
+  <button label="Bouton 2" hidden="true"/>
+  <button label="Bouton 3"
+          oncommand="alert('Le suivant est : ' + this.boxObject.nextSibling.label);"/>
+  <button label="Bouton 4" collapsed="true"/>
+</hbox>
+
+ +

Attributs d'ordonnancement de boîte

+ +

Lorsqu'une boîte XUL est placée dans une fenêtre, les éléments sont ordonnés selon un certain nombre de propriétés, par exemple l'orientation, leur groupe ordinal et leur direction.

+ +
Attribut orient
+ +

L'orientation est communément modifiée en utilisant l'attribut orient. Il existe également une propriété CSS -moz-box-orient correspondante qui peut remplacer l'attribut, en fonction de la situation. Cet attribut a été expliqué dans une section précédente sur les boîtes.

+ +
Attribut ordinal
+ +

L'attribut ordinal d'un élément peut être placé pour spécifier un groupe ordonné d'éléments, ou vous pouvez utiliser la propriété CSS -moz-box-ordinal-group.

+ +

Les éléments avec une valeur ordinale inférieure sont placés dans la boîte avant les éléments ayant une plus grande valeur ordinale. Par exemple, un élément avec une valeur ordinale de '2' sera placé avant un élément ayant une valeur ordinale de '3' ou plus, mais après un élément ayant un ordinal de '1'. La valeur ordinale par défaut, si elle n'est pas définie, est de '1'. Cela signifie que si vous voulez modifier l'ordre d'affichage des éléments, vous aurez souvent besoin d'ajuster les ordinaux de plusieurs éléments.

+ +

L'ajustement de l'ordinal d'un élément ne se fait pas aussi simplement par le placement des éléments dans un certain ordre dans la source. Il peut être utilisé pour réarranger les éléments plus tard sans ajuster le DOM. L'exemple suivant en est une illustration.

+ +

Exemple 4: Source Voir

+ +
<hbox>
+  <button label="Un" oncommand="this.ordinal++;"/>
+  <button label="Deux" oncommand="this.ordinal++;"/>
+  <button label="Trois" oncommand="this.ordinal++;"/>
+</hbox>
+
+ +

Si vous pressez le premier bouton, son ordinal augmentera de un, de '1' à '2'. Il apparaîtra à la fin de la ligne puisque les autres boutons ont un ordinal de '1'. Si vous pressez le second bouton, son ordinal sera augmenté de un et sera déplacé à la fin de la ligne. Les éléments de même ordinal apparaîtront dans le même ordre que dans la source. Si vous pressez une nouvelle fois le bouton libellé 'Un', son ordinal augmentera à '3' et il sera déplacé à la fin. Finalement, presser le bouton libellé 'Trois' augmentera son ordinal à '2' et le fera apparaître entre les deux autres boutons.

+ +
Attribut dir
+ +

L'attribut final d'ordonnancement de boîte est l'attribut dir, ou la propriété CSS -moz-box-direction. S'il est initialisé à 'reverse', tous les enfants dans la boîte sont affichés dans l'ordre inverse. Dans une boîte horizontale, les éléments seront affichés de la droite vers la gauche et dans une boîte verticale, les éléments seront affichés du bas vers le haut. Voici un exemple :

+ +

Exemple 5: Source Voir

+ +
<hbox dir="reverse">
+  <button label="Gauche"/>
+  <button label="Centre"/>
+  <button label="Droite"/>
+</hbox>
+
+ +

Parcourir les nœuds en utilisant l'ordonnancement des objets de boîte vous renverra les éléments dans leur ordre d'affichage en tenant compte des ajustements faits sur leur ordinaux. Ainsi, si vous changez l'ordinal d'un élément, celui-ci aura une position différente dans la boîte. Toutefois, le renversement de la direction n'affectera pas l'ordre de la boîte.

+ +
+

Ensuite, nous verrons comment utiliser les objets XPCOM à partir de XUL et des scripts.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

+ +

 

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/les_objets_bo\303\256tes_des_arbres/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/les_objets_bo\303\256tes_des_arbres/index.html" new file mode 100644 index 0000000000..60924214cb --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/les_objets_bo\303\256tes_des_arbres/index.html" @@ -0,0 +1,193 @@ +--- +title: Les objets boîtes des arbres +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Les_objets_boîtes_des_arbres +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Tree_Box_Objects +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Cette section va décrire l'objet de boîte d'arbre qui est utilisé pour gérer l'affichage d'un arbre.

+ +

À propos de l'objet de boîte

+ +

Les objets de boîte ont été décrits dans une section précédente. L'objet de boîte d'arbre est un objet de boîte spécial utilisé spécifiquement pour les arbres (tree). La boîte d'arbre implémente l'interface TreeBoxObject.

+ +

Rafraichissement de l'arbre

+ +

Nous avons déjà vu la fonction rowCountChanged() de l'objet de boîte d'arbre dans la section précédente. Elle est employée pour indiquer qu'une ou plusieurs lignes de l'arbre ont été ajoutées ou enlevées. L'arbre rafraîchira l'affichage de la zone affectée. Vous n'avez pas besoin d'appeler la fonction rowCountChanged() lorsqu'une ligne a simplement été modifiée, comme par exemple lors du changement du libellé d'une cellule. Dans ce cas, d'autres fonctions d'affichage peuvent être utilisées. La plus simple est la fonction invalidateRow() qui rafraîchit l'affichage d'une ligne spécifique d'un arbre. L'arbre appellera la vue pour obtenir les données mises à jour et actualise son contenu à l'écran.

+ +

Les autres fonctions de rafraichissement sont :

+ + + +

Notez que le rafraichissement de l'affichage n'aura lieu qu'une fois les tâches des scripts achevées, car Mozilla n'effectue pas cette opération en tâche de fond.

+ +

Défilement de l'arbre

+ +

Vous pouvez également faire défiler l'arbre en utilisant quatre méthodes différentes, similaires à celles disponibles pour les menus déroulants. La fonction scrollToRow() peut être utilisée pour faire le défilement jusqu'à une ligne particulière. Voici un exemple simple :

+ +

Exemple 1: Source Voir

+ +
<script>
+function doScroll(){
+  var value = document.getElementById("tbox").value;
+  var tree = document.getElementById("thetree");
+
+  var boxobject = tree.boxObject;
+  boxobject.QueryInterface(Components.interfaces.nsITreeBoxObject);
+  boxobject.scrollToRow(value);
+}
+</script>
+
+<tree id="thetree" rows="4">
+  <treecols>
+    <treecol id="row" label="Ligne" primary="true" flex="1"/>
+  </treecols>
+  <treechildren>
+    <treeitem label="Ligne 0"/>
+    <treeitem label="Ligne 1"/>
+    <treeitem label="Ligne 2"/>
+    <treeitem label="Ligne 3"/>
+    <treeitem label="Ligne 4"/>
+    <treeitem label="Ligne 5"/>
+    <treeitem label="Ligne 6"/>
+    <treeitem label="Ligne 7"/>
+    <treeitem label="Ligne 8"/>
+    <treeitem label="Ligne 9"/>
+  </treechildren>
+</tree>
+
+<hbox align="center">
+  <label value="Défile jusqu'à la ligne :"/>
+  <textbox id="tbox"/>
+  <button label="Défile" oncommand="doScroll();"/>
+</hbox>
+
+ +
Notez que nous utilisons l'attribut rows sur l'élément tree pour spécifier que quatre lignes seulement doivent être affichées à la fois. Ainsi, il est plus facile de se représenter l'exemple. Notez également que la première ligne commence à '0'.
+ +

La fonction doScroll() récupère l'objet de boîte et appelle la fonction scrollToRow() avec comme argument la valeur saisie dans le champ texte. Vous noterez que l'objet de boîte d'arbre peut être obtenu de la même manière qu'avec d'autres objets de boîte, en utilisant la propriété boxObject. Nous devons cependant appeler QueryInterface() pour invoquer l'objet de boîte spécifique aux arbres. Les fonctions générales de l'objet de boîte sont également disponibles pour les arbres.

+ +

Les méthodes supplémentaires de défilement incluent les fonctions scrollByLines(), scrollByPages(), et ensureRowIsVisible().

+ +

La fonction scrollByLines() fait défiler vers le haut ou vers le bas d'un certain nombre de lignes ; un nombre positif fait défiler vers le bas, un nombre négatif fait défiler vers le haut. La fonction scrollByPages() fait défiler d'un certain nombre de pages. Elle est automatiquement appelée lorsque l'utilisateur appuie sur une des touches Page Up ou Page Down et que l'arbre a le focus. Une page est égale au nombre de lignes visibles. Par exemple, si un arbre affiche 10 lignes en même temps, une page sera équivalente à 10 lignes. C'est une méthode pratique dès lors que l'utilisateur redimensionne un arbre flexible : la taille de la page augmentera ou diminuera automatiquement sans avoir à la recalculer manuellement. Il n'est pas trop difficile de calculer cette taille manuellement car l'objet de boîte d'arbre fournit également une fonction getPageLength() qui retourne le nombre de lignes dans une page. Dans l'exemple de défilement ci-dessus, getPageLength() retournerait '4'.

+ +
Notez que dans Firefox 1.0 et Mozilla 1.7, et les versions plus récentes, la fonction getPageLength() est plutôt appelée getPageCount(). Le nom a été changé en getPageLength() afin d'éviter les confusions avec une fonction qui ne retourne pas le nombre de pages d'un arbre, mais la taille de chaque page. Vous pouvez déterminer le nombre de pages en divisant le nombre total de lignes par la taille d'une page.
+ +

La fonction ensureRowIsVisible() fera défiler l'arbre jusqu'à une ligne, comme avec la fonction scrollToRow(), mais seulement si la ligne n'est pas visible au moment de l'appel.

+ +

Coordonnées d'une cellule

+ +

Certaines des fonctions les plus intéressantes d'un objet de boîte d'arbre sont utilisées pour obtenir les parties d'un arbre se trouvant à des coordonnées spécifiques et vice versa.

+ + + +
tree.boxObject.getRowAt( 50, 100 );
+ +

Cet exemple retournera l'index de la ligne ayant une position horizontale de '50' pixels et verticale de '100' pixel. Naturellement, la coordonnée x semble ne pas avoir beaucoup de sens dès lors que la ligne occupe tout l'espace horizontal de l'arbre.

+ +
Il est important de noter que les coordonnées sont mesurées à partir du coin supérieur gauche du document et non de l'arbre lui-même.
+ +

Il est donc facile de passer à ces fonctions les coordonnées événementielles de l'objet event, comme avec la fonction getCellAt() dans l'exemple suivant.

+ +

Exemple 2: Source Voir

+ +
<script>
+function updateFields(event){
+  var row = {}, column = {}, part = {};
+  var tree = document.getElementById("thetree");
+
+  var boxobject = tree.boxObject;
+  boxobject.QueryInterface(Components.interfaces.nsITreeBoxObject);
+  boxobject.getCellAt(event.clientX, event.clientY, row, column, part);
+
+  if (column.value && typeof column.value != "string")
+    column.value = column.value.id;
+
+  document.getElementById("row").value = row.value;
+  document.getElementById("column").value = column.value;
+  document.getElementById("part").value = part.value;
+}
+</script>
+
+<tree id="thetree" flex="1" onmousemove="updateFields(event);">
+  <treecols>
+    <treecol id="utensil" label="Ustensiles" primary="true" flex="1"/>
+    <treecol id="count" label="Nombre" flex="1"/>
+  </treecols>
+  <treechildren>
+    <treeitem>
+      <treerow>
+        <treecell label="Fourchette"/>
+        <treecell label="5"/>
+      </treerow>
+    </treeitem>
+    <treeitem>
+      <treerow>
+        <treecell label="Couteau"/>
+        <treecell label="2"/>
+      </treerow>
+    </treeitem>
+    <treeitem>
+      <treerow>
+        <treecell label="Cuillère"/>
+        <treecell label="8"/>
+      </treerow>
+    </treeitem>
+  </treechildren>
+</tree>
+
+<label value="Ligne:"/>
+<label id="row"/>
+<label value="Colonne:"/>
+<label id="column"/>
+<label value="Type enfant:"/>
+<label id="part"/>
+
+ +

La fonction getCellAt() prend cinq arguments, les coordonnées où regarder et trois autres paramètres. Un argument par référence est utilisé parce que la fonction a besoin de retourner plusieurs valeurs. Vous verrez de nombreuses interfaces utilisant des arguments par référence avec les objets disponibles. Ces arguments sont marqués avec un préfixe 'out'. Pour ceux-ci, vous devez transmettre un objet vide et la fonction remplira sa propriété value avec la valeur adéquate.

+ +

Les trois paramètres par référence seront renseignés avec la ligne, la colonne et le type enfant. L'objet row contient l'index de la ligne survolée par la souris au moment où la fonction a été appelée par un événement mousemove, avec les coordonnées de cet événement. Si les coordonnées ne sont pas au-dessus d'une ligne de l'arbre, la valeur row.value sera égale à '-1'. La variable column est un objet column tel que défini dans Mozilla 1.8 et supérieur. Dans les versions plus anciennes, les colonnes étaient identifiées avec une chaîne de caractères (string) : l'identifiant id de la colonne. Avec les versions plus récentes, un objet de colonne spécifique existe et permet de réaliser des requêtes sur les données en colonne.

+ +

La ligne suivante est utilisée pour que l'exemple ci-dessus puisse fonctionner avec toutes les versions.

+ +
if (column.value && typeof column.value != "string")
+  column.value = column.value.id;
+
+ +

Si la colonne est une chaîne de caractères, nous tournons sur Mozilla 1.7 ou inférieur, mais pour les versions récentes, nous obtenons l'identifiant de la colonne à partir de l'objet column. Si vous écrivez du code pour des versions multiples, vous devrez effectuer un test comme indiqué ci-avant.

+ +

Le dernier argument de la fonction getCellAt() est le type enfant renseigné avec une chaîne dépendante de la partie de la cellule pointée par les coordonnées. Si vous déplacez la souris dans l'exemple précédent, vous noterez que le libellé passe de 'text' à 'cell'. La valeur 'text' indique la zone où le texte est dessiné et la valeur 'cell' indique la zone autour du texte ; par exemple, la marge gauche où sont habituellement dessinées les poignées ouvrantes et fermantes. Toutefois, s'il y avait une poignée, la valeur aurait plutôt été 'twisty'. Cette information pratique permet de déterminer si l'utilisateur a cliqué sur une poignée plutôt que sur une autre partie de la ligne. En fait, lorsque l'utilisateur double-clique sur la poignée, le code natif sous-jacent utilise cette méthode. La dernière valeur qui peut être retournée est 'image' si une image se trouve dans la cellule et que les coordonnées correspondent à celles de cette image. Bien entendu, dans la plupart des cas, vous ne désirez pas connaître quelle partie de la cellule pointe les coordonnées, mais seulement la ligne et la colonne concernées.

+ +

Pour inverser la recherche et obtenir les coordonnées spécifiques d'une cellule, utilisez la fonction getCoordsForCellItem(). Elle prend sept arguments tels que décrits ci-dessous.

+ +
var x = {}, y = {}, width = {}, height = {};
+if (typeof tree.columns != "undefined") column = tree.columns[column];
+tree.boxObject.getCoordsForCellItem( row, column, part, x, y, width, height );
+
+ +

Les arguments 'row', 'column' et 'part' sont similaires à ceux retournés par la fonction getCellAt(). De nouveau, le type de l'argument 'column' dépend de la version que vous utilisez, soit une chaîne de caractères (string), soit un objet column. Le type de la zone de la cellule peut être utilisé pour obtenir les coordonnées, soit du texte, soit de toute la cellule, soit de la poignée, soit de l'image dans la cellule. Les mêmes valeurs que la fonction getCellAt() sont utilisées. La fonction getCoordsForCellItem() retourne par le biais des arguments passés en référence les coordonnées horizontales (x) et verticales (y), accompagnées de la largeur et la hauteur.

+ +
+

Par la suite, nous verrons comment RDF peut être utilisé automatiquement pour peupler des arbres et d'autres éléments.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/les_scripts_d'installation/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/les_scripts_d'installation/index.html new file mode 100644 index 0000000000..0f5213a192 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/les_scripts_d'installation/index.html @@ -0,0 +1,147 @@ +--- +title: Les scripts d'installation +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Les_scripts_d'installation +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Install_Scripts +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +
NdT : Attention, cette section décrit le mécanisme XPInstall propre à la suite Mozilla et à des versions anciennes de Mozilla Firefox. Pour les versions récentes de Mozilla Firefox, ce mode d'installation n'est plus le même, mais il n'est pas encore décrit dans ce tutoriel. Voir comment faire des extensions pour firefox sur xulfr.org.
+ +

Cette section décrit le script d'installation.

+ +

Création d'un script d'installation

+ +
Note : Pour des extensions Firefox, install.js n'est plus utilisé. Vous devez utiliser install.rdf à la place.
+ +

Vous voulez généralement avoir une forme de contrôle sur vos processus d'installation. Par exemple, vous pouvez souhaiter vérifier les versions des fichiers existants et n'installer que des mises à jour, ou peut être souhaiteriez-vous simplement appliquer des corrections. Le script d'installation est même assez souple pour vous permettre de désinstaller des fichiers. Pour ces raisons, les programmes d'installation incluent un script propre à cette tâche.

+ +

Le script d'installation doit s'appeler 'install.js' et doit être placé à la racine de l'archive de l'installeur. Ce script contient du code JavaScript qui appelle un certain nombre de fonctions d'installation.

+ +

Dans un document HTML ou un document XUL, l'objet window est l'objet global racine. Il signifie que vous pouvez appeler les méthodes de l'objet window sans les faire précéder de leur qualificateur, ainsi window.open() peut simplement être écrit open(). Dans un script d'installation, il n'y a pas de fenêtre associée, toutefois l'objet global sera l'objet Install qui contient un certain nombre de fonctions pour personnaliser le processus d'installation. Certaines fonctions de l'objet global Install seront décrites ci dessous.

+ +

Le script d'installation doit suivre les étapes suivantes :

+ +
    +
  1. Initialiser l'installation en précisant le paquetage et sa version.
    2. +
  2. Utiliser les fonctions d'installation pour spécifier les fichiers et les répertoires qui doivent être installés. Vous pouvez aussi spécifier les fichiers à déplacer ou à effacer.
    3. +
  3. Démarrer le processus qui installe les fichiers nécessaires.
    4. +
+ +

Il est important de signaler que pendant l'étape numéro deux, vous n'indiquez seulement quels sont les fichiers qui seront installés et quelles autres opérations vous souhaitez réaliser. Aucun fichier ne sera copié avant l'étape trois. En procédant de la sorte, vous pouvez facilement définir plusieurs fichiers à installer, et en cas d'erreurs, vous pouvez annuler tout le processus d'installation sans modifier le système de l'utilisateur.

+ +

Le registre d'extensions

+ +

Mozilla tient à jour un fichier qui est un registre de toutes les extensions actuellement installées. Les extensions incluent les nouveaux paquetages chrome, les thèmes graphiques et les plugins. Lorsqu'une nouvelle extension est installée, le registre est mis à jour. Le registre stocke aussi l'ensemble des informations des fichiers et de leurs versions sur les extensions installées. De cette manière, il est aisé de vérifier si une version de votre extension est déjà présente et de la mettre à jour seulement si nécessaire.

+ +

Le registre d'extensions fonctionne presque comme la base de registre de Windows. Il consiste en une série hiérarchisée de clefs et de valeurs. Vous n'avez pas besoin d'en savoir plus à son sujet pour créer des applications XUL à moins que vous ne créiez vos propres composants XPCOM.

+ +

Ce que vous devez savoir pour une installation est que le registre stocke une série d'informations sur votre application, tels que la liste des fichiers et leurs versions. Toutes ces informations sont stockées dans une clef (et à l'intérieur, des sous clefs) que vous fournissez dans le script d'installation (dans l'étape 1 mentionnée ci dessus).

+ +

Cette clef est structurée comme une arborescence de répertoire comme ceci :

+ +
/Auteur/Nom du Paquetage
+ +

Remplacez le mot 'Auteur' par votre nom et remplacez le 'Nom du Paquetage' avec le nom de votre paquetage que vous installez. Par exemple :

+ +
/Xulplanet/Find Files
+
+/Netscape/Personal Security Manager
+ +

Le premier exemple est celui utilisé pour notre exemple de boite de dialogue de recherche de fichiers. Le second est la clef utilisée pour le gestionnaire de données privées.

+ +

Initialisation de l'installation

+ +

L'objet Install a une fonction, initInstall(), servant à initialiser l'installation. Elle doit être appelée au lancement de votre script d'installation. La syntaxe de cette fonction est la suivante :

+ +
initInstall( packageName , regPackage , version );
+
+'''Exemple:'''
+
+initInstall("Find Files","/Xulplanet/Find Files","0.5.0.0");
+ + + +

Ensuite, nous devons indiquer le répertoire où seront installés les fichiers. Il y a deux façons de le faire.

+ + + +

La fonction setPackageFolder() assigne un répertoire d'installation. Pour l'exemple de recherche de fichiers, vous installerons les fichiers dans le répertoire chrome (nous pourrions aussi bien les mettre autre part). Cette fonction setPackageFolder() ne requiert qu'un argument, le répertoire d'installation. Pour une compatibilité maximale, vous ne devez pas spécifier un répertoire absolu. Au lieu de cela, vous utiliserez un identifiant d'un répertoire connu et pointerez sur un de ses sous répertoires. Ainsi, si votre application a besoin d'installer quelques librairies systèmes, vous n'avez pas besoin de connaître le nom de ces répertoires.

+ +

Les identifiants de sélection de répertoires sont expliqués sur la page de XULPlanet référence. Pour le répertoire chrome, l'identifiant est 'Chrome'. La fonction getFolder() peut être utilisée pour récupérer un de ces répertoires spéciaux. Cette fonction prend deux arguments, le premier étant l'identifiant et le second étant un sous répertoire. Par exemple :

+ +
findDir = getFolder("Chrome","findfile"); setPackageFolder(findDir);
+ +

Ici, nous récupérons l'emplacement du sous répertoire 'findfile' dans répertoire Chrome et nous le passons directement à la fonction setPackageFolder(). Le second argument de la fonction getFolder() est le sous répertoire qui servira à l'installation de l'exemple et qui n'a pas besoin d'avoir été créé d'abord. Vous pouvez ignorer cet argument si vous n'en avez pas besoin.

+ +

Marquage des fichiers d'installation

+ +

Ensuite, vous devez indiquer quels seront les fichiers à installer. Deux fonctions doivent être employées pour cela, addDirectory() et addFile(). La fonction addDirectory() précise à l'installeur un répertoire de l'archive XPI (et tout son contenu) qui devra être installé à un emplacement particulier. La fonction addFile() est similaire mais seulement pour un fichier.

+ +

Les deux fonctions addDirectory() et addFile() ont plusieurs paramétrages. Le plus simple ne prend qu'un seul argument qui est le répertoire servant à l'installation.

+ +
addDirectory ( dir );
+addFile ( dir );
+
+Exemple:
+
+addDirectory("findfile");
+
+ +

L'exemple ci dessus spécifie que le répertoire 'findfile' de l'archive d'installation est à installer. Nous pouvons appeler ces fonctions autant de fois que nécessaire pour les autres fichiers.

+ +

Ensuite, nous voulons enregistrer les fichiers de notre exemple dans le registre chrome afin de pouvoir les appeler par une URL chrome. La fonction registerChrome() est utilisée pour cela. Elle prend deux arguments, le premier étant le type d'enregistrement chrome ('content' pour du contenu, 'skin' pour du thème graphique, ou 'locale' pour la localisation), le second pointant vers l'emplacement du fichier manifest 'contents.rdf' à enregistrer. Comme notre exemple de recherche de fichiers contient les trois types, la fonction registerChrome() devra être appelée trois fois.

+ +
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"));
+
+ +

L'indicateur DELAYED_CHROME sert à indiquer que le chrome devra être installé au prochain lancement de Mozilla.

+ +

Finalisation de l'installation

+ +

Les fonctions addDirectory() et addFile() ne copient aucun fichier. Elles ne servent qu'à pointer quels fichiers devront être installés. De la même manière, la fonction registerChrome() ne fait que pointer quel chrome devra être enregistré. Pour achever le processus et commencer la copie des fichiers, appelez la fonction performInstall() sans argument.

+ +
+

Le script final pour installer notre exemple de recherche de fichiers est le suivant :

+ +

Exemple 1: Source

+ +
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();
+
+
+ +
+

Dans la section suivantes, nous verrons quelques fonctions supplémentaires pour l'installation.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/localisation/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/localisation/index.html new file mode 100644 index 0000000000..3bc67299f8 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/localisation/index.html @@ -0,0 +1,328 @@ +--- +title: Localisation +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Localisation +tags: + - Localisation + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Localization +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

XUL et XML fournissent des entités qui sont une solution permettant la localisation.

+ +

Entités

+ +

De nombreuses applications sont construites de telle sorte que la traduction de l'interface en différentes langues soit le plus simple possible. En général, une table de chaînes de caractères est créée pour chaque langue. Au lieu de la coder directement dans l'application, chaque partie de texte est seulement une référence dans la table de chaînes. XML fournit des entités qui peuvent être utilisées dans un but similaire.

+ +

Vous devriez déjà être familier avec les entités si vous avez déjà écrit en HTML. Les codes &lt; et &gt; sont des exemples d'entités qui peuvent être utilisées pour placer les signes "inférieur" et "supérieur" dans le texte. XML a une syntaxe qui autorise la déclaration de vos propres entités. Vous pouvez les utiliser de manière à ce que l'entité soit remplacée par sa valeur qui peut être une chaîne de caractères. Des entités peuvent être employées toutes les fois où du texte est utilisé, y compris pour les valeurs des attributs. L'exemple ci-dessous décrit l'utilisation d'une entité dans un bouton.

+ +
<button label="&findLabel;"/>
+ +

Le texte qui apparaîtra sur le libellé sera la valeur de l'entité  &findlabel;

+ +

Un fichier contenant les déclarations d'entités pour chaque langue supportée est créé. En français, on affectera probablement la valeur de texte 'Rechercher' à l'entité &findlabel;

+ +

Les fichiers DTD

+ +

 

+ +

Les entités sont déclarées dans des fichiers DTD (Document Type Declaration). Ces types de fichiers sont en général utilisés pour déclarer la syntaxe et la sémantique d'un fichier XML particulier, mais ils autorisent aussi la déclaration d'entités. Dans le système chrome de Mozilla, vous trouverez les fichiers DTD dans le sous-répertoire locales. Vous devriez normalement avoir un fichier DTD (avec un extension dtd) par fichier XUL.

+ +

 

+ +

Si vous regardez dans le répertoire chrome, vous devriez voir une archive pour votre langue (fr.jar par défaut pour le français). Vous pouvez avoir les fichiers de locales dans des langues multiples, par exemple, Anglais US (en-US) et Danois (dk). Dans ces archives, vous trouverez les fichiers qui contiennent les traductions pour chaque fenêtre. La structure de l'archive est très similaire à la structure des répertoires utilisée pour les thèmes.

+ +

 

+ +

Dans les archives, vous placerez les fichiers DTD, dans lesquels vous déclarez les entités. Normalement vous aurez un fichier DTD par fichier XUL, en général avec le même nom de fichier excepté qu'il aura une extension .dtd. Donc pour la fenêtre de dialogue de recherche de fichiers, vous aurez besoin d'un fichier nommé findfile.dtd.

+ +

 

+ +

Pour les fichiers chromes non installés, vous pouvez juste mettre le fichier DTD dans le même répertoire que le fichier XUL.

+ +
Note : Vous devez encoder les fichiers en UTF-8 à cause des caractères non ASCII. De ce fait, vous devez les sauvegarder au format UTF-8 (sans BOM). Pour plus d'information, consultez Mozilla language Packs.
+ +

Une fois que vous avez créé le fichier DTD pour votre fichier XUL, vous aurez besoin d'ajouter une ligne dans le fichier XUL qui indiquera que vous voulez utilisez le fichier DTD. Sinon, des erreurs seront générées car il ne sera pas capable de trouver les entités. Il vous suffit d'ajouter une ligne de la forme suivante vers le début du fichier XUL :

+ +
<!DOCTYPE window SYSTEM "chrome://findfile/locale/findfile.dtd">
+ +

Cette ligne spécifie que l'URL indiquée est à utiliser en tant que fichier DTD. Dans ce cas, nous avons déclaré que nous voulons utiliser le fichier DTD findfile.dtd. Cette ligne est en général placée juste avant l'élément window.

+ +

Vous devez également ajouter la localisation dans le fichier chrome.manifest, par exemple :

+ +
locale findfile fr locale/
+
+ +

Déclarer les entités

+ +

Les entités sont déclarées en utilisant une syntaxe simple vue ci-dessous :

+ +
<!ENTITY findLabel "Rechercher">
+ +

Cet exemple crée une entité avec le nom 'findLabel' et la valeur 'Rechercher'. Elle signifie que quelque soit l'endroit où le texte '&findLabel;' apparaîtra dans le fichier XUL, il sera remplacé par le texte 'Rechercher'. Notez que les déclarations d'entités n'ont pas de slash terminal. Dans le fichier DTD d'une autre langue, le texte pour cette langue sera utilisé à la place.

+ +
pour l'anglais:
+<!ENTITY findLabel "Find">
+
+ +

Par exemple, le texte suivant :

+ +
<description value="&findLabel;"/>
+ +

est converti en :

+ +
version française:
+<description value="Rechercher"/>
+
+version anglaise
+<description value="Find"/>
+
+ +

Vous devrez déclarer une entité pour chaque libellé ou chaîne de caractères que vous utiliserez dans votre interface. Vous ne devriez plus avoir de texte affiché directement dans le fichier XUL.

+ +

En plus d'utiliser les entités pour les libellés, vous devriez les utiliser pour chaque valeur qui pourrait être différente selon la langue ; les touches d'accès et les raccourcis claviers par exemple.

+ +
XUL
+<menuitem label="&undo.label;" accesskey="&undo.key;"/>
+DTD
+<!ENTITY undo.label "Annuler">
+<!ENTITY undo.key "u">
+
+ +

L'exemple ci-dessus utilise deux entités, une pour le libellé de l'élément de menu Annuler et une seconde pour la touche d'accès.

+ +
+

Modification de la boîte de dialogue de recherche de fichiers

+ +

Jetons un œil sur la manière dont nous pourrions utiliser tout ce que nous avons appris en modifiant la boîte de dialogue de recherche de fichiers de manière à ce qu'elle utilise un fichier DTD pour toutes ses chaînes de caractères. La totalité du fichier XUL est décrite ci-dessous avec les changements décrits en rouge.

+ +
<?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>
+   <menupopup id="editpopup">
+     <menuitem label="&cutCmd.label;" accesskey="&cutCmd.accesskey;"/>
+     <menuitem label="&copyCmd.label;" accesskey="&copyCmd.accesskey;"/>
+     <menuitem label="&pasteCmd.label;" accesskey="&pasteCmd.accesskey;" disabled="true"/>
+   </menupopup>
+</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>
+
+ +

Chaque chaîne de caractères a été remplacée par une référence à une entité. Un fichier DTD a été inclus au début du fichier XUL. Chaque entité qui a été ajoutée doit être déclarée dans le fichier DTD. La fenêtre ne sera pas affichée si une entité non déclarée est trouvée dans le fichier XUL.

+ +

Notez que le nom de l'entité n'est pas important. Dans l'exemple ci-dessus, les mots dans les entités ont été séparés par des points. Vous n'avez pas à faire ça. Les noms des entités ici suivent des conventions similaires au reste du code de Mozilla.

+ +

Vous aurez noté que le texte '2520 octets' a été remplacé par deux entités. En fait, la structure de la phrase pourrait être différente dans une autre langue. Par exemple, le nombre pourrait apparaître après l'équivalent du mot 'octets' au lieu d'avant. Bien sûr, il est beaucoup plus compliqué de vouloir l'affichage des Ko ou des Mo selon les besoins.

+ +

Les touches d'accès et les raccourcis claviers ont aussi été traduits dans les entités car ils seront peut être différents dans une autre langue.

+ +

Voici le fichier DTD (findfile.dtd) :

+ +
<!ENTITY findWindow.title "Recherche de fichiers">
+<!ENTITY fileMenu.label "Fichier">
+<!ENTITY editMenu.label "Edition">
+<!ENTITY fileMenu.accesskey "f">
+<!ENTITY editMenu.accesskey "e">
+<!ENTITY openCmd.label "Ouvrir une recherche...">
+<!ENTITY saveCmd.label "Sauvegarder une recherche...">
+<!ENTITY closeCmd.label "Fermer">
+<!ENTITY openCmd.accesskey "o">
+<!ENTITY saveCmd.accesskey "s">
+<!ENTITY closeCmd.accesskey "f">
+<!ENTITY cutCmd.label "Couper">
+<!ENTITY copyCmd.label "Copier">
+<!ENTITY pasteCmd.label "Coller">
+<!ENTITY cutCmd.accesskey "p">
+<!ENTITY copyCmd.accesskey "c">
+<!ENTITY pasteCmd.accesskey "l">
+<!ENTITY cutCmd.commandkey "X">
+<!ENTITY copyCmd.commandkey "C">
+<!ENTITY pasteCmd.commandkey "V">
+<!ENTITY openCmdToolbar.label "Ouvrir">
+<!ENTITY saveCmdToolbar.label "Sauvegarder">
+<!ENTITY searchTab "Rechercher">
+<!ENTITY optionsTab "Options">
+<!ENTITY findDescription "Entrez votre critère de recherche ci-dessous et appuyer sur le bouton Rechercher.">
+<!ENTITY findCriteria "Critère de recherche">
+<!ENTITY type.name "Nom">
+<!ENTITY type.size "Taille">
+<!ENTITY type.date "Date de modification">
+<!ENTITY mode.is "Est">
+<!ENTITY mode.isnot "N'est pas">
+<!ENTITY casesensitive "Recherche sensible à la casse">
+<!ENTITY matchfilename "Rechercher un nom entier">
+<!ENTITY results.filename "Nom de fichier">
+<!ENTITY results.location "Emplacement">
+<!ENTITY results.size "Taille">
+<!ENTITY bytes.before "">
+<!ENTITY bytes.after "octets">
+<!ENTITY button.find "Rechercher">
+<!ENTITY button.cancel "Annuler">
+
+ +

Maintenant pour changer de langue, tout ce que vous avez à faire est de créer un nouveau fichier DTD. En utilisant le système chrome pour ajouter le fichier DTD dans une langue différente, le même fichier XUL peut être utilisé pour toutes les langues.

+
+ +
+

Dans la prochaine section, nous regarderons les fichiers de propriétés.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/manipulation_de_listes/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/manipulation_de_listes/index.html new file mode 100644 index 0000000000..12a2c19574 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/manipulation_de_listes/index.html @@ -0,0 +1,132 @@ +--- +title: Manipulation de listes +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Manipulation_de_listes +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Manipulating_Lists +--- +

 

+
+

« PrécédentSuivant »

+
+

La boîte de liste XUL fournit un certain nombre de méthodes spécialisées.

+

Manipulation d'une liste

+

L'élément listbox fournit de nombreuses méthodes pour rechercher et manipuler ses items. Bien que les boîtes de liste puissent être manipulées en utilisant les fonctions standard de DOM, il est recommandé d'employer les fonctions spécialisées de listbox autant que possible. Ces fonctions sont plus simples et feront correctement leur travail.

+

La fonction appendItem() est utilisée pour ajouter un nouvel item à la fin d'une liste. Elle est similaire à la fonction appendChild() du DOM sauf qu'elle prend un libellé texte, et que vous n'avez pas à vous soucier où placer votre item dans la structure de la liste. Voici un exemple :

+

Exemple 1: Source Voir

+
<script>
+function addItem(){
+  document.getElementById('laliste').appendItem("Jeudi", "jeu");
+}
+</script>
+
+<listbox id="laliste"/>
+
+<button label="Ajouter" oncommand="addItem();"/>
+
+

La fonction appendItem() prend deux arguments, le libellé, dans l'exemple 'Jeudi', et une valeur 'jeu'. Les deux arguments correspondent aux attributs label et value dans l'élément listitem. L'attribut value est optionnel et sert à affecter à un item une valeur que vous pouvez réutiliser ensuite dans un script.

+

De même, il existe les fonctions insertItemAt() et removeItemAt(), qui ajoutent respectivement un nouvel item et suppriment un item existant. La syntaxe est la suivante :

+
list.insertItemAt(3, "Jeudi", "jeu");
+list.removeItemAt(3);
+
+

La fonction insertItemAt() prend un argument supplémentaire, la position pour insérer le nouvel item. Le nouvel item est inséré à cet index. Ainsi, dans l'exemple, le nouvel item sera ajouté à la position 3 et l'item qui avait cette position aura maintenant l'index 4. Rappelez-vous que le premier item est 0. La fonction removeItemAt() supprimera l'item à un index spécifique.

+

Ces trois méthodes sont également disponibles pour plusieurs autres éléments XUL et fonctionnent de la même manière. En fait, ces méthodes font parties de l'interface nsIDOMXULSelectControlElement donc tous les éléments XUL qui implémentent cette interface héritent de ces méthodes. Les éléments menulist, radiogroup et tabs en font partie. Par exemple, pour ajouter un nouvel item à un menulist, vous pouvez employer la même syntaxe qu'une listbox. Le bon type d'élément sera ajouté dans chaque cas.

+

Sélection de liste

+

L'interface nsIDOMXULSelectControlElement fournit deux propriétés supplémentaires, selectedIndex et selectedItem. La première renvoie l'index de l'item sélectionné tandis que la seconde renvoie l'élément sélectionné. Par exemple, la valeur de retour de selectedItem sera le menuitem sélectionné. Si aucun item n'est sélectionné, selectedIndex retournera '-1', et selectedItem renverra 'null'.

+

Récupérer l'item sélectionné

+

Ces deux propriétés sont généralement inspectées durant un événement de sélection, comme dans l'exemple suivant :

+

Exemple 2: Source Voir

+
<listbox id="thelist" onselect="alert(this.selectedItem.label);">
+  <listitem label="Petit"/>
+  <listitem label="Moyen"/>
+  <listitem label="Grand"/>
+</listbox>
+
+

L'événement de sélection est exécuté par une listbox quand un item de la liste est sélectionné. Le gestionnaire affiche ici une alerte contenant le libellé de l'item sélectionné dans la liste. Puisque l'événement de sélection s'est exécuté, nous pouvons supposer qu'un item est sélectionné. Dans d'autres cas, vous devrez vous assurer que selectedItem n'est pas 'null' avant de poursuivre.

+

L'événement de sélection est également exécuté quand un bouton radio dans un radiogroup est sélectionné et quand un onglet est sélectionné dans l'élément tabs. Cependant, les menulists ne génèrent pas d'événement de sélection ; vous pouvez écouter l'événement "command" à la place pour traiter la sélection d'un item.

+

Pour l'élément tabs, il est souvent plus commode d'employer les fonctions de l'élément tabbox. Il a aussi une fonction selectedIndex qui renverra l'index de l'onglet sélectionné. Cependant, pour récupérer l'item sélectionné, utilisez plutôt la fonction selectedTab de tabbox. Ou alors, utilisez la fonction selectedPanel pour récupérer la page d'onglet sélectionnée, ce qui renvoie le contenu associé à l'onglet.

+

Modifier la sélection

+

Toutes les propriétés de sélection décrites ci-dessus peuvent également se voir assigner une nouvelle valeur pour modifier la sélection. Dans l'exemple suivant, la propriété selectedIndex de l'élément radiogroup est modifiée avec la valeur entrée dans un champ de saisie. Ce code n'est cependant pas performant ; par exemple, il ne vérifie pas si la valeur entrée est hors limite. Il est conseillé d'ajouter ce genre de vérification d'erreur.

+

Exemple 3: Source Voir

+
<script>
+function doSelect(){
+  var val = document.getElementById('number').value;
+  val = Number(val);
+  if (val != null)
+    document.getElementById('level').selectedIndex = val - 1;
+}
+</script>
+
+<hbox align="center">
+  <label value="Entrez un nombre compris entre 1 et 3 :"/>
+  <textbox id="number"/>
+  <button label="Sélectionnez" oncommand="doSelect();"/>
+</hbox>
+
+<radiogroup id="level">
+  <radio label="Excellent"/>
+  <radio label="Bon"/>
+  <radio label="Mauvais"/>
+</radiogroup>
+
+

Les boîtes de liste supportent aussi les sélections multiples et les fonctions de l'interface nsIDOMXULMultiSelectControlElement. Cette interface fournit un certain nombre de fonctions dédiées pour contrôler la sélection multiple. Par exemple, la propriété selectedItems contient une liste des items qui sont sélectionnés, alors que la propriété selectedCount contient le nombre d'items sélectionnés. En général, vous utiliserez ces propriétés pour parcourir la liste et y effectuer quelques opérations sur chaque item. Faites attention lorsque vous parcourez les items sélectionnés de la liste ; si vous modifiez les items dans la liste pendant que vous les parcourez, la liste sera modifiée et les propriétés de sélection pourraient retourner des valeurs différentes. C'est une raison pour laquelle il est utile de manipuler la liste par item plutôt que par l'index.

+

Effacer des items sélectionnés

+

L'exemple suivant montre une méthode correcte de suppression des items sélectionnés :

+

Exemple 4: Source Voir

+
<script>
+function deleteSelection(){
+  var list = document.getElementById('thelist');
+  var count = list.selectedCount;
+  while (count--){
+    var item = list.selectedItems[0];
+    list.removeItemAt(list.getIndexOfItem(item));
+  }
+}
+</script>
+
+<button label="Supprimer" oncommand="deleteSelection();"/>
+
+<listbox id="thelist" seltype="multiple">
+  <listitem label="Cheddar"/>
+  <listitem label="Cheshire"/>
+  <listitem label="Edam"/>
+  <listitem label="Gouda"/>
+  <listitem label="Havartie"/>
+</listbox>
+
+

À l'intérieur de la boucle while,

+ +

L'interface nsIDOMXULMultiSelectControlElement fournit également des méthodes pour modifier les items sélectionnés. Par exemple, la fonction addItemToSelection() ajoute un nouvel item à la liste des items sélectionnés, sans vider la sélection existante. La fonction removeItemFromSelection() supprime un seul item dans la sélection.

+

Défilement de liste

+

Si la boîte de liste contient plus de lignes qu'elle ne peut en afficher, une barre de défilement apparaîtra pour permettre à l'utilisateur de faire défiler la liste. La position du défilement peut être ajustée en utilisant quelques méthodes de listbox.

+

La méthode scrollToIndex() fait défiler jusqu'à une ligne donnée. Cette boîte de liste défilera jusqu'à ce que la ligne soit la première ligne visible, à moins que la ligne ne soit proche de la fin de la liste des items. La méthode ensureIndexIsVisible() est similaire puisqu'elle fait défiler la liste pour afficher une ligne, mais cette méthode ne défilera pas si l'item est déjà visible. Ainsi, la première fonction est utilisée pour faire défiler jusqu'à une ligne précise alors que la deuxième est utilisée pour s'assurer que la ligne soit visible. Il y a également ensureItemIsVisible() qui nécessite un item en argument au lieu d'un index. Comparez l'effet de ces deux fonctions à des positions de défilement différentes dans cet exemple :

+

Exemple 5: Source Voir

+
<button label="scrollToIndex"
+           oncommand="document.getElementById('thelist').scrollToIndex(4);"/>
+<button label="ensureIndexIsVisible"
+           oncommand="document.getElementById('thelist').ensureIndexIsVisible(4);"/>
+
+<listbox id="thelist" rows="5">
+  <listitem label="1"/>
+  <listitem label="2"/>
+  <listitem label="3"/>
+  <listitem label="4"/>
+  <listitem label="5"/>
+  <listitem label="6"/>
+  <listitem label="7"/>
+  <listitem label="8"/>
+  <listitem label="9"/>
+  <listitem label="10"/>
+  <listitem label="11"/>
+  <listitem label="12"/>
+</listbox>
+
+
+

Nous verrons ensuite les objets boîtes XUL.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/menus_d\303\251filants/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/menus_d\303\251filants/index.html" new file mode 100644 index 0000000000..7772a15f15 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/menus_d\303\251filants/index.html" @@ -0,0 +1,47 @@ +--- +title: Menus défilants +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Menus_défilants +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Scrolling_Menus +--- +

 

+
+

« PrécédentSuivant »

+
+

Cette section va décrire les menus défilants et comment utiliser le mécanisme avec d'autres éléments.

+

Créer un grand menu

+

Vous vous demandez peut-être ce qu'il se passerait si vous créez un menu avec beaucoup de commandes, de telle manière que tous les items ne peuvent pas s'afficher tous à l'écran en même temps. Mozilla fournit un mécanisme de défilement permettant de faire défiler les items.

+
Image:xultu_menuscroll1.png
+

Si l'espace disponible est trop petit, des flèches vont apparaître sur chaque extrémité du menu. Si vous bougez la souris sur les flèches, le menu va défiler vers le haut et vers le bas. Si l'espace disponible est assez grand, les flèches n'apparaîtront pas. Notez que le comportement exact du défilement dépendra du thème graphique utilisé.

+

Ce comportement est automatique. Vous n'avez pas à faire quoi que se soit pour avoir des menus défilants. Il va s'appliquer aux menus des barres de menu, aux menus surgissants ou listes déroulantes. Il est implémenté en utilisant un élément arrowscrollbox. Cet élément peut être utilisé pour créer une boîte de défilement avec des flèches.

+

L'élément arrowscrollbox peut être utilisé n'importe où une boîte normale peut être utilisée. Vous n'êtes pas obligé de l'utiliser pour des menus. Il s'agit toujours une boîte verticale pouvant contenir n'importe quel élément à l'intérieur. Vous pouvez l'utiliser pour implémenter une liste que vous ne voulez pas déroulante.

+

Exemple - liste défilante de boutons

+

L'exemple suivant montre comment créer une liste défilante de boutons (vous devrez redimensionner la fenêtre pour voir les boutons de flèches) :

+

Exemple 1: Source Voir

+
<arrowscrollbox orient="vertical" flex="1">
+  <button label="Rouge"/>
+  <button label="Bleu"/>
+  <button label="Vert"/>
+  <button label="Jaune"/>
+  <button label="Orange"/>
+  <button label="Argent"/>
+  <button label="Lavande"/>
+  <button label="Or"/>
+  <button label="Turquoise"/>
+  <button label="Pêche"/>
+  <button label="Bordeaux"/>
+  <button label="Noir"/>
+</arrowscrollbox>
+
+

Si vous essayez cet exemple, il va d'abord s'ouvrir en pleine taille. Cependant, si vous réduisez la taille de la fenêtre, les flèches de défilement vont apparaître. Rendre la fenêtre plus grande à nouveau va faire disparaître les flèches.

+

Vous pouvez mettre une propriété CSS max-height sur les arrowscrollbox pour limiter la taille de la boîte de défilement et ainsi faire apparaître les flèches tout le temps.

+

L'élément arrowscrollbox est principalement utile dans les menus et boîtes surgissantes.

+
+

Par la suite, nous allons voir comment ajouter des gestionnaires d'événements à des éléments XUL.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/menus_surgissants/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/menus_surgissants/index.html new file mode 100644 index 0000000000..e5e70a93c6 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/menus_surgissants/index.html @@ -0,0 +1,214 @@ +--- +title: Menus surgissants +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Menus_surgissants +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Popup_Menus +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Dans la section précédente, nous avons vu comment créer un menu sur une barre de menu. XUL a aussi la capacité de créer des menus surgissants. Les menus surgissants sont habituellement affichés lorsque l'utilisateur presse le bouton droit de la souris.

+ +

Créer un menu surgissant

+ +

XUL a trois différentes types de boîtes surgissantes, décrites ci-dessous. La différence majeure est leurs façons d'apparaître.

+ +
+
Boîte surgissante simple 
+
La boîte surgissante simple est une fenêtre surgissante qui apparaît quand l'utilisateur presse le bouton gauche de la souris sur un élément. Elles sont assez semblables aux menus sur les barres de menu, excepté qu'elles peuvent être placées n'importe où et peuvent contenir n'importe quel contenu. Un bon exemple est le menu déroulant qui apparaît quand vous maintenez le bouton de la souris enfoncé sur les boutons "précédent" et "suivant" dans la fenêtre d'un navigateur.
+
+ +
+
Boîte contextuelle 
+
La boîte contextuelle est une fenêtre surgissante qui apparaît quand l'utilisateur presse le bouton de menu contextuel, qui est habituellement le bouton droit de la souris. Sur certaines plates-formes, Il peut s'agir d'un bouton différent - mais c'est toujours le bouton ou une combinaison de touches et de bouton de souris qui invoque un menu spécifique au contexte. Sur le Macintosh par exemple, l'utilisateur doit soit presser la touche Control et le bouton de la souris, soit maintenir le bouton de la souris enfoncé un certain temps.
+
+ +
+
Bulle d'aide 
+
Une fenêtre surgissante « bulle d'aide » va apparaître quand l'utilisateur survolera un élément avec la souris. Ce type de boîte surgissante est habituellement utilisé pour fournir la description d'un bouton de façon plus détaillée que le bouton le permet lui-même.
+
+ +

Ces trois types de boîtes surgissantes diffèrent dans la façon dont l'utilisateur les invoque. Elles peuvent contenir n'importe quel contenu, bien que des menus soient courants pour les boîtes simples et contextuelles, et qu'une simple chaîne de caractères soit courante pour une bulle d'aide. Le type de boîte surgissante est déterminé par l'élément qui invoque la boîte.

+ +

Déclaration d'un menu surgissant

+ +

Une boîte sugissante est décrite en utilisant l'élément menupopup. C'est un type de boîte sans attributs spéciaux. Quand elle est invoquée, une fenêtre contenant tout ce que vous avez pu mettre dans le menupopup va s'afficher. Cependant, vous devez toujours insérer un attribut id sur le popup car il doit être associé à un élément. Nous verrons bientôt sa signification. D'abord, un exemple :

+ +
<popupset>
+   <menupopup id="clipmenu">
+     <menuitem label="Couper"/>
+     <menuitem label="Copier"/>
+     <menuitem label="Coller"/>
+   </menupopup>
+</popupset>
+
+ +

Comme vous pouvez le voir ici, un simple menu surgissant contenant trois commandes a été créé. L'élément menupopup entoure les trois items de menu. Vous remarquerez également que l'id a été mis sur l'élément menupopup lui-même.

+ +

L'élément popupset entoure l'entière déclaration de menu surgissant. Il s'agit d'un container générique pour les boîtes surgissantes, et il est optionnel. Il ne s'affiche pas à l'écran mais il est utilisé comme une section dans laquelle vous pouvez déclarer tous vos menus surgissants. Comme le nom popupset sous-entend, vous pouvez placer plusieurs déclarations de menus surgissants à l'intérieur. Ajoutez en simplement d'autres après le premier élément menupopup. Vous pouvez avoir plus d'un popupset dans un fichier, mais habituellement vous n'en aurez qu'un.

+ +

Association d'un menu surgissant à un élément

+ +

Maintenant que nous avons créé le menu surgissant, il est temps de le faire apparaître. Pour cela, nous avons besoin d'associer le menu à un élément d'où il devra apparaître. Nous faisons cela car nous voulons seulement que le menu apparaisse quand l'utilisateur clique à un certain endroit de la fenêtre. Habituellement, il s'agira d'un bouton spécifique ou d'une boîte.

+ +

Pour associer le menu surgissant à un élément, ajoutez un de ces trois attributs à l'élément. L'attribut que vous ajoutez dépend du type de menu surgissant vous voulez créer. Pour les menus surgissants simples, ajoutez l'attribut popup à l'élément. Pour les menus contextuels, ajoutez l'attribut context. Enfin, pour les bulles d'aide, ajoutez l'attribut tooltip.

+ +

La valeur de l'attribut doit être celle de l'id du menupopup que vous voulez faire apparaître. C'est pour cela que vous devez mettre un id sur le menupopup. Par ce moyen, il est facile d'avoir plusieurs menus surgissants dans un seul fichier.

+ +

Dans l'exemple ci-dessus, nous voulons faire un menu surgissant contextuel. Nous devons donc utiliser l'attribut context et l'ajouter à l'élément sur lequel nous voulons associer le menu surgissant. L'exemple ci-dessous montre comment procéder :

+ +

Exemple 1: Source Voir

+ +
Image:xultu_popups1.png
+ +
<popupset>
+  <menupopup id="clipmenu">
+    <menuitem label="Couper"/>
+    <menuitem label="Copier"/>
+    <menuitem label="Coller"/>
+  </menupopup>
+</popupset>
+
+<box context="clipmenu">
+  <label value="Faites un clic contextuel pour afficher le menu"/>
+</box>
+
+ +

Ici, le menu contextuel a été associé à une boîte. À chaque fois que vous faîtes un clic contextuel (clic droit) n'importe où dans la boîte, le menu surgissant apparaîtra. Le menu apparaîtra aussi même si vous cliquez sur un enfant de la boîte, donc il apparaîtra aussi si vous cliquez sur l'élément label. L'attribut context a été utilisé pour associer la boîte au menu contextuel de même id. Dans ce cas, le menu 'clipmenu' va apparaître. De cette façon, vous pouvez disposer de plusieurs menus surgissants et les associer avec différents éléments.

+ +

Vous pouvez associer plusieurs menus surgissants avec le même élément en mettant plusieurs d'attributs de différents types sur un élément. Vous pouvez aussi associer le même menu surgissant à plusieurs éléments, ce qui est un avantage de l'utilisation de la syntaxe popup. Les menus surgissants ne peuvent être associés qu'avec des éléments XUL. Ils ne peuvent pas être associés à des éléments HTML.

+ +

Bulles d'aide

+ +

Nous allons voir un moyen simple de créer des bulles d'aide. Il y a deux façons de créer des bulles d'aide. La méthode la plus simple, qui est la plus commune, est d'ajouter un attribut tooltiptext à un élément sur lequel vous voulez assigner une bulle d'aide.

+ +

La deuxième méthode consiste à utiliser un élément tooltip contenant le contenu d'une bulle d'aide. Il nécessite que vous ayez un bloc séparé de contenu pour chaque bulle d'aide ou que vous ayez un script contenant le contenu, bien que certains contenus hormis du texte dans une bulle d'aide ne sont pas permis.

+ +

Exemple 2: Source Voir

+ +
<button label="Sauvegarder" tooltiptext="Cliquez ici pour enregistrer vos trucs"/>
+
+<popupset>
+  <tooltip id="moretip" orient="vertical" style="background-color: #33DD00;">
+    <description value="Cliquez ici pour voir plus d'information"/>
+    <description value="Vraiment!" style="color: red;"/>
+  </tooltip>
+</popupset>
+
+<button label="Plus" tooltip="moretip"/>
+
+ +

Ces deux boutons ont chacun une bulle d'aide. Le premier utilise le style par défaut de bulle d'aide. Le second utilise une bulle d'aide modifiée qui a une couleur d'arrière-plan différente et un texte stylisé. La bulle d'aide est associée au bouton 'Plus' en utilisant l'attribut tooltip, correspondant à l'id de l'élément tooltip. Notez que l'élément tooltip est également placé à l'intérieur d'un élément popset comme pour les autres types de menus surgissants.

+ +

Alignement des menus surgissants

+ +

Par défaut, les menus surgissants et contextuels vont apparaître là où le pointeur de la souris se trouve. Les bulles d'aides seront placées légèrement sous l'élément pour que le pointeur de la souris ne les cache pas. Il y a des cas toutefois, où vous voudrez préciser l'emplacement du menu surgissant. Par exemple, le menu surgissant qui apparaît quand vous cliquez sur le bouton Précédent dans un navigateur doit apparaître sous le bouton Précédent, non pas là ou se situe le pointeur de la souris.

+ +

Pour changer la position du menu, vous pouvez utiliser un attribut additionnel, position, sur le popup. Vous pouvez aussi l'ajouter à l'élément menupopup. Cet attribut est utilisé pour indiquer l'emplacement du menu relativement à l'élément invoquant la boîte. Ses différentes valeurs applicables sont décrites brièvement ci-dessous :

+ +
+
'after_start' 
+
Le menu surgissant apparaît sous l'élément avec les bords gauche de l'élément et du menu alignés. Si le menu surgissant est plus large que l'élément, il s'étend à droite. C'est cette valeur qui est utilisée pour les menus déroulants associés avec les boutons Précédent et Suivant du navigateur.
+
+ +
+
'after_end' 
+
Le menu surgissant apparaît sous l'élément avec les bords droit de l'élément et du menu alignés.
+
+ +
+
'before_start' 
+
Le menu surgissant apparaît au-dessus de l'élément avec les bords gauche de l'élément et du menu alignés.
+
+ +
+
'before_end' 
+
Le menu surgissant apparaît au-dessus de l'élément avec les bords droit de l'élément et du menu alignés.
+
+ +
+
'end_after' 
+
Le menu surgissant apparaît à droite de l'élément avec les bords inférieurs de l'élément et du menu alignés.
+
+ +
+
'end_before' 
+
Le menu surgissant apparaît à droite de l'élément avec les bords supérieurs de l'élément et du menu alignés.
+
+ +
+
'start_after' 
+
Le menu surgissant apparaît à gauche de l'élément avec les bords inférieurs de l'élément et du menu alignés.
+
+ +
+
'start_before' 
+
Le menu surgissant apparaît à gauche de l'élément avec les bords supérieurs de l'élément et du menu alignés.
+
+ +
+
'overlap' 
+
Le menu surgissant apparaît par dessus l'élément.
+
+ +
+
'at_pointer' 
+
Le menu surgissant apparaît à la position du pointeur de la souris.
+
+ +
+
'after_pointer' 
+
Le menu surgissant apparaît à la même position horizontale que le pointeur de la souris mais apparaît sous l'élément. C'est ainsi que les bulles d'aide apparaissent.
+
+ +

En ajoutant l'attribut position à un élément popup, vous pouvez spécifier précisément où le menu surgissant doit apparaître. Vous ne pouvez pas spécifier une position exacte en pixels. L'attribut position peut être utilisé pour les trois types de menus surgissants, bien que vous ne changerez probablement pas la valeur pour les bulles d'aide.

+ +

L'exemple ci-dessous montre la création d'un bouton Précédent avec un menu surgissant :

+ +

Exemple 3: Source Voir

+ +
<popupset>
+  <menupopup id="backpopup" position="after_start">
+    <menuitem label="Page 1"/>
+    <menuitem label="Page 2"/>
+  </menupopup>
+</popupset>
+
+<button label="Affiche moi" popup="backpopup"/>
+
+ +
+

Notre exemple de recherche de fichiers

+ +

Ajoutons un simple menu surgissant à la boîte de dialogue de recherche de fichiers. Pour plus de simplicité, nous allons juste recopier le contenu du menu 'Edition'. Le menu apparaîtra quand l'on clique sur le premier onglet :

+ +

Source Voir

+ +
<popupset>   <menupopup id="editpopup">     <menuitem label="Couper" accesskey="c"/>     <menuitem label="Copier" accesskey="p"/>     <menuitem label="Coller" accesskey="l" disabled="true"/>   </menupopup> </popupset>
+
+<vbox flex="1">
+.
+.
+.
+
+<tabpanel id="searchpanel" orient="vertical" context="editpopup">
+
+Ici un simple menu surgissant, similaire au menu Edition, a été ajouté au premier onglet. Si vous faîtes un clic droit (Control-clic sur Macintosh) n'importe où sur la page de ce premier onglet, le menu surgissant va apparaître. Cependant, le menu n'apparaîtra pas si vous cliquez autre part. + +
Notez que le champs de saisie a son propre menu surgissant qui supplantera celui que nous avons spécifié.
+
+ +
+

Par la suite, nous allons voir comment créer des menus défilants.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/mise_\303\240_jour_de_commandes/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/mise_\303\240_jour_de_commandes/index.html" new file mode 100644 index 0000000000..ca785b61a8 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/mise_\303\240_jour_de_commandes/index.html" @@ -0,0 +1,98 @@ +--- +title: Mise à jour de commandes +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Mise_à_jour_de_commandes +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Updating_Commands +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Dans cette section, nous verrons comment mettre à jour des commandes.

+ +

Appel des commandes

+ +

Si une commande a un attribut oncommand, vous pouvez simplement l'appeler en utilisant la méthode doCommand de la commande ou un élément qui lui est attaché. Pour d'autres commandes, vous aurez besoin de quelques lignes de codes supplémentaires. Vous devrez passer par ces étapes spéciales dans le cas où les commandes appelées sont implémentées par un contrôleur. Vous aurez aussi besoin de le faire dans le cas où vous créez votre propre menu de commandes, par exemple pour implémenter les commandes du menu d'édition de votre propre application.

+ +

Heureusement, le code spécial est assez simple. Tout ce que nous avons besoin de faire est d'obtenir le contrôleur demandé et d'appeler la commande. Une manière simple de le faire est la suivante :

+ +
var controller = document.commandDispatcher.getControllerForCommand("cmd_paste");
+if (controller && controller.isCommandEnabled("cmd_paste")){
+  controller.doCommand(command);
+}
+
+ +

Le code ci-dessus recherche d'abord le contrôleur pour la commande 'cmd_paste' grâce au répartiteur de commandes. Puis, il teste si la commande est activée, et enfin exécute la commande utilisant la méthode doCommand du contrôleur. Notez que nous n'avons pas besoin de préciser l'élément ou le contrôleur à utiliser. Le répartiteur de commandes s'en charge. En outre, nous pourrions juste appeler doCommand sans vérifier si la commande est activée ou non, mais il vaut mieux le faire.

+ +

Le code ci-dessus est tellement générique qu'il pourrait être une fonction prenant une commande en argument et exécutant cette commande. Cette fonction pourrait être ainsi réutilisée pour toutes les commandes. En fait, c'est tellement commun que Mozilla inclut une bibliothèque qui ne fait que ça. Si vous incluez le script 'chrome://global/content/globalOverlay.js' dans un fichier XUL, vous pouvez appeler la méthode goDoCommand qui exécute la commande passée en argument. Le code pour cette fonction ne fait que quelques lignes, ainsi vous pourriez l'inclure directement dans votre code si pour certaines raisons vous ne souhaitez pas inclure la bibliothèque.

+ +
<script src="chrome://global/content/globalOverlay.js"/>
+
+<command id="cmd_paste" oncommand="goDoCommand('cmd_paste');/>
+<button label="Coller" command="cmd_paste"/>
+
+ +

L'exemple ci-dessus va implémenter un bouton pour « Coller ». Il est relié à la commande qui va appeler la commande du contrôleur concerné lorsqu'il est appelé. Le code ci-dessus est tout ce dont vous avez besoin pour implémenter la fonctionnalité de la commande Coller dans votre application. La seule autre chose dont vous avez besoin est de vous assurer que le statut de la commande Coller qui est activé, et donc du bouton, est mis à jour au bon moment, comme décrit ci-dessous.

+ +

Dispositifs de mise à jour de commande

+ +

Un dispositif de mise à jour de commande est un dispositif spécial de l'élément commandset qui lui permet de mettre à jour les statuts activés d'une ou plusieurs commandes lorsque certains événements se produisent. Vous devrez y pensez lorsqu'une commande est valide et lorsqu'elle ne l'est pas. De plus, vous devrez considérer quand l'état pourrait changer et quand les commandes devraient être mises à jour.

+ +

Par exemple, la commande « Coller » est valide lorsque le champ de saisie de texte a le focus et qu'il y a quelque chose dans le presse-papiers à coller. La commande deviendra active chaque fois que le champ de saisie aura le focus et lorsque le contenu du presse-papiers changera. Un dispositif de mise à jour de contenu surveillera ces situations et le code qui active et désactive les commandes pourra être exécuté selon les besoins.

+ +

Un simple dispositif de mise à jour de commandes ressemble à ceci :

+ +
<commandset id="updatePasteItem"
+            commandupdater="true"
+            events="focus"
+            oncommandupdate="goUpdateCommand('cmd_paste');"/>
+
+ +

Un dispositif de mise à jour de commandes est indiqué en utilisant l'attribut commandupdater, qui devrait être déclaré à 'true'. L'attribut events est utilisé pour lister les événements que le dispositif de mise à jour de commandes surveille. Vous pouvez spécifier de multiples événements en les séparant par des virgules. Dans l'exemple ci-dessus, le dispositif de mise à jour de commandes surveille les événements de focus. Il a pour effet de mettre à jour les commandes lorsqu'un élément reçoit le focus.

+ +

Lorsqu'un événement de focus se produit, le code dans l'attribut oncommandupdate est appelé. Dans l'exemple, la méthode goUpdateCommand, qui est une fonction provenant du script globalOverlay.js décrit plus tôt, est appelée. Elle va mettre à jour la commande et activer ou désactiver les items de boutons et de menus nécessaires. Le code qui est derrière est assez simple. Il appelle seulement le contrôleur nécessaire, appelle sa méthode isCommandEnabled, et enfin active ou désactive la commande. Si vous avez plusieurs commandes à mettre à jour, appelez la méthode goUpdateCommand une fois pour chaque commande.

+ +
Notez que le dispositif de mise à jour de commandes recevra les notifications de tous les événements de focus sur tous les éléments, même si d'autres gestionnaires d'événements répondent à l'événement. Un dispositif de mise à jour de commandes est par essence un gestionnaire global d'événements.
+ +

Les dispositifs de mise à jour de commandes disposent de plusieurs événements pouvant répondre à ceux qui sont listés ci-dessous. Il est également possible de créer le votre.

+ + + +

L'exemple suivant montre le dispositif de mise à jour de commandes utilisé dans le navigateur Mozilla pour mettre à jour le menu d'édition de commandes. Les fonctions utilisées sont disponibles dans le script 'chrome://communicator/content/utilityOverlay.js'.

+ +
<commandset id="globalEditMenuItems"
+            commandupdater="true"
+            events="focus"
+            oncommandupdate="goUpdateGlobalEditMenuItems()"/>
+<commandset id="selectEditMenuItems"
+            commandupdater="true"
+            events="select"
+            oncommandupdate="goUpdateSelectEditMenuItems()"/>
+<commandset id="undoEditMenuItems"
+            commandupdater="true"
+            events="undo"
+            oncommandupdate="goUpdateUndoEditMenuItems()"/>
+<commandset id="clipboardEditMenuItems"
+            commandupdater="true"
+            events="clipboard"
+            oncommandupdate="goUpdatePasteMenuItems()"/>
+
+ +
+

Ensuite, nous vous montrerons comment utiliser les observateurs.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/modification_d'une_interface_xul/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/modification_d'une_interface_xul/index.html new file mode 100644 index 0000000000..249e58daa6 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/modification_d'une_interface_xul/index.html @@ -0,0 +1,167 @@ +--- +title: Modification d'une interface XUL +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Modification_d'une_interface_XUL +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Modifying_a_XUL_Interface +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Le DOM fournit de nombreuses fonctions pour modifier un document.

+ +

Création de nouveaux éléments

+ +

Vous pouvez créer de nouveaux éléments en utilisant la fonction createElement() du document. Elle ne prend qu'un argument, le nom de la balise de l'élément à créer. Vous pouvez ensuite lui affecter des attributs en utilisant la fonction setAttribute() et ajouter cet élément au document XUL grâce à la fonction appendChild(). L'exemple suivant ajoute un bouton à une fenêtre XUL :

+ +

Exemple 1: Source Voir

+ +
<script>
+function addButton(){
+  var aBox = document.getElementById("aBox");
+  var button = document.createElement("button");
+  button.setAttribute("label","Un bouton");
+  aBox.appendChild(button);
+}
+</script>
+
+<box id="aBox" width="200">
+  <button label="Ajouter" oncommand="addButton();"/>
+</box>
+
+ + + +

La fonction createElement() va créer l'élément type par défaut du document. Pour des documents XUL, il sera généralement question de création d'éléments XUL. Pour un document HTML, un élément HTML sera créé, et donc, il aura les fonctionnalités et les fonctions d'un élément HTML. La fonction createElementNS() peut être utilisée pour créer des éléments dans un espace de nommage différent.

+ +

La fonction appendChild() est utilisée pour ajouter un élément en tant qu'enfant d'un autre élément. Il existe trois fonctions associées qui sont les fonctions insertBefore(), replaceChild() et removeChild. Leur syntaxe est la suivante :

+ +
parent.appendChild(child);
+parent.insertBefore(child, referenceChild);
+parent.replaceChild(newChild, oldChild);
+parent.removeChild(child);
+
+ +

Le nom de ces fonctions suffit à comprendre ce qu'elles font.

+ + + +
Notez que pour toutes ces fonctions, l'enfant de référence ou l'enfant à supprimer doit exister sinon une erreur sera générée.
+ +

Il est fréquent que vous vouliez effacer un élément existant et l'ajouter autre part. Dans ce cas, vous pouvez simplement ajouter l'élément sans l'effacer préalablement. Puisqu'un nœud ne peut exister qu'à un seul emplacement à la fois, le mécanisme d'insertion se chargera toujours d'effacer d'abord le nœud de son emplacement initial. C'est une méthode pratique pour déplacer un nœud dans un document.

+ +

Copie de nœuds

+ +

Toutefois, pour copier un nœud, vous devrez appeler la fonction cloneNode(). Cette fonction réalise une copie d'un nœud existant, ce qui vous permet ensuite de l'ajouter autre part. Le nœud original restera à sa place. Elle prend un argument booléen indiquant si elle doit copier tous les nœuds enfants ou non. Si la valeur est 'false', seul le n½ud est copié, comme s'il n'avait jamais eu aucun enfant. Si la valeur est 'true', tous les enfants sont également copiés. La copie est faite récursivement, donc pour de larges structures d'arbres, assurez-vous de vouloir réellement passer cette valeur 'true' à la fonction cloneNode(). Voici un exemple :

+ +

Exemple 2: Source Voir

+ +
<hbox height="400">
+  <button label="Copier"
+          oncommand="this.parentNode.appendChild(this.nextSibling.cloneNode(true));"/>
+
+  <vbox>
+    <button label="Premier"/>
+    <button label="Deuxième"/>
+  </vbox>
+</hbox>
+
+ +

Lorsque le bouton 'Copier' est appuyé :

+ + + +
Vous noterez que certains éléments, tels que listbox et menulist disposent de fonctions de modification spécialisées supplémentaires que vous devriez utiliser dès que vous le pouvez. Elles seront décrites dans une prochaine section.
+ +

Manipulation d'éléments basiques

+ +

Les éléments principaux de XUL, tels que les boutons, les cases à cocher et les boutons radios, peuvent être manipulés grâce à de nombreuses propriétés de script. Les propriétés disponibles sont listées sur la page référence des éléments car celles disponibles varient selon les éléments. Les propriétés communes que vous pouvez manipuler sont label, value, checked et disabled. Elles affectent ou effacent les attributs correspondants si nécessaire.

+ +

Exemples de propriétés label et value

+ +

Voici un exemple simple de changement d'un libellé de bouton :

+ +

Exemple 3: Source Voir

+ +
<button label="Bonjour" oncommand="this.label = 'Aurevoir';"/>
+ +

Lorsque le bouton est pressé, son libellé est modifié. Cette technique fonctionne pour une large majorité d'éléments ayant des libellés (label). Pour les champs de saisie, vous pouvez faire quelque chose de similaire pour sa propriété value.

+ +

Exemple 4: Source Voir

+ +
<button label="Ajouter" oncommand="this.nextSibling.value += '1';"/>
+<textbox/>
+
+ +

Cet exemple ajoute un '1' dans le champ de saisie chaque fois que le bouton est pressé. La propriété nextSibling permet d'atteindre l'élément suivant le bouton (this), le champ de saisie textbox. L'opérateur += sert à ajouter un '1' à la fin du texte de la valeur courante. Notez que vous pouvez encore ajouter du texte dans ce champ de saisie. Vous pouvez récupérer le libellé courant ou la valeur en utilisant ses propriétés, comme dans l'exemple suivant :

+ +

Exemple 5: Source Voir

+ +
<button label="Bonjour" oncommand="alert(this.label);"/>
+ +

Changement d'état d'une case à cocher

+ +

Les cases à cocher disposent d'une propriété checked qui sert à les cocher ou à les décocher. Il est facile de comprendre son usage. Dans l'exemple à suivre, nous inversons l'état de la propriété checked chaque fois que le bouton est pressé. Tandis que les libellés et les valeurs sont des chaînes de caractères, vous noterez que la propriété checked est un booléen qui prend une valeur 'true' ou 'false'.

+ +

Exemple 6: Source Voir

+ +
<button label="Changer" oncommand="this.nextSibling.checked =
+  !this.nextSibling.checked;"/>
+<checkbox label="Cochez pour les messages"/>
+
+ +

Les boutons radios peuvent également être sélectionnés en utilisant des propriétés, toutefois, un seul est sélectionné à la fois dans un groupe, tous les autres étant décochés. Vous n'avez pas à réaliser cette gestion manuellement. La propriété selectedIndex du radiogroup peut être utilisée pour cela. La propriété selectedIndex sert à récupérer l'index du bouton radio sélectionné dans le groupe. Il sert également à le modifier.

+ +

Modification de l'état activé ou désactivé d'un élément

+ +

Il est habituel de désactiver des champs particuliers qui ne servent pas dans une situation donnée. Par exemple, dans la boîte de dialogue des préférences, vous avez le choix entre plusieurs possibilités, mais seul un choix permet un paramétrage supplémentaire. Voici un exemple de création de ce type d'interface :

+ +

Exemple 7: Source Voir

+ +
<script>
+function updateState(){
+  var name = document.getElementById("name");
+  var sindex = document.getElementById("group").selectedIndex;
+  name.disabled = sindex == 0;
+}
+</script>
+
+<radiogroup id="group" onselect="updateState();">
+  <radio label="Nom aléatoire" selected="true"/>
+  <hbox>
+    <radio label="Spécifiez un nom :"/>
+    <textbox id="name" value="Alain" disabled="true"/>
+  </hbox>
+</radiogroup>
+
+ +

Dans cet exemple, une fonction updateState() est appelée chaque fois qu'un événement de sélection est déclenché depuis le groupe de boutons radios. Elle est exécutée lorsque qu'un bouton radio est sélectionné. La fonction retournera l'indice de l'élément radio actuellement sélectionné en utilisant la propriété selectedIndex. Vous noterez que bien qu'un bouton radio se trouve à l'intérieur d'une boîte hbox, il reste attaché au groupe radio. Si le premier bouton radio est sélectionné (index de '0'), le champ de saisie est désactivé en définissant sa propriété disabled à 'true'. Si le second bouton radio est sélectionné, le champ de saisie est activé.

+ +
+

La section suivante fournira plus de détails sur la manipulation des groupes de boutons radios et la manipulation des listes.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

+ +

 

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/modification_du_th\303\250me_par_d\303\251faut/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/modification_du_th\303\250me_par_d\303\251faut/index.html" new file mode 100644 index 0000000000..6e0899b330 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/modification_du_th\303\250me_par_d\303\251faut/index.html" @@ -0,0 +1,50 @@ +--- +title: Modification du thème par défaut +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Modification_du_thème_par_défaut +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Modifying_the_Default_Skin +--- +

 

+
+

« PrécédentSuivant »

+
+

Cette section décrit comment modifier le thème graphique d'une fenêtre.

+

Les bases d'un thème

+

Un thème est un ensemble de feuilles de styles, d'images et de comportements qui est appliqué à un fichier XUL. En appliquant un thème différent, vous pouvez changer l'apparence d'une fenêtre sans changer ses fonctionnalités. Firefox fournit un thème par défaut, et vous pouvez en télécharger d'autres. Le XUL pour les deux est le même. En revanche, les feuilles de styles et les images utilisées sont différentes.

+

Pour une simple personnalisation de l'apparence d'une fenêtre Mozilla, vous pouvez facilement changer les feuilles de styles qui lui sont associées. Des modifications plus importants peuvent être faits en créant un thème complètement nouveau. La fenêtre des préférences de Mozilla comporte un panneau pour changer le thème par défaut. (Bien que Mozilla appelle le code sous jacent les appelle 'skins' et que l'inteface utilisateur les appelle des thèmes, il s'agit de la même chose).

+

Un thème est décrit en utilisant des CSS, ce qui vous permet de définir les couleurs, les bordures et les images utilisées pour dessiner des éléments. Le fichier 'classic.jar' contient les définitions des thèmes. Le répertoire "global" inclus dans ces archives contient les définitions principales des styles concernant la manière d'afficher les différents éléments XUL. En modifiant ces fichiers, vous pouvez modifier l'apparence des applications XUL.

+

Personnalisation avec userChrome.css

+

Si vous placez un fichier appelé 'userChrome.css' dans le répertoire "chrome" dans le répertoire de votre profil utilisateur, vous pouvez remplacer des paramètres sans changer les archives elles-mêmes. Ce répertoire devrait être créé quand vous créez un profil et quelques exemples y figurer. Le fichier 'userContent.css' permet de personnaliser les pages Web, tandis que 'userChrome.css' permet de personnaliser les fichiers chrome.

+

Par exemple, en ajoutant ce qui suit à la fin de ce fichier, vous pouvez changer tous les éléments menubar pour leur appliquer un fond rouge.

+
menubar {
+  background-color: red;
+}
+
+

Si vous ouvrez une fenêtre Mozilla après avoir effectué ce changement, les barres de menu seront rouges. Comme ce changement a été appliqué à la feuille de styles utilisateur, il affecte toutes les fenêtres. Cela signifie que la barre de menus du navigateur, la barre de menus des marque-pages et même la barre de menus du dialogue de recherche de fichiers seront rouges.

+

Paquetages de thèmes

+

Pour que le changement n'affecte qu'une fenêtre, modifiez la feuille de styles associée à ce fichier XUL. Par exemple, pour ajouter une bordure rouge autour des commandes de menu dans la fenêtre du carnet d'adresses, ajoutez ce qui suit au fichier 'bookmarksManager.css' dans l'archive 'classic.jar' ou de votre thème préféré.

+
menuitem {
+  border: 1px solid red;
+}
+
+

Si vous regardez dans les archives des thèmes, vous remarquerez que chacune contient un certain nombre de feuilles de styles et d'images. Les feuilles de styles font référence aux images. Vous devriez éviter de faire directement référence aux images dans les fichiers XUL si vous voulez que votre contenu puisse être modifié par un thème, parce qu'un certain thème peut ne pas utiliser d'images et avoir besoin d'un design plus complexe. En faisant référence aux images seulement dans les fichiers CSS, on peut facilement les enlever. Cela évite aussi la dépendance avec les noms de fichier spécifiques des images.

+

Vous pouvez attribuer des images à un bouton, à une case à cocher et à d'autres éléments en utilisant la propriété list-style-image comme suit :

+
checkbox {
+  list-style-image: url("chrome://findfile/skin/images/check-off.jpg");
+}
+
+checkbox[checked="true"] {
+  list-style-image: url("chrome://findfile/skin/images/check-on.jpg");
+}
+
+

Ce code modifie l'image associée à une case à cocher. Le premier style applique une certaine image pour une case à cocher décochée et le second style pour une case à cocher cochée. Le modificateur 'checked=true' n'applique le style qu'aux éléments qui ont leur attribut checked à 'true'.

+

Consultez Créer un thème pour Firefox et CSS:Premiers pas pour plus de détails.

+
+

Dans la prochaine section, nous allons voir comment créer un nouveau thème.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/onglets/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/onglets/index.html new file mode 100644 index 0000000000..e2d94235ea --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/onglets/index.html @@ -0,0 +1,107 @@ +--- +title: Onglets +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Onglets +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Tabboxes +--- +

 

+
+

« PrécédentSuivant »

+
+

Il est courant de voir des pages à onglets dans les boîtes de dialogues de préférences. Nous allons voir ici comment les créer.

+

Boîtes d'onglets

+

Les boîtes d'onglets sont typiquement utilisées dans une application de fenêtre de préférences. Une série d'onglets apparaît en travers du bord supérieur de la fenêtre. L'utilisateur peut cliquer sur chaque onglet pour voir la sélection des options. L'emploi d'onglets est très utile lorsque vous avez plus d'options qu'il ne peut en tenir sur l'écran.

+

XUL offre une méthode pour créer de telles boîtes de dialogues. Elles nécessitent cinq nouveaux éléments qui sont décrits brièvement ici et plus en détail par la suite.

+
tabbox 
La boîte externe qui contient les onglets sur le haut et les pages correspondantes elles mêmes.
tabs 
La boîte interne qui contient les onglets individuellement. En d'autres termes, il s'agit d'un groupement d'onglets.
tab 
Un onglet spécifique. Cliquer sur un onglet remonte la page de l'onglet au premier plan.
tabpanels 
Le container des pages.
tabpanel 
Le corps d'une page seule. Vous allez placer le contenu d'une page dans cette élément. Le premier tabpanel correspond au premier onglet, le second tabpanel correspond au second onglet, et ainsi de suite.
+
+

L'élément tabbox est l'élément externe. Il est constitué de deux enfants, l'élément tabs qui contient les en-têtes des onglets, et l'élément tabpanels qui contient les pages d'onglets.

+

La syntaxe typique d'une boîte d'onglets est décrite ci dessous :

+
<tabbox id="tablist">
+   <tabs>
+     <!-- les éléments tab viennent ici -->
+   </tabs>
+   <tabpanels>
+     <!-- les éléments tabpanel viennent ici -->
+   </tabpanels>
+</tabbox>
+
+

Les éléments tab sont placés à l'intérieur d'un élément tabs qui se comporte comme une boîte normale. L'élément tabs lui même a été placé à l'intérieur d'un élément tabbox. Cet élément tabbox contient aussi l'élément tabpanels qui apparaît en dessous de l'élément tabs à cause de la disposition verticale de la boîte d'onglets.

+

Il n'y a réellement rien de spécial au sujet des éléments tab qui les rendent différents des boîtes. Comme pour les boîtes, les onglets peuvent contenir n'importe quels éléments. La différence est que les onglets ont un rendu sensiblement différent et seulement le contenu de la page d'un seul onglet sera visible à la fois, comme peut le faire l'élément deck.

+

Le contenu des pages correspondant à chaque onglet doit être placé dans chaque élément tabpanel correspondant. Il ne doit pas être mis dans un élément tab qui contient, lui, le contenu descriptif de l'onglet sur le bord supérieur.

+

Chaque élément tabpanel devient une page de l'onglet affiché. La première page correspond au premier onglet, la seconde page correspond au second onglet, et ainsi de suite. Il y a une relation de un-à-un entre chaque élément tab et chaque élément tabpanel.

+

Pour déterminer la dimension d'une boîte d'onglets, la taille de la plus grande page est utilisée. Ainsi, si vous avez dix champs de saisie sur une page et seulement un sur une autre page, cette autre page sera dimensionnée pour s'ajuster à celle qui contient les dix champs de saisie en occupant plus d'espace. La surface occupée par la page d'un onglet ne change pas lorsque l'utilisateur bascule vers une page d'un autre onglet.

+

Exemple de boîte d'onglets

+

Exemple 1: Source Voir

+
Image:xultu_tabpanel1.png
+
<tabbox>
+   <tabs>
+     <tab label="Courrier"/>
+     <tab label="Forum"/>
+   </tabs>
+   <tabpanels>
+     <tabpanel id="mailtab">
+       <checkbox label="Vérifier automatiquement le courrier"/>
+     </tabpanel>
+     <tabpanel id="newstab">
+       <button label="Effacer le cache des forums"/>
+     </tabpanel>
+   </tabpanels>
+</tabbox>
+
+

Ici, deux onglets ont été ajoutés. Le premier est intitulé 'Courrier' et l'autre est intitulé 'Forum'. Lorsque l'utilisateur clique sur l'onglet 'Courrier', le contenu de la première page est affiché. Dans ce cas, la boîte avec la case à cocher intitulé 'Vérifier automatiquement le courrier' apparaîtra sous cet onglet. Le second onglet, lorsqu'il est cliqué, affichera la boîte contenant le bouton intitulé 'Effacer le cache des forums'.

+

L'onglet courant sélectionné est donné par un attribut supplémentaire selected initialisé à 'true' sur un élément tab. Il sert à donner à l'onglet par défaut un aspect différent de telle façon qu'il apparaisse sélectionné. Un seul onglet peut avoir cet attribut avec une valeur 'true'.

+

Positionnement des onglets

+

Finalement, vous pouvez changer la position des onglets pour qu'ils apparaissent sur n'importe quel côté des pages d'onglets. Il suffit de définir les attributs orient et dir comme nécessaire. Souvenez vous que les éléments tab sont des boîtes normales en terme de mise en page. D'ailleurs, l'élément tabbox se comporte comme une boîte normale ayant une orientation verticale par défaut, dans laquelle l'élément tabs est une boîte ayant une orientation horizontale.

+
Image:xultu_tabpanel_extra.png
+

Par exemple, pour mettre les onglets le long du bord gauche, changez l'orientation de l'élément tabs pour qu'elle soit verticale. Ils seront empilés les uns sur les autres. Ensuite, mettez une orientation horizontale sur le tabbox. Les onglets appaîtront à gauche, et pas au dessus des pages d'onglets. Notez que la modification de l'orientation de l'élément tabpanels n'aura aucun effet puisque les pages d'onglets sont empilées les unes sur les autres. (NdT : Source Voir)

+

Vous pouvez placer les onglets le long du bord droit ou en bas en déplaçant l'élément tabs après l'élément tabpanels. De plus, vous devrez définir l'attribut dir à 'reverse' sur tabbox. Cependant, vous devriez laisser les onglets en haut car leur rendu graphique risque d'être mauvais avec certains thèmes graphiques particuliers.

+
+

Ajout d'onglets à la boîte de dialogue de recherche de fichiers

+

Ajoutons une seconde page à notre boîte de dialogue de recherche de fichiers. Nous allons créer un onglet 'Options' (en le sélectionnant par défaut) qui contiendra quelques options de recherche. Ce n'est peut être pas la meilleure interface pour faire cela, mais nous l'utiliserons pour la démonstration des onglets. Le libellé d'en-tête et la boîte de critères de recherche iront dans la première page d'onglet. Nous allons ajouter quelques options dans la seconde page d'onglet. La barre de progression et les boutons restent sur la boîte de dialogue principale, en dehors des onglets.

+
<vbox flex="1">
+
+<tabbox selectedIndex="1">   <tabs>     <tab label="Recherche"/>     <tab label="Options"/>   </tabs>    <tabpanels>    <tabpanel id="searchpanel" orient="vertical">
+
+    <description>
+     Entrez votre critère de recherche ci dessous et appuyer sur le
+     bouton Rechercher.
+    </description>
+
+    <spacer style="height: 10px"/>
+
+    <groupbox orient="horizontal">
+      <caption label="Critère de recherche"/>
+
+      <menulist id="searchtype">
+        <menupopup>
+          <menuitem label="Nom"/>
+          <menuitem label="Taille"/>
+          <menuitem label="Date de modification"/>
+        </menupopup>
+      </menulist>
+      <spacer style="width: 10px;"/>
+      <menulist id="searchmode">
+        <menupopup>
+          <menuitem label="Est"/>
+          <menuitem label="N'est pas"/>
+        </menupopup>
+      </menulist>
+
+      <spacer style="height: 10px"/>
+      <textbox id="find-text" flex="1" style="min-width: 15em;"/>
+
+    </groupbox>
+   </tabpanel>     <tabpanel id="optionspanel" orient="vertical">     <checkbox id="casecheck" label="Recherche sensible à la casse"/>     <checkbox id="wordscheck" label="Nom de fichier entier"/>    </tabpanel>   </tabpanels> </tabbox>
+
+
Image:xultu_tabpanel2.png
+

Les éléments tab ont été placés autour du contenu principal de la fenêtre. Vous pouvez voir les deux onglets, 'Recherche' et 'Options'. En cliquant sur chacun d'eux, vous faites apparaître les pages correspondantes. Comme montré sur l'image ci-dessus, les deux options de recherche apparaissent sur le deuxième onglet. La première page ressemble beaucoup à ce qu'elle était avant, exceptée la présence des onglets sur le bord supérieur.

+Exemple de recherche de fichiers : Source Voir
+
+

Dans la section suivante, nous allons voir comment créer des grilles pour le placement de contenus.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/overlays_inter-paquetage/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/overlays_inter-paquetage/index.html new file mode 100644 index 0000000000..fa037a0316 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/overlays_inter-paquetage/index.html @@ -0,0 +1,96 @@ +--- +title: Overlays inter-paquetage +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Overlays_inter-paquetage +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Cross_Package_Overlays +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Cette section décrit comment appliquer des overlays à des fichiers qui ne les importent pas.

+ +

Application d'overlays à d'autres paquetages

+ +
Note : Cette section traite de contents.rdf qui a été remplacé par des fichiers manifest depuis Gecko 1.8.
+ +

Les overlays ont d'autres fonctionnalités très utiles. Dans les exemples de la section précédente, les overlays étaient importés par la fenêtre. Vous pouvez aussi utiliser une autre méthode en indiquant aux overlays pour quelles fenêtres ils seront appliqués. Il vous suffit de modifier le fichier 'contents.rdf' de votre paquetage. Cette méthode est très utile car elle permet à un overlay de modifier l'interface utilisateur d'un autre paquetage sans pour cela modifier celui-ci. Par exemple, vous pouvez ajouter des items de menu ou des barres d'outils à la fenêtre du navigateur Mozilla.

+ +

Nous utiliserons cette fonctionnalité pour ajouter une barre d'outils dans le fenêtre du navigateur Mozilla. Le client courrier de Mozilla utilise les overlays pour ajouter du contenu à la fenêtre du navigateur. Par exemple, si le client n'est pas installé, il n'y a pas de commande pour de nouveaux messages. Toutefois, si le client est installé, un overlay sera appliqué au menu pour ajouter une commande de nouveaux messages. Ci-dessous, nous ajouterons une barre d'outils de recherche de fichiers au navigateur. Cette fonctionnalité n'a aucune utilité, mais nous l'intégreront quand même.

+ +

Mozilla vous permet d'ajouter une liste d'overlays dans le fichier 'contents.rdf' utilisé pour spécifier les paquetages chrome, les thèmes graphiques et les localisations. Dès que vous avez créé un overlay, vous pouvez l'ajouter au fichier 'contents.rdf'. Il vous suffit d'ajouter les informations pour chacune des fenêtres où vous voulez appliquer l'overlay.

+ +
+

Notre exemple de recherche de fichiers

+ +

Tout d'abord, créons un simple overlay. Il contiendra quelques champs de saisie pour la recherche d'un nom de fichier et d'un répertoire. Chargez le fichier 'foverlay.xul' et ajoutez-le au répertoire de notre exemple de recherche de fichiers à côté de 'findfile.xul'.

+ +

Notre exemple foverlay.xul

+ +

Exemple 1 : Source

+ +
<?xml version="1.0" encoding="ISO-8859-1"?>
+
+<overlay
+    xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+<toolbox id="navigator-toolbox">
+  <toolbar id="findfile_toolbar">
+    <label control="findfile_filename" value="Recherche des fichiers nommés :"/>
+    <textbox id="findfile_filename"/>
+    <label control="findfile_dir" value="Répertoire :"/>
+    <textbox id="findfile_dir"/>
+    <button label="Parcourir..."/>
+  </toolbar>
+</toolbox>
+
+</overlay>
+
+ +

Vous pouvez visualiser cet exemple en changeant l'élément overlay par window. La seule chose un peu spécifique est l'attribut id utilisé sur l'élément toolbox. Cette valeur ('navigator-toolbox') est la même que l'identifiant de la boîte d'outils de la fenêtre du navigateur ('navigator.xul'). Elle signifie que cet overlay sera appliqué à la boîte d'outils du navigateur et que son contenu sera ajouté comme une barre d'outils supplémentaire.

+ +

Pour ajouter cet overlay au fichier manifest, vous devons ajouter deux ressources. Premièrement, nous en ajoutons une pour chaque fenêtre où l'overlay sera appliqué. Le code suivant doit être placé dans le fichier 'contents.rdf' juste avant la balise fermante de RDF.

+ +
<RDF:Seq about="urn:mozilla:overlays">
+  <RDF:li resource="chrome://navigator/content/navigator.xul"/>
+</RDF:Seq>
+
+ +

Cette déclaration précise l'ajout d'une fenêtre overlay au système de gestion des overlays (urn:mozilla:overlays). Vous pouvez ajouter des nœuds supplémentaires pour chaque fenêtre à modifier en ajoutant des balises li supplémentaires.

+ +

Ensuite, nous ajoutons un nœud pour chaque overlay s'appliquant à la fenêtre. Dans ce cas, vous n'en avez qu'un, mais d'autres peuvent être appliqués. Ajoutez ces lignes à la suite des précédentes :

+ +
<RDF:Seq about="chrome://navigator/content/navigator.xul">
+  <RDF:li>chrome://findfile/content/foverlay.xul</RDF:li>
+</RDF:Seq>
+
+
+ +
Image:xultu_crosspov.png
+ +

Mozilla lit cette information et construit une liste d'overlays appliqués à d'autres fenêtres. Il enregistre cette information dans un répertoire chrome/overlayinfo. Il n'est pas nécessaire que vous modifiez manuellement les fichiers de ce répertoire. Ils sont générés automatiquement et modifiés au premier lancement de Mozilla ou lorque de nouveaux paquetages sont installés. Toutefois, vous pouvez forcer la reconstruction de leurs données en effaçant ce répertoire et le fichier 'chrome.rdf.'

+ +

Note complémentaire : vous pouvez utiliser cette même technique pour appliquer des feuilles de styles supplémentaires. L'exemple suivant vous montre comment :

+ +
<RDF:Seq about="urn:mozilla:stylesheets">
+  <RDF:li resource="chrome://messenger/content/messenger.xul"/>
+</RDF:Seq>
+
+<RDF:Seq about="chrome://messenger/content/messenger.xul">
+  <RDF:li>chrome://blueswayedshoes/skin/myskinfile.css</RDF:li>
+</RDF:Seq>
+
+ +
+

Nous verrons ensuite comment créer un installeur pour une application XUL.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/piles_et_paquets/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/piles_et_paquets/index.html new file mode 100644 index 0000000000..2913d20ebb --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/piles_et_paquets/index.html @@ -0,0 +1,97 @@ +--- +title: Piles et Paquets +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Piles_et_Paquets +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Stacks_and_Decks +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Il se peut qu'il soit nécessaire d'afficher des éléments comme un empilement superposé de cartes. Les éléments stack et deck peuvent être utilisés à cet effet.

+ +

Containers

+ +

Chaque boîte XUL est un container qui peut contenir n'importe quel autre élément. Il y a un certain nombre d'éléments qui sont des types spécialisés de boîtes, tels que les barres d'outils et les onglets. La balise box crée la plus simple des boîtes sans propriétés spéciales. Toutefois, les types spécialisés de boîtes fonctionnent comme des boîtes normales dans le sens où elles orientent les éléments qu'elles contiennent, mais elles ont des fonctionnalités supplémentaires.

+ +

En fait, beaucoup de composants peuvent contenir d'autres éléments. Nous avons déjà vu que les boutons peuvent contenir d'autres choses que leurs contenus par défaut. Une barre de défilement est juste un type spécial de boîte qui crée ses propres éléments si vous ne les fournissez pas. Ceux-ci contrôlent également le déplacement de l'ascenseur de la barre de défilement.

+ +

Dans les prochaines sections, nous allons introduire quelques éléments qui sont prévus pour le contrôle d'autres éléments. Ce sont tous des types spéciaux de boîtes et permettent d'inclure tous les attributs des boîtes.

+ +

Piles

+ +

L'élément stack est une simple boîte. Il fonctionne comme toute autre boîte mais a la propriété spéciale que ces enfants sont tous disposés les uns au dessus des autres. Le premier enfant de la pile est dessiné sur le dessous, le second enfant est dessiné ensuite, suivi du troisième et ainsi de suite. De nombreux éléments peuvent être empilés sur une pile.

+ +

La propriété orient n'a aucune signification particulière sur un élément stack, car les enfants sont empilés les uns sur les autres au lieu d'être côte à côte. Les dimensions d'une pile sont déterminées par celle de son plus grand enfant, mais vous pouvez utilisez les propriétés CSS width, height, min-width ou d'autres propriétés similaires à la fois sur la pile et ses enfants.

+ +

L'élément stack pourrait être utilisé quand un indicateur d'état doit d'être ajouté au dessus d'un élément existant. Par exemple, un indicateur de progression pourrait être créé avec une barre et un libellé en surimpression.

+ +

Image:xultu_stacks_progress.png

+ +

Effet d'ombre avec des piles

+ +

Une utilisation pratique de l'élément stack est de pouvoir simuler un certain nombre de propriétés CSS avec. Par exemple, vous pouvez créer un effet similaire à la propriété text-shadow comme ceci :

+ +

Exemple 1: Source Voir

+ +
<stack>
+   <description value="Ombré" style="padding-left: 1px; padding-top: 1px; font-size: 15pt"/>
+   <description value="Ombré" style="color: red; font-size: 15pt;"/>
+</stack>
+
+ +

Image:xultu_stacks1.png

+ +

Les deux éléments description créent chacun un texte avec une taille de 15 points. Le premier est toutefois décalé d'un pixel vers la droite et vers le bas grâce à l'ajout d'une marge de texte sur la gauche et sur le haut. Le résultat est le dessin répété du même texte 'Ombré' mais en léger décalage. Le second élément description est dessiné en rouge pour que l'effet soit encore plus visible.

+ +

Cette méthode a des avantages sur l'emploi de text-shadow car vous pouvez complètement personnaliser les effets d'ombres de votre texte principal. Il peut avoir sa propre police de caractères, un soulignement ou une taille propre (vous pouvez même créer un texte ombré clignotant). C'est aussi utile car Mozilla ne supporte pas pour l'instant les textes ombrés en CSS. Un désavantage est que l'espace occupé par le texte ombré fait une pile plus grande. L'effet d'ombrage est très utile pour créer des boutons d'apparence désactivée :

+ +

Exemple 2: Source Voir

+ +
<stack style="background-color: #C0C0C0">
+   <description value="Désactivé" style="color: white; padding-left: 1px; padding-top: 1px;"/>
+   <description value="Désactivé" style="color: grey;"/>
+</stack>
+
+ +

Cet arrangement de couleurs de texte et d'ombrage créent cet aspect désactivé que l'on retrouve sur certaines plates-formes.

+ +
Notez que les évènements tels que les clics de la souris et les touches du clavier sont transmis à l'élément sur le haut de la pile qui est le dernier élément de la pile. Cela signifie qu'un bouton ne fonctionnera correctement que s'il est le dernier élément de la pile.
+ +

Paquets

+ +

Un élément deck place également ses enfants les uns au dessus des autres comme l'élément stack, toutefois les paquets n'affichent qu'un seul de leurs enfants à la fois. Ce comportement s'avère utile pour une interface d'assistant dans laquelle une série de panneaux similaires sont affichés en série. Au lieu de créer des fenêtres séparées et d'ajouter des boutons de navigation à chacune d'elles, vous n'avez qu'à créer une seule fenêtre et utiliser un paquet dans lequel le contenu changera.

+ +

Comme pour les piles, les enfants directs d'un élément deck forment les pages du paquet. S'il y a trois enfants dans l'élément deck, le paquet aura trois enfants. La page affichée du paquet peut être changée en définissant un attribut selectdIndex sur l'élément deck. L'index est un nombre qui identifie quelle page à afficher. Les pages sont numérotées à partir de zéro. Ainsi, le premier enfant du paquet est la page '0', le second est la page '1', etc.

+ +

Ce qui suit est un exemple de paquet :

+ +

Exemple 3: Source Voir

+ +
<deck selectedIndex="2">
+   <description value="Ceci est la première page "/>
+   <button label="Ceci est la seconde page "/>
+   <box>
+     <description value="Ceci est la troisième page "/>
+     <button label="Ceci est également la troisième page "/>
+   </box>
+</deck>
+
+ +

Ici, il y a trois pages, celle affichée par défaut est la troisième. La troisième page est une boîte avec deux éléments qui y sont inclus. L'ensemble de cette boîte et de ses éléments forme une page. Le paquet sera aussi grand que le plus grand de ses enfants, qui dans le cas présent sera la troisième page.

+ +

Vous pouvez changer de page en utilisant un script pour modifier l'attribut selectedIndex. Pour plus de renseignements là dessus, reportez vous aux sections sur les évènements et le DOM.

+ +
+

La prochaine section décrit comment les piles peuvent être utilisées pour positionner les éléments.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/plus_de_caract\303\251ristiques_sur_les_boutons/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/plus_de_caract\303\251ristiques_sur_les_boutons/index.html" new file mode 100644 index 0000000000..b6b5318c43 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/plus_de_caract\303\251ristiques_sur_les_boutons/index.html" @@ -0,0 +1,107 @@ +--- +title: Plus de caractéristiques sur les boutons +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Plus_de_caractéristiques_sur_les_boutons +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/More_Button_Features +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Dans ce chapitre, nous allons voir quelques fonctionnalités supplémentaires des boutons.

+ +

Ajouter une image

+ +

Vous pouvez ajouter une image dans un bouton en spécifiant une adresse URL dans l'attribut image. L'image chargée à partir de l'URL, qui peut être relative ou absolue, sera affichée sur le bouton.

+ +

Le bouton sur l'exemple ci-dessous aura en même temps un libellé et une image 'happy.png'. L'image apparaîtra à gauche du libellé. Vous pouvez changer cette position en utilisant deux autres attributs. Ils seront expliqués dans un moment.

+ +

Exemple 1: Source Voir

+ +
<button label="Aide" image="happy.png"/>
+ +

Bouton avec une image CSS

+ +

Une autre façon de procéder consiste à spécifier une image en utilisant la propriété de style CSS list-style-image appliquée au bouton. Cette méthode permet de changer l'apparence (dans ce cas, l'apparence de l'image) sans modifier le fichier XUL. Un exemple vous est montré ci-dessous.

+ +

Exemple 2: Source Voir

+ +
<button id="find-button"
+   label="Chercher" style="list-style-image: url('happy.png')"/>
+
+ +

Dans ce cas, l'image 'happy.png' est affichée sur le bouton. L'attribut style fonctionne de façon similaire à son homologue HTML. En général, il peut être utilisé sur tous les éléments XUL. Notez qu'il serait plus judicieux de placer toutes les déclarations de styles dans une feuille de style séparée.

+ +

Le positionnement des images

+ +

Par défaut, l'image sur le bouton apparaît à gauche du libellé. Il y a deux attributs permettant de contrôler sa position.

+ +

L'attribut dir contrôle la direction de l'image et du texte. En définissant cet attribut avec la valeur 'reverse', l'image sera placée à droite du texte. En utilisant la valeur 'normal', ou en omettant cet attribut, l'image sera placée à gauche du texte.

+ +
NdT : Sur de vieilles versions de Mozilla, les valeurs à utiliser sont respectivement 'rtl' (right-to-left) et 'ltr' (left-to-right).
+ +

L'attribut orient peut être utilisé pour placer l'image au-dessus ou en dessous du texte. Sa valeur par défaut est 'horizontal' et sert à placer l'image à gauche ou à droite. Vous pouvez aussi utiliser la valeur 'vertical' pour placer l'image au-dessus ou en dessous. Dans ce cas, l'attribut dir contrôle le placement vertical. Les mêmes valeurs sont utilisées, où 'normal' provoque le placement de l'image au-dessus du texte, et 'reverse' provoque le placement de l'image en dessous du texte.

+ +

Exemple 3: Source Voir

+ +
Image:xultu_advbtns1.png
+ +
<button label="Gauche" image="happy.png"/>
+<button label="Droite" image="happy.png" dir="reverse"/>
+<button label="Dessus" image="happy.png" orient="vertical"/>
+<button label="Dessous" image="happy.png" orient="vertical" dir="reverse"/>
+
+ +

Cet exemple vous montre les quatre types d'alignement des boutons. Notez que les deux attributs ne sont pas spécifiés lorsque leur valeur par défaut est utilisée.

+ +

Des boutons avec des contenus spéciaux

+ +

Les boutons peuvent contenir un balisage arbitraire, qui sera représenté dans le bouton. Vous ne l'utiliserez probablement pas très souvent, mais vous pourrez l'utiliser pour créer des éléments personnalisés.

+ +

Cet exemple va créer un bouton dans lequel deux mots seront en magenta :

+ +

Exemple 4: Source Voir

+ +
<button>
+   <description value="Ceci est"/>
+   <description value="un étrange" style="color: purple;"/>
+   <description value="bouton"/>
+</button>
+
+ +

N'importe quel élément XUL peut être placé à l'intérieur d'un bouton. Les éléments HTML seront ignorés, donc vous devez les intégrer à l'intérieur d'un élément description. Si vous spécifiez un attribut label sur un bouton, il supplantera n'importe quel autre contenu placé dans la définition du bouton.

+ +

Bouton avec un menu surgissant

+ +

Vous pouvez mettre un menupopup dans un bouton pour générer une liste déroulante lorsque le bouton est enfoncé, à l'instar de l'élément menulist. Toutefois, dans ce cas, vous devez indiquer l'attribut type avec la valeur 'menu'.

+ +

Exemple 5: Source Voir

+ +
Image:xultu_advbtns2.png
+ +
<button type="menu" label="Périphérique">
+   <menupopup>
+     <menuitem label="Imprimante"/>
+     <menuitem label="Souris"/>
+     <menuitem label="Clavier"/>
+   </menupopup>
+</button>
+
+ +

Dans cet exemple, l'utilisateur doit cliquer sur le bouton pour faire apparaître un menu contenant trois items de menu. Notez que la sélection d'un des items ne change pas le libellé du bouton, contrairement à l'élément menulist. Ce type de bouton est destiné à être utilisé comme un menu, avec des scripts associés à chaque item, exécutant une tâche précise. Nous en verrons plus sur les menus plus tard.

+ +

Vous pouvez également affecter la valeur 'menu-button' à l'attribut type (NdT : Source Voir). Cette valeur crée aussi un bouton avec un menu, mais son apparence est différente. L'image ci-contre montre cette différence. Le bouton de gauche est un 'menu' et celui de droite est un 'menu-button'. Ils ont chacun une flèche pour indiquer la présence d'un menu déroulant. Pour le 'menu', l'utilisateur doit cliquer n'importe où sur le bouton pour ouvrir le menu. Pour le 'menu-button', l'utilisateur doit cliquer sur la flèche pour faire apparaître le menu.

+ +
+

Dans la prochaine section, nous en apprendrons plus sur le positionnement des éléments XUL dans une fenêtre.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/plus_de_fonctionnalit\303\251s_de_menu/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/plus_de_fonctionnalit\303\251s_de_menu/index.html" new file mode 100644 index 0000000000..908aab0ed9 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/plus_de_fonctionnalit\303\251s_de_menu/index.html" @@ -0,0 +1,93 @@ +--- +title: Plus de fonctionnalités de menu +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Plus_de_fonctionnalités_de_menu +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/More_Menu_Features +--- +

 

+
+

« PrécédentSuivant »

+
+

Dans cette section, nous allons voir comment créer des sous-menus et des coches de menus.

+

Créer des sous-menus

+

Vous pouvez créer des sous-menus à l'intérieur d'autres menus (menus imbriqués) en utilisant les éléments existants. Souvenez-vous que vous pouvez mettre n'importe quel élément dans un menupopup. Nous avons vu comment placer des menuitem et des menuseparator dans des menupopup. Toutefois, vous pouvez créer des sous-menus en plaçant simplement l'élément menu à l'intérieur de l'élément menupopup. Ce fonctionnement est possible du fait que l'élément menu est valide même quand il n'est pas placé directement dans une barre de menu.

+

L'exemple ci-dessous crée un simple sous-menu dans le menu Fichier :

+

Exemple 1: Source Voir

+
Image:xultu_menubar_3.png
+
<toolbox flex="1">
+  <menubar id="sample-menubar">
+    <menu id="file-menu" label="Fichier">
+      <menupopup id="file-popup">
+        <menu id="new-menu" label="Nouveau">
+          <menupopup id="new-popup">
+            <menuitem label="Fenêtre"/>
+            <menuitem label="Message"/>
+          </menupopup>
+        </menu>
+        <menuitem label="Ouvrir"/>
+        <menuitem label="Sauver"/>
+        <menuseparator/>
+        <menuitem label="Quitter"/>
+      </menupopup>
+    </menu>
+  </menubar>
+</toolbox>
+
+
+

Ajout d'un menu à notre exemple de recherche de fichiers

+

Ajoutons un menu à la boîte de dialogue de recherche de fichiers. Nous allons juste ajouter quelques commandes simples à un menu 'Fichier' et à un menu 'Édition'. Ces menus sont similaires à l'exemple ci-dessus.

+
<toolbox>
+
+ <menubar id="findfiles-menubar">   <menu id="file-menu" label="Fichier" accesskey="f">     <menupopup id="file-popup">       <menuitem label="Ouvrir une Recherche..." accesskey="o"/>       <menuitem label="Enregistrer une Recherche..." accesskey="s"/>         <menuseparator/>       <menuitem label="Fermer" accesskey="c"/>     </menupopup>   </menu>   <menu id="edit-menu" label="Édition" accesskey="e">     <menupopup id="edit-popup">       <menuitem label="Couper" accesskey="t"/>       <menuitem label="Copier" accesskey="p"/>       <menuitem label="Copier" accesskey="l" disabled="true"/>     </menupopup>   </menu>  </menubar>
+
+<toolbar id="findfiles-toolbar>
+
+

Source Voir

+
Image:xultu_menubar1.png
+Ici, nous avons ajouté deux menus contenant des commandes variées. Notez que la barre de menus a été ajoutée dans un toolbox. Les points de suspension après 'Ouvrir une Recherche' et 'Enregistrer une Recherche' sont le moyen habituel pour indiquer à l'utilisateur qu'une boîte de dialogue va s'ouvrir quand il sélectionne une de ces commandes. Des touches de raccourcis ont été associées à chaque menu et à chaque item de menu. Vous verrez dans l'image que cette lettre a été soulignée dans le texte du menu. Vous verrez aussi que la commande 'Coller' a été désactivée. Nous supposons qu'il n'y a rien à coller.
+

Ajouter des coches aux menus

+

De nombreuses applications ont des items de menu avec des coches. Par exemple, une fonctionnalité qui est active a une coche placé à côté de la commande et une fonctionnalité qui est désactivée n'a pas de coche. Quand l'utilisateur sélectionne le menu, l'état de la coche est inversé. Vous pouvez aussi créer des boutons radio sur les items de menu.

+

Les coches sont créées de manière similaire aux éléments checkbox et radio. Elles impliquent l'utilisation de deux attributs : type pour indiquer le type de coche et name pour regrouper les commandes. L'exemple ci-dessous crée un menu avec un élément coché.

+

Exemple 2: Source Voir

+
<toolbox>
+  <menubar id="options-menubar">
+    <menu id="options_menu" label="Options">
+      <menupopup>
+        <menuitem id="backups" label="Faire des sauvegardes" type="checkbox"/>
+        <menuitem id="backups" label="Mail de l'administrateur" type="checkbox" checked="true"/>
+      </menupopup>
+    </menu>
+  </menubar>
+</toolbox>
+
+

L'attribut type ajouté est utilisé pour rendre l'élément de menu « cochable ». En mettant sa valeur à 'checkbox', l'élément de menu peut être coché et décoché par simple sélection.

+ +

En plus des coches standard, vous pouvez créer des coches de style radio en mettant type à la valeur 'radio'. Une coche radio est utilisée quand vous voulez un groupe d'éléments de menu dont l'un seulement peut être coché à la fois. Un exemple peut être un menu de police de caractères où une seule police peut être sélectionnée. Quand un autre item est sélectionné, l'élément choisi précédemment est automatiquement décoché.

+

Pour grouper plusieurs éléments de menu ensemble, vous devez placer un attribut name sur chacun d'eux. Mettez la même chaîne de caractères comme valeur. L'exemple ci-dessous vous en donne l'illustration :

+

Exemple 3: Source Voir

+
<toolbox>
+  <menubar id="planets-menubar">
+    <menu id="planet-menu" label="Planète">
+      <menupopup>
+        <menuitem id="jupiter" label="Jupiter" type="radio" name="ringed"/>
+        <menuitem id="saturn" label="Saturne" type="radio" name="ringed" checked="true"/>
+        <menuitem id="uranus" label="Uranus" type="radio" name="ringed"/>
+        <menuseparator/>
+        <menuitem id="earth" label="Terre" type="radio" name="inhabited" checked="true"/>
+        <menuitem id="moon" label="Lune" type="radio" name="inhabited"/>
+      </menupopup>
+    </menu>
+  </menubar>
+</toolbox>
+
+

Si vous essayez cet exemple, vous verrez que sur les trois premiers éléments, un seul peut être coché à la fois. Ils sont regroupés car ils ont le même nom. Le dernier élément de menu, 'Terre', ne fait pas partie du groupe car il a un nom différent. Pourtant, c'est aussi un bouton radio.

+

Bien sûr, les éléments de menu groupés doivent tous être dans le même menu. Ils n'ont pas à être placés les uns à côté des autres, mais les placer autrement n'aurait pas beaucoup de sens.

+
+

Par la suite, nous allons voir comment créer des menus surgissants.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/plus_sur_les_gestionnaires_d'\303\251v\303\250nements/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/plus_sur_les_gestionnaires_d'\303\251v\303\250nements/index.html" new file mode 100644 index 0000000000..73d1b21264 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/plus_sur_les_gestionnaires_d'\303\251v\303\250nements/index.html" @@ -0,0 +1,129 @@ +--- +title: Plus sur les gestionnaires d'évènements +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Plus_sur_les_gestionnaires_d'évènements +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/More_Event_Handlers +--- +

 

+
+

« PrécédentSuivant »

+
+

Dans cette section, l'objet événement sera examiné et des événements additionnels seront décrits.

+

L'objet 'event'

+

Chaque gestionnaire d'événement dispose d'un unique argument qui contient un objet event. Dans la forme avec attributs des scrutateurs d'événements, cet événement est un argument implicite auquel un script peut se référer en utilisant le nom 'event'. Sous la forme addEventListener, le premier argument de la fonction scrutatrice sera un objet événement. L'objet 'event' dispose d'un certain nombre de propriétés qui peuvent être examinées lors de l'émission d'un événement. La liste complète est disponible dans les références objets.

+

Nous avons déjà vu la propriété target d'un événement dans la section précédente. Elle contient une référence de l'élément ayant déclenché l'événement. Une propriété similaire currentTarget contient l'élément sur lequel est placé un scrutateur d'événement. Dans l'exemple ci-dessous, currentTarget pointe toujours la boîte vbox, alors que la cible peut être un élément spécifique, le bouton ou la case à cocher qui a été activé.

+

Exemple 1: Source Voir

+
<vbox oncommand="alert(event.currentTarget.tagName);">
+   <button label="OK"/>
+   <checkbox label="Voir les images"/>
+</vbox>
+
+

Stopper la propagation d'événement

+

Une fois qu'un événement est traité, indépendamment de l'étape de la propagation où se trouve l'événement, vous pouvez empêcher qu'il soit transmis aux éléments suivants, c'est-à-dire de stopper les phases de captures ou de diffusion. En fonction de la manière dont vous avez attaché le scrutateur d'événement sur un élément, il existe plusieurs méthodes pour le faire.

+

Rappelez-vous que la phase de capture intervient avant la phase de diffusion, donc tous les scrutateurs de capture sont déclenchés avant les scrutateurs de diffusion. Si un événement capturé stoppe la propagation événementielle, aucun des scrutateurs de capture ou de diffusion suivants ne recevront de notification d'un quelconque événement. Pour interrompre la propagation événementielle, appelez la méthode stopPropagation de l'objet événement, comme dans l'exemple qui suit.

+

Exemple 2: Source Voir

+
<hbox id="outerbox">
+  <button id="okbutton" label="OK"/>
+</hbox>
+
+<script>
+function buttonPressed(event){
+  alert('Le bouton a été pressé !');
+}
+
+function boxPressed(event){
+  alert('La boîte a été pressée !');
+  event.stopPropagation();
+}
+
+var button = document.getElementById("okbutton");
+button.addEventListener('command',buttonPressed,true);
+
+var outerbox = document.getElementById("outerbox");
+outerbox.addEventListener('command',boxPressed,true);
+</script>
+
+

Ici, un scrutateur d'événement a été ajouté au bouton, et un autre à la boîte. La méthode stopPropagation est appelée dans le scrutateur de la boîte, donc le scrutateur du bouton ne sera jamais appelé. Si cet appel est enlevé, les deux scrutateurs seront appelés et les deux alertes apparaîtront.

+

Empêcher l'action par défaut

+

Si aucun gestionnaire d'événement n'a été enregistré pour un événement donné, alors après avoir accompli les phases de capture et de diffusion, l'élément traitera l'événement dans un mode par défaut. L'action par défaut dépendra de la nature de l'événement et du type d'élément. Par exemple, l'événement 'popupshowing' est envoyé par un menu surgissant juste avant son affichage. L'action par défaut est l'affichage du menu surgissant. Si l'action par défaut est bloquée, l'affichage ne se fera pas. L'action par défaut peut être empêchée avec la méthode preventDefault de l'objet événement, comme dans l'exemple ci-dessous.

+

Exemple 3: Source Voir

+
<button label="Types" type="menu">
+  <menupopup onpopupshowing="event.preventDefault();">
+    <menuitem label="Verre"/>
+    <menuitem label="Plastique"/>
+  </menupopup>
+</button>
+
+

Alternativement, pour des scrutateurs d'événement par attributs, vous pouvez simplement faire renvoyer la valeur 'false' par le code. Notez que l'empêchement de l'action par défaut ne revient pas à interrompre la propagation événementielle avec la méthode stopPropagation. Même si l'action par défaut a été bloquée, l'événement continue à se propager. De même, l'appel de la méthode stopPropagation ne bloquera pas l'action par défaut. Vous devrez appeler ces deux méthodes pour interrompre les deux actions.

+

Notez qu'une fois la propagation ou l'action par défaut bloquée, il n'est pas possible de les rendre actives de nouveau pour cet événement.

+

Les sous-sections ci-dessous listent quelques-uns des événements pouvant être utilisés. Une liste complète est fournie dans la référence des événements.

+

Événements de la souris

+

Il y a plusieurs événements pouvant être employés pour gérer les actions de la souris, listés dans le tableau suivant :

+
+
+ 'click' 
+
+ appelé lorsque la souris est appuyée puis relâchée sur un élément.
+
+ 'dblclick' 
+
+ appelé lorsque la souris est double-cliquée.
+
+ 'mousedown' 
+
+ appelé lorsqu'un bouton de la souris est pressé. Le gestionnaire d'événement est appelé aussitôt que le bouton de la souris est appuyé, avant même qu'il ne soit relâché.
+
+ 'mouseup' 
+
+ appelé lorsque la souris est relâchée sur un élément.
+
+ 'mouseover' 
+
+ appelé lorsque le pointeur de la souris survole un élément. Vous pourriez utiliser cet événement pour mettre en valeur l'élément, toutefois CSS fournit une façon automatique de le faire, il est donc inutile de le faire avec un événement. Vous pouvez toutefois l'utiliser pour afficher une aide dans la barre d'état.
+
+ 'mousemove' 
+
+ appelé lorsque le pointeur de la souris se déplace au-dessus d'un élément. L'événement étant appelé à chaque déplacement de la souris, vous devriez éviter de faire appel à ce gestionnaire pour des tâches trop longues.
+
+ 'mouseout' 
+
+ appelé lorsque le pointeur de la souris quitte un élément. Vous pourriez annuler la mise en valeur de l'élément ou effacer le texte de la barre d'état.
+
+

Il existe également un jeu d'événements relatifs au glisser, qui intervient lorsque l'utilisateur maintient le bouton de la souris enfoncé et déplace la souris. Ces événements seront décrits dans la section Glisser-Déposer.

+

Propriétés des événements des boutons de la souris

+

Lorsqu'un événement sur un bouton de la souris se produit, vous disposez d'un certain nombre de propriétés supplémentaires pour déterminer quels boutons ont été pressés et la position du pointeur de la souris. La propriété button de 'event' peut être utilisée pour déterminer quel bouton a été pressé, avec les valeurs possibles de '0' pour le bouton de gauche, '1' pour le bouton de droite, et '2' pour le bouton du milieu. Si vous avez configuré votre souris différemment, ces valeurs peuvent être différentes.

+

La propriété detail contient le nombre de fois que le bouton a été cliqué rapidement en séquence. Elle permet de tester des clics simples, doubles ou triples. Bien entendu, si vous ne souhaitez tester que les double-clics, vous pouvez plutôt utiliser l'événement 'dblclick'. L'événement 'click' sera lancé dès le premier clic, puis de nouveau pour le second clic, puis pour le troisième clic, tandis que l'événement 'dblclick' ne sera lancé que pour un double-clic.

+

Les propriétés button et detail ne s'appliquent qu'aux événements se rapportant aux boutons de la souris, et non aux déplacements de la souris. Pour l'événement 'mousemove', par exemple, l'ensemble de ces propriétés aura une valeur de '0'.

+

Propriétés des événements de position de la souris

+

Toutefois, tous les événements de la souris disposent des propriétés contenant les coordonnées de la position de la souris lors du déclenchement de l'événement. Il y a deux jeux de coordonnées. Le premier jeu définit les propriétés screenX et screenY mesurées depuis le coin supérieur gauche de l'écran. Le second jeu, clientX et clientY, est calculé à partir du coin supérieur gauche du document. Voici un exemple qui affiche les coordonnées courantes de la souris :

+

Exemple 4: Source Voir

+
<script>
+
+function updateMouseCoordinates(event){
+  var text = "X:" + event.clientX + " Y:" + event.clientY;
+  document.getElementById("xy").value = text;
+}
+</script>
+
+<label id="xy"/>
+<hbox width="400" height="400" onmousemove="updateMouseCoordinates(event);"/>
+
+

Dans cet exemple, les dimensions de la boîte ont été fixées explicitement pour que l'effet soit plus visible. Le gestionnaire d'événement récupère les propriétés clientX et clientY et les convertit en une chaîne (string). Cette chaîne est affectée à la propriété value du libellé. Notez que l'argument 'event' doit être passé à la fonction updateMouseCoordinates. Si vous déplacez rapidement la souris autour de la bordure, vous noterez que les coordonnées ne s'arrêtent généralement pas exactement sur '400'. Ceci s'explique car l'événement 'mousemove' se déclenche selon un intervalle dépendant de la vitesse de déplacement de la souris, et celle-ci s'est généralement déplacée au-delà de la bordure avant le lancement de l'événement suivant. Évidement, il ne serait pas judicieux d'envoyer un événement 'mousemove' sur chacun des pixels parcourus par la souris.

+

Coordonnées relatives à un élément

+

Souvent, ce sont les coordonnées relatives à l'élément qui a déclenché l'événement que vous voulez obtenir, pas celles relatives à la fenêtre entière. Pour y parvenir, il vous suffit de soustraire la position de l'élément à la position de l'événement, comme dans le code suivant.

+
var element = event.target;
+var elementX = event.clientX - element.boxObject.x;
+var elementY = event.clientY - element.boxObject.y;
+
+

Les éléments XUL ont un objet de boîte accessible en utilisant la propriété boxObject. Nous en apprendrons plus sur l'objet de boîte dans une section ultérieure, mais sachez qu'il contient des informations sur l'affichage de l'élément, incluant notamment ses coordonnées horizontales (x) et verticales (y). Dans cet exemple de code, ces coordonnées sont soustraites de celles de l'événement pour obtenir la position relative de l'élément XUL.

+

Événements de chargement

+

L'événement de chargement est envoyé au document (l'élément window) dès que le fichier XUL a fini son chargement et juste avant que son contenu ne soit affiché. Cet événement est couramment utilisé pour initialiser les champs et réaliser d'autres tâches qui doivent être exécutées avant que l'utilisateur ne dispose de la fenêtre. Vous devriez utiliser un événement de chargement pour faire ce genre de chose plutôt que d'ajouter un script de niveau supérieur extérieur à une fonction. Cette préconisation tient au fait que les éléments XUL peuvent ne pas être chargés ou ne pas être totalement initialisés, ce qui peut entraîner des dysfonctionnements. Pour utiliser un événement de chargement, placez l'attribut onload sur l'élément window. Appelez du code à l'intérieur du gestionnaire de chargement afin d'initialiser l'interface si nécessaire.

+

Il existe également un événement unload qui est appelé dès que la fenêtre est fermée ou, dans un contexte de navigation, lorsque la page bascule vers une autre URL. Vous pouvez utiliser cet événement, par exemple, pour sauvegarder des informations modifiées.

+
+

Nous verrons ensuite comment ajouter des raccourcis clavier.

+
+

« PrécédentSuivant »

+
diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/positionnement_dans_une_pile/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/positionnement_dans_une_pile/index.html new file mode 100644 index 0000000000..5a940e4ff2 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/positionnement_dans_une_pile/index.html @@ -0,0 +1,36 @@ +--- +title: Positionnement dans une pile +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Positionnement_dans_une_pile +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Stack_Positioning +--- +

 

+
+

« PrécédentSuivant »

+
+

Cette section va décrire comment positionner des éléments dans une pile (stack).

+

Placement des enfants d'une pile

+

Normalement, les éléments enfants d'une pile s'étirent pour s'ajuster à la dimension de la pile. Toutefois, vous pouvez aussi placer ces enfants à des coordonnées précises. Par exemple, si la pile a deux boutons comme enfants, l'un d'eux peut être placé à 20 pixels du bord gauche et 50 pixels du bord supérieur. Le second bouton peut être placé à 100 pixels du bord gauche et 5 pixels du bord supérieur.

+

La position d'un élément enfant doit être précisée en plaçant deux attributs sur chaque élément. Pour le positionnement horizontal, utilisez l'attribut left et pour le positionnement vertical, utilisez l'attribut top. Si vous ne mettez pas ces attributs sur un enfant de la pile, celui-ci va s'étirer pour s'ajuster à la dimension de la pile.

+

Exemple 1: Source Voir

+
Image:xultu_ex_4_4_1.png
+
<stack>
+   <button label="Goblins" left="5" top="5"/>
+   <button label="Trolls" left="60" top="20"/>
+   <button label="Vampires" left="10" top="60"/>
+</stack>
+
+

La pile stack contient trois éléments, chacun d'eux est positionné aux coordonnées précisées par les attributs left et top. Ici, les trois éléments enfants sont des boutons, mais les éléments n'ont pas à être tous du même type. Il peut y avoir n'importe quels éléments, même des boîtes ou d'autres piles.

+

Les dimensions d'une pile sont déterminées par les positions de ses éléments enfants. La pile aura toujours des dimensions permettant à ses éléments enfants d'être visibles. Ainsi, si vous initialisez l'attribut left d'un enfant à la valeur de '400', la pile aura une largeur d'environ 400 pixels plus la largeur de cet élément enfant. Vous pouvez outrepasser cette taille avec des propriétés de style variées telles que width et max-width.

+

Vous pouvez utiliser un script pour ajuster les valeurs des attributs left et top et de ce fait, rendre les éléments mobiles. Les piles présentent l'avantage suivant : lorsqu'un élément positionné de façon absolue change sa position, la position des autres éléments n'est pas affectée. Si vous essayez de déplacer des éléments dans une boîte normale, les autres éléments vont bouger en réaction.

+

Il est également possible de placer des éléments enfants de telle manière qu'ils se superposent. Lorsque les éléments enfants se dessinent, ils sont affichés dans l'ordre où ils sont apparus dans la pile. De ce fait, le premier enfant d'une pile apparaît en arrière plan, suivi du second et ainsi de suite. Le dernier enfant apparaît au premier plan. Vous pouvez utiliser les fonctions DOM pour modifier l'ordre des éléments.

+

Lorsqu'ils répondent aux événements de la souris, les éléments au premier plan vont capturer les événements en premier. Cela signifie que si deux boutons se superposent, le bouton au premier plan va capturer le clic de la souris à l'endroit où il couvre l'autre bouton.

+
+

La prochaine section décrit les onglets, qui sont comme des paquets (deck) mais fournissent leur propre système d'utilisation.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/positionnement_des_\303\251l\303\251ments/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/positionnement_des_\303\251l\303\251ments/index.html" new file mode 100644 index 0000000000..f3cdf9ff84 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/positionnement_des_\303\251l\303\251ments/index.html" @@ -0,0 +1,253 @@ +--- +title: Positionnement des éléments +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Positionnement_des_éléments +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Element_Positioning +--- +
+

« PrécédentSuivant »

+
+ +

Ici nous apprendrons à contrôler la position et la taille d'un élément.

+ +

Positionnement des éléments de boîte

+ +

Jusqu'ici, nous avons appris à placer des éléments horizontalement ou verticalement à l'intérieur d'une boîte. Nous aurons souvent besoin d'un meilleur contrôle sur la position et la taille des éléments à l'intérieur d'une boîte. Pour cela, nous devons d'abord comprendre le fonctionnement d'une boîte.

+ +

La position d'un élément est déterminée par le style de mise en plage de son conteneur. Par exemple, la position d'un bouton dans une boîte horizontale est à droite du bouton précédent, s'il y en a plusieurs. La dimension d'un élément est déterminée par deux facteurs, la place que cet élément cherche à occuper et la taille que vous avez spécifiée. La taille qu'un élément cherche à avoir est déterminée par son contenu. Par exemple, la largeur d'un bouton est déterminée par la quantité de texte à l'intérieur du bouton.

+ +

Un élément sera généralement juste assez large pour les besoins de l'affichage de son contenu, et pas plus large. Quelques éléments, tels que les boîtes de textes, utiliseront une taille par défaut. Une boîte aura la largeur nécessaire à l'affichage des éléments qu'elle contient. Une boîte horizontale contenant trois boutons aura la largeur de ces trois boutons, plus la marge.

+ +

Dans l'image ci-dessous, les deux premiers boutons ont la taille suffisante à l'affichage de leur texte. Le troisième bouton est plus large parce que son contenu est plus grand. La largeur de la boîte contenant les boutons correspond au total des largeurs de ces boutons plus la marge entre eux. La hauteur des boutons est une taille adaptée à l'affichage du texte.

+ +

Image:xultu_boxstyle1n.png

+ +

Attributs de largeur et de hauteur

+ +

Vous pourriez avoir besoin de mieux contrôler la taille d'un élément dans une fenêtre. Plusieurs dispositifs vous permettent de contrôler la dimension d'un élément. La méthode la plus rapide est d'ajouter simplement les attributs width et height sur un élément, un peu comme vous le feriez avec la balise HTML img. Voir l'exemple ci-dessous :

+ +

Exemple 1: Source Voir

+ +
<button label="OK" width="100" height="40"/>
+ +

Cependant, il n'est pas recommandé de procéder ainsi. Cette méthode n'est pas vraiment portable et peut ne pas s'adapter à certains thèmes. Une meilleure méthode consiste à utiliser des propriétés de style, dont le fonctionnement est similaire aux feuilles de styles du HTML. Les propriétés CSS suivantes peuvent être utilisées.

+ +
+
width 
+
Ceci indique la largeur d'un élément.
+
height 
+
Ceci indique la hauteur d'un élément.
+
+ +

En plaçant l'une ou l'autre de ces deux propriétés, l'élément sera créé avec cette largeur et cette hauteur. Si vous spécifiez seulement une de ces deux propriétés, l'autre est calculée en fonction de ses propres besoins. La valeur de ces propriétés de style doit être définie par un nombre suivi d'une unité de mesure.

+ +

Éléments flexibles

+ +

Les dimensions des éléments non flexibles sont assez faciles à calculer. Elles correspondent simplement aux largeurs et de hauteurs spécifiées, ou si ces valeurs ne sont pas définies, elles sont ajustées par défaut au contenu. Pour les éléments flexibles, le calcul est légèrement plus savant.

+ +

Les éléments flexibles sont ceux qui ont un attribut flex dont la valeur est supérieure à 0. Rappelez-vous que les éléments flexibles s'étirent et s'élargissent pour remplacer l'espace vide. Leurs tailles par défaut restent calculées de la même façon que les éléments non flexibles. Considérez l'exemple suivant :

+ +

Exemple 2: Source Voir

+ +
<window orient="horizontal"
+        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+<box>
+   <button label="Oui" flex="1"/>
+   <button label="Non"/>
+   <button label="Je ne connais pas vraiment cette manière ou l'autre"/>
+</box>
+
+ +

La fenêtre apparaîtra initialement comme sur l'image précédente. Les deux premiers boutons seront dimensionnés à une largeur par défaut convenable et le troisième bouton sera plus large parce que son libellé est plus long. Le premier bouton est flexible et les trois éléments ont été placés à l'intérieur d'une boîte. La largeur de la boîte correspondra à la largeur totale des trois boutons (environs 515 pixels dans l'image).

+ +

Si vous augmentez la largeur de la fenêtre, une vérification de la flexibilité des éléments est effectuée afin d'assurer le remplissage de l'espace libre à afficher. Le bouton est le seul élément flexible, mais il ne s'élargira pas plus, parce que la boîte contenant le bouton n'est pas flexible. Un élément inflexible ne change jamais de taille même lorsque de l'espace est disponible, c'est pourquoi le bouton ne s'agrandit pas non plus. Ainsi, le bouton ne pourra pas s'élargir.

+ +

La solution est de rendre la boîte flexible également. De cette façon, quand vous élargirez la fenêtre, de l'espace supplémentaire sera disponible, et la boîte s'élargira alors pour remplir cet espace supplémentaire. Puisque la boîte est plus grande, une plus grande quantité d'espace libre est créée à l'intérieur de celle-ci, et le bouton flexible qu'elle contient s'élargira pour occuper l'espace disponible. Ce processus est répété pour toutes les boîtes présentes, autant de fois que nécessaire.

+ +

Réglage des tailles minimales et maximales

+ +

Vous pouvez autoriser un élément à être flexible tout en limitant ses dimensions de sorte à certaines valeurs. À l'inverse, vous pouvez définir des dimensions minimales. Ce comportement se définit par les quatre attributs suivants :

+ +
+
minwidth 
+
Ceci indique la largeur minimale que l'élément peut posséder.
+
minheight 
+
Ceci indique la hauteur minimale que l'élément peut posséder.
+
maxwidth 
+
Ceci indique la largeur minimale que l'élément peut posséder.
+
maxheight 
+
Ceci indique la hauteur minimale que l'élément peut posséder.
+
+ +

Les valeurs sont toujours mesurées en pixels. Vous pouvez également employer les propriétés CSS correspondantes, min-width, min-height, max-width et max-height.

+ +

Ces propriétés ne sont utiles que pour des éléments flexibles. En plaçant une hauteur maximale, par exemple, un bouton extensible s'étirera seulement jusqu'à cette hauteur maximale. Vous pourrez toujours agrandir la fenêtre au-delà de ce point mais la taille du bouton cessera de s'accroître. La boîte dans laquelle le bouton se trouve continuera également à s'agrandir, à moins que vous ne définissiez aussi une hauteur maximale pour la boîte.

+ +

Si deux boutons sont flexibles, ils se partageront normalement tous les deux la quantité d'espace disponible. Si un bouton a une largeur maximale, le second devrait continuer de s'agrandir en prenant tout l'espace restant.

+ +

Si une boîte a une largeur ou une hauteur maximale, les enfants ne peuvent pas se développer au-delà de cette taille maximale. Si une boîte a une largeur ou une taille minimale, les enfants ne peuvent pas rétrécir au-delà de cette taille minimale.

+ +

Exemples de réglage de largeurs et de hauteurs

+ +
<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">Ceci est quelque peu ennuyant mais c'est un texte s'étalant simplement.</description>
+
+ +
+
Exemple 1 
+
Le premier bouton sera affiché avec une largeur de 100 pixels (le px signifie pixels). Vous devez ajouter l'unité, ou la largeur définie sera ignorée.
+
Exemple 2 
+
Le deuxième bouton sera affiché avec une hauteur de dix pixels et une largeur de 100 em (un em correspond à la taille d'un caractère dans la police courante).
+
Exemple 3 
+
Le troisième bouton flexible s'agrandira en se basant sur la taille de la boîte qui le contient. Cependant, le bouton ne rétrécira jamais au-dessous de 50 pixels. D'autres composants flexibles tels que des éléments spacers absorberont l'espace restant, brisant ainsi le rapport de flexibilité.
+
Exemple 4 
+
Le quatrième bouton est flexible et n'aura jamais une hauteur inférieure à 2 ex (un ex correspond habituellement à la taille de la lettre x dans la police courante) ou une largeur supérieure à 100 pixels.
+
Exemple 5 
+
Le champ de saisie de texte est flexible mais sa largeur ne sera jamais supérieure à 10 em. Vous employerez souvent les ems quand vous préciserez les tailles des champs de saisie de texte en fonction du texte qu'ils contiennent. Cette unité est utile pour des champs de saisie de texte qui peuvent ainsi s'adapter à la police de caractères utilisée, même si la police est très grande.
+
Exemple 6 
+
L'élément description est limité à 50 pixels en largeur maximale. À l'intérieur, une césure du texte sur la ligne suivante interviendra après 50 pixels.
+
+ +
+

Notre exemple de recherche de fichiers

+ +

Ajoutons quelques-uns de ces styles à notre exemple de fenêtre de recherche de fichiers. Nous le ferons de telle manière que le champ de saisie de texte s'étire pour remplir entièrement la fenêtre.

+ +

Source Voir

+ +
<textbox id="find-text" '''flex="1" style="min-width: 15em;"'''/>
+ +
Image:xultu_boxstyle1.png
+ +

Ici, le champ de saisie de texte a été rendu flexible. De cette façon, il s'agrandira si l'utilisateur change la taille de la fenêtre. C'est utile si l'utilisateur veut saisir une longue chaîne de caractères. En outre, une largeur minimale de 15 em a été définie de sorte que le champ de saisie de texte affiche toujours au moins 15 caractères. Si l'utilisateur redimensionne la fenêtre en diminuant sa taille, le champ de saisie de texte ne se rétrécira pas en-dessous de 15 em. Il sera dessiné comme s'il se prolongait au-delà du bord de la fenêtre. Notez que sur l'image, le champ de saisie de texte s'est étiré de façon à occuper toute la largeur de la fenêtre.

+
+ +

Empaquetage de boîte

+ +

Nous avons une boîte avec deux éléments enfants, qui ne sont pas flexibles, mais dans la boîte qui est flexible. Par exemple :

+ +

Exemple 3: Source Voir

+ +
<box flex="1">
+   <button label="Heureux"/>
+   <button label="Triste"/>
+</box>
+
+ +

Si vous redimensionnez la fenêtre, la boîte s'étirera pour s'ajuster à la taille de la fenêtre. Les boutons n'étant pas flexibles, leur largeur ne changera pas. Le résultat est qu'un espace supplémentaire apparaîtra sur le côté droit de la fenêtre, à l'intérieur de la boîte. Cependant, vous pouvez désirer que l'espace supplémentaire apparaisse plutôt sur le côté gauche alors que les boutons restent alignés sur la droite de la fenêtre.

+ +

Vous pouvez réaliser cela en plaçant un élément spacer à l'intérieur de la boîte, mais cela peut rendre le code confus quand vous devez le faire plusieurs fois. Une meilleure solution est d'utiliser l'attribut pack sur la boîte. Cet attribut indique comment empaqueter les éléments enfants à l'intérieur d'une boîte. Pour des boîtes orientées horizontalement, il contrôle le positionnement horizontal des enfants. Pour les boîtes orientées verticalement, il contrôle le positionnement vertical des enfants. Vous pouvez utilisez les valeurs suivantes :

+ +
+
start 
+
Ceci positionne les éléments sur le bord gauche pour les boîtes horizontales et sur le bord haut pour les boîtes verticales. C'est la valeur par défaut.
+
center 
+
Ceci centre les éléments enfants dans la boîte.
+
end 
+
Ceci positionne les éléments sur le bord droit pour les boîtes horizontales et sur le bord bas pour les boîtes verticales.
+
+ +

L'attribut pack s'applique à la boîte contenant les éléments à empaqueter et non aux éléments eux-mêmes.

+ +

Nous pouvons modifier l'exemple précédent pour centrer les éléments de cette façon :

+ +

Exemple 4: Source Voir

+ +
<box flex="1" pack="center">
+   <button label="Heureux"/>
+   <button label="Triste"/>
+</box>
+
+ +

Maintenant, lorsque la fenêtre est redimensionnée, les boutons sont centrés horizontalement. Comparez ce comportement à celui de l'exemple précédent.

+ +

Alignement de boîte

+ +

Si vous redimensionnez horizontalement la fenêtre dans l'exemple « Heureux-Triste », la boîte devrait s'élargir. Si vous redimensionnez verticalement la fenêtre, vous noterez que les boutons sont étirés. Ceci est dû à la flexibilité qui est affectée par défaut à l'autre direction.

+ +

Vous pouvez contrôler ce comportement avec l'attribut align. Pour les boîtes horizontales, il contrôle le positionnement vertical des enfants. Pour les boîtes verticales, il contrôle le positionnement horizontal des enfants. Les valeurs possibles sont similaires à celles de l'attibut pack.

+ +
+
start 
+
Ceci aligne les éléments le long du bord haut pour les boîtes horizontales et le long du bord gauche pour les boîtes verticales.
+
center 
+
Ceci centre les éléments enfants dans la boîte.
+
end 
+
Ceci aligne les éléments le long du bord bas pour les boîtes horizontales et le long du bord droit pour les boîtes verticales.
+
baseline 
+
Ceci aligne les éléments et le texte. Il est utilisable seulement avec des boîtes horizontales.
+
stretch 
+
Cette valeur, affectée par défaut, provoque l'agrandissement des éléments proportionnellement à la taille de la boîte, un peu à la façon d'un élément flexible, mais dans la direction opposée.
+
+ +

Comme avec l'attribut pack, l'attribut align s'applique à la boîte contenant les éléments à aligner et non aux éléments eux-mêmes.

+ +

Dans l'exemple ci-dessous, la première boîte aura ses enfants étirés, car c'est le comportement par défaut. La seconde boîte a un attribut align, c'est pourquoi ses enfants sont placés au centre.

+ +

Exemple 5: Source Voir

+ +
<?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="Oui"/>
+    <button label="Non"/>
+  </hbox>
+  <hbox align="center">
+    <button label="Peut-être"/>
+    <button label="Il se peut"/>
+  </hbox>
+
+</window>
+
+ +
Image:xultu_boxstyle2-b.png
+ +

Vous pouvez aussi utiliser les propriétés de style -moz-box-pack et -moz-box-align à la place des attributs indiqués.

+ +
Vous pouvez trouver l'exemple d'alignement de boîte pratique pour tester les différentes propriétés de boîte (NdT : vous pouvez aussi voir une autre démonstration du même genre sur xulfr).
+ +

Coupure du texte et des boutons

+ +

Vous pouvez potentiellement créer un élément bouton qui contient un libellé plus large que la largeur maximale du bouton. Bien sûr, une solution serait d'augmenter la taille du bouton. Cependant, les boutons (et les autres éléments avec un libellé) ont un attribut spécial appelé crop qui vous permet d'indiquer de quelle manière le texte doit être traité s'il est trop grand.

+ +

Si le texte est coupé, un point de suspension (…) apparaît sur le bouton où le texte a été enlevé. Quatre valeurs sont valides :

+ +
+
left 
+
Le texte est coupé sur son côté gauche.
+
right 
+
Le texte est coupé sur son côté droit.
+
center 
+
Le texte est coupé au milieu.
+
none 
+
Le texte n'est pas coupé. C'est la valeur par défaut.
+
+ +

Cet attribut est vraiment utile quand une boîte de dialogue a été conçue pour être utilisable à n'importe quelle taille. L'attribut crop peut aussi être utilisé avec les autres éléments qui utilisent un attribut label en tant que libellé. L'exemple suivant montre l'utilisation de cet attribut :

+ +

Exemple 6: Source Voir

+ +
Image:xultu_boxstyle2.png
+ +
<button label="Pressez moi, s'il vous plait !" crop="right" flex="1"/>
+ +

Notez comment le texte sur le bouton voit son côté droit coupé si la fenêtre est réduite.

+ +
+

Dans la prochaine section, nous ferons un petit résumé et décrirons quelques détails supplémentaires concernant le modèle de boîte.

+ +
+

« PrécédentSuivant »

+
diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/raccourcis_clavier/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/raccourcis_clavier/index.html new file mode 100644 index 0000000000..861c0450d0 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/raccourcis_clavier/index.html @@ -0,0 +1,377 @@ +--- +title: Raccourcis clavier +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Raccourcis_clavier +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Keyboard_Shortcuts +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Pour réagir aux touches pressées, vous pouvez utiliser des gestionnaires d'événements clavier, mais il serait fastidieux de le faire pour chaque bouton ou chaque item de menu.

+ +

Création d'un raccourci clavier

+ +

XUL fournit des méthodes par lesquelles vous pouvez définir des raccourcis clavier. Nous avons déjà vu dans la section sur les menus que nous pouvions définir un attribut appelé accesskey qui spécifie la touche à presser par l'utilisateur pour activer le menu ou l'item de menu. Dans l'exemple ci-dessous, le menu Fichier peut être sélectionné en pressant Alt et F (ou une autre combinaison de touches spécifique à une plate-forme). Une fois le menu Fichier ouvert, l'item de menu Fermer peut être sélectionné en pressant F.

+ +

Exemple 1: Source Voir

+ +
<menubar id="sample-menubar">
+   <menu id="file-menu" label="Fichier" accesskey="f">
+     <menupopup id="file-popup">
+       <menuitem id="close-command" label="Fermer" accesskey="f"/>
+     </menupopup>
+   </menu>
+</menubar>
+
+ +

Vous pouvez aussi utiliser l'attribut accesskey sur les boutons. Dans ce cas, quand la touche est pressée, le bouton est sélectionné.

+ +

Cependant, vous pourriez vouloir mettre en place des raccourcis clavier plus généraux, comme par exemple, la combinaison Ctrl+C pour copier du texte dans le presse-papiers. Bien que de tels raccourcis puissent ne pas être toujours valides, ils fonctionneront habituellement dès qu'une fenêtre est ouverte. Normalement, un raccourci sera autorisé à n'importe quel moment et vous pourrez vérifier via un script s'il doit faire quelque chose. Par exemple, copier du texte dans le presse-papiers ne devrait fonctionner seulement quand du texte est sélectionné.

+ +

Élément key

+ +

XUL fournit un élément, key, qui vous permet de définir un raccourci clavier pour une fenêtre. Il comprend des attributs pour définir la touche qui doit être pressée et quels modificateurs de touches (tels que shift pour Maj ou control pour Ctrl) doivent l'accompagner. Un exemple :

+ +
<keyset>
+   <key id="sample-key" modifiers="shift" key="R"/>
+</keyset>
+
+ +

Cet exemple définit un raccourci clavier qui s'active lorsque l'utilisateur presse les touches Maj et R. L'attribut key (notez qu'il a le même nom que l'élément lui-même) est utilisé pour indiquer quelle touche doit être pressée, dans ce cas R. Vous pouvez ajouter n'importe quels caractères à cet attribut selon les combinaisons de touches devant être pressées. Les modificateurs de touches devant être pressés sont indiqués par l'attribut modifiers. Il s'agit d'une liste de modificateurs séparée par des espaces, et ils sont décrits ci-dessous :

+ +
+
'alt' 
+
L'utilisateur doit presser la touche Alt. Sous Macintosh, il s'agit de la touche Option.
+
'control' 
+
L'utilisateur doit presser la touche Ctrl
+
'meta' 
+
L'utilisateur doit presser la touche Meta. Il s'agit de la touche Command sous Macintosh.
+
'shift' 
+
L'utilisateur doit presser la touche Shift (Maj)
+
'accel' 
+
L'utilisateur doit presser la touche spéciale d'accélérateur. L'utilisateur doit presser la touche de raccourci spécifique à sa plate-forme. Il s'agit de la valeur que vous utiliserez habituellement.
+
+ +

Votre clavier n'a pas forcément toutes ces touches, dans ce cas, elles seront actives par d'autres touches de modification que vous possédez.

+ +

L'élément key doit être placé à l'intérieur d'un élément keyset. Cet élément est destiné à contenir un ensemble d'éléments key servant à grouper toutes les définitions de raccourcis dans un seul emplacement du fichier. Tout élément key à l'extérieur d'un élément keyset ne sera pas pris en compte.

+ +

Généralement, chaque plate-forme utilise une touche différente pour les raccourcis clavier. Par exemple, Windows utilise la touche Ctrl tandis que Macintosh utilise la touche Command. Il serait peu commode de définir un élément key propre à chaque plate-forme. Heureusement, il y a une solution, le modificateur de touches 'accel' se réfère à la touche de raccourci spécifique à la plate-forme. Il fonctionne exactement comme les autres modificateurs de touches excepté qu'il change selon la plate-forme.

+ +

Voici quelques exemples supplémentaires :

+ +
<keyset>
+   <key id="copy-key" modifiers="control" key="C"/>
+   <key id="explore-key" modifiers="control alt" key="E"/>
+   <key id="paste-key" modifiers="accel" key="V"/>
+</keyset>
+
+ +

Attribut keycode

+ +

L'attribut key est utilisé pour spécifier quelles touches doivent être pressées. Toutefois, il y aura aussi des cas où vous voudrez spécifier des touches qui ne peuvent être décrites par un simple caractère (telle que la touche Enter ou les touches de fonctions). L'attribut key peut seulement être utilisé pour des caractères imprimables. Un autre attribut, keycode peut être utilisé pour les caractères non imprimables.

+ +

La valeur de l'attribut keycode doit être un code spécial qui représente la touche souhaitée. Une liste de touches est disponible ci-dessous. Toutes les touches ne sont pas disponibles sur toutes les plate-formes.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
VK_CANCELVK_BACKVK_TABVK_CLEAR
VK_RETURNVK_ENTERVK_SHIFTVK_CONTROL
VK_ALTVK_PAUSEVK_CAPS_LOCKVK_ESCAPE
VK_SPACEVK_PAGE_UPVK_PAGE_DOWNVK_END
VK_HOMEVK_LEFTVK_UPVK_RIGHT
VK_DOWNVK_PRINTSCREENVK_INSERTVK_DELETE
VK_0VK_1VK_2VK_3
VK_4VK_5VK_6VK_7
VK_8VK_9VK_SEMICOLONVK_EQUALS
VK_AVK_BVK_CVK_D
VK_EVK_FVK_GVK_H
VK_IVK_JVK_KVK_L
VK_MVK_NVK_OVK_P
VK_QVK_RVK_SVK_T
VK_UVK_VVK_WVK_X
VK_YVK_ZVK_NUMPAD0VK_NUMPAD1
VK_NUMPAD2VK_NUMPAD3VK_NUMPAD4VK_NUMPAD5
VK_NUMPAD6VK_NUMPAD7VK_NUMPAD8VK_NUMPAD9
VK_MULTIPLYVK_ADDVK_SEPARATORVK_SUBTRACT
VK_DECIMALVK_DIVIDEVK_F1VK_F2
VK_F3VK_F4VK_F5VK_F6
VK_F7VK_F8VK_F9VK_F10
VK_F11VK_F12VK_F13VK_F14
VK_F15VK_F16VK_F17VK_F18
VK_F19VK_F20VK_F21VK_F22
VK_F23VK_F24VK_NUM_LOCKVK_SCROLL_LOCK
VK_COMMAVK_PERIODVK_SLASHVK_BACK_QUOTE
VK_OPEN_BRACKETVK_BACK_SLASHVK_CLOSE_BRACKETVK_QUOTE
VK_HELP   
+ +

Par exemple, pour créer un raccourci qui est activé quand l'utilisateur presse les touches Alt et F5, faites ainsi :

+ +
<keyset>
+   <key id="test-key" modifiers="alt" keycode="VK_F5"/>
+</keyset>
+
+ +

L'exemple ci-dessous montre quelques raccourcis clavier supplémentaires :

+ +
<keyset>
+   <key id="copy-key" modifiers="accel" key="C"/>
+   <key id="find-key" keycode="VK_F3"/>
+   <key id="switch-key" modifiers="control alt" key="1"/>
+</keyset>
+
+ +

Le premier raccourci est déclenché lorsque l'utilisateur presse la touche de raccourci spécifique à sa plate-forme et C. Le deuxième est invoqué quand l'utilisateur presse F3. Le troisième se déclenche sur une pression des touches Ctrl, Alt et 1. Si vous voulez distinguer les touches de la partie centrale du clavier et les touches du pavé numérique, utilisez les touches VK_NUMPAD (telles que 'VK_NUMPAD1').

+ +
Consultez la page anglaise Mozilla Keyboard Planning FAQ and Cross Reference pour de plus amples informations sur les raccourcis clavier dans les applications.
+ +

Utilisation des raccourcis clavier

+ +

Maintenant que nous savons comment définir les raccourcis clavier, nous allons découvrir comment les utiliser. Il y a deux manières. La première est la plus simple et requiert seulement que vous utilisiez le gestionnaire d'événements clavier sur l'élément key. Quand l'utilisateur presse la (ou les) touche(s), le script est invoqué. Voici un exemple :

+ +
<keyset>
+   <key id="copy-key" modifiers="accel" key="C" oncommand="DoCopy();"/>
+</keyset>
+
+ +

La fonction DoCopy sera appelée quand l'utilisateur pressera les touches spécifiées par l'élément key qui sont, dans cet exemple, les touches pour copier vers le presse-papiers (telles que Ctrl+C). Ceci fonctionnera tant que la fenêtre sera ouverte. La fonction DoCopy devrait vérifier si du texte est sélectionné et le copier dans le presse-papiers si tel est le cas. Notez que les champs de saisie intègrent déjà des raccourcis pour utiliser le presse-papiers, de sorte que vous n'avez pas besoin de les implémenter vous-même.

+ +

Assignation d'un raccourci clavier à un menu

+ +

Si vous assignez un raccourci clavier à une commande qui existe déjà dans un menu, vous pouvez associer directement l'élément key avec la commande du menu. Pour cela, ajoutez un attribut key à l'élément menuitem. Donnez lui comme valeur l'id du raccourci que vous voulez lui associer. L'exemple ci-dessous explique cette méthode.

+ +

Exemple 2: Source Voir

+ +
Image:xultu_keyshort1.jpg
+ +
<keyset>
+  <key id="paste-key" modifiers="accel" key="V"
+          oncommand="alert('invoque Coller')"/>
+</keyset>
+
+<menubar id="sample-menubar">
+  <menu id="edit-menu" label="Editer" accesskey="e">
+    <menupopup id="edit-popup">
+      <menuitem id="paste-command"
+         accesskey="c" key="paste-key"
+         label="Coller" oncommand="alert('invoque Coller')"/>
+    </menupopup>
+  </menu>
+</menubar>
+
+ +

L'attribut key de l'item du menu, qui est ici 'paste-key', est égal à l'id du raccourci défini. Vous pouvez utilisez cette méthode pour définir des raccourcis supplémentaires à plusieurs items de menu.

+ +

Vous noterez également dans cette image que du texte a été placé à côté de la commande 'Coller' du menu pour indiquer le raccourci Ctrl+V pouvant être pressé pour invoquer la commande du menu. Cette indication est ajoutée automatiquement pour vous sur la base des touches de modification de l'élément key. Les raccourcis associés aux menus fonctionneront même si le menu n'est pas ouvert.

+ +

Une fonctionnalité supplémentaire des définitions de raccourcis est que vous pouvez les désactivez facilement. Il vous suffit d'ajouter un attribut disabled à l'élément key et lui affecter la valeur 'true'. Cet attribut désactive le raccourci clavier de façon à ce qu'il ne puisse pas être invoqué. Il est facile de modifier l'attribut disabled par le biais d'un script.

+ +
+

Notre exemple de recherche de fichiers

+ +

Ajoutons des raccourcis clavier à la boîte de dialogue de recherche de fichiers. Nous en ajouterons quatre, un pour chacune des commandes Couper, Copier et Coller, et aussi un pour la commande Fermer quand l'utilisateur presse Esc

+ +

Source Voir

+ +
<keyset>   <key id="cut_cmd" modifiers="accel" key="X"/>   <key id="copy_cmd" modifiers="accel" key="C"/>   <key id="paste_cmd" modifiers="accel" key="V"/>   <key id="close_cmd" keycode="VK_ESCAPE" oncommand="window.close();"/> </keyset>
+
+<vbox flex="1">
+ <toolbox>
+  <menubar id="findfiles-menubar">
+   <menu id="file-menu" label="Fichier" accesskey="f">
+     <menupopup id="file-popup">
+       <menuitem label="Ouvrir une recherche..." accesskey="o"/>
+       <menuitem label="Sauver une recherche..." accesskey="s"/>
+       <menuseparator/>
+       <menuitem label="Fermer" accesskey="c" key="close_cmd"
+         oncommand="window.close();"/>
+     </menupopup>
+   </menu>
+   <menu id="edit-menu" label="Editer" accesskey="e">
+     <menupopup id="edit-popup">
+       <menuitem label="Couper" accesskey="e" key="cut_cmd"/>
+       <menuitem label="Copier" accesskey="p" key="copy_cmd"/>
+       <menuitem label="Coller" accesskey="l" key="paste_cmd" disabled="true"/>
+     </menupopup>
+   </menu>
+
+Maintenant nous pouvons utiliser ces raccourcis pour activer les commandes. Évidemment les commandes du presse-papiers restent inactives puisque nous n'avons pas encore écrit leurs scripts.
+ +

Événements Clavier

+ +

Il y a trois types d'événements clavier qui peuvent être utilisés si les dispositifs principaux décrits ci-dessus ne sont pas appropriés.

+ +
+
keypress 
+
Appelé quand une touche est pressée puis relachée avec l'élement qui a le focus (élément actif). Vous pouvez l'utiliser pour controller les caractères saisis dans un champ.
+
keydown 
+
Appelé quand une touche est pressée avec l'élément qui a le focus (élément actif). Remarquez que l'évènement sera appelé aussitôt la touche enfoncée, même si elle n'a pas été encore relachée.
+
keyup 
+
Appelé quand une touche est relachée avec l'élément qui a le focus (élément actif).
+
+ +

Les évènements clavier sont envoyés seulement à l'élément qui a le focus. Typiquement, ils incluent les champs de saisie, les boutons, les cases à cocher, et d'autres encore. Si aucun des éléments n'est actif, l'événement sera dirigé vers le document XUL lui-même. Dans ce cas, vous pouvez associer un scrutateur d'événements à la balise window. Cependant, si vous voulez réagir aux événements de manière globale, vous devriez utiliser un raccourci clavier comme décrit plus haut.

+ +

L'objet event a deux propriétés qui contiennent la touche pressée. La propriété keyCode contient le code de la touche qui peut être comparé à une des constantes de la table des codes de touche vue plus tôt dans cette section. La propriété charCode est utilisée pour les caractères imprimables et contient le caractère de la touche pressée.

+ +
+

Dans la prochaine section, nous allons découvrir comment gérer le focus et la sélection.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/r\303\250gles_avan\303\247\303\251es/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/r\303\250gles_avan\303\247\303\251es/index.html" new file mode 100644 index 0000000000..8916f1e816 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/r\303\250gles_avan\303\247\303\251es/index.html" @@ -0,0 +1,213 @@ +--- +title: Règles avançées +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Règles_avançées +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Advanced_Rules +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Cette section décrit la syntaxe des règles les plus complexes.

+ +

La syntaxe des règles complètes

+ +

La syntaxe des règles décrites jusqu'ici est utile pour certaines sources de données, mais parfois les données doivent être affichées de manière plus sophistiquée. La syntaxe de règle simple n'est en fait qu'un raccourci pour la syntaxe de règle complète qui est décrite ci-dessous. Comme pour la syntaxe de règle simple, la règle complète est placée entre des balises rule.

+ +

Une syntaxe de règle complète contient trois balises filles : une balise conditions , une balise bindings et une balise action. La balise bindings n'est pas toujours nécessaire.

+ +

L'élément conditions spécifie le critère qui doit correspondre à une ressource donnée. Vous pouvez spécifier plusieurs conditions qui doivent toutes correspondre à la ressource donnée. En utilisant la syntaxe de règle simple, les conditions sont directement placées dans l'élément rule.

+ +

Si les conditions correspondent à une ressource donnée, le contenu placé entre les balises action est généré. Dans la syntaxe de règle simple, le contenu est directement placé dans la balise rule.

+ +

Conditions d'une règle

+ +

Lorsque qu'un arbre, un menu ou tout autre élément avec une source de données génère son contenu, le générateur de modèle cherche en premier lieu la ressource marquée par l'attribut ref. L'opération est ensuite répétée pour l'ensemble des ressources filles. Le générateur compare chaque ressource aux conditions. Si celles-ci sont vérifiées, le contenu de l'élément action est généré pour ces ressources. Si elles ne sont pas vérifiées, rien n'est généré.

+ +

Élément content

+ +

L'élément conditions contient trois sous-éléments. Le premier est l'élément content qui ne doit être présent qu'une seule fois. Il sert de marqueur lorsque le générateur de modèle parcourt les ressources. Il indique le nom de la variable dans laquelle est placée une référence à la ressource racine pendant que les conditions sont analysées. La ressource racine est indiquée par l'attribut ref dans l'élément contenant le modèle.

+ +

La syntaxe d'un élément content est la suivante :

+ +
<content uri="?var"/>
+ +

La point d'interrogation indique que le texte qui suit est une variable. Vous pouvez alors utiliser la variable var dans le reste des conditions. Bien entendu, vous pouvez nommer la variable comme vous le voulez.

+ +

Élément member

+ +

L'élément suivant est l'élément member qui est utilisé pour parcourir un ensemble de ressources filles. En termes RDF, il est comparable à Seq, Bag ou Alt. Imaginons que vous ayez une liste de villes, comme dans l'extrait RDF/XML suivant :

+ +
<RDF:Seq about="http://www.xulplanet.com/rdf/weather/cities">
+  <RDF:li resource="http://www.xulplanet.com/rdf/weather/city/Paris"/>
+  <RDF:li resource="http://www.xulplanet.com/rdf/weather/city/Manchester"/>
+  <RDF:li resource="http://www.xulplanet.com/rdf/weather/city/Melbourne"/>
+  <RDF:li resource="http://www.xulplanet.com/rdf/weather/city/Kiev"/>
+</RDF:Seq>
+
+<RDF:Description about="http://www.xulplanet.com/rdf/weather/city/Paris">
+  <cityset:name>Paris</cityset:name>
+</RDF:Description>
+
+.
+.
+.
+
+ +

Vous voulez afficher une ligne dans une arborescence pour chaque ville. Pour accomplir cela, utilisez l'élément member comme ceci :

+ +
<tree id="citiesTree" datasources="weather.rdf"
+      ref="http://www.xulplanet.com/rdf/weather/cities">
+  <template>
+    <rule>
+      <conditions>
+        <content uri="?list"/>
+        <member container="?list" child="?city"/>
+      </conditions>
+    <rule>
+  <template>
+</tree>
+
+ +

Le générateur de modèle commence par récupérer la valeur de l'attribut ref qui dans ce cas est 'http://www.xulplanet.com/rdf/weather/cities'. Cette ressource va être mise dans la variable list comme il est indiqué par la balise content. Vous obtiendrez les ressources associées à la ressource racine en utilisant la variable list.

+ +

Le générateur de modèle s'intéresse ensuite à l'élément member. Le générateur est contraint de parcourir les fils d'un élément. Le parent est indiqué par l'attribut container et les fils par l'attribut child. Dans l'exemple ci-dessus, la valeur de l'attribut container est la variable list. Ainsi le parent sera la valeur de la variable list qui a la valeur de la ressource racine 'http://www.xulplanet.com/rdf/weather/cities'. L'effet induit va être de parcourir la liste de tous les fils de 'http://www.xulplanet.com/rdf/weather/cities'.

+ +

Si vous regardez en détail le RDF ci-dessus, la ressource 'http://www.xulplanet.com/rdf/weather/cities' a quatre filles, une pour chaque ville. Le générateur de modèle parcourt chacune d'elle, comparant la fille avec la valeur de l'attribut child. Dans le cas présent, celui-ci contient la valeur 'city'. Donc le générateur va donner à la variable city la valeur des ressources filles au fur et à mesure.

+ +

Comme il n'y a pas d'autres conditions, la condition correspond à chacune des quatre ressources et le générateur va créer du contenu pour chacune d'entre elles. Bien sûr, l'exemple ci-dessus n'a aucun contenu. On l'ajoutera par la suite.

+ +

Élément triple

+ +

L'élément suivant est l'élément triple. Il est utilisé pour vérifier l'existence d'un triplet (ou assertion) dans la source de données du RDF. Un triplet est comme la propriété d'une ressource. Par exemple, un triplet existe entre un marque-page et son URL associée. Il peut-être exprimé ainsi :

+ +
Un marque-page vers mozilla.org -> URL -> www.mozilla.org
+ +

Cela signifie qu'il existe un triplet entre le marque-page 'Un marque-page vers mozilla.org' et 'www.mozilla.org' par la propriété URL. La première partie est appelée le sujet, la seconde, le prédicat, et la dernière, l'objet. Exprimé avec l'élément triple, ce mécanisme est décrit comme ceci :

+ +
<triple subject="A Bookmark to mozilla.org"
+           predicate="URL"
+           object="www.mozilla.org"/>
+
+ +

Ce code a été simplifié par rapport au code réel. Le prédicat devrait normalement inclure les espaces de nommage, et le sujet devrait être l'identifiant ressource du marque-page, et non pas le titre du marque-page comme ici. En fait, le titre du marque-page devrait être un autre triplet dans la source de données, qui utiliserait le prédicat 'nom'.

+ +

Vous pouvez remplacer le sujet et l'objet dans l'élément triple par des références aux variables, auquel cas les valeurs seront substituées aux variables. Si aucune valeur n'est définie pour une variable, le générateur de modèle va attribuer à la variable la valeur de la source de données.

+ +

Disons, par exemple, que l'on veuille ajouter une prédiction météo à la source de données des villes. Les conditions suivantes peuvent être utilisées :

+ +
<conditions>
+  <content uri="?list"/>
+  <member container="?list" child="?city"/>
+  <triple subject="?city"
+             predicate="http://www.xulplanet.com/rdf/weather#prediction"
+             object="?pred"/>
+</conditions>
+
+ +

Le générateur de modèle va parcourir chaque ville comme précédemment. Lorsqu'il arrivera au triplet, il va s'intéresser aux assertions de la source de données RDF pour une prédiction météo. La prédiction météo est attribuée à la variable 'pred'. Le générateur va répéter cette opération pour chacune des quatre villes. Une comparaison a lieu et le générateur va créer du contenu pour chaque ville qui a une prédiction météo associée. Si la ville n'a pas de ressource de prédiction, la condition ne correspond pas et aucun contenu ne sera créé pour cette ville. Remarquez que vous n'avez pas besoin de mettre 'rdf:' au début du prédicat, car il est sous-entendu.

+ +

On peut aussi remplacer l'attribut object par une valeur statique. par exemple :

+ +
<conditions>
+  <content uri="?city"/>
+  <triple subject="?city"
+             predicate="http://www.xulplanet.com/rdf/weather#prediction"
+             object="Nuageux"/>
+</conditions>
+
+ +

Cet exemple est similaire mais nous spécifions que nous voulons une comparaison qui s'effectue sur « 'Nuageux' ». Le résultat obtenu est que la condition ne sera remplie que pour les villes dont la prédiction météo est « 'Nuageux' ».

+ +

Nous pouvons ajouter davantage de triplets pour réaliser d'autres comparaisons. Par exemple, dans l'exemple ci-dessus, la température et la vitesse du vent peuvent être testées. Pour cela, il suffit d'ajouter un autre triplet qui vérifiera les ressources supplémentaires. La condition sera remplie si et seulement si l'intégralité des triplets retournent des valeurs.

+ +

L'exemple ci-dessous va vérifier un triplet supplémentaire appliqué au nom de la ville. Il lui sera attribué une variable name. La condition va correspondre si la ville possède à la fois un nom et une prédiction météo.

+ +
<conditions>
+  <content uri="?list"/>
+  <member container="?list" child="?city"/>
+  <triple subject="?city"
+             predicate="http://www.xulplanet.com/rdf/weather#name"
+             object="?name"/>
+  <triple subject="?city"
+             predicate="http://www.xulplanet.com/rdf/weather#prediction"
+             object="?pred"/>
+</conditions>
+
+ +

Générer du contenu

+ +

Le contenu à générer pour une règle est spécifié dans l'élément action. Il peut être le contenu des lignes d'un arbre, des items de menu ou tout ce que vous souhaitez générer. À l'intérieur du contenu, vous pouvez vous référer aux variables qui ont été définies dans les conditions. Ainsi, dans l'exemple météo ci-dessus, vous pouvez utiliser les variables name ou pred pour afficher la ville ou la prédiction météo. Vous pouvez aussi utiliser les variables list ou city, mais elles contiennent des ressources et non du texte, donc elles n'auront pas de sens pour les utilisateurs.

+ +

Dans la syntaxe de règle simple, la syntaxe uri="rdf:*" est utilisée pour indiquer où le contenu doit être généré. Dans la syntaxe de règles complètes, vous appliquez la valeur de l'attribut uri à une variable que l'on a utilisée dans la partie des conditions. Normalement, ce sera la variable assignée à l'attribut child de l'élément member.

+ +

Exemple complet d'arbre

+ +

L'exemple suivant montre un arbre complet avec des conditions et une action. Vous pouvez consulter le fichier RDF séparément (Source RDF).

+ +

Exemple 1 : Source Voir

+ +
<tree id="weatherTree" flex="1" datasources="weather.rdf"
+      ref="http://www.xulplanet.com/rdf/weather/cities">
+  <treecols>
+    <treecol id="city" label="Ville" primary="true" flex="1"/>
+    <treecol id="pred" label="Prédiction Météo" flex="1"/>
+  </treecols>
+
+  <template>
+    <rule>
+      <conditions>
+        <content uri="?list"/>
+        <member container="?list" child="?city"/>
+        <triple subject="?city"
+                predicate="http://www.xulplanet.com/rdf/weather#name"
+                object="?name"/>
+        <triple subject="?city"
+                predicate="http://www.xulplanet.com/rdf/weather#prediction"
+                object="?pred"/>
+      </conditions>
+      <action>
+        <treechildren>
+          <treeitem uri="?city">
+            <treerow>
+              <treecell label="?name"/>
+              <treecell label="?pred"/>
+            </treerow>
+          </treeitem>
+        </treechildren>
+      </action>
+    </rule>
+  </template>
+</tree>
+
+ +

Deux colonnes apparaissent dans cet arbre, l'une qui affiche la valeur de 'name' pour chacun ligne, et l'autre qui affiche le résultat de la prédiction météo.

+ +
Si vous utilisez le marqueur 'dont-build-content' (ne-pas-générer-de-contenu) sur un arbre, remplacez l'élément content par un élément treeitem
+ +

Ajouter des liaisons supplémentaires

+ +

Le dernier élément que vous pouvez ajouter à l'intérieur d'une règle est l'élément bindings. À l'intérieur de celui-ci, vous pouvez mettre un ou plusieurs éléments binding. Une liaison dans une règle a la même syntaxe qu'un triplet et remplit quasiment la même fonction. Par exemple, dans l'exemple météo précédent, on peut ajouter la liaison suivante :

+ +
<bindings>
+  <binding subject="?city"
+             predicate="http://www.xulplanet.com/rdf/weather#temperature"
+             object="?temp"/>
+</bindings>
+
+ +

La liaison va prendre la ressource "température" de chaque ville et l'attribuer à la variable temp. C'est tout à fait similaire à ce qu'un triplet accomplit. La différence réside dans le fait que la liaison créée par le binding n'est pas prise en compte dans la vérification des conditions. Ainsi, pour qu'une ville soit affichée, il est impératif qu'elle ait un nom et une prédiction météo, mais peu importe qu'elle ait ou non une température. Si toutefois elle en possède une, la valeur sera attribuée à la variable temp et pourra être utilisée dans une action. Si une ville n'a pas de température, la variable temp sera une chaîne de caractère vide.

+ +
+

Par la suite, nous verrons comment sauvegarder les états des éléments XUL.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/sources_de_donn\303\251es_rdf/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/sources_de_donn\303\251es_rdf/index.html" new file mode 100644 index 0000000000..27240972a3 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/sources_de_donn\303\251es_rdf/index.html" @@ -0,0 +1,296 @@ +--- +title: Sources de données RDF +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Sources_de_données_RDF +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/RDF_Datasources +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Nous nous intéresserons ici aux sources de données additionnelles, ainsi qu'à la manière d'utiliser vos propres fichiers RDF comme sources de données.

+ +

Autres sources de données pour Mozilla

+ +

Mozilla fournit nativement plusieurs sources de données. Certaines sont indiquées ici, avec quelques exemples. Leur fonctionnement est très similaire à celui des marque-pages, bien que les champs soient différents à chaque fois.

+ +
Ndt : Les ressources RDF fournies par mozilla ne sont utilisables que par les applications qui sont enregistrées dans le chrome. Vous ne verrez donc pas les données dans certains des exemples proposés.
+ +

La liste d'historique de navigation

+ +

Cette source de données fournit l'accès à la liste d'historique de l'utilisateur, qui est une liste d'URLs que l'utilisateur a consulté récemment. On peut se référer à cette ressource en utilisant rdf:history comme source de données. La table ci-dessous montre les ressources (ou champs) que vous pouvez récupérer depuis la source de donnée "history". Utilisez les URLs ci-dessous là où vous souhaitez que la valeur de la ressource soit utilisée.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Daterdf:http://home.netscape.com/NC-rdf#DateDate de la dernière visite
Namerdf:http://home.netscape.com/NC-rdf#NameTitre de la page
Pagerdf:http://home.netscape.com/NC-rdf#PageNom de la page
Referrerrdf:http://home.netscape.com/NC-rdf#ReferrerPage d'origine (referrer)
URLrdf:http://home.netscape.com/NC-rdf#URLURL de la page
Visit Countrdf:http://home.netscape.com/NC-rdf#VisitCountNombre de visites de la page
+ +

Une liste d'historique typique affichera un arbre doté d'une sélection de ces champs. Pour les utiliser, placez les URL ci-dessus dans l'attribut label des boutons ou des cellules d'un arbre. Vous pouvez utiliser 'NC:HistoryRoot' comme valeur de l'attribut ref. Vous pouvez également utiliser la valeur 'NC:HistoryByDate' pour obtenir la liste d'historique triée par jour.

+ +

Exemple d'utilisation de la liste historique

+ +

Voyons un exemple d'affichage de la liste d'historique. Nous afficherons l'historique dans un arbre avec les trois colonnes Nom, URL et Date.

+ +

Exemple 1: Source Voir

+ +
<tree flex="1" datasources="rdf:history" ref="NC:HistoryRoot">
+
+  <treecols>
+    <treecol id="name" label="Nom" flex="1"/>
+    <treecol id="url" label="URL" flex="1"/>
+    <treecol id="date" label="Date" flex="1"/>
+  </treecols>
+
+  <template>
+
+    <rule>
+      <treechildren>
+       <treeitem uri="rdf:*">
+         <treerow>
+           <treecell label="rdf:http://home.netscape.com/NC-rdf#Name"/>
+           <treecell label="rdf:http://home.netscape.com/NC-rdf#URL"/>
+           <treecell label="rdf:http://home.netscape.com/NC-rdf#Date"/>
+         </treerow>
+       </treeitem>
+      </treechildren>
+    </rule>
+
+  </template>
+</tree>
+
+ +

Autres sources de données

+ +

Les tableaux ci-dessous listent quelques-unes des autres sources de données disponibles avec Mozilla. Vous pouvez les utiliser comme vous voulez.

+ +

Marque-pages ('rdf:bookmarks') :

+ +

Les marque-pages sont générés depuis la liste de marque-pages de l'utilisateur.

+ +


+ Ressources

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Date d'ajoutrdf:http://home.netscape.com/NC-rdf#BookmarkAddDateDate à laquelle le marque-page a été ajouté
Descriptionrdf:http://home.netscape.com/NC-rdf#DescriptionDescription du marque-page
Dernière modificationrdf:http://home.netscape.com/WEB-rdf#LastModifiedDateDate de la dernière modification
Dernière visiterdf:http://home.netscape.com/WEB-rdf#LastVisitDateDate de la dernière visite
Nomrdf:http://home.netscape.com/NC-rdf#NameNom du marque-page
Raccourci URLrdf:http://home.netscape.com/NC-rdf#ShortcutURLChamp de mots-clés personnalisés
URLrdf:http://home.netscape.com/NC-rdf#URLL'URL vers laquelle pointe le lien
+ +

Racines possibles pour les marque-pages

+ +
+
'NC
+
BookmarksRoot' : La racine de la hiérarchie des marque-pages
+
+ +

 

+ +
+
'NC
+
IEFavoritesRoot' : Le dossier de marque-pages correspondant aux « Favoris IE » de l'utilisateur
+
+ +

 

+ +
+
'NC
+
PersonalToolbarFolder' : Le dossier de marque-pages correspondant au dossier de la barre d'outils personnelle
+
+ +

Fichiers('rdf:files') :

+ +

Une vue des fichiers de l'utilisateur.

+ +

Ressources

+ + + + + + + + + + + + + + +
Nomrdf:http://home.netscape.com/NC-rdf#NameNom du fichier
URLrdf:http://home.netscape.com/NC-rdf#URLURL du fichier
+ +

Racine possible des fichiers

+ +
+
'NC
+
FilesRoot' : Racine du système de fichiers (habituellement une liste de disques)
+
+ +

 

+ +
+
'URL d'un fichier' 
+
En utilisant une URL de fichier pour l'attribut ref, vous pouvez choisir un répertoire/dossier à retourner. Par exemple, vous pouvez utiliser file:///windows ou file:///usr/local
+
+ +

La source de données de fichiers est un exemple de source de données qui ne détermine ses ressources que lorsque cela est nécessaire. Nous ne voulons pas que tous les fichiers du système de fichiers soient évalués avant d'afficher les données. Seuls nous intéressent les fichiers et répertoires que l'arbre (ou tout autre élément) doit afficher à un instant donné.

+ +

Sources de données composites

+ +

Vous pouvez spécifier plusieurs sources de données dans l'attribut datasources en les séparant par des espaces, comme dans l'exemple ci-dessous. Les données seront ainsi lues dans toutes les sources de données mentionnées.

+ +
<tree datasources="rdf:bookmarks rdf:history animals.rdf" ref="NC:BookmarksRoot">
+ +

Cet exemple lit les ressources des marque-pages, de l'historique et d'un fichier nommé 'animals.rdf'. Celles-ci sont combinées en une source de données composite et peuvent être utilisées comme une unique source de données.

+ +

La source de donnée spéciale rdf:null correspond à une source vide. Vous pouvez utiliser cette source de données si vous voulez gérer dynamiquement la source via un script, sans avoir à l'initialiser tout de suite ou parce que vous ne connaissez pas son URL exacte.

+ +

Sources de données RDF personnalisées

+ +

Vous pouvez utiliser chacune des sources de données internes ci-dessus si vous le désirez. Il en existe plusieurs autres, pour le courrier électronique, les carnets d'adresses, les recherches... Cependant, vous pouvez utiliser votre propre source de données RDF, enregistrée dans un fichier RDF. Le fichier peut être local ou distant. Il suffit d'indiquer l'URL du fichier RDF dans l'attribut datasources.

+ +

L'utilisation des fichiers RDF apporte les mêmes fonctionnalités que n'importe quelle source de données interne. Vous pouvez utiliser des règles pour retrouver un type spécifique de contenu. Les attributs de l'élément rule seront respectés s'ils correspondent aux attributs d'un élément RDF Description. Vous pouvez également créer des fichiers RDF hiérarchiques.

+ +

Exemple d'utilisation d'un fichier RDF

+ +

Ce qui suit est un exemple d'utilisation d'un fichier RDF comme source de données. Le fichier RDF est relativement gros et peut être consulté séparément : Source RDF

+ +

Exemple 2 : Source Voir

+ +
<tree flex="1" width="200" height="200"
+      datasources="animals.rdf" ref="http://www.some-fictitious-zoo.com/all-animals">
+
+  <treecols>
+    <treecol id="name" label="Nom" primary="true" flex="1"/>
+    <treecol id="species" label="Espèces" flex="1"/>
+  </treecols>
+
+  <template>
+    <rule>
+      <treechildren>
+       <treeitem uri="rdf:*">
+         <treerow>
+           <treecell label="rdf:http://www.some-fictitious-zoo.com/rdf#name"/>
+           <treecell label="rdf:http://www.some-fictitious-zoo.com/rdf#species"/>
+         </treerow>
+       </treeitem>
+      </treechildren>
+    </rule>
+
+  </template>
+</tree>
+
+ +

Image:xultu_datasrc1.png

+ +

Ici, les données sont générées depuis le fichier RDF. L'attribut ref a été positionné sur l'élément racine de ce fichier, qui est la balise de premier niveau Seq. Nous obtenons une liste complète d'animaux. Si nous avions voulu, nous aurions pu positionner l'attribut ref sur n'importe quelle valeur de l'attribut about afin de limiter la quantité de données retournées. Par exemple, pour afficher seulement les reptiles, nous pouvons utiliser la valeur 'http://www.some-fictitious-zoo.com/reptiles'.

+ +

Exemple de définition de l'attribut ref

+ +

L'exemple ci-dessous montre comment afficher des éléments particuliers d'une source de données RDF en définissant l'attribut ref.

+ +

Exemple 3: Source Voir

+ +
<window
+  id="example-window"
+  title="Mammifères du zoo"
+  xmlns:ANIMALS="http://www.some-fictitious-zoo.com/rdf#"
+  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+<button label="Cliquez ici pour voir les mammifères du zoo" type="menu"
+        datasources="animals.rdf" ref="http://www.some-fictitious-zoo.com/mammals">
+  <template>
+    <rule ANIMALS:specimens="0"></rule>
+    <rule>
+      <menupopup>
+        <menuitem uri="rdf:*" label="rdf:http://www.some-fictitious-zoo.com/rdf#name"/>
+      </menupopup>
+    </rule>
+  </template>
+</button>
+
+</window>
+
+ +

Dans le cas présent, nous voulons seulement la liste des mammifères, nous sélectionnons donc l'URI de la liste des mammifères. Vous remarquerez que la valeur de l'attribut ref de notre exemple est 'http://www.some-fictitious-zoo.com/mammals', ce qui correspond à l'un des éléments Seq du fichier RDF. Seuls les descendants de cette liste seront retournés.

+ +

Nous avons utilisé deux règles ici. La première filtre toutes les ressources dont l'attribut ANIMALS:specimen est positionné à '0'. Vous pouvez voir cet attribut dans le fichier RDF pour chacun des éléments Description. Certains d'entre eux ont une valeur de '0'. Dans ce cas, la première règle s'applique. Puisque cette règle n'a pas de contenu, rien ne sera affiché pour les éléments concernés. Ainsi, nous pouvons cacher les données que nous ne voulons pas afficher.

+ +

La seconde règle s'applique aux autres ressources et crée une rangée dans un menu surgissant. Le résultat final est un menu surgissant contenant tous les mammifères dont le spécimen n'est pas positionné à '0'.

+ +
+

Dans la prochaine section, nous examinerons la syntaxe des règles complètes.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/styler_un_arbre/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/styler_un_arbre/index.html new file mode 100644 index 0000000000..641cb8199e --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/styler_un_arbre/index.html @@ -0,0 +1,79 @@ +--- +title: Styler un arbre +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Styler_un_arbre +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Styling_a_Tree +--- +

 

+
+

« PrécédentSuivant »

+
+

Cette section explique comment styler un arbre.

+

Styler l'arbre

+

Vous pouvez styler la bordure de l'arbre et les en-têtes de colonnes de la même manière que pour d'autres éléments. Les styles ajoutés à l'élément tree seront appliqués à l'arbre entier. L'ajout d'un style à l'élément treecol ne l'applique pas à la colonne mais seulement à son en-tête.

+

Le corps de l'arbre doit être stylé d'une manière un peu différente des autres éléments, parce que le corps de l'arbre est stocké d'une manière différente des autres éléments. Le treechildren extérieur est le seul vrai élément du corps de l'arbre. Les éléments intérieurs n'ont qu'un rôle de conteneurs.

+

Définition de propriétés

+

Vous devez donc utiliser l'attribut properties sur les lignes ou les cellules pour modifier une ou plusieurs propriétés nommées. Cet attribut peut être utilisé avec des arbres à contenu statique, produit par RDF ou avec des arbres à vue personnalisée. Supposons que nous voulions donner une couleur de fond bleue à une ligne particulière, comme il est possible de le remarquer sur les libellés dans la messagerie de Mozilla. Nous allons utiliser une propriété appelée 'makeItBlue'. Vous pouvez utiliser le nom que vous voulez. Vous pouvez modifier plusieurs propriétés en les séparant par des espaces.

+

Modifiez la propriété sur une ligne ou une cellule, comme dans l'exemple suivant :

+
<treerow properties="makeItBlue">
+

Sélecteurs CSS pour l'arbre

+

La feuille de styles peut récupérer cette propriété et l'utiliser pour changer l'apparence d'une ligne pour les messages non lus ou les libellés. Les propriétés fonctionnent en quelque sorte comme les classes de style, bien qu'elles nécessitent une syntaxe un peu plus complexe à utiliser dans une feuille de styles. En effet, il est possible de spécifier un style pour chaque partie d'une cellule. Vous pouvez styler non seulement la cellule et son texte, mais aussi le "twisty" (NdT : petit '+' ou '-' permettant de développer et replier l'arborescence) et l'indentation. La syntaxe à utiliser est la suivante :

+
treechildren::-moz-tree-row(makeItBlue)
+{
+  background-color: blue;
+}
+
+

Ce pseudo-style spécial est utilisé pour styler la couleur de fond des lignes qui ont la propriété 'makeItBlue'. Cette syntaxe spéciale est nécessaire parce que les cellules elles-mêmes ne sont pas des éléments séparés. Tout le contenu intérieur au corps de l'arbre obtient son rendu par l'élément treechildren. Cependant, CSS dispose d'un concept pour accéder aux parties des éléments en les considérant comme des pseudo-éléments. Ce sélecteur correspond à quelques lignes de l'arbre à l'intérieur de l'élément treechildren comme pseudo-élément. Le pseudo-style définit des règles de style pour des parties particulières de ce qu'il affiche. Cette règle de style signifie, dans un élément treechildren : mettre une couleur de fond bleue à toutes les lignes de l'arbre qui ont la propriété 'makeItBlue'.

+

Le texte '::-moz-tree-row' spécifie quelle est la zone de contenu désirée, qui est dans ce cas une ligne. Vous pouvez aussi utiliser les valeurs suivantes :

+
::-moz-tree-cell 
une cellule. Utilisez ceci pour modifier les couleurs des bordures et du fond.
::-moz-tree-cell-text 
le texte d'une cellule. Utilisez ceci pour modifier la police et la couleur du texte.
::-moz-tree-twisty 
l'apparence du "twisty" utilisé pour développer et replier les lignes filles.
::-moz-tree-image 
l'image pour une cellule. Vous pouvez indiquer l'image avec la propriété list-style-image.
::-moz-tree-row 
une ligne. Utilisez ceci pour choisir la couleur de fond d'une ligne.
::-moz-tree-indentation 
l'indentation à gauche des lignes filles.
::-moz-tree-column 
une colonne.
::-moz-tree-line 
les lignes dessinées pour connecter les lignes filles aux lignes parentes.
::-moz-tree-separator 
un séparateur dans un arbre.
::-moz-tree-progressmeter 
contenu pour des cellules à indicateur de progression. Vous pouvez créer une colonne avec des indicateurs de progression en mettant l'attribut type de la colonne à 'progressmeter'.
::-moz-tree-drop-feedback 
le retour du glisser-déposer.
::-moz-tree-checkbox 
l'image à utiliser pour les colonnes de case à cocher.
+
+

Vous pouvez tester la présence de plusieurs propriétés en les séparant par des virgules. L'exemple ci-dessous met une couleur de fond grise aux lignes qui ont les propriétés 'readonly' et 'unread'. Pour les propriétés qui sont 'readonly', il ajoute une bordure rouge autour de la ligne. Notez que la première règle s'appliquera à toute ligne qui est 'readonly', peu importe la présence d'autres propriétés comme 'unread'.

+
treechildren::-moz-tree-row(readonly)
+{
+  border: 1px solid red;
+}
+treechildren::-moz-tree-row(readonly, unread)
+{
+  background-color: rgb(80%, 80%, 80%);
+}
+
+

Propriétés par défaut

+

La liste des propriétés des éléments tree contient un petit nombre de propriétés par défaut que vous pouvez aussi utiliser dans une feuille de styles. Vous pouvez utiliser ces propriétés supplémentaires pour modifier l'apparence des conteneurs ou des lignes sélectionnées. Les propriétés suivantes sont modifiées automatiquement en cas de besoin :

+
focus
cette propriété est mise si l'arbre a le focus.
selected
cette propriété est mise pour les lignes ou les cellules actuellement sélectionnées.
current
cette propriété est mise si le curseur est sur la ligne. Seule une ligne à la fois peut avoir cette propriété.
container
cette propriété est mise pour les lignes ou les cellules qui ont des lignes filles.
leaf
cette propriété est mise pour les lignes ou les cellules qui n'ont pas de lignes filles.
open
cette propriété est mise pour les lignes ou les cellules qui sont développées.
closed
cette propriété est mise pour les lignes ou les cellules qui sont repliées.
primary
cette propriété est mise pour les cellules de la colonne primaire.
sorted
cette propriété est mise pour les cellules de la colonne actuellement triées.
even
cette propriété est mise pour les lignes paires.
odd
cette propriété est mise pour les lignes impaires. Cette propriété ainsi que la propriété even vous permettent, par exemple, d'alterner les couleurs entre chaque ligne.
dragSession
cette propriété est mise si quelque chose est en train d'être déplacé.
dropOn
si un déplacement a lieu au-dessus de l'arbre, cette propriété est mise pour la ligne en train d'être survolée par le déplacement, tant que le pointeur de la souris est au-dessus de la ligne.
dropBefore
cette propriété est mise si le pointeur de la souris survole avant la ligne en cours de déplacement.
dropAfter
cette propriété est mise si le pointeur de la souris survole après la ligne en cours de déplacement.
progressNormal
cette propriété est mise pour les cellules à indicateur de progression.
progressUndetermined
cette propriété est mise pour les cellules à indicateur de progression indéterminé.
progressNone
cette propriété est mise pour les cellules sans indicateur de progression.
+
+

Les propriétés sont mises pour les lignes ou les cellules d'une ligne à l'état correspondant. Pour les colonnes et les cellules, une propriété additionnelle, l'id de la colonne ou la colonne dans laquelle est la cellule, sera mise.

+

Définition des propriétés pour les arbres générés par RDF

+

Pour les arbres générés par RDF, vous pouvez utiliser la même syntaxe. Cependant, vous affecterez souvent les propriétés en vous basant sur des valeurs de la source de données.

+

Définition des propriétés pour les vues personnalisées

+

Pour des arbres avec un script de vue personnalisée, vous pouvez modifier des propriétés en fournissant les fonctions getRowProperties(), getColumnProperties() et getCellProperties() dans la vue. Elles renvoient des informations à propos d'une ligne, d'une colonne et d'une cellule individuelle. Les arguments à ces fonctions indiquent quelle ligne et/ou colonne. Le dernier argument de chacune de ces fonctions est une liste de propriétés que la vue est supposée remplir avec une liste de propriétés. La fonction getColumnProperties() fournit aussi l'élément treecol correspondant pour la colonne.

+
getRowProperties : function(row,prop){}
+getColumnProperties : function(column,columnElement,prop){}
+getCellProperties : function(row,column,prop){}
+
+

Regardons un exemple de modification d'une cellule spécifique. Rendons le texte bleu une ligne sur quatre, en utilisant l'exemple d'une section précédente. Nous allons avoir besoin d'ajouter du code à la fonction getCellProperties() pour ajouter une propriété 'makeItBlue' aux cellules toutes les quatres lignes (Nous n'utilisons pas getRowProperties() puisque la couleur du texte ne sera pas héritée dans chaque cellule).

+

L'objet properties qui est passé en dernier argument de getCellProperties() est un objet XPCOM qui implémente nslSupportsArray. Il s'agit en fait une version XPCOM d'un tableau. Il contient une fonction AppendElement() qui peut être utilisée pour ajouter un élément au tableau. Nous pouvons utiliser l'interface nslAtomService pour construire des atomes de chaînes pour les propriétés.

+
getCellProperties: function(row,col,props){
+  if ((row %4) == 0){
+    var aserv=Components.classes["@mozilla.org/atom-service;1"].
+              getService(Components.interfaces.nsIAtomService);
+    props.AppendElement(aserv.getAtom("makeItBlue"));
+  }
+}
+
+

Cette fonction sera définie comme partie d'un objet de vue. Elle vérifie d'abord quelle ligne est demandée et affecte une propriété pour les cellules toutes les quatres lignes. La liste des propriétés nécessite un tableau d'objets atom qui peuvent être considérés comme des chaînes de caractères constantes. Nous les créons en utilisant l'interface XPCOM nslAtomService et nous les ajoutons au tableau en utilisant la fonction AppendElement(). Ici, nous créons un atome 'makeItBlue'. Vous pouvez appeler AppendElement() à nouveau pour ajouter des propriétés additionnelles.

+

Exemple de feuille de styles

+
treechildren::-moz-tree-row(selected)            { background-color: #FFFFAA; }
+treechildren::-moz-tree-row(odd)                 { background-color: #EEEEEE; }
+treechildren::-moz-tree-row(odd, selected)       { background-color: #FFFFAA; }
+treechildren::-moz-tree-cell-text(selected)      { color: #000000; }
+treechildren::-moz-tree-cell-text(odd, selected) { color: #000000; }
+
+
+

Dans la suite, nous allons voir comment modifier le thème par défaut.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/s\303\251lection_dans_les_arbres/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/s\303\251lection_dans_les_arbres/index.html" new file mode 100644 index 0000000000..6aa59a15d8 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/s\303\251lection_dans_les_arbres/index.html" @@ -0,0 +1,60 @@ +--- +title: Sélection dans les arbres +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Sélection_dans_les_arbres +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Tree_Selection +--- +

 

+
+

« PrécédentSuivant »

+
+

Cette section décrit comment obtenir et modifier les items sélectionnés dans un arbre.

+

Récupérer les items sélectionnés d'un arbre

+

Chaque item dans un arbre (qui correspond à un élément treeitem en utilisant un arbre de contenu) peut être sélectionné individuellement. Si vous ajoutez l'attribut seltype à l'arbre en lui attribuant la valeur 'single' , l'utilisateur ne pourra sélectionner qu'une ligne à la fois. Sinon, l'utilisateur pourra sélectionner plusieurs lignes qui ne seront pas nécessairement contiguës. L'arbre fournit plusieurs fonctions qui peuvent être utilisées pour déterminer si un item est sélectionné.

+

Gestion de l'événement de sélection

+

Voyons d'abord comment nous pouvons déterminer qu'un item est sélectionné. Le gestionnaire d'événement onselect peut être ajouté à l'élément tree. Lorsque l'utilisateur sélectionne un item de l'arbre, le gestionnaire d'événement est appelé. L'utilisateur peut également modifier la sélection en utilisant les touches de déplacement. Si l'utilisateur appuie en continu sur une touche de déplacement afin de se déplacer rapidement dans les items, le gestionnaire d'événement n'est pas appelé jusqu'à ce que l'utilisateur relâche la touche. Ce mode de fonctionnement améliore les performances. Il signifie également que la surbrillance du texte apparaîtra sur plusieurs items même si l'événement de sélection n'est pas déclenché pour ces items.

+

La syntaxe du gestionnaire d'événement onselect est présentée ci-dessous.

+
<tree id="treeset" onselect="alert('Vous avez sélectionné quelque chose !');">
+

Indices d'arbre

+

L'arbre possède une propriété currentIndex (index courant, en commençant à '0' pour la première ligne) qui peut être utilisée pour obtenir l'item sélectionné.

+

Les éléments fils sont inclus dans le comptage juste après leurs parents. Ainsi, s'il y a trois items racines et que chacun a deux items fils, il y aura un total de six objets. Le premier item (d'index '0') sera le premier item racine. L'item suivant, d'index '1', sera son premier fils. Le second fils aura l'index '2', le second item parent sera à la position '3' et ainsi de suite.

+
Image:xultu_seltree1.png
+

Dans l'image ci-contre, il y a huit lignes affichées, dont deux sont sélectionnées. La première ligne sélectionnée a un index de '4' et la seconde, un index de '7'. Les lignes qui ne sont pas affichées ne sont pas incluses dans le comptage d'index.

+

Sélection multiple

+

Pour les arbres qui permettent une sélection multiple, obtenir la liste des lignes sélectionnées est un peu plus compliqué. La vue de l'arbre a une propriété de sélection qui contient l'information sur les lignes sélectionnées. Cette sélection sera un objet TreeSelection. La vue n'a pas besoin d'implémenter cet objet elle-même, car l'arbre aura assigné un objet de sélection à la propriété de sélection de la vue lorsque celle-ci a été attachée à l'arbre. À partir de l'arbre, vous pouvez obtenir la sélection en utilisant la propriété view de l'arbre et ensuite la propriété selection de la vue. Vous pouvez utiliser les méthodes de l'objet de sélection pour récupérer l'ensemble des items sélectionnés ou pour modifier la sélection.

+

Comme les items sélectionnés dans une sélection multiple ne sont pas nécessairement contigus, vous pouvez récupérer chaque bloc de sélection contiguë en utilisant les fonctions getRangeCount() et getRangeAt(). La première fonction retourne le nombre de plages de sélection effectuées. Si seule une valeur a été sélectionnée, la valeur retournée sera '1'. Vous pourrez alors écrire une boucle sur le nombre de plages, en appelant getRangeAt() pour obtenir les bons index du début et de la fin d'une plage.

+

La fonction getRangeAt() comporte trois arguments.

+ +

Exemple getRangeAt

+
var start = new Object();
+var end = new Object();
+var numRanges = tree.view.selection.getRangeCount();
+
+for (var t = 0; t < numRanges; t++){
+  tree.view.selection.getRangeAt(t,start,end);
+  for (var v = start.value; v <= end.value; v++){
+    alert("Item " + v + " sélectionné.");
+  }
+}
+
+

Nous avons créé deux objets appelés start et end. Ensuite, nous lançons une boucle sur les plages de la sélection dont le nombre a été retourné par la fonction getRangeCount(). La fonction getRangeAt() est appelée avec l'index de la plage, et les objets start et end. Cette fonction renseignera les index start et end en leur attribuant la propriété 'value'. Donc, si la première plage commence au troisième item et se termine au septième, start.value vaudra '2' (souvenez-vous que les index commencent à 0, donc nous en décrémentons de un) et end.value vaudra '6'. Un message d'alerte est affichée pour chaque index.

+

Si vous souhaitez seulement savoir si une ligne précise a été sélectionnée, vous pouvez utiliser la fonction isSelected(). Elle prend l'index de la ligne en argument et retourne 'true' si la ligne est sélectionnée.

+
alert(tree.view.selection.isSelected(3));
+

Modifier la sélection dans un arbre

+

L'objet de sélection dispose de plusieurs fonctions qui peuvent être utilisées pour changer une sélection. La fonction la plus simple est select() qui dé-sélectionne toutes les lignes actuellement sélectionnées et en sélectionne une spécifique. Par exemple, le code suivant sélectionnera la ligne d'index '5' :

+
tree.view.selection.select(5);
+

Notez que vous ne devez pas modifier la propriété currentIndex pour changer la sélection. Vous devez plutôt utiliser la fonction de sélection select() comme indiqué dans l'exemple précédent. Vous pouvez sélectionner toutes les lignes avec la fonction selectAll(). Notez que les lignes imbriquées à l'intérieur de containers qui n'ont pas été ouverts ne seront pas sélectionnées. Naturellement, cette fonction n'est valable que pour des arbres à sélections multiples. Il y a aussi les fonctions clearSelection() pour effacer la sélection et invertSelection() pour inverser la sélection, c'est-à-dire dé-sélectionner toutes les lignes sélectionnées et sélectionner les autres.

+

Pour sélectionner des lignes spécifiques, utiliser la fonction rangedSelect() qui sélectionne toutes les lignes entre deux indices. Voici un exemple de sélection des lignes comprises entre les index '2' et '7'. Notez que les lignes '2' et '7' seront incluses dans la sélection.

+
tree.view.selection.rangedSelect(2,7,true);
+

L'argument final indique s'il s'agit d'un ajout à la sélection courante. Si la valeur est 'true', la plage sera ajoutée à la sélection courante. Si la valeur est 'false', toutes les lignes préalablement sélectionnées seront préalablement dé-sélectionnées. Finalement, la fonction clearRange() peut être utilisée pour dé-sélectionner une plage de lignes, les lignes en dehors de cette plage n'étant pas affectées.

+
tree.view.selection.clearRange(2,7);
+
+

Nous allons maintenant apprendre comment créer une vue personnalisée pour un arbre.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/s\303\251parateurs/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/s\303\251parateurs/index.html" new file mode 100644 index 0000000000..cd9b6fda85 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/s\303\251parateurs/index.html" @@ -0,0 +1,80 @@ +--- +title: Séparateurs +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Séparateurs +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Splitters +--- +

 

+
+

« PrécédentSuivant »

+
+

Ici, nous allons voir comment ajouter des séparateurs dans une fenêtre.

+

Découpage d'une boîte

+

Il arrive des fois où vous voulez disposer de deux sections dans une fenêtre que l'utilisateur peut redimensionner à son gré. Un exemple est la fenêtre du navigateur Mozilla, où vous pouvez changer la taille du panneau latéral en déplaçant le trait d'intersection des deux cadres. Vous pouvez aussi cacher ce panneau latéral en cliquant sur la poignée de ce trait.

+

Élément splitter

+

Cette fonctionnalité est accomplie en utilisant un élément appelé splitter. Il crée une barre étroite entre les deux sections en permettant de redimensionner chaque côté. Vous pouvez placer un séparateur où vous voulez pour vous permettre de redimensionner les éléments situés avant lui et les éléments situés après lui dans une même boîte.

+

Lorsqu'un séparateur est placé à l'intérieur d'une boîte horizontale, il permet un redimensionnement horizontal. Lorsqu'un séparateur est placé à l'intérieur d'une boîte verticale, il permet un redimensionnement vertical.

+

La syntaxe d'un séparateur est la suivante :

+
<splitter
+    id="identifier"
+    state="open"
+    collapse="before"
+    resizebefore="closest"
+    resizeafter="closest">
+
+

Les attributs sont les suivants :

+
id 
L'identifiant unique d'un séparateur.
state 
Indique l'état d'un séparateur. Mettez lui la valeur 'open', valeur par défaut, pour que le panneau redimensionnable soit initialement ouvert ou mettez lui la valeur 'collapsed' pour qu'un des panneaux soit complètement réduit et que l'autre occupe toute la place.
collapse 
Il indique de quel côté le panneau doit se réduire quand la poignée du séparateur est cliquée ou quand le séparateur est initialisée avec un état 'collapsed'. Mettez lui la valeur 'before' pour désigner l'élément avant le séparateur ou la valeur 'after' pour désigner l'élément après le séparateur. Si vous l'initialisez avec la valeur 'none', qui est aussi la valeur par défaut, la poignée du séparateur ne réduira pas les panneaux quand elle est cliquée.
resizebefore 
Lorsqu'un séparateur est déplacé, les éléments sur sa gauche sont redimensionnés. Cet attribut indique quel élément est concerné. Mettez la valeur 'closest' pour que l'élément immédiatement à gauche du séparateur soit redimensionné. Mettez la valeur 'farthest' pour que l'élément le plus éloigné à gauche du séparateur soit redimensionné (le premier élément de la boîte). La valeur par défaut est 'closest'.
resizeafter 
Lorsqu'un séparateur est déplacé, les éléments sur sa droite sont redimensionnés. Cet attribut indique quel élément est concerné. Mettez la valeur 'closest' pour que l'élément immédiatement à droite du séparateur soit redimensionné. Mettez la valeur 'farthest' pour que l'élément le plus éloigné à droite du séparateur soit redimensionné (le dernier élément de la boîte). Cet attribut peut aussi avoir la valeur 'grow', dans ce cas, les éléments à droite du séparateur ne changent pas de taille lorsque le séparateur est déplacé. La valeur par défaut est 'closest'.
+
+

Si vous employez l'attribut collapse, vous devrez aussi ajouter l'élément grippy à l'intérieur de l'élément splitter afin que l'utilisateur puisse utiliser la poignée pour réduire un panneau.

+

Exemple avec splitter

+

Un exemple vous sera utile :

+

Exemple 1: Source Voir

+
<vbox flex="1">
+  <iframe id="content-1" width="60" height="20" src="w1.html"/>
+  <splitter collapse="before" resizeafter="farthest">
+    <grippy/>
+  </splitter>
+  <iframe id="content-2" width="60" height="20" src="w2.html"/>
+  <iframe id="content-3" width="60" height="20" src="w3.html"/>
+  <iframe id="content-4" width="60" height="20" src="w4.html"/>
+</vbox>
+
+
Image:xultu_splitter1.png
+

Ici, quatre cadres iframe ont été créés et un séparateur a été placé entre le premier et le second. L'attribut collapse a été affecté d'une valeur 'before' pour signifier que si la poignée est cliquée, le premier cadre va disparaître, et le séparateur et les cadres restants vont glisser vers la gauche. La poignée du séparateur est centrée sur la barre de séparation.

+

La valeur 'farthest' a été affectée à l'attribut resizeafter du séparateur. Elle signifie que lorsque le séparateur est déplacé, l'élément le plus éloigné après lui changera sa taille. Dans ce cas, il s'agit du quatrième cadre.

+

Aucune valeur n'a été spécifiée pour l'attribut resizebefore qui aura donc sa valeur 'closest' par défaut. Dans ce cas, il n'y a qu'un cadre avant le séparateur, c'est donc le premier cadre qui changera de taille.

+

Les deuxième et troisième cadres ne changeront leur taille que si vous déplacez le séparateur suffisamment loin sur la droite jusqu'à ce que le quatrième cadre ait atteint sa largeur minimale.

+

Les quatre cadres avec le séparateur dans un état réduit :

+

Image:xultu_splitter2.png

+

Une image des quatre cadres avec le séparateur redimensionné vers la droite est montrée ci dessous. Notez que les deux cadres du milieu n'ont pas changé leur dimension. Seuls les premier et quatrième cadres ont changé de dimension. Vous pouvez seulement voir une partie du quatrième cadre. Si vous continuez à déplacer le séparateur vers la droite, les deux autres cadres vont se réduire.

+

Image:xultu_splitter3.png

+

Vous pouvez utiliser des propriétés de style telles que min-width, max-width sur les cadres pour spécifier leurs largeurs minimales ou maximales ou leurs hauteurs dans la boîte. Si vous faites cela, le séparateur va le détecter et ne permettra pas de le déplacer au-delà des tailles minimales ou maximales.

+

Par exemple, si vous spécifiez un minimum de 30 pixels en largeur sur le quatrième cadre, il ne se réduira pas en dessous de cette taille. Les deux autres cadres vont alors se réduire. Si vous mettez une largeur minimale de 50 pixels sur le premier cadre, vous ne pourrez déplacer le séparateur que de 10 pixels vers la gauche (car il démarre à 60 pixels de large). Toutefois, vous pouvez toujours faire disparaître le cadre.

+

Vous pouvez également placer plus d'un séparateur dans une boîte si vous le souhaitez, dans ce cas vous pourrez réduire les différentes parties de son contenu. De façon similaire, il n'y a pas que les cadres qui peuvent êre réduits, n'importe quel élément peut l'être.

+
+

Notre exemple de recherche de fichiers

+

Voyons ce que devient notre exemple de recherche de fichiers avec un séparateur. Une possibilité serait d'inclure les résultats de la recherche dans la boîte de dialogue. Nous ajouterons une zone entre les critères de recherche et les boutons du bas. Un séparateur permettra de réduire ou masquer les résultats de la recherche.

+
</tabbox>
+
+ <iframe src="results.html"/>  <splitter resizeafter="grow"/>
+
+ <hbox>
+
+

Ici, un séparateur et un cadre ont été ajoutés à la boîte de dialogue. Nous n'avons plus besoin de l'élément spacer après la boîte d'onglets, donc nous l'enlèverons. Le contenu du cadre provient d'un fichier appelé 'result.html'. Créez ce fichier et mettez ce que vous souhaitez dedans pour l'instant. Le cadre sera remplacé plus tard par la liste des résultats lorsque vous saurez comment la créer. Pour l'instant, il nous servira à expliquer le séparateur.

+

Le séparateur a été initialisé avec la valeur 'before' sur l'attribut collapse, ce qui signifie que l'élément juste avant le séparateur va se réduire. Ici, il s'agit du cadre. Comme montré sur les images ci-dessous, lorsque la poignée est cliquée, le cadre est masqué et les boutons glissent vers le haut.

+

L'attribut resizeafter a été initialisé avec une valeur 'grow' pour que les éléments situés après le séparateur se déplace vers la bas lorsque celui ci est déplacé vers le bas. Le contenu dans le cadre peut s'agrandir sans restriction. Vous noterez que la fenêtre ne se redimensionne pas automatiquement. Vous remarquerez également que c'est un séparateur horizontal parce qu'il a été placé dans une boîte verticale.

+

Etat normal :

+

Image:xultu_splitter4.png

+

Etat réduit :

+

Image:xultu_splitter5.png

+

Exemple de recherche de fichiers : Source Voir

+
+
+

Dans la section suivante, nous verrons comment créer une barre de défilement.

+
+

« PrécédentSuivant »

+
+

Interwiki

diff --git a/files/fr/archive/mozilla/xul/tutoriel_xul/utilisation_des_spacers/index.html b/files/fr/archive/mozilla/xul/tutoriel_xul/utilisation_des_spacers/index.html new file mode 100644 index 0000000000..cecd0b9291 --- /dev/null +++ b/files/fr/archive/mozilla/xul/tutoriel_xul/utilisation_des_spacers/index.html @@ -0,0 +1,143 @@ +--- +title: Utilisation des spacers +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Utilisation_des_spacers +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Using_Spacers +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Dans cette section, vous trouverez comment ajouter des espacements entre les différents éléments que vous avez créés.

+ +

Ajout de spacers

+ +

Un des problèmes avec le développement des interfaces utilisateur est que chaque utilisateur a son propre affichage. Certains utilisateurs peuvent avoir de grands écrans avec une haute résolution et d'autres de faibles résolutions. De plus, chaque plate-forme peut avoir des spécificités pour l'interface utilisateur. En ajoutant le support multi-langue, un texte dans une langue peut avoir besoin de plus de place que dans une autre.

+ +

Les applications qui doivent être compatibles avec différentes plates-formes ou langages ont souvent des fenêtres créées avec beaucoup de place pour permettre leur exécution. Certaines plates-formes et outils de développement d'interfaces utilisateur proposent des composants qui sont suffisamment intelligents pour se redimensionner et se repositionner eux-mêmes selon les besoins de l'utilisateur (Java utilise des gestionnaires de mise en page par exemple).

+ +

XUL fournit la possibilité aux éléments de se positionner et se redimensionner automatiquement. Comme nous l'avons vu, la fenêtre de "recherche de fichiers" est apparue avec une taille qui correspond aux éléments qui y sont inclus. Chaque fois que nous y ajoutons quelque chose, la fenêtre s'agrandit.

+ +

XUL utilise un système de mise en page appelé le " Box Model ". Nous en parlerons dans la prochaine section mais il vous permet essentiellement de diviser une fenêtre en une série de boîtes contenant vos éléments. Ces boîtes se positionnent et se redimensionnent en fonction des spécifications que vous avez définies. Pour l'instant, sachez simplement que l'élément window est un type de boîte.

+ +

Avant d'entrer plus dans le détail avec les boîtes, nous allons présenter un autre élément XUL qui se montre très utile pour la mise en page, le spacer. Un spacer est très simple et ne requiert qu'un seul attribut qui sera expliqué dans un moment. Le spacer le plus simple ressemble à ceci :

+ +
<spacer flex="1" />
+
+ +

Un spacer est utilisé pour placer des espaces vides dans une fenêtre. Sa principale caractéristique est de pouvoir s'agrandir ou se rétrécir lorsque l'utilisateur redimensionne la fenêtre. Il permet à quelqu'un de placer des boutons à droite ou en bas d'une fenêtre et de vouloir les fixer sur le coté droit ou en bas, quelle que soit la taille de la fenêtre. Comme vous le verrez, vous pouvez utiliser des séries de spacer pour créer quelques effets de mise en page.

+ +

Dans la syntaxe ci-dessus, spacer a un seul attribut appelé flex. Il est utilisé pour définir la " flexibilité " de l'espacement. Dans le cas ci-dessus, le spacer a un flex de '1'. Il en devient un élément d'espacement flexible. Si vous placez un spacer directement dans une fenêtre, il s'adaptera à la taille de la fenêtre lorsque celle-ci est modifiée.

+ +

Nous allons bientôt ajouter un élément spacer dans notre boîte de dialogue "Recherche de Fichiers". Tout d'abord, voilà ce qu'il se passe si la fenêtre est agrandie :

+ +

Source Voir

+ +

Image:xultu_springs1.png

+ +

Si vous changez la taille de la fenêtre, vous pouvez voir que les éléments ont conservé leur position. Aucun d'eux n'a bougé ou s'est redimensionné bien que la fenêtre dispose de plus de place. Regardons maintenant ce qu'il se passe si un élément spacer est ajouté entre la boîte de texte et le bouton 'Rechercher' :

+ +

Source Voir

+ +

Image:xultu_springs2.png

+ +

En ajoutant un spacer et en agrandissant la fenêtre, vous voyez que le spacer s'est agrandi de façon à remplir l'espace libre. Les boutons ont été repoussés.

+ +
+

Notre exemple de recherche de fichier

+ +

Le code pour ajouter un spacer est indiqué juste après. Insérez le juste avant le bouton 'Rechercher' :

+ +
<spacer flex="1"/>
+
+<button id="find-button" label="Rechercher"/>
+
+
+ +

Plus d'informations sur la flexibilité

+ +

XUL place les éléments d'une fenêtre en calculant les largeurs et les hauteurs adéquates des éléments et ajoute ensuite des espacements là où ils sont flexibles. À moins que vous ne spécifiez la largeur et la hauteur d'un élément, la dimension par défaut de cet élément sera déterminée par son contenu. Vous noterez que le bouton 'Annuler' des boîtes de dialogue a toujours adapté sa largeur pour contenir son texte. Si vous créez un bouton avec un très long libellé, la taille par défaut de ce bouton sera assez large pour contenir le libellé en entier. Les autres éléments, tels que la boîte de texte, se sont adaptés de façon adéquate.

+ +

L'attribut flex est utilisé pour spécifier si un élément peut changer sa dimension pour s'ajuster à sa boîte le contenant (dans notre cas, la fenêtre window). Nous avons montré l'application de l'attribut flex sur les spacer, mais il peut s'appliquer à n'importe quel élément. Par exemple, vous pouvez souhaiter avoir plutôt un redimensionnement du bouton 'Rechercher' :

+ +

Source Voir

+ +

Image:xultu_springs3.png

+ +

Comme vous pouvez voir sur l'image, en plaçant un attribut flex sur le bouton 'Rechercher', celui-ci s'agrandit en même temps que la fenêtre. Un spacer n'a rien de spécial. Il peut être considéré comme un bouton invisible. Il fonctionne de la même manière qu'un bouton, excepté qu'il ne se dessine pas à l'écran.

+ +

Vous aurez remarqué quelque chose sur l'image ci-dessus. Il n'y a pas que le bouton 'Rechercher' qui s'agrandit mais un espacement est également apparu entre le texte à gauche et le bouton. Bien entendu, il s'agit du spacer que nous avons placé tout à l'heure. Il s'est redimensionné de lui même également. Si vous regardez suffisamment de près, vous devriez remarquer que ce changement de taille a été partagé en part égale entre le spacer et le bouton. Le spacer a reçu la moitié de l'espace libre et le bouton a reçu l'autre moitié.

+ +

La raison de ce comportement est que le spacer et le bouton ont chacun un attribut flex. Parce qu'ils sont flexibles, le spacer et le bouton se redimensionnent équitablement.

+ +

Comment faire si vous voulez qu'un élément s'agrandisse deux fois plus qu'un autre ? Vous pouvez choisir un nombre plus grand pour la valeur de l'attribut flex. Les valeurs de l'attribut flex sont des ratios. Si un élément a un flex de '1' et un second un flex de '2', le second s'agrandira du du double par rapport au premier. En effet, un flex de '2' signifie que cet élément a une flexibilité de deux fois celle d'un élément de flex de '1'.

+ +

L'attribut flex ne sert pas à définir une taille. Il spécifie au contraire comment se répartissent les espaces vides entre les différents éléments fils d'une boîte. Nous aborderons les boîtes dans le prochain chapitre. Dès lors que les dimensions par défaut des éléments fils d'une boîte sont déterminées, les valeurs de flexibilité sont appliquées pour diviser l'espace restant dans la boîte. Par exemple, si la boîte fait 200 pixels de large, qu'elle contient deux boutons flexibles respectivement de 50 pixels et 90 pixels, il restera un espacement de 60 pixels. Si ces deux boutons ont une valeur de flex de '1', cet espacement sera divisé en deux moitiés égales de 30 pixels affectées à chacun d'eux. Si le second bouton voit sa valeur de flexibilité augmentée à '2', le premier bouton recevra 20 pixels d'espacement supplémentaire et le second en recevra 40 pixels.

+ +

L'attribut flex peut être placé sur n'importe quel élément, toutefois il n'a de sens que si cet élément est directement inclus dans une boîte. Donc, même si vous placez un attribut flex sur un élément HTML, il restera sans effet cet élément est situé dans un élément n'étant pas une boîte.

+ +

Exemples d'utilisation de flex

+ +
Exemple 1:
+  <button label="Chercher" flex="1"/>
+  <button label="Annuler" flex="1"/>
+
+Exemple 2:
+  <button label="Chercher" flex="1"/>
+  <button label="Annuler" flex="10"/>
+
+Exemple 3:
+  <button label="Chercher" flex="2"/>
+  <button label="Remplacer"/>
+  <button label="Annuler" flex="4"/>
+
+Exemple 4:
+  <button label="Chercher" flex="2"/>
+  <button label="Remplacer" flex="2"/>
+  <button label="Annuler" flex="3"/>
+
+Exemple 5:
+  <html:div>
+    <button label="Chercher" flex="2"/>
+    <button label="Remplacer" flex="2"/>
+  </html:div>
+
+Exemple 6:
+  <button label="Chercher" flex="145"/>
+  <button label="Remplacer" flex="145"/>
+
+ +
+
Exemple 1 
+
dans ce cas, la flexibilité est divisée en part égale pour les deux boutons. Leurs tailles changeront en proportion égale.
+
Exemple 2 
+
ici, les deux boutons sont flexibles, mais le bouton Chercher sera dix fois plus petit que le bouton Annuler qui a une valeur flex dix fois plus importante que celle du bouton Chercher. L'espace restant est divisé en une part pour le bouton Chercher et 10 parts pour le bouton Annuler.
+
Exemple 3 
+
seuls deux boutons sont flexibles ici. Le bouton Remplacer ne changera jamais sa taille mais les deux autres le pourront. Le bouton Annuler aura toujours une taille du double du bouton Chercher parce qu'il a une valeur de flex du double.
+
Exemple 4 
+
dans ce cas, les trois boutons sont flexibles. Les boutons Chercher et Remplacer auront exactement la même taille mais le bouton Annuler sera un peu plus large (50% plus large pour être exact).
+
Exemple 5 
+
ici, les deux boutons sont placés dans une balise div. La flexibilité perd toute signification puisque les boutons ne sont pas directement dans une boîte. L'effet serait le même si les attributs flex étaient enlevés.
+
Exemple 6 
+
Comme les valeurs de flex sont identiques, les deux boutons auront la même taille. Cela fonctionne aussi bien que si vous aviez mis une valeur de '1' au lieu de '145'. Il est recommandé de mettre les valeurs les plus basses pour une meilleure lecture.
+
+ +
Notez que d'autres facteurs tels que les libellés des boutons et les tailles minimales des boutons peuvent affecter les dimensions réelles des boutons. Par exemple, un bouton ne peut pas être réduit au delà d'une taille nécessaire pour y placer son libellé.
+ +

Spécifier une valeur de '0' a le même effet que si vous enleviez l'attribut flex en entier. L'élément perd toute flexibilité. Vous verrez parfois des valeurs de flex avec un pourcentage. Il n'y a aucune signification spéciale et le signe pourcentage est traité comme s'il n'existait pas.

+ +

Vous avez dû remarquer que si vous redimensionnez verticalement la boîte de dialogue « Recherche de fichiers », les boutons se redimensionnent également en hauteur pour s'ajuster à la hauteur de la fenêtre. Ceci s'explique par le fait que les boutons ont une valeur de flex verticale implicite donnée par la fenêtre. Dans une prochaine section, nous expliquerons comment changer ce comportement.

+ +
+

Nous allons maintenant apprendre des nouvelles caractéristiques sur les boutons.

+ +
+

« PrécédentSuivant »

+
+ +

Interwiki

diff --git "a/files/fr/archive/mozilla/xul/tutoriel_xul/vues_d'arbre_personnalis\303\251es/index.html" "b/files/fr/archive/mozilla/xul/tutoriel_xul/vues_d'arbre_personnalis\303\251es/index.html" new file mode 100644 index 0000000000..da6a3f7744 --- /dev/null +++ "b/files/fr/archive/mozilla/xul/tutoriel_xul/vues_d'arbre_personnalis\303\251es/index.html" @@ -0,0 +1,143 @@ +--- +title: Vues d'arbre personnalisées +slug: Archive/Mozilla/XUL/Tutoriel_XUL/Vues_d'arbre_personnalisées +tags: + - Tutoriel_XUL + - Tutoriels + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Custom_Tree_Views +--- +

 

+ +
+

« PrécédentSuivant »

+
+ +

Les vues d'arbres permettent d'afficher des données dans une arborescence.

+ +

Création d'une vue personnalisée

+ +

Jusqu'à présent, nous avons utilisé la construction interne d'une vue d'arbre. Dans cette section, nous verrons la création d'une vue personnalisée. Elle devient nécessaire dès lors que la quantité de données devient trop importante ou que celles-ci soient arrangées de manière trop complexe. Par exemple, l'utilisation d'éléments treeitem ne serait plus viable en terme de performance avec plusieurs milliers de lignes. Vous pouvez également utiliser une vue personnalisée pour afficher des données obtenues par calculs. Puisque la vue peut stocker et récupérer de la meilleure manière possible les données en fonction de leur type, l'arbre peut être utilisé même si plusieurs milliers de lignes doivent être affichées.

+ +
Note : les interfaces relatives aux arbres ont changé dans Gecko 1.8. Consultez Modifications de l'API Tree pour plus de détails.
+ +

Pour implémenter une vue personnalisée, vous devez créer un objet qui implémente l'interface nsITreeView. Vous pouvez créer ces objets en javascript, mais vous aurez besoin d'un objet séparé pour chaque arbre. Naturellement, comme la vue d'arbre personnalisée est utilisée, la vue de contenu d'arbre ne le sera pas, donc les éléments treeitem, treerow et treecell n'auront aucun sens car la vue d'arbre obtient ses données ailleurs. Ainsi, vous pouvez simplement laisser l'élément treechildren vide. L'exemple suivant vous le montre :

+ +
<tree id="my-tree" flex="1">
+  <treecols>
+    <treecol id="namecol" label="Nom" flex="1"/>
+    <treecol id="datecol" label="Date" flex="1"/>
+  </treecols>
+  <treechildren/>
+</tree>
+
+ +

Pour assigner les données à afficher dans l'arbre, un objet de vue doit être créé, il sera utilisé pour indiquer la valeur de chaque cellule, le nombre total de lignes plus d'autres informations optionnelles. L'arbre appellera des méthodes de la vue pour obtenir les informations dont il a besoin pour son affichage.

+ +

En général, bien que la vue d'arbre dispose de plus d'une trentaine de fonctions pouvant être implémentées, il vous suffira de ne définir que celles appelées par l'arbre. Les trois méthodes que vous devrez implémenter sont décrites ci-dessous :

+ +
+
rowCount
+
Cette propriété doit se voir assigner le nombre total de lignes dans l'arbre.
+
getCellText( ligne, colonne )
+
Cette méthode doit retourner le texte contenu à la ligne et la colonne spécifiées. Elle sera appelée pour afficher les données de chaque cellule. Les lignes sont spécifiées par des valeurs numériques qui commencent à '0'. Les colonnes sont des objets TreeColumn. Dans les anciennes versions de Mozilla (antérieures à Firefox 1.5 ou Mozilla 1.8), les colonnes sont référencées par les valeurs de l'attribut id de la colonne. Si vous avez besoin d'un attribut id comme pour ces anciennes version, une propriété id peut être utilisée sur TreeColumn.
+
setTree( arbre )
+
Cette méthode est appelée une seule fois pour affecter l'objet arbre à la vue.
+
+ +

Voici un exemple de définition d'un tel objet qui peut avoir le nom que vous souhaitez :

+ +
//Moz 1.8
+var treeView = {
+    rowCount : 10000,
+    getCellText : function(row,column){
+      if (column.id == "namecol") return "Ligne "+row;
+      else return "18 février";
+    },
+    setTree: function(treebox){ this.treebox = treebox; },
+    isContainer: function(row){ return false; },
+    isSeparator: function(row){ return false; },
+    isSorted: function(){ return false; },
+    getLevel: function(row){ return 0; },
+    getImageSrc: function(row,col){ return null; },
+    getRowProperties: function(row,props){},
+    getCellProperties: function(row,col,props){},
+    getColumnProperties: function(colid,col,props){}
+};
+
+ +

Les fonctions de l'exemple ci-dessus que nous n'avons pas décrites n'ont pas besoin d'effectuer une quelconque action, mais elles doivent être définies car l'arbre les appelle pour rassembler des informations supplémentaires.

+ +

Cet exemple peut-être utilisé pour un arbre avec 10000 lignes. Le contenu des cellules de la première colonne sera 'Ligne X' où X sera le numéro de la ligne. Le contenu des cellules de la seconde colonne sera '18 février'. La structure if dans la fonction getCellText() compare la propriété id de l'argument column au texte 'namecol'. Ce texte 'namecol' correspond à l'id du premier élément treecol dans l'exemple précédent. Cet exemple est très simplifié bien sûr - en réalité vous aurez des données bien plus complexes dans chaque cellule.

+ +

L'étape finale est d'associer l'objet de vue avec l'arbre. L'arbre a une propriété view, à laquelle on peut assigner l'objet déclaré ci-dessus. Nous pouvons assigner une valeur à cette propriété à tout moment pour attribuer une vue à l'arbre, ou en changer.

+ +
function setView(){
+    document.getElementById('my-tree').view = treeView;
+}
+
+ +

Le code source suivant présente l'exemple en entier. Un script intégré au fichier XUL a été utilisé ici pour simplifier l'exemple. En temps normal vous mettriez le script dans un fichier de script externe.

+ +

Exemple d'arbre personnalisé

+ +

Exemple 1 : Source Voir

+ +
<?xml version="1.0" encoding="iso-8859-1"?>
+<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+
+<window title="Exemple d'arbre" id="tree-window"
+   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+   onload="setView();">
+
+<script>
+//Moz 1.8
+var treeView = {
+    rowCount : 10000,
+    getCellText : function(row,column){
+      if (column.id == "namecol") return "Ligne "+row;
+      else return "18 février";
+    },
+    setTree: function(treebox){ this.treebox = treebox; },
+    isContainer: function(row){ return false; },
+    isSeparator: function(row){ return false; },
+    isSorted: function(){ return false; },
+    getLevel: function(row){ return 0; },
+    getImageSrc: function(row,col){ return null; },
+    getRowProperties: function(row,props){},
+    getCellProperties: function(row,col,props){},
+    getColumnProperties: function(colid,col,props){}
+};
+
+function setView(){
+    document.getElementById('my-tree').view = treeView;
+}
+</script>
+
+<tree id="my-tree" flex="1">
+  <treecols>
+    <treecol id="namecol" label="Nom" flex="1"/>
+    <treecol id="datecol" label="Date" flex="1"/>
+  </treecols>
+  <treechildren/>
+</tree>
+
+</window>
+
+ +

Image:xultu_treeview1.png

+ +

Sur l'image, vous voyez deux colonnes, chacune obtenant ses données par l'intermédiaire de la fonction getCellText(). La fonction setView() a été appelée par le gestionnaire onload de la fenêtre (window), mais vous pouvez aussi changer la vue plus tard si vous le souhaitez. Vous pouvez la changer à n'importe quel instant.

+ +

Il faut noter que la fonction getCellText() est seulement appelée quand cela est nécessaire pour afficher le contenu. Dans l'exemple de 10000 lignes ci-dessus, getCellText() est seulement appelée pour les cellules qui sont actuellement affichées. Sur cette image, seules sept lignes sont affichées, donc la fonction getCellText() a été appelée 14 fois. Elle sera appelée pour les autres lignes lorsque l'utilisateur les fera défiler. Cette méthode rend l'arbre beaucoup plus efficace.

+ +
Notez que l'objet de vue est aussi disponible pour des arbres prédéfinis dans votre installation. Vous pouvez les utiliser pour récupérer les libellés de leurs cellules et d'autres informations.
+ +

L'interface nsITreeView liste toutes les méthodes et propriétés que vous pouvez implémenter pour la vue d'un arbre.

+ +
+

Dans la prochaine section, nous verrons d'autres fonctionnalités des vues d'arbre.

+ +
+

« PrécédentSuivant »

+
diff --git a/files/fr/archive/mozilla/xul/utilisation_de_nsixulappinfo/index.html b/files/fr/archive/mozilla/xul/utilisation_de_nsixulappinfo/index.html new file mode 100644 index 0000000000..10f33316ad --- /dev/null +++ b/files/fr/archive/mozilla/xul/utilisation_de_nsixulappinfo/index.html @@ -0,0 +1,109 @@ +--- +title: Utilisation de nsIXULAppInfo +slug: Archive/Mozilla/XUL/Utilisation_de_nsIXULAppInfo +tags: + - Extensions +translation_of: Archive/Mozilla/XUL/Using_nsIXULAppInfo +--- +

+À partir de Mozilla/XULRunner 1.8, il existe une nouvelle manière de connaître l'application, sa version et la version de Gecko sur laquelle votre code tourne. +

Cela peut s'avérer utile, par exemple, dans le cas d'extensions prévues pour fonctionner sur plusieurs applications basées sur Mozilla ou différentes versions d'une même application. Ce n'est pas utile pour les scripts sur des pages Web, qui doivent utiliser l'objet navigator. +

+

L'interface nsIXULAppInfo

+

Pour faire la distinction entre différentes applications basées sur Mozilla, utilisez l'interface gelée nsIXULAppInfo. Les sections suivantes proposent quelques exemples d'utilisation de nsIXULAppInfo depuis JavaScript. +

Notez que si Firefox 1.5, Thunderbird 1.5, et les applications basées sur XULRunner 1.8 supportent nsIXULAppInfo, des applications plus anciennes comme Firefox et Thunderbird 1.0 ne le font pas. Vous devrez utiliser du code supplémentaire pour ces anciennes versions. +

+

Obtenir nsIXULAppInfo

+

Pour qu'un composant implémente nsIXULAppInfo, utilisez ce code : +

+
var appInfo = Components.classes["@mozilla.org/xre/app-info;1"]
+                        .getService(Components.interfaces.nsIXULAppInfo);
+
+

(Pour une explication, consultez cet article sur XUL Planet.) +

+

Des informations sur l'application

+

Après avoir obtenu le composant d'information sur l'application, vous pouvez lire ses propriétés pour connaître l'ID de l'application, son nom lisible par un humain, sa version, la plateforme utilisée, etc. Pour une liste complète des propriétés de nsIXULAppInfo, veuillez consulter la description de l'interface nsIXULAppInfo. +

+

ID

+

Vous pouvez connaître l'application sous laquelle vous tournez à l'aide de la propriété nsIXULAppInfo.ID. +

+
const FIREFOX_ID = "{ec8030f7-c20a-464f-9b0e-13a3a9e97384}";
+const THUNDERBIRD_ID = "{3550f703-e582-4d05-9a08-453d09bdfdc6}";
+var appInfo = Components.classes["@mozilla.org/xre/app-info;1"]
+                        .getService(Components.interfaces.nsIXULAppInfo);
+if(appInfo.ID == FIREFOX_ID) {
+  // on est sous Firefox
+} else if(appInfo.ID == THUNDERBIRD_ID) {
+  // on est sous Thunderbird
+} else {
+  // c'est une autre application
+}
+
+

Note : vous auriez également pu utiliser nsIXULAppInfo.name, qui est un nom lisible par un humain pour l'application, comme « Firefox », mais qui sait, peut-être qu'il changera encore de nom ! +

+

Version

+

Dans certains cas, vous aurez besoin de connaître la version de l'application sous laquelle tourne votre code. Par exemple, une des fonctions non gelée que vous utilisez peut avoir changé. +

Note : nsIXULAppInfo fournit des informations concernant l'application et la plateforme, faites attention d'utiliser la bonne, particulièrement dans le cas d'applications basées sur XULRunner. +

Dans de tels cas, vous voudrez probablement vérifier nsIXULAppInfo.version et/ou nsIXULAppInfo.appBuildID. Cette dernière est utile si vous essayez de fonctionner avec des nightlies de développement de l'application, tandis que la premère est plutôt utile si vous prenez uniquement en compte les sorties officielles, et pour faire la distinction entre les compilations de branches particulières ou du tronc. +

Exemple 1 : vérification de la version de Firefox +

+
// en supposant qu'on tourne sous Firefox
+var appInfo = Components.classes["@mozilla.org/xre/app-info;1"]
+                        .getService(Components.interfaces.nsIXULAppInfo);
+var versionChecker = Components.classes["@mozilla.org/xpcom/version-comparator;1"]
+                               .getService(Components.interfaces.nsIVersionComparator);
+if(versionChecker.compare(appInfo.version, "1.5") >= 0) {
+  // il s'agit de Firefox 1.5 ou supérieur
+}
+
+

Exemple 2 : reconnaître les nightlies +

+
var appInfo = Components.classes["@mozilla.org/xre/app-info;1"]
+                        .getService(Components.interfaces.nsIXULAppInfo);
+if(appInfo.appBuildID >= "2005093006") {
+  // la compilation est postérieure ou égale à 2005093006
+}
+
+

Vous ne devriez pas vous baser sur les ID de compilation pour des versions officielles, car l'ID de compilation peut être différent pour des compilations personnalisées ou les version localisées d'une application. +

+

Version de la plateforme

+

nsIXULAppInfo fournit des informations de version à propos de l'application XUL (comme Firefox) et la plateforme (c'est-à-dire Gecko ou XULRunner). Par exemple, dans Firefox 1.5 beta 2 la version de l'application est 1.4.1 et la version de la plateforme est 1.8b5. Faites attention d'utiliser l'information dont vous avez besoin, particulièrement dans le cas d'applications basées sur XULRunner. +

L'obtention des informations de version sur la plateforme s'effectue ainsi : +

+
var appInfo = Components.classes["@mozilla.org/xre/app-info;1"]
+                        .getService(Components.interfaces.nsIXULAppInfo);
+var platformVer = appInfo.platformVersion;
+var platformBuildID = appInfo.platformBuildID;
+
+

<s id="old"> +</s>

<s id="old"> +

Versions plus anciennes

+

Comme indiqué plus haut, les anciennes application basées sur Mozilla 1.7 ne supportent pas nsIXULAppInfo. Vour aurez à écrire du code supplémentaire si vous choisissez de fonctionner avec ces versions. +

Par exemple, Firefox et Thunderbird 1.0 stockaient leur ID dans la préférence app.id (et leur version dans app.version), donc vous pouvez utiliser un code comme celui-ci pour savoir sous quelle application vous tournez : +

+
function getAppID() {
+  var id;
+  if("@mozilla.org/xre/app-info;1" in Components.classes) {
+    // on est sous Mozilla 1.8 ou supérieur
+    id = Components.classes["@mozilla.org/xre/app-info;1"]
+                   .getService(Components.interfaces.nsIXULAppInfo).ID;
+  } else {
+    try {
+      id = Components.classes["@mozilla.org/preferences-service;1"]
+                     .getService(Components.interfaces.nsIPrefBranch)
+                     .getCharPref("app.id");
+    } catch(e) {
+      // très ancienne version
+      dump(e);
+    }
+  }
+  return id;
+}
+alert(getAppID());
+
+

Voir aussi

+ +
+
+</s> diff --git a/files/fr/archive/mozilla/xul/utilisation_de_plusieurs_dtd/index.html b/files/fr/archive/mozilla/xul/utilisation_de_plusieurs_dtd/index.html new file mode 100644 index 0000000000..b8a892ecf0 --- /dev/null +++ b/files/fr/archive/mozilla/xul/utilisation_de_plusieurs_dtd/index.html @@ -0,0 +1,41 @@ +--- +title: Utilisation de plusieurs DTD +slug: Archive/Mozilla/XUL/Utilisation_de_plusieurs_DTD +tags: + - Localisation + - XUL +translation_of: Archive/Mozilla/XUL/Using_multiple_DTDs +--- +

Généralement il n'y a qu'un unique ficher DTD (Document Type Definition) pour la localisation d'un fichier XUL spécifique. Mais il existe des cas où l'utilisation de plusieurs DTD peut être nécessaire, comme par exemple pour la localisation de "widgets" couramment utilisés dans les fichiers XUL, en plus de ceux spécifiques au fichier à localiser.

+ +

DTD unique

+ +

Pour rendre localisables les chaînes de votre fichier XUL, vous devez ajouter une déclaration DTD au début du fichier comme ceci :

+ +
<!DOCTYPE window SYSTEM "chrome://myextension/locale/mainwindow.dtd">
+ +

où window est le nom local de l'élément (racine) du document.

+ +

Par exemple, si vous avez une entité appelée someButton.label définie dans mainwindow.dtd, vous pouvez y accéder comme ceci :

+ +
<button id="somebutton" label="&someButton.label">
+
+ +

DTD multiples

+ +

Si vous voulez utiliser plusieurs DTD pour votre fichier XUL, vous pouvez simplement lister tous les fichiers DTD dans votre déclaration DTD :

+ +
<!DOCTYPE window [
+  <!ENTITY % commonDTD SYSTEM "chrome://myextensions/locale/common.dtd">
+  %commonDTD;
+  <!ENTITY % mainwindowDTD SYSTEM "chrome://myextension/locale/mainwindow.dtd">
+  %mainwindowDTD;
+]>
+ +

Vous pouvez maintenant accéder aux entités déclarées dans les DTD comme indiqué ci-dessus. Supposons que vous avez une entité okButton.label définie dans le fichier common.dtd, alors l'accès aux entités des deux DTD ressemblera à cela :

+ +
<button id="somebutton" label="&someButton.label">
+...
+<button id="okbutton" label="&okButton.label">
+ +

Notez qu'il n'existe rien de comparable aux espaces de noms avec plusieurs DTD. Vous devez vous assurez qu'il n'y a pas de conflit entre les entités définies dans les différents DTD.

diff --git a/files/fr/archive/mozilla/xul/utilisation_du_correcteur_orthographique_dans_xul/index.html b/files/fr/archive/mozilla/xul/utilisation_du_correcteur_orthographique_dans_xul/index.html new file mode 100644 index 0000000000..563925da26 --- /dev/null +++ b/files/fr/archive/mozilla/xul/utilisation_du_correcteur_orthographique_dans_xul/index.html @@ -0,0 +1,36 @@ +--- +title: Utilisation du correcteur orthographique dans XUL +slug: Archive/Mozilla/XUL/Utilisation_du_correcteur_orthographique_dans_XUL +tags: + - Extensions +translation_of: Archive/Mozilla/XUL/Using_spell_checking_in_XUL +--- +

Une nouvelle fonction de correction orthographique est disponible dans Firefox 2. Ce document explique comment utiliser le composant mozISpellCheckingEngine pour permettre à vos extensions Firefox d'en bénéficier.

Consultez Contrôle du correcteur d'orthographe dans les formulaires HTML pour des détails sur l'activation du correcteur orthographique dans les formulaires HTML de vos sites Web. +

+

Vérification de l'orthographe d'un mot

+

Pour vérifier l'orthographe d'un mot, vous devez d'abord créer une interface vers le composant mozISpellCheckingEngine en utilisant @mozilla.org/spellchecker/myspell;1 comme ID de contrat, et appeler ensuite la méthode check() avec la chaine à vérifier. Cette méthode renvoie true si le mot est correctement orthographié, ou false dans le cas contraire. +

+
gSpellCheckEngine = Components.classes["@mozilla.org/spellchecker/myspell;1"]
+                    .getService(Components.interfaces.mozISpellCheckingEngine);
+gSpellCheckEngine.dictionary = 'en-US';
+
+if (gSpellCheckEngine.check("kat")) {
+    // Le mot est correctement écrit
+}
+else {
+    // Le mot n'est pas correctement écrit
+}
+
+

Obtention d'une liste de suggestions

+

Pour obtenir une liste de suggestions pour un mot incorrect, appelez la méthode suggest() en spécifiant le mot et un objet pouvant être rempli d'un tableau de suggestions possibles. +

+
var suggestions = {};
+gSpellCheckEngine.suggest("kat", suggestions);
+
+if (suggestions.value) {
+   // suggestions.value est un tableau JavaScript (objet Array) de chaines
+   // suggestions.value.length compte le nombre de suggestions trouvées
+}
+
+
+
diff --git a/files/fr/archive/mozilla/xul/vbox/index.html b/files/fr/archive/mozilla/xul/vbox/index.html new file mode 100644 index 0000000000..87392e6beb --- /dev/null +++ b/files/fr/archive/mozilla/xul/vbox/index.html @@ -0,0 +1,100 @@ +--- +title: vbox +slug: Archive/Mozilla/XUL/vbox +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/vbox +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Un élément conteneur qui peut contenir une infinité d'éléments enfants. C'est l'équivalent de l'élément box, sauf que son orientation par défaut est verticale. +

Vous trouverez plus d'informations dans le Tutoriel XUL.

+

Exemple

+
<!-- Deux labels en bas -->
+<vbox>
+  <spacer flex="1"/>
+  <label value="Un"/>
+  <label value="Deux"/>
+</vbox>
+
+

Attributs

+ + + + + + +

Hérités de 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

+
+ +

Propriétés

+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Sujets liés

+
Éléments +
box, hbox +
+
+
diff --git a/files/fr/archive/mozilla/xul/vulgarisation_xul/index.html b/files/fr/archive/mozilla/xul/vulgarisation_xul/index.html new file mode 100644 index 0000000000..c5ab6b4c9f --- /dev/null +++ b/files/fr/archive/mozilla/xul/vulgarisation_xul/index.html @@ -0,0 +1,33 @@ +--- +title: Tutoriel de vulgarisation XUL +slug: Archive/Mozilla/XUL/Vulgarisation_XUL +translation_of: Archive/Add-ons/Overlay_Extensions/XUL_School +--- +

Le projet XUL School a été développé par Glaxstar (maintenant Appcoast), comme un tutoriel complet de développement d'extensions, couvrant les aspects les plus significatifs de développement des extensions, y compris des techniques éprouvées et des normes de haute qualité. Appcoast a aimablement donné le contenu de ce projet, qui est maintenant publié sur le MDC selon ses licences de partage. Certains de ces contenus ont été modifiés à partir de sa source d'origine, et va probablement continuer à évoluer avec les contributions de la communauté.

+

Il vous est conseillé de bien lire en entier au moins une fois son contenu, et de vous repérez au contenu de référence, ainsi que de télécharger, étudier et tester les exemples de codes.

+

Contenu :

+ +


diff --git a/files/fr/archive/mozilla/xul/vulgarisation_xul/introduction/index.html b/files/fr/archive/mozilla/xul/vulgarisation_xul/introduction/index.html new file mode 100644 index 0000000000..7d4aed3de9 --- /dev/null +++ b/files/fr/archive/mozilla/xul/vulgarisation_xul/introduction/index.html @@ -0,0 +1,102 @@ +--- +title: Introduction +slug: Archive/Mozilla/XUL/Vulgarisation_XUL/Introduction +translation_of: Archive/Add-ons/Overlay_Extensions/XUL_School/Introduction +--- +
+

Suivant »

+
+

Bonjour, et bienvenue sur le tutoriel de vulgarisation XUL pour les développeurs d'extension !

+

Ce tutoriel est destiné à être le tremplin qui va vous transformer en un développeur d'extensions professionnelles sous Firefox en peu de temps. Il contient des années d'expérience en XUL, en fournissant toutes sortes de solutions aux problèmes communs, et en décrivant les avantages et les inconvénients des différentes approches pour résoudre ces problèmes. Ce tutoriel reflète également une nouvelle manière de faire des extensions Firefox, profitant des nouvelles fonctionnalités et API que Firefox 3 fournit.

+

Ce tutoriel XUL a été créé par Glaxstar (maintenant Appcoast), l'une des rares entreprises spécialisée dans l'élaboration d'extensions de haute qualité pour Firefox. Une équipe de plus d'une douzaine de développeurs XUL de chez Glaxstar ont participé en même temps à ce tutoriel, et l'ensemble des expériences des années de création d'extensions Firefox sont reflétées ici.

+

Dans ce tutoriel, vous apprendrez à développer des extensions Firefox. Vous apprendrez comment faire rapidement les tâches les plus communes dans le développement d'extensions, en comparant plusieurs approches différentes pour les résoudre. Dans la plupart des cas, nous vous fournirons des exemples de code que vous pouvez facilement copier et adapter à vos besoins, ainsi que certains exemples fonctionnels d'extensions. Le tutoriel vise à être aussi bref que possible, en faisant des renvois fréquent sur la documentation de Mozilla pour plus d'informations. Vous pouvez penser que c'est un guide trop court face au monde vaste qui est la plate-forme Mozilla. La plupart des liens dans cette documentation sont destinés à être ouverts et lus, puisque nous ne cherchons pas à être exhaustif.

+

Nous allons commencer par une brève introduction à certains concepts clés, au cas où vous n'êtes pas familier avec Mozilla et Firefox. Vous pouvez ignorer ces sections si vous les connaissez déjà.

+

Mozilla and Firefox

+

Le terme Mozilla sert à définir plusieurs concepts : le projet Mozilla, la fondation Mozilla, la Mozilla Corporation et le vieux navigateur Mozilla. Même Firefox est parfois appelé "Mozilla". Si vous n'êtes pas familier avec ces termes, il est bon que vous prendre un peu de temps et d'en apprendre un peu plus sur Mozilla. Cela vous aidera à comprendre la culture qui entoure la communauté Mozilla.

+

Mozilla a donné naissance à plusieurs produits et projets, le plus important étant le navigateur Web Mozilla Firefox, qui est actuellement le deuxième navigateur le plus utilisé dans le monde, avec une base d'utilisateurs très importante et croissante et un nombre de contributeurs et une communauté de développeurs très importants et croissants. Firefox est l'un des projet libre les plus réussis dans l'histoire, combinant l'ouverture, aux normes de conformité et de la sophistication de l'open source en mettant l'accent sur l'expérience utilisateur et sur un marketing puissant d'offres commerciales.

+

La version 1.0 de Firefox a été publiée en Novembre 2004, la version 2.0 en Octobre 2006, et la version 3.0 en Juin 2008. La version 3.0 comprend une grande variété de modifications, dont certaines ne sont pas rétro-compatibles, donc vous devez en tenir compte lors du développement d'extensions. Ce tutoriel se concentre sur le développement de Firefox 3.0 et suivant, mais une majorité de son contenu s'applique également pour Firefox 2 et Firefox 1. Le tutoriel précisera quand une solution ne fonctionne que sur certaines versions les plus récentes de Firefox.

+
+

Nous vous recommandons de développer vos extensions pour Firefox 3 et plus. Les utilisateurs de Firefox 3 seront bientôt la majorité des utilisateurs de Firefox, et les avantages d'utiliser les nouvelles fonctionnalités de Firefox 3 sont importants.

+
+

XUL

+

XUL (prononcez «zool») est l'une des nombreuses technologies utilisées pour créer des produits et des extensions basés sur Mozilla. C'est seulement une partie de l'environnement de développement, mais étant donné qu'il est pratiquement exclusif à Mozilla, il tend à être utilisé pour identifier tous les développements liés à Mozilla. Vous verrez parfois écrit des termes comme "applications XUL" et "extensions XUL", mais rarement ils vont se référer à des projets qui sont exclusivement construits avec XUL. Cela signifie généralement que les projets ont été construits en utilisant les technologies Mozilla. Même ce tutoriel couvre plusieurs autres technologies telles que JavaScript, CSS, XBL et XPCOM.

+

Gecko

+

Le moteur Gecko est la partie de Firefox utilisée pour le rendu des pages Web et sa propre interface utilisateur. Vous pouvez identifier le niveau de compatibilité des standards du Web dans les navigateurs basés sur Gecko en regardant leur chaîne d'agent utilisateur, qui devrait inclure la version Gecko. Les versions de Gecko sont indépendantes des versions de Firefox, et vous pouvez voir une cartographie des versions de Firefox et les versions Gecko sur la page Gecko. La chaîne d'agent utilisateur pour Firefox au moment d'écrire ces lignes (en anglais américain, Mac OS X) est la suivante :

+

Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.6; en-US; rv:1.9.2) Gecko/20100115 Firefox/3.6

+

La section en surbrillance est la version Gecko: 1.9.2. Vous pouvez lire et copier la chaîne de l'agent utilisateur de n'importe quelle fenêtre de Firefox, en choisissant "? > À propos de Mozilla Firefox" dans le menu principal ("Firefox > À propos de Mozilla Firefox", sur Mac).

+

XULRunner

+

Firefox et d'autres applications Mozilla peuvent être considérés comme composés de deux parties distinctes : une couche d'interface utilisateur qui est distincte pour chaque projet, et une plate-forme commune sur laquelle la couche d'interface est construite. Cette plate-forme est connue sous le nom de XULRunner. XULRunner inclut le moteur de rendu Gecko, la bibliothèque réseau Necko, et plusieurs autres composants qui permettent aux gestionnaires de fichiers OS indépendant, l'accessibilité et la localisation, entre autres. C'est cette plate-forme très puissante qui a permis une croissance rapide de la communauté de développement autour de Mozilla et Firefox.

+

XULRunner est disponible sous forme binaire sur la page XULRunner, et il est la base de plusieurs projets, tels que Songbird, Miro et Eudora. Il y a une liste très complète d'applications XULRunner dans le Hall of Fame XULRunner.

+

Sur le tutoriel

+

Avec ce rappel des concepts de base, nous pouvons maintenant aller droit au développement d'extensions. Vous êtes probablement encore à vous demander qu'est-ce qu'est exactement une extension, ce qu'elle fait, et comment vous pouvez en faire. Eh bien, tout ce tutoriel est consacré à vous l'expliquer.

+

Bienvenue dans le monde du développement d'extensions. Maintenant, allons-y.

+
+

Suivant »

+
+

Ce tutoriel a été gracieusement offert à Mozilla par Appcoast.

diff --git a/files/fr/archive/mozilla/xul/vulgarisation_xul/l'essentiel_d'une_extension/index.html b/files/fr/archive/mozilla/xul/vulgarisation_xul/l'essentiel_d'une_extension/index.html new file mode 100644 index 0000000000..455bc53fb1 --- /dev/null +++ b/files/fr/archive/mozilla/xul/vulgarisation_xul/l'essentiel_d'une_extension/index.html @@ -0,0 +1,412 @@ +--- +title: L'essentiel d'une extension +slug: Archive/Mozilla/XUL/Vulgarisation_XUL/L'essentiel_d'une_extension +translation_of: Archive/Add-ons/Overlay_Extensions/XUL_School/The_Essentials_of_an_Extension +--- +
+

« PrécédentSuivant »

+
+ +

Le fichier install.rdf

+ +

Dans la section précédente, nous avons examiné le contenu de l'extension "Hello World". Maintenant, nous allons examiner dans son code et ses fichiers, en commençant par le fichier install.rdf. Vous pouvez l'ouvrir avec n'importe quel éditeur de texte.

+ +

Le fichier est formaté selon un type particulier XML appelé RDF. RDF est utilisé pour le mécanisme de stockage centralisé pour Firefox, mais il est maintenant remplacé par un système plus simple de base de données. Nous aborderons ces deux systèmes de stockage plus loin dans le tutoriel.

+ +

Maintenant, regardons les parties importantes du fichier.

+ +
+
+
<em:id>helloworld@xulschool.com</em:id>
+
+
+ +

Il s'agit d'un identifiant unique pour l'extension. Firefox en a besoin pour distinguer votre extension des autres, il est donc nécessaire que cet identifiant soit unique.

+ +

Il existe deux normes acceptées pour les IDS des extensions. Le premier est le format de type e-mail comme dans l'exemple "Hello World", qui devrait être quelque chose comme <project-name>@<yourdomain>. L'autre pratique standard consiste à utiliser une chaîne UUID générée qui est extrêmement peu probable à être reproduite. Les systèmes basés sur Unix ont un outil en ligne de commande appelé uuidgen qui génère des UUIDs. Il existe également des outils téléchargeables disponibles pour toutes les plates-formes pour les générer. Les crochets entourant ne sont que la notation, et il s'agit d'une simple notation courante. Tant que votre id a une certaine unicité, il est possible d'utiliser l'une des deux formes.

+ +
+
+
<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/XUL_School</em:homepageURL>
+
+
+ +

Il s'agit des données qui sont affichées avant et après l'installation de l'extension, et que vous pouvez voir dans la fenêtre des modules complémentaires. L'URL de la page d'accueil peut être visité par un clic droit sur l'extension et en choisissant Visitez la page Web. Il y a beaucoup d'autres balises pouvant être ajoutées, pour les auteurs et les traducteurs. La spécification complète du fichier install.rdf contient tous les détails.

+ +

Comme les extensions peuvent être traduites en plusieurs langues, il est souvent nécessaire de traduire la description de l'extension, ou même son nom. Sur Firefox 3 et suivant, une description localisée et un nom peuvent être ajoutés par le code suivant :

+ +
+
+
<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>
+
+
+ +

La chaîne de localisation es-ES indique que la langue est l'espagnol (es) pour l'Espagne (ES). Vous pouvez ajouter autant de sections <em:localized> que vous avez besoin. Pour Firefox 2, la localisation de ce fichier est un peu plus compliqué. Nous verrons la localisation plus loin dans cette section.

+ +
+
+
<em:type>2</em:type>
+
+
+ +

Ceci précise que le module en cours d'installation est une extension. Vous pouvez consulter les différents types possibles dans la spécification install.rdf.

+ +
+
+
<em:targetApplication>
+  <Description>
+    <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
+    <em:minVersion>3.0</em:minVersion>
+    <em:maxVersion>3.6.*</em:maxVersion>
+  </Description>
+</em:targetApplication>
+
+
+ +

Ce nœud spécifie l'application cible et les versions cibles de l'extension, en particulier Firefox de la version 3.0 au versions 3.6.*. L'UUID est l'ID unique de Firefox. Les autres applications Mozilla et basées sur Mozilla telles que Thunderbird et Seamonkey ont le leurs. Vous pouvez avoir une extension qui fonctionne sur de multiples applications et versions. Par exemple, si vous créez une extension de Firefox, il faudrait normalement peu d'effort pour la porter sur Flock ou sur SeaMonkey, qui ont une interface utilisateur et des caractéristiques très similaires.

+ +

Le min et max de la version spécifie l'étendue des versions où l'extension peut être installée. Des détails sont disponibles sur le format de version. Si l'application ou la plage de version ne correspondent pas, vous ne serez pas autorisé à installer l'extension, ou l'extension sera installée dans un état désactivé. Les utilisateurs peuvent désactiver les contrôles version grâce à des préférences ou d'installer des modules complémentaires comme Add-on Compatibility Reporter.

+ +

Ce sont les seules informations dont Firefox et d'autres applications Mozilla ont besoin pour installer un module complémentaire. Toutes erreurs ou manques d'information entraînent un échec du processus d'installation, ou laissent l'extension s'installer dans un état désactivé.

+ +

Le fichier chrome.manifest

+ +
+

Le chrome est l'ensemble des éléments de l'interface utilisateur d'une application qui sont situés en dehors de la zone de contenu d'une fenêtre. Les barres d'outils, les barres de menus, les barres de progression, et les titres de fenêtres sont tous des exemples d'éléments qui font habituellement partie du chrome.

+
+ +

Citation de Enregistrement Chrome.

+ +

En d'autres termes, le chrome correspond à tout ce que vous voyez dans Firefox. Toutes les fenêtres Firefox peuvent être considérées comme ayant deux parties : (1) le chrome et (2) peut-être une zone de contenu, comme celui qui affiche les pages Web dans un onglet Firefox. Les fenêtres comme le gestionnaire de modules complémentaires et de la fenêtre de téléchargements sont en chrome pur. La plupart du code pour une extension réside dans le dossier chrome, tout comme dans l'exemple Hello World.

+ +

Les fichiers Chrome sont tous empaquetés dans une archive JAR, généralement nommée d'après l'extension. Il n'est pas nécessaire d'empaqueter les fichiers chrome, mais c'est une pratique courante et recommandée pour des raisons de performances.

+ +

Comme nous l'avons vu dans la structure des répertoires de l'extension décompressée, le chrome est composé de 3 sections : content, locale et skin. Les 3 sont nécessaires pour la plupart des extensions. Si nous ouvrons le fichier chrome.manifest (encore une fois, un éditeur de texte fera l'affaire), nous voyons que les 3 mêmes sections sont mentionnés :

+ +
+
+
content   xulschoolhello              jar:chrome/xulschoolhello.jar!/content/
+skin      xulschoolhello  classic/1.0 jar:chrome/xulschoolhello.jar!/skin/
+locale    xulschoolhello  en-US       jar:chrome/xulschoolhello.jar!/locale/en-US/
+
+
+ +

Le fichier chrome.manifest indique à Firefox où chercher les fichiers chrome. Le texte est espacé pour ressembler à un tableau, mais ce n'est pas nécessaire. L'analyseur ignorera les espaces répétées.

+ +

Le premier mot d'une ligne indique à Firefox ce qui est déclaré (le contenu, le thème graphique, la langue, ou d'autres choses que nous verrons plus loin). Le second est le nom du paquet, que nous expliquerons bientôt. Les paquets des thèmes et langages ont une troisième valeur afin de définir ce qu'ils étendent. Il peut y avoir plusieurs thèmes ou langages. Le cas le plus fréquent est d'avoir une seule entrée pour le thème correspondant au thème global classic/1.0, et des entrées multiples de langages, une pour chaque langue. Enfin, l'emplacement est spécifié. Note sur le schéma jar: ; il indique à Firefox de d'ouvrir le fichier JAR et de lire les fichiers à leur emplacement. Si vous voulez avoir une extension avec un répertoire chrome non empaqueté, il vous suffit de modifier les chemins d'accès en quelque chose comme chrome/ content/.

+ +

Quelques options supplémentaires peuvent être inclues dans les entrées d'un fichier chrome.manifest. Elles sont documentées dans la page Enregistrement Chrome. Notamment, nous pouvons avoir des entrées qui sont spécifiques à l'OS. Ceci est important, spécialement dans Firefox 3 et plus, où l'apparence du navigateur est très différente selon le système d'exploitation. Si notre extension doit avoir une apparence différence sur d'autres systèmes, nous pourrions modifier le fichier manifest comme ceci :

+ +
+
+
content   xulschoolhello              jar:chrome/xulschoolhello.jar!/content/
+skin      xulschoolhello  classic/1.0 jar:chrome/xulschoolhello.jar!/skin/unix/
+skin      xulschoolhello  classic/1.0 jar:chrome/xulschoolhello.jar!/skin/mac/ os=Darwin
+skin      xulschoolhello  classic/1.0 jar:chrome/xulschoolhello.jar!/skin/win/ os=WinNT
+locale    xulschoolhello  en-US       jar:chrome/xulschoolhello.jar!/locale/en-US/
+
+
+ +

De cette façon, nous pouvons avoir des thèmes graphiques  distincts pour Windows, Mac OS X, et Linux (ainsi que d'autres systèmes de type Unix), définis chacun dans un répertoire distinct. Comme la plupart des autres systèmes sont basés sur Unix, le thème "unix" est la valeur par défaut, sans drapeaux.

+ +

Le Chrome

+ +

Comme mentionné précédemment, le chrome est composé de 3 sections : le contenu, le langage et le thème. Le contenu est la section la plus importante, contenant les fichiers de l'interface utilisateur (XUL) et du script (JS). La section du thème contient les fichiers définissant principalement l'apparence graphique de l'interface utilisateur (en utilisant le CSS et les images, tout comme les pages Web). Enfin, la section du langage regroupe tous les textes utilisés dans l'extension, dans des fichiers DTD et properties. Cette division permet aux développeurs de créer d'autres thèmes graphiques, et aux traducteurs de créer des versions dans des langues différentes, tout cela sans avoir à modifier votre extension ou votre code. Cela donne aux extensions Firefox beaucoup de flexibilité.

+ +

Les fichiers Chrome sont accessibles via le protocole chrome. Les URIs chrome sont définis comme suit 

+ +
+
+
chrome://packagename/section/path/to/file
+
+
+ +

Ainsi, par exemple, si je veux accéder au fichier browserOverlay.xul dans l'extension, l'URI chrome serait chrome://xulschoolhello/content/browserOverlay.xul. Si vous avez trop de fichiers dans le contenu et vous souhaitez les organiser en sous-répertoires, il n'y a rien à changer de chrome.manifest, il vous suffit d'ajouter le chemin correspondant après content dans l'URI. Les fichiers des thèmes ou de langages fonctionnent de la même manière, et vous n'avez pas besoin de spécifier leurs noms exacts. Ainsi, pour accéder au fichier DTD dans l'exemple Hello World, le chemin de chrome est chrome://xulschoolhello/locale/browserOverlay.dtd. Firefox sait de quel fichier de traduction il s'agit.

+ +

Voici une expérience intéressante. Ouvrez un nouvel onglet Firefox, tapez chrome://mozapps/content/downloads/downloads.xul dans votre barre d'adresse et appuyez sur ENTRER. Surpris ? Vous venez d'ouvrir la fenêtre des Téléchargements dans un onglet Firefox ! Vous pouvez accéder à un fichier chrome en tapant simplement son URI dans la barre d'adresse. Cela peut être utile si vous voulez inspecter les fichiers de script qui font partie de Firefox, d'autres extensions, ou de la votre. La plupart de ces fichiers sont ouverts sous forme de fichiers texte, à l'exception des fichiers XUL qui sont exécutés et affichés comme vous les verriez normalement sur une fenêtre.

+ +

Content

+ +

Il y a 2 fichiers dans le répertoire content. Regardons le premier fichier XUL.

+ +

Les fichiers XUL sont des fichiers XML qui définissent les éléments de l'interface utilisateur dans Firefox et les extensions Firefox. XUL a été inspiré par le HTML, donc vous verrez beaucoup de similitudes entre les deux. Cependant, XUL est aussi une amélioration par rapport à HTML, ayant appris de bon nombre des erreurs commises durant l'évolution de HTML. XUL permet de créer des interfaces plus riches et plus interactives que celles que vous pouvez créer avec le langage HTML, ou tout au moins XUL les rend plus facile.

+ +

Les fichiers XUL définissent généralement l'une des deux choses suivantes : les fenêtres ou les superpositions (overlay). Le fichier que vous avez ouvert précédemment, downloads.xul, a un code qui définit la fenêtre de téléchargements. Le fichier XUL inclus dans l'extension Hello World est une superposition. Une superposition étend une fenêtre existante, en ajoutant de nouveaux éléments ou en remplaçant certains des éléments qu'elle contient. La ligne que nous avons sauté dans les lignes du fichier chrome.manifest décrit que ce fichier XUL est une superposition de la fenêtre principale du navigateur :

+ +
+
+
overlay chrome://browser/content/browser.xul  chrome://xulschoolhello/content/browserOverlay.xul
+
+
+ +

With this line, Firefox knows that it needs to take the contents of browserOverlay.xul and overlay it on the main browser window, browser.xul. You can declare overlays for any window or dialog in Firefox, but overlaying the main browser window is the most common case by far.

+ +

Now let's look at the contents of our XUL file. We'll skip the first few lines because they relate to skin and locale, which we'll cover later.

+ +
+
+
<overlay id="xulschoolhello-browser-overlay"
+  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+
+ +

The root element in the file is an overlay. Other XUL documents use the window or dialog tag. The element has a unique id, which you should have on most elements in your XUL. The second attribute is the namespace, which is something you should always define in your XUL root element. It says that this node and all child nodes are XUL. You only need to change namespace declarations when you combine different types of content, such as XUL with HTML or 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.
+
+
+ +
+
+
<script type="application/x-javascript"
+  src="chrome://xulschoolhello/content/browserOverlay.js" />
+
+
+ +

Just like in HTML, this includes a JavaScript script file. You can have as many script elements on a XUL file as you need. We'll look into its code later.

+ +
+
+
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.
+
+
+ +

 We'll skip some code that is covered in the locale section, moving on to the most important part of the content:

+ +
+
+
<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>
+
+
+ +

This is the code that adds the Hello World menu to the browser window. In order to write this code, we needed some knowledge of the XUL code in browser.xul. We needed to know that the id of the main menu is main-menubar. We're adding a menu of our own, and telling Firefox to add it in the main menu bar, right after the Help menu. That's the purpose of the attribute:

+ +
+
+
insertafter="helpMenu"
+
+
+ +

helpMenu is the id of the menu element that corresponds to the Help menu in the main menu of the browser. We'll see later how we can find out things like the ids of browser elements, but for now let's look at the elements that compose the Hello World menu.

+ +

The menubar element represents the menu bar you normally see at the top of an application window. The main Firefox window has one, but few of its other windows do. It's also rare for additional extension windows to have their own menu bars.

+ +

We added the Hello World menu right in the "root" of the menu bar so that it would be very easy for you to spot it, but this is not a recommended practice. Imagine if all extensions added menus to the top menu bar; having a few extensions would make the menu look like an airplane dashboard, full of options. The recommended location for extension menus is under the Tools menu, so the code should really look like this:

+ +
+
+
<menupopup id="menu_ToolsPopup">
+  <menu id="xulschoolhello-hello-menu" label="&xulschoolhello.hello.label;"
+    accesskey="&xulschoolhello.helloMenu.accesskey;"
+    insertafter="javascriptConsole,devToolsSeparator">
+    <menupopup>
+      <menuitem id="xulschoolhello-hello-menu-item"
+        label="&xulschoolhello.hello.label;"
+        accesskey="&xulschoolhello.helloItem.accesskey;"
+        oncommand="XULSchoolChrome.BrowserOverlay.sayHello(event);" />
+    </menupopup>
+  </menu>
+</menupopup>
+
+
+ +

We're overlaying a menu that is deeper into the XUL tree, but it doesn't matter because all we need is the id of the element we want to overlay. In this case it is the menupopup element that's inside of the Tools menu element. The insertafter attribute tells Firefox to add the menu below the Error Console item (formerly known as JavaScript Console) in the Tools menu, just like recommended in the Extension Etiquette page. We'll discuss more about menus later on in the tutorial. For now let's focus on the following line:

+ +
+
+
oncommand="XULSchoolChrome.BrowserOverlay.sayHello(event);"
+
+
+ +

This attribute defines an event handler. The command event is the most frequently used in Firefox, since it corresponds to the main action for most UI elements. The value of the attribute is JavaScript code that invokes a function. This function is defined in the JS file that was included with the script tag. The JS function will be called once the user clicks on the menu item in the Hello World menu. All event handlers define a special object named event, which is usually good to pass as an argument to the function. Event handlers are explained in grater depth further ahead.

+ +

Now let's look at the JavaScript file and see what's going on when the event is fired.

+ +
+
+
/**
+ * XULSchoolChrome namespace.
+ */
+if ("undefined" == typeof(XULSchoolChrome)) {
+  var XULSchoolChrome = {};
+};
+
+
+ +

The XULSchoolChrome namespace is defined. All objects and variables we define in this JavaScript are global, meaning that scripts in Firefox and other extensions can see them and interact with them. This also means that if we define an object called MenuHandler or some other generic name, it's likely going to conflict with an existing object. What we do here is define a single global object: XULSchoolChrome. Now we know that all of our objects are inside this object, which is unlikely to be duplicated or overwritten by other extensions.

+ +

You can read more about the typeof operator. If you're unfamiliar with JavaScript or this particular syntax, initializing an object as {} is the equivalent of initializing it to new Object().

+ +
+
+
/**
+ * Controls the browser overlay for the Hello World extension.
+ */
+XULSchoolChrome.BrowserOverlay = {
+
+
+ +

Finally, BrowserOverlay is our object. Naming and referencing  objects in such a long and verbose manner can feel uncomfortable at first, but it's worth the cost.

+ +
+
+
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);
+}
+
+
+ +

And, finally, this is our function declaration. Three lines of code are all we need for it to work. The first line in the body of the function declares a variable that will hold the stringbundle element defined in the overlay. The variable is declared using let, which is similar to var but with more restricted scope. Here you can read more about let declarations. It's worth noting that this is a relatively new addition to JavaScript in Firefox and you should use var if you're creating an extension compatible with very old versions.

+ +

Just like in regular JS, we can use the DOM (Document Object Model) in order to manipulate the XUL document. First we get a reference of the stringbundle element in the document. This is a special element that allows us to obtain localized strings dynamically, by only providing a "key" that identifies the string. This is what we do on the second line. We call the getString method of the bundle element and get the localized message to be displayed. We then call the window.alert function with the message, just like we would do in an HTML document.

+ +

Locale

+ +

There are two types of locale files: DTD and properties, and in this example we use them both. DTD is the most efficient way of showing text in XUL, so you should use it whenever possible. It is somewhat inflexible so it can't be used for dynamically generated text, hence the need for an alternate way of getting localized strings.

+ +

Looking back at the menu code, you probably noticed some attributes such as this:

+ +
+
+
label="&xulschoolhello.hello.label;" accesskey="&xulschoolhello.helloItem.accesskey;"
+
+
+ +

These attributes define the text that you see on the menus, and they are string keys that are defined in our DTD file, browserOverlay.dtd. The DTD file was included in the XUL file with the following code:

+ +
+
+
<!DOCTYPE overlay SYSTEM "chrome://xulschoolhello/locale/browserOverlay.dtd" >
+
+
+ +

And in the DTD file you can see the association between keys and localized strings:

+ +
+
+
<!ENTITY xulschoolhello.hello.label            "Hello World!">
+<!ENTITY xulschoolhello.helloMenu.accesskey    "l">
+<!ENTITY xulschoolhello.helloItem.accesskey    "H">
+
+
+ +

Notice that on the XUL file you enclose the string key with & and ; while on the DTD file you only specify the key. You may get weird parsing errors or incorrect localization if you don't get it right.

+ +

Access keys are the shortcuts that allow you to quickly navigate a menu using only the keyboard. They are also the only way to navigate a menu for people with accessibility problems, such as partial or total blindness, or physical disabilities that make using a mouse very difficult or impossible. You can easily recognize the access keys on Windows because the letter that corresponds to the access key is underlined, as in the following image:

+ +
+

+
+ +

Most user interface controls have the accesskey attribute, and you should use it. The value of the access key is localized because it should match a letter in the label text. You should also be careful to avoid access key repetition. For example, within a menu or submenu, access keys should not be repeated. In a window you have to be more careful picking access keys because there are usually more controls there. You have to be specially careful when picking access keys on an overlay. In our case, we can't use the letter "H" as an accesskey in the Main menu item, because it would be the same as the access key in the Help menu. Same goes with "W" and the Window menu on Mac OS. So we settled on the letter "l".

+ +

DTD strings are resolved and set when the document is being loaded. If you request the label attribute value for the Hello World menu using DOM, you get the localized string, not the string key. You cannot dynamically change an attribute value with a new DTD key, you have to set the new value directly:

+ +
+
+
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"));
+
+
+ +

This is the reason DTD strings are not a solution for all localization cases, and the reason we often need to include string bundles in XUL files:

+ +
+
+
<stringbundleset id="stringbundleset">
+  <stringbundle id="xulschoolhello-string-bundle"
+    src="chrome://xulschoolhello/locale/browserOverlay.properties" />
+</stringbundleset>
+
+
+ +

The stringbundleset element is just a container for stringbundle elements. There should only be one per document, which is the reason why we overlay the stringbundleset that is in browser.xul, hence the very generic id. We don't include the insertbefore or insertafter attributes because the ordering of string bundles doesn't make a difference. The element is completely invisible. If you don't include any of those ordering attributes in an overlay element, Firefox will just append your element as the last child of the parent element.

+ +

All you need for the string bundle is an id (to be able to fetch the element later) and the chrome path to the properties file. And, of course, you need the properties file:

+ +
+
+
xulshoolhello.greeting.label = Hi! How are you?
+
+
+ +

The whitespace around the equals sign is ignored. Just like in install.rdf, comments can be added using the # character at the beginning of the line. Empty lines are ignored as well.

+ +

You will often want to include dynamic content as part of localized strings, like when you want to inform the user about some stat related to the extension. For example: "Found 5 words matching the search query". Your first idea would probably be to simply concatenate strings, and have one "Found" property and another "words matching..." property. This is not a good idea. It greatly complicates the work of localizers, and grammar rules on different languages may change the ordering of the sentence entirely. For this reason it's better to use parameters in the properties:

+ +
+
+
xulshoolhello.search.label = Found %S words matching the search query!
+
+
+ +

Then you use getFormattedString instead of getString in order to get the localized string. Thanks to this we don't need to have multiple properties, and life is easier for translators. You can read more about it on the Text Formatting section of the XUL Tutorial. Also have a look at the Plurals and Localization article, that covers a new localization feature in Firefox 3 that allows you to further refine this last example to handle different types of plural forms that are also language-dependent.

+ +

Skin

+ +

Styling XUL is very similar to styling HTML. We'll look into some of the differences when we cover the XUL Box Model, and other more advanced topics. There isn't much styling you can do to a minimal menu and a very simple alert message, so the Hello World extension only includes an empty CSS file and the compulsory global skin file:

+ +
+
+
<?xml-stylesheet type="text/css" href="chrome://global/skin/"  ?>
+<?xml-stylesheet type="text/css"
+  href="chrome://xulschoolhello/skin/browserOverlay.css"  ?>
+
+
+ +

The global skin CSS file holds the default styles for all XUL elements and windows. Forgetting to include this file in a XUL window usually leads to interesting and often unwanted results. In our case we don't really need to include it, since we're overlaying the main browser XUL file, and that file already includes this global CSS. At any rate it's better to always include it. This way it's harder to make the mistake of not including it. You can enter the chrome path in the location bar and inspect the file if you're curious.

+ +

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.

+ +

Exercise

+ +

Change the welcome message that is displayed in the alert window and move the Hello World menu to the Tools Menu, where it belongs. Repackage the XPI and re-install it. You can just drag the XPI file to the browser and it will be installed locally. Test it and verify your changes worked. If you run into problems at installation, it's likely that you didn't reproduce the XPI structure correctly, maybe adding unnecessary folders.

+ +

Once you're done, you can look at this reference solution: Hello World 2.

+ +
+

« PrécédentSuivant »

+
+ +

This tutorial was kindly donated to Mozilla by Appcoast.

diff --git a/files/fr/archive/mozilla/xul/vulgarisation_xul/premiers_pas_avec_les_extensions_firefox/index.html b/files/fr/archive/mozilla/xul/vulgarisation_xul/premiers_pas_avec_les_extensions_firefox/index.html new file mode 100644 index 0000000000..417c76133f --- /dev/null +++ b/files/fr/archive/mozilla/xul/vulgarisation_xul/premiers_pas_avec_les_extensions_firefox/index.html @@ -0,0 +1,132 @@ +--- +title: Premiers pas avec les extensions Firefox +slug: Archive/Mozilla/XUL/Vulgarisation_XUL/Premiers_pas_avec_les_extensions_Firefox +translation_of: >- + Archive/Add-ons/Overlay_Extensions/XUL_School/Getting_Started_with_Firefox_Extensions +--- +
+

« PrécédentSuivant »

+
+ +

Qu'est-ce qu'une extension Firefox ?

+ +
+

Les extensions ajoutent de nouvelles fonctionnalités à des applications Mozilla telles que Firefox et Thunderbird. Elles peuvent ajouter n'importe quoi depuis le bouton d'une barre d'outils à une fonctionnalité entièrement nouvelle. Ils permettent à l'application d'être personnalisée pour répondre aux besoins personnels de chaque utilisateur en fonctionnalités supplémentaires, tout en gardant des applications légères à télécharger.

+
+ +

Telle que décrit dans le texte cité, une extension est une petite application qui ajoute quelque chose de nouveau à une ou plusieurs applications Mozilla. Ce tutoriel se concentre sur des extensions pour Firefox, mais les mêmes (ou très similaires) principes s'appliquent à la création d'extensions pour d'autres applications comme Thunderbird, SeaMonkey, et Flock.

+ +

Il est également intéressant de noter qu'il existe des différences entre la définition d'extension et de module complémentaire. Toutes les extensions sont des modules complémentaires, mais des modules complémentaires peuvent également être des thèmes, des plugins, ou paquetages de langue. Ce tutoriel porte sur le développement d'extensions, mais les thèmes et les paquetages de langues sont développés de manière très similaire. Les plugins sont tout à fait différents, et ils ne seront pas abordés dans ce tutoriel. Vous pourrez en savoir plus sur les plugins et leur développement dans la page Plugins.

+ +

Firefox fournit une architecture très riche et flexible qui permet aux développeurs d'extensions d'ajouter des fonctionnalités avancées, de personnaliser l'expérience de l'utilisateur, et de remplacer ou d'enlever complètement des parties de votre navigateur. Le référentiel Mozilla Add-ons (AMO) regroupe un grand nombre d'extensions ayant une grande variété de fonctions : le filtrage de contenu (AdBlock Plus, NoScript), l'interaction d'application Web (Delicious Bookmarks, eBay Companion), le développement Web (DOM Inspector, Firebug) et la protection de l'enfance (Glubble pour les familles). Il s'agit d'extensions très avancées et complexes, et vous apprendrez plus qu'il n'en faut pour créer des extensions comme celles-ci (Glaxstar participe à 3 de celles qui sont énumérées).

+ +

Nous commencerons par examiner une extension très simple.

+ +

L'extension Hello World

+ +

Nos exemples d'extensions et ce tutoriel sont en général destinés à la version Firefox 3 et plus, mais la plupart fonctionne aussi sur les versions précédentes de Firefox. Nous essaierons de le préciser lorsque nous discuterons d'une fonction qui ne fonctionne que sur certaines versions de Firefox.

+ +

Nous allons maintenant commencer par une extension basique "Hello World". Commençons par l'installation de l'extension. Cliquez sur le lien ci-dessous.

+ +
+

L'extension suivante servant d'exemple n'est pas signée numériquement. Pour pouvoir l'activer, vous devez disposer de Firefox Developer Edition et désactiver le controle de la signature numérique.

+
+ +

Installation de Hello World

+ +

Ce lien déclenchera une installation ou un téléchargement de fichier, en fonction du Content-type utilisé par le serveur Web. Le type de contenu approprié pour déclencher une installation est application/x-xpinstall. Dans ce cas, un téléchargement de fichier doit se produire.

+ +

Si le type de contenu est défini correctement, vous serez informé que le site n'est pas autorisé à installer des modules complémentaires sous Firefox. Il s'agit d'une mesure de sécurité qui empêche des sites d'installer des extensions sans le consentement de l'utilisateur. Cela est nécessaire car les extensions malveillantes peuvent avoir le même niveau de dommage que tout programme malveillant : le vol de données, l'effacement ou le remplacement des fichiers, et entraîner des comportements indésirables en général. AMO est le seul site de pré-autorisés car tous les modules complémentaires publiés sur l'AMO sont passés par un processus d'examen qui comprend des contrôles de sécurité.

+ +

Après avoir téléchargé le fichier, vous pouvez le faire glisser et le déposer dans la zone de contenu Firefox, et l'installation devrait commencer.

+ +

Vous verrez une fenêtre vous indiquant que vous êtes sur le point d'installer une extension, avec quelques informations supplémentaires telles que le nom de son auteur. Vous verrez un message disant que l'auteur ne peut être vérifié. Seules les extensions signées avec un certificat numérique peuvent être authentifiées. Les extensions signées sont rares, mais nous allons aborder la façon de les signer plus tard.

+ +

Cliquez sur le bouton Installer maintenant. Après que l'extension soit installée, il vous sera demandé de redémarrer Firefox. L'installation, la désinstallation, l'activation et la désactivation des modules complémentaires (exceptés les plugins) nécessitent un redémarrage pour terminer, et il n'y a pas d'autre moyen de faire. C'est un point important à garder à l'esprit si vous construisez une extension qui manipule les autres extensions ou des thèmes. Il y a un bug très ancien qui permet de suivre cette question.

+ +

Maintenant, après le redémarrage du navigateur, vous verrez la fenêtre du Gestionnaire de modules complémentaires, montrant le nom de l'extension, sa version, et une brève description.

+ +

addonman.png

+ +

Fermez le Gestionnaire de modules complémentaires. Regardez la fenêtre principale de Firefox et voyez si vous remarquez quelque chose de différent.

+ +

L'avez-vous vu ? Il y a un nouveau menu dans la barre de menu principal, intitulé «Hello World!». Si vous ouvrez le menu, puis la sélection du menu surgissant, vous verrez un chouette message d'alerte. Cliquez sur le bouton OK pour le fermer.

+ +

+ +

C'est tout ce que l'extension fait. Maintenant, nous allons y regarder de plus près.  

+ +

Contenus d'une extension

+ +

Vous avez peut être remarqué que le fichier de l'extension que vous avez installé est nommé xulschoolhello1.xpi. XPI (prononcez "zippy") est synonyme de d'installeur multi plate-formes (NdT : Cross-Platform Installer), car le même fichier d'installation peut fonctionner sur les principales plates-formes, et c'est le cas pour la plupart des extensions XPI. Les fichiers XPI sont tout simplement des fichiers compressés au format ZIP, mais Firefox les reconnaît comme extension et déclenche le processus d'installation quand un lien XPI est cliqué.

+ +

Pour regarder dans le fichier XPI, vous avez besoin de le télécharger d'abord sans l'installer. Si le serveur déclenche une installation en cliquant sur un lien ou sur un bouton, vous devez faire un clic droit sur le lien d'installation, puis cliquez sur l'option Enregistrer le lien sous….

+ +

Ensuite, nous allons décompresser le fichier XPI. Une façon de faire est de renommer le fichier afin qu'il ait l'extension zip au lieu de xpi. Une autre façon est d'ouvrir le fichier en utilisant un utilitaire ZIP. La plupart des systèmes d'exploitation dispose d'un utilitaire de compression ZIP, et il existe des outils plus avancés disponibles en ligne. Faites votre choix, et décompressez le fichier dans un emplacement qui vous convient. Vous devriez voir une structure similaire à celle-ci :

+ +

xulschoolhello1

+ + + +

Le fichier JAR contient la majorité du code, alors nous devrons également en extraire son contenu. Tout comme pour les XPI, vous n'avez besoin que d'un utilitaire ZIP pour décompresser le fichier. Après avoir fait cela, vous aurez quelque chose comme ceci :

+ +

xulschoolhello1

+ + + +

Cela fait beaucoup de fichiers pour quelque chose de si simple ! Eh bien, rassurez-vous, nous allons bientôt détailler tous ces fichiers et réaliser que c'est assez simple. Dans la section suivante nous allons examiner ces fichiers et voir ce qu'ils font.

+ +
+

« PrécédentSuivant »

+
+ +

This tutorial was kindly donated to Mozilla by Appcoast.

diff --git a/files/fr/archive/mozilla/xul/window/index.html b/files/fr/archive/mozilla/xul/window/index.html new file mode 100644 index 0000000000..7369e65496 --- /dev/null +++ b/files/fr/archive/mozilla/xul/window/index.html @@ -0,0 +1,179 @@ +--- +title: window +slug: Archive/Mozilla/XUL/window +tags: + - Éléments_XUL +translation_of: Archive/Mozilla/XUL/window +--- +
+ « Accueil de la référence XUL [ + Exemples | + Attributs | + Propriétés | + Méthodes | + Sujets liés ] +

Décrit la structure d'une fenêtre de premier niveau. Il s'agit du nœud racine d'un document XUL. Forme par défaut une boîte orientée horizontalement. Comme il s'agit d'une boîte, tous les attributs de boîte peuvent être utilisés. Par défaut, la fenêtre aura un cadre spécifique à la plateforme pour l'entourer.

Pour assigner une icône à la fenêtre, créez un fichier d'icône spécifique à la plateforme <windowid>.ico et/ou <windowid>.xpm et placez ou installez ces fichiers dans le répertoire <répertoire-de-mozilla>/chrome/icons/default/. La valeur <windowid> est celle de l'attribut id de la fenêtre. Ceci permet d'avoir une icône différente pour chaque fenêtre. +

Pour les propriétés et méthodes, consultez l'objet XUL Window sur XULPlanet ou sur XULfr . +

D'autres informations sont disponibles dans le tutoriel XUL. +

+
Attributs +
height, hidechrome, id, screenX, screenY, sizemode, title, width, windowtype +
+

Exemples

+
<?xml version="1.0"?>
+<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+<window id="rootWnd" title="Enregistrement en ligne"
+        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+  <vbox>
+    <hbox>
+      <image src="formulaire_enregistrement.png"/>
+      <description>Enregistrement en ligne</description>
+    </hbox>
+    <groupbox align="start">
+      <caption label="Vos informations"/>
+      <radiogroup>
+        <vbox>
+          <hbox>
+            <label control="your-fname" value="Entrez le prénom :"/>
+            <textbox id="your-fname" value="Johan"/>
+          </hbox>
+          <hbox>
+            <label control="your-lname" value="Entrez le nom de famille :"/>
+            <textbox id="your-lname" value="Hernandez"/>
+          </hbox>
+          <hbox>
+            <button oncommand="alert('enregistrement')">
+              <description>Enregistrer</description>
+            </button>
+          </hbox>
+        </vbox>
+      </radiogroup>
+    </groupbox>
+  </vbox>
+</window>
+
+

Attributs

+

+

+ +
height +
Type : chaîne de caractères (représentant un entier) +
La hauteur préférée de l'élément en pixels. La hauteur réellement affichée peut être différentes si l'élément ou son contenu ont une hauteur minimum ou maximum. La propriété CSS height peut également être utilisée. +
+ + +
+
+ +
hidechrome +
Type : booléen +
Définissez cet attribut à true pour que le chrome, en ce compris la barre de titre, soit caché. +
+ + +
+
+ +
id +
Type : id d'élément, doit être unique dans la fenêtre +
Un identifiant unique permettant d'identifier l'élément. Celui-ci peut être utilisé comme paramètre pour getElementById() et d'autres fonctions DOM et pour référencer l'élément dans des feuilles de style. +
+ + +
+
+ +
screenX +
Type : entier +
La position horizontale à laquelle la fenêtre apparaît à l'écran. +
+ + +
+
+ +
screenY +
Type : entier +
La position verticale à laquelle la fenêtre apparaît à l'écran. +
+


+

+ + +
+
+ +
sizemode +
Type : une des valeurs ci-dessous +
L'état de la fenêtre (window). Les valeurs suivantes peuvent être utilisées : +
+ +


+

+ + +
+
+ +
title +
Type : chaîne de caractères +
Le texte qui doit apparaître dans la barre de titre de la fenêtre ou boîte de dialogue. +
+


+

+ + +
+
+ +
width +
Type : chaîne de caractères (représentant un entier) +
La largeur préférée de l'élément. La valeur ne doit pas préciser d'unité car elle est toujours exprimée en pixels. La largeur réellement affichée peut être différente si l'élément ou son contenu ont une largeur minimum ou maximum, ou que la taille est ajustée selon la flexibilité ou l'alignement de son parent. La propriété CSS width peut également être utilisée. +
+ + +
+
+ +
windowtype +
Type : chaîne de caractères +
Définit une chaîne pouvant être utilisée pour identifier le type de fenêtre. Celle-ci peut être utilisée, par exemple, pour faire la distinction entre une fenêtre de navigation et une fenêtre d'édition. Certaines des fonctions de gestion de fenêtres de Mozilla utilisent cet attribut pour grouper les fenêtres du même type. +
+


+

+ + +
+ +

Propriétés

+ +

Héritées de XUL element
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
+ +

Méthodes

+

+

+

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()
+ +

Note

+

Le message d'erreur « XML Parsing Error: undefined entity...<window » peut être provoqué par l'indisponibilité ou l'absence d'un fichier DTD référencé dans le fichier XUL. Le chargement d'un fichier dont le nom suit le mot-clé SYSTEM dans une déclaration DOCTYPE peut échouer silencieusement et le seul message d'erreur sera une erreur d'entité non définie sur l'élément XUL suivant. +

+

Sujets liés

+
Éléments +
dialog, dialogheader +
+

Notes des utilisateurs

+

Pour changer l'icône affichée dans la barre de titre d'une fenêtre, consultez la page Icônes de fenêtre. +

Pour ajouter une icône de site (favicon) à la barre d'adresse et aux onglets de navigation (si le dialogue n'est pas un popup), utilisez l'extrait de code suivant pour utiliser l'espace de noms HTML et l'élément link. +

+
<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+	xmlns:html="http://www.w3.org/1999/xhtml">
+
+<!-- Icône du chrome -->
+<html:link rel="icon" href="chrome://monExtension/content/chemin/vers/favicon.png"/>
+
+<!-- Depuis un site distant -->
+<html:link rel="icon" href="http://www.mozilla.org/favicon.ico"/>
+
diff --git a/files/fr/archive/mozilla/xulrunner/astuces_xulrunner/index.html b/files/fr/archive/mozilla/xulrunner/astuces_xulrunner/index.html new file mode 100644 index 0000000000..93ab4c2bcd --- /dev/null +++ b/files/fr/archive/mozilla/xulrunner/astuces_xulrunner/index.html @@ -0,0 +1,164 @@ +--- +title: Astuces XULRunner +slug: Archive/Mozilla/XULRunner/Astuces_XULRunner +tags: + - XUL + - XULRunner +translation_of: Archive/Mozilla/XULRunner/Tips +--- +

XULRunner: Questions Fréquemment Posées. [WIP] +

+

Gestionnaire d'Extensions

+

Pour pouvoir installer des extensions, vous devez d'abord activer le Gestionnaire d'Extensions] dans application.ini. XULRunner 1.8.0 ne charge pas les extensions depuis le dossier de l'application; seul le dossier XULRunner et le dossier du profil de l'utilisateur sont vérifiés. Les préférences suivantes doivent être définies pour faire fonctionner le dialogue XPInstall, le gestionnaire d'extensions et le gestionnaire de thèmes: +

+
pref("xpinstall.dialog.confirm", "chrome://mozapps/content/xpinstall/x...allConfirm.xul");
+pref("xpinstall.dialog.progress.skin", "chrome://mozapps/content/extensions/...ul?type=themes");
+pref("xpinstall.dialog.progress.chrome", "chrome://mozapps/content/extensions/...ype=extensions");
+pref("xpinstall.dialog.progress.type.skin", "Extension:Manager-themes");
+pref("xpinstall.dialog.progress.type.chrome", "Extension:Manager-extensions");
+pref("extensions.update.enabled", true);
+pref("extensions.update.interval", 86400);
+pref("extensions.dss.enabled", false);
+pref("extensions.dss.switchPending", false);
+pref("extensions.ignoreMTimeChanges", false);
+pref("extensions.logging.enabled", false);
+pref("general.skins.selectedSkin", "classic/1.0");
+// NB these point at AMO
+pref("extensions.update.url", "chrome://mozapps/locale/extensions/e...ons.properties");
+pref("extensions.getMoreExtensionsURL", "chrome://mozapps/locale/extensions/e...ons.properties");
+pref("extensions.getMoreThemesURL", "chrome://mozapps/locale/extensions/e...ons.properties");
+
+

URLs Chrome Utiles

+

La plupart requièrent le " branding" +

+ +
FenêtreURLType de fenêtre +
Gestionnaire d'Extensions +chrome://mozapps/content/extensions/...ype=extensions +Extension:Manager-extensions +
Gestionnaire de Thèmes +chrome://mozapps/content/extensions/...ul?type=themes +Extension:Manager-themes +
Console JavaScript +chrome://global/content/console.xul +global:console +
about:config +chrome://global/content/config.xul + +
+

Extensions pour le Développeur

+

Venkman

+ +
dans votre chrome manifest ajoutez une ligne "skin":
+
+skin communicator classic/1.0 skin/communicator/
+
+ajoutez un dossier de skin "communicator" et une simple CSS nommée "communicator.css" avec ce contenu:
+
+@import url("chrome://global/skin/");
+
+

Inspecteur DOM

+

Idem que Venkman +

+

L'Extension du Developpeur d'Extensions

+

Extension Developer's Extension est un outil utile, avec un Editeur XUL Live et un shell JavaScript. +

Pour installer l'extension dans votre application, vous aurez besoin de modifier son install.rdf (voir ci-dessus). Vous voudrez aussi probablement créer des éléments de menu qui vous laisseront ouvrir le shell Js et les autres outils de cette extension. +

+

Autre méthode

+

Une autre méthode pour faire fonctionner Venkman et EDE [en]sur ce blog +

+

Branding

+

Branding est un packetage chrome qui contient des informations spécifiques au produit (ex: nom, créateur, logo). +

Quelques composants XULRunner (en particulier le Gestionnaire d'Extensions) dépendent du branding car ils cherchent certaines chaines dans <tt>chrome://branding/locale/brand.dtd</tt> et <tt>chrome://branding/locale/brand.properties</tt>. +

Pour satisfaire ces dépendances, vous pouvez copier depuis Firefox <tt>brand.dtd</tt>/<tt>brand.properties</tt> vers <tt>chrome/locale/branding</tt>, les modifier en conséquence, et enregistrer la localisation pour <tt>branding</tt> en ajoutant à votre manifest chrome: +

+
locale branding fr-FR chrome/locale/branding/
+
+

La localisation que vous mettez dans les fichiers de branding n'importe pas du moment que c'est elle qui est présente dans le manifest. +

En addition, un branding content package (traduction requise) doit être enregistré pour inclure le logo de l'application: +

+
content branding chrome/branding
+
+

2 icônes doivent être fournies dans ce dossier: icon48.png and icon64.png. Voir Firefox pour avoir un exemple. +

commentaire copié de la version anglaise: In ''~.mozconfig'': ac_add_options --enable-branding=« branding location » +

+

[Windows] Faire apparaitre correctement le nom et l'icône

+

Par défaut, la barre de tâches de Windows grouppe les fenêtres appartenant au même processus dans un seul bouton pour gagner de la place. ce bouton est souvent appelé "xulrunner.exe" et a l'icône de XULRunner. Il y a deux méthodes pour afficher la bonne dénomination ( = branding) de votre application à la place: +

+ +

Lire les arguments en ligne de commande

+

Les arguments en ligne de commande sont gérés par nsICommandLineHandler. +

commentaire copié depuis la version anglaise: = Can i have JavaScript errors / warnings directed to stdout instead of the jsconsole? = See #306263 This doesn't do anything (1.8.0.1): xulrunner -app application.ini -console This neither (1.8.0.1) in ''defaults/preferences/«application name».js'': pref("javascript.options.strict", true); pref("javascript.options.showInConsole", true); pref("browser.dom.window.dump.enabled", true); +


+

+

Préférences requises pour les dialogues de téléchargement

+

Pour utiliser le unknown-content-type et le dialogue file-downloads depuis un élément <browser>, vous devez ajouter les préférences suivantes: +

+
pref("browser.download.useDownloadDir", true);
+pref("browser.download.folderList", 0);
+pref("browser.download.manager.showAlertOnComplete", true);
+pref("browser.download.manager.showAlertInterval", 2000);
+pref("browser.download.manager.retention", 2);
+pref("browser.download.manager.showWhenStarting", true);
+pref("browser.download.manager.useWindow", true);
+pref("browser.download.manager.closeWhenDone", true);
+pref("browser.download.manager.openDelay", 0);
+pref("browser.download.manager.focusWhenStarting", false);
+pref("browser.download.manager.flashCount", 2);
+//
+pref("alerts.slideIncrement", 1);
+pref("alerts.slideIncrementTime", 10);
+pref("alerts.totalOpenTime", 4000);
+pref("alerts.height", 50);
+
+

Si vous en oubliez, vous aurez l'erreur suivante: +

+
Component returned failure code: 0x8000ffff (NS_ERROR_UNEXPECTED) [nsIPrefBranch.getBoolPref]
+
+Error: dialog has no properties
+Source File: chrome://mozapps/content/downloads/u...ontentType.xul
+Line: 1
+
+

Activer le Gestionnaire de Mots de Passe

+

Ces préférences sont par défaut dans Firefox mais pas dans XULRunner. Sans elles, le gestionnaire de mots de passe ne retiendra pas les détails d'identification. +

+
pref("signon.rememberSignons", true);
+pref("signon.expireMasterPassword", false);
+pref("signon.SignonFileName", "signons.txt");
+
+

Vous avez aussi besoin d'obtenir une instance du service login-manager, qui initialise le système en interne: +

+
Components.classes["@mozilla.org/login-manager;1"].getService(Components.interfaces.nsILoginManager);
+
+

Utiliser Firefox 3 pour lancer des applications XULRunner

+

Firefox 3 contient le runtime XULRunner avec l'option <tt>-app</tt> en ligne de commandes pour lancer l'application XUL désirée au lieu de Firefox. Par exemple, sous Windows: +

+
  firefox.exe -app chemin\vers\application.ini
+
+

Sous Mac: +

+
  /Applications/Firefox.app/Contents/MacOS/firefox-bin -app /chemin/vers/application.ini
+
+

Notez que sous Mac, vous devez donner un chemin direct. Les chemins relatifs semblent ne pas marcher. +

+

Résolution de problèmes

+

Titre de fenêtre manquant

+

Si le titre de votre <window> XUL est vierge, même en spécifiant un attribut title vérifiez que votre fichier XUL est en <tt>.xul</tt> et non pas <tt>.xml</tt>. +

+
+
diff --git a/files/fr/archive/mozilla/xulrunner/ce_qu'offre_xulrunner/index.html b/files/fr/archive/mozilla/xulrunner/ce_qu'offre_xulrunner/index.html new file mode 100644 index 0000000000..8130eeece0 --- /dev/null +++ b/files/fr/archive/mozilla/xulrunner/ce_qu'offre_xulrunner/index.html @@ -0,0 +1,67 @@ +--- +title: Ce qu'offre XULRunner +slug: Archive/Mozilla/XULRunner/Ce_qu'offre_XULRunner +tags: + - XUL + - XULRunner +translation_of: Archive/Mozilla/XULRunner/What_XULRunner_Provides +--- +

 

+

L'objectif de XULRunner est d'offrir une solution pour le déploiement d'applications XUL (en priorité Firefox et Thunderbird), ainsi qu'un mécanisme pour embarquer les capacités des produits Mozilla dans d'autres applications. Les fonctionnalités suivantes sont soit déjà implémentées, soit planifiées :

+

 

+

Fonctionnalités Gecko

+ +

Fonctionnalités d'interface utilisateur

+

Les interfaces utilisateur suivantes sont fournies par XULRunner, mais peuvent être outrepassées dans certaines circonstances :

+ +

APIs embarquées

+

Les APIs embarquées suivantes sont fournies par XULRunner :

+ +

En projet

+

Les fonctionnalités suivantes ont été proposées à l'intégration et pourront l'être si les développeurs en ont le temps, et si la taille du code est raisonnable :

+ +

Non supporté

+

XULRunner n'intégrera pas :

+ +


+ Interwiki Language Links

+

diff --git "a/files/fr/archive/mozilla/xulrunner/d\303\251ploiement_de_xulrunner_1.8/index.html" "b/files/fr/archive/mozilla/xulrunner/d\303\251ploiement_de_xulrunner_1.8/index.html" new file mode 100644 index 0000000000..d2e38696e4 --- /dev/null +++ "b/files/fr/archive/mozilla/xulrunner/d\303\251ploiement_de_xulrunner_1.8/index.html" @@ -0,0 +1,157 @@ +--- +title: Déploiement de XULRunner 1.8 +slug: Archive/Mozilla/XULRunner/Déploiement_de_XULRunner_1.8 +tags: + - XUL + - XULRunner +translation_of: Archive/Mozilla/XULRunner/Deploying_XULRunner +--- +

XULRunner 1.8 est une pré-version stable pour les développeurs. Cela signifie que même si certaines parties de cette version ne sont pas finalisées, comme le déploiement, l'intégration à d'autres applications et au système d'exploitation, elle peut déjà servir aux développeurs pour la création d'applications XUL autonomes. Ce document explique comme ce déploiement doit être réalisé.

+

Windows

+

Sous Windows, XULRunner ne dispose pas encore de solution d'installation intégrée ; les développeurs d'applications doivent utiliser des solutions existantes pour disposer d'un installeur Windows. Les fichiers installés doivent être disposés selon la structure de répertoires suivante :

+ +

Mac OS X

+

Sous Mac OS X, l'ensemble du framework de XULRunner est placé dans le paquetage de votre application :

+ +

De plus, votre application Mac ne se lancera pas sans un fichier + + Info.plist + valide. En voici un exemple :

+
<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple Computer//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>CFBundleDevelopmentRegion</key>
+	<string>English</string>
+	<key>CFBundleExecutable</key>
+	<string>xulrunner</string>
+	<key>CFBundleGetInfoString</key>
+	<string>1.0</string>
+	<key>CFBundleIconFile</key>
+	<string>app_icon.icns</string>
+	<key>CFBundleIdentifier</key>
+	<string>net.yourcompany.yourapplication</string>
+	<key>CFBundleInfoDictionaryVersion</key>
+	<string>6.0</string>
+	<key>CFBundleName</key>
+	<string>applicationName</string>
+	<key>CFBundlePackageType</key>
+	<string>APPL</string>
+	<key>CFBundleShortVersionString</key>
+	<string>1.0</string>
+	<key>CFBundleSignature</key>
+	<string>YOURAPP</string>
+	<key>CFBundleURLTypes</key>
+	<array>
+		<dict>
+			<key>CFBundleURLIconFile</key>
+			<string>app_icon.icns</string>
+			<key>CFBundleURLName</key>
+			<string>YOURAPP Entity</string>
+			<key>CFBundleURLSchemes</key>
+			<array>
+				<string>chrome</string>
+			</array>
+		</dict>
+	</array>
+	<key>CFBundleVersion</key>
+	<string>1.0</string>
+</dict>
+</plist>
+

Éditez cet exemple selon vos besoins, mais CFBundleExecutable doit être + + xulrunner + , et CFBundleIconFile et CFBundleURLIconFile doivent être définis avec le nom de fichier de l'icône de votre application ( + + app_icon.icns + ).

+

Linux

+

La plupart des applications Linux sont distribuées comme de simples archives .tar.bz2 que l'utilisateur peut décompresser où il le désire. L'archive doit être structurée comme ceci :

+ diff --git a/files/fr/archive/mozilla/xulrunner/empaqueter_une_application_xul/index.html b/files/fr/archive/mozilla/xulrunner/empaqueter_une_application_xul/index.html new file mode 100644 index 0000000000..4efbb6183f --- /dev/null +++ b/files/fr/archive/mozilla/xulrunner/empaqueter_une_application_xul/index.html @@ -0,0 +1,74 @@ +--- +title: Empaqueter une application XUL +slug: Archive/Mozilla/XULRunner/Empaqueter_une_application_XUL +tags: + - XUL + - XULRunner +translation_of: Archive/Mozilla/XULRunner/XUL_Application_Packaging +--- +

Les paquets d'application XULRunner sont des paquets standard du toolkit (comme les extensions Firefox), avec un fichier manifest en plus (application.ini) qui décrit l'application. Les paquets d'application sont généralement compressées au format zip dans une archive avec l'extension .xulapp ou .xpi. Ils peuvent être installés avec la ligne de commande XULRunner "-install-app" (voir les Notes de versions de XULRunner 1.8.0.4 (à traduire de en:XULRunner_1.8.0.4_Release_Notes)).

+ +

application.ini

+ +

Le fichier manifest application.ini se trouve à la racine de le l'extension et fournit les metadonnées pour permettre au XULRunner de lancer correctement l'application. Il est analysé comme un fichier style INI windows avec le couple 'Headings' et Key=Value. Les lignes commençant par ; ou # sont traités comme des commentaires.

+ +

Vous pouvez trouver un exemple de application.ini dans le code source de Mozilla.

+ +

Section [App]

+ +

La partie App spécifie les metadonnées sur l'application

+ +
+
Name
+
Indique le nom de l'application.
+ REQUIS
+ Exemple : Name=TestApplication
+
Version
+
Indique la version de l'application
+ REQUIS
+ Voir Format de version du toolkit pour les détails sur le numérotage des versions
+ Exemple : Version=0.1
+
BuildID
+
Indique un identifiant de compilation unique. Il s'agit généralement d'un identifiant temporel, devrait être différent pour chaque version publiée de l'application.
+ REQUIS
+ Exemple : BuildID=20060201
+
ID
+
Spécifie un l'identifiant unique de l'application
+ REQUIS
+ L'ID de l'application, comme les IDs d'extensions, peuvent être formés soit comme un email ApplicationName@vendor.tld ou comme un UUID (Universal Unique Identifier) {12345678-1234-1234-1234-123456789abc}. Le format email est préférable pour les nouveaux développements d'application.
+ Exemple: ID=TestApplication@example.tld
+
Vendor
+
Indique le vendeur de l'application
+ OPTIONNEL
+ Exemple : Vendor=Grinch Productions
+
+ +

Section [Gecko]

+ +

La partie Gecko spécifie quelle version de XULRunner est requise par l'application.

+ +
+
MinVersion
+
Indique la version minimale de XULRunner requise pour l'application.
+ REQUIS
+ Exemple : MinVersion=1.8
+
MaxVersion
+
Indique la version maximum de XULRunner dont l'application à besoin.
+ OPTIONNEL - la valeur par défaut correspond à n'importe quelle version de XULRunner inférieure à XULRunner 2
+ Exemple : MaxVersion=1.8.0.*
+
+ +

Section [XRE]

+ +

La section XRE spécifie diverses caractéristiques possibles du démarrage de XULRunner.

+ +
+
EnableExtensionManager
+
Spécifie si les extensions sont activées. Il peut prendre la valeur 1 ou 0.
+ OPTIONNEL - La valeur par défaut est 0
+ Exemple : EnableExtensionManager=1
+
EnableProfileMigrator</dt>
+
Spécifie si, quand l'application est lancée pour la première fois et qu'il n'y a pas de profils, le code de migration de profil doit être activé par l'interface nsIProfileMigrator. Les valeurs possibles sont 1 et 0.
+ OPTIONNEL - La valeur par défaut est 0
+ Exemple : EnableProfileMigrator=1
+
diff --git a/files/fr/archive/mozilla/xulrunner/faq_de_xulrunner/index.html b/files/fr/archive/mozilla/xulrunner/faq_de_xulrunner/index.html new file mode 100644 index 0000000000..e803a9af7a --- /dev/null +++ b/files/fr/archive/mozilla/xulrunner/faq_de_xulrunner/index.html @@ -0,0 +1,23 @@ +--- +title: FAQ de XULRunner +slug: Archive/Mozilla/XULRunner/FAQ_de_XULRunner +tags: + - XUL + - XULRunner +translation_of: Archive/Mozilla/XULRunner/FAQ +--- +

 

+

Cette page a pour but de répondre à des questions fréquemment posées et de corriger des idées fausses courantes sur XULRunner.

+
Est-ce que XULRunner est un navigateur ?
Non. Vous pouvez utiliser XULRunner pour créer un navigateur (exemple mybrowser ou Firefox), mais il n'existe pas (et n'existera jamais) de « navigateur XULRunner ».
+
+
Est-ce que XULRunner est un outil de développement ?
Pas particulièrement ; XULRunner est une technologie de moteur d'exécution Internet. XULRunner peut servir à créer des outils de développement (le framework toolkit AJAX par exemple). À l'avenir, des kits de développement XULRunner seront proposés avec divers outils de développement.
+
+
Comment comparer XULRunner à d'autres moteurs d'exécution comme Java ou .NET (ou Python ou ...) ?
Le but de XULRunner est de faciliter le développement et le déploiement d'applications Internet. Il n'est pas destiné à être un environnement d'exécution universel ; ceci permet à XULRunner de rester compact et d'offrir une stratégie de déploiement plus simple que les environnements génériques.
+
+
Si j'utilise XULRunner, dois-je écrire mes applications en XUL ?
Non ! Vous pouvez écrire votre application dans n'importe quel langage supporté par la plateforme Web de Mozilla, dont HTML, XHTML, SVG, or XUL.
+
+
Pourquoi est-il appelé XULRunner, plutôt que HTMLRunner ou quelque chose de ce genre ?
Le nom n'est pas arrêté. D'autres noms peuvent être proposés au développeur en chef Benjamin Smedberg.
+
+
Quand Firefox sera-t-il basé sur XULRunner ?
Consultez la feuille de route de XULRunner. C'est prévu pour Firefox 3 (et XULRunner 1.9) vers la fin 2007.
+
+

diff --git "a/files/fr/archive/mozilla/xulrunner/floril\303\250ge_des_applications_xulrunner/index.html" "b/files/fr/archive/mozilla/xulrunner/floril\303\250ge_des_applications_xulrunner/index.html" new file mode 100644 index 0000000000..d95b17e186 --- /dev/null +++ "b/files/fr/archive/mozilla/xulrunner/floril\303\250ge_des_applications_xulrunner/index.html" @@ -0,0 +1,79 @@ +--- +title: Florilège des applications XULrunner +slug: Archive/Mozilla/XULRunner/Florilège_des_applications_XULrunner +tags: + - Entreprise + - XUL + - XULRunner +translation_of: Archive/Mozilla/XULRunner/Hall_of_Fame +--- +

Cette page liste les applications XULRunner existantes.

+

Applications XULRunner

+
ChatZilla
Une version autonome du client IRC ChatZilla.
+
+
Clines
Un clone de Color Lines (jeu)
+
+
CocoaPSYC.app
Un client IM/Chat PSYC pour Mac OS X (également disponible en extension pour Firefox).
+
+
Convertigo Enterprise Mashup Server
Un outil pour intégrer des applications WEB sous forme de services Web SOAP ou pour les « clippers » afin de construire des « mashups » en entreprise.
+
+
DAIM
Un superbe outil d'analyse d'images, utilisant une bibliothèque d'images professionnelle.
+
+
eMusic Remote
Le gestionnaire de téléchargement pour la plate-forme eMusic.
+
+
Evergreen - Staff Client
Evergreen est une bibliothèque système libre.
+
+
FindThatFont!
Outil de gestion de fonte pour Microsoft Windows et Linux, qui permet de rechercher une fonte particulière.
+
+
GencatRss
Un gestionnaire de flux RSS.
+
+
Google AdWords Editor
AdWords Editor est une application locale de gestion des comptes Google.
+
+
IDA
Système de publication E-Learning pour créer facilement des applications d'apprentissage sur le Web.
+
+
Joost (précédemment dénommé The Venice Project)
Un application TV Internet. La compagnie aim veut combiner le meilleur des fonctionnalités de la télévision avec celles d'Internet.
Kiwix
Une application pour avoir accès à Wikipédia, où encore à la document d'Ubuntu, hors-ligne.
+
+
Kirix Strata
Un nouveau navigateur spécialise pour accéder et manipuler des données à partir du Web.
+
+
Lotus Notes / Sametime
Les dernières version de Lotus Notes et de Sametime d'IBM peuvent embarquées des applications XUL.
+
+
Mango
Un client Jabber.
+
+
Miro
Lecteur et navigateur TV sur Internet.
+
+
Plain Old Webserver
Un serveur Web pleinement fonctionnel qui exécute du code JavaScript côté serveur.
+
+
Songbird
Un lecteur audio.
+
+
TeleKast
TeleKast fournit des éditeurs de scripts, de documents Web et de kiosk. Il comprend aussi un téléprompteur. Le téléprompteur, éditeur de documents Web et kiosk utilisent des scripts permettant de communiquer facilement.
+
+
TomTom HOME 2
Application PC pour gérer les périphériques GPS TomTom.
+
+
WengoPhone
Un client IM/VoIP basé sur SIP/XMPP.
Yoono Desktop
Application PC/Mac pour gérer et suivre vos réseaux sociaux et vos messageries instantanées (support de : Facebook, Twitter, MySpace, FriendFeed, Flickr, iMeem, MSN Live Messenger, Yahoo Messenger, AIM, GTalk).
+
+
Embed XULRunner in Java
+
+

Utilitaires / Prototypes

+
Exemples XULRunner de Benjamin
« mybrowser est un exemple de navigateur simple », xulmine
+
+
30b
Un wrapper à base de XULRunner pour 30boxes.com
+
+
AJAX Toolkit Framework (ATF)
A part of the Eclipse Web Tools Platform (WTP)
+
+
Crowbar
Un environnement Web simplifié basé sur l'utilisation d'un navigateur basé sur Mozilla côté serveur.
+
+
Exch
Un outil de conversion des devises utilisant des données mises à jour depuis le site http://finance.yahoo.com/currency. Vous pouvez utiliser l'extension Firefox ou la version autonome.
+
+
Foxkeh Clock (ja)
Une horlage mettant en scène le personnage Foxkeh.
+
+
Visualiseur OpenDocument
Visualiseur de documents OpenDocument multiplate-forme.
+
+
SVGclock
Une horloge en SVG.
+
+
TaskPool
TaskPool est une petite application de gestion du temps. Elle vous permet d'ajouter des tâches à une liste de chose à faire, de les activer ou de les désactiver, et elle décomptera les secondes.
+
+
XUL Explorer
« Un IDE XUL légère… un moyen facile et rapide de développer avec XUL »
+
+
Prims (précédemment WebRunner)
Un navigateur spécifique à un site en particulier. Il permet de lancer une application Web telle que Gmail dans un processus indépendant de celui du navigateur.
+
+

diff --git a/files/fr/archive/mozilla/xulrunner/index.html b/files/fr/archive/mozilla/xulrunner/index.html new file mode 100644 index 0000000000..4f72cf88ec --- /dev/null +++ b/files/fr/archive/mozilla/xulrunner/index.html @@ -0,0 +1,118 @@ +--- +title: XULRunner +slug: Archive/Mozilla/XULRunner +tags: + - XUL + - XULRunner +translation_of: Archive/Mozilla/XULRunner +--- +
XULRunner tutorial
+Une courte introduction à XULRunner.
+ +
XULRunner est un environnement d'exécution installable pouvant gérer des applications XUL+XPCOM aussi riches que Firefox et Thunderbird. Il fournit des mécanismes permettant d'installer, de mettre à jour et de désinstaller des applications. XULRunner fournira également libxul, une solution permettant d'embarquer les technologies Mozilla dans d'autres projets et produits.
+ + + + + + + + +
+

Téléchargements

+ +
+

XULRunner est disponible sur ftp.mozilla.org. Veuillez consulter les notes de version pour l'installation, la désinstallation et d'autres informations.

+ +

Firefox 3 est distribué avec un paquet XULRunner privé, qui peut exécuter toute application compatible XULRunner à l'aide du paramètre de commande -app.

+ +

Des versions plus anciennes sont également disponibles.

+
+ +

Aperçu

+ + + +

Documentation

+ +
+
Guide XULRunner
+
Une introduction assez complète et un tutoriel pour XULRunner qui regroupe la plupart des informations disponibles ici.
+
+ +
+
Exemples d'applications
+
Quelques exemples simples d'applications XULRunner qui peuvent être copiés.
+
+ +
+
A XULRunner Tutorial
+
Une courte introduction à XULRunner.
+
+ +
+
Astuces XULRunner
+
Une collection d'astuces pour travailler avec XULRunner.
+
+ +
+
Déploiement de XULRunner
+
Cet article décrit comment déployer des applications autonomes XUL dans un environnement de production.
+
+ +
+
Florilège des applications XULrunner
+
Suivi des applications disponibles basées sur XULRunner.
+
+ +
+
Documentation sur la compilation
+
Découvrez comment obtenir le code source et le compiler.
+
+ +
+
 
+
Étapes de configuration de Venkman pour déboguer votre application.
+
+ +
+
Documentation de débogage
+
+ +

Tous les articles…

+ 		+

Communauté

+ +
    +
  • Voir les forums de Mozilla…
    • +
+ +

+ + + +

Sujets liés

+ +
+
XUL
+
+
+ +

Categories

+ +

Interwiki Language Links

diff --git a/files/fr/archive/mozilla/xulrunner/notes_de_versions_de_xulrunner_1.8.0.4/index.html b/files/fr/archive/mozilla/xulrunner/notes_de_versions_de_xulrunner_1.8.0.4/index.html new file mode 100644 index 0000000000..83087ff904 --- /dev/null +++ b/files/fr/archive/mozilla/xulrunner/notes_de_versions_de_xulrunner_1.8.0.4/index.html @@ -0,0 +1,90 @@ +--- +title: Notes de versions de XULRunner 1.8.0.4 +slug: Archive/Mozilla/XULRunner/Notes_de_versions_de_XULRunner_1.8.0.4 +tags: + - XUL + - XULRunner +translation_of: Archive/Mozilla/XULRunner/1.8.0.4 +--- +

XULRunner 1.8.0.4 est une version stable pour les développeurs de l'environnement d'éxécution Mozilla XULRunner. Il remplace la version 1.8.0.1 ; tous les utilisateurs devraient mettre à jour leur version. Il permet de lancer des applications XUL autonomes, et d'embarquer des API qui permettent d'avoir un rendu de pages Web dans des applications natives ou Java. +

+

Configuration système minimum

+

Avant installation, vérifiez que votre ordinateur répond aux exigences système minimales (en). Ces exigences sont les mêmes pour XULRunner et pour Firefox. +

+

Installation de XULRunner

+

Mozilla propose XULRunner pour Windows, Mac OS X et Linux, uniquement en anglais : +

+ +

Frenchmozilla propose sur son site une version française de XULRunner 1.8.0.4 pour ces trois plateformes. +

+

Windows

+ +

Mac OS X

+ +

Linux

+ +

Désinstallation de XULRunner

+

Windows/Linux

+ +

Mac OS X

+

Si vous disposez de plusieurs versions installées de XULRunner sous Mac OS X, il n'est pas possible d'en désinstaller une seule. +

+ +

Installation d'applications XUL

+

Les applications XUL peuvent être obtenues de différentes sources, et sont habituellement livrées sous forme d'archive ZIP portant une extension <tt>.xulapp</tt> ou <tt>.xpi</tt>. Quelques applications sont disponibles depuis le Mozilla Developer Center. +

+ +

Windows

+

Lancez la commande suivantes depuis Menu > Exécutez ou depuis une invite de commande : +

+
"C:\Program Files\Mozilla XULRunner\1.8.0.4\xulrunner\xulrunner.exe" --install-app "C:\Documents and Settings\nomUtilisateur\Bureau\monApplication.xpi"
+
+

L'application sera installée dans <tt>C:\Program Files\NomVendeur\NomApplication</tt> +

+

Mac OS X

+

Lancez la commande suivante dans une invite de commande : +

+
/Library/Frameworks/XUL.framework/xulrunner-bin --install-app ~/Bureau/monApplication.xpi
+
+

L'application sera installée dans <tt>/Applications/nomVendeur/nomApplication</tt> +

+

Linux

+

Lancez la commande suivante dans une invite de commande : +

+
/opt/xulrunner/1.8.0.4/xulrunner/xulrunner --install-app ~/Desktop/monApplication.xpi
+
+

L'application sera installée dans <tt>/usr/lib/nomVendeur/nomApplication</tt> +

+

Problèmes connus

+ +

Foires aux questions

+

+
Pourquoi l'installation de XULRunner est-il aussi pénible ? Pourquoi n'y a-t-il pas un joli installeur ? +
Parce que personne n'en a encore écrit le code ! Il s'agit d'une version préalable pour les développeurs : des fonctionnalités supplémentaires pour l'installation et le déploiement de XULRunner et des applications basées sur XULRunner seront disponibles dans les futures versions. +

J'ai écrit une application XUL, comment puis-je la déployer chez mes utilisateurs ? +
Pour l'instant, Mozilla recommande que XULRunner soit déployé individuellement avec chaque application. Consultez Déploiement de XULRunner 1.8 pour plus d'information. +

Où est le code source ? +
Ici. +

Je pense avoir trouvé un bogue, comment puis-je le signaler ? +
bugzilla.mozilla.org sert à traquer les bogues de tous les produits Mozilla. Assurez-vous s'il vous plait que votre bogue n'est pas déjà connu avant de le poster, en utilisant la fonction de recherche. +

Comment puis-je aider ? +
Si vous souhaitez participer à XULRunner sans savoir par où débuter, visitez la page XULRunner:Communauté et posez vos questions sur les newsgroups ou sur le canal IRC. +
+

Interwiki Language Links +

+
+
diff --git a/files/fr/archive/mozilla/xulrunner/notes_de_versions_de_xulrunner_1.9/index.html b/files/fr/archive/mozilla/xulrunner/notes_de_versions_de_xulrunner_1.9/index.html new file mode 100644 index 0000000000..3e2e5b6e1b --- /dev/null +++ b/files/fr/archive/mozilla/xulrunner/notes_de_versions_de_xulrunner_1.9/index.html @@ -0,0 +1,137 @@ +--- +title: Notes de versions de XULRunner 1.9 +slug: Archive/Mozilla/XULRunner/Notes_de_versions_de_XULRunner_1.9 +tags: + - XUL + - XULRunner +translation_of: Archive/Mozilla/XULRunner/1.9 +--- +

XULRunner 1.9 est uneversion stable de l'environnement d'exécution Mozilla XULRunner. Il remplace la version 1.8.0.4 ; tous les utilisateurs devraient mettre à jour leur version. Il permet de lancer des applications XUL autonomes, et d'embarquer des API qui permettent d'avoir un rendu de pages Web dans des applications natives ou Java. XULRunner 1.9 est basé sur les mêmes sources que Firefox 3.

+ +

Configuration système minimum

+ +

Avant installation, vérifiez que votre ordinateur répond aux exigences système minimales (en). Ces exigences sont les mêmes pour XULRunner et pour Firefox.

+ +

Installation de XULRunner

+ +

Mozilla propose XULRunner pour Windows, Mac OS X et Linux, uniquement en anglais :

+ + + +

Frenchmozilla propose sur son site une version française de XULRunner 1.9 pour ces trois plateformes.

+ +

Windows

+ + + +

Mac OS X

+ + + +

Linux

+ + + +

Désinstallation de XULRunner

+ +

Windows/Linux

+ + + +

Mac OS X

+ +

Si vous disposez de plusieurs versions installées de XULRunner sous Mac OS X, il n'est pas possible d'en désinstaller une seule.

+ + + +

Installation d'applications XUL

+ +

Les applications XUL peuvent être obtenues de différentes sources, et sont habituellement livrées sous forme d'archive ZIP portant une extension .xulapp ou .xpi. Quelques applications sont disponibles depuis le Mozilla Developer Center.

+ + + +

Windows

+ +

Lancez la commande suivantes depuis le menuDémarrer → Exécuter ou depuis une invite de commandes :

+ +
"C:\Program Files\Mozilla XULRunner\1.9\xulrunner\xulrunner.exe" --install-app "C:\Documents and Settings\nomUtilisateur\Bureau\monApplication.xpi"
+
+ +

L'application sera installée dans C:\Program Files\NomVendeur\NomApplication

+ +

Mac OS X

+ +

Lancez la commande suivante dans une invite de commandes :

+ +
/Library/Frameworks/XUL.framework/xulrunner-bin --install-app ~/Bureau/monApplication.xpi
+
+ +

L'application sera installée dans /Applications/nomVendeur/nomApplication

+ +

Linux

+ +

Lancez la commande suivante dans une invite de commandes :

+ +
/opt/xulrunner/1.9/xulrunner/xulrunner --install-app ~/Desktop/monApplication.xpi
+
+ +

L'application sera installée dans /usr/lib/nomVendeur/nomApplication

+ +

Problèmes connus

+ + + +

Foire aux questions

+ +

 

+ +
+
Pourquoi l'installation de XULRunner est-elle aussi pénible ? Pourquoi n'y a-t-il pas un joli installeur ?
+
Parce que personne n'en a encore écrit le code ! Des fonctionnalités supplémentaires pour l'installation et le déploiement de XULRunner et des applications basées sur XULRunner seront disponibles dans les futures versions. +

 

+
+
J'ai écrit une application XUL, comment puis-je la déployer chez mes utilisateurs ?
+
Pour l'instant, Mozilla recommande que XULRunner soit déployé individuellement avec chaque application. Consultez Déploiement de XULRunner pour plus d'informations. +

 

+
+
Où est le code source ?
+
Ici. +

 

+
+
Où est le SDK ?
+
Là. +

 

+
+
Je pense avoir trouvé un bogue, comment puis-je le signaler ?
+
bugzilla.mozilla.org sert à traquer les bogues de tous les produits Mozilla. Assurez-vous s'il vous plait que votre bogue n'est pas déjà connu avant de le poster, en utilisant la fonction de recherche. +

 

+
+
Comment puis-je aider ?
+
Si vous souhaitez participer à XULRunner sans savoir par où débuter, visitez la page XULRunner:Communauté et posez vos questions sur les newsgroups ou sur le canal IRC.
+
+ +
 
+ +

diff --git a/files/fr/archive/mozilla/xulrunner/xulrunner_anciennes_versions/index.html b/files/fr/archive/mozilla/xulrunner/xulrunner_anciennes_versions/index.html new file mode 100644 index 0000000000..afd9b3fd26 --- /dev/null +++ b/files/fr/archive/mozilla/xulrunner/xulrunner_anciennes_versions/index.html @@ -0,0 +1,26 @@ +--- +title: XULRunner/Anciennes versions +slug: Archive/Mozilla/XULRunner/XULRunner_Anciennes_versions +tags: + - XUL + - XULRunner +translation_of: Archive/Mozilla/XULRunner/Old_releases +--- +
+
+ Compilations nocturnes de XULRunner 1.9.0.x
+
+ Ces compilations sont effectués depuis la branche stable 1.9.
+
+
+
+ Compilations contribuées par la communauté de XULRunner 1.8.1.3
+
+ Ces compilations sont fournies par la communauté Eclipse ATF et sont prévues pour l'intégration dans d'autres produits (embedding). Les compilations Windows et Linux pourront exécuter des applications XULRunner normales, mais la version Mac utilise des widgets Cocoa et ne pourra donc pas lancer d'applications XULRunner.
+
+
+
+ XULRunner 1.8.0.4
+
+ Il s'agit de la dernière version de démonstration stable pour développeurs de la branche 1.8.0. Elle comporte des trous de sécurité connus et ne devrait pas être utilisée dans des applications traitant du contenu Web public.
+
diff --git a/files/fr/archive/plugins/reference/index.html b/files/fr/archive/plugins/reference/index.html new file mode 100644 index 0000000000..b50c0e6643 --- /dev/null +++ b/files/fr/archive/plugins/reference/index.html @@ -0,0 +1,17 @@ +--- +title: NPAPI plugin reference +slug: Archive/Plugins/Reference +tags: + - Deprecated + - Landing + - NPAPI + - Plugins + - Reference + - TopicStub +translation_of: Archive/Plugins/Reference +--- +

{{deprecated_header}}

+ +

Les articles ci-dessous décrivent chacune des API liées aux plugins NPAPI.

+ +

{{LandingPageListSubpages}}

diff --git a/files/fr/archive/rss/autres_ressources/index.html b/files/fr/archive/rss/autres_ressources/index.html new file mode 100644 index 0000000000..3b45e58d8f --- /dev/null +++ b/files/fr/archive/rss/autres_ressources/index.html @@ -0,0 +1,17 @@ +--- +title: Autres ressources +slug: Archive/RSS/Autres_ressources +tags: + - RSS +translation_of: Archive/RSS/Other_Resources +--- +

 

+

Toutes les autres ressources

+ diff --git "a/files/fr/archive/rss/entit\303\251s/index.html" "b/files/fr/archive/rss/entit\303\251s/index.html" new file mode 100644 index 0000000000..3b0e56f201 --- /dev/null +++ "b/files/fr/archive/rss/entit\303\251s/index.html" @@ -0,0 +1,1379 @@ +--- +title: Entités +slug: Archive/RSS/Entités +tags: + - RSS + - 'RSS:Références' +translation_of: Archive/RSS/Entity_list +--- +

Liste des entités RSS

+ +
+

NOTE: Il existe trois versions différentes incompatibles de RSS 0.91. Il y a Netscape RSS 0.91 (Révision 1) (N 0.91 R1), Netscape RSS 0.91 Révision 3 (N 0.91 R3) et Userland RSS 0.91 (U 0.91). Netscape RSS 0.91 utilise un DTD définissant les 96 entités supplémentaires (Userland RSS 0.91 n'utilise pas cette DTD).

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
EntityDecimalCharacterRSS Version
0.90N 0.91 R1N 0.91 R3U 0.910.920.930.941.02.0
á#á✔✔✔    ? 
Á#Á✔✔✔    ? 
´#´✔✔✔    ? 
â#â✔✔✔    ? 
Â#Â✔✔✔    ? 
æ#æ✔✔✔    ? 
Æ#Æ✔✔✔    ? 
à#à✔✔✔    ? 
À#À✔✔✔    ? 
å#å✔✔✔    ? 
Å#Å✔✔✔    ? 
ã#ã✔✔✔    ? 
Ã#Ã✔✔✔    ? 
ä#ä✔✔✔    ? 
Ä#Ä✔✔✔    ? 
¦¦¦✔✔✔    ? 
ç#ç✔✔✔    ? 
Ç#Ç✔✔✔    ? 
¸#¸✔✔✔    ? 
¢¢¢✔✔✔    ? 
©#©✔✔✔    ? 
¤¤¤✔✔✔    ? 
°#°✔✔✔    ? 
÷#÷✔✔✔    ? 
é#é✔✔✔    ? 
É#É✔✔✔    ? 
ê#ê✔✔✔    ? 
Ê#Ê✔✔✔    ? 
è#è✔✔✔    ? 
È#È✔✔✔    ? 
ð#ð✔✔✔    ? 
Ð#Ð✔✔✔    ? 
ë#ë✔✔✔    ? 
Ë#Ë✔✔✔    ? 
½#½✔✔✔    ? 
¼#¼✔✔✔    ? 
¾#¾✔✔✔    ? 
í#í✔✔✔    ? 
Í#Í✔✔✔    ? 
î#î✔✔✔    ? 
Î#Î✔✔✔    ? 
¡¡¡✔✔✔    ? 
ì#ì✔✔✔    ? 
Ì#Ì✔✔✔    ? 
¿#¿✔✔✔    ? 
ï#ï✔✔✔    ? 
Ï#Ï✔✔✔    ? 
«#«✔✔✔    ? 
¯#¯✔✔✔    ? 
µ#µ✔✔✔    ? 
·#·✔✔✔    ? 
   ✔✔✔    ? 
¬#¬✔✔✔    ? 
ñ#ñ✔✔✔    ? 
Ñ#Ñ✔✔✔    ? 
ó#ó✔✔✔    ? 
Ó#Ó✔✔✔    ? 
ô#ô✔✔✔    ? 
Ô#Ô✔✔✔    ? 
ò#ò✔✔✔    ? 
Ò#Ò✔✔✔    ? 
ª#ª✔✔✔    ? 
º#º✔✔✔    ? 
ø#ø✔✔✔    ? 
Ø#Ø✔✔✔    ? 
õ#õ✔✔✔    ? 
Õ#Õ✔✔✔    ? 
ö#ö✔✔✔    ? 
Ö#Ö✔✔✔    ? 
#✔✔✔    ? 
£££✔✔✔    ? 
±#±✔✔✔    ? 
»#»✔✔✔    ? 
®#®✔✔✔    ? 
§#§✔✔✔    ? 
­#­✔✔✔    ? 
¹#¹✔✔✔    ? 
²#²✔✔✔    ? 
³#³✔✔✔    ? 
ß#ß✔✔✔    ? 
þ#þ✔✔✔    ? 
Þ#Þ✔✔✔    ? 
×#×✔✔✔    ? 
ú#ú✔✔✔    ? 
Ú#Ú✔✔✔    ? 
û#û✔✔✔    ? 
Û#Û✔✔✔    ? 
ù#ù✔✔✔    ? 
Ù#Ù✔✔✔    ? 
¨#¨✔✔✔    ? 
ü#ü✔✔✔    ? 
Ü#Ü✔✔✔    ? 
ý#ý✔✔✔    ? 
Ý#Ý✔✔✔    ? 
¥¥¥✔✔✔    ? 
ÿ#ÿ✔✔✔    ? 
diff --git a/files/fr/archive/rss/index.html b/files/fr/archive/rss/index.html new file mode 100644 index 0000000000..4c298461f8 --- /dev/null +++ b/files/fr/archive/rss/index.html @@ -0,0 +1,70 @@ +--- +title: RSS +slug: Archive/RSS +tags: + - RSS +translation_of: Archive/RSS +--- +
Premiers pas
+Ce tutoriel vous guidera pour débuter avec RSS.
+ +
RSS (Really Simple Syndication) est un format de données populaire similaire à HTML, basé sur XML et utilisé pour la syndication. RSS a une histoire compliquée et il existe une multitude de versions différentes et incompatibles. (Certaines sont basées sur RDF, mais la plupart utilisent seulement XML) Malgré cela, RSS est aujourd'hui un format très répandu, utilisé pour le suivi d'actualités, de blogs, de radios et de télévisions.
+ +

 

+ + + + + + + + +
+

Documentation

+ +
+
Comptage de vos commentaires avec le module RSS Slash
+
Charles Iliya Krempeaux présente le module RSS Slash, explique pourquoi il est si populaire chez certains et montre comment il sert à compter vos commentaires (à traduire de Why RSS Slash is Popular - Counting Your Comments).
+
+ +
+
Lier vers vos commentaires avec le module RSS Well-Formed Web
+
Charles Iliya Krempeaux présente le module RSS Well-Formed Web, explique pourquoi il est si populaire chez certains et montre comment il sert à lier vos commentaires (à traduire de Why Well-Formed Web RSS Module is Popular - Syndicating Your Comments).
+
+ +
+
The Myth of RSS Compatibility
+
Mark Pilgrim évoque l'histoire chronologique du RSS et détaille les incompatibilités entre chaque version.
+
+ +
+
Atomic RSS
+
Tim Bray explique comment utiliser Atom 1.0 comme micro format et module d'extension pour RSS 2.0 ; en conservant RSS 2.0 pour votre format de syndication mais en y apportant certains éléments d'Atom 1.0.
+
+ +

Tous les articles…

+ 		+

Communauté

+ +
    +
  • Voir les forums XML de Mozilla…
    • +
+ +

+ + + +
+
RDF, XML
+
+
+ +

Catégories

+ +

Interwiki Language Links

diff --git a/files/fr/archive/rss/premiers_pas/fonctionnement_de_rss/index.html b/files/fr/archive/rss/premiers_pas/fonctionnement_de_rss/index.html new file mode 100644 index 0000000000..d6d8601ddc --- /dev/null +++ b/files/fr/archive/rss/premiers_pas/fonctionnement_de_rss/index.html @@ -0,0 +1,21 @@ +--- +title: Fonctionnement de RSS +slug: Archive/RSS/Premiers_pas/Fonctionnement_de_RSS +tags: + - Premiers_pas + - RSS + - 'RSS:Premiers_pas' +translation_of: Archive/RSS/Getting_Started/How_RSS_Works +--- +

Cette page explique le fonctionnement de RSS. Vous ne créerez pas encore vos propres fichiers RSS, mais vous découvrirez les différents systèmes qui entrent en jeu lors de la syndication RSS.

+ +

Fonctionnement de RSS

+ +

Deux composants principaux entrent en jeu dans la syndication avec RSS : le côtéserveur et le côtéclient.

+ +

Le côtéserveur de la syndication RSS est la partie du système qui produit le flux RSS. Un site d'actualité, une radio ou TV IP se trouvent par exemple du côtéserveur de la syndication.

+ +

Le côtéclient de la syndication RSS est la partie du système qui consomme le flux RSS. Le navigateur Mozilla Firefox, un agrégateur RSS de bureau ou un site d'agrégation se trouvent donc du côtéclient de la syndication.
+

+

« PrécédentSuivant »

+

diff --git a/files/fr/archive/rss/premiers_pas/index.html b/files/fr/archive/rss/premiers_pas/index.html new file mode 100644 index 0000000000..6ea56e5dbf --- /dev/null +++ b/files/fr/archive/rss/premiers_pas/index.html @@ -0,0 +1,56 @@ +--- +title: Premiers pas +slug: Archive/RSS/Premiers_pas +tags: + - Aide_pour_les_éditeurs_de_MDC + - Premiers_pas + - RSS + - 'RSS:Premiers_pas' + - Traduction_en_cours +translation_of: Archive/RSS/Getting_Started +--- +

+

+

Introduction

+

Ce tutoriel est une introduction à la Really Simple Syndication (RSS). +

Il vous guidera pas à pas à travers les bases de RSS à l'aide d'exemples fonctionnels visibles en action. Ce tutoriel suit la philosophie selon laquelle la meilleure manière d'apprendre est de faire. C'est pourquoi vous créerez vos propres fichiers RSS à la main. +

+

À qui est destiné ce tutoriel

+

Ce tutoriel s'adresse surtout aux débutants (c'est-à-dire, ceux qui n'ont que peu ou aucune expérience de RSS). Cependant, ceux qui ont une certaine expérience de RSS peuvent également le trouver utile pour découvrir des informations qu'ils ne connaissaient pas, ou simplement pour se rafraichir la mémoire. +

Ce tutoriel suppose que vous avez une certaine expérience de HTML (ou XML). Que vous connaissez les bases du balisage. En d'autres mots, que ce code vous semble familier : +

+
   Ceci est un morceau de texte avec une balise <b>en gras</b>.
+
+

Si cela ne vous pose pas de problème, vous ne devriez pas en avoir non plus avec l'apprentissage de RSS. +

+
+

NOTE : Si vous n'êtes PAS un développeur Web et ne désirez pas en devenir un, ce tutoriel n'est PAS pour vous. Vous devez être capable de créer un balisage pour utiliser convenablement ce tutoriel. +

+
+

Avant de commencer

+

Pour obtenir le maximum de ce tutoriel, vous aurez besoin d'un éditeur de texte et d'un lecteur RSS. Vous devez également savoir utiliser l'un et l'autre. +

+
+

NOTE : Un traitement de texte n'est pas un éditeur de texte. Si vous utilisez un traitement de texte, vous devez vous assurer qu'il enregistre vos fichiers RSS dans un format texte uniquement (pur et simple). +

+
+

Il n'est pas obligatoire de créer les fichier RSS de ce tutoriel, vous pouvez simplement le parcourir, mais c'est une manière moins efficace d'apprendre. Vous retiendrez mieux les informations si vous créez les fichiers RSS vous-même. +

+

Utilisation de ce tutoriel

+

Bien que chaque page de ce tutoriel aie été écrite de manière à former un petit tutoriel en elle-même, il est entendu que vous avez déjà connaissance des informations présentes dans les parties précédentes du tutoriel. Bien qu'il soit possible de se rendre directement à n'importe quel point du tutoriel, il est vivement suggéré aux nouveaux venus en RSS de lire le tutoriel dans l'ordre proposé. +

+

Tutoriel

+
  1. Présentation de RSS +
  2. Pourquoi utiliser RSS +
  3. Fonctionnement de RSS +
  4. Hello World (à venir) +
  5. Syndication +
  6. Blogs (à venir) +
  7. Broadcatching (à venir) +
  8. Microformats (à venir) +
  9. Advanced Broadcatching (à venir) +
+


+

+
+
diff --git a/files/fr/archive/rss/premiers_pas/pourquoi_utiliser_rss/index.html b/files/fr/archive/rss/premiers_pas/pourquoi_utiliser_rss/index.html new file mode 100644 index 0000000000..f91867a655 --- /dev/null +++ b/files/fr/archive/rss/premiers_pas/pourquoi_utiliser_rss/index.html @@ -0,0 +1,28 @@ +--- +title: Pourquoi utiliser RSS +slug: Archive/RSS/Premiers_pas/Pourquoi_utiliser_RSS +tags: + - Premiers_pas + - RSS + - 'RSS:Premiers_pas' +translation_of: Archive/RSS/Getting_Started/Why_use_RSS +--- +

Cette page explique pourquoi vous pourriez être amené à utiliser RSS. Elle n'explique pas encore comment créer vos propres fichiers RSS, mais présente plusieurs raisons de le faire.

+ +

Pourquoi utiliser RSS ?

+ +

Si vous lisez ces lignes, vous avez probablement déjà vos propres raisons de vouloir utiliser RSS. Il en existe beaucoup, mais les deux raisons que l'on retrouve le plus souvent sont les suivantes :

+ +
    +
  1. RSS correspond à un réel besoin
    2. +
  2. Utiliser RSS fait très tendance, tout le monde le fait
    3. +
+ +

RSS connait un énorme élan de popularité. On l'utilise pour syndiquer toutes sortes de choses : articles de journaux en ligne, blogs, marque-pages, émissions radio IP, émissions TV IP, mises à jour de logiciels, courriels, listes de diffusion, playlists de musique, et bien d'autres. Tout ce qui est régulièrement mis à jour peut être syndiqué avec RSS.

+ +

Les agrégateurs RSS sont partout

+ +

Les logiciels pouvant lire et utiliser RSS sont également partout. Mozilla Firefox gère le RSS à sa façon avec les marque-pages dynamiques. Il y a d'ailleurs trop d'agrégateurs RSS pour les citer tous, qu'ils soient sous la forme d'applications de bureau ou de sites d'agrégation spécialisés. C'est l'une des raisons principales d'utiliser RSS pour la syndication : vos flux RSS pourront être lus par tous ces agrégateurs.
+

+

« PrécédentSuivant »

+

diff --git "a/files/fr/archive/rss/premiers_pas/pr\303\251sentation_de_rss/index.html" "b/files/fr/archive/rss/premiers_pas/pr\303\251sentation_de_rss/index.html" new file mode 100644 index 0000000000..4051f856c8 --- /dev/null +++ "b/files/fr/archive/rss/premiers_pas/pr\303\251sentation_de_rss/index.html" @@ -0,0 +1,255 @@ +--- +title: Présentation de RSS +slug: Archive/RSS/Premiers_pas/Présentation_de_RSS +tags: + - Premiers_pas + - RSS + - 'RSS:Premiers_pas' +translation_of: Archive/RSS/Getting_Started/What_is_RSS +--- +

 

+ +

Cette page explique ce qu'est RSS. Vous n'allez pas créer vos propres fichiers RSS tout de suite, mais vous découvrirez la façon dont RSS est utilisé en général, ainsi que quelques fichiers RSS d'exemples des utilisations les plus courantes. Vous aurez aussi droit à un petit historique à propos de RSS.

+ +

Qu'est ce que RSS ?

+ +

Les versions de RSS les plus populaires sont des langages de balisage basés sur XML utilisés pour la syndication. (Bien qu'il existe des formats RSS basés sur RDF tels que RSS 0.90 et RSS 1.0 qui sont aujourd'hui dépréciés). Les utilisations les plus courantes de la syndication RSS se font pour la syndication des sites Web d'actualité, des blogs, des radios et TV IP.

+ +

Ce tutoriel traite essentiellement de RSS 2.0, mais évoque certains aspects spécifiques aux autres versions de RSS.

+ +

On n'écrit presque jamais du RSS à la main. La plupart du temps, c'est un programme côté serveur (en général écrit en PHP, Java, C# ou Python) qui s'en occupe. Cependant, pour les besoins du tutoriel, nous allons écrire nos propres fichiers RSS à la main.

+ +

Bref historique de RSS

+ +

En mars 1999, Netscape a publié RSS 0.90. On était alors bien loin du RSS d'aujourd'hui. Il ne s'agissait pas réellement d'un format de syndication mais plutôt d'un format fournissant le résumé d'un site Web. En fait, à l'époque, RSS ne signifiait pas encore Really Simple Syndication, mais Rich Site Summary (NdT : Résumé de site enrichi).

+ +

En juillet 1999 sort RSS 0.91 de Netscape. Tout comme RSS 0.90, le RSS 0.91 de Netscape était un format destiné à fournir le résumé d'un site Web et non pas un format de syndication (comme c'est le cas aujourd'hui). Cette nouvelle version a été concue pour simplifier les choses. En effet, alors que RSS 0.90 était basé sur RDF, que beaucoup trouvaient particulièrement complexe, RSS 0.91 de Netscape était quant à lui basé uniquement sur XML et ajoutait une DTD permettant d'utiliser de nombreuses entités (que l'on trouve généralement en HTML).

+ +

Dès lors, Netscape déclara comme "déprécié" le format RSS 0.90 basé sur RDF et demanda à tout le monde d'utiliser le RSS 0.91 de Netscape qui lui, était basé sur du XML.

+ +

En juin 2000 sort le RSS 0.91 de Userland. Oui, vous l'avez compris, il existe bien deux versions différentes de RSS 0.91. La différence entre ces deux versions de RSS 0.91 (celle de Netscape et celle de Userland) est que le RSS 0.91 de Userland ne propose pas la DTD du RSS 0.91 de Netscape, et donc ne dispose pas des entités supplémentaires (et que l'on trouve généralement en HTML) dont disposait le RSS 0.91 de Netscape . En dehors de ça, ils sont similaires. Techniquement, le RSS 0.91 de Userland n'est qu'une version moins complète du RSS 0.91 de Netscape.

+ +

En décembre 2000, leRSS-DEV working group sort RSS 1.0. Cette version de RSS n'était plus basée sur du XML pur, mais à nouveau sur RDF, comme l'était le RSS 0.90 d'origine. LeRSS-DEV working group a modifié la signification de RSS en RDF Site Summary (NdT : résumé en RDF de site Web), du moins c'était ainsi qu'était présenté RSS dans cette version.

+ +

À ce moment là, nous avions donc le RSS 0.91 de Netscape, le RSS 0.91 de Userland et le RSS 1.0 duRSS-DEV working group.

+ +

Un peu plus tard, au cours de ce même mois de décembre 2000, Userland a publié RSS 0.92, censé remplacer le RSS 0.91 de Userland. Vous l'aurez remarqué, dès lors la numérotation des versions de RSS devient encore plus confuse puisque RSS 0.92 est une version plus récente que RSS 1.0.

+ +

À présent, on disposait du RSS 0.91 de Netscape, du RSS 1.0 duRSS-DEV working group et du RSS 0.92 de Userland.

+ +

En avril 2001, Userland a sorti une ébauche de RSS 0.93. Cette version de RSS n'a cependant jamais été finalisée et n'a donc jamais remplacé le RSS 0.92 de Userland.

+ +

Donc, à ce moment là, si l'on avait toujours le RSS 0.91 de Netscape, le RSS 1.0 duRSS-DEV working group et le RSS 0.92 de Userland, certains se sont également mis à utiliser RSS 0.93 et RSS 0.94 alors qu'ils n'étaient pas supposés l'être.

+ +

En septembre 2002, Userland publie RSS 2.0, destiné à remplacer RSS 0.92 ainsi que les ébauches RSS 0.93 et RSS 0.94 (que personne n'était supposé utiliser). Userland a choisi de passer directement le numéro de version à 2.0 puisque leRSS-DEV working group avait déjà utilisé le numéro de version 1.0 pour leur RSS 1.0 basé sur RDF.

+ +

À ce moment là, on pouvait donc trouver le RSS 0.91 de Netscape, le RSS 1.0 duRSS-DEV working group et le RSS 2.0 de Userland.

+ +

L'histoire ne s'arrête pas là. Une première fois en novembre 2002, et ensuite en janvier 2003, Userland a modifié les spécifications de RSS 2.0. Et bien que ces spécifications soient différentes, toutes sont présentées comme étant RSS 2.0 sur l'élément <rss>.

+ +

Aujourd'hui, nous avons toujours le RSS 0.91 de Netscape (puisque Netscape ne l'a jamais déclaré comme déprécié), bien que plus personne ne l'utilise. Les formats les plus utilisés sont les formats RSS 1.0 basé sur du RDF et RSS 2.0 basé sur du XML avec un léger avantage pour ce dernier. C'est cette version qui est présentée dans ce tutoriel.

+ +

Comment RSS est utilisé aujourd'hui

+ +

Aujourd'hui, RSS est essentiellement utilisé à des fins de syndication. La syndication est le fait de signaler aux autres que vous avez du contenu à les faire consommer. En d'autres mots, vous dites aux autres quelque chose qui ressemble à : « Ohé vous autres, j'ai des articles que je voudrais vous faire lire ! Abonnez-vous donc à mon flux RSS et vous aurez la possibilité de lire les articles plus récents qui sortent. »

+ +
+

NOTE : Si vous proposez un flux RSS qui n'est pas protégé par mot de passe, cela signifie que vous permettez implicitement à chacun d'utiliser son contenu comme bon lui semble. Tout le monde peut le lire, en faire une copie, partager cette copie, le diffuser sur sont propre site web, le re-syndiquer, etc.

+ +

Si vous ne souhaitez pas que cela arrive, ne placez pas votre contenu dans un flux RSS non protégé par mot de passe, et ne rendez pas le mot de passe public évidemment.

+
+ +

Les sites web d'actualité utilisent RSS pour fournir à tous la liste de leurs derniers articles parus. Par exemple :

+ +
   
+    <?xml version="1.0"?>
+
+    <rss version="2.0">
+
+        <channel>
+            <title>Exemple de site d'informations</title>
+            <description>Ceci est un exemple de site d'informations journalistique</description>
+            <lastBuildDate>Wed, 27 Jul 2005 00:30:30 -0700</lastBuildDate>
+            <link>http://news.example.com/</link>
+
+            <item>
+                <title>Brève : J'aime le pain</title>
+                <guid>4d4a0a12-f188-4c97-908b-eea27213c2fe</guid>
+                <pubDate>Wed, 27 Jul 2005 00:30:30 -0700</pubDate>
+                <link>http://news.example.com/artcle/554</link>
+            </item>
+            <item>
+                <title>La nouvelle du jour: Les oiseaux volent</title>
+                <guid>c4a63f09-b45b-466b-8773-6ff264001ab7</guid>
+                <pubDate>Tue, 19 Jul 2005 04:32:51 -0700</pubDate>
+                <link>http://news.example.com/artcle/553</link>
+            </item>
+            <item>
+                <title>Le feu ça brûle</title>
+                <guid>c1795324-d5ea-44fa-95b1-b5ce2090d4f1</guid>
+                <pubDate>Sun, 15 May 2005 13:02:08 -0700</pubDate>
+                <link>http://news.example.com/artcle/552</link>
+            </item>
+        </channel>
+
+    </rss>
+    
+
+ +

Les blogueurs utilisent RSS pour fournir à tous une liste de leurs derniers messages. Par exemple :

+ +
   
+    <?xml version="1.0"?>
+
+    <rss version="2.0">
+
+        <channel>
+            <title>Blog de Michel Martin</title>
+            <description>Il s'agit du blog de Michel Martin</description>
+            <lastBuildDate>Sun, 15 May 2005 13:02:08 -0500</lastBuildDate>
+            <link>http://michel-martin.example.net/</link>
+
+            <item>
+                <title>Depuis le temps que je bloggue...</title>
+                <guid>http://joe-blow.example.net/log/21</guid>
+                <pubDate>Sun, 15 May 2005 13:02:08 -0500</pubDate>
+                <link>http://joe-blow.example.net/log/21</link>
+            </item>
+            <item>
+                <title>Je suis super mal1</title>
+                <guid>http://joe-blow.example.net/log/20</guid>
+                <pubDate>Sat, 14 May 2005 22:19:18 -0500</pubDate>
+                <link>http://joe-blow.example.net/log/20</link>
+            </item>
+            <item>
+                <title>Allo ?</title>
+                <guid>http://joe-blow.example.net/log/19</guid>
+                <pubDate>Sat, 14 May 2005 09:55:59 -0500</pubDate>
+                <link>http://joe-blow.example.net/log/19</link>
+            </item>
+            <item>
+                <title>Mauvais jour pour un chat noir</title>
+                <guid>http://joe-blow.example.net/log/18</guid>
+                <pubDate>Fri, 13 May 2005 13:13:13 -0500</pubDate>
+                <link>http://joe-blow.example.net/log/18</link>
+            </item>
+        </channel>
+
+    </rss>
+    
+
+ +

Ceux qui montent une radio IP (IPRadio) utilisent RSS pour permettre aux utilisateurs d'écouter leurs émissions. Exemple :

+ +
   
+    <?xml version="1.0"?>
+
+    <rss version="2.0">
+
+        <channel>
+            <title>Hervé's IPradio Show</title>
+            <description>La meilleure émission de radio du net, avec Hervé !</description>
+            <lastBuildDate>Mon, 15 Aug 2005 16:12:37 -0400</lastBuildDate>
+            <link>http://joe.ipradio.example.net/</link>
+
+            <item>
+                <title>On voit tes marques de bronzage</title>
+                <guid>http://joe.ipradio.example.net/show/55</guid>
+                <pubDate>Mon, 15 Aug 2005 16:11:57 -0400</pubDate>
+                <enclosure url="http://joe.ipradio.example.net/show/55"
+                           length="4487216"
+                           type="application/ogg"
+                />
+            </item>
+            <item>
+                <title>La valise Hervé L</title>
+                <guid>http://joe.ipradio.example.net/show/54</guid>
+                <pubDate>Mon, 8 Aug 2005 13:12:12 -0400</pubDate>
+                <enclosure url="http://joe.ipradio.example.net/show/54"
+                           length="4892178"
+                           type="audio/x-mp3"
+                />
+            </item>
+            <item>
+                <title>Les 10 minutes du peuple</title>
+                <guid>http://joe.ipradio.example.net/show/53</guid>
+                <pubDate>Mon, 1 Aug 2005 18:22:14 -0400</pubDate>
+                <enclosure url="http://joe.ipradio.example.net/show/53"
+                           length="3984215"
+                           type="application/ogg"
+                />
+            </item>
+        </channel>
+
+    </rss>
+    
+
+ +
+

NOTE : On parle parfois de Podcasting pour parler d'écoute de la radio sur internet. Il est préférable de ne pas employer ce terme car il semble que Apple possède les droits d'utilisation de ce terme. Ce mot appartient donc à Apple.

+
+ +

Ceux qui proposent de la TV sur IP (IPTV) utilisent RSS pour permettrent aux utilisateurs de voir leurs émissions en ligne. Exemple :

+ +
   
+    <?xml version="1.0"?>
+
+    <rss version="2.0">
+
+        <channel>
+            <title>L'émission de Sylvie</title>
+            <description>L'émission à ne pas rater</description>
+            <lastBuildDate>Tue, 23 Aug 2005 21:02:05 -0800</lastBuildDate>
+            <link>http://sylvietv.example.com/</link>
+
+            <item>
+                <title>Ca c'est fort !</title>
+                <guid>http://sylvietv.example.com/show/4</guid>
+                <pubDate>Tue, 23 Aug 2005 21:02:05 -0800</pubDate>
+                <enclosure url="http://katetv.example.com/show/4"
+                           length="1911146"
+                           type="application/ogg"
+                />
+            </item>
+            <item>
+                <title>Mate un peu ça !</title>
+                <guid>http://sylvietv.example.com/show/3</guid>
+                <pubDate>Tue, 16 Aug 2005 16:11:57 -0400</pubDate>
+                <enclosure url="http://katetv.example.com/show/3"
+                           length="1387442"
+                           type="application/ogg"
+                />
+            </item>
+            <item>
+                <title>Encore moi</title>
+                <guid>http://sulvietv.example.com/show/2</guid>
+                <pubDate>Tue, 9 Aug 2005 13:12:12 -0400</pubDate>
+                <enclosure url="http://katetv.example.com/show/2"
+                           length="1894877"
+                           type="video/mpeg"
+                />
+            </item>
+            <item>
+                <title>Salut</title>
+                <guid>http://sylvietv.example.com/show/1</guid>
+                <pubDate>Tue, 2 Aug 2005 18:22:14 -0400</pubDate>
+                <enclosure url="http://katetv.example.com/show/1"
+                           length="17442215"
+                           type="application/ogg"
+                />
+            </item>
+        </channel>
+
+    </rss>
+    
+
+ +

Le lecteur attentif se sera rendu compte que les exemples desite d'informations et deblogueur se ressemblent. De même, les exemples deIPRadio etIPTV se ressemblent. En fait, la seule différence entre les exemples site d'informations/blogueur et IPRadio/IPTV réside dans le fait que les 2 premiers utilisent l'élément <link> et que les 2 autres utilisent l'élément <enclosure>

+ +
+

NOTE : Ces exemples sont simplifiés à l'extrême et ont été conçus pour vous donner une idée de ce à quoi ressemble du RSS basique. Lorsque vous créerez vos propres flux RSS, vous les voudrez probablement plus complets et plus complexes et ils inclueront sûrement d'autres éléments RSS et vous utiliserez peut-être quelques-uns des différents modules RSS.

+
+ +

+

Suivant »

+

diff --git a/files/fr/archive/rss/premiers_pas/syndication/index.html b/files/fr/archive/rss/premiers_pas/syndication/index.html new file mode 100644 index 0000000000..6cf258fa19 --- /dev/null +++ b/files/fr/archive/rss/premiers_pas/syndication/index.html @@ -0,0 +1,101 @@ +--- +title: Syndication +slug: Archive/RSS/Premiers_pas/Syndication +tags: + - Premiers_pas + - RSS + - 'RSS:Premiers_pas' +translation_of: Archive/RSS/Getting_Started/Syndicating +--- +

Cette page explique la syndication Web avec RSS. Vous y apprendrez comment faire pour que visiteurs et machines trouvent facilement votre flux RSS.

+ +

Présentation de la syndication

+ +

La syndication (ou syndication Web) consiste à mettre à disposition d'autres personnes du contenu texte, photo, audio, ou vidéo. Lorsque vous écrivez sur votre blog, que vous produisez une émission de radio ou de télévision par Internet, vous syndiquez.

+ +

RSS vous aide à syndiquer du contenu, en le présentant sous un format aisément exploitable par des machines.

+ +

La syndication avec RSS implique 3 choses :

+ +
    +
  1. Créer un flux RSS.
    2. +
  2. Ajouter un élément <link> spécial dans une ou des pages HTML.
    3. +
  3. Ajouter un élément <a> spécial dans une ou des pages HTML.
    4. +
+ +

Nous avons déjà évoqué le 1er point - la création des flux RSS - aussi nous intéresserons nous plus particulièrement aux points 2 et 3 dans ce document.

+ +

Ajouter l'élément <link>

+ +

Souvent, les données présentes dans un flux RSS le sont également sur une page Web HTML. Lorsque c'est le cas, la page Web HTML peut signaler la présence du flux aux visiteurs et aux machines avec un code comme celui-ci :

+ +
<link rel="alternate" type="application/rss+xml" href="http://example.com/feed" />
+
+ +

Vous pouvez également annoncer le flux RSS depuis d'autres emplacements (par exemple, depuis un billet de blog). Vous pouvez utiliser dans ce cas un code similaire à ceci :

+ +
<link rel="home" type="application/rss+xml" href="http://example.com/feed" />
+
+ +

Remarquez que cela ressemble fortement au code précédent, la seule différence étant la valeur de l'attribut rel (la valeur de rel dans le code précédent était alternate, elle est ici home.

+ +
+

NOTE : Il y a pas mal d'abus dans l'utilisation de l'élément <link> pour la syndication RSS. Certains blogueurs veulent que les internautes puissent s'abonner à leur blog depuis n'importe quelle page (et pas uniquement leur page d'accueil). Beaucoup ont donc ajouté l'élément <link> avec un attribut rel="alternate" sur chaque page (dans les entrées du blog également, et pas uniquement sur la page d'accueil). C'est une mauvaise pratique ! Cela devrait être rel="home". (Voir Understanding rel and rev pour plus d'informations.) La chose la plus importante lorsque vous utilisez l'élément <link> pour la syndication de votre flux RSS est de mettre l'attribut type="application/rss+xml".

+
+ +

Ajouter l'élément <a>

+ +

L'utilisation de l'élement HTML <link> est très puissante mais elle est la plupart de temps cachée. Pour publier plus directement votre flux RSS, vous pouvez utiliser l'élément HTML <a>. Cela imite l'élément <link> que nous venons de voir.

+ +

Quand vous faites un lien depuis la page Web où les données d'un flux RSS sont également présentes, utilisez :

+ +
<a rel="alternate" type="application/rss+xml" href="http://example.com/feed">…</a>
+
+ +

Quand vous faites un lien depuis, par exemple, un article de blog, utilisez le code suivant :

+ +
<a rel="home" type="application/rss+xml" href="http://example.com/feed">…</a>
+
+ +

Une nouvelle fois, remarquez que les deux codes sont très similaires. Seule la valeur de l'attribut rel change. La valeur de rel du premier code est alternate ; dans le second elle est home.

+ +

Icônes de flux

+ +

Les flux RSS (ainsi que les autres) utilisent une icône spécifique. Il est recommandé de l'utiliser lorsque vous créez le lien spécial <a> vers votre flux. Cette icône ressemble à cela :

+ +
+
Image:Feed-icon-32x32.png
+
+ +

Vous pouvez obtenir d'autres icônes de ce type sur le site Feed Icons. Il existe différentes couleurs et tailles, et les fichiers sources sont disponibles également.

+ +

Techniques de syndication avancée

+ +

Bien que cette technique de syndication avancée ne soit pas nécessaire, son support est recommandé ; en particulier pour les sites Web et les applications avec de grande exigence de performance.

+ +

Le protocole HTTP -- l'une des technologies clef du Web -- fournit un moyen d'établir des priorités dans le type de contenu qu'un client HTTP préfère recevoir. Cette technique en tire avantage en faisant en sorte que le client préfére RSS (plutôt que HTML ou un autre format). Voici un exemple simple de ce qui peut être fait :

+ +
Accept: application/rss+xml, text/html
+
+ +

Cependant, avec des logiciels de production, cela ressemblera plus à :

+ +
Accept: application/rss+xml, application/xhtml+xml, text/html
+
+ +

Voici un exemple plus complet :

+ +
GET / HTTP/1.1
+Host: exemple.com
+Accept: application/rss+xml, application/xhtml+xml, text/html
+
+ +

Lorsqu'un serveur HTTP (ou un script côté serveur) reçoit ce code, il devrait rediriger le client HTTP vers le flux, en envoyant un code HTTP 302 Found. Ce qui donne quelque chose comme :

+ +
HTTP/1.1 302 Found
+Location: http://example.com/feed
+
+ +

+

« PrécédentSuivant »

+

diff --git a/files/fr/archive/rss/version/index.html b/files/fr/archive/rss/version/index.html new file mode 100644 index 0000000000..38cf40777d --- /dev/null +++ b/files/fr/archive/rss/version/index.html @@ -0,0 +1,27 @@ +--- +title: Version +slug: Archive/RSS/Version +tags: + - RSS +translation_of: Archive/RSS/Version +--- +

+

+

Les versions de RSS

+

RSS a une histoire compliquée. Des personnes et des groupes différents ont créés chacun de leur côté des applications qu'ils ont appelés RSS. Certain RSS sont des formats basés sur XML, et d'autres sur des formats RDF. +

La liste ci-dessous représente toutes les versions connues RSS. Elles sont listées par ordre chronologiques de leurs sorties. +

+
+

NOTE : dans la liste ci-dessous, RSS 1.0 semble ne pas être à sa place. Cependant, il apparaît là selon l'ordre chronologique. +

+
+
+

NOTE : il existe 3 versions différentes de RSS 0.91, celle de Netscape (revision 1 et revision) et celle d'Userland. Pour être exact, le RSS 0.91 d'Userland est un sous-ensemble du RSS 0.91 de Netscape. +

+
+
+

NOTE : RSS 0.93 et RSS 0.94 n'ont jamais été publiés qu'en tant que « brouillons » et ne sont jamais devenus « finaux ». Ils n'étaient donc pas censés être réellement utilisés. +

+
+ +
Nom Statut Date de publication Basé sur Auteur
RSS 0.90 Mars 1999 RDF Netscape
RSS 0.91 de Netscape (Revision 1) ? XML Netscape
RSS 0.91 Revision 3 de Netscape 10 juillet 1999 XML Netscape
RSS 0.91 d'Userland 4 juin 2000 XML Userland
RSS 1.0 Standard 9 décembre 2000 RDF Groupe de travail RSS-DEV
RSS 0.92 25 décembre 2000 XML Userland
RSS 0.93 20 avril 2001 XML Userland
RSS 0.94 19 août 2002 XML Userland
RSS 2.0 Septembre 2002 XML Userland
RSS 2.0 (post 2002-11-11) 11 novembre 2002 XML Userland
RSS 2.0 (post 2003-01-21) Standard 21 janvier 2003 XML Userland
diff --git "a/files/fr/archive/rss/\303\251l\303\251ments/index.html" "b/files/fr/archive/rss/\303\251l\303\251ments/index.html" new file mode 100644 index 0000000000..a622270973 --- /dev/null +++ "b/files/fr/archive/rss/\303\251l\303\251ments/index.html" @@ -0,0 +1,80 @@ +--- +title: Éléments +slug: Archive/RSS/Éléments +tags: + - RSS +translation_of: Archive/RSS_elements +--- +

 

+

Les éléments RSS

+

A

+ +

B

+

C

+ +

D

+ +

E

+ +

F

+

G

+ +

H

+

I

+ +

J

+

K

+

L

+ +

M

+

N

+

O

+

P

+

Q

+

R

+ +

S

+ +

T

+ +

U

+ +

V

+

W

+

X

+

Y

+

Z

+

Catégories

+

diff --git a/files/fr/archive/security/index.html b/files/fr/archive/security/index.html new file mode 100644 index 0000000000..02db228352 --- /dev/null +++ b/files/fr/archive/security/index.html @@ -0,0 +1,27 @@ +--- +title: Security +slug: Archive/Security +tags: + - TopicStub +translation_of: Archive/Security +--- +

Il est fortement déconseillé de se fier à ces articles de sécurité obsolètes. Cela pourrait mettre vos systèmes en danger.

+ +
+
+
+
Introduction à la cryptographie à clef publique
+
La cryptographie à clef publique ainsi que les standards et les techniques qui s'y rapportent sont à la base des dispositifs de sécurité de nombreux produits Red Hat. Cela comprend : la signature et le chiffrement de messages électroniques, la signature de formulaire, la signature d'objet, les ouvertures de session unique et le protocole SSL (Secure Sockets Layer). Ce document est une introduction aux concepts de base de la cryptographie à clef publique.
+
+ +
+
+
+ +
+
+
Introduction à SSL
+
Ce document est une introduction au protocoleSecure Sockets Layer (SSL). SSL a été universellement adopté sur leWorld Wide Web pour authentifier et chiffrer les communications entre clients et serveurs.
+
+
+
diff --git "a/files/fr/archive/standards_du_web/choisir_de_se_conformer_aux_standards_plut\303\264t_qu_aux_pratiques_propri\303\251taires/index.html" "b/files/fr/archive/standards_du_web/choisir_de_se_conformer_aux_standards_plut\303\264t_qu_aux_pratiques_propri\303\251taires/index.html" new file mode 100644 index 0000000000..3f2ad0a34e --- /dev/null +++ "b/files/fr/archive/standards_du_web/choisir_de_se_conformer_aux_standards_plut\303\264t_qu_aux_pratiques_propri\303\251taires/index.html" @@ -0,0 +1,104 @@ +--- +title: Choisir les standards plutôt que les pratiques propriétaires +slug: >- + Archive/Standards_du_Web/Choisir_de_se_conformer_aux_standards_plutôt_qu_aux_pratiques_propriétaires +tags: + - Standards_du_Web +translation_of: Archive/Web_Standards/Choosing_Standards_Compliance_Over_Proprietary_Practices +--- +

Introduction

+ +

There are a number of standards, procedures, and processes that an organization can use. At the high level, there are two primary types of standards: procedural (how do we do it) versus technical (what do we follow). Organizations implement internal procedural standards so they are able to operate efficiently. They may also incorporate external procedural and/or technical standards. Technical standards have traditionally been pioneered through consortiums or standards bodies. The technical standards can be either public, standards-based or a proprietary de facto standard. The purpose of this document is to discuss and emphasize the importance of conforming to open technology standards that are external to the organization. Let’s begin the discussion, however, by looking inward to internal procedures, processes and standards.

+ +

Why should organizations have standard procedures at every level? Following standards is certainly not a new organizational phenomenon; organizations require their employees to follow common rules, or a common set of standards all the time. Memos, time cards, and accounting procedures are all standardized across groups.

+ +

In the development world, there is a need for standards because applications are designed across multiple development groups. Many organizations publish internal development standards and practices. For example, an organization may decide that C++, Java, and JavaScript will be the primary coding languages. They may require that each project be comprised of Marketing Requirements Documents, Product Requirements Documents, Functional Requirements Documents, Quality Assurance Test Plans, and Certification Documents.

+ +

As organizations mature, they discover that they need more processes to give them greater control, which allows them to more easily plan and predict. With processes, organizations can make release schedules, implement marketing plans, analyze resource allocations, and make adjustments when needed. Adherence to standards and processes can actually provide a level of flexibility because development does become predictable. In addition to predictability, standard processes improve understanding and streamline costs.

+ +

Un processus de développement commun

+ +

As an organization matures, managers and engineers develop a fundamental understanding of the importance of requiring adherence to these processes. When projects are proposed, they are evaluated to ensure compatibility with the overall business strategy. Product marketing must then analyze the marketability of the application/product, and then conduct in-depth technical evaluations and market research studies. If the project is accepted, the compiled information, analysis and research is merged into a Request for Proposal (RFP).

+ +

This process is not unique: most organizations have basic project management processes for product or service. Even within organizations, their processes are fine-tuned to work within the existing culture. When this happens, a development standard is created and is expected to be followed.

+ +

It is easy to get caught up in the process and forget why organizations have these processes in place. Bottom line, organizations have them because they save money, time, and resources. Sure, there are other reasons -– accountability, checkpoints, and scheduling, for example. The end result, however, is having a process in place that maximizes the organization's investment.

+ +

Autres standards

+ +

It is also important to follow other types of standards across an organization. There are numerous standards organizations that affect how and why we do what we do. For example, in the accounting arena there is FASB (Financial Accounting Standards Board) and IASB (International Accounting Standards Board). All businesses are expected and required to follow the guidelines set forth by the FASB. When auditors evaluate an organizations financial health, they do so by following the FASB rules.

+ +

Focusing on the software development portion of an organization, there are numerous standards bodies that can affect development decisions. For example, if an organization is developing a web-based client, they may have to adhere to standards imposed by these organizations:

+ + + +

Like the processes and standards that accountants and project managers must follow, the above-mentioned standards organizations provide focus and direction for the development engineering community. By following the guidelines that have been put into place, organizations like AOL can enhance user experience, interoperability, code reuse, shared resources, and goodwill while reducing costs. I will discuss each of these items in the following paragraphs.

+ +
+

Interopérabilité

+
+ +

The key to interoperability is settling on a standard that has a potential for long-term use. An organization must have the assurance that the standard they choose to incorporate into their development process will be relevant in the future. In other words, there must be long-term potential. A fundamental mistake that many organizations make is to use proprietary methods, software, code, or standards. Following a proprietary path has led many organizations down disastrous paths.

+ +

Case in point: Xerox Corporation. Xerox was clearly ahead of their time in the early 1980’s when they designed and developed the Star Office System. It was an elegant workstation with an iconic desktop developed by the engineers at PARC (Palo Alto Research Center). The Star Office System offered functionality that neither Microsoft nor Apple has been able to match with their current offerings.

+ +

The engineers developed Star on a proprietary development operating system known as Pilot. Pilot had a highly-integrated debugging tool called Co-pilot that allowed the Xerox development organization to quickly and easily debug issues. However, what Xerox neglected to understand was that regardless of how powerful Pilot and Co-pilot was, the Star Workstation could not evolve with the times because it was proprietary. Xerox was bound to a unique hardware platform and to a closed development operating system. And Xerox chose to bypass multiple opportunities to port the code to other platforms, and to provide open-source code. Consequently, Xerox eventually had to shut down the production of their workstation development because of escalating manufacturing and developing costs and slowed sales.

+ +

Xerox’s biggest asset in the beginning became its weapon of destruction. They settled on a proprietary environment, and missed the opportunity to make their environment the benchmark – and set the standard.

+ +

Following open standards has an added benefit. When it is necessary for an organization to interact with other applications through alliances, merger, or acquisition, the integration and interoperability is much less costly if all parties involved follow the standards from the outset. Consistent standards significantly reduce development re-work, and ensure consistent and predictable behavior from one application to the next.

+ +

Expérience utilisateur et bonne volonté

+ +

Customer retention and market expansion is critical. When customers choose to use a particular product, they must have a positive experience with consistent, reliable, and predictable behavior. As users become more sophisticated, and as additional devices become more affordable, they will be accessing the same information across a variety of devices – and expect them to look and act the same – regardless of whether they are accessing a web site from their desktop, phone, or handheld. Consequently, if an organization offers a suite of products they must ensure that the user experience is consistent and predictable across the product line.

+ +

Cohérence

+ +

To be successful, organizations need to understand this user expectation and provide a consistent experience across their product offerings. When usability alters too much across products, users complain.

+ +

Apple and Microsoft have learned this lesson well. When a Macintosh user shifted from Mac OS 8.x to Mac OS 9.x, the interface and desktop metaphor was virtually unchanged. Users could quickly and easily shift from one version to the next. However, when Mac OS X was released, Apple completely revamped the interface and desktop metaphor. That change caused quite a rumble through the Apple user community. It changed just enough to make it awkward, but not enough to where the user could not adjust. Apple received both good and bad press; and they lost some users and won some others over.

+ +

An example of how consistent user experience wins user loyalty can be seen in how Microsoft ensures common behavior across applications. For example, in Word, Excel, and other Windows applications, we know that pressing CTL+C within any Microsoft product means copy. The behavior is consistent and predictable and has subsequently become the de-facto standard. The reason it is consistent and predictable is because Microsoft has established a corporate set of usability standards and supports the relevant international standards.

+ +

Accessibilité

+ +

No organization can afford to overlook or ignore accessibility standards. Within the web environment, the accessibility standards are closely tied to HTML, XML, XHTML, and other W3C standards. By integrating and supporting the accessibility guidelines, an organization can offer their product lines or services to a larger and more diverse user base.

+ +

Interchangeabilité

+ +

If a user experiences consistent behavior across a range of products, they can predict how a particular action or function will work or respond. As a product provider, the goal should be the element of least surprise. By instilling a set of global goals and standards into an organizational infrastructure, an organization is ensuring its end users the ability to interact, function, view, and process information consistently as they transition from one device to the next.

+ +

A significant drawback in allowing divergence across applications is that information must be replicated, altered, or massaged to be processed across the divergent applications. This also creates issues in regard to authoring tools for these various applications. For example, let us say we have multiple application offerings that can be used to browse the web. Each of these applications has followed their own development and support standards. They each may support some or part of the international standards, but not fully. What authoring tool should we use? Would it be fiscally prudent to develop proprietary authoring tools for each application? What would the market adoption rate be for the suite of applications in this case? How can an organization consistently win market share if their product offerings are not integrated? More importantly, what if the user perception is that their products are not interchangeable?

+ +

Ressources Partagées

+ +

When an organization instills a corporate-wide policy of shared standards, they can leverage engineering resources across multiple projects. The development engineers can shift more readily between projects with little to no downtime. Coding practices are consistent. Expectations are known. There is equivalent functionality across applications offered by the organization. And, the engineers have a broader base of experience, making them more valuable within the organization.

+ +

For example, if web-based applications are expected to be W3C compliant, each engineer would be expected to know and understand the W3C standards. Development efforts would consequently support similar levels of standards support, which could possibly lead to cross-application coding, or code reuse.

+ +

For example, if a development engineer writes an application following the ANSI standard of C and C++, and writes that code on a particular platform, that code can be compiled on any other platform and operating system that supports ANSI standards. Microsoft products are difficult to export because they introduced MFC (Microsoft Foundation Classes), which is a Windows-only standard that does not follow the ANSI standard.

+ +

Assurance de la qualité

+ +

We know from experience that without rigorous testing, our products can fail miserably when we introduce them into the market. Technical support is costly not only in regard to support staff costs, but also in respect to customer dissatisfaction.

+ +

That is why organizations also need to apply standards to quality testing. By adopting a set of standards, the QA organization can produce a set of test suites that they can use across multiple projects. By having a standardized set of test suites, the QA organization can easily maintain, verify, and certify the tests, and eliminate redundant testing databases to ensure consistency and reliability. Like the engineers, standardization also helps the QA engineers become highly proficient and capable of shifting from project to project.

+ +

Résumé

+ +

As organizations expand product development across multiple devices and product families, integration and compatibility must be a key requirement. Adhering to a set of future-focused International standards will make cross-functional integration possible. Adopting standards will not only help an organizations end users enjoy a cross application experience; organizations will help themselves by giving development and quality assurance engineers the tools to become better equipped and flexible. Lastly, by following a series of standards, organizations can more easily measure progress, performance, and results across the organization.

+ +

The most compelling dilemma is how an organization chooses to follow open external standards versus a proprietary de facto standard. Following proprietary de facto standards leaves an organization vulnerable and open to obsolescence when the owner of the de facto changes focus or direction, or abandons the de facto altogether and renders the standard stagnate. On the other hand, by adopting open technology standards and participating in the development and direction of those standards, an organization is providing a path for future development, growth and revenue.

diff --git "a/files/fr/archive/standards_du_web/communaut\303\251/index.html" "b/files/fr/archive/standards_du_web/communaut\303\251/index.html" new file mode 100644 index 0000000000..27a26f6bbc --- /dev/null +++ "b/files/fr/archive/standards_du_web/communaut\303\251/index.html" @@ -0,0 +1,30 @@ +--- +title: Communauté +slug: Archive/Standards_du_Web/Communauté +tags: + - Standards_du_Web +translation_of: Archive/Web_Standards/Community +--- +

+Quelques liens sur la communauté francophone des standards du Web. +

+

Sites majeurs

+ +

Autres ressources

+

Forums

+ +

Listes de diffusion

+ +

Blogs

+ diff --git a/files/fr/archive/standards_du_web/index.html b/files/fr/archive/standards_du_web/index.html new file mode 100644 index 0000000000..87eedc9111 --- /dev/null +++ b/files/fr/archive/standards_du_web/index.html @@ -0,0 +1,92 @@ +--- +title: Standards du Web +slug: Archive/Standards_du_Web +tags: + - Standards_du_Web +translation_of: Archive/Web_Standards +--- +
En produisant des sites Web conformes aux standards du W3C, on s'assure qu'ils vont fonctionner quel que soit le navigateur. […] Parce qu'Internet tient une place importante dans nos vies, et qu'il est bien parti pour occuper plus de place encore dans le futur, il appartient à chaque auteur de site web de s'assurer que les pages qui sont produites sont utilisables par tous les navigateurs récents, quels que soient le matériel utilisé, et le handicap éventuel de l'utilisateur. Bien sûr, il est impossible de tester son site sur toutes les plateformes possibles. Mais en produisant du code valide (c'est-à-dire respectant les standards du W3C et validé par les outils HTML et CSS), il est possible de s'assurer que le contenu du site s'affichera aussi bien que possible dans une très grande majorité des plate-formes, préservant ainsi la diversité des navigateurs, du matériel et des individus.
+ + + + + + + + +
+

Documentation

+ +
+
Migration d'applications d'Internet Explorer vers Mozilla
+
Tout le monde a déjà été confronté à des difficultés pour faire fonctionner des applications Web spécifiques à Internet Explorer sous Mozilla. Cet article traite des problèmes classiques avec la migration d'applications vers un navigateur libre basé sur Mozilla.
+
+ +
+
Using Web Standards in your Web Pages
+
Cet article propose un aperçu du processus de mise à jour du contenu d'un site pour le rendre conforme aux standards Web du W3C.
+
+ +
+
Préférer le respect des standards aux solutions propriétaires
+
(à traduire de en:Choosing Standards Compliance Over Proprietary Practices)
+
Dans le monde du développement, il y a un besoin de standards parce que les applications doivent fonctionner sur de multiples groupes de développement.
+
+ +
+
Le modèle économique des standards Web
+
Cet article explique comment l'adhésion aux standards Web et l'abandon des formats et technologies propriétaires peuvent contribuer aux bénéfices d'une entreprise.
+
+ +

Tous les articles…

+ 		+

Communauté

+ +
    +
  • Voir les forums de Mozilla…
    • +
+ +

+ + + +

Outils

+ + + +

Tous les outils…

+ +

Exemples

+ + + +

Sujets liés

+ +
+
CSS, DHTML, HTML, Développement Web, XHTML, XML
+
+
+ +
diff --git "a/files/fr/archive/standards_du_web/le_mod\303\250le_\303\251conomique_des_standards_web/index.html" "b/files/fr/archive/standards_du_web/le_mod\303\250le_\303\251conomique_des_standards_web/index.html" new file mode 100644 index 0000000000..eaadc83364 --- /dev/null +++ "b/files/fr/archive/standards_du_web/le_mod\303\250le_\303\251conomique_des_standards_web/index.html" @@ -0,0 +1,143 @@ +--- +title: Le modèle économique des standards Web +slug: Archive/Standards_du_Web/Le_modèle_économique_des_standards_Web +tags: + - Développement_Web + - Standards_du_Web +translation_of: Archive/Web_Standards/The_Business_Benefits_of_Web_Standards +--- +

Introduction et contexte

+ +

« Faire plus avec moins » semble être une mission impossible pour nos concepteurs Web : s'adresser à toujours plus de clients et à un public toujours plus large, avoir plus de diversité en termes de navigateurs, plus d'accessibilité, répondre aux attentes d'utilisateurs qui demandent plus de rapidité, tout en dépensant moins dans le maintien ou le réaménagement d'un site Web… Dans cette situation délicate, les concepteurs Web sont confrontés à un challenge incroyable. Pourtant, ils sont en train de trouver un allié insoupçonné dans la bataille : les standards du Web.

+ +

Cet article explique comment le fait d'adhérer à des standards Web (c.-à-d. à des normes), et de laisser tomber le balisage et les technologies propriétaires, peut contribuer à atteindre les objectifs d'affaires d'une société.

+ +

Cohérence de l'apparence et du sens sur l'ensemble du site

+ +

En séparant la structure (ou contenu) de la présentation, les concepteurs Web ont beaucoup a gagner. En particulier, la présentation est définie par l'emploi d'un langage orienté vers la mise en page CSS. Ranger CSS dans un document à part (c.-à-d. la feuille de style) et l'appliquer à une série de documents HTML permet de changer la présentation de tous ces documents en un clin d'œil. Le HTML strict (contrairement au balisage HTML transitoire fréquemment utilisé), oblige le concepteur à ne pas utiliser des balises de présentation dans les documents HTML, renforçant ainsi naturellement la séparation entre contenu et présentation.

+ +

En réunissant toutes les questions de style et de design dans un seul document — la feuille de style — des sites entiers peuvent changer instantanément de thème. La communauté des blogs est particulièrement dynamique à cet égard, et dans beaucoup de plateformes dont WordPress, TextPattern et Habari, le thème du site est une entité complète et discrète, dans son propre droit.

+ +

Amélioration de l'expérience utilisateur : moins de bande passante et des chargements plus rapides

+ +

Le code HTML est souvent beaucoup plus compact (et donc plus facile à lire et à maintenir) lorsqu'il est utilisé conjointement à CSS. Selon divers reports, études de cas, et Andy King, auteur de Accélérez votre site Web : optimisation de sites Web, CSS a rendu possible la transformation des mises en page de type tableaux en mises en page de type CSS. Habituellement, cela réduit de 25 à 50% la taille de la page. Ceci se traduit par une amélioration de l'expérience utilisateur, selon le gourou de l'ergonomie/Utilisabilité Jakob Nielsen, qui remarque que les utilisateurs ont tendance à fermer une page Web quand elle prend plus de 10 secondes à se charger.

+ +

La feuille de style n'a besoin de se charger qu'une seule fois pour être sauvegardée en mémoire cache. Le poids du chargement peut être légèrement supérieur pour la première page. Mais pour l'accès à plusieurs pages d'un même site, étalé sur plusieurs visites, les économies en bandes passantes sont énormes.

+ +

Améliorer les SERPS (résultats de recherche sur les moteurs) organiques sans dépenser d'argent

+ +

L'une des plus grandes difficultés pour nos webmestres est d'avoir un bon classement dans les moteurs de recherche. Pour atteindre cet objectif, tout doit entrer en compte. Grâce à l'utilisation d'un balisage sémantique, nous aidons énormément les moteurs de recherche dans leur processus d'indexation. Ces idées viennent tout naturellement aux développeurs qui utilisent les standards, sans aucun effort, temps, ni pensée supplémentaires. Tous leurs documents sont correctement signalés dès le départ. Le nombre de sites ne fournissant pas de titres ni de descriptions appropriés dans les balises Méta est surprenant. Beaucoup d'autres sites augmenteraient énormément leur SEO simplement s'ils utilisaient des balises appropriées au contenu. Rajouter des balises h1, h2, h3, et ainsi de suite, apporte une bonne structure aux documents hypertextes.

+ +

Les agents des moteurs de recherche sillonnent le Web pour l'indexer, mais pour les besoins de classement ou d'indexation ils ne peuvent traiter que le texte. Les effets dynamiques, tels que ceux créés par JavaScript ne sont pas pris en compte, et un texte contenant des graphiques ne peut pas être lu ni analysé non plus. Le fait de séparer la présentation du contenu permet d'augmenter le taux d'information/balisage, rendant ainsi les documents de type CSS plus pertinents en ce qui concerne les termes de recherche, ce qui leur permet d'être classés plus haut dans les résultats de recherche. De la même manière, l'utilisation de CSS à la place de graphiques pour réaliser des titres peut être d'une grande aide.

+ +

Il existe des différences significatives dans la manière dont opèrent les moteurs de recherche. Au lieu de se préoccuper de chaque moteur de recherche, et d'essayer de manipuler artificiellement les résultats, les pages utilisant les standards Web sont indexées et classées correctement (là où elles le méritent) à travers tous les moteurs de recherche. Non seulement les standards réduisent énormément nos soucis envers les différences de navigateurs, mais ils réduisent aussi les différences dans la manière dont les moteurs de recherche classent les pages.

+ +

En utilisant correctement les standards du web, il ne devrait pas ou plus être nécessaire d'avoir recours à des campagnes propriétaires de paiement par clic, dont les coûts augmentent sans cesse et dont la qualité et l'intégrité laissent parfois à désirer.

+ +

Augmenter le trafic des sites Web

+ +

Maintenir le contact avec votre utilisateur sur des plateformes multiples

+ +

Les codes respectant les standards et fonctionnant sur diverses plateformes vont main dans la main. Alors que certains navigateurs ont des bizarreries qui provoquent des comportements différents selon la plateforme, les navigateurs de Mozilla sont conçus pour se comporter de manière identique sur toutes les plateformes supportées (Mac, Linux, Unix, Windows…)

+ +

Un nombre croissant d'agents utilisateur autres que des navigateurs, ou alors des navigateurs sur des plateformes différentes —nbsp;comme les téléphones mobiles — ont accès au contenu du Web. Les contenus de données tels que RSS et Atom ne marcheront tout simplement pas sans avoir été préalablement implantés en suivant les standards requis.

+ +

Les suppositions émises à propos des utilisateurs et de leur plateforme, basées sur une réflexion erronée à propos de la communauté d'utilisateurs, sont inévitablement toujours fausses. Par exemple, il n'est pas obligatoire que les hommes d'affaires possèdent un moniteur à écran large. Le contraire peut aussi être vrai. Les « usagers puissants » (Power users) et les hommes d'affaires qui voyagent beaucoup sont en train de réduire leurs portables. Il arrive de plus en plus souvent qu'une seule personne ait peut-être besoin d'accéder au même site en utilisant des plateformes différentes à la maison, au bureau ou lors de déplacements. Ils s'attendent à une expérience constante et cohérente.

+ +

Afin de gérer ces paradoxes, les standards Web nous fournissent différents outils et procédés, et nous permettent une contribution encore plus forte : la diffusion universelle de nos données est accessible aux personnes de différentes circonstances sociales, médicales ou économiques.

+ +

Un personnel plus heureux

+ +

Les bons développeurs — provenant des agences, mais aussi des stagiaires — ne veulent simplement pas travailler en utilisant des méthodes dépassées ou des plateformes aux normes incertaines, suite à l'incertitude conséquente sur la qualité. Ils ont adopté les standards Web il y a bien longtemps, et travaillent à présent là où ces nouvelles compétences sont appréciées. La connaissance de Dreamweaver ou de n'importe quel autre logiciel ancien n'entre absolument pas en compte dans le recrutement d'un personnel créatif.

+ +

Éliminer les dépenses futures indésirables

+ +

Une portion très significative de l'information stockée électroniquement est produite pour le Web et écrite en format HTML. La plupart de ces informations utilisent de l'HTML erroné, qui s'affiche (pour l'instant) correctement dans des navigateurs plus anciens et permissifs. Au cours de l'évolution du Web, les navigateurs Web risquent soit de devenir moins permissifs, soit de se comporter différemment lorsque des balises erronées lui seront données (p. ex. ils risquent d'analyser les données erronées et de les rendre légèrement différentes). En utilisant un balisage valide et conforme aux normes, les données seront réutilisables pendant longtemps. En effet, les prérequis pour une analyse des formats standards sont fixes et bien documentés.

+ +

Contrairement aux croyances populaires, passer aux codes standards ne signifie pas que l'on produit un contenu moins attractif. D'ailleurs, tout ce qui exploite des extensions propriétaires peut être adapté aux normes, avec l'avantage supplémentaire d'être multiplateforme et à l'épreuve du temps.

+ +

En s'assurant que toutes les données numériques de l'opérateur soit signalées de manière constante et conforme aux normes, la base de données devient un atout réutilisable et perpétuel — et sans aucune dépense supplémentaire future.

+ +

Extensibilité

+ +

L'utilisation du HTML strict et la séparation entre structure et contenu fraient la voie au XHTML, une version de HTML compatible avec XML. L'utilisation du XHTML permettra aux auteurs du Web de multiplier les outils provenant du monde XML, tel que XSLT, afin de facilement manipuler les données XML.

+ +

L'utilisation du XHTML est une manière d'entrer dans une série de standards composés par des technologies XML, tels que XML, XSLT (transformation des données), SVG (graphiques animés), MathML (décrire des expressions mathématiques)… De telles technologies ont été conçues pour interfonctionner, et sont la base-même des services Web. Cela va donc beaucoup plus loin que de la simple création de contenu pour le Web.

+ +

Réduire le coût d'opérations et de maintenance de site

+ +

Mais au fait, qu'est-ce réellement que la maintenance ? Une des caractéristiques principales d'un site réussi est d'élaborer constamment un contenu approprié, qui puisse à son tour alimenter le dialogue médiatique social avec la communauté d'utilisateurs. Il est donc nécessaire de créer une structure et un procédé à suivre, afin de permettre aux contributeurs qui travaillent sur le contenu de publier des articles, de récupérer des vidéos, du son, ou n'importe quel autre média. Un site Web n'est qu'un support qui permet d'insérer, de déplacer, et d'afficher ce contenu. Les systèmes de gestion de contenu tentent avec un relatif succès d'alimenter ce niveau de fonctionnalité. Ce sont de très bons exemples d'une véritable séparation non seulement du style et du contenu, mais aussi du procédé par lequel ces éléments — qui sont très différents — sont exécutés.

+ +

Le procédé doit donc se dérouler en trois étapes : la création du contenu, l'application du balisage, et l'ajout du style. Vu sous cet angle, il est parfois surprenant de constater à quel point le procédé de développement Web est en fait propre, élégant et simple. Dans un environnement multi-dirigé et potentiellement commercial, tel qu'une agence de développement Web, cette approche se prête aussi à une démarcation très stricte, entre disciplines d'une structure commune. Celui qui créé le contenu — qui peut être un journaliste, un producteur de musique, ou encore provenir de n'importe laquelle de nombreuses disciplines — n'a pas besoin de s'investir du tout dans le processus actuel de publication du contenu. Et la personne qui applique le balisage n'a pas forcément besoin de savoir (ni de se soucier de) comment il va être composé. Le véritable impact deThe Zen Garden a été d'aider à démontrer les stupéfiants résultats qui sont possibles sans modification du balisage, ainsi que de vraiment garder la quantité de balisage de présentation à un minimum acceptable.

+ +

Le modèle Contenu-Balisage-Style se prête aussi très correctement aux méthodes linéaires de production. Il ne doit y avoir aucun besoin ni aucune activité de développement Web avant que le contenu ne soit produit. Inversement, une fois le contenu à portée de main, le processus de développement et de publication devrait être incroyablement rapide. Et c'est comme cela que ça devrait être. Si nous avons produit un contenu, nous voulons le publier dès maintenant. Pas dans six semaines.

+ +

De plus, en signalant rigoureusement le procédé de production, on peut mesurer et contrôler le temps, les budgets, et les ressources, non-seulement du développement initial du contenu émergeant, mais aussi de sa publication en cours. C'est un outil de gestion très puissant.

+ +

Voilà de quoi sont capables les Standards Web. Cela permet de fournir une structure de développement nettement meilleure, autant pour les fournisseurs de contenu, que pour les développeurs Web et les stylistes de CSS. Il est tout simplement inimaginable que quiconque ne puisse profiter des énormes bénéfices qu'apportent les Standards, et qu'il ne les partage. Les clients, les développeurs et les créateurs de médias numériques peuvent être libérés de la tyrannie du développement composé de graphiques, des générateurs de codes, ainsi que du balisage incompréhensible. Mais le véritable intérêt réside dans le résultat final. Le message, délivré tant aux comptables qu'aux exécutifs et aux actionnaires, devrait être irrésistible.

+ +

Avantages de CSS par rapport à Javascript

+ +

Plus particulièrement, les graphiques et Javascript sont souvent utilisés pour les effets spéciaux dans les fragments de texte. Vu que la technologie des feuilles de style permet aux concepteurs un bon contrôle typographique et la réalisation d'effets tels que lesRollOver, elle réduit considérablement le besoin d'une programmation Javascript et la création de graphiques. Et plus encore : cela réduit la consommation de bande passante due aux images.

+ +

Un code HTML bien formé économise du temps et de l'argent

+ +

Les pages Web qui s'affichent différemment d'un navigateur à l'autre provoquent l'un des plus grands maux de têtes aux développeurs Web. De telles différences de rendu touchent surtout les anciens navigateurs, mais la plupart sont bien connues et documentées. Dans de nombreux cas, des codes ambigus causent ces différences de rendu. Pour les développeurs dans les environnements commerciaux, capables de mesurer ces dépenses en temps, certains chiffres sont étonnants. Concernant une caractéristique haut de gamme d'un site, une seule incohérence entre navigateurs peut absorber les principaux développeurs dans des heures douloureuses et frustrantes de chasse aux forums et de réparation de bogues. Comme nous utilisons les Standards depuis le début, nous disposons d'un point de référence connu afin de mesurer les variations connues des vieux navigateurs. À présent, presque toutes ces variations sont bien documentées, et les réparations sont bien publiées et bien connues. En revanche, la réparation de balises chaotiques est un trou noir qui aspire temps et argent.

+ +

Un code bien défini réduit considérablement les différences de rendu dans divers navigateurs. L'utilisation d'outils de validation tels que le validateur du W3C aide en repérant les erreurs de codage et en vérifiant que le code HTML soit bien formé, ce qui élimine l'ambiguïté dans l'analyse des navigateurs.

+ +

Les nouveaux navigateurs adoptent les standards

+ +

De plus en plus de navigateurs, autres qu'Internet Explorer pour Windows, sont utilisés pour naviguer sur le Web :

+ + + +

Globalement, 5 différents moteurs de rendu sont utilisés pour naviguer sur le Web. Ils se servent de douzaines de navigateurs sur 3 plateformes.

+ +

Selon de nombreuses sources, les navigateurs de type Gecko sont aujourd'hui beaucoup plus courants que les navigateurs de Netscape 4.x et de MSIE 4, et cela augmente de manière significative avec le temps. Rien que Firefox a été téléchargé plus de 50 millions de fois en l'espace de 6 mois.

+ +

Dans un tel environnement, de plus en plus hétérogène, il est inimaginable de tester chaque page Web dans toutes les configurations possibles. La seule solution pratique est donc de se mettre aux standards.

+ +

Dans un environnement novateur, Microsoft a sorti pour IE 8 une nouvelle balise meta qui peut être utilisée pour déclencher dans les sites le mode des Standards Web. En même temps, les anciens sites qui ne sont pas en mode Standards s'afficheront toujours correctement. Même si ce geste est d'une certaine manière controversé, l'annonce a reçu énormément de soutien de la part des principaux développeurs et des partisans des standards, Jeffrey Zeldman en tête.

+ +

Anciens navigateurs : Netscape 4 et IE4

+ +

Le seul inconvénient avec l'utilisation de CSS est que les anciens navigateurs (surtout IE4 et NS4) ne sont pas en mesure de l'afficher correctement. Dans certains cas, par exemple si le public est nombreux à naviguer sur Netscape 4.x, la solution peut être d'utiliser de simples tableaux pour la mise en page, et CSS pour le contrôle des polices. Une autre option serait de fournir du contenu HTML aux utilisateurs de Netscape 4.x, sans le style CSS. Le contenu sera utilisable, mais beaucoup moins attractif que dans les navigateurs modernes. De plus, les navigateurs 4.x sont connus pour leurs problèmes de sécurité : leurs utilisateurs devraient donc être encouragés à les mettre à jour.

+ +

Une accessibilité réglementée

+ +

Les organismes gouvernementaux de nombreux pays (US, UK, Canada) ont l'obligation d'être accessibles, et, dans certains pays comme l'Australie, cela s'applique à toutes les organisations. Aux États-Unis, la Section 508 s'applique aux agences et aux projets financés par le gouvernement.

+ +

En utilisant les standards (surtout CSS pour le positionnement, ainsi que du HTML strict), l'accessibilité est un but plus facile à atteindre. Car les standards ont en effet été créés dans un souci d'accessibilité.

+ +

Pour bien entretenir l'accessibilité, il faut être capable d'offrir un contenu Web à un plus grand public, accroissant ainsi l'ergonomie/l'utilisabilité d'un site Web, même pour les personnes non handicapées.

+ +

Pour les développeurs qui souhaitent surtout accéder à des fonds publics, ou qui travaillent avec des organismes de charité ou socialement responsables, une des clefs les plus importantes est de s'harmoniser avec la législation pertinente de sa juridiction. Tout aussi crucial que le besoin évident de se soumettre à la loi, l'adoption des standards web le plus souvent possible indique clairement un esprit de responsabilité sociale communautaire. De nombreux leaders industriels appliquent cette façon de pensée à tout ce qu'ils font. Les sites qui ne satisfont que l'égo du concepteur et de très peu d'autres personnes vont subir un avenir commercial de plus en plus difficile.

+ +

Le processus de développement : travailler en équipe

+ +

Un code écrit par d'autres développeurs représente un défi commun à tous les développeurs Web qui assurent la gestion des sites existants. Dans de nombreux cas, ils sont confrontés à un code HTML de très mauvaise qualité, qui dépend aussi parfois de fonctions et de programmes non-documentés, ainsi que de pratiques de codage spécifiques. Le manque de documentation est aussi souvent problématique.

+ +

Suivre les documents sur standards-compliance in requirements est une manière très efficace d'assurer une qualité mesurable du produit fini, le W3C étant un juge impartial (le World Wide Web Consortium, abrégé par le sigle W3C, est un organisme de normalisation fondé en octobre 1994 comme un consortium chargé de promouvoir la compatibilité des technologies du World Wide Web telles que HTML, XHTML, XML, RDF, CSS, PNG, SVG et SOAP. Le W3C n'émet pas des normes au sens européen, mais des recommandations à valeur de standards industriels).

+ +

Comme les standards sont très bien documentés, une nouvelle personne qui viendrait reprendre des codes respectueux des standards peut commencer immédiatement, et n'a pas besoin de se familiariser avec les pratiques de codage du développeur antérieur. Cela réduit aussi de manière significative les enfermements propriétaires

+ +

Standards Web : enrichir l'expérience utilisateur

+ +

Tout l'esprit des Standards Web découle du fait qu'ils évoluent grâce à l'expérience utilisateur. Cet esprit n'est déterminé ni par les concepteurs graphiques, ni par les développeurs de générateurs de code propriétaires, ni par le besoin d'effectuer une gymnastique de codage tridimensionnelle pour pouvoir faire face aux vendeurs de navigateurs et d'autres agents utilisateurs. Afin d'améliorer cette expérience utilisateur, les objectifs les plus importants du développement utilisant les standards sont les fameux jumeaux utilisabilité et accessibilité. Le fait d'employer simplement — et assez grossièrement — une expérience utilisateur agréable, satisfaisante et épanouissante se traduit par un trafic plus dense, plus de visiteurs récurrents, moins de rebonds, plus de temps pour flâner, plus de clics suivis. Finalement, cette expérience utilisateur améliorée permet d'atteindre les objectifs d'affaires ou opérationnels du site. Un dialogue plus ouvert, plus de ventes, et d'une certaine manière plus de personnes qui interagissent avec l'opérateur du site.

+ +

Les sites créés à partir de méthodologies, de processus, et de la pratique des standards Web réalisent de loin — et en tout point de vue — les meilleures performances. Ils se chargent plus rapidement, sont plus faciles à retrouver dans les moteurs de recherche, et ils organisent et délivrent efficacement leur contenu. L'utilisateur peut profiter de toutes ces merveilleuses expériences, sans jamais se soucier de la plateforme, du logiciel, du système d'exploitation, ni de douzaines d'autres variables telles que la taille de l'écran, la résolution du texte, l'activation de JavaScript, ou n'importe quel handicap que rencontre l'utilisateur.

+ +

Conclusion

+ +

L'utilisation de standards Web, ainsi que la séparation entre la structure et la présentation, rapporte un bon nombre de bénéfices pour aujourd'hui et demain.

+ +

Pour aujourd'hui, cela représente un public plus nombreux, moins de dépenses d'argent pour la production d'un nouveau contenu, et de devenir conciliant envers les exigences requises par l'accessibilité.

+ +

Pour demain, cela représente la réduction des enfermements propriétaires, la réduction des dépenses dans la maintenance, et plus de flexibilité dans la présentation d'un site Web. Sans oublier que l'utilisation des standards ouvre la porte aux technologies XML.

+ +

Tous ces facteurs contribuent aussi à améliorer la gestion des sites, à rassembler un public plus large, et à perfectionner le retour des investissements. Lesgeeks, les marchands, et le contrôle de gestion peuvent tous bénéficier d'un site Web fondé sur les standards. Et c'est déjà plus que ce que l'on pourrait espérer….

diff --git a/files/fr/archive/standards_du_web/le_sniffing_de_doctype_dans_mozilla/index.html b/files/fr/archive/standards_du_web/le_sniffing_de_doctype_dans_mozilla/index.html new file mode 100644 index 0000000000..77084464d7 --- /dev/null +++ b/files/fr/archive/standards_du_web/le_sniffing_de_doctype_dans_mozilla/index.html @@ -0,0 +1,142 @@ +--- +title: Le sniffing de DOCTYPE dans Mozilla +slug: Archive/Standards_du_Web/Le_sniffing_de_DOCTYPE_dans_Mozilla +tags: + - Développement_Web +translation_of: Archive/Web_Standards/Mozilla_s_DOCTYPE_sniffing +--- +

 

+

Ce document décrit comment Mozilla utilise la déclaration DOCTYPE pour choisir entre le mode strict et le mode dégradé quirks. Le code qui permet cette détermination est la fonction DetermineParseMode() dans nsParser.cpp. Consultez le bug 1312 et le bug 55264 pour plus d'informations sur l'histoire de cette détermination. Consultez le bug 153032 pour la création du mode « presque standard » depuis Mozilla 1.0. L'objectif recherché pour ce comportement a été le suivant :

+ +

En d'autres termes, l'algorithme est la meilleure approximation que nous ayons trouvée pour déterminer quelles pages ont été écrites après que Mozilla ne devienne un navigateur important sur le Web.

+

Mode standard complet

+

Les lignes suivantes déclenchent le mode standard complet :

+ +

Mode presque standard

+

Les lignes suivantes déclenchent le mode presque standard. Le mode presque standard a été créé après les versions 1.0 et 1.1alpha de Mozilla, mais avant les versions 1.0.1 et 1.1beta. Avant la création de ce mode, ces doctypes permettaient de basculer en mode standard complet.

+ +

Mode dégradé quirks

+

Les lignes suivantes déclenchent le mode quirks (cette liste doit être complète afin que les pages existantes sur le Web basculent en mode quirks) :

+

Les sites suivants ont été utiles pour préparer cette liste : W3C HTML Validator, HTMLHelp HTML Validator.

+ +

Notez que toutes les comparaisons d'identificateurs publics sont insensibles à la casse, à cause du nombre important de pages qui utilisent des identificateurs ayant une casse incorrecte (ce qui est techniquement incorrect puisque les chaînes de caractères sont sensibles à la casse).

+

Voir aussi

+ +
+

Informations sur le document original

+ +
+

 

diff --git "a/files/fr/archive/standards_du_web/probl\303\250mes_soulev\303\251s_par_le_pseudo_\303\251l\303\251ment_hover/index.html" "b/files/fr/archive/standards_du_web/probl\303\250mes_soulev\303\251s_par_le_pseudo_\303\251l\303\251ment_hover/index.html" new file mode 100644 index 0000000000..7cc2a12604 --- /dev/null +++ "b/files/fr/archive/standards_du_web/probl\303\250mes_soulev\303\251s_par_le_pseudo_\303\251l\303\251ment_hover/index.html" @@ -0,0 +1,73 @@ +--- +title: Problèmes soulevés par le pseudo élément hover +slug: Archive/Standards_du_Web/Problèmes_soulevés_par_le_pseudo_élément_hover +tags: + - CSS +translation_of: Archive/Web_Standards/Issues_Arising_From_Arbitrary-Element_hover +--- +

 

+


+ Summary: Thanks to long-standing limitations, we're used to thinking of hover styles as applying only to hyperlinks, which has led to some sloppy authoring practices that are now causing problems for some Web sites. This technote explains the source of the problems and how to avoid encountering them.

+

Beaucoup d'auteurs utilisent la pseudo-classe CSS2 :hover pour appliquer un style à leurs liens. Cette innovation, introduite en premier par Microsoft® Internet Explorer et adoptée dans les spécifications CSS, est très populaire pour styler des liens texte, en remplacement des « rollovers » faits en JavaScript. Toutefois, le support avancé de CSS dans les navigateurs a entraîné des comportements agressifs inattendus sur certaines pages.

+

Hover et éléments non-liens

+

Le chapitre 5.11.3 de CSS2 définit les trois types de pseudo-classes (:hover, :active, et :focus) et mentionne que :

+
+ CSS ne définit pas lesquels des éléments peuvent être dans un de ces états ou comment ceux-ci entrent et sortent de ces états. L'écriture peut varier, selon que les éléments réagissent aux actions de l'utilisateur, ou non, et les divers appareils et agents utilisateurs peuvent avoir différentes façons de désigner ou d'activer les éléments.
+

Ainsi, bien que les auteurs s'imaginent que ces trois états ne s'appliquent exclusivement qu'aux liens hypertexte, il n'y a pas de limitation dans CSS2. Tout élément peut, en théorie, se trouver dans l'un de ces trois états et être stylé selon ces états. Ce n'était pas traditionnellement le cas.

+

Pseudo-classes nues

+

La seconde partie du problème vient lorsque nous considérons les effets d'une pseudo-classe « nue » dans un sélecteur. Par exemple :

+
:hover {color: red;}
+
+

Cette règle est équivalente à la règle CSS2 suivante :

+
*:hover {color: red;}
+
+

…qui se traduit en « tout élément survolé aura sa couleur d'écriture mise en rouge ». Ainsi, le survol de paragraphes, de tableaux, d'en-têtes et tous autres éléments dans un document coloriera le texte en rouge.

+

Une variante classique consiste à utiliser une classe nue et une pseudo-classe hover comme ceci :

+
.nav:hover {color: red;}
+
+

Les situations où seules les instances de la valeur nav de la classe class sont appliquées aux liens hypertextes fonctionnent correctement. Cependant, les règles de ce type se rencontrent habituellement avec des balises comme ceci :

+
<td class="nav">
+<a href="one.html" class="nav">un</a> |
+<a href="two.html" class="nav">deux</a> |
+<a href="thr.html" class="nav">trois</a> |
+<a href="fou.html" class="nav">quatre</a>
+</td>
+

Comme la cellule du tableau a une class à nav, le caractère barre verticale virera en rouge lorsque l'utilisateur déplacera la souris n'importe où dans la cellule. Les liens vireront également en rouge lorsqu'ils sont survolés.

+

Comportement de Gecko

+

Dans les navigateurs basés sur des compilations de Gecko postérieures à 20020410 (Netscape 6.1+), les styles :hover peuvent s'appliquer à n'importe quel élément d'un document. De ce fait, les auteurs qui ont employé des pseudo-classes nues ou leur combinaisons, risquent de voir ce style s'appliquer même à d'autres éléments que leurs liens. La meilleure parade est d'ajouter l'élément ancre aux sélecteurs comme ceci :

+
a:hover {color: red;}
+a.nav:hover {color: red;}
+
+

Pour éviter le plus possible les problèmes avec des documents anciens, les navigateurs basés sur Mozilla 1.0 et suivant (Netscape 7+) incluent du code permettant aux pseudo-classes d'être restreintes aux seuls liens seulement si le document est rendu dans le mode « quirks ». Dans les navigateurs basés sur un moteur postérieure à Mozilla 1.3b, ce mode quirk a été étendu pour couvrir les sélecteurs qui combinent un sélecteur de classe nu avec la pseudo-classes :hover (voir le bug 169078 pour plus de détails).

+

Problèmes des ancres nommées

+

En plus des effets précédemment décrit, il y a deux autres effets relativement répandus que les auteurs de pages Web peuvent ne pas désirer. Le premier est facilement corrigible grâce à la validation du document, mais le second est un peu plus subtil.

+

Tout d'abord, il y a le problème des ancres nommées ouvertes mais non fermées. Par exemple :

+
<a name="pagetop">
+<h2>My Page</h2>
+
+

Sans balise de fermeture </a>, le name englobera la suite du document. Ceci signifie généralement que la suite du document se verra attribuer les styles hover. Considérons les effets de la règle suivante :

+
a:hover {color: red;}
+
+

Dans un document comportant une ancre nommée non fermée, tout texte suivant la balise d'ouverture de l'ancre sera coloré en rouge (à moins qu'une autre règle CSS ne soit définie).

+

Ceci nous amène au second problème, qui est que les ancres nommées peuvent accepter des styles hover. Bien que les auteurs désirent souvent que le sélecteur a:hover ne s'applique qu'aux hyperliens, il peut également s'appliquer aux ancres nommées, puisque le sélecteur spécifie que chaque élément a sera stylé lors de son survol. Afin d'éviter de problème, les auteurs devraient utiliser la syntaxe de la pseudo-classe combinée décrite dans CSS2 :

+
a:link:hover {color: red;}
+a:visited:hover {color: maroon;}
+
+

Remarquez qu'avec cette syntaxe, il est possible de styler les liens visités et non visités différemment lorsqu'ils sont survolés. Ce n'était pas possible avec un simple a:hover. Cela signifie, bien entendu, que le sélecteur a:link:hover ne s'appliquera qu'aux liens non visités, ainsi les auteurs désireux d'obtenir le même style pour les liens visités et non visités lors du survol doivent grouper les deux sélecteurs dans une seule et unique règle.

+

Recommendation

+

Pour éviter les problèmes inattendus, les auteurs sont fortement encouragés à inclure des noms d'élément dans les pseudo-classes dynamiques qui sont destinées à être appliquées aux hyperliens. En outre, combiner des pseudo-classes prévient l'application de styles :hover à des ancres qui ne sont pas des hyperliens. Ainsi, a:hover devrait toujours être utilisé à la place du simple :hover, et a:link:hover (et a:visited:hover) sont préférables à un simple a:hover.

+

Liens connexes

+ +
+

Informations sur le document original

+ +
+

Interwiki Languages Links

+

diff --git a/files/fr/archive/standards_du_web/rdf_en_cinquante_mots/index.html b/files/fr/archive/standards_du_web/rdf_en_cinquante_mots/index.html new file mode 100644 index 0000000000..daa552c354 --- /dev/null +++ b/files/fr/archive/standards_du_web/rdf_en_cinquante_mots/index.html @@ -0,0 +1,69 @@ +--- +title: RDF en cinquante mots +slug: Archive/Standards_du_Web/RDF_en_cinquante_mots +tags: + - RDF +translation_of: Archive/Web_Standards/RDF_in_Fifty_Words_or_Less +--- +

D'accord, peut-être qu'il y a un peu plus de cinquante mots, mais les points-clés sont plutôt simples (et en gras pour vous les dirigeants qui voulez juste aller à l'essentiel). Le Resource Description Framework (NdT : « Cadre de description de ressources »), ou « RDF », c'est en fait deux choses.

+ +

D'abord, RDF est un modèle à base de graphes pour décrire les ressources Internet (comme les pages web ou les emails), et comment ces ressources sont liées les unes aux autres.

+ +

Mais qu'est-ce que cela signifieréellement ? Pour un développeur Mozilla, cela veut dire que le modèle de donnée RDF (le « graphe ») peut être utilisé comme mécanisme pour intégrer et organiser les ressources Internet.

+ +

Prenons un exemple : les marque-pages. Actuellement, la plupart des navigateurs vous permettent d'organiser hiérarchiquement vos marque-pages dans desdossiers. Chaque marque-page est unpointeur vers une page web, appelé URI (Uniform Resource Identifier, ou identifiant uniforme de ressource).

+ +

Mais une page web est seulement une sorte de ressource Internet. Il y en a des tonnes d'autres, dont les emails, les articles de news Usenet (ou les newsgroups Usenet entiers), et les résultats de recherche de votre moteur de recherche favori, pour n'en citer que quelques uns. Et fondamentalement, il n'y a aucune raison pour que vous ne traitiez pas ces ressources comme des « marque-pages », en les regroupant dans des dossiers selon votre bon plaisir, ou même en créant des dossiers « intelligents » qui, quand vous les ouvrez, génèrent leur contenu dynamiquement en lançant une recherche commune que vous avez définie.

+ +

Et un marque-page peut vraiment avoir des propriétés arbitraires associées : vous pourriez vouloir inventer votre propre schéma « classification » pour un marque-page codé à la façon « cool » Macintosh. Ou vous pourriez vouloir relier un marque-page à un autre marque-page, ou le garder dans plusieurs « dossiers » à la fois.

+ +

Le graphe RDF fournit un modèle de données parfait sur lequel construire un service de marque-pages « universel » comme décrit ci-dessus : le graphe peut contenir des pointeurs vers des ressources arbitraires et les regrouper de n'importe quelle manière que vous pouvez imaginer.

+ +

Mais attendez, il y a plus…

+ +

Ensuite, RDF est une syntaxe de sérialisation. Cette syntaxe permet aux modèle à base de graphes d'être transmis entre « agents ».

+ +

D'accord, qu'est-ce que ça peut bien vouloir dire ? Fondamentalement, cela signifie que les parties du modèle de données RDF peuvent être communiquées au-delà des frontières du réseau, et les contenus du graphe peuvent changer dynamiquement lorsque l'information provient d'un service distant.

+ +

Reprenons l'exemple des marque-pages. Disons que l'un de mes « dossiers » de marque-pages est réellement un pointeur vers ma boîte de réception : lorsque j'ouvre ce dossier,voilà! Tous les messages que j'ai reçus dans la nuit apparaissent.

+ +

Mais comment cela marche-t-il ? Le dossier « boîte de réception » était en fait un simple pointeur vers une ressource Internet qui contient plus de RDF qui étendent le graphe. Cette « ressource Internet » était une URI qui pointait vers un script CGI (disons, http://www.mozilla.org/smart-mail/get-mail.cgi?user=waterson&folder=inbox). Le script CGI génère en fait duRDF sérialisé, qui est simplement un moyen de formater un graphe en XML :

+ +
<rdf:RDF
+    xmlns:rdf="http://www.w3.org/TR/WD-rdf-syntax#"
+    xmlns:sm="http://www.mozilla.org/smart-mail/schema#">
+  <rdf:Description
+    about="http://www.mozilla.org/smart-mail/ge...n&folder=inbox">
+    <sm:message id="4025293">
+       <sm:recipient>
+         Chris Waterson "waterson@netscape.com"
+       </sm:recipient>
+       <sm:sender>
+         Aunt Helga "helga@netcenter.net"
+       </sm:sender>
+       <sm:received-by>x-wing.mcom.com</sm:received-by>
+       <sm:subject>Great recipe for Yam Soup!</sm:subject>
+       <sm:body>
+         http://www.mozilla.org/smart-mail/ge...cgi?id=4025293
+       </sm:body>
+    </sm:message>
+    <sm:message id="4025294">
+       <sm:recipient>
+         Chris Waterson "waterson@netscape.com"
+       </sm:recipient>
+       <sm:sender>
+         Sarah Waterson "waterson.2@postbox.acs.ohio-state.edu"
+       </sm:sender>
+       <sm:received-by>x-wing.mcom.com</sm:received-by>
+       <sm:subject>We won our ultimate game</sm:subject>
+       <sm:body>
+         http://www.mozilla.org/smart-mail/ge...cgi?id=4025294
+       </sm:body>
+    </sm:message>
+  </rdf:Description>
+</rdf:RDF>
+
+ +

À la réception de la monstruosité ci-dessus, le moteur RDF incorpore le RDF à la bonne place dans le graphe, et le contrôle arbre qui implémente réellement l'UI dans le marque-page est informé qu'il devrait commencer à dessiner des icônes pour le dernier message sur la purée de patate douce de Tante Helga.

+ +

C'estexactement comme ça que fonctionne SmartMail.

diff --git a/files/fr/archive/standards_du_web/utiliser_des_titres_corrects_avec_des_feuilles_de_styles_externes/index.html b/files/fr/archive/standards_du_web/utiliser_des_titres_corrects_avec_des_feuilles_de_styles_externes/index.html new file mode 100644 index 0000000000..c97ae34880 --- /dev/null +++ b/files/fr/archive/standards_du_web/utiliser_des_titres_corrects_avec_des_feuilles_de_styles_externes/index.html @@ -0,0 +1,35 @@ +--- +title: Utiliser des titres corrects avec des feuilles de styles externes +slug: >- + Archive/Standards_du_Web/Utiliser_des_titres_corrects_avec_des_feuilles_de_styles_externes +tags: + - CSS +translation_of: Archive/Web_Standards/Correctly_Using_Titles_With_External_Stylesheets +--- +

+Les feuilles de style externes sont souvent associées aux documents HTML en utilisant l'élément link, mais il est important d'en employer correctement les attributs. En effet, il y a trois sortes de feuilles de style, et l'attribut title est la clé de deux d'entre elles. Sa présence dans un élément link qui référence une feuille de style externe transforme celle-ci en feuille de style par défaut. Dans la plupart des cas, ceci conduira la feuille de style externe à être ignorée, ce qui n'est généralement pas l'intention de l'auteur. +

+

Pourquoi les titres sont-ils importants

+

L'attribut title détermine la façon dont votre feuille de style externe s'applique à votre document. En fait, l'utilisation de l'attribut title est tellement significative que le HTML 4.01 classe les feuilles de style par catégorie selon sa présence ou son absence. En spécifiant un attribut title, vous pouvez décider si une feuille particulière affecte le document en permanence ou si elle est employée seulement dans certaines circonstances.

Il y a trois sortes de feuilles de style possibles : permanente, par défaut et alternative. Les auteurs sont surtout familiarisés avec les feuilles de style permanentes, qui peuvent s'appliquer simultanément en n'importe quel nombre à un document. Une feuille de style permanente n'a pas d'attribut title et son attribut rel a la valeur stylesheet. Un document peut se référer à une ou plusieurs feuilles de style permanentes, qui seront toutes utilisées pour sa présentation.

Une feuille de style par défaut, quant à elle, a un attribut rel doté de la valeur stylesheet et un attribut title de n'importe quelle valeur. En voici deux exemples :

+
<link type="text/css" rel="stylesheet" title="Basic styles" href="basic.css" />
+<link type="text/css" rel="stylesheet" title="Fish and boats" href="ocean.css" />
+
+

Selon la spécification HTML 4.01, seulement une et une seule feuille de style par défaut peut être utilisée à la fois. Dès lors, dans l'exemple ci-dessus, une seule des deux feuilles de style par défaut sera appliquée au document. La spécification ne fournit pas de procédure pour décider laquelle doit être utilisée ; les agents utilisateur sont donc libres de choisir.

Par conséquent, aucun link vers une feuille de style incluant un attribut title ne sera permanent. Il risque au contraire d'être ignoré par le navigateur. N'importe quel élément link se rapportant à une feuille de style avec un attribut title doit être par défaut ou alternatif, selon la valeur de l'attribut rel.

Dans un document qui propose des styles alternatifs, la feuille de style par défaut sera employée à condition qu'aucun des styles alternatifs ne soit choisi par l'utilisateur. Ainsi, quand le document est chargé, le navigateur emploiera tous les styles permanents et une des feuilles de style par défaut (mais attention, il ne peut y avoir qu'un seul style par défaut). Lorsque l'utilisateur choisit un des styles alternatifs, le style par défaut ne sera plus employé, bien que l'utilisateur puisse toujours le sélectionner à nouveau.

Le rôle essentiel des styles par défaut est d'indiquer le style de préférence pour l'affichage du document ; c'est-à-dire que c'est sa « présentation » par défaut. Si l'une ou l'autre des feuilles de style alternatives est choisie, alors le style par défaut est ignoré en faveur du style alternatif choisi par l'utilisateur. Ceci diffère donc des styles permanents qui sont toujours appliqués au document, qu'un style alternatif ait été choisi ou pas. +

+

Recommandations

+

Les auteurs doivent s'assurer que chaque feuille de style qui doit toujours s'appliquer est permanente et non alternative. Pour citer la Spécification HTML 4.01, section 14.3.1 :

+
+ +
+

Liens

+ +
+

Document original

+ +
diff --git a/files/fr/archive/themes/create_your_own_firefox_background_theme/index.html b/files/fr/archive/themes/create_your_own_firefox_background_theme/index.html new file mode 100644 index 0000000000..fef2634185 --- /dev/null +++ b/files/fr/archive/themes/create_your_own_firefox_background_theme/index.html @@ -0,0 +1,102 @@ +--- +title: Créez ta propre thème de arrière plan pour Firefox +slug: Archive/Themes/Create_Your_Own_Firefox_Background_Theme +translation_of: Archive/Themes/Create_Your_Own_Firefox_Background_Theme +--- +

Comment créer ta propre thème de arrière-plan

+ +
+

Les thèmes s'agissent d'une graphique "en-tête", qui style l'arrière-plan de l'IU de Firefox.

+ +

Terminé votre conception? Vous pouvez la soumettre tout de suite!

+ +

Créer une image de thème d'en tête

+ +

L'image d'en-tête image est affiché comme l'arrière plan en haut de la fenêtre de navigateur, derrière les barres d'outils, barre d'addresse, et la barre de recherche. Il sera fixé au coin haut à droit du fenêtre de navigateur.

+ +

+ + + +

Conditions de l'image

+ + + +

Conseils

+ + + +

Éditeurs d'images enlignes

+ + + +

Créer une image de thème de bas de page

+ +

Dans les versions anciennes de Firefox, ou les versions neuves avec certains "add-ons" installés, l'image de bas de pas est affiché comme l'arrière plan du fond du fenêtre de navigateur, derrière la barre des "add-ons" et la barre de retrouver. Il sera fixé au coin fond à gauche du fenêtre de navigateur. L'image de bas de page est optionelle.

+ +

+ + + +

Conditions de l'image

+ + + +

Conseils

+ + + +

Soumettre vos images de thème

+ +

Pour commencer à soumettre vos images, aller au page Soumission de Thèmes:

+ +
    +
  1. Nommez votre thème — choisissez un nom unique pour votre thème. Les noms doubles ne sont pas permis, donc vous pourriez devoir essayer quelque fois pour trouver un nom unique.
    2. +
  2. Choisissez une catégorie et des étiquettes  — selectionnez une catégorie et saisissez des étiquettes qui décrivent votre thème. Gardez en tête qu'un réviseur pourrait réjeter votre thème si il est évident que la catégorie ou les étiquettes ne sont pas liés à votre thème.
    3. +
  3. Décrirez votre thème — écrivez une déscription courte de votre thème. Gardez en tête qu'un réviseur pourrait réjeter votre thème si votre déscription ne répresente pas votre thème.
    4. +
  4. Choisissez une license pour ton thème — décidez d'un type de license de copyright pour votre thème Lire plus sur les types de licenses "Creative Common" +
      +
    • Important: Soyez certain que vous avez le droit d'utiliser l'image dans votre thème!
      • +
    +
    5. +
  5. Mettrez vos images en ligne — soyez certain qu'ils ne sont pas plus grands que 300 KO, et sont en format JPG ou PNG!
    6. +
  6. Selectionnez des couleurs pour la texte et les onglets — vous pouvez choisir la couleur pour la texte et l'arrière plan des onglets qui fonctionnent la meilleure avec votre image de thème en tête.
    7. +
  7. Voir en avant-première votre thème — vous êtes prèt pour en avant-première votre thème! Simplement passez la souris au dessous de l'image en haut du bouton Submit Theme pour voir à quoi ça ressemble.
    8. +
  8. Soumettrez votre thème — si tout a l'air correct, cliquez la bouton Submit Theme et vous avec terminé! Vous pouvez voir tous vos thèmes sur ta page de profil. +
      +
    • Conseil: pour t'asssurer que votre thème a été approuvé pour la galerie, soyez certain qu'il obtempère avec les directives de contenu et les conditions de service!
      • +
    +
    9. +
+ +

+ +

Soumettrez votre thème maintenant

+ +

Plus de tutoriels

+ +

Mozilla Themes Focal Point on Sizing - A tutorial on theming with a focus on sizing, by VanillaOrchids.

+
diff --git a/files/fr/archive/themes/creer_un_theme/index.html b/files/fr/archive/themes/creer_un_theme/index.html new file mode 100644 index 0000000000..fafa4f1803 --- /dev/null +++ b/files/fr/archive/themes/creer_un_theme/index.html @@ -0,0 +1,268 @@ +--- +title: Créer un thème +slug: Archive/Themes/Creer_un_theme +translation_of: Archive/Themes/Building_a_Theme +--- +

Introduction

+ +

Ce tutoriel va vous mener à travers les étapes requises pour construire un thème très basique qui va modifier la couleur de fond des barres d'outils dans Firefox.

+ +
+

Note : Ce tutoriel concerne la création de thèmes pour Firefox 29 et supérieur. D'autres tutoriels existent pour créer des thèmes destinés aux versions antérieurs de Firefox. Pour un ancien tutoriel, voir Créer un thème pour Firefox.

+
+ +
+
+

Note : FireFox pour Mac OS X utilise des répertoires qui ont été déplacés, ce qui peut rendre ce guide obsolète.

+
+ +

Mettre en place l'environement de développement

+ +

Les thèmes et extensions sont empaquetés et distribués dans des fichiers ZIP ou Paquets, avec l'extension de fichier XPI (prononcé “zippy”).

+ +

Un exemple du contenu d'un fichier XPI typique d'un thème:

+ +
example.xpi:
+              /install.rdf
+              /chrome.manifest
+              /preview.png
+              /icon.png
+              /chrome/
+                     browser/
+                     communicator/
+                     global/
+                     mozapps/
+
+
+ +

Nous souhaitons créer une structure de fichier similaire à celle présentée ci-dessus pour notre tutoriel, donc commençons par créer un dossier pour votre thème quelque part sur votre disque dur (ex. : C:\themes\mon_theme\ ou ~/themes/mon_theme/). Dans votre nouveau dossier de thème, créez deux nouveaux fichiers texte vides, l'un nommé chrome.manifest et l'autre appelé install.rdf. Le fichier preview.png est montré comme une prévisulaisation du thème dans le paneau des thèmes de la fenêtre des modules complémentaires. Le fichier icon.png est utilisé comme une icône dans le même panneau. Nous les laisserons de côté pour l'instant, sauf si vous disposez déjà d'éléments graphiques que vous souhaitez utiliser.

+ +

Les répertoires restants seront extraits depuis le thème par défaut. Pour commencer, vous devrez créer un répertoire quelque part. Copiez votre fichier omni.ja d'installation Firefox dans ce répertoire. La localisation diffère suivant le système d'exploitation :

+ +

Linux: /usr/lib/MozillaFirefox/chrome/classic.jar ou /usr/lib/firefox-*.*.*/omni.ja

+ +

Windows: \Program Files\Mozilla Firefox\omni.ja

+ +

Mac OS X: /Applications/Firefox.app/Contents/MacOS/omni.ja

+ +

Maintenant, ouvrez (ou extrayez) ce fichier dans le répertoire que vous avez créé. Il contient plusieurs dossiers, modules, jssubloader et autres. Les fichiers dont vous aurez besoin sont situés dans le dossier chrome\toolkit\skin\classic.

+ +

Créez un dossier nommé chrome dans le dossier de votre thème. Ensuite, le contenu des répertoires suivants dans leurs dossiers respectifs de ce dossier.

+ +
    +
  1. global dans chrome/global
    2. +
  2. mozapps dans chrome/mozapps
    3. +
+ +

À présent que vous avez copié les dossiers global et mozapps, une poignée d'autres dossiers de l'archive browser/omni.ja sont requis. Ils sont situés dans le dossier du navigateur à l'emplacement mentionné ci-dessus. Les fichiers dont nous aurons besoins dans l'archive browser/omni.ja sont situés dans chrome/browser/skin/classic.

+ +

Copiez les contenus des répertoires suivants dans leurs dossiers respectifs. Ceci nous donnera une base de style avec laquelle nous allons commencer à travailler.

+ +
    +
  1. browser dans chrome/browser/
    2. +
  2. communicator dans chrome/communicator/
    3. +
+ +

La structure de vos répertoires doit être comme suit :

+ +
<ext path>/
+          /install.rdf
+          /chrome.manifest
+          /chrome/
+                 browser/
+                 communicator/
+                 global/
+                 mozapps/
+
+ +

Après ces étapes, nous vous recommandons de lire l'article Setting up extension development environment et les indications qui y sont données. En particulier, vous devrez installer le DOM Inspector, que nous utiliserons dans les étapes suivantes

+
+ +
+

Création du Manifeste d'Installation (Install Manifest)

+ +

Ouvrez le fichier nommé install.rdf que vous avez créé en haut de la hierarchie de votre répertoire d'extention et ajoutez-y le contenu suivant :

+ +
<?xml version="1.0"?>
+
+<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+     xmlns:em="http://www.mozilla.org/2004/em-rdf#">
+
+  <Description about="urn:mozilla:install-manifest">
+    <em:id>sample@example.net</em:id>
+    <em:version>1.0</em:version>
+    <em:type>4</em:type>
+
+    <!-- Target Application this theme can install into,
+         with minimum and maximum supported versions. -->
+    <em:targetApplication>
+      <Description>
+        <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
+        <em:minVersion>29.0</em:minVersion>
+        <em:maxVersion>32.*</em:maxVersion>
+      </Description>
+    </em:targetApplication>
+
+    <!-- Front End MetaData -->
+    <em:name>My Theme</em:name>
+    <em:internalName>sample</em:internalName>
+    <em:description>A test extension</em:description>
+    <em:creator>Your Name Here</em:creator>
+    <em:homepageURL>http://www.example.com/</em:homepageURL>
+  </Description>
+</RDF>
+
+ + + +

Si vous obtenez un message qui vous informe que install.rdf est mal formé, il est utile de le charger dans Firefox en utilisant la commande Fichier->Ouvrir un fichier et il vous rapportera les erreurs XML.

+ +

Voir Install Manifests pour une liste complète des propriétés requises et optionelles.

+ +

Sauvegardez le fichier.

+
+ +
+

Styliser l'interface du navigateur avec CSS

+ +

L'interface utilisateur de Firefox est écrite en XUL et JavaScript. XUL est une grammaire XML qui fournit des modules d'interface utilisateur comme les boutons, menus, barres d'outils, arbres, etc. Les actions utilisateur possèdent leurs fonctionnalités en utilisant du JavaScript. Ces éléments XUL sont stylisés en utilisant du CSS. Si vous ne connaissez pas le CSS, ce sera une pente abrupte de votre apprentissage, et vous devriez essayer des tutoriels basés sur le HTML pour commencer.

+ +

L'interface utilisateur du navigateur n'a absolument aucun style de base - si vous essayez de commencer avec un thème vide, Firefox deviendra inutilisable, car les boutons seront uniquement du texte. C'est pourquoi nous avons copié le style par défaut dans l'étape d'organisation.

+ +

Lors de l'écriture d'un thème, la manière la plus simple de déterminer quels selecteurs CSS vous avez besoin d'écrire est d'utiliser l'inspecteur DOM que vous devriez avoir installé à l'étape d'organisation. Vous pouvez utiliser cela pour inspecter n'importe quel élément dans une page web ou un document XUL, ce qui en fait quelque chose d'important pour les thèmes.

+ +

Modifier le style de la barre d'outils

+ +
+

Note Dans Firefox 4.0 et supérieur, l'option de surlignement de l'inspecteur DOM ne fonctionne plus. Pour contourner ça, désactivez l'accélération matérielle dans les options de Firefox.

+
+ +

Ouvrez maintenant l'inspecteur DOM (Dans le menu "Outils") et allez dans "Fichier->Inspecter le document chrome". Ce devrait être un menu contenant tous les documents XUL actuellement ouverts dans Firefox.
+ Prenez le premier document avec un titre de page web, comme "Page de démarrage Firefox" et sélectionnez-le.

+ +

Pour ce tutoriel, nous allons modifier la couleur de fond des barres d'outils. Sélectionnez l'outil de recherche de nœud (la case de la flèche pour en voir plus dans le coin en haut à gauche de l'inspecteur DOM) et cliquez dans n'importe quel espace non-utilisé d'une barre d'outils. Cela devrait sélectionner un nœud de type "xul:toolbar" dans l'inspecteur DOM.

+ +

À partir d'ici, vous pouvez vous amuser avec différents styles pour la barre d'outils et les éléments associés. Par défaut, le panneau de droite devrait montrer le nœud DOM, qui possède des informations importantes comme la classe CSS et l'id de nœud. L'élément lui-même a le simple id navigator-toolbox, sans plus. Pour accorder son style avec notre thème, nous avons besoin d'écrire une règle de sélecteur pour sélectionner cette classe.

+ +

Ouvrez le fichier chrome/browser/browser.css de votre thème. Cherchez dans ce fichier le sélecteur #navigator-toolbox, et ajoutez-lui cette règle background: orange;

+ +

Sauvegardez le fichier.

+
+ +
+

Chrome URIs

+ +

Ensuite, nous devons dire à Firefox où trouver les fichiers de thème pour votre thème. CSS, XUL et autres fichiers font partie de "Chrome Packages" - des composants d'interface utilisateur qui sont chargés via chrome:// URIs. Plutôt que de charger le navigateur depuis le disque file:// URI (car l'emplacement de Firefox sur le système peut changer d'une plateforme à l'autre), les développeurs de Mozilla ont mis au point une solution de création d'URI pour le contenu de l'add-on.

+ +

La fenêtre du navigateur est: chrome://browser/content/browser.xul. Essayez de taper cette URL dans la barre d'adresse dans Firefox !
+
+ Les URI de Chrome se composent de plusieurs composants:

+ + + +

Alors, chrome://foo/skin/bar.png charge le fichier bar.png de la section skin du thème foo.

+ +

Lorsque vous chargez du contenu à l'aide d'un URI Chrome, Firefox utilise le Registre Chrome pour traduire ces URI dans les fichiers source réels sur le disque (ou dans les packages JAR).

+
+ +
+

Creer un Chrome Manifest

+ +

Le manifeste Chrome est le fichier qui mappe ces URI Chrome vers les fichiers de votre thème. Pour plus d'informations sur les Manifestes Google Chrome et les propriétés qu'ils prennent en charge, Chrome Manifest reference.

+ +

Ouvrez le fichier chrome.manifest que vous avez créé à côté du répertoire chrome à la racine de la hiérarchie des dossiers source de votre extension.
+
+ Ajouter dans ce code:

+ +
skin    browser         sample   chrome/browser/
+skin    communicator    sample   chrome/communicator/
+skin    global          sample   chrome/global/
+skin    mozapps         sample   chrome/mozapps/
+
+ +

N'oubliez pas la barre oblique, "/" ! Sans elle, le paquet ne sera pas enregistré. La troisième colonne doit correspondre à la valeur Nom interne de votre thème à partir du manifeste d'installation ci-dessus.

+ +

Cela liste les répertoires de l'apparence dans les emplacements de votre thème. Par exemple, le skin de l'explorateur de skin de ligne / navigateur / signifie "lorsque l'utilisateur a sélectionné l'exemple de thème sélectionné, utilisez le navigateur d'annuaire / pour rechercher des skins pour le package de navigateur". Plus concisément, cela signifie que l'URL chrome://browser/skin/some/path/file.css recherchera un navigateur de fichiers / some / path / file.css dans le répertoire racine de votre thème.

+ +

Enregistrer le fichier.

+
+ +
+

Test

+ +

Tout d'abord, nous devons informer Firefox de l'existence de votre thème. Depuis Firefox 2.0 et supérieur, au cours de la phase de développement , vous pouvez faire pointer Firefox vers le dossier où vous développez le thème et le charger à chaque redémarrage de Firefox.

+ +
    +
  1. Localisez votre dossier de prifil et en dessous le profil avec lequel vous souhaitez travailler (e.g. Firefox/Profiles/<profile_id>.default/).
    2. +
  2. Ouvrez l'extension / folder, en le créant, si nécessaire.
    3. +
  3. Créez un nouveau fichier texte et placez le chemin d'accès complet à votre dossier de développement à l'intérieur (e.g. C:\themes\my_theme\ or ~/themes/my_theme/). Les utilisateurs de Windows doivent conserver la direction du slash du système d'exploitation, et tout le monde devrait se rappeler d'inclure une barre oblique de fermeture et de supprimer les espaces à la fin.
    4. +
  4. Enregistrer le fichier avec l'ID de votre thème comme son nom (e.g. sample@example.net). Pas d'extension de fichier.
    5. +
+ +

Maintenant, vous devriez être prêt à tester votre thème !
+
+ Démarrez Firefox. Firefox détecte le lien texte vers votre répertoire de thèmes et installe le thème. Votre thème ne sera pas actif la première fois que vous l'installez, et vous devrez cliquer sur "Activer" et redémarrer avant de pouvoir voir votre changement. Après avoir redémarré cette deuxième fois, vous devriez voir que la couleur d'arrière-plan des barres d'outils s'affiche maintenant en orange.

+ +

Vous pouvez maintenant revenir en arrière et apporter des modifications supplémentaires à vos fichiers css, fermer et redémarrer Firefox, et voir les mises à jour.

+
+ +
+

Package

+ +

Maintenant que votre thème fonctionne, vous pouvez créer un package pour le déploiement et l'installation.

+ +

Zip le contenu du dossier de votre thème (pas le dossier thème lui-même), et renommez le fichier zip pour avoir une extension .xpi. Dans Windows, vous pouvez le faire facilement en sélectionnant tous les fichiers et sous-dossiers dans votre dossier d'extension, faites un clic droit et choisissez "Envoyer vers -> Dossier compressé (zippé)". Un fichier .zip sera créé pour vous. Il suffit de renommer et vous avez terminé!

+ +

Sur Mac OS ou Linux, vous pouvez utiliser l'outil zip de ligne de commande:

+ +
zip -r my_theme.xpi install.rdf chrome.manifest browser communicator global mozapps
+
+ +

Ou, si vous avez 7-Zip installé, vous pouvez l'utiliser pour le zipper ceci:

+ +
7z a -tzip my_theme.xpi chrome chrome.manifest
+
+ +

Remarque: L'outil en ligne de commande met à jour un fichier zip existant et ne le remplace pas - donc si vous avez supprimé des fichiers de votre thème, supprimez le fichier .xpi avant de lancer la commande zip.

+ +

Maintenant, téléchargez le fichier .xpi sur votre serveur, en vous assurant qu'il est servi en tant qu'application / x-xpinstall. Vous pouvez y accéder et permettre aux utilisateurs de le télécharger et de l'installer. Afin de tester notre fichier .xpi, nous pouvons simplement le glisser dans le Gestionnaire de compléments via "Outils -> Gestionnaire de compléments", ou l'ouvrir en utilisant "Fichier -> Ouvrir fichier ...".

+ +
+
Installation à partir d'une page web
+ +

Il existe plusieurs façons d'installer des extensions à partir de pages Web, y compris le lien direct vers les fichiers XPI et l'utilisation de l'objet InstallTrigger. Les développeurs Web ou d'add-ons devraient utiliser InstallTrigger method pour installer les XPIs, car il fournit la meilleure expérience aux utilisateurs.

+
+ +
+
Utilisation d'addons.mozilla.org
+ +

Mozilla Add-ons est un site de distribution où vous pouvez héberger votre thème gratuitement. Votre thème sera hébergé sur le réseau miroir de Mozilla pour garantir votre téléchargement même s'il devenait très populaire. Le site de Mozilla fournit également aux utilisateurs une installation plus facile et met automatiquement à disposition vos versions les plus récentes pour les utilisateurs de vos versions existantes lorsque vous les téléchargez. En outre, Mozilla Add-ons permet aux utilisateurs de commenter et de fournir des retours sur votre thème. Il est fortement recommandé d'utiliser Mozilla Add-ons pour distribuer vos thèmes !

+ +

Visitez https://addons.mozilla.org/developers/ et créez votre compte pour proposer votre thème.

+ +

Note: Votre thème sera transmis plus rapidement et plus téléchargé plus si vous en avez une bonne description et quelques captures d'écran.

+
+
+ +
+
+ + +

______________________________

+
+
+ +

 

diff --git a/files/fr/archive/themes/index.html b/files/fr/archive/themes/index.html new file mode 100644 index 0000000000..3313a68599 --- /dev/null +++ b/files/fr/archive/themes/index.html @@ -0,0 +1,27 @@ +--- +title: Themes +slug: Archive/Themes +tags: + - TopicStub +translation_of: Archive/Themes +--- +

Documentation thématique archivée.

+ + + + diff --git a/files/fr/archive/web/css/display-inside/index.html b/files/fr/archive/web/css/display-inside/index.html new file mode 100644 index 0000000000..7db4682eb8 --- /dev/null +++ b/files/fr/archive/web/css/display-inside/index.html @@ -0,0 +1,139 @@ +--- +title: display-inside +slug: Archive/Web/CSS/display-inside +tags: + - CSS + - Experimental + - NeedsLiveSample + - Reference + - Web +translation_of: Archive/Web/CSS/display-inside +--- +
+

Cette fonction est expérimentale
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

+
+ +

La propriété display-inside indique le type d'affichage (display type) intérieur généré par un élément, celui-ci indique la façon dont son contenu est organisé à l'intérieur de la boîte de l'élément.

+ +
/* Valeurs avec un mot-clé */
+display-inside: auto;
+display-inside: block;
+display-inside: table;
+display-inside: flex;
+display-inside: grid;
+display-inside: ruby;
+
+/* Valeurs globales */
+display-inside: inherit;
+display-inside: initial;
+display-inside: unset;
+
+ +

Valeur introuvable dans la base de données

+ +

Syntaxe

+ +

Cette propriété est définie avec un des mots-clés définis ci-après.

+ +

Valeurs

+ +
+
auto
+
Si la valeur calculée de display-outside pour l'élément vaut inline-level, l'élément sera un élément en ligne (inline) et organisera son contenu comme du contenu en ligne (inline). Si la valeur calculée de display-outside pour l'élément est un type de disposition spécifique interne, l'élément agit normalement selon la valeur donnée par display-outside. Sinon, la valeur calculée est block.
+
block
+
L'élément organise son contenu avec une disposition en bloc.
+
table
+
L'élément organise son contenu avec une disposition en tableau.
+
flex
+
L'élément organise son contenu avec une disposition flexible.
+
grid
+
L'élément organise son contenu avec une disposition en grille.
+
ruby
+
L'élément organise son contenu avec une disposition ruby.
+
+ +

Syntaxe formelle

+ +
La syntaxe n'a pas été trouvée !
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
CSS Display Module Level 3
La définition de 'display-inside' dans cette spécification.		Version de travailDéfinition initiale.
+ +

Compatibilité des navigateurs

+ +

Nous convertissons les données de compatibilité dans un format JSON. + Ce tableau de compatibilité utilise encore l'ancien format + car nous n'avons pas encore converti les données qu'il contient. + Vous pouvez nous aider en contribuant !

+ +
+ + +

+ +
+ + + + + + + + + + + + + + + + + + + +
FonctionnalitéChromeFirefox (Gecko)Internet ExplorerOperaSafari
Support simplePas de supportPas de supportPas de supportPas de supportPas de support
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FonctionnalitéAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Support simplePas de supportPas de supportPas de supportPas de supportPas de support
+
+ +

 

diff --git a/files/fr/archive/web/css/display-outside/index.html b/files/fr/archive/web/css/display-outside/index.html new file mode 100644 index 0000000000..276a7d9a04 --- /dev/null +++ b/files/fr/archive/web/css/display-outside/index.html @@ -0,0 +1,145 @@ +--- +title: display-outside +slug: Archive/Web/CSS/display-outside +tags: + - CSS + - Experimental + - Propriété + - Reference + - Web +translation_of: Archive/Web/CSS/display-outside +--- +
{{CSSRef}}{{SeeCompatTable}}
+ +

La propriété display-outside définit le type d'affichage (display type) à l'extérieur de la boîte générée par un élément et indique la façon dont l'élément s'inscrit dans le contexte de formatage de l'élément parent.

+ +
/* Valeurs avec un mot-clé */
+display-outside: block-level;
+display-outside: inline-level;
+display-outside: run-in;
+display-outside: contents;
+display-outside: none;
+display-outside: table-row-group;
+display-outside: table-header-group;
+display-outside: table-footer-group;
+display-outside: table-row;
+display-outside: table-cell;
+display-outside: table-column-group;
+display-outside: table-column;
+display-outside: table-caption;
+display-outside: ruby-base;
+display-outside: ruby-text;
+display-outside: ruby-base-container;
+display-outside: ruby-text-container;
+
+/* Valeurs globales */
+display-outside: inherit;
+display-outside: initial;
+display-outside: unset;
+
+ +

{{cssinfo}}

+ +

Syntaxe

+ +

Cette propriété est définie grâce à l'un des mots-clés définis ci-après.

+ +

Valeurs

+ +
+
block-level
+
L'élément génère une boîte en bloc (block-level) et s'inscrit dans un contexte de formatage en bloc. D'autres contextes de mise en forme (comme les contextes flexibles) peuvent fonctionner avec les éléments en bloc.
+
inline-level
+
L'élément génère une boîte de type inline-level et s'inscrit dans un contexte de mise en forme en ligne (inline).
+
run-in
+
L'élément génère une boîte de type run-in. Les éléments de ce type agissent comme des éléments en ligne ou comme des éléments en bloc selon les éléments qui les entourent.
+
contents
+
L'élément dispose son contenu grâce à la disposition flexible.
+
none
+
L'élément ne génère aucune boîte et ne s'inscrit dans aucun contexte de mise en forme.
+
table-row-group, table-header-group, table-footer-group, table-row, table-cell, table-column-group, table-column, table-caption
+
L'élément est un élément interne à un tableau et s'inscrit dans un contexte de mise en forme au sein d'un tableau.
+
+ table-cell et table-caption sont des dispositions spécifiques de feuille (leaf type) et les autres sont des types de disposition spécifiques internes (cf. ci-après).
+
ruby-base, ruby-text, ruby-base-container, ruby-text-container
+
L'élément est un élément ruby interne et s'inscrit dans un contexte de disposition ruby.
+
+ ruby-base et ruby-text sont des types de disposition de feuilles et ruby-base-container et ruby-text-container sont des types de disposition spécifiques internes (cf. ci-après).
+
Types de disposition spécifiques internes
+
Pour ces types d'affichage, il est nécessaire que l'élément parent et les éléments fils soient d'un type d'affichage particulier. Ainsi, pour une boîte table-row, il faudra que l'élément parent soit un groupe de ligne d'un tableau et il faudra que ses éléments fils soient des boîtes table-cell.
+
Types de disposition de feuille
+
Pour ces types d'affichage, il est nécessaire que l'élément parent soit d'un type d'affichage donné mais ils peuvent accepter n'importe quelle valeur pour display-inside. Ainsi, pour une boîte table-caption, il faut que le parent soit table mais l'élément peut établir n'importe quel type de contexte de mise en forme pour ses fils.
+
+ +

Syntaxe formelle

+ +
{{csssyntax}}
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
{{SpecName('CSS3 Display', '#the-display-outside', 'display-outside')}}{{Spec2('CSS3 Display')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FonctionnalitéChromeFirefox (Gecko)Internet ExplorerOperaSafari
Support simple{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FonctionnalitéAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Support simple{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
diff --git a/files/fr/archive/web/css/index.html b/files/fr/archive/web/css/index.html new file mode 100644 index 0000000000..478bd56318 --- /dev/null +++ b/files/fr/archive/web/css/index.html @@ -0,0 +1,10 @@ +--- +title: CSS +slug: Archive/Web/CSS +translation_of: Archive/Web/CSS +--- +

Obsolète
Cette fonctionnalité est obsolète. Bien qu'encore supportée par des navigateurs, son utilisation est découragée pour tout nouveau projet. Évitez de l'utiliser.

+ +

Obsolete CSS features

+ +

diff --git a/files/fr/archive/web/index.html b/files/fr/archive/web/index.html new file mode 100644 index 0000000000..9c217dd79e --- /dev/null +++ b/files/fr/archive/web/index.html @@ -0,0 +1,19 @@ +--- +title: Archived open Web documentation +slug: Archive/Web +tags: + - Archived + - TopicStub + - Web +translation_of: Archive/Web +--- +

La documentation répertoriée ci-dessous est un matériel archivé et obsolète sur des sujets Web ouverts..

+ + + +
+
E4X
+
ECMAScript pour XML (E4X) est une extension de langage de programmation ajoutant un support XML natif à JavaScript. Cela se fait en fournissant un accès aux documents XML dans une forme qui semblera naturelle aux programmeurs ECMAScript. Son but est de proposer une syntaxe alternative et plus simple que les interfaces DOM pour accéder aux documents XML.
+
Identification de navigateur et aide sur multi-navigateurs
+
Vous pouvez vous réferez à un article ultérieur Writing forward-compatible websites pour trouver des informations plus récentes.
+
diff --git a/files/fr/archive/web/iterator/index.html b/files/fr/archive/web/iterator/index.html new file mode 100644 index 0000000000..19e2c2142b --- /dev/null +++ b/files/fr/archive/web/iterator/index.html @@ -0,0 +1,190 @@ +--- +title: Iterator +slug: Archive/Web/Iterator +tags: + - JavaScript + - Legacy Iterator + - Reference +translation_of: Archive/Web/Iterator +--- +
{{jsSidebar("Objects")}}
+ +
Non-standard. La fonction Iterator est une fonctionnalité propre à ECMAScript et sera retiré dans le futur. Pour utiliser des fonctions pérennes, préférer les boucles {{jsxref("Instructions/for...of")}} et le protocole itérateur.
+ +

La fonction Iterator renvoie un objet implémentant le protocole itérateur historique qui permet d'itérer sur les propriétés énumérables d'un objet.

+ +

Syntaxe

+ +
Iterator(objet, [keyOnly])
+ +

Paramètres

+ +
+
objet
+
L'objet dont on souhaite itérer sur les propriétés.
+
keyOnly
+
Si keyOnly est une valeur équivalente à true, Iterator.prototype.next renverra uniquement nom_propriété.
+
+ +

Description

+ +

Cette fonction renvoie une instance d'Iterator qui permet d'itérer sur un objet. Pour chaque itération, l'instance renverra un tableau [nom_propriété, valeur_propriété] si keyOnly est équivalente à false. Sinon, chaque itération renverra uniquement nom_propriété. Si objet est une instance d'Iterator ou de Generator, la fonction renverra objet.

+ +

Propriétés

+ +
+
Iterator.prototype[@@iterator]
+
Renvoie une fonction qui renvoie l'objet itérateur afin de respecter {{jsxref("Les_protocoles_iteration", "les protocoles d'itération", "", 1)}}.
+
+ +

Méthodes

+ +
+
Iterator.prototype.next
+
Renvoie le prochain item élément au format [nom_propriété, valeur_propriété]. S'il n'y a plus d'éléments, l'exception {{jsxref("StopIteration")}} est levée.
+
+ +

Exemples

+ +

Itérer sur les propriétés d'un objet

+ +
var a = {
+  x: 10,
+  y: 20,
+};
+var iter = Iterator(a);
+console.log(iter.next()); // ["x", 10]
+console.log(iter.next()); // ["y", 20]
+console.log(iter.next()); // renvoie StopIteration
+
+ +

Itérer sur les propriétés d'un objet avec l'instruction historique for...in

+ +
var a = {
+  x: 10,
+  y: 20,
+};
+
+for (var [nom, valeur] in Iterator(a)) {
+  console.log(nom, valeur);   // x 10
+                              // y 20
+}
+
+ +

Itérer grâce à for-of

+ +
var a = {
+  x: 10,
+  y: 20,
+};
+
+for (var [nom, valeur] of Iterator(a)) {
+  // @@iterator est utilisé
+  console.log(nom, valeur);   // x 10
+                              // y 20
+}
+
+ +

Itérer sur les noms des propriétés

+ +
var a = {
+  x: 10,
+  y: 20,
+};
+
+for (var nom in Iterator(a, true)) {
+  console.log(nom);    // x
+                       // y
+}
+
+ +

Utiliser une instance de Generator

+ +
function* f() {
+  yield "a";
+  yield "b";
+}
+var g = f();
+
+console.log(g == Iterator(g)); // true
+
+for (var v in Iterator(g)) {
+  console.log(v);   // a
+                    // b
+}
+
+ +

Utiliser une instance d'Iterator

+ +
var a = {
+  x: 10,
+  y: 20,
+};
+
+var i = Iterator(a);
+
+console.log(i == Iterator(i)); // true
+
+ +

Spécifications

+ +

Non-standard. Ne fait partie d'aucun standard.

+ +

Compatibilité des navigateurs

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FonctionnalitéChromeFirefox (Gecko)Internet ExplorerOperaSafari
Support simple{{CompatNo}}{{CompatVersionUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FonctionnalitéAndroidChrome pour AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Support simple{{CompatNo}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/activexobject/index.html b/files/fr/archive/web/javascript/extensions_microsoft/activexobject/index.html new file mode 100644 index 0000000000..a76d841666 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/activexobject/index.html @@ -0,0 +1,96 @@ +--- +title: ActiveXObject +slug: Archive/Web/JavaScript/Extensions_Microsoft/ActiveXObject +tags: + - Déprécié + - JavaScript + - Microsoft + - Non-standard + - Obsolete + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/ActiveXObject +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cet objet est une extension Microsoft est uniquement pris en charge par Internet Explorer (pas pour Edge ou pour les applications Windows Store à partir de Windows 8).
+ +

L'objet ActiveXObject active et renvoie une référence à un objet Automation. Cet objet est uniquement utilisé afin d'instancier des objets Automation, il ne possède pas de propriété.

+ +

Syntaxe

+ +
let nouvelObj = new ActiveXObject(nomServeur.nomType[, emplacement])
+
+ +

Paramètres

+ +
+
nomServeur
+
Le nom de l'application qui fournit l'objet.
+
nomType
+
Le type ou la classe de l'objet à créer.
+
location {{optional_inline}}
+
Le nom du serveur réseau où l'objet sera créé.
+
+ +

Notes

+ +

Les serveurs d'automatisation fournissent au moins un type d'objet. Une application de traitement de texte pourra par exemple fournir un objet d'application, un objet de document et un objet pour une barre d'outils.

+ +

Il est possible d'identifier les différentes valeurs nomServeur.nomType d'un PC grâce à la clé de registre HKEY_CLASSES_ROOT. Voici quelques exemples de valeurs qui peuvent y être trouvées selon les programmes installés :

+ + + +
+

Attention ! Les objets ActiveX peuvent présenter des risques de sécurité. Afin d'utiliser ActiveXObject, il est nécessaire d'ajuster le niveau de sécurité d'Internet Explorer dans les paramètres. Pour une utilisation sur un intranet, par exemple, il faudra modifier le réglage afin d'utiliser la valeur « Initialiser et scripter les contrôles ActiveX qui ne sont pas marqués comme sûrs ».

+
+ +

Afin d'identifier les propriétés des objets obtenus et si aucune documentation de référence n'est disponible, il peut être nécessaire d'utiliser un explorateur d'objet COM (tel que l'explorateur d'objets OLE/COM).

+ +

Pour créer un objet Automation, il suffit d'affecter le résultat du constructeur à une variablee :

+ +
var ExcelApp = new ActiveXObject("Excel.Application");
+var ExcelSheet = new ActiveXObject("Excel.Sheet");
+
+ +

Ce code démarre l'application permettant de créer l'objet (ici Microsoft Excel). Une fois l'objet créé, on peut y faire référence dans le code en utilisant la variable. Dans l'exemple qui suit, on manipule la variable ExcelSheet afin d'accéder aux différentes propriétés et méthodes qui permettent de manipuler la feuille de calcul.

+ +
// Rendre Excel visible grâce à l'objet Application
+ExcelSheet.Application.Visible = true;
+// Écrire du texte dans la première cellule
+ExcelSheet.ActiveSheet.Cells(1,1).Value = "Coucou";
+// Enregistrer le document
+ExcelSheet.SaveAs("C:\\TEST.XLS");
+// Quitter Excel grâce à la méthode Quit de l'objet Application.
+ExcelSheet.Application.Quit();
+
+ +

Prérequis

+ +

Fonctionnalité prise en charge sur les différents modes Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard, Internet Explorer 10 en mode standard, Internet Explorer 11 en mode standard. Elle n'est pas prise en charge par les applications Windows 8.x Store.

+ +
+

Note : La création d'un objet ActiveXObject sur un serveur distant n'est pas prise en charge pour Internet Explorer 9 en mode standard, Internet Explorer 10 en mode standard, Internet Explorer 11 en mode standard et pour les applications Windows Store ou les versions ultérieures.

+
+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/at-cc-on/index.html b/files/fr/archive/web/javascript/extensions_microsoft/at-cc-on/index.html new file mode 100644 index 0000000000..f32b297a77 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/at-cc-on/index.html @@ -0,0 +1,59 @@ +--- +title: '@cc_on' +slug: Archive/Web/JavaScript/Extensions_Microsoft/at-cc-on +tags: + - Instruction + - JavaScript + - Microsoft + - Non-standard + - Obsolete + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/at-cc-on +--- +
{{JSRef}}{{Non-standard_header}}{{Obsolete_Header}}
+ +
Attention ! La compilation conditionnelle n'est plus prise en charge à partir d'Internet Explorer 11 en mode standard et pour les applications Windows Store à partir de Windows 8.
+ +

L'instruction @cc_on active la compilation conditionnelle via des commentaires placés dans le script.

+ +

Syntaxe

+ +
@cc_on
+
+ +

Notes

+ +

Lors de l'écriture d'un script destiné au Web, il est nécessaire que les instructions de compilation conditionnelle soient placées dans des commentaires afin que les environnements qui ne les prennent pas en charge puissent les ignorer.

+ +

Aussi, il est fortement recommandé d'utiliser @cc_on dans un commentaire afin que les autres navigateurs puissent considérer la syntaxe du script comme valide.

+ +

Une instruction @if ou @set située à l'extérieur d'un commentaire permet également d'activer la compilation conditionnelle.

+ +

Exemples

+ +
/*@cc_on @*/
+/*@
+  console.log("Version de JavaScript : " + @_jscript_version + ".");
+  @if (@_win32)
+    console.log("Version 32 bits de Windows.");
+  @elif (@_win16)
+    console.log("Version 16 bits de Windows.");
+  @else
+    console.log("Un autre système d'exploitation est utilisé.");
+  @end
+@*/
+
+ +

Prérequis

+ +

Cette instruction est prise en charge par toutes les versions d'Internet Explorer mais ne peut pas être utilisée dans les applications pour Windows 8.x Store.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/at-if/index.html b/files/fr/archive/web/javascript/extensions_microsoft/at-if/index.html new file mode 100644 index 0000000000..bf7c949e33 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/at-if/index.html @@ -0,0 +1,78 @@ +--- +title: '@if' +slug: Archive/Web/JavaScript/Extensions_Microsoft/at-if +tags: + - JavaScript + - Microsoft + - Non-standard + - Obsolete + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/at-if +--- +
{{JSRef}}{{Non-standard_header}}{{Obsolete_Header}}
+ +
Attention ! La compilation conditionnelle n'est plus prise en charge à partir d'Internet Explorer 11 en mode standard et pour les applications Windows Store à partir de Windows 8.
+ +

L'instruction @if exécute un groupe d'instructions en fonction de la valeur d'une expression.

+ +

Syntaxe

+ +
@if (
+   condition1
+)
+   texte1
+[@elif (
+   condition2
+)
+   texte2]
+[@else
+   texte3]
+@end
+ +

Paramètres

+ +
+
texte1 {{optional_inline}}
+
Le texte à analyser si condition1 est vérifiée.
+
texte2 {{optional_inline}}
+
Le texte à analyser si condition1 est fausse et que condition2 est vraie.
+
texte3 {{optional_inline}}
+
Le texte à analyser si condition1 et condition2 sont fausses.
+
+ +

Notes

+ +

Lorsqu'on écrit une instruction @if, il n'est pas nécessaire de placer chaque clause sur une ligne séparée. Il est possible d'utiliser plusieurs clauses @elif mais celles-ci doivent nécessairement être présentes avant toute clause @else.

+ +

L'instruction @if est généralement utilisée afin de déterminer quel code utiliser parmi plusieurs options.

+ +

Lors de l'écriture d'un script destiné au Web, il est nécessaire que les instructions de compilation conditionnelle soient placées dans des commentaires afin que les environnements qui ne les prennent pas en charge puissent les ignorer.

+ +

Exemples

+ +
/*@cc_on @*/
+/*@
+  console.log("Version de JavaScript : " + @_jscript_version + ".");
+  @if (@_win32)
+    console.log("Version 32 bits de Windows.");
+  @elif (@_win16)
+    console.log("Version 16 bits de Windows.");
+  @else
+    console.log("Un autre système d'exploitation est utilisé.");
+  @end
+@*/
+
+ +

Prérequis

+ +

Cette instruction est prise en charge par toutes les versions d'Internet Explorer mais ne peut pas être utilisée dans les applications pour Windows 8.x Store.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/at-set/index.html b/files/fr/archive/web/javascript/extensions_microsoft/at-set/index.html new file mode 100644 index 0000000000..dec4e007b9 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/at-set/index.html @@ -0,0 +1,94 @@ +--- +title: '@set' +slug: Archive/Web/JavaScript/Extensions_Microsoft/at-set +tags: + - JavaScript + - Microsoft + - Non-standard + - Obsolete + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/at-set +--- +
{{JSRef}}{{Non-standard_header}}{{Obsolete_Header}}
+ +
Attention ! La compilation conditionnelle n'est plus prise en charge à partir d'Internet Explorer 11 en mode standard et pour les applications Windows Store à partir de Windows 8.
+ +

L'instruction @set permet de créer des variables grâce à des instructions de compilation conditionnelles.

+ +

Syntaxe

+ +
@set @varname = term
+
+ +

Paramètres

+ +
+
varname
+
Un nom de variable JavaScript valide. Ce nom doit toujours être précédé d'une arobase (@).
+
term
+
Zéro ou plusieurs opérateurs unaires suivis par une constante, un variable de compilation conditionnelle ou une expression entre parenthèses.
+
+ +

Notes

+ +

Les variables numériques et booléennes sont prises en charge pour la compilation conditionnelle. Il n'est pas possible d'utiliser des chaînes de caractères. Les variables créées grâce à @set sont généralement utilisées au sein d'instructions de compilation conditionnelle mais peuvent être utilisées n'importe où dans du code JavaScript.

+ +

Voici quelques exemples :

+ +
@set @mavar1 = 12
+
+@set @mavar2 = (@mavar1 * 20)
+
+@set @mavar3 = @_jscript_version
+
+ +

Les opérateurs suivants peuvent être utilisés dans les expressions entre parenthèses :

+ + + +

Si une variable est utilisée avant d'avoir été définie, sa valeur par défaut sera NaN. Il est possible de vérifier si une variable vaut NaN grâce à une instruction @if :

+ +
@if (@nouvelleVar !== @nouvelleVar)
+  …
+
+ +

Cette méthode fonctionne car NaN est la seule valeur qui n'est pas égale à elle-même au sens de l'égalité stricte.

+ +

Prérequis

+ +

Cette instruction est prise en charge par toutes les versions d'Internet Explorer mais ne peut pas être utilisée dans les applications pour Windows 8.x Store.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/date.getvardate/index.html b/files/fr/archive/web/javascript/extensions_microsoft/date.getvardate/index.html new file mode 100644 index 0000000000..ea1fd3c8c2 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/date.getvardate/index.html @@ -0,0 +1,41 @@ +--- +title: Date.getVarDate +slug: Archive/Web/JavaScript/Extensions_Microsoft/Date.getVarDate +tags: + - JavaScript + - Méthode + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/Date.getVarDate +--- +
{{JSRef("Objets_globaux","Date")}}{{Non-standard_Header}}{{Obsolete_Header}}
+ +
Non-standard. Ne doit pas être utilisé !
+Cet objet est spécifique à Microsoft et ne fonctionne qu'avec Internet Explorer.
+ +

La méthode getVarDate() renvoie une valeur VT_DATE à partir d'un objet {{jsxref("Date")}}.

+ +

Syntaxe

+ +
dateObj.getVarDate()
+
+ +

Valeur de retour

+ +

Une valeur de type VT_DATE.

+ +

Notes

+ +

La méthode getVarDate() est utilisée lorsque du code JavaScript interagit avec des objets COM, ActiveX ou d'autres objets qui utilisent des dates au format VT_DATE. Cela inclut les objets Visual Basic et VBScript. Le format définitif de la valeur renvoyé dépend des paramètres régionaux.

+ +

Prérequis

+ +

Fonctionnalité prise en charge sur les différents modes Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard, Internet Explorer 10 en mode standard. Elle n'est pas prise en charge par les applications Windows 8.x Store.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/debug/debuggerenabled/index.html b/files/fr/archive/web/javascript/extensions_microsoft/debug/debuggerenabled/index.html new file mode 100644 index 0000000000..f0db8375b9 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/debug/debuggerenabled/index.html @@ -0,0 +1,30 @@ +--- +title: Debug.debuggerEnabled +slug: Archive/Web/JavaScript/Extensions_Microsoft/Debug/debuggerEnabled +tags: + - JavaScript + - Microsoft + - Non-standard + - Propriété + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/Debug/debuggerEnabled +--- +
{{JSRef}}{{Non-standard_header}}
+ +

La propriété statique Debug.debuggerEnabled indique si le débogage est actif pour le contexte de script courant. Le débogage peut être activé ou désactivé qu'un débogueur soit attaché ou non.

+ +

Syntaxe

+ +
var dbgEnabled = Debug.debuggerEnabled;
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge pour les modes suivants : Internet Explorer 10 en mode standard et Internet Explorer 11 en mode standard. Elle est également prise en charge pour les applications Store (Windows 8 et Windows Phone 8.1).
+ Cette fonctionnalité n'est pas prise en charge pour les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard et Internet Explorer 9 en mode standard.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/debug/index.html b/files/fr/archive/web/javascript/extensions_microsoft/debug/index.html new file mode 100644 index 0000000000..94eaeffe88 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/debug/index.html @@ -0,0 +1,140 @@ +--- +title: Debug +slug: Archive/Web/JavaScript/Extensions_Microsoft/Debug +tags: + - JavaScript + - Microsoft + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/Debug +--- +
{{JSRef}}{{non-standard_header}}
+ +
Attention !
+L'objet Debug ne fonctionne qu'avec Internet Explorer et les applications Windows 8 et Windows Phone 8.1.
+ +

L'objet Debug est un objet global qui permet d'envoyer des informations au débogueur.

+ +

Syntaxe

+ +

L'objet Debug n'est pas instancié, il fournit des propriétés et méthodes statiques.

+ +

Différents outils permettent de déboguer les applications Internet Explorer et Windows 8.x Store. Pour les applications Windows 8.x Store, les méthodes statiques write et writeln fournies par Debug permettent d'afficher des chaînes de caractères dans le volet Output de Visual Studio lors de l'exécution.

+ +

Pour déboguer des scripts Internet Explorer, il faut avoir un débogueur de script installé et le script exécuté en mode debug. Internet Explorer 8 et les versions ultérieures possèdent un débogueur JavaScript inégré.

+ +

Si le script n'est pas en cours de débogage, les méthodes et propriétés de Debug n'auront pas d'effet.

+ +

Constantes

+ +

Codes de statut pour les fonctions de rappel asynchrones

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ConstanteDescriptionValeur
Debug.MS_ASYNC_CALLBACK_STATUS_ASSIGN_DELEGATELa tâche synchrone a affecté une fonction de rappel ou une continuation à exécuter dans une opération asynchrone.0
Debug.MS_ASYNC_CALLBACK_STATUS_JOINLa tâche synchrone a rejoint une partie d'une opération asynchrone.1
Debug.MS_ASYNC_CALLBACK_STATUS_CHOOSEANYLa tâche synchrone a satisfait au choix d'une opération asynchrone.2
Debug.MS_ASYNC_CALLBACK_STATUS_CANCELLa tâche synchrone a été annulée.3
Debug.MS_ASYNC_CALLBACK_STATUS_ERRORLa tâche synchrone a provoqué une erreur dans une opération asynchrone4
+ +

Codes de statut pour les opérations asynchrones

+ + + + + + + + + + + + + + + + + + + + + + + + +
ConstanteDescriptionValeur
Debug.MS_ASYNC_OP_STATUS_SUCCESSL'opération asynchrone a réussi.1
Debug.MS_ASYNC_OP_STATUS_CANCELEDL'opération asynchrone a été annulée.2
Debug.MS_ASYNC_OP_STATUS_ERRORL'opération asynchrone a déclenché une erreur.3
+ +

Propriétés

+ +
+
Debug.debuggerEnabled
+
Cette propriété indique si le débogage est actif pour le contexte de script courant. Le débogage peut être actif ou non, qu'un débogueur soit attaché ou non.
+
Debug.setNonUserCodeExceptions
+
Cette propriété indique si certains blocs try-catch de la portée courante sont considérés par le débogueur comme étant gérés par l'utilisateur.
+
+ +

Méthodes

+ +
+
Debug.msTraceAsyncCallbackCompleted
+
Indique si la pile d'appel pour les fonctions de rappel associée a une opération asynchrone précédemment définie est terminée.
+
Debug.msTraceAsyncCallbackStarting
+
Associe une pile de fonction de rappel à l'opération asynchrone précédemment définie.
+
Debug.msTraceAsyncOperationCompleted
+
Indique qu'une opération asynchrone est terminée.
+
Debug.msTraceAsyncOperationStarting
+
Initie une trace pour une opération asynchrone.
+
Debug.msUpdateAsyncCallbackRelation
+
Met à jour la relation entre la tâche synchrone et l'opération asynchrone associée.
+
Debug.write
+
Envoie une chaîne de caractères au débogueur du script.
+
Debug.writeln
+
Envoie une chaîne de caractères au débogueur du script, cette chaîne sera suivie par un retour à la ligne.
+
+ +

Exemples

+ +

Afficher la valeur d'une variable

+ +

Le fragment de code suivant permet d'afficher la valeur d'une variable lorsqu'on débogue le script grâce à la fonction write.

+ +
var compteur = 42;
+Debug.write("Compteur vaut " + compteur);
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge pour les modes : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard, Internet Explorer 10 en mode standard et Internet Explorer 11 en mode standard. Elle est également prise en charge pour les applications Store (Windows 8 et Windows Phone 8.1).

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/debug/mstraceasynccallbackcompleted/index.html b/files/fr/archive/web/javascript/extensions_microsoft/debug/mstraceasynccallbackcompleted/index.html new file mode 100644 index 0000000000..a644fd8577 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/debug/mstraceasynccallbackcompleted/index.html @@ -0,0 +1,26 @@ +--- +title: Debug.msTraceAsyncCallbackCompleted +slug: >- + Archive/Web/JavaScript/Extensions_Microsoft/Debug/msTraceAsyncCallbackCompleted +tags: + - JavaScript + - Microsoft + - Non-standard + - Propriété + - Reference +translation_of: >- + Archive/Web/JavaScript/Microsoft_Extensions/Debug/msTraceAsyncCallbackCompleted +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Non-standard. Ne doit pas être utilisé !
+Cet objet est spécifique à Microsoft et ne fonctionne qu'avec Internet Explorer.
+ +

Indique que la pile de rappels (callback stack) associée avec l'opération asynchrone précédemment indiquée est terminée.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/debug/mstraceasynccallbackstarting/index.html b/files/fr/archive/web/javascript/extensions_microsoft/debug/mstraceasynccallbackstarting/index.html new file mode 100644 index 0000000000..928acaad56 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/debug/mstraceasynccallbackstarting/index.html @@ -0,0 +1,71 @@ +--- +title: Debug.msTraceAsyncCallbackStarting +slug: Archive/Web/JavaScript/Extensions_Microsoft/Debug/msTraceAsyncCallbackStarting +tags: + - JavaScript + - Microsoft + - Méthode + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/Debug/msTraceAsyncCallbackStarting +--- +
{{JSRef}}{{Non-standard_header}}
+ +

La méthode statique Debug.msTraceAsyncCallbackStarting() permet d'associer une pile d'appel avec une opération asynchrone donnée.

+ +

Syntaxe

+ +
Debug.msTraceAsyncCallbackStarting(asyncOperationId)
+ +

Paramètres

+ +
+
asyncOperationId
+
Un identifiant d'une opération asynchrone (tel que renvoyé par Debug.msTraceAsyncOperationStarting()).
+
+ +

Notes

+ +

Cette fonction doit être appelée après l'appel à Debug.msTraceAsyncOperationCompleted.

+ +
+

Note : Certains outils de débogage n'affichent pas les informations envoyées au débogueur.

+
+ +

asyncOperationId doit correspondre à un identifiant d'une opération fourni par Debug.msTraceAsyncOperationStarting().

+ +

Exemples

+ +

Le fragment de code suivant permet de tracer un appel asynchrone dans une application Windows 8.x Store.

+ +
function asyncWrapperFunction() {
+  var opID = Debug.msTraceAsyncOperationStarting('async trace');
+  doSomethingAsync().then(function (result) {
+    Debug.msTraceAsyncOperationCompleted(opID, Debug.MS_ASYNC_OP_STATUS_SUCCESS);
+    Debug.msTraceAsyncCallbackStarting(opID);
+    // Traiter le résultat de l'opération asynchrone.
+  }, function (error) {
+    Debug.msTraceAsyncOperationCompleted(opID, Debug.MS_ASYNC_OP_STATUS_ERROR);
+    Debug.msTraceAsyncCallbackStarting(opID);
+  });
+  Debug.msTraceAsyncCallbackCompleted();
+}
+
+function doSomethingAsync() {
+  return WinJS.Promise.as(true);
+}
+
+asyncWrapperFunction();
+
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge par le mode standard d'Internet Explorer 11 et par les applications Store (Windows 8.1 et Windows Phone 8.1).
+ Elle n'est pas prise en charge par les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard, Internet Explorer 10 en mode standard. Elle n'est pas non plus prise en charge par Windows 8.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/debug/mstraceasyncoperationcompleted/index.html b/files/fr/archive/web/javascript/extensions_microsoft/debug/mstraceasyncoperationcompleted/index.html new file mode 100644 index 0000000000..2a9c69ac01 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/debug/mstraceasyncoperationcompleted/index.html @@ -0,0 +1,88 @@ +--- +title: Debug.msTraceAsyncOperationCompleted +slug: >- + Archive/Web/JavaScript/Extensions_Microsoft/Debug/msTraceAsyncOperationCompleted +tags: + - JavaScript + - Microsoft + - Méthode + - Non-standard + - Reference +translation_of: >- + Archive/Web/JavaScript/Microsoft_Extensions/Debug/msTraceAsyncOperationCompleted +--- +
{{JSRef}}{{Non-standard_header}}
+ +

La méthode statique Debug.msTraceAsyncCallbackCompleted() indique si une opération asynchrone est terminée.

+ +

Syntaxe

+ +
Debug.msTraceAsyncCallbackCompleted(asyncOperationId[, status])
+
+ +

Paramètres

+ +
+
asyncOperationId
+
L'identifiant associé à l'opération asynchrone.
+
status {{optional_inline}}
+
Le statut de l'opération asynchrone. Si cet argument n'est pas indiqué, c'est la constante Debug.MS_ASYNC_OP_STATUS_SUCCESS qui sera utilisée.
+
+ +

Notes

+ +

asyncOperationId doit correspondre à un identifiant d'une opération fourni par Debug.msTraceAsyncOperationStarting().

+ +

Les valeurs qui peuvent être utilisées pour l'argument status sont :

+ + + +
+

Note : Certains outils de débogage n'affichent pas les informations envoyées au débogueur.

+
+ +

Exemples

+ +

Le fragment de code suivant permet de tracer un appel asynchrone dans une application Windows 8.x Store.

+ +
function asyncWrapperFunction() {
+  var opID = Debug.msTraceAsyncOperationStarting('async trace');
+  doSomethingAsync().then(function (result) {
+    Debug.msTraceAsyncOperationCompleted(opID, Debug.MS_ASYNC_OP_STATUS_SUCCESS);
+    Debug.msTraceAsyncCallbackStarting(opID);
+    // Traiter le résultat de l'opération asynchrone.
+  }, function (error) {
+    Debug.msTraceAsyncOperationCompleted(opID, Debug.MS_ASYNC_OP_STATUS_ERROR);
+    Debug.msTraceAsyncCallbackStarting(opID);
+  });
+  Debug.msTraceAsyncCallbackCompleted();
+}
+
+function doSomethingAsync() {
+  return WinJS.Promise.as(true);
+}
+
+asyncWrapperFunction();
+
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge par le mode standard d'Internet Explorer 11 et par les applications Store (Windows 8.1 et Windows Phone 8.1).
+ Elle n'est pas prise en charge par les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard, Internet Explorer 10 en mode standard. Elle n'est pas non plus prise en charge par Windows 8.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/debug/mstraceasyncoperationstarting/index.html b/files/fr/archive/web/javascript/extensions_microsoft/debug/mstraceasyncoperationstarting/index.html new file mode 100644 index 0000000000..954900a7d8 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/debug/mstraceasyncoperationstarting/index.html @@ -0,0 +1,26 @@ +--- +title: Debug.msTraceAsyncOperationStarting +slug: >- + Archive/Web/JavaScript/Extensions_Microsoft/Debug/msTraceAsyncOperationStarting +tags: + - JavaScript + - Microsoft + - Méthode + - Non-standard + - Reference +translation_of: >- + Archive/Web/JavaScript/Microsoft_Extensions/Debug/msTraceAsyncOperationStarting +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Non-standard. Ne doit pas être utilisé !
+Cet objet est spécifique à Microsoft et ne fonctionne qu'avec Internet Explorer.
+ +

Initialise une trace pour une opération asynchrone.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/debug/msupdateasynccallbackrelation/index.html b/files/fr/archive/web/javascript/extensions_microsoft/debug/msupdateasynccallbackrelation/index.html new file mode 100644 index 0000000000..64aa29e1cc --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/debug/msupdateasynccallbackrelation/index.html @@ -0,0 +1,71 @@ +--- +title: Debug.msUpdateAsyncCallbackRelation +slug: >- + Archive/Web/JavaScript/Extensions_Microsoft/Debug/msUpdateAsyncCallbackRelation +tags: + - JavaScript + - Microsoft + - Méthode + - Non-standard + - Reference +translation_of: >- + Archive/Web/JavaScript/Microsoft_Extensions/Debug/msUpdateAsyncCallbackRelation +--- +
{{JSRef}}{{Non-standard_header}}
+ +

La méthode statique Debug.msUpdateAsyncCallbackRelation met à jour l'état de la rélation entre un élément de travail synchrone et l'opération asynchrone associée.

+ +

Syntaxe

+ +
Debug.msUpdateAsyncCallbackRelation(relatedAsyncOperationId[, relationType])
+ +

Paramètres

+ +
+
asyncOperationId
+
L'identifiant associé à l'opération asynchrone.
+
relationType {{optional_inline}}
+
Le type de relation.
+
+ +

Notes

+ +

L'élément de travail synchrone est généralement la fonction de rappel pour l'opération asynchrone. Cette fonction peut être appelée lorsqu'une opération asynchrone est interrompue, qu'une opération de jointure est utilisée ou dans d'autres cas.

+ +

Les valeurs qui peuvent être utilisées pour relationType sont :

+ + + +

Pour plus d'informations, voir les constantes relatives au débogage.

+ +
+

Note : Certains outils de débogage n'affichent pas les informations envoyées au débogueur.

+
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge par le mode standard d'Internet Explorer 11 et par les applications Store (Windows 8.1 et Windows Phone 8.1).
+ Elle n'est pas prise en charge par les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard, Internet Explorer 10 en mode standard. Elle n'est pas non plus prise en charge par Windows 8.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/debug/setnonusercodeexceptions/index.html b/files/fr/archive/web/javascript/extensions_microsoft/debug/setnonusercodeexceptions/index.html new file mode 100644 index 0000000000..53730ac015 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/debug/setnonusercodeexceptions/index.html @@ -0,0 +1,48 @@ +--- +title: setNonUserCodeExceptions +slug: Archive/Web/JavaScript/Extensions_Microsoft/Debug/setNonUserCodeExceptions +tags: + - JavaScript + - Microsoft + - Non-standard + - Propriété + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/Debug/setNonUserCodeExceptions +--- +
{{JSRef}}{{Non-standard_header}}
+ +
La propriété statique Debug.setNonUserCodeExceptions indique si les blocs try-catch de cette portée sont considérés par le débogueur comme étant gérés par l'utilisateur. Les exceptions peuvent être considérées comme levées, gérées par l'utilisateur ou non-gérées.
+ +

Syntaxe

+ +
Debug.setNonUserCodeExceptions [= bool];
+ +

Notes

+ +

Lorsque cette propriété est définie avec true pour une certaine portée, le débogueur peut décider de certaines actions (interrompre l'exécution par exemple) lorsque des exceptions sont levées dans la portée pour laquelle le développeur souhaite gérer les exceptions de façon manuelle. Lorsque cette propriété vaut false, on a le même comportement que si elle n'avait jamais été définie.

+ +

Pour plus d'informations sur le débogage, voir Un aperçu du débogage Active Script.

+ +

Exemples

+ +
(function () {
+  Debug.setNonUserCodeExceptions = true;
+  try{
+    var x = null;
+    x.y();
+  } catch (e) {
+    // Catch the exception.
+  }
+})();
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge pour les modes suivants : Internet Explorer 10 en mode standard et Internet Explorer 11 en mode standard. Elle est également prise en charge pour les applications Store (Windows 8 et Windows Phone 8.1).
+ Cette fonctionnalité n'est pas prise en charge pour les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard et Internet Explorer 9 en mode standard.

+ +

See also

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/debug/write/index.html b/files/fr/archive/web/javascript/extensions_microsoft/debug/write/index.html new file mode 100644 index 0000000000..c2f7b095fb --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/debug/write/index.html @@ -0,0 +1,57 @@ +--- +title: Debug.write +slug: Archive/Web/JavaScript/Extensions_Microsoft/Debug/write +tags: + - JavaScript + - Microsoft + - Méthode + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/Debug/write +--- +
{{JSRef}}{{Non-standard_header}}
+ +

La méthode statique Debug.write() permet d'envoyer des chaînes de caractères au débogueur.

+ +

Syntaxe

+ +
Debug.write([str1 [, str2 [, ... [, strN]]]])
+
+ +

Paramètres

+ +
+
str1, str2, ... , strN {{optional_inline}}
+
Les chaînes à envoyer au débogueur.
+
+ +

Notes

+ +

La fonction Debug.write() envoie des chaînes de caractères à la fenêtre de débogage du script. Si le script n'est pas en train d'être débogué, la fonction n'a aucun effet.

+ +

Debug.write() est presqu'identique à la fonction Debug.writeln(), la seule différence est que cette dernière ajoute un saut de ligne après les chaînes de caractères qui lui sont passées en arguments.

+ +

Exemples

+ +

Dans l'exemple qui suit, on utilise la fonction Debug.write() afin d'afficher la valeur d'une variable dans la fenêtre du débogueur.

+ +
+

Note : Pour exécuter cet exemple, il est nécessaire d'avoir un débogueur installé et d'exécuter le script en mode debug.

+ +

Internet Explorer 8 et les versions ultérieures embarquent un débogueur JavaScript. Pour les versions antérieures, voir Comment activer et démarrer le débogage de script à partir d'Internet Explorer.

+
+ +
var compteur = 42;
+Debug.write("Compteur vaut " + compteur);
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge pour les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard, Internet Explorer 10 en mode standard, Internet Explorer 11 en mode standard. Elle est également prise en charge pour les applications Store (Windows 8 et Windows Phone 8.1).

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/debug/writeln/index.html b/files/fr/archive/web/javascript/extensions_microsoft/debug/writeln/index.html new file mode 100644 index 0000000000..e1f7f63d3a --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/debug/writeln/index.html @@ -0,0 +1,56 @@ +--- +title: Debug.writeln +slug: Archive/Web/JavaScript/Extensions_Microsoft/Debug/writeln +tags: + - JavaScript + - Méthode + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/Debug/writeln +--- +
{{JSRef}}{{Non-standard_header}}
+ +

La méthode statique Debug.writeln() permet d'envoyer des chaînes de caractères au débogueur qui seront suivies par un saut de ligne.

+ +

Syntaxe

+ +
Debug.writeln([str1 [, str2 [, ... [, strN]]]])
+
+ +

Paramètres

+ +
+
str1, str2, ... , strN {{optional_inline}}
+
Les chaînes à envoyer au débogueur.
+
+ +

Notes

+ +

La fonction Debug.writeln() envoie des chaînes de caractères suivies par un saut de ligne à la fenêtre de débogage du script. Si le script n'est pas en train d'être débogué, la fonction n'a aucun effet.

+ +

Debug.writeln() est presqu'identique à la fonction Debug.write(), la seule différence est que cette dernière n'ajoute pas de saut de ligne après les chaînes de caractères qui lui sont passées en arguments.

+ +

Exemples

+ +

Dans l'exemple qui suit, on utilise la fonction Debug.writeln() afin d'afficher la valeur d'une variable dans la fenêtre du débogueur.

+ +
+

Note : Pour exécuter cet exemple, il est nécessaire d'avoir un débogueur installé et d'exécuter le script en mode debug.

+ +

Internet Explorer 8 et les versions ultérieures embarquent un débogueur JavaScript. Pour les versions antérieures, voir Comment activer et démarrer le débogage de script à partir d'Internet Explorer.

+
+ +
var compteur = 42;
+Debug.writeln("Compteur vaut " + compteur);
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge pour les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard, Internet Explorer 10 en mode standard, Internet Explorer 11 en mode standard. Elle est également prise en charge pour les applications Store (Windows 8 et Windows Phone 8.1).

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/enumerator/atend/index.html b/files/fr/archive/web/javascript/extensions_microsoft/enumerator/atend/index.html new file mode 100644 index 0000000000..67a9477f70 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/enumerator/atend/index.html @@ -0,0 +1,62 @@ +--- +title: Enumerator.atEnd +slug: Archive/Web/JavaScript/Extensions_Microsoft/Enumerator/atEnd +tags: + - JavaScript + - Microsoft + - Méthode + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/Enumerator/atEnd +--- +
{{JSRef}}{{Non-standard_header}}
+ +

La méthode Enumerator.atEnd() renvoie un booléen qui indique si l'énumérateur a atteint la fin de la collection.

+ +

Syntaxe

+ +
monEnum.atEnd()
+
+ +

Valeur de retour

+ +

Un booléen (cf. {{jsxref("Boolean")}}) qui indique si l'énumérateur est parvenu à la fin de la collection ou si la collection est vide ou si l'élément courant vaut {{jsxref("undefined")}}. Sinon, la méthode renvoie false.

+ +

Exemples

+ +

Dans l'exemple suivant, on utilise la méthode atEnd() afin de déterminer si on a atteint la fin d'une liste de disques :

+ +
function ShowDrives() {
+  var s = "";
+  var bytesPerGB = 1024 * 1024 * 1024;
+  var fso = new ActiveXObject("Scripting.FileSystemObject");
+  var e = new Enumerator(fso.Drives);
+  e.moveFirst();
+  while (e.atEnd() == false) {
+    var drv = e.item();
+    s += drv.Path + " - ";
+    if (drv.IsReady) {
+      var freeGB = drv.FreeSpace / bytesPerGB;
+      var totalGB = drv.TotalSize / bytesPerGB;
+      s += freeGB.toFixed(3) + " GB free of ";
+      s += totalGB.toFixed(3) + " GB";
+    } else {
+      s += "Not Ready";
+    }
+    s += "<br />";
+    e.moveNext();
+  }
+  return(s);
+}
+
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge pour les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard et Internet Explorer 10 en mode standard. Cette fonctionnalité n'est pas prise en charge dans les applications Windows 8.x Store.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/enumerator/index.html b/files/fr/archive/web/javascript/extensions_microsoft/enumerator/index.html new file mode 100644 index 0000000000..762a178557 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/enumerator/index.html @@ -0,0 +1,98 @@ +--- +title: Enumerator +slug: Archive/Web/JavaScript/Extensions_Microsoft/Enumerator +tags: + - Enumerator + - JavaScript + - Microsoft + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/Enumerator +--- +
{{JSRef}}{{non-standard_header}}
+ +
Attention ! Cet objet est une extension non-standard de Microsoft. Elle est uniquement prise en charge par Internet Explorer. Elle n'est pas prise en charge dans les applications Windows 8.x Store.
+ +

L'objet Enumerator permet d'énumérer les éléments d'une collection.

+ +

Syntaxe

+ +
enumObj = new Enumerator([collection])
+
+ +

Paramètres

+ +
+
collection {{optional_inline}}
+
Un objet Collection.
+
+ +

Valeur de retour

+ +
+
enumObj
+
Le nom de la variable à laquelle l'objet Enumerator est affecté.
+
+ +

Notes

+ +

Les collections diffèrent des tableaux car les éléments de la collection ne sont pas accessibles directement. Plutôt que d'utiliser des indices, on déplace le pointeur de l'élément courant vers le prochain élément de la collection.

+ +

L'objet Enumerator fournit un moyen d'accéder aux éléments d'une collection à la façon de l'instruction For...Each en VBScript.

+ +

Exemples

+ +
var bytesPerGB = 1024 * 1024 * 1024;
+var fso = new ActiveXObject("Scripting.FileSystemObject");
+
+document.write(fso.Drives);
+var e = new Enumerator(fso.Drives);
+
+var driveString = "";
+
+e.moveFirst();
+while (e.atEnd() == false) {
+    var drv = e.item();
+    driveString += drv.Path + " - ";
+    if (drv.IsReady) {
+        var freeGB = drv.FreeSpace / bytesPerGB;
+        var totalGB = drv.TotalSize / bytesPerGB;
+        driveString += freeGB.toFixed(3) + " GB free of ";
+        driveString += totalGB.toFixed(3) + " GB";
+    } else {
+      driveString += "Not Ready";
+    }
+    driveString += "<br />";
+    e.moveNext();
+}
+document.write(driveString);
+// Output: <drive information
+
+ +

Propriétés

+ +

L'objet Enumerator ne possède pas de propriété.

+ +

Méthodes

+ +
+
Enumerator.atEnd
+
Renvoie une booléen qui indique si l'énumérateur a atteint la fin de la collection.
+
Enumerator.item
+
Renvoie l'élément courant de la collection.
+
Enumerator.moveFirst
+
Déplace le pointeur au premier élément de la collection.
+
Enumerator.moveNext
+
Déplace le pointeur de la collection sur l'élément suivant.
+
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge pour les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard et Internet Explorer 10 en mode standard. Cette fonctionnalité n'est pas prise en charge dans les applications Windows 8.x Store.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/enumerator/item/index.html b/files/fr/archive/web/javascript/extensions_microsoft/enumerator/item/index.html new file mode 100644 index 0000000000..f5ac109d18 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/enumerator/item/index.html @@ -0,0 +1,62 @@ +--- +title: Enumerator.item +slug: Archive/Web/JavaScript/Extensions_Microsoft/Enumerator/item +tags: + - JavaScript + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/Enumerator/item +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cette méthode est spécifique à Microsoft et est uniquement prise en charge par Internet Explorer.
+ +

La méthode Enumerator.item() renvoie l'élément courant de la collection.

+ +

Syntaxe

+ +
enumObj.item()
+ +

Valeur de retour

+ +

Cette méthode renvoie la valeur de l'élément courant. Si la collection est vide, cette méthode renverra {{jsxref("undefined")}}.

+ +

Exemples

+ +
function ShowDrives() {
+  var s = "";
+  var bytesPerGB = 1024 * 1024 * 1024;
+  var fso = new ActiveXObject("Scripting.FileSystemObject");
+  var e = new Enumerator(fso.Drives);
+  e.moveFirst();
+  while (e.atEnd() == false) {
+    var drv = e.item();
+    s += drv.Path + " - ";
+    if (drv.IsReady) {
+      var freeGB = drv.FreeSpace / bytesPerGB;
+      var totalGB = drv.TotalSize / bytesPerGB;
+      s += freeGB.toFixed(3) + " GB free of ";
+      s += totalGB.toFixed(3) + " GB";
+    } else {
+      s += "Not Ready";
+    }
+    s += "<br />";
+    e.moveNext();
+  }
+  return(s);
+}
+
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge pour les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard et Internet Explorer 10 en mode standard. Cette fonctionnalité n'est pas prise en charge dans les applications Windows 8.x Store.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/enumerator/movefirst/index.html b/files/fr/archive/web/javascript/extensions_microsoft/enumerator/movefirst/index.html new file mode 100644 index 0000000000..c7fcf8201e --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/enumerator/movefirst/index.html @@ -0,0 +1,66 @@ +--- +title: Enumerator.moveFirst +slug: Archive/Web/JavaScript/Extensions_Microsoft/Enumerator/moveFirst +tags: + - JavaScript + - Microsoft + - Méthode + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/Enumerator/moveFirst +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cette méthode est spécifique à Microsoft et ne fonctionne qu'avec Internet Explorer.
+ +

La méthode Enumerator.moveFirst() déplace le pointeur de l'énumérateur sur le premier élément de la collection.

+ +

Syntaxe

+ +
enumObj.moveFirst()
+ +

Notes

+ +

Si la collection ne contient aucun élément, l'élément courant vaudra {{jsxref("undefined")}}.

+ +

Exemples

+ +

Dans l'exemple suivant, on utilise la méthode moveFirst() afin d'évaluer les éléments de la collection Drivesà partir du début de la liste :

+ +
function ShowDrives() {
+  var s = "";
+  var bytesPerGB = 1024 * 1024 * 1024;
+  var fso = new ActiveXObject("Scripting.FileSystemObject");
+  var e = new Enumerator(fso.Drives);
+  e.moveFirst();
+  while (e.atEnd() == false) {
+    var drv = e.item();
+    s += drv.Path + " - ";
+    if (drv.IsReady) {
+      var freeGB = drv.FreeSpace / bytesPerGB;
+      var totalGB = drv.TotalSize / bytesPerGB;
+      s += freeGB.toFixed(3) + " GB free of ";
+      s += totalGB.toFixed(3) + " GB";
+    } else {
+      s += "Not Ready";
+    }
+    s += "<br />";
+    e.moveNext();
+  }
+  return(s);
+}
+
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge pour les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard et Internet Explorer 10 en mode standard. Cette fonctionnalité n'est pas prise en charge dans les applications Windows 8.x Store.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/enumerator/movenext/index.html b/files/fr/archive/web/javascript/extensions_microsoft/enumerator/movenext/index.html new file mode 100644 index 0000000000..1e0e3d6854 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/enumerator/movenext/index.html @@ -0,0 +1,66 @@ +--- +title: Enumerator.moveNext +slug: Archive/Web/JavaScript/Extensions_Microsoft/Enumerator/moveNext +tags: + - JavaScript + - Microsoft + - Méthode + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/Enumerator/moveNext +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cette méthode est spécifique à Microsoft et ne fonctionne qu'avec Internet Explorer.
+ +

La méthode Enumerator.moveNext() déplace le pointeur de l'énumérateur sur le prochain élément de la collection.

+ +

Syntaxe

+ +
enumObj.moveNext()
+ +

Notes

+ +

Si l'énumérateur a atteint la fin de la collection ou que celle-ci est vide, l'élément courant vaudra {{jsxref("undefined")}}.

+ +

Exemples

+ +

Dans l'exemple suivant, on utilise la méthode moveNext() afin de parcourir les éléments de la collection Drives :

+ +
function ShowDrives() {
+  var s = "";
+  var bytesPerGB = 1024 * 1024 * 1024;
+  var fso = new ActiveXObject("Scripting.FileSystemObject");
+  var e = new Enumerator(fso.Drives);
+  e.moveFirst();
+  while (e.atEnd() == false) {
+    var drv = e.item();
+    s += drv.Path + " - ";
+    if (drv.IsReady) {
+      var freeGB = drv.FreeSpace / bytesPerGB;
+      var totalGB = drv.TotalSize / bytesPerGB;
+      s += freeGB.toFixed(3) + " GB free of ";
+      s += totalGB.toFixed(3) + " GB";
+    } else {
+      s += "Not Ready";
+    }
+    s += "<br />";
+    e.moveNext();
+  }
+  return(s);
+}
+
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge pour les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard et Internet Explorer 10 en mode standard. Cette fonctionnalité n'est pas prise en charge dans les applications Windows 8.x Store.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/error.description/index.html b/files/fr/archive/web/javascript/extensions_microsoft/error.description/index.html new file mode 100644 index 0000000000..ad806722df --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/error.description/index.html @@ -0,0 +1,64 @@ +--- +title: Error.description +slug: Archive/Web/JavaScript/Extensions_Microsoft/Error.description +tags: + - JavaScript + - Microsoft + - Non-standard + - Propriété + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/Error.description +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cet objet est spécifique à Microsoft et ne fonctionne qu'avec Internet Explorer. Utiliser {{jsxref("Error.message")}} à la place.
+ +

La propriété Error.description permet d'obtenir ou de définir la chaîne de caractères qui décrit l'erreur courante.

+ +

Syntaxe

+ +
erreur.description [= exprChaine]
+ +

Paramètres

+ +
+
exprChaine {{optional_inline}}
+
Une chaîne de caractères qui contient la description de l'erreur.
+
+ +

Notes

+ +

La propriété description est spécifique à Microsoft et peut être utilisée à des fins de rétrocompatibilité pour les navigateurs de Microsoft. Elle fournit la même fonctionnalité que la propriété standard ECMAScript {{jsxref("Error.message")}} qui doit être utilisée en priorité.

+ +

Exemples

+ +
try {
+  // Cause an error:
+  x = y;
+} catch(e) {
+  // Affiche "[object Error]":
+  console.log(e);
+  console.log(" ");
+  // Affiche 5009:
+  console.log((e.number & 0xFFFF));
+  console.log(" ");
+  // Affiche "'y' is undefined":
+  console.log(e.description);
+  console.log(" ");
+  // Affiche "'y' is undefined":
+  console.log(e.message);
+}
+
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge avec les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard, Internet Explorer 10 en mode standard, Internet Explorer 11 en mode standard. Elle est également prise en charge pour les applications Store (Windows 8 et Windows Phone 8.1).

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/error.number/index.html b/files/fr/archive/web/javascript/extensions_microsoft/error.number/index.html new file mode 100644 index 0000000000..0f10395da8 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/error.number/index.html @@ -0,0 +1,61 @@ +--- +title: Error.number +slug: Archive/Web/JavaScript/Extensions_Microsoft/Error.number +tags: + - JavaScript + - Microsoft + - Non-standard + - Propriété + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/Error.number +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cette propriété est spécifique à Microsoft et ne fonctionne qu'avec Internet Explorer.
+ +

La propriété Error.number permet d'obtenir ou de définir la valeur numérique associée à une erreur donnée.

+ +

Syntax

+ +
erreur.number [= numeroErreur]
+
+ +

Paramètres

+ +
+
numeroErreur
+
Un entier représentant l'erreur.
+
+ +

Notes

+ +

Un numéro d'erreur est une valeur sur 32 bits. Les 16 bits de poids fort correspondent au facility code (NdT : « code d'emplacement ») et les 16 bits de poids faibles correspondent au code d'erreur. On pourra utiliser l'opérateur binaire & afin de combiner le nombre avec la valeur hexadécimale 0xFFFF.

+ +

Exemples

+ +
try {
+  // Cause une error:
+  x = y;
+} catch(e) {
+
+  console.log("Code d'erreur :");
+  console.log(e.number & 0xFFFF);       // 5009
+  console.log("Code d'emplacement :");
+  console.log(e.number >> 16 & 0x1FFF); // 10
+  console.log("Message d'erreur :");
+  console.log(e.message);               // 'y' is undefined
+}
+
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge avec les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard, Internet Explorer 10 en mode standard, Internet Explorer 11 en mode standard. Elle est également prise en charge pour les applications Store (Windows 8 et Windows Phone 8.1).

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/error.stacktracelimit/index.html b/files/fr/archive/web/javascript/extensions_microsoft/error.stacktracelimit/index.html new file mode 100644 index 0000000000..f0599b3e0d --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/error.stacktracelimit/index.html @@ -0,0 +1,48 @@ +--- +title: Error.stackTraceLimit +slug: Archive/Web/JavaScript/Extensions_Microsoft/Error.stackTraceLimit +tags: + - JavaScript + - Microsoft + - Non-standard + - Propriété + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/Error.stackTraceLimit +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cette propriété est spécifique à Microsoft et ne fonctionne qu'avec Internet Explorer.
+ +

La propriété Error.stackTraceLimit permet d'obtenir ou de définir la limite de pile pour la trace, cela correspond au nombre de niveaux d'appels à afficher dans les erreurs. La limite par défaut vaut 10.

+ +

Syntaxe

+ +
Error.stackTraceLimit
+ +

Notes

+ +

La propriété stackTraceLimit peut être un entier compris entre 0 et {{jsxref("Infinity")}}. Si stackTraceLimit vaut 0 au moment où l'erreur est déclenché, aucune pile d'appel ne sera affichée. Si cette propriété vaut une valeur négative ou non-numérique, elle sera convertie en 0. Si stackTraceLimit vaut Infinity, toute la pile sera affichée. Dans les autres cas, ToUint32 sera utilisée afin de convertir la valeur.

+ +

Exemples

+ +
try {
+  var err = new Error("my error");
+  Error.stackTraceLimit = 7;
+  throw err;
+} catch(e) {
+  console.log("Valeur de la limite pour la pile :");
+  console.log(Error.stackTraceLimit);
+}
+
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge par Internet Explorer 10 et par les applications Windows 8.x Store.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/getobject/index.html b/files/fr/archive/web/javascript/extensions_microsoft/getobject/index.html new file mode 100644 index 0000000000..22a2dfb1b3 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/getobject/index.html @@ -0,0 +1,78 @@ +--- +title: GetObject +slug: Archive/Web/JavaScript/Extensions_Microsoft/GetObject +tags: + - JavaScript + - Microsoft + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/GetObject +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cette fonction est spécifique à Microsoft et est uniquement prise en charge par Internet Explorer dans les versions antérieures à IE 9 (en mode standard).
+ +

La fonction GetObject() renvoie une référence à un objet Automation à partir d'un fichier donné.

+ +

Syntaxe

+ +
GetObject([pathname] [, class])
+ +

Paramètres

+ +
+
pathname
+
Un chemin complet contenant également le nom du fichier contenant l'objet qu'on souhaite récupérer. Si pathname n'est pas présent, l'argument class sera obligatoire.
+
class {{optional_inline}}
+
La classe de l'objet. Cet argument suit une syntaxe appname.objecttype où :
+
appname correspond au nom de l'application fournissant l'objet
+
objecttype correspond au type ou à la classe d'objet à créer.
+
+ +

Notes

+ +

La fonction GetObject() n'est pas prise en charge par Internet Explorer 9 en mode standard, Internet Explorer 10 en mode standard, Internet Explorer 11 en mode standard et par les applications Windows Store.

+ +

Exemples

+ +
var CADObject;
+CADObject = GetObject("C:\\CAD\\SCHEMA.CAD");
+
+ +

Lorsque ce code est exécuté, l'application associée au chemin indiquée est démarrée et l'objet indiqué est activé. Si l'argument pathname est une chaîne vide (""), GetObject renvoie une nouvelle instance du type souhaité. Si l'argument pathnameest absent, GetObject() renvoie l'objet actif courant pour le type indiqué. Si aucun objet ne correspond, une erreur est déclenchée.

+ +

Certaines applications permettent d'activer une partie d'un fichier. Pour cela, on peut terminer l'argument pathname par un point d'exclamation suivi du nom de la partie du fichier qu'on souhaite activer. Pour plus d'informations sur la composition du nom de la partie, voir la documentation de l'application qui a créé l'objet.

+ +

Ainsi, pour une application de dessin avec différents calques enregistrés dans un même fichier, on pourra utiliser l'instruction suivante pour récupérer un calque précis :

+ +
var LayerObject = GetObject("C:\\CAD\\SCHEMA.CAD!Layer3");
+
+ +

Si la classe de l'objet n'est pas passée en argument, l'objet Automation déterminera l'application à démarrer et l'objet à activer en fonction du nom de fichier passé en argument. Il est possible que certains fichiers prennent en charge plusieurs classes d'objet. Dans ce dernier cas, il faudra utiliser l'argument class afin d'indiquer la classe à récupérer :

+ +
var MyObject = GetObject("C:\\DRAWINGS\\SAMPLE.DRW", "FIGMENT.DRAWING");
+
+ +

Dans l'exemple précédent, FIGMENT est le nom d'une application de dessin et DRAWING est le nom d'un type d'objet pris en charge par cette application. Une fois l'objet activé, on peut y faire référence dans le code grâce à la variable qu'on a déclaré. Suite à l'instruction précédente, on peut manipuler les propriétés et méthodes du nouvel objet avec  MyObject :

+ +
MyObject.Line(9, 90);
+MyObject.InsertText(9, 100, "Hello, world.");
+MyObject.SaveAs("C:\\DRAWINGS\\SAMPLE.DRW");
+
+ +
+

Note : On utilisera la fonction GetObject() lorsqu'on dispose d'une instance courante pour l'objet ou qu'on souhaite créer un objet à partir d'un fichier déjà chargé. Si on ne dispose encore d'aucunee instance et qu'on ne souhaite pas utiliser un objet d'un fichier chargé, il faudra utiliser l'objet ActiveXObject.

+
+ +

Si un objet est enregistré comme un singleton, une seule instance de l'objet sera créée, quel que soit le nombre de fois où ActiveXObject est exécuté. Pour un tel singleton, GetObject() renvoie toujours la même instance lorsqu'elle est appelée avec la chaîne vide et provoque une erreur si l'argument pathname est absent.

+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge par les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard et Internet Explorer 8 en mode standard.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/index.html b/files/fr/archive/web/javascript/extensions_microsoft/index.html new file mode 100644 index 0000000000..176357d45e --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/index.html @@ -0,0 +1,68 @@ +--- +title: Extensions JavaScript spécifiques de Microsoft +slug: Archive/Web/JavaScript/Extensions_Microsoft +tags: + - JavaScript + - Microsoft + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions +--- +
{{JSSidebar("Microsoft Extensions")}} {{Non-standard_header}}
+ +

Les navigateurs édités par Microsoft (Internet Explorer ainsi que Microsoft Edge dans certains cas) prennent en charge certaines extensions qui sont spécifiques à Microsoft et n'appartiennent à l'ensemble JavaScript standard (ECMAScript).

+ +
+

Attention ! Ces API ne fonctionneront que pour les applications Microsoft, elles ne sont pas en voie de standardisation.

+
+ +

Objets

+ +
+ +
+ +

Fonctions

+ +
+ +
+ +

Instructions

+ +
+ +
+ +

Autres

+ +
+ +
+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/scriptengine/index.html b/files/fr/archive/web/javascript/extensions_microsoft/scriptengine/index.html new file mode 100644 index 0000000000..b8e6c7bce1 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/scriptengine/index.html @@ -0,0 +1,43 @@ +--- +title: ScriptEngine() +slug: Archive/Web/JavaScript/Extensions_Microsoft/ScriptEngine +tags: + - Déprécié + - JavaScript + - Microsoft + - Méthode + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/ScriptEngine +--- +
{{JSRef}}{{Non-standard_header}}{{Deprecated_Header}}
+ +

La fonction ScriptEngine() renvoie le nom du langage de script utilisé.

+ +

Syntaxe

+ +
ScriptEngine()
+ +

Valeur de retour

+ +

La fonction ScriptEngine() renvoie une chaîne de caractères indiquant le moteur de script utilisé. Pour les anciennes versions d'Internet Explorer, cette chaîne était "JScript".

+ +

Exemples

+ +
if (window.ScriptEngine) {
+  console.log(window.ScriptEngine());
+}
+// affiche JScript
+
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge par les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard, Internet Explorer 10 en mode standard et Internet Explorer 11 en mode standard. Elle est également prise en charge par les applications Store (Windows 8 et Windows Phone 8.1).

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/scriptenginebuildversion/index.html b/files/fr/archive/web/javascript/extensions_microsoft/scriptenginebuildversion/index.html new file mode 100644 index 0000000000..e14e26cb03 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/scriptenginebuildversion/index.html @@ -0,0 +1,45 @@ +--- +title: ScriptEngineBuildVersion +slug: Archive/Web/JavaScript/Extensions_Microsoft/ScriptEngineBuildVersion +tags: + - JavaScript + - Microsoft + - Méthode + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/ScriptEngineBuildVersion +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cette fonction est spécifique à Microsoft et ne fonctionne qu'avec Internet Explorer.
+ +

La fonction ScriptEngineBuildVersion() renvoie le numéro de build de la version du moteur de script courant.

+ +

Syntaxe

+ +
ScriptEngineBuildVersion()
+
+ +

Valeur de retour

+ +

La valeur de retour correspond à l'information de version stockée dans la bibliothèque dynamique (DLL) du moteur de script utilisé.

+ +

Exemples

+ +
if(window.ScriptEngineBuildVersion) {
+  console.log(window.ScriptEngineBuildVersion());
+}
+// Output: <numéro de build>
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge par les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard, Internet Explorer 10 en mode standard et Internet Explorer 11 en mode standard. Elle est également prise en charge par les applications Store (Windows 8 et Windows Phone 8.1).

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/scriptenginemajorversion/index.html b/files/fr/archive/web/javascript/extensions_microsoft/scriptenginemajorversion/index.html new file mode 100644 index 0000000000..a8a93243da --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/scriptenginemajorversion/index.html @@ -0,0 +1,46 @@ +--- +title: ScriptEngineMajorVersion() +slug: Archive/Web/JavaScript/Extensions_Microsoft/ScriptEngineMajorVersion +tags: + - JavaScript + - Microsoft + - Méthode + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/ScriptEngineMajorVersion +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cette fonction est spécifique à Microsoft et ne fonctionne qu'avec Internet Explorer.
+ +

La fonction ScriptEngineMajorVersion() permet d'obtenir le numéro de version majeur du moteur de script courant.

+ +

Syntaxe

+ +
ScriptEngineMajorVersion()
+ +

Valeur de retour

+ +

La valeur de retour correspond à l'information de version stockée dans la bibliothèque dynamique (DLL) du moteur de script utilisé.

+ +

Exemples

+ +
if (window.ScriptEngineMajorVersion) {
+  console.log(window.ScriptEngineMajorVersion());
+}
+
+Output: <current major version>
+
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge par les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard, Internet Explorer 10 en mode standard et Internet Explorer 11 en mode standard. Elle est également prise en charge par les applications Store (Windows 8 et Windows Phone 8.1).

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/scriptengineminorversion/index.html b/files/fr/archive/web/javascript/extensions_microsoft/scriptengineminorversion/index.html new file mode 100644 index 0000000000..162f3f01f4 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/scriptengineminorversion/index.html @@ -0,0 +1,46 @@ +--- +title: ScriptEngineMinorVersion() +slug: Archive/Web/JavaScript/Extensions_Microsoft/ScriptEngineMinorVersion +tags: + - JavaScript + - Microsoft + - Méthode + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/ScriptEngineMinorVersion +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cette fonction est spécifique à Microsoft et ne fonctionne qu'avec Internet Explorer.
+ +

La fonction ScriptEngineMinorVersion() permet d'obtenir le numéro de version mineur du moteur de script courant.

+ +

Syntaxe

+ +
ScriptEngineMinorVersion()
+ +

Valeur de retour

+ +

La valeur de retour correspond à l'information de version stockée dans la bibliothèque dynamique (DLL) du moteur de script utilisé.

+ +

Exemples

+ +
if (window.ScriptEngineMinorVersion) {
+  console.log(window.ScriptEngineMinorVersion());
+}
+
+Output: <version mineure>
+
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge par les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard, Internet Explorer 10 en mode standard et Internet Explorer 11 en mode standard. Elle est également prise en charge par les applications Store (Windows 8 et Windows Phone 8.1).

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/vbarray/dimensions/index.html b/files/fr/archive/web/javascript/extensions_microsoft/vbarray/dimensions/index.html new file mode 100644 index 0000000000..f2d0731ed5 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/vbarray/dimensions/index.html @@ -0,0 +1,80 @@ +--- +title: VBArray.dimensions +slug: Archive/Web/JavaScript/Extensions_Microsoft/VBArray/dimensions +tags: + - JavaScript + - Méthode + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/VBArray/dimensions +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cette méthode est spécifique à Microsoft et ne fonctionne qu'avec Internet Explorer.
+ +

La méthode VBArray.dimensions() renvoie le nombre de dimensions d'un objet {{jsxref("VBArray")}}.

+ +

Syntaxe

+ +
monVBArray.dimensions()
+ +

Exemples

+ +
<head>
+  <script type="text/vbscript">
+  <!--
+  Function CreateVBArray()
+     Dim i, j, k
+     Dim a(2, 2)
+     k = 1
+     For i = 0 To 2
+        For j = 0 To 2
+           a(j, i) = k
+           document.writeln(k)
+           k = k + 1
+        Next
+        document.writeln("<br />")
+     Next
+     CreateVBArray = a
+  End Function
+  -->
+  </script>
+
+  <script type="text/javascript">
+  <!--
+  function VBArrayTest(vbarray) {
+     var a = new VBArray(vbarray);
+     var b = a.toArray();
+     var s = "";
+     for (i = 1; i <= a.dimensions() ; i++) {
+       s += "La borne supérieure de la dimension " + i ";
+       s += " est " + a.ubound(i) + ".";
+     }
+     return s;
+  }
+  -->
+  </script>
+</head>
+
+<body>
+  <script type="text/javascript">
+    <!--
+    VBArrayTest(CreateVBArray());
+    -->
+  </script>
+</body>
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge par les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard et Internet Explorer 10 en mode standard. Elle n'est pas prise en charge par les applications Windows 8.x Store.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/vbarray/getitem/index.html b/files/fr/archive/web/javascript/extensions_microsoft/vbarray/getitem/index.html new file mode 100644 index 0000000000..0c4eec42c3 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/vbarray/getitem/index.html @@ -0,0 +1,89 @@ +--- +title: VBArray.getItem +slug: Archive/Web/JavaScript/Extensions_Microsoft/VBArray/getItem +tags: + - JavaScript + - Méthode + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/VBArray/getItem +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cette méthode est spécifique à Microsoft et ne fonctionne qu'avec Internet Explorer.
+ +

La méthode VBArray.getItem() l'élément du tableau {{jsxref("VBArray")}} courant à l'emplacement indiqué.

+ +

Syntaxe

+ +
monVBArray.getItem(dimension1[, dimension2[, ... [, dimensionN]]])
+ +

Paramètres

+ +
+
dimension1-dimensionN
+
Les coordonnées exactes de la valeur qu'on souhaite récupérer dans le tableau VBArray. La valeur n correspond au nombre de dimensions du tableau.
+
+ +

Valeur de retour

+ +

La valeur de l'objet située aux coordonnées dimension1-dimension2-…-dimensionN dans le tableau VBArray.

+ +

Exemples

+ +
<head>
+  <script type="text/vbscript">
+  <!--
+  Function CreateVBArray()
+     Dim i, j, k
+     Dim a(2, 2)
+     k = 1
+     For i = 0 To 2
+        For j = 0 To 2
+           a(j, i) = k
+           document.writeln(k)
+           k = k + 1
+        Next
+        document.writeln("<br />")
+     Next
+     CreateVBArray = a
+  End Function
+  -->
+  </script>
+
+  <script type="text/javascript">
+  <!--
+  function GetItemTest(vbarray) {
+     var i, j;
+     var a = new VBArray(vbarray);
+     for (i = 1; i <= 2 ; i++) {
+       for (j = 1; j <= 2 ; j++) {
+         console.log(a.getItem(i,j));
+     }
+  }
+  -->
+  </script>
+</head>
+
+<body>
+  <script type="text/javascript">
+    <!--
+    GetItemTest(CreateVBArray());
+    -->
+  </script>
+</body>
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge par les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard et Internet Explorer 10 en mode standard. Elle n'est pas prise en charge par les applications Windows 8.x Store.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/vbarray/index.html b/files/fr/archive/web/javascript/extensions_microsoft/vbarray/index.html new file mode 100644 index 0000000000..0b823f10f4 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/vbarray/index.html @@ -0,0 +1,108 @@ +--- +title: VBArray +slug: Archive/Web/JavaScript/Extensions_Microsoft/VBArray +tags: + - JavaScript + - Microsoft + - Non-standard + - Reference + - VBArray +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/VBArray +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cet objet est spécifique à Microsoft et est uniquement pris en charge par Internet Explorer.
+ +

L'objet VBArray permet d'accéder à des tableaux Visual Basic.

+ +

Syntaxe

+ +
varName = new VBArray(safeArray);
+ +

Paramètres

+ +
+
safeArray
+
Une valeur VBArray.
+
+ +

Notes

+ +

Les tableaux VBArray sont uniquement accessibles en lecture seule et ne peuvent pas être créés directement. L'argument safeArray doit être une valeur VBArray valide. L'obtention d'une telle valeur ne peut se faire que via un contrôle ActiveX ou via un autre objet.

+ +

Les tableaux VBArray peuvent avoir plusieurs dimensions, dont chacune a un ensemble d'indices différents.

+ +

Exemples

+ +

The following example consists of three parts. The first part is VBScript code to create a Visual Basic safe array. The second part is JavaScript code that converts the Visual Basic safe array to a JavaScript array. Both of these parts go into the <HEAD> section of an HTML page. The third part is the JavaScript code that goes in the <BODY> section to run the other two parts.

+ +
<head>
+  <script type="text/vbscript">
+  <!--
+  Function CreateVBArray()
+     Dim i, j, k
+     Dim a(2, 2)
+     k = 1
+     For i = 0 To 2
+        For j = 0 To 2
+           a(j, i) = k
+           document.writeln(k)
+           k = k + 1
+        Next
+        document.writeln("<br />")
+     Next
+     CreateVBArray = a
+  End Function
+  -->
+  </script>
+
+  <script type="text/javascript">
+  <!--
+  function VBArrayTest(vbarray) {
+     var a = new VBArray(vbarray);
+     var b = a.toArray();
+     var i;
+     for (i = 0; i < 9; i++) {
+       console.log(b[i]);
+     }
+  }
+  -->
+  </script>
+</head>
+
+<body>
+  <script type="text/javascript">
+    <!--
+    VBArrayTest(CreateVBArray());
+    -->
+  </script>
+</body>
+ +

Propriétés

+ +

L'objet VBArray ne possède aucune propriété.

+ +

Méthodes

+ +
+
VBArray.dimensions()
+
Cette méthode renvoie le nombre de dimensions du tableau VBArray.
+
VBArray.getItem()
+
Cette méthode renvoie l'élément à l'emplacement indiqué.
+
VBArray.lbound()
+
Cette méthode renvoie l'indice le plus bas du VBArray pour la dimension indiquée.
+
VBArray.toArray()
+
Cette méthode renvoie un tableau JavaScript standard converti à partir de l'objet VBArray.
+
VBArray.ubound()
+
Cette méthode renvoie l'indice le plus haut du VBArray pour la dimension indiquée.
+
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge par les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard et Internet Explorer 10 en mode standard. Elle n'est pas prise en charge par les applications Windows 8.x Store.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/vbarray/lbound/index.html b/files/fr/archive/web/javascript/extensions_microsoft/vbarray/lbound/index.html new file mode 100644 index 0000000000..4fa681822b --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/vbarray/lbound/index.html @@ -0,0 +1,91 @@ +--- +title: VBArray.lbound +slug: Archive/Web/JavaScript/Extensions_Microsoft/VBArray/lbound +tags: + - JavaScript + - Méthode + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/VBArray/lbound +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cette méthode est spécifique à Microsoft et ne fonctionne qu'avec Internet Explorer.
+ +

La méthode VBArray.lbound() renvoie l'indice le plus bas de l'objet {{jsxref("VBArray")}} pour la dimension indiquée.

+ +

Syntaxe

+ +
monVBArray.lbound(dimension)
+ +

Paramètres

+ +
+
dimension {{optional_inline}}
+
La dimension pour laquelle on veut l'indice le plus bas. La valeur par défaut est 1.
+
+ +

Valeur de retour

+ +

Si le tableau est vide, {{jsxref("undefined")}}, sinon l'indice le plus bas pour la dimension souhaitée. Si la valeur de dimension excède le nombre de dimensions du tableau VBArray, une erreur "Subscript out of range" est levée.

+ +

Exemples

+ +
<head>
+  <script type="text/vbscript">
+  <!--
+  Function CreateVBArray()
+     Dim i, j, k
+     Dim a(2, 2)
+     k = 1
+     For i = 0 To 2
+        For j = 0 To 2
+           a(j, i) = k
+           document.writeln(k)
+           k = k + 1
+        Next
+        document.writeln("<br />")
+     Next
+     CreateVBArray = a
+  End Function
+  -->
+  </script>
+
+  <script type="text/javascript">
+  <!--
+  function VBArrayTest(vbarray) {
+     var a = new VBArray(vbarray);
+     var b = a.toArray();
+     var s = "";
+     for (i = 1; i <= a.dimensions() ; i++) {
+       s += "La borne inférieure de la dimension " + i ";
+       s += " est " + a.lbound(i) + ".";
+     }
+     return s;
+  }
+  -->
+  </script>
+</head>
+
+<body>
+  <script type="text/javascript">
+    <!--
+    VBArrayTest(CreateVBArray());
+    -->
+  </script>
+</body>
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge par les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard et Internet Explorer 10 en mode standard. Elle n'est pas prise en charge par les applications Windows 8.x Store.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/vbarray/toarray/index.html b/files/fr/archive/web/javascript/extensions_microsoft/vbarray/toarray/index.html new file mode 100644 index 0000000000..377b5ba29f --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/vbarray/toarray/index.html @@ -0,0 +1,84 @@ +--- +title: VBArray.toArray +slug: Archive/Web/JavaScript/Extensions_Microsoft/VBArray/toArray +tags: + - JavaScript + - Méthode + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/VBArray/toArray +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cette méthode est spécifique à Microsoft et ne fonctionne qu'avec Internet Explorer.
+ +

La méthode VBArray.toArray() renvoie un tableau JavaScript {{jsxref("Array")}} à partir d'une valeur {{jsxref("VBArray")}}.

+ +

Syntaxe

+ +
monVBArray.toArray()
+ +

Valeur de retour

+ +

La valeur VBArray convertie en {{jsxref("Array")}}. Un tableau VBArray étant multi-dimensionnel, il est aplati avec les tableaux des dimensions les uns à la suite des autres. Ainsi, si le tableau VBArray contient [1,2,3][4,5,6][7,8,9], il sera converti en un tableau Array ayant la structure [1,2,3,4,5,6,7,8,9].

+ +

Il n'existe aucune méthode qui permette de convertir un tableau {{jsxref("Array")}} en {{jsxref("VBArray")}}.

+ +

Exemples

+ +
<head>
+  <script type="text/vbscript">
+  <!--
+  Function CreateVBArray()
+     Dim i, j, k
+     Dim a(2, 2)
+     k = 1
+     For i = 0 To 2
+        For j = 0 To 2
+           a(j, i) = k
+           document.writeln(k)
+           k = k + 1
+        Next
+        document.writeln("<br />")
+     Next
+     CreateVBArray = a
+  End Function
+  -->
+  </script>
+
+  <script type="text/javascript">
+  <!--
+  function VBArrayTest(vbarray) {
+     var a = new VBArray(vbarray);
+     var b = a.toArray();
+     var s = "";
+     for (i = 0; i < 9 ; i++) {
+       console.log(b[i]);
+     }
+  }
+  -->
+  </script>
+</head>
+
+<body>
+  <script type="text/javascript">
+    <!--
+    VBArrayTest(CreateVBArray());
+    -->
+  </script>
+</body>
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge par les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard et Internet Explorer 10 en mode standard. Elle n'est pas prise en charge par les applications Windows 8.x Store.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/extensions_microsoft/vbarray/ubound/index.html b/files/fr/archive/web/javascript/extensions_microsoft/vbarray/ubound/index.html new file mode 100644 index 0000000000..9bfb404248 --- /dev/null +++ b/files/fr/archive/web/javascript/extensions_microsoft/vbarray/ubound/index.html @@ -0,0 +1,91 @@ +--- +title: VBArray.ubound +slug: Archive/Web/JavaScript/Extensions_Microsoft/VBArray/ubound +tags: + - JavaScript + - Méthode + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Microsoft_Extensions/VBArray/ubound +--- +
{{JSRef}}{{Non-standard_header}}
+ +
Attention ! Cette méthode est spécifique à Microsoft et ne fonctionne qu'avec Internet Explorer.
+ +

La méthode VBArray.ubound() renvoie l'indice le plus haut de l'objet {{jsxref("VBArray")}} pour la dimension indiquée.

+ +

Syntaxe

+ +
monVBArray.ubound(dimension)
+ +

Paramètres

+ +
+
dimension {{optional_inline}}
+
La dimension pour laquelle on veut l'indice le plus haut. La valeur par défaut est 1.
+
+ +

Valeur de retour

+ +

Si le tableau est vide, {{jsxref("undefined")}}, sinon l'indice le plus haut pour la dimension souhaitée. Si la valeur de dimension excède le nombre de dimensions du tableau VBArray, une erreur "Subscript out of range" est levée.

+ +

Exemples

+ +
<head>
+  <script type="text/vbscript">
+  <!--
+  Function CreateVBArray()
+     Dim i, j, k
+     Dim a(2, 2)
+     k = 1
+     For i = 0 To 2
+        For j = 0 To 2
+           a(j, i) = k
+           document.writeln(k)
+           k = k + 1
+        Next
+        document.writeln("<br />")
+     Next
+     CreateVBArray = a
+  End Function
+  -->
+  </script>
+
+  <script type="text/javascript">
+  <!--
+  function VBArrayTest(vbarray) {
+     var a = new VBArray(vbarray);
+     var b = a.toArray();
+     var s = "";
+     for (i = 1; i <= a.dimensions() ; i++) {
+       s += "La borne supérieure de la dimension " + i ";
+       s += " est " + a.ubound(i) + ".";
+     }
+     return s;
+  }
+  -->
+  </script>
+</head>
+
+<body>
+  <script type="text/javascript">
+    <!--
+    VBArrayTest(CreateVBArray());
+    -->
+  </script>
+</body>
+ +

Prérequis

+ +

Cette fonctionnalité est prise en charge par les modes suivants : Quirks, Internet Explorer 6 en mode standard, Internet Explorer 7 en mode standard, Internet Explorer 8 en mode standard, Internet Explorer 9 en mode standard et Internet Explorer 10 en mode standard. Elle n'est pas prise en charge par les applications Windows 8.x Store.

+ +

Voir aussi

+ + diff --git "a/files/fr/archive/web/javascript/fonction_g\303\251n\303\251ratrice_historique/index.html" "b/files/fr/archive/web/javascript/fonction_g\303\251n\303\251ratrice_historique/index.html" new file mode 100644 index 0000000000..4f4e81ba8f --- /dev/null +++ "b/files/fr/archive/web/javascript/fonction_g\303\251n\303\251ratrice_historique/index.html" @@ -0,0 +1,58 @@ +--- +title: Fonction génératrice historique +slug: Archive/Web/JavaScript/Fonction_génératrice_historique +tags: + - JavaScript + - Legacy Iterator + - Non-standard + - Obsolete + - Reference +translation_of: Archive/Web/JavaScript/Legacy_generator_function +--- +
{{JSSidebar("Operators")}}{{Non-standard_Header}}{{Obsolete_Header("gecko58")}}
+ +
L'expression de fonction génératrice était une fonctionnalité spécifique à SpiderMonkey et est retirée à partir de Firefox 58. Pour la remplacer, on pourra utiliser l'expression {{jsxref("Opérateurs/function*", "function*")}}.
+ +

Le mot-clé function peut être utilisé afin de définir une fonction génératrice au sein d'une expression. Pour que la fonction soit considérée comme génératrice, il faut que le corps de la fonction contiennent au moins une expression {{jsxref("Opérateurs/yield", "yield")}}.

+ +

Syntaxe

+ +
function [nom]([param1[, param2[, ..., paramN]]]) {
+   instructions
+}
+ +

Paramètres

+ +
+
nom
+
Le nom de la fonction. Ce paramètre est optionnel, s'il n'est pas utilisé, la fonction sera anonyme. Le nom de la fonction est uniquement local pour le corps de la fonction.
+
paramN
+
Le nom d'un argument à passer à la fonction. Une fonction peut avoir jusqu'à 255 arguments.
+
instructions
+
Les instructions qui forment le corps de la fonction. Au moins l'une d'entre elle doit contenir une expression {{jsxref("Opérateurs/yield", "yield")}}.
+
+ +

Description

+ +

Un aperçu de cet opérateur est disponible sur la page sur les itérateurs et les générateurs.

+ +

Compatibilité des navigateurs

+ +

Supported nowhere.

+ +

Voir aussi

+ + diff --git "a/files/fr/archive/web/javascript/fonction_g\303\251n\303\251ratrice_historique_statement/index.html" "b/files/fr/archive/web/javascript/fonction_g\303\251n\303\251ratrice_historique_statement/index.html" new file mode 100644 index 0000000000..ec21b25a5a --- /dev/null +++ "b/files/fr/archive/web/javascript/fonction_g\303\251n\303\251ratrice_historique_statement/index.html" @@ -0,0 +1,66 @@ +--- +title: Fonction génératrice historique +slug: Archive/Web/JavaScript/Fonction_génératrice_historique_statement +tags: + - JavaScript + - Legacy Iterator + - Obsolete + - Reference +translation_of: Archive/Web/JavaScript/Legacy_generator_function_statement +--- +
{{JSSidebar("Statements")}}{{Non-standard_Header}}{{Obsolete_Header("gecko58")}}
+ +
Les fonctions génératrices historiques sont une fonctionnalité propre à SpiderMonkey qui a été retirée à partir de Firefox 58. Afin d'utiliser des outils pérennes, privilégier {{jsxref("Instructions/function*", "function*")}}.
+ +

{{Obsolete_Header(58)}}

+ +

L'instruction de fonction génératrice historique permet de déclarer une ancienne fonction génératrice avec des paramètres définis.

+ +

Il est également possible de définir des fonctions à l'aide du constructeur {{jsxref("Function")}}, de l'argument functionBody et d'au moins une expression {{jsxref("Opérateurs/yield", "yield")}} et d'une {{jsxref("Opérateurs/Fonction_génératrice_historique", "expression de fonction génératrice historique", "", 1)}}.

+ +

Syntaxe

+ +
function nom([param,[, param,[..., param]]]) {
+   [instructions]
+}
+
+ +
+
nom
+
Le nom de la fonction
+
+ +
+
param
+
Le nom d'un argument à passer à la fonction. Une fonction peut avoir jusqu'à 255 arguments.
+
+ +
+
instructions
+
Les instructions qui forment le corps de la fonction. Elles doivent contenir au moins une expression {{jsxref("Opérateurs/yield", "yield")}}.
+
+ +

Description

+ +

Un aperçu de ces anciennes fonctionnalités est disponible dans la page sur les itérateurs et les générateurs.

+ +

Compatibilité des navigateurs

+ +

Supported nowhere.

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/handler.enumerate/index.html b/files/fr/archive/web/javascript/handler.enumerate/index.html new file mode 100644 index 0000000000..40dbd33345 --- /dev/null +++ b/files/fr/archive/web/javascript/handler.enumerate/index.html @@ -0,0 +1,121 @@ +--- +title: handler.enumerate() +slug: Archive/Web/JavaScript/handler.enumerate +tags: + - ECMAScript 2015 + - JavaScript + - Méthode + - Obsolete + - Proxy + - Reference +translation_of: Archive/Web/JavaScript/handler.enumerate +--- +
{{JSRef}} {{obsolete_header}}
+ +

La méthode handler.enumerate() représente une trappe pour les instructions {{jsxref("Instructions/for...in", "for...in")}}. Elle a été retirée du standard ECMAScript avec la septième édition (ES2016) et est dépréciée pour les navigateurs.

+ +

Syntaxe

+ +
var p = new Proxy(cible, {
+  enumerate(cible) {
+  }
+});
+
+ +

Paramètres

+ +

Le paramètre suivant est passé à la méthode enumerate. this est lié au gestionnaire.

+ +
+
cible
+
L'objet cible.
+
+ +

Valeur de retour

+ +

La méthode enumerate renvoie un objet itérateur.

+ +

Description

+ +

La méthode handler.enumerate est une trappe permettant d'intercepter les instructions {{jsxref("Instructions/for...in", "for...in")}}.

+ +

Interceptions

+ +

Cette trappe peut intercepter les opérations suivantes :

+ + + +

Invariants

+ +

Si les invariants suivants ne sont pas respectés, le proxy renverra une exception {{jsxref("TypeError")}} :

+ + + +

Exemples

+ +

Dans l'exemple qui suit, on intercepte l'instruction {{jsxref("Instructions/for...in", "for...in")}}.

+ +
var p = new Proxy({}, {
+  enumerate(cible) {
+    console.log("appelé");
+    return ["a", "b", "c"][Symbol.iterator]();
+  }
+});
+
+for (var x in p) { // "appelé"
+  console.log(x);  // "a"
+}                  // "b"
+                   // "c"
+
+ +

Dans le code suivant, on ne respecte pas l'invariant.

+ +
var p = new Proxy({}, {
+  enumerate(cible) {
+    return 1;
+  }
+});
+
+for (var x in p) {} // exception TypeError levée
+
+ +

Note : Ces deux exemples utilisent la notation raccourcie pour les définitions de méthode.

+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
{{SpecName('ES2015', '#sec-proxy-object-internal-methods-and-internal-slots-enumerate', '[[Enumerate]]')}}{{Spec2('ES2015')}}Définition initiale. Retirée avec ECMAScript 2016 (ES7).
+ +

Compatibilité des navigateurs

+ + + +

{{Compat("javascript.builtins.Proxy.handler.enumerate")}}

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/index.html b/files/fr/archive/web/javascript/index.html new file mode 100644 index 0000000000..4687b7bf23 --- /dev/null +++ b/files/fr/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/fr/archive/web/javascript/reflect.enumerate/index.html b/files/fr/archive/web/javascript/reflect.enumerate/index.html new file mode 100644 index 0000000000..11a5cec1ec --- /dev/null +++ b/files/fr/archive/web/javascript/reflect.enumerate/index.html @@ -0,0 +1,79 @@ +--- +title: Reflect.enumerate() +slug: Archive/Web/JavaScript/Reflect.enumerate +tags: + - ECMAScript 2015 + - JavaScript + - Méthode + - Obsolete + - Reference + - Reflect +translation_of: Archive/Web/JavaScript/Reflect.enumerate +--- +
{{JSRef}}{{obsolete_header}}
+ +

La méthode statique Reflect.enumerate() renvoie un itérateur qui déroule les propriétés propres énumérables et les propriétés héritées énumérables de l'objet cible. Cette méthode a été retirée de la septième édition d'ECMAScript et est désormais dépréciée dans les navigateurs.

+ +

Syntaxe

+ +
Reflect.enumerate(cible)
+
+ +

Paramètres

+ +
+
cible
+
L'objet cible dont on veut obtenir les propriétés.
+
+ +

Valeur de retour

+ +

Un itérateur qui liste les propriétés propres énumérables de l'objet cible ainsi que ses propriétés héritées énumérables.

+ +

Exceptions levées

+ +

Une erreur {{jsxref("TypeError")}} si cible n'est pas un {{jsxref("Object")}}.

+ +

Description

+ +

La méthode Reflect.enumerate renvoie un itérateur qui liste les propriétés énumérables d'un objet cible, celles qui sont propres et celles qui sont héritées.

+ +

Exemples

+ +
var obj = { x: 1, y: 2 };
+
+for (var nom of Reflect.enumerate(obj)) {
+  console.log(nom);
+}
+// affiche "x" et "y"
+
+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
{{SpecName('ES2015', '#sec-reflect.enumerate', 'Reflect.enumerate')}}{{Spec2('ES2015')}}Définition initiale. Retirée avec ECMAScript 2016 (ES7).
+ +

Compatibilité des navigateurs

+ + + +

{{Compat("javascript.builtins.Reflect.enumerate")}}

+ +

Voir aussi

+ + diff --git a/files/fr/archive/web/javascript/support_ecmascript_next_par_mozilla/index.html b/files/fr/archive/web/javascript/support_ecmascript_next_par_mozilla/index.html new file mode 100644 index 0000000000..e898981c03 --- /dev/null +++ b/files/fr/archive/web/javascript/support_ecmascript_next_par_mozilla/index.html @@ -0,0 +1,75 @@ +--- +title: Support d'ECMAScript Next par Mozilla +slug: Archive/Web/JavaScript/Support_ECMAScript_Next_par_Mozilla +tags: + - Firefox + - JavaScript +translation_of: Archive/Web/JavaScript/ECMAScript_Next_support_in_Mozilla +--- +
{{jsSidebar("New_in_JS")}}
+ +

ECMAScript Next fait référence aux fonctionnalités ajoutées au standard ECMA-262 depuis la version ECMAScript 6 (ES2015). Depuis ECMAScript 6, des versions du standard sont publiée chaque année. Cette année, la spécification ES2018 a vu le jour et ES2019 est actuellement en cours de rédaction. est la prochaine évolution du standard ECMA-262. Les nouvelles fonctionnalités du langage peuvent déjà être proposées dans ce brouillon (draft) car la sixième édition n'accepte plus de nouvelles fonctionnalités et est en train d'être finalisée. L'état actuel des propositions peut être consulté sur le dépôt GitHub tc39/ecma262.
+ La liste de diffusion es-discuss permet de discuter des standards ECMAScript.

+ +

ECMAScript 2016

+ +

Les fonctionnalités suivantes d'ES2016 sont implémentées :

+ + + +

ECMAScript 2017

+ +

Les fonctionnalités d'ES2017 suivantes sont implémentées :

+ + + +

Nouvelles fonctionnalités expérimentales

+ +

Les fonctionnalités suivantes sont d'ores et déjà implémentées mais ne sont disponibles que pour Firefox Nightly et ne font pas encore partie d'un brouillon de la spécification ECMAScript.

+ +

Ajout à l'objet ArrayBuffer

+ + + +

Nouveaux objets typés

+ + + +

Nouveaux objets pour la mémoire partagée

+ + + +

Voir aussi

+ + diff --git a/files/fr/archive/web/xforms/autres_ressources/index.html b/files/fr/archive/web/xforms/autres_ressources/index.html new file mode 100644 index 0000000000..d3af7709d3 --- /dev/null +++ b/files/fr/archive/web/xforms/autres_ressources/index.html @@ -0,0 +1,15 @@ +--- +title: Autres ressources +slug: Archive/Web/XForms/Autres_ressources +tags: + - XForms +translation_of: Archive/Web/XForms/Other_Resources +--- +

 

+

Toutes les autres ressources

+ diff --git a/files/fr/archive/web/xforms/index.html b/files/fr/archive/web/xforms/index.html new file mode 100644 index 0000000000..e7e805c1a5 --- /dev/null +++ b/files/fr/archive/web/xforms/index.html @@ -0,0 +1,96 @@ +--- +title: XForms +slug: Archive/Web/XForms +tags: + - XForms +translation_of: Archive/Web/XForms +--- +
XForms Essentials (en) +

Un livre en ligne qui vous offre une visite guidée des XForms.
+ XForms Tutorial and Cookbook (en)
+ XForms au format wikibook - testé avec Firefox.

+(en cours de traduction en français)
+ +
+
XForms est le futur des formulaires en ligne tel qu'imaginé par le W3C. S'appuyant sur d'autres standards du W3C comme XML Schema, XPath, et XML Events, XForms s'efforce de dépasser les limitations du modèle actuel des formulaires HTML. Les autres forces de XForms sont la séparation entre les données et leur présentation, un typage fort des données, la possibilité de soumettre des données XML vers les serveurs plutôt que les traditionnels couples nom/valeur, et par une manière descriptive de de concevoir des formulaires pouvant être affichés sur une large variété de périphériques. XForms est une spécification du W3C.
+ +


+ Le support XForms peut être ajouté à Firefox et SeaMonkey en installant l'Extension XForms de Mozilla.

+
+ + + + + + + + +
+

Documentation

+ +
+
Résolution des problèmes avec XForms
+
Une petite collection d'astuces permettant de régler les problèmes courants que l'on peut rencontrer avec les formulaires XForms (à traduire de en:XForms:Form Troubleshooting).
+
+ +
+
Particularités de XForms dans Mozilla
+
Explique où et comment XForms dans Mozilla diffère ou va plus loin que la spécification XForms 1.0 specification (à traduire de en:XForms:Mozilla XForms Specials).
+
+ +
+
Contrôles personnalisés avec XForms
+
Le {{ Bug(289434) }} a été la première étape pour le support de la personnalisation des contrôles pour XForms. Vous pouvez maintenant styler chaque contrôle XForms grâce aux XBL et créer des effets spéciaux en SVG sur un contrôle input (à traduire de en:XForms:Custom Controls).
+
+ +
+
Préférences utilisateur pour XForms
+
Une courte description des variables about:config utilisées par XForms.
+
+ +
+
Référence de l'API XForms
+
Documentation des interfaces XForms.
+
+ +
+
Référence des éléments d'interface utilisateur XForms
+
La documentation sur les éléments d'interface utilisateur XForms.
+
+ +

Tous les articles…

+ 		+

Communauté

+ +
    +
  • Voir les forums de Mozilla…
    • +
+ +

{{ DiscussionList("dev-tech-xforms", "mozilla.dev.tech.xforms") }}

+ + + +

Outils

+ + + +

Tous les outils…

+ +

Sujets liés

+ +
+
Extensions, HTML, XHTML, XML, XPath
+
+
+ +

Categories

+ +

Interwiki Language Links

diff --git "a/files/fr/archive/web/xforms/pr\303\251f\303\251rences_utilisateur/index.html" "b/files/fr/archive/web/xforms/pr\303\251f\303\251rences_utilisateur/index.html" new file mode 100644 index 0000000000..37446d057b --- /dev/null +++ "b/files/fr/archive/web/xforms/pr\303\251f\303\251rences_utilisateur/index.html" @@ -0,0 +1,27 @@ +--- +title: XForms Préférence utilisateur +slug: Archive/Web/XForms/Préférences_utilisateur +tags: + - XForms +translation_of: Archive/Web/XForms/User_preferences +--- +

Description des préférences about:config utilisées par XForms. +

+ + + + + +
Préférence +Défaut +Description +
xforms.disablePopup +false +Désactive les popups d'erreur XForms +
xforms.enableExperimentalFeatures +false +Active les options de test. Actuellement uniquement l'option XForms 1.1 SOAP Action, pour la version test (trunk) uniquement. +
+
+
+{{ languages( { "en": "en/XForms/User_preferences", "it": "it/Le_preferenze_utente_e_XForms", "ja": "ja/XForms/User_preferences" } ) }} diff --git "a/files/fr/archive/web/xforms/r\303\251f\303\251rence_api_xforms/index.html" "b/files/fr/archive/web/xforms/r\303\251f\303\251rence_api_xforms/index.html" new file mode 100644 index 0000000000..b70aae242f --- /dev/null +++ "b/files/fr/archive/web/xforms/r\303\251f\303\251rence_api_xforms/index.html" @@ -0,0 +1,47 @@ +--- +title: XForms API Reference +slug: Archive/Web/XForms/Référence_API_XForms +tags: + - XForms +translation_of: Archive/Web/XForms/API_Reference +--- +
+

Cette page n'est que le début du recensement de la référence de l'API de XForms. Notez le mot début :-)

+
+ +

 

+ +

Convention de nommage

+ +

L'interface XForms a les conventions de nommage suivantes :

+ +
+
nsIXForms...Element 
+
Interfaces implémentées par la partie C++ d'un contrôle.
+
nsIXFormsNS...Element 
+
Interfaces étendant la spécification des interfaces XForms.
+
nsIXForms...UIElement 
+
Interfaces implémentées par la partie JavaScript d'un contrôle.
+
nsIXForms...Accessors 
+
Interfaces exposant l'état d'un nœud d'instance liée d'un contrôle donné.
+
+ +

Interfaces gelées

+ +
+
nsIXFormsModelElement
+
L'interface modèle
+
+ +

Interfaces expérimentales

+ +
+
nsIXFormsDelegate
+
L'interfacedéléguée de XForms:Contrôles personnalisés.
+
nsIXFormsAccessors
+
L'interfaceaccessoires de {{ mediawiki.external('XForms:Contrôles personnalisés') }}].
+
nsIXFormsNSModelElement
+
Extensions personnalisées de l'interface nsIXFormsModelElement.
+
nsIXFormsNSInstanceElement
+
Extensions personnalisées de l'élément instance.
+
diff --git "a/files/fr/archive/web/xforms/r\303\251solution_des_probl\303\250mes_avec_xforms/index.html" "b/files/fr/archive/web/xforms/r\303\251solution_des_probl\303\250mes_avec_xforms/index.html" new file mode 100644 index 0000000000..7607702cdc --- /dev/null +++ "b/files/fr/archive/web/xforms/r\303\251solution_des_probl\303\250mes_avec_xforms/index.html" @@ -0,0 +1,25 @@ +--- +title: Résolution des problèmes +slug: Archive/Web/XForms/Résolution_des_problèmes_avec_XForms +translation_of: Archive/Web/XForms/Form_Troubleshooting +--- +

 

+
+ Cette page est en cours de traduction, son contenu peut donc être incomplet ou contenir des parties en anglais. N'hésitez pas à participer à sa traduction à partir de
+

 

+

Introduction

+

Le but de cette page est de collecter toute une sériée de solutions à des erreurs fréquemment rencontrées quand on utilise XForm.

+

Commencez toujours par ça

+
    +
  1. Assurez-vous d'utiliser la dernière version de l'extension.
    2. +
  2. Testez votre code avec le validateur XForms. Il vérifie votre formulaire pour y déceler les erreurs. Ce n'est pas parfait mais c'est mieux que rien et permet de mettre en lumière un certain nombre d'erreurs.
    3. +
  3. Ayez toujours un œil sur la Console d'erreurs (Outils, Console d'erreurs). Si des erreurs sont détectées, n'espérez pas que votre formulaire fonctionne.
    4. +
+

Problèmes et solutions

+

Vérifiez le type de fichier

+

La page est-elle interprétée en tant que document XHTML ? Cliquez droit dans un endroit vide de la page, et sélectionnez Informations sur la page. Le champ Type devrait afficher application/xhtml+xml comme valeur. Toute autre valeur est mauvaise.

+

Si vous ouvrez votre fichier directement depuis votre système (en local), l'extension du fichier doit être .xhtml ou .xml. Si vous chargez le fichier depuis un serveur, vérifiez que le serveur déserve bien le fichier en tant qu'application/xhtml+xml ou en tant que text/xml.

+

Vérifiez la déclaration de l'espace de nom XHTML 1.0

+

Mozilla XForms est construit sur base de la spécification d'XHTML 1.0, laquelle se trouve ici http://www.w3.org/1999/xhtml. Assurez-vous que l'élément <html> contienne la bonne déclaration de l'espace de nom :

+
xmlns="http://www.w3.org/1999/xhtml"
+

(à la place de la dernière spécification, non-ratifiée, XHTML 2.0, située ici http://www.w3.org/2002/06/xhtml2 )

diff --git "a/files/fr/archive/web/xforms/\303\251l\303\251ment_interface_utilisateur_xforms/index.html" "b/files/fr/archive/web/xforms/\303\251l\303\251ment_interface_utilisateur_xforms/index.html" new file mode 100644 index 0000000000..b6b6a12505 --- /dev/null +++ "b/files/fr/archive/web/xforms/\303\251l\303\251ment_interface_utilisateur_xforms/index.html" @@ -0,0 +1,159 @@ +--- +title: Mozilla XForms User Interface +slug: Archive/Web/XForms/Élément_interface_utilisateur_XForms +translation_of: Archive/Web/XForms/User_Interface_Elements +--- +

Introduction

+ +

Cette article est une référence rapide des éléments de l'interface utilisateur de XForms. Il a pour principal but de documenter la façon dont les éléments XForms seront présentés dans Mozilla car les spécifications de XForms ne donnent que des indices sur le comportement des divers contrôles.

+ +

Currently XForms can be hosted by XHTML and XUL in Seamonkey and Firefox. Later we have plans to support XForms hosted by SVG. The XForms specs define two kinds of XForms UI elements, called 'Form Controls' and 'XForms User Interface'. Elements from the "Form Controls" group allows users to interact with instance data. The set of "XForms User Interface" elements exist to aid form authors in combining host language markup and XForms markup together in order to build user interfaces. Some of the 'Form Controls' can have multiple appearances and thus may be rendered in multiple ways. We use the data type of the instance node that the form control is bound to as a clue when making a rendering decision. The form author can also use the 'appearance' attribute on the form control to give us another clue. For example, a XForms input control may appear as a text field or as a datepicker depending on whether it is bound to a xsd:string type or a xsd:date type. When a xf:output binds to a node that has a type of xsd:date, we output the date value as plain text. An output bound to a date and also having @appearance='full' will display as a calendar.

+ +

This article uses several notations. If you see Fx 3.0 only, that means that the control will only be available for Firefox 3.0 (Gecko 1.9). There are several possible reasons for this restriction. The first is that the changes required for such controls could not be safely made to Firefox 1.5 or Firefox 2.0. The second is that the control is introduced in XForms 1.1 and we don't feel adding the enhancement would be prudent until the 1.1 spec is more stable. For instance, when the spec reaches 'recommendation'-level status. If you see xhtml/xul then it means the control is available when XForms is hosted in either XHTML or XUL. Similarly, if you see xhtml only or xul only, then it means the control is available only in that host language.

+ +

Ensembles d'attributs

+ +

This section describes attributes that are often used on XForms elements. These attributes are combined into following logical groups.

+ +

UI Common

+ +

The UI Common attribute set (see the spec) contains the attributes that are available for the XForms elements that are used to build the user interface presentation in a form.

+ + + +

Attributs de liaison

+ +

Single-Node (see the spec) and Node-Set (see the spec) attributes are used to bind XForms elements to instance nodes. These attributes are: ref, nodeset, model and bind.

+ +

Éléments XForms

+ +

Almost every XForms element can be presented as one of serveral different kinds of widgets. This section contains a short description of each XForms element and its representation. The XForms specification offers suggestions for some of the representations, but some of the widgets we use are only available in the Mozilla XForms processor. The choice of widget that we use is often determined by the data type of the instance node that the xforms element is bound to. The form author can also influence the widget by using the appearance attribute on the element.

+ +

Module des contrôles de formulaire

+ +

This section contains a short description for each form control element.

+ +
input
+ +

A key xforms element to show and change the instance data to which it is bound. Usually bound to data that can be well-represented by a string (see the spec). It can have the following representations:

+ + + +
secret
+ +

Used for inputting passwords. Each character typed by the user is represented by an asterisk on the screen (see the spec).

+ +
textarea
+ +

Serves to show/change multiline text (see the spec).

+ +
output
+ +

Serves to show the instance data that the element is bound to in a read-only manner (see the spec). It can have the following presentations:

+ + + +
upload
+ +

Provides a means for the user to select a file (see the spec).

+ +
range
+ +

Allows the user to choose a value from within a specific range of values. It is represented by a slider widget (see the spec).

+ +
trigger
+ +

Allows the user to initiate actions (see the spec). It can have the following representations:

+ + + +
submit
+ +

Invokes the submission of the selected instance data to its target destination, which could be local or remote (see the spec). It can have the following representations:

+ + + +
select
+ +

List control. Allows the user to choose one or multiple values from a list of pre-defined values (see the spec). It can have the following representations:

+ + + +
select1
+ +

Combobox control. Allows the user to choose a single value from a list of pre-defined values (see the spec). It can have the following representations:

+ + + +

Éléments supplémentaires

+ +

These elements may be used as child elements to the form controls described above.

+ +
label
+ +

Specifies the label for the xforms control (see the spec). Every form control other than the output element must contain a label element. It is valid for a form control to have an empty label element.

+ +
help
+ +

Specifies contextual help for the containing form control (see the spec). The help will be displayed if the F1 key is pressed while the containing form control has focus.

+ +
hint
+ +

Similar to a tooltip (see the spec). The hint is displayed when the mouse moves and pauses over the containing form control.

+ +
alert
+ +

This message will be shown when the form control cannot properly bind to instance data or when the instance data value is invalid or out of the specified range of selectable values (see the spec).

+ +
message
+ +

Used in combination with event listeners to display a message to the user when the specified event occurs (see the spec).

+ +

Interface utilisateur de XForms

+ +

These elements are mainly used to organize and manage the form's markup.

+ +

They can be bound to instance nodes to define context for the xforms controls that they contain, should any of their child nodes happen to use relative xpath expressions. Binding these elements to instance data is also a way to apply Model Item Properties (for example, relevancy) to the elements.

+ +

Elements in this section do not have any behaviors that are dependent on the host language.

+ +
group
+ +

This element is used to logically group xforms elements together (see the spec).

+ +
switch
+ +

This element is used in conjunction with 'case' and 'toggle' elements (see the spec). The 'switch' element contains 'case' elements which in turn contain markup. Only the contents of a single case may be displayed at one time. The 'toggle' element is used (as an event handler) to make a 'case' visible and thereby hiding all other cases contained by the same 'switch'.

+ +
repeat
+ +

A repeat element contains markup and is itself bound to a nodeset in an instance document (see the spec). For each node in the nodeset, the contents of the repeat element will be displayed in the form. That node will serve as the context node for any relative xpath expressions in that set of repeated markup. For example, if a repeat is bound to a nodeset that contains 5 nodes and the repeat contains an 'output' element that echoes the current node, then the user will see 5 outputs in the form. Combined together, these outputs would echo the value of every node in the selected nodeset.

-- cgit v1.2.3-54-g00ecf