ranger-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From omal...@apache.org
Subject [05/44] ARGUS-1. Initial code commit (Selvamohan Neethiraj via omalley)
Date Thu, 14 Aug 2014 20:50:16 GMT
http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/scripts/views/user/UserProfile.js
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/scripts/views/user/UserProfile.js b/security-admin/src/main/webapp/scripts/views/user/UserProfile.js
new file mode 100644
index 0000000..dbcde1f
--- /dev/null
+++ b/security-admin/src/main/webapp/scripts/views/user/UserProfile.js
@@ -0,0 +1,203 @@
+/*
+ * Copyright (c) 2014 XASecure
+ * All rights reserved.
+ *
+ * This software is the confidential and proprietary information of
+ * XASecure. ("Confidential Information").  You shall not
+ * disclose such Confidential Information and shall use it only in
+ * accordance with the terms of the license agreement you entered into
+ * with XASecure.
+ */
+
+define(function(require){
+    'use strict';
+
+	var Backbone		= require('backbone');
+	var Communicator	= require('communicator');
+	var App				= require('App');
+	var XAUtil			= require('utils/XAUtils');
+	var XAEnums			= require('utils/XAEnums');
+	var XALinks 		= require('modules/XALinks');
+	var localization	= require('utils/XALangSupport');
+	var VPasswordChange	= require("models/VXPasswordChange");
+	
+	var UserProfileForm = require('views/user/UserProfileForm');
+	var UserprofileTmpl = require('hbs!tmpl/user/UserProfile_tmpl');
+
+	var UserProfile = Backbone.Marionette.Layout.extend(
+	/** @lends UserProfile */
+	{
+		_viewName : 'UserProfile',
+		
+    	template: UserprofileTmpl,
+        breadCrumbs : [XALinks.get('UserProfile')],
+		/** Layout sub regions */
+    	regions: {
+    		'rForm' :'div[data-id="r_form"]'
+    	},
+
+    	/** ui selector cache */
+    	ui: {
+    		tab 		: '.nav-tabs',
+    		saveBtn 	: 'button[data-id="save"]',
+    		cancelBtn 	: 'button[data-id="cancel"]'
+    	},
+
+		/** ui events hash */
+		events: function() {
+			var events = {};
+			//events['change ' + this.ui.input]  = 'onInputChange';
+			events['click '+this.ui.tab+' li a']  = 'onTabChange';
+			events['click ' + this.ui.saveBtn]  = 'onSave';
+			events['click ' + this.ui.cancelBtn]  = 'onCancel';
+			return events;
+		},
+
+    	/**
+		* intialize a new UserProfile Layout 
+		* @constructs
+		*/
+		initialize: function(options) {
+			console.log("initialized a UserProfile Layout");
+			//_.extend(this, _.pick(options, ''));
+			this.showBasicFields = true;
+			this.bindEvents();
+		},
+
+		/** all events binding here */
+		bindEvents : function(){
+			/*this.listenTo(this.model, "change:foo", this.modelChanged, this);*/
+			/*this.listenTo(communicator.vent,'someView:someEvent', this.someEventHandler, this)'*/
+		},
+
+		/** on render callback */
+		onRender: function() {
+		/*	if(!this.model.isNew()){
+				this.$('[data-tab="edit-password"]').hide();
+				this.$('[data-tab="edit-basic"]').hide();
+			}*/
+			if(!_.isUndefined(this.model.get('userSource')) && this.model.get('userSource') == XAEnums.UserSource.XA_USER.value){
+				this.$('[data-tab="edit-password"]').hide();
+				this.$('[data-tab="edit-basic"]').hide();
+				this.ui.saveBtn.hide();
+			}
+			this.initializePlugins();
+			this.renderForm();
+		},
+		renderForm : function(){
+			this.form = new UserProfileForm({
+				template :require('hbs!tmpl/user/UserProfileForm_tmpl'),
+				model : this.model,
+				showBasicFields : this.showBasicFields
+			});
+			this.rForm.show(this.form);
+		},
+		/** all post render plugin initialization */
+		initializePlugins: function(){
+		},
+		onTabChange : function(e){
+			this.showBasicFields = $(e.currentTarget).parent().data('tab') == 'edit-basic' ? true : false;
+			this.renderForm();
+			this.clearPasswordFields();
+		},
+		onSave : function(){
+			var errors = this.form.commit({validate : false});
+			if(! _.isEmpty(errors)){
+				return;
+			}
+			this.form.afterCommit();
+			if(this.showBasicFields){
+				this.saveUserDetail();
+			}else{
+				this.savePasswordDetail();
+			}
+		},
+		saveUserDetail : function(){
+			this.model.saveUserProfile(this.model,{
+				wait: true,
+				success: function () {
+					XAUtil.notifySuccess('Success', "User profile updated successfully !!");
+					App.appRouter.navigate("#!/policymanager",{trigger: true});
+					Communicator.vent.trigger('ProfileBar:rerender');
+					
+					//console.log("success");
+				},
+				error: function (model, response, options) {
+					if(model.responseJSON != undefined && _.isArray(model.responseJSON.messageList)){
+						if(model.responseJSON.messageList[0].name == "INVALID_INPUT_DATA"){
+							if (model.responseJSON.msgDesc == "Validation failure"){
+								XAUtil.notifyError('Error', "Please try different name.");
+								return;
+							}
+							else{
+								XAUtil.notifyError('Error', model.responseJSON.msgDesc);
+								return;
+							}
+						}
+						
+					}
+					if ( response && response.responseJSON && response.responseJSON.msgDesc){
+						that.form.fields.name.setError(response.responseJSON.msgDesc);
+						XAUtil.notifyError('Error', response.responseJSON.msgDesc);
+					}else
+						XAUtil.notifyError('Error', 'Error occurred while updating user profile!!');
+					//console.log("error");
+				}
+			});
+		},
+		savePasswordDetail : function(){
+			var that = this;
+			var vPasswordChange = new VPasswordChange();
+			vPasswordChange.set({
+				loginId : this.model.get('id'),
+				emailAddress :this.model.get('emailAddress'), 
+				oldPassword : this.model.get('oldPassword'),
+				updPassword : this.model.get('newPassword')
+			});
+			this.model.changePassword(this.model.get('id'),vPasswordChange,{
+				wait: true,
+				success: function () {
+					XAUtil.notifySuccess('Success', "User profile updated successfully !!");
+					App.appRouter.navigate("#!/policymanager",{trigger: true});
+					that.clearPasswordFields();
+					console.log("success");
+					
+				},
+				error: function (msResponse, options) {
+					console.log("error occured during updated user profile: ",msResponse.response);
+					XAUtil.notifyInfo('',localization.tt('msg.myProfileError'));
+					if(localization.tt(msResponse.responseJSON.msgDesc) == "Invalid new password"){
+						that.form.fields.newPassword.setError(localization.tt('validationMessages.newPasswordError'));
+						that.form.fields.reEnterPassword.setError(localization.tt('validationMessages.newPasswordError'));
+					}else if(localization.tt(msResponse.responseJSON.msgDesc) == " You can not use old password. "){
+						that.form.fields.oldPassword.setError(localization.tt('validationMessages.oldPasswordRepeatError'));
+					}	
+					else{
+						that.form.fields.oldPassword.setError(localization.tt('validationMessages.oldPasswordError'));
+						
+					}
+					//that.form.fields.name.setError(response.responseJSON.msgDesc);
+//					XAUtil.notifyError('Error', response.responseJSON.msgDesc);
+					//that.form.fields.newPassword.setError(msResponse.responseJSON.msgDesc)
+//					that.clearPasswordFields();
+					console.log("error");
+				}
+			});
+		}, 
+		clearPasswordFields : function(){
+			this.form.fields.oldPassword.setValue('');
+			this.form.fields.newPassword.setValue('');
+			this.form.fields.reEnterPassword.setValue('');
+		},
+		onCancel : function(){
+//			App.appRouter.navigate("",{trigger: false});
+			window.history.back();
+		},
+		/** on close */
+		onClose: function(){
+		}
+
+	});
+
+	return UserProfile; 
+});

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/scripts/views/user/UserProfileForm.js
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/scripts/views/user/UserProfileForm.js b/security-admin/src/main/webapp/scripts/views/user/UserProfileForm.js
new file mode 100644
index 0000000..933bc35
--- /dev/null
+++ b/security-admin/src/main/webapp/scripts/views/user/UserProfileForm.js
@@ -0,0 +1,145 @@
+/*
+ * Copyright (c) 2014 XASecure
+ * All rights reserved.
+ *
+ * This software is the confidential and proprietary information of
+ * XASecure. ("Confidential Information").  You shall not
+ * disclose such Confidential Information and shall use it only in
+ * accordance with the terms of the license agreement you entered into
+ * with XASecure.
+ */
+
+define(function(require){
+    'use strict';
+
+	var Backbone		= require('backbone');
+
+	var localization	= require('utils/XALangSupport');
+	var XAUtil			= require('utils/XAUtils');
+	var XAEnums			= require('utils/XAEnums');
+    
+	var VPasswordChange	= require("models/VXPasswordChange");
+
+	require('backbone-forms.templates');
+	require('backbone-forms');
+
+	var UserProfileForm = Backbone.Form.extend(
+	/** @lends UserProfileForm */
+	{
+		_viewName : 'UserProfileForm',
+		
+    	/**
+		* intialize a new UserProfileForm Form View 
+		* @constructs
+		*/
+		initialize: function(options) {
+			console.log("initialized a UserProfileForm Form View");
+    		Backbone.Form.prototype.initialize.call(this, options);
+
+			_.extend(this, _.pick(options, 'showBasicFields'));
+			this.initializeCollection();
+			this.bindEvents();
+		},
+		
+		/** all events binding here */
+		bindEvents : function(){
+			this.on('oldPassword:blur', function(form, fieldEditor){
+    			this.evOldPasswordChange(form, fieldEditor);
+    		});
+		},
+		initializeCollection: function(){
+		},
+		
+		/** fields for the form
+		*/
+		schema :function(){
+			var that = this;
+			//var plugginAttr = this.getPlugginAttr(true);
+		},
+
+		/** on render callback */
+		render: function(options) {
+			var that = this;
+			 Backbone.Form.prototype.render.call(this, options);
+			this.initializePlugins();
+			this.showCustomFields();
+			if(!this.model.isNew()){
+				if(this.model.has('userRoleList')){
+					var roleList = this.model.get('userRoleList');
+					if(!_.isUndefined(roleList) && roleList.length > 0){
+						if(XAEnums.UserRoles[roleList[0]].value == XAEnums.UserRoles.ROLE_USER.value)
+							this.fields.userRoleList.setValue(XAEnums.UserRoles.ROLE_USER.value);
+					}
+				}
+				if(!_.isUndefined(this.model.get('userSource')) && this.model.get('userSource') == XAEnums.UserSource.XA_USER.value){
+					this.fields.firstName.editor.$el.attr('disabled',true);
+					this.fields.lastName.editor.$el.attr('disabled',true);
+					this.fields.emailAddress.editor.$el.attr('disabled',true);
+					
+				}
+			}
+		},
+		showCustomFields : function(){
+			if(!this.showBasicFields){
+				this.fields.firstName.$el.hide();
+				this.fields.lastName.$el.hide();
+				this.fields.emailAddress.$el.hide();
+				this.fields.userRoleList.$el.hide();
+				this.fields.firstName.editor.validators.pop();
+//				this.fields.lastName.editor.validators.pop();
+				this.fields.lastName.editor.validators = [];
+			//	this.fields.emailAddress.editor.validators.pop();
+				
+				this.fields.oldPassword.$el.show();
+				this.fields.newPassword.$el.show();
+				this.fields.reEnterPassword.$el.show();
+				this.fields.oldPassword.editor.validators = ['required'];
+				this.fields.newPassword.editor.validators = ['required',{type : 'regexp' ,regexp :/^.*(?=.{8,256})(?=.*\d)(?=.*[a-zA-Z]).*$/, message : localization.tt('validationMessages.newPasswordError')}];
+				this.fields.reEnterPassword.editor.validators = ['required',
+				                                                 {type : 'regexp' ,regexp :/^.*(?=.{8,256})(?=.*\d)(?=.*[a-zA-Z]).*$/, message : localization.tt('validationMessages.newPasswordError')},
+				                                                 { type: 'match', field: 'newPassword', message: 'Passwords must match!' }];
+			}
+		},
+		formValidation : function(){
+		},
+		
+		afterCommit : function(){
+//			this.model.unset('userRoleList');
+			if(this.model.get('userRoleList') == XAEnums.UserRoles.ROLE_SYS_ADMIN.value){
+				this.model.set('userRoleList',["ROLE_SYS_ADMIN"]);
+			}else if(this.model.get('userRoleList') == XAEnums.UserRoles.ROLE_USER.value){
+				this.model.set('userRoleList',["ROLE_USER"]);
+			}
+		},
+		/** all post render plugin initialization */
+		initializePlugins: function(){
+		},
+		evOldPasswordChange : function(form , fieldEditor){
+			var that = this;
+			var vPasswordChange = new VPasswordChange();
+			vPasswordChange.set({
+				loginId : this.model.get('id'),
+				emailAddress :this.model.get('emailAddress'), 
+				oldPassword : that.fields.oldPassword.getValue()
+				//updPassword : this.model.get('newPassword'),
+			});
+			this.model.changePassword(this.model.get('id'),vPasswordChange,{
+				wait: true,
+				success: function () {
+					XAUtil.notifySuccess('Success', "User profile updated successfully !!");
+					console.log("success");
+				},
+				error: function (msResponse, options) {
+					console.log("error occured during updated user profile: "+localization.tt(msResponse.responseJSON.msgDesc));
+					if(!localization.tt(msResponse.responseJSON.msgDesc) == "Invalid new password"){
+						that.fields.oldPassword.setError(localization.tt('validationMessages.oldPasswordError'));
+						XAUtil.notifyInfo('',localization.tt('msg.myProfileError'));
+					}
+				}	
+			});
+		},
+
+	});
+
+	return UserProfileForm;
+});

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/scripts/views/users/GroupCreate.js
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/scripts/views/users/GroupCreate.js b/security-admin/src/main/webapp/scripts/views/users/GroupCreate.js
new file mode 100644
index 0000000..9781441
--- /dev/null
+++ b/security-admin/src/main/webapp/scripts/views/users/GroupCreate.js
@@ -0,0 +1,171 @@
+/*
+ * Copyright (c) 2014 XASecure
+ * All rights reserved.
+ *
+ * This software is the confidential and proprietary information of
+ * XASecure. ("Confidential Information").  You shall not
+ * disclose such Confidential Information and shall use it only in
+ * accordance with the terms of the license agreement you entered into
+ * with XASecure.
+ */
+
+define(function(require){
+    'use strict';
+
+	var Backbone		= require('backbone');
+	var App				= require('App');
+	var XALinks 		= require('modules/XALinks');
+	var XAUtil			= require('utils/XAUtils');
+	var XAEnums			= require('utils/XAEnums');
+	var localization	= require('utils/XALangSupport');
+	
+	var UserTableLayout	= require('views/users/UserTableLayout');
+	var VXGroupList		= require('collections/VXGroupList');
+	var GroupForm		= require('views/users/GroupForm');
+	var GroupcreateTmpl = require('hbs!tmpl/users/GroupCreate_tmpl');
+
+	var GroupCreate = Backbone.Marionette.Layout.extend(
+	/** @lends GroupCreate */
+	{
+		_viewName : 'GroupCreate',
+		
+    	template: GroupcreateTmpl,
+    	breadCrumbs :function(){
+    		if(this.model.isNew())
+    			return [XALinks.get('Groups'),XALinks.get('GroupCreate')];
+    		else
+    			return [XALinks.get('Groups'),XALinks.get('GroupEdit')];
+    	},
+        
+		/** Layout sub regions */
+    	regions: {
+    		'rForm' :'div[data-id="r_form"]'
+    	},
+
+    	/** ui selector cache */
+    	ui: {
+    		'btnSave'	: '[data-id="save"]',
+    		'btnCancel' : '[data-id="cancel"]'
+    	},
+
+		/** ui events hash */
+		events: function() {
+			var events = {};
+			//events['change ' + this.ui.input]  = 'onInputChange';
+			events['click ' + this.ui.btnSave]		= 'onSave';
+			events['click ' + this.ui.btnCancel]	= 'onCancel';
+			return events;
+		},
+
+    	/**
+		* intialize a new GroupCreate Layout 
+		* @constructs
+		*/
+		initialize: function(options) {
+			console.log("initialized a GroupCreate Layout");
+
+			_.extend(this, _.pick(options, ''));
+			this.editGroup = this.model.has('id') ? true : false;
+			this.bindEvents();
+		},
+
+		/** all events binding here */
+		bindEvents : function(){
+			/*this.listenTo(this.model, "change:foo", this.modelChanged, this);*/
+			/*this.listenTo(communicator.vent,'someView:someEvent', this.someEventHandler, this)'*/
+		},
+
+		/** on render callback */
+		onRender: function() {
+			this.initializePlugins();
+			this.form = new GroupForm({
+				template : require('hbs!tmpl/users/GroupForm_tmpl'),
+				model : this.model
+			});
+			this.rForm.show(this.form);
+			this.rForm.$el.dirtyFields();
+			XAUtil.preventNavigation(localization.tt('dialogMsg.preventNavGroupForm'),this.rForm.$el);
+			if(!_.isUndefined(this.model.get('groupSource')) && this.model.get('groupSource') == XAEnums.GroupSource.XA_GROUP.value){
+				this.ui.btnSave.hide();
+			}
+		},
+
+		/** all post render plugin initialization */
+		initializePlugins: function(){
+		},
+		onSave: function(){
+			var that =this ;
+			var errors = this.form.commit({validate : false});
+			if(! _.isEmpty(errors)){
+				return;
+			}
+			XAUtil.blockUI();
+			
+			this.model.save({},{
+				success: function () {
+					XAUtil.blockUI('unblock');
+					XAUtil.allowNavigation();
+					var msg = that.editGroup ? 'Group updated successfully' :'Group created successfully';
+					XAUtil.notifySuccess('Success', msg);
+					if(that.editGroup){
+						var VXResourceList 	= require('collections/VXResourceList');
+						var resourceList = new VXResourceList();
+						_.each(Backbone.fetchCache._cache, function(url, val){
+							var urlStr= resourceList.url;
+							if((val.indexOf(urlStr) != -1)) 
+								Backbone.fetchCache.clearItem(val);
+						});
+						App.appRouter.navigate("#!/users/grouptab",{trigger: true});
+						return;
+					}
+					App.appRouter.navigate("#!/users/grouptab",{trigger: true});
+					
+					var groupList = new VXGroupList();
+					   
+					groupList.fetch({
+						   cache:false
+					   }).done(function(){
+							var newColl;// = groupList;
+							groupList.getLastPage({
+								cache : false,
+								success : function(collection, response, options){
+									App.rContent.show(new UserTableLayout({
+										groupList : collection,
+										tab : 'grouptab'
+									}));
+									newColl = collection;
+								}
+							}).done(function(){
+								var model = newColl.get(that.model.id);
+								if(model){
+									model.trigger("model:highlightBackgridRow1");
+								}
+							});
+					   });
+				},
+				error : function (model, response, options) {
+					XAUtil.blockUI('unblock');
+					if ( response && response.responseJSON && response.responseJSON.msgDesc){
+						if(response.responseJSON.msgDesc == "XGroup already exists")
+							XAUtil.notifyError('Error', "Group name already exists");
+						else
+							XAUtil.notifyError('Error', response.responseJSON.msgDesc);
+					}else
+						XAUtil.notifyError('Error', 'Error creating Policy!');
+					console.log('error');
+				}
+			});
+		},
+		onCancel : function(){
+			XAUtil.allowNavigation();
+			App.appRouter.navigate("#!/users/grouptab",{trigger: true});
+		},
+
+		/** on close */
+		onClose: function(){
+		}
+
+	});
+
+	return GroupCreate; 
+});

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/scripts/views/users/GroupForm.js
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/scripts/views/users/GroupForm.js b/security-admin/src/main/webapp/scripts/views/users/GroupForm.js
new file mode 100644
index 0000000..3cad0ea
--- /dev/null
+++ b/security-admin/src/main/webapp/scripts/views/users/GroupForm.js
@@ -0,0 +1,63 @@
+/*
+ * Copyright (c) 2014 XASecure
+ * All rights reserved.
+ *
+ * This software is the confidential and proprietary information of
+ * XASecure. ("Confidential Information").  You shall not
+ * disclose such Confidential Information and shall use it only in
+ * accordance with the terms of the license agreement you entered into
+ * with XASecure.
+ */
+
+define(function(require){
+    'use strict';
+
+	var Backbone		= require('backbone');
+	var XAEnums			= require('utils/XAEnums');
+	
+	require('backbone-forms');
+	require('backbone-forms.templates');
+	var GroupForm = Backbone.Form.extend(
+	/** @lends GroupForm */
+	{
+		_viewName : 'GroupForm',
+
+    	/**
+		* intialize a new GroupForm Form View 
+		* @constructs
+		*/
+		initialize: function(options) {
+			console.log("initialized a GroupForm Form View");
+			_.extend(this, _.pick(options,''));
+    		Backbone.Form.prototype.initialize.call(this, options);
+
+			this.bindEvents();
+		},
+
+		/** all events binding here */
+		bindEvents : function(){
+		},
+
+		/** fields for the form
+		*/
+		fields: ['name', 'description'],
+		schema :{},
+		/** on render callback */
+		render: function(options) {
+			Backbone.Form.prototype.render.call(this, options);
+			this.initializePlugins();
+			if(!this.model.isNew()){
+				if(!_.isUndefined(this.model.get('groupSource')) && this.model.get('groupSource') == XAEnums.GroupSource.XA_GROUP.value){
+					this.fields.name.editor.$el.attr('disabled',true);
+					this.fields.description.editor.$el.attr('disabled',true);
+				}
+			}
+		},
+		/** all post render plugin initialization */
+		initializePlugins: function(){
+		}
+		
+	});
+
+	return GroupForm;
+});

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/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
new file mode 100644
index 0000000..f9d32f1
--- /dev/null
+++ b/security-admin/src/main/webapp/scripts/views/users/UserCreate.js
@@ -0,0 +1,237 @@
+/*
+ * Copyright (c) 2014 XASecure
+ * All rights reserved.
+ *
+ * This software is the confidential and proprietary information of
+ * XASecure. ("Confidential Information").  You shall not
+ * disclose such Confidential Information and shall use it only in
+ * accordance with the terms of the license agreement you entered into
+ * with XASecure.
+ */
+
+define(function(require){
+    'use strict';
+
+	var Backbone		= require('backbone');
+	var App				= require('App');
+	var XALinks 		= require('modules/XALinks');
+	var XAUtil			= require('utils/XAUtils');
+	var XAEnums			= require('utils/XAEnums');
+	var localization	= require('utils/XALangSupport');
+	
+	var UserForm		= require('views/users/UserForm');
+	var UserTableLayout	= require('views/users/UserTableLayout');
+	var VXUserList		= require('collections/VXUserList');
+	var UserCreateTmpl  = require('hbs!tmpl/users/UserCreate_tmpl');
+
+	var UserCreate = Backbone.Marionette.Layout.extend(
+	/** @lends UserCreate */
+	{
+		_viewName : 'UserCreate',
+		
+    	template: UserCreateTmpl,
+    	breadCrumbs :function(){
+    		if(this.model.isNew())
+    			return [XALinks.get('Users'),XALinks.get('UserCreate')];
+    		else
+    			return [XALinks.get('Users'),XALinks.get('UserEdit')];
+    	},
+        
+		/** Layout sub regions */
+    	regions: {
+    		'rForm' :'div[data-id="r_form"]'
+    	},
+
+    	/** ui selector cache */
+    	ui: {
+    		'tab' 		: '.nav-tabs',
+    		'btnSave'	: '[data-id="save"]',
+    		'btnCancel' : '[data-id="cancel"]'
+    	},
+
+		/** ui events hash */
+		events: function() {
+			var events = {};
+			events['click '+this.ui.tab+' li a']  = 'onTabChange';
+			events['click ' + this.ui.btnSave]		= 'onSave';
+			events['click ' + this.ui.btnCancel]	= 'onCancel';
+			
+			return events;
+		},
+
+    	/**
+		* intialize a new UserCreate Layout 
+		* @constructs
+		*/
+		initialize: function(options) {
+			console.log("initialized a UserCreate Layout");
+
+			_.extend(this, _.pick(options, 'groupList'));
+			this.showBasicFields = true;
+			this.editUser = this.model.has('id') ? true : false;
+			this.bindEvents();
+		},
+
+		/** all events binding here */
+		bindEvents : function(){
+			/*this.listenTo(this.model, "change:foo", this.modelChanged, this);*/
+			/*this.listenTo(communicator.vent,'someView:someEvent', this.someEventHandler, this)'*/
+		},
+
+		/** on render callback */
+		onRender: function() {
+			var that = this;
+			this.initializePlugins();
+			if(this.model.isNew()){
+				this.$('[data-tab="edit-password"]').hide();
+				this.$('[data-tab="edit-basic"]').hide();
+			}
+			if(!_.isUndefined(this.model.get('userSource')) && this.model.get('userSource') == XAEnums.UserSource.XA_USER.value){
+				this.$('[data-tab="edit-password"]').hide();
+				this.$('[data-tab="edit-basic"]').hide();
+				this.ui.btnSave.hide();
+			}
+			this.renderForm();
+			this.rForm.$el.dirtyFields();
+			XAUtil.preventNavigation(localization.tt('dialogMsg.preventNavUserForm'),this.rForm.$el);
+		},
+		/** all post render plugin initialization */
+		initializePlugins: function(){
+		},
+		onTabChange : function(e){
+			this.showBasicFields = $(e.currentTarget).parent().data('tab') == 'edit-basic' ? true : false;
+			this.renderForm();
+			this.clearPasswordFields();
+		},
+		renderForm : function(){
+			var that = this;
+			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);
+			if(!this.showBasicFields){
+				this.form.fields.passwordConfirm.editor.$el.on('keypress',function(e){
+					if(e.which === 13){
+						that.onSave();
+					}
+				});
+			}
+		},
+
+		clearPasswordFields : function(){
+			this.form.fields.password.setValue('');
+			this.form.fields.passwordConfirm.setValue('');
+		},
+		onSave: function(){
+			var errors = this.form.commit({validate : false});
+			if(! _.isEmpty(errors)){
+				if(this.showBasicFields)
+					this.form.beforeSaveUserDetail();
+				return;
+			}
+			if(this.showBasicFields){
+				this.saveUserDetail();
+			}else{
+				this.savePasswordDetail();
+			}
+			
+		},
+		saveUserDetail : function(){
+			var that = this;
+			if(!this.form.beforeSaveUserDetail()){
+				return;
+			}
+			XAUtil.blockUI();
+			this.model.save({},{
+				success: function () {
+					XAUtil.blockUI('unblock');
+					XAUtil.allowNavigation();
+					var msg = that.editUser ? 'User updated successfully' :'User created successfully';
+					XAUtil.notifySuccess('Success', msg);
+					if(that.editUser){
+						App.appRouter.navigate("#!/users/usertab",{trigger: true});
+						return;
+					}
+					App.appRouter.navigate("#!/users/usertab",{trigger: true});
+					
+					var userList = new VXUserList();
+					   
+				   userList.fetch({
+					   cache:false
+				   }).done(function(){
+						var newColl = userList;
+						userList.getLastPage({
+							cache : false,
+							success : function(collection, response, options){
+								App.rContent.show(new UserTableLayout({
+									collection : collection,
+									tab : 'usertab'
+								}));
+								newColl = collection;
+							}
+						}).done(function(){
+							var model = newColl.get(that.model.id);
+							if(model){
+								model.trigger("model:highlightBackgridRow");
+							}
+						});
+						
+						App.rContent.show(new UserTableLayout({
+							collection : userList
+						}));
+				   });
+				}   ,
+				error : function(model,resp){
+					XAUtil.blockUI('unblock');
+					console.log('error');
+					if(!_.isUndefined(resp.responseJSON) && !_.isUndefined(resp.responseJSON.msgDesc)){
+						if(resp.responseJSON.msgDesc == "XUser already exists")
+							XAUtil.notifyError('Error',"User already exists.");
+						else
+							XAUtil.notifyError('Error',resp.responseJSON.msgDesc);
+					}else
+						XAUtil.notifyError('Error', "Error occurred while creating/updating user.");
+					
+				}
+			});
+		},
+		savePasswordDetail : function(){
+			this.form.beforeSavePasswordDetail();
+			XAUtil.blockUI();
+			this.model.save({},{
+				
+				success: function () {
+					XAUtil.blockUI('unblock');
+					var msg = 'Password updated successfully';// :'Password created successfully';
+					XAUtil.notifySuccess('Success', msg);
+					App.appRouter.navigate("#!/users/usertab",{trigger: true});
+				},
+				error : function(model,resp){
+					XAUtil.blockUI('unblock');
+					if(!_.isUndefined(resp.responseJSON) && !_.isUndefined(resp.responseJSON.msgDesc)){
+						if(resp.responseJSON.msgDesc == "serverMsg.userMgrNewPassword")
+							XAUtil.notifyError('Error','Invalid new password');
+						else
+							XAUtil.notifyError('Error',resp.responseJSON.msgDesc);
+					}else
+						XAUtil.notifyError('Error', "Error occurred while creating/updating user.");
+					console.log('error');
+				}
+			});
+		},
+		onCancel : function(){
+			XAUtil.allowNavigation();
+			App.appRouter.navigate("#!/users/usertab",{trigger: true});
+
+		},
+		/** on close */
+		onClose: function(){
+		}
+
+	});
+
+	return UserCreate; 
+});

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/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
new file mode 100644
index 0000000..b89ddd7
--- /dev/null
+++ b/security-admin/src/main/webapp/scripts/views/users/UserForm.js
@@ -0,0 +1,226 @@
+/*
+ * Copyright (c) 2014 XASecure
+ * All rights reserved.
+ *
+ * This software is the confidential and proprietary information of
+ * XASecure. ("Confidential Information").  You shall not
+ * disclose such Confidential Information and shall use it only in
+ * accordance with the terms of the license agreement you entered into
+ * with XASecure.
+ */
+
+define(function(require){
+    'use strict';
+
+	var Backbone		= require('backbone');
+	var SessionMgr		= require('mgrs/SessionMgr');
+	
+	var VXGroupList		= require('collections/VXGroupList');
+	var localization	= require('utils/XALangSupport');
+	var XAEnums			= require('utils/XAEnums');
+	var XAUtils			= require('utils/XAUtils');
+	var AddGroup 		= require('views/common/AddGroup');
+	
+	require('backbone-forms');
+	require('backbone-forms.templates');
+	var UserForm = Backbone.Form.extend(
+	/** @lends UserForm */
+	{
+		_viewName : 'UserForm',
+
+    	/**
+		* intialize a new UserForm Form View 
+		* @constructs
+		*/
+		initialize: function(options) {
+			console.log("initialized a UserForm Form View");
+			_.extend(this, _.pick(options,'groupList','showBasicFields'));
+    		Backbone.Form.prototype.initialize.call(this, options);
+
+			this.bindEvents();
+		},
+
+		/** all events binding here */
+		bindEvents : function(){
+			this.on('userRoleList:change', function(form, fieldEditor){
+//    			this.userRoleListChange(form, fieldEditor);
+    		});
+		},
+		/** fields for the form
+		*/
+		fields: ['name', 'description'],
+		schema :function(){
+			return{
+				name : {
+					type		: 'Text',
+					title		: localization.tt("lbl.userName") +' *',
+					//validators  : ['required'],
+					validators  : ['required',{type:'regexp',regexp:/^[a-z][a-z0-9,._'-]+$/i,message :'Please enter valid name'}],
+					editorAttrs :{'maxlength': 32}
+				},
+				password : {
+					type		: 'Password',
+					title		: localization.tt("lbl.password") +' *',
+					validators  : ['required', {type: 'match', field: 'passwordConfirm', message: 'Passwords must match!'},
+					               {type:'regexp',regexp:/^.*(?=.{8,256})(?=.*\d)(?=.*[a-zA-Z]).*$/,message :localization.tt('validationMessages.passwordError')}],
+					editorAttrs  : {'onpaste':'return false;','oncopy':'return false;'}               
+				},
+				passwordConfirm : {
+					type		: 'Password',
+					title		: localization.tt("lbl.passwordConfirm") +' *',
+					validators  : ['required',
+					               {type:'regexp',regexp:/^.*(?=.{8,256})(?=.*\d)(?=.*[a-zA-Z]).*$/,message :localization.tt('validationMessages.passwordError')}],
+					editorAttrs  : {'onpaste':'return false;','oncopy':'return false;'}
+				},
+				firstName : { 
+					type		: 'Text',
+					title		: localization.tt("lbl.firstName")+' *',
+					validators  : ['required',{type:'regexp',regexp:/^[a-z][a-z0-9]+$/i,message :'Please enter valid name'}]
+				},
+				lastName : { 
+					type		: 'Text',
+					title		: localization.tt("lbl.lastName"),
+					validators  : [{type:'regexp',regexp:/^[a-z][a-z0-9]+$/i,message :'Please enter valid name'}]
+				///^[a-zA-z][a-z ,.'-]+$/i
+				},
+				emailAddress : {
+					type		: 'Text',
+					title		: localization.tt("lbl.emailAddress"),
+					validators  : ['email']
+				},
+				userRoleList : {
+					type : 'Select',
+					options : function(callback, editor){
+						var userTypes = _.filter(XAEnums.UserRoles,function(m){return m.label != 'Unknown'});
+						var nvPairs = XAUtils.enumToSelectPairs(userTypes);
+						callback(nvPairs);
+					},
+					title : localization.tt('lbl.selectRole')+' *'
+				}
+			};	
+		},
+		/*userRoleListChange : function(form, fieldEditor){
+			if(fieldEditor.getValue() == 1){
+				this.model.set('userRoleList',["ROLE_USER"]);
+			}else{
+				this.model.set('userRoleList',["ROLE_SYS_ADMIN"]);
+			}
+		},*/
+		/** on render callback */
+		render: function(options) {
+			var that = this;
+			 Backbone.Form.prototype.render.call(this, options);
+			this.renderCustomFields();
+			this.initializePlugins();
+			this.showCustomFields();
+			if(!that.model.isNew()){
+				this.fields.name.editor.$el.attr('disabled',true);
+				if(this.model.has('userRoleList')){
+					var roleList = this.model.get('userRoleList');
+					if(!_.isUndefined(roleList) && roleList.length > 0){
+						if(XAEnums.UserRoles[roleList[0]].value == XAEnums.UserRoles.ROLE_USER.value)
+							this.fields.userRoleList.setValue(XAEnums.UserRoles.ROLE_USER.value);
+					}
+				}
+				if(!_.isUndefined(this.model.get('userSource')) && this.model.get('userSource') == XAEnums.UserSource.XA_USER.value){
+					this.fields.password.editor.$el.attr('disabled',true);
+					this.fields.passwordConfirm.editor.$el.attr('disabled',true);
+					this.fields.firstName.editor.$el.attr('disabled',true);
+					this.fields.lastName.editor.$el.attr('disabled',true);
+					this.fields.emailAddress.editor.$el.attr('disabled',true);
+					this.fields.userRoleList.editor.$el.attr('disabled',true);
+					
+				}
+				//User does not allowed to change his role (it's own role)
+				var userProfileModel = SessionMgr.getUserProfile();
+				if(this.model.get('name') == userProfileModel.get('loginId')){
+					this.fields.userRoleList.editor.$el.attr('disabled',true);
+				}
+			}
+			
+		},
+		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();
+			});
+			
+		
+		},
+		showCustomFields : function(){
+			if(!this.showBasicFields){
+				this.fields.name.$el.hide();
+				this.fields.firstName.$el.hide();
+				this.fields.lastName.$el.hide();
+				this.fields.emailAddress.$el.hide();
+				this.fields.userRoleList.$el.hide();
+				
+				this.fields.name.editor.validators = this.removeElementFromArr(this.fields.name.editor.validators , 'required');
+				this.fields.firstName.editor.validators = this.removeElementFromArr(this.fields.firstName.editor.validators , 'required');
+				this.fields.emailAddress.editor.validators = this.removeElementFromArr(this.fields.emailAddress.editor.validators , 'required');
+
+				this.fields.password.$el.show();
+				this.fields.passwordConfirm.$el.show();
+			}
+			if(	(!this.model.isNew() && (this.showBasicFields))){
+				this.fields.password.$el.hide();
+				this.fields.passwordConfirm.$el.hide();
+				
+				this.fields.password.editor.validators = [];//this.removeElementFromArr(this.fields.password.editor.validators , 'required');
+				this.fields.passwordConfirm.editor.validators = [];//this.removeElementFromArr(this.fields.passwordConfirm.editor.validators , 'required');
+			}
+		},
+		removeElementFromArr : function(arr ,elem){
+			var index = $.inArray(elem,arr);
+			if(index >= 0) arr.splice(index,1);
+			return arr;
+		},
+		beforeSaveUserDetail : function(){
+			var groupArr = this.$('[data-customfields="groupIdList"]').find('.tags').editable('getValue', true);
+			if(_.isNumber(groupArr))
+				groupArr = groupArr.toString().split(',');
+			if(_.isEmpty(groupArr) ){
+				this.$('[data-customfields="groupIdList"]').find('.control-group').addClass('error');
+				this.$('[data-customfields="groupIdList"]').find('[data-error="groupIdList"]').show();
+				return false;
+			}else{
+				this.$('[data-customfields="groupIdList"]').find('.control-group').removeClass('error');
+				this.$('[data-customfields="groupIdList"]').find('[data-error="groupIdList"]').hide();				
+			}
+			this.model.set('groupIdList',groupArr);
+			this.model.set('status',XAEnums.ActivationStatus.ACT_STATUS_ACTIVE.value);
+			this.model.unset('passwordConfirm');
+			if(!this.model.isNew())
+				this.model.unset('password');
+			//FOR USER ROLE
+			if(this.fields.userRoleList.getValue() == XAEnums.UserRoles.ROLE_USER.value){
+				this.model.set('userRoleList',["ROLE_USER"]);
+			}else{
+				this.model.set('userRoleList',["ROLE_SYS_ADMIN"]);
+			}
+			return true;
+		},
+		beforeSavePasswordDetail : function(){
+			this.model.unset('passwordConfirm');
+			this.model.unset('userRoleList');
+			
+		},
+		/** all post render plugin initialization */
+		initializePlugins: function(){
+		}
+		
+	});
+
+	return UserForm;
+});

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/scripts/views/users/UserInfo.js
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/scripts/views/users/UserInfo.js b/security-admin/src/main/webapp/scripts/views/users/UserInfo.js
new file mode 100644
index 0000000..837a3d0
--- /dev/null
+++ b/security-admin/src/main/webapp/scripts/views/users/UserInfo.js
@@ -0,0 +1,98 @@
+/*
+ * Copyright (c) 2014 XASecure
+ * All rights reserved.
+ *
+ * This software is the confidential and proprietary information of
+ * XASecure. ("Confidential Information").  You shall not
+ * disclose such Confidential Information and shall use it only in
+ * accordance with the terms of the license agreement you entered into
+ * with XASecure.
+ */
+
+define(function(require){
+    'use strict';
+
+	var Backbone		= require('backbone');
+	var Communicator	= require('communicator');
+	var XAEnums 		= require('utils/XAEnums');
+	var UserInfo_tmpl = require('hbs!tmpl/users/UserInfo_tmpl'); 
+	
+	var UserInfo = Backbone.Marionette.ItemView.extend(
+	/** @lends UserInfo */
+	{
+		_viewName : 'UserInfo',
+		
+    	template: UserInfo_tmpl,
+    	templateHelpers : function(){
+    		return {
+    			'groupList' : this.groupList,
+    			'userList'	: this.userList,
+    			'userModel'	: this.model.modelName == XAEnums.ClassTypes.CLASS_TYPE_XA_USER.modelName ? true : false,
+    			'groupModel': this.model.modelName == XAEnums.ClassTypes.CLASS_TYPE_XA_GROUP.modelName ? true : false
+    		};
+    	},
+        
+    	/** ui selector cache */
+    	ui: {
+    		'showMoreBtn' : '[data-id="showMore"]',
+    		'showLessBtn' : '[data-id="showLess"]'
+    	},
+
+		/** ui events hash */
+		events: function() {
+			var events = {};
+			//events['change ' + this.ui.input]  = 'onInputChange';
+			events['click ' + this.ui.showMoreBtn]  = 'onShowMoreClick';
+			events['click ' + this.ui.showLessBtn]  = 'onShowLessClick';
+			return events;
+		},
+
+    	/**
+		* intialize a new UserInfo ItemView 
+		* @constructs
+		*/
+		initialize: function(options) {
+			console.log("initialized a UserInfo ItemView");
+
+			_.extend(this, _.pick(options, 'groupList','userList'));
+			
+			this.bindEvents();
+		},
+
+		/** all events binding here */
+		bindEvents : function(){
+			/*this.listenTo(this.model, "change:foo", this.modelChanged, this);*/
+			/*this.listenTo(communicator.vent,'someView:someEvent', this.someEventHandler, this)'*/
+		},
+
+		/** on render callback */
+		onRender: function() {
+			this.initializePlugins();
+			if(this.ui.showMoreBtn.parent('td').find('span').length > 3){
+				this.ui.showMoreBtn.show();	
+				this.ui.showMoreBtn.parent('td').find('span').slice(3).hide();
+			}
+		},
+		onShowMoreClick : function(){
+			this.ui.showMoreBtn.parent('td').find('span').show();
+			this.ui.showMoreBtn.hide();
+			this.ui.showLessBtn.show();
+		},
+		onShowLessClick : function(){
+			this.ui.showMoreBtn.parent('td').find('span').slice(3).hide();
+			this.ui.showLessBtn.hide();
+			this.ui.showMoreBtn.show();
+		},
+
+		/** all post render plugin initialization */
+		initializePlugins: function(){
+		},
+
+		/** on close */
+		onClose: function(){
+		}
+
+	});
+
+	return UserInfo;
+});

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/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
new file mode 100644
index 0000000..826a370
--- /dev/null
+++ b/security-admin/src/main/webapp/scripts/views/users/UserTableLayout.js
@@ -0,0 +1,463 @@
+/*
+ * Copyright (c) 2014 XASecure
+ * All rights reserved.
+ *
+ * This software is the confidential and proprietary information of
+ * XASecure. ("Confidential Information").  You shall not
+ * disclose such Confidential Information and shall use it only in
+ * accordance with the terms of the license agreement you entered into
+ * with XASecure.
+ */
+
+define(function(require){
+    'use strict';
+
+	var Backbone		= require('backbone');
+	var XAEnums 		= require('utils/XAEnums');
+	var XALinks 		= require('modules/XALinks');
+	var XAUtil			= require('utils/XAUtils');
+	var XABackgrid		= require('views/common/XABackgrid');
+	var localization	= require('utils/XALangSupport');
+
+	var VXGroupList		= require('collections/VXGroupList');
+	var VXGroup			= require('models/VXGroup');
+	var VXUserList		= require('collections/VXUserList');
+	var XATableLayout	= require('views/common/XATableLayout');
+	var vUserInfo		= require('views/users/UserInfo');
+
+	var UsertablelayoutTmpl = require('hbs!tmpl/users/UserTableLayout_tmpl');
+
+	var UserTableLayout = Backbone.Marionette.Layout.extend(
+	/** @lends UserTableLayout */
+	{
+		_viewName : 'UserTableLayout',
+		
+    	template: UsertablelayoutTmpl,
+    	breadCrumbs :[XALinks.get('Users')],
+		/** Layout sub regions */
+    	regions: {
+    		'rTableList' :'div[data-id="r_tableList"]',
+    		'rUserDetail'	: '#userDetail'
+    	},
+
+    	/** ui selector cache */
+    	ui: {
+    		tab 		: '.nav-tabs',
+    		addNewUser	: '[data-id="addNewUser"]',
+    		addNewGroup	: '[data-id="addNewGroup"]',
+    		visualSearch: '.visual_search'
+    	},
+
+		/** ui events hash */
+		events: function() {
+			var events = {};
+			events['click '+this.ui.tab+' li a']  = 'onTabChange';
+			//events['change ' + this.ui.input]  = 'onInputChange';
+			return events;
+		},
+
+    	/**
+		* intialize a new UserTableLayout Layout 
+		* @constructs
+		*/
+		initialize: function(options) {
+			console.log("initialized a UserTableLayout Layout");
+
+			_.extend(this, _.pick(options, 'groupList','tab'));
+			this.showUsers = this.tab == 'usertab' ? true : false;
+			this.bindEvents();
+		},
+
+		/** all events binding here */
+		bindEvents : function(){
+			/*this.listenTo(this.model, "change:foo", this.modelChanged, this);*/
+			/*this.listenTo(communicator.vent,'someView:someEvent', this.someEventHandler, this)'*/
+		},
+
+		/** on render callback */
+		onRender: function() {
+			this.initializePlugins();
+			if(this.tab == 'grouptab')
+				this.renderGroupTab();
+			else
+				this.renderUserTab();
+			this.addVisualSearch();
+		},
+		onTabChange : function(e){
+			this.showUsers = $(e.currentTarget).attr('href') == '#users' ? true : false;
+			if(this.showUsers){
+				this.renderUserTab();
+				this.addVisualSearch();
+			}
+			else{
+				this.renderGroupTab();
+				this.addVisualSearch();
+			}
+			$(this.rUserDetail.el).hide();
+		},
+		renderUserTab : function(){
+			var that = this;
+			if(_.isUndefined(this.collection)){
+				this.collection = new VXUserList();
+			}	
+			this.renderUserListTable();
+			this.collection.fetch({
+				cache:true
+			}).done(function(){
+				if(!_.isString(that.ui.addNewGroup)){
+					that.ui.addNewGroup.hide();
+					that.ui.addNewUser.show();
+				}
+				that.$('.wrap-header').text('User List');
+			});
+		},
+		renderGroupTab : function(){
+			var that = this;
+			if(_.isUndefined(this.groupList)){
+				this.groupList = new VXGroupList();
+			}
+			this.renderGroupListTable();
+			this.groupList.fetch({
+				cache:true
+			}).done(function(){
+				that.ui.addNewUser.hide();
+				that.ui.addNewGroup.show();
+				that.$('.wrap-header').text('Group List');
+				that.$('ul').find('[data-js="groups"]').addClass('active');
+				that.$('ul').find('[data-js="users"]').removeClass();
+			});
+		},
+		renderUserListTable : function(){
+			var that = this;
+			var tableRow = Backgrid.Row.extend({
+				events: {
+					'click' : 'onClick'
+				},
+				initialize : function(){
+					var that = this;
+					var args = Array.prototype.slice.apply(arguments);
+					Backgrid.Row.prototype.initialize.apply(this, args);
+					this.listenTo(this.model, 'model:highlightBackgridRow', function(){
+						that.$el.addClass("alert");
+						$("html, body").animate({scrollTop: that.$el.position().top},"linear");
+						setTimeout(function () {
+							that.$el.removeClass("alert");
+						}, 1500);
+					}, this);
+				},
+				onClick: function (e) {
+				   if($(e.target).is('a'))
+					   return;
+				   this.$el.parent('tbody').find('tr').removeClass('tr-active');
+				   this.$el.toggleClass('tr-active');
+				   var groupList = new VXGroupList();
+				   var userModel = this.model;
+				   groupList.getGroupsForUser(this.model.id,{
+					  cache : false, 
+					  success :function(msResponse){
+						  var groupColl = msResponse.vXGroups ? msResponse.vXGroups : null; 
+						  if(that.rUserDetail){
+								$(that.rUserDetail.el).hide();
+								$(that.rUserDetail.el).html(new vUserInfo({
+									  model : userModel,
+									  groupList : new VXGroupList(groupColl)
+								  }).render().$el).slideDown();
+							}
+					  },
+					  error : function(){
+						  console.log('error..');
+					  }
+				   });
+				}
+			});
+			this.rTableList.show(new XATableLayout({
+				columns: this.getColumns(),
+				collection: this.collection,
+				includeFilter : false,
+				gridOpts : {
+					row: tableRow,
+					header : XABackgrid,
+					emptyText : 'No Users found!'
+				}
+			}));	
+
+		},
+
+		getColumns : function(){
+			var cols = {
+				
+				name : {
+					label	: localization.tt("lbl.userName"),
+					href: function(model){
+						return '#!/user/'+ model.id;
+					},
+					editable:false,
+					sortable:false,
+					cell :'uri'
+						
+				},
+				emailAddress : {
+					label	: localization.tt("lbl.emailAddress"),
+					cell : 'string',
+					editable:false,
+					sortable:false,
+					placeholder : localization.tt("lbl.emailAddress")+'..'
+				},
+				userRoleList :{
+					label	: localization.tt("lbl.role"),
+					cell	: Backgrid.HtmlCell.extend({className: 'cellWidth-1'}),
+					formatter: _.extend({}, Backgrid.CellFormatter.prototype, {
+						fromRaw: function (rawValue, model) {
+							if(!_.isUndefined(rawValue) && rawValue.length > 0){
+								var role = rawValue[0];
+								return '<span class="label label-info">'+XAEnums.UserRoles[role].label+'</span>';
+							}
+							return '--';
+						}
+					}),
+					click : false,
+					drag : false,
+					editable:false,
+					sortable:false,
+				},
+				userSource :{
+					label	: localization.tt("lbl.userSource"),
+					cell	: Backgrid.HtmlCell.extend({className: 'cellWidth-1'}),
+					formatter: _.extend({}, Backgrid.CellFormatter.prototype, {
+						fromRaw: function (rawValue, model) {
+							if(!_.isUndefined(rawValue)){
+								if(rawValue == XAEnums.UserSource.XA_PORTAL_USER.value)
+									return '<span class="label label-success">'+XAEnums.UserTypes.USER_INTERNAL.label+'</span>';
+								else
+									return '<span class="label label-important">'+XAEnums.UserTypes.USER_EXTERNAL.label+'</span>';
+							}else
+								return '--';
+						}
+					}),
+					click : false,
+					drag : false,
+					editable:false,
+					sortable:false,
+				},
+				groupNameList : {
+					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)){
+								_.each(rawValue,function(name){
+									html += '<span class="label label-info">'+name+'</span>';
+								});
+								return html;
+							}else
+								return '--';
+						}
+					}),
+					editable : false,
+					sortable : false
+				},
+			/*	status : {
+					label : localization.tt("lbl.status"),
+					cell	: Backgrid.HtmlCell.extend({className: 'cellWidth-1'}),
+					formatter: _.extend({}, Backgrid.CellFormatter.prototype, {
+						fromRaw: function (rawValue, model) {
+							var status = model.has('status') ? 'Active' : 'Deactive';
+							if(model.has('status'))
+								return '<span class="label label-success">' +status + '</span>';
+							else
+								return '<span class="label label-important">' +status + '</span>';
+						//	return model.has('status') ? 'On' : 'Off';
+						}
+					}),
+					click : false,
+					drag : false,
+					editable:false,
+					sortable:false,
+				},*/
+				
+			};
+			return this.collection.constructor.getTableCols(cols, this.collection);
+		},
+		
+		renderGroupListTable : function(){
+			var that = this;
+			var tableRow = Backgrid.Row.extend({
+				events: {
+					'click' : 'onClick'
+				},
+				initialize : function(){
+					var that = this;
+					var args = Array.prototype.slice.apply(arguments);
+					Backgrid.Row.prototype.initialize.apply(this, args);
+					this.listenTo(this.model, 'model:highlightBackgridRow1', function(){
+						that.$el.addClass("alert");
+						$("html, body").animate({scrollTop: that.$el.position().top},"linear");
+						setTimeout(function () {
+							that.$el.removeClass("alert");
+						}, 1500);
+					}, this);
+				},
+				onClick: function (e) {
+				   if($(e.target).is('a'))
+					   return;
+				   this.$el.parent('tbody').find('tr').removeClass('tr-active');
+				   this.$el.toggleClass('tr-active');	
+				   var userList = new VXUserList();
+				   var gid = this.model.id;
+				   var groupModel = new VXGroup({id:gid});
+				   groupModel.fetch().done(function(msResponse){
+					   userList.getUsersOfGroup(gid,{
+						   success :function(msResponse){
+							   var userColl = msResponse.vXUsers ? msResponse.vXUsers : null; 
+							   if(that.rUserDetail){
+								   $(that.rUserDetail.el).hide();
+								   $(that.rUserDetail.el).html(new vUserInfo({
+									   model 	: groupModel,
+									   userList: new VXUserList(userColl)
+								   }).render().$el).slideDown(); 
+							   }
+						   },
+						   error : function(){
+							   console.log('error..');
+						   }
+					   });
+				   });
+				}
+			});
+			this.rTableList.show(new XATableLayout({
+				columns: this.getGroupColumns(),
+				collection: this.groupList,
+				includeFilter : false,
+				gridOpts : {
+					row: tableRow,
+					header : XABackgrid,
+					emptyText : 'No Groups found!'
+				}
+			}));	
+
+		},
+
+		getGroupColumns : function(){
+			var cols = {
+				
+				name : {
+					label	: localization.tt("lbl.groupName"),
+					href: function(model){
+						return '#!/group/'+ model.id;
+					},
+					editable:false,
+					sortable:false,
+					cell :'uri'
+						
+				},
+				groupSource :{
+					label	: localization.tt("lbl.groupSource"),
+					cell	: Backgrid.HtmlCell.extend({className: 'cellWidth-1'}),
+					formatter: _.extend({}, Backgrid.CellFormatter.prototype, {
+						fromRaw: function (rawValue, model) {
+							if(!_.isUndefined(rawValue)){
+								if(rawValue == XAEnums.GroupSource.XA_PORTAL_GROUP.value)
+									return '<span class="label label-success">'+XAEnums.GroupTypes.GROUP_INTERNAL.label+'</span>';
+								else
+									return '<span class="label label-important">'+XAEnums.GroupTypes.GROUP_EXTERNAL.label+'</span>';
+							}else
+								return '--';
+						}
+					}),
+					click : false,
+					drag : false,
+					editable:false,
+					sortable:false,
+				}
+				/*status : {
+					label : localization.tt("lbl.status"),
+					cell	: Backgrid.HtmlCell.extend({className: 'cellWidth-1'}),
+					formatter: _.extend({}, Backgrid.CellFormatter.prototype, {
+						fromRaw: function (rawValue, model) {
+							var status = model.has('status') ? 'Active' : 'Deactive';
+							if(model.has('status'))
+								return '<span class="label label-success">' +status + '</span>';
+							else
+								return '<span class="label label-important">' +status + '</span>';
+						}
+					}),
+					click : false,
+					drag : false,
+					editable:false,
+					sortable:false,
+				}, */
+			};
+			return this.groupList.constructor.getTableCols(cols, this.groupList);
+		},
+		addVisualSearch : function(){
+			var coll,placeholder;
+			var searchOpt = [], serverAttrName = [];
+			if(this.showUsers){
+				placeholder = localization.tt('h.searchForYourUser');	
+				coll = this.collection;
+				searchOpt = ['User Name','Email Address','Role','User Source'];//,'Start Date','End Date','Today'];
+				var userRoleList = _.map(XAEnums.UserRoles,function(obj,key){return {label:obj.label,value:key};});
+				serverAttrName  = [{text : "User Name", label :"name"},{text : "Email Address", label :"emailAddress"},
+				                   {text : "Role", label :"userRoleList", 'multiple' : true, 'optionsArr' : userRoleList},
+				                   {text : "User Source", label :"userSource", 'multiple' : true, 'optionsArr' : XAUtil.enumToSelectLabelValuePairs(XAEnums.UserTypes)},
+								];
+				                  // {text : 'Start Date',label :'startDate'},{text : 'End Date',label :'endDate'},
+				                  // {text : 'Today',label :'today'}];
+			}else{
+				placeholder = localization.tt('h.searchForYourGroup');
+				coll = this.groupList;
+				searchOpt = ['Group Name','Group Source'];//,'Start Date','End Date','Today'];
+				serverAttrName  = [{text : "Group Name", label :"name"},
+				                   {text : "Group Source", label :"groupSource", 'multiple' : true, 'optionsArr' : XAUtil.enumToSelectLabelValuePairs(XAEnums.GroupTypes)},];
+				
+				                   //{text : 'Start Date',label :'startDate'},{text : 'End Date',label :'endDate'},
+				                   //{text : 'Today',label :'today'}];
+
+			}
+			var pluginAttr = {
+				      placeholder :placeholder,
+				      container : this.ui.visualSearch,
+				      query     : '',
+				      callbacks :  { 
+				    	  valueMatches :function(facet, searchTerm, callback) {
+								switch (facet) {
+									case 'Role':
+										callback(XAUtil.hackForVSLabelValuePairs(XAEnums.UserRoles));
+										break;
+									case 'User Source':
+										callback(XAUtil.hackForVSLabelValuePairs(XAEnums.UserTypes));
+										break;	
+									case 'Group Source':
+										callback(XAUtil.hackForVSLabelValuePairs(XAEnums.GroupTypes));
+										break;		
+									/*case 'Start Date' :
+										setTimeout(function () { XAUtil.displayDatepicker(that.ui.visualSearch, callback); }, 0);
+										break;
+									case 'End Date' :
+										setTimeout(function () { XAUtil.displayDatepicker(that.ui.visualSearch, callback); }, 0);
+										break;
+									case 'Today'	:
+										var today = Globalize.format(new Date(),"yyyy/mm/dd");
+										callback([today]);
+										break;*/
+								}     
+			            	
+							}
+				      }
+				};
+			XAUtil.addVisualSearch(searchOpt,serverAttrName, coll,pluginAttr);
+		},
+
+		/** all post render plugin initialization */
+		initializePlugins: function(){
+		},
+
+		/** on close */
+		onClose: function(){
+		}
+
+	});
+
+	return UserTableLayout; 
+});

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/accounts/AccountCreate_tmpl.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/accounts/AccountCreate_tmpl.html b/security-admin/src/main/webapp/templates/accounts/AccountCreate_tmpl.html
new file mode 100644
index 0000000..3fdf99a
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/accounts/AccountCreate_tmpl.html
@@ -0,0 +1,12 @@
+<div class="wrap non-collapsible">
+	<h4> Account Details </h4>
+	<div data-id="r_form"></div>
+	<div class="form-actions">
+		<button type="submit" data-id="save" class="btn btn-primary">
+			Save
+		</button>
+		<button type="button" data-id="cancel" class="btn btn-inverse">
+			Cancel
+		</button>
+	</div>
+</div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/accounts/AccountDetailLayout_tmpl.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/accounts/AccountDetailLayout_tmpl.html b/security-admin/src/main/webapp/templates/accounts/AccountDetailLayout_tmpl.html
new file mode 100644
index 0000000..8f72e22
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/accounts/AccountDetailLayout_tmpl.html
@@ -0,0 +1,72 @@
+<div class="wrap non-collapsible">
+	<div class="span12">
+
+		<legend>Account Info</legend>
+		<div><a id="editDetail" class="pull-right" href="#!/accounts/{{this.id}}/edit">Edit</a></div> 
+
+
+		<table id="dvDispDetail" class="table table-bordered table-striped">
+			<tbody> 
+				<tr>         
+					<td width="40%">{{tt 'lbl.customerName'}}</td>
+					<td>{{this.customerName}}</td>
+				</tr>
+				<tr>         
+					<td>{{tt 'lbl.accountCode'}}</td>
+					<td>{{this.accountCode}}</td>
+				</tr>
+				<tr>         
+					<td>{{tt 'lbl.accountStatus'}}</td>
+					{{#if_eq this.status compare='Enabled'}}
+						<td>{{tt 'lbl.ActiveStatus_STATUS_ENABLED'}}</td>
+					{{else}}
+						<td>{{tt 'lbl.ActiveStatus_STATUS_DISABLED'}}</td>	
+					{{/if_eq}}	
+				</tr>  
+			</tbody>
+		</table>
+
+	</div>
+</div>
+
+<!-- 
+	<fieldset>
+
+		<form style="display:none" id="frmAddAcc" class="form-horizontal">
+			<label class="infoMsg">Fields marked as * are mandatory</label>
+			<div class="control-group">
+				<label class="control-label">Account Name  *</label>
+				<div class="controls">
+					<input class="validate[required]" id="inpCustName" type="text">
+				</div>
+			</div>
+			<div class="control-group">
+				<label class="control-label">Account Status *</label>
+				<div class="controls">
+					select class="validate[required]" id="selActStatus" name="" id="">
+						<option value="">Select</option> 
+						
+						<option value="1">Enabled</option>
+						
+						<option value="0">Disabled</option>
+						
+					</select
+					<span>Enable </span>
+					<input id="enabled" type="radio" class="validate[required]" name="status" title="Enabled" checked="checked">
+					<span>Disable </span>
+					<input id="disabled" type="radio" class="validate[required]" name="status" title="Disabled">
+				</div>
+			</div>
+			<div class="control-group">
+				<label class="control-label">Support Corporate Authentication</label>
+				<div class="controls">
+					<input id="chkMail" type="checkbox">
+				</div>
+			</div>
+			<div class="form-actions">
+					<button id="btnSaveAcc" type="button" class="btn ">Save Account</button>
+					<button id="btnCancel" type="button" class="btn">Cancel</button>
+			</div>
+		</form>
+	</fieldset>
+ -->
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/accounts/AccountForm_tmpl.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/accounts/AccountForm_tmpl.html b/security-admin/src/main/webapp/templates/accounts/AccountForm_tmpl.html
new file mode 100644
index 0000000..64f73af
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/accounts/AccountForm_tmpl.html
@@ -0,0 +1,7 @@
+<form class="form-horizontal" >
+		<div class="" data-fields="customerName"></div>
+		<div class="" data-fields="accountStatus"></div>
+		<div class="" data-fields="accountCode"></div>
+</form> 
+
+

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/accounts/AccountTableLayout_tmpl.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/accounts/AccountTableLayout_tmpl.html b/security-admin/src/main/webapp/templates/accounts/AccountTableLayout_tmpl.html
new file mode 100644
index 0000000..60e7466
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/accounts/AccountTableLayout_tmpl.html
@@ -0,0 +1,15 @@
+<h3 class="wrap-header bold"> Manage Accounts </h3>
+<div class="wrap non-collapsible">
+	<div class="span12">
+		<div class="clearfix">
+			<a href="#!/accounts/create" class="btn btn-primary pull-right btn-right" type="button"> Add New Account </a>
+		</div>
+
+		<div data-id="r_tableList">
+			No Records!
+		</div>
+		<div data-id="r_pagination" class="text-center"></div>
+
+	</div>
+</div>
+

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/asset/AssetCreate_tmpl.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/asset/AssetCreate_tmpl.html b/security-admin/src/main/webapp/templates/asset/AssetCreate_tmpl.html
new file mode 100644
index 0000000..aa4f155
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/asset/AssetCreate_tmpl.html
@@ -0,0 +1,20 @@
+{{#if editAsset}}
+	<h4 class="wrap-header bold"> Edit Repository  </h4>
+{{else}}
+	<h4 class="wrap-header bold"> Create Repository  </h4>
+{{/if}}
+<div class="wrap non-collapsible ">
+	<div data-id="r_form"></div>
+	<div class="form-actions form-asset" class="row-fluid">
+		<button type="submit" data-id="save" class="btn btn-primary">
+			Save
+		</button>
+		<button type="button" data-id="cancel" class="btn btn-inverse">
+			Cancel
+		</button>
+		<button type="button" data-id="delete" class="btn btn-danger" ><!-- style="margin-left: 27%;" -->
+			Delete
+		</button>
+	</div>
+</div>
+

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/asset/AssetForm_tmpl.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/asset/AssetForm_tmpl.html b/security-admin/src/main/webapp/templates/asset/AssetForm_tmpl.html
new file mode 100644
index 0000000..e5e2de2
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/asset/AssetForm_tmpl.html
@@ -0,0 +1,51 @@
+<form class="form-horizontal" >
+	<fieldset class="configProp">
+		<p class="formHeader">
+			{{tt 'lbl.repositoryDetails'}} :
+		</p>
+		<div class="" data-fields="name"></div>
+		<div class="" data-fields="description"></div>
+		<div class="" data-fields="activeStatus"></div>
+		<div class="" data-fields="assetType"></div>
+	</fieldset>
+	<fieldset class="configProp">
+		<p class="formHeader">
+			Config Properties : 
+		</p>
+		<!-- div class="" data-fields="_vPassword"></div-->
+		<div class="" data-fields="userName"></div>
+		<div class="" data-fields="passwordKeytabfile"></div>
+		<div class="" data-fields="fsDefaultName"></div>
+		<div class="" data-fields="authorization"></div>
+		<div class="" data-fields="authentication"></div>
+		<div class="" data-fields="auth_to_local"></div>
+		<div class="" data-fields="datanode"></div>
+		<div class="" data-fields="namenode"></div>
+		<div class="" data-fields="secNamenode"></div>
+		<div class="" data-fields="driverClassName"></div>
+		<div class="" data-fields="url"></div>
+		<div class="" data-fields="masterKerberos"></div>
+		<div class="" data-fields="rpcEngine"></div>
+		<div class="" data-fields="rpcProtection"></div>
+		<div class="" data-fields="securityAuthentication"></div>
+		<div class="" data-fields="zookeeperProperty"></div>
+		<div class="" data-fields="zookeeperQuorum"></div>
+		<div class="" data-fields="zookeeperZnodeParent"></div>
+		<div class="" data-fields="knoxUrl"></div>
+		<div class="" data-fields="commonnameforcertificate"></div>
+		<!-- div class="" data-fields="pair"></div-->
+	</fieldset>
+	<div>
+		<div class="control-group field-username hdfs hive knox" style="display: block;">
+			<label class="control-label" for="c12_username"></label>
+			<div class="controls">
+				<span data-editor="">
+					<input data-id="testConn" type="button" value="Test Connection" class="btn" />
+				</span>
+
+			</div>
+		</div>
+	</div>
+
+</form>
+

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/asset/AssetTableLayout_tmpl.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/asset/AssetTableLayout_tmpl.html b/security-admin/src/main/webapp/templates/asset/AssetTableLayout_tmpl.html
new file mode 100644
index 0000000..85568d2
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/asset/AssetTableLayout_tmpl.html
@@ -0,0 +1,13 @@
+<h3 class="wrap-header bold"> {{tt 'lbl.listOfPolicies'}} : {{tt 'h.hdfs'}} </h3>
+<div class="wrap non-collapsible m-height">
+	<div class="span12">
+		<div class="clearfix">
+			<a href="#!/policy/create" class="btn btn-primary btn-right" type="button"> {{tt 'lbl.addNewAsset'}} </a>
+			<div data-id="r_filter" class="pull-left wrap-filter"></div>
+		</div>
+		
+		<div data-id="r_assettable" class="hdfs-table"></div>
+	</div>
+
+</div>
+

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/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
new file mode 100644
index 0000000..c549d56
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/common/AddGroup_tmpl.html
@@ -0,0 +1,16 @@
+<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" 
+            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;">
+       		{{#if isModelNew}}
+       			<i class="icon-plus" title="Add"></i>
+       		{{else}}
+       			<i class="icon-pencil" title="Edit"></i>
+       		{{/if}}	
+       	</a>
+       	<div class="help-inline" data-error="groupIdList" style="display:none;margin-bottom: 6px;padding-left: 2%;">Please add group.</div>
+    </div>
+</div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/common/ErrorView_tmpl.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/common/ErrorView_tmpl.html b/security-admin/src/main/webapp/templates/common/ErrorView_tmpl.html
new file mode 100644
index 0000000..4a5a90a
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/common/ErrorView_tmpl.html
@@ -0,0 +1,29 @@
+{{#if pageNotFound}}
+<div data-id="pageNotFoundPage" class="error-page">
+<div class="error-box" style="margin-top: 0px;">
+		<div class="icon-box"><img src="images/error-404-icon.png"></div>
+
+		<h1>Page not found (404).</h1>
+		<p>Sorry, this page isn't here or has moved.</p>
+
+		<a href="#!/policymanager" class="btn btn-primary btn-small" data-id="goBack"><i class="icon-long-arrow-left"></i> Go back</a>&nbsp;&nbsp;
+		<!--   <a href="#!/policymanager" class="btn btn-small" data-id="home">Home</a> -->
+</div>
+</div>
+{{/if}}
+
+
+{{#if restrictedAccess}}
+<div data-id="restrictedAccessPage" class="error-page">
+<div class="error-box" style="margin-top: 0px;">
+		<div class="icon-box"><img src="images/error-404-icon.png"></div>
+
+
+		<h1>Restricted Access (403)</h1>
+		<p>Please try again later. Thank you.</p>
+
+		<!-- <a href="#!/policymanager" class="btn  btn-small" data-id="goBack"><i class="icon-long-arrow-left"></i> Go back</a>&nbsp;&nbsp;
+		<a href="#!/policymanager" class="btn btn-small" data-id="home">Home</a> -->
+</div>
+</div>
+{{/if}}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/common/Footer_tmpl.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/common/Footer_tmpl.html b/security-admin/src/main/webapp/templates/common/Footer_tmpl.html
new file mode 100644
index 0000000..47c399f
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/common/Footer_tmpl.html
@@ -0,0 +1,29 @@
+{{!empty FooterTmpl template}}
+<div id="main-footer">
+	<div class="pull-left copy-right-text">
+			<p class="text-left">
+				© {{tt 'h.hortonWorksInc'}} {{getCopyrightDate}}. All rights reserved.
+			</p>
+			<p class="text-left">
+				<a target="_blank" href="copyrightPluginList.html">{{tt 'h.listOfPlugins'}}</a>
+			</p>
+	</div>
+	<div class="pull-right">
+		<ul class="nav nav-footer">
+			<!-- <li class="active">
+				<a href="http://xasecure.com">About</a>
+			</li>
+
+			<li>
+				<a href="http://xasecure.com">Contact</a>
+			</li>
+
+			<li>
+				<a href="http://xasecure.com" >Privacy</a>
+			</li>
+			<li>
+				<a href="http://xasecure.com">Blog</a>
+			</li> -->
+		</ul>
+	</div>
+</div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/common/PolicyManagerLayout_tmpl.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/common/PolicyManagerLayout_tmpl.html b/security-admin/src/main/webapp/templates/common/PolicyManagerLayout_tmpl.html
new file mode 100644
index 0000000..13c7ad4
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/common/PolicyManagerLayout_tmpl.html
@@ -0,0 +1,234 @@
+<h3 class="wrap-header bold">{{tt 'h.repositoryManager'}}</h3>
+
+<div class="wrap non-collapsible policy-manager">
+	<div class="row-fluid">
+		<div class="span4">
+			<div class="position-relative">
+				<table class="table table-bordered table-striped">
+					<!-- table-policy -->
+					<thead>
+						<tr>
+							<th><img alt="HDFS" src="images/hdfs.jpg"> 
+								{{#if isSysAdmin}} <a href="{{assetCreateHref}}/{{hdfsVal}}"
+								class="pull-right" title="Add"> <i class="icon-plus"></i>
+							</a> {{/if}}</th>
+						</tr>
+					</thead>
+					<tbody>
+						{{#unless hdfsList}}
+						<tr>
+							<td>No Repositories!
+							</td>
+						</tr>
+						{{/unless}} 
+						{{#each hdfsList}}
+
+						<tr>
+							<td>
+								<div>
+									<a data-id="{{./this.id}}" href="#!/hdfs/{{./this.id}}/policies">{{./this.attributes.name}}</a>
+									{{#if ../isSysAdmin}}
+									<div class="pull-right">
+										<a data-id="{{./this.id}}" class="btn btn-mini"
+											href="#!/asset/{{./this.id}}" title="Edit"><i
+											class="icon-edit"></i></a> <a data-id="{{./this.id}}"
+											class="deleteRep btn btn-mini btn-danger"
+											href="javascript:void(0);" title="Delete"><i
+											class="icon-trash"></i></a>
+									</div>
+									{{/if}}
+								</div>
+							</td>
+						</tr>
+						{{/each}}
+					</tbody>
+				</table>
+
+				<div data-id="r_tableSpinner" class="loading">
+				</div>
+			</div>
+		</div>
+		<div class="span4">
+			<div class="position-relative">
+				<table class="table table-bordered table-striped">
+					<!-- table-policy -->
+					<thead>
+						<tr>
+							<th><img alt="Hive" src="images/hive.png" > 
+								{{#if isSysAdmin}} <a href="{{assetCreateHref}}/{{hiveVal}}"
+								class="pull-right" title="Add"><i class="icon-plus"></i></a></th>
+							{{/if}}
+						</tr>
+					</thead>
+					<tbody>
+						{{#unless hiveList}}
+						<tr>
+							<td>No Repositories! 
+							</td>
+						</tr>
+						{{/unless}} 
+						{{#each hiveList}}
+						<tr>
+							<td>
+								<div>
+									<a data-id="{{./this.id}}" href="#!/hive/{{./this.id}}/policies">{{./this.attributes.name}}</a>
+									{{#if ../isSysAdmin}}
+									<div class="pull-right">
+										<a data-id="{{./this.id}}" class="btn btn-mini"
+											href="#!/asset/{{./this.id}}" title="Edit"><i
+											class="icon-edit"></i></a> <a data-id="{{./this.id}}"
+											class="deleteRep btn btn-mini btn-danger"
+											href="javascript:void(0);" title="Delete"><i
+											class="icon-trash"></i></a>
+									</div>
+									{{/if}}
+								</div>
+							</td>
+						</tr>
+						{{/each}}
+
+					</tbody>
+				</table>
+				<div data-id="r_tableSpinner" class="loading">
+				</div>
+			</div>
+		</div>
+		<div class="span4">
+			<div class="position-relative">
+				<table class="table table-bordered table-striped">
+					<!-- table-policy -->
+					<thead>
+						<tr>
+							<th><img alt="HBase" src="images/hbase.jpg" > 
+								{{#if isSysAdmin}} <a href="{{assetCreateHref}}/{{hbaseVal}}"
+								class="pull-right" title="Add"><i class="icon-plus"></i></a></th>
+							{{/if}}
+						</tr>
+					</thead>
+					<tbody>
+						{{#unless hbaseList}}
+						<tr>
+							<td>No Repositories! 
+							</td>
+						</tr>
+						{{/unless}} 
+						{{#each hbaseList}}
+						<tr>
+							<td>
+								<div>
+
+									<a data-id="{{./this.id}}" href="#!/hbase/{{./this.id}}/policies">{{./this.attributes.name}}</a>
+									{{#if ../isSysAdmin}}
+									<div class="pull-right">
+										<a data-id="{{./this.id}}" class="btn btn-mini"
+											href="#!/asset/{{./this.id}}" title="Edit"><i
+											class="icon-edit"></i></a> <a data-id="{{./this.id}}"
+											class="deleteRep btn btn-mini btn-danger"
+											href="javascript:void(0);" title="Delete"><i
+											class="icon-trash"></i></a>
+									</div>
+									{{/if}}
+								</div>
+							</td>
+						</tr>
+						{{/each}}
+					</tbody>
+				</table>
+				<div data-id="r_tableSpinner" class="loading">
+				</div>
+			</div>
+		</div>
+	</div>
+	<div class="row-fluid">
+		<div class="span4">
+			<div class="position-relative">
+				<table class="table table-bordered table-striped">
+					<!-- table-policy -->
+					<thead>
+						<tr>
+							<th><img alt="KNOX" src="images/knox.gif" > 
+								{{#if isSysAdmin}} <a href="{{assetCreateHref}}/{{knoxVal}}"
+								class="pull-right" title="Add"> <i class="icon-plus"></i>
+							</a> {{/if}}</th>
+						</tr>
+					</thead>
+					<tbody>
+						{{#unless knoxList}}
+						<tr>
+							<td>No Repositories!
+							</td>
+						</tr>
+						{{/unless}} 
+						{{#each knoxList}}
+
+						<tr>
+							<td>
+								<div>
+									<a data-id="{{./this.id}}" href="#!/knox/{{./this.id}}/policies">{{./this.attributes.name}}</a>
+									{{#if ../isSysAdmin}}
+									<div class="pull-right">
+										<a data-id="{{./this.id}}" class="btn btn-mini"
+											href="#!/asset/{{./this.id}}" title="Edit"><i
+											class="icon-edit"></i></a> <a data-id="{{./this.id}}"
+											class="deleteRep btn btn-mini btn-danger"
+											href="javascript:void(0);" title="Delete"><i
+											class="icon-trash"></i></a>
+									</div>
+									{{/if}}
+								</div>
+							</td>
+						</tr>
+						{{/each}}
+					</tbody>
+				</table>
+				<div data-id="r_tableSpinner" class="loading">
+				</div>
+			</div>
+		</div>
+		<div class="span4">
+			<div class="position-relative">
+				<table class="table table-bordered table-striped">
+					<!-- table-policy -->
+					<thead>
+						<tr>
+							<th><img alt="STORM" src="images/storm.png" > 
+								{{#if isSysAdmin}} <a href="{{assetCreateHref}}/{{stormVal}}"
+								class="pull-right" title="Add"> <i class="icon-plus"></i>
+							</a> {{/if}}</th>
+						</tr>
+					</thead>
+					<tbody>
+						{{#unless stormList}}
+						<tr>
+							<td>No Repositories!
+							</td>
+						</tr>
+						{{/unless}} 
+						{{#each stormList}}
+
+						<tr>
+							<td>
+								<div>
+									<a data-id="{{./this.id}}" href="#!/storm/{{./this.id}}/policies">{{./this.attributes.name}}</a>
+									{{#if ../isSysAdmin}}
+									<div class="pull-right">
+										<a data-id="{{./this.id}}" class="btn btn-mini"
+											href="#!/asset/{{./this.id}}" title="Edit"><i
+											class="icon-edit"></i></a> <a data-id="{{./this.id}}"
+											class="deleteRep btn btn-mini btn-danger"
+											href="javascript:void(0);" title="Delete"><i
+											class="icon-trash"></i></a>
+									</div>
+									{{/if}}
+								</div>
+							</td>
+						</tr>
+						{{/each}}
+					</tbody>
+				</table>
+				<div data-id="r_tableSpinner" class="loading">
+				</div>
+			</div>
+		</div>
+	</div>	
+																		</div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/common/ProfileBar_tmpl.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/common/ProfileBar_tmpl.html b/security-admin/src/main/webapp/templates/common/ProfileBar_tmpl.html
new file mode 100644
index 0000000..8049c07
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/common/ProfileBar_tmpl.html
@@ -0,0 +1,54 @@
+<div class="nav-collapse collapse" >
+	<ul class="nav pull-right">
+		<li class="dropdown">
+			<a href="#" class="dropdown-toggle usermenu _allowNav" data-toggle="dropdown" > <img alt="Avatar" src="images/avatar.png"> 
+				<!-- <span>{{userProfile.attributes.firstName}} {{userProfile.attributes.lastName}}</span> </a> -->
+				<span>{{userProfile.attributes.loginId}}</span> </a>
+				
+			<ul class="dropdown-menu">
+				<li>
+					<a href="#!/userprofile" > <i class="icon-male"></i>Profile </a>
+				</li>
+				<!-- <li>
+					<a href="#"> <i class="icon-cogs"></i>Settings </a>
+				</li> -->
+				<!-- <li class="divider"></li> -->
+				<!-- <li>
+				<a href="#">Sign In</a>
+				</li> -->
+				<li>
+					<a href="javascript:;" class="_allowNav" data-id="logout"> <i class="icon-off"></i>Log Out </a>
+				</li>
+			</ul>
+		</li>
+	</ul>
+<!-- 	<ul class="nav pull-right ul-db" title="Select Repository">
+
+		<li class="dropdown">
+			<a href="#" class="dropdown-toggle" data-toggle="dropdown">Repository <i class=" icon-caret-down"></i></a>
+			<ul class="dropdown-menu">
+				<li class="nav-header">
+					HBase
+				</li>
+				<li>
+					<a href="#">Demo Table 1</a>
+				</li>
+				<li>
+					<a href="#">Demo Table 2</a>
+				</li>
+
+				<li class="divider"></li>
+				<li class="nav-header">
+					HDFS
+				</li>
+				<li>
+					<a href="#">Test Folder 1</a>
+				</li>
+				<li>
+					<a href="#">Test Folder 2</a>
+				</li>
+			</ul>
+		</li>
+		<li class="divider-vertical"></li>
+	</ul> -->
+</div>

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/common/TopNav_tmpl.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/common/TopNav_tmpl.html b/security-admin/src/main/webapp/templates/common/TopNav_tmpl.html
new file mode 100644
index 0000000..3f02ed2
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/common/TopNav_tmpl.html
@@ -0,0 +1,27 @@
+<div class="nav-collapse collapse" >
+	<ul class="nav page-nav" >
+		<!-- <li class="active">
+			<a href="#" id="nav1"><i class="icon-dashboard"></i> {{tt 'h.dashboard'}} </a>
+		</li> -->
+		<li >
+			<a href="#!/policymanager" id="nav2"><i class="icon-shield"></i>{{tt 'h.policyManager'}} </a>
+		</li>
+		{{#isSystemAdmin .}}
+		<li>
+			<a href="#!/users/usertab" id="nav3"><i class="icon-group"></i> {{tt 'h.usersOrGroups'}} </a>
+		</li>
+		{{/isSystemAdmin}} 
+		<li>
+			<a href="#!/reports/userAccess" id="nav7"><i class="icon-beaker"></i> {{tt 'h.analytics'}} </a>
+		</li>
+		{{#isSystemAdmin .}}
+		<li>
+			<a href="#!/reports/audit/bigData" id="nav8"><i class=" icon-file-alt"></i> {{tt 'h.audit'}} </a>
+		</li>
+		{{/isSystemAdmin}}
+	 
+	<!--	<li>
+			<a href="#" id="nav4"><i class="icon-cog"></i> {{tt 'h.config'}} </a>
+		</li> -->
+	</ul>
+</div>

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/common/UserPermissionItem.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/common/UserPermissionItem.html b/security-admin/src/main/webapp/templates/common/UserPermissionItem.html
new file mode 100644
index 0000000..36f4082
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/common/UserPermissionItem.html
@@ -0,0 +1,36 @@
+<td>
+	<input  type="text" data-js="selectUsers" /> 	
+</td>
+{{#if policyKnox}}
+<td>
+	<input  type="text" data-js="ipAddress" placeholder="Enter IP address"/> 	
+</td>
+{{/if}}
+
+{{#if policyStorm}}
+<td>	
+        <span class="tags" id="tags-editable-1" data-toggle="manual" data-type="checklist" 
+            data-value="{{stormPerms}}" data-original-title="Select Actions">
+        </span>
+       	<a href="#" id="tags-edit-1" data-editable="tags-editable-1" class="" style="margin-left:10px;">
+      		{{#if isModelNew}}
+       			<i class="icon-plus" title="Add"></i>
+       		{{else}}
+       			<i class="icon-pencil" title="Edit"></i>
+       		{{/if}}
+       	</a>
+</td>	
+{{else}}
+	{{#each permissions}}
+		<td style="cursor:pointer;">
+			<input data-id="{{./this.value}}" type="checkbox">
+		</td>
+	{{/each}}
+{{/if}}	
+
+<td>
+	<button type="button" class="btn btn-small btn-danger " data-action="delete">
+		<i class="icon-remove"></i>
+	</button>
+</td>
+

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/common/UserPermissionList.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/common/UserPermissionList.html b/security-admin/src/main/webapp/templates/common/UserPermissionList.html
new file mode 100644
index 0000000..58db2b7
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/common/UserPermissionList.html
@@ -0,0 +1,26 @@
+<div class="control-group">
+	<label class="control-label">{{tt 'lbl.userPermissions'}}</label>
+	<div class="controls">
+		<table class="table-permission table-condensed">
+			<thead>
+				<tr>
+					{{#each permHeaders}}
+					<th>{{./this}}</th>
+					{{/each}}
+
+				</tr>
+			</thead>
+			<tbody class="js-formInput">
+
+			</tbody>
+		</table>
+	</div>
+</div>
+<div class="control-group">
+	<div class="controls" style="margin-top:-14px">
+		<button type="button" class="btn btn-small" data-action="addUser" title="Add">
+			<!-- {{tt 'btn.add'}} -->
+			<i class="icon-plus"></i>
+		</button>
+	</div>
+</div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/common/XATableLayout_tmpl.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/common/XATableLayout_tmpl.html b/security-admin/src/main/webapp/templates/common/XATableLayout_tmpl.html
new file mode 100644
index 0000000..82006df
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/common/XATableLayout_tmpl.html
@@ -0,0 +1,6 @@
+<div class="position-relative">
+	<div data-id="r_tableList" class="table-responsive "> </div>
+	<div data-id="r_tableSpinner" class="" ></div>
+</div>
+<div data-id="r_pagination" class="pagination"></div>
+

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/common/breadcrumbs.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/common/breadcrumbs.html b/security-admin/src/main/webapp/templates/common/breadcrumbs.html
new file mode 100644
index 0000000..c0f0ea9
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/common/breadcrumbs.html
@@ -0,0 +1,30 @@
+{{!
+{
+"name" : "BreadCrumb "
+}
+}}
+
+<!-- <ul class="breadcrumb-flat">
+	{{#each breadcrumb}}
+	{{#if this.isLast}}
+	<li>
+		a href="javascript:;" style="cursor:default; text-decoration: none;color: none;">{{tt this.text}}</a<i class="{{this.iconClass}}"></i>{{tt this.text}}
+	</li>
+	li><i class="{{this.iconClass}}"></i><a href="{{this.href}}">{{tt this.text}}</a></li
+	{{else}}
+	<li>
+		<a href="{{this.href}}"> {{tt this.text}} </a>
+	</li>
+	{{/if}}
+	{{/each}}
+</ul>
+ -->
+ 
+ <ul class="breadcrumb-flat">
+	{{#each breadcrumb}}
+	<li>
+		<a href="{{./this.href}}"> {{tt ./this.text}} </a>
+	</li>
+	{{/each}}
+</ul>
+ 
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/common/formInputItem.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/common/formInputItem.html b/security-admin/src/main/webapp/templates/common/formInputItem.html
new file mode 100644
index 0000000..9fce62a
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/common/formInputItem.html
@@ -0,0 +1,38 @@
+<td>
+	<input  type="text" data-js="selectGroups" /> 	
+</td>
+
+{{#if policyKnox}}
+<td>
+	<input  type="text" data-js="ipAddress" placeholder="Enter IP address"/> 	
+</td>
+{{/if}}
+
+{{#if policyStorm}}
+<td>	
+        <span class="tags" id="tags-editable-1" data-toggle="manual" data-type="checklist" 
+            data-value="{{stormPerms}}" data-original-title="Select Actions">
+        </span>
+       	<a href="#" id="tags-edit-1" data-editable="tags-editable-1" class="" style="margin-left:10px;">
+      		{{#if isModelNew}}
+       			<i class="icon-plus" title="Add"></i>
+       		{{else}}
+       			<i class="icon-pencil" title="Edit"></i>
+       		{{/if}}
+       	</a>
+</td>	
+{{else}}
+	{{#each permissions}}
+		<td style="cursor:pointer;">
+			<input data-id="{{./this.value}}" type="checkbox">
+		</td>
+	{{/each}}
+{{/if}}	
+
+
+<td>
+	<button type="button" class="btn btn-small btn-danger " data-action="delete">
+		<i class="icon-remove"></i>
+	</button>
+</td>
+

http://git-wip-us.apache.org/repos/asf/incubator-argus/blob/7defc061/security-admin/src/main/webapp/templates/common/formInputItemList.html
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/templates/common/formInputItemList.html b/security-admin/src/main/webapp/templates/common/formInputItemList.html
new file mode 100644
index 0000000..6d0f0b6
--- /dev/null
+++ b/security-admin/src/main/webapp/templates/common/formInputItemList.html
@@ -0,0 +1,26 @@
+<div class="control-group">
+	<label class="control-label">{{tt 'lbl.groupPermissions'}}</label>
+	<div class="controls">
+		<table class="table-permission table-condensed">
+			<thead>
+				<tr>
+					{{#each permHeaders}}
+					<th>{{./this}}</th>
+					{{/each}}
+
+				</tr>
+			</thead>
+			<tbody class="js-formInput">
+
+			</tbody>
+		</table>
+	</div>
+</div>
+<div class="control-group">
+	<div class="controls" style="margin-top:-14px">
+		<button type="button" class="btn btn-small" data-action="addGroup" title="Add">
+			<!-- {{tt 'btn.add'}} -->
+			<i class="icon-plus"></i>
+		</button>
+	</div>
+</div>
\ No newline at end of file


Mime
View raw message