Repository: ranger
Updated Branches:
  refs/heads/master b041df1dd -> 009cef8ab


RANGER-2116: Fix policy condition widget's usability on resource and tag based 
policies authoring pages

Signed-off-by: Mehul Parikh <[email protected]>


Project: http://git-wip-us.apache.org/repos/asf/ranger/repo
Commit: http://git-wip-us.apache.org/repos/asf/ranger/commit/009cef8a
Tree: http://git-wip-us.apache.org/repos/asf/ranger/tree/009cef8a
Diff: http://git-wip-us.apache.org/repos/asf/ranger/diff/009cef8a

Branch: refs/heads/master
Commit: 009cef8ab75f724eaf0282529e4e1975d65234e6
Parents: b041df1
Author: ni3galave <[email protected]>
Authored: Wed May 30 19:02:16 2018 +0530
Committer: Mehul Parikh <[email protected]>
Committed: Thu May 31 09:36:07 2018 +0530

----------------------------------------------------------------------
 .../scripts/modules/globalize/message/en.js     |  3 +-
 .../scripts/views/policies/PermissionList.js    | 48 ++++++++++++++++++--
 security-admin/src/main/webapp/styles/xa.css    | 11 +++++
 3 files changed, 57 insertions(+), 5 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/ranger/blob/009cef8a/security-admin/src/main/webapp/scripts/modules/globalize/message/en.js
----------------------------------------------------------------------
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 a45bc8b..f4c3c27 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
@@ -466,7 +466,8 @@ define(function(require) {
                                groupNameValidationMsg :'1. Group name should 
be start with alphabet / numeric / underscore / non-us characters.<br> 2. 
Allowed special character ,._\-+/@= and space. <br>3. Name length should be 
greater than one.',
                 firstNameValidationMsg :'1. First name should be start with 
alphabet / numeric / underscore / non-us characters.<br> 2. Allowed special 
character ._-@ and space. <br>3. Name length should be greater than one.',
                 lastNameValidationMsg  :'1. Last name should be start with 
alphabet / numeric / underscore / non-us characters.<br> 2. Allowed special 
character ._-@ and space. <br>3. Name length should be greater than one.',
-                setTimeZoneErrorMsg    :'Please select Start/End date for Time 
zone'
+                setTimeZoneErrorMsg    :'Please select Start/End date for Time 
zone',
+                jsValidationMsg        :'1. JavaScript Condition Examples 
:\ncountry_code == \'USA\', time_range >= 900 && time_range <= 1800 etc.\n2. 
Dragging bottom-right corner of javascript condition editor(Textarea) can 
resizable',
                        },
                        serverMsg : {
 

http://git-wip-us.apache.org/repos/asf/ranger/blob/009cef8a/security-admin/src/main/webapp/scripts/views/policies/PermissionList.js
----------------------------------------------------------------------
diff --git 
a/security-admin/src/main/webapp/scripts/views/policies/PermissionList.js 
b/security-admin/src/main/webapp/scripts/views/policies/PermissionList.js
index 7af226f..2b996b0 100644
--- a/security-admin/src/main/webapp/scripts/views/policies/PermissionList.js
+++ b/security-admin/src/main/webapp/scripts/views/policies/PermissionList.js
@@ -635,8 +635,16 @@ define(function(require) {
                        if(this.policyConditions.length > 0){
                                var tmpl = 
_.map(this.policyConditions,function(obj){
                                        if(!_.isUndefined(obj.evaluatorOptions) 
&& !_.isUndefined(obj.evaluatorOptions['ui.isMultiline']) && 
Boolean(obj.evaluatorOptions['ui.isMultiline'])){
-                                               return '<div 
class="editable-address margin-bottom-5"><label style="display:block 
!important;"><span>'+obj.label+' : </span><i title="JavaScript Condition 
Examples :\ncountry_code == \'USA\', time_range >= 900 && time_range <= 1800 
etc." class="icon-info-sign" style="float: right;margin-top: 6px;"></i>\
-                                               </label><textarea 
name="'+obj.name+'" placeholder="Please enter condition.."></textarea></div>'
+                                               return '<div 
class="editable-address margin-bottom-5">\
+                                                           <label 
style="display:block !important;">\
+                                                               
<span>'+obj.label+' : </span>\
+                                                               <i 
title="'+localization.tt('validationMessages.jsValidationMsg')+'" 
class="icon-info-sign" style="float: right;margin-top: 6px;"></i>\
+                                                           </label>\
+                                                           <textarea 
class="textAreaContainer" name="'+obj.name+'" placeholder="Please enter 
condition.."></textarea>\
+                                                           <div 
class="jsValidation">\
+                                                               <a 
href="javascript:;"class="jsValidationCheck btn btn-defult btn-mini" 
style="margin: 5px">Syntax check</a>\
+                                                           </div>\
+                                                      </div>'
                                        }
                                        return '<div class="editable-address 
margin-bottom-5"><label style="display:block !important;"><span>'+obj.label+' : 
</span></label><input type="text" name="'+obj.name+'" ></div>'
                                                
@@ -699,7 +707,12 @@ define(function(require) {
                                                }
                                        },
                                        validate:function(value){
-                                               var error = {'flag' : false};
+                                           
if(that.$el.find('.textAreaContainer').hasClass('errorClass') ||
+                                                   
that.$el.find('.jsValidation span').hasClass('validSyntax')){
+                                               
that.$el.find('.textAreaContainer').removeClass('errorClass');
+                                               
that.$el.find('.jsValidation').find('span').remove();
+                        }
+                                           var error = {'flag' : false};
                                                _.each(value, function(val, 
name){
                                                        var tmp = 
_.findWhere(that.multiLinecond, { 'name' : name});
                                                        if(!_.isUndefined(tmp)){
@@ -722,12 +735,39 @@ define(function(require) {
                                                        return error.message;
                                                }
                                    },
+                               }).on('shown', function(e){
+                                   
that.$el.find('.jsValidationCheck').on('click',function(e){
+                                       e.stopPropagation();
+                                       var $textArea = 
$(e.currentTarget).parent().parent();
+                                       if(that.$el.find('.editableform 
div.control-group').hasClass('error')){
+                                           that.$el.find('.editableform 
div.control-group').removeClass('error');
+                                           
that.$el.find('.editable-error-block').remove();
+                                       }
+                                       
if($textArea.find('.textAreaContainer').hasClass('errorClass') || 
$textArea.find('.jsValidation span').hasClass('validSyntax')){
+                                           
$textArea.find('.textAreaContainer').removeClass('errorClass');
+                                           
$textArea.find('.jsValidation').find('span').remove();
+                                       }
+                                       var tmp = 
$textArea.find('textarea').val();
+                        if(!_.isUndefined(tmp) && ! _.isEmpty(tmp)){
+                                           var errorMessage;
+                            try {
+                                var t = esprima.parse(tmp);
+                            }catch(e){
+                                errorMessage = e.message;
+                            }
+                            if(!_.isUndefined(errorMessage)){
+                                
$textArea.find('.textAreaContainer').addClass('errorClass');
+                                $textArea.find('.jsValidation').append('<span 
class="text-color-red">'+errorMessage+'</span>');
+                            }else{
+                                $textArea.find('.jsValidation').append('<span 
class="validSyntax">valid javascript condition</span>');
+                            }
+                        }
+                                   })
                                });
                                that.ui.addConditionsSpan.click(function(e) {
                                        e.stopPropagation();
                                        
that.$('#policyConditions').editable('toggle');
                                });
-                               
                        }else{
                            that.model.unset('conditions');
                        }

http://git-wip-us.apache.org/repos/asf/ranger/blob/009cef8a/security-admin/src/main/webapp/styles/xa.css
----------------------------------------------------------------------
diff --git a/security-admin/src/main/webapp/styles/xa.css 
b/security-admin/src/main/webapp/styles/xa.css
index 00809bc..b895331 100644
--- a/security-admin/src/main/webapp/styles/xa.css
+++ b/security-admin/src/main/webapp/styles/xa.css
@@ -2373,4 +2373,15 @@ textarea:read-only{
     overflow: hidden;
     white-space: nowrap;
     display: block;
+}
+.textAreaContainer {
+    width: 370px;
+    height: 170px;
+}
+.errorClass {
+    border-color: #b85355;
+    color: #b85355;
+}
+.validSyntax {
+    color: #3e910f;
 }
\ No newline at end of file

Reply via email to