Par absurdsystem le 15 janvier 2010
n/a

[Firefox] Creation d'une barre d'outils

firefox
Et quand je dis création, je ne parle pas de la barre personnelle que l'on peut afficher en 2 clics. Non la je vous parle d'une vrai création, avec du code et tout.
Vous avez surement remarqué que les extensions pour firefox finissent par .xpi. Ce n'est en fait qu'un dossier zippé. Pour s'en rendre compte il suffit d'ouvrir un .xpi avec winrar par exemple et vous verrez apparaitre tout le contenu de cette extension.

Toutes les informations dont on pourrait avoir besoin se trouvent au developer center de Mozilla. Voici un tutoriel simple pour commencer.

Arborescence

Un package xpi contient 3 choses :
un fichier chrome.manifest, un fichier install.rdf et un dossier chrome

Creer le manifeste d'installation

C'est le fichier install.rdf.
Voici son contenu :

xmlns:em="http://www.mozilla.org/2004/em-rdf#">


absurdsystem@gmail.com
Absurdsystem Blog Toolbar
0.1
chrome://absurdsystemtoolbar/skin/logo.png


{ec8030f7-c20a-464f-9b0e-13a3a9e97384}
1.5
3.*.*

Absurdsystem
Toolbar
http://www.absurdsystem.com/

Rien de difficile. Reportez vous au tutoriel que j'ai cité avant pour savoir comment remplir ce fichier.
Juste un point sur lequel je vais revenir : l'id de l'application.
Jusqu'ici j'utilisais toujours le même numéro mais d'après mes tests cela peut créer des erreurs.
Le plus simple est de générer un nouveau code pour chaque extension que vous ferrez.
Il y a un générateur à cette adresse GuidGen.com

Creer un fichier chrome.manifest

Son contenu :

content absurdsystemtoolbar jar:chrome/absurdsystemtoolbar.jar!/content/
overlay chrome://browser/content/browser.xul chrome://absurdsystemtoolbar/content/absurdsystemtoolbar.xul
skin absurdsystemtoolbar classic/1.0 jar:chrome/absurdsystemtoolbar.jar!/skin/

Les explications sont .
En simplifiant, ce fichier sert à definir les différents chemins de votre package xpi.
« content » par exemple est pour les fichiers xul ainsi que js.
« skin » sera pour les images et le css

Contenu du dossier chrome

Dans ma barre d'outils ce dossier contient un seul fichier .jar, qui lui même est une archive de 2 dossiers, à savoir content et skin.

Apparemment rien n'oblige à utiliser une archive .jar mais comme je n'ai pas testé sans, on fera avec.

Mon dossier « skin » contient les différentes icônes qui seront dans ma barre d'outils.
Le dossier « content » contient un fichier xul et un js.
Le js est un fichier javascript classique qui contient une simple fonction mais j'y reviendrais plus tard.

Les overlays XUL

Le fichier xul est celui qui va vous permettre de créer votre barre d'outils.
C'est dans celui ci que l'on défini les différents boutons que l'on veut etc.

Voici son contenu :



Les commentaires sont ferms !