{% include '_head.html' -%}

<!-- Begin page content -->
<main class="container">
    <div class="container">
        <h1 class="mt-5">Add a shortcode</h1>
    </div>
    <br />
    <form action="/_/add" method="post">
        {{ form.url.label }} {{ form.url }}<br />
        {{ form.length.label }} {{ form.length }}<br />
        {{ form.fixed_views.label }} {{ form.fixed_views }} (-1 for unlimited)<br />
        {{ form.expiry.label}} {{ form.expiry(class='datepicker') }} (leave as default for unlimited)<br />

        <button id="submit" class="btn btn-primary" type="submit" onclick="waiting();" style="margin: 1em 0;">
            Create shortcode
            <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
        </button>
    </form>

    <div id="content">
        {% if shortcode -%}
        <table class="table table-striped table-sm">
            <thead>
                <tr>
                    <th scope="col">Short URL</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td><a href="{{request.host_url}}{{ shortcode }}">{{request.host_url}}{{ shortcode }}</a></td>
                </tr>
            </tbody>
        </table>
        {% endif -%}
    </div>
</main>

{% include '_tail.html' -%}