Gestion de l'enregistrement local + de la restauration au chargement (erreur quand on ajoute un formulaire de contact, ceux qui ont été chargés dynamiquement se 'reset')
This commit is contained in:
xdrm-brackets
parent
20d9ca8216
commit
74676f7c58
|
|
@ -1 +1 @@
|
|||
function HTMLBuilder(){}HTMLBuilder.prototype={layout:null,default_params:{},setLayout:function(a){this.layout=a},build:function(a){var b=this.layout,c;for(c in a){var d=new RegExp("@"+c,"g");console.log(d);b=b.replace(d,a[c])}return b}};
|
||||
function HTMLBuilder(){}HTMLBuilder.prototype={layout:null,default_params:{},setLayout:function(a){this.layout=a},build:function(a){var b=this.layout,c;for(c in a)b=b.replace(new RegExp("@"+c,"g"),a[c]);return b}};
|
||||
|
|
|
|||
|
|
@ -19,7 +19,6 @@ HTMLBuilder.prototype = {
|
|||
for( var name in parameters ){
|
||||
// Contiendra l'expression régulière pour remplacer le paramètre
|
||||
var regex = new RegExp('@'+name, 'g');
|
||||
console.log(regex);
|
||||
|
||||
render = render.replace(regex, parameters[name]);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,3 @@
|
|||
function localStorageInterface(){}
|
||||
localStorageInterface.prototype={dataset:[],dataset_keys:[],set:function(a,b,d){var c=this.dataset.indexOf(a);if(-1==c)return!1;this.dataset_keys[c].push(b);localStorage.setItem(a,JSON.stringify(this.dataset_keys[c]));localStorage.setItem(a+"_"+b,JSON.stringify(d));return!0},get:function(a,b){return-1==this.dataset.indexOf(a)?!1:JSON.parse(localStorage.getItem(a+"_"+b))},createDataset:function(a){if(null==a||"string"!=typeof a)return!1;if(-1<this.dataset.indexOf(a))return!0;var b=localStorage.getItem(a);
|
||||
null!=b?(this.dataset.push(a),this.dataset_keys.push(JSON.parse(b))):(this.dataset.push(a),this.dataset_keys.push([]),localStorage.setItem(a,""));return!0},keys:function(a){a=this.dataset.indexOf(a);return-1==a?!1:this.dataset_keys[a]}};var lsi=new localStorageInterface;
|
||||
localStorageInterface.prototype={dataset:[],dataset_keys:[],set:function(a,b,d){var c=this.dataset.indexOf(a);if(-1==c)return!1;console.log(this.dataset_keys[c]+" -> "+b);-1==this.dataset_keys[c].indexOf(b)&&(this.dataset_keys[c].push(b),localStorage.setItem(a,JSON.stringify(this.dataset_keys[c])));localStorage.setItem(a+"_"+b,JSON.stringify(d));return!0},get:function(a,b){return-1==this.dataset.indexOf(a)?!1:JSON.parse(localStorage.getItem(a+"_"+b))},createDataset:function(a){if(null==a||"string"!=
|
||||
typeof a)return!1;if(-1<this.dataset.indexOf(a))return!0;var b=localStorage.getItem(a);null!=b?(this.dataset.push(a),this.dataset_keys.push(JSON.parse(b))):(this.dataset.push(a),this.dataset_keys.push([]),localStorage.setItem(a,JSON.stringify([])));return!0},keys:function(a){a=this.dataset.indexOf(a);return-1==a?!1:this.dataset_keys[a]}};var lsi=new localStorageInterface;
|
||||
|
|
|
|||
|
|
@ -21,9 +21,11 @@ localStorageInterface.prototype = {
|
|||
/* (1) Si le 'dataset' n'existe pas */
|
||||
if( index == -1 ) return false; // erreur
|
||||
|
||||
/* (2) On enregistre la nouvelle clé */
|
||||
/* (2) On enregistre la nouvelle clé, si elle est nouvelle */
|
||||
if( this.dataset_keys[index].indexOf(key) == -1 ){
|
||||
this.dataset_keys[index].push(key);
|
||||
localStorage.setItem(dataset_name, JSON.stringify(this.dataset_keys[index]));
|
||||
}
|
||||
|
||||
/* (3) On propage au 'localStorage' */
|
||||
localStorage.setItem(dataset_name+'_'+key, JSON.stringify(value) );
|
||||
|
|
@ -75,7 +77,7 @@ localStorageInterface.prototype = {
|
|||
|
||||
this.dataset.push(name);
|
||||
this.dataset_keys.push([]);
|
||||
localStorage.setItem(name, '');
|
||||
localStorage.setItem(name, JSON.stringify([]));
|
||||
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
var contactBuilder=new HTMLBuilder;contactBuilder.setLayout("<h4 data-icon='p' class='new-contact'> <input type='text' data-name='number' placeholder='Num\u00e9ro de t\u00e9l\u00e9phone' value='@number' > <input type='text' data-name='username' placeholder='Pseudo' value='@username' > <input type='text' data-name='firstname' placeholder='Pr\u00e9nom' value='@firstname' > <input type='text' data-name='lastname' placeholder='Nom' value='@lastname' > <input type='submit' class='primary sub-number' value='Enregistrer'></h4>");
|
||||
var ficheBuilder=new HTMLBuilder;ficheBuilder.setLayout("<h4 data-icon='p' class='new-contact'> <input type='text' data-name='number' placeholder='Num\u00e9ro de t\u00e9l\u00e9phone' value='@number' > <input type='text' data-name='username' placeholder='Pseudo' value='@username' > <input type='text' data-name='firstname' placeholder='Pr\u00e9nom' value='@firstname' > <input type='text' data-name='lastname' placeholder='Nom' value='@lastname' > <input type='submit' class='primary sub-number' value='Enregistrer'></h4>");
|
||||
function updateListener(b,a,c,d){b.removeEventListener(a,c);d.addEventListener(a,c);return d}var ic=new inputChecker,FormDeflaterP={tags:["input"],attr:["data-name"]},importCallLog=$('input#call_log-import[type="file"]'),contactDeflaters=[];function contactForms(){var b=$$("h4.new-contact");contactDeflaters=[];for(var a=0;a<b.length;a++)contactDeflaters.push(new FormDeflater(b[a],FormDeflaterP.tags,FormDeflaterP.attr));return b}
|
||||
var addContact=$("h4.add-contact"),addFiche=$("h4.add-fiche"),contactContainer=$("article.contact-panel");function addNewContact(b,a,c,d){contactContainer.innerHTML+=contactBuilder.build({number:"string"!=typeof b?"":b,username:"string"!=typeof a?"":a,firstname:"string"!=typeof c?"":c,lastname:"string"!=typeof d?"":d})}addNewContact();addContact.addEventListener("click",addNewContact,!1);var ficheContainer=$("article.contact-panel");
|
||||
function addNewFiche(b,a,c,d){ficheContainer.innerHTML+=contactBuilder.build({number:"string"!=typeof b?"":b,username:"string"!=typeof a?"":a,firstname:"string"!=typeof c?"":c,lastname:"string"!=typeof d?"":d})}var ficheDeflaters=[];function ficheForms(){var b=$$("h4.fiche-fiche");ficheDeflaters=[];for(var a=0;a<b.length;a++)ficheDeflaters.push(new FormDeflater(b[a],FormDeflaterP.tags,FormDeflaterP.attr));return b}
|
||||
importCallLog.addEventListener("change",function(b){api.send({path:"upload/call_log",file:importCallLog.files[0]},function(a){console.log(a);0==a.ModuleError&&importCallLog.addClass("active")})},!1);
|
||||
function updateListener(b,a,c){b.removeEventListener(a,c);b.addEventListener(a,c)}var ic=new inputChecker,FormDeflaterP={tags:["input"],attr:["data-name"]},importCallLog=$('input#call_log-import[type="file"]'),contactDeflaters=[];function contactForms(){var b=$$("h4.new-contact");contactDeflaters=[];for(var a=0;a<b.length;a++)contactDeflaters.push(new FormDeflater(b[a],FormDeflaterP.tags,FormDeflaterP.attr));return b}var addContact=$("h4.add-contact"),addFiche=$("h4.add-fiche"),contactContainer=$("article.contact-panel");
|
||||
lsi.createDataset("contacts");function storeContacts(b){console.log("storing");var a=b.target.parentNode;b=a.parentNode.children.indexOf(a);a=(new FormDeflater(a,["input"],["data-name"])).deflate();lsi.set("contacts","form"+b,{number:a.number.value,username:a.username.value,firstname:a.firstname.value,lastname:a.lastname.value})}
|
||||
function addNewContact(b,a,c,d){contactContainer.innerHTML+=contactBuilder.build({number:"string"!=typeof b?"":b,username:"string"!=typeof a?"":a,firstname:"string"!=typeof c?"":c,lastname:"string"!=typeof d?"":d});b=$$('article.contact-panel .new-contact input[type="submit"]');for(a=0;a<b.length;a++)updateListener(b[a],"click",storeContacts)}
|
||||
function restoreContacts(){for(var b=lsi.keys("contacts"),a=0;a<b.length;a++){var c=lsi.get("contacts",b[a]);addNewContact(c.number,c.username,c.firstname,c.lastname)}}restoreContacts();addContact.addEventListener("click",addNewContact,!1);var ficheContainer=$("article.contact-panel");function addNewFiche(b,a,c,d){ficheContainer.innerHTML+=contactBuilder.build({number:"string"!=typeof b?"":b,username:"string"!=typeof a?"":a,firstname:"string"!=typeof c?"":c,lastname:"string"!=typeof d?"":d})}
|
||||
var ficheDeflaters=[];function ficheForms(){var b=$$("h4.fiche-fiche");ficheDeflaters=[];for(var a=0;a<b.length;a++)ficheDeflaters.push(new FormDeflater(b[a],FormDeflaterP.tags,FormDeflaterP.attr));return b}importCallLog.addEventListener("change",function(b){api.send({path:"upload/call_log",file:importCallLog.files[0]},function(a){console.log(a);0==a.ModuleError&&importCallLog.addClass("active")})},!1);
|
||||
|
|
|
|||
|
|
@ -44,11 +44,10 @@ ficheBuilder.setLayout(
|
|||
"</h4>");
|
||||
|
||||
|
||||
// Fonction qui met à jour un élément et son listener
|
||||
function updateListener(element, eventType, handler, newElement){
|
||||
/* (3) Fonction qui met à jour un élément et son listener */
|
||||
function updateListener(element, eventType, handler){
|
||||
element.removeEventListener(eventType, handler);
|
||||
newElement.addEventListener(eventType, handler);
|
||||
return newElement;
|
||||
element.addEventListener(eventType, handler);
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -105,30 +104,96 @@ var addFiche = $('h4.add-fiche');
|
|||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* [3] Gestion des formulaires de contact
|
||||
=========================================================*/
|
||||
/* (0) Conteneur de tous les formulaires */
|
||||
var contactContainer = $('article.contact-panel');
|
||||
|
||||
/* (1) Fonction pour l'ajout d'un contact */
|
||||
/* (1) Gestion de l'enregistrement des contacts en local ('localStorage') */
|
||||
lsi.createDataset('contacts');
|
||||
function storeContacts(e){
|
||||
console.log('storing');
|
||||
// {1} On récupère les informations relatives à l'élément courant //
|
||||
var form = e.target.parentNode;
|
||||
var indexInParent = form.parentNode.children.indexOf(form);
|
||||
|
||||
// {2} On initialise notre deflater pour récupérer les valeurs //
|
||||
var deflater = new FormDeflater(form, ['input'], ['data-name']);
|
||||
|
||||
// {3} On récupère et met en forme les valeurs du deflater //
|
||||
var deflated = deflater.deflate();
|
||||
var obj = {
|
||||
number: deflated.number.value,
|
||||
username: deflated.username.value,
|
||||
firstname: deflated.firstname.value,
|
||||
lastname: deflated.lastname.value
|
||||
};
|
||||
|
||||
// {4} On enregistre les données dans le 'localStorage' //
|
||||
lsi.set('contacts', 'form'+indexInParent, obj);
|
||||
}
|
||||
|
||||
|
||||
/* (2) Fonction pour l'ajout d'un contact */
|
||||
function addNewContact(number, username, firstname, lastname){
|
||||
// {1} On ajoute le HTML //
|
||||
contactContainer.innerHTML += contactBuilder.build({
|
||||
number: (typeof number != 'string') ? '' : number,
|
||||
username: (typeof username != 'string') ? '' : username,
|
||||
firstname: (typeof firstname != 'string') ? '' : firstname,
|
||||
lastname: (typeof lastname != 'string') ? '' : lastname
|
||||
});
|
||||
|
||||
// {2} On attache les évènements sur les boutons 'Enregistrer' //
|
||||
var contactSubmits = $$('article.contact-panel .new-contact input[type="submit"]');
|
||||
for( var i = 0 ; i < contactSubmits.length ; i++ )
|
||||
updateListener(contactSubmits[i], 'click', storeContacts);
|
||||
|
||||
}
|
||||
|
||||
// On ajoute le premier
|
||||
|
||||
/* (3) Gestion de la récupération des contacts (depuis 'localStorage') */
|
||||
function restoreContacts(){
|
||||
// {1} Pour chaque contact du 'localStorage' //
|
||||
var existingContacts = lsi.keys('contacts');
|
||||
|
||||
for( var i = 0 ; i < existingContacts.length ; i++ ){
|
||||
// {2} On récupère les informations du contact //
|
||||
var contactData = lsi.get('contacts', existingContacts[i]);
|
||||
|
||||
// {3} On ajoute un contact à la liste //
|
||||
addNewContact(
|
||||
contactData.number,
|
||||
contactData.username,
|
||||
contactData.firstname,
|
||||
contactData.lastname
|
||||
);
|
||||
}
|
||||
|
||||
}restoreContacts();
|
||||
|
||||
// Si on a aucun contact, on en ajoute 1
|
||||
if( ('article.contact-panel .new-contact input[type="submit"]') == null )
|
||||
addNewContact();
|
||||
|
||||
// Puis on attache l'évènement pour en ajouter d'autres manuellement
|
||||
|
||||
|
||||
|
||||
/* (n) On attache tous les évènements */
|
||||
addContact.addEventListener('click', addNewContact, false);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* [4] Gestion des fiches relation
|
||||
=========================================================*/
|
||||
/* (0) Conteneur de tous les formulaires */
|
||||
|
|
|
|||
Loading…
Reference in New Issue