Download as
Browse Code »

Commit c58d138690277f243ead741e9d2c106b41248c92

Authored by Caio Almeida
1 parent d13b205c
Exists in master and in 2 other branches production, staging

Refactoring filters and pagination

Showing 5 changed files with 57 additions and 79 deletions   Show diff stats
ConfJuvApp/www/html/_proposal_list.html
  Diff comments   View file @c58d138
... ... @@ -32,15 +32,15 @@
32 32 <h2>Como você vai mudar o Brasil?</h2>
33 33  
34 34 <td-cards>
35   - <p id="loading-cards" ng-show="!forceReload">
36   - </p>
37   - <div id='force-reload' ng-show="forceReload">
  35 + <p id="loading-cards" ng-show="loading">Carregando propostas...</p>
  36 + <div id="force-reload" ng-show="(emptyTopicsCount == topics.length) && !loading">
38 37 <p>Você já visualizou todas as propostas.</p>
39   - <p>Deseja <a ng-click="loadTopics()">Carregar novamente</a>? </p>
  38 + <p>Deseja <a ng-click="reloadTopics()">Carregar novamente</a>?</p>
40 39 </div>
  40 +
41 41 <td-card ng-repeat="proposal in cards" on-destroy="cardDestroyed($index)"
42 42 on-swipe-left="" on-swipe-right="" on-partial-swipe="cardPartialSwipe(amt)">
43   - <div class="card animate-show" ng-show="proposal.topic.selected">
  43 + <div class="card animate-show">
44 44 <h3>
45 45 <a ng-click="openProposal(proposal)">{{proposal.title | limitTo:100}}</a>
46 46 <br />
... ... @@ -58,6 +58,6 @@
58 58 </td-cards>
59 59  
60 60 <div class="cards-footer">
61   - <a ng-click="nextCard()" class="button flat">Próxima</a>
  61 + <a ng-click="nextCard()" ng-show="cards.length > 0" class="button flat">Próxima</a>
62 62 </div>
63 63 </div>
... ...
ConfJuvApp/www/html/_right_sidebar.html
  Diff comments   View file @c58d138
... ... @@ -4,14 +4,12 @@
4 4 <span>Filtros</span>
5 5 <button menu-toggle="right" class="button button-icon icon ion-close-circled" hide-when="large"></button>
6 6 </h2>
7   - <h3>Filtrar propostas por tema</h2>
  7 + <h3>Mostrar apenas propostas do eixo:</h2>
  8 + <ion-radio class="radio-balanced" ng-value="'all'" ng-model="topicFilter.value" ng-click="$parent.reloadProposals()">Todos</ion-radio>
8 9 <label ng-repeat="topic in topics">
9   - <ion-checkbox
10   - class="checkbox-balanced"
11   - name="selectedTopics[]"
12   - value="{{topic.title}}"
13   - ng-model="topic.selected"
14   - >{{topic.title}}</ion-checkbox>
  10 + <ion-radio class="radio-balanced" ng-value="topic.id" ng-model="topicFilter.value" ng-click="$parent.reloadProposals()">
  11 + {{topic.title}}
  12 + </ion-radio>
15 13 </label>
16 14 </ion-content>
17 15 </div>
... ...
ConfJuvApp/www/index.html
  Diff comments   View file @c58d138
... ... @@ -32,13 +32,13 @@
32 32 <ng-include src="'html/_header.html?2'"></ng-include>
33 33 <ion-pane>
34 34 <ion-content id="proposals-container" no-scroll="">
35   - <ng-include src="'html/_proposal_list.html?4'"></ng-include>
  35 + <ng-include src="'html/_proposal_list.html?8'"></ng-include>
36 36 </ion-content>
37 37 </ion-pane>
38 38 </ion-side-menu-content>
39 39  
40   - <ion-side-menu side="right" is-enabled="true" expose-aside-when="large" ng-show="proposalList.length > 0">
41   - <ng-include src="'html/_right_sidebar.html'"></ng-include>
  40 + <ion-side-menu side="right" is-enabled="true" expose-aside-when="large">
  41 + <ng-include src="'html/_right_sidebar.html?8'"></ng-include>
42 42 </ion-side-menu>
43 43 </ion-side-menus>
44 44  
... ...
ConfJuvApp/www/js/config.js.example
  Diff comments   View file @c58d138
... ... @@ -3,6 +3,5 @@ var ConfJuvAppConfig = {
3 3 noosferoApiPublicHost: 'http://app.juventude.gov.br',
4 4 noosferoApiVersion: 'v1',
5 5 noosferoDiscussion: 99895,
6   - noosferoStatutePath: 'articles/participatorio/0010/2309/Resolucao-01-2015-etapa-digital.pdf',
7   - proposalsPerPageAndTopic: 1
  6 + noosferoStatutePath: 'articles/participatorio/0010/2309/Resolucao-01-2015-etapa-digital.pdf'
8 7 };
... ...
ConfJuvApp/www/js/controllers.js
  Diff comments   View file @c58d138
... ... @@ -330,35 +330,30 @@ angular.module(&#39;confjuvapp.controllers&#39;, [])
330 330 ******************************************************************************/
331 331  
332 332 $scope.topics = [];
333   - $scope.proposalList = [];
334   - $scope.proposalsByTopic = {};
335 333 $scope.cards = [];
336   - $scope.forceReload = false;
  334 + $scope.emptyTopicsCount = 0;
  335 + $scope.topicFilter = { value: 'all' };
337 336  
338   - // Selected topics
  337 + $scope.reloadTopics = function() {
  338 + $scope.emptyTopicsCount = 0;
339 339  
340   - $scope.selection = [];
341   -
342   - // Helper method to get selected topics
  340 + if ($scope.filterTopic != 'all') {
  341 + $scope.emptyTopicsCount = $scope.topics.length - 1;
  342 + }
343 343  
344   - $scope.selectedTopics = function selectedTopics() {
345   - return filterFilter($scope.topics, { selected: true });
  344 + $scope.topics = [];
  345 + $scope.loadTopics($scope.token);
346 346 };
347 347  
348   - // Watch topics for changes
349   -
350   - $scope.$watch('topics|filter:{selected:true}', function (nv) {
351   - $scope.selection = nv.map(function (topic) {
352   - return topic.title;
353   - });
354   - }, true);
  348 + $scope.reloadProposals = function() {
  349 + $scope.cards = [];
  350 + $scope.reloadTopics();
  351 + };
355 352  
356 353 // Load topics
357 354  
358 355 $scope.loadTopics = function(token) {
359   - $scope.forceReload = false;
360 356 $scope.loading = true;
361   - // var path = '?private_token=' + token + '&fields=title,image,body,abstract&content_type=ProposalsDiscussionPlugin::Proposal';
362 357 var params = '?private_token=' + token + '&fields=title,id&content_type=ProposalsDiscussionPlugin::Topic';
363 358 var path = 'articles/' + ConfJuvAppConfig.noosferoDiscussion + '/children' + params;
364 359  
... ... @@ -367,19 +362,11 @@ angular.module(&#39;confjuvapp.controllers&#39;, [])
367 362 $scope.loading = false;
368 363 var topics = resp.data.articles;
369 364 for (var i = 0; i < topics.length; i++) {
370   - var topic_id = topics[i].id;
371   - var topic = null;
372   - for (var j = 0; j < $scope.topics.length; j++) {
373   - if (topic_id == $scope.topics[j].id) {
374   - topic = $scope.topics[j];
375   - }
376   - }
377   - if (topic == null) {
378   - topic = topics[i];
379   - topic.selected = true;
380   - $scope.topics.push(topic);
381   - }
382   - $scope.proposalsByTopic[topic.id] = [];
  365 + var topic = topics[i];
  366 + topic = topics[i];
  367 + topic.lastProposalId = null;
  368 + topic.empty = false;
  369 + $scope.topics.push(topic);
383 370 $scope.loadProposals(token, topic);
384 371 }
385 372 $scope.loading = false;
... ... @@ -392,25 +379,36 @@ angular.module(&#39;confjuvapp.controllers&#39;, [])
392 379 // Load proposals
393 380  
394 381 $scope.loadProposals = function(token, topic) {
  382 + if ($scope.topicFilter.value != 'all' && topic.id != $scope.topicFilter.value) {
  383 + return;
  384 + }
  385 +
395 386 $scope.loading = true;
396   - last_proposal = $scope.proposalsByTopic[topic.id][$scope.proposalsByTopic[topic.id].length -1];
397   - last_proposal = last_proposal == undefined ? null : last_proposal.id;
398 387  
399   - var params = '?private_token=' + token + '&fields=title,image,body,abstract,id,tag_list,categories,created_by&content_type=ProposalsDiscussionPlugin::Proposal&limit=' + ConfJuvAppConfig.proposalsPerPageAndTopic + '&oldest=younger_than&reference_id=' + last_proposal;
  388 + var perPage = 1;
  389 + if ($scope.topicFilter.value != 'all') {
  390 + perPage = 11;
  391 + }
  392 +
  393 + var params = '?private_token=' + token + '&fields=title,image,body,abstract,id,tag_list,categories,created_by&content_type=ProposalsDiscussionPlugin::Proposal&limit=' + perPage + '&oldest=younger_than&reference_id=' + topic.lastProposalId;
400 394  
401 395 var path = 'articles/' + topic.id + '/children' + params;
402 396  
403 397 $http.get(ConfJuvAppUtils.pathTo(path))
404 398 .then(function(resp) {
405 399 var proposals = resp.data.articles;
406   - $scope.proposalsByTopic[topic.id] = [];
  400 +
407 401 for (var i = 0; i < proposals.length; i++) {
408 402 var proposal = proposals[i];
409 403 proposal.topic = topic;
410   - $scope.proposalList.push(proposal);
411   - $scope.proposalsByTopic[topic.id].push(proposal);
412 404 $scope.cards.push(proposal);
413 405 }
  406 +
  407 + if (proposals.length == 0 && !topic.empty) {
  408 + topic.empty = true;
  409 + $scope.emptyTopicsCount++;
  410 + }
  411 +
414 412 $scope.loading = false;
415 413 }, function(err) {
416 414 $ionicPopup.alert({ title: 'Propostas', template: 'Não foi possível carregar as propostas do tópico ' + topic.title });
... ... @@ -421,21 +419,17 @@ angular.module(&#39;confjuvapp.controllers&#39;, [])
421 419 // Cards
422 420  
423 421 $scope.cardDestroyed = function(index) {
  422 + var thisProposal = $scope.cards[index];
  423 + var topic = thisProposal.topic;
  424 + if (topic.lastProposalId == null || topic.lastProposalId > thisProposal.id) {
  425 + topic.lastProposalId = thisProposal.id;
  426 + }
424 427 $scope.cards.splice(index, 1);
425 428 if ($scope.cards.length === 0) {
426 429 for (var i = 0; i < $scope.topics.length; i++) {
427 430 var topic = $scope.topics[i];
428   - topic.selected = true;
429   - $scope.proposalList= [];
430   - $scope.loadProposals($scope.token, topic);
431   - }
432   - if ($scope.proposalList.length == 0){
433   - $scope.forceReload = true;
434   - }
435   - for (var i = 0; i < $scope.proposalList.length; i++) {
436   - var card = $scope.proposalList[i];
437   - if (card.topic.selected) {
438   - $scope.cards.push(card);
  431 + if (!topic.empty) {
  432 + $scope.loadProposals($scope.token, topic);
439 433 }
440 434 }
441 435 }
... ... @@ -449,17 +443,6 @@ angular.module(&#39;confjuvapp.controllers&#39;, [])
449 443 $scope.cardDestroyed(index);
450 444 };
451 445  
452   - // Swipe cards when filters are selected
453   - $scope.$watch('selection', function() {
454   - $scope.cards = [];
455   - for (var i = 0; i < $scope.proposalList.length; i++) {
456   - var card = $scope.proposalList[i];
457   - if (card.topic.selected) {
458   - $scope.cards.push(card);
459   - }
460   - }
461   - });
462   -
463 446 /******************************************************************************
464 447 S I N G L E P R O P O S A L
465 448 ******************************************************************************/
... ... @@ -599,9 +582,7 @@ angular.module(&#39;confjuvapp.controllers&#39;, [])
599 582 topic: topic,
600 583 author: { name: $scope.user.name, id: $scope.user.id }
601 584 };
602   - $scope.proposalList.push(proposal);
603 585 $scope.cards.push(proposal);
604   - $scope.proposalsByTopic[data.topic_id.id].push(proposal);
605 586 $scope.loading = false;
606 587 $scope.data.title = $scope.data.description = $scope.data.topic_id = null;
607 588 document.getElementById('save-proposal').innerHTML = 'Criar';
... ...