Last active
December 12, 2017 12:16
-
-
Save ssaurel/8f8e840ee8a1f36f29deb9089377ab51 to your computer and use it in GitHub Desktop.
Bitcoin Price Index Watcher in HTML5 tutorial for the SSaurel's Blog
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<title>Bitcoin Price Index Watcher in HTML5</title> | |
<style type="text/css"> | |
#data { | |
width: 400px; | |
border: 1px dashed black; | |
font-size: 20px; | |
text-align: center; | |
margin: 0 auto; | |
margin-top: 50px; | |
padding: 10px; | |
} | |
#logo { | |
width: 320px; | |
height: 320px; | |
margin: 0 auto; | |
margin-top: 50px; | |
display: block; | |
} | |
</style> | |
</head> | |
<body> | |
<img id="logo" src="https://www.ssaurel.com/cryptocoins/screenshots/web_hi_res_512.png" /> | |
<div id="data" /> | |
<script type="text/javascript"> | |
var xmlhttp = new XMLHttpRequest(); | |
var url = "https://api.coindesk.com/v1/bpi/currentprice.json"; | |
xmlhttp.onreadystatechange = function() { | |
if (this.readyState == 4 && this.status == 200) { | |
var json = JSON.parse(this.responseText); | |
parseJson(json); | |
} | |
}; | |
xmlhttp.open("GET", url, true); | |
xmlhttp.send(); | |
function parseJson(json) { | |
var time = "<b>Last Updated : " + json["time"]["updated"] + "</b>"; | |
var usdValue = "1 BTC equals to $" + json["bpi"]["USD"]["rate"]; | |
var gbpValue = "1 BTC equals to £" + json["bpi"]["GBP"]["rate"]; | |
var euroValue = "1 BTC equals to €" + json["bpi"]["EUR"]["rate"]; | |
document.getElementById("data").innerHTML = time + | |
"<br /><br />" + usdValue + | |
"<br />" + gbpValue + | |
"<br />" + euroValue; | |
} | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment