{% extends "base.html" %}
{% block title %}Ejecutando Tests{% endblock %}

{% block head %}
    {{ super() }}
    <script>
        var old_status = "";
        var cpis = [];
        var tests_for_selection = {};
        var skip_tests;

        function statusNode(test)
        {
            var status = test.status;
            switch (status)
            {
                case 'running':
                    return '<i class="fa fa-cog fa-spin"></i> corriendo';
                case 'passed':
                    var msg = "ok";
                    if (!_.isUndefined(test.cost))
                        msg = "$" + test.cost.toFixed(2);
                    if (!_.isUndefined(test.cpi))
                    {
                        msg = "ok (" + test.cpi.toFixed(2) + " CPI)";
                        cpis.push(test.cpi);
                    }
                    return '<i class="fa fa-check text-success"></i> ' + msg;
                case 'failed':
                    var msg = "falló";
                    if (!_.isUndefined(test.cost))
                        msg = "$" + test.cost.toFixed(2);
                    return '<i class="fa fa-times text-danger"></i> ' + msg;
                case 'not-run':
                    return '<i class="fa fa-minus text-muted"></i> omitido';
                case 'pending':
                    return '<i class="fa fa-ellipsis-h text-muted"></i> pendiente';
                default:
                    return status;
            }
        }

        function price(test) {
            if (test.hasOwnProperty('cost'))
                return test.cost;
            return '';
        }
        
        function updateTable()
        {
            $.getJSON("{{ url_for('status', sid=sid) }}", function(data) {
                var new_status = JSON.stringify(data);
                var update = true;
                if (JSON.stringify(data) == old_status)
                    update = false;
                old_status = new_status;
                if (update)
                    $("tr.test-row").remove();
                var pendingTests = 0;
                cpis = [];
                $.each(data.tests, function(key, test) {
                    var n = key + 1;
                    if (test.status == 'pending' || test.status == 'running')
                        pendingTests += 1;
                    if (update)
                    {
                        var row = $('<tr class="test-row">' +
                            '<td>' + n + '</td>' +
                            '<td>' + test.name + '</td>' +
                            '<td>' + statusNode(test) + '</td>' +
                            '<td><a href="{{ url_for('details',sid=sid) }}&file=' + 
                                    encodeURIComponent(test.details) + '">Detalles</a></td>' +
                          '</tr>');
                        if (test.status == 'running')
                            row.addClass('warning');
                        row.appendTo('#tests-table');
                        if (!(n in tests_for_selection))
                        {
                            var selectrow = $('<input type="checkbox" class="test-checkbox" data-value="'
                                           + n + '"><span>' + n + ' - ' + test.name + '</span></input>');
                            if (_.contains(skip_tests, n))
                            {
                                selectrow.prop('checked', false);
                            }
                            else
                            {
                                selectrow.prop('checked', true);
                            }
                            if (!test.skippable)
                                selectrow.attr({'disabled':'disabled'});
                            var p = $('<p></p>');
                            selectrow.appendTo(p);
                            selectrow.change(_.throttle(saveSkipTests, 100));
                            p.appendTo('#selected-tests');
                            tests_for_selection[n] = true;
                        }
                    }
                });
                if (pendingTests > 0)
                    setTimeout(updateTable,1000);
                if (cpis.length > 0)
                {
                    var sum = _.reduce(cpis, function(a,b) { return a + b }, 0);
                    $("span.cpi").text((sum / cpis.length).toFixed(2));
                }
            });
        }
        
        function loadSkipTests()
        {
            var s = docCookies.getItem('skip_tests');
            if (s)
                skip_tests = _.map(s.split(','), function(x) { return Number.parseInt(x); });
        }
        
        function saveSkipTests()
        {
            var s = _.map($("#tests-selection-modal input:not(:checked):not([disabled])"), 
                      function(item) { return $(item).attr('data-value'); })
                      .join();
            console.log('new cookie value:',s);
            docCookies.setItem('skip_tests',s);
        }

        $(function() {
            loadSkipTests();
            
            updateTable();
            
            $("#tests-selection-modal #select-all").click(function() {
               var m = $("#tests-selection-modal");
               m.find("input:not([disabled])").prop('checked', true).change(); 
            });
            
            $("#tests-selection-modal #deselect-all").click(function() {
               var m = $("#tests-selection-modal");
               m.find("input:not([disabled])").prop('checked', false).change(); 
            });
        });
    </script>
{% endblock %}

{% block content %}
    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
        <div class="container" style="max-width: 940px;">
        <div class="navbar-brand">Ejecutando Tests</div>

        <ul class="nav navbar-nav navbar-right">
            <li><p class="navbar-text">CPI promedio: <span class="cpi">-</span></p></li>
        </ul>
        </div>
    </nav>

    <div class="modal" id="tests-selection-modal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header"><h4>Seleccione los tests que desea ejecutar</h4></div>
                <div class="modal-body">
                    <p class="text-right">
                        <button type="button" class="btn btn-link btn-xs" id="deselect-all">Desmarcar todos</button> - 
                        <button type="button" class="btn btn-link btn-xs" id="select-all">Marcar todos</button>
                    </p>
                    <div id="selected-tests">                        
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" id="close" class="btn btn-primary" data-dismiss="modal">Cerrar</button>
                </div>
            </div>
        </div>
    </div>

    <p>
      <table id="tests-table" class="table">
        <tr>
            <th class="tests-table-header" style="border-top: 0px" width="5%">No.</th>
            <th class="tests-table-header" style="border-top: 0px" width="65%">Test</th>
            <th class="tests-table-header" style="border-top: 0px" width="20%">Resultado</th>
            <th class="tests-table-header" style="border-top: 0px" width="10%">Detalles</th>
        </tr>
      </table>
    </p>
    
    <p>
        <a href="{{ url_for('index') }}">Subir otro circuito</a> &nbsp;-&nbsp; 
        <a href="#" data-toggle="modal" data-target="#tests-selection-modal">Seleccionar tests</a>
    </p>
{% endblock %}