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…

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

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…

De plus en plus de développeurs font le choix d’utiliser la plateforme WordPress pour développer l’ensemble d’un site internet et non pas seulement le blog. Cette démarche a l’intérêt de préserver très facilement une cohérence globale sur le site. Une seule gestion des utilisateurs, une seule gestion des commentaires, un seul routing…

Pour ma part, je préfère garder séparée la plateforme de blog WP du reste de mon site. Mais j’ai pourtant envie d’afficher la liste des derniers articles postés sur mon blog directement sur mon site. Comment faire ?

Les solutions

Le flux RSS

Une des solutions qui semble la plus retenue par les développeurs est la récupération et le parsing du flux RSS généré automatiquement par WordPress. Ce choix présente de nombreux avantages comme la possibilité de choisir le flux adapté à son besoin : tri par tag, par auteur, par catégorie…

En revanche, le parsing peut être un peu compliqué et semble moins performant qu’un accès direct en base. J’ai donc choisi d’utiliser une classe PHP qui récupère directement dans ma base de données WordPress les articles et informations associées. Si toutefois vous préférez la solution “Flux RSS”, sachez que de très nombreux exemples pourront être dénichés sur les forums francophones dédiés à WordPress ou sur Google en général.

Récupération en base

La deuxième solution consiste donc à se connecter directement à la base de données de WordPress pour y récupérer à la demande les derniers articles et les informations associées.

En cherchant sur Google je suis tombé sur un projet de Peter Upfold dédié à ce sujet. Développé en PHP, cette classe permet après configuration de générer automatiquement le code HTML permettant de lister les derniers articles de son blog. Si vous cherchez une solution clé en main, je vous invite à consulter directement son site :

http://peter.upfold.org.uk/projects/wpget

Vous trouverez même à cette adresse un script permettant de générer automatiquement le fichier de configuration adapté à votre serveur (adresse base de données, nom d’utilisateurs, password…) :

http://peter.upfold.org.uk/projects/wpget/installer

Une fois le fichier wpget.php configuré, vous n’aurez plus qu’à écrire dans le code un bout de script semblable à celui ci-dessous pour insérer la liste de vos derniers articles correctement formatée en HTML :

<?php include_once("./wpget.php");
$wpget = new wpGet;
$wpget->dateformat = "d/m/Y H:i";
$wpget->showcredit = false;
$wpget->getWordpressEntries(2, 200, true, true, true); ?>

Pour ma part, je cherchais une classe plus simple que je pourrai utiliser dans mon application symfony et qui me laisserai gérer la partie présentation manuellement. J’ai donc réécrit entièrement la classe de Peter Upfold pour finalement obtenir deux petites classes PHP 5 (tant qu’à faire !). La première gère la récupération des données en base et la deuxième représente de manière simple un article WordPress avec les getters et setters associés.

Je vous livre le code tel quel ci-dessous :

<?php

/*
Réécriture de la classe PHP de Peter Upfold (http://peter.upfold.org.uk)
pour récupérer la liste des derniers articles postés sur un blog WordPress.

@author: Olivier Balais (http://blog.overnetcity.com)
*/
class WPEntries
{
  protected $dbUser;
  protected $dbPwd;
  protected $dbHost;
  protected $dbName;
  protected $dbTablesPrefix;

  protected $connection;

  // Fonction trouvée à l'origine sur http://uk2.php.net/manual/en/function.substr.php#59719
  private static function html_substr($posttext, $minimum_length = 200, $length_offset = 20, $cut_words = false, $dots = true)
  {
    // $minimum_length:
    // The approximate length you want the concatenated text to be

    // $length_offset:
    // The variation in how long the text can be in this example text
    // length will be between 200 and 200-20=180 characters and the
    // character where the last tag ends

    // Reset tag counter &amp;amp; quote checker
    $tag_counter = 0;
    $quotes_on = false;
    // Check if the text is too long
    if (strlen($posttext) > $minimum_length) {
      // Reset the tag_counter and pass through (part of) the entire text
      $c = 0;
      for ($i = 0; $i < strlen($posttext); $i++) {
        // Load the current character and the next one
        // if the string has not arrived at the last character
        $current_char = substr($posttext,$i,1);
        if ($i < strlen($posttext) - 1) {
          $next_char = substr($posttext,$i + 1,1);
        }
        else {
          $next_char = "";
        }
        // First check if quotes are on
        if (!$quotes_on) {
          // Check if it's a tag
          // On a "<" add 3 if it's an opening tag (like <a href...)
          // or add only 1 if it's an ending tag (like </a>)
          if ($current_char == '<') {
            if ($next_char == '/') {
              $tag_counter += 1;
            }
            else {
              $tag_counter += 3;
            }
          }
          // Slash signifies an ending (like </a> or ... />)
          // substract 2
          if ($current_char == '/' &amp;amp;&amp;amp; $tag_counter <> 0) $tag_counter -= 2;
          // On a ">" substract 1
          if ($current_char == '>') $tag_counter -= 1;
          // If quotes are encountered, start ignoring the tags
          // (for directory slashes)
          if ($current_char == '"') $quotes_on = true;
        }
        else {
          // IF quotes are encountered again, turn it back off
          if ($current_char == '"') $quotes_on = false;
        }

        // Count only the chars outside html tags
        if($tag_counter == 2 || $tag_counter == 0){
          $c++;
        }

        // Check if the counter has reached the minimum length yet,
        // then wait for the tag_counter to become 0, and chop the string there
        if ($c > $minimum_length - $length_offset &amp;amp;&amp;amp; $tag_counter == 0 &amp;amp;&amp;amp; ($next_char == ' ' || $cut_words == true)) {
          $posttext = substr($posttext,0,$i + 1);
          if($dots){
            $posttext .= '...';
          }
          return $posttext;
        }
      }
    }
    return $posttext;
  }

  private static function convert_smart_quotes($string) // not mine either - thanks to Chris Shiflett at http://shiflett.org/archive/165
  {
    $search = array(chr(145),
    chr(146),
    chr(147),
    chr(148),
    chr(151));

    $replace = array('‘',
    '’',
    '“',
    '”',
    '—');

    return str_replace($search, $replace, $string);
  }

  public function __construct($dbUser = "", $dbPwd = "", $dbHost = "localhost", $dbName = "wordpress", $dbTablesPrefix = "wp_")
  {
    $this->dbUser         = $dbUser;
    $this->dbPwd          = $dbPwd;
    $this->dbHost         = $dbHost;
    $this->dbName         = $dbName;
    $this->dbTablesPrefix = $dbTablesPrefix;

  }

  public function getLastEntries($number = 2, $limit = null, $stripJavascript = true, $stripImages = true, $stripEmbed = true)
  {
    // Connexion à la base de données
    try
    {
      $connection = new PDO('mysql:host='.$this->dbHost.';dbname='.$this->dbName, $this->dbUser, $this->dbPwd);
    }
    catch(Exception $e)
    {
      echo $e->getMessage();
      die();
    }

    // Préparation de la requête
    $request = $connection->prepare("SELECT `post_content`, `post_date`, `post_title`, `display_name`, `comment_count`, `guid`
    FROM `".$this->dbTablesPrefix."posts` as posts
    INNER JOIN `".$this->dbTablesPrefix."users` as users ON users.ID = posts.post_author
    WHERE posts.`post_status` = 'publish' AND posts.`post_type` = 'post'
    ORDER BY `post_date` DESC LIMIT ".$number.";");

    // Récupération des articles
    $articles = array();

    try
    {
      $request->execute(array());
    }
    catch(Exception $e)
    {
      echo $e->getMessage();
      die();
    }

    while ($result = $request->fetch(PDO::FETCH_OBJ))
      {
      $content = $result->post_content;

      if ($limit > 0)
      {
        $content = stripslashes(self::html_substr($content, $limit, 20));
        $content = self::convert_smart_quotes($content);
      }
      else
      {
        $content = self::convert_smart_quotes($content);
      }

      if ($stripJavascript)
        $content = ereg_replace("<script.*</script>", "", $content);

      if ($stripImages)
        $content = ereg_replace("<img.*/>", "", $content);

      if ($stripEmbed)
        $content = ereg_replace("<embed.*</embed>", "", $content);

      $article =
        new WordPressArticle($content,
        $result->post_date,
        $result->post_title,
        $result->display_name,
        $result->comment_count,
        $result->guid);

      $articles[] = $article; // Ajout de l'élément à la liste à retourner
    }

    return $articles;
  }
}

class WordPressArticle
{
  protected $content;
  protected $postDate;
  protected $postTitle;
  protected $authorName;
  protected $commentsCount;
  protected $link;

  public function __construct($content = "", $postDate = "", $postTitle = "", $authorName = "", $commentsCount = "", $link = "")
  {
    $this->content = $content;
    $this->postDate = $postDate;
    $this->postTitle = $postTitle;
    $this->authorName = $authorName;
    $this->commentsCount = $commentsCount;
    $this->link = $link;
  }

  public function setContent($content)
  {
    $this->content = $content;
  }

  public function getContent()
  {
    return nl2br($this->content);
  }

  public function setPostDate($postDate)
  {
    $this->postDate = $postDate;
  }

  public function getPostDate()
  {
    return $this->postDate;
  }

  public function setPostTitle($postTitle)
  {
    $this->postTitle = $postTitle;
  }

  public function getPostTitle()
  {
    return $this->postTitle;
  }

  public function setAuthorName($authorName)
  {
    $this->authorName = $authorName;
  }

  public function getAuthorName()
  {
    return $this->authorName;
  }

  public function setCommentsCount($commentsCount)
  {
    $this->commentsCount = $commentsCount;
  }

  public function getCommentsCount()
  {
    return $this->commentsCount;
  }

  public function setLink($link)
  {
    $this->link = $link;
  }

  public function getLink()
  {
    return $this->link;
  }
}

Ci-dessous, un exemple de fonctionnement simplissime dans une application symfony.

Dans l’action :

/**
* Executes index action
*
*/
public function executeIndex()
{
  $wpEntries= new WPEntries("db_user", "db_pwd", "localhost", "wordpress", "wp_");
  $this->entries = $wpEntries->getLastEntries();
}

Dans la vue :

<ul>
 <?php foreach($entries as $entry): ?>
 <li><?php echo $entry->getPostTitle() ?></li>
 <?php endforeach ?>
/ul>

Tout simplement !
N’hésitez pas à utiliser ce bout de code et à me faire un retour le cas échéant.