Gestion des .js minifiés pour page-manager. Gestion de l'ajout dynamique de formulaires de contact ainsi que de l'enregistrement en local idem pour le formulaire du sujet.
This commit is contained in:
xdrm-brackets
parent
74676f7c58
commit
66a8f9ef96
|
|
@ -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;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;
|
||||
localStorageInterface.prototype={dataset:[],dataset_keys:[],set:function(a,b,d){var c=this.dataset.indexOf(a);if(-1==c)return!1;-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;
|
||||
|
|
|
|||
|
|
@ -2,8 +2,8 @@ function pageManagerClass(){}var ptrPageManagerClass;
|
|||
pageManagerClass.prototype={depJS:null,depCSS:null,xhr:[],activeXHR:null,page:null,vars:[],path:"",jsPath:"js",cssPath:"css",pagelist:null,container:null,ajax:function(b,c,f,a){for(var d=0;d<this.xhr.length;d++)this.xhr=this.xhr.slice(0,d-1).concat(this.xhr.slice(d,this.xhr.length-1));var e;e=window.XMLHttpRequest?this.xhr.push(new XMLHttpRequest)-1:this.xhr.push(new ActiveXObject("Microsoft.XMLHttpRequest"))-1;this.activeXHR=this.xhr[e];var g=this;this.xhr[e].onreadystatechange=function(){4==g.xhr[e].readyState&&
|
||||
(-1<[0,200].indexOf(g.xhr[e].status)?c(g.xhr[e].responseText):c())};f="string"==typeof f&&/^POST|GET$/i.test(f)?f.toUpperCase():"POST";a="POST"==f&&"object"==typeof a&&a instanceof FormData?a:null;this.xhr[e].open(f,b,!0);this.xhr[e].send(a);return this},explodeURL:function(b){b=1<=arguments.length?b:document.URL;if(null!=this.pagelist&&/^(?:(?:http:\/\/)?[^\/]+)\/([a-z0-9_]+)\/?(?:\/((?:.+\/)+)\/?)?$/i.test(b)){for(var c=RegExp.$2.split("/");""==c[c.length-1];)c.pop();return-1<this.pagelist.indexOf(RegExp.$1)?
|
||||
{page:RegExp.$1,"var":c}:null}return null},loadDependencies:function(){"object"==typeof this.depCSS&&this.depCSS instanceof Element&&this.depCSS.parentNode==document.head&&document.head.removeChild(this.depCSS);"object"==typeof this.depJS&&this.depJS instanceof Element&&this.depJS.parentNode==document.head&&document.head.removeChild(this.depJS);ptrPageManagerClass=this;this.ajax(this.path+"/"+this.cssPath+"/"+this.page+".css",function(b){null!=b?(ptrPageManagerClass.depCSS=document.createElement("link"),
|
||||
ptrPageManagerClass.depCSS.rel="stylesheet",ptrPageManagerClass.depCSS.type="text/css",ptrPageManagerClass.depCSS.href=ptrPageManagerClass.path+"/"+ptrPageManagerClass.cssPath+"/"+ptrPageManagerClass.page+".css",document.head.appendChild(ptrPageManagerClass.depCSS)):console.warn("[loadDependencies_Error] - ("+ptrPageManagerClass.path+"/"+ptrPageManagerClass.cssPath+"/"+ptrPageManagerClass.page+".css)")});this.ajax(this.path+"/"+this.jsPath+"/"+this.page+".js",function(b){null!=b?(ptrPageManagerClass.depJS=
|
||||
document.createElement("script"),ptrPageManagerClass.depJS.type="text/javascript",ptrPageManagerClass.depJS.src=ptrPageManagerClass.path+"/"+ptrPageManagerClass.jsPath+"/"+ptrPageManagerClass.page+".js",document.head.appendChild(ptrPageManagerClass.depJS)):console.warn("[loadDependencies_Error] - ("+ptrPageManagerClass.path+"/"+ptrPageManagerClass.jsPath+"/"+ptrPageManagerClass.page+".js)")})},updateURL:function(){0<this.vars.length?window.history.pushState(this.page,this.page,"/"+this.page+"/"+this.vars.join("/")+
|
||||
"/"):window.history.pushState(this.page,this.page,"/"+this.page+"/")},setPage:function(b,c,f,a){var d="object"==typeof a&&a instanceof Array?a:null;if(null!=d)for(a=0;a<d.length&&(d="string"==typeof d[a]&&/^[a-z0-9_]+$/i.test(d[a])?d:null,null!=d);a++);this.pagelist=null!=d?d:this.pagelist;this.page=this.pagelist[0];this.path="string"==typeof c?c:this.path;this.container="object"==typeof f&&f instanceof Element?f:this.container;if(null!=this.pagelist&&null!=this.container)if("string"==typeof b&&-1<
|
||||
this.pagelist.indexOf(b)){this.page=b;var e=this;b=new FormData;for(a=0;a<this.vars.length;a++)b.append(this.vars[a],null);this.ajax(this.path+"/"+this.page+".php",function(a){e.container.innerHTML=a;e.loadDependencies()},"POST",b);this.updateURL()}else if(c=this.explodeURL(),null!=c){this.page=c.page;var g=this;b=new FormData;for(a=this.vars.length=0;a<c["var"].length;a++)this.vars[a]=c["var"][a],b.append(this.vars[a],null);this.ajax(this.path+"/"+this.page+".php",function(a){g.container.innerHTML=
|
||||
ptrPageManagerClass.depCSS.rel="stylesheet",ptrPageManagerClass.depCSS.type="text/css",ptrPageManagerClass.depCSS.href=ptrPageManagerClass.path+"/"+ptrPageManagerClass.cssPath+"/"+ptrPageManagerClass.page+".css",document.head.appendChild(ptrPageManagerClass.depCSS)):console.warn("[loadDependencies_Error] - ("+ptrPageManagerClass.path+"/"+ptrPageManagerClass.cssPath+"/"+ptrPageManagerClass.page+".css)")});this.ajax(this.path+"/"+this.jsPath+"/"+this.page+"-min.js",function(b){null!=b?(ptrPageManagerClass.depJS=
|
||||
document.createElement("script"),ptrPageManagerClass.depJS.type="text/javascript",ptrPageManagerClass.depJS.src=ptrPageManagerClass.path+"/"+ptrPageManagerClass.jsPath+"/"+ptrPageManagerClass.page+"-min.js",document.head.appendChild(ptrPageManagerClass.depJS)):console.warn("[loadDependencies_Error] - ("+ptrPageManagerClass.path+"/"+ptrPageManagerClass.jsPath+"/"+ptrPageManagerClass.page+".js)")})},updateURL:function(){0<this.vars.length?window.history.pushState(this.page,this.page,"/"+this.page+"/"+
|
||||
this.vars.join("/")+"/"):window.history.pushState(this.page,this.page,"/"+this.page+"/")},setPage:function(b,c,f,a){var d="object"==typeof a&&a instanceof Array?a:null;if(null!=d)for(a=0;a<d.length&&(d="string"==typeof d[a]&&/^[a-z0-9_]+$/i.test(d[a])?d:null,null!=d);a++);this.pagelist=null!=d?d:this.pagelist;this.page=this.pagelist[0];this.path="string"==typeof c?c:this.path;this.container="object"==typeof f&&f instanceof Element?f:this.container;if(null!=this.pagelist&&null!=this.container)if("string"==
|
||||
typeof b&&-1<this.pagelist.indexOf(b)){this.page=b;var e=this;b=new FormData;for(a=0;a<this.vars.length;a++)b.append(this.vars[a],null);this.ajax(this.path+"/"+this.page+".php",function(a){e.container.innerHTML=a;e.loadDependencies()},"POST",b);this.updateURL()}else if(c=this.explodeURL(),null!=c){this.page=c.page;var g=this;b=new FormData;for(a=this.vars.length=0;a<c["var"].length;a++)this.vars[a]=c["var"][a],b.append(this.vars[a],null);this.ajax(this.path+"/"+this.page+".php",function(a){g.container.innerHTML=
|
||||
a;g.loadDependencies()},"POST",b);this.updateURL()}else this.setPage(this.pagelist[0]);else console.warn("pagelist et container manquant");return this},refresh:function(){this.setPage(this.page);return this}};
|
||||
|
|
|
|||
|
|
@ -144,11 +144,11 @@ pageManagerClass.prototype = {
|
|||
});
|
||||
|
||||
// si le fichier js existe
|
||||
this.ajax(this.path+'/'+this.jsPath+'/'+this.page+'.js', function(e){
|
||||
this.ajax(this.path+'/'+this.jsPath+'/'+this.page+'-min.js', function(e){
|
||||
if( e != null ){ // on charge la dépendance JS si le fichier existe
|
||||
ptrPageManagerClass.depJS = document.createElement('script');
|
||||
ptrPageManagerClass.depJS.type = 'text/javascript';
|
||||
ptrPageManagerClass.depJS.src = ptrPageManagerClass.path+'/'+ptrPageManagerClass.jsPath+'/'+ptrPageManagerClass.page+'.js';
|
||||
ptrPageManagerClass.depJS.src = ptrPageManagerClass.path+'/'+ptrPageManagerClass.jsPath+'/'+ptrPageManagerClass.page+'-min.js';
|
||||
document.head.appendChild(ptrPageManagerClass.depJS);
|
||||
}else
|
||||
console.warn('[loadDependencies_Error] - ('+ptrPageManagerClass.path+'/'+ptrPageManagerClass.jsPath+'/'+ptrPageManagerClass.page+'.js)');
|
||||
|
|
|
|||
|
|
@ -38,13 +38,15 @@
|
|||
<h3 data-n='1'>Identifier l'enquêté</h3>
|
||||
<span data-space></span>
|
||||
<h5 data-text="Renseigner au moins un des nominatifs pour chaque contact. (pseudo, prénom et/ou nom)"></h5>
|
||||
<h4 class='self' data-icon='a'>
|
||||
<input type='text' data-name='number' placeholder='Numéro de téléphone'>
|
||||
<input type='text' data-name='username' placeholder='Pseudo'>
|
||||
<input type='text' data-name='firstname' placeholder='Prénom'>
|
||||
<input type='text' data-name='lastname' placeholder='Nom'>
|
||||
<input type='submit' class='primary' data-name='submit' data-store value='Enregistrer'>
|
||||
</h4>
|
||||
<article class='subject-panel'>
|
||||
<h4 class='self' data-icon='a'>
|
||||
<input type='text' data-name='number' placeholder='Numéro de téléphone'>
|
||||
<input type='text' data-name='username' placeholder='Pseudo'>
|
||||
<input type='text' data-name='firstname' placeholder='Prénom'>
|
||||
<input type='text' data-name='lastname' placeholder='Nom'>
|
||||
<input type='submit' class='primary' data-name='submit' data-store value='Enregistrer'>
|
||||
</h4>
|
||||
</article>
|
||||
<span data-space></span>
|
||||
|
||||
|
||||
|
|
@ -59,9 +61,9 @@
|
|||
<h3 data-n='2'>Saisir manuellement les contacts</h3>
|
||||
|
||||
<!-- GESTION DE L'AJOUT DES CONTACTS -->
|
||||
<span data-space></span>
|
||||
<h5 data-text="Renseigner au moins un des nominatifs pour chaque contact. (pseudo, prénom et/ou nom)"></h5>
|
||||
<article class='contact-panel'>
|
||||
<span data-space></span>
|
||||
<h5 data-text="Renseigner au moins un des nominatifs pour chaque contact. (pseudo, prénom et/ou nom)"></h5>
|
||||
<!-- <h4 data-icon='p' class='new-contact'>
|
||||
<input type='text' data-name='number' placeholder='Numéro de téléphone'>
|
||||
<input type='text' data-name='username' placeholder='Pseudo'>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,11 @@
|
|||
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){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);
|
||||
var subjectBuilder=new HTMLBuilder;subjectBuilder.setLayout("<h4 data-icon='p' class='self'> \n\t<input type='text' data-name='number' placeholder='Num\u00e9ro de t\u00e9l\u00e9phone' value='@number' > \n\t<input type='text' data-name='username' placeholder='Pseudo' value='@username' > \n\t<input type='text' data-name='firstname' placeholder='Pr\u00e9nom' value='@firstname' > \n\t<input type='text' data-name='lastname' placeholder='Nom' value='@lastname' > \n\t<input type='submit' class='primary sub-number' value='Enregistrer'>\n</h4>\n\n");
|
||||
var contactBuilder=new HTMLBuilder;contactBuilder.setLayout("<h4 data-icon='p' class='new-contact'> \n\t<input type='text' data-name='number' placeholder='Num\u00e9ro de t\u00e9l\u00e9phone' value='@number' > \n\t<input type='text' data-name='username' placeholder='Pseudo' value='@username' > \n\t<input type='text' data-name='firstname' placeholder='Pr\u00e9nom' value='@firstname' > \n\t<input type='text' data-name='lastname' placeholder='Nom' value='@lastname' > \n\t<input type='submit' class='primary sub-number' value='Enregistrer'>\n</h4>\n\n");
|
||||
var ficheBuilder=new HTMLBuilder;ficheBuilder.setLayout("<h4 data-icon='p' class='new-contact'> \t<input type='text' data-name='number' placeholder='Num\u00e9ro de t\u00e9l\u00e9phone' value='@number' > \t<input type='text' data-name='username' placeholder='Pseudo' value='@username' > \t<input type='text' data-name='firstname' placeholder='Pr\u00e9nom' value='@firstname' > \t<input type='text' data-name='lastname' placeholder='Nom' value='@lastname' > \t<input type='submit' class='primary sub-number' value='Enregistrer'></h4>");
|
||||
function updateListener(a,b,c){a.removeEventListener(b,c);a.addEventListener(b,c)}
|
||||
var ic=new inputChecker,FormDeflaterP={tags:["input"],attr:["data-name"]},importCallLog=$('input#call_log-import[type="file"]'),addContact=$("h4.add-contact"),addFiche=$("h4.add-fiche"),subjectInput={number:$('article.subject-panel [data-name="number"]'),username:$('article.subject-panel [data-name="username"]'),firstname:$('article.subject-panel [data-name="firstname"]'),lastname:$('article.subject-panel [data-name="lastname"]'),store:$('article.subject-panel [data-name="submit"]')};lsi.createDataset("subject");
|
||||
function storeSubject(){console.log("storing subject");var a=0<subjectInput.number.value.length,a=a&&0<subjectInput.username.value.length+subjectInput.firstname.value.length+subjectInput.lastname.value.length;if(!a)return!1;lsi.set("subject","form",{number:subjectInput.number.value,username:subjectInput.username.value,firstname:subjectInput.firstname.value,lastname:subjectInput.lastname.value})}
|
||||
function restoreSubject(){var a=lsi.get("subject","form");console.log(a);null!=a&&(subjectInput.number.value=a.number,subjectInput.username.value=a.username,subjectInput.firstname.value=a.firstname,subjectInput.lastname.value=a.lastname)}restoreSubject();subjectInput.store.addEventListener("click",storeSubject,!1);var contactContainer=$("article.contact-panel");lsi.createDataset("contacts");
|
||||
function storeContacts(){console.log("storing all forms");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;(e=e&&0<d.username.value.length+d.firstname.value.length+d.lastname.value.length)&&lsi.set("contacts","form"+c,{number:d.number.value,username:d.username.value,firstname:d.firstname.value,lastname:d.lastname.value})}restoreContacts()}
|
||||
function addNewContact(a,b,c,d){contactContainer.innerHTML+=contactBuilder.build({number:"string"!=typeof a?"":a,username:"string"!=typeof b?"":b,firstname:"string"!=typeof c?"":c,lastname:"string"!=typeof d?"":d});a=$$('article.contact-panel .new-contact input[type="submit"]');for(b=0;b<a.length;b++)updateListener(a[b],"click",storeContacts)}
|
||||
function restoreContacts(){var a=lsi.keys("contacts");contactContainer.innerHTML="";for(var b=0;b<a.length;b++){var c=lsi.get("contacts",a[b]);addNewContact(c.number,c.username,c.firstname,c.lastname)}addNewContact();a=$$('article.contact-panel .new-contact input[type="submit"]');for(b=0;b<a.length;b++)updateListener(a[b],"click",storeContacts)}restoreContacts();addContact.addEventListener("click",storeContacts,!1);var ficheContainer=$("article.contact-panel");
|
||||
function addNewFiche(a,b,c,d){ficheContainer.innerHTML+=contactBuilder.build({number:"string"!=typeof a?"":a,username:"string"!=typeof b?"":b,firstname:"string"!=typeof c?"":c,lastname:"string"!=typeof d?"":d})}importCallLog.addEventListener("change",function(a){api.send({path:"upload/call_log",file:importCallLog.files[0]},function(a){console.log(a);0==a.ModuleError&&importCallLog.addClass("active")})},!1);
|
||||
|
|
|
|||
290
view/js/input.js
290
view/js/input.js
|
|
@ -1,46 +1,41 @@
|
|||
// STRUCTURE DU localStorage
|
||||
// subject-data -> contient
|
||||
// contacts-data
|
||||
// fiches-relation
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// subject -> contient les données du sujet
|
||||
// contacts -> contient les données de tous les contacts
|
||||
// fiches -> contient les données de toutes les fiches
|
||||
|
||||
/* [0] Gestion des constantes et fonctions
|
||||
=========================================================*/
|
||||
var subjectBuilder = new HTMLBuilder();
|
||||
subjectBuilder.setLayout(
|
||||
"<h4 data-icon='p' class='self'> \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='firstname' placeholder='Prénom' value='@firstname' > \n"+
|
||||
"\t<input type='text' data-name='lastname' placeholder='Nom' value='@lastname' > \n"+
|
||||
"\t<input type='submit' class='primary sub-number' value='Enregistrer'>\n"+
|
||||
"</h4>\n\n");
|
||||
|
||||
|
||||
var contactBuilder = new HTMLBuilder();
|
||||
contactBuilder.setLayout(
|
||||
"<h4 data-icon='p' class='new-contact'> "+
|
||||
"<input type='text' data-name='number' placeholder='Numéro de téléphone' value='@number' > "+
|
||||
"<input type='text' data-name='username' placeholder='Pseudo' value='@username' > "+
|
||||
"<input type='text' data-name='firstname' placeholder='Prénom' value='@firstname' > "+
|
||||
"<input type='text' data-name='lastname' placeholder='Nom' value='@lastname' > "+
|
||||
"<input type='submit' class='primary sub-number' value='Enregistrer'>"+
|
||||
"</h4>");
|
||||
"<h4 data-icon='p' class='new-contact'> \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='firstname' placeholder='Prénom' value='@firstname' > \n"+
|
||||
"\t<input type='text' data-name='lastname' placeholder='Nom' value='@lastname' > \n"+
|
||||
"\t<input type='submit' class='primary sub-number' value='Enregistrer'>\n"+
|
||||
"</h4>\n\n");
|
||||
|
||||
|
||||
/* (2) TODO: Contiendra la fiche relation complète */
|
||||
var ficheBuilder = new HTMLBuilder();
|
||||
ficheBuilder.setLayout(
|
||||
"<h4 data-icon='p' class='new-contact'> "+
|
||||
"<input type='text' data-name='number' placeholder='Numéro de téléphone' value='@number' > "+
|
||||
"<input type='text' data-name='username' placeholder='Pseudo' value='@username' > "+
|
||||
"<input type='text' data-name='firstname' placeholder='Prénom' value='@firstname' > "+
|
||||
"<input type='text' data-name='lastname' placeholder='Nom' value='@lastname' > "+
|
||||
"<input type='submit' class='primary sub-number' value='Enregistrer'>"+
|
||||
"\t<input type='text' data-name='number' placeholder='Numéro de téléphone' value='@number' > "+
|
||||
"\t<input type='text' data-name='username' placeholder='Pseudo' value='@username' > "+
|
||||
"\t<input type='text' data-name='firstname' placeholder='Prénom' value='@firstname' > "+
|
||||
"\t<input type='text' data-name='lastname' placeholder='Nom' value='@lastname' > "+
|
||||
"\t<input type='submit' class='primary sub-number' value='Enregistrer'>"+
|
||||
"</h4>");
|
||||
|
||||
|
||||
|
|
@ -59,6 +54,14 @@ function updateListener(element, eventType, handler){
|
|||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* [1] Initialisation des utilitaires
|
||||
=========================================================*/
|
||||
/* (1) Instanciation de inputChecker */
|
||||
|
|
@ -75,31 +78,23 @@ var FormDeflaterP = { tags: ['input'], attr: ['data-name'] };
|
|||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* [2] Indexation des inputs
|
||||
=========================================================*/
|
||||
/* (1) Input de type fichier pour l'import */
|
||||
var importCallLog = $('input#call_log-import[type="file"]');
|
||||
|
||||
|
||||
/* (2) Contiendra les formulaires des contacts ajoutés */
|
||||
var contactDeflaters = []; // Contiendra les deflaters de chaque formulaire d'ajout de contact
|
||||
function contactForms(){
|
||||
// {1} On récupère les formulaires //
|
||||
var contactForms = $$('h4.new-contact');
|
||||
|
||||
// {2} Mise à jour des deflaters //
|
||||
contactDeflaters = [];
|
||||
for( var i = 0 ; i < contactForms.length ; i++ )
|
||||
contactDeflaters.push( new FormDeflater( contactForms[i], FormDeflaterP.tags, FormDeflaterP.attr ));
|
||||
|
||||
// {3} On retourne la liste des formulaires //
|
||||
return contactForms;
|
||||
}
|
||||
|
||||
/* (3) Bouton d'ajout de contact */
|
||||
/* (2) Bouton d'ajout de contact */
|
||||
var addContact = $('h4.add-contact');
|
||||
|
||||
/* (4) Bouton d'ajout de fiche */
|
||||
/* (3) Bouton d'ajout de fiche */
|
||||
var addFiche = $('h4.add-fiche');
|
||||
|
||||
|
||||
|
|
@ -109,33 +104,133 @@ var addFiche = $('h4.add-fiche');
|
|||
|
||||
|
||||
|
||||
/* [3] Gestion des formulaires de contact
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* [3] Gestion des formulaires du sujet
|
||||
=========================================================*/
|
||||
/* (0) Les input du formulaire du sujet */
|
||||
var subjectInput = {
|
||||
number: $('article.subject-panel [data-name="number"]'),
|
||||
username: $('article.subject-panel [data-name="username"]'),
|
||||
firstname: $('article.subject-panel [data-name="firstname"]'),
|
||||
lastname: $('article.subject-panel [data-name="lastname"]'),
|
||||
|
||||
store: $('article.subject-panel [data-name="submit"]')
|
||||
};
|
||||
|
||||
/* (1) Gestion de l'enregistrement du sujet en local ('localStorage') */
|
||||
lsi.createDataset('subject');
|
||||
function storeSubject(){
|
||||
console.log('storing subject');
|
||||
|
||||
// {1} Vérification des champs //
|
||||
// Le numéro n'est pas vide
|
||||
var validForm = subjectInput.number.value.length > 0;
|
||||
// ET le pseudo et/ou le prénom et/ou le nom n'est pas vide
|
||||
validForm = validForm && subjectInput.username.value.length+subjectInput.firstname.value.length+subjectInput.lastname.value.length > 0;
|
||||
|
||||
// Si le formulaire n'est pas valide, on ne l'enregistre pas
|
||||
if( !validForm ) return false;
|
||||
|
||||
// {2} On récupère et met en forme les valeurs du deflater //
|
||||
var obj = {
|
||||
number: subjectInput.number.value,
|
||||
username: subjectInput.username.value,
|
||||
firstname: subjectInput.firstname.value,
|
||||
lastname: subjectInput.lastname.value
|
||||
};
|
||||
|
||||
// {3} On enregistre les données dans le 'localStorage' //
|
||||
lsi.set('subject', 'form', obj);
|
||||
|
||||
}
|
||||
|
||||
/* (2) Gestion de l'affichage (et mise à jour) du sujet (depuis 'localStorage') */
|
||||
function restoreSubject(){
|
||||
// {1} On récupère les informations du sujet //
|
||||
var subjectData = lsi.get('subject', 'form');
|
||||
console.log(subjectData);
|
||||
|
||||
if( subjectData == null ) return;
|
||||
|
||||
// {2} On restore les valeurs //
|
||||
subjectInput.number.value = subjectData.number;
|
||||
subjectInput.username.value = subjectData.username;
|
||||
subjectInput.firstname.value = subjectData.firstname;
|
||||
subjectInput.lastname.value = subjectData.lastname;
|
||||
}restoreSubject();
|
||||
|
||||
|
||||
/* (n) On attache l'évènement d'enregistrement du formulaire du sujet */
|
||||
subjectInput.store.addEventListener('click', storeSubject, false);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* [4] Gestion des formulaires de contact
|
||||
=========================================================*/
|
||||
/* (0) Conteneur de tous les formulaires */
|
||||
var contactContainer = $('article.contact-panel');
|
||||
|
||||
/* (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);
|
||||
function storeContacts(){
|
||||
console.log('storing all forms');
|
||||
|
||||
// {2} On initialise notre deflater pour récupérer les valeurs //
|
||||
var deflater = new FormDeflater(form, ['input'], ['data-name']);
|
||||
// {1} Pour chaque formulaire de contact présent //
|
||||
var existingContacts = $$('article.contact-panel .new-contact');
|
||||
for( var i = 0 ; i < existingContacts.length ; i++ ){
|
||||
|
||||
// {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
|
||||
};
|
||||
// {2} On récupère les informations relatives à l'élément courant //
|
||||
var indexInParent = existingContacts[i].parentNode.children.indexOf(existingContacts[i]);
|
||||
|
||||
// {4} On enregistre les données dans le 'localStorage' //
|
||||
lsi.set('contacts', 'form'+indexInParent, obj);
|
||||
// {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 //
|
||||
var deflated = deflater.deflate();
|
||||
|
||||
// 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
|
||||
validForm = validForm && deflated.username.value.length+deflated.firstname.value.length+deflated.lastname.value.length > 0;
|
||||
|
||||
// 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 //
|
||||
var obj = {
|
||||
number: deflated.number.value,
|
||||
username: deflated.username.value,
|
||||
firstname: deflated.firstname.value,
|
||||
lastname: deflated.lastname.value
|
||||
};
|
||||
|
||||
// {6} On enregistre les données dans le 'localStorage' //
|
||||
lsi.set('contacts', 'form'+indexInParent, obj);
|
||||
|
||||
}
|
||||
|
||||
// {7} On met à jour le rendu //
|
||||
restoreContacts();
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -157,11 +252,14 @@ function addNewContact(number, username, firstname, lastname){
|
|||
}
|
||||
|
||||
|
||||
/* (3) Gestion de la récupération des contacts (depuis 'localStorage') */
|
||||
/* (3) Gestion de l'affichage (et mise à jour) des contacts (depuis 'localStorage') */
|
||||
function restoreContacts(){
|
||||
// {1} Pour chaque contact du 'localStorage' //
|
||||
var existingContacts = lsi.keys('contacts');
|
||||
|
||||
// On réinitialise le HTML
|
||||
contactContainer.innerHTML = '';
|
||||
|
||||
for( var i = 0 ; i < existingContacts.length ; i++ ){
|
||||
// {2} On récupère les informations du contact //
|
||||
var contactData = lsi.get('contacts', existingContacts[i]);
|
||||
|
|
@ -175,17 +273,20 @@ function restoreContacts(){
|
|||
);
|
||||
}
|
||||
|
||||
}restoreContacts();
|
||||
|
||||
// Si on a aucun contact, on en ajoute 1
|
||||
if( ('article.contact-panel .new-contact input[type="submit"]') == null )
|
||||
addNewContact();
|
||||
|
||||
// {4} On met à jour les listeners de chaque formulaire //
|
||||
var contactSubmits = $$('article.contact-panel .new-contact input[type="submit"]');
|
||||
|
||||
for( var i = 0 ; i < contactSubmits.length ; i++ )
|
||||
updateListener(contactSubmits[i], 'click', storeContacts);
|
||||
|
||||
|
||||
}restoreContacts();
|
||||
|
||||
/* (n) On attache tous les évènements */
|
||||
addContact.addEventListener('click', addNewContact, false);
|
||||
|
||||
/* (n) On attache l'évènement d'ajout d'un formulaire de contact */
|
||||
addContact.addEventListener('click', storeContacts, false);
|
||||
|
||||
|
||||
|
||||
|
|
@ -194,8 +295,17 @@ addContact.addEventListener('click', addNewContact, false);
|
|||
|
||||
|
||||
|
||||
/* [4] Gestion des fiches relation
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* [5] Gestion des fiches relation
|
||||
=========================================================*/
|
||||
// TODO : Gestion des fiches relation en fonction des contacts
|
||||
/* (0) Conteneur de tous les formulaires */
|
||||
var ficheContainer = $('article.contact-panel');
|
||||
|
||||
|
|
@ -221,6 +331,14 @@ function addNewFiche(number, username, firstname, lastname){
|
|||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* [5] Gestion des deflaters (formulaires) de contact
|
||||
=========================================================*/
|
||||
|
||||
|
|
@ -229,22 +347,6 @@ function addNewFiche(number, username, firstname, lastname){
|
|||
|
||||
|
||||
|
||||
/* [6] Gestion des deflaters (formulaires) de fiches
|
||||
=========================================================*/
|
||||
/* (4) Contiendra les formulaires de fiche relation */
|
||||
var ficheDeflaters = []; // Contiendra les deflaters de chaque formulaire de fiche de fiche
|
||||
function ficheForms(){
|
||||
// {1} On récupère les formulaires //
|
||||
var ficheForms = $$('h4.fiche-fiche');
|
||||
|
||||
// {2} Mise à jour des deflaters //
|
||||
ficheDeflaters = [];
|
||||
for( var i = 0 ; i < ficheForms.length ; i++ )
|
||||
ficheDeflaters.push( new FormDeflater( ficheForms[i], FormDeflaterP.tags, FormDeflaterP.attr ));
|
||||
|
||||
// {3} On retourne la liste des formulaires //
|
||||
return ficheForms;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
|
@ -252,7 +354,11 @@ function ficheForms(){
|
|||
|
||||
|
||||
|
||||
/* [3] Gestion de l'import du fichier
|
||||
|
||||
|
||||
|
||||
|
||||
/* [6] Gestion de l'import du fichier
|
||||
=========================================================*/
|
||||
importCallLog.addEventListener('change', function(e){
|
||||
/* (1) On rédige la requête */
|
||||
|
|
|
|||
Loading…
Reference in New Issue