Up to now, websockets configuration was possible for the daemon only, this patch passes that information to the client via json file produced with the payment request.
108 lines
3.4 KiB
HTML
108 lines
3.4 KiB
HTML
<!DOCTYPE HTML>
|
|
<html>
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
|
<title>Payment request</title>
|
|
<script type="text/javascript" charset="utf-8" src="jquery-1.9.1.min.js"></script>
|
|
<script type="text/javascript" src="qrcode.js"></script>
|
|
<script type="text/javascript" src="jquery-ui.js"></script>
|
|
<link rel="stylesheet" type="text/css" href="jquery-ui.css">
|
|
<script type="text/javascript">
|
|
function getUrlParameter(sParam)
|
|
{
|
|
var sPageURL = window.location.search.substring(1);
|
|
var sURLVariables = sPageURL.split('&');
|
|
for (var i = 0; i < sURLVariables.length; i++)
|
|
{
|
|
var sParameterName = sURLVariables[i].split('=');
|
|
if (sParameterName[0] == sParam)
|
|
{
|
|
return sParameterName[1];
|
|
}
|
|
}
|
|
}
|
|
|
|
var id = getUrlParameter('id');
|
|
|
|
if (id) {
|
|
var jqxhr = $.getJSON(id + ".json", function() {
|
|
console.log("getJSON:success");
|
|
})
|
|
.done( function(data) {
|
|
new QRCode(document.getElementById("qrcode"), data.URI);
|
|
$("<p />").text(data.memo).appendTo($("p#reason"));
|
|
$("<p />").text(data.amount/100000000 + "BTC").appendTo($("p#amount"));
|
|
$("a").attr("href", data.URI);
|
|
$("<p />").text("Powered by Electrum").appendTo($("p#powered"));
|
|
$(function () {
|
|
var current;
|
|
var max = 100;
|
|
var initial = data.time;
|
|
var duration = data.exp;
|
|
var websocket_server = data.websocket_server;
|
|
var websocket_port = data.websocket_port;
|
|
if(duration){
|
|
var current = 100 * (Math.floor(Date.now()/1000) - initial)/duration;
|
|
$("#progressbar").progressbar({
|
|
value: current,
|
|
max: max
|
|
});
|
|
function update() {
|
|
current = 100 * (Math.floor(Date.now()/1000) - initial)/duration;
|
|
$("#progressbar").progressbar({
|
|
value: current
|
|
});
|
|
if (current >= max) {
|
|
$("#container").html("This invoice has expired");
|
|
}
|
|
};
|
|
var interval = setInterval(update, 1000);
|
|
}
|
|
});
|
|
})
|
|
.fail(function() {
|
|
console.log("error fail");
|
|
$("<p />").text("error").appendTo($("p#error"));
|
|
});
|
|
};
|
|
|
|
var ws = new WebSocket("wss://" + websocket_server + ":" + websocket_port +"/");
|
|
ws.onopen = function() {
|
|
ws.send('id:' + id);
|
|
};
|
|
ws.onmessage = function (evt) {
|
|
var received_msg = evt.data;
|
|
if(received_msg == 'paid'){
|
|
$("#container").html("This invoice has been paid.");
|
|
}
|
|
else alert("Message is received:"+ received_msg);
|
|
};
|
|
|
|
|
|
// See http://stackoverflow.com/questions/29186154/chrome-clicking-mailto-links-closes-websocket-connection
|
|
$(document).on('click', 'a[href^="bitcoin:"]', function (e) {
|
|
e.preventDefault();
|
|
var btcWindow = window.open($(e.currentTarget).attr('href'));
|
|
btcWindow.close();
|
|
return false;
|
|
});
|
|
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div id="container" style="width:20em; text-align:center; margin:auto; font-family:arial, serif;">
|
|
<p id="error"></p>
|
|
<p id="reason"></p>
|
|
<p id="amount"></p>
|
|
<div style="background-color:#7777aa; border-radius: 5px; padding:10px;">
|
|
<a style="color:#ffffff; text-decoration:none;" id="paylink" target="_blank">Pay with Bitcoin</a>
|
|
</div>
|
|
<br/>
|
|
<div id="qrcode" align="center"></div>
|
|
<p id="powered" style="font-size:80%;"></p>
|
|
<div id="progressbar"></div>
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|