Commit 16e8e39b473b3fa0bd4ba6f9d754ab3c8d730dcd
1 parent
605dc1c5
Exists in
master
and in
8 other branches
refact Service finshed
Showing
15 changed files
with
395 additions
and
566 deletions
Show diff stats
@@ -0,0 +1,7 @@ | @@ -0,0 +1,7 @@ | ||
1 | +- Erro com `lwip` ou `make: g++: Command not found` | ||
2 | + - Solução: | ||
3 | + 1. Instalar dependências do g++: `sudo apt-get install build-essential g++` | ||
4 | + 2. Reinstalar o sprity: | ||
5 | + 1. desinstalar: ``npm uninstall sprity`` | ||
6 | + 2. limpar cache: ``npm cache clear`` | ||
7 | + 3. instalar: ``npm install sprity`` | ||
0 | \ No newline at end of file | 8 | \ No newline at end of file |
src/app/components/article-box/article-box.directive.js
@@ -27,20 +27,15 @@ | @@ -27,20 +27,15 @@ | ||
27 | } | 27 | } |
28 | 28 | ||
29 | if(!vm.category){ | 29 | if(!vm.category){ |
30 | - vm.category = vm.article.categories[0]; | 30 | + throw { name: 'NotDefined', message: 'The attribute "category" is undefined.'}; |
31 | } | 31 | } |
32 | 32 | ||
33 | - if(!vm.banner && vm.article.image){ | ||
34 | - vm.banner = { | 33 | + if(!vm.image && vm.article.image){ |
34 | + vm.image = { | ||
35 | src: $rootScope.basePath + vm.article.image.url, | 35 | src: $rootScope.basePath + vm.article.image.url, |
36 | alt: 'Imagem de destaque do conteúdo' | 36 | alt: 'Imagem de destaque do conteúdo' |
37 | }; | 37 | }; |
38 | } | 38 | } |
39 | - | ||
40 | - // if(vm.article.color && !vm.article.bgColor){ | ||
41 | - // // 15% more darker | ||
42 | - // vm.article.colorDarker = window.ColorLuminance(vm.article.color, 0.15); | ||
43 | - // } | ||
44 | }; | 39 | }; |
45 | 40 | ||
46 | ArticleBoxController.prototype.showContent = function () { | 41 | ArticleBoxController.prototype.showContent = function () { |
@@ -57,7 +52,8 @@ | @@ -57,7 +52,8 @@ | ||
57 | restrict: 'E', | 52 | restrict: 'E', |
58 | templateUrl: 'app/components/article-box/article-box.html', | 53 | templateUrl: 'app/components/article-box/article-box.html', |
59 | scope: { | 54 | scope: { |
60 | - article: '=' | 55 | + article: '=', |
56 | + category: '=' | ||
61 | }, | 57 | }, |
62 | controller: ArticleBoxController, | 58 | controller: ArticleBoxController, |
63 | controllerAs: 'vm', | 59 | controllerAs: 'vm', |
src/app/components/article-box/article-box.html
1 | <article class="article-box" ng-click="vm.showContent()" ng-class="vm.category.slug"> | 1 | <article class="article-box" ng-click="vm.showContent()" ng-class="vm.category.slug"> |
2 | <div> | 2 | <div> |
3 | - <h2 class="article-box--category">{{vm.category.name}}</h2> | 3 | + <h2 class="article-box--category">{{ ::vm.category.name }}</h2> |
4 | <div class="article-box--image-wrapper"> | 4 | <div class="article-box--image-wrapper"> |
5 | - <!-- <img class="article-box--image img-responsive" ng-src="{{vm.banner.src}}" alt="{{vm.banner.alt}}" /> --> | ||
6 | - <div class="article-box--image" ng-style="{'background-image':'url( {{vm.banner.src}} )'}"></div> | 5 | + <div class="article-box--image" ng-style="{ 'background-image' : 'url({{ vm.image.src }})' }"></div> |
7 | </div> | 6 | </div> |
8 | <div class="article-box--title"> | 7 | <div class="article-box--title"> |
9 | <h1>{{::vm.article.title}}</h1> | 8 | <h1>{{::vm.article.title}}</h1> |
src/app/components/article-grid/article-grid.directive.js
@@ -9,7 +9,7 @@ | @@ -9,7 +9,7 @@ | ||
9 | function articleGrid() { | 9 | function articleGrid() { |
10 | 10 | ||
11 | /** @ngInject */ | 11 | /** @ngInject */ |
12 | - function ArticleGridController($scope, $rootScope, $element, ArticleService, $location, $filter, $log) { | 12 | + function ArticleGridController($scope, $rootScope, $element, $location, $filter, $log) { |
13 | $log.debug('ArticleGridController'); | 13 | $log.debug('ArticleGridController'); |
14 | 14 | ||
15 | // alias | 15 | // alias |
@@ -19,7 +19,6 @@ | @@ -19,7 +19,6 @@ | ||
19 | vm.$scope = $scope; | 19 | vm.$scope = $scope; |
20 | vm.$rootScope = $rootScope; | 20 | vm.$rootScope = $rootScope; |
21 | vm.$element = $element; | 21 | vm.$element = $element; |
22 | - vm.ArticleService = ArticleService; | ||
23 | vm.$location = $location; | 22 | vm.$location = $location; |
24 | vm.$filter = $filter; | 23 | vm.$filter = $filter; |
25 | vm.$log = $log; | 24 | vm.$log = $log; |
@@ -27,280 +26,29 @@ | @@ -27,280 +26,29 @@ | ||
27 | 26 | ||
28 | // initialization | 27 | // initialization |
29 | vm.init(); | 28 | vm.init(); |
29 | + vm.loadData(); | ||
30 | + vm.attachListeners(); | ||
30 | } | 31 | } |
31 | 32 | ||
32 | ArticleGridController.prototype.init = function() { | 33 | ArticleGridController.prototype.init = function() { |
33 | - var vm = this; | ||
34 | - | ||
35 | - vm.articles = null; | ||
36 | - vm.filtredArticleList = null; | ||
37 | - vm.categories = null; | ||
38 | - | ||
39 | - vm.orderCriteries = [ | ||
40 | - { label: 'Título', name: 'titulo' }, | ||
41 | - { label: 'Tema', name: 'tema' }, | ||
42 | - { label: 'Aleatório', name: 'aleatorio' } | ||
43 | - ]; | ||
44 | - | ||
45 | - vm.search = vm.$location.search(); | ||
46 | - | ||
47 | - // Add initial values for the filter | ||
48 | - vm.query = (vm.search && vm.search.filtro) ? vm.search.filtro : null; | ||
49 | - vm.limitTo = (vm.search && vm.search.limite) ? parseInt(vm.search.limite, 10) : vm.defaultLimit; | ||
50 | - vm.orderCriteria = (vm.search && vm.search.ordem) ? { name: vm.search.ordem } : null; | ||
51 | - vm.reverse = (vm.search && vm.search.reverso) ? true : false; | ||
52 | - | ||
53 | - // vm.selectedCategory = (vm.search && vm.search.tema) ? vm.getCategoryBySlug(vm.search.tema) : null; | ||
54 | - if (vm.search && vm.search.tema) { | ||
55 | - var slug = vm.search.tema; | ||
56 | - vm.ArticleService.getCategoryBySlug(slug, function(category){ | ||
57 | - vm.selectedCategory = category; | ||
58 | - }, function(error){ | ||
59 | - vm.$log.error('Error when try to "getCategoryBySlug"', error); | ||
60 | - }); | ||
61 | - } | ||
62 | - | ||
63 | - if (!angular.equals({}, vm.search)) { | ||
64 | - var $el = vm.$element; | ||
65 | - angular.element('body').animate({scrollTop: $el.offset().top}, 'slow'); | ||
66 | - } | ||
67 | - | ||
68 | - vm.loadData(function(){ | ||
69 | - vm.filtredArticleList = vm.getFiltredArticles(); | ||
70 | - }); | ||
71 | - | ||
72 | - vm.attachListeners(); | ||
73 | - }; | ||
74 | - | ||
75 | - ArticleGridController.prototype.attachListeners = function() { | ||
76 | - var vm = this; | ||
77 | - | ||
78 | - // update window location params | ||
79 | - vm.$scope.$on('change-selectedCategory', function(event, selectedCategory){ | ||
80 | - vm.selectedCategory = selectedCategory; | ||
81 | - }); | ||
82 | - | ||
83 | - vm.$scope.$watch('vm.query', function(newValue/*, oldValue*/) { | ||
84 | - vm.search.filtro = newValue ? newValue : null; | ||
85 | - vm.$location.search('filtro', vm.search.filtro); | ||
86 | - if(vm.search.filtro){ | ||
87 | - vm.limitTo = vm.articles.length; | ||
88 | - }else{ | ||
89 | - vm.limitTo = vm.defaultLimit; | ||
90 | - } | ||
91 | - vm.filtredArticleList = vm.getFiltredArticles(); | ||
92 | - }); | ||
93 | - | ||
94 | - vm.$scope.$watch('vm.limitTo', function(newValue/*, oldValue*/) { | ||
95 | - vm.search.limite = (newValue && newValue !== vm.defaultLimit) ? newValue : null; | ||
96 | - vm.$location.search('limite', vm.search.limite); | ||
97 | - vm.filtredArticleList = vm.getFiltredArticles(); | ||
98 | - }); | ||
99 | - | ||
100 | - vm.$scope.$watch('vm.selectedCategory', function(newValue/*, oldValue*/) { | ||
101 | - vm.search.tema = newValue ? newValue.slug : null; | ||
102 | - vm.$location.search('tema', vm.search.tema); | ||
103 | - if(vm.search.tema){ | ||
104 | - vm.limitTo = vm.articles.length; | ||
105 | - }else{ | ||
106 | - vm.limitTo = vm.defaultLimit; | ||
107 | - } | ||
108 | - vm.filtredArticleList = vm.getFiltredArticles(); | ||
109 | - }); | ||
110 | - | ||
111 | - vm.$scope.$watch('vm.orderCriteria', function(newValue/*, oldValue*/) { | ||
112 | - vm.search.ordem = (newValue && newValue.name) ? newValue.name : null; | ||
113 | - vm.$location.search('ordem', vm.search.ordem); | ||
114 | - vm.filtredArticleList = vm.getFiltredArticles(); | ||
115 | - }); | ||
116 | - | ||
117 | - vm.$scope.$watch('vm.reverse', function(newValue/*, oldValue*/) { | ||
118 | - vm.search.reverso = newValue ? newValue : null; | ||
119 | - vm.$location.search('reverso', vm.search.reverso); | ||
120 | - vm.filtredArticleList = vm.getFiltredArticles(); | ||
121 | - }); | ||
122 | - | ||
123 | - }; | ||
124 | - ArticleGridController.prototype.loadData = function(cb) { | ||
125 | - var vm = this; | ||
126 | - | ||
127 | - var articlesLoaded = false; | ||
128 | - var categoriesLoaded = false; | ||
129 | - | ||
130 | - vm.ArticleService.getPrograms(function(programs){ | ||
131 | - vm.articles = programs; | ||
132 | - articlesLoaded = true; | ||
133 | - endLoad(); | ||
134 | - }); | ||
135 | - | ||
136 | - vm.ArticleService.getCategories(function(categories){ | ||
137 | - vm.categories = categories; | ||
138 | - categoriesLoaded = true; | ||
139 | - endLoad(); | ||
140 | - }); | ||
141 | - | ||
142 | - function endLoad () { | ||
143 | - if(articlesLoaded && categoriesLoaded){ | ||
144 | - cb(); | ||
145 | - } | ||
146 | - } | ||
147 | - }; | ||
148 | - | ||
149 | - ArticleGridController.prototype.resetFilterValues = function() { | ||
150 | - var vm = this; | ||
151 | - | ||
152 | - vm.query = null; | ||
153 | - vm.limitTo = vm.defaultLimit; | ||
154 | - vm.selectedCategory = null; | ||
155 | - vm.orderCriteria = null; | ||
156 | - }; | ||
157 | - | ||
158 | - ArticleGridController.prototype.getIconClasses = function(category) { | ||
159 | - var vm = this; | ||
160 | - | ||
161 | - vm.$log.debug('[TODO] getIconClasses of category:', category); | ||
162 | - return 'glyphicon glyphicon-exclamation-sign'; | ||
163 | - }; | ||
164 | - | ||
165 | - ArticleGridController.prototype.getCategoryBySlug = function(categorySlug) { | ||
166 | - var vm = this; | ||
167 | - var result = null; | ||
168 | - | ||
169 | - angular.forEach(vm.categories, function(value/*, key*/) { | ||
170 | - if (value.slug === categorySlug) { | ||
171 | - result = value; | ||
172 | - } | ||
173 | - }); | ||
174 | - | ||
175 | - return result; | 34 | + // var vm = this; |
35 | + // vm.programs = null; // scope var | ||
176 | }; | 36 | }; |
177 | 37 | ||
178 | - ArticleGridController.prototype.showAll = function($event) { | ||
179 | - var vm = this; | ||
180 | - | ||
181 | - $event.stopPropagation(); | ||
182 | - | ||
183 | - vm.resetFilterValues(); | ||
184 | - vm.limitTo = vm.articles.length; | 38 | + ArticleGridController.prototype.loadData = function() { |
39 | + // var vm = this; | ||
185 | }; | 40 | }; |
186 | 41 | ||
187 | - ArticleGridController.prototype.getFiltredArticles = function() { | ||
188 | - var vm = this; | ||
189 | - | ||
190 | - if(!vm.articles){ | ||
191 | - vm.$log.warn('No articles loaded yet. Abort.'); | ||
192 | - return null; | ||
193 | - } | ||
194 | - | ||
195 | - var input = vm.articles; | ||
196 | - var output = input; | ||
197 | - var query = vm.query; | ||
198 | - var selectedCategory = vm.selectedCategory; | ||
199 | - var orderCriteria = vm.orderCriteria ? vm.orderCriteria : { name : 'aleatorio'}; | ||
200 | - var filter = vm.$filter('filter'); | ||
201 | - var orderBy = vm.$filter('orderBy'); | ||
202 | - var limitTo = vm.$filter('limitTo'); | ||
203 | - var limit = vm.limitTo ? vm.limitTo : 4; | ||
204 | - | ||
205 | - if (selectedCategory) { | ||
206 | - output = _filterByCategory(output, selectedCategory); | ||
207 | - } | ||
208 | - | ||
209 | - if (query) { | ||
210 | - output = filter(output, query, false); | ||
211 | - } | ||
212 | - | ||
213 | - switch (orderCriteria.name) { | ||
214 | - case 'titulo': | ||
215 | - output = orderBy(output, 'title', vm.reverse); | ||
216 | - break; | ||
217 | - case 'tema': | ||
218 | - output = orderBy(output, 'categories[0].name', vm.reverse); | ||
219 | - break; | ||
220 | - case 'more_participants': | ||
221 | - vm.$log.info('Criteria not handled yet: ', orderCriteria); | ||
222 | - break; | ||
223 | - case 'aleatorio': | ||
224 | - // shuffling | ||
225 | - // if (!vm._isShuffled){ | ||
226 | - output = vm.filterShuffle(output); | ||
227 | - // vm._isShuffled = true; | ||
228 | - // } | ||
229 | - | ||
230 | - if (vm.reverse) { | ||
231 | - output = output.slice().reverse(); | ||
232 | - } | ||
233 | - | ||
234 | - break; | ||
235 | - default: | ||
236 | - vm.$log.warn('Criteria not matched: ', orderCriteria); | ||
237 | - break; | ||
238 | - } | ||
239 | - | ||
240 | - output = limitTo(output, limit); | ||
241 | - | ||
242 | - return output; | ||
243 | - }; | ||
244 | - | ||
245 | - ArticleGridController.prototype.filterShuffle = function(input) { | ||
246 | - var result = []; | ||
247 | - var resultByCategory = {}; | ||
248 | - | ||
249 | - // divide by categories | ||
250 | - for (var i = 0; i < input.length; i++) { | ||
251 | - var program = input[i]; | ||
252 | - var categorySlug = program.categories[0].slug; | ||
253 | - | ||
254 | - if (!resultByCategory[categorySlug]) { | ||
255 | - resultByCategory[categorySlug] = []; | ||
256 | - } | ||
257 | - | ||
258 | - resultByCategory[categorySlug].push(program); | ||
259 | - } | ||
260 | - | ||
261 | - // shuffle each array | ||
262 | - var prop = null; | ||
263 | - var categoryWithPrograms = null; | ||
264 | - for (prop in resultByCategory) { | ||
265 | - if (resultByCategory.hasOwnProperty(prop)) { | ||
266 | - categoryWithPrograms = resultByCategory[prop]; | ||
267 | - resultByCategory[prop] = shuffle(categoryWithPrograms); | ||
268 | - } | ||
269 | - } | ||
270 | - | ||
271 | - // Concat all into result array | ||
272 | - // > while has program at Lists on resultByCategory | ||
273 | - var hasProgram = true; | ||
274 | - while (hasProgram) { | ||
275 | - | ||
276 | - var foundProgram = false; | ||
277 | - // each categoryList with array of program | ||
278 | - prop = null; | ||
279 | - categoryWithPrograms = null; | ||
280 | - for (prop in resultByCategory) { | ||
281 | - | ||
282 | - if (resultByCategory.hasOwnProperty(prop)) { | ||
283 | - categoryWithPrograms = resultByCategory[prop]; | ||
284 | - | ||
285 | - if (categoryWithPrograms.length > 0) { | ||
286 | - var pivotProgram = categoryWithPrograms.pop(); | ||
287 | - result.push(pivotProgram); | ||
288 | - foundProgram = true; | ||
289 | - } | ||
290 | - } | ||
291 | - } | ||
292 | - | ||
293 | - if (!foundProgram) { | ||
294 | - hasProgram = false; | ||
295 | - } | ||
296 | - } | ||
297 | - | ||
298 | - return result; | 42 | + ArticleGridController.prototype.attachListeners = function() { |
43 | + // var vm = this; | ||
299 | }; | 44 | }; |
300 | 45 | ||
301 | var directive = { | 46 | var directive = { |
302 | restrict: 'E', | 47 | restrict: 'E', |
303 | templateUrl: 'app/components/article-grid/article-grid.html', | 48 | templateUrl: 'app/components/article-grid/article-grid.html', |
49 | + scope: { | ||
50 | + articles: '=' | ||
51 | + }, | ||
304 | controller: ArticleGridController, | 52 | controller: ArticleGridController, |
305 | controllerAs: 'vm', | 53 | controllerAs: 'vm', |
306 | bindToController: true | 54 | bindToController: true |
@@ -308,44 +56,4 @@ | @@ -308,44 +56,4 @@ | ||
308 | 56 | ||
309 | return directive; | 57 | return directive; |
310 | } | 58 | } |
311 | - | ||
312 | - function _filterByCategory (input, category) { | ||
313 | - input = input || []; | ||
314 | - | ||
315 | - if (!category) { | ||
316 | - // no filter | ||
317 | - return input; | ||
318 | - } | ||
319 | - | ||
320 | - var out = []; | ||
321 | - for (var i = 0; i < input.length; i++) { | ||
322 | - var program = input[i]; | ||
323 | - if (program.categories[0].slug === category.slug) { | ||
324 | - out.push(program); | ||
325 | - } | ||
326 | - } | ||
327 | - | ||
328 | - return out; | ||
329 | - } | ||
330 | - | ||
331 | - // -> Fisher–Yates shuffle algorithm | ||
332 | - function shuffle (array) { | ||
333 | - var currentIndex = array.length, temporaryValue, randomIndex ; | ||
334 | - | ||
335 | - // While there remain elements to shuffle... | ||
336 | - while (0 !== currentIndex) { | ||
337 | - | ||
338 | - // Pick a remaining element... | ||
339 | - randomIndex = Math.floor(Math.random() * currentIndex); | ||
340 | - currentIndex -= 1; | ||
341 | - | ||
342 | - // And swap it with the current element. | ||
343 | - temporaryValue = array[currentIndex]; | ||
344 | - array[currentIndex] = array[randomIndex]; | ||
345 | - array[randomIndex] = temporaryValue; | ||
346 | - } | ||
347 | - | ||
348 | - return array; | ||
349 | - } | ||
350 | - | ||
351 | })(); | 59 | })(); |
src/app/components/article-grid/article-grid.html
1 | -<article class="article-grid"> | ||
2 | - <header class="header"> | ||
3 | - <h2>Conheça os programas <span class="small">({{vm.filtredArticleList.length}}/{{::vm.articles.length}})</span></h2> | ||
4 | - <button type="button" class="btn btn-link" ng-click="vm.showAll($event)"> | ||
5 | - <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> Ver todos os {{::vm.articles.length}} programas | ||
6 | - </button> | ||
7 | - </header> | ||
8 | - <div> | ||
9 | - <div class="col-sm-12"> | ||
10 | - <aside class="form-inline"> | ||
11 | - <div class="row"> | ||
12 | - <div class="col-xs-6 col-sm-7 col-md-9"> | ||
13 | - <label for="articleQueryFilter" class="control-label sr-only">Filtrar programas:</label> | ||
14 | - <input id="articleQueryFilter" type="search" class="form-control" ng-model="vm.query" placeholder="Filtrar programas" aria-label="Filtrar programas" > | ||
15 | - </div> | ||
16 | - | ||
17 | - <!-- <label for="selectCategoryFilter" class="control-label sr-only">Filtrar por tema:</label> | ||
18 | - <select id="selectCategoryFilter" name="selectCategoryFilter" class="form-control" ng-model="vm.categoryFilter" ng-options="category.name for category in vm.categories track by category.slug"> | ||
19 | - <option value="">-- Filtrar por tema --</option> | ||
20 | - </select> --> | ||
21 | - | ||
22 | - <div class="col-xs-6 col-sm-5 col-md-3"> | ||
23 | - <label for="articleOrderByFilter" class="control-label sr-only">Ordernar por:</label> | ||
24 | - <select id="articleOrderByFilter" name="articleOrderByFilter" class="form-control pull-right" ng-model="vm.orderCriteria" ng-options="orderCriteria.label for orderCriteria in vm.orderCriteries"> | ||
25 | - <option value="">-- Ordernar por: --</option> | ||
26 | - </select> | ||
27 | - </div> | ||
28 | - <!-- <div class="checkbox"> | ||
29 | - <label> | ||
30 | - <input type="checkbox" ng-model="vm.reverse"> | ||
31 | - Reverso | ||
32 | - </label> | ||
33 | - </div> --> | ||
34 | - | ||
35 | - <!-- <input id="articleLimitFilter" type="number" class="form-control input-sm" size="4" step="2" ng-model="vm.limitTo" aria-label="Limitar" > | ||
36 | - <label for="articleLimitFilter" class="control-label">Limite</label> --> | ||
37 | - | ||
38 | - </div> | ||
39 | - </aside> | ||
40 | - </div> | ||
41 | - | ||
42 | - <div ng-repeat="article in vm.filtredArticleList as results"> | ||
43 | - <article-box article="article" class="col-xs-12 col-sm-6"></article-box> | ||
44 | - <div ng-if="$odd" class="clearfix"></div> | ||
45 | - </div> | ||
46 | - <div class="animate-repeat" ng-if="results.length == 0"> | ||
47 | - Nenhum programa encontrado. | ||
48 | - </div> | 1 | +<div class="article-grid"> |
2 | + <div ng-repeat="article in vm.articles as results"> | ||
3 | + <article-box article="article" category="article.categories[0]" class="col-xs-12 col-sm-6"></article-box> | ||
4 | + <div ng-if="$odd" class="clearfix"></div> | ||
49 | </div> | 5 | </div> |
50 | -</article> | 6 | + <div class="animate-repeat" ng-if="results.length == 0"> |
7 | + Nenhum programa encontrado. | ||
8 | + </div> | ||
9 | +</div> |
src/app/components/article-grid/article-grid.scss
src/app/components/article-service/article.service.js
@@ -90,7 +90,7 @@ | @@ -90,7 +90,7 @@ | ||
90 | }); | 90 | }); |
91 | } | 91 | } |
92 | 92 | ||
93 | - function searchTopics (param, cbSuccess, cbError) { | 93 | + function searchTopics (params, cbSuccess, cbError) { |
94 | // Ex.: /api/v1/search/article?type=ProposalsDiscussionPlugin::Topic&query=cisternas | 94 | // Ex.: /api/v1/search/article?type=ProposalsDiscussionPlugin::Topic&query=cisternas |
95 | var url = '/api/v1/search/article'; | 95 | var url = '/api/v1/search/article'; |
96 | var paramsExtended = angular.extend({ | 96 | var paramsExtended = angular.extend({ |
@@ -98,14 +98,14 @@ | @@ -98,14 +98,14 @@ | ||
98 | 'type': 'ProposalsDiscussionPlugin::Topic' | 98 | 'type': 'ProposalsDiscussionPlugin::Topic' |
99 | }, params); | 99 | }, params); |
100 | 100 | ||
101 | - UtilService.get(url, {params: paramsExtended).then(function(data){ | 101 | + UtilService.get(url, {params: paramsExtended}).then(function(data){ |
102 | cbSuccess(data); | 102 | cbSuccess(data); |
103 | }).catch(function(error){ | 103 | }).catch(function(error){ |
104 | cbError(error); | 104 | cbError(error); |
105 | }); | 105 | }); |
106 | } | 106 | } |
107 | 107 | ||
108 | - function searchProposals (param, cbSuccess, cbError) { | 108 | + function searchProposals (params, cbSuccess, cbError) { |
109 | // Ex.: /api/v1/search/article?type=ProposalsDiscussionPlugin::Proposal&query=cisternas | 109 | // Ex.: /api/v1/search/article?type=ProposalsDiscussionPlugin::Proposal&query=cisternas |
110 | var url = '/api/v1/search/article'; | 110 | var url = '/api/v1/search/article'; |
111 | var paramsExtended = angular.extend({ | 111 | var paramsExtended = angular.extend({ |
@@ -113,7 +113,7 @@ | @@ -113,7 +113,7 @@ | ||
113 | 'type': 'ProposalsDiscussionPlugin::Proposal' | 113 | 'type': 'ProposalsDiscussionPlugin::Proposal' |
114 | }, params); | 114 | }, params); |
115 | 115 | ||
116 | - UtilService.get(url, {params: paramsExtended).then(function(data){ | 116 | + UtilService.get(url, {params: paramsExtended}).then(function(data){ |
117 | cbSuccess(data); | 117 | cbSuccess(data); |
118 | }).catch(function(error){ | 118 | }).catch(function(error){ |
119 | cbError(error); | 119 | cbError(error); |
src/app/components/category-list/category-list.directive.js
@@ -9,7 +9,7 @@ | @@ -9,7 +9,7 @@ | ||
9 | function categoryList() { | 9 | function categoryList() { |
10 | 10 | ||
11 | /** @ngInject */ | 11 | /** @ngInject */ |
12 | - function CategoryListController($rootScope, ArticleService, $location, $log) { | 12 | + function CategoryListController($rootScope, $location, $log) { |
13 | $log.debug('CategoryListController'); | 13 | $log.debug('CategoryListController'); |
14 | 14 | ||
15 | // alias | 15 | // alias |
@@ -17,33 +17,15 @@ | @@ -17,33 +17,15 @@ | ||
17 | 17 | ||
18 | // dependencies | 18 | // dependencies |
19 | vm.$rootScope = $rootScope; | 19 | vm.$rootScope = $rootScope; |
20 | - vm.ArticleService = ArticleService; | ||
21 | vm.$location = $location; | 20 | vm.$location = $location; |
22 | vm.$log = $log; | 21 | vm.$log = $log; |
23 | - vm.defaultLimit = 6; | ||
24 | 22 | ||
25 | // initialization | 23 | // initialization |
26 | vm.init(); | 24 | vm.init(); |
27 | } | 25 | } |
28 | 26 | ||
29 | CategoryListController.prototype.init = function() { | 27 | CategoryListController.prototype.init = function() { |
30 | - var vm = this; | ||
31 | - | ||
32 | - vm.selectedCategory = null; | ||
33 | - vm.ArticleService.getCategories(function(categories){ | ||
34 | - vm.categories = categories; | ||
35 | - | ||
36 | - }); | ||
37 | - | ||
38 | - vm.search = vm.$location.search(); | ||
39 | - if (vm.search && vm.search.tema) { | ||
40 | - var slug = vm.search.tema; | ||
41 | - vm.ArticleService.getCategoryBySlug(slug, function(category){ | ||
42 | - vm.selectedCategory = category; | ||
43 | - }, function(error){ | ||
44 | - vm.$log.error('Error when try to "getCategoryBySlug"', error); | ||
45 | - }); | ||
46 | - } | 28 | + // var vm = this; |
47 | }; | 29 | }; |
48 | 30 | ||
49 | CategoryListController.prototype.selectCategory = function(category, $event) { | 31 | CategoryListController.prototype.selectCategory = function(category, $event) { |
@@ -66,6 +48,10 @@ | @@ -66,6 +48,10 @@ | ||
66 | var directive = { | 48 | var directive = { |
67 | restrict: 'E', | 49 | restrict: 'E', |
68 | templateUrl: 'app/components/category-list/category-list.html', | 50 | templateUrl: 'app/components/category-list/category-list.html', |
51 | + scope: { | ||
52 | + categories: '=', | ||
53 | + selectedCategory: '@' | ||
54 | + }, | ||
69 | controller: CategoryListController, | 55 | controller: CategoryListController, |
70 | controllerAs: 'categoryListCtrl', | 56 | controllerAs: 'categoryListCtrl', |
71 | bindToController: true | 57 | bindToController: true |
src/app/components/dialoga-service/dialoga.service.js
@@ -6,146 +6,219 @@ | @@ -6,146 +6,219 @@ | ||
6 | .factory('DialogaService', DialogaService); | 6 | .factory('DialogaService', DialogaService); |
7 | 7 | ||
8 | /** @ngInject */ | 8 | /** @ngInject */ |
9 | - function DialogaService($rootScope, API, ArticleService, UtilService, Slug, $log) { | 9 | + function DialogaService($rootScope, $sce, API, ArticleService, UtilService, Slug, $log) { |
10 | $log.debug('DialogaService'); | 10 | $log.debug('DialogaService'); |
11 | 11 | ||
12 | var service = { | 12 | var service = { |
13 | - getInicio: getInicio, | ||
14 | - getSobre: getSobre, | ||
15 | - getTemas: getTemas, | ||
16 | - getProgramas: getProgramas, | ||
17 | - getPropostas: getPropostas, | ||
18 | - getDuvidas: getDuvidas, | ||
19 | - buscaPrograma: buscaPrograma, | ||
20 | - buscaProposta: buscaProposta, | 13 | + getHome: getHome, |
14 | + getAbout: getAbout, | ||
15 | + getThemes: getThemes, | ||
16 | + getPrograms: getPrograms, | ||
17 | + getProgramBySlug: getProgramBySlug, | ||
18 | + getProgramsRandom: getProgramsRandom, | ||
19 | + getProposals: getProposals, | ||
20 | + getEvents: getEvents, | ||
21 | + getQuestions: getQuestions, | ||
22 | + searchProgram: searchProgram, | ||
23 | + searchProposal: searchProposal, | ||
21 | }; | 24 | }; |
22 | 25 | ||
23 | var CACHE = {}; | 26 | var CACHE = {}; |
24 | 27 | ||
25 | return service; | 28 | return service; |
26 | 29 | ||
27 | - function getInicio (cbSuccess, cbError) { | ||
28 | - if(CACHE.hasOwnProperty('inicio')){ | ||
29 | - cbSuccess(CACHE.inicio); | 30 | + function getHome (cbSuccess, cbError) { |
31 | + if( !!CACHE.home ){ | ||
32 | + cbSuccess(CACHE.home); | ||
30 | }else{ | 33 | }else{ |
31 | // load main content | 34 | // load main content |
32 | ArticleService.getArticleById(API.articleId.home, { | 35 | ArticleService.getArticleById(API.articleId.home, { |
33 | - fields: 'id,abstract,body,categories,children,children_count,title' | ||
34 | - }, function (article){ | ||
35 | - CACHE.inicio = article; | 36 | + 'fields[]': ['id','abstract','body','categories','children','children_count','title','image','url'] |
37 | + }, function (data){ | ||
38 | + CACHE.home = data; | ||
36 | 39 | ||
37 | - _pipeSetSobre(article); | ||
38 | - _pipeSetTemas(article); | ||
39 | - _pipeSetProgramas(article); | 40 | + _pipeHandleYoutube(data); |
41 | + _pipeHandleSlug(data); | ||
42 | + _pipeSetAbout(data); | ||
43 | + _pipeSetThemes(data); | ||
44 | + _pipeSetPrograms(data); | ||
40 | 45 | ||
41 | - cbSuccess(article); | 46 | + cbSuccess(data); |
42 | }, cbError); | 47 | }, cbError); |
43 | } | 48 | } |
44 | } | 49 | } |
45 | 50 | ||
46 | - function getSobre (cbSuccess, cbError) { | ||
47 | - if(CACHE.hasOwnProperty('sobre')){ | ||
48 | - cbSuccess(CACHE.sobre); | 51 | + function getAbout (cbSuccess, cbError) { |
52 | + if( !!CACHE.about ){ | ||
53 | + cbSuccess(CACHE.about); | ||
49 | }else{ | 54 | }else{ |
50 | // load article content | 55 | // load article content |
51 | ArticleService.getArticleById(API.articleId.about, {}, function (article){ | 56 | ArticleService.getArticleById(API.articleId.about, {}, function (article){ |
52 | - CACHE.sobre = article; | 57 | + CACHE.about = article; |
53 | 58 | ||
54 | - cbSuccess(CACHE.sobre); | 59 | + cbSuccess(CACHE.about); |
55 | }, cbError); | 60 | }, cbError); |
56 | } | 61 | } |
57 | } | 62 | } |
58 | 63 | ||
59 | - function getTemas (cbSuccess, cbError) { | ||
60 | - if(CACHE.hasOwnProperty('temas')){ | ||
61 | - cbSuccess(CACHE.temas); | 64 | + function getThemes (cbSuccess, cbError) { |
65 | + if( !!CACHE.themes ){ | ||
66 | + cbSuccess(CACHE.themes); | ||
62 | }else{ | 67 | }else{ |
63 | // load main content | 68 | // load main content |
64 | - getInicio(function(){ | ||
65 | - if(!CACHE.hasOwnProperty('temas')){ | ||
66 | - throw { name: 'NotFound', message: '"temas" is not defined. "article.categories" was handled?'}; | 69 | + getHome(function(){ |
70 | + if(!CACHE.hasOwnProperty('themes')){ | ||
71 | + throw { name: 'NotFound', message: '"themes" is not defined. "article.categories" was loaded?'}; | ||
67 | } | 72 | } |
68 | - cbSuccess(CACHE.temas); | 73 | + cbSuccess(CACHE.themes); |
69 | },cbError); | 74 | },cbError); |
70 | } | 75 | } |
71 | } | 76 | } |
72 | 77 | ||
73 | - function getProgramas (cbSuccess, cbError) { | ||
74 | - if(CACHE.hasOwnProperty('programas')){ | ||
75 | - cbSuccess(CACHE.programas); | 78 | + function getPrograms (cbSuccess, cbError) { |
79 | + if( !!CACHE.programs ){ | ||
80 | + cbSuccess(CACHE.programs); | ||
76 | }else{ | 81 | }else{ |
77 | // load main content | 82 | // load main content |
78 | - getInicio(function(){ | ||
79 | - if(!CACHE.hasOwnProperty('programas')){ | ||
80 | - throw { name: 'NotFound', message: '"programas" is not defined. "article.children" was handled?'}; | 83 | + getHome(function(){ |
84 | + if(!CACHE.hasOwnProperty('programs')){ | ||
85 | + throw { name: 'NotFound', message: '"programs" is not defined. "article.children" was handled?'}; | ||
81 | } | 86 | } |
82 | - cbSuccess(CACHE.programas); | 87 | + cbSuccess(CACHE.programs); |
83 | },cbError); | 88 | },cbError); |
84 | } | 89 | } |
85 | } | 90 | } |
86 | 91 | ||
87 | - function getProgramasAleatorios (cbSuccess, cbError) { | ||
88 | - // load article content | ||
89 | - UtilService.get(API.random_topics, {params: { | ||
90 | - 'fields[]': [ | ||
91 | - 'id', 'title', 'slug', 'abstract', 'body', 'categories', 'setting', | ||
92 | - 'ranking_position', 'position', 'children_count', 'hits', 'votes_for', | ||
93 | - 'votes_against', 'tag_list'] | ||
94 | - }}).then(function(data){ | ||
95 | - cbSuccess(data); | ||
96 | - }).catch(function(error){ | ||
97 | - cbError(error); | ||
98 | - }); | 92 | + function getProgramBySlug (slug, cbSuccess, cbError) { |
93 | + | ||
94 | + if( !CACHE.programs ){ | ||
95 | + getPrograms(_getProgramBySlug, cbError); | ||
96 | + } else { | ||
97 | + _getProgramBySlug(); | ||
98 | + } | ||
99 | + | ||
100 | + function _getProgramBySlug(){ | ||
101 | + var result = CACHE.programs.filter(function filterProgramBySlug (program) { | ||
102 | + if(angular.equals(program.slug, slug)) { | ||
103 | + return true; | ||
104 | + } | ||
105 | + return false; | ||
106 | + }); | ||
107 | + | ||
108 | + cbSuccess(result[0]); | ||
109 | + } | ||
99 | } | 110 | } |
100 | 111 | ||
101 | - function getPropostas (cbSuccess, cbError) { | ||
102 | - if(CACHE.hasOwnProperty('propostas')){ | ||
103 | - cbSuccess(CACHE.propostas); | 112 | + function getProgramsRandom (cbSuccess, cbError) { |
113 | + getPrograms(cbSuccess, cbError); | ||
114 | + // TODO: get endpoint for production | ||
115 | + // if( !!CACHE.programsRandom ){ | ||
116 | + // cbSuccess(CACHE.programsRandom); | ||
117 | + // }else{ | ||
118 | + // // load article content | ||
119 | + // // UtilService.get(API.random_topics, {params: { | ||
120 | + // ArticleService.getArticleById(API.articleId.home, {params: { | ||
121 | + // 'fields[]': [ | ||
122 | + // 'id', 'title', 'slug', 'abstract', 'children_count'], | ||
123 | + // 'content_type': 'ProposalsDiscussionPlugin::Topic' | ||
124 | + // }}).then(function(data){ | ||
125 | + // CACHE.programsRandom = data; | ||
126 | + | ||
127 | + // cbSuccess(data); | ||
128 | + // }).catch(function(error){ | ||
129 | + // cbError(error); | ||
130 | + // }); | ||
131 | + // } | ||
132 | + } | ||
133 | + | ||
134 | + function getProposals (cbSuccess, cbError) { | ||
135 | + if( !!CACHE.proposals ){ | ||
136 | + cbSuccess(CACHE.proposals); | ||
104 | }else{ | 137 | }else{ |
105 | // load main content | 138 | // load main content |
106 | - getInicio(function(){ | ||
107 | - if(!CACHE.hasOwnProperty('propostas')){ | ||
108 | - throw { name: 'NotFound', message: '"propostas" is not defined. "article.categories" was handled?'}; | 139 | + getHome(function(){ |
140 | + if(!CACHE.hasOwnProperty('proposals')){ | ||
141 | + throw { name: 'NotFound', message: '"proposals" is not defined. "article.categories" was loaded?'}; | ||
109 | } | 142 | } |
110 | - cbSuccess(CACHE.propostas); | 143 | + cbSuccess(CACHE.proposals); |
111 | },cbError); | 144 | },cbError); |
112 | } | 145 | } |
113 | } | 146 | } |
114 | 147 | ||
115 | - function getDuvidas (cbSuccess, cbError) { | ||
116 | - if(CACHE.hasOwnProperty('duvidas')){ | ||
117 | - cbSuccess(CACHE.duvidas); | 148 | + function getEvents (cbSuccess, cbError) { |
149 | + if( !!CACHE.events ){ | ||
150 | + cbSuccess(CACHE.events); | ||
151 | + }else{ | ||
152 | + // load main content | ||
153 | + getHome(function(){ | ||
154 | + if(!CACHE.hasOwnProperty('events')){ | ||
155 | + throw { name: 'NotFound', message: '"events" is not defined. "article.categories" was loaded?'}; | ||
156 | + } | ||
157 | + cbSuccess(CACHE.events); | ||
158 | + },cbError); | ||
159 | + } | ||
160 | + } | ||
161 | + | ||
162 | + function getQuestions (cbSuccess/*, cbError*/) { | ||
163 | + if( !!CACHE.questions ){ | ||
164 | + cbSuccess(CACHE.questions); | ||
118 | }else{ | 165 | }else{ |
119 | // load content | 166 | // load content |
120 | - var duvidas = []; | 167 | + var questions = []; |
121 | 168 | ||
122 | - CACHE.duvidas = duvidas; | ||
123 | - cbSuccess(CACHE.duvidas); | 169 | + CACHE.questions = questions; |
170 | + cbSuccess(CACHE.questions); | ||
124 | } | 171 | } |
125 | } | 172 | } |
126 | 173 | ||
127 | - function buscaPrograma (cbSuccess, cbError) {} | 174 | + function searchProgram (cbSuccess, cbError) {} |
175 | + | ||
176 | + function searchProposal (cbSuccess, cbError) {} | ||
177 | + | ||
178 | + function _pipeHandleYoutube (data) { | ||
179 | + var abstract = data.article.abstract; | ||
180 | + | ||
181 | + abstract = forceIframeParams(abstract); | ||
182 | + abstract = removeStylefromIframe(abstract); | ||
183 | + | ||
184 | + data.article.abstract = abstract; | ||
185 | + | ||
186 | + data.article.abstractTrusted = $sce.trustAsHtml(abstract); | ||
187 | + } | ||
188 | + | ||
189 | + function _pipeHandleSlug (data) { | ||
190 | + // set slug to article | ||
191 | + if(!data.article.slug){ | ||
192 | + data.article.slug = Slug.slugify(data.article.title); | ||
193 | + } | ||
128 | 194 | ||
129 | - function buscaProposta (cbSuccess, cbError) {} | 195 | + // set slug to programs |
196 | + for (var i = data.article.children.length - 1; i >= 0; i--) { | ||
197 | + var program = data.article.children[i]; | ||
198 | + if(!program.slug){ | ||
199 | + program.slug = Slug.slugify(program.title); | ||
200 | + } | ||
201 | + } | ||
202 | + } | ||
130 | 203 | ||
131 | - function _pipeSetSobre (article) { | ||
132 | - if(!CACHE.hasOwnProperty('sobre')){ | ||
133 | - CACHE.sobre = article.body; | 204 | + function _pipeSetAbout (data) { |
205 | + if(!CACHE.hasOwnProperty('about')){ | ||
206 | + CACHE.about = data.article.body; | ||
134 | } | 207 | } |
135 | } | 208 | } |
136 | 209 | ||
137 | - function _pipeSetTemas (article) { | ||
138 | - if(!CACHE.hasOwnProperty('temas')){ | ||
139 | - CACHE.temas = article.categories; | 210 | + function _pipeSetThemes (data) { |
211 | + if(!CACHE.hasOwnProperty('themes')){ | ||
212 | + CACHE.themes = data.article.categories; | ||
140 | } | 213 | } |
141 | 214 | ||
142 | - _pipeCalcColors(article); | 215 | + _pipeCalcColors(data); |
143 | } | 216 | } |
144 | 217 | ||
145 | - function _pipeSetProgramas (article) { | ||
146 | - if(!CACHE.hasOwnProperty('programas')){ | ||
147 | - CACHE.programas = article.children; | ||
148 | - CACHE.programas_count = article.children_count; | 218 | + function _pipeSetPrograms (data) { |
219 | + if(!CACHE.hasOwnProperty('programs')){ | ||
220 | + CACHE.programs = data.article.children; | ||
221 | + CACHE.programs_count = data.article.children_count; | ||
149 | } | 222 | } |
150 | } | 223 | } |
151 | 224 | ||
@@ -166,5 +239,52 @@ | @@ -166,5 +239,52 @@ | ||
166 | // }; | 239 | // }; |
167 | } | 240 | } |
168 | } | 241 | } |
242 | + | ||
243 | + function forceIframeParams(abstract) { | ||
244 | + var patternIframe = '<iframe src="'; | ||
245 | + var indexOfIframe = abstract.indexOf(patternIframe); | ||
246 | + | ||
247 | + if (indexOfIframe === -1) { | ||
248 | + return abstract; | ||
249 | + } | ||
250 | + | ||
251 | + var startSrcUrl = indexOfIframe + patternIframe.length; | ||
252 | + var endSrcUrl = abstract.indexOf('"', startSrcUrl); | ||
253 | + var srcUrl = abstract.substring(startSrcUrl , endSrcUrl); | ||
254 | + var resultUrl = srcUrl; | ||
255 | + var c = (srcUrl.indexOf('?') !== -1) ? '&' : ''; // already have url params. So, append-it | ||
256 | + | ||
257 | + // enable js api | ||
258 | + if (srcUrl.indexOf('enablejsapi=1') === -1) { | ||
259 | + resultUrl += c + 'enablejsapi=1'; | ||
260 | + c = '&'; // force to always use '&' after here | ||
261 | + } | ||
262 | + | ||
263 | + // set opaque mode | ||
264 | + if (srcUrl.indexOf('wmode=opaque') === -1) { | ||
265 | + resultUrl += c + 'wmode=opaque'; | ||
266 | + // c = '&'; // force to always use '&' after here | ||
267 | + } | ||
268 | + | ||
269 | + abstract = abstract.replace(srcUrl, resultUrl); | ||
270 | + | ||
271 | + return abstract; | ||
272 | + } | ||
273 | + | ||
274 | + function removeStylefromIframe (abstract) { | ||
275 | + var patternIframe = 'style="'; | ||
276 | + var indexOfIframe = abstract.indexOf('<iframe'); | ||
277 | + var indexOfStyleOnIframe = abstract.indexOf('style="', indexOfIframe); | ||
278 | + | ||
279 | + if (indexOfStyleOnIframe === -1) { | ||
280 | + return abstract; | ||
281 | + } | ||
282 | + | ||
283 | + var startStyleContent = indexOfStyleOnIframe + patternIframe.length; | ||
284 | + var endStyleContent = abstract.indexOf('"', startStyleContent); | ||
285 | + var style = abstract.substring(startStyleContent , endStyleContent); | ||
286 | + | ||
287 | + return abstract.replace(style, ''); | ||
288 | + } | ||
169 | } | 289 | } |
170 | })(); | 290 | })(); |
src/app/components/proposal-related/proposal-related.directive.js
@@ -76,7 +76,7 @@ | @@ -76,7 +76,7 @@ | ||
76 | if(vm.display === 'list'){ | 76 | if(vm.display === 'list'){ |
77 | // wait until DOM be created | 77 | // wait until DOM be created |
78 | vm.$timeout(function(){ | 78 | vm.$timeout(function(){ |
79 | - attachPopover.call(vm); | 79 | + // attachPopover.call(vm); |
80 | }, 20); | 80 | }, 20); |
81 | } | 81 | } |
82 | }, 2000); | 82 | }, 2000); |
src/app/components/socialShare/socialShare.directive.js
src/app/pages/inicio/inicio.controller.js
@@ -7,11 +7,12 @@ | @@ -7,11 +7,12 @@ | ||
7 | .controller('InicioPageController', InicioPageController); | 7 | .controller('InicioPageController', InicioPageController); |
8 | 8 | ||
9 | /** @ngInject */ | 9 | /** @ngInject */ |
10 | - function InicioPageController(DialogaService, $sce, $log) { | 10 | + function InicioPageController(DialogaService, $scope, $sce, $log) { |
11 | var vm = this; | 11 | var vm = this; |
12 | 12 | ||
13 | // aliases | 13 | // aliases |
14 | vm.DialogaService = DialogaService; | 14 | vm.DialogaService = DialogaService; |
15 | + vm.$scope = $scope; | ||
15 | vm.$sce = $sce; | 16 | vm.$sce = $sce; |
16 | vm.$log = $log; | 17 | vm.$log = $log; |
17 | 18 | ||
@@ -22,58 +23,95 @@ | @@ -22,58 +23,95 @@ | ||
22 | InicioPageController.prototype.init = function() { | 23 | InicioPageController.prototype.init = function() { |
23 | var vm = this; | 24 | var vm = this; |
24 | 25 | ||
26 | + vm.article = null; | ||
27 | + vm.themes = null; | ||
28 | + vm.selectedTheme = null; | ||
29 | + vm.programs = null; | ||
30 | + vm.filtredPrograms = null; | ||
31 | + vm.query = null; | ||
32 | + | ||
25 | vm.error = null; | 33 | vm.error = null; |
26 | - vm.loading = true; | ||
27 | 34 | ||
28 | vm.loadData(); | 35 | vm.loadData(); |
36 | + vm.attachListeners(); | ||
29 | }; | 37 | }; |
30 | 38 | ||
31 | InicioPageController.prototype.loadData = function() { | 39 | InicioPageController.prototype.loadData = function() { |
32 | var vm = this; | 40 | var vm = this; |
33 | 41 | ||
34 | - vm.content = vm.DialogaService.getHomeAbstract(); | ||
35 | - vm.isCached = !!vm.content; | ||
36 | - | ||
37 | - if (vm.isCached) { | ||
38 | - hideBackground(2000); | ||
39 | - } | 42 | + vm.loading = true; |
43 | + vm.loadingEvents = true; | ||
44 | + vm.loadingThemes = true; | ||
45 | + vm.loadingPrograms = true; | ||
40 | 46 | ||
47 | + // Load main content | ||
41 | vm.DialogaService.getHome(function(data) { | 48 | vm.DialogaService.getHome(function(data) { |
42 | - vm.loading = false; | ||
43 | vm.article = data.article; | 49 | vm.article = data.article; |
50 | + | ||
51 | + if (vm.article.videoIsLoaded) { | ||
52 | + hideBackground(2000); | ||
53 | + } | ||
54 | + | ||
55 | + loadAfterHome(); | ||
56 | + | ||
57 | + vm.loading = false; | ||
44 | }, function(error) { | 58 | }, function(error) { |
45 | - vm.$log.error('Error on getHome article.', error); | ||
46 | - vm.error = 'Erro ao carregar o conteúdo principal.'; | 59 | + vm.$log.error('Error on getHome.', error); |
47 | }); | 60 | }); |
61 | + | ||
62 | + function loadAfterHome () { | ||
63 | + // Load event list | ||
64 | + // vm.DialogaService.getEvents(function(data) { | ||
65 | + // vm.events = data; | ||
66 | + // vm.loadingEvents = false; | ||
67 | + // }, function(error) { | ||
68 | + // vm.$log.error('Error on getEvents.', error); | ||
69 | + // }); | ||
70 | + | ||
71 | + // Load theme list | ||
72 | + vm.DialogaService.getThemes(function(data) { | ||
73 | + vm.themes = data; | ||
74 | + vm.loadingThemes = false; | ||
75 | + }, function(error) { | ||
76 | + vm.$log.error('Error on getThemes.', error); | ||
77 | + }); | ||
78 | + | ||
79 | + // Load program list | ||
80 | + vm.DialogaService.getProgramsRandom(function(data) { | ||
81 | + vm.programs = vm.article.children; | ||
82 | + vm.filtredPrograms = data; | ||
83 | + vm.loadingPrograms = false; | ||
84 | + }, function(error) { | ||
85 | + vm.$log.error('Error on getPrograms.', error); | ||
86 | + }); | ||
87 | + } | ||
88 | + | ||
48 | }; | 89 | }; |
49 | 90 | ||
50 | InicioPageController.prototype.showVideo = function() { | 91 | InicioPageController.prototype.showVideo = function() { |
51 | var vm = this; | 92 | var vm = this; |
52 | 93 | ||
53 | // we need handle home content | 94 | // we need handle home content |
54 | - if (vm.isCached) { | 95 | + if (vm.article.videoIsLoaded) { |
55 | hideBackground(0); // force to hide | 96 | hideBackground(0); // force to hide |
56 | vm.$log.debug('The content already cached. Show-it!'); | 97 | vm.$log.debug('The content already cached. Show-it!'); |
57 | return; | 98 | return; |
58 | } | 99 | } |
59 | 100 | ||
60 | - vm.content = vm.handleHomeAbstract(vm.article.abstract); | ||
61 | - vm.DialogaService.setHomeAbstract(vm.content); | ||
62 | - | ||
63 | // inject dependencies | 101 | // inject dependencies |
64 | injectIframeApiJs(); | 102 | injectIframeApiJs(); |
65 | window.onYouTubeIframeAPIReady = window.onYouTubeIframeAPIReady || onYouTubeIframeAPIReady; | 103 | window.onYouTubeIframeAPIReady = window.onYouTubeIframeAPIReady || onYouTubeIframeAPIReady; |
66 | window.onYouTubePlayerReady = window.onYouTubePlayerReady || onYouTubePlayerReady; | 104 | window.onYouTubePlayerReady = window.onYouTubePlayerReady || onYouTubePlayerReady; |
105 | + | ||
106 | + vm.article.videoIsLoaded = true; | ||
67 | }; | 107 | }; |
68 | 108 | ||
69 | - // TODO: move this to DialogaService | ||
70 | - InicioPageController.prototype.handleHomeAbstract = function(abstract) { | 109 | + InicioPageController.prototype.attachListeners = function() { |
71 | var vm = this; | 110 | var vm = this; |
72 | 111 | ||
73 | - abstract = forceIframeParams(abstract); | ||
74 | - abstract = removeStylefromIframe(abstract); | ||
75 | - | ||
76 | - return vm.$sce.trustAsHtml(abstract); | 112 | + vm.$scope.$on('change-selectedCategory', function (selectedCategory) { |
113 | + vm.selectedTheme = selectedCategory; | ||
114 | + }); | ||
77 | }; | 115 | }; |
78 | 116 | ||
79 | function injectIframeApiJs() { | 117 | function injectIframeApiJs() { |
@@ -104,51 +142,4 @@ | @@ -104,51 +142,4 @@ | ||
104 | angular.element($elBg).fadeOut(ms || 100); | 142 | angular.element($elBg).fadeOut(ms || 100); |
105 | // angular.element($elBg).hide(); | 143 | // angular.element($elBg).hide(); |
106 | } | 144 | } |
107 | - | ||
108 | - function forceIframeParams(abstract) { | ||
109 | - var patternIframe = '<iframe src="'; | ||
110 | - var indexOfIframe = abstract.indexOf(patternIframe); | ||
111 | - | ||
112 | - if (indexOfIframe === -1) { | ||
113 | - return abstract; | ||
114 | - } | ||
115 | - | ||
116 | - var startSrcUrl = indexOfIframe + patternIframe.length; | ||
117 | - var endSrcUrl = abstract.indexOf('"', startSrcUrl); | ||
118 | - var srcUrl = abstract.substring(startSrcUrl , endSrcUrl); | ||
119 | - var resultUrl = srcUrl; | ||
120 | - var c = (srcUrl.indexOf('?') !== -1) ? '&' : ''; // already have url params. So, append-it | ||
121 | - | ||
122 | - // enable js api | ||
123 | - if (srcUrl.indexOf('enablejsapi=1') === -1) { | ||
124 | - resultUrl += c + 'enablejsapi=1'; | ||
125 | - c = '&'; // force to always use '&' after here | ||
126 | - } | ||
127 | - | ||
128 | - // set opaque mode | ||
129 | - if (srcUrl.indexOf('wmode=opaque') === -1) { | ||
130 | - resultUrl += c + 'wmode=opaque'; | ||
131 | - // c = '&'; // force to always use '&' after here | ||
132 | - } | ||
133 | - | ||
134 | - abstract = abstract.replace(srcUrl, resultUrl); | ||
135 | - | ||
136 | - return abstract; | ||
137 | - } | ||
138 | - | ||
139 | - function removeStylefromIframe (abstract) { | ||
140 | - var patternIframe = 'style="'; | ||
141 | - var indexOfIframe = abstract.indexOf('<iframe'); | ||
142 | - var indexOfStyleOnIframe = abstract.indexOf('style="', indexOfIframe); | ||
143 | - | ||
144 | - if (indexOfStyleOnIframe === -1) { | ||
145 | - return abstract; | ||
146 | - } | ||
147 | - | ||
148 | - var startStyleContent = indexOfStyleOnIframe + patternIframe.length; | ||
149 | - var endStyleContent = abstract.indexOf('"', startStyleContent); | ||
150 | - var style = abstract.substring(startStyleContent , endStyleContent); | ||
151 | - | ||
152 | - return abstract.replace(style, ''); | ||
153 | - } | ||
154 | })(); | 145 | })(); |
src/app/pages/inicio/inicio.html
@@ -6,11 +6,11 @@ | @@ -6,11 +6,11 @@ | ||
6 | <div class="video-wrapper"> | 6 | <div class="video-wrapper"> |
7 | <div class="video-player js-youtube"> | 7 | <div class="video-player js-youtube"> |
8 | <div class="embed-responsive embed-responsive-16by9"> | 8 | <div class="embed-responsive embed-responsive-16by9"> |
9 | - <div class="js-iframe" ng-show="pageInicio.content" ng-bind-html="pageInicio.content"></div> | 9 | + <div class="js-iframe" ng-if="pageInicio.article.videoIsLoaded" ng-bind-html="pageInicio.article.abstractTrusted"></div> |
10 | <div class="video-background" ng-click="pageInicio.showVideo()"> | 10 | <div class="video-background" ng-click="pageInicio.showVideo()"> |
11 | <div class="video-thumbnail" aria-hidden="true" style="background-image:url(/assets/images/youtube-background.png)"></div> | 11 | <div class="video-thumbnail" aria-hidden="true" style="background-image:url(/assets/images/youtube-background.png)"></div> |
12 | <button class="video-play-button" aria-live="assertive" aria-label="Assistir o vídeo tutorial Dialoga Brasil"> | 12 | <button class="video-play-button" aria-live="assertive" aria-label="Assistir o vídeo tutorial Dialoga Brasil"> |
13 | - <svg height="100%" version="1.1" viewBox="0 0 68 48" width="100%"><path class="ytp-play-button-bg" d="m .66,37.62 c 0,0 .66,4.70 2.70,6.77 2.58,2.71 5.98,2.63 7.49,2.91 5.43,.52 23.10,.68 23.12,.68 .00,-1.3e-5 14.29,-0.02 23.81,-0.71 1.32,-0.15 4.22,-0.17 6.81,-2.89 2.03,-2.07 2.70,-6.77 2.70,-6.77 0,0 .67,-5.52 .67,-11.04 l 0,-5.17 c 0,-5.52 -0.67,-11.04 -0.67,-11.04 0,0 -0.66,-4.70 -2.70,-6.77 C 62.03,.86 59.13,.84 57.80,.69 48.28,0 34.00,0 34.00,0 33.97,0 19.69,0 10.18,.69 8.85,.84 5.95,.86 3.36,3.58 1.32,5.65 .66,10.35 .66,10.35 c 0,0 -0.55,4.50 -0.66,9.45 l 0,8.36 c .10,4.94 .66,9.45 .66,9.45 z" fill="#1f1f1e" fill-opacity="0.9"></path><path d="m 26.96,13.67 18.37,9.62 -18.37,9.55 -0.00,-19.17 z" fill="#fff"></path><path d="M 45.02,23.46 45.32,23.28 26.96,13.67 43.32,24.34 45.02,23.46 z" fill="#ccc"></path></svg> | 13 | + <svg height="100%" version="1.1" viewbox="0 0 68 48" width="100%"><path class="ytp-play-button-bg" d="m .66,37.62 c 0,0 .66,4.70 2.70,6.77 2.58,2.71 5.98,2.63 7.49,2.91 5.43,.52 23.10,.68 23.12,.68 .00,-1.3e-5 14.29,-0.02 23.81,-0.71 1.32,-0.15 4.22,-0.17 6.81,-2.89 2.03,-2.07 2.70,-6.77 2.70,-6.77 0,0 .67,-5.52 .67,-11.04 l 0,-5.17 c 0,-5.52 -0.67,-11.04 -0.67,-11.04 0,0 -0.66,-4.70 -2.70,-6.77 C 62.03,.86 59.13,.84 57.80,.69 48.28,0 34.00,0 34.00,0 33.97,0 19.69,0 10.18,.69 8.85,.84 5.95,.86 3.36,3.58 1.32,5.65 .66,10.35 .66,10.35 c 0,0 -0.55,4.50 -0.66,9.45 l 0,8.36 c .10,4.94 .66,9.45 .66,9.45 z" fill="#1f1f1e" fill-opacity="0.9"></path><path d="m 26.96,13.67 18.37,9.62 -18.37,9.55 -0.00,-19.17 z" fill="#fff"></path><path d="M 45.02,23.46 45.32,23.28 26.96,13.67 43.32,24.34 45.02,23.46 z" fill="#ccc"></path></svg> |
14 | </button> | 14 | </button> |
15 | </div> | 15 | </div> |
16 | </div> | 16 | </div> |
@@ -22,31 +22,90 @@ | @@ -22,31 +22,90 @@ | ||
22 | </section> | 22 | </section> |
23 | 23 | ||
24 | <section class="section-event"> | 24 | <section class="section-event"> |
25 | - <event-list></event-list> | 25 | + <div ng-if="pageInicio.events"> |
26 | + <event-list events="[]"></event-list> | ||
27 | + </div> | ||
28 | + <div ng-if="!pageInicio.events && pageInicio.loadingEvents" class="container"> | ||
29 | + <div class="row"> | ||
30 | + <div class="col-sm-12"> | ||
31 | + <div class="alert alert-info" role="alert">Carregando lista de eventos.</div> | ||
32 | + </div> | ||
33 | + </div> | ||
34 | + </div> | ||
35 | + <div ng-if="!pageInicio.events && pageInicio.eventsError" class="container"> | ||
36 | + <div class="row"> | ||
37 | + <div class="col-sm-12"> | ||
38 | + <div class="alert alert-danger" role="alert">Não foi possível carregar a lista de eventos neste momento.</div> | ||
39 | + </div> | ||
40 | + </div> | ||
41 | + </div> | ||
26 | </section> | 42 | </section> |
27 | 43 | ||
28 | <section class="section-info" ng-if="pageInicio.loading || pageInicio.error"> | 44 | <section class="section-info" ng-if="pageInicio.loading || pageInicio.error"> |
29 | <div class="container"> | 45 | <div class="container"> |
30 | - <div class="col-md-12"> | ||
31 | - <div ng-if="pageInicio.loading && !pageInicio.error"> | ||
32 | - <div class="alert alert-info">Carregando conteúdo...</div> | ||
33 | - </div> | ||
34 | - | ||
35 | - <div ng-if="pageInicio.error"> | ||
36 | - <div class="alert alert-danger">{{pageInicio.error}}</div> | 46 | + <div class="row"> |
47 | + <div class="col-md-12"> | ||
48 | + <div ng-if="pageInicio.loading && !pageInicio.error"> | ||
49 | + <div class="alert alert-info" role="alert">Carregando conteúdo...</div> | ||
50 | + </div> | ||
51 | + | ||
52 | + <div ng-if="pageInicio.error"> | ||
53 | + <div class="alert alert-danger" role="alert"> | ||
54 | + Erro ao carregar o conteúdo principal. | ||
55 | + </div> | ||
56 | + </div> | ||
37 | </div> | 57 | </div> |
38 | </div> | 58 | </div> |
39 | </div> | 59 | </div> |
40 | </section> | 60 | </section> |
41 | 61 | ||
42 | - <section class="section-gray section-space-up" ng-if="pageInicio.article"> | 62 | + <section class="section--articles section-gray section-space-up" ng-if="pageInicio.article"> |
43 | <div class="container"> | 63 | <div class="container"> |
44 | <div id="lista-de-programas" class="row"> | 64 | <div id="lista-de-programas" class="row"> |
45 | <div class="col-sm-4 col-md-3"> | 65 | <div class="col-sm-4 col-md-3"> |
46 | - <category-list></category-list> | 66 | + <div ng-if="pageInicio.themes"> |
67 | + <category-list categories="pageInicio.themes" selected-category="pageInicio.selectedTheme"></category-list> | ||
68 | + </div> | ||
69 | + <div ng-if="!pageInicio.themes && pageInicio.loadingThemes"> | ||
70 | + <div class="alert alert-info" role="alert"> | ||
71 | + Carregando temas. | ||
72 | + </div> | ||
73 | + </div> | ||
74 | + <div ng-if="!pageInicio.themes && pageInicio.themesError"> | ||
75 | + <div class="alert alert-danger" role="alert"> | ||
76 | + Não foi possível carregar a lista de temas neste momento. | ||
77 | + </div> | ||
78 | + </div> | ||
47 | </div> | 79 | </div> |
48 | <div class="col-sm-8 col-md-9"> | 80 | <div class="col-sm-8 col-md-9"> |
49 | - <article-grid></article-grid> | 81 | + <div class="row"> |
82 | + <header class="header"> | ||
83 | + <h2>Conheça os programas <span class="small">({{pageInicio.filtredPrograms.length}}/{{::pageInicio.programs.length}})</span></h2> | ||
84 | + <button type="button" class="btn btn-link" ng-click="pageInicio.showAll($event)"> | ||
85 | + <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> Ver todos os {{::pageInicio.programs.length}} programas | ||
86 | + </button> | ||
87 | + </header> | ||
88 | + </div> | ||
89 | + <div class="row"> | ||
90 | + <div class="col-xs-6 col-sm-7 col-md-9"> | ||
91 | + <label for="articleQueryFilter" class="control-label sr-only">Filtrar programas:</label> | ||
92 | + <input id="articleQueryFilter" type="search" class="form-control" ng-model="pageInicio.query" placeholder="Filtrar programas" aria-label="Filtrar programas" > | ||
93 | + </div> | ||
94 | + </div> | ||
95 | + | ||
96 | + <div ng-if="pageInicio.programs"> | ||
97 | + <article-grid articles="pageInicio.filtredPrograms"></article-grid> | ||
98 | + </div> | ||
99 | + <div ng-if="!pageInicio.programs && pageInicio.loadingPrograms"> | ||
100 | + <div class="alert alert-info" role="alert"> | ||
101 | + Carregando programas. | ||
102 | + </div> | ||
103 | + </div> | ||
104 | + <div ng-if="!pageInicio.programs && pageInicio.programsError"> | ||
105 | + <div class="alert alert-danger" role="alert"> | ||
106 | + Não foi possível carregar a lista de programas neste momento. | ||
107 | + </div> | ||
108 | + </div> | ||
50 | </div> | 109 | </div> |
51 | </div> | 110 | </div> |
52 | </div> | 111 | </div> |
src/app/pages/inicio/inicio.scss
1 | .page--inicio { | 1 | .page--inicio { |
2 | margin-top: 20px; | 2 | margin-top: 20px; |
3 | + | ||
4 | + .section--articles { | ||
5 | + | ||
6 | + .header { | ||
7 | + position: relative; | ||
8 | + height: 40px; | ||
9 | + margin-bottom: 10px; | ||
10 | + | ||
11 | + button { | ||
12 | + position: absolute; | ||
13 | + right: 0; | ||
14 | + top: 2px; | ||
15 | + } | ||
16 | + } | ||
17 | + | ||
18 | + .form-inline { | ||
19 | + input, | ||
20 | + select { | ||
21 | + width: 100%; | ||
22 | + } | ||
23 | + } | ||
24 | + } | ||
3 | } | 25 | } |
4 | 26 | ||
5 | .section-gray { | 27 | .section-gray { |
src/assets/images/icons/sprite.png