3 Templates Criando Módulos XOOPS



2011-02-06

Criando Módulos XOOPS - 03: Templates:

Criando Módulos XOOPS - 03: Templates

Olá pessoal estamos na nossa terceira etapa do mini curso sobre desenvolvimento de módulos para XOOPS, hoje trataremos sobre a implantação de templates, tornando nosso módulo flexível à aparência do tema principal do portal.

03: Templates XOOPS

03.1. Todos nós que já precisamos alterar alguma detalhe no módulo já percebemos que praticamente todos eles usam as templates, como forma de apresentar o resultado final do serviço prestado pelo módulo, e, não é por menos, o XOOPS é programado num padrão MVC, ou seja, em simples palavras é uma forma de programar onde se mantém separados a lógica de negócio da lógica de apresentação, permitindo o desenvolvimento em separado de cada um, mais simples ainda, ficam separados em arquivos distintos o código que faz a coisa acontecer do código de apresentação visual ao usuário.

03.2. Esse modelo de desenvolvimento permite, por exemplo, que um programador desenvolva o software e um designer crie um layout (tema) arrasador para o mesmo, sem precisar enterder coisa alguma da programação, apenas utilizando gatílhos para a impressão do conteúdo.

03.3. O primeiro passo para incluirmos templates em nosso módulo é criar um subdiretório chamado "templates" no diretório do módulo, no nosso caso vai ficar assim: "/modules/meumodulo/templates/"

03.3.1. Dentro desse subdiretório criamos um arquivo chamado "meumodulo_index.html" sem nenhum código dentro dele, nada mesmo, 0 linhas escritas.

03.4. Abrimos nosso arquivo "/meumodulo/xoops_version.php" e informamos ao XOOPS que o nosso módulo tem um template, incluíndo o seguinte código ao final do arquivo (quando digo final do arquivo significa depois de todos os códigos lá constantes, mas antes da tag de fechamento do php "? >"):

// definimos a(s) template(s) usadas pelos nosso modulo.

$modversion['templates'][1]['file'] = "meumodulo_index.html";

$modversion['templates'][1]['description'] = _MI_MEUMODULO_TEMPLATE1DESC;

03.4.1. Utilizamos uma constante de idioma apenas para a descrição, pois o nome do arquivo não precisa (e nem deve) ser alterado quando traduzido o módulo para outro idioma.

03.5. Já que utilizamos uma constante de idioma, devemos ir até o arquivo de linguagem, tanto em inglês quanto em portugues definir a constante, então abrimos o arquivo "/meumodulo/language/pt-br_utf8/modinfo.php" e incluímos o seguinte códido ao final do arquivo:

// A descrição do template 1 do módulo

define("_MI_MEUMODULO_TEMPLATE1DESC","Template da página principal do MeuMódulo");

03.5.1. Repetimos isso no arquivo em inglês, mas devidamente traduzido.

03.6. Agora vamos na administração de módulos do XOOPS e atualizamos o módulo, perceberemos que o XOOPS incluiu no BD o templete e renderizou o mesmo.

03.7. O próximo passo é assinar as variáveis do Smarty, para que possam ser utilizadas no template. Então abrimos o arquivo "/meumodulo/index.php" e incluímos o seguinte código, logo após a chamada ao arquivo "mainfile.php" e antes da chamada ao arquivo "header.php", ficando assim:

// chamamos o arquivo mainfile.php

require_once('../../mainfile.php');

// chamamos a template

$xoopsOption['template_main'] = 'meumodulo_index.html';

// chamamos o arquivo header.php

require_once(XOOPS_ROOT_PATH.'/header.php');

03.7.1. É importantíssimo acertamos essa posição, pois o arquivo "mainfile.php" ativa o sistema de templates e o "header.php" realiza a leitura do mesmo, portanto se incluirmos em posição diferente, não vai funcionar da maneira desejada.

03.7.2. Ainda no mesmo arquivo substituímos o código a seguir:

// adicionamos o código necessório ao funcionamento do módulo

echo _MD_MEUMODULO_HELLO;

echo _MD_MEUMODULO_PAR;

echo _MD_MEUMODULO_PAR2;

Pelo código seguinte:

// adicionamos o código necessório ao funcionamento do módulo

$xoopsTpl->assign('meumod_titulo', _MD_MEUMODULO_HELLO);

$xoopsTpl->assign('meumod_paragrafo1', _MD_MEUMODULO_PAR);

$xoopsTpl->assign('meumod_paragrafo2', _MD_MEUMODULO_PAR2);

03.7.3. Observamos que antes estávamos apresentado o conteúdo do módulo através da impressa "echo" do php, ou seja, o código de programação providênciando o resultado de aparência, totalmente fora do esquema MVC, mas agora que incluímos uma template para o módulo, assinamos (definimos) as variáveis de conteúdo que deverão ser impressas no template, para depois o designer usar e posicionar esse conteúdo onde ficar melhor no seu layout.

03.7.3.1. Vale lembrar que o no nome das variáveis estão constando o inicio "meumod" para garantir que não seja a nenhuma outra Smarty Tag e também na hora da depuração ser possível identificar facilmente a mesma e sua origem.

03.7.4. Mas devemos lembrar de um detalhe, no tutorial anterior, para apresentarmos o conteúdo no módulo, utilizamos algumas tags HTML no arquivo de idioma, como essa prática também foge da arquitetura MVC, vamos corrigir isso, então abrimos o arquivo "/meumodulo/language/pt-br_utf8/main.php" e vamos remover as tags HTML que estiverem definidas, que são as < h2 > < / h2 > e as < p > < / p > e salvamos o arquivo. Ficando assim:

// Saudação

define("_MD_MEUMODULO_HELLO","Olá XOOPS, este é seu primeiro e mais simples módulo");

// Parágrafo

define("_MD_MEUMODULO_PAR","logo este módulo estará bem mais usável");

// Segundo Parágrafo

define("_MD_MEUMODULO_PAR2","estes textos estão definidos em constantes de idioma!");

03.7.5. Pronto agora parece tudo certo. Mas ainda precisamos organizar a template, afinal se tentarmos acessar o módulo nesse momento não vai ser exibido nenhum conteúdo do módulo.

03.7.5.1. Então abrimos o arquivo "/meumodulo/templates/meumodulo_index.html" e incluímos as tags recém assindas. As tags Smarty dentro do template são escritas assim: < { $nome_da_variavel } > (tudo sem espaço entre os caracteres, só o faço assim para o interpretador do XOOS aqui do XOOPS não entender como uma smartytag). Então vamos ao arquivo:

<h2><{$meumod_titulo}></h2>

<p><{$meumod_paragrafo1}></p>

<p><{$meumod_paragrafo2}></p>

03.7.5.1. Observamos que aqui usamos as tags HTML, afinal este arquivo de template é onde as mesmas devem estar, pois da forma como for escrito neste HTML será a exibição do conteúdo, essa é a sua função. Agora testemos o módulo e veremos que está tudo em ordem.

03.7.5.2. Outra observação importante é que o arquivo da template não tem nenhum outro código HTML a não ser o relacionado ao conteúdo, pois as tags < head > < body > e outras são adicionadas pela template principal do tema.

03.7.6. Mas ainda tem mais alguns detalhes, atualmente o XOOPS e o Smarty permite que utilizemos diretamente nos templates o conteúdo de constantes, tanto as constantes de programação, quanto as constantes de idioma, para testarmos esse recurso, vamos abrir novamente o arquivo "/meumodulo/language/pt-br_utf8/main.php" e adicionar no final a seguinte definição:

// Terceiro Parágrafo

define("_MD_MEUMODULO_PAR3","e este parágrafo está sendo apresentado diretamente no template");

03.7.6.1 Agora voltamos ao arquivo "/meumodulo/templates/meumodulo_index.html" e deixamos o código assim:

<h2><{$meumod_titulo}></h2>

<fieldset>

<p><{$meumod_paragrafo1}></p>

<p><{$meumod_paragrafo2}></p>

<p><{$smarty.const._MD_MEUMODULO_PAR3}></p>

<p><{$smarty.const.XOOPS_URL}></p>

</fieldset>

03.7.6.2. Observamos que para chamar diretamente um constante devemos usar a Smarty Tag < { $smarty.const.CONSTANTE } > e no nosso caso, utilizamos uma constante de idioma que definimos à pouco a "PAR3" e também uma constante de programação a XOOPS_URL, incluímos um "fieldset" só para enfeitar demonstrando que no mais vai depender do designer, agora basta acessarmos o módulo e veremos que o conteúdo das duas constantes também estão sendo impressos no resultado final.

03.8. Como o nosso módulo está começando a ficar com muitos arquivos, segue abaixo a estrutura atual do nosso módulo:

/meumodulo/

/meumodulo/images/

/meumodulo/images/meumodulo_logo.png

/meumodulo/language/

/meumodulo/language/english/

/meumodulo/language/english/main.php

/meumodulo/language/english/modinfo.php

/meumodulo/language/pt-br_utf8/

/meumodulo/language/pt-br_utf8/main.php

/meumodulo/language/pt-br_utf8/modinfo.php

/meumodulo/templates/

/meumodulo/templates/meumodulo_index.php

/meumodulo/index.php

/meumodulo/xoops_version.php

03.8.1. Para não parecer confuso devemos observar os subdiretórios e fazer um esquema visual.

03.9. Lembrem que as discussões e dúvidas estão no Fórum, no tópico Criando Módulos XOOPS – 03: Templates.




Postar um comentário