MCImageManager est un plugin de gestion d’une galerie d’images (avec fonction d’upload) pour l’éditeur HTML JavaScript TinyMCE.

Ce module (bien que payant) ne dispose pas d’une traduction complète pour la langue française, celle-ci comporte en effet quelques erreurs mais le problème principal étant les traductions manquantes.

Ayant eu le besoin d’améliorer ce fichier de traduction, vous pouvez télécharger ma version du fichier de traduction français (au 21/06/2011) ci-dessous :

• Traduction française complète pour MCImageManager
• Traduction française officielle pour MCImageManager

Voici une problématique récurrente lors de l’utilisation de l’éditeur WYSIWYG TinyMCE : comment faire en sorte que les textareas utilisés pour la transformation en éditeur TinyMCE possèdent la valeur réelle du contenu de l’éditeur associé à un instant T.

Je m’explique, le fonctionnement de TinyMCE est le suivant :

• La page HTML contient une balise textarea,
• Un script JavaScript viens transformer cette balise textarea en éditeur TinyMCE,
• Le textarea original est donc masqué, mais toujours présent sur la page,
• TinyMCE injecte une iframe permettant d’afficher l’éditeur,
• Au moment de la soumission du formulaire, TinyMCE vient mettre à jour le contenu du textarea original afin que la valeur actualisée soit envoyée avec le formulaire.

Cela signifie simplement que le textarea original ne contient pas la bonne valeur avant que le formulaire ne soit soumis.

Cela peut être problématique si l’on souhaite réaliser manuellement la soumission du formulaire ou encore le valider avant de le soumettre puisque vos textareas contiendrons la valeur originellement placée dans ceux-ci.

Pour résoudre cette problématique, il existe une méthode permettant de trigger l’action qui synchronise la valeur des textareas avec la valeur des iframes juste avant la soumission du formulaire : tinyMCE.triggerSave();

Une fois cette méthode exécutée, vous pourrez normalement constater que vos textareas originaux contiennent la valeur actuelle des éditeurs TinyMCE.

Si vous avez besoin de maintenir synchronisé en permanence les éditeurs tinyMCE avec leur textarea associés, il faudra évidemment passer par un listener et plus d’informations peuvent être trouvées sur ce thread.

SVG est un format de représentation vectorielle soutenu par le W3C utilisé notamment par le logiciel libre Inkscape.

SVG-edit est un projet Open Source propulsé par JavaScript fournissant un éditeur visuel en ligne pour SVG.

Le projet est hébergé sur Google Code, cliquez sur l’image pour y accéder

Que de mouvements chez Sencha (ex Ext JS) ! Après les gros remaniements qu’a subit le framework JavaScript ou encore la sortie de Sencha Touch, c’est désormais un nouveau produit que propose l’éditeur : Sencha Animator.

Sencha Animator se présente comme le Adobe Flash du CSS, à savoir que le produit propose de créer des animations CSS3 en GUI depuis une application desktop !

Ce produit entrouvre la porte sur de nouvelles utilisations telles que la publicité au format CSS ou encore l’animation à base CSS3 pour les webdesigners !

L’application desktop est disponible pour Windows, Mac et Linux et les animations sont fonctionnelles sous les navigateurs utilisant le moteur Webkit ainsi que les OS mobiles (Apple iOS, Android et BlackBerry).

Pour plus d’informations, la description complète du produit est disponible sur le site officiel de Sencha.

Evercookie est une API JavaScript permettant de générer des cookies persistants virtuellement indestructibles. Le but de cette API est de permettre d’identifier un client même après qu’il vide de manière standard ses cookies.

D’un point de vue technologique, l’API se base sur pas moins de 13 méthodes de dépôt de cookie telles que :

• Les cookies HTTP  standard
• Les cookies Flash
• Le stockage Silverlight
• Des cookies sous formes d’images PNG (HTML5)
• Le cache du navigateur
• Le stockage standard HTML5
• etc.

En d’autres termes, Evercookie stocke des informations permettant d’identifier un utilisateur (exactement comme un cookie) dans une multitude d’emplacements sur votre machine.

Ainsi, Evercookie peut prétendre identifier un utilisateur lambda même si celui-ci a explicitement voulu effacer ses traces. Génial non ? Il semblerait cependant que les modes de navigation privée inclus dans Safari, Chrome ou encore Firefox empêchent ce genre de tracking.

Bon je m’interroge cependant sur ce qu’il en est d’un point de vue éthique voire légal vis-à-vis de ce genre de technos, d’autant plus si elles tombent entre des mains intéressées !

Pour plus d’informations, je vous invite à consulter le site officiel d’Evercookie !

Il y a quelques temps, Google créait l’évènement avec son doodle animé fait de boules de couleurs et bien dotty-dots est capable de générer ce type de logo !

L’effet est quasiment le même que celui proposé par Google, de quoi continuer à s’amuser avec les petites bouboules au bureau !

1stwebdesigner propose un tutoriel permettant de créer une ombre portée dynamique à base de CSS / Spriting / jQuery sur les éléments d’une page web en fonction d’une source lumineuse placée sur la page.

Ce n’est pas clair ? Je vous invite tout d’abord à jet un œil à cette page de démonstration exceptionnelle (n’oubliez de faire glisser l’ampoule après l’avoir allumée !).

Comme vous avez pu le constater, le script adapte l’angle ainsi que la profondeur de l’ombre portée en fonction de la position de la source lumineuse sur la page !

Tout simplement awesome ! Pour ceux qui désirent comprendre pas-à-pas comment réaliser ce type d’effet, je vous invite à consulter le tutoriel !

jScratchcard est un plugin pour le framework JavaScript jQuery permettant de créer des zones grattables à la manière des jeux de grattages que l’on retrouve chez nos buralistes. Il devient alors possible d’imaginer la création de toutes sortes de jeux de grattages directement en HTML / CSS / jQuery (rappelons que ce type de jeux existe déjà sur le web en Flash).

Très simple d’utilisation, le plugin jScratchcard propose également une personnalisation des effets de grattage assez poussée. De quoi ravir les webmasters spécialisés dans le domaine !

En tout cas, félicitation à Senamion.com pour le plugin !

Voir la page de démonstration du plugin jScratchcard.

Tout simplement… impressionnant !

A l’occasion des 30 ans de PAC-MAN Google à mis en ligne un nouveau logo interactif qui se transforme en jeux video lorsqu’on clique dessus ! Il est alors possible de jouer à PAC-MAN à l’intérieur du logo lui-même !

Petite astuce, cliquez sur le bouton « Insérer Pièces(s) » qui à remplacé le bouton « J’ai de la chance » pour ajouter Miss PAC-MAN à la partie et jouer à deux !

Pour information, vous pouvez retrouver le logo Pacman sur ce permalien

Dans notre série sur les jeux vidéos basés sur des technologies web, cet exemple est de loin le plus impressionnant ! Il s’agit d’un Tetris en 3D nommé Torus réalisé en HTML 5 à l’aide de l’élément canvas !

Cette fois-ci, ce jeux créé par Ben Joffe dispose d’un rendu d’une fluidité exceptionnelle et d’un gameplay n’ayant rien à envier au mythique Flash.

Une nouvelle fois, cet exemple donne une vision de plus en plus précise de ce que nous réserve le web dans un avenir proche !

A découvrir de toute urgence !