evtjs
Version:
Javascript API Bindings for the everiToken blockchain.
149 lines (137 loc) • 9.11 kB
HTML
<html>
<head>
<title>everiPay</title>
<meta name="viewport" content="width=device-width,target-densitydpi=high-dpi,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<style>
body {
margin: 1.5rem;
background-color: #3d226d;
color: white;
font-size: 90%;
}
pre, pre * {
white-space:pre-wrap;
white-space:-moz-pre-wrap;
white-space:-pre-wrap;
white-space:-o-pre-wrap;
word-wrap:break-word;
font-family: "Source Code Pro", 'Courier New', Courier, monospace;
}
button {
background-color:blueviolet;
color: white;
font-size: 1.1rem;
border: none;
outline: none;
padding: .5rem;
}
.scanzone-wraper {
background-color: white;
border-radius: 8px;
}
p, h1, h2, h3 {
margin: 0;
padding: 0;
color: rgb(240, 240, 240);
}
#fullpage-tip {
width: 100%;
height: 100%;
position: absolute;
background-color: rgba(255, 255, 255, 1);
top: 0;
left: 0;
padding-top: 5rem;
display: none;
}
#fullpage-tip * {
color: black;
text-align: center;
}
</style>
</head>
<body>
<h2>POINTS OF THE SHOP</h2>
<p>Token: POS</p>
<blockquote><code></code></blockquote>
<!--<button onclick="generatePass()">GeneratePass</button>-->
<br>
<div class="scanzone-wraper">
<div style="background: #f5d7d7; border-top-left-radius: 8px; border-top-right-radius: 8px; padding: .6rem .9rem; color: black; font-size: 80%; border-top: 2px red solid;">The transaction will be <b>executed</b> instantly after scanned!</div>
<image id="pass" style="display: block; box-sizing: border-box; padding: 1rem 3rem; width: 100%;" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAegAAAHoCAYAAACCUHwMAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAe9SURBVHhe7dUxAQAgDMCwgX/PwIGIHslTCV3nGQAgZf8CACEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNAEEGDQBBBg0AQQYNADkzF8WlB8zy/kk+AAAAAElFTkSuQmCC"></image>
<div style="text-align: center; background: #f5f5f5; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; padding: .6rem .9rem; color: black; font-size: 80%; border-top: 1px #f2f2f2 solid;">Will refresh automatically every 5s</div>
</div>
<pre style="text-align: center; max-width: 400px; color: rgb(210, 210, 210)">ONLY FOR USE FACE-TO-FACE
OR BEING SCANNED BY CORRECT SCANNERS
NEVER SHOW IT TO ANY OTHER PEOPLE</pre>
<div id="fullpage-tip">
<h1>Payment Successful</h1>
<br><br>
<p><img style="width: 25%" src="./success.png"></p>
<br>
<h2>0.00001 EVT</h2>
<br><br>
<p><button onclick="window.refresh()" style="color: white;">Return</button></p>
</div>
<script>
document.addEventListener("DOMContentLoaded", async function(event) {
let linkId = await EVT.EvtLink.getUniqueLinkId();
console.log("linkId: " + linkId);
window.refresh = function() {
window.location.reload();
};
window.generatePass = async function run() {
try {
let time = new Date().valueOf();
EVT.EvtLink.getEVTLinkQrImage(
"everiPay",
{
keyProvider: "5KgsgLciJmQy9K8ikFgM8LZgpdyC1ovULa6pguzSvud7BUU41uE", // [ "5JgWJptxZENHR69oZsPSeVTXScRx7jYPMTjPTKAjW2JFnjEhoDZ", "5KXxF69n5SsYSQRs8L855jKC5fqzT6uzRzJ1r686t2RRu9JQr9i", "5K3nUWxfkUjfLQu9PL6NZLKWV41PiFyuQdrckArA59jz19M6zgq" ],
symbol: 1,
maxAmount: 1000000,
linkId
},
{
autoReload: true
},
(err, res) => {
if (err) {
alert(err.message);
return;
}
// canvas: document.getElementById("canvas"),
document.getElementById("pass").setAttribute("src", res.dataUrl);
console.log("[+" + res.timeConsumed + "ms]" + res.rawText);
/*EVT.EvtLink.parseEvtLink(res.rawText).then(res => {
console.log(JSON.stringify(res, null, 2));
});*/
// document.getElementById("passText").innerHTML = res.rawText.substr(8);
});
}
catch(e) {
alert(e.message);
}
}
const network = {
host: "118.31.58.10",
port: 8890,
protocol: "http"
};
const apiCaller = EVT({
endpoint: network,
keyProvider: [ ]
});
window.checkPay = async function() {
let ret = await apiCaller.getTransactionIdForLinkId(linkId);
if (ret.trx_id) {
document.getElementById("fullpage-tip").style.display = "block";
linkId = await EVT.EvtLink.getUniqueLinkId();
}
}
setTimeout(() => window.generatePass(), 1);
setInterval(() => window.checkPay(), 300);
});
</script>
<script src="../dist/evt.min.js" crossorigin="anonymous" defer></script>
</body>
</html>