Back end criação das classes view e dos layout’s

No back end do componente com_hello foram criadas duas classes view, a classe HellosViewHellos e a classe HellosViewHello. A classe HellosViewHellos é responsável pela interface principal do componente e apresenta, através do layout default.php, a lista de mensagens. Esta classe apresenta o seguinte código:

<?php /**

* Hellos View for Hello World Component *

* @subpackage Components

* @link http://docs.joomla.org/Developing_a_Model-View-Controller_Component_-_Part_4

* @license GNU/GPL

*/

// No direct access

defined( '_JEXEC' ) or die( 'Restricted access' ); jimport( 'joomla.application.component.view' ); /** * Hellos View * * @package Joomla.Tutorials * @subpackage Components */

class HellosViewHellos extends JView {

/**

* Hellos view display method * @return void

**/

function display($tpl = null) {

JToolBarHelper::title( JText::_( 'Hello Manager' ), 'generic.png' ); JToolBarHelper::deleteList();

JToolBarHelper::editListX(); JToolBarHelper::addNewX(); // Get data from the model

$items = & $this->get( 'Data');

$this->assignRef('items', $items);

parent::display($tpl); }

}

No método display() desta view é criada uma barra de ferramentas que permite accionar as tarefas de manipulação das mensagens (adicionar, editar e eliminar); é obtida a referência ao método da classe model que devolve os dados da base de dados e os envia para o layout através do método assignRef() da classe JView.

A barra de ferramentas é criada recorrendo a métodos da classe JToolBarHelper da framework. O método title( JText::_( 'Hello Manager' ), 'generic.png' ) adiciona o título à barra e define a imagem a utilizar no botão. Note-se que no primeiro parâmetro está a ser utilizado o método JText::_ para facilitar a tradução do idioma do componente. Este método vai procurar a string no ficheiro de idioma do componente e devolve a sua tradução, caso não encontre é devolvida a mesma mensagem que foi passada como parâmetro. A figura seguinte mostra a barra de ferramentas do componente.

Figura 26 - Barra de ferramentas do componente com_hello

O método deleteList() pode ter até três parâmetros opcionais. O primeiro corresponde a uma string com a mensagem de confirmação de eliminação dos registos. O segundo parâmetro corresponde à tarefa enviada no pedido e que accionará o respectivo método no controller (por defeito é “remove”). O terceiro parâmetro é o texto que aparece por baixo do botão.

Os métodos editListX() e addNewX() podem conter dois parâmetros opcionais. O primeiro é a tarefa (por defeito é “edit” e “add”, respectivamente) e o segundo é o texto que

aparece por baixo do botão. Para efeitos de tradução, pode também ser utilizado o método JText::_ no segundo parâmetro destes dois métodos.

O layout que apresenta os dados enviados para a view é implementado no ficheiro admin/views/hellos/tmpl/default.php e apresenta o seguinte código:

<?php defined('_JEXEC') or die('Restricted access'); ?>

<form action="index.php" method="post" name="adminForm"> <div id="editcell">

<table class="adminlist"> <thead>

<tr>

<th width="5">

<?php echo JText::_( 'ID' ); ?>

</th>

<th width="20">

<input type="checkbox" name="toggle" value=""

onclick="checkAll(<?php echo count( $this->items ); ?>);" /> </th>

<th>

<?php echo JText::_( 'Greeting' ); ?>

</th> </tr>

</thead>

<?php $k = 0;

for ($i=0, $n=count( $this->items ); $i < $n; $i++){ $row = &$this->items[$i];

$checked = JHTML::_('grid.id', $i, $row->id );

$link = JRoute::_(

'index.php?option=com_hello&controller=hello&task=edit&cid[]='. $row->id ); ?>

<tr class="<?php echo "row$k"; ?>"> <td> <?php echo $row->id; ?> </td> <td> <?php echo $checked; ?> </td> <td>

<a href="<?php echo $link; ?>"><?php echo $row->greeting; ?></a> </td> </tr> <?php $k = 1 - $k; } ?> </table> </div>

<input type="hidden" name="option" value="com_hello" /> <input type="hidden" name="task" value="" />

<input type="hidden" name="boxchecked" value="0" /> <input type="hidden" name="controller" value="hello" /> </form>

Para facilitar a construção dos layouts do componente devem ser utilizadas as CSS e os scripts Javascript que o pacote do Joomla já fornece. Assim, o nome do formulário deve ser adminForm e deve ser utilizado o método POST ao submeter. Para a selecção das mensagens são utilizadas caixas de selecção (checkbox) com o nome toggle. A função Javascript checkAll() já se encontra implementada no ficheiro /includes/js/ joomla.javascript.js da instalação do Joomla. Utilizando esta função, é apenas necessário passar como parâmetro o número de mensagens da lista e ao clicar na checkbox é possível

seleccionar ou desseleccionar todas as caixas de selecção. Através do método JHTML::_() é possível gerar as caixas de selecção para cada linha da tabela e que correspondem a um registo individual. Os links associados às mensagens são criados através do método JRoute:_() e contêm a variável option com o nome do componente, a variável controller com o nome do controller, a variável task com o nome da tarefa a executar e o array cid com o identificador das mensagens (JRoute::_( 'index.php?option=com_hello&controller=hello& task=edit&cid[]='. $row->id );).

Os últimos quatro campos do formulário estão ocultos. O primeiro campo, com o nome de option, é necessário para que o Joomla não deixe de executar o componente. O segundo campo, o campo task, irá guardar a tarefa escolhida através do botão da barra de ferramentas do componente. O campo com o nome boxchecked servirá para guardar o número de caixas de selecção seleccionadas. O último campo, com o nome controller, é utilizado para se especificar o nome do controller responsável por tratar a tarefa enviada pelo formulário.

Com a implementação da view hellos e do seu layout default, a interface apresentada no back end será idêntica à interface da figura seguinte.

Figura 27 - Layout default da view hellos no componente com_hello.

A classe HellosViewHello responsável por apresentar o layout form com formulário de edição ou adição de mensagens, é implementada no ficheiro admin/views/hello/ view.html.php e apresenta o seguinte código:

<?php /**

* Hello View for Hello World Component * * @package Joomla.Tutorials * @subpackage Components * @link http://docs.joomla.org/Developing_a_Model-View-Controller_Component_-_Part_4 * @license GNU/GPL */ // No direct access

defined( '_JEXEC' ) or die( 'Restricted access' ); jimport( 'joomla.application.component.view' ); /** * Hello View * * @package Joomla.Tutorials * @subpackage Components */

class HellosViewHello extends JView {

/**

* display method of Hello view * @return void

**/

function display($tpl = null) {

//get the hello

$hello =& $this->get('Data'); $isNew = ($hello->id < 1);

$text = $isNew ? JText::_( 'New' ) : JText::_( 'Edit' );

JToolBarHelper::title( JText::_( 'Hello' ).': <small><small>[ ' . $text.' ]</small></small>' );

JToolBarHelper::save();

if ($isNew) {

JToolBarHelper::cancel(); } else {

// for existing items the button is renamed `close` JToolBarHelper::cancel( 'cancel', 'Close' );

}

$this->assignRef('hello', $hello);

parent::display($tpl); }

}

À semelhança da view hellos, o método display() da view hello começa com a criação da barra de ferramentas e com a referência ao método da model que contém os dados. Os dados são então enviados através do método assignRef() para o layout form da view. Para a construção do layout form da view é criado o ficheiro admin/views/hellos/ tmpl/form.php com o seguinte código:

<?php defined('_JEXEC') or die('Restricted access'); ?>

<form action="index.php" method="post" name="adminForm" id="adminForm"> <div class="col100">

<fieldset class="adminform">

<legend><?php echo JText::_( 'Details' ); ?></legend> <table class="admintable">

<tr>

<td width="100" align="right" class="key"> <label for="greeting">

<?php echo JText::_( 'Greeting' ); ?>:

</label> </td>

<td>

<input class="text_area" type="text" name="greeting"

id="greeting" size="32" maxlength="250" value="<?php echo $this->hello->greeting;?>" /> </td>

</tr> </table> </fieldset> </div>

<div class="clr"></div>

<input type="hidden" name="option" value="com_hello" />

<input type="hidden" name="id" value="<?php echo $this->hello->id; ?>" /> <input type="hidden" name="task" value="" />

<input type="hidden" name="controller" value="hello" /> </form>

Importa aqui destacar que foi adicionado um campo oculto de nome id que vai guardar o identificador da mensagem, uma vez que o utilizador não necessita (nem deve) alterar o valor

deste campo. Para facilitar a criação desta interface são novamente utilizadas as classes disponíveis nas CSS do Joomla, tais como, adminForm e adminTable.

Figura 28 - Layout form correspondente à view hello do componente com_hello

Através das views hellos, hello e dos seus respectivos layouts, os utilizadores do lado back end do Joomla podem fazer toda a gestão das mensagens referentes ao componente com_hello.