Premiers pas sous FirefoxOS

Le concept de FirefoxOS m'a toujours paru particulièrement attrayant; un système d'exploitation libre qui n'est rattaché à aucune entreprise publicitaire et qui permet de faire des applications via un set de langages standards (CSS, HTML et Javascript).

J'ai donc été parmi ceux qui n'ont su attendre et ont submergé l'entreprise Geeksphone de commandes. Et j'ai reçu mon Peak la semaine dernière.

Mon précédent téléphone étant un HTC Desire de première génération, je trouve le Peak très satisfaisant, à la fois au niveau hardware et software. Les petits bugs de FirefoxOS sont très supportables et pardonnables vu l'immaturité de l'OS.

Je ne vais pas m'étendre sur l'appareil lui-même, vous trouverez une multitude de tests en ligne. La partie qui m'intéresse, c'est plutôt de faire des applications.

Comme projet préliminaire, je me suis lancé dans le développement d'une petite application de TODO list. J'ai vite trouvé la documentation de mozilla, qui m'a orienté sur l'espèce de SDK ou de modèle d'application qu'est Mortar, avec un petit article qui explique la chose.

Mortar est un environnement de développement assez complet. Il incorpore son propre serveur web et des outils d'empaquetage automatique, il repose sur NodeJS et est censé être facilement utilisable.

NodeJS et la plupart des technos de Mortar m'étant inconnues, je me suis vite retrouvé à pédaler dans la semoule. L'outil de construction Volo demandait des dépendances que je n'arrivais pas à installer (surement parce que je suis manchot). Bref, j'ai vite failli abandonner.

Heureusement, l'article à propos de Mortar réfère à un autre article écrit par Pierre Richard, lequel indique justement que Mortar n'est pas assez simple pour les nouveaux venus, et propose en sus un modèle d'application type très facile à utiliser pour réaliser des applications simples.

Voilà exactement ce qu'il me fallait!

J'ai donc sauté dessus, puis lu les guides de style et de palette de couleurs de Firefox OS pour réaliser ma petite application.

Finalement la réalisation elle-même fut très rapide et ne m'a pris qu'une paire d'heures. Vous pouvez utiliser et installer le résultat pour vous faire une idée.

Avant de vous donner le code, j'aimerais élaborer sur quelques points qui m'ont posé problème.

Gaia, le projet d'interface graphique de Firefox OS, ne donne pas de guides assez techniques à mon goût. Si on sait comment afficher certaines parties graphiques, on ne sait pas quelles sont les bonnes pratiques pour y arriver.

Spécifiquement, la page d'entrée des items de todo (quand on appuie sur le bouton +) est simplement un autre div dans la page index.html principale. Mon expérience d'autres langages et UI me poussait à faire un fichier HTML séparé pour chaque partie de l'interface, mais cela ne semble pas être nécessaire après tout.

Je n'ai pas trouvé d'explication sur les animations et leur implémentation. Les applications de Gaia (qui viennent avec l'OS) sont de très bonne facture et incorporent lesdites animations, mais elles sont aussi complexes et utilisent des styles et codes partagés, les rendant plus difficile à comprendre.

Un développeur plus habile que moi aurait surement utilisé une quelconque solution pour animer les changements de pages, mais je me suis contenté de ne pas animer du tout.

Vous pourrez trouver mon code sur gitorious, ou pour les plus corrompus, github, qui repose sur une version simplifiée de fxosstub. Contrairement à mon habitude, je l'ai placé sous licence MIT dans l'espoir qu'il sera utile aux nouveaux arrivants comme moi.