[Done] Dropdown to add groups to view:users/view"
[Done] Dropdown to add groups to view:machines/view
This commit is contained in:
xdrm-brackets
parent
59beb64eea
commit
11ece5b52f
|
|
@ -11,6 +11,7 @@
|
|||
<span class='groups'>
|
||||
{{ p_icon.group | raw }}
|
||||
|
||||
<span class='ignore'>
|
||||
{% for cluster in f_clusters(machine.id_machine) %}
|
||||
<span>
|
||||
{{ cluster.name }}
|
||||
|
|
@ -19,6 +20,9 @@
|
|||
{% endfor %}
|
||||
</span>
|
||||
|
||||
<span class='add-group' data-machine='{{ machine.id_machine }}'>+</span>
|
||||
</span>
|
||||
|
||||
</article>
|
||||
|
||||
{# if no result #}
|
||||
|
|
|
|||
|
|
@ -25,15 +25,19 @@
|
|||
<span class='groups'>
|
||||
{{ p_icon.group | raw }}
|
||||
|
||||
<span class='ignore'>
|
||||
{% for cluster in f_clusters(user.id_user) %}
|
||||
|
||||
|
||||
<span>
|
||||
{{ cluster.name }}
|
||||
<span class='rem-group' data-group='{{ cluster.id_cluster }}' data-user='{{ user.id_user }}'></span>
|
||||
<span class='rem-group' data-group='{{ cluster.id_user_cluster }}' data-user='{{ user.id_user }}'></span>
|
||||
</span>
|
||||
|
||||
{% endfor %}
|
||||
</span>
|
||||
|
||||
<span class='add-group' data-user='{{ user.id_user }}'>+</span>
|
||||
|
||||
</span>
|
||||
|
||||
|
|
|
|||
|
|
@ -111,9 +111,7 @@ if( section.view.element != null ){
|
|||
}
|
||||
|
||||
/* (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){
|
||||
section.view.group.remfunc = function(e){
|
||||
// {1} On rédige la requête //
|
||||
var request = {
|
||||
path: 'machineDefault/unlink',
|
||||
|
|
@ -133,11 +131,136 @@ if( section.view.element != null ){
|
|||
e.target.parentNode.parentNode.removeChild( e.target.parentNode );
|
||||
});
|
||||
|
||||
}, false);
|
||||
};
|
||||
|
||||
|
||||
for( var i = 0 ; i < section.view.group.rem.length ; i++ )
|
||||
section.view.group.rem[i].addEventListener('click', section.view.group.remfunc, false);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* (6) On gere la "modification" (ajout) des groupes */
|
||||
for( var i = 0 ; i < section.view.group.add.length ; i++ ){
|
||||
|
||||
section.view.group.add[i].addEventListener('mouseup', function(e){
|
||||
|
||||
/* (1) Check if already opened */
|
||||
var opened = e.target.innerHTML != '+';
|
||||
|
||||
/* (2) Hide all dropdowns */
|
||||
for( j = 0 ; j < section.view.group.add.length ; j++ )
|
||||
section.view.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('machine')) )
|
||||
return;
|
||||
|
||||
var machine_id = parseInt(e.target.getData('machine'));
|
||||
|
||||
/* (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('group') );
|
||||
|
||||
/* (3) Call list of members */
|
||||
api.send({path: 'clusterDefault/getAll', class: 1}, function(response){
|
||||
|
||||
// Manage error
|
||||
if( response.error != 0 ){
|
||||
console.warn('error loading list of members');
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
// remove already members
|
||||
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_cluster) > -1 )
|
||||
continue;
|
||||
|
||||
dropdown += "<span data-groupid='"+members[j].id_machine_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 groupid = e2.target.getData('groupid');
|
||||
var groupname = e2.target.innerHTML;
|
||||
|
||||
// manage error
|
||||
if( groupid === false )
|
||||
return;
|
||||
|
||||
// {2} Request : add member to group //
|
||||
var request = {
|
||||
path: 'machineDefault/link',
|
||||
id_machine: machine_id,
|
||||
id_cluster: groupid
|
||||
};
|
||||
|
||||
|
||||
// {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-group');
|
||||
newMemberRemoveIcon.setAttribute('data-group', groupid);
|
||||
newMemberRemoveIcon.setAttribute('data-machine', e.target.getData('machine'));
|
||||
|
||||
newMemberRemoveIcon.addEventListener('click', section.view.group.remfunc, false);
|
||||
|
||||
var newMember = document.createElement('span');
|
||||
newMember.appendChild( document.createTextNode(groupname) );
|
||||
newMember.appendChild(newMemberRemoveIcon);
|
||||
|
||||
e.target.parentNode.children[1].appendChild(newMember);
|
||||
|
||||
|
||||
});
|
||||
|
||||
}, false);
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
}, false);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -119,9 +119,7 @@ if( section.view.element != null ){
|
|||
}
|
||||
|
||||
/* (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){
|
||||
section.view.group.remfunc = function(e){
|
||||
// {1} On rédige la requête //
|
||||
var request = {
|
||||
path: 'userDefault/unlink',
|
||||
|
|
@ -140,12 +138,137 @@ if( section.view.element != null ){
|
|||
// {4} Si tout s'est bien passé //
|
||||
e.target.parentNode.parentNode.removeChild( e.target.parentNode );
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
for( var i = 0 ; i < section.view.group.rem.length ; i++ )
|
||||
section.view.group.rem[i].addEventListener('click', section.view.group.remfunc, false);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* (6) On gere la "modification" (ajout) des groupes */
|
||||
for( var i = 0 ; i < section.view.group.add.length ; i++ ){
|
||||
|
||||
section.view.group.add[i].addEventListener('mouseup', function(e){
|
||||
|
||||
/* (1) Check if already opened */
|
||||
var opened = e.target.innerHTML != '+';
|
||||
|
||||
/* (2) Hide all dropdowns */
|
||||
for( j = 0 ; j < section.view.group.add.length ; j++ )
|
||||
section.view.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('user')) )
|
||||
return;
|
||||
|
||||
var user_id = parseInt(e.target.getData('user'));
|
||||
|
||||
/* (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('group') );
|
||||
|
||||
/* (3) Call list of 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 members
|
||||
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_user_cluster) > -1 )
|
||||
continue;
|
||||
|
||||
dropdown += "<span data-groupid='"+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 groupid = e2.target.getData('groupid');
|
||||
var groupname = e2.target.innerHTML;
|
||||
|
||||
// manage error
|
||||
if( groupid === false )
|
||||
return;
|
||||
|
||||
// {2} Request : add member to group //
|
||||
var request = {
|
||||
path: 'userDefault/link',
|
||||
id_user: user_id,
|
||||
id_cluster: groupid
|
||||
};
|
||||
|
||||
|
||||
// {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-group');
|
||||
newMemberRemoveIcon.setAttribute('data-group', groupid);
|
||||
newMemberRemoveIcon.setAttribute('data-user', e.target.getData('user'));
|
||||
|
||||
newMemberRemoveIcon.addEventListener('click', section.view.group.remfunc, false);
|
||||
|
||||
var newMember = document.createElement('span');
|
||||
newMember.appendChild( document.createTextNode(groupname) );
|
||||
newMember.appendChild(newMemberRemoveIcon);
|
||||
|
||||
e.target.parentNode.children[1].appendChild(newMember);
|
||||
|
||||
|
||||
});
|
||||
|
||||
}, false);
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
}, false);
|
||||
|
||||
}
|
||||
|
||||
|
||||
};
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue