Download as
Browse Code »

Commit a79181886c8baa4566e4d11881bf9b28e98c8170

Authored by Leandro Santos
2 parents c53a714d b86d064d
Exists in master and in 11 other branches build, build2, capa, captcha, contigency_plan_recaptcha, jasmine-testing, make_harder_to_vote_twice, production, refactory-sass, session_cookie, staging

fix conflit

Showing 11 changed files with 193 additions and 94 deletions   Show diff stats
images/arrow.png
View file @c53a714

729 Bytes
images/black-alpha.png 0 → 100644
View file @a791818

178 Bytes
images/result-dislike.png 0 → 100644
View file @a791818

275 Bytes
images/result-like.png 0 → 100644
View file @a791818

267 Bytes
images/white-line.png 0 → 100644
View file @a791818

167 Bytes
@@ -88,11 +88,11 @@ @@ -88,11 +88,11 @@
88 </div> 88 </div>
89 <div class='title'>{{title}}</div> 89 <div class='title'>{{title}}</div>
90 <div class='abstract'>{{{abstract}}}</div> 90 <div class='abstract'>{{{abstract}}}</div>
91 - <div class='show_body'><a href='#'>Conheça o Programa<span></span></a></div> 91 + <div class='show_body'><a href='#'><span>Conheça o Programa</span></a></div>
92 </div> 92 </div>
93 93
94 <div class='body hide'> 94 <div class='body hide'>
95 - {{body}} 95 + {{replace body '<[^>]+>' ''}}
96 <!-- 96 <!--
97 <div class='mais-medicos'> todo seu conteudo do mais medicos vai aqui </div> 97 <div class='mais-medicos'> todo seu conteudo do mais medicos vai aqui </div>
98 <div class='sinesp'> todo seu conteudo do sinesp vai aqui </div> 98 <div class='sinesp'> todo seu conteudo do sinesp vai aqui </div>
@@ -182,26 +182,30 @@ @@ -182,26 +182,30 @@
182 <a href="#" class="like dislike" data-vote-value="-1"></a> 182 <a href="#" class="like dislike" data-vote-value="-1"></a>
183 <a href="#" class="like" data-vote-value="1"></a> 183 <a href="#" class="like" data-vote-value="1"></a>
184 <a href="#" class="skip">Pular</a> 184 <a href="#" class="skip">Pular</a>
185 - <a href="#" class="result">Resultado</a> 185 + <a href="#" class="vote-result">Resultados</a>
186 </div> 186 </div>
187 </script> 187 </script>
188 188
189 <script id="results" type='text/x-handlebars-template'> 189 <script id="results" type='text/x-handlebars-template'>
190 - <div class="results-content">  
191 - <table>  
192 - <tr class="header">  
193 - <td class="abstract-text">Texto da Alternativa</td>  
194 - <td class="votes-for">Gostei</td>  
195 - <td class="votes-against">Não Gostei</td>  
196 - </tr>  
197 - {{#each articles}}  
198 - <tr>  
199 - <td class="abstract-text"><div class="truncate"><p class="truncated">{{abstract}}</p></div></td>  
200 - <td class="votes-for">{{votes_for}}</td>  
201 - <td class="votes-against">{{votes_against}}</td> 190 + <div class="loading">Carregando...</div>
  191 + <div class="results-content hide">
  192 + <a href="#" class="vote-result">Fechar</a>
  193 + <table>
  194 + <tr class="header">
  195 + <td class="abstract-text">Texto da Alternativa</td>
  196 + <td class="votes-for"></td>
  197 + <td class="votes-against"></td>
  198 + <td class="score">Pontuação</td>
202 </tr> 199 </tr>
203 - {{/each}}  
204 - </table> 200 + {{#each articles}}
  201 + <tr>
  202 + <td class="abstract-text"><div class="truncate"><p class="truncated">{{abstract}}</p></div></td>
  203 + <td class="votes-for">{{votes_for}}</td>
  204 + <td class="votes-against">{{votes_against}}</td>
  205 + <td class="score">{{#score .}}{{/score}}</td>
  206 + </tr>
  207 + {{/each}}
  208 + </table>
205 </div> 209 </div>
206 </script> 210 </script>
207 211
js/handlebars-helpers.js
  Diff comments   View file @a791818
@@ -48,3 +48,7 @@ Handlebars.registerHelper(&#39;proposal_detail&#39;, function(proposals, options) { @@ -48,3 +48,7 @@ Handlebars.registerHelper(&#39;proposal_detail&#39;, function(proposals, options) {
48 Handlebars.registerHelper('replace', function(string, to_replace, replacement) { 48 Handlebars.registerHelper('replace', function(string, to_replace, replacement) {
49 return (string || '').replace(new RegExp(to_replace, 'g'), replacement); 49 return (string || '').replace(new RegExp(to_replace, 'g'), replacement);
50 }); 50 });
  51 +
  52 +Handlebars.registerHelper('score', function(article) {
  53 + return article.votes_for - article.votes_against;
  54 +});
@@ -168,13 +168,22 @@ function loadRandomProposal(topic_id, private_token) { @@ -168,13 +168,22 @@ function loadRandomProposal(topic_id, private_token) {
168 }); 168 });
169 e.preventDefault(); 169 e.preventDefault();
170 }); 170 });
171 - $(document.body).off('click', '.vote-actions .result');  
172 - $(document.body).on('click', '.vote-actions .result', function(e) { 171 +
  172 + $('.results-container').hide();
  173 + $('.experience-proposal-container').show();
  174 + $('.talk-proposal-container').show();
  175 +
  176 + $(document.body).off('click', '.vote-result');
  177 + $(document.body).on('click', '.vote-result', function(e) {
173 $('.results-container').toggle(); 178 $('.results-container').toggle();
174 if($('.results-container').is(":visible")) { 179 if($('.results-container').is(":visible")) {
175 - var url = host + '/api/v1/articles/' + topic_id + '/children' + '?private_token=' + private_token + '&limit=10&fields=id,name,abstract,votes_for,votes_against&content_type=ProposalsDiscussionPlugin::Proposal'; 180 + $('.results-container .loading').show();
  181 + $('.results-container .results-content').hide();
  182 + var url = host + '/api/v1/articles/' + topic_id + '/children' + '?private_token=' + private_token + '&limit=10&order=votes_score&fields=id,name,abstract,votes_for,votes_against&content_type=ProposalsDiscussionPlugin::Proposal';
176 $.getJSON(url).done(function( data ) { 183 $.getJSON(url).done(function( data ) {
177 $('.results-container').html(resultsTemplate(data)); 184 $('.results-container').html(resultsTemplate(data));
  185 + $('.results-container .loading').hide();
  186 + $('.results-container .results-content').show();
178 }); 187 });
179 $('.experience-proposal-container').hide(); 188 $('.experience-proposal-container').hide();
180 $('.talk-proposal-container').hide(); 189 $('.talk-proposal-container').hide();
sass/_proposal_detail.scss
  Diff comments   View file @a791818
@@ -12,6 +12,7 @@ @@ -12,6 +12,7 @@
12 padding: 15px 35px; 12 padding: 15px 35px;
13 margin: 0; 13 margin: 0;
14 width: 30%; 14 width: 30%;
  15 + min-width: 210px;
15 display: inline-block; 16 display: inline-block;
16 span { 17 span {
17 padding-left: 40px; 18 padding-left: 40px;
@@ -39,7 +40,7 @@ @@ -39,7 +40,7 @@
39 .proposal-header { 40 .proposal-header {
40 position: relative; 41 position: relative;
41 42
42 - .title, .abstract p, .show_body a { 43 + .title, .abstract p {
43 position: absolute; 44 position: absolute;
44 right: 0; 45 right: 0;
45 color: #fff; 46 color: #fff;
@@ -48,74 +49,126 @@ @@ -48,74 +49,126 @@
48 } 49 }
49 50
50 .title { 51 .title {
51 - padding: 20px 20px 5px 20px; 52 + padding: 20px;
52 text-transform: uppercase; 53 text-transform: uppercase;
53 - bottom: 60px; 54 + bottom: 170px;
54 font-size: 32px; 55 font-size: 32px;
  56 + text-align: center;
55 } 57 }
56 58
57 .abstract p { 59 .abstract p {
58 padding: 5px 20px 20px 20px; 60 padding: 5px 20px 20px 20px;
59 - bottom: 40px; 61 + bottom: 140px;
60 font-size: 14px; 62 font-size: 14px;
61 - text-align: left;  
62 - }  
63 -  
64 - .show_body a {  
65 - display: inline-block;  
66 - width: 30%;  
67 - right: 20%;  
68 - bottom: 0;  
69 - margin: 0;  
70 - font-size: 16px;  
71 - font-weight: bold;  
72 - padding: 18px 20px;  
73 - text-decoration: none;  
74 - overflow: hidden;  
75 - }  
76 - }  
77 - }  
78 - .results-container {  
79 - th, td {  
80 - border: 1px solid rgb(223, 223, 223);  
81 - }  
82 - .results-content {  
83 - border: 1px solid #00a9bd;  
84 - }  
85 - table {  
86 - border-collapse: collapse;  
87 - margin-top: 20px;  
88 -  
89 - .abstract-text {  
90 - width: 80%;  
91 - }  
92 - .votes-for {  
93 - width: 10%;  
94 - text-align: center;  
95 - }  
96 - .votes-against {  
97 - @extend .votes-for;  
98 - }  
99 - .header {  
100 - font-weight: bold;  
101 text-align: center; 63 text-align: center;
102 } 64 }
103 65
104 - .truncate {  
105 - display: table;  
106 - table-layout: fixed; 66 + .show_body {
107 width: 100%; 67 width: 100%;
108 - }  
109 - .truncated {  
110 - overflow-x: hidden;  
111 - text-overflow: ellipsis;  
112 - white-space: nowrap; 68 + padding: 30px 0;
  69 + margin: 10px auto;
  70 + text-align: center;
  71 +
  72 + a {
  73 + display: inline-block;
  74 + width: 70%;
  75 + text-decoration: none;
  76 + color: #fff;
  77 + font-size: 38px;
  78 + font-weight: bold;
  79 + text-transform: uppercase;
  80 + margin: 0 auto;
  81 + text-align: center;
  82 + }
  83 +
  84 + span {
  85 + padding: 5px 15px;
  86 + }
113 } 87 }
114 } 88 }
115 } 89 }
116 90
117 @each $category, $color in $categories { 91 @each $category, $color in $categories {
118 .#{$category}{ 92 .#{$category}{
  93 + .results-container {
  94 + &:before {
  95 + content:"";
  96 + display:table;
  97 + clear:both;
  98 + }
  99 + .results-content {
  100 + border: 1px solid $color;
  101 + margin-top: 20px;
  102 + .vote-result {
  103 + font-weight: bolder;
  104 + font-size: 12px;
  105 + text-transform: uppercase;
  106 + color: gray;
  107 + border: none;
  108 + margin: 10px;
  109 + border-radius: 6px;
  110 + text-align: center;
  111 + text-decoration: none;
  112 + padding: 9px;
  113 + display: block;
  114 + float: right;
  115 + }
  116 + }
  117 + table {
  118 + clear: both;
  119 + margin-top: 20px;
  120 + tbody tr:nth-child(odd) {
  121 + background-color: #e5e5e5;
  122 + }
  123 +
  124 + .abstract-text {
  125 + width: 80%;
  126 + }
  127 + .votes-for {
  128 + width: 10%;
  129 + text-align: center;
  130 + }
  131 + .votes-against {
  132 + @extend .votes-for;
  133 + }
  134 + .score {
  135 + @extend .votes-for;
  136 + }
  137 + .header {
  138 + line-height: 32px;
  139 + font-weight: bold;
  140 + text-align: center;
  141 + color: rgb(68, 68, 68);
  142 + .votes-for {
  143 + background-image: url(./images/result-like.png);
  144 + background-repeat: no-repeat;
  145 + display: inline-block;
  146 + background-position: center;
  147 + }
  148 + .votes-against {
  149 + background-image: url(./images/result-dislike.png);
  150 + }
  151 + .score {
  152 + background-image: none;
  153 + }
  154 + }
  155 +
  156 + .truncate {
  157 + display: table;
  158 + table-layout: fixed;
  159 + width: 100%;
  160 + }
  161 + .truncated {
  162 + overflow-x: hidden;
  163 + text-overflow: ellipsis;
  164 + white-space: nowrap;
  165 + }
  166 + tr {
  167 + color: rgb(77, 77, 77);
  168 + }
  169 + }
  170 + }
  171 +
119 .proposal-header { 172 .proposal-header {
120 .title { 173 .title {
121 background: $color; 174 background: $color;
@@ -123,17 +176,16 @@ @@ -123,17 +176,16 @@
123 .abstract p { 176 .abstract p {
124 background: $color; 177 background: $color;
125 } 178 }
126 - .show_body a {  
127 - background: $color url(images/white-alpha.png); 179 + .show_body {
  180 + background: $color url(images/black-alpha.png);
  181 + border-top: 5px solid $color;
  182 +
  183 + a {
  184 + background: transparent url(images/white-line.png) left center repeat-x;
  185 + }
128 186
129 span { 187 span {
130 - display: inline-block;  
131 - height: 60px;  
132 - width: 66px;  
133 - position: absolute;  
134 - right: 0;  
135 - top: 0;  
136 - background: $color url(images/arrow.png) top right no-repeat; 188 + background: $color url(images/black-alpha.png);
137 } 189 }
138 } 190 }
139 } 191 }
@@ -143,9 +195,8 @@ @@ -143,9 +195,8 @@
143 .abstract{ 195 .abstract{
144 color: #083e87; 196 color: #083e87;
145 width: 100%; 197 width: 100%;
146 - margin: 20px 0; 198 + margin: 0;
147 font-size: 24px; 199 font-size: 24px;
148 - font-style: italic;  
149 font-weight: bold; 200 font-weight: bold;
150 201
151 img { 202 img {
@@ -180,7 +231,10 @@ @@ -180,7 +231,10 @@
180 input, textarea { 231 input, textarea {
181 border-color: $color; 232 border-color: $color;
182 } 233 }
183 - .container-button a, input[type=submit] { 234 + textarea#article_abstract {
  235 + height: 205px;
  236 + }
  237 + .container-button a, input[type=submit], .success-proposal-sent a {
184 font-weight: bolder; 238 font-weight: bolder;
185 font-size: 14px; 239 font-size: 14px;
186 text-transform: uppercase; 240 text-transform: uppercase;
@@ -201,11 +255,11 @@ @@ -201,11 +255,11 @@
201 } 255 }
202 } 256 }
203 .make-proposal-container{ 257 .make-proposal-container{
204 - .subtitle, .info { 258 + .subtitle, .info, .success-proposal-sent {
205 margin: 20px; 259 margin: 20px;
206 color: #18376C; 260 color: #18376C;
207 } 261 }
208 - .subtitle { 262 + .subtitle, .success-proposal-sent {
209 font-size: 24px; 263 font-size: 24px;
210 font-weight: bold; 264 font-weight: bold;
211 } 265 }
@@ -218,6 +272,7 @@ @@ -218,6 +272,7 @@
218 width: 50%; 272 width: 50%;
219 height: $container-height; 273 height: $container-height;
220 min-height: $container-height; 274 min-height: $container-height;
  275 + position: relative;
221 float: left; 276 float: left;
222 text-align: left; 277 text-align: left;
223 .make-proposal{ 278 .make-proposal{
@@ -229,8 +284,16 @@ @@ -229,8 +284,16 @@
229 .make-proposal-button{ 284 .make-proposal-button{
230 @extend .container-button; 285 @extend .container-button;
231 } 286 }
232 - .send-proposal-button { 287 + .send-proposal-button, .success-proposal-sent {
233 @extend .container-button; 288 @extend .container-button;
  289 + a {
  290 + position: absolute;
  291 + left: 50%;
  292 + margin: 0;
  293 + margin-left: -30%;
  294 + bottom: 40px;
  295 + padding: 20px 0;
  296 + }
234 } 297 }
235 #article_abstract { 298 #article_abstract {
236 height: 15%; 299 height: 15%;
@@ -244,6 +307,7 @@ @@ -244,6 +307,7 @@
244 float: left; 307 float: left;
245 height: $container-height; 308 height: $container-height;
246 min-height: $container-height; 309 min-height: $container-height;
  310 + position: relative;
247 text-align: center; 311 text-align: center;
248 .container-title { 312 .container-title {
249 text-align: center; 313 text-align: center;
@@ -252,6 +316,7 @@ @@ -252,6 +316,7 @@
252 border: 1px solid $color; 316 border: 1px solid $color;
253 height: $container-height; 317 height: $container-height;
254 min-height: $container-height; 318 min-height: $container-height;
  319 + position: relative;
255 margin: 0 0 20px 10px; 320 margin: 0 0 20px 10px;
256 } 321 }
257 .subtitle { 322 .subtitle {
@@ -277,15 +342,31 @@ @@ -277,15 +342,31 @@
277 color: white; 342 color: white;
278 width: 60%; 343 width: 60%;
279 border: none; 344 border: none;
280 - margin: 20px auto; 345 + margin: 0;
281 border-radius: 6px; 346 border-radius: 6px;
282 text-align: center; 347 text-align: center;
283 text-decoration: none; 348 text-decoration: none;
284 - padding: 20px; 349 + padding: 20px 0;
285 display: block; 350 display: block;
  351 + position: absolute;
  352 + bottom: 40px;
  353 + left: 50%;
  354 + margin-left: -30%;
286 } 355 }
287 - .result {  
288 - @extend .skip 356 + .vote-result {
  357 + font-size: 14px;
  358 + font-weight: bold;
  359 + color: #333;
  360 + font-weight: bold;
  361 + text-decoration: none;
  362 + margin: 0;
  363 + display: block;
  364 + width: 100%;
  365 + text-align: center;
  366 + position: absolute;
  367 + bottom: 10px;
  368 + text-decoration: none;
  369 + color: $color;
289 } 370 }
290 } 371 }
291 } 372 }
@@ -294,6 +375,7 @@ @@ -294,6 +375,7 @@
294 width: 50%; 375 width: 50%;
295 height: $container-height; 376 height: $container-height;
296 min-height: $container-height; 377 min-height: $container-height;
  378 + position: relative;
297 text-align: center; 379 text-align: center;
298 .experience-proposal{ 380 .experience-proposal{
299 border: 1px solid $color; 381 border: 1px solid $color;
@@ -315,6 +397,7 @@ @@ -315,6 +397,7 @@
315 float: left; 397 float: left;
316 height: $container-height; 398 height: $container-height;
317 min-height: $container-height; 399 min-height: $container-height;
  400 + position: relative;
318 text-align: center; 401 text-align: center;
319 .talk-proposal{ 402 .talk-proposal{
320 border: 1px solid $color; 403 border: 1px solid $color;
@@ -358,7 +441,6 @@ @@ -358,7 +441,6 @@
358 } 441 }
359 } 442 }
360 } 443 }
361 -  
362 } 444 }
363 li{ 445 li{
364 background-color: $color; 446 background-color: $color;
sass/style.scss
  Diff comments   View file @a791818
@@ -100,7 +100,7 @@ form { @@ -100,7 +100,7 @@ form {
100 } 100 }
101 101
102 a { 102 a {
103 - font-size: 12px; 103 + font-size: 14px;
104 font-weight: bold; 104 font-weight: bold;
105 color: #333; 105 color: #333;
106 font-weight: bold; 106 font-weight: bold;
sass/utilities/_variables.scss
  Diff comments   View file @a791818
1 $categories: (saude: #00a9bd, seguranca: #e34748, educacao: #ffb400, reducao-da-pobreza: #51d0b3); 1 $categories: (saude: #00a9bd, seguranca: #e34748, educacao: #ffb400, reducao-da-pobreza: #51d0b3);
2 $categories-descriptions: (saude: "Saúde é direito de todos e dever do Estado. O Sistema Único de Saúde (SUS) é um dos maiores do mundo: atende 202 milhões de brasileiras e brasileiros.", seguranca: "Segurança Pública é direito fundamental, dever do Estado e responsabilidade de todos. A proteção da vida e a cultura de paz são nossos compromissos.", educacao: "O Brasil avançou na qualidade e ampliou o acesso à educação em todos os níveis. Agora, o Plano Nacional de Educação (PNE) definiu metas quantitativas e qualitativas para os próximos 10 anos.", reducao-da-pobreza: "Este governo escolheu como prioridade combater a pobreza e reduzir as desigualdades sociais. Por isso, o Brasil saiu do Mapa da Fome das Nações Unidas"); 2 $categories-descriptions: (saude: "Saúde é direito de todos e dever do Estado. O Sistema Único de Saúde (SUS) é um dos maiores do mundo: atende 202 milhões de brasileiras e brasileiros.", seguranca: "Segurança Pública é direito fundamental, dever do Estado e responsabilidade de todos. A proteção da vida e a cultura de paz são nossos compromissos.", educacao: "O Brasil avançou na qualidade e ampliou o acesso à educação em todos os níveis. Agora, o Plano Nacional de Educação (PNE) definiu metas quantitativas e qualitativas para os próximos 10 anos.", reducao-da-pobreza: "Este governo escolheu como prioridade combater a pobreza e reduzir as desigualdades sociais. Por isso, o Brasil saiu do Mapa da Fome das Nações Unidas");
3 -$container-height: 400px; 3 +$container-height: 500px;