Repository: incubator-ranger Updated Branches: refs/heads/master 80ec0732a -> 78940677b
RANGER-192:Fixed spinning wheel in user detail page when there are many groups Signed-off-by: sneethiraj <[email protected]> Project: http://git-wip-us.apache.org/repos/asf/incubator-ranger/repo Commit: http://git-wip-us.apache.org/repos/asf/incubator-ranger/commit/78940677 Tree: http://git-wip-us.apache.org/repos/asf/incubator-ranger/tree/78940677 Diff: http://git-wip-us.apache.org/repos/asf/incubator-ranger/diff/78940677 Branch: refs/heads/master Commit: 78940677b50dea8565a4d461633e0a05132c1e94 Parents: 80ec073 Author: vperiasamy <[email protected]> Authored: Mon Nov 24 22:52:04 2014 -0500 Committer: sneethiraj <[email protected]> Committed: Wed Dec 3 14:01:46 2014 -0500 ---------------------------------------------------------------------- .../java/com/xasecure/service/XUserService.java | 5 +- .../webapp/scripts/controllers/Controller.js | 11 ++--- .../src/main/webapp/scripts/utils/XAUtils.js | 18 ++++--- .../webapp/scripts/views/common/AddGroup.js | 52 ++++++++++++-------- .../webapp/scripts/views/users/UserCreate.js | 3 +- .../main/webapp/scripts/views/users/UserForm.js | 21 ++------ .../scripts/views/users/UserTableLayout.js | 33 +++++++++++-- security-admin/src/main/webapp/styles/xa.css | 2 + .../webapp/templates/common/AddGroup_tmpl.html | 6 +-- 9 files changed, 89 insertions(+), 62 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/incubator-ranger/blob/78940677/security-admin/src/main/java/com/xasecure/service/XUserService.java ---------------------------------------------------------------------- diff --git a/security-admin/src/main/java/com/xasecure/service/XUserService.java b/security-admin/src/main/java/com/xasecure/service/XUserService.java index 3d8505a..af44969 100644 --- a/security-admin/src/main/java/com/xasecure/service/XUserService.java +++ b/security-admin/src/main/java/com/xasecure/service/XUserService.java @@ -23,6 +23,7 @@ import java.lang.reflect.Field; import java.util.ArrayList; import java.util.HashMap; import java.util.HashSet; +import java.util.LinkedHashSet; import java.util.List; import java.util.Set; @@ -208,8 +209,8 @@ public class XUserService extends XUserServiceBase<XXUser, VXUser> { private void populateGroupList(Long xUserId, VXUser vObj) { List<XXGroupUser> xGroupUserList = daoManager.getXXGroupUser() .findByUserId(xUserId); - Set<Long> groupIdList = new HashSet<Long>(); - Set<String> groupNameList = new HashSet<String>(); + Set<Long> groupIdList = new LinkedHashSet<Long>(); + Set<String> groupNameList = new LinkedHashSet<String>(); if (xGroupUserList != null) { for (XXGroupUser xGroupUser : xGroupUserList) { groupIdList.add(xGroupUser.getParentGroupId()); http://git-wip-us.apache.org/repos/asf/incubator-ranger/blob/78940677/security-admin/src/main/webapp/scripts/controllers/Controller.js ---------------------------------------------------------------------- diff --git a/security-admin/src/main/webapp/scripts/controllers/Controller.js b/security-admin/src/main/webapp/scripts/controllers/Controller.js index 41edd69..8b19533 100644 --- a/security-admin/src/main/webapp/scripts/controllers/Controller.js +++ b/security-admin/src/main/webapp/scripts/controllers/Controller.js @@ -571,19 +571,14 @@ define(function(require) { var view = require('views/users/UserCreate'); var VXUser = require('models/VXUser'); var VXUserList = require('collections/VXUserList'); - var VXGroupList = require('collections/VXGroupList'); - var groupList = new VXGroupList(); var user = new VXUser({id : userId}); user.collection = new VXUserList(); user.fetch({cache : true}).done(function(){ - groupList.fetch({cache : true ,async:false}).done(function(){ - App.rContent.show(new view({ - model : user, - groupList :groupList - })); - }); + App.rContent.show(new view({ + model : user, + })); }); }, groupCreateAction : function(){ http://git-wip-us.apache.org/repos/asf/incubator-ranger/blob/78940677/security-admin/src/main/webapp/scripts/utils/XAUtils.js ---------------------------------------------------------------------- diff --git a/security-admin/src/main/webapp/scripts/utils/XAUtils.js b/security-admin/src/main/webapp/scripts/utils/XAUtils.js index 02cccf4..68b25a7 100644 --- a/security-admin/src/main/webapp/scripts/utils/XAUtils.js +++ b/security-admin/src/main/webapp/scripts/utils/XAUtils.js @@ -318,7 +318,7 @@ define(function(require) { $.msg(options); }; XAUtils.showGroups = function(rawValue){ - var showMoreLess = false; + var showMoreLess = false,id; if(_.isArray(rawValue)) rawValue = new Backbone.Collection(rawValue); if(!_.isUndefined(rawValue) && rawValue.models.length > 0){ @@ -326,20 +326,24 @@ define(function(require) { if(m.has('groupName')) return m.get('groupName') ; }))); - if(groupArr.length > 0) - var resourceId =rawValue.models[0].attributes.resourceId; + if(groupArr.length > 0){ + if(rawValue.first().has('resourceId')) + id = rawValue.first().get('resourceId'); + else + id = rawValue.first().get('userId'); + } var newGroupArr = _.map(groupArr, function(name, i){ if(i >= 4) - return '<span class="label label-info" policy-group-id="'+resourceId+'" style="display:none;">' + name + '</span>'; + return '<span class="label label-info" policy-group-id="'+id+'" style="display:none;">' + name + '</span>'; else if(i == 3 && groupArr.length > 4){ showMoreLess = true; - return '<span class="label label-info" policy-group-id="'+resourceId+'">' + name + '</span>'; + return '<span class="label label-info" policy-group-id="'+id+'">' + name + '</span>'; } else - return '<span class="label label-info" policy-group-id="'+resourceId+'">' + name + '</span>'; + return '<span class="label label-info" policy-group-id="'+id+'">' + name + '</span>'; }); if(showMoreLess){ - newGroupArr.push('<span class="pull-left"><a href="javascript:void(0);" data-id="showMore" class="" policy-group-id="'+resourceId+'"><code style=""> + More..</code></a></span><span class="pull-left" ><a href="javascript:void(0);" data-id="showLess" class="" policy-group-id="'+resourceId+'" style="display:none;"><code> - Less..</code></a></span>'); + newGroupArr.push('<span class="pull-left"><a href="javascript:void(0);" data-id="showMore" class="" policy-group-id="'+id+'"><code style=""> + More..</code></a></span><span class="pull-left" ><a href="javascript:void(0);" data-id="showLess" class="" policy-group-id="'+id+'" style="display:none;"><code> - Less..</code></a></span>'); } return newGroupArr.length ? newGroupArr.join(' ') : '--'; }else http://git-wip-us.apache.org/repos/asf/incubator-ranger/blob/78940677/security-admin/src/main/webapp/scripts/views/common/AddGroup.js ---------------------------------------------------------------------- diff --git a/security-admin/src/main/webapp/scripts/views/common/AddGroup.js b/security-admin/src/main/webapp/scripts/views/common/AddGroup.js index a6a652a..ecee740 100644 --- a/security-admin/src/main/webapp/scripts/views/common/AddGroup.js +++ b/security-admin/src/main/webapp/scripts/views/common/AddGroup.js @@ -62,7 +62,7 @@ define(function(require){ initialize: function(options) { console.log("initialized a AddGroup ItemView"); - _.extend(this, _.pick(options, 'groupList')); + _.extend(this, _.pick(options)); this.bindEvents(); }, @@ -75,9 +75,6 @@ define(function(require){ /** on render callback */ onRender: function() { var that = this , arr =[]; - this.groupArr = this.groupList.map(function(m){ - return { id : m.id+"" , text : m.get('name')}; - }); this.initializePlugins(); $.fn.editable.defaults.mode = 'popover'; @@ -92,7 +89,7 @@ define(function(require){ emptytext : 'Please select', select2 :this.getSelect2Options(), display: function(values,srcDate) { - if(_.isNull(values)){ + if(_.isNull(values) ){ $(this).html(''); return; } @@ -100,23 +97,31 @@ define(function(require){ if(!_.isArray(values)) values=values.toString().split(','); var valArr = []; - var valArr = _.map(values, function(val){ - var obj = _.findWhere(that.groupArr,{id:val}); - return "<span class='label label-inverse'>" + obj.text + "</span>"; - }); + if(!_.isUndefined($(that.el).find('.select2-container-multi')) && $(that.el).find('.select2-container-multi').length > 0){ + values = $(that.el).find('.select2-container-multi').select2('data') + }else{ + var groupNameList = that.model.get('groupNameList'); + values = _.map(that.model.get('groupIdList'),function(id,i){ return {'id': id, 'text': groupNameList[i]};}); + } + valArr = _.map(values,function(val,i){ + return "<span class='label label-inverse'>" + val.text + "</span>" + },that); + that.groupArr = values; + that.firstTimeEditGroup = true; $(this).html(valArr.join(" ")); - if(valArr.length > 0){ + /*if(valArr.length > 0){ that.$('.field-groupIdList').removeClass('error'); that.ui.errorMsg.hide(); }else{ that.$('.field-groupIdList').addClass('error'); that.ui.errorMsg.show(); - } + }*/ }, success: function(response, newValue) { console.log(newValue); + that.firstTimeEditGroup = false; //that.model.set('group',newValue); } @@ -143,22 +148,24 @@ define(function(require){ return false; }, getSelect2Options :function(){ - var that = this; + var that = this,groupCnt = 0; + var tags = _.map(that.model.get('groupIdList'),function(id,i){ return {'id': id, 'text': that.model.get('groupNameList')[i]};}); return{ closeOnSelect : true, placeholder : 'Select Group', // maximumSelectionSize : 1, width :'220px', tokenSeparators: [",", " "], - tags : this.groupArr, + tags : tags, +// multiple: true, initSelection : function (element, callback) { var data = []; - console.log(that.groupList); + if(!_.isUndefined(that.groupArr) && that.firstTimeEditGroup){ + data = that.groupArr; + } + else + data = element.select2('data'); - $(element.val().split(",")).each(function () { - var obj = _.findWhere(that.groupArr,{id:this}); - data.push({id: this, text: obj.text}); - }); callback(data); }, /*createSearchChoice: function(term, data) { @@ -179,6 +186,7 @@ define(function(require){ }, results: function (data, page) { var results = [],selectedVals = []; + groupCnt = data.resultSize if(!_.isEmpty(that.$('.tags').data('editable').input.$input.val())) selectedVals = that.$('.tags').data('editable').input.$input.val().split(','); if(data.resultSize != "0"){ @@ -187,6 +195,7 @@ define(function(require){ if(!_.isEmpty(selectedVals)) results = XAUtil.filterResultByIds(results, selectedVals); // console.log(results.length); + groupCnt = results.length; return {results : results}; // } // results = [{id : (data.vXGroups.id)+"", text: data.vXGroups.name}]; @@ -202,7 +211,10 @@ define(function(require){ return result.text; }, formatNoMatches: function(result){ - return 'No group found.'; + if(groupCnt > 0) + return 'Please enter one more character.' + else + return 'No group found.'; } }; }, @@ -223,4 +235,4 @@ define(function(require){ }); return AddGroup; -}); +}); \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-ranger/blob/78940677/security-admin/src/main/webapp/scripts/views/users/UserCreate.js ---------------------------------------------------------------------- diff --git a/security-admin/src/main/webapp/scripts/views/users/UserCreate.js b/security-admin/src/main/webapp/scripts/views/users/UserCreate.js index 3e53e8d..a37fd88 100644 --- a/security-admin/src/main/webapp/scripts/views/users/UserCreate.js +++ b/security-admin/src/main/webapp/scripts/views/users/UserCreate.js @@ -75,7 +75,7 @@ define(function(require){ initialize: function(options) { console.log("initialized a UserCreate Layout"); - _.extend(this, _.pick(options, 'groupList')); + _.extend(this, _.pick(options)); this.showBasicFields = true; this.editUser = this.model.has('id') ? true : false; this.bindEvents(); @@ -117,7 +117,6 @@ define(function(require){ this.form = new UserForm({ template : require('hbs!tmpl/users/UserForm_tmpl'), model : this.model, - groupList : this.groupList, showBasicFields : this.showBasicFields }); this.rForm.show(this.form); http://git-wip-us.apache.org/repos/asf/incubator-ranger/blob/78940677/security-admin/src/main/webapp/scripts/views/users/UserForm.js ---------------------------------------------------------------------- diff --git a/security-admin/src/main/webapp/scripts/views/users/UserForm.js b/security-admin/src/main/webapp/scripts/views/users/UserForm.js index 7967776..e9126d8 100644 --- a/security-admin/src/main/webapp/scripts/views/users/UserForm.js +++ b/security-admin/src/main/webapp/scripts/views/users/UserForm.js @@ -164,22 +164,11 @@ define(function(require){ }, renderCustomFields: function(){ var that = this; - this.groupList = new VXGroupList(); - var params = {sortBy : 'name'}; - this.groupList.setPageSize(100); - this.groupList.fetch({ - cache : true, - data : params - }).done(function(){ - that.$('[data-customfields="groupIdList"]').html(new AddGroup({ - groupList : that.groupList, - model : that.model - }).render().el); - if(!that.showBasicFields) - that.$('[data-customfields="groupIdList"]').hide(); - }); - - + that.$('[data-customfields="groupIdList"]').html(new AddGroup({ + model : that.model + }).render().el); + if(!that.showBasicFields) + that.$('[data-customfields="groupIdList"]').hide(); }, showCustomFields : function(){ if(!this.showBasicFields){ http://git-wip-us.apache.org/repos/asf/incubator-ranger/blob/78940677/security-admin/src/main/webapp/scripts/views/users/UserTableLayout.js ---------------------------------------------------------------------- diff --git a/security-admin/src/main/webapp/scripts/views/users/UserTableLayout.js b/security-admin/src/main/webapp/scripts/views/users/UserTableLayout.js index 0dfd571..e1f8e70 100644 --- a/security-admin/src/main/webapp/scripts/views/users/UserTableLayout.js +++ b/security-admin/src/main/webapp/scripts/views/users/UserTableLayout.js @@ -54,14 +54,17 @@ define(function(require){ tab : '.nav-tabs', addNewUser : '[data-id="addNewUser"]', addNewGroup : '[data-id="addNewGroup"]', - visualSearch: '.visual_search' + visualSearch: '.visual_search', + btnShowMore : '[data-id="showMore"]', + btnShowLess : '[data-id="showLess"]', }, /** ui events hash */ events: function() { var events = {}; events['click '+this.ui.tab+' li a'] = 'onTabChange'; - //events['change ' + this.ui.input] = 'onInputChange'; + events['click ' + this.ui.btnShowMore] = 'onShowMore'; + events['click ' + this.ui.btnShowLess] = 'onShowLess'; return events; }, @@ -252,6 +255,17 @@ define(function(require){ cell : Backgrid.HtmlCell.extend({className: 'cellWidth-1'}), label : localization.tt("lbl.groups"), formatter: _.extend({}, Backgrid.CellFormatter.prototype, { + fromRaw: function (rawValue,model) { + if(!_.isUndefined(rawValue)){ + return XAUtil.showGroups(_.map(rawValue,function(name){return {'userId': model.id,'groupName': name}})); + } + else + return '--'; + } + }), + /*cell : Backgrid.HtmlCell.extend({className: 'cellWidth-1'}), + label : localization.tt("lbl.groups"), + formatter: _.extend({}, Backgrid.CellFormatter.prototype, { fromRaw: function (rawValue) { var html = ''; if(!_.isUndefined(rawValue)){ @@ -262,7 +276,7 @@ define(function(require){ }else return '--'; } - }), + }),*/ editable : false, sortable : false }, @@ -457,7 +471,18 @@ define(function(require){ }; XAUtil.addVisualSearch(searchOpt,serverAttrName, coll,pluginAttr); }, - + onShowMore : function(e){ + var id = $(e.currentTarget).attr('policy-group-id'); + this.rTableList.$el.find('[policy-group-id="'+id+'"]').show(); + $('[data-id="showLess"][policy-group-id="'+id+'"]').show(); + $('[data-id="showMore"][policy-group-id="'+id+'"]').hide(); + }, + onShowLess : function(e){ + var id = $(e.currentTarget).attr('policy-group-id'); + this.rTableList.$el.find('[policy-group-id="'+id+'"]').slice(4).hide(); + $('[data-id="showLess"][policy-group-id="'+id+'"]').hide(); + $('[data-id="showMore"][policy-group-id="'+id+'"]').show(); + }, /** all post render plugin initialization */ initializePlugins: function(){ }, http://git-wip-us.apache.org/repos/asf/incubator-ranger/blob/78940677/security-admin/src/main/webapp/styles/xa.css ---------------------------------------------------------------------- diff --git a/security-admin/src/main/webapp/styles/xa.css b/security-admin/src/main/webapp/styles/xa.css index b33c4a3..88d2928 100644 --- a/security-admin/src/main/webapp/styles/xa.css +++ b/security-admin/src/main/webapp/styles/xa.css @@ -1031,6 +1031,8 @@ ul.tabs > li > a { } .controls-row .tags { width: 225px; + max-height: 180px; + overflow-y: auto; } .controls-row .link-tag { http://git-wip-us.apache.org/repos/asf/incubator-ranger/blob/78940677/security-admin/src/main/webapp/templates/common/AddGroup_tmpl.html ---------------------------------------------------------------------- diff --git a/security-admin/src/main/webapp/templates/common/AddGroup_tmpl.html b/security-admin/src/main/webapp/templates/common/AddGroup_tmpl.html index 04fc364..698d502 100644 --- a/security-admin/src/main/webapp/templates/common/AddGroup_tmpl.html +++ b/security-admin/src/main/webapp/templates/common/AddGroup_tmpl.html @@ -17,10 +17,10 @@ <div class="control-group field-groupIdList"> <label class="control-label" for="c13_group">Group *</label> <div class="controls controls-row"> - <span class="tags" id="tags-editable-1" data-toggle="manual" data-type="select2" + <div class="tags" id="tags-editable-1" data-toggle="manual" data-type="select2" data-value="{{groupId}}" data-original-title="Enter Group Name"> - </span> - <a href="#" id="tags-edit-1" data-editable="tags-editable-1" class="link-tag" style="margin-left:-37px;"> + </div> + <a href="#" id="tags-edit-1" data-editable="tags-editable-1" class="link-tag" > {{#if isModelNew}} <i class="icon-plus" title="Add"></i> {{else}}
