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.

This commit is contained in:
xdrm-brackets 2016-05-03 15:10:56 +02:00
parent dc511fba1f
commit 022039f0e8
11 changed files with 47 additions and 66 deletions

Binary file not shown.

Binary file not shown.

Binary file not shown.

File diff suppressed because one or more lines are too long

View File

@ -3,7 +3,10 @@
/* (1) Constructeur de formulaire de contact */ /* (1) Constructeur de formulaire de contact */
var contactBuilder = new HTMLBuilder(); var contactBuilder = new HTMLBuilder();
contactBuilder.setLayout( 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='number' placeholder='Numéro de téléphone' value='@number' > \n"+
"\t<input type='text' data-name='username' placeholder='Pseudo' value='@username' > \n"+ "\t<input type='text' data-name='username' placeholder='Pseudo' value='@username' > \n"+
"\t<span class='switch-left'></span> \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<input type='hidden' data-name='username' value='@username'>\n"+
"\t<span data-space></span>\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<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"+ "\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='lastname' value='@lastname'>\n"+
"\t<input type='hidden' data-name='username' value='@username'>\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<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"+ "\t\t<input type='radio' name='sexe_@uid' data-name='sexe' id='sexeH_@uid'><label for='sexeH_@uid'>Homme</label>\n"+

View File

@ -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)};

View File

@ -21,18 +21,15 @@ inputPhoneContact.prototype.fieldsToStorage = function(){
console.log('CONTACTS: FIELDS TO STORAGE'); console.log('CONTACTS: FIELDS TO STORAGE');
// {1} Pour chaque formulaire de contact présent // // {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(); var deflated = deflater.deflate();
console.log(deflated);
// Le numéro n'est pas vide // Le numéro n'est pas vide
var validForm = deflated.number.value.length > 0; var validForm = deflated.number.value.length > 0;
// ET le pseudo et/ou le prénom et/ou le nom n'est pas vide // 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 // Si le formulaire n'est pas valide, on ne l'enregistre pas
if( !validForm ) continue; 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 = { var obj = {
uid: indexInParent, uid: parseInt(deflated.uid.value),
number: deflated.number.value, number: deflated.number.value,
username: deflated.username.value, username: deflated.username.value,
firstname: deflated.firstname.value, firstname: deflated.firstname.value,
lastname: deflated.lastname.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) ); 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){ inputPhoneContact.prototype.add = function(objectData){
console.log('CONTACTS: ADD'); 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 // // {0} On formatte l'object //
objectData.number = (objectData.number != null) ? objectData.number : ''; objectData.number = (objectData.number != null) ? objectData.number : '';
objectData.username = (objectData.username != null) ? objectData.username : ''; 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 // // {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 min = 10*(this.selected-1); // On affiche du contact sélectionné
var max = 10*(this.selected-1)+10; // On s'arrête à 10 contacs var max = 10*(this.selected-1)+10; // On s'arrête à 10 contacs
for( var i = min ; i < max && i < contactKeys.length ; i++ ) for( var i = min ; i < max && i < contactKeys.length ; i++ )
this.add( lsi.get('contacts', contactKeys[i]) ); this.add( lsi.get('contacts', contactKeys[i]) );
// On ajoute un champ de plus à remplir si c'est la dernière page // On ajoute un champ de plus à remplir si c'est la dernière page
if( max >= contactKeys.length ) 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 */ /* (3) On met à jour la barre de navigation */
this.updateNavBar(); this.updateNavBar();
@ -188,6 +188,7 @@ inputPhoneContact.prototype.updateNavBar = function(){
this.nav_container.innerHTML += '<span>'+ (1+i/10) +'</span>'; 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 */ /* (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] ); 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){ this.nav_container.addEventListener('click', function(e){
// 1. On gère la navigation // 1. On gère la navigation
ptr.nav(e.target); ptr.nav(e.target);
// 2. On gere le chargement dynamique // 2. On gere le chargement dynamique
ptr.handler(e.target); ptr.handler(e.target);
}, false); }, false);

File diff suppressed because one or more lines are too long

View File

@ -38,17 +38,17 @@
<h3 data-n='0' class='color4'>Effacer les données de la dernière enquête</h3> <h3 data-n='0' class='color4'>Effacer les données de la dernière enquête</h3>
<span data-space></span> <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> <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>
<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='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>
<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'> <input type='submit' class='primary' id='clear-all' value='Tout effacer'>
</h4> </h4>
<span data-space></span> <span data-space></span>

View File

@ -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]}; 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", 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]}; 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 File

@ -311,12 +311,13 @@ include('/js/includes/input-phone-fiche.js', function(){
return false; return false;
/* (3) On enregistre les données dans le 'localStorage' */ /* (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('contacts', response.local_data.contacts);
lsi.import('mini-fiches', response.local_data.mini); lsi.import('mini-fiches', response.local_data.mini);
lsi.import('fiches', response.local_data.fiches); lsi.import('fiches', response.local_data.fiches);
/* (3) On met à jour l'affichage */ /* (3) On met à jour l'affichage */
subjectManager.storageToFields();
contactManager.storageToFields(); contactManager.storageToFields();
dynamicUpdate(true); 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();