1 Les champs Joomla
Notre composant fonctionne mais n'offre pas les fonctionnalités classique d'un composant Joomla. Nous allons l'enrichir en rajoutant certains champs. Il n'est pas obligatoir que ces champs soient présent dans un composant c'est au développeur de décider en fonction des besoins. Voici la liste des champs que nous allons ajouter:
alias : sert à définir une chaîne de caractères qui sera utilisée dans l'url pour un meilleur référencement.
metakey : Les mots clés à mettre dans les balise meta keywords pour les moteurs de recherche.
metadesc : Une description à mettre dans les balise meta description
created : la date et heure de la création
created_by : l'id de l'utilisateur qui l'a créé
created_by_alias : un alias pour l'utilisateur qui a créé l'élément (si l'utilisateur ne veut pas afficher le nom venant de son compte d'utilisateur sur le site)
publish_up : la date à partir duquel l'élément sera publié
publish_down : la date à partir duquel l'élément ne sera plus publié
state : status de l'élément (publié, dépublié, archiver...)
order : l'ordre des éléments
Même si cela peut ne pas paraître utile, les champs comme state, created et created_by sont presque dans tous les composants Joomla. Je vous conseille de les mettre dans vos composants même si vous ne voyez pas l'utilité. Il peut arriver plus tard le besoin de savoir qui avait ajouter tel ou tel élément et à quelle date.
Dans phpmyadmin ou un autre logiciel que vous utilisez pour interagir avec la base de données, exécuter le script suivant pour ajouter ces champs dans la table qui sauvegarde les guitaristes (NB: remplacez #_ par le préfixe des tables de votre site Joomla sinon on ferra face à une erreur, le préfixe est le groupe de caractères qui vient avant le premier _ ):
alter table #__djguitariste_items ADD alias VARCHAR(255) NOT NULL;
alter table #__djguitariste_items ADD metadesc VARCHAR(1024);
alter table #__djguitariste_items ADD metakey VARCHAR(1024);
alter table #__djguitariste_items ADD catid INTEGER(10) unsigned NOT NULL DEFAULT 0;
alter table #__djguitariste_items ADD created_by INTEGER(10) unsigned NOT NULL DEFAULT 0;
alter table #__djguitariste_items ADD created_by_alias VARCHAR(255) NOT NULL;
alter table #__djguitariste_items ADD created DATETIME NOT NULL DEFAULT '0000-00-00 00:00:00';
alter table #__djguitariste_items ADD publish_up DATETIME NOT NULL DEFAULT '0000-00-00 00:00:00';
alter table #__djguitariste_items ADD publish_down DATETIME NOT NULL DEFAULT '0000-00-00 00:00:00';
alter table #__djguitariste_items ADD state TINYINT(2) unsigned NOT NULL DEFAULT 0;
Le champ catid va servir pour sauvegarder la catégorie. Nous allons rajouter la gestion des catégories dans le prochain tutoriel.
2 Publier et dépublier vue liste
Dans views/guitaristes, nous allons ouvrir le fichier view.html.php et apporter la une petite modification à la méthode addToolbar(). Juste avant la ligne JToolbarHelper::deleteList(...), ajouter les deux lignes suivantes:
JToolbarHelper::publish('guitaristes.publish');
JToolbarHelper::unpublish('guitaristes.unpublish');
Enregistrez les modifications. Nous allons maintenant ouvrir le fichier default.php de la vue liste qui se trouve dans views/guitaristes/tmpl/. Dans le thead du tableau, juste après la fermeture de la première balise th, nous allons rajouter un autre th pour la colonne status:
<th width="1%" style="min-width:55px;" class="nowrap center">
<?php echo JText::_('JSTATUS'); ?>
</th>
Dans la section tbody, nous allons ajouter une balise td juste après la fermeture de la première balise td :
<td class="center">
<?php echo JHtml::_('jgrid.published', $item->state, $i, 'guitaristes.', true, 'cb', $item->publish_up, $item->publish_down); ?>
</td>
Enregistrez les modifications. Nous allons maintenant ouvrir le fichier de table (guitariste.php) qui se trouve dans le dossier tables pour ajouter une valeur à la propriété $_culumnAlias pour que Joomla soit au courant du nom de notre champ "state" qui est utilisé pour publier ou dépublier un élément. Donc nous allons ajouter la ligne en haut dans la classe DJGuitaristeTableGuitariste :
protected $_columnAlias = array('published' => 'state');
Notons que si nous avions nommé ce champ published au lieu de state, nous n'aurions pas besoin de rajouter la ligne précédente.
3 Modification du modèle
Vu que nous utilisons dans la vue liste des propriété state, publish_up et publish_down (dans le balise td que nous avons ajouté), nous devons modifier le modèle pour qu'il retourne ses valeurs sinon, nous ferons face des erreurs. Donc nous allons ouvrir le fichier de modèle /models/guitaristes.php et modifier la méthode getListQuery. Nous devons rajouter les champs désirés en paramètre à la méthode select. Voici le contenu du fichier avec la modification:
<?php
defined('_JEXEC') or die;
class DJGuitaristeModelGuitaristes extends JModelList
{
public function getListQuery()
{
$db = $this->getDbo();
$query = $db->getQuery(true);
$query->select('id,name,state,publish_up,publish_down');
$query->from('#__djguitariste_items');
return $query;
}
}
4 Ajout de l'option publier/dépublier dans le formulaire d'édition
Nous allons ouvrir notre formulaire guitariste.xml qui se trouve dans models/forms pour y ajouter l'élément state pour le status. Nous allons rajouter le code suivant en haut juste après l'ouverture du premier fieldset.
<field id="state" name="state" type="list"
label="JSTATUS"
description="JFIELD_PUBLISHED_DESC"
class="input span12 small"
size="1"
default="1"
>
<option value="1">JPUBLISHED</option>
<option value="0">JUNPUBLISHED</option>
<option value="2">JARCHIVED</option>
<option value="-2">JTRASHED</option>
</field>
Voici le contenu du fichier après modification:
<?xml version="1.0" encoding="utf-8"?>
<form>
<fieldset>
<field id="state" name="state" type="list"
label="JSTATUS"
description="JFIELD_PUBLISHED_DESC"
class="input span12 small"
size="1"
default="1"
>
<option value="1">JPUBLISHED</option>
<option value="0">JUNPUBLISHED</option>
<option value="2">JARCHIVED</option>
<option value="-2">JTRASHED</option>
</field>
<field name="id" type="text"
default="0" label="JGLOBAL_FIELD_ID_LABEL"
readonly="true" class="readonly"
description="JGLOBAL_FIELD_ID_DESC" />
<field name="name" type="text"
label="COM_DJGUITARISTE_FIELD_NAME_LABEL"
description="COM_DJGUITARISTE_FIELD_NAME_DESC"
required="true"
class="inputbox" />
<field name="picture" type="media"
directory="guitaristes" preview="true"
label="COM_DJGUITARISTE_FIELD_PICTURE_LABEL"
description="COM_DJGUITARISTE_FIELD_PICTURE_DESC" />
<field name="intro" type="editor"
label="COM_DJGUITARISTE_FIELD_INTRO_LABEL"
description="COM_DJGUITARISTE_FIELD_INTRO_DESC"
filter="safehtml" />
<field name="biography" type="editor"
label="COM_DJGUITARISTE_FIELD_BIOGRAPHY_LABEL"
description="COM_DJGUITARISTE_FIELD_BIOGRAPHY_DESC"
filter="safehtml" />
<field name="youtube_video" type="text"
label="COM_DJGUITARISTE_FIELD_YOUTUBE_VIDEO_LABEL"
description="COM_DJGUITARISTE_FIELD_YOUTUBE_VIDEO_DESC"
class="inputbox" />
<field name="website" type="url"
label="COM_DJGUITARISTE_FIELD_WEBSITE_LABEL"
description="COM_DJGUITARISTE_FIELD_WEBSITE_DESC"
class="inputbox" />
<field name="facebook" type="url"
label="COM_DJGUITARISTE_FIELD_FACEBOOK_LABEL"
description="COM_DJGUITARISTE_FIELD_FACEBOOK_DESC"
class="inputbox" />
</fieldset>
</form>
Nous allons maintenant modifier la vue d'édition pour afficher le nouveau champ que nous venons d'ajouter. Donc ouvrons le fichier edit.php qui se trouve dans views/guitariste/tmpl/. Dans ce fichier, nous allons rajouter un div à la fermeture du div qui a la classe span10 :
<!-- le sidebar pour publier et dépublier-->
<div class="span2">
<h4 class="title"><?php echo JText::_('JDETAILS'); ?></h4>
<hr />
<fieldset class="form-vertical">
<div class="control-group">
<div class="control-label">
<?php echo $this->form->getLabel('state'); ?>
</div>
<div class="controls">
<?php echo $this->form->getInput('state'); ?>
</div>
</div>
</fieldset>
</div>
Le contenu du fichier edit.php sera donc :
<?php
defined('_JEXEC') or die;
JHtml::_('behavior.tooltip');
JHtml::_('behavior.formvalidation');
?>
<script type="text/javascript">
Joomla.submitbutton = function(task)
{
if(task == 'guitariste.cancel' || document.formvalidator.isValid(document.id('djguitariste-guitariste-form'))){
Joomla.submitform(task, document.getElementById('djguitariste-guitariste-form'));
}else{
alert('<?php echo $this->escape(JText::_('JGLOBAL_VALIDATION_FORM_FAILED')); ?>')
}
}
</script>
<form action="<?php echo JRoute::_('index.php?option=com_djguitariste&layout=edit&id='.(int)$this->item->id); ?>"
method="post" name="adminForm" id="djguitariste-guitariste-form" class="form-validate">
<div class="row-fluid">
<div class="span10 form-horizontal">
<fieldset>
<ul class="nav nav-tabs">
<li class="active">
<a href="#details" data-toggle="tab">
<?php echo empty($this->item->id)? JText::_('COM_DJGUITARISTE_ADDING_NEW_GUITARISTE'): JText::sprintf('COM_DJGUITARISTE_EDIT_GUITARISTE', $this->item->id); ?>
</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="details">
<div class="control-group">
<div class="control-label">
<?php echo $this->form->getLabel('id'); ?>
</div>
<div class="controls">
<?php echo $this->form->getInput('id'); ?>
</div>
</div>
<div class="control-group">
<div class="control-label">
<?php echo $this->form->getLabel('name'); ?>
</div>
<div class="controls">
<?php echo $this->form->getInput('name'); ?>
</div>
</div>
<div class="control-group">
<div class="control-label">
<?php echo $this->form->getLabel('picture'); ?>
</div>
<div class="controls">
<?php echo $this->form->getInput('picture'); ?>
</div>
</div>
<div class="control-group">
<div class="control-label">
<?php echo $this->form->getLabel('intro'); ?>
</div>
<div class="controls">
<?php echo $this->form->getInput('intro'); ?>
</div>
</div>
<div class="control-group">
<div class="control-label">
<?php echo $this->form->getLabel('biography'); ?>
</div>
<div class="controls">
<?php echo $this->form->getInput('biography'); ?>
</div>
</div>
<div class="control-group">
<div class="control-label">
<?php echo $this->form->getLabel('youtube_video'); ?>
</div>
<div class="controls">
<?php echo $this->form->getInput('youtube_video'); ?>
</div>
</div>
<div class="control-group">
<div class="control-label">
<?php echo $this->form->getLabel('website'); ?>
</div>
<div class="controls">
<?php echo $this->form->getInput('website'); ?>
</div>
</div>
<div class="control-group">
<div class="control-label">
<?php echo $this->form->getLabel('facebook'); ?>
</div>
<div class="controls">
<?php echo $this->form->getInput('facebook'); ?>
</div>
</div>
</div>
<input type="hidden" name="task" value="" />
<?php echo JHtml::_('form.token'); ?>
</div>
</fieldset>
</div>
<!-- le sidebar pour publier et dépublier-->
<div class="span2">
<h4 class="title"><?php echo JText::_('JDETAILS'); ?></h4>
<hr />
<fieldset class="form-vertical">
<div class="control-group">
<div class="control-label">
<?php echo $this->form->getLabel('state'); ?>
</div>
<div class="controls">
<?php echo $this->form->getInput('state'); ?>
</div>
</div>
</fieldset>
</div>
</div>
</form>
5 Modification du modèle liste côté client
Pour finaliser cette modification, nous allons modifier le modèle de la vue liste sur le site pour ne retourner que les élément qui sont publiés. Donc nous sortons du dossier administrator. Depuis la racine du site Joomla, nous allons dans le dossier components/com_djguitariste/models/ pour ouvrir le fichier guitaristes.php. Dans la méthode getListQuery, nous allons rajouter un appel à la méthode where et vérifier la condition "state=1" pour ne sélectionner que les éléments publiés. Voici le contenu actuel du fichier :
<?php
defined('_JEXEC') or die;
class DJGuitaristeModelGuitaristes extends JModelList
{
public function getListQuery()
{
$db = $this->getDbo();
$query = $db->getQuery(true);
$query->select('id,name');
$query->from('#__djguitariste_items');
$query->where('state=1');
return $query;
}
}
Dans le prochain tutoriel, nous allons ajouter la gestion des catégories à notre composant. Cliquez ici pour lire la partie 10.