From 06b548f12ed853692db78dbbfbe7988382c0fdee Mon Sep 17 00:00:00 2001
From: Nico <paetni1@gmail.com>
Date: Thu, 11 Jun 2020 19:52:44 +0200
Subject: edit_card start vote better visibility what was voted

---
 client/components/cards/cardDetails.jade | 10 ++++++++--
 client/components/cards/cardDetails.js   | 22 +++-------------------
 client/components/cards/minicard.jade    |  4 ++--
 client/components/cards/minicard.styl    |  5 +++++
 4 files changed, 18 insertions(+), 23 deletions(-)

(limited to 'client')

diff --git a/client/components/cards/cardDetails.jade b/client/components/cards/cardDetails.jade
index 2aa77627..dda95e3e 100644
--- a/client/components/cards/cardDetails.jade
+++ b/client/components/cards/cardDetails.jade
@@ -220,8 +220,14 @@ template(name="cardDetails")
       +viewer
         = getVoteQuestion
       if showVotingButtons
-        button.card-details-green.js-vote.js-vote-positive(class="{{#if voteState}}voted{{/if}}") {{_ 'vote-for-it'}}
-        button.card-details-red.js-vote.js-vote-negative(class="{{#if $eq voteState false}}voted{{/if}}") {{_ 'vote-against'}}
+        button.card-details-green.js-vote.js-vote-positive(class="{{#if voteState}}voted{{/if}}")
+          if voteState
+            i.fa.fa-thumbs-up
+          {{_ 'vote-for-it'}}
+        button.card-details-red.js-vote.js-vote-negative(class="{{#if $eq voteState false}}voted{{/if}}")
+          if $eq voteState false
+            i.fa.fa-thumbs-down
+          {{_ 'vote-against'}}
 
     //- XXX We should use "editable" to avoid repetiting ourselves
     if canModifyCard
diff --git a/client/components/cards/cardDetails.js b/client/components/cards/cardDetails.js
index 11e010d4..a91d9b6e 100644
--- a/client/components/cards/cardDetails.js
+++ b/client/components/cards/cardDetails.js
@@ -38,22 +38,6 @@ BlazeComponent.extendComponent({
     Meteor.subscribe('unsaved-edits');
   },
 
-  voteState() {
-    const card = this.currentData();
-    const userId = Meteor.userId();
-    let state;
-    if (card.vote) {
-      if (card.vote.positive) {
-        state = _.contains(card.vote.positive, userId);
-        if (state === true) return true;
-      }
-      if (card.vote.negative) {
-        state = _.contains(card.vote.negative, userId);
-        if (state === true) return false;
-      }
-    }
-    return null;
-  },
   isWatching() {
     const card = this.currentData();
     return card.findWatcher(Meteor.userId());
@@ -412,9 +396,9 @@ BlazeComponent.extendComponent({
           const forIt = $(e.target).hasClass('js-vote-positive');
           let newState = null;
           if (
-            this.voteState() === null ||
-            (this.voteState() === false && forIt) ||
-            (this.voteState() === true && !forIt)
+            this.data().voteState() === null ||
+            (this.data().voteState() === false && forIt) ||
+            (this.data().voteState() === true && !forIt)
           ) {
             newState = forIt;
           }
diff --git a/client/components/cards/minicard.jade b/client/components/cards/minicard.jade
index 8afe1976..03511e0a 100644
--- a/client/components/cards/minicard.jade
+++ b/client/components/cards/minicard.jade
@@ -106,9 +106,9 @@ template(name="minicard")
           span.badge-icon.fa.fa-align-left
       if getVoteQuestion
         .badge.badge-state-image-only(title=getVoteQuestion)
-          span.badge-icon.fa.fa-thumbs-up
+          span.badge-icon.fa.fa-thumbs-up(class="{{#if voteState}}text-green{{/if}}")
           span.badge-text {{ voteCountPositive }}
-          span.badge-icon.fa.fa-thumbs-down
+          span.badge-icon.fa.fa-thumbs-down(class="{{#if $eq voteState false}}text-red{{/if}}")
           span.badge-text {{ voteCountNegative }}
       if attachments.count
         .badge
diff --git a/client/components/cards/minicard.styl b/client/components/cards/minicard.styl
index 7d72a588..03d242ac 100644
--- a/client/components/cards/minicard.styl
+++ b/client/components/cards/minicard.styl
@@ -299,3 +299,8 @@ minicard-color(background, color...)
 
 .minicard-indigo
   minicard-color(#4b0082, #ffffff) //White text for better visibility
+
+.text-red
+  color:red
+.text-green
+  color:green
-- 
cgit v1.2.3-1-g7c22