Voici un tutorial pour créer une application « composant » sur Joomla! grâce à la nouvelle API basé sur Joomla framework MVC 1.5
Le gros avantage de la version 1.5 par rapport à la version 1.0, c’est qu’elle propose une API bien mieux construire et rend beaucoup plus agréable le développement d’applications. Le nouveau framework est basé sur le design-pattern MVC bien que la couche modèle est quelque peu inutile, étant donné que Joomla 1.5 ne fonctionne avec rien d’autre que MySQL, cela dit, on a le choix entre les drivers « mysql » ou « mysqli ».
Nous illustrerons une application simple qui saisie des utilisateurs dans une table et qui les affiche sous la forme d’une liste. Cette application nous permettra de voir d’une façon pragmatique la structure des applications Joomla! et les fonctions de base du framework : création d’une classe modèle (ajout, mise à jour, suppression et requêtes en base de données), création d’un controller avec les actions de base (une action pour création et édition et une autre pour le listing), gestion des templates, redirections et notifications des erreurs et succès.
Voici ci-dessous la hiérarchie de notre application, il s’agit d’un répertoire à créer dans le dossier « components » de Joomla! :
Voici le script SQL correspondant à la table « jos_crud_users » qui contient les données :
-- -- Structure de la table `jos_crud_users` -- CREATE TABLE IF NOT EXISTS `jos_crud_users` ( `user_id` int(11) NOT NULL AUTO_INCREMENT, `user_name` varchar(255) CHARACTER SET utf8 COLLATE utf8_bin NOT NULL, `user_lastname` varchar(255) CHARACTER SET utf8 COLLATE utf8_bin NOT NULL, `user_email` varchar(255) CHARACTER SET utf8 COLLATE utf8_bin NOT NULL, PRIMARY KEY (`user_id`) ) ENGINE=MyISAM DEFAULT CHARSET=utf8 AUTO_INCREMENT=1 ;
Voici le premier fichier à créer, « crud.php » il s’agit du fichier d’entrée qui est exécuté dès qu’un utilisateur visite l’application :
<?php /** * @package Joomla.Crud * @subpackage Components * components/com_crud/crud.php * @link http://www.alexandre-julien.com * @author Alexandre JULIEN */ // Pas d'accès direct à la page defined( '_JEXEC' ) or die( 'Restricted access' ); // Requiert la classe des contrôleurs require_once( JPATH_COMPONENT.DS.'controller.php' ); // Requiert un contrôleur spécifique si demander if($controller = JRequest::getVar('controller')) { $path = JPATH_COMPONENT.DS.'controllers'.DS.$controller.'.php'; if (file_exists($path)) { require_once $path; } else { $controller = ''; } } // Instanciation du contrôleur $classname = 'CrudController'.$controller; $controller = new $classname( ); // Execute la tâche demandée $controller->execute( JRequest::getVar( 'task' ) ); // Redirection si elle est sollicitée par le contrôleur $controller->redirect(); ?>
Voici maintenant le contrôleur, chaque méthode correspond à une tâche accessible par l’url : « index.php?option=com_crud&task=lamethode »
<?php /** * @package Joomla.Crud * @subpackage Components * @link http://www.alexandre-julien.com * @license GNU / GPL * @author Alexandre JULIEN */ // No direct access defined( '_JEXEC' ) or die( 'Restricted access' ); jimport('joomla.application.component.controller'); /** * Hello World Component Controller * * @package Joomla.Tutorials * @subpackage Components */ class CrudController extends JController { /** * Méthode d'affichage * * @access public */ function display() { $model = $this->getModel(); $view = $this->getView('list', 'html'); $view->users = $model->getAllUsers(); $view->display(); } /** * Formulaire de création d'un utilisateur * @return unknown_type */ function add() { $view =& $this->getView('edit', 'html'); $view->display(); } /** * Formulaire d'édition d'un utilisateur * @return unknown_type */ function edit() { if (isset($_GET) & isset($_GET['id'])) { $view = $this->getView ('edit', 'html'); $model =& $this->getModel(); $view->data = $model->getUser($_GET['id']); $view->display(); } else { $this->setRedirect('index.php?option=com_crud', "L'identifiant est manquant", 'error'); } } /** * Sauvegarde d'un utilisateur * @return unknown_type */ function save() { if (isset($_POST)) { $model =& $this->getModel(); if (isset($_POST['id']) & $model->getUser($_POST['id'])) { $model->updateUser($_POST); } else { $model->addUser($_POST); } $this->setRedirect('index.php?option=com_crud', "Les modifications ont bien été enregistrées", 'message'); } else { $this->setRedirect('index.php?option=com_crud', "Les données sont manquantes", 'error'); } } /** * Suppression d'un utilisateur * @return unknown_type */ function delete() { if (isset($_GET) & isset($_GET['id'])) { $model =& $this->getModel(); $model->removeUser($_GET['id']); $this->setRedirect('index.php?option=com_crud', "L'utilisateur a bien été supprimé", 'message'); } else { $this->setRedirect('index.php?option=com_crud', "L'identifiant est manquant", 'error'); } } } ?>
La couche modèle qui gère les transactions avec la base de données dans le fichiers « models/crud.php » :
<?php /** * Crud modèle pour le composant Crud * * @package Joomla.Crud * @subpackage Components * @link http://www.alexandre-julien.com * @license GNU/GPL * @author Alexandre JULIEN */ // Pas d'accès direct defined( '_JEXEC' ) or die( 'Restricted access' ); jimport( 'joomla.application.component.model' ); /** * Modèle Crud * * @package Joomla.Crud * @subpackage Components */ class CrudModelCrud extends JModel { /** * Retourne tous les enregistrements de la table * @return unknown_type */ function getAllUsers() { $query = 'SELECT * FROM #__crud_users'; return $this->_getList ($query); } /** * Retourne l'enregistrement en fonction de l'identifiant de l'utilisateur * @param $user_id * @return unknown_type */ function getUser ($user_id) { $query = 'SELECT * FROM #__crud_users WHERE user_id = '.(int)$user_id; $result = $this->_getList ($query); return $result[0]; } /** * Ajoute un enregistrement * @param $values * @return unknown_type */ function addUser ($values) { $db =& JFactory::getDBO(); $row = new stdClass(); $row->user_name = $values['user_name']; $row->user_lastname = $values['user_lastname']; $row->user_email = $values['user_email']; $db->insertObject ('#__crud_users', $row); } /** * Met à jour un enregistrement * @param $values * @return unknown_type */ function updateUser ($values) { $db =& JFactory::getDBO(); $row = new stdClass(); $row->user_id = $values['user_id']; $row->user_name = $values['user_name']; $row->user_lastname = $values['user_lastname']; $row->user_email = $values['user_email']; $db->updateObject ('#__crud_users', $row, 'user_id'); } /** * Supprime un enregistrement * @param $id * @return unknown_type */ function removeUser ($id) { $db =& JFactory::getDBO(); $query = 'DELETE FROM #__crud_users WHERE user_id = '.(int)$id; $db->setQuery($query); return $this->query(); } } ?>
Voici un exemple de fichier « View.html.php », il s’agit de celui de l’écran de listing :
<?php /** * @package Joomla.Crud * @subpackage Components * @link http://www.alexandre-julien.com * @license GNU/GPL * @author Alexandre JULIEN */ // Pas d'accès direct defined( '_JEXEC' ) or die( 'Restricted access' ); jimport( 'joomla.application.component.view'); /** * HTML View pour afficher la liste des utilisateurs * * @package Crud */ class CrudViewList extends JView { function display($tpl = null) { $this->assignRef('data', $this->users); parent::display($tpl); } } ?>
Le template de la vue « edit » :
<?php // Pas d'accès direct defined('_JEXEC') or die('Restricted access'); ?> <h1>Edition d'un utilisateur</h1> <form name="utilisateur" method="POST" action="<?php echo JRoute::_('index.php?option=com_crud&task=save') ?>"> <input type="hidden" name="user_id" value="<?php echo $this->data->user_id ?>" /> <table> <tbody> <tr> <th>Prénom de l'utilisateur</th> <td><input type="text" name="user_name" value="<?php if (isset($this->data)) { echo $this->data->user_name; } ?>" /></td> </tr> <tr> <th>Nom de l'utilisateur</th> <td><input type="text" name="user_lastname" value="<?php if(isset($this->data)) { echo $this->data->user_lastname; } ?>" /></td> </tr> <tr> <th>Email de l'utilisateur</th> <td><input type="text" name="user_email" value="<?php if(isset($this->data)) { echo $this->data->user_email; } ?>"></input></td> </tr> </tbody> </table> <br /> <br /> <input type="submit" value="Enregistrer" /></form>
Le template de la vue « list » :
<?php // Pas d'accès direct defined('_JEXEC') or die('Restricted access'); ?> <h1>Liste des utilisateurs</h1> <table> <tbody> <tr> <th>Nom</th> <th>Prénom</th> <th>Adresse e-mail</th> <th>Actions</th> </tr> <?php foreach ($this->data as $key => $value) { ?> <tr> <td><?php echo $value->user_lastname ?></td> <td><?php echo $value->user_name ?></td> <td><?php echo $value->user_email ?></td> <td><a href="<?php echo JRoute::_('index.php?option=com_crud&task=edit&id='.(int)$value->user_id) ?>"> Editer </a> | <a href="<?php echo JRoute::_('index.php?option=com_crud&task=delete&id='.(int)$value->user_id) ?>">Supprimer</a></td> </tr> <?php } ?> </tbody> </table> <br /> <a href="<?php echo JRoute::_('index.php?option=com_crud&task=add') ?>"> Créer un utilisateur </a>
On pourra également créer un package Joomla! qui automatisera l’installation des fichiers et des tables SQL grâce à un fichier de configuration d’installation « hello.xml » :
<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE install SYSTEM "http://www.joomla.org/xml/dtd/1.5/component-install.dtd"> <install type="component" version="1.5.0"> <name>crud</name> <!-- Les éléments suivants sont optionnels --> <creationDate>2009 09 21</creationDate> <author>Alexandre JULIEN</author> <authorEmail>mail@alexandre.julien.com</authorEmail> <authorUrl>http://www.alexandre-julien.com</authorUrl> <copyright>Le blog d'Alex</copyright> <license>GNU / GPL</license> <!-- Version du composant --> <version>stable 1.0</version> <!-- Description du Composant --> <description>Petit tutoriel CRUD pour illustrer Joomla! MVC Framework</description> <!-- Fichiers d'installation --> <files folder="site"> <filename>crud.php</filename> <filename>controller.php</filename> <filename>models/crud.php</filename> <filename>views/edit/view.html.php</filename> <filename>views/edit/tmpl/default.php</filename> <filename>views/list/view.html.php</filename> <filename>views/list/tmpl/default.php</filename> </files> <install> <sql> <file charset="uft8" driver="mysql">install.sql</file> <file charset="utf8" driver="mysqli">install.sql</file> </sql> </install> <uninstall> <sql> <file charset="utf8" driver="mysql">uninstall.sql</file> <file charset="utf8" driver="mysqli">uninstall.sql</file> </sql> </uninstall> <administration> <!-- Administration Menu Section --> <menu>Joomla! CRUD</menu> <!-- Fichiers de la partie administration --> <files folder="admin"> <filename>index.html</filename> <filename>install.sql</filename> <filename>uninstall.sql</filename> </files> </administration> </install>
Voici des « screenshots » de notre application finale :
L’application est disponible ici dans cette archive : Tutoriel Joomla! CRUD (installation package)
<?php// Pas d’accès direct
defined(‘_JEXEC’) or die(‘Restricted access’); ?>
<h1>Edition d’un utilisateur</h1>
<form name= »utilisateur » method= »POST »
action= »<?php echo JRoute::_(‘index.php?option=com_crud&task=save’) ?> »>
<input type= »hidden » name= »user_id » value= »<?php echo $this->data->user_id ?> » />
<table>
<tbody>
<tr>
<th>Prénom de l’utilisateur</th>
<td><input type= »text » name= »user_name »
value= »<?php if (isset($this->data)) { echo $this->data->user_name; } ?> » /></td>
</tr>
<tr>
<th>Nom de l’utilisateur</th>
<td><input type= »text » name= »user_lastname »
value= »<?php if(isset($this->data)) { echo $this->data->user_lastname; } ?> » /></td>
</tr>
<tr>
<th>Email de l’utilisateur</th>
<td><input type= »text » name= »user_email »
value= »<?php if(isset($this->data)) { echo $this->data->user_email; } ?> »></input></td>
</tr>
</tbody>
</table>
<br />
<br />
<input type= »submit » value= »Enregistrer » /></form>