// 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) Conteneur des MINI fiches relation */ var miniFicheContainer = $('article.mini-relation-panel'); /* (5) 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'); 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); var contactManager; /* [4] Gestion des formulaires de contact =========================================================*/ include('/js/includes/input-phone-contact.js', function(){ /* (1) On crée une instance du gestionnaire des CONTACTS */ contactManager = new inputPhoneContact( contactContainer, addContact ); /* (2) On le démarre */ contactManager.attach(); }); /* (1) Gestion de l'enregistrement des contacts en local ('localStorage') */ // lsi.createDataset('contacts'); // function storeContacts(){ // console.log('STORING ALL CONTACTS'); // // // {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 enregistre les données des MINI fiches associées // // var associatedMiniFiche = lsi.get('mini-fiches', 'form'+indexInParent); // // // Si n'existe pas, on la crée // if( associatedMiniFiche === false ){ // lsi.set('mini-fiches', 'form'+indexInParent, { // uid: indexInParent, // firstname: obj.firstname, // lastname: obj.lastname, // username: obj.username, // age: '', // sexe: [true, false], // job: '.', // location: [true, false, false, false] // }); // // // Sinon, on met à jour // }else{ // // associatedMiniFiche.firstname = obj.firstname; // associatedMiniFiche.lastname = obj.lastname; // associatedMiniFiche.username = obj.username; // // lsi.set('mini-fiches', 'form'+indexInParent, associatedMiniFiche); // } // // } // // // {8} On met à jour les mini-fiches // // storeMiniFiches(); // // // // {9} On met à jour le rendu des contacts// // 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 MINI fiches // // storeMiniFiches(); // // } // // // /* (n) On attache l'évènement d'ajout d'un formulaire de contact */ // addContact.addEventListener('click', storeContacts, false); /* [5] Gestion des MINI fiches relation =========================================================*/ /* (1) Gestion de l'enregistrement des contacts en local ('localStorage') */ lsi.createDataset('mini-fiches'); function storeMiniFiches(){ console.log('STORING ALL MINI-FICHES'); // {1} Pour chaque formulaire de contact présent // var existingMiniFiches = $$('article.mini-relation-panel .mini-fiche-relation '); for( var i = 0 ; i < existingMiniFiches.length ; i++ ){ // {2} On initialise notre deflater pour récupérer les valeurs // var deflater = new FormDeflater(existingMiniFiches[i], ['input', 'select'], ['data-name']); // {3} On enregistre ce contact si le numéro n'est pas vide et soit pseudo/prénom/nom // var deflated = deflater.deflate(); // TODO: Condition pour que le formulaire soit valide var validForm = true; // Si le formulaire n'est pas valide, on ne l'enregistre pas if( !validForm ) continue; // {4} On récupère les données du LSI si elles existent // var existingData = lsi.get('mini-fiches', 'form'+deflated.uid.value); console.log('deflated'); console.log(deflated); // Si n'existe pas, on initialise if( existingData === false ){ existingData.username = 'inconnu'; existingData.firstname = 'inconnu'; existingData.lastname = 'inconnu'; } // {5} On récupère et met en forme les valeurs du deflater // var obj = { uid: deflated.uid.value, firstname: existingData.firstname, lastname: existingData.lastname, username: existingData.username, sexe: [ deflated.sexe[0].status, // VRAI SI HOMME deflated.sexe[1].status // VRAI SI FEMME ], age: deflated.age.value, job: deflated.job.value, location: [ deflated.loc[0].status, // VRAI si choix 1 deflated.loc[1].status, // VRAI si choix 2 deflated.loc[2].status, // VRAI si choix 3 deflated.loc[3].status // VRAI si choix 4 ] }; // {6} On enregistre les données dans le 'localStorage' // lsi.set('mini-fiches', 'form'+obj.uid, obj); } // {7} On met à jour le rendu // restoreMiniFiches(); } /* (2) Fonction pour l'ajout d'un contact */ function addNewMiniFiche(firstname, lastname, username, uid, age, sexe, job, location){ // {1} Création physique // miniFicheContainer.innerHTML += miniFicheBuilder.build({ firstname: firstname, lastname: lastname, username: username, uid: uid, age: '', sexe_A: sexe[0] ? 'true' : 'false', sexe_B: sexe[1] ? 'true' : 'false', job: job, loc_A: location[0] ? 'true' : 'false', loc_B: location[1] ? 'true' : 'false', loc_C: location[2] ? 'true' : 'false', loc_D: location[3] ? 'true' : 'false' }); } /* (3) Gestion de l'affichage (et mise à jour) des contacts (depuis 'localStorage') */ function restoreMiniFiches(){ // {1} Pour chaque contact du 'localStorage' // var existingMiniFiches = lsi.keys('mini-fiches'); // On réinitialise le HTML miniFicheContainer.innerHTML = ''; for( var i = 0 ; i < existingMiniFiches.length ; i++ ){ // {2} On récupère les informations du contact // var ficheData = lsi.get('mini-fiches', existingMiniFiches[i]); // {3} On ajoute un contact à la liste // addNewMiniFiche( ficheData.firstname, ficheData.lastname, ficheData.username, ficheData.uid, ficheData.age, ficheData.sexe, ficheData.job, ficheData.location ); } }restoreMiniFiches(); // TODO : Gestion des MINI fiches relation en fonction des contacts /* (1) Fonction pour l'ajout d'une MINI fiche relation */ // 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);