{% extends "base.html" %}

{% block content %}
    <h1 id=header>Projects</h1>   
    <table class="table table-striped" id="projectsTable"></table>

    <script>
        reload(() => data_ajax('get_projects'), fillProjectsTable);
        
        $(function() {
            $('#projectsTable').DataTable({
                "paging":false,
                "saveState":true,
                "columns": [
                    {
                        "title":"Project",
                        "render": function(data, type, row) {
                            return '<a href=/project/'+ data + '>' + data + '</a>'
                        }
                    }
                ]
            });
        });
        
        function fillProjectsTable(response) {
            table = $('#projectsTable').DataTable()
            data = JSON.parse(response)
            if (data.status == 'ok') {
                table.clear()
                for (var project in data.projects) {
                    table.row.add([project]);
                }
                table.draw()
            }
        }
        
    </script>
{% endblock %}
