UI improvements and error handling

8 files changed, 49 insertions, 53 deletions

diff --git a/extension/lib/wallet/wallet.ts b/extension/lib/wallet/wallet.ts
index f5db93c91..788d3f6c6 100644
--- a/extension/lib/wallet/wallet.ts
+++ b/extension/lib/wallet/wallet.ts
@@ -554,16 +554,19 @@ export class Wallet {
    * but do not send them yet.
    */
   confirmPay(offer: Offer): Promise<any> {
+    console.log("executing confirmPay");
     return Promise.resolve().then(() => {
       return this.getPossibleMintCoins(offer.contract.amount,
                                        offer.contract.max_fee,
                                        offer.contract.mints)
     }).then((mcs) => {
       if (Object.keys(mcs).length == 0) {
+        console.log("not confirming payment, insufficient coins");
         return {
           error: "coins-insufficient",
         };
       }
+      console.log("about to record ...");
       let mintUrl = Object.keys(mcs)[0];
       let ds = Wallet.signDeposit(offer, mcs[mintUrl]);
       return this.recordConfirmPay(offer, ds, mintUrl)
@@ -738,27 +741,6 @@ export class Wallet {
       });
   }
 
-
-  updateBadge() {
-    function countNonEmpty(c, n) {
-      if (c.currentAmount.fraction != 0 || c.currentAmount.value != 0) {
-        return n + 1;
-      }
-      return n;
-    }
-
-    function doBadge(n) {
-      this.badge.setText(n.toString());
-      this.badge.setColor("#0F0");
-    }
-
-    Query(this.db)
-      .iter("coins")
-      .reduce(countNonEmpty, 0)
-      .then(doBadge.bind(this));
-  }
-
-
   storeCoin(coin: Coin): Promise<void> {
     let historyEntry = {
       type: "withdraw",
@@ -771,10 +753,7 @@ export class Wallet {
       .delete("precoins", coin.coinPub)
       .add("coins", coin)
       .add("history", historyEntry)
-      .finish()
-      .then(() => {
-        this.updateBadge();
-      });
+      .finish();
   }
 
 
diff --git a/extension/lib/wallet/wxmessaging.js b/extension/lib/wallet/wxmessaging.js
index 8c74dab4e..c70bfb5a0 100644
--- a/extension/lib/wallet/wxmessaging.js
+++ b/extension/lib/wallet/wxmessaging.js
@@ -86,10 +86,11 @@ System.register(["./wallet", "./db", "./http"], function(exports_1, context_1) {
                 return true;
             },
             _a["confirm-pay"] = function (db, detail, sendResponse) {
+                console.log("in confirm-pay handler");
                 var offer = wallet_1.Offer.checked(detail.offer);
                 wallet.confirmPay(offer)
-                    .then(function () {
-                    sendResponse({});
+                    .then(function (r) {
+                    sendResponse(r);
                 })
                     .catch(function (e) {
                     console.error("exception during 'confirm-pay'");
@@ -138,7 +139,6 @@ System.register(["./wallet", "./db", "./http"], function(exports_1, context_1) {
             var badge = new ChromeBadge();
             var wallet = new wallet_1.Wallet(db, http, badge);
             var handlers = makeHandlers(wallet);
-            wallet.updateBadge();
             chrome.runtime.onMessage.addListener(function (req, sender, onresponse) {
                 if (req.type in handlers) {
                     return handlers[req.type](db, req.detail, onresponse);
diff --git a/extension/lib/wallet/wxmessaging.ts b/extension/lib/wallet/wxmessaging.ts
index b3bc5005d..ac2594500 100644
--- a/extension/lib/wallet/wxmessaging.ts
+++ b/extension/lib/wallet/wxmessaging.ts
@@ -92,10 +92,11 @@ function makeHandlers(wallet: Wallet) {
       return true;
     },
     ["confirm-pay"]: function(db, detail, sendResponse) {
+      console.log("in confirm-pay handler");
       const offer = Offer.checked(detail.offer);
       wallet.confirmPay(offer)
-            .then(() => {
-              sendResponse({})
+            .then((r) => {
+              sendResponse(r)
             })
             .catch((e) => {
               console.error("exception during 'confirm-pay'");
@@ -156,7 +157,6 @@ export function wxMain() {
       let badge = new ChromeBadge();
       let wallet = new Wallet(db, http, badge);
       let handlers = makeHandlers(wallet);
-      wallet.updateBadge();
       chrome.runtime.onMessage.addListener(
         function(req, sender, onresponse) {
           if (req.type in handlers) {
diff --git a/extension/pages/confirm-contract.js b/extension/pages/confirm-contract.js
index 5e7d82f98..296b51f26 100644
--- a/extension/pages/confirm-contract.js
+++ b/extension/pages/confirm-contract.js
@@ -32,10 +32,10 @@ System.register(["../lib/wallet/helpers"], function(exports_1, context_1) {
         var Contract = {
             view: function (ctrl) {
                 return [
-                    m("p", (_a = ["Hello, this is the wallet.  The merchant \"", "\"\n               wants to enter a contract over ", "\n               with you."], _a.raw = ["Hello, this is the wallet.  The merchant \"", "\"\n               wants to enter a contract over ", "\n               with you."], i18n(_a, contract.merchant.name, prettyAmount(contract.amount)))),
-                    m("p", (_b = ["The contract contains the following products:"], _b.raw = ["The contract contains the following products:"], i18n(_b))),
+                    m("p", (_a = ["", "\n               wants to enter a contract over ", "\n               with you."], _a.raw = ["", "\n               wants to enter a contract over ", "\n               with you."], i18n.parts(_a, m("strong", contract.merchant.name), m("strong", prettyAmount(contract.amount))))),
+                    m("p", (_b = ["You are about to purchase:"], _b.raw = ["You are about to purchase:"], i18n(_b))),
                     m('ul', _.map(contract.products, function (p) { return m("li", p.description + ": " + prettyAmount(p.price)); })),
-                    m("button", { onclick: doPayment }, (_c = ["Confirm Payment"], _c.raw = ["Confirm Payment"], i18n(_c))),
+                    m("button.confirm-pay", { onclick: doPayment }, (_c = ["Confirm Payment"], _c.raw = ["Confirm Payment"], i18n(_c))),
                     m("p", error ? error : []),
                 ];
                 var _a, _b, _c;
@@ -43,13 +43,18 @@ System.register(["../lib/wallet/helpers"], function(exports_1, context_1) {
         };
         m.mount(document.getElementById("contract"), Contract);
         function doPayment() {
-            var d = {
-                offer: offer
-            };
+            var d = { offer: offer };
             chrome.runtime.sendMessage({ type: 'confirm-pay', detail: d }, function (resp) {
-                if (!resp.success) {
+                if (resp.error) {
                     console.log("confirm-pay error", JSON.stringify(resp));
-                    error = resp.message;
+                    switch (resp.error) {
+                        case "coins-insufficient":
+                            error = "You do not have enough coins of the requested currency.";
+                            break;
+                        default:
+                            error = "Error: " + resp.error;
+                            break;
+                    }
                     m.redraw();
                     return;
                 }
diff --git a/extension/pages/confirm-contract.tsx b/extension/pages/confirm-contract.tsx
index 055490175..ff6ffba64 100644
--- a/extension/pages/confirm-contract.tsx
+++ b/extension/pages/confirm-contract.tsx
@@ -39,16 +39,17 @@ export function main() {
     view(ctrl) {
       return [
         m("p",
-          i18n`Hello, this is the wallet.  The merchant "${contract.merchant.name}"
-               wants to enter a contract over ${prettyAmount(contract.amount)}
+          i18n.parts`${m("strong", contract.merchant.name)}
+               wants to enter a contract over ${m("strong",
+                                                  prettyAmount(contract.amount))}
                with you.`),
         m("p",
-          i18n`The contract contains the following products:`),
+          i18n`You are about to purchase:`),
         m('ul',
           _.map(contract.products,
                 (p: any) => m("li",
                               `${p.description}: ${prettyAmount(p.price)}`))),
-        m("button", {onclick: doPayment}, i18n`Confirm Payment`),
+        m("button.confirm-pay", {onclick: doPayment}, i18n`Confirm Payment`),
         m("p", error ? error : []),
       ];
     }
@@ -56,21 +57,26 @@ export function main() {
 
   m.mount(document.getElementById("contract"), Contract);
 
-
   function doPayment() {
-    let d = {
-      offer
-    };
+    let d = {offer};
     chrome.runtime.sendMessage({type: 'confirm-pay', detail: d}, (resp) => {
-      if (!resp.success) {
+      if (resp.error) {
         console.log("confirm-pay error", JSON.stringify(resp));
-        error = resp.message;
+        switch (resp.error) {
+          case "coins-insufficient":
+            error = "You do not have enough coins of the requested currency.";
+            break;
+          default:
+            error = `Error: ${resp.error}`;
+            break;
+        }
         m.redraw();
         return;
       }
       let c = d.offer.contract;
       console.log("contract", c);
-      document.location.href = substituteFulfillmentUrl(c.fulfillment_url, offer);
+      document.location.href = substituteFulfillmentUrl(c.fulfillment_url,
+                                                        offer);
     });
   }
-}
+}
\ No newline at end of file
diff --git a/extension/pages/confirm-create-reserve.js b/extension/pages/confirm-create-reserve.js
index d49e709c2..0ca5fc236 100644
--- a/extension/pages/confirm-create-reserve.js
+++ b/extension/pages/confirm-create-reserve.js
@@ -52,7 +52,8 @@ System.register(["../lib/wallet/helpers", "../lib/wallet/types", "mithril"], fun
         // TODO: make this request go to the wallet backend
         // Right now, this is a stub.
         var defaultMint = {
-            "KUDOS": "http://mint.test.taler.net"
+            "KUDOS": "http://mint.demo.taler.net",
+            "PUDOS": "http://mint.test.taler.net",
         };
         var mint = defaultMint[currency];
         if (!mint) {
diff --git a/extension/pages/confirm-create-reserve.tsx b/extension/pages/confirm-create-reserve.tsx
index 0effc752c..b3086c63e 100644
--- a/extension/pages/confirm-create-reserve.tsx
+++ b/extension/pages/confirm-create-reserve.tsx
@@ -204,7 +204,8 @@ function getSuggestedMint(currency: string): Promise<string> {
   // TODO: make this request go to the wallet backend
   // Right now, this is a stub.
   const defaultMint = {
-    "KUDOS": "http://mint.test.taler.net"
+    "KUDOS": "http://mint.demo.taler.net",
+    "PUDOS": "http://mint.test.taler.net",
   };
 
   let mint = defaultMint[currency];
diff --git a/extension/style/wallet.css b/extension/style/wallet.css
index 9f7a7b525..39d87b8f5 100644
--- a/extension/style/wallet.css
+++ b/extension/style/wallet.css
@@ -102,6 +102,10 @@ button {
     padding: 0.5em;
 }
 
+button.confirm-pay {
+    float: right;
+}
+
 /* We use fading to hide slower DOM updates */
 .fade {
     -webkit-animation: fade 0.7s;