Chez PMSIpilot, nous commençons à utiliser Behat pour nos tests fonctionnels.
Je ne vais pas m’étendre sur toutes les belles choses que ce framework de bdd apportera au testing de votre projet, il vous suffit de vous rendre sur leur site officiel et de lire leur introduction rapide pour vous en persuader.

Le problème auquel j’ai immédiatement fait face en tentant d’inclure le Phar de Behat est le suivant :

Fatal error: require(): Failed opening required 'phar:///[...]/lib/vendor/behat/behat.phar'

La ligne incriminée ne pouvait pas être plus simple :

include 'phar:///[...]/lib/vendor/behat/behat.phar';

Après avoir interrogé dans toutes les langues et sous toutes les formes mon moteur de recherché préféré, difficile de trouver une explication rationnelle.
Comme souvent, la réponse est venue par l’intermédiaire d’un collègue (merci @jubianchi et @ratibus !) et il s’avère que c’est l’extension ioncube qui était en cause sur mon poste. Si vous avez ce problème, c’est donc peut-être une piste à suivre.

Pour tester si ioncube est activé :

$ php -i | grep -i ioncube
with the ionCube PHP Loader v4.0.5, Copyright (c) 2002-2011, by ionCube Ltd., and
ionCube Loader


Chez moi c’était la version ioncube 4.0.5 qui posait problème. Rassurez-vous néanmoins, une fois la dernière version de ioncube installée, plus de problème à noter ! Apparemment le problème est réglé au moins depuis la version 4.0.9.

Le lien direct pour télécharger la dernière version stable pour une distrib linux 32 bits : http://downloads2.ioncube.com/loader_downloads/ioncube_loaders_lin_x86.tar.gz

Une fois l’extension décompressée et placée au bon endroit, l’include passe sans encombre.

$ php -i | grep -i ioncube
with the ionCube PHP Loader v4.0.12, Copyright (c) 2002-2011, by ionCube Ltd., and
ionCube Loader

Subversion (SVN) a eu une belle carrière parmi les outils de versionning mais il est aujourd’hui largement supplanté par Git. Plus souple, plus rapide, plus puissant, nombreux sont les développeurs qui souhaitent migrer leurs dépôts vers Git. Mais il serait dommage de perdre l’historique de son projet, surtout quand celui-ci remonte sur plusieurs mois / années.

Le sujet a déjà largement été abordé sur différents blogs, forums et mailing-list mais je vais simplement compléter les étapes classiques par celles que j’ai dû ajouter pour pouvoir migrer mes propres dépôts SVN qui n’avaient pas tous une structure standard (pas de Trunk par exemple…).
Nous utiliserons la commande par défaut git-svn. Si besoin : sudo apt-get install git-svn

Quelques étapes indispensables (pour plus de détails, se rendre à cette adresse, ou à celle-ci) :

Récupérer les différents commiters sur son dépôt SVN

svn log -q | awk -F '|' '/^r/ {sub("^ ", "", $2); sub(" $", "", $2); print $2" = "$2" <"$2">"}' | sort -u > commiters.txt

Il suffit ensuite de transformer chaque ligne du fichier généré vers quelque chose du genre :

obalais = Olivier Balais <obalais@server.com>

Cloner votre dépôt SVN

Ici on spécifie l’url de son dépôt SVN, le fichier à utiliser pour les logs de commit et un dossier dans lequel cloner le dépôt. L’option no-metadata supprime les notes que git-svn ajoute à chaque message de commit par défaut.

git svn clone URL_DEPOT --no-metadata -A commiters.txt --stdlayout ~/mon_depot

Certains de mes dépôts avaient une structure non standard. Par exemple, certains projets simples n’avaient tout simplement pas de trunk, branches et tags mais directement la structure du projet commitée à la racine du dépôt (oui c’est moche…). Pour se sortir de ce genre de galères on peut utiliser les options -T, -t et -b pour spécifier les URI des Trunk, Tag et Branches. Dans mon cas, j’ai utilisé la commande suivante :

git svn clone URL_DEPOT --no-metadata -T / -A authors.txt --stdlayout ~/mon_depot

Sur un projet, j’ai également souhaité récupérer tous les commits excepté le dernier. Pour cela, il suffit d’ajouter l’option -r initial_revision:final_revision. Exemple :

git svn clone URL_DEPOT --no-metadata -T / -r 1:99 -A authors.txt --stdlayout ~/mon_depot

Créer un dépôt vide pour y pusher le contenu de son ancien dépôt SVN

git init --bare ~/mon_projet.git
cd ~/mon_projet.git
git symbolic-ref HEAD refs/heads/trunk

Pusher le contenu en faisant :

cd ~/mon_depot
git remote add bare ~/mon_projet.git
git config remote.bare.push 'refs/remotes/*:refs/heads/*'
git push bare

Il ne reste désormais plus qu’à renommer la branche trunk en master…

Renommer son trunk en master

cd ~/mon_projet.git
git branch -m trunk master

And you’re done!

Chez PMSIpilot, à chaque fin de Sprint, les équipes techniques organisent et participent à ce qu’on appelle les “ateliers”. Comme tout bon geek qui se respecte, j’ai une soif insatiable d’apprendre de nouvelles choses et je participe donc en général au plus grand nombre possible de ces ateliers. Un de ceux qui m’ont le plus marqué est sans aucun doute celui qui présentait le fonctionnement et l’utilisation de Node.js.

Je vais donc profiter de ce blog pour faire un retour au fur et à mesure de ma découverte de Node.js et de son écosystème.
Ce premier billet résume l’installation de Node et Express et me servira de mémo pour retrouver facilement les commandes qui vont bien.

Node.js est un framework très en vogue qui consiste à utiliser le langage Javascript avec le moteur V8 de Google côté serveur pour servir les requêtes HTTP reçues.

Parmis les intérêts majeurs de ce type d’approche on retient notamment :

• L’approche évènementielle du framework (entrées / sorties non bloquantes…)
• La possibilité d’utiliser un seul langage côté serveur et côté client pour les applications Full JS

Ainsi, grâce à sa légèreté et à ses I/O non bloquants, Node.js permet de développer une application web capable de recevoir et de répondre à un nombre de requêtes infiniment plus conséquent qu’une même application développée avec une pile LAMP classique.
C’est toute la philosophie du développement web qui se voit bouleversée par cette approche évènementielle.

Pour plus d’informations à ce sujet, je vous invite à lire les articles suivants :

• http://en.wikipedia.org/wiki/Nodejs
• http://anders.janmyr.com/2011/05/not-very-short-introduction-to-nodejs.html
• http://nodejs.org

Let’s get started!

Première étape, télécharger et installer Node.js. Pour se faire RDV sur le site officiel pour télécharger la dernière release en date : http://nodejs.org/#download. Décompressez l’archive, rendez-vous dans le dossier et exécutez les commandes suivantes une par une :

mkdir ~/local
./configure --prefix=$HOME/local/node
make
make install
export PATH=$HOME/local/node/bin:$PATH


La commande make prend un certain temps à s’exécuter donc il faut s’armer de patience. Ensuite le reste est trivial.
A noter que si au moment du lancement de configure, vous avez une erreur du type Could not autodetect OpenSSL support. Make sure OpenSSL development packages are installed, c’est qu’il vous manque la lib OpenSSL.
Dans ce cas, un petit apt-get résoud le problème :

sudo apt-get install libssl-dev

Dans le même ordre d’idée, il se peut qu’un message vous avertisse qu’il manque un compilateur du type g++ / c++. Dans ce cas :

sudo apt-get install g++

Voilà une bonne chose de faite. Testez l’installation en exécutant la commande suivante :

obalais@server:~$ node -v
v0.4.7

Même s’il est possible de créer une application web complète juste avec Node.js, nous allons installer des plugins qui vont nous faciliter le développement. Un framework MVC (Express) par exemple me semble plus que nécessaire, un moteur de template (Jade) ainsi qu’un ORM pour la base de données (Mongoose si on utilise une base MongoDb).
Nous avons de la chance puisqu’un gestionnaire de paquets spécifique à Node.js est devenu plus ou moins un standard pour récupérer facilement les plugins qui existent, à savoir NPM.

Si vous n’avez pas curl :

sudo apt-get install curl

Ensuite, l’installation de NPM est on ne peut plus simple puisqu’il suffit d’une seule ligne :

curl http://npmjs.org/install.sh | sh

Et une fois de plus, vous pouvez tester si l’installation s’est bien déroulée en lançant la commande suivante :

obalais@server:~$ npm -v
1.0.6


Nous allons tout de suite mettre à profit NPM en installant Express, le framework de développement web le plus abouti actuellement pour Node.js.

Voici la liste de ses features, directement récupérée depuis le site officiel :

• Robust routing
• Redirection helpers
• Dynamic view helpers
• Application level view options
• Content negotiation
• Application mounting
• Focus on high performance
• View rendering and partials support
• Environment based configuration
• Session based flash notifications
• Built on Connect
• Executable for generating applications quickly
• High test coverage

Grâce à NPM, l’installation se fait encore une seule ligne toute simple :

npm install express

N’oubliez pas de rajouter express à votre PATH et de tester le résultat de l’installation :

obalais@server:~$ export PATH=$HOME/node_modules/express/bin:$PATH
obalais@server:~$ express --version
2.3.4


Maintenant installez Jade :

npm install jade

Tout est en place. Il ne reste plus qu’à créer notre serveur avec Node.js + Express. Pour cela, créez un fichier helloworld.js contenant le code suivant :

var app = require('express').createServer();

app.get('/', function(req, res){
  res.send('<h1>another hello world</h1>');
});

app.listen(3000);

On lance le serveur node.js avec la commande suivante :

node helloworld.js

Et on teste si tout fonctionne correctement en se rendant via son navigateur sur son localhost sur le port 3000.

Nous verrons dans un prochain article quels sont les principes fondamentaux du développement avec Express et Node.js.
En attendant, je vous laisse visiter le site officiel d’Express qui contient toute la documentation nécessaire pour se lancer dans l’utilisation du Framework. Faites un tour sur cette page pour commencer.

Les formulaires de symfony ont quelquefois des comportements surprenants pour le développeur. Tout le monde pense immédiatement aux embed forms mais ce n’est pas de ces derniers dont je vais parler ici.

Je suis tombé sur le problème suivant : pourquoi après avoir passé une valeur par défaut à un des widgets de mon formulaire, je ne parviens pas à la récupérer dans mon action ou dans mon template ? L’appel à la méthode getDefault du sfForm me renvoie null, tout simplement.

Cas typique :

// Dans le code de mon formulaire :
$this->setWidgets(array(
  ...
  'my_field' => new sfMyWidget(array('default' => 'my_value')),
));

// Dans le code de mon action :
if ($my_form->getDefault('my_field') == 'some_value')
{
  ...
}

Dans ce cas, la méthode getDefault() appelée sur mon formulaire me renvoie null alors que j’ai explicitement donné une valeur par défaut à mon widget. Pourtant, en lisant la doc de symfony sur le sujet je retiens ceci :

The setDefault(), getDefault(), setDefaults(), and getDefaults() methods manages the default values for the embedded widgets. They are proxy methods for the getDefault() and setDefault() widget methods.

Les méthodes setDefault() et getDefault() au niveau de la classe sfForm sont censées êtres des raccourcis pour les méthodes setDefault() et getDefault() de la classe sfWidgetForm().

En fait il s’avère que ce n’est absolument pas le cas et que la méthode getDefault() du formulaire ne fait jamais appel à la méthode getDefault() du widget associé.

L’appel à $my_form->getDefault(‘my_field’) n’est donc pas équivalent à $my_form['my_field']->getWidget()->getDefault().

Par conséquent, il est important de bien comprendre quelle méthode appeler et dans quel cas.

A savoir, $my_form->getDefault(‘my_field’) quand le setDefault a été utilisé au niveau du formulaire. Exemple :

// Valeurs passées dans mon formulaire :
$this->setWidgets(array(
  ...
  'my_field' => new sfMyWidget(),
));
$this->setDefault('my_field', 'my_value');

// Ou alors valeurs passées dans mon action :
$my_form = new myFormClass(array(
  ...
  'my_field' => 'my_value',
));

Et, $my_form['my_field']->getWidget()->getDefault() quand le setDefault() a été utilisé au niveau du widget. Exemple :

// Dans le code de mon formulaire :
$this->setWidgets(array(
  ...
  'my_field' => new sfMyWidget(array('default' => 'my_value')),
));

Voilà, désormais vous êtes prévenus…

Et ben… Moi qui pensais rédiger chaque mois un article regroupant les meilleur liens sur lesquels je tombe, je viens de constater que le dernier (et aussi le premier) posté dans cette rubrique date de… Juillet.
Allez j’ai une excuse, pendant ce temps, je suis parti plusieurs mois en roadtrip à l’autre bout du monde…

Depuis mon retour en France, j’ai repris les choses sérieuses et ai de nouveau le loisir de glaner ci et là de bonnes ressources pour le boulot (et pour ma culture).

Voici donc ma sélection pour le mois de Février.

Isotope

Isotope est un plugin jQuery fantastique. Il permet de réorganiser à la volée l’affichage d’éléments au sein d’une page Web en fonction de différents critères qu’il suffit au développeur de définir (ordre, type, taille de l’écran…).

Je vais très prochainement l’intégrer à l’un de mes projets pour faire un joli filtrage dynamique d’items.

URL : http://isotope.metafizzy.co/

Osez créer un site HTML5 et CSS3

Raphael Goetter du site Alsacréations nous démontre dans un très bon article qu’il est possible aujourd’hui de développer un site en HTML5 et CSS3. Il explique quels compromis il a dû faire pour les anciens navigateurs et quelles sont les parades pour ne pas rendre son site complètement inaccessible sur ces derniers.

Pour ma part, c’est cet article qui m’a convaincu de développer ma prochaine appli web en HTML5, malgré la part encore très importante de personnes utilisant IE6, 7 et 8.

URL : http://www.alsacreations.com/article/lire/947-osez-creer-site-html5-css3.html

Jquery Mobile DateBox

Enfin, et parce que je m’intéresse tout particulièrement à l’actualité concernant jQuery Mobile, je vous signale l’apparition d’un petit widget pour vos webapp mobiles, vous permettant de renseigner un champs date de manière simple et efficace.

Une simple ligne de code dans votre template et le tour est joué :

<input name="somedate" type="date" />

URL : http://dev.jtsage.com/jQM-DateBox/

Formalize

Formalize est un plugin jQuery (également disponible pour d’autres frameworks JS (Dojo, ExtJS, MooTools, Prototype et YUI) qui facilite la tâche du développeur lors de la création et de la mise en forme des formulaires. Il offre une mise en page standardisée sur tous les navigateurs de vos forms et offre le support de certaines propriétés CSS3 non implémentées dans les anciens navigateurs.

URL : http://formalize.me/

Démo : http://formalize.me/demo.html

Quovolver

Grâce à ce plugin, en une seule ligne de code, présentez joliment et efficacement un ensemble de quotes au sein d’un même bloc.

$('blockquote').quovolver();

URL : http://sandbox.sebnitu.com/jquery/quovolver/

Samedi dernier, la version mobile du célébrissime Framework Javascript jQuery est sortie en version Alpha. Assez semblable à ce qu’offre jQTouch, jQuery Mobile s’annonce comme une future référence pour les développeurs web qui veulent adapter leur site aux navigateurs des différents smartphones du marché.

Au menu, support cross-browser (iPhone, Androïd, Blackberry, …), graceful degradation pour les navigateurs qui n’implémentent pas encore toutes les propriétés CSS3 ou HTML5, animations et transitions du type iPhone, boîtes de dialogues et boutons prêts à être utilisés, gestion des thèmes et encore beaucoup d’autres choses très prometteuses.

Il est explicitement spécifié sur le site officiel de jQuery Mobile qu’il ne faut pas considérer ce framework comme un simple moyen d’adapter son site aux navigateurs mobiles puisqu’il peut très facilement profiter des fonctionnalités de PhoneGap pour créer de véritables clients lourds pour les différents Smartphones. Un bon moyen de coder une seule fois son application mobile pour la déployer ensuite sur les différents stores des constructeurs.

J’ai jeté un rapide coup d’oeil à l’application de démonstration qui s’annonce en effet très bien réalisée. Quelques bugs semblent persister mais je pense qu’ils devraient rapidement être résolus en fonction des retours de la communauté. Dès que j’aurai un peu plus de temps, je tâcherai de poster un petit tutoriel pour démarrer un projet symfony avec jQuery Mobile.

En attendant, n’hésitez pas à consulter le site officiel et surtout la démo en ligne de ce projet.

C’est une pratique assez récurrente chez les développeurs Web ou chez les web designers qui bloguent. Alors moi aussi je vais régulièrement (chaque mois) poster un article regroupant les ressources utiles sur lesquelles je suis tombé. Deux intérêts à cette démarche :

• D’une part pouvoir les retrouver le jour où j’en aurai besoin / re-besoin
• D’autre part, les partager avec vous amis lecteurs

Je crée donc pour l’occasion une nouvelle catégorie d’articles sur OvernetCity intitulée sobrement : “Ressources Utiles”.

Pour ce mois de Juillet, un peu de jQuery, un peu de symfony et un peu de développement iPhone sont au programme. D’ailleurs, cela risque d’être souvent le cas…

Interactive Photo Desk with jQuery and CSS3

Les démonstrations concernant CSS 3 et HTML 5 ont le vent en poupe depuis quelques mois. Il ne se passe pas une journée sans qu’un tuto complet soit posté sur un des nombreux blogs que je suis, montrant à quel point l’arrivée de ces deux langages et leur support par l’ensemble des navigateurs modernes va changer notre façon d’interagir avec une application Web.

Ici, c’est l’alliance du CSS 3 et de jQuery qui permet de réaliser un chouette bureau sur lequel s’entassent quelques photos. L’utilisateur peut les déplacer avec un résultat d’une fluidité étonnante.

A consulter avec un navigateur moderne évidemment.

http://tympanus.net/codrops/2010/07/01/interactive-photo-desk/

Minimalistic Slideshow Gallery with jQuery

Encore un tuto expliquant comment réaliser une mini gallerie pour afficher quelques photos. Celui-ci a le mérite d’être très clair et d’avoir un rendu vraiment pro.

Très facile à intégrer au sein d’une page existante !

http://tympanus.net/codrops/2010/07/05/minimalistic-slideshow-gallery/

Symfony 1.4 – Tri sur les colonnes étrangères dans l’admin generator

L’admin generator de symfony est un outil merveilleusement pratique qui permet de créer en quelques minutes un backend parfaitement fonctionnel et adapté aux besoins du client.

Néanmoins, je me suis souvent demandé pourquoi il est impossible sans mettre les mains dans le cambouis de faire un tri sur les colonnes persos dans la liste générée par le Framework. Chaque colonne est par défaut cliquable ce qui entraine un tri ascendant ou descendant de la liste en fonction de cette colonne mais ce comportement est indisponible dès que la colonne en question n’est pas une colonne native en base et fait, par exemple, référence à l’attribut name d’un objet récupéré via une relation.

Les développeurs experts symfony de l’agence Elao nous montrent comment modifier le comportement de l’admin generator pour que, justement, ce tri soit possible sur les colonnes non natives. Très utile !

http://www.elao.org/symfony/symfony-1-4-admin-generator-tris-sur-les-colonnes-etrangeres.html

Introduction aux Métadonnées RDFa, Microdata et Microformats

Je connais la technique depuis un moment mais n’ai pas encore eu l’occasion de la mettre en pratique au sein d’un projet. Ces métadonnées à destination des moteurs de recherche permettent de stocker de modifier la présentation d’une page au sein d’un moteur de recherche pour apporter de la valeur ajoutée à l’utilisateur. Les sites référençant des restaurants, par exemple, peuvent profiter de ces métadonnées pour afficher, directement au sein des résultats d’un moteur de recherche, la note associée à un restaurant sous forme d’étoiles.

Ces données sont de plus en plus utilisées et de mieux en mieux exploitées. Elles méritent donc qu’on s’y attarde un tout petit peu de manière à optimiser le référencement naturel d’une application web.

Cet article présente quelques exemples concrets d’utilisation de ces métadonnées et référence quelques liens utiles pour le développeur.

http://spyrestudios.com/real-world-microformats-rdfa-microformats-and-microdata-practical-examples/

Tutoriel complet sur les Microdata de HTML5

Quand on pense à l’HTML 5, on ne pense pas forcément immédiatement à Microdata. Et pourtant c’est également une des grandes nouveauté que ce nouveau langage nous apporte et à laquelle tout bon développeur se doit de s’intéresser. Ce tutoriel très complet permet d’aller plus loin que l’article précédent en se basant sur un exemple concret.

http://net.tutsplus.com/tutorials/html-css-techniques/html5-microdata-welcome-to-the-machine/

Comment intégrer Google Analytics dans son application iPhone en 7 minutes ?

Intégrer un script de tracking des visiteurs dans une application Web est aujourd’hui presque un réflexe pour le développeur. On peut faire la même chose pour une application lourde sur iPhone puisque l’API de Google est compatible avec plusieurs terminaux mobiles dont ce dernier.

Quel est l’intérêt ? Comment est-ce que ça marche ? Quels sont les pré-requis ? Autant de questions qui trouveront leurs réponses dans ce tutoriel très complet de iCodeBlog.

http://icodeblog.com/2010/04/22/how-to-integrate-google-analytics-tracking-into-your-apps-in-7-minutes/

Premiers pas avec iPhone Core Data

Ce tutoriel est une belle introduction au Framework Core Data de l’iPhone OS qui n’est pas très bien couvert par les livres que j’ai pu lire lors de ma formation au développement iPhone.

A parcourir pour comprendre quelles sont les possibilités offertes par ce Framework et surtout comment les mettre en oeuvre.

http://mobile.tutsplus.com/tutorials/iphone/iphone-core-data/

Afficher un flux RSS en temps réel avec XMPP

Comment fait Google avec son GTalk pour afficher les messages envoyés en temps réel sur sa page web, sans sacrifier les ressources serveurs avec des requêtes Ajax envoyée chaque seconde ?

C’est une question que je me suis souvent posé et à laquelle j’ai trouvé une réponse aujourd’hui grâce à un tutoriel très complet posté sur le site d’IBM. GMail, Gtalk, Google Wave font tous usage du langage XMPP dédié à la notification en quasi temps réel pour les applications web. A lire d’urgence si le sujet vous intéresse…

http://www.ibm.com/developerworks/xml/tutorials/x-realtimeXMPPtut/index.html

En voulant me servir de la fonction PHP getimagesize('http://un_serveur/une_image.jpg'), je suis tombé sur une erreur après la mise en ligne du code sur un hébergement mutualisé de 1and1 :

Warning: getimagesize() [function.getimagesize]: URL file-access is disabled in the server configuration

L’erreur vient tout simplement du fait que, par défaut, dans la version 5 de PHP, la variable allow_url_fopen du php.ini est à false. Cette option active les versions étendues des fonctions d’accès aux fichiers, qui savent exploiter les URL.

Je me suis dit dans un premier temps que j’allais devoir basculer le site sur un serveur dédié mais, après quelques recherches, j’ai découvert que 1and1 autorise la modifications des valeurs du php.ini, même sur un hébergement mutualisé.

Pour ce faire, rien de plus simple ! Il suffit de créer un fichier php.ini avec les couples variables / valeurs souhaités et de le placer dans l’ensemble des répertoires contenant des scripts PHP sur le serveur.

Exemple de fichier php.ini :

upload_max_filesize = 10M
post_max_size = 10M


En ce qui nous concerne, il faut créer le fichier suivant :

allow_url_fopen = 1


Si vous travaillez sur un projet symfony, il suffit de mettre le php.ini à la racine du dossier web, puisque toutes les actions s’exécutent à partir du contrôleur frontal.

Si vous n’êtes pas chez 1and1, vérifiez si votre hébergeur vous propose la personnalisation du php.ini. De plus en plus le font afin de laisser un peu de souplesse aux développeurs. Et on ne va pas s’en plaindre…

Je m’occupe actuellement du développement du site myBonjour.fr qui permet le recensement et l’affichage de tous les blogs du type Bonjour Madame et Bonjour Poney.

Pour optimiser la vitesse de chargement des pages, je me suis intéressé à la technique aujourd’hui très populaire des Sprites CSS.

Un Sprite, qu’est-ce que c’est ? C’est une grande image qui contient plusieurs petites images utilisées au sein de votre application web, via les feuilles de style. En utilisant la propriété background CSS, il est assez facile de dire quelle partie du sprite doit être affichée en image de fond.
L’avantage de regrouper plusieurs petites images au sein d’un sprite est double. D’une part, l’image ainsi formée est souvent moins lourde que l’ensemble des petites images additionnées et, d’autre part, le nombre de requête HTTP pour charger les images est réduit à un. C’est ce dernier point qui est le plus important et le plus significatif en terme de gain de performances.

Voici un exemple de sprite :

De nombreuses applications Web apportent une aide intéressante pour la création de Sprite à partir d’un site existant non optimisé.
J’ai retenu tout particulièrement le site http://spriteme.org qui offre un bouton à glisser dans sa barre de favoris et qui ouvre une popup en Javascript qui permet de créer un sprite à la volée et même de générer le CSS correspondant à partir du CSS existant.

Maintenant, comment générer un Sprite soit même, directement dans son code symfony ? Vous allez voir ci-dessous le code que j’ai utilisé pour myBonjour.fr.

Pour cela, j’ai ajouté dans un premier temps une méthode privée dans mon modèle, s’occupant de générer le Sprite en question :

  private function makeSpriteForFavicons()
  {
    $items = Doctrine_Core::getTable('MyBonjourItem')->getAllActiveItems();

    $width = 25;
    $height = 16;
    $space = 14;

    // On crée l'image vide
    $image = imagecreatetruecolor($width, ($height+$space) * count($items));
    $background = imagecolorallocatealpha($image, 255, 255, 255, 127);
    imagefill($image, 0, 0, $background);
    imagealphablending($image, false);
    imagesavealpha($image, true);

    // Ajout de tous les favicons à l'image
    $pos = 7;
    foreach($items as $item)
    {
      $tmp = imagecreatefrompng($item->getItemFilePath());
      imagecopy($image, $tmp, 0, $pos, 0, 0, $width, $height);
      $pos += $height + $space;
      imagedestroy($tmp);
    }

    imagepng($image, sfConfig::get('sf_web_dir').'/images/items_icons.png');
  }

Il suffit ensuite d’appeler cette méthode, quand la colonne correspondant à l’image est modifiée. Pour cela, on implémente la méthode save du modèle :

  public function save(Doctrine_Connection $conn = null)
  {
    if(in_array('favicon_url', array_keys($this->getModified())))
    {
      $return = parent::save($conn);
      $this->makeSpriteForFavicons();
    }
    else
      $return = parent::save($conn);

    return $return;
  }

Et enfin, on génère la partie correspondante dans le fichier CSS, à la volée :

// makeCSSSuccess.php
<?php $pos = 0; foreach($items as $item): ?>
div#<?php echo $item->getSlug() ?> > h3{
  background: url("/images/items_icons.png") no-repeat scroll 5px -<?php echo $pos*$width ?>px;
}
<?php $pos++; endforeach; ?>

Le fichier CSS généré par une action symfony doit être mis en cache pour éviter toute chute des performances. Il suffit de déclencher ensuite une regénération du cache lorsqu’un item est ajouté en base.
Sur myBonjour, j’ai ainsi supprimé le chargement de 60 requêtes HTTP, correspondant aux différents bonjours présents dans la liste.

How to launch a symfony task from action code? Ou comment appeler une tâche symfony depuis une action, sans passer par le CLI ?

Symfony permet depuis la version 1.3 / 1.4 d’appeler une tâche directement depuis une autre tâche via le code suivant :

$this->runTask('mydomain:mytask');

On peut par exemple très facilement créer une tâche au cours de laquelle un appel à symfony cc sera déclenché :

<?php

class testTask extends sfBaseTask
{
  protected function configure()
  {
    // // add your own arguments here
    // $this->addArguments(array(
    //   new sfCommandArgument('my_arg', sfCommandArgument::REQUIRED, 'My argument'),
    // ));
    $this->addOptions(array(
    new sfCommandOption('application', null, sfCommandOption::PARAMETER_REQUIRED, 'The application name'),
    new sfCommandOption('env', null, sfCommandOption::PARAMETER_REQUIRED, 'The environment', 'dev'),
    new sfCommandOption('connection', null, sfCommandOption::PARAMETER_REQUIRED, 'The connection name', 'doctrine'),
    // add your own options here
    ));
    $this->namespace        = '';
    $this->name             = 'test';
    $this->briefDescription = '';
    $this->detailedDescription = <<
The [test|INFO] task does things.
Call it with:
[php 1="test|INFO" language="symfony"][/php][/php]
EOF;
  }
  protected function execute($arguments = array(), $options = array())
  {
    // initialize the database connection
    $databaseManager = new sfDatabaseManager($this->configuration);
    $connection = $databaseManager->getDatabase($options['connection'])->getConnection();
    // here is our code
    // we do something
    // and we clear cache
    $this->runTask('cc');
  }
}

En revanche, rien n’est actuellement prévu pour appeler cette même tâche depuis une action. Il est pourtant très utile de pouvoir appeler la tâche d’envoi des emails directement depuis une action de son backend. Ou même de vider le cache sans avoir à passer par la ligne de commandes.
Le plugin ybRunTaskPlugin a été développé justement pour palier à ce manque. Une fois le plugin installé, il est possible d’appeler directement au sein de son action une tâche symfony, de la même manière qu’on pouvait le faire en standard au sein d’une autre tâche :

class myActions extends sfActions
{
  public function executeRuntask(sfWebRequest $request)
  {
    $ret = $this->runTask('myDomain:myTask', 'myArguments');
    if(null != $ret)
    {
      $this->msg = $ret->getMessage();
    }
    else
    {
      $this->msg = 'everything went OK';
    }
  }
}

Malheureusement, le plugin ne gère actuellement pas l’affichage des logs ou d’une quelconque valeur de retour si l’exécution s’est passé correctement. Peut-être dans une prochaine version ?
En attendant, vous pouvez réaliser un petit hack du plugin en fonction de vos besoins…