jQuery Harmony

Si vous avez lu mon précédent post sur Harmony et sa déclinaison background, vous savez à quel point j'ai adoré le travail de Mr. Doob. Que ce soit au niveau de l'idée ou de la mise en oeuvre, Harmony est vraiment magique.

Vous avez peut-être également remarqué que j'ai pas pu m'empêcher de l'intégrer dans la zone d'entête du site, complètement inspiré par le thème du blog de Paul Irish.

En l'intégrant ici, j'ai tout de suite eu envie d'en faire un plugin jQuery me permettant facilement d'initialiser harmony sur n'importe quel élement de ma page, autant de fois que je le veux. Ce serait également sympa de pouvoir choisir un brush et une couleur différente sur chacune des instances d'Harmony.

A partir de là, j'ai commencé à bosser là dessus et me plonger dans le code d'harmony, déjà un peu commencé avec la première intégration au niveau du bandeau.

Aprés de nombreux commits, j'ai finit par avoir une première version stable. Dans un premier temps, pas d'options ou de configuration, je me suis concentré à faire en sorte que harmony puisse être utilisé, sur une collection jQuery. Brièvement, la principale difficulté fut de modifier un peu le code pour le cloisoner un peu, et permettre aux variables de garder leur état indépendamment du nombre d'élement harmony. Autrement, seul le dernier canvas était fonctionnel.

Bref, une fois la première étape franchie, j'étais parti!

Voici le résultat:

Plutôt sympa hein? ;)

Et une version avec couleur aléatoire (la même que l'entête):

J'ajouterais peut-être cette option dans une future révision, et faire en sorte que le calcul se fasse sur chaque instance.

Voici le bout de code qui m'initialise maintenant les différents élements "harmonisés" du site.

Pour une démo un peu plus complète: mklabs.github.com/jquery-harmony/.

Si vous êtes intéressé par le code, et accessoirement un peu de doc: github.com/mklabs/jquery-harmony/

Le plugin est encore clairement perfectible, j'ai fait ça pour le fun. C'est définitivement un gagdet surtout qu'il est dépouillé de toutes les fonctionnalités de base d'Harmony (clear, save as image, etc.) mais c'était vraiment un bon prétexte pour coder un truc sympa.

Last but not least

Mais ce qu'il y a de plus beau dans tout ça, c'est qu'étant donné que ce travail est entièrement basé sur la déclinaison background de Mr. Paul Irish, je me suis risqué à envoyer ma première pull request.

Et... BOOOM! It's in ;) Que ce soit la validation de la requête, ou le commentaire de Paul qui lui soit associée, je peux à peine vous décrire ce que j'ai ressenti sur le moment (en me levant, aprés 2h30 de sommeil à tout casser). Juste Woooow.

C'est là, la grande force de Github!