<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Berichten</title>
    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}"/>
</head>
<body>
    {% include 'navbar_template.html' %}
    {% include 'flash_template.html' %}
    <h1>List of berichten</h1>
    <p>Er zijn momenteel {{ berichtcount }} berichten in het systeem</p>
    <table style="width:100%">
        <tr>
            <th>Bericht ID</th>
            <th>Naam</th>
            <th>Bericht inhoud</th>
            <th>Geplaatst in</th>
            <th>Ontvangen op</th>
            <th>Status bericht</th>
            <th>Moderator</th>
            <th>Gekeurd op</th>
            <th>Twitter ID</th>
        </tr>
        {% for row in berichten %}
        <tr>
            <th><a href="/bericht/{{ row[0] }}">{{ row[0] }}</a></th>
            <th>{{ row[3] }}</th>
            <th>{{ row[1] }}</th>
            <th>{{ row[5] }}</th>
            <th>{{ row[2] }}</th>
            <th>{{ row[7] }}</th>
            <th>{{ row[6] }}</th>
            <th>{{ row[4] }}</th>
            <th>{{ row[8] }}</th>
        </tr>
        {% endfor %}
    </table>

    <form>
        <label for="maxitems">Max items in table:</label>
        <select name="maxitems" id="maxitems">
            <option value="10">10</option>
            <option value="20">20</option>
            <option value="50">50</option>
            <option value="100">100</option>
        </select>
        <label for="pagenum">Table page:</label>
        <select name="pagenum" id="pagenum">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
        </select>
        <button type="submit">Refresh table</button>
    </form>

</body>
</html>