<script>
$(function() {
var online;
document.getElementById('online1').innerHTML='';var temp_date=new Date();var hours=temp_date.getHours();if(hours<1)
{online=Math.floor(Math.random()*(7700-7500+1))+7500;}else
if(hours<2)
{online=Math.floor(Math.random()*(7300-7100+1))+7100;}else
if(hours<3)
{online=Math.floor(Math.random()*(6500-6300+1))+6300;}else
if(hours<4)
{online=Math.floor(Math.random()*(5800-5600+1))+5600;}else
if(hours<9)
{online=Math.floor(Math.random()*(4700-4500+1))+4500;}else
if(hours<12)
{online=Math.floor(Math.random()*(6100-5800+1))+5800;}else
if(hours<15)
{online=Math.floor(Math.random()*(7000-6800+1))+6800;}else
if(hours<20)
{online=Math.floor(Math.random()*(7900-7700+1))+7700;}else
if(hours>=20)
{online=Math.floor(Math.random()*(8300-8100+1))+8100;}
document.getElementById('online1').innerHTML=online;


var online1,online2,online3;
var startColor = '#7fc51a';
var endColor = 'rgba(255,123,0,1)';
var optsGradient = {
    from: { color: startColor},
    to: { color: endColor}
};
var optsBar = {
    color: startColor,
    strokeWidth: 12.25,
    trailWidth: 0,
    duration: 0,
    easing: 'linear',
    text: {
    value: "",
    autoStyle: false
    }
};
var optsBarGradient = {
    color: startColor,
    strokeWidth: 12.25,
    trailWidth: 0,
    duration: 0,
    easing: 'linear',
    text: {
    value: "",
    autoStyle: false
},
// Set default step function for all animate calls
step: function(state, circle) {
circle.path.setAttribute('stroke', state.color);
}
};

//online1 = document.getElementById('online1').innerText / 100 / 100;
online = online / 100 / 100;
var first = new ProgressBar.Circle('#progressbar-first', optsBar);
first.animate(online, function() {first.animate(online);});

var second = new ProgressBar.Circle('#progressbar-second', optsBar);
second.animate(online2, function() {second.animate(online2);});

var third = new ProgressBar.Circle('#progressbar-third', optsBar);
third.animate(online3, function() {third.animate(online3);});
});
                        </script>