{% extends "base/consent.html" %}
{% include "macros/browser-detect.html" %}

{% block stylesheets %}
    {{ super() }}
    {% include "theme.html" %}
    <style>
        #consent {
            float: none;
        }
    </style>
{% endblock %}

{% block body %}
    <div class="container d-flex align-items-center justify-content-center" style="height: 100%">
        <div>
        <div class="row overflow-hidden mb-3">
            <img id="adlogo" src="/static/images/logo.svg" alt="PsyNet logo" style="width: 150px; float: left;">
        </div>
        <div class="row">
            <div class="text-center">
                <h3 class="mb-3">
                    {{ pgettext("concent", "To proceed, click the button below.") }}
                </h3>
                <button
                        type="button"
                        class="btn btn-primary btn-lg"
                        id="consent"
                        onClick="start();">
                    {{ gettext("Next") }}
                </button>
            </div>
            </p>
        </div>
        </div>
    </div>
    </div>
{% endblock %}

{% block scripts %}
    {{ super() }}
    <script>
        document.addEventListener("DOMContentLoaded", function (event) {
            browser.validate();
        });

        start = function() {
            {% if config.show_abort_button and experiment.start_experiment_in_popup_window %}
            if (window.opener !== null) {
                window.opener.enableAbortButton();
            }
            {% endif %}
            window.location='/start?{{query_string|safe}}';
        }
    </script>
{% endblock %}
