Add pending state of delegates after voting

LiskArchive · Apr 18, 2017 · 9e23bb4 · 9e23bb4
1 parent 85afa9d
commit 9e23bb4
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 9 deletions.
diff --git a/src/app/components/delegates/delegates.js b/src/app/components/delegates/delegates.js
@@ -1,18 +1,21 @@
 import './delegates.less';
 
+const UPDATE_INTERVAL = 20000;
+
 app.component('delegates', {
   template: require('./delegates.pug')(),
   bindings: {
     account: '=',
     passphrase: '<',
   },
   controller: class delegates {
-    constructor($scope, $peers, $mdDialog, $mdMedia, $mdToast) {
+    constructor($scope, $peers, $mdDialog, $mdMedia, $mdToast, $timeout) {
       this.$scope = $scope;
       this.$peers = $peers;
       this.$mdDialog = $mdDialog;
       this.$mdMedia = $mdMedia;
       this.$mdToast = $mdToast;
+      this.$timeout = $timeout;
 
       this.$scope.search = '';
       this.voteList = [];
@@ -118,20 +121,56 @@ app.component('delegates', {
       delegate.status.selected = false;
     }
 
-    clearVotes() {
+    setPendingVotes() {
       this.voteList.forEach((delegate) => {
         /* eslint-disable no-param-reassign */
         delegate.status.changed = false;
         delegate.status.voted = true;
+        delegate.status.pending = true;
       });
-      this.voteList.splice(0, this.voteList.length);
+      this.votePendingList = this.voteList.splice(0, this.voteList.length);
 
       this.unvoteList.forEach((delegate) => {
         delegate.status.changed = false;
         delegate.status.voted = false;
+        delegate.status.pending = true;
         /* eslint-enable no-param-reassign */
       });
-      this.unvoteList.splice(0, this.unvoteList.length);
+      this.unvotePendingList = this.unvoteList.splice(0, this.unvoteList.length);
+      this.checkPendingVotes();
+    }
+
+    checkPendingVotes() {
+      this.$timeout(() => {
+        this.$peers.sendRequestPromise('accounts/delegates', {
+          address: this.account.address,
+        }).then((data) => {
+          this.votedList = data.delegates || [];
+          this.votedDict = {};
+          (this.votedList).forEach((delegate) => {
+            this.votedDict[delegate.username] = delegate;
+          });
+          this.votePendingList = this.votePendingList.filter((vote) => {
+            if (this.votedDict[vote.username]) {
+              // eslint-disable-next-line no-param-reassign
+              vote.status.pending = false;
+              return false;
+            }
+            return true;
+          });
+          this.unvotePendingList = this.unvotePendingList.filter((vote) => {
+            if (!this.votedDict[vote.username]) {
+              // eslint-disable-next-line no-param-reassign
+              vote.status.pending = false;
+              return false;
+            }
+            return true;
+          });
+          if (this.votePendingList.length + this.unvotePendingList.length > 0) {
+            this.checkPendingVotes();
+          }
+        });
+      }, UPDATE_INTERVAL);
     }
 
     parseVoteListFromInput() {
@@ -229,7 +268,7 @@ app.component('delegates', {
           unvoteList: this.unvoteList,
         },
       }).then((() => {
-        this.clearVotes();
+        this.setPendingVotes();
       }));
     }
   },

diff --git a/src/app/components/delegates/delegates.less b/src/app/components/delegates/delegates.less
@@ -33,6 +33,9 @@ delegates {
   .downvote {
     background-color: rgb(255, 228, 220);
   }
+  .pending {
+    background-color: #eaeae9;
+  }
 
   md-card-title {
     md-input-container {

diff --git a/src/app/components/delegates/delegates.pug b/src/app/components/delegates/delegates.pug
@@ -8,9 +8,9 @@ div.offline-hide
         md-button(ng-click='$ctrl.usernameListActive = false')
           span Cancel 
         span.pull-right
-          md-button(ng-click='$ctrl.parseVoteListFromInput()', ng-disabled='$ctrl.pendingRequests || !$ctrl.usernameInput')
+          md-button(ng-click='$ctrl.parseVoteListFromInput("voteList")', ng-disabled='$ctrl.pendingRequests || !$ctrl.usernameInput')
             span Add to vote list
-          md-button(ng-click='$ctrl.parseUnvoteListFromInput()', ng-disabled='$ctrl.pendingRequests || !$ctrl.usernameInput')
+          md-button(ng-click='$ctrl.parseUnvoteListFromInput(")', ng-disabled='$ctrl.pendingRequests || !$ctrl.usernameInput')
             span Add to unvote list
     md-progress-linear(md-mode='indeterminate', ng-show='$ctrl.pendingRequests')
   md-card(flex-gt-xs=100)
@@ -61,9 +61,9 @@ div.offline-hide
           tbody(md-body, infinite-scroll='$ctrl.showMore()', infinite-scroll-distance='1')
             tr(md-row, ng-hide='$ctrl.filteredDelegates.length || $ctrl.loading')
               td(md-cell, colspan='6') No delegates found
-            tr(md-row, ng-repeat="delegate in ($ctrl.filteredDelegates = ($ctrl.delegates | filter : {username: search} )) | limitTo : $ctrl.delegatesDisplayedCount", ng-class='{"downvote": delegate.status.voted && !delegate.status.selected, "upvote": !delegate.status.voted && delegate.status.selected}')
+            tr(md-row, ng-repeat="delegate in ($ctrl.filteredDelegates = ($ctrl.delegates | filter : {username: search} )) | limitTo : $ctrl.delegatesDisplayedCount", ng-class='{"downvote": delegate.status.voted && !delegate.status.selected, "upvote": !delegate.status.voted && delegate.status.selected, "pending": delegate.status.pending}')
               td(md-cell)
-                md-checkbox(ng-model='delegate.status.selected', ng-change='$ctrl.selectionChange(delegate)', aria-label='delegate selected for voting')
+                md-checkbox(ng-model='delegate.status.selected', ng-change='$ctrl.selectionChange(delegate)', ng-disabled='delegate.status.pending', aria-label='delegate selected for voting')
               td(md-cell, ng-bind='delegate.rank')
               td(md-cell, ng-bind='delegate.username')
               td(md-cell, ng-bind='delegate.address')