// On referencie toutes les sections var section = { view: { text: '#CONTAINER > section[data-sublink="view"] ', element: document.querySelector('#CONTAINER > section[data-sublink="view"]'), searchbar: document.querySelector('#CONTAINER > section[data-sublink="view"] > .searchbar') }, create: { text: '#CONTAINER > section[data-sublink="create"] ', element: document.querySelector('#CONTAINER > section[data-sublink="create"]') }, remove: { text: '#CONTAINER > section[data-sublink="remove"] ', element: document.querySelector('#CONTAINER > section[data-sublink="remove"]') }, edit: { text: '#CONTAINER > section[data-sublink="edit"] ', element: document.querySelector('#CONTAINER > section[data-sublink="edit"]') } }; /* [1] view -> AFFICHAGE DES UTILISATEURS =========================================================*/ if( section.view.element != null ){ /* (0) On gère le zoom sur un utilisateur via URL */ if( pageManager.vars.length > 1 && !isNaN(pageManager.vars[1]) ){ document.location = '#'+pageManager.vars[1]; document.getElementById(pageManager.vars[1]).addClass('selected'); } /* (1) On recupere tous les liens */ section.view.link = { edit: document.querySelectorAll(section.view.text + '.link_edit[data-user]'), remove: document.querySelectorAll(section.view.text + '.link_remove[data-user]') }; /* (2) On récupère toutes les actions de groupes */ section.view.group = { rem: document.querySelectorAll(section.view.text + '.rem-group[data-user][data-group]'), add: document.querySelectorAll(section.view.text + '.add-group[data-user]') }; /* (3) Gestion de la recherche instantannee */ section.view.searchbar.addEventListener('keyup', function(e){ var search = { path: 'userDefault/search', keywords: section.view.searchbar.value }; // On envoie la requete api.send(search, function(result){ if( result.ModuleError != 0 ) return; console.log(result.users.length); if( result.ModuleError == 0 ){ // si aucune erreur // On enregistre tous les UID dans un tableau var uid_list = []; for( var i = 0 ; i < result.users.length ; i++ ) uid_list.push( result.users[i].id_user); // On recupere la liste des elements correspondants aux utilisateurs var user_list = document.querySelectorAll(section.view.text + '> article.inline-box[id]'); // Pour chaque utilisateur for( var i = 0 ; i < user_list.length ; i++ ){ // Si doit etre visible if( uid_list.indexOf(user_list[i].id) > -1 ) user_list[i].remClass('hidden'); // Si ne doit pas etre visible else user_list[i].addClass('hidden'); } } }); }, false); /* (4) On gere la "redirection" vers la modification */ for( var i = 0 ; i < section.view.link.edit.length ; i++ ){ section.view.link.edit[i].addEventListener('click', function(e){ pageManager.vars[1] = e.target.getData('user'); autofill_edit(pageManager.vars[1]); navSubMenu('edit'); }, false); } /* (5) On gere la "redirection" vers la suppression */ for( var i = 0 ; i < section.view.link.remove.length ; i++ ){ section.view.link.remove[i].addEventListener('click', function(e){ pageManager.vars[1] = e.target.getData('user'); autofill_remove(pageManager.vars[1]); navSubMenu('remove'); }, false); } /* (6) On gere la "suppression" d'un groupe */ for( var i = 0 ; i < section.view.group.rem.length ; i++ ){ section.view.group.rem[i].addEventListener('click', function(e){ // {1} On rédige la requête // var request = { path: 'userDefault/unlink', id_user: e.target.getData('user'), id_cluster: e.target.getData('group') }; // {2} On envoie la requête // api.send(request, function(response){ // {3} Si erreur, on ne fait rien // if( response.ModuleError != 0 ) return false; // {4} Si tout s'est bien passé // e.target.parentNode.parentNode.removeChild( e.target.parentNode ); }); }, false); } }; /* [2] create -> Creation d'utilisateur =========================================================*/ if( section.create.element != null ){ // On recupere tous les champs section.create.input = { code: document.querySelector(section.create.text + '#create_code'), username: document.querySelector(section.create.text + '#create_username'), firstname: document.querySelector(section.create.text + '#create_firstname'), lastname: document.querySelector(section.create.text + '#create_lastname'), mail: document.querySelector(section.create.text + '#create_mail'), password: document.querySelector(section.create.text + '#create_password'), status: document.querySelector(section.create.text + '#create_status'), submit: document.querySelector(section.create.text + '#create_submit') } // On initialise le gestionnaire des saisies var createChecker = new inputChecker(); /* (1) Gestion du code RFID */ createChecker.append( section.create.input.code, format_code, '01-AB-CD-23'); section.create.input.code.addEventListener('keyup', function(e){ e.target.value = e.target.value.toUpperCase(); if( !createChecker.check(e.target) ) createChecker.correct(e.target, false); }, false); /* (n) Gestion de l'envoi du formulaire */ section.create.input.submit.addEventListener('click', function(e){ // On annule l'envoi de base (PHP) e.preventDefault(); var request = { path: 'userDefault/create', // On veut creer un utilisateur code: section.create.input.code.value, username: section.create.input.username.value, firstname: section.create.input.firstname.value, lastname: section.create.input.lastname.value, mail: section.create.input.mail.value, password: section.create.input.password.value, status: section.create.input.status.value }; api.send(request, function(answer){ if( answer.ModuleError == 0 ){ // Tout s'est bien deroule console.log('Utilisateur cree!'); section.create.input.submit.anim('active', 1500); }else // Erreur console.error('ModuleError::'+answer.ModuleError); }); }, false); } /* [3] remove -> Suppression d'utilisateur =========================================================*/ if( section.remove.element != null ){ /* (1) Definition des champs */ section.remove.input = { search: { view: document.querySelector(section.remove.text + '.remove_search_view'), num: document.querySelector(section.remove.text + '.remove_search_num'), sum: document.querySelector(section.remove.text + '.remove_search_sum'), keyword: document.querySelector(section.remove.text + '#remove_search_keyword'), id: document.querySelector(section.remove.text + '#remove_search_id'), submit: document.querySelector(section.remove.text + '#remove_search_submit') }, code: document.querySelector(section.remove.text + '#remove_code'), username: document.querySelector(section.remove.text + '#remove_username'), submit: document.querySelector(section.remove.text + '#remove_submit') }; var lastkeywords_remove = ''; var found_remove = []; var searchindex_remove = 0; /* (2) Gestion de l'auto-remplissage par lien ---------------------------------------------------------*/ function autofill_remove(){ /* (0) Valeurs par défaut */ var user_data = { id_user: '', username: '', code: '', disable_input: true }; // {1} Si aucun résultat // if( found_remove[searchindex_remove] == null ){ // Mise a jour des indices des resultats section.remove.input.search.num.innerHTML = 0; searchindex_remove = 0; // {2} Si au moins 1 résultat // }else{ // On recupere les données de la user selectionnee user_data = { id_user: found_remove[searchindex_remove]['id_user'], username: found_remove[searchindex_remove]['username'], code: found_remove[searchindex_remove]['code'], disable_input: false }; // Mise a jour des indices des resultats section.remove.input.search.num.innerHTML = searchindex_remove+1; } // {3} On auto-remplit le formulaire // // On enregistre l'UID de la user section.remove.input.search.id.value = user_data.id_user; // Auto-remplissage du formulaire section.remove.input.username.value = user_data.username; section.remove.input.code.value = user_data.code; // On gere le caractere "inactif" du submit section.remove.input.submit.disabled = user_data.disable_input; } // Gestion automatique au chargement de la page si ID_MACHINE dans url "/users/remove/:id_user:" if( pageManager.vars.length >= 2 && !isNaN(pageManager.vars[1]) ){ // On récupère la user d'uid donné dans l'URL api.send({path:'userDefault/getById', id_user:pageManager.vars[1]}, function(response){ // Si aucune erreur et un résultat if( response.ModuleError == 0 ){ found_remove = [ response.user ]; // On récupère le résultat searchindex_remove = 0; // On remet le compteur à 0 autofill_remove(); // On auto-remplit } }); } /* (3) Gestion de la recherche ---------------------------------------------------------*/ section.remove.input.search.submit.addEventListener('click', function(e){ // On annule l'envoi de base (PHP) e.preventDefault(); /* (1) Si le champ n'est pas vide */ if( section.remove.input.search.keyword.value != '' ){ /* (2) Si même mots-clés, on passe au prochain résultat */ if( section.remove.input.search.keyword.value == lastkeywords_remove ){ // on affiche le prochain (decalage cyclique) searchindex_remove = (searchindex_remove+1) % found_remove.length; // On met à jour l'auto-remplissage autofill_remove(); /* (3) Nouveaux mots-clés, on lance la recherche */ }else{ /* (4) Redaction de la requete */ var getUsers = { path: 'userDefault/search', keywords: section.remove.input.search.keyword.value }; /* (5) On envoie la requête */ api.send(getUsers, function(getUsersResponse){ if( getUsersResponse.ModuleError == 0 ){ // si pas d'erreur // On notifie que la recherche est terminée section.remove.input.search.submit.anim('active', 1000); /* (6) On met à jour les données des users, et le compteur */ searchindex_remove = 0; found_remove = getUsersResponse.users; section.remove.input.search.sum.innerHTML = found_remove.length; // On met à jour l'auto-remplissage autofill_remove(); } // On met à jour la dernière recherche lastkeywords_remove = getUsers.keywords; }); } } }, false); /* (n) Gestion de l'envoi du formulaire */ section.remove.input.submit.addEventListener('click', function(e){ // On annule l'envoi de base (PHP) e.preventDefault(); // Si l'id est defini if( section.remove.input.search.id.value != '' ){ /* (2) On supprime l'utilisateur */ var request = { path: 'userDefault/delete', // On veut supprimer cet utilisateur id_user: section.remove.input.search.id.value }; api.send(request, function(answer){ if( answer.ModuleError == 0 && answer.status == true ){ // Tout s'est bien deroule console.log('Utilisateur supprime!'); section.remove.input.submit.anim('active', 1500); // On vide le formulaire autofill_remove(null); }else // Erreur console.error('ModuleError::'+answer.ModuleError); }); } }, false); } /* [4] edit -> Modification d'utilisateur =========================================================*/ if( section.edit.element != null ){ // Definition des champs section.edit.input = { search: { view: document.querySelector(section.edit.text + '.edit_search_view'), num: document.querySelector(section.edit.text + '.edit_search_num'), sum: document.querySelector(section.edit.text + '.edit_search_sum'), keyword: document.querySelector(section.edit.text + '#edit_search_keyword'), id: document.querySelector(section.edit.text + '#edit_search_id'), submit: document.querySelector(section.edit.text + '#edit_search_submit') }, code: document.querySelector(section.edit.text + '#edit_code'), username: document.querySelector(section.edit.text + '#edit_username'), firstname: document.querySelector(section.edit.text + '#edit_firstname'), lastname: document.querySelector(section.edit.text + '#edit_lastname'), mail: document.querySelector(section.edit.text + '#edit_mail'), password: document.querySelector(section.edit.text + '#edit_password'), submit: document.querySelector(section.edit.text + '#edit_submit') }; var lastkeywords_edit = ''; var found_edit = []; var searchindex_edit = 0; /* (2) Gestion de l'auto-remplissage par lien ---------------------------------------------------------*/ function autofill_edit(){ /* (0) Valeurs par défaut */ var user_data = { id_user: '', code: '', username: '', firstname: '', lastname: '', mail: '', disable_input: true }; // {1} Si aucun résultat // if( found_edit[searchindex_edit] == null ){ // Mise a jour des indices des resultats section.edit.input.search.num.innerHTML = 0; searchindex_edit = 0; // {2} Si au moins 1 résultat // }else{ // On recupere les données de la user selectionnee user_data = { id_user: found_edit[searchindex_edit]['id_user'], code: found_edit[searchindex_edit]['code'], username: found_edit[searchindex_edit]['username'], firstname: found_edit[searchindex_edit]['firstname'], lastname: found_edit[searchindex_edit]['lastname'], mail: found_edit[searchindex_edit]['mail'], disable_input: false }; // Mise a jour des indices des resultats section.edit.input.search.num.innerHTML = searchindex_edit+1; } // {3} On auto-remplit le formulaire // // On enregistre l'UID de la user section.edit.input.search.id.value = user_data.id_user; // Auto-remplissage du formulaire section.edit.input.code.value = user_data.code; section.edit.input.username.value = user_data.username; section.edit.input.firstname.value = user_data.firstname; section.edit.input.lastname.value = user_data.lastname; section.edit.input.mail.value = user_data.mail; // On gere le caractere "inactif" du submit section.edit.input.submit.disabled = user_data.disable_input; } // Gestion automatique au chargement de la page si ID_MACHINE dans url "/users/edit/:id_user:" if( pageManager.vars.length >= 2 && !isNaN(pageManager.vars[1]) ){ // On récupère la user d'uid donné dans l'URL api.send({path:'userDefault/getById', id_user:pageManager.vars[1]}, function(response){ // Si aucune erreur et un résultat if( response.ModuleError == 0 ){ found_edit = [ response.user ]; // On récupère le résultat searchindex_edit = 0; // On remet le compteur à 0 autofill_edit(); // On auto-remplit } }); } /* (3) Gestion de la recherche ---------------------------------------------------------*/ section.edit.input.search.submit.addEventListener('click', function(e){ // On annule l'envoi de base (PHP) e.preventDefault(); /* (1) Si le champ n'est pas vide */ if( section.edit.input.search.keyword.value != '' ){ /* (2) Si même mots-clés, on passe au prochain résultat */ if( section.edit.input.search.keyword.value == lastkeywords_edit ){ // on affiche le prochain (decalage cyclique) searchindex_edit = (searchindex_edit+1) % found_edit.length; // On met à jour l'auto-remplissage autofill_edit(); /* (3) Nouveaux mots-clés, on lance la recherche */ }else{ /* (4) Redaction de la requete */ var getUsers = { path: 'userDefault/search', keywords: section.edit.input.search.keyword.value }; /* (5) On envoie la requête */ api.send(getUsers, function(getUsersResponse){ if( getUsersResponse.ModuleError == 0 ){ // si pas d'erreur // On notifie que la recherche est terminée section.edit.input.search.submit.anim('active', 1000); /* (6) On met à jour les données des users, et le compteur */ searchindex_edit = 0; found_edit = getUsersResponse.users; section.edit.input.search.sum.innerHTML = found_edit.length; // On met à jour l'auto-remplissage autofill_edit(); } // On met à jour la dernière recherche lastkeywords_edit = getUsers.keywords; }); } } }, false); /* (n) Gestion de l'envoi du formulaire */ section.edit.input.submit.addEventListener('click', function(e){ // On annule l'envoi de base (PHP) e.preventDefault(); // Si l'id est defini if( section.edit.input.search.id.value != '' ){ var request = { path: 'userDefault/edit', // On veut creer un utilisateur id_user: parseInt(section.edit.input.search.id.value), code: section.edit.input.code.value, username: section.edit.input.username.value, firstname: section.edit.input.firstname.value, lastname: section.edit.input.lastname.value, mail: section.edit.input.mail.value, password: section.edit.input.password.value, status: section.edit.input.status.value }; api.send(request, function(answer){ console.log( answer ); if( answer.ModuleError == 0 && answer.status == true ){ // Tout s'est bien deroule console.log('Utilisateur modifie!'); section.edit.input.submit.anim('active', 1500); // On met a jour l'utilisateur pageManager.vars[1] = request.id_user; navSubMenu('view'); document.location = ''; }else // Erreur console.error('ModuleError::'+answer.ModuleError); }); } }, false); }