From 90ad462be09b3e8a180791611fb0813e69840bbf Mon Sep 17 00:00:00 2001
From: snogcel <ledniknoj@gmail.com>
Date: Wed, 7 Dec 2016 20:54:56 -0700
Subject: [PATCH] implement transaction listener progress bar

---
 index.html       | 22 +++++++++++++++++++---
 js/txListener.js |  5 ++++-
 2 files changed, 23 insertions(+), 4 deletions(-)

diff --git a/index.html b/index.html
index ca8d5e7..9ccfc51 100755
--- a/index.html
+++ b/index.html
@@ -23,7 +23,8 @@
     <link rel="stylesheet" href="css/master.css">
     <script src="js/proposalGenerator.js"></script>
     <script src="js/paymentCycle.js"></script>
-    <script src="js/transactionListener.js"></script>
+    <!-- <script src="js/transactionListener.js"></script> -->
+    <script src="js/txListener.js"></script>
     <script src="js/formHandler.js"></script>
 
     <script src="https://dev-test.dash.org/socket.io/socket.io.js"></script>
@@ -85,7 +86,7 @@
 
                     proposal.walletCommands();
 
-                    transactionListener(proposal);
+                    // transactionListener(proposal);
 
                     $('#btnEdit').click(function() {
                         proposal.createProposal();
@@ -107,9 +108,24 @@
                     if(err) console.log(err);
                     if(res) {
                         console.log(res);
+
+                        // transaction exists, proceed to step three
+                        document.getElementById('step_three').click();
+                        document.getElementsByClassName('progress-bar')[0].style.width = "75%";
+                        document.getElementsByClassName('progress-bar')[0].innerText = "Awaiting transaction confirmation";
+
+                        $('#walletCommandsProgress').removeClass('hidden'); // probably a better way to do this....
+                        $("#progressbar").progressbar({value: 0}); // TXListener will bump this along as confirmations occur
+
                         txListener.blockheight = res.blockheight;
                         txListener.confirmations = res.confirmations;
-                        txListener.initSocket();
+
+                        txListener.initSocket(function() {
+                            document.getElementById('step_four').click();
+                            document.getElementsByClassName('progress-bar')[0].style.width = "100%";
+                            document.getElementsByClassName('progress-bar')[0].innerText = "Proposal ready for submission";
+                        }); // callback issued after tx confirmations >= 6
+
                     }
                 });
             });
diff --git a/js/txListener.js b/js/txListener.js
index 1f59124..cdcd35a 100755
--- a/js/txListener.js
+++ b/js/txListener.js
@@ -9,7 +9,7 @@ function TXListener(socket, provider, transaction) {
 
 }
 
-TXListener.prototype.initSocket = function() {
+TXListener.prototype.initSocket = function(cb) {
     var self = this;
     var socket = this.socket;
 
@@ -21,6 +21,9 @@ TXListener.prototype.initSocket = function() {
             if (err) console.log("error fetching block: " + data);
             self.confirmations = (res.height - self.blockheight) + 1; // compare blockHeight against transaction blockHeight
 
+            if (self.confirmations >= 6) cb();
+            $("#progressbar").progressbar({value: ((100 / 6) * self.confirmations)});
+
             console.log('confirmations: ' + self.confirmations);
 
         });