Archives de l'année 2007

Quelques extensions qui peuvent s'avérer bien pratiques...

Split browser

Reurrect pages

Tab scope

Open Search est une série de formats destinés à partager des recherches. En particulier, et c'est le point dont je vais parler ici, c'est via ce format que sont définis les moteurs de recherche gérés par la barre de recherche de Firefox 2 (et également celle d'IE 7 apparemment).

On peut donc assez facilement ajouter un moteur de recherche à la liste via un simple fichier XML, du moment qu'on a l'URL et les paramètres à passer à la page de recherche.

Format du fichier xml

<?xml version="1.0" encoding="{ENCODAGE}" ?>
<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/" xmlns:moz="http://www.mozilla.org/2006/browser/search/">
	<ShortName>{NOM}</ShortName>
	<Description>{DESCRIPTION}</Description>
	<InputEncoding>{ENCODAGE}</InputEncoding>
	<Image width="16" height="16">{ICÔNE}</Image>
	<Url type="text/html" method="{MÉTHODE}" template="{URL_RÉSULTAT}"></Url>
</OpenSearchDescription>

• {NOM} : nom du moteur de recherche. C'est ce nom qui sera affiché dans la liste de sélection du navigateur, veillez donc à ce qu'ils reste aussi concis que possible.
• {DESCRIPTION} : description du moteur.
• {ENCODAGE} : encodage du moteur et de votre fichier XML.
• {ICÔNE} : icône de 16x16 pixels associée à votre moteur. Cette icône doit être encodée en base 64, par exemple via ce formulaire.
• {MÉTHODE} : méthode de passage de paramètre : POST ou GET.
• {URL_RÉSULTAT} : URL où soumettre la recherche.

D'autres paramètres optionnels existent, je n'ai détaillé là que les parties nécessaires.

Et ensuite ?

Une fois le fichier réalisé, il peut être ajouté dans votre répertoire de Firefox, dans le dossier searchplugins (nécessite de redémarrer Firefox).

Il est également possible s'il s'agit du moteur de recherche de votre site, de faire en sorte que Firefox le détecte automatiquement (de la même manière que pour un flux RSS) en ajoutant la balise link appropriée dans la section head de la page :

<link rel="search" type="application/opensearchdescription+xml" title="{NOM}" href="{URL_DU_FICHIER_XML}">

Où {NOM} correspond au nom indiqué dans le fichier XML et où, vous l'aurez compris, {URL_DU_FICHIER_XML} est à remplacer par l'URL où vous aurez placé le dit fichier...

Ressources complémentaires

• Page dédié sur le Mozilla dev center
• Explications sur la base 64 (utilisée pour l'encodage de l'icône).

Il y a peu, un certain breton me demandait quand j'allais faire vivre ce site... "Quand j'aurais des choses à dire", lui ai-je répondu.

Bon, ben là j'ai pas grand chose à dire mais bon, vu le nombre de spams que j'efface chaque semaine dans les commentaires (je remercie au passage le plugin Akismet d'en filtrer la plupart), pourquoi pas faire un peu de pub moi aussi ?

Bref, je viens d'ouvrir un nouveau forum sur ce serveur, dédié cette fois-ci aux jeux de cartes à collectionner avec pour nom La Taverne de la Carte d'Or (eh oui, fallait bien un nom... et "Le forum des JCC", ça faisait un peu trop banal...).

Donc voilà, c'était juste histoire de faire monter un peu son page rank...

Et bon weekend aux rares personnes qui passent par là...

jQuery est une sympathique bibliothèque Javascript. Elle permet de manipuler la page assez facilement via un système de requêtage des éléments reprenant les sélecteurs CSS. Du coup c'est assez simple et nettement plus court que de travailler avec du DOM.

Par ailleurs elle permet d'ajouter des effets aux différents événements sans écraser ceux qui seraient déjà présents, d'appliquer des effets de masquage/affichage progressif aux éléments, etc
Des extensions proposent différents éléments d'interface évolués comme des zones redimensionnables, un datepicker, des onglets...

Mais surtout l'ensemble est multi-navigateur, ce qui évite d'avoir à se préoccuper trop souvent d'Internet Explorer qui constitue un véritable cauchemar dès qu'on veut faire quelque chose d'un peu évolué.

J'ai fait quelques tests ces derniers jours sur le script de mes forums et c'est plutôt concluant : un code nettement plus court et vachement plus propre !

Bref, une bibliothèque qui vaut qu'on lui consacre un peu de temps.

Une feuille de style, qu'est-ce que c'est ?

Pour ceux qui ne s'y connaitraient pas trop en développement web, la feuille de style est un fichier qui permet de définir l'apparence d'une page web. Idéalement, lorsqu'on développe un site, la sémantique du contenu est indiquée par le code HTML qui le met en page (par exemple telle ligne est un titre, telle autre est une définition, etc) et on le décore ensuite via une feuille de style. Le langage utilisé pour écrire ces feuilles de style est CSS.

Des feuilles de style personnalisées ?

C'est là que Firefox intervient ! En effet, ce génial navigateur a une fonctionnalité qui bien que peu connue du grand public ouvre d'énormes possibilités : il permet à l'utilisateur averti de définir des feuilles de styles personnelles appliquées soit à tous les sites qu'il affiche, soit à un site, groupe de sites ou même une page en particulier (plus d'explications ici).

De base c'est masqué et pas facile d'accès mais l'extension Stylish permet de les définir très facilement. On peut ainsi modifier soi-même l'affichage des sites que l'on visite (bien entendu, cette modification ne vaut que pour votre navigateur à vous et n'est visible par personne d'autre).

On peut par exemple réorganiser les éléments en occupant l'espace inutilisé par un design prévu pour une résolution plus base, remplacer certaines couleurs insupportables, supprimer certains blocs d'affichage, etc.

Comment ajouter une feuille de style ?

1. Installez Stylish et relancez Firefox.
2. Lancez l'outil de gestion des feuilles de style :
   
3. Cliquez sur le bouton "Écrire" :
   *
4. Indiquez d'abord un titre (1) qui vous servira uniquement à reconnaitre cette feuille quand vous en aurez ajouté plein d'autres. Puis copiez/collez le code CSS que vous voulez appliquer dans le cadre texte (2) et enfin cliquez sur "Enregistrer" (3).
   
5. C'est prêt. Il peut cependant s'avérer nécessaire de rafraichir la page pour que les modifications apparaissent.

Tout ça c'est bien mais moi j'utilise IE...

Alors ça c'est ballot ! Parce que ça m'étonnerait fortement qu'IE gère un truc pareil, mais bon, on ne peut pas en même temps utiliser un navigateur totalement dépassé, ou plus généralement un produit Microsoft, et espérer qu'il soit à la pointe de l'innovation...

Et je n'en ai pas entendu parler pour les autres navigateurs tels qu'Opera ou Safari... Cela dit, rien ne vous empêche de chercher et de faire part de vos découvertes.

Quelques petits trucs que je n'ai appris que récemment. Peut-être étais-je le seul à les ignorer... ou peut-être pas, donc dans le doute...

Sortir de plusieurs boucles à la fois

Classiquement l'instruction break; s'utilise telle quelle pour sortir de la boucle ou du switch courant. Cependant en PHP (et sans doutes dans d'autres langages également), on peut lui adjoindre un paramètre entier permettant de sortir de plusieurs boucles à la fois. Ceci est à utiliser avec parcimonie car ce n'est pas forcément des plus lisible mais ça peut aider à accélérer une recherche dans un tableau multi-entrées par exemple :

// Supposons que $array est un tableau à double-entrée contenant des entiers
// et que l'on en cherche un supérieur à 10.
$result = null;
foreach ($array as $subArray)
{
	foreach ($subArrayas $item)
	{
		if ($item > 10)
		{
			$result = $item;
			break 2;
		}
	}
}

Paramètre de la fonction die

C'est plus une instruction qu'une fonction mais bon, passons. Elle peut prendre en argument un entier ou une chaine de caractère mais cet argument n'est affiché à l'écran que s'il s'agit d'une chaine. Ça n'a l'air de rien mais c'est bon à savoir...

DOM ou SimpleXML ?

SimpleXML c'est bien gentil et comme son nom l'indique, c'est « simple » (du moins dans son interface qui compte très peu de méthodes), mais à l'usage c'est quand même des plus limités. Et c'est plutôt chiant à utiliser parce qu'il faut caster pas mal de choses pour obtenir des chaines de caractère au lieux de nœuds XML (sans compter le bug dont je parlais il y a quelques temps). D'autant qu'il existe une alternative...

En effet, j'en étais resté à PHP4 où l'API DOM se cantonnait l'extension DOM XML non-incluse par défaut, ce qui n'était pas bien pratique... Mais en PHP5, elle a été remplacée par une nouvelle implémentation incluse en natif dans PHP sous le nom de DOM. Bref, en ce qui me concerne, SimpleXML va direct à la poubelle et je n'utilise plus que DOM, avec l'avantage supplémentaire d'être similaires aux bibliothèques DOM présentes dans d'autres langages tels que JavaScript, puisque DOM est un standard, ce qui raccourcit d'autant l'apprentissage.

Après une petite promenade dans le code de FSB (cf Rester sur phpBB ?), même s'il comporte de bonnes choses, il en comporte aussi des moins bonnes, dont :

• Commentaires des méthodes, classes et fonctions ne respectant pas la syntaxe (inspirée de la syntaxe javadoc) utilisée par les principaux outils de génération automatique de documentation tels que phpDocumentor.
• L'intégration des modules reste moyenne et semble se résumer principalement à une modification automatique du code, similaire à ce que fait EasyMod, mais intégré au forum. C'est déjà pas mal mais j'espérais mieux avec une réelle exploitation de l'extension des classes par exemple ou des fonctionnalités d'import/export de données...
• Pas mal de choses telles que l'ajout de champs au profil sont présentes, mais pas aussi puissantes que ce que j'ai déjà développé pour phpBB2 et demanderaient donc d'être revues, voire re-codées complètement.

Donc au final, même si ça constituerait un mieux, c'est pas encore ça... De plus, à la réflexion, migrer l'intégralité de mes modules prendrait un temps fou (plusieurs mois), pendant lequel je serais forcé de geler tout nouveau développement.

Une autre solution s'offre donc : rester sur phpBB2 et le modifier encore plus en profondeur, sans rester proche de l'original. En effet, jusque-là, pour bénéficier des mises à jour et pouvoir publier des mods rapides à installer et ne cassant pas la compatibilité, je faisais en sorte de rester proche des habitudes de codage de phpBB et de cantonner les modifications à des zones les plus restreintes possibles.

Maintenant comme phpBB2 est en fin de vie, ne bougera plus de masses et sera de moins en moins utilisé, l'intérêt de faire cela s'amenuise. Du coup afin de pouvoir migrer plus progressivement les mods vers quelque chose de plus propre, je pense partir de ma version actuelle et la "démonter" progressivement en re-codant les mécanismes plus proprement, jusqu'à obtenir un script totalement différent et exploitant diverses briques externes telles que PHPTAL.

Cela fera au final probablement plus de boulot, mais d'une part pour un résultat qui me conviendra sans doute mieux (puisque codé entièrement selon mes idées) et d'autre part avec des améliorations progressives qui permettront d'avoir en cours de route un résultat utilisable plutôt que de devoir attendre des mois d'avoir rattrapé l'existant...

Cela fait maintenant plus de 5 ans que mes forums tournent sous phpBB2 (et à part EDForum qui a commencé en phpBB1 pour ses premiers mois, je n'ai jamais utilisé que ça).

Ce script étant tout de même en fin de vie avec la sortie prochaine de phpBB3, se pose pour moi (comme pour surement pas mal de monde, vue la popularité de phpBB) la question de savoir vers quoi se tourner pour la suite.

Ayant quelques dizaines de mods plus ou moins imposants à mon actif sur phpBB2, j'ai eu l'occasion d'en relever les limites principales qui sont :

• un code trop peu orienté objet (après un an passé à coder intensivement en objet au boulot, le retour à une architecture impérative et fortement séquentielle me rebute quelque peu).
• de trop nombreuses redondances de code.
• découlant de ces deux premiers points : une grande difficulté à développer des modules approchant un tant soit peu du plug and play.

J'ai donc regardé ce qu'on pouvait trouver actuellement comme scripts de forums pour voir ce qu'on pouvait avoir, puisque quitte à migrer quelques dizaines de mods, autant que ce soit dans de bonnes conditions.

Voilà ce que j'ai brièvement testé :

1. phpBB3 : fort logiquement j'ai d'abord regardé là puisque c'est la suite logique... Mais même si les fonctionnalités ajoutées sont assez nombreuses et pour certaines vraiment bien pensées niveau interface, niveau code, c'est franchement pas terrible : toujours très séquentiel et pauvre en objets. C'est évidemment bien mieux que phpBB2 globalement mais c'est pas encore ça... Faut dire que les débuts des devs datent de 4-5 ans déjà, donc forcément...
2. punBB : il a bonne réputation comme étant rapide, donc j'ai regardé un peu... Mais c'est pas mieux que phpBB3, voir moins bien avec un certain nombre de trucs codés en dur que même phpBB2 ne mettait pas en dur... Alors j'ai peut-être raté quelque chose avec le peu de temps que j'y ai consacré mais ça m'a franchement pas convaincu, d'autant que le code n'est pas plus objet que phpBB.
3. Fire soft board, alias FSB : c'est alors que je me suis souvenu du script développé par Genova (ancien moddeur phpBB2), je suis donc allé voir ce que ça devenait et apparemment il a fait du bon boulot avec sa version 2 (proche de la sortie, puisqu'en RC4 déjà) : il a pensé au développement de mods, codé en objet, tout ça \o/ Apparemment il avait vu les mêmes défauts que moi dans phpBB2... Bref ça m'a l'air pas mal. Puis c'est développé par une équipe francophone pour une fois, ce qui ne gâche rien.

Après ces quelques investigations (pas très poussées, j'en conviens, vu que je n'ai regardé que 3 scripts différents et pas trop en détails...), mon choix se porte plutôt vers FSB. J'ai pas encore vraiment commencé à travailler avec, donc peut-être de mauvaises surprises en perspective... Rendez-vous dans quelques temps pour en savoir plus.

PHPTAL est un moteur de templates spécialisé dans la production de documents XML (et donc (X)HTML puisqu'il s'agit d'un langage XML).

Les templates qu'il utilise sont définis en XML valide, PHPTAL ajoutant ses propres attributs qui sont ensuite traités par le moteur. Le code des templates est donc purement de l'XML et non un code bâtard XML/PHP comme c'est le cas avec certains autres moteurs.

Avantages :

• il n'accepte que du code XML valide, ce qui permet de détecter rapidement toute erreur d'imbrication.
• le code des templates est de l'XML ce qui donne la possibilité de l'exploiter ou de le générer via les bibliothèques de gestion de fichiers XML habituelles.
• il est installable sous forme de package pear ce qui rend son déploiement et sa mise à jour très simples.
• comme il est entièrement XML il est en général plus accessible pour le graphiste qui pourra être chargé de construire les templates.

Inconvénients :

• il ne permet a priori de générer que du code XML (ou de tout langage XML) ce qui peut être limitatif.
• peut s'avérer limité par rapport à d'autres moteurs pour des traitements complexes.
• le code des templates n'est pas forcément toujours des plus compacts.

Cela fait quelques mois que je l'utilise au boulot et j'en suis globalement satisfait, du moins dans les cas que j'ai eu à traiter avec... Cela dit je n'ai pas beaucoup expérimenté d'autres moteurs (à part celui de phpBB 2 qui est assez limité).

PHP5 inclut de base la bibliothèque SimpleXML qui permet, comme son nom l'indique de gérer de manière très simple du code XML.

Un point est par contre problématique, la gestion des sections CDATA. En effet, supposons que l'on parte du code XML suivant :

<?xml version="1.0"?>
<root>
	<parent>
		<child>123</child>
		<child><![CDATA[456]]></child>
		<child attr="a"><![CDATA[789]]></child>
	</parent>
</root>

Lorsque l'on récupère les enfants d'un nœud via :

$parentnode->child;

On a la mauvaise surprise de ne pas obtenir tous les nœuds... En effet :

• le premier passe sans problème, car il ne contient pas de section CDATA.
• le second contient un CDATA et se perd dans la nature...
• le troisième contient un CDATA mais a également un attribut, il est alors correctement renvoyé (ne me demandez pas pourquoi).

Par contre, dans le cas où tous les nœuds sont basés sur le modèle du second (CDATA sans attribut), le premier est bien trouvé et retourné (au lieu d'un tableau).

Une fois le problème identifié j'ai fait quelques recherches et j'ai pu trouver cette solution consistant à éliminer les CDATA avant le traitement du code XML. Je ne la trouve pas très satisfaisante mais je n'ai pour l'instant rien trouvé d'autre...

Lorsque l'on travaille sous Linux, on se retrouve souvent à taper un bon nombre de fois les mêmes commandes. Du coup l'historique des commandes (accessible notamment via les flèches) n'est rapidement plus très praticable tant il est redondant.

Pour régler ce genre de problème, on peut utiliser la variable shell HISTCONTROL. Celle-ci peut prendre différentes valeurs :

• ignoredups :
  lorsqu'une commande est identique à la précédente n'est pas ajoutée à l'historique, ce qui évite de se retrouver avec une dizaine de uptime à la file quand on surveille la charge du serveur.
• ignorespace :
  lorsqu'une commande commence par un espace, elle n'est pas ajoutée à l'historique, ainsi on peut choisir quelle commande ajouter ou non.
• ignoreboth :
  cumule les comportements des deux valeurs précédentes.
• erasedups :
  lorsqu'une commande est tapée, toutes les commandes identiques présentes dans l'historique sont supprimées. Ceci est particulièrement intéressant pour éviter d'avoir son historique parasité par un grand nombre de ls, ps, cd .. et autres commandes courantes.
• enfin pour revenir au comportement classique, il suffit d'affecter une chaine vide.

Cette valeur peut être affectée de plusieurs manières :

• pour la session courante uniquement via la commande :
  export HISTCONTROL=valeur
• pour toutes les sessions, en ajoutant HISTCONTROL=valeur dans votre fichier bashrc
• pour tous les utilisateurs (uniquement si vous êtes administrateur de la machine, bien entendu) en ajoutant HISTCONTROL=valeur dans le fichier bashrc global trouvable dans /etc.

Pour le débugage JavaScript, Firefox dispose de base d'une console d'erreurs JavaScript. Cette console est accessible via le menu « outils » sous le nom « console d'erreur » et liste trois types d'informations :

1. les erreurs : il s'agit des erreurs que Firefox ne parvient pas à traiter et qui entrainent un arrêt pur et simple de l'exécution du script. Ces erreurs doivent être corrigées impérativement pour que le script s'exécute jusqu'au bout.
2. les avertissements (warnings) : ceux-ci ne sont pas bloquants. Ils relèvent juste une erreur minime ou un non-respect de la norme javascript (variable non déclarées, fonctions ne retournant pas toujours de valeur, etc.). Il n'est pas absolument nécessaire de les corriger mais il vaut mieux les corriger et ce pour deux raisons : d'une c'est par principe toujours mieux de coder proprement et de deux ils peuvent être cause de bugs puisque le script ne se comportera pas forcément de la façon dont vous l'imaginiez.
3. les messages : il s'agit de simples messages qui peuvent être envoyés depuis du code javascript dans certains cas. Il ne s'agit pas d'erreurs, juste d'informations diverses en général utilisées lors du débugage d'extensions.

La plupart des messages d'erreur ou d'avertissement sont accompagnés d'un numéro de ligne, d'un nom de fichier et d'un lien direct pour visualiser la ligne posant problème.

De base cette console est déjà très efficace (comparée à son homologue sous IE, c'est déjà le jour et la nuit). Cependant il existe également des extensions qui peuvent permettre d'aller plus loin :

• 
  Console² :
  Cette extension permet de filtrer plus précisément les messages affichés par la console. Elle permet également le passer le contrôle en mode « strict » ce qui augmente le nombre d'avertissements en cas de non-respect des normes. Elle permet également d'afficher certaines erreurs dans les fichiers CSS et XML évalués par le navigateur.
• 
  Firebug :
  Celle-ci permet de faire pas mal de chose en ce qui concerne le débugage aussi bien JavaScript que CSS et HTML. Elle semble notamment permettre une exécution pas à pas du JavaScript. Je ne l'ai pas testée très en détails, peu convaincu au premier abord... Cependant elle semble avoir bonne réputation, il doit donc y avoir de bonnes choses à en tirer.

Et IE dans tout ça ? Ben là, c'est pas la joie... Outre le fait que son moteur JavaScript n'a quasiment pas bougé depuis IE6, ce qui implique un retard énorme, sa fenêtre d'erreur est des plus minimalistes. Elle se limite en effet à un message d'erreur rarement clair et pas toujours approprié, un numéro de ligne approximatif et aucun nom de fichier (cela ne pose pas de problème pour un script simple sur un seul fichier mais pour quelque chose de plus complexe répartit en plusieurs fichiers, c'est déjà beaucoup plus gênant)... Une fois de plus le navigateur de Microsoft est largement à la traine.

Pour ce premier article nous allons nous intéresser à Firefox et plus particulièrement aux différentes extensions améliorant la gestion des onglets. Il y en a un bon paquet mais pour l'instant j'ai surtout retenu celles-ci :

• 
  Tab Mix Plus :
  Cette extension propose un grand nombre de fonctionnalités concernant les onglets : duplication, restauration des derniers onglets fermés, etc. Il permet également d'éditer la liste des actions possible sur les onglets dans les différents menus. Il permet encore un grand nombre d'autres choses plus ou moins utiles.
• 
  Ctrl Tab Preview :
  Cette extension permet au lieu de passer directement à l'onglet suivant lors d'un ctrl + tab d'afficher une prévisalisation du prochain onglet qui ne sera réellement selectionné que lorsque la touche ctrl sera relâchée. Un peu comme le alt + tab de windows mais avec une prévisualisation à la place de l'icône.
• 
  FaviconizeTab :
  Une petite extension qui permet de réduire certains onglets à leur icône. Bien pratique quand on a certains onglets ouverts en permanence.
• 
  Firefox Showcase :
  Celle-ci permet d'afficher une mosaïque des onglets ouverts dans les différents onglets de Firefox (l'une des rares fonctionnalités dont IE7 et pas Firefox...). Depuis cette mosaïque on peut selectionner, fermer et rafraichir les onglets. Très pratique pour faire le tri quand on ouvre une grande quantité d'onglets.
• 
  Aging Tabs :
  Enfin pour finir, une extension totalement inutile et donc indispensable : elle permet de définir les couleurs des différents onglets en fonction de la dernière fois où on les a consultés.

Ça faisait longtemps que je pensais à me refaire un site où je pourrais noter les différentes choses que je trouverais sur le net (surtout en matière de technologies WEB)... Longtemps j'ai pensé développer un moteur maison éventuellement couplé avec EDForum et bien entendu je n'ai jamais pris le temps de le faire. Finalement comme j'ai entendu beaucoup de bien sur WordPress ( Nico si jamais tu lis ça un jour... :D ) je me suis dit que j'allais profiter de ce jour férié pour m'en installer un.

Le design est un peu bateau mais bon, j'ai la flemme de le travailler plus pour l'instant, donc on se contentera de ça.

De quoi parlera ce site ? Principalement de technologies WEB, parce que si je postais ça sur EDForum, ça n'intéresserait personne, donc j'en parlerai ici. Puis occasionnellement d'autres choses mais ça devrait être rare.