Here is a Steem PriceTicker I made with CoinmarketCap API

in #steemit • 8 years ago (edited)


This #priceticker can even be denoted into #BTC with a little bit of help.  It's a simplified version of my #HBOM ticker I made a few months back.  I'll likely include it on the site in due time, but in case you'd like to jump on and use it now: here you go.  Any and all feedback is greatly appreciated 😁

I've embedded Jquery so it's easy to use the $GET() requests, but if you have a more efficient method that could get rid of JQuery I'm open to advice.  Take care and and cheers peeps.

<script   src="https://code.jquery.com/jquery-2.2.4.min.js"   integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="   crossorigin="anonymous"></script><div id="tickerBox"></div>

    <script>

    var tickerBox = document.getElementById('tickerBox');

    var divTicker = document.createElement('div');

    divTicker.setAttribute("id", "ticker");

    tickerBox.appendChild(divTicker);

    divTicker.style.fontSize="4rem";

    divTicker.style.fontWeight="bold";

    divTicker.style.letterSpacing="2px";

    var checked = document.createElement('div');

    checked.setAttribute("id", "checked");

    tickerBox.appendChild(checked);


    var dataLast;

    function priceData (){

            var ticker = document.getElementById('ticker');

            var lastUpdated = document.getElementById('checked');

            var datetime = "Last Updated: <br/>" + new Date().toLocaleTimeString();

//https://api.bitcoinaverage.com/ticker/global/USD/last

    $.get(

        "https://api.coinmarketcap.com/v1/ticker/steem/",

        function(data) {

         data = data[0].price_usd;

         if (data > dataLast) {

            divTicker.style.color = "green";

         } else {

            divTicker.style.color = "red";

         }

         ticker.innerHTML = "$" + data.toFixed(2)+" <span id='super'>USD</span>";

         superscript = document.getElementById('super');

         superscript.style.fontSize="xx-small";

         superscript.style.verticalAlign="top";

         superscript.style.letterSpacing="0px";

         checked.innerHTML = datetime;

         dataLast = data;

        }

    );

    }

    priceData();

    setInterval(priceData, 5000);

    checked.style.paddingLeft="10px";

    checked.style.marginTop="-14px";

    checked.style.color="black";

    checked.style.textShadow="2px 2px 1px #4ba2f2";

    checked.style.float="right";

    ticker.style.textShadow="1px 2px 2px black";

    ticker.style.paddingLeft="10px";

    tickerBox.style.width="13rem";

    tickerBox.style.height="10rem";

    ticker.style.paddingTop="1rem";

    ticker.style.paddingBottom=".5rem";    

    tickerBox.style.borderRadius="5px";

    tickerBox.style.backgroundImage="url('https://puu.sh/q1VUF/d9e60eef32.png')";

    tickerBox.style.backgroundSize="contain";

    //tickerBox.style.backgroundPosition="40px 0px";

    &lt;/script&gt;
#price #ticker #priceticker #BTC
8 years ago in #steemit by
$0.06
  • Past Payouts $0.06
  • - Author $0.06
  • - Curators $0.00
22 votes
Reply 9
Sort:  
  • Trending
    • [-]
     8 years ago (edited) 

    hello, i have the domain steemcoins.com and steemdollars.net but i don't have helpfull purpose yet that benefits the community . Neither am i a programmer, can we maybe work together? Or at least put this ticker at the steemcoins.com or/and steemdollars.net ?

    [-]
     8 years ago  

    Of course...shoot me a pm through social media channels or elsewhere if you need more help. Some Quickstart Directions:

    here is a link to the code block - steemit editing doesn't seem to play nice when I tried to share the code above and in this comment :(

    1. put this code into a new document or on a page...end that page with .html
    2. it works.
    [-]
     8 years ago  

    thank you, but it doesn't work yet. How can i contact you?

    $0.00
      Reply
      [-]
       8 years ago  

      shoot me a pm on reddit or twitter. I'll help you get it figured out...though it's not responsive, I'd have to change it around - its set to a fixed size and keeps the same background, I could make it full screen to take up the entire space if you liked.

      $0.00
        Reply
        [-]
         8 years ago  

        i messaged you at reddit

        $0.00
          Reply
          [-]
           8 years ago (edited) 

          Post your code in < code >this is my code < /code > without spaces.

          [-]
           8 years ago  

          I tried it a few different ways and resorted to using the monoblock button on the editor as using your suggestion didn't seem to work above. Thanks for helping me figure the formatting out.

          [-]
           7 years ago  

          I am getting into programming here today and started with this. How on earth do I run a file that pulls the JSON api data? :P

          $0.00
            Reply