7 jours d'essai offerts
Cet ouvrage et des milliers d'autres sont disponibles en abonnement pour 8,99€/mois
ou
Achetez pour : 22,99 €

Lecture en ligne + Téléchargement

Format(s) : PDF

sans DRM

Publications similaires

Développez en Ajax

de editions-eyrolles

jQuery-Ajax avec PHP

de editions-eyrolles

Bien développer pour le Web 2.0

de editions-eyrolles

Vous aimerez aussi

Pokémon GO 100% non officiel

de editions-eyrolles

J'arrête la malbouffe !

de editions-eyrolles

Le pouvoir des gentils

de editions-eyrolles

suivant
les Cahiers du Programmeur
Mozilla XPFE, XPCOM, XBL, XPI, CSS, JavaScript, XML, RDF, DOM, PHP 5
JonathanProtzenko
Avec la contribution de BenoîtPicaud
Préface de StéphaneMariel
Programmez intelligent avec les Cahiers du Programmeur Jonathan PROTZENKO XUL s’est toujours passionné pour les interfaces graphiques, depuis Visual Basic 5 jusqu’à PHP-GTK e np a s s a n tp a rl eD H T M L , Java/AWT et l’API Win32. Il découvre enfin la solution mi-Embarqués dans l’excellent navigateur libre Mozilla Firefox, XUL et le framework racle avec XUL, qu’il s’empresse XPFE de Mozilla ouvrent la voie à la création et au déploiement d’applications de faire connaître par des articles web riches s’appuyant, à la manière d’AJAX, sur les standards du Web (CSS, et conférences. Javascript, XML, RDF…).
À travers la création d’un forum de discussion, découvrez et maîtrisez la puissance de l’environnement de développement Mozilla, depuis la réalisation d’interfaces graphiques avec XUL et CSS jusqu’à la logique applicative avec Javascript et XPCOM et le déploiement avec XPI. On verra comment intégrer l’application dans le navigateur grâce aux overlays et à RDF et comment recourir à l’API DOM dans JavaScript et PHP 5. L’étude de cas décrit également l’interfaçage avec un annuaire LDAP, la connexion à un serveur SOAP ou la réutilisation de code avec XBL. Téléchargez l’intégralité du code source XUL et des pages PHP @ et retrouvez l’étude de cas en ligne ! www.editions-eyrolles.com
Sommaire Mozilla, XUL et le XPFEOrganisation du XPFEL’étude de cas : un forum de discussionInscription et identi-• •fication Ajout/modification/lectured’un sujetPremiers pas en XULContents.rdf et dossier content • •• • Modification du fichier chrome.rdfDossier localeIntégration d’une DTD et début de l’internationalisationFenêtres • •XULBarres d’outils, de menu et de statutDécoupage et séparation en overlaysArbre et panneau à onglets • • • Rendu CSSPositionnement CSSspécifique à MozillaCouleurs et imagesPropriétéMise en forme de texte • •• •• • propre à MozillaPremière animation de l’interface avec JavaScriptIntégration à XULAffichage d’erreurs • •• • Multi-langue avec l’objet stringbundleManipulations DOM : options à la connexionCommunication avec l’extérieur • • : récupération d’un fichier de configurationvial’objet XMLHttpRequestAnalyse du fichier avec DOMApproche • • des composants XPCOM : fonction include()Automatisation avec RDFLe format RDF : nœuds, arcs et listes • • Sérialisation avec RDF/XMLGénération de RDF avec PHP 5Exploitation côté XULAmélioration de RDF avec • •• • JavaScript : versions synchrone et asynchroneIntégration au cœur de MozillaExtension de l’interface du navi-• • gateur avec des overlaysGestion multiple pour Firefox, Thunderbird, Mozilla et la suiteUtiliser les préférences • • internes de MozillaRaccourcis clavierInteraction entre JavaScript et LDAPOpérations LDAP avec JavaScript • •et XPCOMCréation d’une file d’attenteIdentification avec un simple bindRecherches sur la liste des membres • •Fonctionnement d’un widget XBLAnimation avecLe widget fenetreMsgContenu du widget : <content> • •• • <implementation> : propriétés, champs, méthodesPlier, déplier, cacher le fenetreMsgWidget qui réagit aux • • événements : <handlers>Services web entre client et serveurApplication de SOAP à XUL ForumServeur • •PHP 5 et client JavaScriptAuthentification Lireet enregistrer un messageVérifier la sessionDistribution • •• • de XUL Forum avec XPinstallContenu du fichier xulforum.xpiCréation du fichier xulforum.jarInstallation avec • • • install.rdf Compatibilitéavec Mozilla 1.x : install.jsSignaler des mises à jour avec update.rdfAnnexesVers • •• • Firefox 1.5XUL RunnerSeaMonkey SVG,<canvas> Listedes composants XPCOMListe des fichiers de • •• •l’application RappelsCSS RéférenceXUL. • •
BenoîtPicaudest consultant senior chez IDEALX, référence française pour laréalisation de logiciels libres. En charge de la conception d’infra-structures de sécurité et de gestion des identités, il s’est intéressé aux problématiques de déploiement des applications en entreprise.

 �   
  
       
ÉDITIONS EYROLLES 61, bd Saint-Germain 75240 Paris Cedex 05 www.editions-eyrolles.com
Remerciements à Julie Meyer.
er Le code de la propriété intellectuelle du 1juillet 1992 interdit en effet expressément la photocopie à usage collectif sans autorisation des ayants droit. Or, cette pratique s’est généralisée notamment dans les établissements d’enseignement, provoquant une baisse brutale des achats de livres, au point que la possibilité même pour les auteurs de créer des œuvres nouvelles et de les faire éditer correctement est aujourd’hui menacée. En application de la loi du 11 mars 1957, il est interdit de reproduire intégralement ou partiellement le présent ouvrage, sur quelque support que ce soit, sans autorisation de l’éditeur ou du Centre Français d’Exploitation du Droit de Copie, 20, rue des Grands-Augustins, 75006 Paris. © Groupe Eyrolles, 2005, ISBN : 2-212-11675-6
© Groupe Eyrolles, 2005
Préface
Ces dernières années, l’Open Source a démontré sa capacité à conquérir des pans entiers de l’informatique d’entreprise, au point parfois de devenir la référence détrônant les solutions établies. C’est le cas des ser vices d’infrastructure, comme la messagerie avec les logiciels libres Sendmail ou Postfix, ou la publication web avec Apache.
Toutefois, il n’en va pas encore de même pour les applications présentes sur le poste de travail de l’utilisateur. Le plus souvent les logiciels Open Source sont perçus comme des suiveurs, se contentant de copier des fonctionnalités déjà disponibles par ailleurs. D’où un sentiment de déca lage permanent.
Cette vision est cependant dépassée et ce cahier du programmeur con sacré à XUL en est le meilleur exemple. Ainsi le succès de Firefox repose déjà naturellement plus sur les innovations offertes à l’utilisateur, que sur son aptitude à faire aussi bien que ses concurrents. Mais que dire alors du framework Mozilla dont Firefox et XUL ne sont que des parties émergées ?
Ici il n’est donc plus question de suiveurs : le framework Mozilla livre dès aujourd’hui une technologie que Microsoft ne proposera qu’avec son prochain système, au mieux dans un an. En outre, ce framework est, lui, d’ores et déjà multiplatesformes !
En vous accompagnant dans la création d’une application type, Jonathan vous propose de découvrir les facettes parfois complexes d’un environne ment novateur qui a fait le choix des standards et d’une réutilisation maximale des langages existants.
VI
Car c’est une autre qualité du framework Mozilla que de tirer profit des standards ouverts, sur lesquels nous avons tous, « techniciens » et entre prises, investi ces dernières années. XML y joue naturellement un rôle clé, mais l’environnement reprend aussi largement CSS, JavaScript et l’incontournable DOM, désormais bien entré dans les mœurs et qui ouvre la voie à la mutualisation des efforts...
Aussi, que vous ayez déjà capitalisé une expérience en PHP 5 (et son API DOM désormais conforme) ou en JavaScript côté client (avec Firefox, voire Microsoft Internet Explorer), vous ne serez pas dépaysé à la lecture de cet ouvrage. De même, si vous avez créé des applications AJAX, vous pourrez réutiliser votre savoirfaire pour dynamiser votre application XUL.
Mozilla réussit ainsi le tour de force de créer un environnement novateur tout en capitalisant sur l’existant, qualité déterminante face à ses concur rents. Il est temps pour vous de l’expérimenter ! :)
Stéphane MARIEL
© Groupe Eyrolles, 2005
Table des matières
AVANTPROPOS........................................................... XI
1. INTRODUCTIONÀXUL .................................................. 1 Mozilla et XUL  2 Un point de départ : le code source de Netscape  2 Des problèmes d’évolution  3 Un nouveau moteur et une nouvelle architecture  3 Un projet ambitieux qui a réussi  4 La place de XUL au sein du XPFE  6 XUL : un langage qui ne s’utilise pas seul  7 Les technologies connexes à XUL, CSS et JavaScript  8 Organisation générale du XPFE  9 Pourquoi choisir XUL ?  11 Un langage facile à apprendre  11 Portable  12 Sans limite !  12 En résumé...  13
2. L’ÉTUDEDECAS......................................................... 15 Introduction  16 Fonctionnement  17 Principe de fonctionnement d’un forum  17 Le fonctionnement de XUL Forum  18 Les différents modules  18 L’inscription  18 L’identification  18 L’écran principal  19 La fenêtre d’ajout/modification/lecture d’un sujet  20 Les différentes parties du XPFE mises en jeu  21 Les technologies « statiques »  21 Les technologies « dynamiques »  22 Quels seront les avantages de XUL dans ce cas ?  22 Des modules réutilisables  23 Une approche croissante des difficultés  23 Une large utilisation des possibilités du XPFE  23 Un environnement professionnel  23 Points noirs à l’utilisation de XUL  24 En résumé...  25
© Groupe Eyrolles, 2005
3. PREMIERSPASENXUL................................................ 27 Un premier fichier XUL  28 À la découverte des premiers éléments...  31 Première version de l’écran d’authentification  32 Corriger les premières erreurs : utilisation de boîtes  32 Un élément plus adapté : un tableau  34 La touche finale : spacers  35 En résumé...  37
4. UNEVÉRITABLEEXTENSIONMOZILLA............................. 39 La séparation générale des fichiers  40 Contents.rdf et dossier content  41 Modification du fichier chrome.rdf  43 Intégration d’une DTD et début de l’internationalisation  45 Dossier locale  47 Modification du fichier XUL et ajout d’une DTD  48 Chrome.rdf  50 En résumé...  51
5. XULAVANCÉ:LAFENÊTREPRINCIPALE.......................... 53 La structure globale  54 Découpage avec les principales boîtes  54 Séparation en overlays  56 Dans le document principal  56 Dans les fichiers overlay  58 Le fichier indexbarresoverlay.xul : barres d’outils, de menu et de statut  61 Les menus  62 Des menus plus évolués  64 Éléments communs à toutes les pages  66 La barre d’outils  69 La barre de statut  70 Résumé : les barres  71 Les overlays : arbre et onglets  72 L’arbre  73 La liste des membres  75 En résumé...  77
VII
6. PERFECTIONNEMENTDURENDUAVECCSS..................... 79 Présentation de CSS ; utilisation dans Mozilla  80 Débuts avec CSS : effets sur du texte  82 Mise en place de CSS  82 Premiers effets sur du texte  84 Retoucher le positionnement avec CSS  90 CSS spécifique à Mozilla  91 La barre d’outils  91 Autres propriétés CSS  93 Les onglets du panneau de gauche  93 Couleur des lignes de l’arbre  94 Images dans les menus  95 Utilisation d’une propriété propre à Mozilla  96 En résumé...  96
7. PREMIÈREANIMATIONDELINTERFACEAVECJAVASCRIPT99 Concepts de base du langage  100 Syntaxe de base  101 Variables, utilisation de fonctions  101 Commentaires  101 Chaînes  102 Déclarations de fonctions  102 Méthodes d’objets  103 Tableaux  103 Objets : instanciation  103 Exceptions  104 Plus...  104 Intégration à XUL  105 Application directe à XUL Forum  106 Une première routine pour l’affichage d’erreurs 106 Multilangue avec l’objet stringbundle  109 Plus de manipulation DOM : options avancées à la connexion  110 Le code servant à montrer les options avancées  112 Communication avec l’extérieur : récupération d’un fichier de configuration  114 L’objet XMLHttpRequest  114 L’analyse avec DOM  118 Approche des composants XPCOM : fonction include()  120 Les composants XPCOM  120 Notre inclusion  121 En résumé...  123
8. AUTOMATISATIONAVECRDF..................................... 125 Le format RDF : explications détaillées  126 Les nœuds et les arcs  126 Nœuds et URI  127 Sérialisation de RDF avec RDF/XML  128 VIII
Listes  131 Génération de RDF avec PHP  132 Objectifs  132 Le fichier PHP  133 Retour à XUL  136 Un premier modèle simple  136 Un modèle plus complexe  138 Modification côté PHP  138 Exploitation côté XUL  139 Amélioration de RDF avec JavaScript  142 Version synchrone  143 Version asynchrone  146 En résumé...  148
9. UNEINTÉGRATIONAUCŒURDEMOZILLA.................... 151 Extension de l’interface du navigateur avec de nouveaux overlays  152 Modification du fichier contents.rdf  152 Où trouver les fichiers à modifier ?  153 Gestion multiple : Firefox, Thunderbird, Mozilla  155 La suite Mozilla  156 Le navigateur Firefox  157 Le client mail Thunderbird  159 Utilisation des préférences  160 Présentation  160 Les fonctions XPCOM essentielles  161 Le code de XUL Forum  161 Application à l’identification  163 Autres techniques utiles  165 Raccourcis clavier  165 En résumé...  167
10. JAVASCRIPTVERSION«PRO169» : LDAP...................... Recherches LDAP avec JavaScript et nos propres composants XPCOM  170 La structure LDAP de XUL Forum : le DIT  172 La succession des différentes fonctions  173 L’initialisation  175 Nos propres composants XPCOM en JavaScript : listeners  176 Les composants  176 Création d’une file d’attente  179 Obtention d’une opération  180 Identification avec un simple bind  180 Obtenir la liste des membres  182 Analyse du côté LDAP  182 Traitement XUL  184 Les informations d’un connecté  185 En résumé...  187
© Groupe Eyrolles, 2005
11. DOITYOURSELFWIDGETS: XBL.............................. 189 Fonctionnement d’un widget XBL  190 Le widget fenetreMsg  190 Notre implémentation : le binding fenetreMsg  192 Le contenu du widget : <content>  193 Le widget vu de l’extérieur : un bloc div et une classe CSS  193 Le contenu intérieur : mélange HTML et XUL  194 La mise en forme CSS  196 Un widget qui s’anime : <implementation>  198 Les propriétés et les champs  198 Les méthodes  199 Plier 200 Déplier  201 Cacher  202 Un widget réactif : le <handler>  202 Le doubleclic  203 Le bouton de la souris est baissé  204 La souris est déplacée  206 La souris est relâchée  206 Mise en relation avec la page principale de XUL Forum  206 Modifications dans le fichier XUL  207 Modifications dans le JavaScript  207 En résumé...  210
12. LESSERVICESWEB,POURUNE COMMUNICATIONHARMONIEUSEENTRE CLIENTETSERVEUR..................... 213 SOAP en détail : application à XUL Forum  215 Le serveur en pratique avec PHP5  217 Le serveur, vue globale  217 Permettre l’authentification de l’utilisateur  219 Lire un message  220 Enregistrer un message  221 Le client JavaScript  223 L’initialisation  223 Eston en phase avec le serveur ? Vérification de la session  224 Pas de duplication de code : une routine pour tous nos appels SOAP  225
© Groupe Eyrolles, 2005
Le moment crucial : l’identification  227 Indispensable : lire un message  227 Vital : poster nos propres messages  228 Les modifications de l’interface avec XUL  229 Changements dans le fichier XBL  229 Changements dans les fichiers JavaScript  233 En résumé...  235
13. DISTRIBUTIONDEXUL FORUMAVECXPINSTALL........ 241 Le fichier xulforum.xpi  242 Création du fichier xulforum.jar  242 install.rdf : comment installer XUL Forum ?  243 Compatibilité avec Mozilla 1.x : install.js  247 Signaler des mises à jour futures  249 En résumé...  251
LEMOTDELAFIN..................................................... 253
A. LEFUTUR:VERSFIREFOX1.5ETAUDELÀ................... 255 Il n’y a plus de contents.rdf dans Firefox 1.5 et Thunderbird 1.5  256 Un petit nouveau... XUL Runner !  258 Une valeur sûre : SeaMonkey  261 De nouvelles voies : SVG et <canvas>  262 Des modifications mineures  263
B. LISTEDESCOMPOSANTSXPCOMUTILISÉS.................. 265
C. LALISTEDESFICHIERSDELAPPLICATION..................... 269
D. CSS :SYNTAXE,SÉLECTEURS,PROPRIÉTÉS................... 273 Syntaxe de base de CSS  274 Les sélecteurs  276 Les propriétés utiles en CSS 2.1  277 Les extensions Mozilla à CSS  281
E. RÉFÉRENCEDESÉLÉMENTSXULGRAPHIQUES............... 285
INDEX...................................................................... 301
IX