diff options
| -rw-r--r-- | calculator.html | 34 | ||||
| -rw-r--r-- | css/bitcoin_pos.css | 1 | ||||
| -rw-r--r-- | img/logo.jpg (renamed from img/dailycatch.jpg) | bin | 27656 -> 27656 bytes | |||
| -rw-r--r-- | js/bitcoin_pos.js | 46 | ||||
| -rw-r--r-- | ticker.php (renamed from ticker.json) | 2 |
5 files changed, 57 insertions, 26 deletions
diff --git a/calculator.html b/calculator.html index 906bff14..bdc9fde8 100644 --- a/calculator.html +++ b/calculator.html @@ -15,29 +15,33 @@ <script src="js/bitcoin_pos.js"></script> </head> <body> - <div class="container-fluid" style="display: none"> - <h1 id="title">Bitcoin Payment Calculator</h1> + <div class="container-fluid"> + <div id="calculator" style="display: none"> + <h1 id="title">Bitcoin Payment Calculator</h1> - <img id="logo" src="img/logo.jpg" alt="Logo" style="display: none" /> + <img id="logo" src="img/logo.jpg" alt="Logo" style="display: none" /> - <label for="exchange">Exchange Rate:</label> - <input type="text" id="exchange" value="0" disabled="disabled" /> - <small>CAD / BTC</small> + <label for="exchange">Exchange Rate:</label> + <input type="text" id="exchange" value="0" disabled="disabled" /> + <small>CAD / BTC</small> - <label for="amount">Amount:</label> - <input type="text" id="amount" /> - <small>CAD</small> + <label for="amount">Amount:</label> + <input type="text" id="amount" /> + <small>CAD</small> - <br /><br /> + <br /><br /> - <div id="payment"> - <p>Please send <strong id="total">0.0</strong> bitcoins to:</p><br /> - <p id="address"></p> + <div id="payment"> + <p>Please send <strong id="total">0.0</strong> bitcoins to:</p><br /> + <p id="address"></p> - <canvas id="qrcanv">No Canvas Support</canvas> + <canvas id="qrcanv">No Canvas Support</canvas> + </div> + + <span id="received" class="btn btn-success">Payment Received. Thank you!</span> </div> - <span id="received" class="btn btn-success">Payment Received. Thank you!</span> + <span id="error" class="btn btn-danger" style="display: none">Can't establish connection</span> </div> </body> </html> diff --git a/css/bitcoin_pos.css b/css/bitcoin_pos.css index 736a206e..7da47f08 100644 --- a/css/bitcoin_pos.css +++ b/css/bitcoin_pos.css @@ -8,6 +8,7 @@ span.btn { font-size: 1.4em; width: 80%; } small, label { color: #999; font-size: 1.2em; } strong#total { font-size: 2em; } #logo { padding: 10px 0; } +#error { margin-top: 10px; } div.container-fluid { width: 600px; diff --git a/img/dailycatch.jpg b/img/logo.jpg Binary files differindex 2df858c3..2df858c3 100644 --- a/img/dailycatch.jpg +++ b/img/logo.jpg diff --git a/js/bitcoin_pos.js b/js/bitcoin_pos.js index adbd5fbf..2416ec6b 100644 --- a/js/bitcoin_pos.js +++ b/js/bitcoin_pos.js @@ -2,12 +2,16 @@ $(function() { var websocket = null; var title = getParameterByName('title'); var address = getParameterByName('address'); + var commission = getParameterByName('commission'); var logo = getParameterByName('logo'); var exchange = 0; if (title != "") $('#title').html(title); + if (commission == "") + commission = 3; + if (logo != "") { $('#logo').attr('src', logo).show(); $('#title').hide(); @@ -19,16 +23,7 @@ $(function() { $('#received').hide() setupQR(); - setInterval(setupSocket, 5000); - - $.getJSON('ticker.json', function (data) { - exchange = 1000 / data.out; - exchange = exchange + exchange * 0.03; - exchange = Math.ceil(exchange * 100) / 100; - $('#exchange').val(exchange.toFixed(2)); - updateTotal(); - $('div.container-fluid').fadeIn('slow'); - }); + setupSocket(); $('#amount').keyup(updateTotal); $('#amount').focus(); @@ -39,6 +34,10 @@ $(function() { updateTotal(); }); + $('#error').click(function() { + location.reload(); + }); + function updateTotal() { var amount = parseFloat($('#amount').val()); var total = amount / exchange; @@ -52,14 +51,41 @@ $(function() { displayQR('bitcoin:' + address + '?amount=' + total.toString()); } + function fetchExchangeRate() { + $.getJSON('ticker.php', function (data) { + if (data == null) { + $('#error').show(); + } else { + exchange = 1000 / data.out; + exchange = exchange - exchange * commission * 0.01; + exchange = Math.ceil(exchange * 100) / 100; + $('#exchange').val(exchange.toFixed(2)); + updateTotal(); + + $('#error').hide(); + $('#calculator').fadeIn('slow'); + } + }); + + setTimeout(fetchExchangeRate, 900000); + } + function setupSocket() { + setTimeout(setupSocket, 10000); + if (!websocket || websocket.readystate != 1) { websocket = new WebSocket("ws://api.blockchain.info:8335/inv"); websocket.onopen = function() { websocket.send('{"op":"addr_sub", "addr":"' + address + '"}'); + fetchExchangeRate(); } + websocket.onerror = websocket.onclose = function() { + $('#calculator').hide(); + $('#error').show(); + }; + websocket.onmessage = function(e) { var results = eval('(' + e.data + ')'); var from_address = ''; diff --git a/ticker.json b/ticker.php index 63e0842b..4cce3bcb 100644 --- a/ticker.json +++ b/ticker.php @@ -1 +1 @@ -<? echo file_get_contents("http://bitcoincharts.com/t/depthcalc.json?symbol=virtexCAD&type=bid&amount=1000¤cy=true") ?> +<? echo file_get_contents("http://bitcoincharts.com/t/depthcalc.json?symbol=virtexCAD&type=ask&amount=1000¤cy=true"); ?> |
