<div class="box-header">
    <h2>
        <i class="icons-book-2"></i>
        <span class="break"></span>
        <%= t(:server_usage) %>
    </h2>
</div>
<div class="box-content" style='overflow: hidden; text-align:center;'>
    <div id="cpu_usage" class="pull-left" style="width:200px; height:160px; display: inline-block;"></div>
    <div id="mem_usage" style="width:200px; height:160px; display: inline-block;"></div>
    <div id="disk_usage" class="pull-right" style="width:200px; height:160px; display: inline-block;"></div>
</div>
<script type="text/javascript">
var Gages = { 'CPU':{
                          'JustGage': null,
                          'container': 'cpu_usage',
                          'title': 'CPU Usage',
                          'fn': 'get_cpu_usage',
                          'update_interval': 2000
                        },
                        'Mem':{
                          'JustGage': null,
                          'container': 'mem_usage',
                          'title': 'Memory Usage',
                          'fn': 'get_mem_usage',
                          'update_interval': 10000
                        },
                        'Disk':{
                          'JustGage': null,
                          'container': 'disk_usage',
                          'title': 'Disk Usage',
                          'fn': 'get_disk_usage',
                          'update_interval': 30000
                        }
                      };

$(function () {
    $.each(Gages,function(id,Gage){
      Gage['JustGage'] = new JustGage({
          id: Gage['container'], 
          value: 0, 
          min: 0,
          max: 100,
          title: Gage['title'],
          shadowVerticalOffset: 10,
          levelColors: ['#39D824','#FFC33F','#F51F1F'],
          titleFontColor: '#666',
          valueFontColor: '#666',
          labelFontColor: '#666',
          label: '%',
          refreshAnimationTime: 800
      });

       update_usage(Gage);
    });
});

function update_usage(Gage){
  $.get('/admin/dashboards/'+Gage['fn'],function(usage){
    Gage['JustGage'].refresh(parseInt(usage));
    setTimeout(function(){update_usage(Gage);},Gage['update_interval']);
  });
}

</script>