joliclic blog

Aller au contenu | Aller au menu | Aller à la recherche

samedi, mai 21 2011

Distribute your XULRunner app - 2.1 - Linux common

Ce billet existe aussi en français

This post is part of a series about how to package a XULRunner application.
See the preamble for the context case.

2.1 Linux common

2.1.1 Generalities

We target the platform Linux in this part. And this is the simplest case.

For all distributions that I have take a look at, XULRunner is available from the package manager, and Firefox is based on it. So XULRunner can easily be a dependency of your application.

2.1.2 Create a launcher

It's easy to create a launcher, simply create a shell script named myapp.sh, into your main application folder (those which contains application.ini) with the following content:

#!/bin/sh

CUR_DIR=$(dirname $(readlink -f "$0"))

if [ -x /usr/bin/xulrunner ]; then
/usr/bin/xulrunner "$CUR_DIR/application.ini" $@
elif [ -x /usr/bin/firefox ]; then
/usr/bin/firefox -app "$CUR_DIR/application.ini" $@
else
echo "Error: unable to find XULRunner or Firefox!"
fi

and make it executable:

chmod +x myapp.sh

The script retrieves in which folder is it from, then launches the application.ini file via xulrunner if found, firefox with the -app argument otherwise. The script passes eventual additional arguments too (like -jsconsole for example).

Later in this howto, when we'll create the deb and rpm packages, we will add a symbolic link to this file into /usr/bin/ .

Note: the readlink -f argument used in this script is available only in the GNU version, so in all Linux distributions, but not in some other unix like systems, like Mac OSX for example.

2.1.3 Icons for our windows

As is, the app is launched, but the icon displayed in the task bar is the XULRunner generic one, or the Firefox icon. It's easy to display our own icon. Simply create a folder named 'icons' inside the main chrome folder of the app, then create inside another one named 'default'. Copy 3 png files, named default16.png, default32.png, and default48.png. That's all, now this is your own icon that's displayed.

    |- samples_chapter_2/
|- myapp/
|- chrome
|- icons/
|- default/
|- default16.png
|- default32.png
|- default48.png

 2.1.4 Desktop integration

For a complete desktop integration, we now need to create some additional files,  a .desktop file, and some associated icons. This allows our app to appear in the applications menu of the windows manager.

As example, here's the content of a myapp.desktop file:

[Desktop Entry]
Version=1.0
Encoding=UTF-8
Name=MyApp
Comment=a Hello World XULRunner app
Comment[fr]=un Bonjour Monde pour XULRunner.
Exec=/usr/bin/myapp
Terminal=false
Type=Application
Categories=Utility;
Icon=myapp

See this documentation for detail, and this one to choose Categories.

The Exec entry is described in detail here, we use a symbolic link to our launcher, from /usr/bin/ (the standard for executable on Linux). Its real location will be in /usr/lib/myapp/.

The Icon entry content the name of our icons that we will create below.

The Comment entry is optional, and can be localized (like some others entries, see the spec), here there's a default value, and a french (fr) one.

If the app handles some mime types, i.e. can open some type of files, you must add a line with a MimeType entry, for example:

MimeType=text/html;text/xml;application/xhtml+xml;

This myapp.desktop file is intended to be placed in the final stage into the /usr/share/applications/ folder.
(See http://www.freedesktop.org/wiki/Specifications/menu-spec and http://www.freedesktop.org/wiki/Specifications/basedir-spec for more details)

Now we need some icons. We will use png and svg (xpm is possible too, but seems deprecated, I don't use it). We can have several sizes, personaly I have restricted to 4 png (16x16, 22x22, 32x32, 48x48), as suggested by the Tango Guidelines, plus a 48x48 svg.

These images must be named myapp.png, and myapp.svg .

And they should be finally placed into the following folders:

  • /usr/share/icons/hicolor/16x16/apps/myapp.png
  • /usr/share/icons/hicolor/22x22/apps/myapp.png
  • /usr/share/icons/hicolor/32x32/apps/myapp.png
  • /usr/share/icons/hicolor/48x48/apps/myapp.png
  • /usr/share/icons/hicolor/scalable/apps/myapp.svg

 2.1.5 Distribute a tar.gz

Our application is runnable as is with its launcher, so you can distribute it as a simple tar.gz. To create it:

tar -zcvf myapp.tar.gz myapp

A user can download it, unpack it anywhere, and launch it via myapp.sh.

But to be more friendly, a package usuable by the package manager of the distribution, with the complete desktop integration, is preferable. That's what we will see in the next sections.

Nicolas Martin

You can download all the samples of this chapter 2 (Linux) in the samples_chapter_2.tar.gz archive.

The myapp application, from developer.mozilla.org is in the Public Domain.

The icon used is from the Tango Desktop Project, and is in the Public Domain.

All added data, and sample files, of this chapter 2, are in the Public Domain too.

vendredi, mai 20 2011

Distribuer votre appli XULRunner - 1 - Préambule

This post exists also in english

Ceci est le premier billet d'une série sur comment déployer une application XULRunner.

1 - Préambule

But: vous avez créer une jolie application XULRunner, que vous voulez distribuer de manière conviviale sur toutes les plateformes supportées par XULRunner.

Il s'agit d'un petit morceau de code, vous ne voulez pas embarquer XULRunner dans votre application (*).

Je vais partager avec vous le résultat de quelques expérimentations et recherches web, pour l'empaqueter et l'installer, et résoudre quelques spécificités propres à certaines plateformes.

Nous allons voir comment créer un lanceur, parfois basé sur Firefox et l'argument -app (qui peut être utilisé comme "moteur" XULRunner), et comment créer des installeurs habituels, deb et rpm pour Linux, un installeur nsis pour Windows, un bundle d'application et un dmg pour Mac OSX.

Nous utiliserons l'application 'Hello World' comme exemple, de developer.mozilla.org. Et tout ceci sera fait depuis Linux.

Tout commentaire et retour seront bien sûr les bienvenus ;) , si quelque chose vous semble faux, n'hésitez pas à commenter.

(*) Note: mais si vous embarquez XULRunner dans votre application, ces informations pourront quand même vous être utile ;) .

Voici le plan complet à venir :

Distribuer votre appli XULRunner

  • 1 Préambule
  • 2 Linux
    • 2.1 Linux commun
      • 2.1.1 Généralités
      • 2.1.2 Créer un lanceur
      • 2.1.3 Des icônes pour nos fenêtres
      • 2.1.4 Intégration au bureau
      • 2.1.5 Distribuer un tar.gz
    • 2.2 Empaqueter un deb
      • 2.2.1 Synopsis
      • 2.2.2 Fichiers Debian
      • 2.2.3 Créer le deb
    • 2.3 Un cas spécial : deb pour Maemo
      • 2.3.1 Maemo - généralités
      • 2.3.2 Adapter le lanceur
      • 2.3.3 Nouvelle organisation des fichiers - Où placer notre appli
      • 2.3.4 Additions au fichier .desktop
      • 2.3.5 Changements aux fichiers Debian
      • 2.3.6 Créer le deb
    • 2.4 Empaqueter un rpm
      • 2.4.1 Préalable
      • 2.4.2 Fichiers RPM
      • 2.4.3 Créer le rpm
  • 3 Windows
    • 3.1 Icônes pour Windows
    • 3.2 Créer un lanceur (batch ou C)
    • 3.3 Créer un script NSIS
    • 3.4 Créer l'installeur
  • 4 Mac OSX
    • 4.1 Icônes pour Mac OSX
    • 4.2 Créer un lanceur
    • 4.3 Quelques spécifités Mac
    • 4.4 Créer un "Application Bundle"
    • 4.5 Empaqueter un tar.gz et un dmg
  • 5 Synthèse - toutes plateformes
    • 5.1 Changements dans l'appli
    • 5.2 Données ajoutées
    • 5.3 Installeurs créés
    • 5.4 Un script global et réutilisable
    • 5.5 Conclusions
  • 6 Annexe - liens en relations

Nicolas Martin

Distribute your XULRunner app - 1 - Preamble

Ce billet existe aussi en français

This is the first post of a series about how to package a XULRunner application.

1 - Preamble

Purpose: you have made a nice XULRunner application, that you want to distribute as friendly for all platforms supported by XULRunner.

This is a small piece of code, you don't want to distribute XULRunner itself with your application (*).

I will share with you the result of some of my experiments and web researches, to package it and resolve some platform specificities.

We will see how to create a launcher, sometime based on Firefox with the -app argument (which can be used as a XULRunner runtime), and how to create common installers, deb and rpm for Linux, a nsis installer for Windows, an application bundle and a dmg for Mac OSX.

We will use the 'Hello World' application as example, from developer.mozilla.org. And all of this will be performed from Linux.

All comments and feedback will be really welcome ;) , if something seems wrong to you, please comment.

(*) Note: but if you embed XULRunner into your application, this information should be still useful ;) .

Here's the complete incoming plan:

Distribute your XULRunner app

  • 1 Preamble
  • 2 Linux
    • 2.1 Linux common
      • 2.1.1 Generalities
      • 2.1.2 Create a launcher
      • 2.1.3 Icons for our windows
      • 2.1.4 Desktop integration
      • 2.1.5 Distribute a tar.gz
    • 2.2 Package as deb
      • 2.2.1 Synopsis
      • 2.2.2 Debian files
      • 2.2.3 Create the deb
    • 2.3 Special case : deb for Maemo
      • 2.3.1 Maemo generalities
      • 2.3.2 Adapt the launcher
      • 2.3.3 A new file system organization - Where place our app
      • 2.3.4 Additions to the .desktop file
      • 2.3.5 Changes to the Debian files
      • 2.3.6 Create the deb
    • 2.4 Package as rpm
      • 2.4.1 Prerequisites
      • 2.4.2 RPM files
      • 2.4.3 Create the rpm
  • 3 Windows
    • 3.1 Icons for Windows
    • 3.2 Create a launcher (batch or C)
    • 3.3 Create a NSIS script
    • 3.4 Create the installer
  • 4 Mac OSX
    • 4.1 Icons for Mac OSX
    • 4.2 Create a launcher
    • 4.3 Some Mac specificities
    • 4.4 Create a Application Bundle
    • 4.5 Package as tar.gz and dmg
  • 5 Synthesis - all platforms
    • 5.1 Changes to the app
    • 5.2 Added data
    • 5.3 Created installers
    • 5.4 A global and reusable script
    • 5.5 Conclusions
  • 6 Annexe - related links

Nicolas Martin

mercredi, mai 18 2011

a XUL App Launcher, in C, for Windows

  • en version
  • version fr

english version

To launch a XULRunner application which doesn't embed XULRunner, you can use a Shell script on Linux and on Mac, calling a installed XULRunner executable or Firefox with the -app argument.

On Windows you can use a batch script, but there's a ugly black command window that is opened too.

To avoid this inconvenience, here's a proposal, another solution for Windows.
This is a light C program, it must be located in the main folder of a XULRunner app, alongside the application.ini file.
Then this executable launches the local application.ini, invoking Firefox with the -app argument. If used in command line, in a terminal, any additional argument (like -jsconsole for example) is passed to Firefox too.

And it's possible to embed an icon, and text information, to this executable too.

This is a light C program, and the code is independent of the Mozilla code. It means that you can compile it with any C compiler, for example with MingW from Linux, that's what I do myself.

This little piece of code is MIT licensed. But any remark, suggestion, enhancement, or better, patch, is welcome of course ;) .

version française

Pour lancer une application XULRunner qui n'embarque pas XULRunner en interne, on peut utiliser un script Shell sur Linux ou Mac, qui invoque un exécutable XULRunner installé, ou Firefox avec l'argument -app.

Sur Windows on peut utiliser un script batch, mais une désagréable fenetre noire de commande est également ouverte.

Pour éviter ce désagrément, voici une autre proposition pour Windows.
C'est un petit programme C, qui doit etre placé dans le dossier principal d'un programme XULRunner, à coté du fichier application.ini.
Cet exécutable lance le application.ini local, en invoquant Firefox avec l'argument -app. Si il est utilisé en ligne de commande, les éventuels arguments supplémentaires (comme -jsconsole par exemple) sont également transmis à Firefox

Et il est aussi possible d'inclure une icone, et des informations textuelles, à l'executable.

C'est un tout petit programme en C, son code est indépendant du code de Mozilla. Çà veut dire que l'on peut le compiler avec n'importe quel compilateur C, par exemple MingW depuis Linux, c'est ce que je fais personnellement.

Ce petit bout de code est sous licence MIT. Mais toute remarque, suggestion, amélioration, ou mieux, patch, sont bien sur les bienvenus ;) .

mercredi, janvier 12 2011

A proposal for Fennec: an additional toolbar for extensions

  • en version
  • version fr

english version

There's a problem when developing an extension for Firefox Mobile (Fennec), the UI is really restricted, there's not a lot of place where we can insert a button (for example).

So, here's a proposal, an additional toolbar, where anybody can insert what they want, like a button.
This toolbar appears (at the bottom of main window) with a button situated in the right panel, or with the CTRL+E shortcut key, for the devices who have a keyboard.
Then this toolbar automatically disapears after a short delay.

Here's a little screencast:

direct links to the video:

jolitoolbar.mp4 | jolitoolbar.ogv

It's easy to use this toolbar from another extension, you have simply to overlay it:

<?xml version="1.0"?>

<overlay xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

<window id="main-window">
<hbox id="jolitoolbar" hidden="true">
<scrollbox id="jolitoolbar-scrollbox">
<button id="mytool" label="my tool" oncommand="myToolCommand();"/>
</scrollbox>
</hbox>
</window>

</overlay>

Don't forget to put the attribute hidden="true" on the toolbar element, this will hide it if JoliToolbar is not installed.

An example of a such extension is available in the download page (sampletool.xpi).
And my new extensions for Fennec (GoTranslate, miniCards and TVzz-m) use it as well.

Developers, end users, please let me know what you think about this proposal, even negative ;) .

version française

Il y a un problème quand on dévelope une extension pour Firefox Mobile (Fennec), l'interface est vraiment réduite, il n'y pas beaucoup de place où insérer un bouton (par exemple).

Et donc, voici une proposition, une barre d'outil additionnelle, où tout le monde peut insérer ce qu'il veux, comme un bouton.
Cette barre apparait (au bas de la fenétre principale) via un bouton situé dans le panneau de droite, ou avec le raccourci clavier CTRL+E pour les appareils qui possèdent un clavier.
Puis la barre disparait automatiquement après un court délai.

En vidéo çà donne çà:

direct links to the video:

jolitoolbar.mp4 | jolitoolbar.ogv

Il est facile d'utiliser cette barre depuis une autre extension, vous avez juste à appliquer un overlay sur elle:

<?xml version="1.0"?>

<overlay xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

<window id="main-window">
<hbox id="jolitoolbar" hidden="true">
<scrollbox id="jolitoolbar-scrollbox">
<button id="mytool" label="my tool" oncommand="myToolCommand();"/>
</scrollbox>
</hbox>
</window>

</overlay>

N'oubliez pas de mettre l'attribut hidden="true" sur l'élément de la barre, celà la cachera si JoliToolbar n'est pas installée.

Un exemple d'une telle extension est disponible depuis la page de téléchargement.
Et mes nouvelles extensions pour Fennec (GoTranslate, miniCards et TVzz-m) l'utilisent également.

Développeurs, utilisateurs finaux, s'il vous plait, dites moi ce que vous pensez de cette proposition, meme négatif ;) .

mercredi, septembre 22 2010

mozcards: update 1.0b2

  • en version
  • version fr

english version

New version of mozcards (a collection of card games), my XULRunner port of the Firefox extension Cards, especially for Maemo.

What's new:

  • The launcher is adapted to Fennec 1.1 and 2. It is simpler, as now Fennec support the -app argument.

    Technically, the new bash script is:

    #!/bin/sh
    CUR_DIR=$(dirname $(readlink -f "$0"))
    if [ -x /usr/bin/fennec ]; then
    /usr/bin/fennec -app "$CUR_DIR/application.ini" $@
    elif [ -x /usr/bin/xulrunner ]; then
    /usr/bin/xulrunner "$CUR_DIR/application.ini" $@
    else
    echo "Error: unable to find Fennec or XULRunner!"
    fi
    

    Note that now the script pass any eventual extra parameters to the real executable ;).

  • The chrome registration is now adapted to Fennec 2 (gecko 2, like Firefox 4), and backward compatible with prior versions.

    Technically, a root manifest is required in the main application folder, wich declare the others manifest. Components need to be declared too. See this link and this one for more precisions.

  • Some new games added :) , with a special set of small cards, because they're need more space.

Download page: http://joliclic.free.fr/mozilla/mozcards/en

version française

Nouvelle version de mozcards (une collection de jeux de cartes), mon port XULRunner de l'extension Cards, pour Maemo.

Quoi de neuf:

  • Le lanceur est adapté pour Fennec 1.1 et 2. Il est plus simple, car maintenant Fennec accepte l'argument -app.

    Techniquement, le nouveau script shell est

    #!/bin/sh
    CUR_DIR=$(dirname $(readlink -f "$0"))
    if [ -x /usr/bin/fennec ]; then
    /usr/bin/fennec -app "$CUR_DIR/application.ini" $@
    elif [ -x /usr/bin/xulrunner ]; then
    /usr/bin/xulrunner "$CUR_DIR/application.ini" $@
    else
    echo "Error: unable to find Fennec or XULRunner!"
    fi
    

    Notez que dorénavant le script passe les éventuels paramètres supplémentaires au réel executable ;).

  • L'enregistrement chrome est maintenant adapté à Fennec 2 (gecko 2, comme Firefox 4), et compatible avec les versions précédentes.

    Techniquement, un fichier manifest racine doit etre déclaré dans le dossier principal de l'application, lequel déclare les autres manifest. Les composants doivent etre déclarés également. Pour plus de précisions, voir ce lien et celui-ci.

  • De nouveaux jeux ont été ajoutés :), avec un set de cartes plus petites, parce qu'ils demandent plus d'espace.

Page de téléchargement: http://joliclic.free.fr/mozilla/mozcards/

- page 3 de 5 -