1. Introdução
|
|
No âmbito da disciplina de Processamento Estruturado de Documentos, desenvolveu-se um trabalho
baseado em tecnologia XML. Este trabalho engloba a realização de um Jornal Electrónico e de um
Relatório. Para cada um criaram-se os ficheiros xsd, xml e
xslt. Para além disso, também foram criados ficheiros auxiliares do tipo
js e css.
|
|
2. O Relatório
|
|
A apresentação do trabalho será centralizada na execução do Jornal Electrónico, uma vez que este
é o principal objectivo. No entanto, gostaria de salientar a forma como foi desenvolvido o
schema do Relatório para permitir escrever o seguinte código xml:
<paragraph align="center">
<bold>
<italic>
<underlined>particularidade</underlined>
</italic>
</bold>
</paragraph>
|
... que permite aninhar o texto com elementos do tipo italic, bold,
underlined e paragraph para obter o seguinte resultado:
particularidade
Eis o Schema que lhe dá origem, mais particularmente o elemento body:
Fig 1. Elemento body (report.xsd)
|
Em relação ao Jornal Electrónico, a única mais-valia do Relatório é a estrutura do
Schema. A linguagem de formatação gráfica é muito mais rica e elaborada, pelo que
vale a pena ver em detalhe todo o elemento body que não
foi possível mostrar aqui.
ver ficheiros: report.xsd
|
|
3. O Jornal Electrónico
|
|
Um jornal electrónico é um documento que normalmente é distribuído por email a uma lista de subscritores.
Um documento deste género deve ter um editorial com a informação técnica de produção e um conjunto de
secções com vários artigos. Cada artigo tem um título, um lead, um corpo com a notícia, uma imagem,
uma referência para os autores e uma lista de links com informação complementar ou relacionada.
Para completar, cada artigo deve também ter um conjunto de keywords associadas para
que os mecanismos de pesquisa automática que venham a ser criados possam obter melhores resultados.
Esta é uma breve descrição da estrutura pretendida na realização deste trabalho.
ver ficheiros: ejournal.html
|
3.1. Arquitectura do Sistema
|
|
Para se perceber melhor a função de cada ficheiro desenvolvido, vejamos o esquema que se segue:
Fig 2. Arquitectura do Sistema
|
O ficheiro xsd é a gramática da linguagem usada para criar e validar a instância do
documento xml. O ficheiro xslt transforma a árvore documental
xml dando origem ao ficheiro html. No código gerado, é feita
referência aos ficheiros de imagem, css e js. O primeiro formata o aspecto gráfico
da página, enquanto o segundo contém as javascripts necessárias para dinamizar a
navegação através de dhtml.
De realçar que a chave deste processo de geração automática está no uso de tecnologias
XML como os Schemas, as Stylesheets e a
linguagem XPath.
|
3.1.1. Schema (.xsd)
|
|
A primeira figura mostra-nos a estrutura base do jornal:
Fig 3. Elemento ejournal (ejournal.xsd)
|
O jornal é classificado por um conjunto de atributos como o nome, a data, o logotipo e a versão.
Para além disso, é constituído por um editorial e um conjunto de secções.
O editorial contém informação sobre a produção técnica e deixa em aberto um conjunto
de items que podem ser definidos, conforme a edição o desejar, como um par {nome, valor}.
Por exemplo, poderia ser {"Director","José Joaquim"} e {"Design","Maria Maruca"}.
Cada secção é uma sequência de artigos. Vejamos a descrição de um artigo:
Fig 4. Elemento article (ejournal.xsd)
|
Um artigo é constituído por um título, um lead, um corpo textual, uma imagem e
a referência aos autores. Pode também ter um conjunto de links sobre informação
relacionada, e um conjunto de keywords para classificação do artigo perante
motores de pesquisa. As zonas textuais são simples parágrafos de texto, para evitar a
heterogeneidade gráfica das notícias que provém de diversos autores.
Em suma, é um esquema bastante simples mas eficaz, modular e objectivo.
ver ficheiros: ejournal.xsd
|
|
3.1.2. Instância (.xml)
|
|
A instância é o documento xml que descreve os conteúdos do jornal.
A título de exemplo vejamos um excerto de código:
<section name="Grupo de Linguagens">
<article>
<title>Processamento Estruturado de Documentos</title>
<lead>
<paragraph>
Disciplina de opção oferecida ao Mestrado
em Informática e ao Curso de Especialização em Informática
do Departamento de Informática, da Escola de Engenharia
da Universidade do Minho.
</paragraph>
</lead>
<body>
<paragraph>
Familiarização e Utilização da tecnologia baseada
em XML e XSL como suporte à publicação electrónica de
conteúdos e como plataforma de intercâmbio entre
diferentes sistemas e aplicações.
</paragraph>
<paragraph>
No fim do módulo, o aluno deverá ser capaz de
montar uma plataforma para processamento documental
usando XML, XSL e ferramentas derivadas, suportando
todas as fases do ciclo de vida documental.
</paragraph>
</body>
</article>
</section>
|
Um dos aspectos mais importantes que foi considerado quando se criou a gramática
documental deste documento, teve a ver com o produto final
que se pretendia. De facto, uma das observações que pode ser feita é que a formatação
textual do artigo, no que ao parágrafo diz respeito, poderia ser mais rica. A justificação
mais plausível é que de facto não era uma exigência do produto final idealizado porque
se pretendia homogeneizar a escrita de artigos não deixando margem para grandes
invenções por parte de quem os editava.
Nesse sentido, toda a riqueza de formatação textual e gráfica
foi passada para o trabalho de geração do Relatório, em que este, tal como já o descrevemos, contém
alguns mecanismos mais poderosos. Não se pense, por isso, que foi um detalhe deixado ao acaso
ou incompleto...
ver ficheiros: ejournal.xml
|
|
3.1.3. Html (.html)
|
A única razão para que este tópico seja abordado nesta altura, é a necessidade de explicar ao
leitor a estrutura de navegação da página, para que, mais tarde, consiga perceber melhor o código
da Stylesheet.
Na página web, o uso de DHTML e
Javascript permitiu construir uma navegação por Layers (Divs).
Basicamente, existem dois divs (artigos de uma secção, artigo) que
estão visíveis e outro conjunto de divs que estão ocultos. Sempre que
é necessário, os dois primeiros são carregados com o conteúdo dos que estão escondidos. Tudo
isto é feito dinamicamente sem recarregar a página. Para conseguir este tipo de dinamismo, no
header do html gerado, são colocadas referências aos ficheiros
css e js. A figura seguinte ilustra a navegação aqui referida:
Fig 5. Navegação por layers (ejournal.html)
|
Convém referir que este modelo foi primeiro desenvolvido em código estático e só depois
transposto para o ficheiro xsl. À parte deste pormenor, o resto da codificação
HTML é bastante simples, mas muito bem estruturada.
ver ficheiros: ejournal.html,
browser.js,
global.js,
main.js,
global.css
|
|
3.1.4. Stylesheet (.xslt)
|
|
Na Stylesheet vamos analisar os excertos de código mais importantes e comentar
as opções e decisões tomadas em cada um.
Excerto 1:
<xsl:template match="sections">
<div id="sections" class="containerOn">
(...)
Secções
(...)
<xsl:for-each select="section">
<xsl:if test="position()>1">
<img hspace="5" src="images/bulletb.gif" align="middle"/>
</xsl:if>
<a genid="{generate-id(.)}"
onclick="javascript:writeFromTo(this.genid,'articles')" href="#">
<xsl:value-of select="@name"/>
</a>
</xsl:for-each>
(...)
</div>
</xsl:template>
|
Esta template escreve no div "sections" o nome de todas as secções que
existem no documento e fica sempre visível devido à definição da
class="containerOn".
A separação de nomes é feita por um ponto, do tipo imagem, que é escrito apenas quando
há mais que um, tal como é garantido pela condição test="position()>1",
e cada nome é escrito dentro de um <a...>...</a>.
Quando o utilizador clica no link de uma secção, é accionada uma função
que copia o conteúdo de um div, que está escondido e contém a informação
sobre os artigos dessa secção, para o div "articles". Este último, também está
sempre visível. Desta forma é feita uma navegação dinâmica ao nível do cliente.
Excerto 2:
<xsl:template match="section">
<div id="{generate-id(.)}" class="containerOff">
(...)
Artigos
(...)
<xsl:for-each select="article">
(...)
<a genid="{generate-id(.)}"
onclick="javascript:writeFromTo(this.genid,'article')" href="#">
<xsl:value-of select="title"/>
</a>
</xsl:for-each>
(...)
</div>
</xsl:template>
|
O div gerado por esta template é um exemplo de um layer
que fica oculto na página, devido à declaração da class="containerOff".
Este tipo de divs apenas servem para guardar informação na página como se fossem
uma variável de armazenamento global.
O que foi explicado para o excerto 1 também é válido para o excerto 2, mas neste caso, quando se
escolhe um artigo, é carregado o seu conteúdo para o div "article".
Excerto 3:
<xsl:template match="article">
<div id="{generate-id(.)}" class="containerOff">
(...)
Artigo
(...)
<xsl:value-of select="title"/>
(...)
<xsl:if test="count(keywords/keyword)>0">
(...)
<xsl:for-each select="keywords/keyword">
(...)
<xsl:value-of select="."/>
</xsl:for-each>
(...)
</xsl:if>
(...)
<xsl:for-each select="lead/paragraph">
(...)
<xsl:value-of select="."/>
</xsl:for-each>
(...)
<xsl:if test="image/path!=''">
(...)
<img src="{image/path}"/>
<xsl:if test="image/legend!=''">
(...)
<xsl:value-of select="image/legend"/>
(...)
</xsl:if>
(...)
</xsl:if>
(...)
<xsl:for-each select="body/paragraph">
(...)
<xsl:value-of select="."/>
</xsl:for-each>
(...)
<xsl:if test="count(links/link)>0">
(...)
<xsl:for-each select="links/link">
(...)
<a href="{url}">
<xsl:value-of select="name"/>
</a>
</xsl:for-each>
(...)
</xsl:if>
<xsl:if test="count(authors/author)>0">
(...)
<xsl:for-each select="authors/author">
(...)
<xsl:value-of select="."/>
</xsl:for-each>
(...)
</xsl:if>
(...)
</div>
</xsl:template>
|
Nesta template, aplicada a cada artigo, destacam-se os testes realizados sobre os elementos
opcionais ou plurais do Schema que evitam que seja gerado código desnecessário.
A total compreensão desta Stylesheet requer alguns conhecimentos em
DHTML e Javascript. Como estas tecnologias não são o
objectivo principal deste trabalho, espero que o elaborado esforço em explicar a estrutura
de navegação possa ter contribuído para um melhor esclarecimento do leitor.
ver ficheiros: ejournal.xslt
|
|
|
|
4. Conclusão
|
Este mini-projecto permitiu, de uma forma leve, introduzir a tecnologia XML e explorar
as suas potencialidades. Na verdade, é na aplicação do XML que surgem as discussões
mais pertinentes, porque o seu potencial ninguém duvida que é elevado. Na minha opinião, este tipo de
tecnologia atinge o seu auge quando se aplica na área do eBusiness facilitando a
integração de informação entre diferentes entidades, sejam elas sistemas organizacionais ou não. Mas,
mais áreas haverá em que a sua aplicação seja uma vantagem, pelo menos por agora. No entanto, sou
daqueles que acreditam que não é a solução para tudo!
Em jeito de auto-avaliação, este trabalho apresenta criatividade na forma como dispõe graficamente e
estruturalmente o jornal, não descurando o cuidado em produzir um resultado final com qualidade
suficientemente profissional do ponto de vista de tecnológico.
|
|
|