Aumentando a produtividade com JSF e Jboss Seam - XSeam lançado!

Vocês já reparam que a maioria dos formulários JSF são bem repetitivos? A maioria das propriedades são sempre compostas por [Label + Input + Error]. Isto sem contar validators e (ou) converters que sejam necessários.

Ex.:

<h:outputLabel value="Label" for="input" />
    <h:inputText id="input" value="#{meuBack.propriedade}" >
        <f:convertNumber />
        <f:validateLength minimum="1" maximum="10"/>
        <a4j:support event="onblur" reRender="input"/>
    </h:inputText>
    <h:message for="input" />

A coisa pode ficar ainda pior se além dos converters e validators, for utilizado ainda outras extensões como a4j, javascript, css. etc. Fazer isto para cada propriedade que existe na tela é realmente entendiante e improdutivo. Diante disto, o Jboss Seam aproveitou a funcionalidade de composição do Facelets (já falado neste blog) e criou um template em seus projetos (tanto os gerados pelo seam-gen, quanto pelo Jboss Tools) chamado edit.xhtml que evita a repetição de tags comuns permitindo que funcionalidades como sinalizar (*) que um campo é requerido e destacar mensagens de erros sejam fácilmente "plugadas" ao campo através de um decorator.

Para usa-lo basta referenciar este template e definir o conteúdo:

<s:decorate template="layout/edit.xhtml">
  <ui:define name="label">Nome:</ui:define>
  <h:inputText value="#{pessoa.nome}" required="true" /> 
</s:decorate>

Desta maneira, o campo será renderizado como a figura abaixo. Reparem que o Nome aparece com um asterisco na frente apenas pelo fato do campo ser marcado como required="true". Além disto não precisamos fazer nenhuma definição de css, referenciar a figura (ao lado da mensagem de erro) ou mesmo lembrar de colocar o pois tudo isto veio do template.

Aproveitando o assunto: É possível reduzir ainda mais o código através do "poder" do facelets e ter o mesmo efeito acima com apenas a tag:

<x:inputText label="Nome:" value="#{pessoa.nome}"  name="nome" required="true"/>

Digamos agora, que se queira utilizar uma máscara para formatação (cpf, data, etc) e poder validar o campo (via hibernate-validator + ajax) ao sair do campo com apenas uma tag. Ex:

<x:inputText label="CPF:" value="#{pessoa.cpf}" ajaxValidation="true" name="cpf" mask="999.999.999-99" required="true" />

Com a intenção de atender grande parte dos formulários web, trazendo produtividade e agregando outras funcionalidades como:

1. Validação server-side com ajax
2. Máscara javascript (com JQuery)
3. Retorno de String nula, quando o formulário é submetido com um valor não preenchido
4. Tradução de todas as mensagens do Jboss Seam para pt_BR

foi dado início ao projeto XSeam.

Sobre o XSeam

Este projeto começou como uma iniciativa de João Paulo Viragine, que usou uma série de componentes facelets voltados ao Jboss Seam visando desenvolver projetos para seus clientes. Com base neste conceito e na adesão e interesse de alguns clientes (que já usam os componentes) e parceiros; é que o XSeam foi "oficializado" como um projeto Open Source.

O objetivo deste projeto é permitir que todos os esforços isolados na construção de componentes visuais (Facelets - Html, CSS, Javascript, RichFaces, etc) e não visuais (Componentes Seam, Hibernate validators, Converters) sejam concentradas neste projeto.

A URL do projeto é https://github.com/rafabene/XSeam2 e está disponível a versão 0.2 (em breve devo comentar outras funcionalidades já inclusas)

A medida que novas funcionalidades forem adicionadas, a documentação for sendo elaborada e houver novos releases, vou postando aqui no Blog.