Hello everyone :) This is my second development contribution on Utopian.io, where you can get rewarded for contributing to open-source projects. (whether you're a developer, artist, thinker, or anyone else!)
In this post, I'll be highlighting the newly-developed changes in Version 0.2 of the STEEM Price Widget. Steem Price Widget allows you to embed a customized, personal and accurate STEEM ticker into your website!
Below, we'll cover a list of all of the major new features in the new version, excluding the many minor bug fixes that were made.
v0.1 of the price widget relied on USD as the main base currency. However, not all of us live in the United States or rely on the Dollar as our main currency. Thus, we've added support for expansive base currencies. Currently, there are 3 main base currencies (USD, BTC, SBD) but the code currently allows for easy addition of more! Soon, the customization tool will allow you to set your fiat base currency to anything from the Japanese Yen to the Mexican Peso.v0.1 of the price widget saw a gnarly, inconsistent loading view, with some screens reporting just the word 'loading' while others reporting a spinning ellipse (which was supposed to be a circle!). We've fixed all of the loading concerns with a brand-new loading view that will look the same no matter what platform you're on!v0.1 of the widget only allowed you to see the current price of STEEM which may not be everything you want to know. Thus, we've added in a 24-hour price movement percentage. If STEEM moved up 10% in the last day, the percentage shows up green and says (+10.00%). Likewise, if STEEM decreased by 5%, it shows up red as (-5.00%).The above descriptions cover all of the front-end major changes in the new version. Below, we'll touch up on a few of the biggest changes in even more detail.
There's not much to say except everything has been retouched and redesigned in this new version!
Below, you can see the differences for yourself (left is version 0.1, right is 0.2):
Check out our new customization tool at this link. Here's a sample:
You can make any personalizations you want on the left-hand side of the page, and the preview is located at the right-hand side. For example, if you're posting on a Bitcoin blog, you might want to use BTC as the default base currency. Additionally, you might not want the background to be there, you may want the width to be slightly large, and you may want the border to be orange.
With the tool, you can easily add in all these customizations and see the result to the right. If you like it, you can easily copy the code at the bottom of the page.
See the GIF at right for a preview of the all-new loading animation!
Powered by HTML5 and CSS, the new animation will look the same on all supported browsers.
Additionally, loading times are now much faster, meaning you won't be seeing this animation for long :)
Base Currencies are the currency in which prices are displayed in. If you live in the United States, when you go shop at a store, the base currency is likely USD. If you pay in Bitcoin, the price may be given in terms of BTC.
Similarly, our widget wants to be inclusive in terms of base currencies! To the right, you can see how easy it is to switch base currencies with the Steem Price Widget.
Currently, we support the United States Dollar USD, Bitcoin BTC, and the Steem Dollar SBD. Soon, we'll be adding even more base currencies from other countries and regions.
To the right, you can see a screenshot of the new widget.
Note the red (-2.88%) in the corner of the price. This all-new 24-hour change monitor tells you:
For example, from the image at right, we can tell STEEM has decreased in price about 3% in the past day.
As this is a Utopian post, it is customary to add proof of work to prove that you are the developer of an open-source project. My Github username is also @mooncryption and you can see that @mooncryption on Github added my Steemit username and Steemit links to many of the widget pages.
Additionally, if you hover over the information i button at the bottom of the widget, you'll see a link to my Steemit profile as well. All of my commits are available publicly on the project repository and many of them are even PGP-verified.
Lastly, you can look at the GitHub Release Notes for this release and see my Steemit link embedded in there too :)
Using the widget is as simple as going to this link and copying the code at the bottom. If you want customizations, you can make them there too!
Thanks for reading,
— 
image sources: all
proof of work: github repo, release commit