javascriptjqueryhtmlodometer

YouTube Subscribe Counter


I making my own real time youtube subscriber counter but refresh time is to high and when I change refresh time it not happening. Can someone tell me what I am doing wrong?

<html>
<head>
    <link rel="stylesheet" href="odometer-theme-default.css"/>
    <script src="odometer.js"></script>
    <script type="text/javascript" src="jquery-3.1.1.min.js"></script>
    <style>
        .odometer {
        font-size:100px;
        }
        #ytName {
        font-size: 52px;
        font-family:Arial;
        }
    </style>
</head>
<script type="text/javascript">
 $(document).ready( function() {

     var chanName = "";

     loadChannel("UCPKqr9qSEXi6r03B18wRj6g");

     function loadChannel(name) {

        chanName = name;
        var url = 'https://www.googleapis.com/youtube/v3/channels?part=statistics&id='+name+'&key=AIzaSyBPIHea9sWYMSxe8W-tIn7OUvIw-dagDDI';
        $.getJSON(url, function(data) {
            $("#odometer").html(data.items[0].statistics.subscriberCount);
        });

        var url1 = 'https://www.googleapis.com/youtube/v3/channels?part=snippet&id='+chanName+'&key=AIzaSyBPIHea9sWYMSxe8W-tIn7OUvIw-dagDDI';
        $.getJSON(url1, function(data) {
            $('#ytName').html(data.items[0].snippet.title);
            $('#ytLink').html('<a href="http://youtube.com/' + data.items[0].snippet.customUrl + '\">Link</a>');
        });
    }

    setInterval( function() {

        var url = 'https://www.googleapis.com/youtube/v3/channels?part=statistics&id='+chanName+'&key=AIzaSyBPIHea9sWYMSxe8W-tIn7OUvIw-dagDDI';
        $.getJSON(url, function(data) {
            $("#odometer").html(data.items[0].statistics.subscriberCount);
        }, 1000);

    });
});
</script>
<body background = "bg.jpg">
    <center>
        <div id="ytName"></div>
        <div id="ytLink"></div>
        <div id="odometer" class="odometer"></div>
    </center>
</body>

Maybe javascript should be written differently?


Solution

  • if you write the new time in milliseconds, the response is a bit

    setInterval( function() {
    
       // update code is here
    }, 1000)