var gauges = [];
$(function(){
    initialize(); // init Gauges 
});

function initialize()
{
    createGauges();
    setInterval(updateGauges, 5000);
}

function createGauges()
{
    $("[id*='Gauge']").each(function (index, element) {
        createGauge(element.id);
    });
}

function createGauge(name)
{    
    var config =
    {
        size: $('#' +name).data("size"),
        label: $('#' +name).data("label"),
        min: undefined != $('#' +name).data("min") ? $('#' +name).data("min") : 0,
        max: undefined != $('#' +name).data("max") ? $('#' +name).data("max") : 100,
        minorTicks: $('#' +name).data("minorticks"),
        greenZones: $('#' +name).data("greenzones"),
        yellowZones: $('#' +name).data("yellowzones"),
        redZones: $('#' +name).data("redzones"),
        valueSuffix: $('#' +name).data("valuesuffix")
    };
    
    gauges[name] = new Gauge(name, config);
    gauges[name].render();
    updateGauges();
}

function updateGauges()
{
    var url = $("[id*='Gauge']:first-child").data("update-url");
    if (typeof url === "undefined") {
        return false;
    }
    
    $.ajax({
        url:url,
        type:"GET",
        dataType: "JSON",
        success:function (data)
        {
            for (var name in gauges)
            {
                gauges[name].redraw(data[name]);
            }
        },
    });
}