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 */
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"+

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};
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=
crc32(JSON.stringify(d)),lsi.set("contacts",c,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);
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()};
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.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.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)};
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"),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",parseInt(b.uid.value),d)}};
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",
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 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 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 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');
// {1} Pour chaque formulaire de contact présent //
var existingContacts = $$('article.contact-panel .new-contact');
for( var i = 0 ; i < existingContacts.length ; i++ ){
var visibleContacts = $$('article.contact-panel .new-contact');
for( var i = 0 ; i < visibleContacts.length ; i++ ){
// {2} On récupère les informations relatives à l'élément courant //
var indexInParent = existingContacts[i].parentNode.children.indexOf(existingContacts[i]);
// {2} On initialise notre deflater pour récupérer les valeurs //
var deflater = new FormDeflater(visibleContacts[i], ['input'], ['data-name']);
// {3} On initialise notre deflater pour récupérer les valeurs //
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 //
// {3} 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' //
lsi.set('contacts', indexInParent, obj);
// {6} On enregistre les données dans le 'localStorage' //
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);

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>
<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 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]};
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();
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)})})})});
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();
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

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