Cet article fait partie du tutoriel "Développer un composant MVC pour Joomla 4.x". Il est destiné à être un tutoriel de programmation à suivre, donc si vous n'avez pas lu les parties précédentes du tutoriel, il est recommandé de le faire.

Maintenant que nous avons mis en place les parties "Contrôleur" et "Vue" du motif de conception Modèle-Vue-Contrôleur, dans cet article, nous ajouterons un modèle à notre composant Hello World. Le modèle stockera certaines données d'exemple que notre modèle de page (template) rendra. Pour créer un modèle, nous étendons l'un des modèles abstraits fournis par Joomla! Plusieurs de ces modèles existent et peuvent être trouvés dans l'espace de noms Joomla\CMS\MVC\Model :

 

1 Joomla\CMS\MVC\Model\AdminModel Malgré son nom, ce modèle n'est pas spécifique à la section du panneau d'administration de Joomla! En réalité, il est utilisé pour administrer les enregistrements d'un type particulier, permettant des opérations en lot telles que la mise à jour ou la suppression, etc.
2 Joomla\CMS\MVC\Model\BaseModel Le modèle de base à partir duquel héritent les autres modèles. Si vous n'avez besoin d'aucune fonctionnalité supplémentaire, vous pouvez étendre ce modèle, mais vous ne le voulez probablement pas.
3 Joomla\CMS\MVC\Model\FormModel

Utilisé dans les formulaires, il permet de vérifier ou de décocher des lignes pour l'édition et propose des méthodes pour la validation des saisies de formulaire.

4 Joomla\CMS\MVC\Model\ItemModel Représente un seul enregistrement de base de données et permet des opérations de base sur la base de données.
5 Joomla\CMS\MVC\Model\ListModel Utilisé pour afficher des listes paginées d'enregistrements, avec filtrage facultatif.

 

Plus tard dans le tutoriel, nous soutiendrons ce modèle avec une requête de base de données, donc nous allons utiliser ItemModel comme base pour notre nouvelle classe de modèle. Allons-y et créons les nouveaux fichiers dont nous aurons besoin pour ajouter notre modèle.

1 Update: site/language/en-GB/en-GB.com_helloworld.ini Nous allons ajouter un nouveau message à extraire du système de langage pour vérifier que notre modèle fonctionne.
2 Create: site/src/Model/MessageModel.php Notre nouveau modèle, qui contiendra un message à afficher sur la page web publique.
3 Update: site/src/Controller/DisplayController.php Indiquez au contrôleur d'affichage par défaut de récupérer le nouveau modèle.
4 Update: site/tmpl/hello/default.php Ajoutez une sortie dans le modèle pour afficher le message du modèle.
5 Update: helloworld.xml Une simple augmentation de version pour notre nouveau code.

 

Détails du fichier

'site/language/en-GB/en-GB.com_helloworld.ini'

Nous allons (temporairement) mettre un nouveau message ici que nous pouvons utiliser pour présenter le modèle.

; Hello World Admin Strings
; Copyright (C) 2020 John Smith. All rights reserved.

COM_HELLOWORLD_MSG_HELLO_WORLD="Hello World!"
COM_HELLOWORLD_MSG_GREETING="This message is coming from the item model!"

 

'site/src/Model/MessageModel.php'

Le nouveau modèle de données pour un seul élément. La méthode getItem() est la seule requise lors de l'extension de ItemModel. Elle renvoie un objet qui représente l'élément du modèle. Cet "élément" pourrait être n'importe quoi, mais il s'agit généralement d'un enregistrement de base de données. Jusqu'à ce que nous connectons ce modèle à la base de données dans une partie future du tutoriel, nous renverrons un objet de base avec notre nouveau message, directement depuis le système de langage.

<?php

namespace JohnSmith\Component\HelloWorld\Site\Model;

defined('_JEXEC') or die;

use Joomla\CMS\MVC\Model\ItemModel;
use Joomla\CMS\Language\Text;

/**
 * @package     Joomla.Site
 * @subpackage  com_helloworld
 *
 * @copyright   Copyright (C) 2020 John Smith. All rights reserved.
 * @license     GNU General Public License version 3; see LICENSE
 */

/**
 * Hello World Message Model
 * @since 0.0.5
 */
class MessageModel extends ItemModel {

    /**
     * Returns a message for display
     * @param integer $pk Primary key of the "message item", currently unused
     * @return object Message object
     */
    public function getItem($pk= null): object {
        $item = new \stdClass();
        $item->message = Text::_('COM_HELLOWORLD_MSG_GREETING');
        return $item;
    }
        
}

 

'site/src/Controller/DisplayController.php'

Nous allons indiquer au DisplayController d'ajouter notre nouveau modèle à la vue lors de son chargement. Comme nous n'avons actuellement qu'une seule vue, cela suffira pour le moment. À mesure que notre composant deviendra plus complexe, nos vues auront leurs propres contrôleurs et pourront charger leurs propres modèles de manière indépendante.

<?php

namespace JohnSmith\Component\HelloWorld\Site\Controller;

defined('_JEXEC') or die;

use Joomla\CMS\MVC\Controller\BaseController;
use Joomla\CMS\Factory;

/**
 * @package     Joomla.Site
 * @subpackage  com_helloworld
 *
 * @copyright   Copyright (C) 2020 John Smith. All rights reserved.
 * @license     GNU General Public License version 3; see LICENSE
 */

/**
 * HelloWorld Component Controller
 * @since  0.0.2
 */
class DisplayController extends BaseController {
    
    public function display($cachable = false, $urlparams = array()) {        
        $document = Factory::getDocument();
        $viewName = $this->input->getCmd('view', 'login');
        $viewFormat = $document->getType();
        
        $view = $this->getView($viewName, $viewFormat);
        $view->setModel($this->getModel('Message'), true);
        
        $view->document = $document;
        $view->display();
    }
    
}

 

'site/tmpl/hello/default.php'

La dernière modification fonctionnelle à apporter est d'ajouter la sortie du message dans notre modèle de site. Dans le contexte d'un modèle de composant, la variable $this fait référence à l'objet de vue. Vous vous souvenez d'avoir défini le modèle sur la vue dans le fichier précédent ? Nous le récupérons ici et affichons le message.

<?php

use Joomla\CMS\Language\Text;

/**
 * @package     Joomla.Administrator
 * @subpackage  com_helloworld
 *
 * @copyright   Copyright (C) 2020 John Smith. All rights reserved.
 * @license     GNU General Public License version 3; see LICENSE
 */

 // No direct access to this file
defined('_JEXEC') or die('Restricted Access');
?>
<h2><?= Text::_('COM_HELLOWORLD_MSG_HELLO_WORLD') ?></h2>

<p><?= $this->getModel()->getItem()->message; ?></p>
 

'helloworld.xml'

Il n'est techniquement pas nécessaire d'apporter de nouvelles modifications dans le fichier manifeste pour ces changements. Cependant, pour des raisons de cohérence, nous allons augmenter la version du composant dans le fichier manifeste.

<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="4.0" method="upgrade">

    <name>Hello World</name>
    <!-- The following elements are optional and free of formatting constraints -->
    <creationDate>December 2020</creationDate>
    <!-- Dummy author, feel free to replace anywhere you see it-->
    <author>John Smith</author>
    <authorUrl>https://smith.ca</authorUrl>
    <copyright>John Smith</copyright>
    <license>GPL v3</license>
    <!--  The version string is recorded in the components table -->
    <version>0.0.5</version>
    <!-- The description is optional and defaults to the name -->
    <description>
        A hello world component!
    </description>

    <!-- This is the PHP namespace under which the extension's
    code is organised. It should follow this format:
    
    Vendor\Component\ComponentName

    "Vendor" can be your company or your own name
    
    The "ComponentName" section MUST match the name used 
    everywhere else for your component. Whatever the name of 
    this XML file is, the namespace must match (ignoring CamelCase). 
    -->
    <namespace path="src/">JohnSmith\Component\HelloWorld</namespace>

    <files folder="site/">
        <folder>language</folder>
        <folder>src</folder>
        <folder>tmpl</folder>
    </files>

    <languages>
        <language tag="en-GB">site/language/en-GB/en-GB.com_helloworld.ini</language>
    </languages>

    <administration>
        <!-- The link that will appear in the Admin panel's "Components" menu -->
        <menu link="index.php?option=com_helloworld">Hello World</menu>
        <!-- List of files and folders to copy, and where to copy them -->
        <files folder="admin/">
            <folder>language</folder>
            <folder>services</folder>
            <folder>src</folder>
            <folder>tmpl</folder>
        </files>

        <languages>
            <language tag="en-GB">admin/language/en-GB/en-GB.com_helloworld.ini</language>
            <language tag="en-GB">admin/language/en-GB/en-GB.com_helloworld.sys.ini</language>
        </languages>
    </administration>

</extension>

Test du composant

Tout comme précédemment, compressez votre nouvelle version du composant et téléchargez-la dans le panneau d'administration de votre installation Joomla!. Une fois cela fait, accédez à la partie frontale de votre site Joomla. Cliquez sur le lien "Hello World" que nous avons créé dans le menu. Vous devriez voir le nouveau message dans le modèle de la page.

Ensuite, nous allons apprendre comment ajouter des paramètres aux éléments de menu et comment les lire dans le code. Après cela, nous commencerons à connecter notre composant à la base de données.