Subversion Repositories eFlore/Applications.cel

Rev

Rev 3857 | Show entire file | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 3857 Rev 3897
Line 1... Line 1...
1 
"use strict";
 1 
import {potDeMiel} from './utils.js';
- 
 
 2 
import {displayFields} from './display.js';
- 
 
 3 
import {initGeoloc} from './geoloc.js';
- 
 
 4 
import {displayClassicFields} from './preview.js';
- 
 
 5 
import {ChampsSupp} from './ChampsSupp.js';
Line 2... Line -...
2 
 
 - 
 
3 
/*************************************
 6 
 
4 
 *  Fonctions de Style et Affichage  *
 7 
jQuery( document ).ready(function () {
5 
 *      des éléments "spéciaux"      *
 - 
 
Line 6... Line -...
6 
 *************************************/
 - 
 
7 
 
 - 
 
8 
// Logique d'affichage pour le input type=file
 - 
 
9 
function inputFile() {
 - 
 
10 
  // Initialisation des variables
 - 
 
11 
  var $fileInput  = $( '.input-file' ),
 - 
 
12 
      $button     = $( '.label-file' ),
 - 
 
13 
      thisId = '';
 - 
 
14 
  // Action lorsque la "barre d'espace" ou "Entrée" est pressée
 - 
 
15 
  $( '.label-file' ).keydown( function( event ) {
 - 
 
16 
    if ( event.keyCode == 13 || event.keyCode == 32 ) {
 - 
 
17 
      $( '#' + $( this ).attr( 'for' ) + '.input-file' ).focus();
 - 
 
18 
    }
 - 
 
19 
  });
 - 
 
20 
  // Action lorsque le label est cliqué
 - 
 
21 
  $( '.label-file' ).click( function(event) {
 - 
 
22 
    $( '#' + $( this ).attr( 'for' ) + '.input-file' ).focus();
 - 
 
23 
    return false;
 - 
 
24 
  });
 - 
 
25 
  // Affiche un retour visuel dès que input:file change
 - 
 
26 
  $fileInput.change( function( event ) {
 - 
 
27 
    // Il est possible de supprimer un fichier
 - 
 
28 
    // donc on vérifie que le 'change' est un ajout ou modificationis-defaut-value
 - 
 
29 
    if( !$.isEmptyObject( event.target.files[0] ) ) {
 - 
 
30 
 
 - 
 
31 
      var file = event.target.files[0],
 - 
 
32 
          fileInputId = $( this ).attr( 'id' ),
 - 
 
33 
          $theReturn = $( '.' + fileInputId );
 - 
 
34 
      // Affichage du nom du fichier
 - 
 
35 
      $theReturn.text( file.name ).removeClass( 'hidden') ;
 - 
 
36 
 
 - 
 
37 
      if( 5242880 < file.size ) {
 - 
 
38 
        $theReturn.append(
 - 
 
39 
          '<p class="message">'+
 - 
 
40 
            '<i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i> '+
 - 
 
41 
            'La taille du fichier ne doit pas dépasser 5Mo'+
 - 
 
42 
          '</p>'
 - 
 
43 
        )
 - 
 
44 
        .addClass( 'invalid' );
 - 
 
45 
        // lib : https://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js
 - 
 
46 
        $( this ).clearInputs();
 - 
 
47 
        console.log(file);
 - 
 
48 
 
 - 
 
49 
      } else if( file.type.match( 'image/*' ) && 'especes' !== fileInputId ) {
 - 
 
50 
      // Si le fichier est une image (et qu'on est pas sur "especes") on l'affiche
 - 
 
51 
        // Chemin temporaire de l'image et affichage
 - 
 
52 
        var tmppath = URL.createObjectURL( file );
 - 
 
53 
        $theReturn.append( '<img src="' + tmppath + '" width="50%">' ).removeClass( 'invalid' );;
 - 
 
54 
 
 - 
 
55 
      } else if ( !( 'especes' === fileInputId && file.type.match( 'text/(:?csv|tab-separated-values)' ) ) ) {
 - 
 
56 
        // on a pas un type image, ou on est sur une liste d'espèces mais on a pas un csv
 - 
 
57 
        console.log(file.type);
 - 
 
58 
 
 - 
 
59 
        if( 'especes' === fileInputId ) {// cas où on demandait un csv
 - 
 
60 
          $theReturn.append(
 - 
 
61 
            '<p class="message">'+
 - 
 
62 
              '<i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i> '+
 - 
 
63 
              'Le fichier doit être au format csv ou tsv'+
 - 
 
64 
            '</p>'
 - 
 
65 
          )
 - 
 
66 
          .addClass( 'invalid' );
 - 
 
67 
        } else { // cas où on demandait un format image
 - 
 
68 
          $theReturn.append(
 - 
 
69 
            '<p class="message">'+
 - 
 
70 
              '<i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i> '+
 - 
 
71 
              'Le fichier doit être au format image (jpg, png, etc.)'+
 - 
 
72 
            '</p>'
 - 
 
73 
          )
 - 
 
74 
          .addClass( 'invalid' );
 - 
 
75 
        }
 - 
 
76 
        // lib : https://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js
 - 
 
77 
        $( this ).clearInputs();
 - 
 
78 
        console.log(file);
 - 
 
79 
      } else {// file "especes" csv ok
 - 
 
80 
        $theReturn.append( ' <i class="fa fa-check-circle" aria-hidden="true" style="color:#B3C954;font-size:1.3rem"></i>' ).removeClass( 'invalid' );
 - 
 
81 
      }
 - 
 
82 
    }
 - 
 
83 
  });
 - 
 
84 
  // Annuler le téléchargement
 - 
 
85 
  $( '.remove-file' ).click( function() {
 - 
 
86 
    var $thisFileInput = $( this ).prev( '.input-file-container' ).find( '.input-file' );
 - 
 
87 
    // lib : https://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js
 - 
 
88 
    $thisFileInput.clearInputs();
 - 
 
89 
    $thisFileInput.triggerHandler( 'change' );
 - 
 
90 
    // $thisFileInput.unwrap();
 - 
 
91 
    $( this ).next( '.file-return' ).addClass( 'hidden' ).empty();
 - 
 
92 
  });
 - 
 
93 
}
 - 
 
94 
 
 - 
 
95 
// Style et affichage des list-checkboxes
 - 
 
96 
function inputListCheckbox() {
 - 
 
97 
  // On écoute le click sur une list-checkbox ('.selectBox')
 - 
 
98 
  // à tout moment de son insertion dans le dom
 - 
 
99 
  $( '#zone-appli' ).on( 'click' , '.selectBox' , function() {
 - 
 
100 
    $( '.checkboxes[data-id="' + $(this).data( 'id' ) + '"]' ).toggleClass( 'hidden' );
 - 
 
101 
  });
 - 
 
102 
}
 - 
 
103 
 
 - 
 
104 
// Style et affichage des input type="range"
 - 
 
105 
function inputRangeDisplayNumber() {
 - 
 
106 
  $( '#zone-appli' ).on( 'input' , 'input[type="range"]' , function () {
 - 
 
107 
    $( this ).siblings( '.range-live-value' ).text( $( this ).val() );
 - 
 
108 
  });
 - 
 
109 
}
 - 
 
110 
 
 - 
 
111 
/***********************************************************
 - 
 
112 
 *  Fonctions pour la création des champs supplémentaires  *
 - 
 
113 
 ***********************************************************/
 - 
 
114 
 
 - 
 
115 
// Logique globale pour l'ajout de nouveaux champs
 - 
 
116 
function onClickAddNewFields( fieldIndex ) {
 - 
 
117 
  // Bouton ajouter un champ
 - 
 
118 
  $( '#add-fields' ).click( function() {
 - 
 
119 
    // Affichage du formulaire pour un champ
 - 
 
120 
    displayNewField( fieldIndex );
 - 
 
121 
    // Affichage du nom du champ
 - 
 
122 
    onChangeDisplayFieldLabel( fieldIndex );
 - 
 
123 
    // Empêcher de créer plus d'une fois la même clé
 - 
 
124 
    onChangeCheckKeyUnique();
 - 
 
125 
    // Affichage des images/nom des documents importés dans les champs ajoutés
 - 
 
126 
    inputFile();
 - 
 
127 
    // Recueil des informations correspondantes au nouveau champ
 - 
 
128 
    onChangeFieldTypeCollectDetails( fieldIndex );
 - 
 
129 
    // Suppression d'un champ
 - 
 
130 
    onClickRemoveField();
 - 
 
131 
 
 - 
 
132 
    fieldIndex++;
 - 
 
133 
  });
 - 
 
134 
}
 - 
 
135 
 
 - 
 
136 
// Création/affichage du formulaire d'un nouveau champ
 - 
 
137 
function displayNewField( fieldIndex ) {
 - 
 
138 
  // Html du formulaire du nouveaux champs inséré dans le dom
 - 
 
139 
  $( '#new-fields' ).append(
 - 
 
140 
    '<fieldset data-id="' + fieldIndex + '" class="new-field">'+
 - 
 
141 
      '<h3>Nouveau champ :<br><strong class="field-title" data-id="' + fieldIndex + '"></strong></h3>'+
 - 
 
142 
      // Nom du champ
 - 
 
143 
      '<div class="row">'+
 - 
 
144 
        '<div class="col-sm-12 mt-3 mb-3">'+
 - 
 
145 
          '<label for="field-name" title="Donnez un titre à votre champ">Nom du champ *</label>'+
 - 
 
146 
          '<input type="text" name="field-name" data-id="' + fieldIndex + '" class="field-name form-control" placeholder="Titre de votre champ" title="Le titre du champ" required>'+
 - 
 
147 
        '</div>'+
 - 
 
148 
        // Clé du champ
 - 
 
149 
        '<div class="col-sm-12 mt-3 mb-3">'+
 - 
 
150 
          '<label for="field-key" title="Nom du champ dans la base de données">'+
 - 
 
151 
            'Clé du champ *'+
 - 
 
152 
          '</label>'+
 - 
 
153 
          '<input type="text" name="field-key" data-id="' + fieldIndex + '" class="field-key form-control" placeholder="Clé du champ" pattern="^(?:[a-z]+(?:(?:[A-Z]+[a-z]+)+)?|[a-z]+(?:(?:-[a-z]+)+)?)$" title="Clé Unique en Camelcase ou minuscule séparés par tirets, pas d\'accents pas de caractères spéciaux." required>'+
 - 
 
154 
        '</div>'+
 - 
 
155 
        '<p class="message m-2">' +
 - 
 
156 
          '<i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i> '+
 - 
 
157 
          'Une clé doit être unique<br>' +
 - 
 
158 
          'En "camelCase" (ecriture chameau)<br>'+
 - 
 
159 
          'Ou en minuscule avec tirets ("-") si nécessaire<br>'+
 - 
 
160 
          'Pas d\'espaces, aucuns caractères spéciaux (accents, cédilles, etc.).' +
 - 
 
161 
        '</p>' +
 - 
 
162 
        // Type de champ
 - 
 
163 
        '<div class="col-sm-12 mt-3 mb-3 add-field-select" data-id="' + fieldIndex + '">'+
 - 
 
164 
          '<label for="field-element" title="Quel type de champ">Type de champ *</label>'+
 - 
 
165 
          '<select name="field-element" data-id="' + fieldIndex + '" class="field-element form-control custom-select">'+
 - 
 
166 
            '<option value="text">Champ texte</option>'+
 - 
 
167 
            '<option value="email">Champ email</option>'+
 - 
 
168 
            '<option value="textarea">Champ rédaction</option>'+
 - 
 
169 
            '<option value="select">Menu déroulant</option>'+
 - 
 
170 
            '<option value="checkbox">Cases à cocher</option>'+
 - 
 
171 
            '<option value="list-checkbox">Liste de cases à cocher</option>'+
 - 
 
172 
            '<option value="radio">Boutons radio</option>'+
 - 
 
173 
            '<option value="date">Calendrier</option>'+
 - 
 
174 
            '<option value="range">Curseur (entre 2 bornes)</option>'+
 - 
 
175 
            '<option value="number">Nombre</option>'+
 - 
 
176 
          '</select>'+
 - 
 
177 
        '</div>'+
 - 
 
178 
        // Checkbox "champ requis"
 - 
 
179 
        '<div class="col-sm-12 radio mt-3 mb-3">'+
 - 
 
180 
          '<label class="radio-label" for="field-is_mandatory" title="Ce champ est obligatoire">'+
 - 
 
181 
            '<input type="checkbox" name="field-is_mandatory" data-id="' + fieldIndex + '" class="field-is_mandatory form-control">'+
 - 
 
182 
            'Champ requis ?'+
 - 
 
183 
          '</label>'+
 - 
 
184 
        '</div>'+
 - 
 
185 
        // Unité des valeurs
 - 
 
186 
        '<div class="col-sm-12 mt-3 mb-3">'+
 - 
 
187 
          '<label for="field-unit" title="Unité de mesure de vos valeurs">Unités ( cm, kg, ha, etc.)</label>'+
 - 
 
188 
          '<input type="text" name="field-unit" data-id="' + fieldIndex + '" class="field-unit form-control" placeholder="symbole de vos unités">'+
 - 
 
189 
        '</div>'+
 - 
 
190 
        // Tooltip
 - 
 
191 
        '<div class="col-sm-12 mt-3 mb-3">'+
 - 
 
192 
          '<label for="field-description" title="Ajoutez une info-bulle">Info-bulle</label>'+
 - 
 
193 
          '<input type="text" name="field-description" data-id="' + fieldIndex + '" class="field-description form-control" placeholder="Quelques mots">'+
 - 
 
194 
        '</div>'+
 - 
 
195 
        // Import d'une image d'aide à afficher en popup
 - 
 
196 
        '<div class="input-file-row row">'+
 - 
 
197 
          '<div class="input-file-container col-sm-10">'+
 - 
 
198 
            '<input type="file" class="input-file field-help" name="field-help' + fieldIndex + '" data-id="' + fieldIndex + '" id="help-doc-' + fieldIndex + '" accept="image/*">'+
 - 
 
199 
            '<label for="field-help' + fieldIndex + '" class="label-file"><i class="fas fa-download"></i> Popup aide image (.jpg)</label>'+
 - 
 
200 
          '</div>'+
 - 
 
201 
          '<div class="btn btn-danger btn-sm remove-file" name="remove-file" data-id="' + fieldIndex + '" title="Supprimer le fichier"><i class="fas fa-times" aria-hidden="true"></i></div>'+
 - 
 
202 
          '<div class="file-return help-doc-' + fieldIndex + ' hidden"></div>'+
 - 
 
203 
        '</div>'+
 - 
 
204 
        // Boutons supprimer
 - 
 
205 
        '<div class="col-sm-12 mt-3 mb-3">'+
 - 
 
206 
          '<label for="remove-field">Supprimer</label>'+
 - 
 
207 
          '<div class="remove-field button" name="remove-field" data-id="' + fieldIndex + '" title="Supprimer un champ"><i class="fa fa-skull" aria-hidden="true"></i></div>'+
 - 
 
208 
        '</div>'+
 - 
 
209 
      '</div>'+
 - 
 
210 
    '</fieldset>'
 - 
 
211 
  );
 - 
 
212 
  // Animation de l'affichage
 - 
 
213 
  $( 'fieldset.new-field[data-id="' + fieldIndex + '"]').hide().show( 200 );
 - 
 
214 
  $( 'html, body' ).stop().animate({
 - 
 
215 
    scrollTop: $( 'fieldset.new-field[data-id="' + fieldIndex + '"]' ).offset().top
 - 
 
216 
  }, 300 );
 - 
 
217 
}
 - 
 
218 
 
 - 
 
219 
// Affichage du nom du champ dès qu'il est renseigné
 - 
 
220 
function onChangeDisplayFieldLabel( fieldIndex ) {
 - 
 
221 
  $('.field-name[data-id="' + fieldIndex + '"]').change( function() {
 - 
 
222 
    $( '.field-title[data-id="' + fieldIndex + '"]' ).text( $( this ).val() );
 - 
 
223 
  });
 - 
 
224 
}
 - 
 
225 
 
 - 
 
226 
// Supprimer un nouveau champ
 - 
 
227 
function onClickRemoveField () {
 - 
 
228 
  $( '.remove-field' ).click( function() {
 - 
 
229 
    $( this ).closest('fieldset').hide( 200 , function () {
 - 
 
230 
      $( this ).remove();
 - 
 
231 
    });
 - 
 
232 
  });
 - 
 
233 
}
 - 
 
234 
 
 - 
 
235 
 
 - 
 
236 
/**** Recueil des informations et détails qui dépendent du type de champ choisi ****/
 - 
 
237 
 
 - 
 
238 
// Logique de recueil d'informations en fonction du type de champ choisi
 - 
 
239 
function onChangeFieldTypeCollectDetails( fieldIndex ) {
 - 
 
240 
  // On insère les champs par défaut de recueil d'informations
 - 
 
241 
  displayFieldDetailsCollect(
 - 
 
242 
    fieldIndex,
 - 
 
243 
    // Placeholder (champ type text par défaut)
 - 
 
244 
    '<div class="col-sm-12  mt-3">'+
 - 
 
245 
      '<label for="aide-saisie" title="Aidez les utilisateurs en deux ou 3 mots ou chiffres à comprendre ce que doit contenir ce champ">Texte d\'aide à la saisie</label>'+
 - 
 
246 
      '<input type="text" name="aide-saisie" data-id="' + fieldIndex + '" class="aide-saisie form-control" placeholder="Ce que doit contenir ce champ">'+
 - 
 
247 
    '</div>'
 - 
 
248 
  );
 - 
 
249 
  // Sinon :
 - 
 
250 
  $( '.field-element[data-id="' + fieldIndex + '"]' ).change( function() {
 - 
 
251 
    // On intialise l'index pour les listes la variable qui contiendra un id pour chaque option
 - 
 
252 
    var valueIndex = 0;
 - 
 
253 
    // Si on hésite on qu'on se trompe dans la liste :
 - 
 
254 
    // les champs de détails de l'option précédente doivent être supprimés
 - 
 
255 
    $( '.field-details[data-id="' + fieldIndex + '"]' ).hide( 200 , function () {
 - 
 
256 
      $( this ).remove();
 - 
 
257 
    });
 - 
 
258 
 
 - 
 
259 
    // Html de recueil de données en fonction de l'élément choisi
 - 
 
260 
    switch( $( this ).val() ) {
 - 
 
261 
      case 'range':
 - 
 
262 
      case 'number':
 - 
 
263 
        displayFieldDetailsCollect(
 - 
 
264 
          fieldIndex,
 - 
 
265 
          '<p class="message">'+
 - 
 
266 
            '<i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i> '+
 - 
 
267 
            'Ne pas oublier de prévisualiser !!<br>'+
 - 
 
268 
            'Vérifier le bon fonctionnement et changer, si nécessaire, les valeurs de défaut, incrémentation (step), min et max.<br>'+
 - 
 
269 
            'Si le navigateur considère que certaines valeurs sont incohérentes il pourrait les modifier automatiquement'+
 - 
 
270 
          '</p>' +
 - 
 
271 
          // Placeholder
 - 
 
272 
          '<div class="col-sm-12  mt-3">'+
 - 
 
273 
            '<label for="aide-saisie" title="Deux ou 3 mots ou chiffres pour comprendre ce que doit contenir ce champ (ex: min 20, 10 par 10, etc.)">Texte d\'aide à la saisie</label>'+
 - 
 
274 
            '<input type="text" name="aide-saisie" data-id="' + fieldIndex + '" class="aide-saisie form-control" placeholder="Ce que doit contenir ce champ">'+
 - 
 
275 
          '</div>'+
 - 
 
276 
          // Valeur par défaut
 - 
 
277 
          '<div class="col-sm-12  mt-3">'+
 - 
 
278 
            '<label for="default" title="Valeur par défaut">Valeur par défaut</label>'+
 - 
 
279 
            '<input type="number" name="default" data-id="' + fieldIndex + '" class="default form-control" step="0.01" lang="en">'+
 - 
 
280 
          '</div>'+
 - 
 
281 
          // Incrémentation ( attribut step="" )
 - 
 
282 
          '<div class="col-sm-12  mt-3">'+
 - 
 
283 
            '<label for="step" title="De 10 en 10, de 0.5 en 0.5, etc.">Incrémentation (step)</label>'+
 - 
 
284 
            '<input type="number" name="step" data-id="' + fieldIndex + '" class="step form-control" step="0.01" value="1" lang="en">'+
 - 
 
285 
          '</div>'+
 - 
 
286 
          // Min
 - 
 
287 
          '<div class="col-sm-12  mt-3">'+
 - 
 
288 
            '<label for="min" title="valeur min">Valeur minimale</label>'+
 - 
 
289 
            '<input type="number" name="min" data-id="' + fieldIndex + '" class="min form-control" step="0.01" value="0" lang="en">'+
 - 
 
290 
          '</div>'+
 - 
 
291 
          // Max
 - 
 
292 
          '<div class="col-sm-12  mt-3">'+
 - 
 
293 
            '<label for="max" title="valeur max">Valeur maximale</label>'+
 - 
 
294 
            '<input type="number" name="max" data-id="' + fieldIndex + '" class="max form-control" step="0.01" value="1" lang="en">'+
 - 
 
295 
          '</div>'
 - 
 
296 
        );
 - 
 
297 
        break;
 - 
 
298 
 
 - 
 
299 
      case 'date':
 - 
 
300 
        displayFieldDetailsCollect(
 - 
 
301 
          fieldIndex,
 - 
 
302 
          // Date min
 - 
 
303 
          '<div class="col-sm-12 mt-3">'+
 - 
 
304 
            '<label for="min" title="date min">Date minimale</label>'+
 - 
 
305 
            '<input type="date" name="min" data-id="' + fieldIndex + '" class="min form-control" pattern="(^(((0[1-9]|1[0-9]|2[0-8])[\/](0[1-9]|1[012]))|((29|30|31)[\/](0[13578]|1[02]))|((29|30)[\/](0[4,6,9]|11)))[\/](19|[2-9][0-9])\d\d$)|(^29[\/]02[\/](19|[2-9][0-9])(00|04|08|12|16|20|24|28|32|36|40|44|48|52|56|60|64|68|72|76|80|84|88|92|96)$)" title="jj/mm/aaaa">'+
 - 
 
306 
          '</div>'+
 - 
 
307 
          // Date max
 - 
 
308 
          '<div class="col-sm-12 mt-3">'+
 - 
 
309 
            '<label for="max" title="date max">Date maximale</label>'+
 - 
 
310 
            '<input type="date" name="max" data-id="' + fieldIndex + '" class="max form-control"  pattern="(^(((0[1-9]|1[0-9]|2[0-8])[\/](0[1-9]|1[012]))|((29|30|31)[\/](0[13578]|1[02]))|((29|30)[\/](0[4,6,9]|11)))[\/](19|[2-9][0-9])\d\d$)|(^29[\/]02[\/](19|[2-9][0-9])(00|04|08|12|16|20|24|28|32|36|40|44|48|52|56|60|64|68|72|76|80|84|88|92|96)$)" title="jj/mm/aaaa">'+
 - 
 
311 
          '</div>'
 - 
 
312 
        );
 - 
 
313 
        break;
 - 
 
314 
 
 - 
 
315 
      case 'select':
 - 
 
316 
      case 'checkbox':
 - 
 
317 
      case 'list-checkbox':
 - 
 
318 
      case 'radio':
 - 
 
319 
        displayFieldDetailsCollect(
 - 
 
320 
          fieldIndex,
 - 
 
321 
          '<p class="message element-message">' +
 - 
 
322 
            '<i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i> ' +
 - 
 
323 
            'Entrez au moins une valeur de ' + $( this ).children( 'option:selected' ).text() +
 - 
 
324 
            '<br>Si aucun label à afficher n\'est indiqué, la valeur entrée sera utilisée (première lettre en majuscule).'+
 - 
 
325 
          '</p>'+
 - 
 
326 
          // Première option
 - 
 
327 
          '<div class="new-value center-block row" data-list-value-id="' + valueIndex +'">'+
 - 
 
328 
            // Recueil d'une valeur de la liste
 - 
 
329 
            '<div class="col-sm-12 mt-3">'+
 - 
 
330 
              '<label for="list-value">Valeur *</label>'+
 - 
 
331 
              '<input type="text" name="list-value" data-id="' + fieldIndex + '" class="list-value form-control" data-list-value-id="' + valueIndex +'" placeholder="Une des valeurs de la liste" required>'+
 - 
 
332 
            '</div>' +
 - 
 
333 
            // Recueil du label à afficher
 - 
 
334 
            '<div class="col-sm-12 mt-3">'+
 - 
 
335 
              '<label for="displayed-label">Label</label>'+
 - 
 
336 
              '<input type="text" name="displayed-label" data-id="' + fieldIndex + '" class="displayed-label form-control" data-list-value-id="' + valueIndex +'" placeholder="Label à afficher">'+
 - 
 
337 
            '</div>' +
 - 
 
338 
            // Checkbox valeur par défaut
 - 
 
339 
            '<div class="col-sm-12 radio mt-3">'+
 - 
 
340 
              '<label for="is-defaut-value" title="Ceci est la valeur par défaut" class="radio-label">'+
 - 
 
341 
                '<input type="checkbox" name="is-defaut-value" data-id="' + fieldIndex + '" class="is-defaut-value" title="entrez une valeur pour activer cette case" data-list-value-id="' + valueIndex +'" disabled >'+
 - 
 
342 
                'Valeur par défaut'+
 - 
 
343 
              '</label>'+
 - 
 
344 
            '</div>' +
 - 
 
345 
          '</div>' +
 - 
 
346 
          // Bouton ajout d'une valeur à la liste
 - 
 
347 
          '<div class="col-sm-12 mt-3 add-value-container" data-id="' + fieldIndex + '">'+
 - 
 
348 
            '<label for="add-value" class="add-value" data-id="' + fieldIndex + '" title="Ajouter une valeur à la liste">Ajouter une valeur</label>'+
 - 
 
349 
            '<div class="button add-value-button" name="add-value" data-id="' + fieldIndex + '" title="Ajouter une valeur à la liste"><i class="fa fa-puzzle-piece" aria-hidden="true"></i></div>'+
 - 
 
350 
          '</div>' +
 - 
 
351 
          // checkbox ajouter une valeur "Autre:"
 - 
 
352 
          '<div class="col-sm-12 radio mt-3">'+
 - 
 
353 
            '<label for="option-other-value" title="Ajouter une option \'Autre:\' à la fin" class="radio-label">'+
 - 
 
354 
              '<input type="checkbox" name="option-other-value" data-id="' + fieldIndex + '" class="option-other-value" title="Ajouter une option \'Autre\' à la fin">'+
 - 
 
355 
              'Valeur "Autre"'+
 - 
 
356 
            '</label>'+
 - 
 
357 
          '</div>'
 - 
 
358 
        );
 - 
 
359 
        break;
 - 
 
360 
 
 - 
 
361 
      case 'email':
 - 
 
362 
      case 'text':
 - 
 
363 
      case 'textarea':
 - 
 
364 
      default:
 - 
 
365 
        displayFieldDetailsCollect(
 - 
 
366 
          fieldIndex,
 - 
 
367 
        // Placeholder
 - 
 
368 
        '<div class="col-sm-12 mt-3">'+
 - 
 
369 
          '<label for="aide-saisie" title="Aidez les utilisateurs en deux ou 3 mots ou chiffres à comprendre ce que doit contenir ce champ">Texte d\'aide à la saisie</label>'+
 - 
 
370 
          '<input type="text" name="aide-saisie" data-id="' + fieldIndex + '" class="aide-saisie form-control" placeholder="Ce que doit contenir ce champ">'+
 - 
 
371 
        '</div>'
 - 
 
372 
      );
 - 
 
373 
        break;
 - 
 
374 
    }
 - 
 
375 
    // Ajout des valeurs possibles
 - 
 
376 
    // lorsque le champ est une liste ou case à cocher
 - 
 
377 
    onClickAddNewValueToList( fieldIndex , valueIndex );
 - 
 
378 
  });
 - 
 
379 
}
 - 
 
380 
 
 - 
 
381 
// Insertion dans le dom des champs de recueil d'informations
 - 
 
382 
function displayFieldDetailsCollect( fieldIndex , fieldDetails ) {
 - 
 
383 
  $( '.add-field-select[data-id="' + fieldIndex + '"]' ).after(
 - 
 
384 
    '<div class="field-details col-sm-11 mt-3 row" data-id="' + fieldIndex + '">' +
 - 
 
385 
      fieldDetails +
 - 
 
386 
    '</div>'
 - 
 
387 
  ).hide().show( 200);
 - 
 
388 
}
 - 
 
389 
 
 - 
 
390 
/**** Ajout des valeurs (options) des "champs de listes" (select, checkbox, radio, etc.) ****/
 - 
 
391 
 
 - 
 
392 
// Ajout des options des listes (deroulantes, cases à cocher etc.)
 - 
 
393 
function onClickAddNewValueToList( fieldIndex , valueIndex ) {
 - 
 
394 
  $( '.add-value-button[data-id="' + fieldIndex + '"]' ).click( function() {
 - 
 
395 
    valueIndex++;
 - 
 
396 
    $( '.add-value-container[data-id="' + fieldIndex + '"]' ).before(
 - 
 
397 
      '<div class="new-value center-block row" data-list-value-id="' + valueIndex +'">'+
 - 
 
398 
        // Recueil d'une valeur de la liste
 - 
 
399 
        '<div class="col-sm-12 mt-3">'+
 - 
 
400 
          '<label for="list-value">Valeur *</label>'+
 - 
 
401 
          '<input type="text" name="list-value" data-id="' + fieldIndex + '" class="list-value form-control" data-list-value-id="' + valueIndex +'" placeholder="Une des valeurs de la liste" required>'+
 - 
 
402 
        '</div>' +
 - 
 
403 
        // Recueil du label à afficher
 - 
 
404 
        '<div class="col-sm-12 mt-3">'+
 - 
 
405 
          '<label for="displayed-label">Label</label>'+
 - 
 
406 
          '<input type="text" name="displayed-label" data-id="' + fieldIndex + '" class="displayed-label form-control" data-list-value-id="' + valueIndex +'" placeholder="Label à afficher">'+
 - 
 
407 
        '</div>' +
 - 
 
408 
        // Checkbox valeur par défaut+bouton supprimer
 - 
 
409 
        '<div class="col-sm-12 mt-3 row">'+
 - 
 
410 
          // Bouton supprimer une option
 - 
 
411 
          '<div class="col-sm-5">'+
 - 
 
412 
            '<div class="remove-value button" name="remove-value" data-id="' + fieldIndex + '" data-list-value-id="' + valueIndex + '" title="Supprimer une valeur"><i class="fa fa-trash" aria-hidden="true"></i></div>'+
 - 
 
413 
          '</div>'+
 - 
 
414 
          // Valeur par défaut
 - 
 
415 
          '<div class="col-sm-7 radio">'+
 - 
 
416 
            '<label for="is-defaut-value" title="Ceci est la valeur par défaut" class="radio-label">'+
 - 
 
417 
              '<input type="checkbox" name="is-defaut-value" data-id="' + fieldIndex + '" class="is-defaut-value" title="entrez une valeur pour activer cette case" data-list-value-id="' + valueIndex +'" disabled >'+
 - 
 
418 
              'Valeur défaut'+
 - 
 
419 
            '</label>'+
 - 
 
420 
          '</div>'+
 - 
 
421 
        '</div>'+
 - 
 
422 
      '</div>'
 - 
 
423 
    ).hide().show( 200);
 - 
 
424 
    // Une seule valeur par défaut pour select et radio
 - 
 
425 
    onClickDefaultValueRemoveOthers( fieldIndex );
 - 
 
426 
    // Supprimer une valeur
 - 
 
427 
    onClickRemoveListValue( fieldIndex );
 - 
 
428 
  });
 - 
 
429 
}
 - 
 
430 
 
 - 
 
431 
// Activer la checkbox de valeur par default uniquement si une valeur est entrée
 - 
 
432 
function onInputListValueLabelEnableDefaultCheckbox() {
 - 
 
433 
  $( '#new-fields' ).on( 'input' , '.list-value' , function() {
 - 
 
434 
    var $thisDefautValue = $( '.is-defaut-value[data-id="' + $( this ).data( 'id' ) + '"][data-list-value-id="' + $( this ).data( 'list-value-id' ) + '"]' );
 - 
 
435 
    if( '' !== $( this ).val() ) {
 - 
 
436 
      $thisDefautValue.removeAttr( 'disabled' );
 - 
 
437 
    } else {
 - 
 
438 
      $thisDefautValue.attr( 'disabled', true ).attr( 'checked' , false );
 - 
 
439 
    }
 - 
 
440 
  });
 - 
 
441 
}
 - 
 
442 
 
 - 
 
443 
// Pour les éléments "select" et "radio" il ne peut y avoir qu'une valeur par défaut cochée
 - 
 
444 
function onClickDefaultValueRemoveOthers( fieldIndex ) {
 - 
 
445 
  var selectedFieldElement = $( '.field-element[data-id="' + fieldIndex + '"]' ).val();
 - 
 
446 
 
 - 
 
447 
  if( selectedFieldElement === 'select' || selectedFieldElement === 'radio' ) {
 - 
 
448 
    $( '.is-defaut-value[data-id="' + fieldIndex + '"]' ).click( function() {
 - 
 
449 
     if( $( this ).is( ':checked' ) ) {
 - 
 
450 
        // Décocher tous les autres
 - 
 
451 
        $( '.is-defaut-value[data-id="' + fieldIndex + '"]:checked' ).not( $( this) ).attr( 'checked' , false );
 - 
 
452 
      }
 - 
 
453 
    });
 - 
 
454 
  }
 - 
 
455 
}
 - 
 
456 
 
 - 
 
457 
// Bouton supprimer une valeur
 - 
 
458 
function onClickRemoveListValue( fieldIndex ) {
 - 
 
459 
  $( '.remove-value.button[data-id="' + fieldIndex + '"]' ).click( function() {
 - 
 
460 
    $( '.new-value[data-list-value-id="' + $( this ).data( 'list-value-id' ) + '"]' ).hide( 200 , function () {
 - 
 
461 
      $( this ).remove();
 - 
 
462 
    });
 - 
 
463 
  });
 - 
 
464 
}
 - 
 
465 
 
 - 
 
466 
/*********************************************
 - 
 
467 
 *  Validation et envoi des nouveaux champs  *
 - 
 
468 
 *********************************************/
 - 
 
469 
 
 - 
 
470 
// Empêcher de créer plus d'une fois la même clé
 - 
 
471 
function onChangeCheckKeyUnique() {
 - 
 
472 
 if( 1 < $( '.field-key' ).length ) {
 - 
 
473 
    // Marqueur de valeur dupliquée
 - 
 
474 
    var notUnique = false;
 - 
 
475 
 
 - 
 
476 
    $( '.field-key' ).change( function () {
 - 
 
477 
      let count = $( '.field-key' ).length;
 - 
 
478 
 
 - 
 
479 
      for(var index = 0 ; index < count ; index++) {
 - 
 
480 
        let thisFieldKey = $( '.field-key[data-id="' + index + '"]' );
 - 
 
481 
        // Le champ avec cet index pourrait avoir été supprimé
 - 
 
482 
        if( 0 < thisFieldKey.length ) {
 - 
 
483 
          for( var otherIndex = 0 ; otherIndex < count ; otherIndex++ ) {
 - 
 
484 
            let otherFieldKey = $( '.field-key[data-id="' + otherIndex + '"]' );
 - 
 
485 
            // Le champ avec cet index pourrait avoir été supprimé
 - 
 
486 
            // On vérifie qu'on ne compare pas un champ avec lui-même
 - 
 
487 
            // Que les champs ne sont pas vides
 - 
 
488 
            // Les champs dupliqués déclanchent le marqueur et les alertes
 - 
 
489 
            if(
 - 
 
490 
              0 < otherFieldKey.length &&
 - 
 
491 
              index !== otherIndex &&
 - 
 
492 
              '' !== otherFieldKey.val() &&
 - 
 
493 
              '' !== thisFieldKey.val() &&
 - 
 
494 
              thisFieldKey.val() === otherFieldKey.val()
 - 
 
495 
            ) {
 - 
 
496 
              // Le marqueur de valeur dupliquée passe à true
 - 
 
497 
              notUnique = true;
 - 
 
498 
              if( 0 === $( '.invalid-field-key[data-id="' + index + '"]' ).length ) {
 - 
 
499 
                // Le champ est signalé en rouge
 - 
 
500 
                // Un message d'alerte apparait sous le champ
 - 
 
501 
                thisFieldKey.addClass( 'invalid-key' );
 - 
 
502 
                thisFieldKey.after(
 - 
 
503 
                  '<p class="message invalid-field-key" data-id="' + index + '">' +
 - 
 
504 
                    '<i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i>' +
 - 
 
505 
                    ' Vérifiez qu\'aucune clé n\'ait été utilisée plus d\'une fois'  +
 - 
 
506 
                  '</p>'
 - 
 
507 
                );
 - 
 
508 
              }
 - 
 
509 
            }
 - 
 
510 
          }
 - 
 
511 
        }
 - 
 
512 
      }
 - 
 
513 
      if( notUnique ) {
 - 
 
514 
        // Un message d'alerte apparait au dessus des boutons prévisualiser/valider
 - 
 
515 
        if( 0 === $( '.invalid-field-key-bottom' ).length ) {
 - 
 
516 
          $( '#new-fields' ).after(
 - 
 
517 
            '<p class="message invalid-field-key-bottom">' +
 - 
 
518 
              '<i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i>' +
 - 
 
519 
              ' Une clé a été utilisée plusieurs fois' +
 - 
 
520 
            '</p>'
 - 
 
521 
          );
 - 
 
522 
        }
 - 
 
523 
        // Les boutons prévisualiser/valider sont désactivés et signalés en rouge
 - 
 
524 
        $( '#preview-field , #validate-new-fields' ).addClass( 'invalid-key' ).css( 'pointer-events', 'none' );
 - 
 
525 
      } else {// Si on est ok on retire toutes les alertes
 - 
 
526 
        // signalements rouges
 - 
 
527 
        $( '.field-key' ).each( function() {
 - 
 
528 
          $( this ).removeClass( 'invalid-key' );
 - 
 
529 
        });
 - 
 
530 
        $( '#preview-field , #validate-new-fields' ).removeClass( 'invalid-key' );
 - 
 
531 
        // messages d'alerte
 - 
 
532 
        $( '.invalid-field-key' ).each( function() {
 - 
 
533 
          $( this ).hide( 200 , function () {
 - 
 
534 
            $( this ).remove();
 - 
 
535 
          });
 - 
 
536 
        });
 - 
 
537 
        $( '.invalid-field-key-bottom' ).hide( 200 , function () {
 - 
 
538 
          $( this ).remove();
 - 
 
539 
        });
 - 
 
540 
        //réactivation des boutons prévisualiser/valider
 - 
 
541 
        $( '#preview-field' )[0].style.removeProperty( 'pointer-events' );
 - 
 
542 
        $( '#validate-new-fields' )[0].style.removeProperty( 'pointer-events' )
 - 
 
543 
      }
 - 
 
544 
      // Réinitialisation
 - 
 
545 
      notUnique = false;
 - 
 
546 
    });
 - 
 
547 
  }
 - 
 
548 
}
 - 
 
549 
 
 - 
 
550 
// Activation/desactivation des champs valider/previsualiser
 - 
 
551 
function onClickButtonsTagMissingValues() {
 - 
 
552 
  $( '#preview-field , #validate-new-fields' ).on( 'click' , function() {
 - 
 
553 
    var $button = $( this );
 - 
 
554 
    //S'il n'y a pas (plus) de bloc nouveau champ
 - 
 
555 
    if( 0 === $( 'fieldset' ).length ) {
 - 
 
556 
      return;
 - 
 
557 
    }
 - 
 
558 
    // Classe "invalid"
 - 
 
559 
    missingValuesClass();
 - 
 
560 
    if( !$( this ).hasClass( 'invalid' ) ) {
 - 
 
561 
      if( $( this ).is( '#validate-new-fields') ) {
 - 
 
562 
        // Lancement de l'enregistrement des valeurs à transmettre
 - 
 
563 
        onClickStoreNewFields();
 - 
 
564 
      } else if( $( this ).is( '#preview-field') ) {
 - 
 
565 
        // Lancement de la prévisualisation
 - 
 
566 
        newFieldsPreview();
 - 
 
567 
      }
 - 
 
568 
    }
 - 
 
569 
  });
 - 
 
570 
  // Si un champ manquant est renseigné
 - 
 
571 
  // ou on choisit nouvel élément liste (au moins une option)
 - 
 
572 
  // Cette action doit être prise en compte dans la validation
 - 
 
573 
  $( '#new-fields' ).on( 'change' , '.invalid[type="text"] , .field-element' , function() {
 - 
 
574 
    // S'il on a pas encore cliqué sur prévisualiser/valider
 - 
 
575 
    // changer l'élément ne doit pas déclancher le signalement en rouge
 - 
 
576 
    if( $( this ).is( '.field-element' ) && !$( '#preview-field , #validate-new-fields' ).hasClass( 'invalid' ) ) {
 - 
 
577 
      return;
 - 
 
578 
    } else {
 - 
 
579 
      // Classe "invalid"
 - 
 
580 
      missingValuesClass();
 - 
 
581 
    }
 - 
 
582 
  });
 - 
 
583 
}
 - 
 
584 
 
 - 
 
585 
// Classe "invalid"
 - 
 
586 
function missingValuesClass() {
 - 
 
587 
  // Si au moins un champ "required" n'est pas rempli
 - 
 
588 
  $( '#new-fields input[required]' ).each( function() {
 - 
 
589 
    if( 0 === $( this ).val().length ) {
 - 
 
590 
      // Le champ est signalé en rouge
 - 
 
591 
      $( this ).addClass( 'invalid' );
 - 
 
592 
      // Un message d'alerte apparait après le champ
 - 
 
593 
      if( 0 === $( this ).next( '.validation-warning' ).length ) {
 - 
 
594 
        $( this ).after(
 - 
 
595 
          '<p class="validation-warning message">' +
 - 
 
596 
            '<i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i>' +
 - 
 
597 
             '&nbsp;Ce champ est requis' +
 - 
 
598 
          '</p>'
 - 
 
599 
        );
 - 
 
600 
      }
 - 
 
601 
    } else {
 - 
 
602 
      // Le champ est signalé en rouge
 - 
 
603 
      $( this ).removeClass( 'invalid' );
 - 
 
604 
      // Le message d'alerte du champ est supprimé
 - 
 
605 
      if( 0 < $( this ).next( '.validation-warning' ).length ) {
 - 
 
606 
        $( this ).next( '.validation-warning' ).hide( 200 , function () {
 - 
 
607 
          $( this ).remove();
 - 
 
608 
        });
 - 
 
609 
      }
 - 
 
610 
    }
 - 
 
611 
  });
 - 
 
612 
  // Si on a des champs à compléter
 - 
 
613 
  if( 0 < $( '.invalid[type="text"]' ).length ) {
 - 
 
614 
    // Les boutons sont signalés en rouge
 - 
 
615 
    $( '#preview-field , #validate-new-fields' ).addClass( 'invalid' );
 - 
 
616 
    // Un message d'alerte apparait avant les boutons
 - 
 
617 
    if( 0 === $( '#new-fields' ).next( '.validation-warning' ).length ) {
 - 
 
618 
      $( '#new-fields' ).after(
 - 
 
619 
        '<p class="validation-warning message">' +
 - 
 
620 
          '<i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i>' +
 - 
 
621 
           '&nbsp;Des informations sont manquantes pour certains champs,' +
 - 
 
622 
           ' vérifiez ceux signalés en rouge' +
 - 
 
623 
        '</p>'
 - 
 
624 
      );
 - 
 
625 
    }
 - 
 
626 
  } else {
 - 
 
627 
    // Les signalements et messages sont supprimés
 - 
 
628 
    $( '#preview-field , #validate-new-fields' ).removeClass( 'invalid' );
 - 
 
629 
    $( '#new-fields' ).next( '.validation-warning' ).hide( 200 , function () {
 - 
 
630 
        $( this ).remove();
 - 
 
631 
    });
 - 
 
632 
  }
 - 
 
633 
}
 - 
 
634 
 
 - 
 
635 
/**** Envoi des nouveaux champs ****/
 - 
 
636 
 
 - 
 
637 
// Enregistrement des valeurs à transmettre
 - 
 
638 
function onClickStoreNewFields() {
 - 
 
639 
  // Lorsqu'on valide
 - 
 
640 
  var resultArrayIndex = 0;
 - 
 
641 
  var count = $( 'fieldset' ).last().data( 'id' );
 - 
 
642 
  var helpFileExists = false;
 - 
 
643 
  // Savoir si au moins un fichier "aide" est enregistré
 - 
 
644 
  $( '.field-help' ).each( function () {
 - 
 
645 
    if( '' !== $( this ).val() ){
 - 
 
646 
      helpFileExists = true;
 - 
 
647 
    }
 - 
 
648 
  })
 - 
 
649 
  // dans ce cas intégrer dans le formulaire à soumettre un bloc
 - 
 
650 
  // qui contiendra une copie de chacun de ces input[type="file"]
 - 
 
651 
  if( helpFileExists ){
 - 
 
652 
    $( '#submit-button' ).before( '<div id="help-doc-submit" style="position:fixed;visibility:hidden;"></div>' );
 - 
 
653 
  }
 - 
 
654 
  // On déroule les blocs de champs supplémentaires
 - 
 
655 
  for( var index = $( 'fieldset' ).first().data( 'id' ) ; index <= count ; index++ ) {
 - 
 
656 
    var thisFieldset = $( 'fieldset[data-id="' + index + '"]');
 - 
 
657 
    // Certains indices peuvent correspondre à un champ supprimé
 - 
 
658 
    if( 0 < $( thisFieldset ).length ) {
 - 
 
659 
      // initialisation du tableau de résultats
 - 
 
660 
      datasToSubmit[ resultArrayIndex ]             = { fieldValues:{} };
 - 
 
661 
      // Ajout de la clé au tableau de resultats
 - 
 
662 
      datasToSubmit[ resultArrayIndex ].key         = $( '.field-key' , thisFieldset ).val();
 - 
 
663 
      // Ajout de le nom au tableau de resultats
 - 
 
664 
      datasToSubmit[ resultArrayIndex ].name        = $( '.field-name' , thisFieldset ).val();
 - 
 
665 
      // Recueil de l'élément choisi pour le tableau de resultats
 - 
 
666 
      datasToSubmit[ resultArrayIndex ].element     = $( '.field-element' , thisFieldset ).val();
 - 
 
667 
      // Ajout de la valeur 'requis' ou non au tableau de resultats
 - 
 
668 
      datasToSubmit[ resultArrayIndex ].mandatory   = $( '.field-is_mandatory' , thisFieldset ).is( ':checked' );
 - 
 
669 
      // Ajout de l'unité au tableau de resultats
 - 
 
670 
      datasToSubmit[ resultArrayIndex ].unit        = $( '.field-unit' , thisFieldset ).val() || null;
 - 
 
671 
      // Ajout du tooltip au tableau de resultats
 - 
 
672 
      datasToSubmit[ resultArrayIndex ].description = $( '.field-description' , thisFieldset ).val() || null;
 - 
 
673 
      // Collecte les des données dépendantes de l'élément choisi
 - 
 
674 
      // sous forme d'un tableau de resultats
 - 
 
675 
      onSelectCollectDataValuesToSubmit( datasToSubmit[ resultArrayIndex ] , thisFieldset );
 - 
 
676 
 
 - 
 
677 
      if( $.isEmptyObject( datasToSubmit[ resultArrayIndex ].fieldValues ) ){
 - 
 
678 
        delete datasToSubmit[ resultArrayIndex ].fieldValues;
 - 
 
679 
      }
 - 
 
680 
      // Copie d'un champ de fichier d'aide dans le bloc d'envoi
 - 
 
681 
      if( 0 < $( '.field-help' , thisFieldset ).get(0).files.length ) {
 - 
 
682 
        // Présence d'un document d'aide
 - 
 
683 
        datasToSubmit[ resultArrayIndex ].help = $( '.field-help' , thisFieldset ).get(0).files[0].type;
 - 
 
684 
        $( '.field-help' , thisFieldset ).clone()
 - 
 
685 
          .attr( 'name' , 'help-' + datasToSubmit[ resultArrayIndex ].key )// l'attribut name prend la valeur de la clé
 - 
 
686 
          .appendTo( '#help-doc-submit' );
 - 
 
687 
      } else {
 - 
 
688 
        datasToSubmit[ resultArrayIndex ].help = null;
 - 
 
689 
      }
 - 
 
690 
      resultArrayIndex++;
 - 
 
691 
    }
 - 
 
692 
  }
 - 
 
693 
 
 - 
 
694 
  var resultsArrayJson = JSON.stringify( datasToSubmit , replacer );
 - 
 
695 
 
 - 
 
696 
  // JSON.stringify : Gestion des apostrophes dans les valeurs :
 - 
 
697 
  function replacer( key , value ) {
 - 
 
698 
    if ( 'fieldValues' === key && 'object' === typeof value ) {
 - 
 
699 
      for ( var i in value ) {
 - 
 
700 
        if ( typeof value[i] === 'string' ) {
 - 
 
701 
          // value[i] = value[i].replace( /\u0027/g, "&apos;&apos;" );
 - 
 
702 
          // La solution ci-dessus convient pour stockage dans la base mais pas pour la lecture dans saisie
 - 
 
703 
          // du coup astuce moisie:
 - 
 
704 
          value[i] = value[i].replace( /\u0027/g, "@apos@" ).replace( /\u0022/g, '@quot@' )
 - 
 
705 
        }
 - 
 
706 
      }
 - 
 
707 
    } else if ( typeof value === 'string' ) {
 - 
 
708 
      // value = value.replace( /\u0027/g, "&apos;&apos;" );
 - 
 
709 
      // La solution ci-dessus convient pour stockage dans la base mais pas pour la lecture dans saisie
 - 
 
710 
      // du coup astuce moisie:
 - 
 
711 
      value = value.replace( /\u0027/g, "@apos@" ).replace( /\u0022/g, '@quot@' )
 - 
 
712 
    }
 - 
 
713 
    return value;
 - 
 
714 
  }
 - 
 
715 
 
 - 
 
716 
  console.log( resultsArrayJson );
 - 
 
717 
 
 - 
 
718 
  // Désactivation de tous les champs et boutons (nouveaux champs)
 - 
 
719 
  $( '#new-fields, #new-fields .button , #add-fields , #preview-field' ).addClass( 'disabled' );
 - 
 
720 
  $( '#validate-new-fields' ).addClass( 'validated' );
 - 
 
721 
  $( '.validate-new-fields' ).text( 'Champs validés' );
 - 
 
722 
  // Mise à disposition des données pour le bouron submit
 - 
 
723 
  $( '#submit-button' ).before(
 - 
 
724 
    //la value est passée avec des apostrophes pour que les guillemets de la string json passent bien en string de l'attribut
 - 
 
725 
    '<input type="hidden" name="champs-supp" id="champs-supp" value=\'' + resultsArrayJson + '\'>'
 - 
 
726 
  );
 - 
 
727 
}
 - 
 
728 
 
 - 
 
729 
// Renseigne le tableau de resultat
 - 
 
730 
// pour les données dépendant de l'élément choisi
 - 
 
731 
function onSelectCollectDataValuesToSubmit( datasToSubmitObject , thisFieldset ) {
 - 
 
732 
    switch( datasToSubmitObject.element ) {
 - 
 
733 
      case 'select':
 - 
 
734 
      case 'checkbox':
 - 
 
735 
      case 'list-checkbox':
 - 
 
736 
      case 'radio':
 - 
 
737 
        datasToSubmitObject.fieldValues.listValue = [];
 - 
 
738 
        // Ajout des valeurs de liste
 - 
 
739 
        onChangeStoreListValueLabel( datasToSubmitObject , thisFieldset );
 - 
 
740 
        // S'il y a une valeur 'autre' on l'indique à la fin de la liste
 - 
 
741 
        if( $( '.option-other-value' , thisFieldset ).is( ':checked' ) && -1 === datasToSubmitObject.fieldValues.listValue.indexOf( 'other' ) ) {
 - 
 
742 
          datasToSubmitObject.fieldValues.listValue.push( 'other' );
 - 
 
743 
        }
 - 
 
744 
        break;
 - 
 
745 
 
 - 
 
746 
      case 'number':
 - 
 
747 
      case 'range':
 - 
 
748 
        // Placeholder
 - 
 
749 
        datasToSubmitObject.fieldValues.placeholder = $( '.aide-saisie' , thisFieldset ).val() || null;
 - 
 
750 
        // Valeur par défaut
 - 
 
751 
        datasToSubmitObject.fieldValues.default = $( '.default' , thisFieldset ).val() || null;
 - 
 
752 
        // Incrémentation ( attribut step="" )
 - 
 
753 
         datasToSubmitObject.fieldValues.step = $( '.step' , thisFieldset ).val() || null;
 - 
 
754 
        // Min
 - 
 
755 
        datasToSubmitObject.fieldValues.min = $( '.min' , thisFieldset ).val() || null;
 - 
 
756 
        // Max
 - 
 
757 
        datasToSubmitObject.fieldValues.max = $( '.max' , thisFieldset ).val() || null;
 - 
 
758 
        break;
 - 
 
759 
 
 - 
 
760 
      case 'date':
 - 
 
761 
        // Min
 - 
 
762 
        datasToSubmitObject.fieldValues.min = $( '.min' , thisFieldset ).val() || null;
 - 
 
763 
        // Max
 - 
 
764 
        datasToSubmitObject.fieldValues.max = $( '.max' , thisFieldset ).val() || null;
 - 
 
765 
        break;
 - 
 
766 
 
 - 
 
767 
      case 'email':
 - 
 
768 
      case 'text':
 - 
 
769 
      case 'textarea':
 - 
 
770 
      default:
 - 
 
771 
        // Placeholder
 - 
 
772 
        datasToSubmitObject.fieldValues.placeholder = $( '.aide-saisie' , thisFieldset ).val() || null;
 - 
 
773 
        break;
 - 
 
774 
    }
 - 
 
775 
    return datasToSubmitObject;
 - 
 
776 
}
 - 
 
777 
 
 - 
 
778 
// Ajout d'une valeur d'un élément liste (select, checkbox etc.)
 - 
 
779 
// dans le tableau de resultats
 - 
 
780 
function onChangeStoreListValueLabel( datasToSubmitObject , thisFieldset ) {
 - 
 
781 
  $( '.list-value' , thisFieldset ).each( function() {
 - 
 
782 
    var valueId = $( this ).data( 'list-value-id' );
 - 
 
783 
    var selectedFieldElement = $( '.field-element' , thisFieldset ).val();
 - 
 
784 
    var displayedLabel = '';
 - 
 
785 
 
 - 
 
786 
    if ( valeurOk( $( '.displayed-label[data-list-value-id="' + valueId + '"]', thisFieldset  ).val() ) ) {
 - 
 
787 
      displayedLabel = $( '.displayed-label[data-list-value-id="' + valueId + '"]', thisFieldset  ).val();
 - 
 
788 
    }
 - 
 
789 
    if( $( this ).val() ){
 - 
 
790 
      // Is-default-value non cochée
 - 
 
791 
      if( !$( '.is-defaut-value[data-list-value-id="' + valueId + '"]' , thisFieldset ).is( ':checked' ) ) {
 - 
 
792 
        datasToSubmitObject.fieldValues.listValue.push( [ $( this ).val(), displayedLabel ] );
 - 
 
793 
      // Is-default-value cochée pour select/radio
 - 
 
794 
      } else if( 'select' ===  selectedFieldElement || 'radio' === selectedFieldElement ) {
 - 
 
795 
        // Une seule valeur par defaut, devient la première valeur du tableau + '#'
 - 
 
796 
        datasToSubmitObject.fieldValues.listValue.unshift( [ $( this ).val() + '#', displayedLabel ] );
 - 
 
797 
      // Is-default-value cochée pour checkbox/list-checkbox
 - 
 
798 
      } else {
 - 
 
799 
        // On ajoute simplement la valeur au tableau + '#'
 - 
 
800 
        datasToSubmitObject.fieldValues.listValue.push( [ $( this ).val() + '#', displayedLabel ] );
 - 
 
801 
      }
 - 
 
802 
    }
 - 
 
803 
  });
 - 
 
804 
}
 - 
 
805 
 
 - 
 
806 
/************************************************
 - 
 
807 
 *  Fonction d'affichage des champs classiques  *
 - 
 
808 
 ************************************************/
 - 
 
809 
 
 - 
 
810 
// Prévisualisation
 - 
 
811 
function DisplayClassicFields() {
 - 
 
812 
  // Affichage du titre du widget
 - 
 
813 
  renderFields( $( '#titre' ) , $( '.widget-renderer h1' ) );
 - 
 
814 
  // Affichage de la description
 - 
 
815 
  renderFields( $( '#description' ) , $( '.preview-description' ) );
 - 
 
816 
  // Affichage referentiel
 - 
 
817 
  $( '#label-taxon span' ).text( ' (' + $( '#referentiel' ).val() + ')' );
 - 
 
818 
  $( '#referentiel' ).change( function() {
 - 
 
819 
    $( '#label-taxon span' ).text( ' (' + $( this ).val() + ')' );
 - 
 
820 
  });
 - 
 
821 
 
 - 
 
822 
  // Affichage du logo s'il existe déjà
 - 
 
823 
  if( 0 !== $( '#logo' ).val().length || $( '#logo' )[0].defaultValue ) {
 - 
 
824 
    $( '#preview-logo' ).append(
 - 
 
825 
      '<img src="' +
 - 
 
826 
        $( '#group-settings-form .logo img' ).prop( 'src' ) +
 - 
 
827 
        '" width="75%"' +
 - 
 
828 
      '>'
 - 
 
829 
    );
 - 
 
830 
  }
 - 
 
831 
  // Affichage du logo chargé
 - 
 
832 
  $( '#logo.input-file' ).change( function( event ) {
 - 
 
833 
    // Si le 'change' n'était pas une suppression
 - 
 
834 
    if( $.isEmptyObject( event.target.files[0] ) ) {
 - 
 
835 
      $( '#preview-logo img' ).remove();
 - 
 
836 
    // Si on a chargé un logo ou changé le fichier
 - 
 
837 
    } else {
 - 
 
838 
      $( '#preview-logo' ).append(
 - 
 
839 
        '<img src="' +
 - 
 
840 
          URL.createObjectURL( event.target.files[0] ) +
 - 
 
841 
          '" width="75%"' +
 - 
 
842 
        '>'
 - 
 
843 
      );
 - 
 
844 
    }
 - 
 
845 
  });
 - 
 
846 
  // Affichage de l'image de fond
 - 
 
847 
  $('#image_fond.input-file').change( function ( event ) {
 - 
 
848 
    if( !$.isEmptyObject( event.target.files[0] ) ) {
 - 
 
849 
      $( '.widget-renderer' ).css('background' ,'url(' + URL.createObjectURL( event.target.files[0] ) + ') no-repeat fixed center center');
 - 
 
850 
    } else {
 - 
 
851 
      $( '.widget-renderer' )[0].style.removeProperty( 'background' );
 - 
 
852 
    }
 - 
 
853 
  });
 - 
 
854 
}
 - 
 
855 
 
 - 
 
856 
// Affichage des infos dès que disponibles
 - 
 
857 
// pour les champs classiques
 - 
 
858 
function renderFields( $source , $taget ) {
 - 
 
859 
  var text = new DOMParser().parseFromString($source.val(), 'text/html');
 - 
 
860 
 
 - 
 
861 
  text = text.body.textContent || '';
 - 
 
862 
  if( $source.val() ) {
 - 
 
863 
    $taget.text( text );
 - 
 
864 
  }
 - 
 
865 
  $source.change( function () {
 - 
 
866 
    $taget.text( text );
 - 
 
867 
  });
 - 
 
868 
}
 - 
 
869 
 
 - 
 
870 
 
 - 
 
871 
/*****************************************************
 - 
 
872 
 *  Fonction d'affichage des champs supplémentaires  *
 - 
 
873 
 *****************************************************/
 - 
 
874 
 
 - 
 
875 
// Construction des éléments à visualiser
 - 
 
876 
function onClickPreviewField( thisFieldset , index ) {
 - 
 
877 
  // Récupération des données
 - 
 
878 
      // Tous les champs
 - 
 
879 
  var fieldLabel       = $( '.field-name'            , thisFieldset ).val() || '',//nom
 - 
 
880 
      fieldKey         = $( '.field-key'             , thisFieldset ).val() || '',//clé
 - 
 
881 
      fieldElement     = $( '.field-element'         , thisFieldset ).val() || '',//élément
 - 
 
882 
      fieldIsMandatory = $( '.field-is_mandatory'    , thisFieldset ).is( ':checked' ),//champ requis
 - 
 
883 
      fieldUnit        = $( '.field-unit'            , thisFieldset ).val() || '',//unités
 - 
 
884 
      fieldTooltip     = $( '.field-description'     , thisFieldset ).val() || '',//info-bulle
 - 
 
885 
      fieldHelp        = $( '.file-return.help-doc-' + index ).text()       || '',//nom du fichier d'aide
 - 
 
886 
      fieldPlaceholder = $( '.aide-saisie'           , thisFieldset ).val() || '',//placeholder
 - 
 
887 
      // Champs à valeur numérique ou date
 - 
 
888 
      fieldStep        = $( '.step'                  , thisFieldset ).val() || '',
 - 
 
889 
      fieldMin         = $( '.min'                   , thisFieldset ).val() || '',
 - 
 
890 
      fieldMax         = $( '.max'                   , thisFieldset ).val() || '',
 - 
 
891 
      // Champs "listes"
 - 
 
892 
      fieldDefaultNum  = $( '.default'               , thisFieldset ).val() || '',// value range/number par default
 - 
 
893 
      fieldOtherValue  = $( '.option-other-value'    , thisFieldset ).is( ':checked' ),//option autre
 - 
 
894 
      fieldOptions     = collectListOptions( thisFieldset );//Array: toutes les options
 - 
 
895 
  // Variables d'affichage
 - 
 
896 
  var fieldHtml        = '',//variable contenant tout le html à afficher
 - 
 
897 
      commonFieldsHtml = {},//Éléments simples ou chaînes communes aux "listes"
 - 
 
898 
      listFieldsHtml   = {},//chaînes & html pour les listes mais non spécifiques
 - 
 
899 
      listFieldsHtml   = {},//chaînes & html spécifiques aux listes
 - 
 
900 
      count            = fieldOptions.length;//nombre d'options, pour les boucles for
 - 
 
901 
  fieldLabel = fieldLabel.replace( /(')/gm, '&apos;' ).replace( /(")/gm, '&quot;' );
 - 
 
902 
  fieldTooltip = fieldTooltip.replace( /(')/gm, '&apos;' ).replace( /(")/gm, '&quot;' );
 - 
 
903 
  fieldPlaceholder = fieldPlaceholder.replace( /(')/gm, '&apos;' ).replace( /(")/gm, '&quot;' );
 - 
 
904 
 
 - 
 
905 
  //valeurs initiales des chaînes de caractères
 - 
 
906 
  //Éléments simples ou chaînes communes aux "listes"
 - 
 
907 
  commonFieldsHtml = {
 - 
 
908 
    dataIdAttr : ' data-id="' + index + '"',
 - 
 
909 
    helpButton : '',//bouton aide
 - 
 
910 
    helpClass  : '',//classe de l'élément associé au bouton aide
 - 
 
911 
    titleAttr  : '',//info-bulle
 - 
 
912 
    fieldInput : {//attributs de l'élément
 - 
 
913 
      typeAttr        : ' type="' + fieldElement + '"',
 - 
 
914 
      nameAttr        : ' name="' + fieldKey + '"',
 - 
 
915 
      classAttr       : ' class="' +  fieldKey + '"',
 - 
 
916 
      placeholderAttr : '',
 - 
 
917 
      mandatoryAttr   : '',//required
 - 
 
918 
      otherAttr       : ''
 - 
 
919 
    },
 - 
 
920 
    fieldLabel : {//attributs et contenu du label
 - 
 
921 
      labelContent    : fieldLabel,//label
 - 
 
922 
      forAttr         : ' for="' + fieldKey + '"',//attribut for
 - 
 
923 
      classAttr       : '',//classe du label
 - 
 
924 
      otherAttr       : ''//tous autres attributs
 - 
 
925 
    }
 - 
 
926 
  }
 - 
 
927 
  // Pour les éléments de listes (select, checkbox, etc.)
 - 
 
928 
  listFieldsHtml = {
 - 
 
929 
    containerContent : fieldLabel,//les options peuvent avoir chacune un label
 - 
 
930 
    containerClass   : '',//une classe pour le conteneur
 - 
 
931 
    forAttr          : '',//correspond à l'id d'une checkbox/radio/list-checkbox
 - 
 
932 
    optionIdAttr     : '',//value-id
 - 
 
933 
    defaultAttr      : ''//default
 - 
 
934 
  };
 - 
 
935 
  // Changement d'un élément existant:
 - 
 
936 
  // supprimer le précédent pour ajouter le nouveau
 - 
 
937 
  if( 0 < $( '.preview-fields' , thisFieldset ).length ) {
 - 
 
938 
    $( '.preview-fields' , thisFieldset ).remove();
 - 
 
939 
  }
 - 
 
940 
  // Élément requis
 - 
 
941 
  if( fieldIsMandatory ) {
 - 
 
942 
    // Attribut required pour le listes
 - 
 
943 
    commonFieldsHtml.fieldInput.mandatoryAttr = ' required="required"';
 - 
 
944 
    // Nom du champ (éléments listes)
 - 
 
945 
    listFieldsHtml.containerContent = '* ' + listFieldsHtml.containerContent;
 - 
 
946 
    // Nom du champ (éléments simples)
 - 
 
947 
    commonFieldsHtml.fieldLabel.labelContent = '* ' + commonFieldsHtml.fieldLabel.labelContent;
 - 
 
948 
  }
 - 
 
949 
  // Infobulle
 - 
 
950 
  if( '' !== fieldTooltip ) {
 - 
 
951 
    commonFieldsHtml.titleAttr = ' title="' +  fieldTooltip + '"';
 - 
 
952 
  }
 - 
 
953 
  // Placeholder
 - 
 
954 
  if( '' !== fieldPlaceholder ) {
 - 
 
955 
    commonFieldsHtml.fieldInput.placeholderAttr = ' placeholder="' +  fieldPlaceholder + '"';
 - 
 
956 
  }
 - 
 
957 
  // Fichier d'aide
 - 
 
958 
  if( '' !== fieldHelp ) {
 - 
 
959 
    // Bouton 'aide'
 - 
 
960 
    commonFieldsHtml.helpButton = '<div class="help-button btn btn-outline-info btn-sm border-0"><i class="fas fa-info-circle"></i></div>';
 - 
 
961 
    // classe 'aide'
 - 
 
962 
    commonFieldsHtml.helpClass = ' and-help';
 - 
 
963 
  }
 - 
 
964 
  // html à ajouter en fonction de l'élément choisi
 - 
 
965 
  switch( fieldElement ) {
 - 
 
966 
    case 'checkbox' :
 - 
 
967 
    case 'radio' :
 - 
 
968 
      listFieldsHtml.containerClass = ' class="' + fieldElement +'"';
 - 
 
969 
      commonFieldsHtml.fieldLabel.classAttr = ' class="radio-label"';
 - 
 
970 
      fieldHtml =
 - 
 
971 
        // Conteneur
 - 
 
972 
        '<div style="width:100%"' +
 - 
 
973 
          // Class="L'élément choisi"
 - 
 
974 
          listFieldsHtml.containerClass +
 - 
 
975 
          // DataId
 - 
 
976 
          commonFieldsHtml.dataIdAttr +
 - 
 
977 
          // Required
 - 
 
978 
          commonFieldsHtml.fieldInput.mandatoryAttr +
 - 
 
979 
          // Info bulle
 - 
 
980 
          commonFieldsHtml.titleAttr +
 - 
 
981 
        ' >'+
 - 
 
982 
          // Nom du champ
 - 
 
983 
          // Classe 'and-help'
 - 
 
984 
          '<div class="mt-3 list-label' + commonFieldsHtml.helpClass + '">' +
 - 
 
985 
            // Label
 - 
 
986 
            listFieldsHtml.containerContent +
 - 
 
987 
            // Bouton 'help'
 - 
 
988 
            commonFieldsHtml.helpButton +
 - 
 
989 
          '</div>';
 - 
 
990 
      // On déroule les différentes valeurs
 - 
 
991 
      for( let i = 0; i < count; i++ ) {
 - 
 
992 
        let fieldOption = fieldOptions[i];
 - 
 
993 
        // L'id de input
 - 
 
994 
        listFieldsHtml.inputIdAttr = ' id="' + fieldOption.optionValue + '"';
 - 
 
995 
        listFieldsHtml.forAttr = ' for="' + fieldOption.optionValue + '"';
 - 
 
996 
        // Default
 - 
 
997 
        listFieldsHtml.defaultAttr = '';//réinitialisation
 - 
 
998 
        if( fieldOption.isDefault ) {//affectation
 - 
 
999 
          listFieldsHtml.defaultAttr = ' checked';
 - 
 
1000 
        }
 - 
 
1001 
        // L'indice de chaque option
 - 
 
1002 
        // L'option "autre" n'en a pas
 - 
 
1003 
        if( '' !== fieldOption.optionIndex ) {
 - 
 
1004 
          listFieldsHtml.optionIdAttr = ' value-id="' + fieldOption.optionIndex + '"';
 - 
 
1005 
        }
 - 
 
1006 
 
 - 
 
1007 
        fieldHtml +=
 - 
 
1008 
          '<label' +
 - 
 
1009 
            // For
 - 
 
1010 
            listFieldsHtml.forAttr +
 - 
 
1011 
            // value-id
 - 
 
1012 
            listFieldsHtml.optionIdAttr +
 - 
 
1013 
            // Class du label
 - 
 
1014 
            commonFieldsHtml.fieldLabel.classAttr +
 - 
 
1015 
          '>' +
 - 
 
1016 
            '<input' +
 - 
 
1017 
              // Type
 - 
 
1018 
              commonFieldsHtml.fieldInput.typeAttr +
 - 
 
1019 
              // Id
 - 
 
1020 
              listFieldsHtml.inputIdAttr +
 - 
 
1021 
              // DataId
 - 
 
1022 
              commonFieldsHtml.dataIdAttr +
 - 
 
1023 
              // value-id
 - 
 
1024 
              listFieldsHtml.optionIdAttr +
 - 
 
1025 
              // Name
 - 
 
1026 
              commonFieldsHtml.fieldInput.nameAttr +
 - 
 
1027 
              // Value
 - 
 
1028 
              ' value="' + fieldOption.optionValue.replace( /(')/gm, '&apos;' ).replace( /(")/gm, '&quot;' ) + '"' +
 - 
 
1029 
              // Checked
 - 
 
1030 
              listFieldsHtml.defaultAttr +
 - 
 
1031 
              // Class="nom du champ"
 - 
 
1032 
              commonFieldsHtml.fieldInput.classAttr +
 - 
 
1033 
            '>' +
 - 
 
1034 
            // Label de l'option
 - 
 
1035 
            fieldOption.optionText.replace( /(')/gm, '&apos;' ).replace( /(")/gm, '&quot;' ) +
 - 
 
1036 
          '</label>';
 - 
 
1037 
      }
 - 
 
1038 
      // Si valeur "autre" est cochée
 - 
 
1039 
      if( fieldOtherValue ) {
 - 
 
1040 
        fieldHtml +=
 - 
 
1041 
          '<label for="other"' +
 - 
 
1042 
            commonFieldsHtml.dataIdAttr +
 - 
 
1043 
            commonFieldsHtml.fieldLabel.classAttr +
 - 
 
1044 
          '>' +
 - 
 
1045 
            '<input' +
 - 
 
1046 
              commonFieldsHtml.fieldInput.typeAttr +
 - 
 
1047 
              ' id="other-' + fieldElement + '-' + index + '"' +
 - 
 
1048 
              commonFieldsHtml.fieldInput.nameAttr +
 - 
 
1049 
              ' value="other"' +
 - 
 
1050 
              commonFieldsHtml.fieldInput.classAttr +
 - 
 
1051 
              commonFieldsHtml.dataIdAttr +
 - 
 
1052 
            '>' +
 - 
 
1053 
          'Autre</label>';
 - 
 
1054 
        }
 - 
 
1055 
      // Fin du conteneur
 - 
 
1056 
      fieldHtml += '</div>';
 - 
 
1057 
      break;
 - 
 
1058 
 
 - 
 
1059 
    case 'list-checkbox':
 - 
 
1060 
      commonFieldsHtml.fieldLabel.classAttr = ' class="radio-label"';
 - 
 
1061 
      fieldHtml =
 - 
 
1062 
        // Classe 'and-help'
 - 
 
1063 
        '<div class="multiselect  add-field-select' + commonFieldsHtml.helpClass + '"' +
 - 
 
1064 
          // DataId
 - 
 
1065 
          commonFieldsHtml.dataIdAttr +
 - 
 
1066 
        '>' +
 - 
 
1067 
          '<label style="width:100%">' +
 - 
 
1068 
            // Nom du champ
 - 
 
1069 
            listFieldsHtml.containerContent +
 - 
 
1070 
            // Bouton 'help'
 - 
 
1071 
            commonFieldsHtml.helpButton +
 - 
 
1072 
          '</label>' +
 - 
 
1073 
          '<div class="mt-3">'+
 - 
 
1074 
            '<div class="selectBox"' +
 - 
 
1075 
              // DataId
 - 
 
1076 
              commonFieldsHtml.dataIdAttr +
 - 
 
1077 
            '>' +
 - 
 
1078 
              '<select' +
 - 
 
1079 
                // DataId
 - 
 
1080 
                commonFieldsHtml.dataIdAttr +
 - 
 
1081 
                // Required
 - 
 
1082 
                commonFieldsHtml.fieldInput.mandatoryAttr +
 - 
 
1083 
                // Info bulle
 - 
 
1084 
                commonFieldsHtml.titleAttr +
 - 
 
1085 
                // Class
 - 
 
1086 
                ' class="form-control custom-select ' + fieldElement + '"' +
 - 
 
1087 
              '>' +
 - 
 
1088 
                // Apparait dans la barre de sélection
 - 
 
1089 
                '<option>Plusieurs choix possibles</option>' +
 - 
 
1090 
              '</select>' +
 - 
 
1091 
              '<div class="overSelect"></div>' +
 - 
 
1092 
            '</div>' +
 - 
 
1093 
            '<div class="checkboxes hidden"' +
 - 
 
1094 
              // DataId
 - 
 
1095 
              commonFieldsHtml.dataIdAttr +
 - 
 
1096 
            '>';
 - 
 
1097 
      // On déroule les différentes valeurs
 - 
 
1098 
      for( let i = 0; i < count; i++ ) {
 - 
 
1099 
        let fieldOption = fieldOptions[i];
 - 
 
1100 
        // Type="checkbox"
 - 
 
1101 
        commonFieldsHtml.fieldInput.typeAttr = ' type="checkbox"';
 - 
 
1102 
        // Id
 - 
 
1103 
        listFieldsHtml.inputIdAttr = ' id="' + fieldOption.optionValue.replace( /(')/gm, '&apos;' ).replace( /(")/gm, '&quot;' ).toLowerCase() + '"';
 - 
 
1104 
        // For
 - 
 
1105 
        listFieldsHtml.forAttr = ' for="' + fieldOption.optionValue.replace( /(')/gm, '&apos;' ).replace( /(")/gm, '&quot;' ).toLowerCase() + '"';
 - 
 
1106 
        // Default
 - 
 
1107 
        listFieldsHtml.defaultAttr = '';//réinitialisation
 - 
 
1108 
        if( fieldOption.isDefault ) {
 - 
 
1109 
          listFieldsHtml.defaultAttr = ' checked';//affectation
 - 
 
1110 
        }
 - 
 
1111 
        // value-id
 - 
 
1112 
        if( '' !== fieldOption.optionIndex ) {
 - 
 
1113 
          listFieldsHtml.optionIdAttr = ' value-id="' + fieldOption.optionIndex + '"';
 - 
 
1114 
        }
 - 
 
1115 
 
 - 
 
1116 
        fieldHtml +=
 - 
 
1117 
          '<label' +
 - 
 
1118 
            // For
 - 
 
1119 
            listFieldsHtml.forAttr +
 - 
 
1120 
            // value-id
 - 
 
1121 
            listFieldsHtml.optionIdAttr +
 - 
 
1122 
            // Class du label
 - 
 
1123 
            commonFieldsHtml.fieldLabel.classAttr+
 - 
 
1124 
          '>' +
 - 
 
1125 
            '<input type="checkbox"' +
 - 
 
1126 
              // Id
 - 
 
1127 
              listFieldsHtml.inputIdAttr +
 - 
 
1128 
              // value-id
 - 
 
1129 
              listFieldsHtml.optionIdAttr +
 - 
 
1130 
              // Name
 - 
 
1131 
              commonFieldsHtml.fieldInput.nameAttr +
 - 
 
1132 
              // Value
 - 
 
1133 
              ' value="' + fieldOption.optionValue.replace( /(')/gm, '&apos;' ).replace( /(")/gm, '&quot;' ) + '"' +
 - 
 
1134 
              // Checked
 - 
 
1135 
              listFieldsHtml.defaultAttr +
 - 
 
1136 
              // Class="nom du champ"
 - 
 
1137 
              commonFieldsHtml.fieldInput.classAttr +
 - 
 
1138 
              // DataId
 - 
 
1139 
              commonFieldsHtml.dataIdAttr +
 - 
 
1140 
            '>' +
 - 
 
1141 
            // Label de l'option
 - 
 
1142 
            fieldOption.optionText.replace( /(')/gm, '&apos;' ).replace( /(")/gm, '&quot;' ) +
 - 
 
1143 
          '</label>';
 - 
 
1144 
      }
 - 
 
1145 
      // Si valeur "autre" est cochée
 - 
 
1146 
      if( fieldOtherValue ) {
 - 
 
1147 
        fieldHtml +=
 - 
 
1148 
          '<label for="other"' +
 - 
 
1149 
            // DataId
 - 
 
1150 
            commonFieldsHtml.dataIdAttr +
 - 
 
1151 
          '>' +
 - 
 
1152 
            '<input type="checkbox"' +
 - 
 
1153 
              ' id="other-' + fieldElement + '-' + index + '"' +
 - 
 
1154 
              commonFieldsHtml.fieldInput.nameAttr +
 - 
 
1155 
              ' value="other"' +
 - 
 
1156 
              commonFieldsHtml.fieldInput.classAttr +
 - 
 
1157 
              // DataId
 - 
 
1158 
              commonFieldsHtml.dataIdAttr +
 - 
 
1159 
            '>' +
 - 
 
1160 
          'Autre</label>';
 - 
 
1161 
      }
 - 
 
1162 
      // Fermeture des conteneurs .multiselect .checkboxes
 - 
 
1163 
      fieldHtml +=
 - 
 
1164 
            '</div>'+
 - 
 
1165 
          '</div>'+
 - 
 
1166 
        '</div>';
 - 
 
1167 
      break;
 - 
 
1168 
 
 - 
 
1169 
    case 'select':
 - 
 
1170 
      commonFieldsHtml.fieldInput.classAttr = commonFieldsHtml.fieldInput.classAttr.slice(0, -1);
 - 
 
1171 
      commonFieldsHtml.fieldInput.classAttr += ' form-control custom-select"';
 - 
 
1172 
      fieldHtml =
 - 
 
1173 
        // Conteneur/Wrapper
 - 
 
1174 
        // +Classe 'and-help'
 - 
 
1175 
        '<div class="add-field-select ' + fieldElement + commonFieldsHtml.helpClass + '"' +
 - 
 
1176 
          // DataID
 - 
 
1177 
          commonFieldsHtml.dataIdAttr +
 - 
 
1178 
        '>' +
 - 
 
1179 
          '<label class="mt-3" style="width:100%"' +
 - 
 
1180 
            commonFieldsHtml.fieldLabel.forAttr +
 - 
 
1181 
            // Info bulle
 - 
 
1182 
            commonFieldsHtml.titleAttr +
 - 
 
1183 
          '>' +
 - 
 
1184 
            // Nom du champ
 - 
 
1185 
            listFieldsHtml.containerContent +
 - 
 
1186 
            // Bouton 'help'
 - 
 
1187 
            commonFieldsHtml.helpButton +
 - 
 
1188 
          '</label>' +
 - 
 
1189 
          '<select' +
 - 
 
1190 
            commonFieldsHtml.fieldInput.nameAttr +
 - 
 
1191 
            ' id="' + fieldKey + '"' +
 - 
 
1192 
            // Class
 - 
 
1193 
            commonFieldsHtml.fieldInput.classAttr +
 - 
 
1194 
            // Required
 - 
 
1195 
            commonFieldsHtml.fieldInput.mandatoryAttr +
 - 
 
1196 
            // DataId
 - 
 
1197 
            commonFieldsHtml.dataIdAttr +
 - 
 
1198 
          '>';
 - 
 
1199 
 
 - 
 
1200 
      // On déroule les différentes valeurs
 - 
 
1201 
      for( let i = 0; i < count; i++ ) {
 - 
 
1202 
        let fieldOption = fieldOptions[i];
 - 
 
1203 
        // Default
 - 
 
1204 
        listFieldsHtml.defaultAttr = '';//réinitialisation
 - 
 
1205 
        if( fieldOption.isDefault ) {//affectation
 - 
 
1206 
          listFieldsHtml.defaultAttr = ' selected="selected"';
 - 
 
1207 
        }
 - 
 
1208 
        // value-id
 - 
 
1209 
        if( '' !== fieldOption.optionIndex ) {
 - 
 
1210 
          listFieldsHtml.optionIdAttr = ' value-id="' + fieldOption.optionIndex + '"';
 - 
 
1211 
        }
 - 
 
1212 
 
 - 
 
1213 
        fieldHtml +=
 - 
 
1214 
          '<option' +
 - 
 
1215 
            // Value
 - 
 
1216 
            ' value="' + fieldOption.optionValue.replace( /(')/gm, '&apos;' ).replace( /(")/gm, '&quot;' ) + '"' +
 - 
 
1217 
            // Value-id
 - 
 
1218 
            listFieldsHtml.optionIdAttr +
 - 
 
1219 
            // Selected
 - 
 
1220 
            listFieldsHtml.defaultAttr +
 - 
 
1221 
          '>' +
 - 
 
1222 
            // Option
 - 
 
1223 
            fieldOption.optionText.replace( /(')/gm, '&apos;' ).replace( /(")/gm, '&quot;' ) +
 - 
 
1224 
          '</option>';
 - 
 
1225 
      }
 - 
 
1226 
      // Si valeur "autre" est cochée
 - 
 
1227 
      if( fieldOtherValue ) {
 - 
 
1228 
        fieldHtml +=
 - 
 
1229 
          '<option class="other" value="other"' + commonFieldsHtml.dataIdAttr + '>' +
 - 
 
1230 
            'Autre' +
 - 
 
1231 
          '</option>';
 - 
 
1232 
      }
 - 
 
1233 
      // Fermeture des conteneurs
 - 
 
1234 
      fieldHtml +=
 - 
 
1235 
          '</select>' +
 - 
 
1236 
        // Fin du conteneur/wrapper
 - 
 
1237 
        '</div>';
 - 
 
1238 
      break;
 - 
 
1239 
 
 - 
 
1240 
    case 'textarea':
 - 
 
1241 
    // Ouvrir l'attribut class (suppression de '"')
 - 
 
1242 
      commonFieldsHtml.fieldInput.classAttr = commonFieldsHtml.fieldInput.classAttr.slice(0, -1);
 - 
 
1243 
      // Classe 'custom-range'
 - 
 
1244 
      commonFieldsHtml.fieldInput.classAttr += ' form-control"';
 - 
 
1245 
      // Classe 'and-help'
 - 
 
1246 
      commonFieldsHtml.fieldLabel.classAttr = ' class="mt-3 ' + commonFieldsHtml.helpClass + '"';
 - 
 
1247 
      // Autres attributs
 - 
 
1248 
      commonFieldsHtml.fieldInput.otherAttr += ' id="' + fieldKey + '"';
 - 
 
1249 
 
 - 
 
1250 
      fieldHtml =
 - 
 
1251 
        '<label  style="width:100%"' +
 - 
 
1252 
          // For
 - 
 
1253 
          commonFieldsHtml.fieldLabel.forAttr +
 - 
 
1254 
          // Class
 - 
 
1255 
          commonFieldsHtml.fieldLabel.classAttr +
 - 
 
1256 
          // Info-bulle
 - 
 
1257 
          commonFieldsHtml.titleAttr +
 - 
 
1258 
          // Autres attributs
 - 
 
1259 
          commonFieldsHtml.fieldLabel.otherAttr +
 - 
 
1260 
        '>' +
 - 
 
1261 
          // Nom du champ
 - 
 
1262 
          commonFieldsHtml.fieldLabel.labelContent +
 - 
 
1263 
          // Bouton 'help'
 - 
 
1264 
          commonFieldsHtml.helpButton +
 - 
 
1265 
        '</label>' +
 - 
 
1266 
        '<textarea' +
 - 
 
1267 
          // Name
 - 
 
1268 
          commonFieldsHtml.fieldInput.nameAttr +
 - 
 
1269 
          // DataId
 - 
 
1270 
          commonFieldsHtml.dataIdAttr +
 - 
 
1271 
          // Class
 - 
 
1272 
          commonFieldsHtml.fieldInput.classAttr +
 - 
 
1273 
          // Info-bulle
 - 
 
1274 
          commonFieldsHtml.titleAttr +
 - 
 
1275 
          // Info-bulle
 - 
 
1276 
          commonFieldsHtml.fieldInput.placeholderAttr +
 - 
 
1277 
          // Required
 - 
 
1278 
          commonFieldsHtml.fieldInput.mandatoryAttr +
 - 
 
1279 
          // Autres attributs
 - 
 
1280 
          commonFieldsHtml.fieldInput.otherAttr +
 - 
 
1281 
        '></textarea>';
 - 
 
1282 
        break;
 - 
 
1283 
 
 - 
 
1284 
    case 'range':
 - 
 
1285 
      // Ouvrir l'attribut class (suppression de '"')
 - 
 
1286 
      commonFieldsHtml.fieldInput.classAttr = commonFieldsHtml.fieldInput.classAttr.slice(0, -1);
 - 
 
1287 
      // Classe 'custom-range'
 - 
 
1288 
      commonFieldsHtml.fieldInput.classAttr += ' custom-range form-control pl-3"';
 - 
 
1289 
      // Classe 'and-help'
 - 
 
1290 
      commonFieldsHtml.fieldLabel.classAttr = ' class="mt-3 ' + commonFieldsHtml.helpClass + '"';
 - 
 
1291 
      // Step
 - 
 
1292 
      if( '' !== fieldStep ) {
 - 
 
1293 
        commonFieldsHtml.fieldInput.otherAttr += ' step="' +  fieldStep + '"';
 - 
 
1294 
      }
 - 
 
1295 
      // Min
 - 
 
1296 
      if( '' !== fieldMin ) {
 - 
 
1297 
        commonFieldsHtml.fieldInput.otherAttr += ' min="' +  fieldMin + '"';
 - 
 
1298 
      }
 - 
 
1299 
      //Max
 - 
 
1300 
      if( '' !== fieldMax ) {
 - 
 
1301 
        commonFieldsHtml.fieldInput.otherAttr += ' max="' +  fieldMax + '"';
 - 
 
1302 
      }
 - 
 
1303 
      fieldHtml =
 - 
 
1304 
        '<div' +
 - 
 
1305 
          ' class="range"' +
 - 
 
1306 
          ' id="' + fieldKey + '"' +
 - 
 
1307 
        '>' +
 - 
 
1308 
          '<label style="width:100%"' +
 - 
 
1309 
            // For
 - 
 
1310 
            commonFieldsHtml.fieldLabel.forAttr +
 - 
 
1311 
            // Class
 - 
 
1312 
            commonFieldsHtml.fieldLabel.classAttr +
 - 
 
1313 
            // Info-bulle
 - 
 
1314 
            commonFieldsHtml.titleAttr +
 - 
 
1315 
            // Autres attributs
 - 
 
1316 
            commonFieldsHtml.fieldLabel.otherAttr +
 - 
 
1317 
          '>' +
 - 
 
1318 
            // Nom du champ
 - 
 
1319 
            commonFieldsHtml.fieldLabel.labelContent +
 - 
 
1320 
            // Bouton 'help'
 - 
 
1321 
            commonFieldsHtml.helpButton +
 - 
 
1322 
          '</label>' +
 - 
 
1323 
          '<div class="col-sm-12 row" style="max-width=100%">' +
 - 
 
1324 
          // Visualiser min max et la valeur de range
 - 
 
1325 
            '<p class="col-sm-2 range-values text-center font-weight-bold">'+
 - 
 
1326 
              'Min ' + fieldMin +
 - 
 
1327 
            '</p>'+
 - 
 
1328 
            '<div class="range-live-value range-values text-center font-weight-bold col-sm-7">'+
 - 
 
1329 
              fieldDefaultNum +
 - 
 
1330 
            '</div>'+
 - 
 
1331 
            '<p class="col-sm-2 range-values text-center font-weight-bold">'+
 - 
 
1332 
              'Max ' + fieldMax +
 - 
 
1333 
            '</p>' +
 - 
 
1334 
 
 - 
 
1335 
            '<input' +
 - 
 
1336 
              // Type
 - 
 
1337 
              commonFieldsHtml.fieldInput.typeAttr +
 - 
 
1338 
              // Name
 - 
 
1339 
              commonFieldsHtml.fieldInput.nameAttr +
 - 
 
1340 
              // DataId
 - 
 
1341 
              commonFieldsHtml.dataIdAttr +
 - 
 
1342 
              // Class
 - 
 
1343 
              commonFieldsHtml.fieldInput.classAttr +
 - 
 
1344 
              // Info-bulle
 - 
 
1345 
              commonFieldsHtml.titleAttr +
 - 
 
1346 
              // Required
 - 
 
1347 
              commonFieldsHtml.fieldInput.mandatoryAttr +
 - 
 
1348 
              // Default
 - 
 
1349 
              ' value="' + fieldDefaultNum + '"' +
 - 
 
1350 
              // Autres attributs
 - 
 
1351 
              commonFieldsHtml.fieldInput.otherAttr +
 - 
 
1352 
            '>' +
 - 
 
1353 
          '</div>'
 - 
 
1354 
        '</div>';
 - 
 
1355 
        break;
 - 
 
1356 
 
 - 
 
1357 
    case 'number':
 - 
 
1358 
      // Step
 - 
 
1359 
      if( '' !== fieldStep ) {
 - 
 
1360 
        commonFieldsHtml.fieldInput.otherAttr += ' step="' +  fieldStep + '"';
 - 
 
1361 
      }
 - 
 
1362 
    case 'date':
 - 
 
1363 
      // Ouvrir l'attribut class (suppression de '"')
 - 
 
1364 
      commonFieldsHtml.fieldInput.classAttr = commonFieldsHtml.fieldInput.classAttr.slice(0, -1);
 - 
 
1365 
      // Classe 'and-help'
 - 
 
1366 
      commonFieldsHtml.fieldInput.classAttr += commonFieldsHtml.helpClass + ' form-control"';
 - 
 
1367 
      // Min
 - 
 
1368 
      if( '' !== fieldMin ) {
 - 
 
1369 
        commonFieldsHtml.fieldInput.otherAttr += ' min="' +  fieldMin + '"';
 - 
 
1370 
      }
 - 
 
1371 
      // Max
 - 
 
1372 
      if( '' !== fieldMax ) {
 - 
 
1373 
        commonFieldsHtml.fieldInput.otherAttr += ' max="' +  fieldMax + '"';
 - 
 
1374 
      }
 - 
 
1375 
      // Class du label
 - 
 
1376 
      commonFieldsHtml.fieldLabel.classAttr = 'class="mt-3"';
 - 
 
1377 
      fieldHtml =
 - 
 
1378 
        '<div class="number">' +
 - 
 
1379 
          '<label style="width:100%"' +
 - 
 
1380 
            // For
 - 
 
1381 
            commonFieldsHtml.fieldLabel.forAttr +
 - 
 
1382 
            // Class
 - 
 
1383 
            commonFieldsHtml.fieldLabel.classAttr +
 - 
 
1384 
            // Info-bulle
 - 
 
1385 
            commonFieldsHtml.titleAttr +
 - 
 
1386 
            // Autres attributs
 - 
 
1387 
            commonFieldsHtml.fieldLabel.otherAttr +
 - 
 
1388 
          '>' +
 - 
 
1389 
            // Nom du champ
 - 
 
1390 
            commonFieldsHtml.fieldLabel.labelContent +
 - 
 
1391 
            // Bouton 'help'
 - 
 
1392 
            commonFieldsHtml.helpButton +
 - 
 
1393 
          '</label>' +
 - 
 
1394 
          '<input' +
 - 
 
1395 
            // Type
 - 
 
1396 
            commonFieldsHtml.fieldInput.typeAttr +
 - 
 
1397 
            // Name
 - 
 
1398 
            commonFieldsHtml.fieldInput.nameAttr +
 - 
 
1399 
            // DataId
 - 
 
1400 
            commonFieldsHtml.dataIdAttr +
 - 
 
1401 
            // Class
 - 
 
1402 
            commonFieldsHtml.fieldInput.classAttr +
 - 
 
1403 
            // Info-bulle
 - 
 
1404 
            commonFieldsHtml.titleAttr +
 - 
 
1405 
            // Placeholder
 - 
 
1406 
            commonFieldsHtml.fieldInput.placeholderAttr +
 - 
 
1407 
            // Required
 - 
 
1408 
            commonFieldsHtml.fieldInput.mandatoryAttr +
 - 
 
1409 
            // Default
 - 
 
1410 
            ' value="' + fieldDefaultNum + '"' +
 - 
 
1411 
            // Autres attributs
 - 
 
1412 
            commonFieldsHtml.fieldInput.otherAttr +
 - 
 
1413 
          '>' +
 - 
 
1414 
        '</div>';
 - 
 
1415 
        break;
 - 
 
1416 
 
 - 
 
1417 
    case 'text' :
 - 
 
1418 
    case 'email':
 - 
 
1419 
    default:
 - 
 
1420 
      // Ouvrir l'attribut class (suppression de '"')
 - 
 
1421 
      commonFieldsHtml.fieldInput.classAttr = commonFieldsHtml.fieldInput.classAttr.slice(0, -1);
 - 
 
1422 
      // Classe 'and-help'
 - 
 
1423 
      commonFieldsHtml.fieldInput.classAttr += commonFieldsHtml.helpClass + ' form-control"';
 - 
 
1424 
      // Class du label
 - 
 
1425 
      commonFieldsHtml.fieldLabel.classAttr = 'class="mt-3"';
 - 
 
1426 
 
 - 
 
1427 
      fieldHtml =
 - 
 
1428 
        '<label style="width:100%"' +
 - 
 
1429 
          // For
 - 
 
1430 
          commonFieldsHtml.fieldLabel.forAttr +
 - 
 
1431 
          // Class
 - 
 
1432 
          commonFieldsHtml.fieldLabel.classAttr +
 - 
 
1433 
          // Info-bulle
 - 
 
1434 
          commonFieldsHtml.titleAttr +
 - 
 
1435 
          // Autres attributs
 - 
 
1436 
          commonFieldsHtml.fieldLabel.otherAttr +
 - 
 
1437 
        '>' +
 - 
 
1438 
          // Nom du champ
 - 
 
1439 
          commonFieldsHtml.fieldLabel.labelContent +
 - 
 
1440 
          // Bouton 'help'
 - 
 
1441 
          commonFieldsHtml.helpButton +
 - 
 
1442 
        '</label>' +
 - 
 
1443 
        '<input' +
 - 
 
1444 
          // Type
 - 
 
1445 
          commonFieldsHtml.fieldInput.typeAttr +
 - 
 
1446 
          // Name
 - 
 
1447 
          commonFieldsHtml.fieldInput.nameAttr +
 - 
 
1448 
          // DataId
 - 
 
1449 
          commonFieldsHtml.dataIdAttr +
 - 
 
1450 
          // Class
 - 
 
1451 
          commonFieldsHtml.fieldInput.classAttr +
 - 
 
1452 
          // Info-bulle
 - 
 
1453 
          commonFieldsHtml.titleAttr +
 - 
 
1454 
          // Placeholder
 - 
 
1455 
          commonFieldsHtml.fieldInput.placeholderAttr +
 - 
 
1456 
          // Required
 - 
 
1457 
          commonFieldsHtml.fieldInput.mandatoryAttr +
 - 
 
1458 
          // Autres attributs
 - 
 
1459 
          commonFieldsHtml.fieldInput.otherAttr +
 - 
 
1460 
        '>';
 - 
 
1461 
      break;
 - 
 
1462 
  }
 - 
 
1463 
  return fieldHtml;
 - 
 
1464 
}
 - 
 
1465 
 
 - 
 
1466 
// Construire un tableau des options pour chaque élément de listes
 - 
 
1467 
function collectListOptions( thisFieldset ) {
 - 
 
1468 
  var $details = $( '.field-details' , thisFieldset ),
 - 
 
1469 
      options = [];
 - 
 
1470 
 
 - 
 
1471 
  $details.find( '.new-value' ).each( function() {
 - 
 
1472 
    options.push({
 - 
 
1473 
      // Valeur transmise (value)
 - 
 
1474 
      optionValue : $( this ).find( '.list-value' ).val().toLowerCase(),
 - 
 
1475 
      // Valeur Visible
 - 
 
1476 
      optionText  : $( this ).find( '.displayed-label' ).val(),
 - 
 
1477 
      // Booléen "default"
 - 
 
1478 
      isDefault   : $( this ).find( '.is-defaut-value' ).is( ':checked' ),
 - 
 
1479 
      // Indice de l'option
 - 
 
1480 
      optionIndex : $( this ).data( 'list-value-id' )
 - 
 
1481 
    });
 - 
 
1482 
  });
 - 
 
1483 
  return options;
 - 
 
1484 
}
 - 
 
1485 
 
 - 
 
1486 
// Faire apparaitre un champ text "Autre"
 - 
 
1487 
function onOtherOption( thisFieldset , index ) {
 - 
 
1488 
  // Ce champ (dans la prévisualisation)
 - 
 
1489 
  var thisPreviewFieldset = $( '.preview-fields[data-id="' + index + '"]'),
 - 
 
1490 
      // L'élément choisi
 - 
 
1491 
      element             = $('.field-element' , thisFieldset ).val(),
 - 
 
1492 
      // Où insérer le champ "Autre"
 - 
 
1493 
      $element            = $( '.' + element , thisPreviewFieldset ),
 - 
 
1494 
      // html du champ "Autre"
 - 
 
1495 
      collectOther        =
 - 
 
1496 
      '<div class="col-sm-12 mt-1 collect-other-block">'+
 - 
 
1497 
        '<label data-id="' + index + '" for="collect-other" style="font-weight:300">Autre option :</label>' +
 - 
 
1498 
        '<input type="text" name="collect-other" data-id="' + index + '" class="collect-other form-control" >'+
 - 
 
1499 
      '</div>';
 - 
 
1500 
  // Pouvoir supprimer le champ "Autre"
 - 
 
1501 
  function optionRemove( thisPreviewFieldset ) {
 - 
 
1502 
    $( '.collect-other-block' , thisPreviewFieldset ).remove();
 - 
 
1503 
  }
 - 
 
1504 
 
 - 
 
1505 
  switch( element ) {
 - 
 
1506 
    case 'radio' :
 - 
 
1507 
      // Lorsqu'un nouveau bouton est coché
 - 
 
1508 
      $( 'input' , thisPreviewFieldset ).on( 'change' , function () {
 - 
 
1509 
        if( 'other' === $( this ).val() ) {
 - 
 
1510 
          // Insertion du champ "Autre" après les boutons
 - 
 
1511 
          $element.after( collectOther );
 - 
 
1512 
        } else {
 - 
 
1513 
          // Suppression du champ autre
 - 
 
1514 
          optionRemove( thisPreviewFieldset );
 - 
 
1515 
        }
 - 
 
1516 
      });
 - 
 
1517 
      break;
 - 
 
1518 
 
 - 
 
1519 
    case 'select' :
 - 
 
1520 
      // Lorsque l'option "Autre" est selectionnée
 - 
 
1521 
      $( 'select' , thisPreviewFieldset ).on( 'change' , function () {
 - 
 
1522 
        if( 'other' === $( this).val() ) {
 - 
 
1523 
          // Insertion du champ "Autre" après les boutons
 - 
 
1524 
          $element.after( collectOther );
 - 
 
1525 
          // Suppression du champ autre
 - 
 
1526 
        } else {
 - 
 
1527 
          optionRemove( thisPreviewFieldset );
 - 
 
1528 
        }
 - 
 
1529 
      });
 - 
 
1530 
      break;
 - 
 
1531 
 
 - 
 
1532 
    case 'list-checkbox' :
 - 
 
1533 
      // Lorsque "Autre" est coché
 - 
 
1534 
      $( 'input#other-' + element + '-' + index, thisPreviewFieldset ).on( 'click' , function () {
 - 
 
1535 
        // Insertion du champ "Autre" après les boutons
 - 
 
1536 
        if( $( this ).is( ':checked' ) ) {
 - 
 
1537 
          $( '.checkboxes', thisPreviewFieldset ).append( collectOther );
 - 
 
1538 
        } else {
 - 
 
1539 
          // Suppression du champ autre
 - 
 
1540 
          optionRemove( thisPreviewFieldset );
 - 
 
1541 
        }
 - 
 
1542 
      });
 - 
 
1543 
      break;
 - 
 
1544 
    case 'checkbox' :
 - 
 
1545 
      // Lorsque "Autre" est coché
 - 
 
1546 
      $( 'input#other-' + element + '-' + index, thisPreviewFieldset ).on( 'click' , function () {
 - 
 
1547 
        // Insertion du champ "Autre" après les boutons
 - 
 
1548 
        if( $( this ).is( ':checked' ) ) {
 - 
 
1549 
          $element.after( collectOther );
 - 
 
1550 
        } else {
 - 
 
1551 
          // Suppression du champ autre
 - 
 
1552 
          optionRemove( thisPreviewFieldset );
 - 
 
1553 
        }
 - 
 
1554 
      });
 - 
 
1555 
      break;
 - 
 
1556 
 
 - 
 
1557 
    default :
 - 
 
1558 
      break;
 - 
 
1559 
  }
 - 
 
1560 
}
 - 
 
1561 
 
 - 
 
1562 
// Prévisualisation des nouveaux champs
 - 
 
1563 
function newFieldsPreview() {
 - 
 
1564 
  var count = $( 'fieldset' ).last().data( 'id' );
 - 
 
1565 
  // Si on a déjà prévisualisé on efface tout pour recommencer
 - 
 
1566 
  if( 0 < $( '.preview-fields' ).length ) {
 - 
 
1567 
    $( '.preview-fields' ).each( function () {
 - 
 
1568 
      $( this ).remove();
 - 
 
1569 
    });
 - 
 
1570 
  }
 - 
 
1571 
  // Au premier ajout d'un champ dans la prévisualisation on ajoute un titre et un message
 - 
 
1572 
  if( true === firstClick ) {
 - 
 
1573 
    $( '#zone-supp' ).prepend(
 - 
 
1574 
      '<h2>Informations propres au projet</h2>' +
 - 
 
1575 
      '<div class="message">L\'objectif principal de cet aperçu est de vérifier les contenus et repérer d\'éventuelles erreurs</div>'
 - 
 
1576 
    );
 - 
 
1577 
  }
 - 
 
1578 
  // Parcourir tous les blocs d'infos de champs supplémentaires
 - 
 
1579 
  for( var index = $( 'fieldset' ).first().data( 'id' ) ; index <= count ; index++ ) {
 - 
 
1580 
    var thisFieldset = $( 'fieldset[data-id="' + index + '"]');
 - 
 
1581 
    // Certains indices peuvent correspondre à un champ supprimé
 - 
 
1582 
    if( 0 < $( thisFieldset ).length ) {
 - 
 
1583 
      // Prévisualisation d'un champ
 - 
 
1584 
      $( '#zone-supp .preview-container' ).append(
 - 
 
1585 
        '<div class="preview-fields col-sm-12 row" data-id="' + index + '">'+
 - 
 
1586 
          onClickPreviewField( thisFieldset , index ) +
 - 
 
1587 
        '</div>'
 - 
 
1588 
      );
 - 
 
1589 
      // Ajout/suppression d'un champ texte "Autre"
 - 
 
1590 
      if( $( '.option-other-value' , thisFieldset ).is( ':checked' ) ) {
 - 
 
1591 
        onOtherOption( thisFieldset , index);
 - 
 
1592 
      }
 - 
 
1593 
    }
 - 
 
1594 
  }
 - 
 
1595 
  // Le titre + message de la section prévisualisation ne sont ajoutés qu'une fois
 - 
 
1596 
  firstClick = false;
 - 
 
1597 
}
 - 
 
1598 
 
 - 
 
1599 
// Activation/Desactivation et contenu de la modale Bootstrap
 - 
 
1600 
// https://getbootstrap.com/docs/3.3/javascript/#modals
 - 
 
1601 
function previewFieldHelpModal() {
 - 
 
1602 
  $( '#zone-supp' ).on( 'click' , '.help-button' , function ( event ) {
 - 
 
1603 
    var index = $( this ).closest( '.preview-fields' ).data( 'id' ),
 - 
 
1604 
        thisFieldset = $( '.new-field[data-id="' + index + '"]' ),
 - 
 
1605 
        file = $( '.field-help' , thisFieldset )[0].files[0],
 - 
 
1606 
        tmppath = URL.createObjectURL( file );
 - 
 
1607 
    // Titre
 - 
 
1608 
    $( '#help-modal-label' ).text( 'Aide pour : ' +  $( '.field-name' , thisFieldset ).val() );
 - 
 
1609 
    // Contenu
 - 
 
1610 
    if( file.type.match( 'image/*' ) ) {
 - 
 
1611 
        $( '#print_content' ).append( '<img src="' + tmppath + '" style="max-width:100%">' );
 - 
 
1612 
    } else {
 - 
 
1613 
      $( '#print_content' ).append( '<p>Erreur : le fichier n\'est pas une image</p>' );
 - 
 
1614 
    }
 - 
 
1615 
    // Sortie avec la touche escape
 - 
 
1616 
    $( '#help-modal' ).modal( { keyboard : true } );
 - 
 
1617 
    // Affichage
 - 
 
1618 
    $( '#help-modal' ).modal({ show: true });
 - 
 
1619 
    // Remplacer l'autofocus qui ne fonctionne plus en HTML5
 - 
 
1620 
    // Message dans la doc de bootstrap :
 - 
 
1621 
    // Due to how HTML5 defines its semantics,
 - 
 
1622 
    // the autofocus HTML attribute has no effect in Bootstrap modals.
 - 
 
1623 
    // To achieve the same effect, use some custom JavaScript
 - 
 
1624 
    $( '#help-modal' ).on( 'shown.bs.modal' , function () {
 - 
 
1625 
      $( '#myInput' ).trigger( 'focus' );
 - 
 
1626 
    })
 - 
 
1627 
    // Réinitialisation
 - 
 
1628 
    $( '#help-modal' ).on( 'hidden.bs.modal' , function () {
 - 
 
1629 
      $( '#help-modal-label' ).text();
 - 
 
1630 
      $( '#print_content' ).empty();
 - 
 
1631 
    })
 - 
 
1632 
  });
 - 
 
1633 
}
 - 
 
1634 
 
 - 
 
1635 
function potDeMiel() {
 - 
 
1636 
  if( !valeurOk( $( '#basic-widget-form #email' ).val() ) ) {
 - 
 
1637 
    $( '#signup_submit' ).prop( 'disabled', false );
 - 
 
1638 
  }
 - 
 
1639 
  $( '#signup_submit' ).off().on( 'click dblclick mousedown submit focus keydown keypress keyup touchstart touchend', function() {
 - 
 
1640 
    if( valeurOk( $( '#basic-widget-form #email' ).val() ) ) {
 - 
 
1641 
      return false;
 - 
 
1642 
    }
 - 
 
1643 
  });
 - 
 
1644 
  $( '#basic-widget-form #email' ).css({ position : 'absolute', left : '-2000px' }).on( 'input blur change', function( event ) {
 - 
 
1645 
    event.preventDefault();
 - 
 
1646 
    if( valeurOk( $( this ).val() ) ) {
 - 
 
1647 
      $( 'form' ).each( function() {
 - 
 
1648 
        $( this )[0].reset();
 - 
 
1649 
      });
 - 
 
1650 
      $( '#signup_submit' ).prop( 'disabled', true );
 - 
 
1651 
    }
 - 
 
1652 
  });
 - 
 
1653 
}
 - 
 
1654 
 
 - 
 
1655 
function onGeoloc() {
 - 
 
1656 
  // Empêcher que le module carto ne bind ses events partout
 - 
 
1657 
  $( '#tb-geolocation' ).on( 'submit blur click focus mousedown mouseleave mouseup change', '*', function( event ) {
 - 
 
1658 
    event.preventDefault();
 - 
 
1659 
    return false;
 - 
 
1660 
  });
 - 
 
1661 
  // evenement location
 - 
 
1662 
  $( '#tb-geolocation' ).on( 'location' , function( location ) {
 - 
 
1663 
    var locDatas = location.originalEvent.detail;
 - 
 
1664 
 
 - 
 
1665 
    if ( valeurOk( locDatas ) ) {
 - 
 
1666 
      console.dir( locDatas );
 - 
 
1667 
 
 - 
 
1668 
      var latitude  = '';
 - 
 
1669 
      var longitude = '';
 - 
 
1670 
      if ( valeurOk( locDatas.geometry.coordinates ) ) {
 - 
 
1671 
        if ( 'Point' === locDatas.geometry.type ) {
 - 
 
1672 
          if ( valeurOk( locDatas.geometry.coordinates[0] ) ) {
 - 
 
1673 
            longitude = locDatas.geometry.coordinates[0].toFixed( 5 );
 - 
 
1674 
          }
 - 
 
1675 
          if ( valeurOk( locDatas.geometry.coordinates[1] ) ) {
 - 
 
1676 
            latitude = locDatas.geometry.coordinates[1].toFixed( 5 );
 - 
 
1677 
          }
 - 
 
1678 
        } else if ( 'LineString' === locDatas.geometry.type ) {
 - 
 
1679 
          if(this.valOk( locDatas.centroid.coordinates )){
 - 
 
1680 
            if ( this.valOk( locDatas.centroid.coordinates[0] ) ) {
 - 
 
1681 
              longitude = locDatas.centroid.coordinates[0];
 - 
 
1682 
            }
 - 
 
1683 
            if ( this.valOk( locDatas.centroid.coordinates[1] ) ) {
 - 
 
1684 
              latitude = locDatas.centroid.coordinates[1];
 - 
 
1685 
            }
 - 
 
1686 
          } else {// on ne prend qu'un point de la ligne
 - 
 
1687 
            if ( valeurOk( locDatas.geometry.coordinates[0][0] ) ) {
 - 
 
1688 
              longitude = locDatas.geometry.coordinates[0][0];
 - 
 
1689 
              longitude = longitude.toFixed( 5 );
 - 
 
1690 
            }
 - 
 
1691 
            if ( valeurOk( locDatas.geometry.coordinates[0][1] ) ){
 - 
 
1692 
              latitude = locDatas.geometry.coordinates[0][1];
 - 
 
1693 
              latitude = latitude.toFixed( 5 );
 - 
 
1694 
            }
 - 
 
1695 
          }
 - 
 
1696 
        }
 - 
 
1697 
      }
 - 
 
1698 
      if ( valeurOk( latitude ) && valeurOk( longitude ) ) {
 - 
 
1699 
        $( '#latitude' ).val( latitude );
 - 
 
1700 
        $( '#longitude' ).val( longitude );
 - 
 
1701 
      }
 - 
 
1702 
    }
 - 
 
1703 
  });
 - 
 
1704 
}
 - 
 
1705 
 
 - 
 
1706 
function onGeolocManuelle() {
 - 
 
1707 
  const coords = ['latitude','longitude','zoom'];
 - 
 
1708 
  $( '#latitude,#longitude,#zoom' ).on( 'change', function( event ) {
 - 
 
1709 
    var thisCoord    = this.id,
 - 
 
1710 
        thisVal      = $( this ).val(),
 - 
 
1711 
        valeur       = '';
 - 
 
1712 
 
 - 
 
1713 
    if ( $.isNumeric( thisVal ) ) {
 - 
 
1714 
      switch( thisCoord ) {
 - 
 
1715 
        case 'zoom':
 - 
 
1716 
          if( 0 < parseInt( thisVal, 10 ) && 18 >= parseInt( thisVal, 10 ) ) {
 - 
 
1717 
            valeur = thisVal;
 - 
 
1718 
          }
 - 
 
1719 
          break;
 - 
 
1720 
        case 'latitude':
 - 
 
1721 
          if ( 90 > Math.abs( parseInt( thisVal, 10 ) ) ) {
 - 
 
1722 
            valeur = parseFloat( thisVal, 10 ).toFixed( 5 );
 - 
 
1723 
            $( '#latitude' ).val( valeur );
 - 
 
1724 
          }
 - 
 
1725 
          break;
 - 
 
1726 
        case 'longitude':
 - 
 
1727 
          if ( 180 >= Math.abs( parseInt( thisVal, 10 ) ) ) {
 - 
 
1728 
            valeur = parseFloat( thisVal, 10 ).toFixed( 5 );
 - 
 
1729 
            $( '#longitude' ).val( valeur );
 - 
 
1730 
          }
 - 
 
1731 
          break;
 - 
 
1732 
        default:
 - 
 
1733 
          break;
 - 
 
1734 
      }
 - 
 
1735 
    }
 - 
 
1736 
    //un champ vide n'est pas une erreur
 - 
 
1737 
    if ( $.isNumeric( valeur ) ) {
 - 
 
1738 
        $( this ).siblings( 'span.error' ).remove();
 - 
 
1739 
    } else if ( 0 <= $.inArray( thisCoord, coords ) ) {
 - 
 
1740 
      // on ne signale pas d'erreur si il n'y a rien dans le champ
 - 
 
1741 
      if ( !valeurOk( $( this ).siblings( 'span.error' ) ) && valeurOk( $( this ).val() ) ) {
 - 
 
1742 
        $( this ).after( '<span class="error">mauvais format pour ce champ<span>' );
 - 
 
1743 
      } else {
 - 
 
1744 
        $( this ).siblings( 'span.error' ).remove();
 - 
 
1745 
      }
 - 
 
1746 
    }
 - 
 
1747 
  });
 - 
 
1748 
}
 - 
 
1749 
 
 - 
 
1750 
function geolocValidationEtStockage() {
 - 
 
1751 
  $( '#signup_submit' ).off().on( 'click', function( event ) {
 - 
 
1752 
    var localisation = '',
 - 
 
1753 
        latitude     = $( '#latitude' ).val(),
 - 
 
1754 
        longitude    = $( '#longitude' ).val(),
 - 
 
1755 
        zoom         = $( '#zoom' ).val();
 - 
 
1756 
 
 - 
 
1757 
    if ( ( valeurOk( longitude ) && !valeurOk( latitude ) ) || ( !valeurOk( longitude ) && valeurOk( latitude ) ) ) {
 - 
 
1758 
      if( !valeurOk( $( '.warning-carto' ) ) ) {
 - 
 
1759 
        $( '#new-fields-buttons' ).after(
 - 
 
1760 
          '<p class="message warning-carto">'+
 - 
 
1761 
            '<i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i>&nbsp;Vous avez entré des coordonnées incomplètes<br>'+
 - 
 
1762 
            'Complétez latitude ou longitude, ou placez un marqueur sur la carto, ou effacez ces deux champs'+
 - 
 
1763 
          '</p>'
 - 
 
1764 
        );
 - 
 
1765 
      }
 - 
 
1766 
      return false;
 - 
 
1767 
    } else if( valeurOk( $( '.warning-carto' ) ) ) {
 - 
 
1768 
      $( '.warning-carto' ).remove();
 - 
 
1769 
    }
 - 
 
1770 
    if ( valeurOk( latitude ) && valeurOk( longitude ) ) {
 - 
 
1771 
      localisation += 'latitude:' + latitude + ';';
 - 
 
1772 
      localisation += 'longitude:' + longitude;
 - 
 
1773 
    }
 - 
 
1774 
    if ( valeurOk( zoom ) ) {
 - 
 
1775 
      if( valeurOk( localisation ) ) {
 - 
 
1776 
        localisation += ';';
 - 
 
1777 
      }
 - 
 
1778 
      localisation += 'zoom:' + zoom;
 - 
 
1779 
    }
 - 
 
1780 
    if ( valeurOk( localisation ) ) {
 - 
 
1781 
      $( '#localisation' ).val( localisation );
 - 
 
1782 
    }
 - 
 
1783 
  });
 - 
 
1784 
}
 - 
 
1785 
 
 - 
 
1786 
/**
 - 
 
1787 
* Permet à la fois de vérifier qu'une valeur ou objet existe et n'est pas vide
 - 
 
1788 
* et de comparer à une autre valeur :
 - 
 
1789 
* Vérifie qu'une variable ou objet n'est pas : vide, null, undefined, NaN
 - 
 
1790 
* Si comparer est défini on le compare à valeur en fonction de sensComparaison
 - 
 
1791 
* Un booléen est une variable valide : on retourne true
 - 
 
1792 
* @param { string || number || object || undefined } valeur
 - 
 
1793 
* @param { boolean } sensComparaison : true = rechercher, false = refuser
 - 
 
1794 
* @param { string || number || object || undefined || boolean } comparer :valeur à comparer
 - 
 
1795 
* @returns {boolean}
 - 
 
1796 
*/
 - 
 
1797 
function valeurOk( valeur, sensComparaison = true, comparer = undefined ) {
 - 
 
1798 
  var retour;
 - 
 
1799 
  if ( 'boolean' !== typeof valeur ) {
 - 
 
1800 
    switch( typeof valeur ) {
 - 
 
1801 
      case 'string' :
 - 
 
1802 
        retour = ( '' !== valeur );
 - 
 
1803 
        break;
 - 
 
1804 
      case 'number' :
 - 
 
1805 
        retour = ( NaN !== valeur );
 - 
 
1806 
        break;
 - 
 
1807 
      case 'object' :
 - 
 
1808 
        retour = ( null !== valeur && undefined !== valeur && !$.isEmptyObject( valeur ) );
 - 
 
1809 
        if ( undefined !== valeur.length ) {
 - 
 
1810 
          retour = ( retour  && 0 < valeur.length );
 - 
 
1811 
        }
 - 
 
1812 
        break;
 - 
 
1813 
      case 'undefined' :
 - 
 
1814 
      default :
 - 
 
1815 
        retour = false;
 - 
 
1816 
    }
 - 
 
1817 
    if ( retour && comparer !== undefined ) {
 - 
 
1818 
      var resultComparaison = ( comparer === valeur );
 - 
 
1819 
      retour = ( sensComparaison ) ? resultComparaison : !resultComparaison ;
 - 
 
1820 
    }
 - 
 
1821 
    return retour;
 - 
 
1822 
  } else {
 - 
 
1823 
    // Un booléen est une valeur valable
 - 
 
1824 
    return true;
 - 
 
1825 
  }
 - 
 
1826 
}
 - 
 
1827 
 
 - 
 
1828 
/***************************
 - 
 
1829 
 *  Lancement des scripts  *
 - 
 
1830 
 ***************************/
 - 
 
1831 
 
 - 
 
1832 
// Tableau d'envoi des données
 - 
 
1833 
var datasToSubmit = new Array();
 - 
 
1834 
// Variable permettant un seul affichage du titre
 - 
 
1835 
// de la prévisualisation pour les nouveaux champs
 - 
 
1836 
var firstClick = true;
 - 
 
1837 
 
 8 
  const champsSupp = new ChampsSupp();
1838 
jQuery( document ).ready( function() {
 9 
 
1839 
  // reset de tous les formulaires
 10 
  // reset de tous les formulaires
1840 
  $( 'form' ).each( function() {
 11 
  $('form').each(function () {
1841 
    $( this )[0].reset();
 12 
    $(this)[0].reset();
1842 
  });
 13 
  });
1843 
  // Gestion du champ pot de miel
 14 
  // Gestion du champ pot de miel
1844 
  potDeMiel();
 15 
  potDeMiel();
1845 
  // Geoloc
 - 
 
1846 
  onGeoloc();
 - 
 
1847 
  onGeolocManuelle();
 16 
  // Geoloc
1848 
  geolocValidationEtStockage();
 17 
  initGeoloc();
1849 
  // Identifiant de champ
 - 
 
1850 
  var fieldIndex = 0;
 - 
 
1851 
  // Ajout de nouveaux champs
 18 
  // style et affichage de certains champs
1852 
  onClickAddNewFields( fieldIndex );
 19 
  displayFields();
1853 
  // Activation/Desactivation des boutons valider et prévisualiser
 20 
  // affichage et recueil des données des champs supp
1854 
  onClickButtonsTagMissingValues();
 21 
  champsSupp.init();
1855 
  // Prévisualisation des champs classiques
 - 
 
1856 
  DisplayClassicFields();
 - 
 
1857 
  // Affichage des images ou nom des documents importés
 - 
 
1858 
  inputFile();
 - 
 
1859 
  // Affichage des List-checkbox
 - 
 
1860 
  inputListCheckbox();
 - 
 
1861 
  // Activer la checkbox de valeur par default uniquement si une valeur est entrée
 - 
 
1862 
  onInputListValueLabelEnableDefaultCheckbox();
 - 
 
1863 
  // Affichage des Range
 - 
 
1864 
  inputRangeDisplayNumber();
 - 
 
1865 
  // Modale "aide"
 22 
  // Prévisualisation des champs classiques
1866 
  previewFieldHelpModal();
 23 
  displayClassicFields();