RANGER-2647 : Show display name instead of name in UI

Signed-off-by: Mehul Parikh <mehul@apache.org>
diff --git a/security-admin/src/main/webapp/scripts/models/RangerServiceDef.js b/security-admin/src/main/webapp/scripts/models/RangerServiceDef.js
index e5a28e8..6812a48 100644
--- a/security-admin/src/main/webapp/scripts/models/RangerServiceDef.js
+++ b/security-admin/src/main/webapp/scripts/models/RangerServiceDef.js
@@ -25,6 +25,7 @@
 	var XAUtils		= require('utils/XAUtils');
 	var XAEnums		= require('utils/XAEnums');
 	var localization= require('utils/XALangSupport');
+        var RangerService	= require('models/RangerService');
 
 	var RangerServiceDef = RangerServiceDefBase.extend(
 	/** @lends RangerServiceDef.prototype */
@@ -54,15 +55,16 @@
 
 			// Overwrite your schema definition here
 			return _.extend(attrs,{
-				displayName : {
-					type : 'Text',
-					title : 'Display Name'
-				},
 
 				name : {
 					type		: 'Text',
 					title		: 'Service Name *',
-                                        validators	: ['required',{type:'regexp',regexp:/^[a-zA-Z0-9_-][a-zA-Z0-9\s_-]{0,254}$/,message : localization.tt("validationMessages.nameValidationMsg")}],
+                    validators	: ['required',{type:'regexp', regexp:/^[a-zA-Z0-9_-][a-zA-Z0-9\s_-]{0,254}$/,message : localization.tt("validationMessages.nameValidationMsg")}],
+                },
+                displayName : {
+                    type : 'Text',
+                    title : 'Display Name',
+                    validators  : [{type:'regexp', regexp:/^[a-zA-Z0-9_-][a-zA-Z0-9\s_-]{0,254}$/, message : localization.tt("validationMessages.nameValidationMsg")}]
 				},
 				description : {
 					type		: 'TextArea',
@@ -96,7 +98,14 @@
 				width :'220px',
 				allowClear: true,
 				initSelection : function (element, callback) {
-                                        callback( { id:_.escape(element.val()), text:_.escape(element.val()) })
+                                        var rangerService = new RangerService()
+                                        rangerService.url = '/service/plugins/services/name/'+element.val();
+                                        rangerService.fetch( {
+                                                cache : false,
+                                                async : false,
+                                        }).done(function(m) {
+                                                callback( { id:_.escape(m.get('name')), text:_.escape(m.get('displayName')) })
+                                        })
 				},
 				ajax: { 
 					url: "service/plugins/services",
@@ -107,8 +116,10 @@
 					results: function (data, page) { 
 						var results = [];
 						if(data.resultSize != "0"){
-                                                        results = data.services.map(function(m, i){	return {id : _.escape(m.name), text: _.escape(m.name) };	});
-							return {results : results};
+                                                        results = data.services.map(function(m, i){	return {id : _.escape(m.name), text: _.escape(m.displayName) }});
+                                                }
+                                                if($.find('[name="tagService"]') && !_.isEmpty($.find('[name="tagService"]')[0].value)) {
+                                                        results = _.reject(results, function(m) {return m.id == $.find('[name="tagService"]')[0].value});
 						}
 						return {results : results};
 					},
diff --git a/security-admin/src/main/webapp/scripts/modules/XALinks.js b/security-admin/src/main/webapp/scripts/modules/XALinks.js
index dc3e417..5420f11 100755
--- a/security-admin/src/main/webapp/scripts/modules/XALinks.js
+++ b/security-admin/src/main/webapp/scripts/modules/XALinks.js
@@ -215,8 +215,8 @@
 				}
 				return {
 					href : href,
-					text : options.model.get('name') +' Policies',
-					title: options.model.get('name') +' Policies'
+                    text : options.model.get('displayName') +' Policies',
+                    title: options.model.get('displayName') +' Policies'
 				};
 			},
 			ManageHivePolicies : function(options){
diff --git a/security-admin/src/main/webapp/scripts/modules/globalize/message/en.js b/security-admin/src/main/webapp/scripts/modules/globalize/message/en.js
index 1695769..a559248 100644
--- a/security-admin/src/main/webapp/scripts/modules/globalize/message/en.js
+++ b/security-admin/src/main/webapp/scripts/modules/globalize/message/en.js
@@ -278,6 +278,7 @@
                 userWithGrantRolePrivilege      : 'Users (Grant privilege)',
                 groupWithGrantRolePrivilege      : 'Groups (Grant privilege)',
                 applicationType					: 'Application',
+                displayName						: 'Display Name',
 
 			},
 			btn : {
diff --git a/security-admin/src/main/webapp/scripts/views/policymanager/ServiceLayout.js b/security-admin/src/main/webapp/scripts/views/policymanager/ServiceLayout.js
index 1d95ff3..d190686 100644
--- a/security-admin/src/main/webapp/scripts/views/policymanager/ServiceLayout.js
+++ b/security-admin/src/main/webapp/scripts/views/policymanager/ServiceLayout.js
@@ -280,6 +280,7 @@
             var view = new RangerServiceViewDetail({
                 serviceDef : serviceDef,
                 rangerService : rangerService,
+                rangerSeviceList : that.services,
 
             });
             var modal = new Backbone.BootstrapModal({
diff --git a/security-admin/src/main/webapp/scripts/views/service/RangerServiceViewDetail.js b/security-admin/src/main/webapp/scripts/views/service/RangerServiceViewDetail.js
index 24aeedb..a79513b 100644
--- a/security-admin/src/main/webapp/scripts/views/service/RangerServiceViewDetail.js
+++ b/security-admin/src/main/webapp/scripts/views/service/RangerServiceViewDetail.js
@@ -35,17 +35,21 @@
 
                 template: RangerServiceViewDetailTmpl,
                 templateHelpers: function() {
-                    var that = this;
-
+                    var that = this, tagDetails = [];
+                    if(this.options.rangerService.get('tagService') && !_.isEmpty(this.options.rangerService.get('tagService'))) {
+                        tagDetails = this.options.rangerSeviceList.find(function(m) {
+                            return m.get('name') == that.options.rangerService.get('tagService')
+                        })
+                    }
                     return {
-               configsList : this.conf,
-               customConfigs : this.customConfigs,
-               serviceName : this.options.rangerService.get('name'),
-               description : this.options.rangerService.get('description'),
-               isEnabled   : this.options.rangerService.get('isEnabled'),
-               tagService  : (this.options.rangerService.get('tagService')) ? this.options.rangerService.get('tagService') : false,
-               displayName : this.options.rangerService.get('displayName'),
-           }
+                       configsList : this.conf,
+                       customConfigs : this.customConfigs,
+                       serviceName : this.options.rangerService.get('name'),
+                       description : this.options.rangerService.get('description'),
+                       isEnabled   : this.options.rangerService.get('isEnabled'),
+                       tagService  : (!_.isEmpty(tagDetails)) ? tagDetails.get('displayName') : false,
+                       displayName : this.options.rangerService.get('displayName'),
+                   }
                 },
 
                 /**
diff --git a/security-admin/src/main/webapp/scripts/views/service/ServiceForm.js b/security-admin/src/main/webapp/scripts/views/service/ServiceForm.js
index 59df159..653d3d5 100644
--- a/security-admin/src/main/webapp/scripts/views/service/ServiceForm.js
+++ b/security-admin/src/main/webapp/scripts/views/service/ServiceForm.js
@@ -82,7 +82,7 @@
 		* Override here ONLY if special case!!
 		*/
 
-		fields: ['displayName', 'name', 'description', 'isEnabled', 'type','configs', '_vPassword'],
+                fields: ['name', 'displayName', 'description', 'isEnabled', 'type','configs', '_vPassword'],
 
 		schema : function(){
 			var attrs = _.pick(_.result(this.rangerServiceDefModel,'schemaBase'), this.getSerivceBaseFieldNames());
@@ -225,7 +225,7 @@
 			}
 		},
 		getSerivceBaseFieldNames : function(){
-			 var fields = ['displayName', 'name', 'description', 'isEnabled','tagService']
+                         var fields = ['name', 'displayName', 'description', 'isEnabled','tagService']
 			 return this.rangerServiceDefModel.get('name') == XAEnums.ServiceType.SERVICE_TAG.label ? fields.slice(0,fields.indexOf("tagService")) : fields;
 		}
 	});
diff --git a/security-admin/src/main/webapp/templates/policies/RangerPolicyTableLayout_tmpl.html b/security-admin/src/main/webapp/templates/policies/RangerPolicyTableLayout_tmpl.html
index a2b930f..9dd14c7 100644
--- a/security-admin/src/main/webapp/templates/policies/RangerPolicyTableLayout_tmpl.html
+++ b/security-admin/src/main/webapp/templates/policies/RangerPolicyTableLayout_tmpl.html
@@ -33,7 +33,7 @@
 		{{/if}}		
 		</ul>
 </div>
-<h3 class="wrap-header bold"> {{tt 'lbl.listOfPolicies'}} : {{rangerService.attributes.name}} </h3>
+<h3 class="wrap-header bold"> {{tt 'lbl.listOfPolicies'}} : {{rangerService.attributes.displayName}} </h3>
 <div class="wrap non-collapsible m-height ">
 	<div>
         <div class="row-fluid margin-bottom-11">
diff --git a/security-admin/src/main/webapp/templates/service/RangerServiceViewDetail_tmpl.html b/security-admin/src/main/webapp/templates/service/RangerServiceViewDetail_tmpl.html
index e3a2e67..978d785 100644
--- a/security-admin/src/main/webapp/templates/service/RangerServiceViewDetail_tmpl.html
+++ b/security-admin/src/main/webapp/templates/service/RangerServiceViewDetail_tmpl.html
@@ -22,14 +22,6 @@
         <tbody>
             <tr>
                 <td>
-                    {{tt 'lbl.displayName'}}
-                </td>
-                <td>
-                    {{displayName}}
-                </td>
-            </tr>
-            <tr>
-                <td>
                     {{tt 'lbl.serviceName'}}
                 </td>
                 <td>
@@ -38,6 +30,14 @@
             </tr>
             <tr>
                 <td>
+                    {{tt 'lbl.displayName'}}
+                </td>
+                <td>
+                    {{displayName}}
+                </td>
+            </tr>
+            <tr>
+                <td>
                     {{tt 'lbl.description'}}
                 </td>
                 {{#if description}}