NPDD/Baobáxia/Infra Interface
(→Estrutura básica do Backbone) |
(adicionando infos sobre as rotas) |
||
Linha 40: | Linha 40: | ||
/repository | /repository | ||
/templates | /templates | ||
+ | |||
+ | |||
+ | === Fluxo do funcionamento do backbone === | ||
+ | '''(A) Funcionamento das rotas''' | ||
+ | |||
+ | 1) index.html | ||
+ | Carrega o main.js (inicializador do backbone) e a biblioteca require.js (biblioteca de carregador de bibliotecas) | ||
+ | <script data-main="js/main" src="js/lib/require.js"></script> | ||
+ | |||
+ | 2) main.js | ||
+ | Seta as configurações do require, e define os caminhos das bibliotecas utilizadas (jquery, underscore, backbone etc), e inicializa a aplicação (app.js) | ||
+ | |||
+ | 3) app.js | ||
+ | Chamado pelo main.js, diz quais libs serão usadas (jquery, underscore, backbone e router.js) e chama o router.js | ||
+ | |||
+ | 4) router.js | ||
+ | Configuração do mapa de rotas (routes) e funções de ativação das rotas | ||
+ | |||
+ | '''(B) Funcionamento das rotas''' | ||
+ | |||
+ | 1) Ao receber uma rota, encaminha para a função. Ex.: | ||
+ | a) http://localhost/baobaxia_2/baobaxia/tests/backbone-requirejs_0/#redemocambos/dandara | ||
+ | -> enviará para a rota getMucua | ||
+ | b) http://localhost/baobaxia_2/baobaxia/tests/backbone-requirejs_0/#redemocambos/dandara/bbx | ||
+ | -> enviará para rota listBbxCommands | ||
+ | etc... |
Edição das 15h14min de 15 de outubro de 2013
Conteúdo |
Infraestrutura da Interface
Backbone.js
Backbone.js (http://backbonejs.org/ é uma biblioteca de Javascript para construção de interfaces, toda baseada em leitura de dados em arquivos .json, oferecida por uma API REST.
Por isso, ela está pegada na estrutura da API REST
Estrutura básica do Backbone
/base index /js app.js main.js router.js /collections /media MediaCollection.js /mocambola ... /mucua ... /repository ... /lib backbone-amd.js jquery-min.js require.js underscore-amd.js /models MediaModel.js Mocambola.js Mucua.js Repository.js /views /media /mocambola /mucua /repository /templates
Fluxo do funcionamento do backbone
(A) Funcionamento das rotas
1) index.html Carrega o main.js (inicializador do backbone) e a biblioteca require.js (biblioteca de carregador de bibliotecas) <script data-main="js/main" src="js/lib/require.js"></script>
2) main.js Seta as configurações do require, e define os caminhos das bibliotecas utilizadas (jquery, underscore, backbone etc), e inicializa a aplicação (app.js)
3) app.js Chamado pelo main.js, diz quais libs serão usadas (jquery, underscore, backbone e router.js) e chama o router.js
4) router.js Configuração do mapa de rotas (routes) e funções de ativação das rotas
(B) Funcionamento das rotas
1) Ao receber uma rota, encaminha para a função. Ex.: a) http://localhost/baobaxia_2/baobaxia/tests/backbone-requirejs_0/#redemocambos/dandara -> enviará para a rota getMucua b) http://localhost/baobaxia_2/baobaxia/tests/backbone-requirejs_0/#redemocambos/dandara/bbx -> enviará para rota listBbxCommands etc...