$(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}
                });
            }
        );
        $("#novo_aluno").click(
            function () {
                alert('Não implementado!');
            }
        );
    }

    // 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 active = [];
        var rows = "";
        $.each(students, function(i, r) {
            if (r[1]['start_time'] != '') {
                active.push([r[0], r[1]['name'], r[1]['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><td>" + active[i][0] + "</td><td>" + active[i][1] + "</td><td>" + active[i][2].slice(0,10) + "</td><td>" + active[i][2].slice(11,19) + "</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) {
        $("#students-header").html(students.length + " Alunos")
        var rows = "";
        students.sort(function(a,b){return a[0] - b[0]});
        $.each(students, function(i, r) {
            var uid = r[0];
            var d = r[1];    // dictionary

            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' : '') + '></td>\
                <td>' + uid + '</td>\
                <td>' + d['name'] + '</td>\
                <td>' +
                    (d['password_defined'] ? '<span class="label label-default">pw</span>' : '') +
                    // (d['online'] ? '<span class="label label-warning">online</span>' : '') +
                    (d['start_time']==''?'':'<span class="label label-success">teste</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) + '">' + generate_grade_bar(g[i][0]) + '</div>';
            }
            rows += '</td></tr>';
        });
        $("#students").html(rows);
        $('[data-toggle="tooltip"]').tooltip();
    }

    function populate() {
        $.ajax({
            url: "/adminwebservice",
            dataType: "json",
            success: function(data) {
                var t = new Date();
                $('#currenttime').html(t.getHours() + (t.getMinutes() < 10 ? ':0' : ':') + t.getMinutes());
                $("#title").html(data['test']['title']);
                $("#ref").html(data['test']['ref']);
                $("#database").html(data['test']['database']);
                if (data['test']['save_answers']) {
                    $("#answers_dir").html(data['test']['answers_dir']);
                }
                else {
                    $("#answers_dir").html('--- not being saved ---');
                }
                $("#filename").html(data['test']['filename']);

                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
});