Manuales Joomla

Sistema de comentarios - Tutorial 5, Módulo de comentarios

(Lo puedes leer en: 15 - 30 minutos)

por .

Con nuestro componente funcionando al 100% en su aspecto más básico, pasamos para el desarrollo de una nueva rama de nuestro sistema de comentarios, el módulo de los últimos comentarios insertados y publicados en el sitio web. ¡Manos a la obra!

Puede resultar extraño pasar a desarrollar un módulo, cuando el componente aún le faltan algunas cosas. Pero lo hacemos de esta manera para seguir lo que hasta ahora hemos ido consiguiendo, lograr un aspecto básico de nuestro sistema de comentarios. Una vez conseguido completamente el aspecto más básico de nuestro sistema, pues sería el momento entonces de llevarlo a otros niveles, agregando aspectos faltantes y adicionales. Creemos que este modelo de desarrollo nos permite ser más explícitos en los aspectos que explicamos, y logramos un mejor entendimiento por parte de ustedes.

Estructura del módulo

Entonces, el módulo “mod_mjcomments”. La conformación de la estructura del módulo es bien similar a las anteriores extensiones que hemos creado. En la imagen de abajo la pueden ver, en conjunto con la definición del archivo manifiesto del módulo:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <extension type="module" version="3.1" client="site" method="upgrade">
  3. <name>mod_mjcomments</name>
  4. <author>Carlos Rodriguez</author>
  5. <creationDate>December 2015</creationDate>
  6. <copyright>Copyright (C) 2016 Carlos Rodriguez. All rights reserved.</copyright>
  7. <license>License http://www.gnu.org/licenses/gpl-3.0.html GNU/GPL</license>
  8. <authorEmail>Esta dirección de correo electrónico está siendo protegida contra los robots de spam. Necesita tener JavaScript habilitado para poder verlo.</authorEmail>
  9. <authorUrl>manualesjoomla.es</authorUrl>
  10. <version>1.0.0</version>
  11. <description>MOD_MJCOMMENTS_XML_DESCRIPTION</description>
  12.  
  13. <files>
  14. <folder>language</folder>
  15. <folder>module</folder>
  16. <folder>layouts</folder>
  17. <filename module="mod_mjcomments">mod_mjcomments.php</filename>
  18. <filename>mod_mjcomments.xml</filename>
  19. </files>
  20.  
  21. <media folder="media" destination="pkg_mjcommentsystem">
  22. <folder>mod_mjcomments</folder>
  23. </media>
  24. </extension>
Source code

Manifiesto del módulo

El manifiesto ya es bien familiar para nosotros. Aquí solo resaltaremos la carpeta “module” que hemos creado en los archivos del módulo. Si recuerdan, el desarrollo de la lógica del plugin lo realizamos en el mismo archivo de entrada del mismo. Pero ahora, usaremos otra variante. Crearemos un archivo llamado “comments.php” dentro de la carpeta “module” el cual nos va a servir de modelo para el módulo. Es decir, toda la lógica del módulo será llevada a cabo dentro de ese archivo, logrando crear dentro del módulo un ambiente MVC.

MVC en el módulo

Empecemos por el modelo. El módulo nos va a renderizar los últimos comentarios insertados en el sitio, por lo que nuestro modelo debe proveer esta lista de comentarios. Mostraremos de cada elemento de la lista, el nombre del usuario que realizó el comentario, un fragmento (definido en caracteres a través de un parámetro del módulo) del texto de su comentario y un enlace con el nombre del artículo comentado. Según esto, el esqueleto del modelo nos quedaría de la siguiente forma:

  1. span style="color: #808080; font-style: italic;">/**
  2.  * @package MJ.Module
  3.  * @subpackage Comments
  4.  *
  5.  * @copyright Copyright (C) 2015 Carlos Rodriguez. All rights reserved.
  6.  * @license License http://www.gnu.org/licenses/gpl-3.0.html GNU/GPL
  7.  */'_JEXEC'// Proxy to the component site path
  8. '/components/com_mjcomments/''/components/com_content/';
  9.  
  10. // Add the Mjcomments site models
  11. '/models', 'MjcommentsModel');
  12.  
  13. // Add the com_content route helpers
  14. 'helpers/route.php';
  15.  
  16.  
  17. /**
  18.  * Mj comments model class
  19.  *
  20.  *//**
  21.   * Get the base module layout data
  22.   *
  23.   * @return array
  24.   *//**
  25.   * Get a list of comments from the formlist model
  26.   *
  27.   * @return mixed
  28.   *//**
  29.   * Render the module
  30.   *
  31.   * @param array $layoutData Array containing the data to use in the layout
  32.   * @return string
  33.   */
Source code

Modelo del módulo
Modelo del módulo

Como bien hemos hablado durante todo este ciclo, estamos centralizando todo, por lo que nuestro módulo no es la excepción. Al igual que en el plugin, hemos añadido el modelo responsable de la obtención de una lista de comentarios (línea 17).

Luego, en la línea 20 incorporamos el archivo helper del componente “com_content”, que es el que nos aporta la función “getArticleRoute” para generar el enlace a un determinado artículo.

Ya a partir de la línea 27 empieza la clase perteneciente al modelo del módulo. Hemos escogido como nombre de clase “MjModuleComments”, porque vamos a registrar el prefijo “Mj” usando “JLoader::registerPrefix” (libraries\loader.php) logrando de esta forma poder utilizar este modelo en donde queramos dentro del módulo. Ya verán más adelante cuando definamos el punto de entrada del módulo.

Luego pusimos nuestra clase, a heredar de la clase padre “EpaleModule”, pero, ¿existe esta clase dentro del core de Joomla?. No, esta clase no existe, ya que pertenece a la siguiente extensión que vamos a crear, una librería. Por lo que toca poner pausa al módulo y desviarnos un momento, e implementar esta librería rápidamente.

¿Porque crear ahora una librería? Como sabemos, el modelo del módulo lo usaremos para la obtención de los datos a mostrar por la vista. Pero, imaginemos que más adelante vamos a crear 5 módulos más, donde en cada uno de ellos van a existir funciones y procedimientos que se repiten una y otra vez. Ejemplo, obtener los archivos css y javascript del módulo. Tranquilos, que verán que es bien sencillo todo.

Creación de la librería “Epale”. Complemento para los módulos.

La estructura de la librería es bien fácil:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <extension type="library" method="upgrade" version="3.1">
  3. <name>Epale - Library</name>
  4. <libraryname>epale</libraryname>
  5. <creationDate>January 2015</creationDate>
  6. <author>Carlos Rodriguez</author>
  7. <authorEmail>Esta dirección de correo electrónico está siendo protegida contra los robots de spam. Necesita tener JavaScript habilitado para poder verlo.</authorEmail>
  8. <authorUrl>manualesjoomla.es</authorUrl>
  9. <copyright>Copyright (C) 2016 Carlos Rodriguez - All rights reserved.</copyright>
  10. <license>License http://www.gnu.org/licenses/gpl-3.0.html GNU/GPL</license>
  11. <version>1.0.0</version>
  12. <description>Epale common libraries</description>
  13. <files>
  14. <folder>module</folder>
  15. <filename>epale.xml</filename>
  16. <filename>library.php</filename>
  17. </files>
  18. </extension>
Source code

Manifiesto de la librería

Como pueden ver, el manifiesto es bien similar a cualquier otro. Ahora editaremos el punto de entrada de la librería, el archivo “library.php”:

  1. span style="color: #808080; font-style: italic;">/**
  2.  * @package Epale
  3.  * @subpackage Library
  4.  *
  5.  * @copyright Copyright (C) 2016 Carlos Rodriguez - All rights reserved.
  6.  * @license License http://www.gnu.org/licenses/gpl-3.0.html GNU/GPL
  7.  */'_JEXEC''EPALE_LIB_PATH'// Global libraries autoloader
  8. JLoader::registerPrefix('Epale'
Source code

Punto de entrada de la librería

Ya ven, nada del otro mundo, tan solo hemos registrado el espacio de nombre “Epale” para poder utilizar sus clases en cualquier extensión, así como lo hemos utilizado en el módulo de comentarios con la clase padre “EpaleModule”.

Teniendo ya la librería registrada, ahora desarrollemos los procedimientos comunes para cualquier módulo, que es al final, lo que queremos lograr con nuestra librería. Para ello colocamos un archivo llamado “module.php” dentro de la carpeta “src/module” de la librería, conteniendo lo siguiente:

  1. span style="color: #808080; font-style: italic;">/**
  2.  * @package Epale
  3.  * @subpackage Library
  4.  *
  5.  * @copyright Copyright (C) 2016 Carlos Rodriguez - All rights reserved.
  6.  * @license License http://www.gnu.org/licenses/gpl-3.0.html GNU/GPL
  7.  */'_JEXEC'/**
  8.  * Modules base class
  9.  *
  10.  * @since 1.0
  11.  *//**
  12.   * Latest error
  13.   *
  14.   * @var string
  15.   */
  16. protected $error;
  17.  
  18. /**
  19.   * Name of the module folder
  20.   *
  21.   * @var string
  22.   */
  23. protected $folderName;
  24.  
  25. /**
  26.   * Layout to render
  27.   *
  28.   * @var string
  29.   */
  30. protected $layout;
  31.  
  32. /**
  33.   * Module parameters
  34.   *
  35.   * @var JRegistry
  36.   */
  37. protected $params;
  38.  
  39. /**
  40.   * Constructor
  41.   *
  42.   * @param mixed $params array or JRegistry with the module parameters
  43.   *//**
  44.   * Get the base module layout data
  45.   *
  46.   * @return array
  47.   */'params' => $this->getParams(),
  48. 'moduleInstance' => $this,
  49. 'cssClass'/**
  50.   * Get the module main CSS class
  51.   *
  52.   * @return string
  53.   */'_', '-', $this->getFolderName());
  54. }
  55.  
  56. /**
  57.   * Get the latest error
  58.   *
  59.   * @return string
  60.   *//**
  61.   * Get current instance name
  62.   *
  63.   * Example: in class "MjModuleSample" it will return "sample"
  64.   *
  65.   * @return string
  66.   */'Module''Module', ''/**
  67.   * Get the module folder name
  68.   *
  69.   * @return string
  70.   */'mod_'/**
  71.   * Get the active layout
  72.   *
  73.   * @return string
  74.   */'layout', '_:default'/**
  75.   * Get the layout name. This cleans layouts from the modulelayout field
  76.   *
  77.   * @return string
  78.   */':'/**
  79.   * Return the folder of the active layout
  80.   *
  81.   * @return string
  82.   *//**
  83.   * Get the module parameters
  84.   *
  85.   * @return JRegistry
  86.   *//**
  87.   * Get the module prefix. Example: MjModuleSample will return Mj
  88.   *
  89.   * @return string
  90.   */'Module'/**
  91.   * Fast proxy to load overridable JS files from the module folder
  92.   *
  93.   * @param string $fileName JS file to load. Example: script.js
  94.   *
  95.   * @return void
  96.   */'''/' . $this->getFolderName();
  97. JHtml::script($path . '/'/**
  98.   * Fast proxy to load overridable CSS files from the module folder
  99.   *
  100.   * @param string $fileName CSS file to load. Example: style.css
  101.   *
  102.   * @return void
  103.   */'''/' . $this->getFolderName();
  104. JHtml::stylesheet($path . '/'/**
  105.   * Render the module
  106.   *
  107.   * @param array $layoutData Array containing the data to use in the layout
  108.   *
  109.   * @return string
  110.   */'debug' => $params->get('debug'/**
  111.   * Set the error message
  112.   *
  113.   * @param string $message The error message
  114.   *
  115.   * @return MjModule Self instance for chaining
  116.   *//**
  117.   * Set the active layout
  118.   *
  119.   * @param string $layout Layout name. Example: default
  120.   *
  121.   * @return MjModule Self instance for chaining
  122.   *//**
  123.   * Set the module parameters
  124.   *
  125.   * @param mixed $params array or JRegistry witht the module parameters
  126.   *
  127.   * @return MjModule Self instance for chaining
  128.   */
Source code

Son bastantes líneas, pero son bien sencillas todas. La mayoría de las funciones son internas de la clase. Ya iremos viendo algunas, cuando sigamos con la programación del módulo. Agradecer aquí a Roberto Segura por brindar, a excepción de algunas modificaciones que hemos hecho, todas estas líneas de código en una de las emisiones de “Joomgouts”.

Hemos terminado nuestra librería, por lo que añade otra extensión más a la cuenta.

Ahora que hemos vuelto del pequeño desvío que hemos tomado, debemos retomar la programación del módulo. Nos habíamos quedado en la definición del modelo del módulo, pero antes de seguir con ella, ¿no quisieran probar que todo va saliendo bien? ¿que la librería se interconecta bien con nuestro módulo? Para los que tengan deseo, lo primero que debemos hacer es editar el manifiesto del paquete (pkg_mjcommentsystem.xml) para incluir las dos nuevas extensiones que hemos creado:

  1. span style="color: #ff0000;">"library" id="lib_epale""module" id="mod_mjcomments" client="site"
Source code

Actualización del manifiesto del paquete

Luego, editamos el punto de entrada del módulo, archivo “mod_mjcomments.php” y ponemos lo siguiente:

  1. span style="color: #808080; font-style: italic;">/**
  2.  * @package MJ.Module
  3.  * @subpackage Comments
  4.  *
  5.  * @copyright Copyright (C) 2015 Carlos Rodriguez. All rights reserved.
  6.  * @license License http://www.gnu.org/licenses/gpl-3.0.html GNU/GPL
  7.  */'_JEXEC''epale.library');
  8.  
  9. // Register our own prefix
  10. JLoader::registerPrefix('Mj'
Source code

Controlador del módulo

En la línea 12, importamos nuestra librería con “JLoader::import”. La diferencia entre “import” y “registerPrefix” es que, “import” incluirá todo el archivo especificado en nuestro script, haciendo algunas convenciones de nombres específicos en joomla, mientras que “registerPrefix” nos permite incluir sólo las clases necesarias de los archivos del paquete especificado, ejemplo, en la línea 15 le decimos que nos incluya las clases con el prefijo “Mj”

Listo. Ahora actualizamos el paquete y vamos al gestor de módulo, y publicamos el nuevo módulo en alguna posición del sitio. Cuando accedemos a la parte pública del sitio veremos algo como esto:

Prueba de interconexión entre el módulo y la librería

Todo está funcionando de maravilla. Ahora podemos seguir con nuestro módulo tranquilamente, ya que sabemos que todo está muy bien interconectado.

Retomando el camino que llevábamos, antes de desviarnos para crear la librería, estábamos programando el modelo del módulo, el archivo “comments.php” de la carpeta “module”. El modelo ya tiene el esqueleto armado, con tres funciones “getBaseLayoutData”, “getList” y “render”. La primera y la tercera función, son funciones heredadas de la clase padre “EpaleModule” (definida en la librería “Epale” que acabamos de crear). Empecemos por la primera, “getBaseLayoutData” la cual nos brinda, como bien indica el nombre, los datos básicos que podemos usar en los layout o vistas de nuestro módulo.

Primero vamos a librería, y veamos que hace la función “getBaseLayoutData”. Esta función nos crea un array con tres elementos. El primero, son los parámetros del módulo, el cual los obtenemos con la función “getParams”. Así que este elemento tendrá aquellos parámetros que definamos en el manifiesto del módulo, más, los parámetros que incluye Joomla predeterminadamente. El segundo elemento del array, es la instancia de la clase, para poder acceder a sus funciones y variables que definamos o que ya estén definidas en la librería. El tercer elemento del array, es una cadena con el nombre del módulo en sí, la cual la usaremos como clase CSS del módulo. De esta forma, podemos definir estilos particulares para cada tipo de módulo.

Sabiendo esto, desarrollemos ahora la función “getBaseLayoutData” en la clase del modelo del módulo. Editando el archivo “comments.php” quedaría de la siguiente forma:

  1. /**
  2.  * Get the base module layout data
  3.  *
  4.  * @return array
  5.  */'items''params'
Source code

Modelo del módulo

Primero, obtenemos el array con los elementos base para nuestro layout. Luego, en la línea 37, agregamos un elemento más, para almacenar el objetivo principal de este módulo, los últimos comentarios. Estos comentarios los obtendremos con la función “getList”, propia de la clase del modelo. Editemos entonces, la función principal de esta clase:

  1. /**
  2.  * Get a list of comments from the formlist model
  3.  *
  4.  * @return mixed
  5.  */// Get an instance of the formlist model
  6. 'Formlist', 'MjcommentsModel''ignore_request'// Set the filters based on the module params
  7. 'list.start', (int) $params->get('exclude_comments''list.limit', (int) $params->get('count''filter.published', 1);
  8.  
  9. // Retrieve Comments
Source code

Modelo del módulo

¿Qué les parece? ¿Muy simple? Es verdad que nuestro sistema aún es muy básico, pero no quita el hecho de que nos va quedando bien sencillo y escalable todo.

La línea 50 de esta función “getList” ya es bien conocida por ustedes cuando trabajamos con el plugin. En este caso, obtenemos el modelo del componente de comentarios con el que vamos a trabajar en el módulo.

Línea 53, 54 y 55. Recuerden que Joomla aplica un sistema de filtros, los cuales hemos ido usando en cada modelo. Primero (línea 53 y 54) establecemos la cantidad de comentarios a extraer. Si se fijan, utilizamos dos parámetros, “exclude_comments” y “count”, para establecer los límites. Es decir, el límite desde donde empieza hasta donde acaba. De esta forma, le podemos decir al modelo que nos devuelva, por ejemplo, los últimos 10 comentarios insertados en el sistema, pero, que de esos 10 comentarios, nadamas queremos los que están del 5 al 10.

Ambos parámetros, pertenecen al módulo que estamos desarrollando, por lo que tenemos que definirlos porque aún no los hemos creado en el manifiesto del mismo. Pero terminemos de explicar primero esta función.

En la línea 55, establecemos el filtro de publicación, para solo obtener aquellos comentarios que están publicados. Este filtro no lo tratamos dentro del modelo que estamos utilizando, por lo que tenemos otra tarea a llevar a cabo.

Por último, en la línea 58 obtenemos los últimos comentarios insertados en el sistema, aplicando los filtros que hemos establecidos, así de simple. Noten, que en el modelo del componente “Formlist” usamos la función “getCommentsArticle” para obtener la lista de comentarios de un artículo en particular. Pero en el caso del módulo, hemos llamado directamente a la función “getItems” para que nos devuelva los comentarios de cualquier artículo.

Antes de seguir, realicemos las tareas que han surgido. Primero, vamos al manifiesto del módulo para crear los parámetros que hemos utilizado anteriormente.

  1. <config>
  2. <fields name="params">
  3. <fieldset name="basic">
  4. <field
  5. name="layout"
  6. type="modulelayout"
  7. default="_:latest"
  8. label="MOD_MJCOMMENTS_COMMENTS_PARAMS_LAYOUT"
  9. description="MOD_MJCOMMENTS_COMMENTS_PARAMS_LAYOUT_DESC"
  10. />
  11.  
  12. <field type="spacer" name="spacerbasic" hr="true" />
  13.  
  14. <field
  15. name="exclude_comments"
  16. type="text"
  17. default="0"
  18. filter="integer"
  19. label="MOD_MJCOMMENTS_COMMENTS_PARAMS_EXCLUDE_COMMENTS"
  20. description="MOD_MJCOMMENTS_COMMENTS_PARAMS_EXCLUDE_COMMENTS_DESC"
  21. />
  22.  
  23. <field
  24. name="count"
  25. type="text"
  26. default="5"
  27. filter="integer"
  28. label="MOD_MJCOMMENTS_COMMENTS_PARAMS_COUNT"
  29. description="MOD_MJCOMMENTS_COMMENTS_PARAMS_COUNT_DESC"
  30. />
  31. </fieldset>
  32. </fields>
  33. </config>
Source code

Manifiesto del módulo
Manifiesto del módulo

Listo, dos campos de tipo “text” con un filtrado de “integer” conforman los dos parámetros. Hemos añadido un tercer parámetro llamado “layout”, para que el usuario desde la administración, establezca el layout que va a utilizar con el módulo. De esta forma, podemos crear diversas estructuras y diseños para el módulo. Este parámetro va a buscar dentro de la carpeta layouts del módulo, los layout existentes. Aún no hemos creado ninguno, por lo que el campo saldrá en blanco.

Por último, recuerden colocar las cadenas de texto traducibles que hemos creado dentro del archivo de idioma del módulo.

  1. ; mod_mjcomments
  2. ; Copyright (C) 2015 Carlos Rodríguez. All rights reserved.
  3. ; License http://www.gnu.org/licenses/gpl-3.0.html GNU/GPL, see LICENSE
  4.  
  5. ; System
  6. MOD_MJCOMMENTS="MJ - Últimos comentarios"
  7. MOD_MJCOMMENTS_XML_DESCRIPTION="Lista de los últimos comentarios publicados."
  8.  
  9. ; Params
  10. MOD_MJCOMMENTS_COMMENTS_PARAMS_COUNT="Cantidad de comentarios"
  11. MOD_MJCOMMENTS_COMMENTS_PARAMS_COUNT_DESC="Cantidad de comentarios a mostrar dentro del módulo."
  12. MOD_MJCOMMENTS_COMMENTS_PARAMS_EXCLUDE_COMMENTS="Excluir comentarios"
  13. MOD_MJCOMMENTS_COMMENTS_PARAMS_EXCLUDE_COMMENTS_DESC="Cantidad de comentarios a excluir de la consulta. Tenga presente que el valor tiene que ser estrictamente menor que el valor de la opción \"Cantidad de comentarios\""
  14. MOD_MJCOMMENTS_COMMENTS_PARAMS_LAYOUT="Plantilla"
  15. MOD_MJCOMMENTS_COMMENTS_PARAMS_LAYOUT_DESC="Selecciona la plantilla que quieres usar en el módulo."
Source code

Archivo de idioma

Primera tarea pendiente resuelta. La próxima es establecer el filtro de publicación en el modelo del componente, ya que nos hace falta para el módulo. Así que editemos el archivo “formlist.php”:

  1. span style="color: #ff0000;">'filter.published', 1);
Source code

Actualización del modelo del componente de comentarios

[code start:105 lang:php]// Filter by published state $published = $this->getState('filter.published'); if (is_numeric($published)) { $query->where('a.state = ' . (int) $published); }[/code]

Actualización del modelo del componente

  1. $id .= ':''filter.published'));
Source code

Actualización del modelo del componente

Simples modificaciones, gran funcionalidad. Para concluir con el modelo del módulo, escribimos el cuerpo de la función “render”:

  1. /**
  2.  * Render the module
  3.  *
  4.  * @param array $layoutData Array containing the data to use in the layout
  5.  * @return string
  6.  */'comments']))
  7. {
  8. $this->setLayout('_error'
Source code

Modelo del módulo

Esta función es la encargada de renderizar todos los datos que hemos obtenido hasta este punto. En caso de que no se haya obtenido ningún comentario por algún error o algo, establecemos (línea 74) un layout diferente para mostrar un mensaje de error. La función encargada de esto es “setLayout” la cual pueden encontrar en la librería “Epale” que creamos.

Todo listo con los modelos, así que ya podemos pasar a las vistas porque ya hemos hablado bastante de layout y no hemos creado ninguno. Primero, creamos el layout “_error” dentro de la carpeta “layouts”:

  1. span style="color: #808080; font-style: italic;">/**
  2.  * @package MJ.Module
  3.  * @subpackage Comments
  4.  *
  5.  * @copyright Copyright (C) 2015 Carlos Rodriguez. All rights reserved.
  6.  * @license License http://www.gnu.org/licenses/gpl-3.0.html GNU/GPL
  7.  */'_JEXEC'/**
  8.  * Layout variables
  9.  * -----------------
  10.  * @var string $cssClass Module CSS class
  11.  * @var string $cssId Module CSS identifier
  12.  * @var object $module Module data as it comes from Joomla
  13.  * @var MjModule $moduleInstance Module rendering this layout
  14.  * @var JRegistry $params Object with the module config
  15.  */
  16.  
  17. $cssId = $cssId ? 'id="' . $cssId . '"'"<?php echo $cssClass; ?> alert alert-error"
Source code

Layout para los errores

Bien simple esta vista. ¿Probamos a ver si funciona? Para poder probar esto, necesitamos poner en forma al controlador del módulo, el archivo de entrada “mod_mjcomments.php”:

  1. span style="color: #808080; font-style: italic;">/**
  2.  * @package MJ.Module
  3.  * @subpackage Comments
  4.  *
  5.  * @copyright Copyright (C) 2015 Carlos Rodriguez. All rights reserved.
  6.  * @license License http://www.gnu.org/licenses/gpl-3.0.html GNU/GPL
  7.  */'_JEXEC''epale.library');
  8.  
  9. // Register our own prefix
  10. JLoader::registerPrefix('Mj'// Load language
  11. $lang = JFactory::getLanguage();
  12. $lang->load('mod_mjcomments'// Load instance
  13. // Create unique css class
  14. '-'// Render layout
  15. 'module' => $module,
  16. 'cssId' => $cssId
  17. )
  18. );
Source code

Controlador del módulo

Listo. Si actualizamos el paquete, y publicamos como es lógico, el módulo en alguna parte del sitio y borramos todos los comentarios que podamos tener en el gestor de comentarios para generar el error, nos damos cuenta que no surge efecto. El módulo sale en blanco cuando debería de salir un mensaje de error. ¿Cual es el problema?

Nuestro módulo no puede renderizar el layout, porque en verdad no lo encuentra. Si vamos a la librería de nosotros, dentro del API de los módulos, abrimos el archivo “module.php” y en la función “getLayoutFolder” encargada de obtener el directorio del layout a renderizar, vemos que utiliza la función “getLayoutPath” de la clase “JModuleHelper” para lograrlo. Al ir entonces a “libraries\cms\module\helper.php” en busca de esta función (línea 279), vemos que en la línea 295 el directorio en donde busca los layout es “tmpl”. Y como el nombre del directorio que nosotros creamos es “layouts” provoca que el módulo no encuentre los layout que hemos creado. Solución, cambiar “layouts” por “tmpl”. También deben actualizar el manifiesto del módulo para que Joomla reconozca el cambio.

Nota: Se pretende que a partir de la versión 3.5, ya los módulos soporten todo el sistema de layouts.

Probemos de nuevo y actualicemos el paquete.

Mensaje de error sin cadena

¡Perfecto! hemos renderizado el layout del error, aunque, no ha salido alguna información del error. Como el error que hemos provocado es el de que no existe ningún comentario realizado, agregamos un mensaje informando de lo ocurrido. Para ello actualizamos la función “render” del modelo del módulo, agregando un mensaje a través de la función de la librería “Epale”.

  1. span style="color: #ff0000;">'MOD_MJCOMMENTS_EMPTY_COMMENTS');
  2. $this->setError($message);
Source code

Modelo del módulo

Le asignamos un valor a la cadena de texto traducible y volvemos actualizar el paquete:

Mensaje de error con cadena

¡Ahora sí! Todo ha funcionado perfectamente.

Ahora solo queda el layout del listado, pero con la antesala que hemos tenido con el layout del error, todo es más sencillo.

Como bien establecimos en los parámetros del módulo, el nombre del siguinte layout es “latest”. Por lo que dentro de la carpeta “tmpl” creamos un archivo llamado “latest.php”:

  1. span style="color: #808080; font-style: italic;">/**
  2.  * @package MJ.Module
  3.  * @subpackage Comments
  4.  *
  5.  * @copyright Copyright (C) 2015 Carlos Rodriguez. All rights reserved.
  6.  * @license License http://www.gnu.org/licenses/gpl-3.0.html GNU/GPL
  7.  */'_JEXEC'/**
  8.  * Layout variables
  9.  * -----------------
  10.  * @var string $cssClass Module CSS class
  11.  * @var string $cssId Module CSS identifier
  12.  * @var object $module Module data as it comes from Joomla
  13.  * @var MjModule $moduleInstance Module rendering this layout
  14.  * @var JRegistry $params Object with the module config
  15.  */'script_mod_mjcomments.js''style_mod_mjcomments.css');
  16.  
  17. $cssId = $cssId ? 'id="' . $cssId . '"'"<?php echo $cssClass; ?> latest"'latest_basic'
Source code

Layout de la lista de los últimos comentarios

Aquí utilizamos los archivos “js” y “css” del módulo, por lo que utilizamos las funciones para cargar estos archivos definidas en la librería “Epale”. También tienen que crear ambos archivos dentro de la carpeta “media\mod_mjcomments\css y \js” del módulo.

Luego, en la línea 30, hemos establecido el layout que en sí, nos va a mostrar el listado de los últimos comentarios realizados en el sitio. Este layout no será visible en la administración del módulo, solo el nombre “latest” será visible. ¿Pero por qué establecer otro layout para el cuerpo del listado de comentarios? Por ejemplo, si creamos un layout avanzado para el listado de los últimos comentarios, solo sería poner una línea parecida a la 30, pero con un nombre como “latest_advanced”. Luego, definimos un parámetro dentro de la configuración del módulo para que el usuario decida que diseño prefiere, para visualizar los últimos comentarios. Ahora imaginen que esta opción solo sea para usuarios suscritos. Infinidades de ventajas trae este esquema.

Por último, creamos el archivo “latest_basic.php” que contendrá lo siguiente:

  1. span style="color: #808080; font-style: italic;">/**
  2.  * @package MJ.Module
  3.  * @subpackage Comments
  4.  *
  5.  * @copyright Copyright (C) 2015 Carlos Rodriguez. All rights reserved.
  6.  * @license License http://www.gnu.org/licenses/gpl-3.0.html GNU/GPL
  7.  */'_JEXEC'/**
  8.  * Layout variables
  9.  * -----------------
  10.  * @var string $cssClass Module CSS class
  11.  * @var string $cssId Module CSS identifier
  12.  * @var object $module Module data as it comes from Joomla
  13.  * @var MjModule $moduleInstance Module rendering this layout
  14.  * @var JRegistry $params Object with the module config
  15.  */"list-group""#""list-group-item""list-group-item-heading""list-group-item-text"
Source code

Layout de la lista de los últimos comentarios

Esta estructura recuerden que pertenece a bootstrap 3. Pero venga, probemos de una vez a ver que tal funciona. Primero, hagamos un par de comentarios en el sitio y luego actualicemos a ver que tal:

Administración del módulo

Frontend del módulo

¡Epale! Hombre ha salido super bien todo. Bien fácil los módulos ¿verdad?

Si se fijan en la estructura de la lista de comentarios, estamos asociando un enlace a cada uno de ellos ¿Porque? Como los comentarios son realizados en un artículo determinado, pues le ofreceremos al usuario la posibilidad de dar clic encima del comentario para ir al artículo relacionado. Pero esto lo haremos de forma separada. Traten de hacerlo ustedes, y luego comparamos soluciones en el próximo tutorial, donde incluiremos un pequeño apartado para esta pequeña tarea.

De seguro debe seguirte molestando el tema diseño. Pero no te preocupes, que en el próximo o en los próximos tutoriales nos centraremos en la programación de la plantilla de este ciclo, por lo que llegó la hora de poner bonito todo.

Como siempre, ya tienen disponible en Github el código fuente del paquete hasta este tutorial.  ¡Nos vemos!

Etiquetas: Desarrollo, Extensiones, Ciclo de desarrollo, Programación

Imprimir