[Done] Propagate to view:users/group[Done] Propagate to view:machines/group[Todo] Propagate to view:groups/permissions

build/viewer/view/machine/groups.twig

@@ -18,12 +18,15 @@
 		<span class='groups'>
 			{{ p_icon.group | raw }}
 
+			<span class='ignore'>
 				{% for machine in machinelist %}
 					<span>
 						{{ machine.name }}
 						<span class='rem-member' data-member='{{ machine.id_machine }}' data-cluster='{{ cluster.id_machine_cluster }}'></span>
 					</span>
 				{% endfor %}
+			</span>
+			
 			<span class='add-member' data-cluster='{{ cluster.id_machine_cluster }}'>+</span>
 		</span>
 

build/viewer/view/user/groups.twig

@@ -19,6 +19,7 @@
 		<span class='groups'>
 			{{ p_icon.group | raw }}
 
+			<span class='ignore'>
 				{% for user in userlist %}
 
 					<span>
@@ -27,6 +28,7 @@
 					</span>
 
 				{% endfor %}
+			</span>
 
 			<span class='add-member' data-cluster='{{ cluster.id_user_cluster }}'>+</span>
 		</span>

public_html/view/js/groups.js

@@ -158,6 +158,8 @@ if( section.view.element != null ){
 		section.view.group.rem[i].addEventListener('click', section.view.group.remfunc, false);
 
 
+
+
 	/* (7) On gere la "modification" des membres d'un groupe */
 	for( i = 0 ; i < section.view.group.add.length ; i++ ){
 
@@ -198,6 +200,7 @@ if( section.view.element != null ){
 						return;
 					}
 					
+
 					// remove already members
 					var members = (path == 'userDefault/getAll') ? response.users : response.machines;
 
@@ -257,6 +260,9 @@ if( section.view.element != null ){
 								return;
 							}
 
+							// Remove dropdown (in order to be reloaded with new members);
+							e.target.innerHTML = '+';
+
 							// {4} Update display //
 							var newMemberRemoveIcon = document.createElement('span');
 							newMemberRemoveIcon.setAttribute('class', 'rem-member');
@@ -273,17 +279,13 @@ if( section.view.element != null ){
 
 
 						});
+
 					}, false);
+
 				});
 
-
 			}
 
-
-			/* LAST */
-			// pageManager.vars = [ 'members', e.target.getData('cluster') ];
-			// pageManager.refresh();
-
 		}, false);
 
 	}

public_html/view/js/machines.js

@@ -707,9 +707,7 @@ if( section.groups.element != null ){
 	}
 
 	/* (6) On gere la "suppression" d'un groupe */
-	for( i = 0 ; i < section.groups.group.rem.length ; i++ ){
+	section.groups.group.remfunc = function(e){
-
-		section.groups.group.rem[i].addEventListener('click', function(e){
 		// {1} On rédige la requête //
 		var request = {
 			path:       'machineDefault/unlink',
@@ -730,19 +728,132 @@ if( section.groups.element != null ){
 			e.target.parentNode.parentNode.removeChild( e.target.parentNode );
 		});
 
-		}, false);
+	};
+
+
+	for( i = 0 ; i < section.groups.group.rem.length ; i++ )
+		section.groups.group.rem[i].addEventListener('click', section.groups.group.remfunc, false);
+
 
-	}
 
 	/* (7) On gere la "modification" des membres d'un groupe */
 	for( i = 0 ; i < section.groups.group.add.length ; i++ ){
 
-		section.groups.group.add[i].addEventListener('click', function(e){
+		section.groups.group.add[i].addEventListener('mouseup', function(e){
-			pageManager.vars = [ 'members', 'm'+e.target.getData('cluster') ];
+
-			navMenu('groups', true);
+			/* (1) Check if already opened */
+			var opened = e.target.innerHTML != '+';
+
+			/* (2) Hide all dropdowns */
+			for( j = 0 ; j < section.groups.group.add.length ; j++ )
+				section.groups.group.add[j].innerHTML = '+';
+
+			/* (3) Try to show dropdown if not already */
+			if( !opened ){
+
+				/* (1) Get the group id/type */
+				if( !/^\d+$/.test(e.target.getData('cluster')) )
+					return;
+
+				var cluster_id = parseInt(e.target.getData('cluster'));
+
+				/* (2) Get already members ids */
+				var brothers = e.target.parentNode.children[1].children;
+				var already  = []; // will contain already ids
+
+
+				for( j = 0 ; j < brothers.length ; j++ )
+					already += parseInt( brothers[j].children[0].getData('member') );
+
+				/* (3) Call list of members */
+				api.send({path: 'machineDefault/getAll'}, function(response){
+
+					// Manage error
+					if( response.error != 0 ){
+						console.warn('error loading list of members');
+						return;
+					}
+					
+
+					// remove already members
+					var members = response.machines;
+
+
+					/* (4) Build dropdown content without already members */
+					dropdown = "<div class='dropdown'>";
+
+					for( j = 0 ; j < members.length ; j++ ){
+						if( already.indexOf(members[j].id_machine) > -1 )
+							continue;
+
+						dropdown += "<span data-memberid='"+members[j].id_machine+"'>"+members[j].name+"</span>";
+
+					}
+
+					dropdown += "</div>";
+
+					e.target.innerHTML = '+'+dropdown;
+
+
+					/* (5) Attach events to dropdown elements */
+					var dropdownElements = e.target.children[0].children;
+
+					for( j = 0 ; j < dropdownElements.length ; j++ )
+						dropdownElements[j].addEventListener('mousedown', function(e2){
+
+						// {1} Get member id/username //
+						var memberid = e2.target.getData('memberid');
+						var username = e2.target.innerHTML;
+
+						// manage error
+						if( memberid === false )
+							return;
+
+						// {2} Request : add member to group //
+						var request = {
+							path: 'machineDefault/link',
+							id_cluster: cluster_id,
+							id_machine: memberid
+						};
+						
+
+						// {3} Call link //
+						api.send(request, function(response2){
+	
+							// manage error
+							if( response2.error != 0 ){
+								console.warn('cannot link user to group');
+								return;
+							}
+
+							// Remove dropdown (in order to be reloaded with new members);
+							e.target.innerHTML = '+';
+
+							// {4} Update display //
+							var newMemberRemoveIcon = document.createElement('span');
+							newMemberRemoveIcon.setAttribute('class', 'rem-member');
+							newMemberRemoveIcon.setAttribute('data-member', memberid);
+							newMemberRemoveIcon.setAttribute('data-cluster', e.target.getData('cluster'));
+							
+							newMemberRemoveIcon.addEventListener('click', section.groups.group.remfunc, false);
+
+							var newMember = document.createElement('span');
+							newMember.appendChild( document.createTextNode(username) );
+							newMember.appendChild(newMemberRemoveIcon);
+
+							e.target.parentNode.children[1].appendChild(newMember);
+
+
+						});
+
+					}, false);
+
+				});
+
+			}
+
 		}, false);
 
 	}
 
-
 }

public_html/view/js/users.js

@@ -749,9 +749,7 @@ if( section.groups.element != null ){
 	}
 
 	/* (6) On gere la "suppression" d'un groupe */
-	for( i = 0 ; i < section.groups.group.rem.length ; i++ ){
+	section.groups.group.remfunc = function(e){
-
-		section.groups.group.rem[i].addEventListener('click', function(e){
 		// {1} On rédige la requête //
 		var request = {
 			path:       'userDefault/unlink',
@@ -772,19 +770,134 @@ if( section.groups.element != null ){
 			e.target.parentNode.parentNode.removeChild( e.target.parentNode );
 		});
 
-		}, false);
+	};
+
+	for( i = 0 ; i < section.groups.group.rem.length ; i++ )
+		section.groups.group.rem[i].addEventListener('click', section.groups.group.remfunc, false);
+
+
+
+
 
-	}
 
 	/* (7) On gere la "modification" des membres d'un groupe */
 	for( i = 0 ; i < section.groups.group.add.length ; i++ ){
 
-		section.groups.group.add[i].addEventListener('click', function(e){
+		section.groups.group.add[i].addEventListener('mouseup', function(e){
-			pageManager.vars = [ 'members', 'u'+e.target.getData('cluster') ];
+
-			navMenu('groups', true);
+			/* (1) Check if already opened */
+			var opened = e.target.innerHTML != '+';
+
+			/* (2) Hide all dropdowns */
+			for( j = 0 ; j < section.groups.group.add.length ; j++ )
+				section.groups.group.add[j].innerHTML = '+';
+
+			/* (3) Try to show dropdown if not already */
+			if( !opened ){
+
+				/* (1) Get the group id/type */
+				if( !/^\d+$/.test(e.target.getData('cluster')) )
+					return;
+
+				var cluster_id = parseInt(e.target.getData('cluster'));
+
+				/* (2) Get already members ids */
+				var brothers = e.target.parentNode.children[1].children;
+				var already  = []; // will contain already ids
+
+
+				for( j = 0 ; j < brothers.length ; j++ )
+					already += parseInt( brothers[j].children[0].getData('member') );
+
+				/* (3) Call list of members */
+				api.send({path: 'userDefault/getAll'}, function(response){
+
+					// Manage error
+					if( response.error != 0 ){
+						console.warn('error loading list of members');
+						return;
+					}
+					
+
+					// remove already members
+					var members = response.users;
+
+
+					/* (4) Build dropdown content without already members */
+					dropdown = "<div class='dropdown'>";
+
+					for( j = 0 ; j < members.length ; j++ ){
+						if( already.indexOf(members[j].id_user) > -1 )
+							continue;
+
+						dropdown += "<span data-memberid='"+members[j].id_user+"'>"+members[j].username+"</span>";
+
+					}
+
+					dropdown += "</div>";
+
+					e.target.innerHTML = '+'+dropdown;
+
+
+					/* (5) Attach events to dropdown elements */
+					var dropdownElements = e.target.children[0].children;
+
+					for( j = 0 ; j < dropdownElements.length ; j++ )
+						dropdownElements[j].addEventListener('mousedown', function(e2){
+
+						// {1} Get member id/username //
+						var memberid = e2.target.getData('memberid');
+						var username = e2.target.innerHTML;
+
+						// manage error
+						if( memberid === false )
+							return;
+
+						// {2} Request : add member to group //
+						var request = {
+							path: 'userDefault/link',
+							id_cluster: cluster_id,
+							id_user: memberid
+						};
+						
+
+						// {3} Call link //
+						api.send(request, function(response2){
+	
+							// manage error
+							if( response2.error != 0 ){
+								console.warn('cannot link user to group');
+								return;
+							}
+
+							// Remove dropdown (in order to be reloaded with new members);
+							e.target.innerHTML = '+';
+
+							// {4} Update display //
+							var newMemberRemoveIcon = document.createElement('span');
+							newMemberRemoveIcon.setAttribute('class', 'rem-member');
+							newMemberRemoveIcon.setAttribute('data-member', memberid);
+							newMemberRemoveIcon.setAttribute('data-cluster', e.target.getData('cluster'));
+							
+							newMemberRemoveIcon.addEventListener('click', section.groups.group.remfunc, false);
+
+							var newMember = document.createElement('span');
+							newMember.appendChild( document.createTextNode(username) );
+							newMember.appendChild(newMemberRemoveIcon);
+
+							e.target.parentNode.children[1].appendChild(newMember);
+
+
+						});
+
+					}, false);
+
+				});
+
+			}
+
 		}, false);
 
 	}
 
-
 }