/* http://fgnass.github.com/spin.js/ */
$.fn.spin = function(opts) {
  this.each(function() {
    var $this = $(this),
        data = $this.data();

    if (data.spinner) {
      data.spinner.stop();
      delete data.spinner;
    }
    if (opts !== false) {
      data.spinner = new Spinner($.extend({color: $this.css('color')}, opts)).spin(this);
    }
  });
  return this;
};

$.fn.disable = function (disable) {
    if (disable)
        this.attr('disabled', 'disabled');
    else
        this.removeAttr('disabled');

    return this;
};

var Timer = function (interval, cb) {
    var handle = null;

    this.enable = function () {
        if (handle) return;

        handle = window.setInterval(cb, interval);
    };

    this.disable = function () {
        if (!handle) return;

        window.clearInterval(handle);
        handle = null;
    };

    return this;
};

function html (tag, params, html) {
    return $("<" + tag + " />", $.extend({html: html}, params));
};

function hosts_realtime (params) {
    var t = params.t;
    var refreshTimer = Timer(2 * 1000, refresh);
    var animate = false; // true;

    function render_host (host) {
        return html("tr", {id: host.id}, [
            html("td", {}, 
                html("a", { href: params.host.replace('0', host.id) }, "#" )
            ),
            html("td", {}, host.ip),
            html("td", {}, host.mac),
            html("td", {}, host.name),
            html("td", {}, host.gw),
            html("td", {}, host.seen),
            html("td", { 'class': host.state_class }, host.state),
        ]);
    }

    function refresh () {
        console.log("refresh: " + t);
        
        var refresh = $('#refresh').disable(true);
        var spinner = $('#wrapper').spin();

        $.getJSON(params.url, { t: t }, function (data) {
            var t1 = data.t;
            var hosts = data.hosts;

            console.log("refresh: " + t + " -> " + t1 + ": " + hosts.length);

            $.each(hosts, function (i, host) {
                var item = $('#' + host.id);

                if (item.length) {
                    if (animate) item.slideUp();
                } else {
                    item = render_host(host)

                    if (animate) item.hide();
                }
                
                // move to top
                item.prependTo($('#hosts tbody'));

                if (animate)
                    item.slideDown();
            });
            
            // update
            t = t1;
        }).error(function () {
            alert("Error :("); 

            // disable auto-refresh
            refreshTimer.disable();

        }).complete(function () {
            spinner.spin(false);
            refresh.disable(false);
        });
    }

    return function () {
        // init
        if (animate)
            $("#hosts").css('display', 'block');

        $("#refresh").click(function () {
            // in case diabled on error
            refreshTimer.enable();
            refresh();
        });
        
        // start auto-refresh
        refreshTimer.enable();
    }
}