joliclic code

Description

Khromaxul est une collection d'éléments pour réaliser un selecteur de couleur avancé en XUL.

Son but initial est de créer une extension pour Komodo, mais ces éléments devraient pouvoir être facilement réutilisables par d'autres projets XUL, extensions ou applications XULRunner.

Ces éléments sont encapsulés dans des bindings XBL, certains utilisant SVG, et nécessitent gecko >= 1.9.X (firefox >= 3.x). Des bibliothèques JavaScript sont également disponibles, pour manipuler les couleurs dans divers espaces, et pour manipuler des fichiers tels que les palettes de couleurs Gimp.

Licence

MPL 1.1 / GPL 2.0 / LGPL 2.1
(oui, c'est libre, open source et gratuit)

Komodo Extension

2 outils sont disponibles:

• Un sélecteur de couleur avancé, "à la Gimp", via un bouton ou via le menu "Tool". C'est une fenêtre disposant de sélecteurs dans les espaces RGB et HSV, et de la possibilité d'utiliser des palettes de couleurs au format Gimp. Si le code d'une couleur est sélectionnée dans l'éditeur Komodo (format #ffffff ou #fff, avec ou sans #, format rgb(r, g, b) ou rgb(r%, g%, b%), ou nom HTML), les sélecteurs sont initialisés sur cette couleur à l'ouverture.

• Une barre déroulante permettant d'utiliser les palettes Gimp, "à la Inkscape", dans le bas de la fenêtre principale de Komodo. Un clic sur une couleur insère (ou remplace la sélection courante) le nouveau code couleur. Cette barre peut être affichée/masquée via un bouton, ou via le menu "View".

version 0.3alpha pour Komodo 5.x

attention cette version est une version alpha, c'est à dire une version en test !

télécharger khromaxul-koext-0.3alpha.xpi

date : 2009-07-30

Démos

Ces démos en XUL requièrent un navigateur basé sur mozilla >= 1.9.x (Firefox >= 3.x).

• Un exemple complet, similaire à la fenêtre Khromaxul dans l'extension pour Komodo : khromaxul.xul.
• Chaque éléments testés simplement : tests.
• petites vidéos sur mon blog, lors de mes premiers essais : vidéo 1, vidéo 2.

Sources

Archive téléchargeable, contenant les sources des XBL, les JavaScript, la doc (également visible en ligne), la démo, et les fichiers de tests.

version 0.3alpha

télécharger khromaxul_src-0.3alpha.xpi

date : 2009-07-30

dépôt mercurial sur bitbucket (tronc, instable).

Si vous utilisez ces composants dans un projet, çà me ferait plaisir de le savoir, bien que vous n'y soyez pas obligés ;) .

changelog

0.3 alpha :

• corrige une erreur dans la conversion HSL->RGB
• nouvelle bibliothèque kh-schemer.js, générateur de thèmes de couleur (monochromatiques, triades, tetrades, complément, teintes, nuances, tons,...)
• nouveaux éléments kh-wheelscheme et kh-radiusscheme
• nouvelle version pour l'extension Komodo, avec les générateurs de thèmes

0.2.2 alpha :

• l'élément kh-hsvpicker[type="wheel"] fonctionne dorénavant à l'intérieur d'un XBL. Merci Laurent :).

0.2.1 alpha :

• petite correction d'un élément SVG pour compatibilité avec gecko 1.9.1.
• Ajout de la gestion de l'espace de couleur HSL dans la bibliothèque kh-color.js. La fonction cssToRGB() reconnait maintenant de nouveaux masques (hsv(n, n, n), hsl(n, n, n) et hsl(n, n%, n%)), ainsi qu'optionnellement tous les noms CSS définis par le W3C (défini dans un fichier à part).

0.1 alpha :

• première publication.

todo

• Implémenter des outils de création de thème (couleurs complémentaires, triades,...) "à la Agave".
• wheel picker, rgbpicker et hsvpicker : afficher des pointillés autour du sélecteur qui a le focus, et permettre la sélection au clavier.
• supprimer le type="multicolor" pour <kh-scale/>. Une unique méthode applyGradient() comme celle du type="multicolor" doit être suffisante.
• Permettre le drag'n'drop de couleurs entre 2 différents palettes.
• Scroll automatique lors du drag'n'drop d'une couleur dans une palette qui "overflow".
• Des outils pour ordonner les couleurs de palette.
• Extension Komodo, proposer une option pour utiliser Khromaxul comme sélecteur sur les hyperlinks de couleurs.
• Comprendre et implémenter nsIAccessibleProvider aux éléments qui en ont besoin.