[Done] Propagate to view:groups/permissions

build/viewer/view/group/permission.twig

@@ -24,12 +24,15 @@
 					<span class='icon-permission'></span>
 				</span>
 
+				<span class='ignore'>
 					{% for user_cluster in f_userclusters(machine_cluster.id_machine_cluster,permission.id_permission) %}
 						<span>
 							{{ user_cluster.name }}
 							<span class='rem-permission' data-permission='{{ permission.id_permission }}' data-source='{{ user_cluster.id_user_cluster }}' data-target='{{ machine_cluster.id_machine_cluster }}'></span>
 						</span>
 					{% endfor %}
+				</span>
+
 				<span class='add-permission' data-target='{{ machine_cluster.id_machine_cluster }}' data-permission='{{ permission.id_permission }}'>+</span>
 			</span>
 

public_html/view/js/groups.js

@@ -177,7 +177,7 @@ if( section.view.element != null ){
 
 
 				/* (1) Get the group id/type */
-				if( !/^(u|m)(\d+)$/.test(e.target.parentNode.parentNode.id) )
+				if( !/^(u|m)(\d+)$/.test(e.target.getData('cluster')) )
 					return;
 
 				var cluster_id    = parseInt(RegExp.$2);
@@ -1056,9 +1056,7 @@ if( section.permissions.element != null && !section.permissions.member_view ){
 	var i;
 
 	/* (3) On gere la "suppression" d'une permission */
-	for( i = 0 ; i < section.permissions.group.rem.length ; i++ ){
+	section.permissions.group.remfunc = function(e){
-
-		section.permissions.group.rem[i].addEventListener('click', function(e){
 		// {1} On rédige la requête //
 		var request = {
 			path:       'clusterDefault/remPermission',
@@ -1080,20 +1078,139 @@ if( section.permissions.element != null && !section.permissions.member_view ){
 			e.target.parentNode.parentNode.removeChild( e.target.parentNode );
 		});
 
-		}, false);
+	};
+
+
+
+	for( i = 0 ; i < section.permissions.group.rem.length ; i++ )
+		section.permissions.group.rem[i].addEventListener('click', section.permissions.group.remfunc, false);
+
+
+
+
 
-	}
 
 	/* (4) On gere la "modification" des membres d'une permission d'un groupe */
 	for( i = 0 ; i < section.permissions.group.add.length ; i++ ){
 
-		section.permissions.group.add[i].addEventListener('click', function(e){
+		section.permissions.group.add[i].addEventListener('mouseup', function(e){
-			pageManager.vars = [ 'permissions', 'm'+e.target.getData('target'), 'a'+e.target.getData('permission') ];
+
-			pageManager.refresh();
+			/* (1) Check if already opened */
-		}, false);
+			var opened = e.target.innerHTML != '+';
+
+			/* (2) Hide all dropdowns */
+			for( j = 0 ; j < section.permissions.group.add.length ; j++ )
+				section.permissions.group.add[j].innerHTML = '+';
+
+			/* (3) Try to show dropdown if not already */
+			if( !opened ){
+
+				/* (1) Get the group id/permission */
+				if( !/^\d+$/.test(e.target.getData('target')) || !/^\d+$/.test(e.target.getData('permission')) )
+					return;
+
+				var cluster_id = parseInt(e.target.getData('target'));
+				var permission_id = parseInt(e.target.getData('permission'));
+
+				/* (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('source') );
+
+				/* (3) Call list of user_cluster members */
+				api.send({path: 'clusterDefault/getAll', class: 0}, function(response){
+
+					// Manage error
+					if( response.error != 0 ){
+						console.warn('error loading list of members');
+						return;
+					}
+					
+
+					// remove already authed
+					var members = response.clusters;
+
+
+					/* (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_user_cluster+"'>"+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: 'clusterDefault/addPermission',
+							id_target: cluster_id,
+							id_source: memberid,
+							id_action: permission_id
+						};
+						
+
+						// {3} Call link //
+						api.send(request, function(response2){
+	
+							// manage error
+							if( response2.error != 0 ){
+								console.warn('cannot add permission 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-source', memberid);
+							newMemberRemoveIcon.setAttribute('data-target', e.target.getData('target'));
+							newMemberRemoveIcon.setAttribute('data-permission', e.target.getData('permission'));
+							
+							newMemberRemoveIcon.addEventListener('click', section.permissions.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);
+
+	}
 
 }
 
@@ -1104,7 +1221,7 @@ if( section.permissions.element != null && !section.permissions.member_view ){
 
 
 
-/* GESTION DES PERMISSIONS (MEMBRES)
+/* GESTION DES PERMISSIONS (SELECTION DES MEMBRES)
 *
 */
 if( section.permissions.element != null && section.permissions.member_view ){