Joomla! es, junto con WordPress, quizás el CMS más popular que existe. Lo que no mucha gente sabe, o tiene en cuenta, es que es además un completo Framework de desarrollo web. No en vano, nos proporciona muchas de las funcionalidades que esperamos de un Framework:
- Arquitectura basada en Modelo-Vista-Controlador.
- Seguridad, con un completo sistema de perfiles de acceso.
- Acceso a base de datos.
- Sistema de cachés.
- Gestión de errores.
- Administración de formularios.
- Sesiones.
- Plantillas.
- Utilidades para fechas, criptografía, XML, ficheros…
Con todo esto, podemos crear diferentes extensiones de Joomla!:
- Component. Son las extensiones más complejas. Se trata de aplicaciones completas que se ejecutan dentro del espacio de Joomla!. Tenemos muchas de serie, como por ejemplo el componente Content (/components/com_content/), que es el encargado de manejar los artículos, categorías y secciones.
- Module. Se trata de pequeñas piezas de contenido que se muestran en la página. A menudo, dependen de un componente, como es el caso del módulo “latest news” (/modules/mod_latestnews/). Otro ejemplo de módulos, son los menús. En los módulos, además, se debe especificar su posición dentro de la página.
- Plugins. Son bloques de código que se disparan ante determinados eventos. Antes de Joomla! 1.5 se los llamaba Mambots.
- Templates. Plantillas que modifican el aspecto visual de la aplicación web.
- Languages. Las extensiones de este tipo contienen ficheros que definen cadenas de texto traducidas para distintas partes de Joomla!.
A partir de Joomla 1.6, además, tendremos dos nuevos tipos de extensiones. Library, que se tratará de un bloque de código que contenta un conjunto de funciones relacionadas entre sí. Por ejemplo, para acceder a la API de Twitter. Y también se incluirá la extensión Packages.
Como vemos, la extensión más compleja y flexible son los components. Con ellos podremos crear, por ejemplo, una completa agenda de eventos o un sistema de ecommerce. Veamos cómo podemos crear un componente básico “Hola Mundo”. Vamos a utilizar la primera parte del ejemplo que viene en la documentación de Joomla!.
Modelo Vista Controlador
Lo primero es conocer el patrón Modelo-Vista-Controlador. Queda fuera del alcance de este artículo explicar en qué consiste, de modo que en resumen diremos que se trata de una arquitectura que permite dividir una aplicaciones en tres apartados:
- Controlador, que es el que gobierna el comportamiento principal, y el que responde las peticiones del usuario. En Joomla: JController.
- Vista. Se trata del código que se encarga de generar el contenido que se le devolverá al usuario. Generalmente en HTML. En Joomla: JView.
- Modelo. Es una abstracción de los datos que usa la aplicación. Si bien normalmente encapsulan bases de datos, también pueden utilizar otros origines de datos como un feed RSS. En Joomla: JModel.
Crear árbol de directorios
El primer paso consiste en crear el siguiente árbol de directorio y ficheros:
Además de los ficheros en blanco index.html (Para prevenir accesos a los directorios), vemos que tenemos 5 ficheros:
- /site/hello.php – Punto de entrara a nuestro componente
- /site/controller.php – Fichero que contiene nuestro controlador.
- /site/views/hello/view.html.php – Clase que extiende JView que se encarga de construir la vista
- /site/views/hello/tmpl/default.php – Plantilla
- /hello.xml – Fichero XML que indica a Joomla! cómo instalar el componente.
Crear el punto de entrada
Vamos a editar el fichero /site/hello.php y vamos a guardar en el lo siguiente:
/**
* @package Joomla.Tutorials
* @subpackage Components
* components/com_hello/hello.php
* @link http://docs.joomla.org/Developing_a_Model-View-Controller_Component_-_Part_2
* @license GNU/GPL
*/
// No direct access
defined( '_JEXEC' ) or die( 'Restricted access' );
// Require the base controller
require_once( JPATH_COMPONENT.DS.'controller.php' );
// Require specific controller if requested
if ($controller = JRequest::getWord('controller')) {
$path = JPATH_COMPONENT.DS.'controllers'.DS.$controller.'.php';
if (file_exists($path)) {
require_once $path;
} else {
$controller = '';
}
}
// Create the controller
$classname = 'HelloController'.$controller;
$controller = new $classname();
// Perform the Request task
$controller->execute( JRequest::getVar( 'task' ) );
// Redirect if set by the controller
$controller->redirect();
¿Qué es lo que hemos hecho? Veámoslo paso a paso:
- En primer lugar comprobamos que estamos ejecutando éste código dentro de Joomla mirando si está definido _JEXEC. En caso contrario, finalizamos la aplicación.
- Cargamos con require_once nuestro controlador.
- El siguiente bloque de código comprueba si se necesitan más controladores. Por ahora no es necesario, pero lo mantenemos ahí para un futuro.
- Después, creamos el controlador. En este caso, siempre se creará un controlador de la clase HelloController(), dado que en este ejemplo, como vimos en el paso anterior, no hay más.
- Posteriormente indicamos al controlador que lleve a cabo la tarea solicitada. Por defecto, si no hay ninguna, la tarea es ‘display’.
- Finalmente, pasamos el control al controlador, para que, si fuera necesario, lleve a cabo una redirección.
Creamos el controlador
Nuestro controlador sólo hace una cosa: Mostrar el mensaje Hello World, de modo que no se hace necesaria ninguna manipulación de datos. Guardamos el siguiente código en /site/controller.php
/**
* @package Joomla.Tutorials
* @subpackage Components
* @link http://docs.joomla.org/Developing_a_Model-View-Controller_Component_-_Part_1
* @license GNU/GPL
*/
// No direct access
defined( '_JEXEC' ) or die( 'Restricted access' );
jimport('joomla.application.component.controller');
/**
* Hello World Component Controller
*
* @package Joomla.Tutorials
* @subpackage Components
*/
class HelloController extends JController
{
/**
* Method to display the view
*
* @access public
*/
function display()
{
parent::display();
}
}
Como vemos, creamos una clase llamada HelloController que hereda a JController. Tan sólo define el método display(), pues es la tarea por defecto (Salvo que no se especifique otra). Este método tan sólo invoca al método JController::display(), que determina y carga la vista y plantilla a utilizar. En nuestro ejemplo, sólo tenemos una vista y una plantilla.
Crear la vista
La vista tan sólo carga datos y los guarda para usar en la plantilla. Para ello se usa el método assignRef(), donde el primer parámetro es el nombre de la variable en la plantilla, y el segundo la variable que se comparte.
Código de /site/views/hello/view.html.php:
/**
* @package Joomla.Tutorials
* @subpackage Components
* @link http://docs.joomla.org/Developing_a_Model-View-Controller_Component_-_Part_1
* @license GNU/GPL
*/
// no direct access
defined( '_JEXEC' ) or die( 'Restricted access' );
jimport( 'joomla.application.component.view');
/**
* HTML View class for the HelloWorld Component
*
* @package HelloWorld
*/
class HelloViewHello extends JView
{
function display($tpl = null)
{
$greeting = "Hello World!";
$this->assignRef( 'greeting', $greeting );
parent::display($tpl);
}
}
Y ahora definimos el código de la plantilla en /site/views/hello/tmpl/default.php:
<?php
// No direct access
defined('_JEXEC') or die('Restricted access'); ?>
<?php echo $this->greeting; ?>
Se trata de un fichero PHP convencional en el que tenemos accesibles todas las variables que hemos compartido desde la vista.
Juntándolo todo
Nos queda definir el fichero Manifiest que define el componente para poder instalarlo fácilmente (Sin tener que copiar los ficheros a mano y actualizar la base de datos nosotros). Contiene distinta información, como por ejemplo:
- Descripción del componente.
- Lista de ficheros que incluye.
- Un fichero opcional PHP que realizar tareas de instalación.
- Un fichero opcional SQL que se ejecuta al instalar o desinstalar
Hello
2007-02-22
John Doe
john.doe@example.org
http://www.example.org
Copyright Info
License Info
1.01
Description of the component ...
controller.php
hello.php
index.html
views/index.html
views/hello/index.html
views/hello/view.html.php
views/hello/tmpl/default.php
views/hello/tmpl/index.html
hello.php
index.html
Finalmente, guardamos en los ficheros index.html un contenido trivial, como por ejemplo:
<html><body bgcolor="#FFFFFF"></body></html>
Por último, comprimimos en un fichero ZIP el contenido de la carpeta com_hello, y ya podemos instalar nuestro componente desde el instalador de extensiones de Joomla.
Mostrando el componente
Ahora, para poder ver el resultado, debemos consultar el componente. Para ello, debemos acceder a la siguiente URL:
/index.php?option=com_hello&view=hello
Vemos que no se define ninguna tarea (Recordemos que por defecto se usa Display). En caso de querer ejecutar otra tarea, tendríamos que definir el parámetro GET task, por ejemplo para la tarea ‘save’:
/index.php?option=com_hello&view=hello&task=save
