Création de la page d'affichage des messages ListPost

La page ListPost affiche les derniers messages sous forme de liste. S'il y a trop de messages, ils seront affichés dans différentes pages.

Avant que nous ne passions à l'implémentation, nous voudrions que notre page d'accueil pointe vers la page à venir ListPost, ceci dans le but d'afficher la liste des derniers messages dès qu'un utilisateur se connecte au site. Pour cela, nous allons modifier le fichier de configuration de l'application protected/application.xml de cette manière.

......

Nous alons maintenant créer le gabarit et le fichier de classe pour notre page ListPost : protected/pages/posts/ListPost.page et protected/pages/posts/ListPost.php.

Création du gabarit

Pour satisfaire les fonctionnalités de notre page ListPost, nous allons utiliser deux contrôles dans notre gabarit.

Ci-dessous le contenu du gabarit :

<%@ Title="Mon Blog" %> <com:TContent ID="Main"> <com:TRepeater ID="Repeater" ItemRenderer="Application.pages.posts.PostRenderer" AllowPaging="true" AllowCustomPaging="true" PageSize="5" /> <com:TPager ControlToPaginate="Repeater" OnPageIndexChanged="pageChanged" /> </com:TContent>

Dans la partie répétée TRepeater, nous indiquons que l'affichage du contenu est délégué à l'élément PostRenderer que nous allons créer après. Pour permettre à PRADO de trouver cette classe, nous fournissons l'espace de noms complet Application.pages.posts.PostRenderer, qui correspond au fichier protected/pages/posts/PostRenderer.php.

Nous définissons aussi quelques propriétés complémentaires du TRepeater pour activer la pagination. Et nous définissons la propriété ControlToPaginate du TPager afin qu'il sache quelle est la zone répetée à paginer.

Création du fichier de classe

En fonction du gabarit précédent, nous pouvons voir que notre fichier de classe doit implémenter un gestionnaire d'évènement pour pageChanged() (déclenché par OnPageIndexChanged du TPager). Nous devons aussi remplir les données qui apparaitront dans le TRepeater. Ci-dessous le source complet du fichier de classe :

class ListPost extends TPage { /** * Initialise le TRepeater. * Cette méthode est appelé par le framework lors de l'initialisation de la page * @param mixed param : paramètres de l'évènement */ public function onInit($param) { parent::onInit($param); if(!$this->IsPostBack) // la page est chargée pour la première fois ? { // récupère le nombre total de messages $this->Repeater->VirtualItemCount=PostRecord::finder()->count(); // rempli le TRepeater avec les données $this->populateData(); } } /** * Gestionnaire d'évènement pour OnPageIndexChanged du TPager. * Cette méthode est appelée lors du changement de page */ public function pageChanged($sender,$param) { // change l'index de la page courante par le nouvel index $this->Repeater->CurrentPageIndex=$param->NewPageIndex; // rempli de nouveau le TRepeater $this->populateData(); } /** * détermine quelle page doit être affichée et remplie * TRepeater avec les données lues */ protected function populateData() { $offset=$this->Repeater->CurrentPageIndex*$this->Repeater->PageSize; $limit=$this->Repeater->PageSize; if($offset+$limit>$this->Repeater->VirtualItemCount) $limit=$this->Repeater->VirtualItemCount-$offset; $this->Repeater->DataSource=$this->getPosts($offset,$limit); $this->Repeater->dataBind(); } /** * lis les données à partir de la base de données en utilisant les fonctionnalités offset et limit. */ protected function getPosts($offset, $limit) { // construit les critères de la requête $criteria=new TActiveRecordCriteria; $criteria->OrdersBy['create_time']='desc'; $criteria->Limit=$limit; $criteria->Offset=$offset; // lit les messages en fonction des critères précédents return PostRecord::finder()->withAuthor()->findAll($criteria); } }

Création du PostRenderer

Nous devons toujours créer la classe PostRenderer. Elle définit la manière dont sera affichée chaque ligne de notre TRepeater. Nous la créons en tant que gabarit de contrôle, ce qui nous permet d'utiliser notre système de gabarit. Le fichier de gabarit ainsi que notre fichier de classe seront sauvegardés respectivement sous PostRenderer.tpl et PostRenderer.php dans le dossier protected/pages/posts.

Création du gabarit pour PostRenderer

Le gabarit définit la présentation des différentes informations d'un message : titre, nom, heure, contenu. Nous lions le titre à la page ReadPost qui affiche le détail du message.

L'expression $this->Data fait référence aux données provenant du TRepeater. Dans notre cas, c'est un objet de type PostRecord. Remarquez comment nous accédons au nom de l'auteur du message par $this->Data->author->username.

<com:THyperLink Text="<%# $this->Data->title %>" NavigateUrl="<%# $this->Service->constructUrl('posts.ReadPost',array('id'=>$this->Data->post_id)) %>" />

Auteur: <com:TLiteral Text="<%# $this->Data->author->username %>" />
Heure: <com:TLiteral Text="<%# date('m/d/Y h:m:sa', $this->Data->create_time) %>" />

<com:TLiteral Text="<%# $this->Data->content %>" />

Création du fichier de classe pour PostRenderer

Notre classe est très simple, elle hérite de TRepeaterItemRenderer et ne contient aucun autre code.

class PostRenderer extends TRepeaterItemRenderer { }

Test

Pour tester la page ListPost, naviguons à l'URL http://hostname/blog/index.php (rappellez-vous, nous avons défini ListPost comme étant notre page d'accueil). Nous devrions obtenir le résultat suivant. vu que nous n'avons qu'un seul message pour le moment, le contrôle de pagination n'apparait pas. Plus tard, quand nous aurons fini la page NewPost, nous pourrons ajouter des messages et revenir ici pour tester notre contrôle de pagination.