contract playground

This commit is contained in:
Florian Dold 2016-09-29 16:31:55 +02:00
parent 8b660d6882
commit 3dee4744f9
4 changed files with 129 additions and 20 deletions

View File

@ -19,7 +19,11 @@
document.addEventListener(
"DOMContentLoaded",
function () {
document.body.lang = chrome.i18n.getUILanguage();
try {
document.body.lang = chrome.i18n.getUILanguage();
} catch (e) {
// chrome.* not available?
}
});
declare var i18n: any;
@ -134,7 +138,11 @@ var i18n = <any>function i18n(strings: string[], ...values: any[]) {
return tr;
};
i18n.lang = chrome.i18n.getUILanguage();
try {
i18n.lang = chrome.i18n.getUILanguage();
} catch (e) {
console.warn("i18n default language not available");
}
i18n.strings = {};

49
lib/wallet/renderHtml.ts Normal file
View File

@ -0,0 +1,49 @@
/*
This file is part of TALER
(C) 2016 INRIA
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, see <http://www.gnu.org/licenses/>
*/
/**
* Helpers functions to render Taler-related data structures to HTML.
*
* @author Florian Dold
*/
import {AmountJson, Contract} from "./types";
export function prettyAmount(amount: AmountJson) {
let v = amount.value + amount.fraction / 1e6;
return `${v.toFixed(2)} ${amount.currency}`;
}
export function renderContract(contract: Contract): any {
let merchantName = m("strong", contract.merchant.name);
let amount = m("strong", prettyAmount(contract.amount));
return m("div", {}, [
m("p",
i18n.parts`${merchantName}
wants to enter a contract over ${amount}
with you.`),
m("p",
i18n`You are about to purchase:`),
m('ul',
contract.products.map(
(p: any) => m("li",
`${p.description}: ${prettyAmount(p.price)}`)))
]);
}

View File

@ -27,15 +27,9 @@ import MithrilComponent = _mithril.MithrilComponent;
import {substituteFulfillmentUrl} from "../lib/wallet/helpers";
import m from "mithril";
import {Contract, AmountJson} from "../lib/wallet/types";
import {renderContract, prettyAmount} from "../lib/wallet/renderHtml";
"use strict";
function prettyAmount(amount: AmountJson) {
let v = amount.value + amount.fraction / 1e6;
return `${v.toFixed(2)} ${amount.currency}`;
}
const Details = {
controller() {
return {collapsed: m.prop(true)};
@ -77,17 +71,7 @@ export function main() {
var Contract = {
view(ctrl: any) {
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)}`))),
renderContract(contract),
m("button.accept", {onclick: doPayment, disabled: payDisabled}, i18n`Confirm Payment`),
(error ? m("p.errorbox", error) : []),
m(Details, contract)

68
playground/contract.html Normal file
View File

@ -0,0 +1,68 @@
<!doctype html>
<html>
<head>
<title>Contract playground</title>
<meta charset="UTF-8">
<script src="../lib/vendor/mithril.js"></script>
<script src="../lib/i18n.js"></script>
<script src="../lib/vendor/system-csp-production.src.js"></script>
<script type="application/javascript">
var contract = {
"H_wire": "ADVPV6Q9P0GF74CD5H5ENYCC862AM34ZS93JDQR2G09SR8868YMPYCVQP8WGGVVYZDY2ZMG703TQESN837VBAEDCGMS2D2RADKFKW08",
"amount": {
"currency": "KUDOS", "fraction": 100000, "value": 0
}
,
"auditors": [],
"exchanges": [{
"master_pub": "CQQZ9DY3MZ1ARMN5K1VKDETS04Y2QCKMMCFHZSWJWWVN82BTTH00",
"url": "https://exchange.demo.taler.net/"
}],
"expiry": "/Date(1483798537)/",
"fulfillment_url": "https://blog.demo.taler.net/essay/7._Why_Schools_Should_Exclusively_Use_Free%C2%A0Software?uuid=${H_contract}&timestamp=1475158537&tid=501210171398673",
"locations": {}
,
"max_fee": {
"currency": "KUDOS", "fraction": 0, "value": 3
}
,
"merchant": {
"address": "nowhere", "jurisdiction": "none", "name": "Kudos Inc."
}
,
"merchant_pub": "9K5V0G537N2RPKGQVYV2Q9WBS8R7QB93RTC7BJF1YE6XQQQ6BS2G",
"products": [{
"description": "Essay: 7. Why Schools Should Exclusively Use Free Software",
"price": {"currency": "KUDOS", "fraction": 100000, "value": 0},
"product_id": 0,
"quantity": 1
}],
"refund_deadline": "/Date(1475158537)/",
"timestamp": "/Date(1475158537)/",
"transaction_id": 501210171398673
};
</script>
</head>
<body>
<div id="container"></div>
<script>
"use strict";
System.config({
defaultJSExtensions: true,
});
document.addEventListener("DOMContentLoaded", () => {
System.import("../lib/wallet/renderHtml")
.then((render) => {
let r = render.renderContract(contract);
let component = {view: function () {return r;}}
m.mount(document.getElementById("container"), component);
}
)
.catch((e) => {
console.error(e.stack);
});
});
</script>
</body>
</html>