Commit 241f99d2ebb24c54a385d5292519a50eea927c6c

Authored by Leonardo Merlin
1 parent 2b6de365

Add toggle at 'respostas e compromissos' (program page)

src/app/components/article-service/article.service.js
... ... @@ -23,6 +23,7 @@
23 23 getProposals: getProposals,
24 24 getProposalById: getProposalById,
25 25 getProposalsByTopicId: getProposalsByTopicId,
  26 + getResponseByProposalId: getResponseByProposalId,
26 27 createProposal: createProposal,
27 28 voteProposal: voteProposal,
28 29 getEvents: getEvents,
... ... @@ -139,6 +140,13 @@
139 140 getProposalById(topicId + '/children', params, cbSuccess, cbError);
140 141 }
141 142  
  143 + function getResponseByProposalId (proposalId) {
  144 + var url = service.apiArticles + proposalId;
  145 + // var paramsExtended = {};
  146 +
  147 + return UtilService.get(url);
  148 + }
  149 +
142 150 function createProposal (proposal, targetId, categoryId, cbSuccess, cbError){
143 151  
144 152 if(!$rootScope.currentUser){
... ...
src/app/components/dialoga-service/dialoga.service.js
... ... @@ -22,6 +22,7 @@
22 22 extendedService.getProgramsByThemeId = getProgramsByThemeId;
23 23 extendedService.getProgramsRandom = getProgramsRandom;
24 24 extendedService.getEvents = getEvents; // override
  25 + extendedService.getResponseByProposalId = getResponseByProposalId;
25 26 extendedService.getQuestions = getQuestions;
26 27 extendedService.searchPrograms = searchPrograms;
27 28 extendedService.searchProposals = searchProposals;
... ... @@ -212,6 +213,12 @@
212 213 return ArticleService.getEvents(API.communityId, paramsExtended);
213 214 }
214 215  
  216 + function getResponseByProposalId(/*proposalId*/){
  217 +
  218 + return ArticleService.getResponseByProposalId(API.articleId.terms);
  219 + // return ArticleService.getResponseByProposalId(proposalId);
  220 + }
  221 +
215 222 // TODO: implement
216 223 function getQuestions (cbSuccess/*, cbError*/) {
217 224 if( !!CACHE.questions ){
... ...
src/app/pages/programas/programa.controller.js
... ... @@ -286,6 +286,7 @@
286 286 };
287 287  
288 288 ProgramaPageController.prototype.toggleContentVisibility = function() {
  289 + var vm = this;
289 290 var $sectionContent = angular.element('.section-content');
290 291  
291 292 if (!$sectionContent || $sectionContent.length === 0) {
... ... @@ -300,4 +301,49 @@
300 301 angular.element('html,body').animate({scrollTop: $sectionContent.offset().top}, 'fast');
301 302 }
302 303 };
  304 +
  305 + ProgramaPageController.prototype.toggleResponseVisibility = function(proposal) {
  306 + var vm = this;
  307 +
  308 + if(!proposal){
  309 + vm.$log.error('Error - proposal is:', proposal);
  310 + return;
  311 + }
  312 +
  313 + if(proposal.response){
  314 + // show response
  315 + toggle();
  316 + }else{
  317 +
  318 + // load response
  319 + proposal.response = {
  320 + loading: true,
  321 + error: false,
  322 + content: null
  323 + };
  324 +
  325 + vm.DialogaService.getResponseByProposalId(proposal.id)
  326 + .then(function(data){
  327 + proposal.response.content = data.article.body;
  328 + toggle();
  329 + }).catch(function(){
  330 + proposal.response.error = false;
  331 + }).finally(function(){
  332 + proposal.response.loading = false;
  333 + });
  334 + }
  335 +
  336 + function toggle () {
  337 + var $el = angular.element('.gov-response-' + proposal.id);
  338 +
  339 + if ($el.is(':visible')) {
  340 + $el.slideUp();
  341 + }else {
  342 + $el.slideDown(100, function(){
  343 + angular.element('html,body').animate({scrollTop: $el.offset().top}, 'fast');
  344 + });
  345 + }
  346 + }
  347 + };
  348 +
303 349 })();
... ...
src/app/pages/programas/programa.html
... ... @@ -32,7 +32,7 @@
32 32 <div ng-if="pagePrograma.article.archived" class="img-mask--background">
33 33 <div class="icon icon-programa-respondido">
34 34 <div class="icon-circle">
35   - <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
  35 + <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
36 36 </div>
37 37 </div>
38 38 </div>
... ... @@ -220,34 +220,51 @@
220 220 </div>
221 221 </div>
222 222 <div ng-if="pagePrograma.proposalsTopRated">
223   - <div class="sub-section" ng-repeat="proposal in pagePrograma.proposalsTopRated">
224   - <div class="container">
225   - <div class="row">
226   - <div class="col-sm-4 col-md-3">
227   - <div class="img-mask--container" ng-style="{'background-image':'url( {{::pagePrograma.banner.src}} )'}">
228   - <div class="img-mask--background">
229   - <div class="icon icon-programa-respondido">
230   - <div class="icon-circle">
231   - <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
  223 + <div ng-repeat="proposal in pagePrograma.proposalsTopRated">
  224 + <div class="sub-section">
  225 + <div class="container">
  226 + <div class="row">
  227 + <div class="col-sm-4 col-md-3">
  228 + <div class="img-mask--container" ng-style="{'background-image':'url( {{::pagePrograma.banner.src}} )'}">
  229 + <div class="img-mask--background">
  230 + <div class="icon icon-programa-respondido">
  231 + <div class="icon-circle">
  232 + <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
  233 + </div>
232 234 </div>
233 235 </div>
234 236 </div>
235 237 </div>
  238 + <div class="col-sm-8 col-md-9">
  239 + <br>
  240 + <h3 class="color-theme-fg">{{($index+1)}}a proposta mais votada:</h3>
  241 + <p>{{::proposal.abstract}}</p>
  242 + <div class="button--themed">
  243 + <button class="btn btn-block" ng-click="pagePrograma.toggleResponseVisibility(proposal)">
  244 + Veja a resposta e o compromisso do governo
  245 + <div class="button-left-icon">
  246 + <span class="glyphicon glyphicon-chevron-down pull-right color-theme-common-fg" aria-hidden="true"></span>
  247 + </div>
  248 + </button>
  249 + </div>
  250 + <br>
  251 + </div>
236 252 </div>
237   - <div class="col-sm-8 col-md-9">
238   - <br>
239   - <h3 class="color-theme-fg">{{($index+1)}}a proposta mais votada:</h3>
240   - <p>{{::proposal.abstract}}</p>
241   -
242   - <div class="button--themed">
243   - <button class="btn btn-block">
244   - Veja a resposta e o compromisso do governo
245   - <div class="button-left-icon">
246   - <span class="glyphicon glyphicon-chevron-down pull-right color-theme-common-fg" aria-hidden="true"></span>
  253 + </div>
  254 + </div>
  255 + <div ng-if="proposal.response" class="gov-response gov-response-{{::proposal.id}}" style="display:none;">
  256 + <div class="container">
  257 + <div class="row">
  258 + <div class="col-sm-12">
  259 + <div ng-if="proposal.response.loading" class="alert alert-info" role="alert">Carregando a resposta e compromisso do governo.</div>
  260 + <div ng-if="proposal.response.error" class="alert alert-warning" role="alert">Erro ao carregar a resposta e compromisso. Tente novamente ou <a ui-sref="duvidas">entre em contato</a>.</div>
  261 + <div ng-if="proposal.response.content">
  262 + <h3 class="color-theme-fg">Compromissos:</h3>
  263 + <div class="gov-response--content">
  264 + <div ng-bind-html="proposal.response.content"></div>
247 265 </div>
248   - </button>
  266 + </div>
249 267 </div>
250   - <br>
251 268 </div>
252 269 </div>
253 270 </div>
... ...
src/app/pages/programas/programas.scss
... ... @@ -272,6 +272,10 @@
272 272 }
273 273 }
274 274  
  275 + .gov-response {
  276 + background-color: #e1e1e1;
  277 + }
  278 +
275 279 .button--themed {
276 280 position: relative;
277 281 max-width: 500px;
... ...