aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authortg(x) <*@tg-x.net>2016-10-11 18:57:09 +0200
committertg(x) <*@tg-x.net>2016-10-11 18:57:09 +0200
commitea953cbcb0d36c24d157a79aa2c28ab0b9650dec (patch)
tree44d15ec7ab12e1ced72a8ab16129ebce8578452f
parentee101ab2d248a7742a6f7ae271ac93e13ca9d4f8 (diff)
downloadwww-ea953cbcb0d36c24d157a79aa2c28ab0b9650dec.tar.gz
www-ea953cbcb0d36c24d157a79aa2c28ab0b9650dec.zip
wallet: styling
-rw-r--r--wallet-installation.html281
1 files changed, 152 insertions, 129 deletions
diff --git a/wallet-installation.html b/wallet-installation.html
index 1b5cdad4..f2d862d2 100644
--- a/wallet-installation.html
+++ b/wallet-installation.html
@@ -1,162 +1,185 @@
1<!DOCTYPE html> 1<!DOCTYPE html>
2<html lang="en"> 2<html>
3<head profile="http://www.w3.org/2005/10/profile"> 3 <head profile="http://www.w3.org/2005/10/profile">
4 <meta charset="utf-8"/> 4 <meta charset="utf-8"/>
5 <title>Taler Wallet Installation</title> 5 <title>GNU Taler - Wallet</title>
6 <link rel="icon" type="image/png" href="/web-common/favicon-taler.ico" /> 6 <meta name="description" content="">
7 <link rel="chrome-webstore-item" href="https://chrome.google.com/webstore/detail/millncjiddlpgdmkklmhfadpacifaonc" /> 7 <!--# include file="common/header.inc" -->
8 <script src="web-common/taler-wallet-lib.js" type="text/javascript"></script>
9
10 <script type="application/javascript">
11 /*
12 @licstart The following is the entire license notice for the
13 JavaScript code in this page.
14
15 Copyright (C) 2015 GNUnet e.V.
16
17 The JavaScript code in this page is free software: you can
18 redistribute it and/or modify it under the terms of the GNU
19 Lesser General Public License (GNU LGPL) as published by the Free Software
20 Foundation, either version 2.1 of the License, or (at your option)
21 any later version. The code is distributed WITHOUT ANY WARRANTY;
22 without even the implied warranty of MERCHANTABILITY or FITNESS
23 FOR A PARTICULAR PURPOSE. See the GNU LGPL for more details.
24
25 As additional permission under GNU LGPL version 2.1 section 7, you
26 may distribute non-source (e.g., minimized or compacted) forms of
27 that code without the copy of the GNU LGPL normally required by
28 section 4, provided you include this license notice and a URL
29 through which recipients can access the Corresponding Source.
30
31 @licend The above is the entire license notice
32 for the JavaScript code in this page.
33 */
34
35 var chrome_min_version = '47.0.2526';
36
37 function onSuccess() {
38 console.log("installation successful");
39 document.getElementById("install-result").appendChild(document.createTextNode("Installation was successful."));
40 }
41 8
42 function onFailure(detail) { 9 <link rel="chrome-webstore-item" href="https://chrome.google.com/webstore/detail/millncjiddlpgdmkklmhfadpacifaonc" />
43 console.error("installation failed:", detail); 10 <script src="web-common/taler-wallet-lib.js" type="text/javascript"></script>
44 document.getElementById("install-result").appendChild(document.createTextNode("Installation failed: " + detail));
45 }
46 11
47 function installWallet() { 12 <script type="application/javascript">
48 if (window.chrome) { 13 /*
14 @licstart The following is the entire license notice for the
15 JavaScript code in this page.
16
17 Copyright (C) 2015 GNUnet e.V.
18
19 The JavaScript code in this page is free software: you can
20 redistribute it and/or modify it under the terms of the GNU
21 Lesser General Public License (GNU LGPL) as published by the Free Software
22 Foundation, either version 2.1 of the License, or (at your option)
23 any later version. The code is distributed WITHOUT ANY WARRANTY;
24 without even the implied warranty of MERCHANTABILITY or FITNESS
25 FOR A PARTICULAR PURPOSE. See the GNU LGPL for more details.
26
27 As additional permission under GNU LGPL version 2.1 section 7, you
28 may distribute non-source (e.g., minimized or compacted) forms of
29 that code without the copy of the GNU LGPL normally required by
30 section 4, provided you include this license notice and a URL
31 through which recipients can access the Corresponding Source.
32
33 @licend The above is the entire license notice
34 for the JavaScript code in this page.
35 */
36
37var chrome_min_version = '49';
38
39function onSuccess() {
40 console.log("installation successful");
41 document.getElementById("install-result").appendChild(document.createTextNode("Installation was successful."));
42}
43
44function onFailure(detail) {
45 console.error("installation failed:", detail);
46 document.getElementById("install-result").appendChild(document.createTextNode("Installation failed: " + detail));
47}
48
49function installWallet() {
50 if (window.chrome) {
49 chrome.webstore.install("https://chrome.google.com/webstore/detail/millncjiddlpgdmkklmhfadpacifaonc", onSuccess, onFailure); 51 chrome.webstore.install("https://chrome.google.com/webstore/detail/millncjiddlpgdmkklmhfadpacifaonc", onSuccess, onFailure);
50 } else { 52 } else {
51 onFailure("Google Chrome or Chromium is required for installation."); 53 onFailure("Google Chrome or Chromium is required for installation.");
52 }
53 } 54 }
55}
54 56
55 try { 57try {
56 taler.onPresent(function () { 58 taler.onPresent(function () {
57 document.getElementById("box-present").style.display = "inherit"; 59 document.getElementById("box-present").style.display = "inherit";
58 document.getElementById("box-not-present").style.display = "none"; 60 document.getElementById("box-not-present").style.display = "none";
59 }); 61 });
60 taler.onAbsent(function () { 62 taler.onAbsent(function () {
61 document.getElementById("box-present").style.display = "none"; 63 document.getElementById("box-present").style.display = "none";
62 document.getElementById("box-not-present").style.display = "inherit"; 64 document.getElementById("box-not-present").style.display = "inherit";
63 }); 65 });
64 } catch (err) { 66} catch (err) {}
65 }
66 67
67 function onLoad() { 68function onLoad() {
68 if (typeof window.chrome != "object") { 69 if (typeof window.chrome != "object") {
69 document.getElementById("error-chrome").style.display = "inherit"; 70 document.getElementById("error-chrome").style.display = "inherit";
70 } else { 71 } else {
71 var m = navigator.userAgent.match(/Chrome\/([0-9.]+)/); 72 var m = navigator.userAgent.match(/Chrome\/([0-9.]+)/);
72 if (null == m || m[1] < chrome_min_version) { 73 if (null == m || m[1] < chrome_min_version) {
73 document.getElementById('chrome-min-version').appendChild(document.createTextNode(chrome_min_version)); 74 document.getElementById('chrome-min-version').appendChild(document.createTextNode(chrome_min_version));
74 document.getElementById('error-chrome-version').style.display = "inherit"; 75 document.getElementById('error-chrome-version').style.display = "inherit";
75 } 76 }
76 }
77 } 77 }
78}
78 79
79 document.addEventListener('DOMContentLoaded', onLoad); 80document.addEventListener('DOMContentLoaded', onLoad);
80 </script> 81 </script>
81 82
82 <style type="text/css"> 83 <style type="text/css">
83 .greenbox { 84 .greenbox {
84 background-color: #5EFF64; 85 background-color: #5EFF64;
85 border: solid; 86 border: solid;
86 border-radius: 5px; 87 border-radius: 5px;
87 padding: 0.5em; 88 padding: 0.5em;
88 } 89 }
89 .bluebox { 90 .bluebox {
90 background-color: #C2C6FF; 91 background-color: #C2C6FF;
91 border: solid; 92 border: solid;
92 border-radius: 5px; 93 border-radius: 5px;
93 padding: 0.5em; 94 padding: 0.5em;
94 } 95 }
95 .error { 96 .error {
96 font-style: italic; 97 font-style: italic;
97 display: none; 98 display: none;
98 } 99 }
99 #install-result { 100 #install-result {
100 font-weight: bold; 101 font-weight: bold;
101 } 102 }
102 103
103 main ul li { 104 main ul li {
104 margin-bottom: 1em; 105 margin-bottom: 1em;
105 } 106 }
106 </style> 107 </style>
107</head> 108 </head>
108 109
109<body> 110 <body class="en" onLoad="loadLang();">
110 <h1>Install the Taler wallet</h1> 111 <div class="container">
111 112 <!--# include file="common/navigation.inc" -->
112 <main style="display:inline-block;"> 113 <!-- Jumbotron -->
113 <h2>Google Chrome / Chromium 49+</h2> 114 <div class="jumbotron">
114 <p id="error-chrome" class="error"> 115 <h1 lang="en">Taler Wallet</h1>
115 <a href="https://www.google.com/chrome">Google Chrome</a> or <a href="https://www.chromium.org/">Chromium</a> 116 </div>
116 is required, but it appears you don't have it installed. 117
117 </p> 118 <div class="row">
118 <p id="error-chrome-version" class="error"> 119 <div class="col-lg-6">
119 <a href="https://www.google.com/chrome">Google Chrome</a> or <a href="https://www.chromium.org/">Chromium</a> 120
120 version <span id="chrome-min-version"></span> or newer is required, but it appears you have an older version.</p> 121 <h2>Google Chrome / Chromium 49+</h2>
121 <ul> 122
122 <li> 123 <p id="error-chrome" class="error">
123 <a href="https://chrome.google.com/webstore/detail/gnu-taler-wallet/millncjiddlpgdmkklmhfadpacifaonc">Install from the Chrome Web Store</a> 124 <a href="https://www.google.com/chrome">Google Chrome</a> or <a href="https://www.chromium.org/">Chromium</a>
124 </li> 125 is required, but it appears you don't have it installed.
125 <li id="inline-install-chrome"> 126 </p>
126 <button onclick="installWallet()" id="install-button"> 127 <p id="error-chrome-version" class="error">
127 Install from this page 128 <a href="https://www.google.com/chrome">Google Chrome</a> or <a href="https://www.chromium.org/">Chromium</a>
128 </button> 129 version <span id="chrome-min-version"></span> or newer is required, but it appears you have an older version.</p>
129 <div id="install-result"></div> 130 <ul>
130 </li> 131 <li>
131 </ul> 132 <a href="https://chrome.google.com/webstore/detail/gnu-taler-wallet/millncjiddlpgdmkklmhfadpacifaonc">Install from the Chrome Web Store</a>
132 133 </li>
133 <h2>Firefox 50+</h2> 134 <li id="inline-install-chrome">
134 135 <button onclick="installWallet()" id="install-button">
135 <p>The add-on is currently in the process of being signed by Mozilla, 136 Install from this page
136 until then it can be installed the following way:</p> 137 </button>
137 138 <div id="install-result"></div>
138 <h3>Firefox Beta</h3> 139 </li>
139 <ol> 140 </ul>
140 <li><a href="/releases/taler-wallet/taler-wallet-stable.xpi">Download the wallet</a> (right click, Save Link As...)</li> 141 </div> <!-- /col-lg-6 -->
141 <li>On the <code>about:debugging</code> page, "Load temporary extension"</li> 142
142 </ol> 143 <div class="col-lg-6">
143 144 <h2>Firefox 50+</h2>
144 <h3>Firefox Developer Edition</h3> 145
145 <p>Either from the <code>about:debugging</code> page like above, or:</p> 146 <p>The add-on is currently in the process of being signed by Mozilla,
146 <ol> 147 until then it can be installed the following way:</p>
147 <li>On the <code>about:config</code> page set <code>xpinstall.signatures.required</code> to <code>false</code></li> 148
148 <li><a href="/releases/taler-wallet/taler-wallet-stable.xpi">Install the wallet</a></li> 149 <h3>Firefox Beta</h3>
149 </ol> 150 <ol>
150 151 <li><a href="/releases/taler-wallet/taler-wallet-stable.xpi">Download the wallet</a> (right click, Save Link As...)</li>
151 <h2>Other browsers</h2> 152 <li>On the <code>about:debugging</code> page, "Load temporary extension"</li>
152 <p>Wallets for other browsers will be provided in the near future.</p> 153 </ol>
153 <p class="greenbox" id="box-present" style="display:none"> 154
154 Congratulations, you have installed the Taler wallet. 155 <h3>Firefox Developer Edition</h3>
155 Check out the <a href="https://demo.taler.net/">demo</a>. 156 <p>Either from the <code>about:debugging</code> page like above, or:</p>
156 </p> 157 <ol>
157 <p class="bluebox" id="box-not-present" style="display:none"> 158 <li>On the <code>about:config</code> page set <code>xpinstall.signatures.required</code> to <code>false</code></li>
158 You don't have a wallet installed yet. 159 <li><a href="/releases/taler-wallet/taler-wallet-stable.xpi">Install the wallet</a></li>
159 </p> 160 </ol>
160 </main> 161
161</body> 162 </div> <!-- /col-lg-6 -->
163
164 </div> <!-- /row -->
165
166 <div class="row">
167
168 <div class="col-lg-6">
169 <h2>Other browsers</h2>
170 <p>Wallets for other browsers will be provided in the near future.</p>
171 <p class="greenbox" id="box-present" style="display:none">
172 Congratulations, you have installed the Taler wallet.
173 Check out the <a href="https://demo.taler.net/">demo</a>.
174 </p>
175 <p class="bluebox" id="box-not-present" style="display:none">
176 You don't have a wallet installed yet.
177 </p>
178
179 </div> <!-- /col-lg-6 -->
180 </div> <!-- /row -->
181
182 <!--# include file="common/footer.inc" -->
183 </div> <!-- /container -->
184 </body>
162</html> 185</html>