$(document).ready(function() {
    // button handlers (runs once)
    function define_buttons_handlers() {
        $("#allow_all").click(
            function() {
                $(":checkbox").prop("checked", true).trigger('change');
            }
        );
        $("#deny_all").click(
            function() {
                $(":checkbox").prop("checked", false).trigger('change');
            }
        );
        $("#reset_password").click(
            function () {
                var number = $("#reset_number").val();
                $.ajax({
                    type: "POST",
                    url: "/adminwebservice",
                    data: {"cmd": "reset", "name": number}
                });
            }
        );
        $("#inserir_novo_aluno").click(
            function () {
                $.ajax({
                    type: "POST",
                    url: "/adminwebservice",
                    data: {
                        "cmd": "insert",
                        "number": $("#novo_numero").val(),
                        "name": $("#novo_nome").val()
                    }
                });
            }
        );
    }

    // ----------------------------------------------------------------------
    // checkbox handler to allow/deny students individually
    function autorizeStudent(e) {
        $.ajax({
            type: "POST",
            url: "/adminwebservice",
            data: {"cmd": "allow", "name": this.name, "value": this.checked}
        });
        if (this.checked)
            $(this).parent().parent().addClass("active");
        else
            $(this).parent().parent().removeClass("active");
    }

    // ----------------------------------------------------------------------
    function populateOnlineTable(students) {
        var rows = "";
        // make list of online students
        var active = [];
        $.each(students, function(i, r) {
            if (r['start_time'] != '') {
                active.push([r['uid'], r['name'], r['start_time'], r['ip_address'], r['user_agent'], r['focus']]);
            }
        });
        // sort by start time
        active.sort(function(a,b){return a[2] < b[2] ? -1 : (a[2] == b[2] ? 0 : 1);});
        n = active.length;
        for(var i = 0; i < n; i++) {
            rows += '<tr' + (active[i][5]? '' : ' class="danger"') + '>\
            <td>' + active[i][0] + '</td>\
            <td>' + active[i][1] + '</td>\
            <td>' + active[i][2].slice(11,19) + '</td>\
            <td><div data-toggle="tooltip" data-placement="top" title="'+active[i][4]+'">' + active[i][3] + '</div></td>\
            <td>' + (active[i][5]? '' : '<span class="label label-danger">unfocus</span>') + '</td>\
            </tr>';
        }
        $("#online_students").html(rows);
        $("#online-header").html(n + " Activo(s)");

    }

    // ----------------------------------------------------------------------
    function generate_grade_bar(grade) {
        var barcolor;
        if (grade < 10) {
            barcolor = 'progress-bar-danger';
        }
        else if (grade < 15) {
            barcolor = 'progress-bar-warning';
        }
        else {
            barcolor = 'progress-bar-success';
        }

        var bar = '<div class="progress"><div class="progress-bar ' + barcolor + '" role="progressbar" aria-valuenow="' + grade + '" aria-valuemin="0" aria-valuemax="20" style="min-width: 2em; width: ' + (5*grade) + '%;">' + grade + '</div></div>';
        return bar
    }

    // ----------------------------------------------------------------------
    function populateStudentsTable(students) {
        var n = students.length;
        $("#students-header").html(n + " Inscritos")
        var rows = "";
        $.each(students, function(i, d) {
            var uid = d['uid'];

            if (d['start_time'] != '')  // test
                rows += '<tr id="' + uid + '" + class="success">';
            else if (d['online'])       // online
                rows += '<tr id="' + uid + '" + class="warning">';
            else if (d['allowed'])      // allowed
                rows += '<tr id="' + uid + '" + class="active">';
            else                        // offline
                rows += '<tr id="' + uid + '" + class="">';

            rows += '\
                <td><input type="checkbox" name="' + uid + '" value="true"' + (d['allowed'] ? 'checked' : '') + '>' +
                    (d['start_time']=='' ? '' : ' <span class="label label-success">teste</span>') +
                    // (d['online'] ? '<span class="label label-warning">online</span>' : '') +
                '</td>\
                <td>' + uid + '</td>\
                <td>' + d['name'] + (d['password_defined'] ? ' <span class="label label-default">pw</span>' : '') +'</td>\
                <td>';
            var g = d['grades'];
            var glength = g.length;
            for (var i=0; i < glength; i++) {
                rows += '<div data-toggle="tooltip" data-placement="top" title="' + g[i][1].slice(0,19) + '"><a href="review?test_id=' + g[i][2] + '">' + generate_grade_bar(g[i][0]) + '</a></div>';
            }
            rows += '</td></tr>';
        });
        $("#students").html(rows);
        $('[data-toggle="tooltip"]').tooltip();
    }

    // ----------------------------------------------------------------------
    function populate() {
        $.ajax({
            url: "/adminwebservice",
            dataType: "json",
            success: function(data) {
                // show clock on upper left corner
                var t = new Date();
                $('#currenttime').html(t.getHours() + (t.getMinutes() < 10 ? ':0' : ':') + t.getMinutes());

                // fill jumbotron data
                $("#title").html(data['test']['title']);
                $("#ref").html(data['test']['ref']);
                $("#filename").html(data['test']['filename']);
                $("#database").html(data['test']['database']);
                $("#answers_dir").html(data['test']['answers_dir']);

                // fill online and student tables
                populateOnlineTable(data["students"]);
                populateStudentsTable(data["students"])

                // add event handlers
                $('input[type="checkbox"]').change(autorizeStudent);
            },
            error: function() {alert("Servidor não responde.");}
        });
    }

    populate();                    // run once when the page is loaded
    define_buttons_handlers();
    setInterval(populate, 5000);   // poll server on 5s interval
});