Flash CMS: Utiliser Drupal 6 pour gérer le contenu de Flash – 2ème partie (galerie d’images)

Bonjour tout le monde !

Voici la deuxième partie de la série “Utiliser Drupal pour gérer le contenu de Flash”. Me basant sur un excellent article de raincitystudios.com pour créer une galerie d’images dans Drupal, il me semblait évident de l’implémenter dans Flash avec la classe Drupal. C’est tout simple, mais il faut d’abord faire quelques configurations dans Drupal.

Vous pouvez vous baser sur l’article en question, mais vous n’avez pas besoin d’aller jusqu’à la configuration de Views, puisque l’affichage se fait dans Flash. Voici l’exemple:

Galerie Flash

Je vous explique la marche à suivre pour configurer Drupal.

1. Modules

Il faut installer les modules CCK, FileField, ImageField et il me semble qu’il faut activer le module Upload, fourni par défaut.

2. Créer un contenu de type Galerie

Allez sous “Administer > Content Management > Content Types” . Si vous avez correctement activé les modules, vous verrez en haut un lien “Add content type“. Cliquez ce lien.

Donnez lui un nom (un nom pour vous, un nom pour Drupal), puis sauvegardez. Vous retombez sur la page “Content Types” et vous devriez voir votre nouveau type de contenu dans la liste.

A droite de votre type, cliquez sur “manage fields“. Vous verez un champ “New Field“. Entrez ce que vous voulez dans “Label” et “Field Name“. Dans “Type of data to store“, séléctionnez “File” et dans “Form element to edit the data“, séléctionnez “Image“. Cliquez sur “save“.

Vous tombez maintenant sur la page de configuration de votre type. Vous noterez un champ de text avec comme titre “Permitted upload file extensions:“. Ici, vous pouvez entrer les types de fichiers que vous ou votre client pouvez charger sur le serveur. Juste après (aha ! ), un champ “Maximum resolution for Images:” ! Entrez une résolution (genre 400×300), et Drupal va automatiquement redimensionner les images si nécessaire avant de les sauvegarder sur le serveur.

Maintenant, très important, sous “Global Settings“, vous voyez “Number of values“. C’est le nombre d’images que pourra contenir votre galerie. Moi, j’ai mis “Unlimited“. Voilà, choisissez “Save field settings“.

3. Créer une galerie

Maintenant, dans le menu principal de Drupal, allez sous “Create Content“, choisissez votre type de contenu. Donnez un titre, inutile de mettre du contenu dans le body. Si vous descendez, vous verrez un formulaire pour charger vos images. Tout en Ajax, avec redimensionnement à la clé ! Pour ajouter d’autres images, il suffit de cliquer sur “Add another item“. Merci qui ? Merci Drupal !

4. Le PHP

Pour le php, il suffit de rajouter ces quelques lignes de codes.

Note: Encore une fois, je tiens à préciser que le fichier PHP n’est pas très sécurisé et permettrait peut-être à quelqu’un d’injecter du code malveillant. Ceci n’est que pour l’exemple. Je posterai bientôt une version plus sûr.

if ($action == "gallery")

{

$sql = mysql_query("SELECT filepath FROM {$prefix}files WHERE fid IN (SELECT field_image_fid FROM {$prefix}content_field_image WHERE nid='{$id}')") or die(mysql_error());

while ($row = mysql_fetch_assoc($sql))

echo $row['filepath'] . ','; // output:  path1, path2

}

5. Le Flash

La classe Drupal est toute simple à mettre à jour. Vers la ligne 38, ajoutez une constante:

public static const GALLERY:String = "gallery";

Dans la méthode onComplete(), ajouter cette condition juste avant de lancer l’événement:

else if (_content == GALLERY)

{

temp = String(e.target.data).split(",");

temp.pop(); // get rid of last empty element

}

Vous noterez que j’ai mis un pop() à temp. Ceci est dû au fait que le php renvoie une chaine de caractères pour l’Array (”image1, image2, image3,”), avec une virgule à la fin. Ce qui fait une entrée vide dans l’Array, à tous les coups. Donc autant s’en débarasser . Je la rajouterais également dans la condition:

else if (_content == MENU) { ...

…puisque le même problème se pose. Par contre, en recevant le contenu d’une page (Drupal.NODE), on n’a pas d’entrée vide. On se gardera donc bien de mettre temp.pop() juste avant le return !

Pour:

_drupal = new Drupal("drupal.php");

_drupal.addEventListener(DrupalEvent.SUCCESS, onSuccess);

// get gallery

_drupal.request(Drupal.GALLERY, 6);

…la classe Drupal fournira une Array tout bête avec les chemins pour chaque image. A moins que le .swf soit dans le même répertoire que le CMS, il faudra par contre adapter les chemins pour que Flash puissent télécharger les images. Ensuite, c’est à nous de créer un système de galerie d’images en actionscript en utilsant cette Array. Vous noterez qu’il faut donnez un ID. Ceci est dû au fait que pour Drupal, même la galerie d’images est une Node comme un autre, et le script php ne saura pas faire la différence entre une galerie et un node simple. Il faut donc fournir l’ID de la galerie.

- Wouter

Voici les sources: sources
Licence: LGPL

Bookmark