// STRUCTURE DU localStorage // 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 /* (3) Fonction qui met à jour un élément et son listener */ function updateListener(element, eventType, handler){ element.removeEventListener(eventType, handler); element.addEventListener(eventType, handler); } /* [1] Initialisation des utilitaires =========================================================*/ /* (1) Instanciation de inputChecker */ var ic = new inputChecker(); /* (2) Paramètres de FormDeflater */ var FormDeflaterP = { tags: ['input'], attr: ['data-name'] }; /* [2] Indexation des inputs + Containers =========================================================*/ /* (1) Input de type fichier pour l'import */ var importCallLog = $('input#call_log-import[type="file"]'); /* (2) Bouton d'ajout de contact */ var addContact = $('h4.add-contact'); /* (3) Conteneur des formulaires de contact */ var contactContainer = $('article.contact-panel'); /* (4) Bouton d'ajout de MINI fiche */ var addFiche = $('h4.add-mini-fiche'); /* (5) Conteneur des MINI fiches relation */ var miniFicheContainer = $('article.mini-relation-panel'); /* (6) Bouton d'ajout de fiche */ var addFiche = $('h4.add-fiche'); /* (7) Conteneur des fiches relation */ var ficheContainer = $('article.relation-panel'); /* [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 =========================================================*/ /* (1) Gestion de l'enregistrement des contacts en local ('localStorage') */ lsi.createDataset('contacts'); function storeContacts(){ console.log('storing all forms'); // {1} Pour chaque formulaire de contact présent // var existingContacts = $$('article.contact-panel .new-contact'); for( var i = 0 ; i < existingContacts.length ; i++ ){ // {2} On récupère les informations relatives à l'élément courant // var indexInParent = existingContacts[i].parentNode.children.indexOf(existingContacts[i]); // {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(); } /* (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); } /* (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]); // {3} On ajoute un contact à la liste // addNewContact( contactData.number, contactData.username, contactData.firstname, contactData.lastname ); } 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 l'évènement d'ajout d'un formulaire de contact */ addContact.addEventListener('click', storeContacts, false); /* [5] Gestion des fiches relation =========================================================*/ // TODO : Gestion des fiches relation en fonction des contacts /* (1) Fonction pour l'ajout d'un contact */ var miniFicheUID = 0; function addNewMiniFiche(firstname, lastname, username){ miniFicheContainer.innerHTML += miniFicheBuilder.build({ firstname: (typeof firstname != 'string') ? '' : firstname, lastname: (typeof lastname != 'string') ? '' : lastname, username: (typeof username != 'string') ? '' : username, uid: miniFicheUID }); miniFicheUID++; } // On ajoute la première // addNewFiche(); // Puis on attache l'évènement pour en ajouter d'autres manuellement // addContact.addEventListener('click', addNewFiche, false); /* [5] Gestion des deflaters (formulaires) de contact =========================================================*/ /* [6] Gestion de l'import du fichier =========================================================*/ importCallLog.addEventListener('change', function(e){ /* (1) On rédige la requête */ var uploadRequest = { path: 'upload/call_log', file: importCallLog.files[0] }; /* (2) On effectue l'upload (import) */ api.send(uploadRequest, function(response){ console.log( response ); // Si tout est bon, on met l'input en bleu if( response.ModuleError == 0 ) importCallLog.addClass('active'); // TODO: Gestion de l'ajout des fiches relation }); }, false); // var number = $('input.number[type="text"]'); // ic.append(number, format_number, '06 06 06 06 06'); // // format_number -> format pour les numéros de téléphones // // number.addEventListener('keyup', function(e){ // ic.correct(number, false); // }, false);