WebSVN – eFlore/Applications.cel – Path Comparison – / – /trunk/widget Rev 3170 and /trunk/widget Rev 3171

Ignore whitespace Rev 3170 → Rev 3171

 /trunk/widget/modules/manager/squelettes/creation.tpl.html
 ,8 → 179,19
                   <h2>Ajouter des champs</h2>
                   <p class="message"><i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i> Attention : Ces nouveaux champs (tout comme le widget) ne seront pris en compte qu'une fois le formulaire validé</p>
               </form><!-- #new-fields = fomulaire oû viennent s'insérer les champs supplémentaires -->
-              <label class="add-fields">Ajouter Champ</label>
-              <div class="button" id="add-fields" title="Ajouter un champ"><i class="fa fa-plus" aria-hidden="true"></i></div>
+              <div class="row">
+                <div class="col-md-6">
+                  <label class="add-fields">Ajouter champs</label>
+                  <div class="button" id="add-fields" title="Ajouter un champ"><i class="fa fa-plus" aria-hidden="true"></i></div>
+                </div>
+                <div class="col-md-6">
+                  <label class="validate-new-fields">Valider champs</label>
+                  <div class="button disabled" id="validate-new-fields" title="Valider les champs supplémentaires"><i class="fa fa-check" aria-hidden="true"></i></div>
+                </div>
+              </div>
+              <hr>
             </div>
           </div><!-- end .widget-blocks = tout le bloc de gauche-->
 ,6 → 383,5
       </div>
     </div>
     <script type="text/javascript" src="<?php echo $url_base; ?>modules/manager/squelettes/js/manager.js"></script>
-    <script type="text/javascript" src="<?php echo $url_base; ?>modules/manager/squelettes/js/manger-submit-values.js"></script>
   </body>
 </html>

 /trunk/widget/modules/manager/squelettes/css/manager.css
 ,6 → 107,17
   background-color: #009fb8;
 }
+#group-settings-form .disabled,
+#group-settings-form .validated {
+  background-color: #eeeeee !important;
+  cursor: default;
+}
+#group-settings-form .validated i {
+  color: #c3d45d;
+  cursor: default;
+}
 #group-settings-form #add-fields.button:hover,
 #group-settings-form #add-fields.button:focus,
 #group-settings-form .add-value-button.button:hover,

 /trunk/widget/modules/manager/squelettes/js/manager.js
 ,7 → 1,8
 "use strict";
 // déclaration du tableau d'envoi des données?
-// var datasToSubmit = new Array();
+var datasToSubmit = new Array();
+var listvalue = new Array();
 /***************************
  *  Lancement des scripts  *
 ,11 → 10,12
 jQuery( document ).ready( function() {
+  // Identifiant de champ
+  var fieldIndex = 0;
-  // Initialisation d'un identifiant de champ
-  var fieldId = 0;
   // Ajout de nouveaux champs
-  onClickAddNewFields( fieldId );
+  onClickAddNewFields( fieldIndex );
   // Affichage des images ou nom des documents importés
   inputFile();
 ,52 → 27,74
  ***********************************************************/
 // Logique globale pour l'ajout de nouveaux champs
-function onClickAddNewFields( fieldId ) {
+function onClickAddNewFields( fieldIndex ) {
+  // Drapeaux d'activation du bouton valider
+  var nameFlag = false,
+      keyFlag = false;
   $( '#add-fields' ).click( function() {
-    // TODO : La création du tableau ci-dessous est à revoir mais les données sont les bonnes
-    // datasToSubmit[fieldId] = {
-    //   key:'',
-    //   name:'',
-    //   element:'',
-    //   // un objet contenant les renseignements en fonction de l'élément
-    //   // + contiendrait aussi un tableau des différentes valeus dans le cas où l'élément est une liste :
-    //   value:'',
-    //   description:'',
-    //   unit:'',
-    //   help:''
-    // };
+    // Réactiver le bouton valider les champs supplémentaires :
+    nameFlag = false;
+    keyFlag = false;
     // Ajout d'un nouveau champ
-    displayNewField( fieldId );
+    displayNewField( fieldIndex );
+    // Désactivation du bouton valider
+    onflagEnableValidateNewFieldsButton( keyFlag , nameFlag );
+    // Test lorsque le nom du nouveau champ est renseigné
+    $('.new-field .field-name').change( function() {
+      nameFlag = true;
+      // Vérification de name pour tous les nouveaux champs
+      nameFlag = filledFieldFlag( $('.new-field .field-name') , nameFlag );
+      // Activation du bouton valider
+      onflagEnableValidateNewFieldsButton( keyFlag , nameFlag );
+    });
+    // Test lorsque la clé du nouveau champ est renseignée
+    $('.new-field .field-key').change( function() {
+      keyFlag = true;
+      // Vérification de key pour tous les nouveaux champs
+      keyFlag = filledFieldFlag( $('.new-field .field-key') , keyFlag );
+      // Activation du bouton valider
+      onflagEnableValidateNewFieldsButton( keyFlag , nameFlag );
+    });
     // Nom du champ affichage titre du champ
-    onChangeDisplayFieldLabel( fieldId );
+    onChangeDisplayFieldLabel( fieldIndex );
+    // Les images ou les nom des documents importés doivent aussi
+    // s'afficher dans les champs ajoutés
+    inputFile( fieldIndex );
     // En fonction du type de champ choisi on demande les informations correspondantes
-    onChangeFieldTypeCollectDetails( fieldId );
+    onChangeFieldTypeCollectDetails( fieldIndex );
-    // TODO : recueillir les données et renseigner le tableau de'envoi
     // Suppression d'un champ
     onClickRemoveField();
-    // Les images ou les nom des documents importés doivent aussi
-    // s'afficher dans les champs ajoutés
-    inputFile();
-    fieldId++;
+    fieldIndex++;
   });
 }
 // Création et logique pour un nouveau champ
 // Un peu d'animation de l'affichage d'un nouveau champ
-function displayNewField( fieldId ) {
+function displayNewField( fieldIndex ) {
   // Le html des nouveaux champs inséré dans le dom
   $( '#new-fields' ).append(
-    '<div data-id="' + fieldId + '" class="new-field">'+
+    '<div data-id="' + fieldIndex + '" class="new-field">'+
       '<h3>Nouveau champ :<br><strong class="field-title"></strong></h3>'+
       // Nom du champ
 ,7 → 112,7
       // Type de champ
       '<label for="field-element" title="Quel type de champ">Type de champ</label>'+
       '<div class="select-wrapper add-field-select">'+
-        '<select name="field-element" class="field-element" required>'+
+        '<select name="field-element" class="field-element">'+
           '<option value="text" selected="selected">Champ texte</option>'+
           '<option value="email">Champ email</option>'+
           '<option value="textarea">Champ rédaction</option>'+
 ,13 → 141,13
       // Import d'une image ou d'un pdf d'aide à afficher en popup
       '<div class="input-file-container">'+
-        '<input type="file" class="input-file field-help" name="field-help" accept="application/pdf, image/*, video/*">'+
+        '<input type="file" class="input-file field-help" name="field-help" id="help-doc-' + fieldIndex + '" accept="application/pdf, image/*, video/*">'+
         '<label for="field-help" class="label-file"><i class="fas fa-download"></i>Image ou pdf d\'aide (popup)</label>'+
       '</div>'+
-      '<div class="file-return help"></div>'+
+      '<div class="file-return help-doc-' + fieldIndex + '"></div>'+
       '<label for="remove-field">Supprimer ce champ</label>'+
-      '<div class="remove-field button" name="remove-field" data-id="' + fieldId + '" title="Supprimer un champ"><i class="fa fa-times" aria-hidden="true"></i></div>'+
+      '<div class="remove-field button" name="remove-field" data-id="' + fieldIndex + '" title="Supprimer un champ"><i class="fa fa-times" aria-hidden="true"></i></div>'+
       '</div>'+
 ,63 → 155,97
   );
   // Animation de l'affichage
-  $( '.new-field[data-id="' + fieldId + '"]').hide().removeClass( 'hidden' ).show( 200 );
+  $( '.new-field[data-id="' + fieldIndex + '"]').hide().removeClass( 'hidden' ).show( 200 );
 }
 // Affichage du nom du champ dès qu'il est renseigné
-function onChangeDisplayFieldLabel( fieldId ) {
+function onChangeDisplayFieldLabel( fieldIndex ) {
-  $('.new-field[data-id="' + fieldId + '"] .field-name').change( function() {
-    $( '.new-field[data-id="' + fieldId + '"] .field-title' ).text( $( this ).val() );
-    // TODO : Renseigner le nom du champs dans le tableau à envoyer
+  $('.new-field[data-id="' + fieldIndex + '"] .field-name').change( function() {
+    $( '.new-field[data-id="' + fieldIndex + '"] .field-title' ).text( $( this ).val() );
   });
 }
 // Supprimer tout un champ
-function onClickRemoveField() {
+function onClickRemoveField (keyFlag , nameFlag) {
   $( '.remove-field.button' ).click( function() {
-    $( '.new-field[data-id="' + $( this ).attr( 'data-id' ) + '"]').fadeOut( 200 , this.remove() );
+    keyFlag = true ,
+    nameFlag = true ;
-    // TODO : supprimer un champ du tableau à envoyer
+    $( '.new-field[data-id="' + $( this ).attr( 'data-id' ) + '"]' ).remove();
+    // Vérification de name pour tous les nouveaux champs
+    nameFlag = filledFieldFlag( $('.new-field .field-name') , nameFlag );
+    // Vérification de name pour tous les nouveaux champs
+    keyFlag = filledFieldFlag( $('.new-field .field-key') , keyFlag );
+    // Activation du bouton valider
+    onflagEnableValidateNewFieldsButton( keyFlag , nameFlag );
   });
 }
+// Vérification de key ou name pour tous les nouveaux champs
+function filledFieldFlag( $field , flag) {
+  if( $field.length === 0 ) {
+    return flag = false;
+  }
+  // Vérification de name pour tous les nouveaux champs
+  $field.each( function() {
+    if( $( this ).val() === ''  ) {
+      flag = false;
+    }
+  });
+  return flag;
+}
+// Activation du bouton valider les champs supplémentaires
+function onflagEnableValidateNewFieldsButton( keyFlag , nameFlag ) {
+    // Activation du bouton valider
+    if( keyFlag && keyFlag ) {
+      onClickStoreNewFields();
+      $( '#validate-new-fields' ).removeClass('disabled');
+    } else {
+      $( '#validate-new-fields' ).off( 'click' ).addClass('disabled');
+    }
+}
 /**** Recueil des informations et détails qui dépendent du type de champ choisi ****/
 // Logique de recueil d'informations en fonction du type de champ choisi
-function onChangeFieldTypeCollectDetails( fieldId ) {
+function onChangeFieldTypeCollectDetails( fieldIndex ) {
-  // var validateRegexp = '';
   var fieldDetails =
     // Placeholder (champ type text par défaut)
     '<label for="aide-saisie" title="Aidez les utilisateurs en deux ou 3 mots ou chiffres à comprendre ce que doit contenir le champ">Texte d\'aide à la saisie</label>'+
     '<input type="text" name="aide-saisie" class="aide-saisie" placeholder="Ce que doit contenir le champ">';
   // On insère les champs par défaut de recueil d'informations
-  displayFieldDetailsCollect( fieldId , fieldDetails );
+  displayFieldDetailsCollect( fieldIndex , fieldDetails );
-  $( '.new-field[data-id="' + fieldId + '"] .field-element' ).change( function() {
+  // Sinon :
+  $( '.new-field[data-id="' + fieldIndex + '"] .field-element' ).change( function() {
-    // on intialise L'id pour les listes la variable qui contiendra un id pour chaque option
-    var valueId = 1;
+    // On intialise l'index pour les listes la variable qui contiendra un id pour chaque option
+    var valueIndex = 0;
     // Si on hésite on qu'on se trompe dans la liste :
     // les champs de détails de l'option précédente doivent être supprimés
-    $( '.new-field[data-id="' + fieldId + '"] .field-details' ).remove();
+    $( '.new-field[data-id="' + fieldIndex + '"] .field-details' ).remove();
-    // Remise à 0 des infos à soumettre dans l'input type hiddes .field-value-submit
-    $( '.field-value-submit[data-id="' + fieldId + '"]' ).val('');
     // $( this ).val() = le type de champ choisi dans select ".field-element"
     switch( $( this ).val() ) {
+      case 'file':
+        fieldDetails = '';
+        break;
       case 'number':
       case 'range':
-        // validateRegexp = '^\d+([\.|,]\d+)?$';
         fieldDetails =
           // Placeholder
           '<label for="aide-saisie" title="Deux ou 3 mots ou chiffres pour comprendre ce que doit contenir le champ (ex: min 20, 10 par 10, etc.)">Texte d\'aide à la saisie</label>'+
 ,35 → 253,34
           // Valeur par défaut
           '<label for="default" title="Valeur par défaut">Valeur par défaut</label>'+
-          '<input type="number" name="default" class="default" step="0.01" value="0">'+
+          '<input type="number" name="default" class="default" step="0.01">'+
           // Incrémentation ( attribut step="" )
           '<label for="step" title="De 10 en 10, de 0.5 en 0.5, etc.">Le "pas" d\'incrémentation (step).<br>Pour l\'utilisateur, par defaut step = 1</label>'+
-          '<input type="number" name="step" class="step" step="0.01" value="1">'+
+          '<input type="number" name="step" class="step" step="0.01">'+
           // Min
           '<label for="min" title="valeur min">Valeur minimale</label>'+
-          '<input type="number" name="min" class="min" step="0.01" value="0">'+
+          '<input type="number" name="min" class="min" step="0.01">'+
           // Max
           '<label for="max" title="valeur max">Valeur maximale</label>'+
-          '<input type="number" name="max" class="max" step="0.01" value="1">'+
+          '<input type="number" name="max" class="max" step="0.01">'+
           '<p class="message"><i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i> Ne pas oublier de changer la valeur max, fixée à 1 par defaut</p>';
         break;
       case 'date':
-        // regex : fevrier à terminer (années non bisextiles inachevé)
-        // validateRegexp = '^(?:(?:(?:(?:[0-2][1-9]|[1-3]0|31)\/(?:0[13578]|10|12))|(?:(?:[0-2][1-9]|[1-3]0)\/(?:0[469]|11)))\/(?:[12][0-9]{3}))|(?:(?:[0-2][1-9]|[12]0)\/02\/(?:(?:[12][26]00)|(?:2000)|(?:[12][0-9]0[48])|(?:[12][0-9][2468][048])|(?:[12][0-9][13579][26]))|(?:(?:[0-2][1-8]|[12]0)\/02\/(?:1000|[12][1345789]00|[12][1-9]0[1235679]|)))$'
-        var today = new Date();
-        today = today.getDate() + '/' + ( today.getMonth() + 1 ) + '/' + today.getFullYear();
         fieldDetails =
           // Date min
           '<label for="min" title="valeur min">Valeur minimale</label>'+
-          '<input type="date" name="min" class="min" value="' + today +'">'+
+          '<input type="date" name="min" class="min">'+
           // Date max
           '<label for="max" title="valeur max">Valeur maximale</label>'+
-          '<input type="date" name="max" class="max" value="31/12/2999">';
+          '<input type="date" name="max" class="max">';
         break;
       case 'select':
 ,7 → 287,7
       case 'checkbox':
       case 'list-checkbox':
       case 'radio':
-        // validateRegexp = '';
         fieldDetails =
           '<p class="message">Ajoutez les valeurs de \"' + $( this ).children( 'option:selected' ).text() + '\"</p>'+
 ,62 → 298,53
           // checkbox ajouter une valeur "Autre:"
           '<label for="option-other-value" title="Ajouter une option \'Autre:\' à la fin">Valeur "Autre"</label>'+
           '<input type="checkbox" class="option-other-value" name="option-other-value" title="Ajouter une option \'Autre\' à la fin">';
-        break;
-      case 'file':
-        fieldDetails = '';
         break;
       case 'email':
       case 'text':
       case 'textarea':
       default:
         fieldDetails =
         // Placeholder
         '<label for="aide-saisie" title="Aidez les utilisateurs en deux ou 3 mots ou chiffres à comprendre ce que doit contenir le champ">Texte d\'aide à la saisie</label>'+
         '<input type="text" name="aide-saisie" class="aide-saisie" placeholder="Ce que doit contenir le champ">';
         break;
     }
-    // Changement du type d'élément à envoyer
-    $( '.field-element-submit[data-id="' + fieldId + '"]' ).val( $( this ).val() );
     if( fieldDetails.length > 0 ) {
       //ne pas ajouer une div vide s'il n'y pas d'informations à demander
-      displayFieldDetailsCollect( fieldId , fieldDetails );
+      displayFieldDetailsCollect( fieldIndex , fieldDetails );
     }
     // Ajout des valeurs possibles
     // lorsque le champ est une liste ou case à cocher
-    onClickAddNewValueToList( fieldId , valueId );
+    onClickAddNewValueToList( fieldIndex , valueIndex );
-    // TODO : fonction ci-dessous est déclarée plus bas
-    // et servait à envoyer les données collectées
-    // mais pas faite pour un tableau
-    // onCollectDataValuesToSubmit( fieldId , $( this ).val() );
   });
 }
 // Insertion dans le dom des champs de recueil d'informations
-function displayFieldDetailsCollect( fieldId , fieldDetails ) {
-  $( '.new-field[data-id="' + fieldId + '"] .add-field-select' ).after( '<div class="field-details">' + fieldDetails + '</div>' );
+function displayFieldDetailsCollect( fieldIndex , fieldDetails ) {
+  $( '.new-field[data-id="' + fieldIndex + '"] .add-field-select' ).after( '<div class="field-details">' + fieldDetails + '</div>' );
 }
 /**** Ajout des valeurs (options) des "champs de listes" (select, checkbox, radio, etc.) ****/
 // Logique d'ajout des options des listes (deroulantes, cases à cocher etc.)
-function onClickAddNewValueToList( fieldId , valueId ) {
+function onClickAddNewValueToList( fieldIndex , valueIndex ) {
-  $( '.new-field[data-id="' + fieldId + '"] .add-value-button' ).click( function() {
+  $( '.new-field[data-id="' + fieldIndex + '"] .add-value-button' ).click( function() {
-    $( '.new-field[data-id="' + fieldId + '"] .add-value' ).before(
-      '<div class="new-value" data-list-value-id="' + valueId +'">'+
+    $( '.new-field[data-id="' + fieldIndex + '"] .add-value' ).before(
+      '<div class="new-value" data-list-value-id="' + valueIndex +'">'+
         // Recueil d'une valeur de la liste
         '<label for="list-value">Valeur:</label>'+
-        '<input type="text" name="list-value" class="list-value" placeholder="Une des valeurs de la liste">'+
+        '<input type="text" name="list-value" class="list-value"  data-list-value-id="' + valueIndex +'" placeholder="Une des valeurs de la liste">'+
         '<div class="row">'+
 ,8 → 352,7
             // Checkbox "valeur par défaut" de la liste
             '<label for="is-defaut-value" title="Ceci est la valeur par défaut">Valeur par défaut</label>'+
-            '<input type="checkbox" name="is-defaut-value" class="is-defaut-value">'+
+            '<input type="checkbox" name="is-defaut-value" class="is-defaut-value" title="entrez une valeur pour activer cette case" data-list-value-id="' + valueIndex +'" disabled >'+
           '</div>'+
           '<div class="col-md-5">'+
 ,7 → 359,7
             // Bouton "supprimer la valeur" de la liste
             '<label for="remove-value">Supprimer valeur</label>'+
-            '<div class="remove-value button" name="remove-value" data-list-value-id="' + valueId + '" title="Supprimer une valeur"><i class="fa fa-times" aria-hidden="true"></i></div>'+
+            '<div class="remove-value button" name="remove-value" data-list-value-id="' + valueIndex + '" title="Supprimer une valeur"><i class="fa fa-times" aria-hidden="true"></i></div>'+
           '</div>'+
 ,145 → 366,242
         '</div>'+
       '</div>'
     );
-    // TODO : collecter les nouvelles valeurs
-    // et les ajouter sous forme d'un tableau de données
-    // sans oublier d'indiquer la valeur par defaut
+    // Activer la checkbox de valeur par default uniquement si une valeur est entrée
+    onInputListValueLabelEnableDefaultCheckbox( fieldIndex , valueIndex );
+    // attribuer la valeur par défaut d'un liste
+    // et retirer l'ancienne s'il y en avait une
+    onClickDefaultValueRemoveOthers( fieldIndex );
     // Pouvoir supprimer une valeur
-    onClickRemoveListValue( fieldId );
+    onClickRemoveListValue( fieldIndex );
-    // s'assurer qu'il n'y a qu'une valeur par défaut cochée dans les listes
-    onClickDefaultValueRemoveOthers( fieldId );
+    valueIndex++;
+  });
+}
-    valueId++;
+// Activer la checkbox de valeur par default uniquement si une valeur est entrée
+function onInputListValueLabelEnableDefaultCheckbox( fieldIndex , valueIndex ) {
+  $( '.new-field[data-id="' + fieldIndex + '"] .new-value[data-list-value-id="' + valueIndex + '"] .list-value' ).on( 'input' , function() {
+    $( '.new-field[data-id="' + fieldIndex + '"] .is-defaut-value[data-list-value-id="' + valueIndex + '"]' ).removeAttr( 'disabled');
   });
 }
-// Logique pour le bouton supprimer une valeur
-function onClickRemoveListValue( fieldId ) {
+// Dans une liste il ne peut y avoir qu'une valeur par défaut cochée
+function onClickDefaultValueRemoveOthers( fieldIndex ) {
-  $('.new-field[data-id="' + fieldId + '"] .remove-value.button').click( function() {
-    $( '.new-field[data-id="' + fieldId + '"] .new-value[data-list-value-id="' + $( this ).attr( 'data-list-value-id' ) + '"]' ).fadeOut( 200 , this.remove() );
+  $( '.new-field[data-id="' + fieldIndex + '"] .is-defaut-value' ).click( function() {
-    // TODO : logique pour retirer une valeur du tableau d'envoi
+   if( $( this ).attr( 'checked' ) ) {
+      $( '.new-field[data-id="' + fieldIndex + '"] .is-defaut-value:checked' ).not( $( this) ).removeAttr( 'checked' );
+    }
   });
 }
-// Dans une liste il ne peut y avoir qu'une valeur par défaut cochée
-function onClickDefaultValueRemoveOthers( fieldId ) {
+// Logique pour le bouton supprimer une valeur
+function onClickRemoveListValue( fieldIndex ) {
-  $( '.new-field[data-id="' + fieldId + '"] .is-defaut-value' ).click( function() {
-    $( '.new-field[data-id="' + fieldId + '"] .is-defaut-value' ).not( $( this ) ).removeAttr('checked');
+  $('.new-field[data-id="' + fieldIndex + '"] .remove-value.button').click( function() {
+    $( '.new-field[data-id="' + fieldIndex + '"] .new-value[data-list-value-id="' + $( this ).attr( 'data-list-value-id' ) + '"]' ).remove();
   });
 }
-// TODO : ci-dessous l'envoi des données
-// quand je pensais le faire à travers des input hidden au dessus du submit
-// la logique pourrait encore servir?
-// il manquait juste les valeurs pour les listes (select,checkbox, etc.)
-// et l'ajout d'une valeur 'autre' si la checkbox était checkée
-//
-// // Remplissage de l'attribut valut de l'input hidden .field-value-submit
-// // pour l'envoi des informations qui dépendent de l'élément choisi
-// function onCollectDataValuesToSubmit( fieldId , selectedList ) {
-//     switch( selectedList ) {
+/*********************************************
+ *  Validation et envoi des nouveaux champs  *
+ *********************************************/
-//       case 'number':
-//       case 'range':
-//         //default
-//         var ph = 'ph:' + $( '.new-field[data-id="' + fieldId + '"] .aide-saisie' ).val() + ';';
-//         var def = 'def:' + $( '.new-field[data-id="' + fieldId + '"] .default' ).val() + ';';
-//         var step = 'step:' + $( '.new-field[data-id="' + fieldId + '"] .default' ).val() + ';';
-//         var min = 'min:' + $( '.new-field[data-id="' + fieldId + '"] .min' ).val() + ';';
-//         var max = 'max:' + $( '.new-field[data-id="' + fieldId + '"] .max' ).val() + ';';
+function onClickStoreNewFields() {
-//         $( '.field-value-submit[data-id="' + fieldId + '"]' ).val( '{' + ph + def + step + min + max + '}');
+  $( '#validate-new-fields' ).click( function() {
-//         // Placeholder
-//         $( '.new-field[data-id="' + fieldId + '"] .aide-saisie' ).change( function() {
-//           ph = 'ph:"' + $( this ).val() + '";';
-//           $( '.field-value-submit[data-id="' + fieldId + '"]' ).val( '{' + ph + def + step + min + max + '}');
-//         });
+    var resultArrayIndex = 0;
+    var count = 0;
-//         // Valeur par défaut
-//         $( '.new-field[data-id="' + fieldId + '"] .default' ).change( function() {
-//           def = 'def:' + $( this ).val() + ';';
-//           $( '.field-value-submit[data-id="' + fieldId + '"]' ).val( '{' + ph + def + step + min + max + '}');
-//         });
+    $( '.new-field' ).each( function () {
+      if( $(this).attr('data-id') > count) {
+        count = $(this).attr('data-id');
+      }
+    });
-//         // Incrémentation ( attribut step="" )
-//         $( '.new-field[data-id="' + fieldId + '"] .step' ).change( function() {
-//           step = 'step:' + $( this ).val() + ';';
-//           $( '.field-value-submit[data-id="' + fieldId + '"]' ).val( '{' + ph + def + step + min + max + '}');
-//         });
+    for( var index = 0 ; index <= count ; index++ ) {
-//         // Min
-//         $( '.new-field[data-id="' + fieldId + '"] .min' ).change( function() {
-//           min = 'min:' + $( this ).val() + ';';
-//           $( '.field-value-submit[data-id="' + fieldId + '"]' ).val( '{' + ph + def + step + min + max + '}');
-//         });
+      if( $( '.new-field[data-id="' + index + '"]').length > 0 ) {
-//         // Max
-//         $( '.new-field[data-id="' + fieldId + '"] .max' ).change( function() {
-//           max = 'max:' + $( this ).val() + ';';
-//           $( '.field-value-submit[data-id="' + fieldId + '"]' ).val( '{' + ph + def + step + min + max + '}');
-//         });
+        // initialisation du tableau de résultats
+        datasToSubmit[ resultArrayIndex ] = { fieldValues:{} };
-//         break;
+        // Ajout de la clé au tableau de resultats
+        datasToSubmit[ resultArrayIndex ].key = $( '.new-field[data-id="' + index + '"] .field-key' ).val();
-//       case 'date':
-//         // default
-//         var min = 'min:' + $( '.new-field[data-id="' + fieldId + '"] .min' ).val() + ';';
-//         var max = 'max:' + $( '.new-field[data-id="' + fieldId + '"] .max' ).val() + ';';
+        // Ajout de le nom au tableau de resultats
+        datasToSubmit[ resultArrayIndex ].name = $( '.new-field[data-id="' + index + '"] .field-name' ).val();
-//         $( '.field-value-submit[data-id="' + fieldId + '"]' ).val( '{' + min +  max + '}' );
+        // Recueil de l'élément choisi pour le tableau de resultats
+        datasToSubmit[ resultArrayIndex ].element = $( '.new-field[data-id="' + index + '"] .field-element' ).val();
-//         // Min
-//         $( '.new-field[data-id="' + fieldId + '"] .min' ).change( function() {
-//           min = 'min:' + $( this ).val() + ';';
-//           $( '.field-value-submit[data-id="' + fieldId + '"]' ).val( '{' + min + max + '}' );
-//         });
+        // Ajout de la valeur 'requis' ou non au tableau de resultats
+        if( $( '.new-field[data-id="' + index + '"] .field-is_mandatory' ).attr( 'checked' ) ) {
+          datasToSubmit[ resultArrayIndex ].mandatory = true;
+        } else {
+          datasToSubmit[ resultArrayIndex ].mandatory = false;
+        }
-//         // Max
-//         $( '.new-field[data-id="' + fieldId + '"] .max' ).change( function() {
-//           var max = 'max:' + $( this ).val() + ';';
-//           $( '.field-value-submit[data-id="' + fieldId + '"]' ).val( '{' + min + max + '}' );
-//         });
-//         break;
+        // Ajout de l'unité au tableau de resultats
+        if ( $('.new-field[data-id="' + index + '"] .field-unit').val() ) {
+          datasToSubmit[ resultArrayIndex ].unit = $('.new-field[data-id="' + index + '"] .field-unit').val();
+        };
-//       case 'select':
-//       case 'checkbox':
-//       case 'list-checkbox':
-//       case 'radio':
-//         // // Bouton ajout d'une valeur à la liste
-//         // '<label for="add-value" class="add-value" title="Ajouter une valeur à la liste">Ajouter une valeur</label>'+
-//         // '<div class="button add-value-button" name="add-value" title="Ajouter une valeur à la liste"><i class="fa fa-plus" aria-hidden="true"></i></div>'+
+        // Ajout du tooltip au tableau de resultats
+        if ( $('.new-field[data-id="' + index + '"] .field-description').val() ) {
+          datasToSubmit[ resultArrayIndex ].description = $('.new-field[data-id="' + index + '"] .field-description').val();
+        }
-//         // // checkbox ajouter une valeur "Autre:"
-//         // '<label for="option-other-value" title="Ajouter une option \'Autre:\' à la fin">Valeur "Autre"</label>'+
-//         // '<input type="checkbox" class="option-other-value" name="option-other-value" title="Ajouter une option \'Autre\' à la fin">';
-//         value = 'lists';
-//         break;
+        // Ajout du nom du document d'aide au tableau de resultats
+        if ( $('.file-return.help-doc-' + index ).text() ) {
+          datasToSubmit[ resultArrayIndex ].help = $('.file-return.help-doc-' + index ).text();
+        }
-//       case 'file':
-//         $( '.new-field[data-id="' + fieldId + '"] .input-file' ).change( function() {
-//           $( '.field-value-submit[data-id="' + fieldId + '"]' ).val( '{fileName:' + $( this ).text() + '}');
-//         });
-//         break;
+        // Collecte les des données dépendantes de l'élément choisi
+        // sous forme d'un tableau de resultats
+        onSelectCollectDataValuesToSubmit( datasToSubmit[ resultArrayIndex ] , index );
+        if( ! datasToSubmit[ resultArrayIndex ].fieldValues.length ){
+          delete datasToSubmit[ resultArrayIndex ].fieldValues;
+        }
-//       case 'email':
-//       case 'text':
-//       case 'textarea':
-//       default:
-//         // Placeholder
-//         $( '.new-field[data-id="' + fieldId + '"] .aide-saisie'  ).change( function() {
-//           $( '.field-value-submit[data-id="' + fieldId + '"]' ).val('{ph:"' + $( this ).val() + '"}');
-//         });
-//         break;
-//     }
-// }
+        resultArrayIndex++;
+      }
+    }
+    var resultsArrayJson = JSON.stringify( datasToSubmit );
+    // Plus de nouvelle validation possible
+    $( '#validate-new-fields' ).off( 'click' ).addClass('validated');
+    $( '#add-fields' ).off( 'click' ).addClass('disabled');
+    $('.validate-new-fields').text('Champs validés');
+    $('#submit-button').before(
+      '<input type="hidden" name="champs-supp" id="champs-supp" value=\'' + resultsArrayJson + '\'>'
+    );
+    console.log( $('#champs-supp').val() );
+  });
+}
+// Renseigne le tableau de resultat
+// pour les données dépendant de l'élément choisi
+function onSelectCollectDataValuesToSubmit( datasToSubmitObject , index ) {
+    var today = new Date();
+    var tomorrow = new Date();
+    today = today.getDate() + 1 + '/' + ( today.getMonth() + 1 ) + '/' + today.getFullYear();
+    tomorrow = ( tomorrow.getDate() + 1 ) + '/' + ( tomorrow.getMonth() + 1 ) + '/' + tomorrow.getFullYear();
+    switch( datasToSubmitObject.element ) {
+      // case 'file' :
+      // Rien à faire, pas de détails à transmettre
+      case 'select':
+      case 'checkbox':
+      case 'list-checkbox':
+      case 'radio':
+      datasToSubmitObject.fieldValues.listValue = [];
+        // Ajout des valeurs de liste
+        onChangeStoreListValueLabel( datasToSubmitObject , index );
+        // S'il y a une valeur 'autre' on l'indique à la fin de la liste
+        if( $('.new-field[data-id="' + index + '"] .option-other-value').attr( 'checked' ) && datasToSubmitObject.fieldValues.listValue.indexOf( 'other' ) === -1 ) {
+          datasToSubmitObject.fieldValues.listValue.push( 'other' );
+        }
+        break;
+      case 'number':
+      case 'range':
+        // Placeholder
+        if( $( '.new-field[data-id="' + index + '"] .aide-saisie' ).val() ) {
+         datasToSubmitObject.fieldValues.placeholder = $( '.new-field[data-id="' + index + '"] .aide-saisie' ).val();
+        }
+        // Valeur par défaut
+        if( $( '.new-field[data-id="' + index + '"] .default' ).val() ) {
+          datasToSubmitObject.fieldValues.default = $( '.new-field[data-id="' + index + '"] .default' ).val();
+        }
+        // Incrémentation ( attribut step="" )
+        if( $( '.new-field[data-id="' + index + '"] .step' ).val() ) {
+          datasToSubmitObject.fieldValues.step = $( '.new-field[data-id="' + index + '"] .step' ).val();
+        }
+        // Min
+        if( $( '.new-field[data-id="' + index + '"] .min' ).val() ) {
+          datasToSubmitObject.fieldValues.min = $( '.new-field[data-id="' + index + '"] .min' ).val();
+        }
+        // Max
+        if( $( '.new-field[data-id="' + index + '"] .max' ).val() ) {
+          datasToSubmitObject.fieldValues.max = $( '.new-field[data-id="' + index + '"] .max' ).val();
+        }
+        break;
+      case 'date':
+        // Min
+        if( $( '.new-field[data-id="' + index + '"] .min' ).val() ) {
+          datasToSubmitObject.fieldValues.min = $( '.new-field[data-id="' + index + '"] .min' ).val();
+        } else {
+          datasToSubmitObject.fieldValues.min = today;
+        }
+        // Max
+        if( $( '.new-field[data-id="' + index + '"] .max' ).val() ) {
+          datasToSubmitObject.fieldValues.max = $( '.new-field[data-id="' + index + '"] .max' ).val();
+        } else {
+          datasToSubmitObject.fieldValues.min = tomorrow;
+        }
+        break;
+      case 'email':
+      case 'text':
+      case 'textarea':
+      default:
+        // Placeholder
+        if( $( '.new-field[data-id="' + index + '"] .aide-saisie' ).val() ) {
+          datasToSubmitObject.fieldValues.placeholder = $( '.new-field[data-id="' + index + '"] .aide-saisie' ).val();
+        }
+        break;
+    }
+}
+// Ajout d'une valeur d'un élément liste (select, checkbox etc.)
+// dans le tableau de resultats
+function onChangeStoreListValueLabel( datasToSubmitObject , index ) {
+  $( '.new-field[data-id="' + index + '"] .list-value' ).each( function() {
+     if( $( this ).val() ){
+      if( $( '.new-field[data-id="' + index + '"] .is-defaut-value[data-list-value-id="' + $( this ).attr('data-list-value-id') + '"]' ).attr( 'checked' ) ) {
+        datasToSubmitObject.fieldValues.listValue.unshift( $( this ).val() );
+      } else {
+        datasToSubmitObject.fieldValues.listValue.push( $( this ).val() );
+      }
+    }
+  });
+}
 /****************************************
  *  Fonctions pour afficher les images  *
  *  ou les nom de fichers importés      *
 ,7 → 622,7
   });
   // action lorsque le label est cliqué
-  $button.click(function() {
+  $button.click( function() {
     $fileInput.focus();
     return false;
   });
 ,4 → 644,3
     }
   });
 }

Subversion Repositories eFlore/Applications.cel

Compare Revisions

Ignore whitespace Rev 3170 → Rev 3171