{% extends 'layout-inscription.html.twig' %}
{% block title %}Pré-inscription | {{ formulaire.name }}{% endblock %}
{% block conversion_tracking_script %}{{ formulaire.conversionTrackingScript }}{% endblock %}
{% block content %}
{#{% include 'MmppFrontBundle:Partial:bandeau.html.twig' %}#}
{# <div class="breadcrumb">#}
{# <a href="{{ path('mmpp_front_homepage3', {center_slug: center.slug}) }}">Accueil</a>#}
{# <span class="separator">></span>#}
{# <span>{{ formulaire.name }}</span>#}
{# </div>#}
<body>
<main>
<section class="intro container">
<h2>Année scolaire : {{ periode.name }}</h2>
<div class="introText wysiwyg">
{% if config['form_explanation'] is defined %}{{ config['form_explanation']|raw }}{% endif %}
</div>
</section>
<div class="wrapper page preinscription">
<div class="main main-formation">
{# <div class="formation-menu sidebar">#}
{# <div class="btn-menu">#}
{# <p>Nos Formations</p>#}
{# <button aria-pressed="false" type="button" id="formation-button" tabindex="1"><span class="burger"></span><span class="menu-title">Menu</span></button>#}
{# </div>#}
{# <section class="nos-formations">#}
{# <nav id="menu-left">#}
{# <h2>NOS FORMATIONS</h2>#}
{# {% include 'MmppFrontBundle:Partial:formation.html.twig' %}#}
{# </nav>#}
{# </section>#}
{# </div>#}
{# <div class="form-header">#}
{# <div class="explanation">#}
{# {% if config['form_explanation'] is defined %}{{ config['form_explanation']|raw }}{% endif %}#}
{# </div>#}
{# </div>#}
{% if formulaire is not null %}
<section class="form container">
<header>
<h3>{{ formulaire.name }}</h3>
{% if errors is not empty %}
<div class="alert-danger">
{% for error in errors %}
<p>{{ error }}</p>
{% endfor %}
</div>
{% endif %}
</header>
<form action="" class="df" method="post" id="preinscription-form">
<div style="text-align: center; width: 100%;">
{#<h3>#}
{#{% if periode.isDefault == true %}#}
{#<a href="{{ otherYearLink }}" class="change-year-button"> ( Si vous souhaitez une inscription pour l'année en cours 2021/2022, veuillez cliquer sur ce lien )</a>#}
{#{% else %}#}
{#<a href="{{ otherYearLink }}" class="change-year-button">( Si vous souhaitez une inscription pour l'année en prochaine 2022/2023, veuillez cliquer sur ce lien ) </a>#}
{#{% endif %}#}
{#</h3>#}
</div>
{% for block in formulaire.blocks %}
<fieldset>
<legend>{{ block.label }}</legend>
{% for field in block.fields %}
{% if field.type == 'static' %}
<div class="form-line depends" {% if field.dependsOn is not null %}data-depends-on="{{ field.dependsOn.id }}"{% endif %}>
<label class="form-label">{{ field.label|raw }}</label>
<p class="static">{{ field.value|raw }}</p>
</div>
{% elseif field.type == 'text' %}
<input type="text" name="field_{{ field.id }}" placeholder="{{ field.label }}" value="{% if datas['field_'~field.id] is defined %}{{ datas['field_'~field.id] }}{% endif %}" class="field{{ field.size }} depends capitalize formField col-6" {% if field.dependsOn is not null %}data-depends-on="{{ field.dependsOn.id }}"{% endif %} {% if field.required %}data-required="true"{% endif %}>
{% elseif field.type == 'email' %}
<input type="email" name="field_{{ field.id }}" placeholder="{{ field.label }}" value="{% if datas['field_'~field.id] is defined %}{{ datas['field_'~field.id] }}{% endif %}" class="field{{ field.size }} depends formField col-12" {% if field.dependsOn is not null %}data-depends-on="{{ field.dependsOn.id }}"{% endif %} {% if field.required %}data-required="true"{% endif %}>
{% elseif field.type == 'textarea' %}
<textarea name="field_{{ field.id }}" class="field_{{ field.size }} depends" placeholder="{{ field.label }}" {% if field.dependsOn is not null %}data-depends-on="{{ field.dependsOn.id }}"{% endif %} {% if field.required %}data-required="true"{% endif %}>{% if datas['field_'~field.id] is defined %}{{ datas['field_'~field.id] }}{% endif %}</textarea>
{% elseif field.type == 'select' %}
{% if field.size == 12 %}
<label class="form-label mp_span4">{{ field.label|raw }}</label>
{% endif %}
<select name="field_{{ field.id }}" class="field{{ field.size }} depends" {% if field.dependsOn is not null %}data-depends-on="{{ field.dependsOn.id }}"{% endif %}>
{% for value in field.choiceValues %}
<option value="{{ value.id }}" {% if datas['field_'~field.id] is defined %}{% if datas['field_'~field.id]==value.id %}selected="selected"{% endif %}{% elseif value.isDefault %}selected="selected"{% endif %}>{{ value.value }}</option>
{% endfor %}
</select>
{% elseif field.type == 'radio' %}
<div class="radio formField df col-12 depends" {% if field.dependsOn is not null %}data-depends-on="{{ field.dependsOn.id }}"{% endif %}>
<div class="radio-title formField col-3">
<h4>{{ field.label|raw }}</h4>
</div>
<div class="radio-content dffs col-9">
{% for value in field.choiceValues %}
<div class="formField">
<input type="radio" id="label_{{ value.id }}" name="field_{{ field.id }}" value="{{ value.id }}" {% if datas['field_'~field.id] is defined %}{% if datas['field_'~field.id]==value.id %}checked="checked"{% endif %}{% elseif value.isDefault %}checked="checked"{% endif %}>
<label for="label_{{ value.id }}"> {{ value.value }}</label>
</div>
{% endfor %}
</div>
</div>
{% elseif field.type == 'checkbox' %}
<div class="formField multipleCheckboxes df col-12 depends" {% if field.dependsOn is not null %}data-depends-on="{{ field.dependsOn.id }}"{% endif %}>
<div class="multipleCheckboxes-title col-3">
<h4>{{ field.label|raw }}</h4>
</div>
<div class="multipleCheckboxes-content df col-9">
{% for value in field.choiceValues %}
<div class="formField col-6">
<input id="checkbox_{{ value.id }}" type="checkbox" name="field_{{ field.id }}[]" value="{{ value.id }}" {% if datas['field_'~field.id] is defined %}{% if value.id in datas['field_'~field.id] %}checked="checked"{% endif %}{% elseif value.isDefault %}checked="checked"{% endif %}>
<label for="checkbox_{{ value.id }}">{{ value.value }}</label>
</div>
{% endfor %}
</div>
</div>
{% endif %}
{% endfor %}
</fieldset>
{% endfor %}
<fieldset>
{% if formulaire.paymentType == 'check' %}
<div class="form-line">
<label class="form-label mp_span4">Réglement des frais de dossiers</label>
<div class="mp_span6">
<label class="mp_checkbox"><input type="radio" name="payment" value="cb" checked>Carte bleu</label>
<label class="mp_checkbox"><input type="radio" name="payment" value="check">Chèque</label>
</div>
</div>
{% else %}
<input type="hidden" name="payment" value="cb">
{% endif %}
</fieldset>
<input type="submit" value="Réservation et paiement" class="generate-pdf-btn">
</form>
</section>
{% else %}
<p>Formulaire introuvable !</p>
{% endif %}
</div>
</div>
</main>
</body>
<script>
var formulaireId = {{ formulaire.id }}
function refresh()
{
$("#preinscription-form .depends").each(function() {
if ($(this).data('dependsOn')) {
var show = false;
var dependsOn = $(this).data('dependsOn');
$("#preinscription-form input:checked, #preinscription-form select").each(function() {
if (dependsOn == $(this).val()) {
show = true;
}
});
if (show) {
$(this).show();
if ($(this).data('required')) {
$(this).attr('required', true);
}
} else {
$(this).hide();
$(this).attr('required', false);
}
}
});
}
$(document).ready(function() {
$("#preinscription-form input[type=radio], #preinscription-form input[type=checkbox]").click(function() {
refresh();
});
$("#preinscription-form select").change(function() {
refresh();
});
refresh();
$("#preinscription-form .depends").each(function() {
if ($(this).data('required')) {
if ($(this).is('input[type="text"]')) {
$(this).attr('placeholder', $(this).attr('placeholder') + ' *');
}
}
});
if(formulaireId == 144 || formulaireId == 161 || formulaireId == 162){
$('#label_782').parent('.formField').hide();
$('#label_783').parent('.formField').hide();
}
if(formulaireId == 161 || formulaireId == 162){
$('#label_400').parent('.formField').hide();
$('#label_401').prop('checked', true);
}
});
$("#preinscription-form").submit(function() {
/*if ($("input[name=payment]").val() == 'cb') {
$(".generate-pdf-btn").val('Redirection vers le paiement en ligne....').prop('disabled', true);
} else {*/
$(".generate-pdf-btn").val('Enregistrement de votre préinscription....').prop('disabled', true);
//}
});
</script>
{% endblock %}