SMMP/view/js/users.js

// 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);

}