{% extends 'base.htm' %}
{% block title %}Query • estus{% endblock %}
{% block extrahead %}
    <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha256-/SIrNqv8h6QGKDuNoLGA4iret+kyesCkHGzVUUV0shc=" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
{% endblock %}
{% block content %}
    <form action="/query" method="post">
        <div class="form-group">
            <div class="input-group">
                <span class="input-group-addon">SELECT</span>
                <input type="text" class="form-control" placeholder="* FROM enti" name="query" {% if query %}value="{{ query }}{% endif %}">
                <span class="input-group-addon">;</span>
            </div>
        </div>
        <div class="form-group">
            <p>
                <input class="btn btn-primary" type="submit">
                <button class="btn btn-info" type="button" data-toggle="collapse" data-target="#database-structure">
                    Visualizza struttura database (SQLite)
                </button>
            </p>
        </div>
    </form>
    <div id="database-structure" class="collapse">
        <img src="{{ url_for('static', filename='dbtree.png') }}">
    </div>
    {% if result %}
        <div class="panel panel-success">
            <div class="panel-heading">
                Risultati della query
            </div>
            <div class="panel-body">
                <table class="table table-hover">
                    <thead>
                        <tr>
                            {% for row in result.keys() %}
                                <th>
                                    {{ row }}
                                </th>
                            {% endfor %}
                        </tr>
                    </thead>
                    <tbody>
                        {% for row in result %}
                            <tr>
                                {% for column in row %}
                                    <td>
                                        {% if column is string %}
                                            <code class="string">{{ column }}</code>
                                        {% elif column is number %}
                                            <code class="number">{{ column }}</code>
                                        {% else %}
                                            <code class="bytes">{{ column }}</code>
                                        {% endif %}
                                    </td>
                                {% endfor %}
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    {% elif error %}
        <div class="panel panel-danger">
            <div class="panel-heading">
                Errore nell'esecuzione della query
            </div>
            <div class="panel-body">
                {{ error }}
            </div>
        </div>
    {% endif %}
{% endblock %}