summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--configure.ac9
-rw-r--r--demo/index.html.j2201
-rwxr-xr-xdemo/template.py1
3 files changed, 83 insertions, 128 deletions
diff --git a/configure.ac b/configure.ac
index fffd9e1..dbae4ba 100644
--- a/configure.ac
+++ b/configure.ac
@@ -3,5 +3,12 @@ AM_INIT_AUTOMAKE
# check for typescript compiler
AC_CHECK_PROG([tsc],[tsc],[yes],[no])
AM_CONDITIONAL(HAVE_TSC, [ test "$tsc" = "yes"])
-AC_CONFIG_FILES(Makefile demo/Makefile demo/static/Makefile demo/static/web-common/Makefile)
+AC_CONFIG_FILES([
+ Makefile
+ demo/Makefile
+ demo/static/Makefile
+ demo/static/web-common/Makefile
+ demo/static/web-common/css/Makefile
+ demo/static/web-common/js/Makefile
+])
AC_OUTPUT
diff --git a/demo/index.html.j2 b/demo/index.html.j2
index 2e1da37..cfb7a9d 100644
--- a/demo/index.html.j2
+++ b/demo/index.html.j2
@@ -1,131 +1,78 @@
-<!DOCTYPE html>
-<html lang="en" data-taler-nojs="true">
-<head profile="http://www.w3.org/2005/10/profile">
- <meta charset="utf-8"/>
- <title>Taler Demo</title>
- <link rel="stylesheet" type="text/css" href="{{ url('static/web-common/pure.css') }}" />
- <link rel="stylesheet" type="text/css" href="{{ url('static/web-common/demo.css') }}" />
- <link rel="stylesheet" type="text/css" href="{{ url('static/web-common/taler-fallback.css') }}" id="taler-presence-stylesheet" />
- <link rel="icon" type="image/png" href="{{ url('static/web-common/favicon-taler.ico') }}" />
+{% extends "static/web-common/templates/base.html" %}
- <style type="text/css">
- a[disabled="true"] {
- pointer-events: none;
- color: grey;
- }
+{% block page_content %}
+ <article>
+ <h2>Step 1: Install the Taler wallet</h2>
+ <p class="alert alert-primary taler-installed-hide" role="alert">
+ You do not have the Taler wallet installed yet.<br>
+ Install the wallet from the <a class="alert-link" href="https://taler.net/wallet-installation.html">installation page</a>.
+ It only takes one click.
+ </p>
+ <p class="alert alert-success taler-installed-show" role="alert">
+ Congratulations, you have installed the Taler wallet correctly.
+ You can now proceed with the next steps.
+ </p>
+ </article>
- .bluebox {
- background-color: #C2C6FF;
- border: solid;
- border-radius: 5px;
- padding: 0.5em;
- }
- .greenbox {
- background-color: #5EFF64;
- border: solid;
- border-radius: 5px;
- padding: 0.5em;
- }
- .graybox {
- background-color: #DDDDDD;
- border: solid;
- border-radius: 5px;
- padding: 0.5em;
- }
- </style>
-</head>
+ <article>
+ <h2>Step 2: Withdraw coins</h2>
+ <p>
+ Now you can withdraw coins into your wallet by going to our <a href="{{ bank_url }}">bank</a>.
-<body>
- <div class="demobar">
- <h1><span class="tt adorn-brackets">Taler Demo</span></h1>
- <h1><span class="it"><a href="#">Introduction</a></span></h1>
- <p>This is the entry point of the Taler demo. Follow the instructions and try Taler with the other pages linked below!</p>
- <ul>
- <li><a href="{{ intro_url }}">Introduction</a></li>
- <li><a href="{{ bank_url }}">Bank</a></li>
- <li><a href="{{ merchant_blog_url }}">Essay Shop</a></li>
- <li><a href="{{ merchant_donations_url }}">Donations</a></li>
- <li><a href="{{ merchant_survey_url }}">Tipping/Survey</a></li>
- <li><a href="{{ backoffice_url }}">Back-office</a></li>
- </ul>
- <p>You can learn more about Taler on our main <a href="https://taler.net">website</a>.</p>
- </div>
- <section id="main" class="content">
- <article>
- <h2>Step 1: Install the Taler wallet</h2>
- Install the wallet from the <a href="https://taler.net/wallet-installation.html">installation page</a>.
- It only takes one click.
- <p class="bluebox taler-installed-hide">
- You don't have a wallet installed yet.
- </p>
- <p class="greenbox taler-installed-show">
- Congratulations, you have installed the Taler wallet correctly.
- You can now proceed with the next steps.
- </p>
- </article>
-
- <article>
- <h2>Step 2: Withdraw coins</h2>
- <p>
-
- Now you can withdraw coins into your wallet by going to our <a href="{{ bank_url }}">bank</a>.
+ In this demo you're paying with KUDOS, an imaginary currency. When you
+ create an account at our bank, you'll get 100 KUDOS for free.
+ </p>
+ <p class="alert alert-secondary" role="alert">
+ We can't check if you were able to complete this step, since websites
+ can't see the balance in your wallet. Please click on the Taler icon
+ in your browser to check your balance.
+ </p>
+ </article>
- In this demo you're paying with KUDOS, an imaginary currency. When you
- create an account at our bank, you'll get 100 KUDOS for free.
- </p>
- <p class="graybox">
- We can't check if you were able to complete this step, since websites
- can't see the balance in your wallet. Please click on the Taler icon
- in your browser to check your balance.
- </p>
- </article>
-
- <article>
- <h2>Step 3: Pay</sup></h2>
- We have two demo merchants where you can spend your coins:
- <ul>
- <li>
- The <a href="{{ merchant_blog_url }}">essay store</a>, where you can pay KUDOS for
- individual chapters of Richard Stallman's book "Free Software, Free
- Society", which is also available for free at <a href="http://www.fsf.org/">the FSF</a>.
- </li>
- <li>
- The <a href="{{ merchant_donations_url }}">project donation Web site</a>, where
- you can show respect to a software project of your choice
- by giving them KUDOS.
- </li>
- </ul>
- </article>
- <article>
- <h2>Step 4: Check money flow</sup></h2>
- <ul>
- <li>
- Check if people who received your Taler payment got eventually
- paid by the exchange via a wire transfer; visit the:
- <a href="{{ bank_url }}/public-accounts">public accounts page</a> at the bank.
- Note that only those account whose owners gave permission are showed
- on that page.
- </li>
- </ul>
- </article>
- <article>
- <h2>Step 5: Merchant? Consult back-office</sup></h2>
- <ul>
- <li>
- If you are a merchant, you can check the <a href="{{ backoffice_url }}">back-office</a>
- Web-site to see how your Taler transactions got payed back by bank wire transfers.
- </li>
- </ul>
- </article>
- <article>
- <h2>Step 6: Reach out to us</sup></h2>
- Let us know what you think by <a href="mailto:demo-feedback@taler.net">contacting us</a>.
- </article>
- <hr />
- <div class="copyright">
- <p>Copyright &copy; 2014&mdash;2017 INRIA</p>
- <a href="javascript.html" data-jslicense="1" class="jslicenseinfo">JavaScript license information</a>
- </div>
- </section>
-</body>
-</html>
+ <article>
+ <h2>Step 3: Pay</h2>
+ We have two demo merchants where you can spend your coins:
+ <ul>
+ <li>
+ The <a href="{{ merchant_blog_url }}">essay store</a>, where you can pay KUDOS for
+ individual chapters of Richard Stallman's book "Free Software, Free
+ Society", which is also available for free at <a href="http://www.fsf.org/">the FSF</a>.
+ </li>
+ <li>
+ The <a href="{{ merchant_donations_url }}">project donation Web site</a>, where
+ you can show respect to a software project of your choice
+ by giving them KUDOS.
+ </li>
+ </ul>
+ </article>
+ <article>
+ <h2>Step 4: Check money flow</h2>
+ <ul>
+ <li>
+ Check if people who received your Taler payment got eventually
+ paid by the exchange via a wire transfer; visit the:
+ <a href="{{ bank_url }}/public-accounts">public accounts page</a> at the bank.
+ Note that only those account whose owners gave permission are showed
+ on that page.
+ </li>
+ </ul>
+ </article>
+ <article>
+ <h2>Step 5: Merchant? Consult back-office</h2>
+ <ul>
+ <li>
+ If you are a merchant, you can check the <a href="{{ backoffice_url }}">back-office</a>
+ Web-site to see how your Taler transactions got payed back by bank wire transfers.
+ </li>
+ </ul>
+ </article>
+ <article>
+ <h2>Step 6: Reach out to us</h2>
+ Let us know what you think by <a href="mailto:demo-feedback@taler.net">contacting us</a>.
+ </article>
+ <hr />
+ <div class="copyright">
+ <p>Copyright &copy; 2014&mdash;2017 INRIA</p>
+ <a href="javascript.html" data-jslicense="1" class="jslicenseinfo">JavaScript license information</a>
+ </div>
+{% endblock page_content %}
diff --git a/demo/template.py b/demo/template.py
index 05599e4..7e42565 100755
--- a/demo/template.py
+++ b/demo/template.py
@@ -34,6 +34,7 @@ default_ctx["intro_url"] = os.environ.get("TALER_ENV_URL_INTRO", "#")
default_ctx["bank_url"] = os.environ.get("TALER_ENV_URL_BANK", "#")
default_ctx["auditor_url"] = os.environ.get("TALER_ENV_URL_AUDITOR", "#")
default_ctx["backoffice_url"] = os.environ.get("TALER_ENV_URL_BACKOFFICE", "#")
+default_ctx["page_title"] = "Taler Demo" #TODO: Translate!
for in_file in glob.glob("*.j2"):