Visão Geral

A Parte 1 desta série forneceu uma visão geral dos recursos e arquitetura do WebSphere Lombardi V7.1 (a partir de agora chamado de Lombardi). Na Parte 2 você aprendeu como usar os recursos mais comuns do Lombardi, incluindo a definição de processo de negócios (BPD) e integração, serviços humanos e de regra, para modelar o processo de amostra. Na Parte 3 você aprendeu como usar alguns recursos avançados do Lombardi para atender aos requisitos mais complexos, incluindo processos aninhados, marcos, mecanismos de evento, manipulação de exceção e exposição dos serviços da web do Lombardi. A Parte 4 abordou como usar o Lombardi Coaches para construir serviços humanos.

Na Parte 5, você aprenderá sobre os recursos avançados do Coach, incluindo ligação de dados dinâmicos e o mecanismo de renderização em tempo de execução, e também como customizar o Coach.

Voltar para parte superior

Ligando dados dinâmicos usando um serviço AJAX

Na Parte 4, você aprendeu que é possível ligar com facilidade um controle de Coach, como texto de entrada, a uma variável de serviço simples. Nesta seção, você aprenderá a preencher um controle de Coach com dados dinâmicos.

Para desenvolver uma lista suspensa usando uma variável de lista, faça o seguinte:

1. Selecione List variable em Based on na seção Dynamic Data da propriedade Presentation .
2. Como mostra a Figura 1, especifique Dynamic Binding na seção Dynamic Data para uma variável que é do tipo dados de lista, por exemplo, tw.local.product[]. Depois disso, é necessário escolher qual propriedade da variável será exibida na lista suspensa para Dynamic Binding Value, por exemplo, ID, e qual propriedade será enviada ao backend como o valor da lista suspensa para Dynamic Binding Display, por exemplo, Name.
   
   Figura 1. Construa uma lista suspensa usando uma variável de lista
   
   
   
3. Também é possível desenvolver uma lista suspensa selecionando Ajax Service na seção Dynamic Data . O serviço Ajax precisa fornecer um controle de texto de entrada, Department, conforme mostra a Figura 2.
   
   Figura 2. Construa uma lista suspensa usando um serviço Ajax
   
   
   

A Figura 3 mostra a implementação de um serviço Ajax. Para usar o serviço Ajax para desenvolver a lista suspensa, a saída do serviço Ajax deve ser uma lista de objetos tw.object.NameValuePair , conforme exibido. tw.local.inputVar é o controle de entrada para o serviço Ajax e tw.local.teamList é a saída do serviço Ajax. Aqui, usamos o valor fixo como exemplo. É possível usar um serviço Ajax para obter dados dinamicamente de uma origem de dados conectada, como um banco de dados.

A Figura 4 ilustra a lista suspensa resultante criada usando o serviço Ajax. Inicialmente, o valor de Department está vazio e a saída do serviço Ajax é No Team Assigned. Quando você seleciona um departamento, o serviço Ajax exibe as equipes correspondentes.

Construindo um controle de tabela usando uma consulta SQL

Nesta seção, você aprenderá a desenvolver um controle de tabela no Coach usando uma consulta SQL. A Figura 5 ilustra o design do Coach. Na área Date Retrieval da propriedade Presentation , a origem de dados padrão é jdbc/TeamWorksDB, que corresponde ao banco de dados TW_PROC no WebSphere Lombardi Express V7.1. É possível acessar o banco de dados TW_PROC usando o nome de usuário padrão, WSLE, e a senha Lombardi. Também é possível acessar o console administrativo do WebSphere Application Server no Lombardi Express, com tw_user como nome de usuário e senha, a fim de definir uma nova origem de dados.

Os nomes de propriedade da estrutura de dados customizada (tw.local.product na Figura 5) precisam corresponder aos nomes de coluna na tabela de banco de dados que você deseja consultar. Caso contrário, seria necessário usar aliases de coluna na instrução SQL a fim de executar a correspondência correta.

A Figura 6 mostra o controle de tabela resultante usando a consulta SQL.

Voltar para parte superior

Customizando os Coaches

Nesta seção, você aprenderá algumas maneiras de customizar os Coaches. Antes de customizar os Coaches do Lombardi, é necessário que você entenda bem como funciona a renderização em tempo de execução do Coach, a fim de garantir que suas modificações produzam os resultados desejados. A renderização em tempo de execução envolve as seguintes tecnologias, como mostra a Figura 7.

• HTML: o cliente do navegador da web renderiza o HTML gerado pelo Coach a partir de sua definição de XML por meio do processamento de XSLT. Você deverá ver o resultado do HTML gerado em seu navegador da web.
• CSS: a folha de estilo em cascata. O arquivo CSS padrão do Lombardi, coach_designer.css, instrui o cliente sobre como renderizar a saída HTML.
• JavaScript®: JavaScript fornece os métodos e funções que implementam os recursos do Coach em tempo de execução, como a adição dinâmica de linhas a uma tabela ou o controle da visibilidade dos controles do Coach. JavaScript está incorporado na definição XML de um Coach e é avaliado pelo mecanismo de tempo de execução antes de ser renderizado para HTML pelo cliente do navegador da web. O JavaScript do lado do cliente e do lado do servidor são usados para renderizar Coaches.
• XML: o design de um Coach é descrito em Extensible Markup Language (XML). À medida que você arrasta seções e controles até um Coach, o Lombardi gera automaticamente a definição XML do Coach.

  É possível visualizar o XML enquanto constrói um Coach, clicando no ícone Code View na barra de ferramentas.

• XSLT: o Extensible Stylesheet Language Transformation (XSLT) transforma a definição XML na forma HTML do tempo de execução. O Extensible Stylesheet Language renderiza um scriptlet do lado do servidor, executado para gerar o HTML.

Melhores práticas para customização de Coaches

Em geral, você deve customizar os Coaches usando os mecanismos disponíveis na interface do Designer, por exemplo, usando um CSS customizado por meio da substituição do CSS por um Coach ou controle específico. Se as substituições disponíveis no Designer não atenderem às suas necessidades, e você estiver satisfeito com o XML, use o atributo cssStyleOverride . Para usar um CSS customizado para todos os Coaches, é necessário acessar e editar o CSS padrão do Coach, localizado no diretório de instalação do Lombardi.

Se essas opções de customização de CSS não forem uma solução viável para atender às suas necessidades de design, você também poderá editar o arquivo de transformação CoachDesigner.xsl para customizar o HTML renderizado. Se você editar o arquivo CoachDesigner.xsl e perceber que suas alterações não estão sendo aplicadas aos Coaches em desenvolvimento, abra seu Coach, clique na seção superior do Coach (chamada Lombardi Coach por padrão), clique na opção Coach nas propriedades e clique em Transform Coach XML.

Se você modificar os arquivos XSLT ou JavaScript, deverá estar ciente das seguintes implicações:

• Não tente usar esses métodos a menos que esteja bastante familiarizado com XSL e JavaScript.
• Os arquivos XSLT e JavaScript são substituídos durante o processo de atualização do Lombardi, sem oportunidade de detectar ou fundir possíveis customizações. Se você fizer modificações nesses arquivos, deverá fundir manualmente suas customizações após cada atualização.
• É necessário fazer modificações em todos os ambientes do Lombardi, incluindo os ambientes de desenvolvimento, de teste, de produção e quaisquer outros nos quais você instalará e executará os processos.

Voltar para parte superior

Customizando a exibição das páginas de Coach

Na Parte 4, você aprendeu a desenvolver um serviço humano usando Coaches e a ligar dados dinâmicos. Esta seção descreve apenas algumas das maneiras para customizar os Coaches.

• É possível alterar a forma com a qual as colunas são exibidas em uma página de Coach usando as propriedades de Section . Por exemplo, é possível alterar o número de colunas e a largura da coluna, como mostra a Figura 8.
  
  Figura 8. Customize a exibição da coluna
  
  
  
• É possível criar um campo de entrada em uma página de Coach necessária ou especificar se deve mostrá-lo ou não, customizando as propriedades de Visibility do campo. Para fazer isso, marque Override Parent Visibility e selecione o Default Visibility desejado, como Required (full access) for everyone, como mostra a Figura 9. Também é possível usar essa propriedade para ocultar alguns campos.
  
  Figura 9. Crie o campo de entrada necessário
  
  
  

  A Figura 10 mostra a página Coach com o campo necessário resultante.

  
  
  Figura 10. Resultado do campo de entrada necessário
  
  
  
• Finalmente, é possível substituir os estilos CSS padrão para controles de Coach configurando as propriedades de Customization dos controles.

Voltar para parte superior

Customizando os controles HTML

É possível arrastar e soltar um controle HTML customizado da paleta até a área de design de um Coach e, em seguida, adicionar qualquer código customizado de JavaScript, CSS e HTML às propriedades de Presentation . É bastante útil renderizar o conteúdo HTML de acordo com o valor do tempo de execução da variável do processo ou do serviço. Além disso, é útil editar a variável do processo ou do serviço no bloco Custom HTML. Esta seção mostra como conseguir isso.

Vamos supor que você definiu uma variável String em nosso processo ou serviço chamado product. É possível exibir seu valor no bloco Custom HTML usando <# = tw.local.product #>

Também é possível usar <# #> para obter o valor da variável do processo. A diferença é que o resultado da expressão <#= #> é colocado em texto, enquanto o resultado da expressão <# #> não é colocado em texto, mas computado dinamicamente. Isso é parecida com a forma com a qual <%= %> e <% %> funcionam em JSP.

Se você quiser editar a variável do processo em Custom HTML, será possível modificar o seguinte elemento de HTML:

O truque é perceber que o Coach usa formulários HTML para passar informações de volta ao Lombardi, e o atributo de nome de cada controle de formulário é usado para ligar seu valor a uma variável do Lombardi. Defina o nome do controle como a variável do Lombardi (substitua "." por "#") e a variável do Lombardi será atualizada quando o formulário for enviado.

Uma lista de variáveis simples, como product , é redefinida como uma lista do tipo String. Dessa forma, tw.local.product[0] pode ser representado como tw#local#product#0, como o atributo de nome do elemento de formulário.

Uma lista de variáveis complexas, tw.local.product[0].amount, por exemplo, pode ser representada como tw#local#product#0#amount.

Executando uma customização avançada do Coach

Em geral, você deve customizar os Coaches usando os mecanismos disponíveis na interface do Designer, por exemplo, usando um CSS customizado por meio da substituição do CSS por um Coach ou controle específico. Se as substituições disponíveis no Designer não atenderem às suas necessidades, será possível usar o atributo cssStyleOverride, que exige uma familiaridade moderada com Extensible Markup Language (XML). Para usar um CSS customizado para todos os Coaches, é necessário acessar e editar o CSS padrão do Coach, localizado no diretório de instalação do Lombardi.

Se as opções de customização de CSS não forem uma solução viável para atender às suas necessidades de design, você poderá editar o arquivo de transformação CoachDesigner.xsl para customizar o HTML renderizado. Se você editar o arquivo CoachDesigner.xsl e perceber que essas alterações não estão sendo aplicadas nos Coaches em desenvolvimento, abra seu Coach, clique na seção de nível superior do Coach (chamada Lombardi Coach por padrão), clique na opção do Coach nas propriedades e clique no botão Transform Coach XML.

Se você decidir modificar os arquivos XSLT ou JavaScript, deverá estar ciente das seguintes implicações:

• Não tente usar esses métodos a menos que esteja bastante familiarizado com Extensible Stylesheet Language (XSL) e JavaScript.
• Os arquivos de transformação de XSL (XSLT) e JavaScript são substituídos durante o processo de atualização do Lombardi, sem oportunidade de detectar ou fundir possíveis customizações. Se você tiver feito modificações nesses arquivos, deverá fundir manualmente suas customizações após cada atualização.
• É necessário fazer modificações em todos os ambientes do Lombardi, incluindo os ambientes de desenvolvimento, de teste, de produção e quaisquer outros nos quais você instalará e executará os processos.

Voltar para parte superior

Conclusão

Neste artigo, você aprendeu sobre alguns recursos de customização do Coach, incluindo ligação de dados dinâmicos, customização da exibição das páginas do Coach e criação de controles HTML customizados. Também aprendeu sobre a renderização em tempo de execução dos Coaches. Na Parte 6, você aprenderá como usar KPIs e relatórios do Lombardi para realizar o monitoramento e a análise de desempenho.

Recursos

• Centro de Informações do IBM WebSphere Lombardi Edition V7.1
  
  
• WebSphere Lombardi edition
  
  
• Website do Business Process Modeling Notation (BPMN)
  
  
• Introdução ao BPMN (PDF)
  
  
• BPMN e Gerenciamento de processos de negócios
  
  
• Zona de BPM do developerWorks
  
  
• IBM BPM Journal
  
  

Sobre os autores

Xiao Xing Liang é engenheiro de software e trabalha para o Centro de Design SOA no Laboratório de Desenvolvimento na China. Ele é um desenvolvedor certificado pela IBM para o WebSphere Enterprise Developer e para o SOA Solution Designer. Seu foco atual está no controle SOA e em tópicos relacionados, incluindo WebSphere Service Registry and Repository, Rational Asset Manager, Tivoli Application Dependency Discovery Manager e Tivoli Change and Configuration Management Database.

Chang Hua Sun é engenheiro da equipe de software da equipe de otimização de serviço e desempenho dos negócios dentro do IBM Software Group, no qual ele desenvolve tecnologias e soluções de SOA e BPM.

Xi Ning Wang é engenheiro de equipe de software e líder de desenvolvimento de infraestrutura em nuvem, IBM SOA Advanced Technologies, IBM Software Group. Ele já projetou e desenvolveu tecnologias de SOA e soluções em projetos importantes. Atualmente, está focado nas áreas de computação em nuvem e solução de segmento de mercado. Ele foi designado como um autor contribuinte para o IBM developerWorks em 2009.

Classificar este artigo

Comentários

Voltar para parte superior

Índice

• Visão Geral
• Ligando dados dinâmicos usando um serviço AJAX
• Customizando os Coaches
• Customizando a exibição das páginas de Coach
• Customizando os controles HTML
• Conclusão
• Recursos
• Sobre os autores
• Comentários

Conheça a IBM da sua cidade

A IBM está mais perto do que você imagina!

---

Saiba mais