{% include "header.html" %}
        <section id="scrapingFormContainer" class="container-fluid d-flex justify-content-center">
            <div class="container-md my-5 mx-2 shadow-lg p-4 ">
                <h2>Config</h2>
                <form id="scrapingForm" method="POST" action="{{ url_for('start_scraping') }}">
                    {{ form.hidden_tag() }}
                    <div class="form-group">
                        {{ form.faction_id.label(class="form-control-label") }}
                        {{ form.faction_id(class="form-control") }}
                    </div>
                    <div class="form-group">
                        {{ form.fetch_interval.label(class="form-control-label") }}
                        {{ form.fetch_interval(class="form-control") }}
                    </div>
                    <div class="form-group">
                        {{ form.run_interval.label(class="form-control-label") }}
                        {{ form.run_interval(class="form-control") }}
                    </div>
                    <div class="form-group">
                        {{ form.submit(class="btn btn-primary", type="submit", id="startButton") }}
                    </div>
                </form>
                <button id="stopButton" class="btn btn-primary">Stop Scraping</button>
            </div>
        </section>
        <section id="resultsContainer" class="container-fluid d-flex justify-content-center">
            <div class="container-md my-5 mx-2 shadow-lg p-4" style="height: 500px;">
                <div class="row">
                    <div class="col-7">
                        <h2>Logs</h2>
                        <pre id="logs" class="pre-scrollable" style="height: 350px; overflow:scroll; "><code></code></pre>
                        <div class="btn-group btn-group-sm">
                            <button class="btn btn-primary" id="prevPage">Previous</button>
                            <button class="btn btn-primary" id="pageInfo" disabled>Page 1 of 1</button>
                            <button class="btn btn-primary" id="nextPage">Next</button>
                        </div>
                    </div>
                    <div class="col">
                        <h2>Stats</h2>
                    </div>
                </div>
            </div>
        </section>
    {% block scripts %}
        {{ bootstrap.load_js() }}
        <link rel="stylesheet" href="{{ url_for('.static', filename='style.css') }}">
        <script src="{{url_for('.static', filename='app.js')}}"></script>
    {% endblock %}
    {% include "footer.html" %}