LinuxParty

10- Añadir decoración a la Administración

Añadir algunos iconos

Con tu gestor de archivos favorito crea una imagen de 16x16 y otra de 48x48 en el directorio media/images y añade una etiqueta media en tu archivo de instalación. Modifica la etiqueta menú para que utilice el nuevo icono.

Modificar las vistas

Añade las siguientes líneas al archivo admin/views/helloworlds/view.html.php:

<?php
// No permitir acceso directo al archivo
defined('_JEXEC') or die('Restricted access');

// importar librería de vistas de Joomla
jimport('joomla.application.component.view');

/**
 * Vista HelloWorlds
*/
class HelloWorldViewHelloWorlds extends JView
{
        /**
         * Método de presentación de vistas HelloWorlds
         * @return void
*/
        function display($tpl = null) 
        {
                // Obtener datos del modelo
                $items = $this->get('Items');
                $pagination = $this->get('Pagination');

                // Comprobar errores.
                if (count($errors = $this->get('Errors'))) 
                {
                        JError::raiseError(500, implode('<br />', $errors));
                        return false;
                }
                // Asignar datos a la vista
                $this->items = $items;
                $this->pagination = $pagination;

                // Configurar la barra de herramientas
                $this->addToolBar();

                // Mostrar la plantilla
                parent::display($tpl);

                // Configurar el documento
                $this->setDocument();
        }

        /**
         * Configurar la barra de herramientas
*/
        protected function addToolBar() 
        {
                JToolBarHelper::title(JText::_('COM_HELLOWORLD_MANAGER_HELLOWORLDS'), 'helloworld');
                JToolBarHelper::deleteListX('', 'helloworlds.delete');
                JToolBarHelper::editListX('helloworld.edit');
                JToolBarHelper::addNewX('helloworld.add');
        }
        /**
         * Método para configurar las propiedades del documento
         *
         * @return void
*/
        protected function setDocument() 
        {
                $document = JFactory::getDocument();
                $document->setTitle(JText::_('COM_HELLOWORLD_ADMINISTRATION'));
        }
} 

 Esta vista utiliza un segundo parámetro para la función JToolBarHelper::title. Se utilizará para construir la clase css para el título. El método _setDocument define el título en el navegador. Añade las siguientes líneas en el archivo admin/views/helloworld/view.html.php :

<?php
// No permitir acceso directo al archivo
defined('_JEXEC') or die('Restricted access');

// importar librería de vistas de Joomla
jimport('joomla.application.component.view');

/**
 * Vista HelloWorld
*/
class HelloWorldViewHelloWorld extends JView
{
        /**
         * Ver formulario
         *
         * @varform
*/
        protected $form = null;

        /**
         * mostrar método de la vista HelloWorld
         * @return void
*/
        public function display($tpl = null) 
        {
                // obtener datos
                $form = $this->get('Form');
                $item = $this->get('Item');

                // Comprobar errores.
                if (count($errors = $this->get('Errors'))) 
                {
                        JError::raiseError(500, implode('<br />', $errors));
                        return false;
                }
                // Asignar datos
                $this->form = $form;
                $this->item = $item;

                // Configurar la barra de herramientas
                $this->addToolBar();

                // Mostrar la plantilla
                parent::display($tpl);

                // Configurar el documento
                $this->setDocument();
        }

        /**
         * Configurar la barra de herramientas
*/
        protected function addToolBar() 
        {               
                $input = JFactory::getApplication()->input;
                $input->set('hidemainmenu', true);
                $isNew = ($this->item->id == 0);
                JToolBarHelper::title($isNew ? JText::_('COM_HELLOWORLD_MANAGER_HELLOWORLD_NEW')
                                             : JText::_('COM_HELLOWORLD_MANAGER_HELLOWORLD_EDIT'), 'helloworld');
                JToolBarHelper::save('helloworld.save');
                JToolBarHelper::cancel('helloworld.cancel', $isNew ? 'JTOOLBAR_CANCEL' : 'JTOOLBAR_CLOSE');
        }
        /**
         * Método para configurar las propiedades del documento
         *
         * @return void
*/
        protected function setDocument() 
        {
                $isNew = ($this->item->id < 1);
                $document = JFactory::getDocument();
                $document->setTitle($isNew ? JText::_('COM_HELLOWORLD_HELLOWORLD_CREATING')
                                           : JText::_('COM_HELLOWORLD_HELLOWORLD_EDITING'));
        }
}

 Esta vista también utiliza el segundo parámetro de la función JToolBarHelper::title y define el título del navegador.

Modificar el archivo de entrada principal

En el archivo admin/helloworld.php, añade estas líneas para que utilice el icono de 48x48:

<?php
// No permitir acceso directo al archivo
defined('_JEXEC') or die('Restricted access');

// Configurar algunas propiedades globales
$document = JFactory::getDocument();
$document->addStyleDeclaration('.icon-48-helloworld {background-image: url(/../media/com_helloworld/images/tux-48x48.png);}');

// importar librería de controladores de Joomla
jimport('joomla.application.component.controller');

// Conseguir una instancia de controlador prefijado por HelloWorld
$controller = JController::getInstance('HelloWorld');

// Ejecutar la tarea de solicitud
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirigir si está configurado por el controlador
$controller->redirect();

Añadir algunas líneas en el archivo de idioma

 Modifica el admin/language/es-ES/es-ES.com_helloworld.ini y añade las siguientes líneas:

COM_HELLOWORLD_ADMINISTRATION="HelloWorld - Administración"
COM_HELLOWORLD_HELLOWORLD_CREATING="HelloWorld - Crear"
COM_HELLOWORLD_HELLOWORLD_DETAILS="Detalles"
COM_HELLOWORLD_HELLOWORLD_EDITING="HelloWorld - Editar"
COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_DESC="Este es el mensaje que se visualiza"
COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_LABEL="Mensaje"
COM_HELLOWORLD_HELLOWORLD_HEADING_GREETING="Bienvenida"
COM_HELLOWORLD_HELLOWORLD_HEADING_ID="Id"
COM_HELLOWORLD_MANAGER_HELLOWORLD_EDIT="HelloWorld manager: Editar mensaje"
COM_HELLOWORLD_MANAGER_HELLOWORLD_NEW="HelloWorld manager: Nuevo Mensaje"
COM_HELLOWORLD_MANAGER_HELLOWORLDS="Gestor HelloWorld"
COM_HELLOWORLD_N_ITEMS_DELETED_1="Un mensaje eliminado"
COM_HELLOWORLD_N_ITEMS_DELETED_MORE="%d mensajes eliminados"

Antes de empaquetar nuestro componente hagamos un recuento del contenido que debemos tener en nuestro directorio:

• helloworld.xml
• site/index.html
• site/helloworld.php
• site/controller.php
• site/views/index.html
• site/views/helloworld/index.html
• site/views/helloworld/view.html.php
• site/views/helloworld/tmpl/index.html
• site/views/helloworld/tmpl/default.xml
• site/views/helloworld/tmpl/default.php
• site/models/index.html
• site/models/helloworld.php
• site/language/index.html
• site/language/es-ES/index.html
• site/language/es-ES/es-ES.com_helloworld.ini
• admin/index.html
• admin/helloworld.php
• admin/controller.php
• admin/sql/index.html
• admin/sql/install.mysql.utf8.sql
• admin/sql/uninstall.mysql.utf8.sql
• admin/sql/updates/index.html
• admin/sql/updates/mysql/index.html
• admin/sql/updates/mysql/0.0.1.sql
• admin/sql/updates/mysql/0.0.6.sql
• admin/models/index.html
• admin/models/fields/index.html
• admin/models/fields/helloworld.php
• admin/models/forms/index.html
• admin/models/forms/helloworld.xml
• admin/models/helloworld.php
• admin/models/helloworlds.php
• admin/views/index.html
• admin/views/helloworlds/index.html
• admin/views/helloworlds/view.html.php
• admin/views/helloworlds/tmpl/index.html
• admin/views/helloworlds/tmpl/default.php
• admin/views/helloworlds/tmpl/default_head.php
• admin/views/helloworlds/tmpl/default_body.php
• admin/views/helloworlds/tmpl/default_foot.php
• admin/views/helloworld/index.html
• admin/views/helloworld/view.html.php
• admin/views/helloworld/tmpl/index.html
• admin/views/helloworld/tmpl/edit.php
• admin/tables/index.html
• admin/tables/helloworld.php
• admin/language/es-ES/es-ES.com_helloworld.ini
• admin/language/es-ES/es-ES.com_helloworld.menu.ini
• admin/controllers/index.html
• admin/controllers/helloworld.php
• admin/controllers/helloworlds.php
• language/es-ES/es-ES.ini
• media/index.html
• media/images/index.html
• media/images/tux-16x16.png
• media/images/tux-48x48.png

Modificando el archivo helloworld.xml tendríamos:

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

        <name>Hello World!</name>
        <creationDate>Octubre 2012</creationDate>
        <author>Carlos R & Andoitz B</author>
        <authorEmail>email<;/authorEmail>
        <authorUrl>http://www.ejemplo.org</authorUrl>
        <copyright>Copyright Info</copyright>
        <license>Licencia Info</license>
        <version>0.0.10</version>
        <description>COM_HELLOWORLD_DESCRIPTION</description>

        <install> <!-- Se ejecuta al instalar -->
                <sql>
                        <file driver="mysql" charset="utf8">sql/install.mysql.utf8.sql</file>
                </sql>
        </install>
        <uninstall> <!-- Se ejecuta al desinstalar -->
                <sql>
                        <file driver="mysql" charset="utf8">sql/uninstall.mysql.utf8.sql</file>
                </sql>
        </uninstall>
        <update> <!-- Se ejecuta al actualizar; Nuevo en 2.5 -->
                <schemas>
                        <schemapath type="mysql">sql/updates/mysql</schemapath>
                </schemas>
        </update>

        <files folder="site">
                <filename>index.html</filename>
                <filename>helloworld.php</filename>
                <filename>controller.php</filename>
                <folder>views</folder>
                <folder>models</folder>
                <folder>language</folder>
        </files>

        <media destination="com_helloworld" folder="media">
                <filename>index.html</filename>
                <folder>images</folder>
        </media>

        <administration>
               
                <menu img="../media/com_helloworld/images/tux-16x16.png">COM_HELLOWORLD_MENU
                </menu>

               <files folder="admin">
                        <!-- Sección principal de Copia de Ficheros -->
                        <filename>index.html</filename>
                        <filename>helloworld.php</filename>
                        <filename>controller.php</filename>

                        <!-- Sección de archivos SQL -->
                        <folder>sql</folder>

                        <!-- Sección de archivos de tablas -->
                        <folder>tables</folder>

                        <!-- Sección de archivos de modelos -->
                        <folder>models</folder>

                        <!-- Sección de archivos de vistas -->
                        <folder>views</folder>

                        <!-- Sección de archivos de controladores -->
                        <folder>controllers</folder>
                </files>

               <languages folder="admin">
                  <language tag="es-ES">language/es-ES/es-ES.com_helloworld.ini</language>
                  <language tag="es-ES">language/es-ES/es-ES.com_helloworld.sys.ini</language>
               </languages>
        </administration>

</extension> 

 Crea un archivo comprimido de este directorio o descarga directamente el archivo e instálalo utilizando el gestor de extensiones de Joomla!.

Desarrollo de componentes en Joomla 2.5 (4 de 8) | Desarrollo de componentes en Joomla 2.5 (6 de 8)