O projeto Commons UI é responsável por prover a estrutura da camada de visualização para todos os projetos que utilizam-se da arquitetura na camada de apresentação. Esta estrutura é composta, internamente, por bibliotecas como: AngularJS, jQuery e Atlassian AUI. Em conjunto, todas as bibliotecas agregam componentes, estruturação da apresentação, modelo de dados de fácil utilização com data-biding bidirecional, internacionalização, etc. Nesta seção veremos como o projeto Commons UI trabalha internamente e a sua intervenção no desenvolvimento da camada de visualização.
Conforme a imagem abaixo, o projeto é estruturado por pastas, cada qual refletindo a responsabilidade de seus componentes. Como este projeto é inteiramente composto de arquivos Javascript, não existem dependencias de outros projetos.
Nesta seção abordaremos como cada provider disponível na arquitetura funciona internamente. Providers são objetos expostos para toda a aplicação, passíveis de injeção e podem ser utilizados dentro de um bloco de configuração do AngularJS. Para maiores informações leia a documentação oficial sobre providers.
A arquitetura utiliza apenas um provider, o MessageProvider. Este é um componente do AngularJS que pode ser configurado em um bloco de configuração, como por exemplo URLs de validação e mensagens, e oferece uma interface pública para componentes do AngularJS (controllers, directives, filters). Abaixo temos um exemplo da utilização do MessageProvider na configuração de URLs de validação e mensagens.
Tem como responsabilidade buscar, armazenar mensagens (de validação ou descrição) e controlar o fluxo utilizando-se de listeners para avisar outros componentes de que a a busca de mensagens foi realizada com sucesso.
A partir de uma chamada da principal directive, tl-object, é disparada uma requisitção HTTP para um método genérico da arquitetura para buscar mensagens internacionalizadas. Esta funcionalidade baseia-se no nome do objeto passado para a directive tl-object para buscar as mensagens. Mensagens são compostas de labels, descriptions, validations, etc.
Nesta seção abordaremos como cada service disponível na arquitetura funciona internamente.
Nesta seção abordaremos como cada directive disponível na arquitetura funciona internamente.