summaryrefslogtreecommitdiff
path: root/src/frontend
diff options
context:
space:
mode:
Diffstat (limited to 'src/frontend')
-rw-r--r--src/frontend/checkout.php14
-rw-r--r--src/frontend/execute.php66
-rw-r--r--src/frontend/fulfillment.php (renamed from src/frontend/fullfillment.php)4
-rw-r--r--src/frontend/generate_taler_contract.php97
-rw-r--r--src/frontend/index.html18
-rw-r--r--src/frontend/pay.php46
-rw-r--r--src/frontend/style.css58
7 files changed, 216 insertions, 87 deletions
diff --git a/src/frontend/checkout.php b/src/frontend/checkout.php
index c002f52a..e4dd8ebd 100644
--- a/src/frontend/checkout.php
+++ b/src/frontend/checkout.php
@@ -51,7 +51,7 @@
$donation_currency = $_POST['donation_currency'];
// get frational part
- list ($donation_value, $donation_fraction) = split ("\.", $donation_amount, 2);
+ list ($donation_value, $donation_fraction) = explode (".", $donation_amount, 2);
// create PHP session and store donation information in session
$donation_fraction = (float) ("0." . $donation_fraction);
session_start();
@@ -64,8 +64,8 @@
<header>
<div id="logo">
<svg height="100" width="100">
- <circle cx="50" cy="50" r="40" stroke="black" stroke-width="6" fill="white" />
- <text x="19" y="82" font-family="Verdana" font-size="90" fill="black">S</text>
+ <circle cx="50" cy="50" r="40" stroke="darkcyan" stroke-width="6" fill="white" />
+ <text x="19" y="82" font-family="Verdana" font-size="90" fill="darkcyan">S</text>
</svg>
</div>
@@ -116,7 +116,7 @@
<input type="radio" name="payment_system" value="taler"
id="taler-radio-button-id" disabled="true">Taler</input>
<br/>
- <input type="button" onclick="pay(this.form)" value="Ok">
+ <input type="button" onclick="pay(this.form)" value="Ok"></input>
</div>
</form>
@@ -147,7 +147,7 @@ function taler_pay(form)
have its own way of generating and transmitting the
contract, there just must be a way to get the contract
and to pass it to the wallet when the user selects 'Pay'. */
- contract_request.open("GET", "/generate_taler_contract.php", true);
+ contract_request.open("GET", "generate_taler_contract.php", true);
contract_request.onload = function (e)
{
if (contract_request.readyState == 4)
@@ -155,9 +155,9 @@ function taler_pay(form)
if (contract_request.status == 200)
{
/* display contract_requestificate (i.e. it sends the JSON string
- to the extension) alert (contract_request.responseText); */
+ to the extension) alert (contract_request.responseText); */
+ console.log("response text:", contract_request.responseText);
handle_contract(contract_request.responseText);
-
}
else
{
diff --git a/src/frontend/execute.php b/src/frontend/execute.php
new file mode 100644
index 00000000..61c8e197
--- /dev/null
+++ b/src/frontend/execute.php
@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <title>Toy Store - Taler Demo</title>
+ <link rel="stylesheet" type="text/css" href="style.css">
+ <script> /* @licstart The following is the entire license notice for the
+ JavaScript code in this page.
+
+ Copyright (C) 2015 GNUnet e.V.
+
+ The JavaScript code in this page is free software: you can
+ redistribute it and/or modify it under the terms of the GNU
+ Lesser General Public License (GNU LGPL) as published by the Free Software
+ Foundation, either version 2.1 of the License, or (at your option)
+ any later version. The code is distributed WITHOUT ANY WARRANTY;
+ without even the implied warranty of MERCHANTABILITY or FITNESS
+ FOR A PARTICULAR PURPOSE. See the GNU LGPL for more details.
+
+ As additional permission under GNU LGPL version 2.1 section 7, you
+ may distribute non-source (e.g., minimized or compacted) forms of
+ that code without the copy of the GNU LGPL normally required by
+ section 4, provided you include this license notice and a URL
+ through which recipients can access the Corresponding Source.
+
+ @licend The above is the entire license notice
+ for the JavaScript code in this page.
+ */
+ </script>
+ <script type="text/javascript">
+<?php
+session_start();
+echo "var h_contract=\"$_SESSION[H_contract]\";\n";
+?>
+document.addEventListener("DOMContentLoaded", function (e) {
+ var eve = new CustomEvent('taler-execute-payment', {detail: {H_contract: h_contract}});
+ document.dispatchEvent(eve);
+});
+document.addEventListener("taler-payment-result", function (e) {
+ if (!e.detail.success) {
+ alert("Payment failed\n" + JSON.strinfigy(e.detail));
+ }
+ console.log("finished payment");
+ document.getElementById("loading").innerHTML = "success!";
+});
+ </script>
+</head>
+
+<body>
+ <header>
+ <div id="logo">
+ <svg height="100" width="100">
+ <circle cx="50" cy="50" r="40" stroke="darkcyan" stroke-width="6" fill="white" />
+ <text x="19" y="82" font-family="Verdana" font-size="90" fill="darkcyan">S</text>
+ </svg>
+ </div>
+ <h1>Toy Store - Taler Demo</h1>
+ </header>
+
+ <aside class="sidebar" id="left">
+ </aside>
+
+ <section id="main">
+ <h1>Executing Payment ...</h1>
+ <div id="loading">Loading...</div>
+</body>
+</html>
diff --git a/src/frontend/fullfillment.php b/src/frontend/fulfillment.php
index f22fd1d8..32f3c0cd 100644
--- a/src/frontend/fullfillment.php
+++ b/src/frontend/fulfillment.php
@@ -9,8 +9,8 @@
<header>
<div id="logo">
<svg height="100" width="100">
- <circle cx="50" cy="50" r="40" stroke="black" stroke-width="6" fill="white" />
- <text x="19" y="82" font-family="Verdana" font-size="90" fill="black">S</text>
+ <circle cx="50" cy="50" r="40" stroke="darkcyan" stroke-width="6" fill="white" />
+ <text x="19" y="82" font-family="Verdana" font-size="90" fill="darkcyan">S</text>
</svg>
</div>
diff --git a/src/frontend/generate_taler_contract.php b/src/frontend/generate_taler_contract.php
index 1e020ce7..c71542c8 100644
--- a/src/frontend/generate_taler_contract.php
+++ b/src/frontend/generate_taler_contract.php
@@ -90,58 +90,55 @@ $teatax = array ('value' => 1,
// Take a timestamp
$now = new DateTime('now');
-// JSON for the contract
+// pack the JSON for the contract
// --- FIXME: exact format needs review!
-$contract = array ('amount' =>
- array ('value' => $amount_value,
- 'fraction' => $amount_fraction,
- 'currency' => $currency),
- 'max_fee' => array ('value' => 3,
- 'fraction' => 01010,
- 'currency' => $currency),
- 'transaction_id' => $transaction_id,
- 'products' => array (
- array ('description' => $desc,
- 'quantity' => 1,
- 'price' => array ('value' => $amount_value,
- 'fraction' => $amount_fraction,
+$json = json_encode (array ('amount' => array ('value' => $amount_value,
+ 'fraction' => $amount_fraction,
'currency' => $currency),
- 'product_id' => $p_id,
- 'taxes' => array (array ('teatax' => $teatax)),
- 'delivery_date' => "Some Date Format",
- 'delivery_location' => 'LNAME1')),
- 'timestamp' => "/Date(" . $now->getTimestamp() . ")/",
- 'expiry' => "/Date(" . $now->add(new DateInterval('P2W'))->getTimestamp() . ")/",
- 'refund_deadline' => "/Date(" . $now->add(new DateInterval('P3M'))->getTimestamp() . ")/",
- 'merchant' => array ('address' => 'LNAME2',
- 'name' => 'test merchant',
- 'jurisdiction' => 'LNAME3'),
-
- 'locations' => array ('LNAME1' => array ('country' => 'Test Country',
- 'city' => 'Test City',
- 'state' => 'Test State',
- 'region' => 'Test Region',
- 'province' => 'Test Province',
- 'ZIP code' => 4908,
- 'street' => 'test street',
- 'street number' => 20),
- 'LNAME2' => array ('country' => 'Test Country',
- 'city' => 'Test City',
- 'state' => 'Test State',
- 'region' => 'Test Region',
- 'province' => 'Test Province',
- 'ZIP code' => 4908,
- 'street' => 'test street',
- 'street number' => 20),
- 'LNAME3' => array ('country' => 'Test Country',
- 'city' => 'Test City',
- 'state' => 'Test State',
- 'region' => 'Test Region',
- 'province' => 'Test Province',
- 'ZIP code' => 4908)));
-$json = json_encode (array ('contract' => $contract,
- 'pay_url' => "/taler/pay",
- 'exec_url' => "exec"));
+ 'max_fee' => array ('value' => 3,
+ 'fraction' => 01010,
+ 'currency' => $currency),
+ 'transaction_id' => $transaction_id,
+ 'products' => array (
+ array ('description' => $desc,
+ 'quantity' => 1,
+ 'price' => array ('value' => $amount_value,
+ 'fraction' => $amount_fraction,
+ 'currency' => $currency),
+ 'product_id' => $p_id,
+ 'taxes' => array (array ('teatax' => $teatax)),
+ 'delivery_date' => "Some Date Format",
+ 'delivery_location' => 'LNAME1')),
+ 'timestamp' => "/Date(" . $now->getTimestamp() . ")/",
+ 'pay_url' => "/taler/pay",
+ 'expiry' => "/Date(" . $now->add(new DateInterval('P2W'))->getTimestamp() . ")/",
+ 'refund_deadline' => "/Date(" . $now->add(new DateInterval('P3M'))->getTimestamp() . ")/",
+ 'merchant' => array ('address' => 'LNAME2',
+ 'name' => 'test merchant',
+ 'jurisdiction' => 'LNAME3'),
+
+ 'locations' => array ('LNAME1' => array ('country' => 'Test Country',
+ 'city' => 'Test City',
+ 'state' => 'Test State',
+ 'region' => 'Test Region',
+ 'province' => 'Test Province',
+ 'ZIP code' => 4908,
+ 'street' => 'test street',
+ 'street number' => 20),
+ 'LNAME2' => array ('country' => 'Test Country',
+ 'city' => 'Test City',
+ 'state' => 'Test State',
+ 'region' => 'Test Region',
+ 'province' => 'Test Province',
+ 'ZIP code' => 4908,
+ 'street' => 'test street',
+ 'street number' => 20),
+ 'LNAME3' => array ('country' => 'Test Country',
+ 'city' => 'Test City',
+ 'state' => 'Test State',
+ 'region' => 'Test Region',
+ 'province' => 'Test Province',
+ 'ZIP code' => 4908))), JSON_PRETTY_PRINT);
if ($cli_debug && !$backend_test)
{
echo $json . "\n";
diff --git a/src/frontend/index.html b/src/frontend/index.html
index fb7ba64a..c67f8a58 100644
--- a/src/frontend/index.html
+++ b/src/frontend/index.html
@@ -32,8 +32,8 @@
<header>
<div id="logo">
<svg height="100" width="100">
- <circle cx="50" cy="50" r="40" stroke="black" stroke-width="6" fill="white" />
- <text x="19" y="82" font-family="Verdana" font-size="90" fill="black">S</text>
+ <circle cx="50" cy="50" r="40" stroke="darkcyan" stroke-width="6" fill="white" />
+ <text x="19" y="82" font-family="Verdana" font-size="90" fill="darkcyan">S</text>
</svg>
</div>
@@ -61,8 +61,6 @@
<tt>mint.demo.taler.net</tt> and
<tt>bank.demo.taler.net</tt>, correspond to a Taler mint
and bank with tight Taler integration respectively.
- <!-- TODO: maybe offer the wallet at 'taler.net/extension' in the
- future, instead of at 'demo.taler.net/'? -->
</p>
</article>
@@ -70,14 +68,8 @@
<article id="installation">
<h2>Step 1: Installing the Taler wallet <sup>(once)</sup></h2>
- <p>First, you need to install the Taler wallet browser extension.
- It is currently only available for Firefox. If you run
- Firefox, simply click <a href="http://demo.taler.net/extension">here</a>
- to download and install the extension. You will then have to
- click on "allow" and "install" dialogs shown by Firefox.
- After that, the Taler logo should appear on the right side
- of your navigation bar.
- <!-- TODO: insert screenshot highlighting the icon? -->
+ <p>First, you need to <a href="http://demo.taler.net/">install</a>
+ the Taler wallet browser extension.
</p>
</article>
@@ -129,7 +121,7 @@
<p>So, please choose a project and the amount of KUDOS you
wish to donate:</p>
- <form name="tform" action="/checkout.php" method="POST">
+ <form name="tform" action="checkout.php" method="POST">
<div class="participation" id="fake-shop">
<br>
<input type="radio" name="donation_receiver" value="Taler" checked="true">GNU Taler</input>
diff --git a/src/frontend/pay.php b/src/frontend/pay.php
index aaa5d2e2..0bd4e3bb 100644
--- a/src/frontend/pay.php
+++ b/src/frontend/pay.php
@@ -23,7 +23,9 @@
NOTE: 'max_fee' must be consistent with the same value indicated within
the contract; thus, a "real" merchant must implement such a mapping
-*/
+ */
+
+session_start();
$cli_debug = false;
$backend_test = true;
@@ -39,7 +41,14 @@ if (isset($_GET['backend_test']) && $_GET['backend_test'] == 'no')
$backend_test = false;
}
-session_start();
+
+
+if (!isset($_SESSION['H_contract']))
+{
+ echo "No session active.";
+ http_response_code (301);
+ return;
+}
$post_body = file_get_contents('php://input');
@@ -49,15 +58,15 @@ $edate = array ('edate' =>
$deposit_permission = json_decode ($post_body, true);
-$to_add = array ('max_fee' => array ('value' => 3,
- 'fraction' => 8,
- 'currency' => $_SESSION['currency']),
- 'amount' => array ('value' => $_SESSION['amount_value'],
- 'fraction' => $_SESSION['amount_fraction'],
- 'currency' => $_SESSION['currency']));
+$to_add = array('max_fee' => array('value' => 3,
+ 'fraction' => 8,
+ 'currency' => $_SESSION['currency']),
+ 'amount' => array('value' => $_SESSION['amount_value'],
+ 'fraction' => $_SESSION['amount_fraction'],
+ 'currency' => $_SESSION['currency']));
-$new_deposit_permission = array_merge ($deposit_permission, $to_add);
-$new_deposit_permission_edate = array_merge ($new_deposit_permission, $edate);
+$new_deposit_permission = array_merge($deposit_permission, $to_add);
+$new_deposit_permission_edate = array_merge($new_deposit_permission, $edate);
/* Craft the HTTP request, note that the backend
could be on an entirely different machine if
@@ -68,14 +77,19 @@ if ($cli_debug && !$backend_test)
/* DO NOTE the newline at the end of 'echo's argument */
//echo json_encode ($new_deposit_permission_edate, JSON_PRETTY_PRINT)
- echo json_encode ($new_deposit_permission, JSON_PRETTY_PRINT)
+ echo json_encode($new_deposit_permission, JSON_PRETTY_PRINT)
. "\n";
exit;
}
-$req = new http\Client\Request ("POST",
- "http://" . $_SERVER["SERVER_NAME"] . "/backend/pay",
- array ("Content-Type" => "application/json"));
+
+// Backend is relative to the shop site.
+$url = (new http\URL("http://".$_SERVER["HTTP_HOST"].$_SERVER["REQUEST_URI"]))
+ ->mod(array ("path" => "backend/pay"), http\Url::JOIN_PATH);
+
+$req = new http\Client\Request("POST",
+ $url,
+ array ("Content-Type" => "application/json"));
$req->getBody()->append (json_encode ($new_deposit_permission));
// Execute the HTTP request
@@ -104,7 +118,9 @@ else
{
$_SESSION['payment_ok'] = true;
http_response_code (301);
- header("Location: http://" . $_SERVER["SERVER_NAME"] . "/fullfillment");
+ $url = (new http\URL("http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]"))
+ ->mod(array ("path" => "fulfillment.php"), http\Url::JOIN_PATH);
+ header("Location: $url");
die();
}
diff --git a/src/frontend/style.css b/src/frontend/style.css
index 4346b0d0..c2cc51ee 100644
--- a/src/frontend/style.css
+++ b/src/frontend/style.css
@@ -63,3 +63,61 @@ h3 {
h4, h5, h6 {
font-size: 100%;
}
+
+.loader {
+ font-size: 10px;
+ margin: 50px auto;
+ text-indent: -9999em;
+ width: 11em;
+ height: 11em;
+ border-radius: 50%;
+ background: #ffffff;
+ background: -moz-linear-gradient(left, #000 10%, rgba(255, 255, 255, 0) 42%);
+ background: -webkit-linear-gradient(left, #000 10%, rgba(255, 255, 255, 0) 42%);
+ background: -o-linear-gradient(left, #000 10%, rgba(255, 255, 255, 0) 42%);
+ background: -ms-linear-gradient(left, #000 10%, rgba(255, 255, 255, 0) 42%);
+ position: relative;
+ -webkit-animation: load3 1.4s infinite linear;
+ animation: load3 1.4s infinite linear;
+ -webkit-transform: translateZ(0);
+ -ms-transform: translateZ(0);
+ transform: translateZ(0);
+}
+
+.loader:after {
+ background: #fff;
+ width: 75%;
+ height: 75%;
+ border-radius: 50%;
+ content: '';
+ margin: auto;
+ position: absolute;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ right: 0;
+}
+
+@-webkit-keyframes load3 {
+ 0% {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg);
+ }
+ 100% {
+ -webkit-transform: rotate(360deg);
+ transform: rotate(360deg);
+ }
+}
+
+@keyframes load3 {
+ 0% {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg);
+ }
+ 100% {
+ -webkit-transform: rotate(360deg);
+ transform: rotate(360deg);
+ }
+}
+
+
generated by cgit v1.2.3 (git 2.39.1) at 2024-06-03 00:10:13 +0000