{% extends 'leprikon/base.html' %}
{% load i18n cms_tags leprikon_tags sekizai_tags %}

{% block content %}

<h1>{% block title %}{{ title }}{% endblock %}</h1>

{% if form.instance.subject.full %}
    <div class="alert alert-warning" role="alert">
        {% blocktrans with subject_type=form.instance.subject.subject_type %}The capacity of this {{ subject_type }} has already been filled. You may register anyway, but the registration may not be approved. We will inform You.{% endblocktrans %}
    </div>
{% endif %}

{% for error in form.non_field_errors %}
    <div class="alert alert-danger" role="alert">{{ error }}</div>
{% endfor %}

<form action="" method="post" class="form-horizontal">{% csrf_token %}
    <h3>{% trans 'Participant' %}</h3>
    {% if form.participants %}
    {% include 'leprikon/form_item.html' with item=form.participant_select_form.participant %}
    {% else %}
    <input type="hidden" name="participant_select-participant" value="new"/>
    {% endif %}

    {% include 'leprikon/form_item.html' with item=form.participant_first_name %}
    {% include 'leprikon/form_item.html' with item=form.participant_last_name %}
    {% include 'leprikon/form_item.html' with item=form.participant_birth_num %}
    {% include 'leprikon/form_item.html' with item=form.participant_age_group %}
    {% include 'leprikon/form_item.html' with item=form.participant_street %}
    {% include 'leprikon/form_item.html' with item=form.participant_city %}
    {% include 'leprikon/form_item.html' with item=form.participant_postal_code %}
    {% include 'leprikon/form_item.html' with item=form.participant_citizenship %}
    {% include 'leprikon/form_item.html' with item=form.participant_insurance %}
    <div id="participant_contact">
    {% include 'leprikon/form_item.html' with item=form.participant_phone %}
    {% include 'leprikon/form_item.html' with item=form.participant_email %}
    </div>
    {% include 'leprikon/form_item.html' with item=form.participant_school %}
    {% include 'leprikon/form_item.html' with item=form.participant_school_other %}
    {% include 'leprikon/form_item.html' with item=form.participant_school_class %}
    {% include 'leprikon/form_item.html' with item=form.participant_health %}
    {% for item in form.questions_form %}
        {% include 'leprikon/form_item.html' %}
    {% endfor %}

    <h3>{% trans 'Parents' %}</h3>

    <div id="parent1_switch">
        {% include 'leprikon/form_item.html' with item=form.has_parent1 %}
    </div>
    <div id="parent1_form"{% if not form.has_parent1.value %} class="hidden"{% endif %}>
        {% if form.parents %}
        {% include 'leprikon/form_item.html' with item=form.parent1_select_form.parent %}
        {% else %}
        <input type="hidden" name="parent1_select-parent" value="new"/>
        {% endif %}
        {% include 'leprikon/form_item.html' with item=form.parent1_first_name %}
        {% include 'leprikon/form_item.html' with item=form.parent1_last_name %}
        {% include 'leprikon/form_item.html' with item=form.parent1_street %}
        {% include 'leprikon/form_item.html' with item=form.parent1_city %}
        {% include 'leprikon/form_item.html' with item=form.parent1_postal_code %}
        {% include 'leprikon/form_item.html' with item=form.parent1_phone %}
        {% include 'leprikon/form_item.html' with item=form.parent1_email %}
    </div>

    {% include 'leprikon/form_item.html' with item=form.has_parent2 %}
    <div id="parent2_form"{% if not form.has_parent2.value %} class="hidden"{% endif %}>
        {% if form.parents %}
        {% include 'leprikon/form_item.html' with item=form.parent2_select_form.parent %}
        {% else %}
        <input type="hidden" name="parent2_select-parent" value="new"/>
        {% endif %}
        {% include 'leprikon/form_item.html' with item=form.parent2_first_name %}
        {% include 'leprikon/form_item.html' with item=form.parent2_last_name %}
        {% include 'leprikon/form_item.html' with item=form.parent2_street %}
        {% include 'leprikon/form_item.html' with item=form.parent2_city %}
        {% include 'leprikon/form_item.html' with item=form.parent2_postal_code %}
        {% include 'leprikon/form_item.html' with item=form.parent2_phone %}
        {% include 'leprikon/form_item.html' with item=form.parent2_email %}
    </div>

    <h3>{% trans 'Legal Agreement' %}</h3>

    {% for line in form.instance.agreement|lines %}
    <p>{{ line }}</p>
    {% endfor %}

    {% for item in form.agreement_form %}
        {% include 'leprikon/form_item.html' %}
    {% endfor %}

    <!-- SUBMIT -->
    <div class="form-group">
        <div class="col-md-9 col-md-offset-3">
            <button class="btn btn-primary" type="submit">{{ submit_label }}</button>
            {% if back_url %}
            <a class="btn btn-default" href="{{ back_url }}">{{ back_label }}</a>
            {% endif %}
        </div>
    </div>
</form>

{% addtoblock "js" %}
<script type="text/javascript">

function getAge(birthNum) {
    birthNum = birthNum.replace("/","");
    y = parseInt(birthNum.substr(0, 2));
    year = (birthNum.length == 10 ? 1900 : 1800) + (y < 54 ? 100 : 0) + y;
    month = parseInt(birthNum.substr(2, 2)) % 50 % 20;
    day = parseInt(birthNum.substr(4, 2));
    today = new Date();
    return today.getFullYear() - year - (new Date(today.getFullYear(), month-1, day) > today ? 1 : 0)
}

function changedBirthNum() {
    age = getAge(this.value);
    if (isNaN(age)) return;
    if (age < 18) {
        $('#parent1_switch .form-group').addClass('required');
        $('#participant_contact .form-group').removeClass('required');
    } else {
        $('#parent1_switch .form-group').removeClass('required');
        $('#participant_contact .form-group').addClass('required');
    }
}

$(document).ready(function() {
    /* Select participant */
    $('input[type=radio][name=participant_select-participant]').change(function() {
        if (this.value == 'new') {
            $('#id_participant_first_name').val('');
            $('#id_participant_last_name').val('');
            $('#id_participant_birth_num').val('');
            $('#id_participant_age_group').val('');
            $('#id_participant_street').val('');
            $('#id_participant_city').val('');
            $('#id_participant_postal_code').val('');
            $('#id_participant_citizenship').val('');
            $('#id_participant_insurance').val('');
            $('#id_participant_phone').val('');
            $('#id_participant_email').val('');
            $('#id_participant_school').val('');
            $('#id_participant_school_other').val('');
            $('#id_participant_school_class').val('');
            $('#id_participant_health').val('');
        }{% for participant in form.participants %} else if (this.value == {{ participant.id }}) {
            $('#id_participant_first_name').val('{{ participant.first_name | escapejs }}');
            $('#id_participant_last_name').val('{{ participant.last_name | escapejs }}');
            $('#id_participant_birth_num').val('{{ participant.birth_num | escapejs }}').change();
            $('#id_participant_age_group').val('{{ participant.age_group_id }}');
            $('#id_participant_street').val('{{ participant.street | escapejs }}');
            $('#id_participant_city').val('{{ participant.city | escapejs }}');
            $('#id_participant_postal_code').val('{{ participant.postal_code | escapejs }}');
            $('#id_participant_citizenship').val('{{ participant.citizenship }}');
            $('#id_participant_insurance').val('{{ participant.insurance_id }}');
            $('#id_participant_phone').val('{{ participant.phone | escapejs }}');
            $('#id_participant_email').val('{{ participant.email | escapejs }}');
            $('#id_participant_school').val('{{ participant.school_id }}');
            $('#id_participant_school_other').val('{{ participant.school_other | escapejs }}');
            $('#id_participant_school_class').val('{{ participant.school_class | escapejs }}');
            $('#id_participant_health').val('{{ participant.health | escapejs }}');
        }{% endfor %}
    });

    /* Toggle first parent */
    $('#id_has_parent1').change(function() {
        if (this.checked) {
            $('#parent1_form').removeClass('hidden');
            $('#parent1_form .form-group').addClass('required');
        } else {
            $('#parent1_form').addClass('hidden');
        }
    });

    /* Toggle second parent */
    $('#id_has_parent2').change(function() {
        if (this.checked) {
            $('#parent2_form').removeClass('hidden');
            $('#parent2_form .form-group').addClass('required');
        } else {
            $('#parent2_form').addClass('hidden');
        }
    });

    /* Select first parent */
    $('input[type=radio][name=parent1_select-parent]').change(function() {
        if (this.value == 'new') {
            $('#id_parent1_first_name').val('');
            $('#id_parent1_last_name').val('');
            $('#id_parent1_street').val('');
            $('#id_parent1_city').val('');
            $('#id_parent1_postal_code').val('');
            $('#id_parent1_phone').val('');
            $('#id_parent1_email').val('');
        }{% for parent in form.parents %} else if (this.value == {{ parent.id }}) {
            $('#id_parent1_first_name').val('{{ parent.first_name | escapejs }}');
            $('#id_parent1_last_name').val('{{ parent.last_name | escapejs }}');
            $('#id_parent1_street').val('{{ parent.street | escapejs }}');
            $('#id_parent1_city').val('{{ parent.city | escapejs }}');
            $('#id_parent1_postal_code').val('{{ parent.postal_code | escapejs }}');
            $('#id_parent1_phone').val('{{ parent.phone | escapejs }}');
            $('#id_parent1_email').val('{{ parent.email | escapejs }}');
        }{% endfor %}
    });

    /* Select second parent */
    $('input[type=radio][name=parent2_select-parent]').change(function() {
        if (this.value == 'new') {
            $('#id_parent2_first_name').val('');
            $('#id_parent2_last_name').val('');
            $('#id_parent2_street').val('');
            $('#id_parent2_city').val('');
            $('#id_parent2_postal_code').val('');
            $('#id_parent2_phone').val('');
            $('#id_parent2_email').val('');
        }{% for parent in form.parents %} else if (this.value == {{ parent.id }}) {
            $('#id_parent2_first_name').val('{{ parent.first_name | escapejs }}');
            $('#id_parent2_last_name').val('{{ parent.last_name | escapejs }}');
            $('#id_parent2_street').val('{{ parent.street | escapejs }}');
            $('#id_parent2_city').val('{{ parent.city | escapejs }}');
            $('#id_parent2_postal_code').val('{{ parent.postal_code | escapejs }}');
            $('#id_parent2_phone').val('{{ parent.phone | escapejs }}');
            $('#id_parent2_email').val('{{ parent.email | escapejs }}');
        }{% endfor %}
    });

    /* Select second parent */
    $('#id_participant_birth_num').change(changedBirthNum);
});

</script>
{% endaddtoblock %}

{% endblock %}
