From 0c760bc2a1459cc7ec7fd22ae39ca0a8201df9b5 Mon Sep 17 00:00:00 2001 From: Florian Dold Date: Mon, 15 Feb 2016 15:53:59 +0100 Subject: [PATCH] UI improvements and error handling --- extension/lib/wallet/wallet.ts | 29 +++------------------ extension/lib/wallet/wxmessaging.js | 6 ++--- extension/lib/wallet/wxmessaging.ts | 6 ++--- extension/pages/confirm-contract.js | 21 +++++++++------ extension/pages/confirm-contract.tsx | 30 +++++++++++++--------- extension/pages/confirm-create-reserve.js | 3 ++- extension/pages/confirm-create-reserve.tsx | 3 ++- extension/style/wallet.css | 4 +++ 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 { + 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 { 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 { // 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;