{{ block title }}
Herzlichen Dank für die Teilnahme am Experiment
{{ endblock }}

{{ block content }}

<p>Um die Aufwandsentschädigung in Höhe von 5 € zu überweisen, benötigen wir Ihre Auszahlungsinformationen.
    </p><p>Diese Auszahlungsinformationen werden nicht veröffentlicht.
    </p><p>Die bevorzugte Zahlungsmethode ist PayPal.

{{ formfield player.paypal label="Haben Sie Paypal?" }}

<div id="name-address-info" style="display: none;">
    <p style="margin-bottom: 0em;" id="paypal-info"></p>
    {{ formfield player.address label="" }}
    {{ formfield player.name label="Vorname und Name" }}
</div>

<br>
<p>Wenn Sie auf "Weiter" klicken, ist das Experiment beendet, und Ihre Angaben sind abgeschlossen.</p>
<br><br>

{{ next_button }}

<style>
    p {
        text-align: justify;
        margin-bottom: 2em;
        hyphens: auto;
    }
    br {
        display: block;
        margin: 1em 0;
    }
</style>

<script>
    document.addEventListener('DOMContentLoaded', function() {
    const paypalElement = document.getElementById('id_paypal');
    const nameAddressInfoElement = document.getElementById('name-address-info');
    const paypalInfoElement = document.getElementById('paypal-info');

    function showNameAddressInfo() {
        if (paypalElement.value === '1') {
            nameAddressInfoElement.style.display = "block";
            paypalInfoElement.textContent = "Sie haben ein Paypal Konto. Bitte geben Sie ihre Paypal Kontaktdaten (Benutzername oder E-Mail-Adresse).";
        } else if (paypalElement.value === '2') {
            nameAddressInfoElement.style.display = "block";
            paypalInfoElement.textContent = "Sie haben kein Paypal Konto. Bitte geben Sie Ihre E-Mail-Adresse.";
        } else {
            nameAddressInfoElement.style.display = "none";
            paypalInfoElement.textContent = "";
        }
    }

    // Call the function initially to show the initial state
    showNameAddressInfo();

    // Add an event listener to listen for changes in the paypalElement
    paypalElement.addEventListener('change', showNameAddressInfo);
});
</script>

{{ endblock }}