bounty/new: add new token model

gitcoinco · Aug 10, 2019 · 5a5d5de · 5a5d5de
1 parent 04f6d94
commit 5a5d5de
Show file tree

Hide file tree

Showing 4 changed files with 107 additions and 55 deletions.
diff --git a/app/assets/v2/images/bounty/token_auth.svg b/app/assets/v2/images/bounty/token_auth.svg
diff --git a/app/assets/v2/js/pages/new_bounty.js b/app/assets/v2/js/pages/new_bounty.js
@@ -136,9 +136,7 @@ function formatUserSelection(user) {
 }
 
 function lastSynced(current, last_sync) {
-  var time = timeDifference(current, last_sync);
-
-  return time;
+  return timeDifference(current, last_sync);
 }
 
 const setPrivateForm = () => {
@@ -184,6 +182,68 @@ const setPublicForm = () => {
   retrieveIssueDetails();
 };
 
+/**
+ * Checks if token used to fund bounty is authed.
+ */
+const handleTokenAuth = () => {
+  return new Promise((resolve) => {
+    const tokenName = $('#token option:selected').text();
+    const tokenAddress = $('#token option:selected').val();
+    let isTokenAuthed = true;
+
+    if (!token) {
+      isTokenAuthed = false;
+      tokenAuthAlert(isTokenAuthed);
+      resolve(isTokenAuthed);
+    } else if (tokenName == 'ETH') {
+      tokenAuthAlert(isTokenAuthed);
+      resolve(isTokenAuthed);
+    } else {
+      const token_contract = web3.eth.contract(token_abi).at(tokenAddress);
+      const from = web3.eth.coinbase;
+      const to = bounty_address();
+
+      token_contract.allowance.call(from, to, (error, result) => {
+
+        if (error || result.toNumber() == 0) {
+          isTokenAuthed = false;
+        }
+        tokenAuthAlert(isTokenAuthed, tokenName);
+        resolve(isTokenAuthed);
+      });
+    }
+  });
+};
+
+/**
+ * Toggles alert to notify user while bounty creation using an
+ * un-authed token.
+ * @param {boolean} isTokenAuthed - Token auth status for user
+ * @param {string=}  tokenName - token name
+ */
+const tokenAuthAlert = (isTokenAuthed, tokenName) => {
+  $('.alert').remove();
+
+  if (isTokenAuthed) {
+    $('.alert').remove();
+    $('#add-token-dialog').bootstrapModal('hide');
+    $('#token-denomination').html('');
+  } else {
+    tokenName = tokenName ? tokenName : '';
+    _alert(
+      gettext(`
+        This token ${tokenName} needs to be enabled to fund this bounty, click on
+        <a class="font-weight-semibold" href="/settings/tokens">
+          the Token Settings page and enable it.
+        </a> This is only needed once per token.`
+      ),
+      'warning'
+    );
+
+    $('#token-denomination').html(tokenName);
+    $('#add-token-dialog').bootstrapModal('show');
+  }
+};
 
 $(function() {
 
@@ -223,9 +283,7 @@ $(function() {
 
 
   setTimeout(setUsdAmount, 1000);
-  waitforWeb3(function() {
-    promptForAuth();
-  });
+
   // fetch issue URL related info
   $('input[name=amount]').keyup(setUsdAmount);
   $('input[name=amount]').blur(setUsdAmount);
@@ -243,7 +301,7 @@ $(function() {
 
   var triggerDenominationUpdate = function(e) {
     setUsdAmount();
-    promptForAuth();
+    handleTokenAuth();
     const token_val = $('select[name=denomination]').val();
     const tokendetails = tokenAddressToDetails(token_val);
     var token = tokendetails['name'];
@@ -678,7 +736,7 @@ $('#submitBounty').validate({
     }
 
     var do_bounty = function(callback) {
-      callMethodIfTokenIsAuthed(function(x, y) {
+      handleTokenAuth().then(() => {
         const fee = Number((Number(data.amount) * FEE_PERCENTAGE).toFixed(4));
         const to_address = '0x00De4B13153673BCAE2616b67bf822500d325Fc3';
         const gas_price = web3.toHex($('#gasPrice').val() * Math.pow(10, 9));
@@ -718,7 +776,7 @@ $('#submitBounty').validate({
             );
           }
         }
-      }, promptForAuthFailure);
+      });
     };
 
     const deductBountyAmount = function(fee, txnId) {
@@ -795,12 +853,17 @@ $('#submitBounty').validate({
     };
 
     function processBounty() {
-      if ($("input[type='radio'][name='repo_type']:checked").val() == 'private' && $('#issueNDA')[0].files[0]) {
+      if (
+        $("input[type='radio'][name='repo_type']:checked").val() == 'private' &&
+        $('#issueNDA')[0].files[0]
+      ) {
         uploadNDA();
-      } else if (data.featuredBounty) {
-        payFeaturedBounty();
       } else {
-        do_bounty();
+        handleTokenAuth().then(isAuthedToken => {
+          if (isAuthedToken) {
+            data.featuredBounty ? payFeaturedBounty() : do_bounty();
+          }
+        });
       }
     }
 

diff --git a/app/assets/v2/js/shared.js b/app/assets/v2/js/shared.js
@@ -1000,48 +1000,6 @@ window.addEventListener('load', function() {
   setInterval(listen_for_web3_changes, 1000);
 });
 
-var callMethodIfTokenIsAuthed = function(success, failure) {
-  var denomination = $('#token option:selected').text();
-  var tokenAddress = $('#token option:selected').val();
-
-  if (!denomination) {
-    failure(denomination, tokenAddress);
-  } else if (denomination == 'ETH') {
-    success(denomination, tokenAddress);
-  } else {
-    var token_contract = web3.eth.contract(token_abi).at(tokenAddress);
-    var from = web3.eth.coinbase;
-    var to = bounty_address();
-
-    token_contract.allowance.call(from, to, function(error, result) {
-      if (error || result.toNumber() == 0) {
-        failure(denomination, tokenAddress);
-      } else {
-        success(denomination, tokenAddress);
-      }
-    });
-  }
-};
-
-var promptForAuthFailure = function(denomination, tokenAddress) {
-  _alert(
-    gettext(`To enable this token, go to the
-    <a style="padding-left:5px;" href="/settings/tokens">
-    Token Settings page and enable it.
-    </a> This is only needed once per token.`),
-    'warning'
-  );
-};
-
-var promptForAuth = function(event) {
-
-  var success = function(denomination, tokenAddress) {
-    $('.alert').remove();
-  };
-
-  callMethodIfTokenIsAuthed(success, promptForAuthFailure);
-};
-
 var setUsdAmount = function(event) {
   var amount = $('input[name=amount]').val();
   var denomination = $('#token option:selected').text();

diff --git a/app/dashboard/templates/bounty/fund.html b/app/dashboard/templates/bounty/fund.html
@@ -400,6 +400,36 @@ <h5 class="text-uppercase h3 font-weight-bold mb-0">{% trans "Total"%}</h5>
 
     </div>
   </div>
+
+
+<div class="modal fade" id="add-token-dialog" tabindex="-1" role="dialog" aria-labelledby="add-token-dialog" aria-hidden="true">
+  <div class="modal-dialog modal-dialog-centered" role="document">
+    <div class="modal-content text-center">
+
+      <div class="modal-body">
+        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+          <span aria-hidden="true">&times;</span>
+        </button>
+
+        <img class="my-4" src="{% static "v2/images/bounty/token_auth.svg" %}">
+        <h3 class="mt-3 mb-4 font-title-lg font-weight-semibold">
+          Please enable this token <span id="token-denomination"></span> to proceed.
+        </h3>
+        <p class="font-body px-xl-5">
+          Click the button below to open the Token Settings page
+          and enable this token. This is only needed once per token.
+        </p>
+
+        <a class="my-2 font-subheader px-5 btn btn-gc-blue btn-lg-padding font-weight-semibold"
+          href="{% url 'token_settings' %}" target="_blank"
+        >
+          Enable Token
+        </a>
+      </div>
+    </div>
+  </div>
+</div>
+
   {% include 'shared/bottom_notification.html' %}
   {% include 'shared/analytics.html' %}
   {% include 'shared/footer_scripts_lite.html' %}