templates/snippets/form-eligibilite-inscription.html.twig line 1

Open in your IDE?
  1. {% extends "layout-snippets.html.twig" %}
  2. {% block snippets %}
  3. {# Configs Générales #}
  4. {% set nbSlide = 16 %}
  5.     {% if editmode %}
  6.         <div class="uk-container apk-container-600 uk-text-center uk-margin-top">
  7.             <h3>Image par défaut</h3>
  8.             {{ pimcore_image("section-questions-img_default", {'width' : 100, 'height' : 100}) }}
  9.         </div>
  10.         <!-- .section-questions -->
  11.         <section class="uk-section">
  12.             <div class="section-questions">
  13.                 
  14.                 {% for i in 1..nbSlide %}
  15.                     <div class="uk-container uk-margin-bottom">
  16.                         <div uk-grid>
  17.                             <div class="uk-width-1-1">
  18.                                 <div class="section-questions-container">
  19.                                     <div style="background: #1e87f0; color: #FFF; width: 50px; height: 50px; line-height: 50px; text-align: center; font-size: 20px; font-weight: bold; position: absolute; left: 0; top: 50%; transform: translate(-50%, -50%); border-radius: 50%;">
  20.                                         {{ i }}
  21.                                     </div>
  22.                                     <div class="section-questions-container-icon uk-align-center uk-position-relative uk-flex uk-flex-middle">
  23.                                         {{ pimcore_image("section-questions-img_" ~ i, {'width' : 100, 'height' : 100}) }}
  24.                                     </div>
  25.                                     <div class="uk-container apk-container-600">
  26.                                         <h3 class="h-big-lowcase-grey">{{ pimcore_input("label-question_" ~ i) }}</h3>
  27.                                         <!--<div class="questions">
  28.                                             contenu
  29.                                         </div>-->
  30.                                     </div>
  31.                                 </div>
  32.                             </div>
  33.                         </div>
  34.                     </div>
  35.                     {% if i == 2 or i == 5 %}
  36.                         <div class="uk-container uk-margin-bottom">
  37.                             <div uk-grid>
  38.                                 <div class="uk-width-1-1">
  39.                                     <div class="section-questions-container">
  40.                                         <div style="background: #1e87f0; color: #FFF; width: 50px; height: 50px; line-height: 50px; text-align: center; font-size: 20px; font-weight: bold; position: absolute; left: 0; top: 50%; transform: translate(-50%, -50%); border-radius: 50%;">
  41.                                             {{ i }}.1
  42.                                         </div>
  43.                                         <div class="section-questions-container-icon uk-align-center uk-position-relative uk-flex uk-flex-middle">
  44.                                             {{ pimcore_image("section-questions-img_" ~ i ~ "-1", {'width' : 100, 'height' : 100}) }}
  45.                                         </div>
  46.                                         <div class="uk-container apk-container-600">
  47.                                             <h3 class="h-big-lowcase-grey">{{ pimcore_input("label-question_" ~ i ~ "-1") }}</h3>
  48.                                         <!-- <div class="questions">
  49.                                                 contenu
  50.                                             </div>-->
  51.                                         </div>
  52.                                     </div>
  53.                                 </div>
  54.                             </div>
  55.                         </div>
  56.                     {% endif %}
  57.                 {% endfor %}
  58.                     <div class="uk-container uk-margin-bottom">
  59.                         <div uk-grid>
  60.                             <div class="uk-width-1-1">
  61.                                 <div class="section-questions-container">
  62.                                     <div style="background: #1e87f0; color: #FFF; width: 50px; height: 50px; line-height: 50px; text-align: center; font-size: 16px; font-weight: bold; position: absolute; left: 0; top: 50%; transform: translate(-50%, -50%); border-radius: 50%;">
  63.                                         END
  64.                                     </div>
  65.                                     <div class="section-questions-container-icon uk-align-center uk-position-relative uk-flex uk-flex-middle">
  66.                                         {{ pimcore_image("section-questions-img_end", {"width" : 100, "height" : 100}) }}
  67.                                     </div>
  68.                                     <div class="uk-container apk-container-600">
  69.                                         <h3 class="h-big-lowcase-grey">{{ pimcore_input("label-question_end") }}</h3>
  70.                                         <div class="questions">
  71.                                             <div>
  72.                                                 {{ pimcore_wysiwyg("content-question_end") }}
  73.                                             </div>
  74.                                         </div>
  75.                                         {% if not pimcore_website_config('akimediaActivate') %}
  76.                                         <div class="uk-alert uk-alert-primary" uk-alert>
  77.                                             {{ pimcore_link("btn-action-question-end") }}                
  78.                                         </div>
  79.                                         {% endif %}
  80.                                     </div>
  81.                                 </div>
  82.                             </div>
  83.                         </div>
  84.                         {% if not pimcore_website_config('akimediaActivate') %}
  85.                         <div class="section-questions-container">
  86.                             <div class="uk-alert-primary uk-margin-medium-bottom" uk-alert>
  87.                                 <h3 class="uk-h3">SKIP TEST LINK</h3>
  88.                                 {{ pimcore_link("btn-action-skip-test") }}
  89.                             </div>
  90.                         </div>
  91.                         {% endif %}
  92.                     </div>
  93.             </div>
  94.         
  95.         </section>
  96.         
  97.     {% else %}
  98.         <!-- .section-questions -->
  99.         <div class="uk-container apk-container-1400">
  100.             <div>
  101.                 <section class="section-questions-padding">
  102.                     <div class="section-questions">
  103.                         <div uk-grid>
  104.                             <div class="uk-width-1-1">
  105.                                 <div class="section-questions-container">
  106.                                     <progress class="uk-progress" id="apk-progress-bar-question" value="0" max="100"></progress>
  107.                                     <div class="section-questions-container-icon uk-align-center uk-position-relative uk-flex uk-flex-middle">
  108.                                         {{ pimcore_image("section-questions-img_1", {
  109.                                             "attributes" : {
  110.                                                 "data-apk-image-step" : "1"
  111.                                             }
  112.                                         }) }}
  113.                                     </div>
  114.                                     <form id="form-quipeutdonnersonsang" class="uk-form-stacked" data-prev-step="0"
  115.                                         data-current-step="1">
  116.                                         <div class="uk-container">
  117.                                             <div class="questions">
  118.                                                 {#
  119.                                                 #--------------------------------
  120.                                                 # Question 1 : Homme / Femme
  121.                                                 #--------------------------------
  122.                                                 #}
  123.                                                 <div data-question="1">
  124.                                                     <h3 class="h-big-lowcase-grey">
  125.                                                         <span class="step-number">1.</span>
  126.                                                         {{ pimcore_input("label-question_1") }}
  127.                                                     </h3>
  128.                                                     <div class="question-message-before"></div>
  129.                                                     <div class="uk-form-controls">
  130.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q1" value="Homme"
  131.                                                                         autocomplete="false"/>
  132.                                                                 <span>{{ 'Homme'|trans }}</span></label>
  133.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q1" value="Femme"
  134.                                                                         autocomplete="false"/>
  135.                                                                 <span>{{ 'Femme'|trans }}</span></label>
  136.                                                         <button type="button" class="next apk-btn-secondary uk-hidden">{{ 'Valider'|trans }}</button>
  137.                                                     </div>
  138.                                                 </div>
  139.                                                 {#
  140.                                                 #--------------------------------
  141.                                                 # Question 2 : Date de naissance
  142.                                                 #--------------------------------
  143.                                                 #}
  144.                                                 <div data-question="2" class="uk-hidden">
  145.                                                     <h3 class="h-big-lowcase-grey">
  146.                                                         <span class="step-number">2.</span>
  147.                                                         {{ pimcore_input("label-question_2") }}
  148.                                                     </h3>
  149.                                                     <div class="question-message-before"></div>
  150.                                                     <div class="uk-form-controls">
  151.                                                         <div class="apk-form-inline">
  152.                                                             <input class="uk-input" type="text" name="q2"
  153.                                                                 placeholder="{{"jj/mm/aaaa"|trans }}"
  154.                                                                 value=""
  155.                                                                 data-toggle="datepicker" autocomplete="false"/>
  156.                                                             <button type="button" class="next apk-btn-secondary">{{ 'Valider'|trans }}</button>
  157.                                                         </div>
  158.                                                     </div>
  159.                                                 </div>
  160.                                                 {#
  161.                                                 #--------------------------------
  162.                                                 # Question 2.1 : Avez-vous fait un don ces trois dernières années ?
  163.                                                 #--------------------------------
  164.                                                 #}
  165.                                                 <div data-question="2.1" class="uk-hidden">
  166.                                                     <h3 class="h-big-lowcase-grey">
  167.                                                         
  168.                                                         {{ pimcore_input("label-question_2-1") }}
  169.                                                     </h3>
  170.                                                     <div class="question-message-before"></div>
  171.                                                     <div class="uk-form-controls">
  172.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q2.1" value="Oui"
  173.                                                                         autocomplete="false"/>
  174.                                                                 <span>{{ 'Oui'|trans }}</span></label>
  175.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q2.1" value="Non"
  176.                                                                         autocomplete="false" data-message="i18ln_erreur5"
  177.                                                                         data-color="red" data-where="after"/>
  178.                                                                 <span>{{ 'Non'|trans }}</span></label>
  179.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q2.1"
  180.                                                                         value="Je ne sais pas"
  181.                                                                         autocomplete="false" data-message="i18ln_erreur6"
  182.                                                                         data-color="red" data-where="after"/>
  183.                                                             {{ 'Je ne sais pas'|trans }}</label>
  184.                                                         <button type="button" class="next apk-btn-secondary uk-hidden">{{ 'Valider'|trans }}</button>
  185.                                                     </div>
  186.                                                 </div>
  187.                                                 {#
  188.                                                 #--------------------------------
  189.                                                 # Question 3 : Quel est votre poids et votre taille ?
  190.                                                 #--------------------------------
  191.                                                 #}
  192.                                                 <div data-question="3" class="uk-hidden">
  193.                                                     <h3 class="h-big-lowcase-grey">
  194.                                                         <span class="step-number">3.</span>
  195.                                                         {{ pimcore_input("label-question_3") }}
  196.                                                     </h3>
  197.                                                     <div class="question-message-before"></div>
  198.                                                     <div class="uk-form-controls">
  199.                                                         <div class="apk-form-inline">
  200.                                                             <input class="uk-input" type="number" name="q3" min="0" max="200"
  201.                                                                 autocomplete="false"/> {{ 'Kg'|trans }}
  202.                                                             <input class="uk-input uk-margin-left" type="number" name="q3taille" min="0" max="300"
  203.                                                                 autocomplete="false"/> {{ 'Cm'|trans }}
  204.                                                             <button type="button" class="uk-margin-left next apk-btn-secondary">{{ 'Valider'|trans }}</button>
  205.                                                         </div>
  206.                                                     </div>
  207.                                                 </div>
  208.                                                 {#
  209.                                                 #--------------------------------
  210.                                                 # Question 4 : De 1980 à 1996, avez-vous séjourné plus de 6 mois (tous séjours confondus) au Royaume-Uni
  211.                                                 #--------------------------------
  212.                                                 #}
  213.                                                 <div data-question="4" class="uk-hidden">
  214.                                                     <h3 class="h-big-lowcase-grey">
  215.                                                         <span class="step-number">4.</span>
  216.                                                         {{ pimcore_input("label-question_4") }}
  217.                                                     </h3>
  218.                                                     <div class="question-message-before"></div>
  219.                                                     <div class="uk-form-controls">
  220.                                                         <label><input class="uk-radio" type="radio" name="q4" value="Oui"
  221.                                                                         autocomplete="false" data-message="i18ln_erreur9"
  222.                                                                         data-color="red" data-where="after"/>
  223.                                                                 <span>{{ 'Oui'|trans }}</span></label>
  224.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q4" value="Non"
  225.                                                                         autocomplete="false"/>
  226.                                                                 <span>{{ 'Non'|trans }}</span></label>
  227.                                                         <button type="button" class="next apk-btn-secondary uk-hidden">{{ 'Valider'|trans }}</button>
  228.                                                     </div>
  229.                                                 </div>
  230.                                                 {#
  231.                                                 #--------------------------------
  232.                                                 # Question 5 : Avez-vous voyagé hors de la Belgique ces 6 derniers mois?
  233.                                                 #--------------------------------
  234.                                                 #}
  235.                                                 <div data-question="5" class="uk-hidden">
  236.                                                     <h3 class="h-big-lowcase-grey">
  237.                                                         <span class="step-number">5.</span>
  238.                                                         {{ pimcore_input("label-question_5") }}
  239.                                                     </h3>
  240.                                                     <div class="question-message-before"></div>
  241.                                                     <div class="uk-form-controls">
  242.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q5" value="Oui"
  243.                                                                         autocomplete="false"/>
  244.                                                                 <span>{{ 'Oui'|trans }}</span></label>
  245.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q5" value="Non"
  246.                                                                         autocomplete="false"/>
  247.                                                                 <span>{{ 'Non'|trans }}</span></label>
  248.                                                         <button type="button" class="next apk-btn-secondary uk-hidden">{{ 'Valider'|trans }}</button>
  249.                                                     </div>
  250.                                                 </div>
  251.                                                 {#
  252.                                                 #--------------------------------
  253.                                                 # Question 5.1 : Avez-vous voyagé à l’extérieur de l’Europe ?
  254.                                                 #--------------------------------
  255.                                                 #}
  256.                                                 <div data-question="5.1" class="uk-hidden">
  257.                                                     <h3 class="h-big-lowcase-grey">
  258.                                                         <span class="step-number">5.1.</span>
  259.                                                         {{ pimcore_input("label-question_5-1") }}
  260.                                                     </h3>
  261.                                                     <div class="question-message-before"></div>
  262.                                                     <div class="uk-form-controls">
  263.                                                         <label><input class="uk-radio" type="radio" name="q5.1" value="Oui"
  264.                                                                     autocomplete="false" data-message="i18ln_erreur11"
  265.                                                                     data-color="red" data-where="after"/>
  266.                                                             <span>{{ 'Oui'|trans }}</span></label>
  267.                                                         <label><input class="uk-radio" type="radio" name="q5.1" value="Non"
  268.                                                                         autocomplete="false" data-message="i18ln_erreur10"
  269.                                                                         data-color="red" data-where="after"/>
  270.                                                                 <span>{{ 'Non'|trans }}</span></label>
  271.                                                         <button type="button" class="next apk-btn-secondary uk-hidden">{{ 'Valider'|trans }}</button>
  272.                                                     </div>
  273.                                                 </div>
  274.                                                 {#
  275.                                                 #--------------------------------
  276.                                                 # Question 6 : êtes-vous enceinte ou avez-vous accouché dans les 6 derniers mois ?
  277.                                                 #--------------------------------
  278.                                                 #}
  279.                                                 
  280.                                                 <div data-question="6" class="uk-hidden">
  281.                                                     <h3 class="h-big-lowcase-grey">
  282.                                                         <span class="step-number">6.</span>
  283.                                                         {{ pimcore_input("label-question_6") }}
  284.                                                     </h3>
  285.                                                     <div class="question-message-before"></div>
  286.                                                     <div class="uk-form-controls">
  287.                                                         <label><input class="uk-radio" type="radio" name="q6" value="Oui"
  288.                                                                         autocomplete="false" data-message="i18ln_erreur12"
  289.                                                                         data-color="red" data-where="after"/>
  290.                                                                 <span>{{ 'Oui'|trans }}</span></label>
  291.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q6" value="Non"/>
  292.                                                             <span>{{ 'Non'|trans }}</span></label>
  293.                                                         <button type="button" class="next apk-btn-secondary uk-hidden">{{ 'Valider'|trans }}</button>
  294.                                                     </div>
  295.                                                 </div>
  296.                                                 
  297.                                                 {#
  298.                                                 #--------------------------------
  299.                                                 # Question 7 : Avez-vous eu récemment de la fièvre ou une infection (bronchite, infection urinaire...) ?
  300.                                                 #--------------------------------
  301.                                                 #}
  302.                                                 <div data-question="7" class="uk-hidden">
  303.                                                     <h3 class="h-big-lowcase-grey">
  304.                                                         <span class="step-number">7.</span>
  305.                                                         {{ pimcore_input("label-question_7") }}
  306.                                                     </h3>
  307.                                                     <div class="question-message-before"></div>
  308.                                                     <div class="uk-form-controls">
  309.                                                         <label><input class="uk-radio" type="radio" name="q7" value="Oui"
  310.                                                                         autocomplete="false" data-message="i18ln_erreur13"
  311.                                                                         data-color="red" data-where="after"/>
  312.                                                                 <span>{{ 'Oui'|trans }}</span></label>
  313.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q7" value="Non"/>
  314.                                                             <span>{{ 'Non'|trans }}</span></label>
  315.                                                         <button type="button" class="next apk-btn-secondary uk-hidden">{{ 'Valider'|trans }}</button>
  316.                                                     </div>
  317.                                                 </div>
  318.                                                 {#
  319.                                                 #--------------------------------
  320.                                                 # Question 8 : Prenez-vous des médicaments ?
  321.                                                 #--------------------------------
  322.                                                 #}
  323.                                                 <div data-question="8" class="uk-hidden">
  324.                                                     <h3 class="h-big-lowcase-grey">
  325.                                                         <span class="step-number">8.</span>
  326.                                                         {{ pimcore_input("label-question_8") }}
  327.                                                     </h3>
  328.                                                     <div class="question-message-before"></div>
  329.                                                     <div class="uk-form-controls" data-apk-toggle-target="#toggle-q8-yes">
  330.                                                         <label><input class="uk-radio" type="radio" name="q8" value="Oui"
  331.                                                                         autocomplete="false" data-apk-toggle="true"/>
  332.                                                                 <span>{{ 'Oui'|trans }}</span></label>
  333.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q8" value="Non"
  334.                                                                         autocomplete="false" data-apk-toggle="false"/>
  335.                                                                 <span>{{ 'Non'|trans }}</span></label>
  336.                                                         <button type="button" class="next apk-btn-secondary uk-hidden">{{ 'Valider'|trans }}</button>
  337.                                                     </div>
  338.                                                     <div id="toggle-q8-yes" class="apk-listing-medicine" style="display: none;">
  339.                                                         <h4>{{ 'Cochez les médicaments que vous prenez dans la liste ci-dessous'|trans }}</h4>
  340.                                                         <div class="uk-form-controls has-serialize-checkbox">
  341.                                                             <div class="uk-text-left uk-grid-small" uk-grid>
  342.                                                                 <div class="uk-width-1-3@s">
  343.                                                                     <!-- complement_1 -->
  344.                                                                     <div class="uk-position-relative"><label><input class="uk-checkbox" type="checkbox" name="q8.1"
  345.                                                                                     value="{{ 'Spray nasal'|trans }}"
  346.                                                                                     autocomplete="false" data-message="false"
  347.                                                                                     data-complement="true"
  348.                                                                                     data-where="complement_1" />
  349.                                                                             <span>{{ 'Spray nasal'|trans }}</span>
  350.                                                                         </label></div>
  351.                                                                     <div class="uk-position-relative"><label><input class="uk-checkbox" type="checkbox" name="q8.1"
  352.                                                                                     value="{{ 'Spray pour la gorge'|trans }}"
  353.                                                                                     autocomplete="false" data-message="false"
  354.                                                                                     data-complement="true"
  355.                                                                                     data-where="complement_1" />
  356.                                                                             <span>{{ 'Spray pour la gorge'|trans }}</span>
  357.                                                                         </label></div>
  358.                                                                     <div class="uk-position-relative"><label><input class="uk-checkbox" type="checkbox" name="q8.1"
  359.                                                                                     value="{{ 'Spray pour la toux'|trans }}"
  360.                                                                                     autocomplete="false" data-message="false"
  361.                                                                                     data-complement="true"
  362.                                                                                     data-where="complement_1" />
  363.                                                                             <span>{{ 'Spray pour la toux'|trans }}</span>
  364.                                                                         </label></div>
  365.                                                                     <div class="uk-position-relative"><label><input class="uk-checkbox" type="checkbox" name="q8.1"
  366.                                                                                     value="{{ 'Anthihistaminiques'|trans }}"
  367.                                                                                     autocomplete="false" data-message="false"
  368.                                                                                     data-complement="true"
  369.                                                                                     data-where="complement_1"/>
  370.                                                                             <span>{{ 'Anthihistaminiques'|trans }}</span>
  371.                                                                         </label></div>
  372.                                                                     <!-- complement_2 -->
  373.                                                                     <div class="uk-position-relative"><label><input class="uk-checkbox" type="checkbox" name="q8.2"
  374.                                                                                     value="{{ 'Antibiotiques'|trans }}"
  375.                                                                                     autocomplete="false" data-message="false"
  376.                                                                                     data-complement="true"
  377.                                                                                     data-where="complement_2" />
  378.                                                                             <span>{{ 'Antibiotiques'|trans }}</span>
  379.                                                                         </label></div>
  380.                                                                     <!-- complement_1 -->
  381.                                                                     <div class="uk-position-relative"><label><input class="uk-checkbox" type="checkbox" name="q8.1"
  382.                                                                                     value="{{ 'Dafalgan / paracétamol'|trans }}"
  383.                                                                                     autocomplete="false" data-message="false"
  384.                                                                                     data-complement="true"
  385.                                                                                     data-where="complement_1"/>
  386.                                                                             <span>{{ 'Dafalgan / paracétamol'|trans }}</span>
  387.                                                                         </label></div>
  388.                                                                     <!-- complement_3 -->
  389.                                                                     <div class="uk-position-relative"><label><input class="uk-checkbox" type="checkbox" name="q8.3"
  390.                                                                                     value="{{ 'Aspirine / anti-inflammatoires (Nurofen, Ibruprofen, Perdofemina...)'|trans }}"
  391.                                                                                     autocomplete="false" data-message="false"
  392.                                                                                     data-complement="true"
  393.                                                                                     data-where="complement_3"/>
  394.                                                                             <span>{{ 'Aspirine / anti-inflammatoires (Nurofen, Ibruprofen, Perdofemina...)'|trans }}</span>
  395.                                                                         </label></div>
  396.                                                                 </div>
  397.                                                                 <div class="uk-width-1-3@s">
  398.                                                                     <!-- complement_1 -->
  399.                                                                     <div class="uk-position-relative"><label><input class="uk-checkbox" type="checkbox" name="q8.1"
  400.                                                                                     value="{{ 'Antiacides comme Pantomed (Pantoprazole), Losec (Omeprazole)'|trans }}"
  401.                                                                                     autocomplete="false" data-message="false"
  402.                                                                                     data-complement="true"
  403.                                                                                     data-where="complement_1"/>
  404.                                                                             <span>{{ 'Antiacides comme Pantomed (Pantoprazole), Losec (Omeprazole)'|trans }}</span>
  405.                                                                         </label></div>
  406.                                                                     <div class="uk-position-relative"><label><input class="uk-checkbox" type="checkbox" name="q8.1"
  407.                                                                                     value="{{ 'Somnifères'|trans }}"
  408.                                                                                     autocomplete="false" data-message="false"
  409.                                                                                     data-complement="true"
  410.                                                                                     data-where="complement_1"/>
  411.                                                                             <span>{{ 'Somnifères'|trans }}</span>
  412.                                                                         </label></div>
  413.                                                                     <!-- complement_4 -->
  414.                                                                     <div class="uk-position-relative"><label><input class="uk-checkbox" type="checkbox" name="q8.4"
  415.                                                                                     value="{{ 'Isotrétinoïne (Traitement contre l\'acné)'|trans }}"
  416.                                                                                     autocomplete="false" data-message="false"
  417.                                                                                     data-complement="true"
  418.                                                                                     data-where="complement_4"/>
  419.                                                                             <span>{{ 'Isotrétinoïne (Traitement contre l\'acné)'|trans }}</span>
  420.                                                                         </label></div>
  421.                                                                     <div class="uk-position-relative"><label><input class="uk-checkbox" type="checkbox" name="q8.4"
  422.                                                                                     value="{{ 'Finastéride (Traitement pour la prostate ou contre la perte de cheveux)'|trans }}"
  423.                                                                                     autocomplete="false" data-message="false"
  424.                                                                                     data-complement="true"
  425.                                                                                     data-where="complement_4"/>
  426.                                                                             <span>{{ 'Finastéride (Traitement pour la prostate ou contre la perte de cheveux)'|trans }}</span>
  427.                                                                         </label></div>
  428.                                                                 </div>
  429.                                                                 <div class="uk-width-1-3@s">
  430.                                                                     <!-- complement_4 -->
  431.                                                                     <div class="uk-position-relative"><label><input class="uk-checkbox" type="checkbox" name="q8.4"
  432.                                                                                     value="{{ 'Dutastéride (Traitement pour la prostate)'|trans }}"
  433.                                                                                     autocomplete="false" data-message="false"
  434.                                                                                     data-complement="true"
  435.                                                                                     data-where="complement_4"/>
  436.                                                                             <span>{{ 'Dutastéride (Traitement pour la prostate)'|trans }}</span>
  437.                                                                         </label></div>
  438.                                                                     <!-- complement_5 -->
  439.                                                                     <div class="uk-position-relative"><label><input class="uk-checkbox" type="checkbox" name="q8.5"
  440.                                                                                     value="{{ 'Acitrétine (Traitement contre le psoriasis)'|trans }}"
  441.                                                                                     autocomplete="false" data-message="false"
  442.                                                                                     data-complement="true"
  443.                                                                                     data-where="complement_5"/>
  444.                                                                             <span>{{ 'Acitrétine (Traitement contre le psoriasis)'|trans }}</span>
  445.                                                                         </label></div>
  446.                                                                     <!-- complement_6 -->
  447.                                                                     <div class="uk-position-relative"><label><input class="uk-checkbox" type="checkbox" name="q8.6"
  448.                                                                                     value="Oui"
  449.                                                                                     autocomplete="false"
  450.                                                                                     data-message="i18ln_complement_14_6"
  451.                                                                                     data-complement="true"
  452.                                                                                     data-where="complement_6"/>
  453.                                                                             <span>{{ 'Autre(s)'|trans }}</span>
  454.                                                                         </label></div>
  455.                                                                 </div>
  456.                                                             </div>
  457.                                                         </div>
  458.                                                     </div>
  459.                                                 </div>
  460.                                                 {#
  461.                                                 #--------------------------------
  462.                                                 # Question 9 : Avez-vous été vacciné.e il y a moins d’un mois ?
  463.                                                 #--------------------------------
  464.                                                 #}
  465.                                                 <div data-question="9" class="uk-hidden">
  466.                                                     <h3 class="h-big-lowcase-grey">
  467.                                                         <span class="step-number">9.</span>
  468.                                                         {{ pimcore_input("label-question_9") }}
  469.                                                     </h3>
  470.                                                     <div class="question-message-before"></div>
  471.                                                     <div class="uk-form-controls" data-apk-toggle-target="#toggle-q9-yes">
  472.                                                         <label><input class="uk-radio" type="radio" name="q9" value="Oui"
  473.                                                                         autocomplete="false" data-apk-toggle="true"/>
  474.                                                                 <span>{{ 'Oui'|trans }}</span></label>
  475.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q9" value="Non"
  476.                                                                         data-apk-toggle="false"/>
  477.                                                                 <span>{{ 'Non'|trans }}</span></label>
  478.                                                         <button type="button" class="next apk-btn-secondary uk-hidden">{{ 'Valider'|trans }}</button>
  479.                                                     </div>
  480.                                                     <div id="toggle-q9-yes" style="display: none; padding-bottom: 15px;">
  481.                                                         <hr class="uk-margin-medium-top"/>
  482.                                                         <div class="uk-form-controls" data-apk-where="common"
  483.                                                             data-apk-message="i18ln_complement_15_common"
  484.                                                             data-apk-question="9">
  485.                                                             <div class="uk-text-left uk-grid-small" uk-grid>
  486.                                                                 <div class="uk-width-1-3@s">
  487.                                                                     <div><label><input class="uk-checkbox" type="checkbox" name="q9.1"
  488.                                                                                     value="{{ 'Hépatite B'|trans }}"
  489.                                                                                     autocomplete="false"
  490.                                                                                     data-message="i18ln_complement_15_1"
  491.                                                                                     data-color="false" data-complement="true"
  492.                                                                                     data-where="complement_1"/>
  493.                                                                             <span>{{ 'Hépatite B'|trans }}</span>
  494.                                                                         </label>
  495.                                                                     </div>
  496.                                                                     <div><label><input class="uk-checkbox" type="checkbox" name="q9.2"
  497.                                                                                     value="{{ 'Coqueluche'|trans }}"
  498.                                                                                     autocomplete="false"
  499.                                                                                     data-message="i18ln_complement_15_3"
  500.                                                                                     data-color="false" data-complement="true"
  501.                                                                                     data-where="complement_3"/>
  502.                                                                             <span>{{ 'Coqueluche'|trans }}</span>
  503.                                                                         </label>
  504.                                                                     </div>
  505.                                                                     <div><label><input class="uk-checkbox" type="checkbox" name="q9.3"
  506.                                                                                     value="{{ 'Grippe'|trans }}"
  507.                                                                                     autocomplete="false"
  508.                                                                                     data-message="i18ln_complement_15_3"
  509.                                                                                     data-color="false" data-complement="true"
  510.                                                                                     data-where="complement_3"/>
  511.                                                                             <span>{{ 'Grippe'|trans }}</span>
  512.                                                                         </label>
  513.                                                                     </div>
  514.                                                                 </div>
  515.                                                                 <div class="uk-width-1-3@s">
  516.                                                                     <div><label><input class="uk-checkbox" type="checkbox" name="q9.4"
  517.                                                                                     value="{{ 'Fièvre Jaune'|trans }}"
  518.                                                                                     autocomplete="false"
  519.                                                                                     data-message="i18ln_complement_15_2"
  520.                                                                                     data-color="false" data-complement="true"
  521.                                                                                     data-where="complement_2"/>
  522.                                                                             <span>{{ 'Fièvre Jaune'|trans }}</span>
  523.                                                                         </label>
  524.                                                                     </div>
  525.                                                                     <div><label><input class="uk-checkbox" type="checkbox" name="q9.5"
  526.                                                                                     value="{{ 'Tétanos'|trans }}"
  527.                                                                                     autocomplete="false"
  528.                                                                                     data-message="i18ln_complement_15_3"
  529.                                                                                     data-color="false" data-complement="true"
  530.                                                                                     data-where="complement_3"/>
  531.                                                                             <span>{{ 'Tétanos'|trans }}</span>
  532.                                                                         </label>
  533.                                                                     </div>
  534.                                                                 </div>
  535.                                                                 <div class="uk-width-1-3@s">
  536.                                                                     <div><label><input class="uk-checkbox" type="checkbox" name="q9.7"
  537.                                                                                     value="{{ 'SARS-CoV-2 (COVID 19)'|trans }}"
  538.                                                                                     autocomplete="false"
  539.                                                                                     data-message="i18ln_complement_15_5"
  540.                                                                                     data-color="false" data-complement="true"
  541.                                                                                     data-where="complement_5"/>
  542.                                                                             <span>{{ 'SARS-CoV-2 (COVID 19)'|trans }}</span>
  543.                                                                         </label>
  544.                                                                     </div>
  545.                                                                     <div><label><input class="uk-checkbox" type="checkbox" name="q9.6"
  546.                                                                                     value="{{ 'Autre'|trans }}"
  547.                                                                                     autocomplete="false"
  548.                                                                                     data-message="i18ln_complement_15_4"
  549.                                                                                     data-color="false" data-complement="true"
  550.                                                                                     data-where="complement_4"/>
  551.                                                                             <span>{{ 'Autre'|trans }}</span>
  552.                                                                         </label>
  553.                                                                     </div>
  554.                                                                 </div>
  555.                                                             </div>
  556.                                                         </div>
  557.                                                     </div>
  558.                                                 </div>
  559.                                                 {#
  560.                                                 #--------------------------------
  561.                                                 # Question 10 : Avez-vous subi une endoscopie (arthroscopie, gastroscopie, coloscopie…) ou une opération dans les 4 derniers mois ?
  562.                                                 #--------------------------------
  563.                                                 #}
  564.                                                 <div data-question="10" class="uk-hidden">
  565.                                                     <h3 class="h-big-lowcase-grey">
  566.                                                         <span class="step-number">10.</span>
  567.                                                         {{ pimcore_input("label-question_10") }}
  568.                                                     </h3>
  569.                                                     <div class="question-message-before"></div>
  570.                                                     <div class="uk-form-controls">
  571.                                                         <label><input class="uk-radio" type="radio" name="q10" value="Oui"
  572.                                                                         autocomplete="false" data-message="i18ln_erreur16"
  573.                                                                         data-color="red" data-where="after"/>
  574.                                                                 <span>{{ 'Oui'|trans }}</span></label>
  575.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q10"
  576.                                                                         value="Non"/>
  577.                                                                 <span>{{ 'Non'|trans }}</span></label>
  578.                                                         <button type="button" class="next apk-btn-secondary uk-hidden">{{ 'Valider'|trans }}</button>
  579.                                                     </div>
  580.                                                 </div>
  581.                                                 {#
  582.                                                 #--------------------------------
  583.                                                 # Question 11 : êtes-vous allé.e chez le dentiste au cours des 7 derniers jours ?
  584.                                                 #--------------------------------
  585.                                                 #}
  586.                                                 <div data-question="11" class="uk-hidden">
  587.                                                     <h3 class="h-big-lowcase-grey"><span class="step-number">11.</span>
  588.                                                         {{ pimcore_input("label-question_11") }}
  589.                                                     </h3>
  590.                                                     <div class="question-message-before"></div>
  591.                                                     <div class="uk-form-controls">
  592.                                                         <label><input class="uk-radio" type="radio" name="q11" value="Oui"
  593.                                                                         autocomplete="false" data-message="i18ln_info17"
  594.                                                                         data-color="red" data-where="after"/>
  595.                                                             <span>{{ 'Oui'|trans }}</span></label>
  596.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q11"
  597.                                                                         value="Non"/>
  598.                                                             <span>{{ 'Non'|trans }}</span></label>
  599.                                                         <button type="button" class="next apk-btn-secondary uk-hidden">{{ 'Valider'|trans }}</button>
  600.                                                     </div>
  601.                                                 </div>
  602.                                                 {#
  603.                                                 #--------------------------------
  604.                                                 # Question 12 : Avez-vous fait un piercing (y compris boucles d’oreilles) ou un tatouage (y compris maquillage permanent) durant ces 4 derniers mois ?
  605.                                                 #--------------------------------
  606.                                                 #}
  607.                                                 <div data-question="12" class="uk-hidden">
  608.                                                     <h3 class="h-big-lowcase-grey">
  609.                                                         <span class="step-number">12.</span>
  610.                                                         {{ pimcore_input("label-question_12") }}
  611.                                                     </h3>
  612.                                                     <div class="question-message-before"></div>
  613.                                                     <div class="uk-form-controls">
  614.                                                         <label><input class="uk-radio" type="radio" name="q12" value="Oui"
  615.                                                                         autocomplete="false" data-message="i18ln_erreur18"
  616.                                                                         data-color="red" data-where="after"/>
  617.                                                             <span>{{ 'Oui'|trans }}</span></label>
  618.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q12"
  619.                                                                         value="Non"/>
  620.                                                             <span>{{ 'Non'|trans }}</span></label>
  621.                                                         <button type="button" class="next apk-btn-secondary uk-hidden">{{ 'Valider'|trans }}</button>
  622.                                                     </div>
  623.                                                 </div>
  624.                                                 {#
  625.                                                 #--------------------------------
  626.                                                 # Question 13 : Avez-vous déjà consommé de la drogue ?
  627.                                                 #--------------------------------
  628.                                                 #}
  629.                                                 <div data-question="13" class="uk-hidden">
  630.                                                     <h3 class="h-big-lowcase-grey">
  631.                                                         <span class="step-number">13.</span>
  632.                                                         {{ pimcore_input("label-question_13") }}
  633.                                                     </h3>
  634.                                                     <div class="question-message-before"></div>
  635.                                                     <div class="uk-form-controls">
  636.                                                         <label><input class="uk-radio" type="radio" name="q13" value="Oui"
  637.                                                                         autocomplete="false" data-message="i18ln_info19"
  638.                                                                         data-color="red" data-where="after"/>
  639.                                                             <span>{{ 'Oui'|trans }}</span></label>
  640.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q13"
  641.                                                                         value="Non"/>
  642.                                                             <span>{{ 'Non'|trans }}</span></label>
  643.                                                         <button type="button" class="next apk-btn-secondary uk-hidden">{{ 'Valider'|trans }}</button>
  644.                                                     </div>
  645.                                                 </div>
  646.                                                 {#
  647.                                                 #--------------------------------
  648.                                                 # Question 14 : Avez-vous eu un.e nouveau.elle partenaire sexuel.le au cours des 4 derniers mois ? (avec ou sans préservatif)
  649.                                                 #--------------------------------
  650.                                                 #}
  651.                                                 <div data-question="14" class="uk-hidden">
  652.                                                     {# Si répondu F (femme) à la Q2 #}
  653.                                                     <h3 class="h-big-lowcase-grey">
  654.                                                         <span class="step-number">14.</span>
  655.                                                         {{ pimcore_input("label-question_14") }}
  656.                                                     </h3>
  657.                                                     <div class="question-message-before"></div>
  658.                                                     <div class="uk-form-controls">
  659.                                                         <label><input class="uk-radio" type="radio" name="q14" value="Oui"
  660.                                                                         autocomplete="false" data-message="i18ln_erreur20"
  661.                                                                         data-color="red" data-where="after"/>
  662.                                                                 <span>{{ 'Oui'|trans }}</span></label>
  663.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q14"
  664.                                                                         value="Non"/>
  665.                                                                 <span>{{ 'Non'|trans }}</span></label>
  666.                                                         <button type="button" class="next apk-btn-secondary uk-hidden">{{ 'Valider'|trans }}</button>
  667.                                                     </div>
  668.                                                 </div>
  669.                                                 {#
  670.                                                 #--------------------------------
  671.                                                 # Question 15 : Avez-vous eu une nouvelle partenaire sexuelle au cours des 4 derniers mois ? (avec ou sans préservatif)
  672.                                                 #--------------------------------
  673.                                                 #}
  674.                                                 <div data-question="15" class="uk-hidden">
  675.                                                     {# Si répondu H (homme) à la Q2 #}
  676.                                                     <h3 class="h-big-lowcase-grey">
  677.                                                         <span class="step-number">15.</span>
  678.                                                         {{ pimcore_input("label-question_15") }}
  679.                                                     </h3>
  680.                                                     <div class="question-message-before"></div>
  681.                                                     <div class="uk-form-controls">
  682.                                                         <label><input class="uk-radio" type="radio" name="q15" value="Oui"
  683.                                                                         autocomplete="false" data-message="i18ln_erreur21"
  684.                                                                         data-color="red" data-where="after"/>
  685.                                                             <span>{{ 'Oui'|trans }}</span></label>
  686.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q15"
  687.                                                                         value="Non"/>
  688.                                                             <span>{{ 'Non'|trans }}</span></label>
  689.                                                         <button type="button" class="next apk-btn-secondary uk-hidden">{{ 'Valider'|trans }}</button>
  690.                                                     </div>
  691.                                                 </div>
  692.                                                 {#
  693.                                                 #--------------------------------
  694.                                                 # Question 16 : Au cours des 12 derniers mois, avez-vous eu une relation sexuelle avec un homme ?
  695.                                                 #--------------------------------
  696.                                                 #}
  697.                                                 <div data-question="16" class="uk-hidden">
  698.                                                     {# Si répondu H (homme) à la Q2 #}
  699.                                                     <h3 class="h-big-lowcase-grey">
  700.                                                         <span class="step-number">16.</span>
  701.                                                         {{ pimcore_input("label-question_16") }}
  702.                                                     </h3>
  703.                                                     <div class="question-message-before"></div>
  704.                                                     <div class="uk-form-controls">
  705.                                                         <label><input class="uk-radio" type="radio" name="q16" value="Oui"
  706.                                                                         autocomplete="false" data-message="i18ln_erreur22"
  707.                                                                         data-color="red" data-where="after"/>
  708.                                                             <span>{{ 'Oui'|trans }}</span></label>
  709.                                                         <label><input class="uk-radio is-autovalidate" type="radio" name="q16"
  710.                                                                         value="Non"/>
  711.                                                             <span>{{ 'Non'|trans }}</span></label>
  712.                                                         <button type="button" class="next apk-btn-secondary uk-hidden">{{ 'Valider'|trans }}</button>
  713.                                                     </div>
  714.                                                 </div>
  715.                                                 {#
  716.                                                 #--------------------------------
  717.                                                 # END : Merci d’avoir fait le test !
  718.                                                 #--------------------------------
  719.                                                 #}
  720.                                                 <div data-question="end" class="uk-hidden">
  721.                                                     {# fin #}
  722.                                                     <h3 class="h-big-lowcase-grey">
  723.                                                         <span class="step-number">End.</span>
  724.                                                         {{ pimcore_input("label-question_end") }}
  725.                                                     </h3>
  726.                                                     <div>
  727.                                                         {{ pimcore_wysiwyg("content-question_end") }}
  728.                                                     </div>
  729.                                                     <div class="uk-margin-top">
  730.                                                         {% if pimcore_website_config('akimediaActivate') %}
  731.                                                             {% if centre == 'all' %}
  732.                                                                 <a href="{{ document.getProperty('listeCentresPlasma') }}" class="uk-button uk-button-primary">{{ "Je m'inscris"|trans }}</a>
  733.                                                             {% else %}
  734.                                                                 <a href="{{ path("inscriptionCentre", {id: centre}) }}" class="uk-button uk-button-primary">{{ "Je m'inscris"|trans }}</a>
  735.                                                             {% endif %}
  736.                                                         {% else %}
  737.                                                             {{ pimcore_link("btn-action-question-end") }}            
  738.                                                         {% endif %}
  739.                                                     </div>
  740.                                                 </div>
  741.                                             </div>
  742.                                             <div class="apk-step-actions uk-grid uk-text-center uk-text-left@s">
  743.                                                 <div class="uk-width-expand@s">
  744.                                                     <button type="button" class="start">{{ 'Retour au début'|trans }}</button>
  745.                                                 </div>
  746.                                                 <div class="uk-width-auto@s">
  747.                                                     <button type="button" class="prev uk-hidden">
  748.                                                         {{ 'Précédent'|trans }}
  749.                                                     </button>
  750.                                                     <button type="button" class="next-no-matter uk-hidden">
  751.                                                         {{ 'Continuer le test'|trans }}
  752.                                                     </button>
  753.                                                 </div>                                  
  754.                                             </div>
  755.                                             <div class="question-message-container-complement">
  756.                                                 <div class="question-message-complement_1"></div>
  757.                                                 <div class="question-message-complement_2"></div>
  758.                                                 <div class="question-message-complement_3"></div>
  759.                                                 <div class="question-message-complement_4"></div>
  760.                                                 <div class="question-message-complement_5"></div>
  761.                                                 <div class="question-message-complement_6"></div>
  762.                                                 <div class="question-message-common"></div>
  763.                                             </div>
  764.                                             <div class="question-message-after"></div>
  765.                                         </div>
  766.                                     </form>
  767.                                     <div class="apk-step-informations uk-hidden">
  768.                                         <div>Previous Step: <strong id="data-apk-prev-step">0</strong></div>
  769.                                         <div>Current Step: <strong id="data-apk-current-step">1</strong></div>
  770.                                         <!--<span id="data-apk-percent-step">0%</span>-->
  771.                                     </div>
  772.                                 </div>
  773.                             </div>
  774.                         </div>
  775.                     </div>
  776.                 </section>
  777.             </div>
  778.         </div>
  779.         
  780.             {# Pre-chargement des images des différentes étapes #}
  781.             <div data-apk-image-wrapper-step="default" class="uk-hidden uk-invisible">
  782.                 {{ pimcore_image("section-questions-img_default", {
  783.                     "imgAttributes" : {
  784.                         "data-apk-image-step" : "default"
  785.                     }
  786.                 }) }}
  787.             </div>
  788.             {% for i in 1..nbSlide %}
  789.                 <div data-apk-image-wrapper-step="{{i}}" class="uk-hidden uk-invisible">
  790.                     {{ pimcore_image("section-questions-img_" ~ i, {
  791.                         "imgAttributes" : {
  792.                             "data-apk-image-step" : i
  793.                         }
  794.                     }) }}
  795.                 </div>
  796.                 {% if i == 2 or i == 5 %}
  797.                     <div data-apk-image-wrapper-step="{{i}}.1" class="uk-hidden uk-invisible">
  798.                         {{ pimcore_image("section-questions-img_" ~ i ~'-1') }}
  799.                     </div>
  800.                 {% endif %}
  801.             {% endfor %}
  802.             <div data-apk-image-wrapper-step="end" class="uk-hidden uk-invisible">
  803.                 {{ pimcore_image("section-questions-img_end", {
  804.                     "imgAttributes" : {
  805.                         "data-apk-image-step" : "end"    
  806.                     }    
  807.                 }) }}
  808.             </div>
  809.         {% endif %}
  810.         
  811.     {% if not editmode %}
  812.     {% if app.request.locale =="nl" %}
  813.         {% set datePickerLang = "nl-NL" %}    
  814.     {% elseif app.request.locale == "de" %}
  815.         {% set datePickerLang = "de-DE" %}    
  816.     {% else %}
  817.         {% set datePickerLang = "fr-FR" %}    
  818.     {% endif %}
  819.     <link rel="stylesheet" href="/static/vendors/datepicker-master/dist/datepicker.min.css">
  820.     
  821.     {% do pimcore_head_script().appendFile(asset('/static/vendors/datepicker-master/dist/datepicker.min.js')) %}
  822.     {% do pimcore_head_script().appendFile(asset('/static/vendors/datepicker-master/i18n/datepicker.' ~ datePickerLang|raw ~ '.js')) %}
  823.     {% do pimcore_head_script().appendFile(asset('/static/vendors/jQuery-Mask-Plugin-master/dist/jquery.mask.min.js')) %}
  824.     
  825.     <script>
  826.         document.addEventListener("DOMContentLoaded", function(event) { 
  827.             var datepickerInput;
  828.             try {
  829.                 datepickerInput = $('[data-toggle="datepicker"]').datepicker({
  830.                     format: 'dd/mm/yyyy',
  831.                     language: '{{datePickerLang}}',
  832.                     autoHide: true
  833.                 });
  834.             }
  835.             catch (e) {
  836.         
  837.             }
  838.             $(function () {
  839.                 $(document).ready(function () {
  840.                     $('input[data-toggle="datepicker"]').mask('00/00/0000').on('change input paste', function () {
  841.                         var isValid = isValidDate($(this));
  842.                     });
  843.                 });
  844.             });
  845.                 var $form = $('#form-quipeutdonnersonsang');
  846.                 function getAge(dateString) {
  847.                     var today = new Date();
  848.                     var birthDate = new Date(dateString);
  849.                     var age = today.getFullYear() - birthDate.getFullYear();
  850.                     var m = today.getMonth() - birthDate.getMonth();
  851.                     if (m < 0 || (m === 0 && today.getDate() < birthDate.getDate())) {
  852.                         age--;
  853.                     }
  854.                     return age;
  855.                 }
  856.                 function removeMessage($question) {
  857.                     $question.find('.question-message-before').html('');
  858.                     $form.find('.question-message-after').html('');
  859.                     enableNext();
  860.                 }
  861.                 function showMessage($question, message, color, where) {
  862.                     removeMessage($question);
  863.                     if(where=='after'){
  864.                         var $error = $form.find('.question-message-' + where);
  865.                     } else if( where=='complement_1' || where=='complement_2' || where=='complement_3' || where=='complement_4' || where=='complement_5' || where=='complement_6') {
  866.                         var $error = $form.find('.question-message-' + where);
  867.                     } else {
  868.                         var $error = $question.find('.question-message-' + where);
  869.                     }
  870.                     $error.html(message).removeClass('question-message--red').removeClass('question-message--yellow').addClass('question-message--' + color);
  871.                     if (color == 'red') {
  872.                         disableNext();
  873.                     } else {
  874.                         enableNext();
  875.                     }
  876.                 }
  877.                 function resetAllMessage() {
  878.                     $form.find('.question-message-complement_1').html('');
  879.                     $form.find('.question-message-complement_2').html('');
  880.                     $form.find('.question-message-complement_3').html('');
  881.                     $form.find('.question-message-complement_4').html('');
  882.                     $form.find('.question-message-complement_5').html('');
  883.                     $form.find('.question-message-complement_6').html('');
  884.                     $form.find('.question-message-common').html('');
  885.                     $form.find('.question-message-after').html('');
  886.                 }
  887.                 function disableNext() {
  888.                     $('#form-quipeutdonnersonsang .next').addClass('apk-disabled-button').prop('disabled', true);
  889.                     $('#form-quipeutdonnersonsang .next-no-matter').removeClass('uk-hidden');
  890.                 }
  891.                 function enableNext() {
  892.                     $('#form-quipeutdonnersonsang .next').removeClass('apk-disabled-button').prop('disabled', false);
  893.                     $('#form-quipeutdonnersonsang .next-no-matter').addClass('uk-hidden');
  894.                 }
  895.                 function hideNext() {
  896.                     $('#form-quipeutdonnersonsang .next').addClass('uk-hidden');
  897.                     $('#form-quipeutdonnersonsang .next-no-matter').addClass('uk-hidden');
  898.                 }
  899.                 function hidePrev() {
  900.                     $('#form-quipeutdonnersonsang .prev').addClass('uk-hidden');
  901.                 }
  902.                 function showPrev() {
  903.                     $('#form-quipeutdonnersonsang .prev').removeClass('uk-hidden');
  904.                 }
  905.                 function updatePicto(currentStep) {
  906.                     if($('[data-apk-image-wrapper-step = "' + currentStep + '"] img').length){
  907.                         var $html = $('[data-apk-image-wrapper-step = "' + currentStep + '"]').html();
  908.                     } else {
  909.                         var $html = $('[data-apk-image-wrapper-step = "default"]').html();
  910.                     }
  911.                     $('.section-questions-container-icon').html($html)
  912.                 }
  913.                 var sexe = "";
  914.                 function showQuestion(prevNumber, number) {
  915.                 if(prevNumber == "1"){
  916.                     sexe = $('input[name="q1"]:checked').val();
  917.                 }
  918.                     //console.log('showQuestion ' + number);
  919.                     $form.find('[data-question]').addClass("uk-hidden");
  920.                     $form.find('[data-question="' + number + '"]').removeClass("uk-hidden");
  921.                     if($('#form-quipeutdonnersonsang .next-no-matter').hasClass('uk-hidden')==false){
  922.                         $('#form-quipeutdonnersonsang .next-no-matter').addClass('uk-hidden');
  923.                     }
  924.                     resetAllMessage();
  925.                     //tracking
  926.                     var labelStep = getStepLabelForGATracking(prevNumber);
  927.                     var langue = " {{ app.request.locale }}";
  928.                 if(sexe == "Homme" && prevNumber == "16"){
  929.                     window.dataLayer = window.dataLayer || [];
  930.                     window.dataLayer.push({
  931.                     'event': 'test_elibility',
  932.                     'step': "15"+labelStep,
  933.                     'language': langue,
  934.                     });
  935.                 }else{
  936.                     window.dataLayer = window.dataLayer || [];
  937.                     window.dataLayer.push({
  938.                     'event': 'test_elibility',
  939.                     'step': prevNumber+labelStep,
  940.                     'language': langue,
  941.                     });
  942.                     if(sexe == "Femme" && prevNumber == "14"){
  943.                     window.dataLayer = window.dataLayer || [];
  944.                     window.dataLayer.push({
  945.                         'event': 'test_elibility',
  946.                         'step': "15-merci",
  947.                         'language': langue,
  948.                     });
  949.                     }
  950.                 }
  951.                     if($('#data-apk-prev-step').text()!=false){
  952.                         showPrev();
  953.                     }
  954.                     updateStep(prevNumber, number);
  955.                     updatePicto(number);
  956.                     progressBar(number);
  957.                 }
  958.                 function getStepLabelForGATracking(step){
  959.                 switch (step) {
  960.                     case '1':
  961.                     return "-genre";
  962.                     break;
  963.                     case '2':
  964.                     //case '2.1':
  965.                     return "-date-naissance";
  966.                     break;
  967.                     case '3':
  968.                     return "-poids";
  969.                     break;
  970.                     case '4':
  971.                     return "-sejour-uk";
  972.                     break;
  973.                     case '5':
  974.                     //case '5.1':
  975.                     return "-voyage-hors-Belgique";
  976.                     break;
  977.                     case '6':
  978.                     return "-grossesse";
  979.                     break;
  980.                     case '7':
  981.                     return "-fievre-infection";
  982.                     break;
  983.                     case '8':
  984.                     return "-medicaments";
  985.                     break;
  986.                     case '9':
  987.                     return "-vaccins";
  988.                     break;
  989.                     case '10':
  990.                     return "-endoscopie";
  991.                     break;
  992.                     case '11':
  993.                     return "-dentiste";
  994.                     break;
  995.                     case '12':
  996.                     return "-piercing-tattoo";
  997.                     break;
  998.                     case '13':
  999.                     return "-drogues";
  1000.                     break;
  1001.                     case '14':
  1002.                     return "-partenaire";
  1003.                     break;
  1004.                     case '15':
  1005.                     if(sexe == "Homme"){
  1006.                         return "-partenaire";
  1007.                     }else{
  1008.                         return '';
  1009.                     }
  1010.                     break;
  1011.                     case '16':
  1012.                     if(sexe == "Homme"){
  1013.                         return "-merci";
  1014.                     }else{
  1015.                         return '';
  1016.                     }
  1017.                     break;
  1018.                     case 'end':
  1019.                     return "-merci";
  1020.                     break;
  1021.                 }
  1022.                 }
  1023.                 function updateStep(prevStep, currentStep) {
  1024.                     // var prev_step = $form.attr('data-prev-step');
  1025.                     // var current_step = $form.attr('data-current-step');
  1026.                     // $('#data-apk-prev-step').text(prev_step);
  1027.                     // $('#data-apk-current-step').text(current_step);
  1028.                     $('#data-apk-prev-step').text(prevStep);
  1029.                     $('#data-apk-current-step').text(currentStep);
  1030.                 }
  1031.                 function progressBar(currentStep) {
  1032.                     var totalSteps = ($('[data-question]').length - $('[data-question*="."]').length);
  1033.                     var totalProgress = currentStep * 100 / totalSteps;
  1034.                     if(currentStep=='1'){
  1035.                         $('#apk-progress-bar-question').attr('value', 0);
  1036.                     } else if(currentStep=='end') {
  1037.                         $('#apk-progress-bar-question').attr('value', 100);
  1038.                     } else {
  1039.                         $('#apk-progress-bar-question').attr('value', Math.round(totalProgress));
  1040.                     }
  1041.                     // Only for debug/dev
  1042.                     $('#data-apk-percent-step').text(currentStep + '/' + totalSteps + '=>' + Math.round(totalProgress) + '%');
  1043.                 }
  1044.                 function serializeCheckbox(element, arrayName) {
  1045.                     /*var fields = element.serializeArray();
  1046.                     jQuery.each( fields, function( i, field ) {
  1047.                         console.log( field.value + " " );
  1048.                     });*/
  1049.                     var returnArray = [];
  1050.                     var fields = element.serializeArray();
  1051.                     jQuery.each(fields, function (i, field) {
  1052.                         //console.log( field.value + " " );
  1053.                         returnArray.push(field.value);
  1054.                     });
  1055.                     returnArray = [arrayName, returnArray];
  1056.                     //console.log(returnArray);
  1057.                 }
  1058.                     var i18ln_erreur1 = '{{"!!Eligibilité!!erreur1"|trans|raw}}';
  1059.                     var i18ln_erreur2 = '{{"!!Eligibilité!!erreur2"|trans|raw}}';
  1060.                     var i18ln_erreur3 = '{{"!!Eligibilité!!erreur3"|trans|raw}}';
  1061.                     var i18ln_erreur4 = '{{"!!Eligibilité!!erreur4"|trans|raw}}';
  1062.                     var i18ln_erreur5 = '{{"!!Eligibilité!!erreur5"|trans|raw}}';
  1063.                     var i18ln_erreur6 = '{{"!!Eligibilité!!erreur6"|trans|raw}}';
  1064.                     var i18ln_erreur7 = '{{"!!Eligibilité!!erreur7"|trans|raw}}';
  1065.                     var i18ln_erreur8 = '{{"!!Eligibilité!!erreur8"|trans|raw}}';
  1066.                     var i18ln_erreur8_2 = '{{"!!Eligibilité!!erreur8_2"|trans|raw}}';
  1067.                     var i18ln_erreur9 = '{{"!!Eligibilité!!erreur9"|trans|raw}}';
  1068.                     var i18ln_erreur10 = '{{"!!Eligibilité!!erreur10"|trans|raw}}';
  1069.                     var i18ln_erreur11 = '{{"!!Eligibilité!!erreur11"|trans|raw}}';
  1070.                     var i18ln_complement_10_11 = '{{"!!Eligibilité!!complement10_11"|trans|raw}}';
  1071.                     i18ln_erreur10 += '<br/><br/>' + i18ln_complement_10_11;
  1072.                     i18ln_erreur11 += '<br/><br/>' + i18ln_complement_10_11;
  1073.                     var i18ln_erreur12 = '{{"!!Eligibilité!!erreur12"|trans|raw}}';
  1074.                     var i18ln_erreur13 = '{{"!!Eligibilité!!erreur13"|trans|raw}}';
  1075.                     //var i18ln_info14 = 'Attention ! Il arrive que la prise d’un médicament ne pose pas de problème pour le don de sang, mais que la maladie pour laquelle vous le prenez ou l’avez pris soit une contre-indication. En cas de doute, contactez-nous au <strong>0800 92 245</strong> ou envoyez-nous un mail à <strong>info@croix-rouge.be</strong><br /><br />Mentionnez toujours les médicaments que vous prenez au médecin de la collecte.';
  1076.                     var i18ln_complement_14_1 = '{{"!!Eligibilité!!complement14_1"|trans|raw}}';
  1077.                     var i18ln_complement_14_2 = '{{"!!Eligibilité!!complement14_2"|trans|raw}}';
  1078.                     var i18ln_complement_14_3 = '{{"!!Eligibilité!!complement14_3"|trans|raw}}';
  1079.                     var i18ln_complement_14_4 = '{{"!!Eligibilité!!complement14_4"|trans|raw}}';
  1080.                     var i18ln_complement_14_5 = '{{"!!Eligibilité!!complement14_5"|trans|raw}}';
  1081.                     var i18ln_complement_14_6 = '{{"!!Eligibilité!!complement14_6"|trans|raw}}';
  1082.                     var i18ln_complement_14_common = '{{"!!Eligibilité!!complement14_common"|trans|raw}}';
  1083.                     var i18ln_erreur15 = 'CONTENU ETAPE 9';
  1084.                     var i18ln_complement_15_1 = '{{"!!Eligibilité!!complement15_1"|trans|raw}}';
  1085.                     var i18ln_complement_15_2 = '{{"!!Eligibilité!!complement15_2"|trans|raw}}';
  1086.                     var i18ln_complement_15_3 = '{{"!!Eligibilité!!complement15_3"|trans|raw}}';
  1087.                     var i18ln_complement_15_4 = '{{"!!Eligibilité!!complement15_4"|trans|raw}}';
  1088.                     var i18ln_complement_15_5 = '{{"!!Eligibilité!!complement15_5"|trans|raw}}';
  1089.                     var i18ln_complement_15_common = '{{"!!Eligibilité!!complement15_common"|trans|raw}}';
  1090.                     var i18ln_erreur16 = '{{"!!Eligibilité!!erreur16"|trans|raw}}';
  1091.                     var i18ln_info17 = '{{"!!Eligibilité!!info17"|trans|raw}}';
  1092.                     var i18ln_erreur18 = '{{"!!Eligibilité!!erreur18"|trans|raw}}';
  1093.                     var i18ln_info19 = '{{"!!Eligibilité!!info19"|trans|raw}}';
  1094.                     var i18ln_erreur20 = '{{"!!Eligibilité!!erreur20"|trans|raw}}';
  1095.                     var i18ln_erreur21 = '{{"!!Eligibilité!!erreur21"|trans|raw}}';
  1096.                     var i18ln_erreur22 = '{{"!!Eligibilité!!erreur22"|trans|raw}}';    
  1097.                 (function ($) {
  1098.                     var $form = $('#form-quipeutdonnersonsang');
  1099.                     $form.find('.start').click(function (e) {
  1100.                         e.preventDefault();
  1101.                         $form.trigger('reset');
  1102.                         var currentStep = $('#data-apk-current-step').text();
  1103.                         showQuestion(currentStep, "1");
  1104.                         hidePrev();
  1105.                         updateStep("0", "1");
  1106.                     });
  1107.                     $form.find('.prev').click(function (e) {
  1108.                         e.preventDefault();
  1109.                         var targetStep = $('#data-apk-prev-step').text();
  1110.                         var currentStep = $('#data-apk-current-step').text();
  1111.                         var activePrev = false;
  1112.                         $("[data-question='" + currentStep + "'] input[type='radio'], [data-question='" + currentStep + "'] input[type='checkbox']").prop('checked', false);
  1113.                         $("[data-question='" + currentStep + "'] input[type='text'], [data-question='" + currentStep + "'] input[type='date']").prop('value', '');
  1114.                         $("[data-question='" + targetStep + "'] input[type='radio'], [data-question='" + targetStep + "'] input[type='checkbox']").prop('checked', false);
  1115.                         $("[data-question='" + targetStep + "'] input[type='text'], [data-question='" + targetStep + "'] input[type='date']").prop('value', '');
  1116.                         showQuestion(currentStep, targetStep);
  1117.                         updateStep(false, targetStep);
  1118.                         enableNext();
  1119.                         if (targetStep == '1' || activePrev == false) {
  1120.                             hidePrev();
  1121.                         }
  1122.                     });
  1123.                     $form.find('.next, .next-no-matter').click(function (e) {
  1124.                         e.preventDefault();
  1125.                         //$form.find('prev').removeClass('uk-invisible');
  1126.                         var $question = $form.find('[data-question]').not('.uk-hidden');
  1127.                         var questionN = $question.attr('data-question');
  1128.                         var $error = $question.find('.question-message');
  1129.                         // êtes-vous un homme ou une femme ?
  1130.                         if (questionN == "1") {
  1131.                             if ($form.find('[name="q' + questionN + '"]:checked').val() == '') {
  1132.                                 // Veuillez répondre à la question.
  1133.                                 showMessage($question, i18ln_erreur1, 'red', 'before');
  1134.                             } else {
  1135.                                 showQuestion(questionN, "2");
  1136.                                 showPrev();
  1137.                             }
  1138.                             if($(this).hasClass('next-no-matter')) {
  1139.                                 showQuestion(questionN, "2");
  1140.                                 showPrev();
  1141.                             }
  1142.                         }
  1143.                         // Quelle est votre date de naissance ?
  1144.                         else if (questionN == "2") {
  1145.                             if ($form.find('[name="q' + questionN + '"]').val() == '') {
  1146.                                 // Veuillez répondre à la question.
  1147.                                 showMessage($question, i18ln_erreur1, 'red', 'before');
  1148.                             }
  1149.                             else if (!isValidDate($form.find('[name="q' + questionN + '"]'))) {
  1150.                                 // Veuillez répondre à la question.
  1151.                                 showMessage($question, i18ln_erreur2, 'red', 'before');
  1152.                             } else {
  1153.                                 var age = getAge(datepickerInput.datepicker('getDate'));
  1154.                                 //console.log('age ' + age);
  1155.                                 if (isNaN(age) || age < 0) {
  1156.                                     // Veuillez entrer une date valide.
  1157.                                     showMessage($question, i18ln_erreur2, 'red', 'before');
  1158.                                 } else {
  1159.                                     if (age < 18) {
  1160.                                         // Vous êtes actuellement trop jeune pour donner votre sang. Mais nous vous remercions pour votre intérêt. Revenez nous voir dès que vous aurez 18 ans !
  1161.                                         showMessage($question, i18ln_erreur3, 'red', 'after');
  1162.                                     } else if (age >= 18 && age <= 65) {
  1163.                                         showQuestion(questionN, "3");
  1164.                                     } else if (age >= 66 && age <= 74) {
  1165.                                         showQuestion(questionN, "2.1");
  1166.                                     } else {
  1167.                                         // Malheureusement, vous ne pouvez pas donner votre sang car le 1er don de sang doit avoir été effectué avant votre 66ème anniversaire et le dernier don doit remonter à moins de 3 ans.
  1168.                                         showMessage($question, i18ln_erreur4, 'red', 'after');
  1169.                                     }
  1170.                                 }
  1171.                             }
  1172.                             if($(this).hasClass('next-no-matter')) {
  1173.                                 showQuestion(questionN, "3");
  1174.                             }
  1175.                         }
  1176.                         // Avez-vous fait un don ces trois dernières années ?
  1177.                         else if (questionN == "2.1") {
  1178.                             if ($form.find('[name="q' + questionN + '"]:checked').val() == '') {
  1179.                                 // Veuillez répondre à la question.
  1180.                                 showMessage($question, i18ln_erreur1, 'red');
  1181.                             } else {
  1182.                                 if ($('#form-quipeutdonnersonsang .next').prop("disabled") !== true) {
  1183.                                     showQuestion(questionN, "3");
  1184.                                 }
  1185.                             }
  1186.                             if($(this).hasClass('next-no-matter')) {
  1187.                                 showQuestion(questionN, "3");
  1188.                             }
  1189.                         }
  1190.                         // Quel est votre poids et votre taille ? Si <50kg
  1191.                         else if (questionN == "3") {
  1192.                             if ($form.find('[name="q' + questionN + '"]').val() == '') {
  1193.                                 // Veuillez répondre à la question.
  1194.                                 showMessage($question, i18ln_erreur1, 'red', 'before');
  1195.                             } else if (isNaN($form.find('[name="q' + questionN + '"]').val())) {
  1196.                                 // Veuillez entrer un nombre valide.
  1197.                                 showMessage($question, i18ln_erreur7, 'red', 'before');
  1198.                             } else if ($form.find('[name="q' + questionN + '"]').val() < parseInt($form.find('[name="q' + questionN + '"]').attr('min')) || $form.find('[name="q' + questionN + '"]').val() > parseInt($form.find('[name="q' + questionN + '"]').attr('max'))) {
  1199.                                 // Veuillez entrer un nombre valide.
  1200.                                 showMessage($question, i18ln_erreur7, 'red', 'before');
  1201.                             } else if ($form.find('[name="q' + questionN + '"]').val() < 50) {
  1202.                                 // Vous ne pouvez actuellement pas donner votre sang, car vous devez peser au minimum 50kg. C'est une condition légale, et ce dans le but de vous protéger. En effet, un don de sang ne peut pas dépasser 13% du volume sanguin total ; ce dernier dépend de la taille, du poids et du sexe.
  1203.                                 showMessage($question, i18ln_erreur8, 'red', 'after');
  1204.                             } else {
  1205.                                 if ($form.find('[name="q' + questionN + 'taille"]').val() == '') {
  1206.                                     // Veuillez répondre à la question.
  1207.                                     showMessage($question, i18ln_erreur1, 'red', 'before');
  1208.                                 } else if (isNaN($form.find('[name="q' + questionN + 'taille"]').val())) {
  1209.                                     // Veuillez entrer un nombre valide.
  1210.                                     showMessage($question, i18ln_erreur7, 'red', 'before');
  1211.                                 } else if ($form.find('[name="q' + questionN + 'taille"]').val() < parseInt($form.find('[name="q' + questionN + 'taille"]').attr('min')) || $form.find('[name="q' + questionN + 'taille"]').val() > parseInt($form.find('[name="q' + questionN + 'taille"]').attr('max'))) {
  1212.                                     // Veuillez entrer un nombre valide.
  1213.                                     showMessage($question, i18ln_erreur7, 'red', 'before');
  1214.                                 } else {
  1215.                                     var $poids = $form.find('[name="q' + questionN + '"]').val();
  1216.                                     var $taille = $form.find('[name="q' + questionN + 'taille"]').val();
  1217.                                     if (
  1218.                                         ($poids < 51 && $taille < 156) ||
  1219.                                         ($poids == 51 && $taille < 155) ||
  1220.                                         ($poids == 52 && $taille < 153) ||
  1221.                                         ($poids == 53 && $taille < 151) ||
  1222.                                         ($poids == 54 && $taille < 149) ||
  1223.                                         ($poids == 55 && $taille < 148) ||
  1224.                                         ($poids == 56 && $taille < 146)
  1225.                                     ) {
  1226.                                         // Attention ! La correspondance entre votre poids et votre taille ne convient pas pour donner votre sang.
  1227.                                         showMessage($question, i18ln_erreur8_2, 'red', 'after');
  1228.                                     } else {
  1229.                                         if ($('#form-quipeutdonnersonsang .next').prop("disabled") !== true) {
  1230.                                             showQuestion(questionN, "4");
  1231.                                         }
  1232.                                     }
  1233.                                 }
  1234.                             }
  1235.                             if($(this).hasClass('next-no-matter')) {
  1236.                                 showQuestion(questionN, "4");
  1237.                             }
  1238.                         }
  1239.                         // De 1980 à 1996, avez-vous séjourné plus de 6 mois (tous séjours confondus) au Royaume- Uni (Angleterre, Écosse, Pays de Galles et Irlande du Nord)?
  1240.                         else if (questionN == "4") {
  1241.                             if ($form.find('[name="q' + questionN + '"]:checked').val() == '') {
  1242.                                 // Veuillez répondre à la question.
  1243.                                 showMessage($question, i18ln_erreur1, 'red', 'before');
  1244.                             } else {
  1245.                                 if ($('#form-quipeutdonnersonsang .next').prop("disabled") !== true) {
  1246.                                     showQuestion(questionN, "5");
  1247.                                 }
  1248.                             }
  1249.                             if($(this).hasClass('next-no-matter')) {
  1250.                                 showQuestion(questionN, "5");
  1251.                             }
  1252.                         }
  1253.                         // Avez-vous voyagé hors de la Belgique ces 6 derniers mois?
  1254.                         else if (questionN == "5") {
  1255.                             if ($form.find('[name="q' + questionN + '"]:checked').val() == '') {
  1256.                                 // Veuillez répondre à la question.
  1257.                                 showMessage($question, i18ln_erreur1, 'red', 'before');
  1258.                             } else {
  1259.                                 if ($('#form-quipeutdonnersonsang .next').prop("disabled") !== true) {
  1260.                                     if ($form.find('[name="q' + questionN + '"]:checked').val() == 'Oui') {
  1261.                                         showQuestion(questionN, "5.1");
  1262.                                     } else {
  1263.                                         //alert($form.find('[name="q1"]:checked').val());
  1264.                                         if ($form.find('[name="q1"]:checked').val() == 'Femme') {
  1265.                                             showQuestion(questionN, "6");
  1266.                                         } else {
  1267.                                             showQuestion(questionN, "7");
  1268.                                         }
  1269.                                     }
  1270.                                 }
  1271.                             }
  1272.                             if($(this).hasClass('next-no-matter')) {
  1273.                                 if ($form.find('[name="q1"]:checked').val() == 'Femme') {
  1274.                                     showQuestion(questionN, "6");
  1275.                                 } else {
  1276.                                     showQuestion(questionN, "7");
  1277.                                 }
  1278.                             }
  1279.                         }
  1280.                         // Avez-vous voyagé à l’extérieur de l’Europe ?
  1281.                         else if (questionN == "5.1") {
  1282.                             if ($form.find('[name="q' + questionN + '"]:checked').val() == '') {
  1283.                                 // Veuillez répondre à la question.
  1284.                                 showMessage($question, i18ln_erreur1, 'red', 'before');
  1285.                             } else {
  1286.                                 if ($('#form-quipeutdonnersonsang .next').prop("disabled") !== true) {
  1287.                                     if ($form.find('[name="q1"]:checked').val() == 'Femme') {
  1288.                                         showQuestion(questionN, "6");
  1289.                                     } else {
  1290.                                         showQuestion(questionN, "7");
  1291.                                     }
  1292.                                 }
  1293.                             }
  1294.                             if($(this).hasClass('next-no-matter')) {
  1295.                                 if ($form.find('[name="q1"]:checked').val() == 'Femme') {
  1296.                                     showQuestion(questionN, "6");
  1297.                                 } else {
  1298.                                     showQuestion(questionN, "7");
  1299.                                 }
  1300.                             }
  1301.                         }
  1302.                         // Si répondu F à la Q1 : êtes-vous enceinte ou avez-vous accouché dans les 6 derniers mois ?
  1303.                         else if (questionN == "6") {
  1304.                             if ($form.find('[name="q' + questionN + '"]:checked').val() == '') {
  1305.                                 // Veuillez répondre à la question.
  1306.                                 showMessage($question, i18ln_erreur1, 'red', 'before');
  1307.                             } else {
  1308.                                 if ($('#form-quipeutdonnersonsang .next').prop("disabled") !== true) {
  1309.                                     if ($form.find('[name="q' + questionN + '"]:checked').val() == 'Non') {
  1310.                                         showQuestion(questionN, "7");
  1311.                                     }
  1312.                                 }
  1313.                             }
  1314.                             if($(this).hasClass('next-no-matter')) {
  1315.                                 showQuestion(questionN, "7");
  1316.                             }
  1317.                         }
  1318.                         // Q7 : Avez-vous eu récemment de la fièvre ou une infection (bronchite, infection urinaire...) ?
  1319.                         else if (questionN == "7") {
  1320.                             if ($('#form-quipeutdonnersonsang .next').prop("disabled") !== true) {
  1321.                                 showQuestion(questionN, "8");
  1322.                             }
  1323.                             if($(this).hasClass('next-no-matter')) {
  1324.                                 showQuestion(questionN, "8");
  1325.                             }
  1326.                         }
  1327.                         // Q8 : Prenez-vous des médicaments ?
  1328.                         else if (questionN == "8") {
  1329.                             // Veuillez répondre à la question.
  1330.                             //showMessage($question, i18ln_erreur1, 'red', 'before');
  1331.                             // if ($form.find('[name="q' + questionN + '"]:checked').val() == 'Non') {
  1332.                             //     disableNext();
  1333.                             // }
  1334.                             if ($form.find('[name="q' + questionN + '"]:checked').val() == '') {
  1335.                                 // Veuillez répondre à la question.
  1336.                                 showMessage($question, i18ln_erreur1, 'red', 'before');
  1337.                             } else {
  1338.                                 if ($('#form-quipeutdonnersonsang .next').prop("disabled") !== true) {
  1339.                                     if ($form.find('[name="q' + questionN + '"]:checked').val() == 'Non') {
  1340.                                         showQuestion(questionN, "9");
  1341.                                     }
  1342.                                 }
  1343.                             }
  1344.                             if($(this).hasClass('next-no-matter')) {
  1345.                                 showQuestion(questionN, "9");
  1346.                             }
  1347.                         }
  1348.                         // 9. Avez-vous été vacciné(e) il y a moins d’un mois ?
  1349.                         else if (questionN == "9") {
  1350.                             if ($form.find('[name="q' + questionN + '"]:checked').val() == '') {
  1351.                                 // Veuillez répondre à la question.
  1352.                                 showMessage($question, i18ln_erreur1, 'red', 'before');
  1353.                             } else {
  1354.                                 if ($('#form-quipeutdonnersonsang .next').prop("disabled") !== true) {
  1355.                                     if ($form.find('[name="q' + questionN + '"]:checked').val() != '') {
  1356.                                         showQuestion(questionN, "10");
  1357.                                     }
  1358.                                 }
  1359.                             }
  1360.                         }
  1361.                         // 10. Avez-vous subi une endoscopie (arthroscopie, gastroscopie, coloscopie…) ou une opération dans les 4 derniers mois ?
  1362.                         else if (questionN == "10") {
  1363.                             if ($form.find('[name="q' + questionN + '"]:checked').val() == '') {
  1364.                                 // Veuillez répondre à la question.
  1365.                                 showMessage($question, i18ln_erreur1, 'red', 'before');
  1366.                             } else {
  1367.                                 if ($('#form-quipeutdonnersonsang .next').prop("disabled") !== true) {
  1368.                                     if ($form.find('[name="q' + questionN + '"]:checked').val() == 'Non') {
  1369.                                         showQuestion(questionN, "11");
  1370.                                     }
  1371.                                 }
  1372.                             }
  1373.                             if($(this).hasClass('next-no-matter')) {
  1374.                                 showQuestion(questionN, "11");
  1375.                             }
  1376.                         }
  1377.                         // 11. êtes-vous allé.e chez le dentiste au cours des 7 derniers jours ?
  1378.                         else if (questionN == "11") {
  1379.                             if ($form.find('[name="q' + questionN + '"]:checked').val() == '') {
  1380.                                 // Veuillez répondre à la question.
  1381.                                 showMessage($question, i18ln_erreur1, 'red', 'before');
  1382.                             } else {
  1383.                                 if ($('#form-quipeutdonnersonsang .next').prop("disabled") !== true) {
  1384.                                     if ($form.find('[name="q' + questionN + '"]:checked').val() == 'Non' || $form.find('[name="q' + questionN + '"]:checked').val() == 'Oui') {
  1385.                                         showQuestion(questionN, "12");
  1386.                                     }
  1387.                                 }
  1388.                             }
  1389.                             if($(this).hasClass('next-no-matter')) {
  1390.                                 showQuestion(questionN, "12");
  1391.                             }
  1392.                         }
  1393.                         // 12. Avez-vous fait un piercing (y compris boucles d’oreilles) ou un tatouage (y compris maquillage permanent) durant ces 4 derniers mois ?
  1394.                         else if (questionN == "12") {
  1395.                             if ($form.find('[name="q' + questionN + '"]:checked').val() == '') {
  1396.                                 // Veuillez répondre à la question.
  1397.                                 showMessage($question, i18ln_erreur1, 'red', 'before');
  1398.                             } else {
  1399.                                 if ($('#form-quipeutdonnersonsang .next').prop("disabled") !== true) {
  1400.                                     if ($form.find('[name="q' + questionN + '"]:checked').val() == 'Non') {
  1401.                                         showQuestion(questionN, "13");
  1402.                                     }
  1403.                                 }
  1404.                             }
  1405.                             if($(this).hasClass('next-no-matter')) {
  1406.                                 showQuestion(questionN, "13");
  1407.                             }
  1408.                         }
  1409.                         // 13. Avez-vous déjà consommé de la drogue ?
  1410.                         else if (questionN == "13") {
  1411.                             if ($form.find('[name="q' + questionN + '"]:checked').val() == '') {
  1412.                                 // Veuillez répondre à la question.
  1413.                                 showMessage($question, i18ln_erreur1, 'red', 'before');
  1414.                             } else {
  1415.                                 if ($('#form-quipeutdonnersonsang .next').prop("disabled") !== true) {
  1416.                                     if ($form.find('[name="q' + questionN + '"]:checked').val() == 'Non' || $form.find('[name="q' + questionN + '"]:checked').val() == 'Oui') {
  1417.                                         if ($form.find('[name="q1"]:checked').val() == 'Femme') {
  1418.                                             showQuestion(questionN, "14");
  1419.                                         } else {
  1420.                                             showQuestion(questionN, "15");
  1421.                                         }
  1422.                                     }
  1423.                                 }
  1424.                             }
  1425.                             if($(this).hasClass('next-no-matter')) {
  1426.                                 if ($form.find('[name="q1"]:checked').val() == 'Femme') {
  1427.                                     showQuestion(questionN, "14");
  1428.                                 } else {
  1429.                                     showQuestion(questionN, "15");
  1430.                                 }
  1431.                             }
  1432.                         }
  1433.                         // 14. Si répondu F (femme) à la Q2: Avez-vous eu un.e nouveau.elle partenaire sexuel.le au cours des 4 derniers mois ? (avec ou sans préservatif)
  1434.                         else if (questionN == "14") {
  1435.                             if ($form.find('[name="q' + questionN + '"]:checked').val() == '') {
  1436.                                 // Veuillez répondre à la question.
  1437.                                 showMessage($question, i18ln_erreur1, 'red', 'before');
  1438.                             } else {
  1439.                                 if ($('#form-quipeutdonnersonsang .next').prop("disabled") !== true) {
  1440.                                     if ($form.find('[name="q' + questionN + '"]:checked').val() == 'Non') {
  1441.                                         showQuestion(questionN, "end");
  1442.                                         hideNext();
  1443.                                         hidePrev();
  1444.                                     }
  1445.                                 }
  1446.                             }
  1447.                             if($(this).hasClass('next-no-matter')) {
  1448.                                 showQuestion(questionN, "end");
  1449.                                 hideNext();
  1450.                                 hidePrev();
  1451.                             }
  1452.                         }
  1453.                         // 15. Si répondu H (hommme) à la Q2: Avez-vous eu une nouvelle partenaire sexuelle au cours des 4 derniers mois ? (avec ou sans préservatif)
  1454.                         else if (questionN == "15") {
  1455.                             if ($form.find('[name="q' + questionN + '"]:checked').val() == '') {
  1456.                                 // Veuillez répondre à la question.
  1457.                                 showMessage($question, i18ln_erreur1, 'red', 'before');
  1458.                             } else {
  1459.                                 if ($('#form-quipeutdonnersonsang .next').prop("disabled") !== true) {
  1460.                                     if ($form.find('[name="q' + questionN + '"]:checked').val() == 'Non') {
  1461.                                         showQuestion(questionN, "16");
  1462.                                     }
  1463.                                 }
  1464.                             }
  1465.                             if($(this).hasClass('next-no-matter')) {
  1466.                                 showQuestion(questionN, "16");
  1467.                             }
  1468.                         }
  1469.                         // 16. Si répondu H (hommme) à la Q2: Au cours des 12 derniers mois, avez-vous eu une relation sexuelle avec un homme ?
  1470.                         else if (questionN == "16") {
  1471.                             if ($form.find('[name="q' + questionN + '"]:checked').val() == '') {
  1472.                                 // Veuillez répondre à la question.
  1473.                                 showMessage($question, i18ln_erreur1, 'red', 'before');
  1474.                             } else {
  1475.                                 if ($('#form-quipeutdonnersonsang .next').prop("disabled") !== true) {
  1476.                                     if ($form.find('[name="q' + questionN + '"]:checked').val() == 'Non') {
  1477.                                         showQuestion(questionN, "end");
  1478.                                         hideNext();
  1479.                                         hidePrev();
  1480.                                     }
  1481.                                 }
  1482.                             }
  1483.                             if($(this).hasClass('next-no-matter')) {
  1484.                                 showQuestion(questionN, "end");
  1485.                                 hideNext();
  1486.                                 hidePrev();
  1487.                             }
  1488.                         }
  1489.                     });
  1490.                     $(document).on('change input cut copy paste', '#form-quipeutdonnersonsang :input', function () {
  1491.                         var $question = $(this).closest('[data-question]');
  1492.                         enableNext();
  1493.                         removeMessage($question)
  1494.                     });
  1495.                     $(document).on('change', '#form-quipeutdonnersonsang input[type="radio"]', function () {
  1496.                         var $question = $(this).closest('[data-question]');
  1497.                         if ($(this).attr('data-message') && $(this).attr('data-message') != 'false') {
  1498.                             showMessage($question, eval($(this).attr('data-message')), $(this).attr('data-color'), $(this).attr('data-where'));
  1499.                         } else {
  1500.                             removeMessage($question);
  1501.                         }
  1502.                         if($(this).hasClass('is-autovalidate')) {
  1503.                             $(this).parents('.uk-form-controls').find('.next').trigger( "click" );
  1504.                         }
  1505.                         if ($(this).attr('data-apk-toggle') == 'true' || $(this).attr('data-apk-toggle') == 'false') {
  1506.                             var toggleTarget = $(this).parents('[data-apk-toggle-target]').attr('data-apk-toggle-target');
  1507.                             if ($(this).attr('data-apk-toggle') == 'true') { // Note: Ajout du namespace 'atp' pour éviter des conflits avec d'autres functions JS (vendor)
  1508.                                 $(toggleTarget).show();
  1509.                                 $('#form-quipeutdonnersonsang .next-no-matter').removeClass('uk-hidden');
  1510.                             } else if ($(this).attr('data-apk-toggle') == 'false') {
  1511.                                 $(toggleTarget).hide();
  1512.                             }
  1513.                         }
  1514.                     });
  1515.                     $(document).on('change', '#form-quipeutdonnersonsang input[type="checkbox"]', function () {
  1516.                         var $question = $(this).closest('[data-question]');
  1517.                         if ($(this).prop('checked')) {
  1518.                             if ($(this).attr('data-message') && $(this).attr('data-message') != 'false') {
  1519.                                 showMessage($question, eval($(this).attr('data-message')), $(this).attr('data-color'), $(this).attr('data-where'));
  1520.                                 $('#form-quipeutdonnersonsang .next-no-matter').removeClass('uk-hidden');
  1521.                             }
  1522.                         } else {
  1523.                             var $question = $(this).closest('[data-question]');
  1524.                             var where = $(this).parents('[data-apk-where]').attr('data-apk-where');
  1525.                             //var message =  $(this).parents('[data-apk-message]').attr('data-apk-message');
  1526.                             var message = eval($(this).parents('[data-apk-message]').attr('data-apk-message'))
  1527.                             var countElementChecked = $(this).parents('[data-apk-message]').find('input:checked').length;
  1528.                             var $error = $form.find('.question-message-' + where);
  1529.                             var $errorContainer = $form.find('.question-message-container-complement');
  1530.                             if (countElementChecked >= 1) {
  1531.                                 if ($errorContainer.hasClass('is-not-empty') == false) {
  1532.                                     $errorContainer.addClass('is-not-empty')
  1533.                                 }
  1534.                                 $error.html(message);
  1535.                                 /*if( $question.attr('data-question') == "8" && ($form.find('[name="q8"]:checked').val() == 'Oui')) {
  1536.                                     $('#form-quipeutdonnersonsang .next-no-matter').removeClass('uk-hidden');
  1537.                                 }*/
  1538.                             } else {
  1539.                                 if ($errorContainer.hasClass('is-not-empty') == true) {
  1540.                                     $errorContainer.removeClass('is-not-empty')
  1541.                                 }
  1542.                                 $error.html('');
  1543.                             }
  1544.                             var currentWhere = $(this).attr('data-where');
  1545.                             var countWhere = $question.find('input[data-where=' + currentWhere + ']:checked').length;
  1546.                             //console.log(countWhere);
  1547.                             if (countWhere == 0) {
  1548.                                 //alert('DELETE: .question-message-' + currentWhere);
  1549.                                 if(currentWhere=='after'){
  1550.                                     alert('after checkbox');
  1551.                                 } else {
  1552.                                     $form.find('.question-message-' + currentWhere).html('');
  1553.                                 }
  1554.                             }
  1555.                             $('#form-quipeutdonnersonsang .next-no-matter').removeClass('uk-hidden');
  1556.                         }
  1557.                         if ($question.attr('data-question') == "9") {
  1558.                             if (
  1559.                                 $("input[name='q9.1']").prop("checked") == false &&
  1560.                                 $("input[name='q9.2']").prop("checked") == false &&
  1561.                                 $("input[name='q9.3']").prop("checked") == false &&
  1562.                                 $("input[name='q9.4']").prop("checked") == false &&
  1563.                                 $("input[name='q9.5']").prop("checked") == false &&
  1564.                                 $("input[name='q9.7']").prop("checked") == false &&
  1565.                                 $("input[name='q9.6']").prop("checked") == true
  1566.                             ) {
  1567.                                 //$form.find('.question-message-title-common').hide();
  1568.                                 $form.find('.question-message-complement_common').html('');
  1569.                             } else {
  1570.                                 //$form.find('.question-message-title-common').show();
  1571.                             }
  1572.                         }
  1573.                     });
  1574.                     /* $('[data-question="8"] .has-serialize-checkbox label').on('click', function () {
  1575.                         //if($("#toggle-q8-yes").css('display')=='block'){
  1576.                         serializeCheckbox($("#toggle-q8-yes :input[type='checkbox']"));
  1577.                         //}
  1578.                     });*/
  1579.                     $(document).on('change', '[data-question="8"] .has-serialize-checkbox input[type="checkbox"]', function () {
  1580.                         var element = '[data-question="8"] .has-serialize-checkbox label';
  1581.                         var q8_1 = [], q8_2 = [], q8_3 = [], q8_4 = [], q8_5 = [];
  1582.                         $(element + " input[name='q8.1']:checked").each(function () {
  1583.                             q8_1.push($(this).val());
  1584.                         });
  1585.                         $(element + " input[name='q8.2']:checked").each(function () {
  1586.                             q8_2.push($(this).val());
  1587.                         });
  1588.                         $(element + " input[name='q8.3']:checked").each(function () {
  1589.                             q8_3.push($(this).val());
  1590.                         });
  1591.                         $(element + " input[name='q8.4']:checked").each(function () {
  1592.                             q8_4.push($(this).val());
  1593.                         });
  1594.                         $(element + " input[name='q8.5']:checked").each(function () {
  1595.                             q8_5.push($(this).val());
  1596.                         });
  1597.                         var q8_6 = $(element + " input[name='q8.6']");
  1598.                         //console.log(JSON.stringify([q8_1, q8_2, q8_3]));
  1599.                         // console.log('1:'+q8_1.join(", "));
  1600.                         // console.log('2:'+q8_2.join(", "));
  1601.                         // console.log('3:'+q8_3.join(", "));
  1602.                     /* var containerMessage1 = $(this).closest('[data-question]').find('.question-message-complement_1');
  1603.                         var containerMessage2 = $(this).closest('[data-question]').find('.question-message-complement_2');
  1604.                         var containerMessage3 = $(this).closest('[data-question]').find('.question-message-complement_3');
  1605.                         var containerMessage4 = $(this).closest('[data-question]').find('.question-message-complement_4');
  1606.                         var containerMessage5 = $(this).closest('[data-question]').find('.question-message-complement_5');
  1607.                         var containerMessage6 = $(this).closest('[data-question]').find('.question-message-complement_6');
  1608.                         var containerMessageCommon = $(this).closest('[data-question]').find('.question-message-common');*/
  1609.                         var containerMessage1 = $form.find('.question-message-complement_1');
  1610.                         var containerMessage2 = $form.find('.question-message-complement_2');
  1611.                         var containerMessage3 = $form.find('.question-message-complement_3');
  1612.                         var containerMessage4 = $form.find('.question-message-complement_4');
  1613.                         var containerMessage5 = $form.find('.question-message-complement_5');
  1614.                         var containerMessage6 = $form.find('.question-message-complement_6');
  1615.                         var containerMessageCommon = $form.find('.question-message-common');
  1616.                         if (q8_1 != '') {
  1617.                             var containerMessage1Updated = i18ln_complement_14_1.replace("[[CHOICE]]", '<strong>' + q8_1.join(", ") + '</strong>');
  1618.                             containerMessage1.html(containerMessage1Updated);
  1619.                         } else {
  1620.                             containerMessage1.html('');
  1621.                         }
  1622.                         if (q8_2 != '') {
  1623.                             var containerMessage2Updated = i18ln_complement_14_2.replace("[[CHOICE]]", '<strong>' + q8_2.join(", ") + '</strong>');
  1624.                             containerMessage2.html(containerMessage2Updated);
  1625.                         } else {
  1626.                             containerMessage2.html('');
  1627.                         }
  1628.                         if (q8_3 != '') {
  1629.                             var containerMessage3Updated = i18ln_complement_14_3.replace("[[CHOICE]]", '<strong>' + q8_3.join(", ") + '</strong>');
  1630.                             containerMessage3.html(containerMessage3Updated);
  1631.                         } else {
  1632.                             containerMessage3.html('');
  1633.                         }
  1634.                         if (q8_4 != '') {
  1635.                             var containerMessage4Updated = i18ln_complement_14_4.replace("[[CHOICE]]", '<strong>' + q8_4.join(", ") + '</strong>');
  1636.                             containerMessage4.html(containerMessage4Updated);
  1637.                         } else {
  1638.                             containerMessage4.html('');
  1639.                         }
  1640.                         if (q8_5 != '') {
  1641.                             var containerMessage5Updated = i18ln_complement_14_5.replace("[[CHOICE]]", '<strong>' + q8_5.join(", ") + '</strong>');
  1642.                             containerMessage5.html(containerMessage5Updated);
  1643.                         } else {
  1644.                             containerMessage5.html('');
  1645.                         }
  1646.                         if (q8_6.prop('checked')) {
  1647.                             containerMessage6.html(i18ln_complement_14_6);
  1648.                         } else {
  1649.                             containerMessage6.html('');
  1650.                         }
  1651.                         if (q8_1 != '' || q8_2 != '' || q8_3 != '' || q8_4 != '' || q8_5 != '' || q8_6 != '') {
  1652.                             containerMessageCommon.html(i18ln_complement_14_common);
  1653.                         } else {
  1654.                             containerMessageCommon.html('');
  1655.                         }
  1656.                         $('#form-quipeutdonnersonsang .next-no-matter').removeClass('uk-hidden');
  1657.                     });
  1658.                     if ($('[data-apk-message]').length) {
  1659.                         $('[data-apk-message] label').on('click', function (e) {
  1660.                             //e.preventDefault();
  1661.                             var $question = $(this).closest('[data-question]');
  1662.                             var where = $(this).parents('[data-apk-where]').attr('data-apk-where');
  1663.                             //var message =  $(this).parents('[data-apk-message]').attr('data-apk-message');
  1664.                             var message = eval($(this).parents('[data-apk-message]').attr('data-apk-message'));
  1665.                             var countElementChecked = $(this).parents('[data-apk-message]').find('input:checked').length;
  1666.                             var $error = $form.find('.question-message-' + where);
  1667.                             var $errorContainer = $form.find('.question-message-container-complement');
  1668.                             if (countElementChecked >= 1) {
  1669.                                 if ($errorContainer.hasClass('is-not-empty') == false) {
  1670.                                     $errorContainer.addClass('is-not-empty')
  1671.                                 }
  1672.                                 $error.html(message);
  1673.                             } else {
  1674.                                 if ($errorContainer.hasClass('is-not-empty') == true) {
  1675.                                     $errorContainer.removeClass('is-not-empty')
  1676.                                 }
  1677.                                 $error.html('');
  1678.                             }
  1679.                             var currentWhere = $(this).find('input').attr('data-where');
  1680.                             var countWhere = $question.find('input[data-where=' + currentWhere + ']:checked').length;
  1681.                             //console.log(countWhere);
  1682.                             if (countWhere == 0) {
  1683.                                 //alert('DELETE: .question-message-' + currentWhere);
  1684.                                 $question.find('.question-message-' + currentWhere).html('');
  1685.                             }
  1686.                         });
  1687.                     }
  1688.                     /*$(document).on('change', '#form-quipeutdonnersonsang .has-apk-toggle [data-apk-toggle]', function () {
  1689.                         if($(this).attr('data-apk-toggle') && $(this).attr('data-apk-toggle')!='false') {
  1690.                         } else {
  1691.                         }
  1692.                     });*/
  1693.                 })(jQuery);
  1694.                 
  1695.             });
  1696.         </script>
  1697.     {% endif %}
  1698.     {% endblock %}