1

/* http://fgnass.github.com/spin.js/ */

     2

$.fn.spin = function(opts) {

     3

  this.each(function() {

     4

    var $this = $(this),

     5

        data = $this.data();

     6

     7

    if (data.spinner) {

     8

      data.spinner.stop();

     9

      delete data.spinner;

    10

    }

    11

    if (opts !== false) {

    12

      data.spinner = new Spinner($.extend({color: $this.css('color')}, opts)).spin(this);

    13

    }

    14

  });

    15

  return this;

    16

};

    17

    18

$.fn.disable = function (disable) {

    19

    if (disable)

    20

        this.attr('disabled', 'disabled');

    21

    else

    22

        this.removeAttr('disabled');

    23

    24

    return this;

    25

};

    26

    27

var Timer = function (interval, cb) {

    28

    var handle = null;

    29

    30

    this.enable = function () {

    31

        if (handle) return;

    32

    33

        handle = window.setInterval(cb, interval);

    34

    };

    35

    36

    this.disable = function () {

    37

        if (!handle) return;

    38

    39

        window.clearInterval(handle);

    40

        handle = null;

    41

    };

    42

    43

    return this;

    44

};

    45

    46

function html (tag, params, html) {

    47

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

    48

};

    49

    50

function hosts_realtime (params) {

    51

    var t = params.t;

    52

    var refreshTimer = Timer(2 * 1000, refresh);

    53

    var animate = false; // true;

    54

    55

    function render_host (host) {

    56

        var columns = [

    57

            html("td", {}, 

    58

                html("a", { href: params.host.replace('0', host.id) }, "#" )

    59

            ),

    60

        ];

    61

    62

        $.each(params.columns, function (i, name) {

    63

            column = html("td", { class: name }, host[name]);

    64

    65

            if (name == 'state')

    66

                column.addClass(host['state_class']);

    67

    68

            columns.push(column);

    69

        });

    70

    71

        return html("tr", {id: host.id}, columns);

    72

    }

    73

    74

    function refresh () {

    75

        console.log("refresh: " + t);

    76

    77

        var refresh = $('#refresh').disable(true);

    78

        var spinner = $('#wrapper').spin();

    79

    80

        var url = params.url;

    81

        var query = $.param($.extend(params.filters, {t: t }), true);   // using traditional encoding for multi-values

    82

    83

        $.getJSON(url, query, function (data) {

    84

            var t1 = data.t;

    85

            var hosts = data.hosts;

    86

    87

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

    88

    89

            $.each(hosts, function (i, host) {

    90

                var item = $('#' + host.id);

    91

    92

                if (item.length) {

    93

                    if (animate) item.slideUp();

    94

                } else {

    95

                    item = render_host(host)

    96

    97

                    if (animate) item.hide();

    98

                }

    99

   100

                // move to top

   101

                item.prependTo($('#hosts tbody'));

   102

   103

                if (animate)

   104

                    item.slideDown();

   105

                else

   106

                    item.effect("highlight", {}, 'slow');

   107

            });

   108

   109

            // update

   110

            t = t1;

   111

        }).error(function () {

   112

            alert("Error :("); 

   113

   114

            // disable auto-refresh

   115

            refreshTimer.disable();

   116

   117

        }).complete(function () {

   118

            spinner.spin(false);

   119

            refresh.disable(false);

   120

        });

   121

    }

   122

   123

    return function () {

   124

        // init

   125

        if (animate)

   126

            $("#hosts").css('display', 'block');

   127

   128

        $("#refresh").click(function () {

   129

            // in case diabled on error

   130

            refreshTimer.enable();

   131

            refresh();

   132

        });

   133

   134

        // start auto-refresh

   135

        refreshTimer.enable();

   136

    }

   137

}