-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
added a few comments as well
- Loading branch information
Showing
7 changed files
with
152 additions
and
12 deletions.
There are no files selected for viewing
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
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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| # Crypto Info Component | ||
|
|
||
| ## Overview | ||
| Displays current Crypto Currency exchange rates. | ||
|
|
||
|  | ||
|
|
||
| ## Component Interface | ||
| This Crypto Component can be configured to use any target currency, in case nothing is specified the default is used. (USD) | ||
|
|
||
| <!-- Crypto Currency Info showcase --> | ||
| <a-entity crypto-info-component="currency:EUR" position="4 -2 -5"></a-entity> | ||
|
|
||
| ## API | ||
| following REST API call is executed all ~15 minutes to refresh the currency status from this fee API (no API key needed) | ||
|
|
||
| https://api.coinbase.com/v2/exchange-rates?currency=USD | ||
|
|
||
| Sample Result: | ||
|
|
||
| {"data":{"currency":"EUR","rates":{"AED":"3.90788","AFN":"94.2399999999998372","ALL":"112.982","AMD":"418.7199999999963287" .... | ||
|
|
||
| > full Coinbase API Docs here: https://docs.cloud.coinbase.com/sign-in-with-coinbase/docs/api-exchange-rates#http-request |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
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
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
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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,112 @@ | ||
| AFRAME.registerComponent('crypto-info-component',{ | ||
| schema : { | ||
| currency : {default:'USD'} | ||
| }, | ||
|
|
||
| init: function(){ | ||
|
|
||
| this.currentTimestamp = new Date().getMinutes(); | ||
|
|
||
| this.createComponent(); | ||
| this.getCryptoRatesREST(); | ||
|
|
||
| }, | ||
|
|
||
| createComponent: function() { | ||
|
|
||
| this.lastupdate = document.createElement('a-text'); | ||
| this.lastupdate.setAttribute('id','lastupdate'); | ||
| this.lastupdate.setAttribute('text',{ color: '#fff', align: 'left', width: "3", value: "Status: " + new Date().toLocaleTimeString(), opacity:'0.8'}); | ||
| this.lastupdate.object3D.position.set(0.2, -1.2, -0.1); | ||
| this.el.appendChild(this.lastupdate); | ||
|
|
||
| this.textEl_ETH = document.createElement('a-text'); | ||
| this.textEl_ETH.setAttribute('id','ethtxt'); | ||
| this.textEl_ETH.setAttribute('text',{ color: '#fff', align: 'left', width: "6", value: "Ethereum:", opacity:'1'}); | ||
| this.textEl_ETH.object3D.position.set(0, 0.6, 0); | ||
| this.el.appendChild(this.textEl_ETH); | ||
|
|
||
| this.textEl_BTC = document.createElement('a-text'); | ||
| this.textEl_BTC.setAttribute('id','btctxt'); | ||
| this.textEl_BTC.setAttribute('text',{ color: '#fff', align: 'left', width: "6", value: "Bitcoin:", opacity:'1'}); | ||
| this.textEl_BTC.object3D.position.set(0, 0.3, 0); | ||
| this.el.appendChild(this.textEl_BTC); | ||
|
|
||
| this.textEl_SOL = document.createElement('a-text'); | ||
| this.textEl_SOL.setAttribute('id','soltxt'); | ||
| this.textEl_SOL.setAttribute('text',{ color: '#fff', align: 'left', width: "6", value: "Solana:", opacity:'1'}); | ||
| this.textEl_SOL.object3D.position.set(0, 0, 0); | ||
| this.el.appendChild(this.textEl_SOL); | ||
|
|
||
| this.textEl_MATIC = document.createElement('a-text'); | ||
| this.textEl_MATIC.setAttribute('id','adatxt'); | ||
| this.textEl_MATIC.setAttribute('text',{ color: '#fff', align: 'left', width: "6", value: "Polygon:", opacity:'1'}); | ||
| this.textEl_MATIC.object3D.position.set(0, -0.3, 0); | ||
| this.el.appendChild(this.textEl_MATIC); | ||
|
|
||
| this.textEl_ADA = document.createElement('a-text'); | ||
| this.textEl_ADA.setAttribute('id','adatxt'); | ||
| this.textEl_ADA.setAttribute('text',{ color: '#fff', align: 'left', width: "6", value: "Cardano:", opacity:'1'}); | ||
| this.textEl_ADA.object3D.position.set(0, -0.6, 0); | ||
| this.el.appendChild(this.textEl_ADA); | ||
|
|
||
| this.textEl_SKL = document.createElement('a-text'); | ||
| this.textEl_SKL.setAttribute('id','adatxt'); | ||
| this.textEl_SKL.setAttribute('text',{ color: '#fff', align: 'left', width: "6", value: "Skale:", opacity:'1'}); | ||
| this.textEl_SKL.object3D.position.set(0, -0.9, 0); | ||
| this.el.appendChild(this.textEl_SKL); | ||
| }, | ||
|
|
||
| // *** render Content | ||
| showCrypto: function(rates) { | ||
|
|
||
| // convert rates | ||
| var eth = Math.round(1/rates.ETH *100)/100; | ||
| var btc = Math.round(1/rates.BTC *100)/100; | ||
| var sol = Math.round(1/rates.SOL *100)/100; | ||
| var matic = Math.round(1/rates.MATIC *100)/100; | ||
| var ada = Math.round(1/rates.ADA *100)/100; | ||
| var skl = Math.round(1/rates.SKL *100)/100; | ||
|
|
||
| // show rates | ||
| this.textEl_ETH.setAttribute('text',{ color: '#fff', align: 'left', width: "6", value: "Ethereum: " + eth + " " + this.data.currency, opacity:'1'}); | ||
| this.textEl_BTC.setAttribute('text',{ color: '#fff', align: 'left', width: "6", value: "Bitcoin: " + btc + " " + this.data.currency, opacity:'1'}); | ||
| this.textEl_SOL.setAttribute('text',{ color: '#fff', align: 'left', width: "6", value: "Solana: " + sol + " " + this.data.currency, opacity:'1'}); | ||
| this.textEl_MATIC.setAttribute('text',{ color: '#fff', align: 'left', width: "6", value: "Polygon: " + matic + " " + this.data.currency, opacity:'1'}); | ||
| this.textEl_ADA.setAttribute('text',{ color: '#fff', align: 'left', width: "6", value: "Cardano: " + ada + " " + this.data.currency, opacity:'1'}); | ||
| this.textEl_SKL.setAttribute('text',{ color: '#fff', align: 'left', width: "6", value: "Skale: " + skl + " " + this.data.currency, opacity:'1'}); | ||
|
|
||
| this.lastupdate.setAttribute('text',{ color: '#fff', align: 'left', width: "3", value: "Status update: " + new Date().toLocaleTimeString(), opacity:'0.8'}); | ||
| }, | ||
|
|
||
| // *** load Crypto Details | ||
| getCryptoRatesREST: function() { | ||
| // get latest crypto rates via REST | ||
| // https://docs.cloud.coinbase.com/sign-in-with-coinbase/docs/api-exchange-rates#http-request | ||
| var requestOptions = { | ||
| method: 'GET', | ||
| redirect: 'follow' | ||
| }; | ||
|
|
||
| fetch("https://api.coinbase.com/v2/exchange-rates?currency=" + this.data.currency, requestOptions) | ||
| .then(response => response.text()) | ||
| .then(result => { | ||
| //console.log(JSON.parse( result ).data.rates); | ||
| this.showCrypto(JSON.parse( result ).data.rates); | ||
| }) | ||
| .catch(error => console.log('error', error)); | ||
| }, | ||
|
|
||
| // *** TICKS | ||
| tick: function() { | ||
| var newTimestamp = new Date().getMinutes(); | ||
| difference = Math.abs(this.currentTimestamp - newTimestamp); | ||
|
|
||
| if (difference > 15) { | ||
| console.log("tick") | ||
| this.currentTimestamp= new Date().getMinutes(); | ||
| this.getCryptoRatesREST(); | ||
| } | ||
|
|
||
| } | ||
| }); |
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