Commit 9acab0bf2ed7d445986d283f372fadb98ea2a6a6

Authored by Leonardo Merlin
1 parent d3cac6d4

Improve proposal-list animation

src/app/components/proposal-carousel/proposal-carousel.directive.js
... ... @@ -60,7 +60,7 @@
60 60 var vm = this;
61 61  
62 62 // notify parents - handled by parents
63   - vm.$scope.$emit('proposal-carousel:toProposals');
  63 + vm.$scope.$emit('proposal-carousel:showProposals');
64 64 };
65 65  
66 66 var directive = {
... ...
src/app/components/proposal-list/proposal-list.html
1 1 <div class="proposal-list">
2   - <div class="table-responsive" ng-if="vm.loading">
3   - <div class="table-responsive">Carregando...</div>
  2 + <div class="" ng-if="vm.loading">
  3 + <div class="">Carregando...</div>
4 4 </div>
5   - <div class="table-responsive" ng-if="!vm.loading && vm.proposalsPerPage">
  5 + <div class="" ng-if="!vm.loading && vm.proposalsPerPage">
6 6 <table class="table table-striped">
7 7 <thead>
8 8 <tr>
... ... @@ -25,13 +25,13 @@
25 25 </div>
26 26 </div>
27 27 <div class="row row-actions">
28   - <div class="col-md-8">
  28 + <div class="col-sm-8">
29 29 <button type="button" class="btn btn-link btn-rate color-theme-common-fg" ng-click="vm.showContent(proposal)">
30 30 Avalie esta proposta
31 31 <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
32 32 </button>
33 33 </div>
34   - <div class="col-md-4">
  34 + <div class="col-sm-4">
35 35 <proposal-stats class="text-right" views="{{::proposal.hits}}" up="{{::proposal.votes_for}}" down="{{::proposal.votes_against}}"></proposal-stats>
36 36 </div>
37 37 </div>
... ...
src/app/pages/programas/programa.controller.js
... ... @@ -118,16 +118,26 @@
118 118 ProgramaPageController.prototype.attachListeners = function() {
119 119 var vm = this;
120 120  
121   - vm.$scope.$on('proposal-carousel:toProposals', function() {
  121 + vm.$scope.$on('proposal-carousel:showProposals', function() {
122 122 if(!vm._proposal_list){
123 123 vm._proposal_list = vm.$element.find('.proposal-ranking-section');
124 124 }
125 125  
126   - vm._proposal_list.slideToggle();
  126 + vm._proposal_list.slideDown();
127 127 angular.element('body').animate({scrollTop: vm._proposal_list.offset().top}, 'fast');
128 128 });
129 129 };
130 130  
  131 + ProgramaPageController.prototype.hideProposals = function() {
  132 + var vm = this;
  133 +
  134 + if(!vm._proposal_list){
  135 + vm._proposal_list = vm.$element.find('.proposal-ranking-section');
  136 + }
  137 +
  138 + vm._proposal_list.slideUp();
  139 + };
  140 +
131 141 ProgramaPageController.prototype.makeProposal = function() {
132 142 var vm = this;
133 143  
... ...
src/app/pages/programas/programa.html
... ... @@ -85,6 +85,9 @@
85 85 <div class="container">
86 86 <div class="proposal-ranking-section-header">
87 87 <h3 class="color-theme-fg">Resultados de propostas mais votadas</h3>
  88 + <button class="btn btn-close" ng-click="pagePrograma.hideProposals()">
  89 + <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
  90 + </button>
88 91 </div>
89 92 <div class="proposal-ranking-section-table">
90 93 <proposal-list proposals="pagePrograma.proposals"></proposal-list>
... ...
src/app/pages/programas/programas.scss
... ... @@ -69,10 +69,19 @@
69 69 h3 {
70 70 margin-top: 0;
71 71 }
72   -
73 72 }
74 73  
75 74 .proposal-ranking-section {
76 75 background-color: #f1f1f1;
77 76 margin: 30px 0;
  77 +
  78 + .proposal-ranking-section-header{
  79 + position: relative;
  80 + }
  81 +
  82 + .btn-close {
  83 + position: absolute;
  84 + right: 0;
  85 + top: 0;
  86 + }
78 87 }
... ...