Blog de Sébastien

Vous pensez que je vais parler de foot? Vous devez être un homme…

Vous pensez que je vais parler de détergent? Vous devez être une femme…

Vous pensez que je vais vous parler de Asynchronous Javascript And XML, vous êtes un(e) geek et vous avez tout bon:-)

Ce blog est maintenant “Ajaxifié”, comme les pros:-)! Ajax est une technique qui permet de mettre à jour une partie d’une page web sans recharger la page entière. C’est par exemple ce que googlemap utilise, quand vous voyez une carte google, vous avez l’impression que la page est finie de télécharger mais il charge en cachette les bouts de carte situés tout autour de votre carte pour que cela s’affiche tout de suite quand vous commencer à naviguer sur la carte. Malin google.

La manière dont j’utilise AJAX est pour afficher les commentaires. Ils ne sont pas chargés en même temps que la page mais de manière asynchrone. Il y a des petits div qui vivent leur vie indépendemment du reste de la page en communicant directement avec le serveur via un object XMLHttpRequest… Ah oui tout de suite c’est plus clair, fallait le dire tout de suite…

Non mais si vous voyez un “chargement des commentaires en cours” qui disparait tout seul, c’est ce qui se passe en fait.

L’avantage de ce truc, c’est que la page est plus rapide à charger. Puis surtout, j’avoue, je voulais apprendre à faire de l’AJAX parce que c’est le dernier truc à la mode et un peu l’avenir du web! L’étape suivante serait de pouvoir poster un commentaire sans avoir à recharger la page quand on clique sur Envoyer… Plus tard peut-être si j’ai le temps. A ce propos je conseille le bookain Foundations of Ajax si vous voulez vous mettre à l’Ajax.

Puisque j’étais là dedans, j’en ai aussi profité pour mettre en place quelques améliorations au niveau de l’édition de commentaires que voici:

• On a le droit à l’HTML, peut donc écrire en gras, italique, etc… si on le désire dans le commentaire.
• On peut mettre des smileys!!! Pour cela, on peut soit cliquer sur un des smileys, soit taper drectement le code du smiley comme :-), l’image se rajoutera tout seule dans le rectangle de prévisualisation.
• Il y a un rectangle de prévisualisation du commentaire qui se met à jour en temps réel au fur et à mesure que l’on tape. c’est beau:-)!
• Autre petit truc pratique, plus spécial expat, en plus des smileys, on peut cliquer sur un des carractères spéciaux (lettres accentuées, euro, etc…) qui n’existent pas sur le clavier qwerty pour les ajouter plus facilement au texte du commentaire.
• Il y a des smileys cachés:-) ils n’ont pas d’icone, il faut connaitre le code! Exemple, seb-) est mon smiley officiel, [-) c’est un mexicain, etc… Privilège de webmaster, y’a que moi qui les connais tous:-) gnac gnac gnac.
• En plus de smileys cachés, il y a moyen d’ajouter des réponses toutes faites en commentaires pour gagner du temps il y en a 9, de [std1] à [std9] (avec les crochets). il suffit de taper [std1] et il y a donc tout un baratin qui s’affiche tout seul. C’est puissant! Peut-être un brin impersonnel…

Voila tout est testé sur Firefox, IE et Opera sous windows, versions récentes, faites le moi savoir si ça marche pas pour votre browser/platforme.