{% block style %}
    <style>
    input[type=radio] {
        transform: scale(1.5);
        margin:10px;
        transition-duration: 0.2s;
    }
    </style>
{% load staticfiles %}
<link href="{% static 'StyleSheet.css' %}" rel="stylesheet" type="text/css" />
{% endblock %}

{% block content %}
<h1 style="background-image: url('{% static "ude.PNG" %}'); background-repeat: no-repeat; background-position: left center; background-size: auto 100%"; class="h1" ></h1>
<br>
{% comment %} GERMAN {% endcomment %}
{% if player.language == "German" %}
<h4>Möchten Sie weitere Informationen zu diesem Thema?</h4>
    <br>

{% comment %} ENGLISH {% endcomment %}
{% elif player.language == "English" %}
<h4>Would you like more information on this topic?</h4>
    <br>




{% comment %} ARABIC {% endcomment %}
{% elif player.language == "Arabic" %}
<h4 style="text-align: right">هل ترغب في مزيد من المعلومات حول هذه القضية؟</h4>
<br>





{% comment %} Farsi {% endcomment %}
{% elif player.language == "Farsi" %}
<h4 style="text-align: right">آیا درباره این موضوع اطلاعات بیشتری می‌خواهید؟</h4>
<br>
{% endif %}

{% if player.language == "Arabic" or player.language == "Farsi" %}
<div style="direction: rtl; text-align: right;">
{% endif %}
<label>
    <input type="radio" name="MoreInformations" onclick="Ja()" class="radio" value="Ja"> {% if player.language == "German" %}Ja{% elif player.language == "English" %}Yes{% elif player.language == "Arabic" %}نعم{% elif player.language == "Farsi" %}بله{% endif %} </input>
     </label>
        <br>
    <label>
    <input type="radio" name="MoreInformations" onclick="Nein()" class="radio" value="Nein"> {% if player.language == "German" %}Nein{% elif player.language == "English" %}No{% elif player.language == "Arabic" %}لا{% elif player.language == "Farsi" %}خیر{% endif %}  </input>
</label>
<br>
</div>
<br>
<div id="JaChange">

</div>

    {% if player.language == "German" or player.language == "English" %}
    <button class="button" type="submit" id="weiter-btn" style="display: none">{% if player.language == "German" %}Weiter{% elif player.language == "English" %}Continue {% endif %}</button>

    {% elif player.language == "Arabic" or player.language == "Farsi" %}
    <button style="float: right; display: none" class="button" type="submit" id="weiter-btn">{% if player.language == "Arabic" %}استمر{% elif player.language == "Farsi" %}ادامه {% endif %}</button>
    {% endif %}

{% endblock %}

{% block script %}
<script>
function Ja() {
    let TextEins;
    let language = js_vars.PlayerLanguage;

    if(language == "German") {
        TextEins = "Sie finden einen Link am Ende der Umfrage mit weiteren Informationen zum Allgemeinen Gleichbehandlungsgesetz und zur Antidiskriminierungsstelle des Bundes.";
    }
    else if(language == "English")
    {
        TextEins = "You will find a link at the end of the survey with further information on the General Equal Treatment Act and the Federal Anti-Discrimination Agency.";
    }
    else if(language == "Arabic")
    {
        TextEins = "تجد رابطًا في نهاية الاستطلاع به مزيد من المعلومات حول القانون العام للمساواة في المعاملة ومكتب مكافحة التمييز التابع للولاية.";
    }
    else if(language == "Farsi")
    {
        TextEins = "در پایان این نظرسنجی پیوندی درج شده است که اطلاعات بیشتری درباره «قانون عمومی رفتار برابر» و «اداره فدرال پیشگیری از تبعیض» در اختیار شما می‌گذارد.";
    }
    document.getElementById("weiter-btn").value = "Ja";
    {% if player.language == "German" or player.language == "English" %}
    document.getElementById("JaChange").innerHTML = "<h4>" + "<br>" + TextEins + "</h4>";
    {% elif player.language == "Arabic" or player.language == "Farsi" %}
    document.getElementById("JaChange").innerHTML = "<br>" + "<h4 style='text-align: right'>" + "&#x202B;" + TextEins + "</h4>";
    {% endif %}
    document.getElementById("weiter-btn").style.display = "inline-block";
}

function Nein() {
    document.getElementById("weiter-btn").value = "Nein";
    document.getElementById("weiter-btn").style.display = "inline-block";
    document.getElementById("JaChange").innerHTML = ""
}

</script>
{% endblock %}