Help With Code For Live Btc values

[MASSEY]

Hi, i'm new here.

I have some code that i am trying to get working to display live prices in various currency on a site i am working on as a bit of a hobby as btc interests me and im planning on buying some soon.

The codes i have inserted into the site are as follows.

This goes in the wordpress header =

<script src="js/jquery-1.10.2.min.js"></script>

This goes in the body of the wordpress page  =


 <script>
        $( ".currencySwitch" ).click(function( event ) {
            $( ".currencySwitch" ).removeClass( "active" );
            $( this ).addClass( "active" );
            event.preventDefault();
            var countryCode = $( this ).data( "code" );
            $.ajax({
                type: 'POST',
                url: 'ajax.php',
                data: { country: countryCode },
                dataType: 'json',
            beforeSend: function() {
                    $( "#price" ).html( "<div class=\"loading\"></div>" );
            },
                success: function (data) {
                    window.history.pushState( "Updating URL", countryCode, "/?currency=" + countryCode );
                    $( "#price" ).fadeOut(function() {
                 $( this ).text( data.price ).fadeIn( "fast" );
               });
                }
            });
        });
        </script>

I get lost from there on. You can see what it is trying to function here http://www.currentpriceofbitcoin.co.uk/btc-news. I guess what i really need is the code to draw from a price source.

Any help would be appreciated.

[9inety7even]

I wrote a small basic ticker for another thread; here's the code if you want it:

Code:

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $.getJSON("https://api.bitcoinaverage.com/ticker/global/USD/", function(data){
            $("#BTCPrice").append("<center>BTC: $" + data["last"].toFixed(2) + "</center>")
        })
    })
</script>
<div id="BTCPrice" style="height:40px;margin:auto;position:absolute;top:-20;left:0;bottom:0;right:0" />

You should easily be able to make this fit your needs, if you want it to update at an interval, just add some more jquery, etc.

[mintodev]

Why don't you use bitcoin ticker for wordpress widget. It is available with lot of features.

[minzie]

You also need an element with an id of 'price' somewhere in your HTML. There are a ton of ways to do this, but it can be something as simple as:

Code:

<div>Current BTC Price:<span id="price"></span></div>

Is that what you are asking? Or is the javascript not returning any information? With the exception of the jquery import, you really only need two things; some javascript, and a little html, and that is really it. If the data is not coming back correctly, then something else is going on. I don't see anything wrong with your code though.

I can help, I just need to know where you need it.

[talkcrypto]

Anyone got something like this working, the code on post 2 doesnt seem to quite work.

[9inety7even]

Anyone got something like this working, the code on post 2 doesnt seem to quite work.

You're doing something wrong then, I just tried it and it works perfectly. Just copy and paste my code into an HTML file, and open it in a browser.

[royal-casino]

wow thanks. I was looking for this

[minzie]

@talkcrypto,
That example should not work for you due to do browser security issues ( and it doesn't work for me either). That represents a cross site scripting request since the domain is not the same as yours. The code is actually retrieving the values, but it is just discarding them.

   Due to browser security restrictions, most "Ajax" requests are subject to the same origin policy; the request can not successfully retrieve data from a different domain, subdomain, port, or protocol.
    Script and JSONP requests are not subject to the same origin policy restrictions.

http://api.jquery.com/jQuery.getJSON/

If you are trying to run your code from your localhost, then this will and should fail.

[9inety7even]

@talkcrypto,
That example should not work for you due to do browser security issues ( and it doesn't work for me either). That represents a cross site scripting request since the domain is not the same as yours. The code is actually retrieving the values, but it is just discarding them.

   Due to browser security restrictions, most "Ajax" requests are subject to the same origin policy; the request can not successfully retrieve data from a different domain, subdomain, port, or protocol.
    Script and JSONP requests are not subject to the same origin policy restrictions.

http://api.jquery.com/jQuery.getJSON/

If you are trying to run your code from your localhost, then this will and should fail.

Are you talking about my code?

[minzie]

Yes.

[9inety7even]

In that case, you're actually incorrect. You're right that there usually would be an issue due to Access-Control-Allow-Origin not allowing a request from another domain, but in this case, https://api.bitcoinaverage.com has access-control-allow-origin set to *, meaning it will allow requests from anywhere.

If you tried to do this with btc-e for example, then it wouldn't work, because of the issue I outlined above. In that case, you could use a proxy to access the data, like I did in the litecoin example below. You can see that I use http://whateverorigin.org to make the request for me, since it, like https://api.bitcoinaverage.com, has access-control-allow-origin set to *.

Code:

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $.getJSON("http://whateverorigin.org/get?url=" + encodeURIComponent("https://btc-e.com/api/2/ltc_usd/ticker") + "&callback=?", function(data){
            $("#LTCPrice").append("<center>LTC: $" + $.parseJSON(data.contents)["ticker"]["last"].toFixed(2) + "</center>")
	})
    })
</script>
<div id="LTCPrice" style="height:40px;margin:auto;position:absolute;top:-20;left:0;bottom:0;right:0" />

[minzie]

Interesting. It is behaving exactly as I expect, which is to not allow the request. Let me ask a question. I understand that bitcoinaverage will explicitly allow requests from anywhere, but I don't understand how that translates into the browser accepting that data. It seems to me that if it were the case that all one needed do to allow cross-site scripting is to have the other site set the origin flag. In my head, whet the server allows has nothing to do with what the browser allows.

Now I am going to have to revisit some docs, because your example goes counter to my understanding, and it doesn't work in any browser. I know a couple of different ways to circumvent this issue, but not like you did. So here is to me learning something new......

[9inety7even]

Interesting. It is behaving exactly as I expect, which is to not allow the request. Let me ask a question. I understand that bitcoinaverage will explicitly allow requests from anywhere, but I don't understand how that translates into the browser accepting that data. It seems to me that if it were the case that all one needed do to allow cross-site scripting is to have the other site set the origin flag. In my head, whet the server allows has nothing to do with what the browser allows.

Now I am going to have to revisit some docs, because your example goes counter to my understanding, and it doesn't work in any browser. I know a couple of different ways to circumvent this issue, but not like you did. So here is to me learning something new......

That's puzzling...you put my code into a plain html file and opened it in a browser? And it still throws an error? If that's the case, could you please post a screenshot of the error, along with information about your browser?

Anyway, as to your point about the origin flag, let me give an example. Say I put a bitcoin ticker on my site, similar to the one I gave above. That javascript has nothing to do with my server -- once it serves the page, my server is out of the picture. The browser then sees the request, but notices that the request is not going to the domain from which it was served (my server). This is in violation of same-origin policy[1], so the browser then knows it has to make a CORS[2] request. The browser then asks the server it's making the request to for its access-control-allow-origin header. That header will tell it whether or not such a request is allowed.

1: http://en.wikipedia.org/wiki/Same_origin_policy
2: http://en.wikipedia.org/wiki/Cross-origin_resource_sharing

[minzie]

So here is the interesting thing.... when I initially tested the code, I wrapped it in a jquery on-ready, and it didn't work in any browser. I redid the code without the on-ready, and now it works in Chrome and Firefox, but not IE (v 11.0.9600.16476). lol... strange. Using the following code, IE displays 'error, no transport'.

Code:

<!DOCTYPE html>
<html>
<head>
    <title></title>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>


</head>
<body>

<div id="BTCPrice" style="height:40px;margin:auto;position:absolute;top:-20;left:0;bottom:0;right:0" /></div>

<script>
        $.getJSON("https://api.bitcoinaverage.com/ticker/global/USD/", function(data){
            $("#BTCPrice").text(data["last"].toFixed(2));
        }).fail(function( dat, textStatus, error ) {
                    var err = textStatus + ", " + error;
                    alert(err);
        });
</script>

</body>
</html>

I cannot figure out why an on-ready should make a difference, or what about this code makes IE unhappy, but the code does indeed work on at least two browsers.

[9inety7even]

So here is the interesting thing.... when I initially tested the code, I wrapped it in a jquery on-ready, and it didn't work in any browser. I redid the code without the on-ready, and now it works in Chrome and Firefox, but not IE (v 11.0.9600.16476). lol... strange. Using the following code, IE displays 'error, no transport'.

Code:

<!DOCTYPE html>
<html>
<head>
    <title></title>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>


</head>
<body>

<div id="BTCPrice" style="height:40px;margin:auto;position:absolute;top:-20;left:0;bottom:0;right:0" /></div>

<script>
        $.getJSON("https://api.bitcoinaverage.com/ticker/global/USD/", function(data){
            $("#BTCPrice").text(data["last"].toFixed(2));
        }).fail(function( dat, textStatus, error ) {
                    var err = textStatus + ", " + error;
                    alert(err);
        });
</script>

</body>
</html>

I cannot figure out why an on-ready should make a difference, or what about this code makes IE unhappy, but the code does indeed work on at least two browsers.

Yeah, that's actually not surprising. CORS is still poorly supported in a lot of browsers (including IE), so it's actually probably best not to use it if possible. I did also encounter the on-ready thing when I wrote the code, and I'm still not sure why that breaks it. Good to know that you also had the same problems I did. Ultimately this is probably better:

Code:

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $.getJSON("http://whateverorigin.org/get?url=" + encodeURIComponent("https://api.bitcoinaverage.com/ticker/global/USD/") + "&callback=?", function(data){
            $("#BTCPrice").append("<center>BTC: $" + data['contents']['last'] + "</center>")
	})
    })
</script>
<div id="BTCPrice" style="height:40px;margin:auto;position:absolute;top:-20;left:0;bottom:0;right:0" />

[daybyter]

Is anyone here good with design, too? I want to create some exchange UI with jquery and HTML.

[minzie]

I do professional design and development, I would be happy to discuss your needs via PM if you wish. I have board references. Otherwise there seems to be plenty of people on the forum with the skills that you need. You might want to start your own thread though so your needs do not get buried in this thread.