Histórico da Página
...
No que diz respeito a interação do usuário com as views e das views com os serviços, temos a seguinte estruturação:
Todo este modelo acima é baseado no RequireJS para realização do carregamento dos recursos e dependências sob demandada, evitando overloads desnecessários. Sendo assim, temos dois pontos de entrada:
...
- main.js: Arquivos de script simples de configuração do RequireJS no qual são declarados alias para outras bibliotecas e injeção de bibliotecas e componentes de acordo com necessidades de cada biblioteca/componente;
- index.js: Centro da aplicação, neste é instanciado a aplicação AngularJS e os AngularJS Controllers necessários para funcionamento e gerenciamento das views. Neste também realizamos as demais configurações obrigatórias e opcionais para o TOTVS | HTML Framework:
- events.js: arquivo simples para documentação e especificação de eventos a serem disparados pela aplicação centralizadora;
- config-states.js: responsável por alterar a configuração de mapeamento de rotas do AngularJS para atender as necessidades da aplicação. As rotas estáticas devem ser adicionadas diretamente ao $stateProvider, as demais views da aplicação irão ser carregadas por exceção através do 'otherwise' do $urlRouterProvider.
- config-http.js: alguns provedores de serviços (produtos) podem especificar um padrão para retorno de todas as chamadas de serviços. Nestes casos é preciso customizar o retorno das requisições HTTP para que fiquem adequadas ao Padrão REST;
- httpsfactory-http-interceptors.js: Responsável por interceptar as requisições HTTP e realizar alguns controles como quantidade de chamadas realizadas ao servidor para apresentação da tela de carregamento, timeout de sessão, entre outros;
- filter-i18n.js: definição de um AngularJS Filter para tradução, este deve ser implementado de acordo com as especificações e necessidade de cada aplicação ou produto.
- notificationservice-notify.js: Especificação de um AngularJS Controller genérico para controle de notificações. Este serviço é responsável por apresentar mensagens e notificações ao usuário loagado no sistema.,
- events.js: arquivo simples para documentação e especificação de eventos a serem disparados pela aplicação centralizadora;
...
- components.js: bibliotecas de componentes de layout e input de dados para utilização nos programas; Normalmente adicionado como dependencia para o AngularJS Application;
- totvs-resource.js: é um wrapper para o $resource para ser customizado futuramente, por exemplo para consumir SOAP ao inves de REST;
- totvs-custom.js: implementa o serviço e diretivas para permitir que as telas HTML sejam customizaveis;
Para cada tela que será aberta, normalmente haverão os seguintes recursos:
- Tela.js: Neste arquivo, que é o primeiro arquivo a ser carregado pela aplicação centralizadora, deverá conter a definição dos estados da Tela (view)view-states.js: definição dos estados de cada view. Neste arquivo é realizado o relacionamento entre a URL (que será utilizada para chamar a view) e a view a ser iniciada; Este mapeamento é iniciado através da configuração realizada no states.js. Por padrão toda view é aberta no state de 'start'; Para isto é utilziado o componente AngularJS UI Router, o qual permite que sejam elaboradas views com sub-views, possibilitando o desenvolvimento de telas mais flexíveis;
- viewTela-services.js: script no qual são declarados os AngularJS Controllers e AngularJS Services para utilização na aplicaçãotela. Normalmente nas documentações de angular e exemplos na internet, o registro dos serviços, controllers e etc... são fetos diretamente na chamada do método correspondente utilizando funções anônimas. Para melhorar a legibilidade do código, definimos os todas essas funções em funções nomeadas e registramos todas ao final do arquivo;
- Tela.*.html: são os arquivos HTML da tela que serão mostrados no browser para representar cada state configurado anteriormente, quando a tela é mostrada para o usuario, o controller configurado no state é associado com essa tela automaticamente.
Visão Geral
Import HTML Content
Conteúdo das Ferramentas
Tarefas