Instalando o Plone 2.5 no Windows XP
Document Actions
Curso Online - Zope Básico - Versão 2.9.2
Páginas Dinâmicas I - DTML
Antes de falarmos sobre páginas dinâmicas há algo que precisa ser
explicado, o Zope trabalha com um poderoso mecanismo de aquisição que
funciona da seguinte forma, quando uma variável (ou metadado, pasta,
objeto,etc..) qualquer é solicitada (pelo DTML por exemplo) o Zope
procura a variável no contexto (diretório atual) onde ela foi chamada,
não encontrando no contexto, ele sobe um nível da árvore de diretórios
e continua a procura sussesivamente até chegar a raiz do site, caso não
encontre a variável gera um erro.
Esse mecanismo é muito útil quando precisamos de conteudos diferentes
entre contextos diferentes, como pais e filhos. Nesse caso, quando a
variavel é acessada por um filho ela retorna o conteúdo de acordo com o
contexto o filho, e assim também para com o pai.
O que é DTML?
DTML (Document Template Markup Language) é a linguagem de apresentação e script baseada em tag do Zope, que roda no lado do servidor (server side), como SSI, PHP, ASP, e JSP. Ou seja, os comanndos DTML são executados pelo servidor e renderizados como HTML para a interpretação do browser, em contrapartida, as linguagens que rodam no “lado do cliente”, como Javascript, não são interpretadas no servidor, e sim enviadas ao browser para que ele interprete o código.
Nós podemos usar o DTML em dois tipos de objetos no Zope, DTML Documents e DTML Methods. Uma das vantagens do DTML é que ele se parece muito com o HTML, pessoas familiarizadas com HTML tem facilidade em aprender o DTML.
O DTML suporta reuso de conteúdo e layout, formatação de dados heterogêneos, e separa a apresentação da lógica e do conteúdo.
Um exemplo claro do reuso de layout são o cabeçalho e rodapé default do Zope, veja o código abaixo:
<dtml-var standard_html_header>
<p>Hello world.</p>
<dtml-var standard_html_footer>
Nesse código temos HTML e DTML juntos, separando:
<dtml-var standard_html_header>
é o DTML que chama um objeto default do Zope que se encontra na raíz do Zope responsável pela inserção do cabeçalho, não importa onde esteja sua página, o Zope econtra o objeto de nome 'standard_html_header' e renderiza o código desse objeto no contexto do objeto que chama o 'standard_html_header'.
<p>Hello world.</p>
é o HTML do conteúdo
<dtml-var standard_html_footer>
é o DTML que faz a mesma coisa do header no footer, ou seja, no rodapé do documento.
Está página reenderizada no browser ficaria assim:
<html>
<body bgcolor="#FFFFFF">
<p>Hello world.</p>
<hr>
<p>Last modified 2000/10/16 by AmosL</p>
</body>
</html>
Além do reuso do código, é possível formatar todos os tipos de dados, para chamar métodos, pesquisas a banco de dados, inserir objetos no Zope, processar formulários, e mais.
Quando um objeto retornar o conteúdo de uma pesquisa ao seu banco de dados (um ZSQL Method), normalmente em forma de lista, o DTML pode facilmente formatar os dados na página
<ul>
<dtml−in sql_retorna_clientes>
<li><dtml−var nome_cliente></li>
</dtml−in>
</ul>
A tag dtml-in interage nos resultados da query usando o HTML (<li>) para formatar a saída dos dados. Se fossem 5 resultados retornados pela query, a página renderizada ficaria assim:
<ul>
<li>Rodrigo Castardo</li>
<li>Sheila Melo</li>
<li>Fabio Rizzo </li>
<li>Cheila Carvalho</li>
<li>Fabio Júnior</li>
</ul>
Observe que não é necessário dizer ao DTML que o conteúdo é o resultado de uma query, muito menos onde achar os argumentos para a query, é necessário apenas dizer qual objeto eu quero e ela interpreta qual tipo de objeto, como eu chamo o objeto e passo os argumentos a ele.
Esta facilidade na formatação de dados torna a DTML uma ferramenta útil para apresentação.
Sintaxe
DTML tem sua sintaxe semelhante a do HTML, como foi dito acima, e é baseada em tags. Existem dois tipos de tags, as simples e de blocos. Na tag simples, não existe necessidade de fechar a tag, como abaixo:
<dtml-var nome_cliente>
Tag em blocos exigem duas tags, uma abre a tag e outra fecha, como abaixo:
<dtml-in
retorna_materias>
<p><dtml-var
noticias></p>
</dtml-in>
Também podemos trabalhar com alguns atributos, o atributo oferece informação sobre como a tag trabalha. Alguns deles tem valor, como abaixo:
<dtml-var nome_aluno missing="sem nome">
o atributo missing substitui o valor da variável nome_aluno caso ela não exista
E outros não tem, como no exemplo abaixo:
<dtml-var nome_aluno upper>
o atributo upper torna a variável nome_aluno em caixa alta.
Inserindo variáveis com dtml-var
Uma tarefa básica é a inserção de variáveis, vejamos como fazer esta tarefa com DTML.
Faça os seguintes passos:
crie um arquivo de id titulo_dinamico
edite o title para a seguinte frase “exercício de título dinâmico”
insira o código abaixo:
<dtml-var standard_html_header>
<h1>O titulo da página é: <dtml-var title></h1>
<p>Esta página insere conteúdo dinâmico na linha acima</p>
<dtml-var standard_html_footer>
O pedaço de código <dtml-var title> exibe dinâmicamente o conteúdo do metadado title do obejto, agora clique na aba view para ver o resultado.
<html>
<body>
<h1>O
titulo da página é: exercício
de título dinâmico</h1>
<p>Esta página
insere conteúdo dinâmico na linha
acima</p>
</body>
</html>
Processando
dados vindos de um formulário
É fácil processar formulários usando o Zope e DTML, o Zope procura variáveis em diversos lugares como as informações que vem da ação submit dos formulários HTML, o request. Você não precisa de nenhum objeto especial, DTML Documents e DTML Methods farão todo o trabalho.
Vamos criar dois DTML Documents, um com o id meu_form e outro com o id dados_meu_form com os seguintes conteúdos:
meu_form
<dtml-var
standard_html_header>
<p>Por favor insira seus dados
abaixo:</p>
<form action="dados_meu_form">
nome:
<input type="text" name="usuario"><br>
e-mail:
<input type="text" name="mail"><br>
<input
type="submit" value=”enviar”>
</form>
<dtml-var
standard_html_footer>
dados_meu_form
<dtml-var
standard_html_header>
<h1>Seguem abaixo as variáveis
do DTML Document meu_form</h1>
<p>O nome contido no
campo nome da página anterior é: <dtml-var
usuario></p>
<p>E o email é: <dtml-var
mail></p>
<dtml-var standard_html_footer>
Visualizem o DTML Document meu_form e em seguida insira dados no form, lembrando que não existe validação nesse form, ou seja, ele pode ser submetido sem dado algum, é possível usar o JavaScript para fazer essa validação no lado do cliente, portando insira dados nos dois campos e depois clique em enviar, os dados serão enviados para o request e você será redirecionado para o DTML Document dados_meu_form.
Nele usando dtml-var acessamos facilmente o conteúdo do form da primeira página, e com a mesma facilidade que visualizamos os dados podemos fazer lógica com dados, enviá-los para uma query, etc...
Vamos tentar submeter o form sem dados, vejamos o que acontece! Vamos também visualizar, através da aba view, o DTML Document dados_meu_form e ver o que acontece. Nos dois casos uma exceção é gerada pois o Zope não encontra as variáveis no objeto corrente, no seu repositório ou o request da web.
Atributos
da Tag Var
É possível controlar o comportamento da tag var usando seus atributos, essa tag tem muitos atributos que são úteis em situações comuns de formatação. Segue abaixo uma amostra dos atributos:
html_quote - este atributo faz com que os valores inseridos sejam postos entre aspas. Isto significa que <, > e & são aproveitados.
Missing - permite usar um valor para o caso de não achar a variável. Por exemplo: <dtml-var bananas missing="We have no bananas">
fmt - controla o formato da saída das tags var. Existem muitos atributos úteis como o atributo fmt que formata valores monetários.
Vamos fazer um exercício para entedermos melhor o funcionamento de um atributo, clique no Root Folder e clique na aba Properties, crie uma propriedade float em seu folder raiz com o nome custo e de o valor 2.2 a ela.
Mostrando a propriedade custo da folder raiz:
Crie DTML Document ou Method com o seguinte codigo:
<dtml-var custo fmt=dollars-and-cents>
Salve e clique em view, isto faz com que a propriedade custo seja renderizada assim "$2.20".
obs.: o atributo arredondará os números decimais para o centavo mais próximo.
Sintaxe de Entidade da Tag Var
Uma sintaxe suscinta da DTML apenas para a simples tag var é oferecida pelo Zope, porque a tag var é singular, ela pode ser representada com uma entidade HTML como a seguinte sintaxe:
&dtml-cockatiel;
Isto equivale a :
<dtml-var name="cockatiel" html_quote>
A razão para o uso dessa sintaxe de entidade é permitir o uso de tags DTML dentro de tags HTML. Como no exemplo:
<input type="text" value="<dtml-var name="variavel">">
Com essa sintaxe podemos fazer códigos mais legíveis para o seu editor de HTML, como abaixo:
<input type="text" value="&dtml-variavel;">
DTML-IF
Essa tag é usada para fazer lógica no DTML, de uma maneira muito restrita pois seria um trabalho muito penoso fazer operações matemáticas com DTML, para isso use um script Python. O dtml-if é mais usado para condicionais mais simples como veremos nesta aula.
O que é uma condição? Uma condição é tanto um valor falso como um verdadeiro. Em geral todos os objetos são considerados verdadeiros a menos que eles sejam 0, None, uma sequência vazia ou uma sring vazia.
Um uso simples, porém útil é uma condicional como a mostrada abaixo:
<dtml-if nome_do_usuario>
Olá, <dtml-var nome_do_usuario>!
</dtml-if>
Podemos usar também expressões como no exemplo:
<dtml-if expr="nome_do_usuario == 'Zope'">
Olá, <dtml-var nome_do_usuario>!
</dtml-if>
E por último também podemos usar o dtml-else e o dtml-elif, como abaixo:
<dtml-if nome_do_usuario>
Olá, <dtml-var nome_do_usuario>!
<dtml-else>
Usuário desconhecido
</dtml-if>
<dtml-if expr="nome_do_usuario == 'Zope'">
Olá, <dtml-var nome_do_usuario>!
<dtml-elif expr="nome_do_usuario == 'Python'">
Caro <dtml-var nome_do_usuario>, bem vindo!
<dtml-elif expr="nome_do_usuario == 'Plone'">
Nome de usuário: <dtml-var nome_do_usuario>
</dtml-if>
DTML-IN
Essa é uma tag de bloco, que interage sobre uma sequência de objetos num bloco de execução, executando o código a cada item na sequência. Na programação, isto é frequentemente chamado de iteração, ou looping. Veja o exemplo:
<dtml-in lista_de_nomes>
<p><dtml-var cada_nome></p>
</dtml-in>
Este exemplo executa um loop sobre uma lista de objetos chamada lista_de_nomes, para cada ocorrência da lista_de_nomes é inserido um parágrafo em HTML com cada nome.
Interação é extremamente útil em aplicações!
Aqui temos um exemplo de como interagir sobre o conteúdo de um folder, este código faz um loop sobre todos os arquivos em um folder e mostra um link para cada um, mostrando como é possível e fácil mostrar todos os objetos do tipo "File" de uma pasta na página usando o dtml-in para interagir os resultados da expressão objectValues(File).
<dtml-var standard_html_header>
<ul>
<dtml-in expr="objectValues(File)">
<li><a href="&dtml-absolute_url;"><dtml-var title_or_id></a></li>
</dtml-in>
</ul>
<dtml-var standard_html_footer>