Apache
/
archiva
mirror of https://github.com/apache/archiva.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

assigned/unassigned user(s) to a role: double multiselect view 

git-svn-id: https://svn.apache.org/repos/asf/archiva/trunk@1227080 13f79535-47bb-0310-9956-ffa450edef68
This commit is contained in:
Olivier Lamy 2012-01-04 08:50:10 +00:00
parent 1ddbb6ca58
commit 10008c81a8
4 changed files with 101 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/css/archiva.css
View File

@ -21,3 +21,24 @@
#medium-spinner { #medium-spinner {
z-index: 20001; z-index: 20001;
} }
.ar-multiselect .ar-multiselect-column {
float: left;
width: 17em;
}
.ar-multiselect .ar-multiselect-center {
float: left;
width: 3em;
}
.ar-multiselect-center ul {
list-style: none;
margin: 3px 0 2px 6px
}
.ar-multiselect-right {
margin-left: 2em
}

31
archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/index.html
View File

@ -1,9 +1,11 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<link rel="stylesheet" href="css/jquery-ui-1.8.16.custom.css"/>
<link rel="stylesheet" href="css/bootstrap.min.1.4.0.css"> <link rel="stylesheet" href="css/bootstrap.min.1.4.0.css">
<link rel="stylesheet" href="css/archiva.css"> <link rel="stylesheet" href="css/archiva.css">
<script type="text/javascript" src="js/jquery-1.7.js"></script> <script type="text/javascript" src="js/jquery-1.7.js"></script>
<script type="text/javascript" src="js/lab.js"></script> <script type="text/javascript" src="js/lab.js"></script>
@ -22,7 +24,34 @@
<div class="content"> <div class="content">
<div id="user-messages"></div> <div id="user-messages"></div>
<div id="main-content"></div> <div id="main-content">
<div id="role-edit-users" class="clearfix ar-multiselect" style="float: left">
<div class="ar-multiselect-column ar-multiselect-left">
<select id="role-edit-available-users" class="" multiple="true">
<option value="">admin</option>
</select>
</div>
<div class="ar-multiselect-column ar-multiselect-center">
<ul>
<li>
<button class="btn">&gt;</button>
</li>
<li>
<button class="btn">&lt;</button>
</li>
</ul>
</div>
<div class="ar-multiselect-column ar-multiselect-right">
<select id="role-edit-affected-users" class="" multiple="true">
<option value="">admin</option>
</select>
</div>
</div>
</div>
</div>
</div> </div>
</div> </div>

52
archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/redback/roles.js
View File

@ -18,7 +18,7 @@
*/ */
$(function() { $(function() {
role = function(name,description,assignable,childRoleNames,parentRoleNames,users,parentsRolesUsers,permissions){ role = function(name,description,assignable,childRoleNames,parentRoleNames,users,parentsRolesUsers,permissions,otherUsers){
this.name = ko.observable(name); this.name = ko.observable(name);
this.description = ko.observable(description); this.description = ko.observable(description);
this.assignable = ko.observable(assignable); this.assignable = ko.observable(assignable);
@ -27,6 +27,8 @@ $(function() {
this.users = ko.observableArray(users); this.users = ko.observableArray(users);
this.parentsRolesUsers = ko.observableArray(parentsRolesUsers);//read only this.parentsRolesUsers = ko.observableArray(parentsRolesUsers);//read only
this.permissions = ko.observableArray(permissions);//read only this.permissions = ko.observableArray(permissions);//read only
// when editing a role other users not assign to this role are populated
this.otherUsers = ko.observableArray(otherUsers);
this.updateDescription=function(){ this.updateDescription=function(){
var url = "restServices/redbackServices/roleManagementService/updateRoleDescription?"; var url = "restServices/redbackServices/roleManagementService/updateRoleDescription?";
@ -54,6 +56,7 @@ $(function() {
*/ */
RolesViewModel=function() { RolesViewModel=function() {
this.roles = ko.observableArray([]); this.roles = ko.observableArray([]);
var self = this; var self = this;
this.loadRoles = function() { this.loadRoles = function() {
$.ajax("restServices/redbackServices/roleManagementService/allRoles", { $.ajax("restServices/redbackServices/roleManagementService/allRoles", {
@ -96,22 +99,17 @@ $(function() {
dataType: 'json', dataType: 'json',
success: function(data) { success: function(data) {
var mappedRole = mapRole(data.role); var mappedRole = mapRole(data.role);
$("#main-content #roles-view-tabs-content #role-edit").attr("data-bind",'template: {name:"editRoleTab",data: role}'); $("#main-content #roles-view-tabs-content #role-edit").attr("data-bind",'template: {name:"editRoleTab",data: currentRole}');
role.parentRoleNames=mappedRole.parentRoleNames; role.parentRoleNames=mappedRole.parentRoleNames;
role.parentsRolesUsers=mappedRole.parentsRolesUsers; role.parentsRolesUsers=mappedRole.parentsRolesUsers;
role.users=mappedRole.users; role.users=mappedRole.users;
var viewModel = new roleViewModel(role); role.otherUsers=mappedRole.otherUsers;
var viewModel = new RoleViewModel(role);
ko.applyBindings(viewModel,$("#main-content #roles-view-tabs-content #role-edit").get(0)); ko.applyBindings(viewModel,$("#main-content #roles-view-tabs-content #role-edit").get(0));
activateRoleEditTab(); activateRoleEditTab();
} }
} }
); );
}
this.saveRoleDescription=function(role){
$.log("saveRoleDescription:"+role.description);
} }
} }
@ -130,16 +128,30 @@ $(function() {
removeMediumSpinnerImg(); removeMediumSpinnerImg();
} }
saveRoleDescription=function(){ RoleViewModel=function(role){
var roleName = $("#editRoleTable #role-edit-name").html(); selectedOtherUsers=new ko.observableArray();
var description = $("#editRoleTable #role-edit-description").val(); selectedUsers=new ko.observableArray();
clearUserMessages(); currentRole=role;
new role(roleName,description).updateDescription(); var self=this;
addUser=function(){
var removed = currentRole.otherUsers.removeAll(selectedOtherUsers());
for (var i = 0; i < removed.length; i++) {
currentRole.users.push(removed[i]);
}
selectedOtherUsers([]);
} }
roleViewModel=function(role){ removeUser=function(){
this.role=role; var added = currentRole.users.removeAll(selectedUsers());
for (var i = 0; i < added.length; i++) {
currentRole.otherUsers.push(added[i]);
}
selectedUsers([]);
}
saveRoleDescription=function(){
$.log("saveRoleDescription:"+currentRole.description());
currentRole.updateDescription();
}
} }
/** /**
@ -164,7 +176,11 @@ $(function() {
return mapPermission(item); return mapPermission(item);
}): new Array(mapPermission(data.permissions)) :null; }): new Array(mapPermission(data.permissions)) :null;
return new role(data.name, data.description?data.description:"",data.assignable,childRoleNames,parentRoleNames,users,parentsRolesUsers,permissions); var otherUsers = data.otherUsers ? $.isArray(data.otherUsers)? $.map(data.otherUsers, function(item) {
return mapUser(item);
}):new Array(mapUser(data.otherUsers)):null;
return new role(data.name, data.description?data.description:"",data.assignable,childRoleNames,parentRoleNames,users,parentsRolesUsers,permissions,otherUsers);
} }
activateRolesGridTab=function(){ activateRolesGridTab=function(){

15
archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/redback/templates/roles-tmpl.html
View File

@ -130,6 +130,21 @@
${$.i18n.prop('role.edit.no.user.defined')} ${$.i18n.prop('role.edit.no.user.defined')}
{{/if}} {{/if}}
<div id="role-edit-users" class="clearfix ar-multiselect">
<div class="ar-multiselect-column ar-multiselect-left">
<select data-bind="options: otherUsers ,optionsText: 'username',selectedOptions:selectedOtherUsers" multiple="true" id="role-edit-available-users"></select>
</div>
<div class="ar-multiselect-column ar-multiselect-center">
<ul style="list-style: none">
<li><button class="btn" data-bind="click: addUser">&gt;</button></li>
<li><button class="btn" data-bind="click: removeUser">&lt;</button></li>
</ul>
</div>
<div class="ar-multiselect-column ar-multiselect-right">
<select data-bind="options: users ,optionsText: 'username',selectedOptions:selectedUsers" multiple="true" id="role-edit-affected-users"></select>
</div>
</div>
</script> </script>