Commit 4c463e14e04de922511fbddb19de55685b2c0c3c
Exists in
master
and in
5 other branches
Merge branch 'master' of https://gitlab.com/participa/proposal-app
Showing
3 changed files
with
126 additions
and
74 deletions
Show diff stats
index.html
| ... | ... | @@ -99,13 +99,11 @@ |
| 99 | 99 | <script id="proposal-template" type="text/x-handlebars-template"> |
| 100 | 100 | <header class="container"> |
| 101 | 101 | <a id="display-contrast" href="#">Alto Contraste</a> |
| 102 | - <!-- | |
| 103 | 102 | <div class="participar"> |
| 104 | - <a href="#" class="button button-inline participe">Participe</a> | |
| 103 | + <!--<a href="#" class="button button-inline participe">Participe</a>--> | |
| 105 | 104 | <a href="#" class="entrar">Entrar</a> |
| 106 | 105 | <a href="#" class="logout hide">Sair</a> |
| 107 | 106 | </div> |
| 108 | - --> | |
| 109 | 107 | <h1> |
| 110 | 108 | <a href="#" class='logo'>{{article.title}}</a> |
| 111 | 109 | </h1> |
| ... | ... | @@ -249,48 +247,52 @@ |
| 249 | 247 | <div class="row"> |
| 250 | 248 | <div class="make-proposal-container col-sm-6 require-login-container"> |
| 251 | 249 | <section class="make-proposal box box-propostas"> |
| 252 | - <div class="container-title box-title">Faça uma proposta</div> | |
| 253 | - <div class="subtitle box-subtitle">Qual a sua sugestão para melhorar este programa?</div> | |
| 254 | - <div class="info box-info">Esta consulta termina em julho de 2015. Até lá, todas as propostas serão lidas e as cinco mais pontuadas em cada programa receberão resposta oficial do governo.</div> | |
| 255 | - <div class="row"> | |
| 256 | - <div class="col-sm-6 col-sm-offset-3"> | |
| 257 | - <div class="button send-proposal-button button-send box-footer"> | |
| 258 | - <a href="#"><span>Envie sua proposta</span></a> | |
| 250 | + <div class="section-content"> | |
| 251 | + <div class="container-title box-title">Faça uma proposta</div> | |
| 252 | + <div class="subtitle box-subtitle">Qual a sua sugestão para melhorar este programa?</div> | |
| 253 | + <div class="info box-info">Esta consulta termina em julho de 2015. Até lá, todas as propostas serão lidas e as cinco mais pontuadas em cada programa receberão resposta oficial do governo.</div> | |
| 254 | + <div class="row"> | |
| 255 | + <div class="col-sm-6 col-sm-offset-3"> | |
| 256 | + <div class="button send-proposal-button button-send box-footer"> | |
| 257 | + <a href="#"><span>Envie sua proposta</span></a> | |
| 258 | + </div> | |
| 259 | 259 | </div> |
| 260 | 260 | </div> |
| 261 | - </div> | |
| 262 | - <div class="login-container hide">Login</div> | |
| 263 | - <form class="make-proposal-form save-article-form require-login hide" id="make-proposal-form-{{id}}" action="{{proposal_action ../article . }}" method="post"> | |
| 264 | - <div class="message hide"></div> | |
| 265 | - <div> | |
| 266 | - <div><label for="article_abstract">Descrição</label></div> | |
| 267 | - <textarea id="article_abstract" class="countdown" name="article[abstract]" placeholder="Descrição" maxlength="200"></textarea> | |
| 261 | + <div class="login-container hide">Login</div> | |
| 262 | + <form class="make-proposal-form save-article-form require-login hide" id="make-proposal-form-{{id}}" action="{{proposal_action ../article . }}" method="post"> | |
| 263 | + <div class="message hide"></div> | |
| 264 | + <div> | |
| 265 | + <div><label for="article_abstract">Descrição</label></div> | |
| 266 | + <textarea id="article_abstract" class="countdown" name="article[abstract]" placeholder="Descrição" maxlength="200"></textarea> | |
| 267 | + </div> | |
| 268 | + <input type="hidden" id="type" name="article[type]" value="ProposalsDiscussionPlugin::Proposal"> | |
| 269 | + <input type="hidden" id="content_type" name="content_type" value="ProposalsDiscussionPlugin::Proposal"> | |
| 270 | + <input type="submit" id="make-proposal-button" name="make-proposal-button" class="make-proposal-button" value="Enviar"> | |
| 271 | + </form> | |
| 272 | + <div class="success-proposal-sent success-sent hide button-send"> | |
| 273 | + <p>Sua proposta foi encaminhada com sucesso! Ela se tornará pública em até 24 horas e poderá ser apoiada por outros participantes.</p> | |
| 274 | + <a href="#">Faça nova proposta</a> | |
| 268 | 275 | </div> |
| 269 | - <input type="hidden" id="type" name="article[type]" value="ProposalsDiscussionPlugin::Proposal"> | |
| 270 | - <input type="hidden" id="content_type" name="content_type" value="ProposalsDiscussionPlugin::Proposal"> | |
| 271 | - <input type="submit" id="make-proposal-button" name="make-proposal-button" class="make-proposal-button" value="Enviar"> | |
| 272 | - </form> | |
| 273 | - <div class="success-proposal-sent success-sent hide button-send"> | |
| 274 | - <p>Sua proposta foi encaminhada com sucesso! Ela se tornará pública em até 24 horas e poderá ser apoiada por outros participantes.</p> | |
| 275 | - <a href="#">Faça nova proposta</a> | |
| 276 | + <div class="clearfix"></div> | |
| 276 | 277 | </div> |
| 277 | - <div class="clearfix"></div> | |
| 278 | 278 | </section> |
| 279 | 279 | </div> |
| 280 | 280 | |
| 281 | 281 | <div class="support-proposal-container col-sm-6 require-login-container"> |
| 282 | 282 | <section class="support-proposal box box-propostas box-center box-apoie"> |
| 283 | - <div class="container-title box-title"> Apoie outras propostas</div> | |
| 284 | - <div class="alert alert-warning hide" role="alert"> | |
| 285 | - <i class="fa fa-warning"></i><strong>Proposta não encontrada</strong> | |
| 286 | - </div> | |
| 287 | - <div class="support-proposal-content require-login"> | |
| 288 | - <div class="random-proposal"></div> | |
| 289 | - <div class="loading">Carregando...</div> | |
| 290 | - <div class="no-proposals">Ainda não existe nenhuma proposta para este programa.</div> | |
| 283 | + <div class="section-content"> | |
| 284 | + <div class="container-title box-title"> Apoie outras propostas</div> | |
| 285 | + <div class="alert alert-warning hide" role="alert"> | |
| 286 | + <i class="fa fa-warning"></i><strong>Proposta não encontrada</strong> | |
| 287 | + </div> | |
| 288 | + <div class="support-proposal-content require-login"> | |
| 289 | + <div class="random-proposal"></div> | |
| 290 | + <div class="loading">Carregando...</div> | |
| 291 | + <div class="no-proposals">Ainda não existe nenhuma proposta para este programa.</div> | |
| 292 | + </div> | |
| 293 | + <div class="login-container hide">Login</div> | |
| 294 | + <div class="button-send hide"><a href="#"><span>Login</span></a></div> | |
| 291 | 295 | </div> |
| 292 | - <div class="login-container hide">Login</div> | |
| 293 | - <div class="button-send hide"><a href="#"><span>Login</span></a></div> | |
| 294 | 296 | </section> |
| 295 | 297 | </div> |
| 296 | 298 | |
| ... | ... | @@ -491,6 +493,11 @@ |
| 491 | 493 | </div> |
| 492 | 494 | </script> |
| 493 | 495 | |
| 496 | + <div class="success-panel hide"> | |
| 497 | + <div class="icon"></div> | |
| 498 | + <div class="message"></div> | |
| 499 | + </div> | |
| 500 | + | |
| 494 | 501 | <div class="terms-of-use text-center"> |
| 495 | 502 | <a href="#/artigo/107880">Termos de uso</a> |
| 496 | 503 | </div> | ... | ... |
js/main.js
| ... | ... | @@ -100,15 +100,18 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 100 | 100 | $body.off('click', '.vote-actions .vote-action'); |
| 101 | 101 | $body.on('click', '.vote-actions .vote-action', function(e) { |
| 102 | 102 | //Helps to prevent more than one vote per proposal |
| 103 | - if(ProposalApp.hasProposalbeenVoted(article.id)){ | |
| 104 | - console.log("Proposta " + article.id + " já havia sido votada"); | |
| 105 | - contextMain.loadRandomProposal(topic_id); | |
| 103 | + var button = $(this); | |
| 104 | + | |
| 105 | + if(!logged_in) { | |
| 106 | + $(this).closest('.require-login-container').find('.button-send a').click(); | |
| 106 | 107 | e.preventDefault(); |
| 107 | 108 | return; |
| 108 | 109 | } |
| 109 | 110 | |
| 110 | - if(!logged_in) { | |
| 111 | - $(this).closest('.require-login-container').find('.button-send a').click(); | |
| 111 | + if(ProposalApp.hasProposalbeenVoted(article.id)){ | |
| 112 | + console.log("Proposta " + article.id + " já havia sido votada"); | |
| 113 | + Main.displaySuccess(button.closest('.support-proposal .section-content'), 'Voto realizado com sucesso', 800); | |
| 114 | + contextMain.loadRandomProposal(topic_id); | |
| 112 | 115 | e.preventDefault(); |
| 113 | 116 | return; |
| 114 | 117 | } |
| ... | ... | @@ -121,6 +124,7 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 121 | 124 | private_token: Main.private_token |
| 122 | 125 | } |
| 123 | 126 | }).done(function( /*data*/ ) { |
| 127 | + Main.displaySuccess(button.closest('.support-proposal .section-content'), 'Voto realizado com sucesso', 800); | |
| 124 | 128 | ProposalApp.addVotedProposal(article.id); |
| 125 | 129 | contextMain.loadRandomProposal(topic_id); |
| 126 | 130 | }); |
| ... | ... | @@ -202,9 +206,11 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 202 | 206 | var requireLoginContainer = loginButton.closest('.require-login-container'); |
| 203 | 207 | |
| 204 | 208 | if(logged_in) { |
| 209 | + $('.logout').show(); | |
| 205 | 210 | if(token){ |
| 206 | 211 | Main.private_token = token; |
| 207 | 212 | } |
| 213 | + requireLoginContainer = $('.require-login-container'); | |
| 208 | 214 | requireLoginContainer.find('.require-login').show(); |
| 209 | 215 | requireLoginContainer.find('.require-login .message').show(); |
| 210 | 216 | requireLoginContainer.find('.login-container').hide(); |
| ... | ... | @@ -222,6 +228,7 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 222 | 228 | } else { |
| 223 | 229 | requireLoginContainer.find('.require-login').hide(); |
| 224 | 230 | requireLoginContainer.find('.login-container').show(); |
| 231 | + $('.logout').hide(); | |
| 225 | 232 | } |
| 226 | 233 | }, |
| 227 | 234 | guid: function() { |
| ... | ... | @@ -339,7 +346,6 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 339 | 346 | $('#content').hide(); |
| 340 | 347 | $('#article-container').hide(); |
| 341 | 348 | $proposal = $('#proposal-item-' + proposal_id); |
| 342 | - $proposal.find('.make-proposal-form').hide(); | |
| 343 | 349 | $proposal.find('.proposal-header').hide(); |
| 344 | 350 | $proposal.find('.make-proposal-container').hide(); |
| 345 | 351 | $proposal.find('.support-proposal-container').hide(); |
| ... | ... | @@ -555,6 +561,22 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 555 | 561 | } |
| 556 | 562 | }, 300); |
| 557 | 563 | }, |
| 564 | + displaySuccess: function(container, text, timeout) { | |
| 565 | + timeout = typeof timeout !== 'undefined' ? timeout : 2000; | |
| 566 | + container.css('opacity', 0.1); | |
| 567 | + var successPanel = $('.success-panel').clone(); | |
| 568 | + successPanel.find('.message').html(text); | |
| 569 | + successPanel.appendTo(container.closest('.categories')); | |
| 570 | + successPanel.show(); | |
| 571 | + successPanel.css("top", Math.max(0, ((container.height() - successPanel.outerHeight()) / 2) + container.offset().top) + "px"); | |
| 572 | + successPanel.css("left", Math.max(0, ((container.width() - successPanel.outerWidth()) / 2) + container.offset().left) + "px"); | |
| 573 | + | |
| 574 | + var interval = setTimeout(function() { | |
| 575 | + successPanel.hide(); | |
| 576 | + container.css('opacity', 1); | |
| 577 | + successPanel.remove(); | |
| 578 | + }, timeout); | |
| 579 | + }, | |
| 558 | 580 | responseToText: function(responseJSONmessage){ |
| 559 | 581 | var o = JSON.parse(responseJSONmessage); |
| 560 | 582 | var msg = ""; |
| ... | ... | @@ -564,15 +586,16 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 564 | 586 | if (o[key] instanceof Array) { |
| 565 | 587 | fn = key; |
| 566 | 588 | for (var i = 0; i < o[key].length; i++) { |
| 567 | - msg += fn + " " + o[key][i] + ", "; | |
| 589 | + msg += fn + " " + o[key][i] + "</br>"; | |
| 568 | 590 | } |
| 569 | 591 | } |
| 570 | 592 | } |
| 571 | - msg = msg.replace('password_confirmation', 'confirmação da senha'); | |
| 572 | - msg = msg.replace('password', 'senha'); | |
| 573 | - msg = msg.replace('login', 'nome de usuário'); | |
| 574 | - msg = msg.replace('email', 'e-mail'); | |
| 575 | - return msg.substring(0, msg.length - 2) + "."; | |
| 593 | + msg = msg.replace('password_confirmation', "campo 'confirmação da senha'"); | |
| 594 | + msg = msg.replace(/password/g, "campo 'senha'"); | |
| 595 | + msg = msg.replace('login', "campo 'nome de usuário'"); | |
| 596 | + msg = msg.replace('email', "campo 'e-mail'"); | |
| 597 | + msg = msg.substring(0, msg.length - 5) + "."; | |
| 598 | + return msg; | |
| 576 | 599 | } |
| 577 | 600 | } |
| 578 | 601 | })(); |
| ... | ... | @@ -734,6 +757,7 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 734 | 757 | $form.siblings('.success-sent').show(); |
| 735 | 758 | $form.siblings('.subtitle').hide(); |
| 736 | 759 | $form.siblings('.info').hide(); |
| 760 | + Main.displaySuccess($form.closest('.make-proposal .section-content'), 'Proposta enviada com sucesso', 2000); | |
| 737 | 761 | }) |
| 738 | 762 | .fail(function( jqxhr, textStatus, error ) { |
| 739 | 763 | var err = textStatus + ', ' + error; |
| ... | ... | @@ -743,6 +767,8 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 743 | 767 | }); |
| 744 | 768 | }); |
| 745 | 769 | |
| 770 | + | |
| 771 | + | |
| 746 | 772 | }) |
| 747 | 773 | .fail(function( jqxhr, textStatus, error ) { |
| 748 | 774 | var err = textStatus + ', ' + error; |
| ... | ... | @@ -763,6 +789,7 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 763 | 789 | $.getJSON(url).done(function( /*data*/ ) { |
| 764 | 790 | logged_in = true; |
| 765 | 791 | Main.private_token = $.cookie('_dialoga_session'); |
| 792 | + setTimeout(function(){ $('.logout').show(); }, 2000); | |
| 766 | 793 | }); |
| 767 | 794 | } |
| 768 | 795 | |
| ... | ... | @@ -770,6 +797,7 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 770 | 797 | var message = $('.login .message'); |
| 771 | 798 | message.hide(); |
| 772 | 799 | message.text(''); |
| 800 | + var button = $(this); | |
| 773 | 801 | $.ajax({ |
| 774 | 802 | type: 'post', |
| 775 | 803 | url: host + '/api/v1/login', |
| ... | ... | @@ -779,6 +807,7 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 779 | 807 | } |
| 780 | 808 | }).done(function(data) { |
| 781 | 809 | Main.loginCallback(true, data.private_token); |
| 810 | + Main.displaySuccess(button.closest('.section-content'), 'Login efetuado com sucesso', 1000); | |
| 782 | 811 | }).fail(function( /*data*/ ) { |
| 783 | 812 | message.show(); |
| 784 | 813 | message.text('Não foi possível logar'); |
| ... | ... | @@ -829,6 +858,7 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 829 | 858 | var loading = $('.login-container .loading'); |
| 830 | 859 | loading.show(); |
| 831 | 860 | signup.hide(); |
| 861 | + var button = $(this); | |
| 832 | 862 | |
| 833 | 863 | $.ajax({ |
| 834 | 864 | type: 'post', |
| ... | ... | @@ -836,10 +866,11 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 836 | 866 | data: $(this).parents('.signup').serialize(), |
| 837 | 867 | }).done(function(data) { |
| 838 | 868 | Main.loginCallback(true, data.private_token); |
| 869 | + Main.displaySuccess(button.closest('.section-content'), 'Cadastro efetuado com sucesso', 1000); | |
| 839 | 870 | }).fail(function(data) { |
| 840 | 871 | var msg = Main.responseToText(data.responseJSON.message); |
| 841 | 872 | message.show(); |
| 842 | - message.text('Não foi possível efetuar o cadastro: ' + msg); | |
| 873 | + message.html('Não foi possível efetuar o cadastro: <br/><br/>' + msg); | |
| 843 | 874 | }).always(function() { |
| 844 | 875 | loading.hide(); |
| 845 | 876 | signup.show(); |
| ... | ... | @@ -874,10 +905,13 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 874 | 905 | |
| 875 | 906 | $(document).on('click', '.logout', function (e){ |
| 876 | 907 | var self = $(this); |
| 908 | + $.removeCookie('_dialoga_session'); | |
| 909 | + $.removeCookie('votedProposals'); | |
| 877 | 910 | $.removeCookie('*'); |
| 878 | 911 | logged_in = false; |
| 879 | 912 | $('.logout').hide(); |
| 880 | 913 | $('.entrar').show(); |
| 914 | + location.reload(); | |
| 881 | 915 | e.preventDefault(); |
| 882 | 916 | }); |
| 883 | 917 | |
| ... | ... | @@ -898,5 +932,7 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 898 | 932 | console.log('The browser not supports the hashchange event!'); |
| 899 | 933 | } |
| 900 | 934 | |
| 935 | + | |
| 936 | + | |
| 901 | 937 | return Main; |
| 902 | 938 | }); | ... | ... |
sass/style.sass
| ... | ... | @@ -219,6 +219,10 @@ td |
| 219 | 219 | background-repeat: no-repeat |
| 220 | 220 | color: #fff |
| 221 | 221 | padding-left: $gutter * 1.5 |
| 222 | + a | |
| 223 | + display: block | |
| 224 | + padding: 15px 0 18px 0 | |
| 225 | + margin: -15px 0 -18px 0 | |
| 222 | 226 | &-participe |
| 223 | 227 | .fa |
| 224 | 228 | margin-right: $gutter * 0.5 |
| ... | ... | @@ -915,6 +919,11 @@ td |
| 915 | 919 | .title |
| 916 | 920 | font-size: 22px |
| 917 | 921 | |
| 922 | +// 6.19 - sucesso | |
| 923 | +.success-panel | |
| 924 | + position: absolute | |
| 925 | + z-index: 100 | |
| 926 | + | |
| 918 | 927 | // ------------------------------------ |
| 919 | 928 | // 7 - Modificadores |
| 920 | 929 | // ------------------------------------ |
| ... | ... | @@ -1051,33 +1060,33 @@ h3.titulo-destaque |
| 1051 | 1060 | color: #fff |
| 1052 | 1061 | .background |
| 1053 | 1062 | background-color: #000 |
| 1054 | - .container | |
| 1055 | - h2,h3,h4,a,p,li,label,.label,.login i,.total,.updated-at span | |
| 1056 | - color: #fff | |
| 1057 | - a | |
| 1058 | - text-decoration: underline | |
| 1059 | - small | |
| 1060 | - color: darken(#fff, 40%) | |
| 1061 | - blockquote | |
| 1062 | - border-color: #fff | |
| 1063 | - .button,.show_body a,.login input.button,.box-category li | |
| 1064 | - background-color: #fff | |
| 1065 | - border-color: darken(#fff, 40%) | |
| 1063 | + // .container | |
| 1064 | + h2,h3,h4,a,p,li,label,.label,.login i,.total,.updated-at span | |
| 1065 | + color: #fff | |
| 1066 | + a | |
| 1067 | + text-decoration: underline | |
| 1068 | + small | |
| 1069 | + color: darken(#fff, 40%) | |
| 1070 | + blockquote | |
| 1071 | + border-color: #fff | |
| 1072 | + .button,.show_body a,.login input.button,.box-category li | |
| 1073 | + background-color: #fff | |
| 1074 | + border-color: darken(#fff, 40%) | |
| 1075 | + color: #000 | |
| 1076 | + text-decoration: none | |
| 1077 | + +hover(#fff, 40%) | |
| 1078 | + span | |
| 1066 | 1079 | color: #000 |
| 1067 | - text-decoration: none | |
| 1068 | - +hover(#fff, 40%) | |
| 1069 | - span | |
| 1070 | - color: #000 | |
| 1071 | - .icon | |
| 1072 | - color: #000 !important | |
| 1073 | - text-decoration: none | |
| 1074 | - background-color: #fff | |
| 1075 | - +hover(#fff,40%) | |
| 1076 | - &-vote | |
| 1077 | - border-color: darken(#fff, 40%) !important | |
| 1078 | - @each $category,$color in $categories | |
| 1079 | - &-#{$category} | |
| 1080 | - background-image: url(images/icons/#{$category}-contrast.png) | |
| 1080 | + .icon | |
| 1081 | + color: #000 !important | |
| 1082 | + text-decoration: none | |
| 1083 | + background-color: #fff | |
| 1084 | + +hover(#fff,40%) | |
| 1085 | + &-vote | |
| 1086 | + border-color: darken(#fff, 40%) !important | |
| 1087 | + @each $category,$color in $categories | |
| 1088 | + &-#{$category} | |
| 1089 | + background-image: url(images/icons/#{$category}-contrast.png) | |
| 1081 | 1090 | .tab |
| 1082 | 1091 | a |
| 1083 | 1092 | background-color: darken(#fff, 85%) | ... | ... |