From c41297378cabed9a9190d323d50f94101f6f667d Mon Sep 17 00:00:00 2001
From: Jamie Holdstock <jam.jar69@gmail.com>
Date: Wed, 13 Feb 2019 16:39:37 +0000
Subject: [PATCH] Show 'blocks left for voting' instead of percentage.

---
 agenda.go                                |  6 +++---
 public/css/decred-hardforkwebsite.css    | 19 ++++++++++++-------
 public/images/voting-percent-diamond.svg |  7 -------
 public/views/start.html                  |  9 ++++++---
 4 files changed, 21 insertions(+), 20 deletions(-)
 delete mode 100644 public/images/voting-percent-diamond.svg

diff --git a/agenda.go b/agenda.go
index 25b88ec..a515db6 100644
--- a/agenda.go
+++ b/agenda.go
@@ -99,11 +99,11 @@ func (a *Agenda) VotePercent(voteID string) float64 {
 	return toFixed(percent*100, 2)
 }
 
-// VoteCountPercentage returns the number of votes cast against this agenda as
+// VoteCountPercentage returns the number of yes/no/abstain votes cast against this agenda as
 // a percentage of the theoretical maximum number of possible votes
-func (a *Agenda) VoteCountPercentage() float64 {
+func (a *Agenda) VoteCountPercentage(voteID string) float64 {
 	maxPossibleVotes := float64(activeNetParams.RuleChangeActivationInterval) * float64(activeNetParams.TicketsPerBlock)
-	voteCountPercentage := float64(a.TotalVotes()) / maxPossibleVotes
+	voteCountPercentage := float64(a.VoteCounts[voteID]) / maxPossibleVotes
 	return toFixed(voteCountPercentage*100, 1)
 }
 
diff --git a/public/css/decred-hardforkwebsite.css b/public/css/decred-hardforkwebsite.css
index 03c0ba1..fa160c7 100644
--- a/public/css/decred-hardforkwebsite.css
+++ b/public/css/decred-hardforkwebsite.css
@@ -1648,17 +1648,22 @@ body {
   line-height: 17px;
 }
 
-.heading.progress-bar-agenda-voting-percent {
+.heading.blocks-left-for-voting {
   position: absolute;
+  display: flex;
+  align-items: center;
   top: 0px;
   right: 0px;
-  width: 75px;
-  background-image: url('../images/voting-percent-diamond.svg');
-  background-position: 0px 50%;
-  background-repeat: no-repeat;
   color: #0c1e3e;
-  line-height: 17px;
-  text-align: right;
+  padding-bottom: 10px;
+}
+
+.blocks-left-for-voting-dot {
+  width: 12px;
+  height: 12px;
+  border-radius: 50%;
+  margin-right: 5px;
+  background-color: #5a6d81;
 }
 
 .heading.voting-overview {
diff --git a/public/images/voting-percent-diamond.svg b/public/images/voting-percent-diamond.svg
deleted file mode 100644
index 4363eab..0000000
--- a/public/images/voting-percent-diamond.svg
+++ /dev/null
@@ -1,7 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve">
-<rect x="2.819" y="2.817" transform="matrix(0.7072 0.707 -0.707 0.7072 7.9988 -3.3141)" fill="#596D81" width="10.364" height="10.365"/>
-</svg>
diff --git a/public/views/start.html b/public/views/start.html
index 4e1e79c..aa421a6 100644
--- a/public/views/start.html
+++ b/public/views/start.html
@@ -49,7 +49,7 @@
     {{if or $agenda.IsStarted $agenda.IsActive $agenda.IsLockedIn $agenda.IsFailed }}
       {{range $cid, $choice := $agenda.VoteChoices}}	
   .option-progress.a_{{$agenda.ID}}-c{{$choice.ID}} {
-  width: {{roundDown ($agenda.VotePercent $choice.ID)}}%;
+  width: {{roundDown ($agenda.VoteCountPercentage $choice.ID)}}%;
   }
       {{end}}
     {{end}}
@@ -393,7 +393,7 @@
           </div>
 
           <!-- agenda voting results barchart -->
-          {{if not $agenda.IsDefined }}
+          {{if $agenda.IsStarted }}
           <div class="agenda-section progress-bar w-clearfix">
             <div class="progress-bar-agenda w-clearfix">
               <div class="progress-bar-competing-options-and-total-votes w-clearfix">
@@ -407,7 +407,10 @@
                   </div>
                   {{end}}
               </div>
-              <div class="heading progress-bar-agenda-voting-percent">{{$agenda.VoteCountPercentage }}%</div>
+              <div class="heading blocks-left-for-voting">
+                <div class="blocks-left-for-voting-dot"></div>
+                {{minus64 $agenda.EndHeight $.BlockHeight}} blocks left for voting
+              </div>
             </div>
           </div>
           {{end}}