Merge branch 'master' of https://gitlab.com/participa/proposal-app

Caio Almeida
2 parents 965635d9 2c80344a
Showing 8 changed files with 66 additions and 26 deletions Show diff stats
images/icons/desenvolvimento-social.png
images/icons/pobreza.png
images/icons/reducao-da-pobreza.png
index.html
js/handlebars-helpers.js
js/main.js
sass/_proposal_categories.scss
sass/_proposal_detail.scss
@@ -24,7 +24,7 @@
       <nav>
         <ul>
           <li id='nav-proposal-categories'><a href="#proposal-categories" class="active">Temas</a></li>
-          <li id='nav-proposal-group'><a href="#proposal-group">Todos os Programas</a></li>
+          <li id='nav-proposal-group'><a href="#proposal-group">Programas</a></li>
         </ul>
       </nav>
@@ -173,26 +173,29 @@
         <a href="#" class="like dislike" data-vote-value="-1"></a>
         <a href="#" class="like" data-vote-value="1"></a>
         <a href="#" class="skip">Pular</a>
-        <a href="#" class="result">Resultado</a>
+        <a href="#" class="vote-result">Resultado</a>
       </div>
     </script>
     <script id="results" type='text/x-handlebars-template'>
       <div class="results-content">
-      <table>
-        <tr class="header">
-          <td class="abstract-text">Texto da Alternativa</td>
-          <td class="votes-for">Gostei</td>
-          <td class="votes-against">Não Gostei</td>
-        </tr>
-        {{#each articles}}
-          <tr>
-            <td class="abstract-text"><div class="truncate"><p class="truncated">{{abstract}}</p></div></td>
-            <td class="votes-for">{{votes_for}}</td>
-            <td class="votes-against">{{votes_against}}</td>
+        <a href="#" class="vote-result">Fechar</a>
+        <table>
+          <tr class="header">
+            <td class="abstract-text">Texto da Alternativa</td>
+            <td class="votes-for">Gostei</td>
+            <td class="votes-against">Não Gostei</td>
+            <td class="score">Pontuação</td>
           </tr>
-        {{/each}}
-      </table>
+          {{#each articles}}
+            <tr>
+              <td class="abstract-text"><div class="truncate"><p class="truncated">{{abstract}}</p></div></td>
+              <td class="votes-for">{{votes_for}}</td>
+              <td class="votes-against">{{votes_against}}</td>
+              <td class="score">{{#score .}}{{/score}}</td>
+            </tr>
+          {{/each}}
+        </table>
       </div>
     </script>
@@ -12,21 +12,23 @@ Handlebars.registerHelper(&#39;list_proposal&#39;, function(proposals, options) {
   var ret = "";
   for(var i=0, j=proposals.length; i<j; i++) {
     element = "<li class='proposal-item'><div class='item'>";
-    element = element + "<ul class='category'>";
+    category = "<ul class='category'>";
     for(var x=0, y=proposals[i].categories.length; x<y; x++) {
       if((options.hash['category'] != null) && (options.hash['category'] != proposals[i].categories[x].slug)){
         element = '';
         continue;
       }      
-      element = element + '<li class="category-'+proposals[i].categories[x].slug+'">' + proposals[i].categories[x].name + '</li>';
+      category = category + '<li class="category-'+proposals[i].categories[x].slug+'">' + proposals[i].categories[x].name + '</li>';
     }
     if(element == ''){
       continue;
     }
-    element =  element + '</ul>';
+    category =  category + '</ul>';
     element = element + options.fn(proposals[i]);
-    element = element + '<p>' + (proposals[i].abstract ? proposals[i].abstract : '') + '</p>';
+    element = element + (proposals[i].abstract ? proposals[i].abstract : '');
+
+    element = element + category;
     ret = ret + element + '</div></li>';
   }
   return ret;
@@ -46,3 +48,7 @@ Handlebars.registerHelper(&#39;proposal_detail&#39;, function(proposals, options) {
 Handlebars.registerHelper('replace', function(string, to_replace, replacement) {
   return (string || '').replace(new RegExp(to_replace, 'g'), replacement);
 });
+
+Handlebars.registerHelper('score', function(article) {
+  return article.votes_for - article.votes_against;
+});
@@ -158,8 +158,8 @@ function loadRandomProposal(topic_id, private_token) {
       });
       e.preventDefault();
     });
-    $(document.body).off('click', '.vote-actions .result');
-    $(document.body).on('click', '.vote-actions .result', function(e) {
+    $(document.body).off('click', '.vote-result');
+    $(document.body).on('click', '.vote-result', function(e) {
       $('.results-container').toggle();
       if($('.results-container').is(":visible")) {
         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';
@@ -50,8 +50,10 @@
   }
   ul.category {
+    border-top: 1px dotted #045312;
     text-align: left;
     padding: 0;
+    padding-top: 10px;
   }
   .proposal-item p {
@@ -68,7 +70,6 @@
   }
   .proposal-item .proposal-link {
-    border-top: 1px dotted #045312;
     padding-top: 10px;
     display: block;
     margin: 0;
@@ -87,15 +87,37 @@
     }
   }
   .results-container {
-    th, td {
-      border: 1px solid rgb(223, 223, 223);
+    &:before {
+      content:"";
+      display:table;
+      clear:both;
     }
     .results-content {
       border: 1px solid #00a9bd;
+      margin-top: 20px;
+      .vote-result {
+        font-weight: bolder;
+        font-size: 12px;
+        text-transform: uppercase;
+        background-color: gray;
+        color: white;
+        width: 4%;
+        border: none;
+        margin: 10px;
+        border-radius: 6px;
+        text-align: center;
+        text-decoration: none;
+        padding: 9px;
+        display: block;
+        float: right;
+      }
     }
     table {
-      border-collapse: collapse;
+      clear: both;
       margin-top: 20px;
+      tbody tr:nth-child(odd) {
+        background-color: #e5e5e5;
+      }
       .abstract-text {
         width: 80%;
@@ -107,9 +129,14 @@
       .votes-against {
         @extend .votes-for;
       }
+      .score {
+        @extend .votes-for;
+      }
       .header {
+        line-height: 32px;
         font-weight: bold;
         text-align: center;
+        color: rgb(68, 68, 68);
       }
       .truncate {
@@ -122,6 +149,9 @@
         text-overflow: ellipsis;
         white-space: nowrap;
       }
+      tr {
+        color: rgb(77, 77, 77);
+      }
     }
   }
@@ -293,7 +323,7 @@
             padding: 20px;
             display: block;
           }
-          .result {
+          .vote-result {
             @extend .skip
           }
         }