SteemMe - Displaying STEEM & SBD Prices for multiple currencies

View this thread on: d.buzz | hive.blog | peakd.com | ecency.com
·@moonrise·
0.000 HBD
SteemMe - Displaying STEEM & SBD Prices for multiple currencies
![wallpaper.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1520246766/jm7oubvngegrdd2nqtdc.png)

## SteemMe V0.0.5 ([Commit](https://github.com/caspernikus/SteemMe/commit/807ff92d985cf1499040e5607b8ee63f597e97b3))
#### What feature(s) did you add?
SteemMe V0.0.5 brings a new big update and code refactoring with it. First of all does SteemMe now fully uses jQuery for DOM manipulation. The new big update SteemMe brings with it, is the display of STEEM / SBD Prices according to your selected currency in the options page. The prices are always displayed at the bottom of the extension. 

You can change the currency in the extension option panel (Chrome Settings -> More Tools -> Extensions -> Extension Options).

Current available currencies are:
- EUR
- USD
- AUD
- CAD
- GBP 

If you are missing one, please comment !

![Screen Shot 2018-03-05 at 11.44.23.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1520246840/svoy8bt2lsahxrxdzdy9.png)
![Screen Shot 2018-03-05 at 11.44.48.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1520246844/noecksk7um8sxjhhiphh.png)

#### How did you implement them?
Layout is all done with bootstrap. To get the latest price feed the CoinMarketCap's API is used. For that the Utils.js file got 2 new methods added:

``` javascript
function getSteemPrice(coinName, currency) {
    var xhr = new XMLHttpRequest();

    xhr.open("GET", "https://api.coinmarketcap.com/v1/ticker/"+ coinName +"/?convert="+ currency, false);
    xhr.send();

    var result = JSON.parse(xhr.responseText);

    return result[0]["price_" + currency];
}

function getCurrencySymbol(currency) {
    switch (currency) {
        case 'eur':
            return '\u20AC';
        case 'cad':
            return 'CAD';
        case 'gbp':
            return '&#163';
        case 'aud':
            return 'AUD';
        default:
            return '$'
    }
}
```

To save the selected currency the options.js got a new method which is automatically called when the selected value changes:
``` javascript
function selectCurrency() {
	const currency = selectCur.val();

	chrome.storage.sync.set({
    	currency: currency,
  	}, function() {
    	var status = document.getElementById('status');
    	status.textContent = 'Options saved.';
    	setTimeout(function() {
      		status.textContent = '';
    	}, 750);
  	});
}
```

### Roadmap
- V.0.0.5:
  - SBD / STEEM Price
- Next: V.0.0.6:
  - Wallet Details page
- V.0.1:
  - UI
  - More...

### Contribute
Feel free to contribute by forking the [GitHub Repo](https://github.com/caspernikus/SteemMe) and creating Pull Requests. You can check the Roadmaps to find ideas, or you can implement your own stuff.

### How to install it?
Please visit the [Google Chrome Webstore](https://chrome.google.com/webstore/detail/steemme/ngidfkeoagenomhiachkdjaknbpgnile) and download the extension!

Go to your Extensions Tab and click options to set your Steemit Username
![Screen Shot 2018-02-27 at 12.46.46.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1519732026/ntxgxzevqm0v5feeszj3.png)

### Proof for GitHub
![Screen Shot 2018-02-23 at 10.47.12.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1519379413/bbwdrpuq27uc1qx7h0pp.png)

benediktveith is my main GitHub account.
[Check here for another proof](https://utopian.io/utopian-io/@moonrise/added-code-highlighting-or-added-code-block-toolbar-button-or-fixed-code-block-bug)

<br /><hr/><em>Posted on <a href="https://utopian.io/utopian-io/@moonrise/steemme-displaying-steem-and-sbd-prices-for-multiple-currencies">Utopian.io -  Rewarding Open Source Contributors</a></em><hr/>
👍 , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , ,