3 files changed, 130 insertions, 0 deletions
diff --git a/extension/pages/confirm-contract.html b/extension/pages/confirm-contract.html
new file mode 100644
index 000000000..af6d9bca0
--- /dev/null
+++ b/extension/pages/confirm-contract.html
@@ -0,0 +1,38 @@
+<!doctype html>
+
+<html>
+  <head>
+    <title>Taler Wallet: Confirm Reserve Creation</title>
+    <script src="../lib/URI.js"></script>
+    <script src="../lib/handlebars-v4.0.5.js"></script>
+    <script src="confirm-contract.js"></script>
+    <link rel="stylesheet" type="text/css" href="../style/wallet.css"> 
+
+    <script id="contract-template" type="text/x-handlebars-template">
+      Hello, this is the wallet.  The merchant "{{merchant.name}}"
+      wants to enter a contract over {{prettyAmount amount}}
+      with you.
+
+      <p />
+
+      Your contract includes these products:
+      <ul>
+      {{#each products}}
+        <li>{{description}}<a href="foo">(more...)</a></li>
+      {{/each}}
+      </ul>
+
+      <p />
+    </script>
+
+
+  </head>
+  <body>
+    <h1>Confirm Payment</h1>
+
+    <div id="render-contract"></div>
+
+    <button id="confirm-purchase">Confirm Purchase!</button>
+    
+  </body>
+</html>
diff --git a/extension/pages/confirm-contract.js b/extension/pages/confirm-contract.js
new file mode 100644
index 000000000..fe16bcbca
--- /dev/null
+++ b/extension/pages/confirm-contract.js
@@ -0,0 +1,39 @@
+/// <reference path="../decl/handlebars/handlebars.d.ts" />
+"use strict";
+let url = URI(document.location.href);
+let query = URI.parseQuery(url.query());
+let $_ = (x) => document.getElementById(x);
+function renderContract(contract) {
+    let showAmount = document.getElementById("show-amount");
+    $_('merchant-name').innerText = contract.merchant.name;
+}
+function clone(obj) {
+    // This is faster than it looks ...
+    return JSON.parse(JSON.stringify(obj));
+}
+Handlebars.registerHelper('prettyAmount', function (amount) {
+    let v = amount.value + amount.fraction / 10e6;
+    return v.toFixed(2) + " " + amount.currency;
+});
+document.addEventListener("DOMContentLoaded", (e) => {
+    let contract = JSON.parse(query.contract);
+    console.dir(contract);
+    let source = $_("contract-template").innerHTML;
+    let template = Handlebars.compile(source);
+    let html = template(contract.contract);
+    $_("render-contract").innerHTML = html;
+    document.getElementById("confirm-purchase").addEventListener("click", (e) => {
+        let d = clone(query);
+        chrome.runtime.sendMessage({ type: 'confirm-purchase', detail: d }, (resp) => {
+            if (resp.success === true) {
+                document.location.href = resp.backlink;
+            }
+            else {
+                document.body.innerHTML =
+                    `Oops, something went wrong.
+           Here is some more info:
+           <pre>${resp.text}</pre>`;
+            }
+        });
+    });
+});
diff --git a/extension/pages/confirm-contract.tsx b/extension/pages/confirm-contract.tsx
new file mode 100644
index 000000000..e12fdfd2d
--- /dev/null
+++ b/extension/pages/confirm-contract.tsx
@@ -0,0 +1,53 @@
+/// <reference path="../decl/handlebars/handlebars.d.ts" />
+"use strict";
+
+let url = URI(document.location.href);
+let query: any = URI.parseQuery(url.query());
+
+let $_ = (x) => document.getElementById(x);
+
+function renderContract(contract) {
+  let showAmount = document.getElementById("show-amount");
+  $_('merchant-name').innerText = contract.merchant.name;
+}
+
+function clone(obj) {
+  // This is faster than it looks ...
+  return JSON.parse(JSON.stringify(obj));
+}
+
+
+Handlebars.registerHelper('prettyAmount', function(amount) {
+  let v = amount.value + amount.fraction / 10e6;
+  return v.toFixed(2) + " " + amount.currency;
+});
+
+
+document.addEventListener("DOMContentLoaded", (e) => {
+  let contract = JSON.parse(query.contract);
+  console.dir(contract);
+
+  let source = $_("contract-template").innerHTML;
+  let template = Handlebars.compile(source);
+  let html = template(contract.contract);
+
+  $_("render-contract").innerHTML = html;
+
+
+  document.getElementById("confirm-purchase").addEventListener("click", (e) => {
+    let d = clone(query);
+    chrome.runtime.sendMessage({type:'confirm-purchase', detail: d}, (resp) => {
+      if (resp.success === true) {
+        document.location.href = resp.backlink;
+      } else {
+        document.body.innerHTML =
+          `Oops, something went wrong.
+           Here is some more info:
+           <pre>${resp.text}</pre>`;
+      }
+    });
+
+  });
+});
+
+