- [x] [view/js/machines] Recherche instantanee

todo.md

@@ -7,13 +7,13 @@
 ############
 # EN COURS #
 ############
-- [ ] [view/js/machines] Recherche instantanee
 
 
 
 ########
 # FAIT #
 ########
+- [x] [view/js/machines] Recherche instantanee
 - [x] [container.scss] Gestion de l'affichage responsive
 - [x] [container.scss] Gestion de l'affichage retour a la ligne
 - [x] [container.scss] Gestion de l'affichage info ne depassent plus

view/js/machines.js

@@ -2,7 +2,8 @@
 var section = {
 	view: {
 		text:    '#CONTAINER > section[data-sublink="view"] ',
-		element: document.querySelector('#CONTAINER > section[data-sublink="view"]')
+		element: document.querySelector('#CONTAINER > section[data-sublink="view"]'),
+		searchbar: document.querySelector('#CONTAINER > section[data-sublink="view"] > .searchbar')
 	},
 
 	create: {
@@ -28,13 +29,49 @@ var section = {
 */
 if( section.view.element != null ){
 
-	// On recupere tous les liens
+	/* (1) On recupere tous les liens */
 	section.view.link = {
 		edit:   document.querySelectorAll(section.view.text + '.link_edit[data-machine]'),
 		remove: document.querySelectorAll(section.view.text + '.link_remove[data-machine]')
 	};
 
-	// On gere la "redirection" vers la modification
+
+	/* (2) Gestion de la recherche instantannee */
+	section.view.searchbar.addEventListener('keyup', function(e){
+
+		var search = {
+			path: 'machineDefault/search',
+			data: [section.view.searchbar.value]
+		};
+
+		// On envoie la requete
+		api.send(search, function(result){
+			if( result.ModuleError == 0 ){ // si aucune erreur
+				
+				// On enregistre tous les UID dans un tableau
+				var uid_list = [];
+				for( var i = 0 ; i < result.machines.length ; i++ )
+					uid_list.push( result.machines[i].id_machine);
+
+				// On recupere la liste des elements correspondants aux utilisateurs
+				var machine_list = document.querySelectorAll(section.view.text + '> article.inline-box[id]');
+
+				// Pour chaque machine
+				for( var i = 0 ; i < machine_list.length ; i++ ){
+					// Si doit etre visible
+					if( uid_list.indexOf(machine_list[i].id) > -1 )
+						machine_list[i].remClass('hidden');
+					// Si ne doit pas etre visible
+					else
+						machine_list[i].addClass('hidden');
+				}
+			}
+		});
+
+	}, false);
+
+
+	/* (3) 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){
@@ -45,7 +82,7 @@ if( section.view.element != null ){
 
 	}
 
-	// On gere la "redirection" vers la suppression
+	/* (4) 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){

view/js/users.js

@@ -49,7 +49,8 @@ if( section.view.element != null ){
 
 		// On envoie la requete
 		api.send(search, function(result){
-			if( result.ModuleError == 0 && result.users.length > 0 ){ // si on a trouve qqch
+			console.log(result.users.length);
+			if( result.ModuleError == 0 ){ // si aucune erreur
 				
 				// On enregistre tous les UID dans un tableau
 				var uid_list = [];
@@ -59,8 +60,8 @@ if( section.view.element != null ){
 				// 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++ ){
-					console.log( user_list[i] instanceof Element );
 					// Si doit etre visible
 					if( uid_list.indexOf(user_list[i].id) > -1 )
 						user_list[i].remClass('hidden');

view/machines.php

@@ -78,7 +78,7 @@
 				$clusters = new Repo('machine/getClusters', array($machine['id_machine']));
 				$clusters = $clusters->answer();
 				
-				echo "<article class='inline-box'>";
+				echo "<article class='inline-box' id='".$machine['id_machine']."'>";
 					// Nom de la machine
 					echo "<span class='title'>#".$machine['name']."</span>";