{% extends "timeline-page.html" %}

{% block stylesheets %}
    <link rel="stylesheet" href="/static/css/consent.css"/>
{% endblock %}

{% block main_body %}
    <div class="main-div" style="padding-bottom: 100px;">
        <h1>{{ pgettext("consent-title", "Research Participant Consent Form for Image/Sound Recordings") }}</h1>
        <hr>
        <div class="text-justify">
            <div class="text-left" style="font-size:18px">
                <h2>{{ pgettext("consent", "Title of study:") }} {{ experiment_title }}</h2>
                <p>
                    {{ pgettext("consent-audiovisual", "I have received oral and written information about the fact that <i>audiovisual</i> recordings will be made in this study.") }}
                </p>
                <p>
                    {{ pgettext("consent-audiovisual", "The recording serves the purpose of understanding how humans perceive and process information from sound and visual.") }}
                    {{ pgettext("consent-audiovisual", "For example, we would like to understand how predictive mechanisms in perception rely on experience, learning, and memory.") }}
                    {{ pgettext("consent-audiovisual", "By making recording people while moving, singing, tapping to rhythms, or speaking, we can infer the mechanisms of the auditory and visual systems.") }}
                </p>
                <p>
                    {{ pgettext("consent-audiovisual", "I have been informed that the storage and processing of the <i>audiovisual</i> recording will be carried out in pseudonymized form, i.e., using a number and without containing my name, and that there is a coding list that links my name to the number.") }}
                    {{ pgettext("consent-audiovisual", "The investigators are the only persons who have access to this coding list, which will be destroyed after completion of the research project.") }}
                    {{ pgettext("consent-audiovisual", "Researchers associated with this project will have access to my <i>audiovisual</i> data during the recording and the analysis of the material.") }}
                </p>
                <p>
                    {{ pgettext("consent", "I understand that I am free to withdraw my consent to the collection and storage of my personal data without negative consequences.") }}
                </p>
                <p>
                    {{ pgettext("consent-audiovisual", "I agree to the handling of the recordings as described above.") }}
                </p>

                <p>
                    <span style="font-weight: bold;">{{ pgettext("consent", "Addendum for demonstrations") }}</span> {{ pgettext("consent", "I agree that my <i>audiovisual</i> recordings can be used for demonstration purposes in presentations with a limited number of participants (e.g., teaching courses or scientific presentations).") }}
                </p>
                <p>
                    {{ pgettext("consent", "(Please tick where applicable)") }}
                    <label style="margin-left: 35px; cursor: pointer;">
                        <input
                                type="checkbox"
                                id="demonstration-purposes-consent-yes"
                                class="demonstration-purposes-consent"
                                style="cursor: pointer;"/>
                        <span>{{ pgettext("consent", "YES") }}</span>
                    </label>
                    <label style="margin-left: 25px; cursor: pointer;">
                        <input
                                type="checkbox"
                                class="demonstration-purposes-consent"
                                style="cursor: pointer;"/>
                        <span>{{ pgettext("consent", "NO") }}</span>
                    </label>
                </p>

                <p>
                    {{ pgettext("consent-audiovisual", "The declaration of consent for <i>audiovisual</i> recordings is voluntary.") }}
                    {{ pgettext("consent-audiovisual", "I may withdraw my consent at any time.") }}
                    {{ pgettext("consent-audiovisual", "In case of refusal or withdrawal, no costs will be incurred nor will there be other negative consequences; however, in this case, participation in the study will not be possible.") }}
                </p>

                <p>
                    {{ pgettext("consent-audiovisual", "I had sufficient time for this decision.") }}
                    {{ pgettext("consent-audiovisual", "I have read and understood everything and hereby agree that <i>audiovisual</i> recordings of me may be taken.") }}
                    {{ pgettext("consent-audiovisual", "I have received a copy of this consent form.") }}
                </p>

                <h4>{{ pgettext("consent", "Investigator") }}</h4>
                <p>
                    Harin Lee,
                    Max Planck Institut for Empirical Aesthetics,
                    Grüneburgweg 14,
                    60322 Frankfurt am Main,
                    harin.lee@ae.mpg.de
                </p>
                {{ consent.pi(config) }}
                {{ consent.consent(config) }}
            </div>
            {{ consent.fixed_buttons(config) }}
            <script>
                psynet.response.staged.metadata = {};
                psynet.response.staged.metadata["demonstration_purposes_consent"] = false;

                function setDemonstrationPurposesConsent() {
                    psynet.response.staged.metadata["demonstration_purposes_consent"] = $('#demonstration-purposes-consent-yes').is(':checked');
                }

                $('.demonstration-purposes-consent').click(function () {
                    $('.demonstration-purposes-consent').prop('checked', false);
                    $(this).prop('checked', true);
                    setDemonstrationPurposesConsent();
                });
            </script>
        </div>
    </div>
{% endblock %}
