Gloubi script – une horloge illustrée

Aujourd’hui, j’ai décidé de m’attaquer à la version gloubi d’un script que j’ai également déjà créé de mon côté : l’horloge illustrée.

La version gloubi est visible ici, tandis que la création de ma propre version, faite avec jQuery, est présentée ici.

Présentation de la version gloubi

Pour commencer, on créé 10 objets de type Image() en leur attribuant à chacun l’attribut src correspondant.

c1=new Image(); c1.src="c1.gif";
c2=new Image(); c2.src="c2.gif";
c3=new Image(); c3.src="c3.gif";
c4=new Image(); c4.src="c4.gif";
c5=new Image(); c5.src="c5.gif";
c6=new Image(); c6.src="c6.gif";
c7=new Image(); c7.src="c7.gif";
c8=new Image(); c8.src="c8.gif";
c9=new Image(); c9.src="c9.gif";
c0=new Image(); c0.src="c0.gif";

Vient ensuite la fonction affiche(), permettant de changer les images, qui prend 3 paramètres en entrée : le nombre d’heures, le nombre de minutes et le nombre de seconde. Pour chacun des trois paramètres on détermine l’image à afficher pour les dizaines et les unités. Chaque image est modifiée en passant par la propriété images de l’objet document.

Continuer la lecture

Une horloge hexagonale

À la suite de mes premières expérimentations avec les canvas (voir mes trois premiers articles étiquetés #canvas) et de la consultation récente de pages traitant de la création d’horloges utilisant cette technologie, j’ai décidé d’en créer une à ma façon.

Pour mon horloge, j’ai voulu le faire de manière originale, à la manière des montres proposées par Tokyoflash Japan. Mon choix s’est arrêté sur l’utilisation de formes hexagonales (parce que j’aime bien cette forme).

Avec l’utilisation d’un anneau hexagonal et d’un hexagone au centre, un digit (dans notre cas, un ensemble anneau + hexagone au milieu) peut prendre 8 valeurs différentes, ce qui fait que l’heure sera affichée en base 8.

Digits hexagonaux
Détail d’un digit hexagonal

Vu que les minutes et secondes (les parties ayant les plus grandes valeurs) vont de 0 à 59, deux digits en octal pour chaque suffisent.

Continuer la lecture

[jQuery] Une horloge sous forme de diagramme

Avant de m’essayer à l’horloge présentée dans l’article précédent, je m’était posé la question de trouver une forme plus originale d’afficher l’heure. Après quelques recherches et essai, je suis arrivé à ce résultat.

Continuer la lecture