restructure

author: Florian Dold <florian.dold@gmail.com> 2016-02-29 18:03:02 +0100
committer: Florian Dold <florian.dold@gmail.com> 2016-02-29 18:03:02 +0100
commit: c962e9402123900c53967c14cf809ea10576cdb8 (patch)
tree: e7df9cfdd6fceae30fb99c8ec6be5e07c8b153a8 /pages
parent: 30ee3320c788129b258ed8b42f4fc63d28431e2f (diff)
7 files changed, 521 insertions, 0 deletions
diff --git a/pages/confirm-contract.html b/pages/confirm-contract.html
new file mode 100644
index 000000000..2eac4a8e8
--- /dev/null
+++ b/pages/confirm-contract.html
@@ -0,0 +1,30 @@
+<!doctype html>
+
+<html>
+  <head>
+    <title>Taler Wallet: Confirm Reserve Creation</title>
+    <script src="../lib/vendor/URI.js"></script>
+    <script src="../lib/vendor/mithril.js"></script>
+    <script src="../lib/vendor/lodash.core.min.js"></script>
+    <script src="../lib/vendor/system-csp-production.src.js"></script>
+    <script src="../lib/vendor/jed.js"></script>
+    <script src="../lib/i18n.js"></script>
+    <script src="../lib/i18n-strings.js"></script>
+    <script src="../lib/module-trampoline.js"></script>
+    <link rel="stylesheet" type="text/css" href="../style/wallet.css">
+
+  <body>
+    <header>
+      <div id="logo"></div>
+      <h1>Payment Confirmation</h1>
+    </header>
+
+    <aside class="sidebar" id="left">
+    </aside>
+
+    <section id="main">
+      <article id="contract" class="fade"></article>
+    </section>
+
+  </body>
+</html>
diff --git a/pages/confirm-contract.tsx b/pages/confirm-contract.tsx
new file mode 100644
index 000000000..ff6ffba64
--- /dev/null
+++ b/pages/confirm-contract.tsx
@@ -0,0 +1,82 @@
+/*
+ This file is part of TALER
+ (C) 2015 GNUnet e.V.
+
+ TALER is free software; you can redistribute it and/or modify it under the
+ terms of the GNU General Public License as published by the Free Software
+ Foundation; either version 3, or (at your option) any later version.
+
+ TALER is distributed in the hope that it will be useful, but WITHOUT ANY
+ WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
+ A PARTICULAR PURPOSE.  See the GNU General Public License for more details.
+
+ You should have received a copy of the GNU General Public License along with
+ TALER; see the file COPYING.  If not, If not, see <http://www.gnu.org/licenses/>
+ */
+
+/// <reference path="../lib/decl/handlebars/handlebars.d.ts" />
+"use strict";
+
+import {substituteFulfillmentUrl} from "../lib/wallet/helpers";
+
+declare var m: any;
+
+function prettyAmount(amount) {
+  let v = amount.value + amount.fraction / 1e6;
+  return `${v.toFixed(2)} ${amount.currency}`;
+}
+
+
+export function main() {
+  let url = URI(document.location.href);
+  let query: any = URI.parseQuery(url.query());
+  let offer = JSON.parse(query.offer);
+  console.dir(offer);
+  let contract = offer.contract;
+  let error = null;
+
+  var Contract = {
+    view(ctrl) {
+      return [
+        m("p",
+          i18n.parts`${m("strong", contract.merchant.name)}
+               wants to enter a contract over ${m("strong",
+                                                  prettyAmount(contract.amount))}
+               with you.`),
+        m("p",
+          i18n`You are about to purchase:`),
+        m('ul',
+          _.map(contract.products,
+                (p: any) => m("li",
+                              `${p.description}: ${prettyAmount(p.price)}`))),
+        m("button.confirm-pay", {onclick: doPayment}, i18n`Confirm Payment`),
+        m("p", error ? error : []),
+      ];
+    }
+  };
+
+  m.mount(document.getElementById("contract"), Contract);
+
+  function doPayment() {
+    let d = {offer};
+    chrome.runtime.sendMessage({type: 'confirm-pay', detail: d}, (resp) => {
+      if (resp.error) {
+        console.log("confirm-pay error", JSON.stringify(resp));
+        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);
+    });
+  }
+}
+\ No newline at end of file
diff --git a/pages/confirm-create-reserve.html b/pages/confirm-create-reserve.html
new file mode 100644
index 000000000..e14d10221
--- /dev/null
+++ b/pages/confirm-create-reserve.html
@@ -0,0 +1,34 @@
+<!doctype html>
+
+<html>
+<head>
+  <title>Taler Wallet: Select Taler Provider</title>
+  <script src="../lib/vendor/URI.js"></script>
+  <script src="../lib/vendor/mithril.js"></script>
+  <script src="../lib/vendor/system-csp-production.src.js"></script>
+  <script src="../lib/vendor/jed.js"></script>
+  <script src="../lib/i18n.js"></script>
+  <script src="../lib/i18n-strings.js"></script>
+  <script src="../lib/module-trampoline.js"></script>
+  <link rel="stylesheet" type="text/css" href="../style/wallet.css">
+</head>
+
+<body>
+
+<header>
+  <div id="logo"></div>
+  <h1>Select Taler Provider</h1>
+</header>
+
+<aside class="sidebar" id="left">
+</aside>
+
+<section id="main">
+
+  <article>
+    <div class="fade" id="mint-selection"></div>
+  </article>
+
+</section>
+</body>
+</html>
diff --git a/pages/confirm-create-reserve.tsx b/pages/confirm-create-reserve.tsx
new file mode 100644
index 000000000..224a3e895
--- /dev/null
+++ b/pages/confirm-create-reserve.tsx
@@ -0,0 +1,305 @@
+/*
+ This file is part of TALER
+ (C) 2015-2016 GNUnet e.V.
+
+ TALER is free software; you can redistribute it and/or modify it under the
+ terms of the GNU General Public License as published by the Free Software
+ Foundation; either version 3, or (at your option) any later version.
+
+ TALER is distributed in the hope that it will be useful, but WITHOUT ANY
+ WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
+ A PARTICULAR PURPOSE.  See the GNU General Public License for more details.
+
+ You should have received a copy of the GNU General Public License along with
+ TALER; see the file COPYING.  If not, If not, see <http://www.gnu.org/licenses/>
+ */
+
+/// <reference path="../lib/decl/mithril.d.ts" />
+
+import {amountToPretty, canonicalizeBaseUrl} from "../lib/wallet/helpers";
+import {AmountJson, CreateReserveResponse} from "../lib/wallet/types";
+import m from "mithril";
+import {IMintInfo} from "../lib/wallet/types";
+import {ReserveCreationInfo, Amounts} from "../lib/wallet/types";
+import MithrilComponent = _mithril.MithrilComponent;
+import {Denomination} from "../lib/wallet/types";
+import {getReserveCreationInfo} from "../lib/wallet/wxApi";
+
+"use strict";
+
+/**
+ * Execute something after a delay, with the possibility
+ * to reset the delay.
+ */
+class DelayTimer {
+  ms: number;
+  f;
+  timerId: number = null;
+
+  constructor(ms: number, f) {
+    this.f = f;
+    this.ms = ms;
+  }
+
+  bump() {
+    this.stop();
+    const handler = () => {
+      this.f();
+    };
+    this.timerId = window.setTimeout(handler, this.ms);
+  }
+
+  stop() {
+    if (this.timerId !== null) {
+      window.clearTimeout(this.timerId);
+    }
+  }
+}
+
+
+class Controller {
+  url = m.prop<string>();
+  statusString = null;
+  isValidMint = false;
+  reserveCreationInfo: ReserveCreationInfo = null;
+  private timer: DelayTimer;
+  private request: XMLHttpRequest;
+  amount: AmountJson;
+  callbackUrl: string;
+  detailCollapsed = m.prop<boolean>(true);
+
+  constructor(initialMintUrl: string, amount: AmountJson, callbackUrl: string) {
+    console.log("creating main controller");
+    this.amount = amount;
+    this.callbackUrl = callbackUrl;
+    this.timer = new DelayTimer(800, () => this.update());
+    this.url(initialMintUrl);
+    this.update();
+  }
+
+  private update() {
+    this.timer.stop();
+    const doUpdate = () => {
+      if (!this.url()) {
+        this.statusString = i18n`Please enter a URL`;
+        return;
+      }
+      this.statusString = null;
+      let parsedUrl = URI(this.url());
+      if (parsedUrl.is("relative")) {
+        this.statusString = i18n`The URL you've entered is not valid (must be absolute)`;
+        return;
+      }
+
+      m.redraw(true);
+
+      console.log("doing get mint info");
+
+      getReserveCreationInfo(this.url(), this.amount)
+        .then((r: ReserveCreationInfo) => {
+          console.log("get mint info resolved");
+          this.isValidMint = true;
+          this.reserveCreationInfo = r;
+          console.dir(r);
+          this.statusString = "The mint base URL is valid!";
+          m.endComputation();
+        })
+        .catch((e) => {
+          console.log("get mint info rejected");
+          if (e.hasOwnProperty("httpStatus")) {
+            this.statusString = `request failed with status ${this.request.status}`;
+          } else {
+            this.statusString = `unknown request error`;
+          }
+          m.endComputation();
+        });
+    };
+
+    doUpdate();
+
+
+    console.log("got update");
+  }
+
+  reset() {
+    this.isValidMint = false;
+    this.statusString = null;
+    this.reserveCreationInfo = null;
+    if (this.request) {
+      this.request.abort();
+      this.request = null;
+    }
+  }
+
+  confirmReserve(mint: string, amount: AmountJson, callback_url: string) {
+    const d = {mint, amount};
+    const cb = (rawResp) => {
+      if (!rawResp) {
+        throw Error("empty response");
+      }
+      if (!rawResp.error) {
+        const resp = CreateReserveResponse.checked(rawResp);
+        let q = {
+          mint: resp.mint,
+          reserve_pub: resp.reservePub,
+          amount_value: amount.value,
+          amount_fraction: amount.fraction,
+          amount_currency: amount.currency,
+        };
+        let url = URI(callback_url).addQuery(q);
+        if (!url.is("absolute")) {
+          throw Error("callback url is not absolute");
+        }
+        console.log("going to", url.href());
+        document.location.href = url.href();
+      } else {
+        this.reset();
+        this.statusString = (
+        `Oops, something went wrong.` +
+        `The wallet responded with error status (${rawResp.error}).`);
+      }
+    };
+    chrome.runtime.sendMessage({type: 'create-reserve', detail: d}, cb);
+  }
+
+  onUrlChanged(url: string) {
+    this.reset();
+    this.url(url);
+    this.timer.bump();
+  }
+}
+
+
+function view(ctrl: Controller) {
+  let controls = [];
+  let mx = (x, ...args) => controls.push(m(x, ...args));
+
+  mx("p",
+     i18n`The bank wants to create a reserve over ${amountToPretty(
+       ctrl.amount)}.`);
+  mx("input",
+     {
+       className: "url",
+       type: "text",
+       spellcheck: false,
+       value: ctrl.url(),
+       oninput: m.withAttr("value", ctrl.onUrlChanged.bind(ctrl)),
+     });
+
+  mx("button", {
+       onclick: () => ctrl.confirmReserve(ctrl.url(),
+                                          ctrl.amount,
+                                          ctrl.callbackUrl),
+       disabled: !ctrl.isValidMint
+     },
+     "Confirm exchange selection");
+
+  if (ctrl.statusString) {
+    mx("p", ctrl.statusString);
+  } else {
+    mx("p", "Checking URL, please wait ...");
+  }
+
+  if (ctrl.reserveCreationInfo) {
+    let totalCost = Amounts.add(ctrl.reserveCreationInfo.overhead,
+                                ctrl.reserveCreationInfo.withdrawFee).amount;
+    mx("p", `Withdraw cost: ${amountToPretty(totalCost)}`);
+    if (ctrl.detailCollapsed()) {
+      mx("button.linky", {
+        onclick: () => {
+          ctrl.detailCollapsed(false);
+        }
+      }, "show more details");
+    } else {
+      mx("button.linky", {
+        onclick: () => {
+          ctrl.detailCollapsed(true);
+        }
+      }, "hide details");
+      mx("div", {}, renderReserveCreationDetails(ctrl.reserveCreationInfo))
+    }
+  }
+
+  return m("div", controls);
+}
+
+
+function renderReserveCreationDetails(rci: ReserveCreationInfo) {
+  let denoms = rci.selectedDenoms;
+
+  function row(denom: Denomination) {
+    return m("tr", [
+      m("td", denom.pub_hash.substr(0, 5) + "..."),
+      m("td", amountToPretty(denom.value)),
+      m("td", amountToPretty(denom.fee_withdraw)),
+      m("td", amountToPretty(denom.fee_refresh)),
+      m("td", amountToPretty(denom.fee_deposit)),
+    ]);
+  }
+
+  let withdrawFeeStr = amountToPretty(rci.withdrawFee);
+  let overheadStr = amountToPretty(rci.overhead);
+  return [
+    m("p", `Fee for withdrawal: ${withdrawFeeStr}`),
+    m("p", `Overhead: ${overheadStr}`),
+    m("table", [
+      m("tr", [
+        m("th", "Key Hash"),
+        m("th", "Value"),
+        m("th", "Withdraw Fee"),
+        m("th", "Refresh Fee"),
+        m("th", "Deposit Fee"),
+      ]),
+      denoms.map(row)
+    ])
+  ];
+}
+
+
+interface MintProbeResult {
+  keyInfo?: any;
+}
+
+function probeMint(mintBaseUrl: string): Promise<MintProbeResult> {
+  throw Error("not implemented");
+}
+
+
+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://exchange.demo.taler.net",
+    "PUDOS": "http://exchange.test.taler.net",
+  };
+
+  let mint = defaultMint[currency];
+
+  if (!mint) {
+    mint = ""
+  }
+
+  return Promise.resolve(mint);
+}
+
+
+export function main() {
+  const url = URI(document.location.href);
+  const query: any = URI.parseQuery(url.query());
+  const amount = AmountJson.checked(JSON.parse(query.amount));
+  const callback_url = query.callback_url;
+  const bank_url = query.bank_url;
+
+  getSuggestedMint(amount.currency)
+    .then((suggestedMintUrl) => {
+      const controller = () => new Controller(suggestedMintUrl, amount, callback_url);
+      var MintSelection = {controller, view};
+      m.mount(document.getElementById("mint-selection"), MintSelection);
+    })
+    .catch((e) => {
+      // TODO: provide more context information, maybe factor it out into a
+      // TODO:generic error reporting function or component.
+      document.body.innerText = `Fatal error: "${e.message}".`;
+      console.error(`got backend error "${e.message}"`);
+    });
+}
diff --git a/pages/debug.html b/pages/debug.html
new file mode 100644
index 000000000..24682dd24
--- /dev/null
+++ b/pages/debug.html
@@ -0,0 +1,12 @@
+<!doctype html>
+<html>
+  <head>
+    <title>Taler Wallet Debugging</title>
+  </head>
+  <body>
+    <h1>Debug Pages</h1>
+    <a href="show-db.html">Show DB</a> <br>
+    <a href="../popup/balance-overview.html">Show balance</a>
+
+  </body>
+</html>
diff --git a/pages/show-db.html b/pages/show-db.html
new file mode 100644
index 000000000..ee54d0e08
--- /dev/null
+++ b/pages/show-db.html
@@ -0,0 +1,14 @@
+
+<!doctype html>
+
+<html>
+  <head>
+    <title>Taler Wallet: Reserve Created</title>
+    <link rel="stylesheet" type="text/css" href="../style/wallet.css"> 
+    <script src="show-db.js"></script>
+  </head>
+  <body>
+    <h1>DB Dump</h1>
+    <pre id="dump"></pre>
+  </body>
+</html>
diff --git a/pages/show-db.ts b/pages/show-db.ts
new file mode 100644
index 000000000..1c414dde7
--- /dev/null
+++ b/pages/show-db.ts
@@ -0,0 +1,44 @@
+/*
+ This file is part of TALER
+ (C) 2015 GNUnet e.V.
+
+ TALER is free software; you can redistribute it and/or modify it under the
+ terms of the GNU General Public License as published by the Free Software
+ Foundation; either version 3, or (at your option) any later version.
+
+ TALER is distributed in the hope that it will be useful, but WITHOUT ANY
+ WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
+ A PARTICULAR PURPOSE.  See the GNU General Public License for more details.
+
+ You should have received a copy of the GNU General Public License along with
+ TALER; see the file COPYING.  If not, If not, see <http://www.gnu.org/licenses/>
+ */
+
+
+function replacer(match, pIndent, pKey, pVal, pEnd) {
+  var key = '<span class=json-key>';
+  var val = '<span class=json-value>';
+  var str = '<span class=json-string>';
+  var r = pIndent || '';
+  if (pKey)
+     r = r + key + pKey.replace(/[": ]/g, '') + '</span>: ';
+  if (pVal)
+     r = r + (pVal[0] == '"' ? str : val) + pVal + '</span>';
+  return r + (pEnd || '');
+}
+
+
+function prettyPrint(obj) {
+  var jsonLine = /^( *)("[\w]+": )?("[^"]*"|[\w.+-]*)?([,[{])?$/mg;
+  return JSON.stringify(obj, null, 3)
+     .replace(/&/g, '&amp;').replace(/\\"/g, '&quot;')
+     .replace(/</g, '&lt;').replace(/>/g, '&gt;')
+     .replace(jsonLine, replacer);
+}
+
+
+document.addEventListener("DOMContentLoaded", (e) => {
+  chrome.runtime.sendMessage({type:'dump-db'}, (resp) => {
+    document.getElementById('dump').innerHTML = prettyPrint(resp);
+  });
+});
author	Florian Dold <florian.dold@gmail.com>	2016-02-29 18:03:02 +0100
committer	Florian Dold <florian.dold@gmail.com>	2016-02-29 18:03:02 +0100
commit	c962e9402123900c53967c14cf809ea10576cdb8 (patch)
tree	e7df9cfdd6fceae30fb99c8ec6be5e07c8b153a8 /pages
parent	30ee3320c788129b258ed8b42f4fc63d28431e2f (diff)