USUÁRIO:      SENHA:        SALVAR LOGIN ?    Adicione o VBWEB na sua lista de favoritos   Fale conosco 

 

  Dicas

  ASP - Active Server Page    (Miscelâneas)

Título da Dica:  Fórum em XML e ASP - Parte II / III
Postada em 3/10/2003 por ^HEAVY-METAL^            
Módulo 2 - Folhas de estilo XSL

Comecemos pelos documentos XSL. Inicialmente, exibiremos os grupos disponíveis em um drop-down, que irá redirecionar a página para o grupo selecionado. Esta folha de estilo recebe como parâmetro opcional o grupo atual, para que o drop-down mantenha selecionado o grupo que o usuário se encontra.

<?xml version="1.0" encoding="iso-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" omit-xml-declaration="yes" />
<xsl:variable name="GroupId"/>

<xsl:template match="//Groups">
<form action="" method="get" name="header">
  <div>
  Selecione o fórum:
   <select onchange="document.location.href = this.options[this.selectedIndex].value">
    <option value="index.asp">Página principal</option>
    <xsl:for-each select="Group">
     <xsl:element name="option">
      <xsl:if test="@GroupId = $GroupId">
       <xsl:attribute name="selected">selected</xsl:attribute>
      </xsl:if>
      <xsl:attribute name="value">index.asp?GroupId=<xsl:value-of select="@GroupId"/></xsl:attribute>
      ::<xsl:value-of select="@Title"/>
     </xsl:element>
    </xsl:for-each>
   </select>

   <xsl:if test="$GroupId != ''">

    <xsl:element name="a">
     <xsl:attribute name="href">index.asp?GroupId=<xsl:value-of select="$GroupId"/>&Message=-1</xsl:attribute>
     [ Nova mensagem ]
    </xsl:element>
    <xsl:element name="a">
     <xsl:attribute name="href">index.asp?GroupId=<xsl:value-of select="$GroupId"/></xsl:attribute>
     [ Principal ]
    </xsl:element>

   </xsl:if>

  </div>
</form>
</xsl:template>
</xsl:stylesheet>


Para quem acha que passamos rápido demais:

¤ Definimos uma variável chamada GroupId, que utilizaremos posteriormente, para mantermos realçada a opção de grupo atual.
¤ No template que seleciona todos os elementos do node Groups, criamos os campos de um form, que servirá para redirecionar para o grupo desejado, alterando a opção do drop-down.
¤ Se o @GroupId (atributo do elemento Group) for igual a $GroupId (variável que definimos anteriormente), acrescente um "SELECTED", para manter o grupo atual como padrão no drop-down.
¤ Mostramos a descrição do grupo selecionado.
¤ Criamos os links para nova mensagem e para retornar a página que exibe todas as threads. Estudaremos em detalhes esses elementos posteriormente, no Módulo 3 deste tutorial.

Teremos também que exibir as threads. As mensagens serão mostradas hierarquicamente, mostrando as respostas das perguntas identadas, com a utilização recursiva do elemento <UL> do HTML. Queremos aqui exibir o assunto da mensagem, o autor, data e hora e número de respostas na thread.

<?xml version="1.0" encoding="iso-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" omit-xml-declaration="yes" />

<xsl:template match="Messages">
<xsl:element name="ul">
  <xsl:apply-templates select="Message[@GroupId='x']"/>
</xsl:element>
</xsl:template>

<xsl:template name="threads" match="Message">
<li>
  <xsl:element name="a">
   <xsl:attribute name="href">index.asp?GroupId=<xsl:value-of select="@GroupId"/>&MsgId=<xsl:value-of select="@MsgId"/></xsl:attribute>
   <xsl:value-of select="@Subject"/>
  </xsl:element> -
  <xsl:value-of select="@UserName"/> -
  <xsl:value-of select="@TimeStamp"/>
  [<xsl:value-of select="count(.//Message)"/>]
  <ul>
   <xsl:apply-templates select="./Message"/>
  </ul>
</li>
</xsl:template>
</xsl:stylesheet>


Aqui as coisas são mais simples, mas vamos passo-a-passo:

¤ No primeiro template, baseado no node Messages, criamos o elemento UL principal e aplicamos a segunda template apenas nos itens do grupo que estamos posicionados.
¤ Como você pode perceber, não usamos criamos uma variável GroupId neste template. No entanto, como os documentos XSL são também documentos XML, poderemos alterar o valor do node posteriomente.
¤ No template threads, exibimos os dados de identificação da mensagem (autor, data, etc.) e o link para exibirmos a mensagem.
¤ Um detalhe diferente é a contagem de nodes filhos do node atual. Isso é feito com a função count(.//Message). Traduzindo: do local atual (.) pegue todas os elementos Message, independentemente de o quão aninhados eles estão (//Message).
¤ Criamos um novo elemento <UL> e aplicamos os templates relacionados novamente. Então, recursivamente, os dados vão sendo montados.

Se você está acompanhando o raciocício até agora, ótimo! Só falta montar a rotina para a exibição de mensagens. Ela é um pouco maior que as demais, mas também usa conceitos simples. Vamos comentar cada parte separadamente e em detalhes:

<?xml version="1.0" encoding="iso-8859-1" ?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" omit-xml-declaration="yes" />

<xsl:variable name="UserName"/>
<xsl:variable name="EMail"/>
<xsl:variable name="GroupId"/>
<xsl:variable name="NewMessage">0</xsl:variable>


Cabeçalho padrão, identificando o documento e o namespace usado. Também declaramos algumas variáveis que usaremos posteriormente.

<xsl:template match="Message">
<form action="index.asp?GroupId=@GroupId" method="POST">
  <table border="0" style="border: 1 solid black;" align="center" width="75%">
  <xsl:if test="$NewMessage = 0">
   <tr class="color1">
    <td>Assunto:</td>
    <td><xsl:value-of select="@Subject"/></td>
   </tr>
   <tr class="color2">
    <td>Data:</td>
    <td><xsl:value-of select="@TimeStamp"/><small> (<xsl:value-of select="@IPAddress"/>)</small></td>
   </tr>
   <tr class="color2">
    <td>De:</td>
    <td>
     <xsl:element name="a">
      <xsl:attribute name="href">mailto:<xsl:value-of select="@EMail"/></xsl:attribute>
       <xsl:attribute name="target">_blank</xsl:attribute>
      <xsl:value-of select="@UserName"/>
     </xsl:element>
     <<xsl:value-of select="@EMail"/>>
    </td>
   </tr>
   <tr class="color3">
    <td valign="top">Mensagem:</td>
    <td style="text-align: justify;">
     <xsl:call-template name="replace">
      <xsl:with-param name="content" ><xsl:value-of select="@Body"/></xsl:with-param>
      <xsl:with-param name="character"> </xsl:with-param>
      <xsl:with-param name="replace" />
     </xsl:call-template>
    </td>
   </tr>
  </xsl:if>
  <xsl:call-template name="NewMessage" />
</table>
</form>
</xsl:template>

<xsl:template name="replace" >
<xsl:param name="content" />
<xsl:param name="character"/>
<xsl:param name="replace" />

<xsl:if test="not (contains( $content, $character ))">
  <xsl:value-of select="$content"/>
</xsl:if>

<xsl:if test="contains( $content, $character )">
  <xsl:value-of select="substring-before($content,$character)"/><br />
  <xsl:value-of select="$replace"/>

  <xsl:if test="contains( substring-after($content,$character), $character )">
   <xsl:call-template name="replace">
    <xsl:with-param name="content" ><xsl:value-of select="substring-after($content,$character)"/></xsl:with-param>
    <xsl:with-param name="character"><xsl:value-of select="$character"/></xsl:with-param>
    <xsl:with-param name="replace" ><xsl:value-of select="$replace"/></xsl:with-param>
   </xsl:call-template>
  </xsl:if>
  <xsl:if test="not ( contains( substring-after($content,$character), $character ) )">
   <xsl:value-of select="substring-after($content,$character)"/>
  </xsl:if>
</xsl:if>
</xsl:template>


Este template é o responsável pela exibição da mensagem. Detalhadamente:

Caso a variável NewMessage seja diferente de zero, significa que estamos editando uma nova mensagem, nao subordinada a nenhuma outra (uma nova thread). Então não é exibida a mensagem original, pois nao há nenhuma :-)
Criamos então a estrutura da tabela onde a mensagem estará contida, exibindo os dados do remente da thread anterior.
A única coisa diferente neste template é a rotina de quebra de linhas, exibida em negrito, necessária para a exbição correta da mensagem. Como a mensagem vai ser montada em um <TEXTAREA>, quebras de linhas podem ocorrer e devem ser exibidas como sendo <BR>. Para tanto a segunda template foi contruída. Ela faz uso de funções de manipulação de strings. Para estudar essas funções, baixe o XML SDK.

<xsl:template name="NewMessage">
<tr class="color1">
  <td colspan="2">
   <xsl:if test="$NewMessage = 0">Resposta:</xsl:if>
   <xsl:if test="$NewMessage = 1">Nova mensagem:</xsl:if>
   <a name="new" />
  </td>
</tr>
<tr class="color2">
  <td>Usuário:</td>
  <td>
    <xsl:element name="input">
    <xsl:attribute name="type">text</xsl:attribute>
    <xsl:attribute name="name">UserName</xsl:attribute>
    <xsl:attribute name="size">30</xsl:attribute>
    <xsl:attribute name="value"><xsl:value-of select="$UserName"/></xsl:attribute>
   </xsl:element>
  </td>
</tr>
<tr class="color2">
  <td>Email:</td>
   <td>
    <xsl:element name="input">
    <xsl:attribute name="type">text</xsl:attribute>
    <xsl:attribute name="name">EMail</xsl:attribute>
    <xsl:attribute name="size">30</xsl:attribute>
    <xsl:attribute name="value"><xsl:value-of select="$EMail"/></xsl:attribute>
   </xsl:element>
  </td>
</tr>
<tr class="color2">
  <td>Assunto:</td>
  <td>
   <xsl:element name="input">
    <xsl:attribute name="type">text</xsl:attribute>
    <xsl:attribute name="name">Subject</xsl:attribute>
    <xsl:attribute name="size">30</xsl:attribute>
    <xsl:attribute name="value">
     <xsl:if test="$NewMessage = 0">Re: <xsl:value-of select="@Subject"/></xsl:if>
     <xsl:if test="$NewMessage = 1"/>
    </xsl:attribute>
   </xsl:element>
  </td>
</tr>
<tr class="color3">
  <td valign="top">Mensagem:</td>
   <td><textarea cols="70" rows="10" name="Body"></textarea></td>
</tr>
<tr class="color3">
  <td colspan="2" align="center">
   <xsl:element name="input">
    <xsl:attribute name="type">hidden</xsl:attribute>
    <xsl:attribute name="name">Id</xsl:attribute>
    <xsl:attribute name="value">
     <xsl:if test="$NewMessage = 0"><xsl:value-of select="@MsgId"/></xsl:if>
     <xsl:if test="$NewMessage = 1">-1</xsl:if>
    </xsl:attribute>
    </xsl:element>
   <xsl:element name="input">
    <xsl:attribute name="type">hidden</xsl:attribute>
    <xsl:attribute name="name">GroupId</xsl:attribute>
    <xsl:attribute name="value"><xsl:value-of select="$GroupId"/></xsl:attribute>
    </xsl:element>
   <input type="hidden" name="action" value="new" />
    <xsl:element name="input">
    <xsl:attribute name="type">submit</xsl:attribute>
    <xsl:attribute name="value">
     <xsl:if test="$NewMessage = 0">Postar resposta</xsl:if>
     <xsl:if test="$NewMessage = 1">Postar nova mensagem:</xsl:if>
    </xsl:attribute>
   </xsl:element>
  </td>
</tr>
</xsl:template>
</xsl:stylesheet>


Esse foi um pouco maior que os demais, mas nao envolve nada descomunal. é apenas o trabalho de criar os elementos necessários do form, para enviar a mensagem. Mas, analisando um pouco mais profundamente, podemos ressaltar alguns pontos a comentar:

Nome e usuário são armazenados em variáveis session no script ASP, poupando o usuário de digitá-los em cada nova mensagem.
O primeito trecho destacado em negrito aponta um recurso novo: a definição dos atributos de elementos <INPUT>, baseado no que estams fazendo. Caso a variável NewMessage esteja com o valor 0, estamos respondendo a uma mensagem, então os dados relacionados a ela são exibidos. Do contrário, é mostrado em branco, conforme já haviamos comentado anteriormente.
No segundo trecho em negrito, enviamos o id da mensagem a ser respondida (para criarmos a thread) ou -1, indicando que é uma nova mensagem. Esse recurso também éé usado para indicarmos para o usuário o que ele está fazendo: postando uma nova mensagem ou respondendo a uma já postada.

Na próxima parte, utilizaremos os conceitos estabelecidos aqui, para construirmos o script ASP que será encarregado de construir o fórum e torná-lo operacional.

Fim Parte II

 


CyberWEB Network Ltda.    © Copyright 2000-2024   -   Todos os direitos reservados.
Powered by HostingZone - A melhor hospedagem para seu site
Topo da página