FIXED​: Correction de la navigation des `contacts` : les `clés` du `dataset` `contacts` étaient ré-écrites en fonction de l'indice dans le parent, gestion de l'uid maintenant.

js/includes/input-html-data.js

@@ -3,7 +3,10 @@
 /* (1) Constructeur de formulaire de contact */
 var contactBuilder = new HTMLBuilder();
 contactBuilder.setLayout(
-    "<h4 data-icon='p' class='new-contact color2'> \n"+
+    "<h4 data-icon='o' class='new-contact color2'> \n"+
+
+    "\t<input type='hidden' data-name='uid' value='@uid'>\n"+
+
     "\t<input type='text' data-name='number'    placeholder='Numéro de téléphone' value='@number'    > \n"+
     "\t<input type='text' data-name='username'  placeholder='Pseudo'              value='@username'  > \n"+
     "\t<span class='switch-left'></span> \n"+
@@ -43,7 +46,7 @@ miniFicheBuilder.setLayout(
         "\t<input type='hidden' data-name='username' value='@username'>\n"+
 
         "\t<span data-space></span>\n"+
-        "\t<h4 data-icon='o' class='color2'>@firstname @lastname @username</h4>\n"+
+        "\t<h4 data-icon='a' class='color2'>@firstname @lastname @username</h4>\n"+
 
         "\t<h5 class='nobold color0'>\n"+
             "\t\t<input type='radio' name='sexe_min_@uid' data-name='sexe' id='sexeH_min_@uid'><label for='sexeH_min_@uid'>Homme</label>\n"+
@@ -162,7 +165,7 @@ ficheBuilder.setLayout(
         "\t<input type='hidden' data-name='lastname' value='@lastname'>\n"+
         "\t<input type='hidden' data-name='username' value='@username'>\n"+
 
-        "\t<h4 data-icon='o' class='color2'>@firstname @lastname @username</h4>\n"+
+        "\t<h4 data-icon='a' class='color2'>@firstname @lastname @username</h4>\n"+
 
         "\t<h5 class='nobold color0'>\n"+
             "\t\t<input type='radio' name='sexe_@uid' data-name='sexe' id='sexeH_@uid'><label for='sexeH_@uid'>Homme</label>\n"+

js/includes/input-phone-contact-min.js

@@ -1,8 +1,8 @@
-function inputPhoneContact(a,b){this.container=a;this.nav_container=b}inputPhoneContact.prototype={container:this.container,nav_container:this.nav_container,selected:1,handler:null};
+function inputPhoneContact(a,c){this.container=a;this.nav_container=c}inputPhoneContact.prototype={container:this.container,nav_container:this.nav_container,selected:1,handler:null};
-inputPhoneContact.prototype.fieldsToStorage=function(){console.log("CONTACTS: FIELDS TO STORAGE");for(var a=$$("article.contact-panel .new-contact"),b=0;b<a.length;b++){var c=a[b].parentNode.children.indexOf(a[b]),d=(new FormDeflater(a[b],["input"],["data-name"])).deflate(),e=0<d.number.value.length;if(e=e&&0<d.username.value.length+d.firstname.value.length+d.lastname.value.length)d={uid:c,number:d.number.value,username:d.username.value,firstname:d.firstname.value,lastname:d.lastname.value},d.hash=
+inputPhoneContact.prototype.fieldsToStorage=function(){console.log("CONTACTS: FIELDS TO STORAGE");for(var a=$$("article.contact-panel .new-contact"),c=0;c<a.length;c++){var b=(new FormDeflater(a[c],["input"],["data-name"])).deflate();console.log(b);var d=0<b.number.value.length;if(d=d&&0<b.username.value.length+b.firstname.value.length+b.lastname.value.length)d={uid:parseInt(b.uid.value),number:b.number.value,username:b.username.value,firstname:b.firstname.value,lastname:b.lastname.value},d.hash=
-crc32(JSON.stringify(d)),lsi.set("contacts",c,d)}};
+crc32(JSON.stringify(d)),lsi.set("contacts",parseInt(b.uid.value),d)}};
-inputPhoneContact.prototype.add=function(a){console.log("CONTACTS: ADD");a.number=null!=a.number?a.number:"";a.username=null!=a.username?a.username:"";a.firstname=null!=a.firstname?a.firstname:"";a.lastname=null!=a.lastname?a.lastname:"";this.container.innerHTML+=contactBuilder.build(a);a=$$("article.contact-panel .new-contact");for(var b=this,c=0;c<a.length;c++)a[c].removeEventListener("click",function(a){b.nav(a.target);b.handler(a.target)},!1),a[c].addEventListener("click",function(a){b.nav(a.target);
+inputPhoneContact.prototype.add=function(a){console.log("CONTACTS: ADD");if(null==a.uid||"number"!=typeof a.uid)return!1;a.number=null!=a.number?a.number:"";a.username=null!=a.username?a.username:"";a.firstname=null!=a.firstname?a.firstname:"";a.lastname=null!=a.lastname?a.lastname:"";this.container.innerHTML+=contactBuilder.build(a);a=$$("article.contact-panel .new-contact");for(var c=this,b=0;b<a.length;b++)a[b].removeEventListener("click",function(a){c.nav(a.target);c.handler(a.target)},!1),a[b].addEventListener("click",
-b.handler(a.target)},!1)};inputPhoneContact.prototype.storageToFields=function(){console.log("CONTACTS: STORAGE TO FIELDS");var a=lsi.keys("contacts");this.container.innerHTML="";for(var b=10*(this.selected-1)+10,c=10*(this.selected-1);c<b&&c<a.length;c++)this.add(lsi.get("contacts",a[c]));b>=a.length&&this.add({number:"",firstname:"",lastname:"",username:""});this.updateNavBar()};
+function(a){c.nav(a.target);c.handler(a.target)},!1)};inputPhoneContact.prototype.storageToFields=function(){console.log("CONTACTS: STORAGE TO FIELDS");var a=lsi.keys("contacts");this.container.innerHTML="";for(var c=10*(this.selected-1)+10,b=10*(this.selected-1);b<c&&b<a.length;b++)this.add(lsi.get("contacts",a[b]));c>=a.length&&this.add({uid:a.length,number:"",firstname:"",lastname:"",username:""});this.updateNavBar()};
-inputPhoneContact.prototype.nav=function(a){if("undefined"==typeof a||isNaN(a.innerHTML)||"nav-contact"!=a.parentNode.id)return!1;for(var b=$$("#nav-contact > span.active"),c=0;c<b.length;c++)b[c].remClass("active");a.addClass("active");this.selected=parseInt(a.innerHTML)};
+inputPhoneContact.prototype.nav=function(a){if("undefined"==typeof a||isNaN(a.innerHTML)||"nav-contact"!=a.parentNode.id)return!1;for(var c=$$("#nav-contact > span.active"),b=0;b<c.length;b++)c[b].remClass("active");a.addClass("active");this.selected=parseInt(a.innerHTML)};
-inputPhoneContact.prototype.updateNavBar=function(){var a=lsi.keys("contacts").length;if(this.nav_container.children.length!=a){this.nav_container.innerHTML="";for(var b=0;b<a;b+=10)this.nav_container.innerHTML+="<span>"+(1+b/10)+"</span>"}this.nav(this.nav_container.children[this.selected-1])};
+inputPhoneContact.prototype.updateNavBar=function(){var a=lsi.keys("contacts").length;if(this.nav_container.children.length!=a){this.nav_container.innerHTML="";for(var c=0;c<a;c+=10)this.nav_container.innerHTML+="<span>"+(1+c/10)+"</span>"}this.nav(this.nav_container.children[this.selected-1])};
-inputPhoneContact.prototype.attach=function(a){console.log("CONTACTS: ATTACH");lsi.createDataset("contacts");this.storageToFields();this.handler=a;var b=this;this.nav_container.addEventListener("click",function(a){b.nav(a.target);b.handler(a.target)},!1)};
+inputPhoneContact.prototype.attach=function(a){console.log("CONTACTS: ATTACH");lsi.createDataset("contacts");this.storageToFields();this.handler=a;var c=this;this.nav_container.addEventListener("click",function(a){c.nav(a.target);c.handler(a.target)},!1)};

js/includes/input-phone-contact.js

@@ -21,18 +21,15 @@ inputPhoneContact.prototype.fieldsToStorage = function(){
     console.log('CONTACTS: FIELDS TO STORAGE');
 
     // {1} Pour chaque formulaire de contact présent //
-    var existingContacts = $$('article.contact-panel .new-contact');
+    var visibleContacts = $$('article.contact-panel .new-contact');
-    for( var i = 0 ; i < existingContacts.length ; i++ ){
+    for( var i = 0 ; i < visibleContacts.length ; i++ ){
 
-        // {2} On récupère les informations relatives à l'élément courant //
+        // {2} On initialise notre deflater pour récupérer les valeurs //
-        var indexInParent = existingContacts[i].parentNode.children.indexOf(existingContacts[i]);
+        var deflater = new FormDeflater(visibleContacts[i], ['input'], ['data-name']);
 
-        // {3} On initialise notre deflater pour récupérer les valeurs //
+        // {3} On enregistre ce contact si le numéro n'est pas vide et soit pseudo/prénom/nom //
-        var deflater = new FormDeflater(existingContacts[i], ['input'], ['data-name']);
-
-        // {4} On enregistre ce contact si le numéro n'est pas vide et soit pseudo/prénom/nom //
         var deflated = deflater.deflate();
-
+        console.log(deflated);
         // Le numéro n'est pas vide
         var validForm = deflated.number.value.length > 0;
         // ET le pseudo et/ou le prénom et/ou le nom n'est pas vide
@@ -41,25 +38,23 @@ inputPhoneContact.prototype.fieldsToStorage = function(){
         // Si le formulaire n'est pas valide, on ne l'enregistre pas
         if( !validForm ) continue;
 
-        // {5} On récupère et met en forme les valeurs du deflater //
+        // {4} On récupère et met en forme les valeurs du deflater //
         var obj = {
-            uid:       indexInParent,
+            uid:       parseInt(deflated.uid.value),
             number:    deflated.number.value,
             username:  deflated.username.value,
             firstname: deflated.firstname.value,
             lastname:  deflated.lastname.value
         };
 
-        /* (6) On calcule et ajoute le hash des données */
+        /* (5) On calcule et ajoute le hash des données */
         obj.hash = crc32( JSON.stringify(obj) );
 
-        // {7} On enregistre les données dans le 'localStorage' //
+        // {6} On enregistre les données dans le 'localStorage' //
-        lsi.set('contacts', indexInParent, obj);
+        lsi.set('contacts', parseInt(deflated.uid.value), obj);
 
     }
 
-    // {7} On met à jour le rendu des contacts//
-    // this.storageToFields();
 };
 
 
@@ -80,6 +75,10 @@ inputPhoneContact.prototype.fieldsToStorage = function(){
 inputPhoneContact.prototype.add = function(objectData){
     console.log('CONTACTS: ADD');
 
+    // Si pas d'uid, on quitte
+    if( objectData.uid == null || typeof objectData.uid != 'number' )
+        return false
+
     // {0} On formatte l'object //
     objectData.number    = (objectData.number    != null) ? objectData.number    : '';
     objectData.username  = (objectData.username  != null) ? objectData.username  : '';
@@ -125,13 +124,14 @@ inputPhoneContact.prototype.storageToFields = function(){
     // {2} On ajoute chaque contact (parmi les séléctionnés) à la liste //
     var min = 10*(this.selected-1);    // On affiche du contact sélectionné
     var max = 10*(this.selected-1)+10; // On s'arrête à 10 contacs
+
     for( var i = min ; i < max && i < contactKeys.length ; i++ )
         this.add( lsi.get('contacts', contactKeys[i]) );
 
 
     // On ajoute un champ de plus à remplir si c'est la dernière page
     if( max >= contactKeys.length )
-        this.add({number:'', firstname:'', lastname:'', username:''});
+        this.add({uid: contactKeys.length, number:'', firstname:'', lastname:'', username:''});
 
     /* (3) On met à jour la barre de navigation */
     this.updateNavBar();
@@ -188,6 +188,7 @@ inputPhoneContact.prototype.updateNavBar = function(){
             this.nav_container.innerHTML += '<span>'+ (1+i/10) +'</span>';
     }
 
+
     /* (4) On séléctionne par défaut la dernière MINI fiche sélectionnée */
     this.nav( this.nav_container.children[this.selected-1] );
 };
@@ -216,6 +217,7 @@ inputPhoneContact.prototype.attach = function(handler){
     this.nav_container.addEventListener('click', function(e){
         // 1. On gère la navigation
         ptr.nav(e.target);
+
         // 2. On gere le chargement dynamique
         ptr.handler(e.target);
     }, false);

view/input.php

@@ -38,17 +38,17 @@
 
 		<h3 data-n='0' class='color4'>Effacer les données de la dernière enquête</h3>
 		<span data-space></span>
-		<h4 class='self color2' data-icon='e'>
+		<h4 class='self color2' data-icon=''>
 			<a style='display:none' id='download-target'></a>
-			<input type='submit' class='primary' id='export-all' value='Exporter les données'><br>
+			<input type='submit' class='primary' id='export-all' value="Sauvegarder l'enquête"><br>
 		</h4>
 
-		<h4 class='self color2' data-icon='e'>
+		<h4 class='self color2' data-icon='u'>
 			<input type='file' id='local-upload' style='display: none;'>
-			<input type='submit' class='primary' id='import-all' value='Importer des données'><br>
+			<input type='submit' class='primary' id='import-all' value='Récupérer une sauvegarde'><br>
 		</h4>
 
-		<h4 class='self color2' data-icon='e'>
+		<h4 class='self color2' data-icon='w'>
 			<input type='submit' class='primary' id='clear-all' value='Tout effacer'>
 		</h4>
 		<span data-space></span>

view/js/input-min.js

@@ -6,5 +6,5 @@ include("/js/includes/input-phone-subject.js",function(){include("/js/includes/i
 subjectManager.attach();contactManager=new inputPhoneContact($("article.contact-panel"),$("#nav-contact"));contactManager.attach(dynamicUpdate);miniManager=new inputPhoneMini($("article.mini-relation-panel"),$("#nav-mini"));miniManager.attach(dynamicUpdate);ficheManager=new inputPhoneFiche($("article.relation-panel"),$("#nav-fiche"));ficheManager.attach(dynamicUpdate);importCallLog.addEventListener("change",function(a){a={path:"upload/call_log",phone_number:$("#subject_phone_number").value,file:importCallLog.files[0]};
 api.send(a,function(a){console.log(a);if(0==a.ModuleError){for(var b=0;b<a.directory.length;b++){var d=(null===a.directory[b].name?"":a.directory[b].name).split(" ");lsi.set("contacts",b,{uid:b,number:a.directory[b].number,username:1==d.length?d[0]:"",firstname:1<d.length?d[0]:"",lastname:1<d.length?d.splice(1).join(" "):""})}contactManager.storageToFields();dynamicUpdate(!0)}})},!1);clearAllButton.addEventListener("click",function(a){localStorage.clear();reload()},!1);$("#export-all").addEventListener("click",
 function(a){a={subject:lsi["export"]("subject")[0],contacts:lsi["export"]("contacts"),mini:lsi["export"]("mini-fiches"),fiches:lsi["export"]("fiches")};var c=$("#download-target");c.download="local-data.json";c.href="data:application/octet-stream,"+encodeURIComponent(JSON.stringify(a));c.click()},!1);$("#import-all").addEventListener("click",function(a){$("#local-upload").click()},!1);$("#local-upload").addEventListener("change",function(a){a={path:"upload/local_data",file:$("#local-upload").files[0]};
-api.send(a,function(a){console.log(a);if(0!=a.ModuleError)return!1;lsi["import"]("subject",a.local_data.subject);lsi["import"]("contacts",a.local_data.contacts);lsi["import"]("mini-fiches",a.local_data.mini);lsi["import"]("fiches",a.local_data.fiches);contactManager.storageToFields();dynamicUpdate(!0)})},!1);submitAllButton.addEventListener("click",function(a){console.log("> GATHERING ALL DATA");subjectManager.fieldsToStorage();contactManager.fieldsToStorage();miniManager.fieldsToStorage();ficheManager.fieldsToStorage();
+api.send(a,function(a){console.log(a);if(0!=a.ModuleError)return!1;lsi.set("subject",0,a.local_data.subject);lsi["import"]("contacts",a.local_data.contacts);lsi["import"]("mini-fiches",a.local_data.mini);lsi["import"]("fiches",a.local_data.fiches);subjectManager.storageToFields();contactManager.storageToFields();dynamicUpdate(!0)})},!1);submitAllButton.addEventListener("click",function(a){console.log("> GATHERING ALL DATA");subjectManager.fieldsToStorage();contactManager.fieldsToStorage();miniManager.fieldsToStorage();
-a={path:"input/phone",subject:lsi["export"]("subject")[0],contacts:lsi["export"]("contacts"),mini:lsi["export"]("mini-fiches"),fiches:lsi["export"]("fiches")};api.send(a,function(a){console.log(a)},!1)},!1)})})})});
+ficheManager.fieldsToStorage();a={path:"input/phone",subject:lsi["export"]("subject")[0],contacts:lsi["export"]("contacts"),mini:lsi["export"]("mini-fiches"),fiches:lsi["export"]("fiches")};api.send(a,function(a){console.log(a)},!1)},!1)})})})});

view/js/input.js

@@ -278,7 +278,7 @@ include('/js/includes/input-phone-fiche.js', function(){
         /* (2) On lance le téléchargement */
         var downloadTarget = $('#download-target');                                                                        // On récupère le lien (<a>) caché qui fera le téléchargement
         downloadTarget.download = 'local-data.json';                                                                       // Nom du fichier qui sera téléchargé
-        downloadTarget.href     = 'data:application/octet-stream,'+encodeURIComponent(JSON.stringify(data)); // Contenu
+        downloadTarget.href     = 'data:application/octet-stream,' + encodeURIComponent(JSON.stringify(data)); // Contenu
         downloadTarget.click();                                                                                            // On lance le téléchargement
 
     }, false);
@@ -311,12 +311,13 @@ include('/js/includes/input-phone-fiche.js', function(){
                 return false;
 
             /* (3) On enregistre les données dans le 'localStorage' */
-            lsi.import('subject',     response.local_data.subject);
+            lsi.set('subject', 0,     response.local_data.subject);
             lsi.import('contacts',    response.local_data.contacts);
             lsi.import('mini-fiches', response.local_data.mini);
             lsi.import('fiches',      response.local_data.fiches);
 
             /* (3) On met à jour l'affichage */
+            subjectManager.storageToFields();
             contactManager.storageToFields();
             dynamicUpdate(true);
 
@@ -363,31 +364,6 @@ include('/js/includes/input-phone-fiche.js', function(){
 
 
 
-// ETAPE 1 : INITIALISATION (ON RESTAURE LES DONNEES)
-// 1. contact.storageToFields();
-// 2. contact.add();
-// 3. mini.storageToFields();
-// 4. fiche.storageToFields();
-
-// ETAPE 2 : ENREGISTREMENT + MISE À JOUR
-// 1. mini.fieldsToStorage();
-// 2. fiche.fieldsToStorage();
-// 3. contact.fieldsToStorage();
-// 4. mini.sync();
-// 5. fiche.sync();
-
-
-
-
-
-
-
-
-
-
-
-
-