ading role filtering and ui fixes

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.role.create/create.hbs

@@ -43,10 +43,11 @@
         <div class="row">
             <div class="col-md-12">
                 <!-- content -->
-            <div id="role-create-form" class="container col-centered wr-content">
+                <div id="role-create-form" data-cloud={{isCloud}} class="container col-centered wr-content
+                ">
                 <div class="wr-form">
                     <p class="page-sub-title">Add Role</p>
-                    <hr />
+                    <hr/>
                     <div class="row">
                         <div class="col-lg-8">
                             <div class="wr-steps">
@@ -62,10 +63,10 @@
                                         <div class="wiz-lbl hidden-xs"><span>Assign permissions</span></div>
                                     </div>
                                 </div>
-                                <br class="c-both" />
+                                <br class="c-both"/>
                             </div>
-                            <br /><br />
+                            <br/><br/>
-                            <hr />
+                            <hr/>
                             <div id="role-create-error-msg" class="alert alert-danger hidden" role="alert">
                                 <i class="icon fw fw-error"></i><span></span>
                             </div>
@@ -91,7 +92,7 @@
                             <div id="roleNameField" class="form-group wr-input-control">
                                 <!--suppress HtmlFormInputWithoutLabel -->
                                 <input type="text" id="roleName" data-regex="{{roleNameJSRegEx}}"
-                                       data-error-msg="{{roleNameRegExViolationErrorMsg}}" class="form-control" />
+                                       data-error-msg="{{roleNameRegExViolationErrorMsg}}" class="form-control"/>
                                 <span class="roleNameError hidden glyphicon glyphicon-remove form-control-feedback"></span>
                                 <label class="error roleNameEmpty hidden" for="summary">
                                     Role name is required, should be in minimum 3 characters long and not include any
@@ -119,7 +120,7 @@
                     <p class="page-sub-title">Role was added successfully.</p>
                     <br>Please click <b>"Add Another Role"</b>, if you wish to add another role or click
                     <b>"View Role List"</b> to complete the process and go back to the role list.
-                    <hr />
+                    <hr/>
                     <button class="wr-btn" onclick="window.location.href='{{@app.context}}/roles'">
                         View Role List
                     </button>

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.role.create/create.js

@@ -38,6 +38,7 @@ function onRequest(context) {
     if (userModule.isAuthorized("/permission/admin/device-mgt/users/view")) {
         displayData.canViewUsers = true;
     }
+    displayData.isCloud = deviceMgtProps.isCloud;
 
     return displayData;
 }

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.role.create/public/js/bottomJs.js

@@ -33,6 +33,8 @@ var clearInline = {};
 
 var apiBasePath = "/api/device-mgt/v1.0";
 var domain = $("#domain").val();
+var isCloud = $("#role-create-form").data("cloud");
+
 
 var enableInlineError = function (inputField, errorMsg, errorSign) {
     var fieldIdentifier = "#" + inputField;
@@ -84,18 +86,18 @@ clearInline["role-name"] = function () {
 validateInline["role-name"] = function () {
     var roleNameInput = $("input#roleName");
     var roleName = roleNameInput.val();
-    if (inputIsValid( roleNameInput.data("regex"), roleName) && roleName.indexOf("@") < 0 && roleName.indexOf("/") < 0) {
+    if (inputIsValid(roleNameInput.data("regex"), roleName) && roleName.indexOf("@") < 0 && roleName.indexOf("/") < 0) {
         disableInlineError("roleNameField", "roleNameEmpty", "roleNameError");
     } else {
         enableInlineError("roleNameField", "roleNameEmpty", "roleNameError");
     }
 };
 
-function formatRepo (user) {
+function formatRepo(user) {
     if (user.loading) {
         return user.text
     }
-    if (!user.username){
+    if (!user.username) {
         return;
     }
     var markup = '<div class="clearfix">' +
@@ -109,14 +111,16 @@ function formatRepo (user) {
     return markup;
 }
 
-function formatRepoSelection (user) {
+function formatRepoSelection(user) {
     return user.username || user.text;
 }
 
 $(document).ready(function () {
+    isCloud = $("#role-create-form").data("cloud");
+
     var appContext = $("#app-context").data("app-context");
     $("#users").select2({
-        multiple:true,
+        multiple: true,
         tags: false,
         ajax: {
             url: appContext + "/api/invoker/execute/",
@@ -140,7 +144,7 @@ $(document).ready(function () {
                     var user = {};
                     user.id = value.username;
                     user.username = value.username;
-                    if(value.firstname && value.lastname) {
+                    if (value.firstname && value.lastname) {
                         user.name = value.firstname + " " + value.lastname;
                     }
                     newData.push(user);
@@ -151,7 +155,9 @@ $(document).ready(function () {
             },
             cache: true
         },
-        escapeMarkup: function (markup) { return markup; }, // let our custom formatter work
+        escapeMarkup: function (markup) {
+            return markup;
+        }, // let our custom formatter work
         minimumInputLength: 1,
         templateResult: formatRepo, // omitted for brevity, see the source of this page
         templateSelection: formatRepoSelection // omitted for brevity, see the source of this page
@@ -163,6 +169,7 @@ $(document).ready(function () {
      * on Add Role page in WSO2 MDM Console.
      */
     $("button#add-role-btn").click(function () {
+
         var domain = $("#domain").val();
         var roleNameInput = $("input#roleName");
         var roleName = roleNameInput.val();
@@ -185,8 +192,12 @@ $(document).ready(function () {
             $(errorMsgWrapper).removeClass("hidden");
         } else {
             var addRoleFormData = {};
+            if (isCloud) {
+                addRoleFormData.roleName = "devicemgt" + roleName;
+            } else {
                 addRoleFormData.roleName = roleName;
-            if (domain != "PRIMARY"){
+            }
+            if (domain != "PRIMARY") {
                 addRoleFormData.roleName = domain + "/" + roleName;
             }
             if (users == null) {
@@ -220,11 +231,11 @@ $(document).ready(function () {
     });
 
     var roleNameInputElement = "#roleName";
-    $(roleNameInputElement).focus(function() {
+    $(roleNameInputElement).focus(function () {
         clearInline["role-name"]();
     });
 
-    $(roleNameInputElement).blur(function() {
+    $(roleNameInputElement).blur(function () {
         validateInline["role-name"]();
     });
 

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.roles/public/js/role-listing.js

@@ -37,6 +37,7 @@ var modalPopupContainer = modalPopup + " .modal-content";
 var modalPopupContent = modalPopup + " .modal-content";
 var body = "body";
 var isInit = true;
+var isCloud = false;
 
 
 /**
@@ -72,7 +73,7 @@ function showPopup() {
 function hidePopup() {
     $(modalPopupContent).html('');
     $(modalPopup).modal('hide');
-    $('body').removeClass('modal-open').css('padding-right','0px');
+    $('body').removeClass('modal-open').css('padding-right', '0px');
     $('.modal-backdrop').remove();
 }
 
@@ -86,11 +87,12 @@ function InitiateViewOption() {
     // $(location).attr('href', $(this).data("url"));
 }
 
-function htmlspecialchars(text){
+function htmlspecialchars(text) {
     return jQuery('<div/>').text(text).html();
 }
 
 function loadRoles() {
+    isCloud = $("#role-table").data("cloud");
     var loadingContent = $("#loading-content");
     loadingContent.show();
 
@@ -98,21 +100,40 @@ function loadRoles() {
         data = JSON.parse(data);
 
         var objects = [];
-
+        var count = 0;
         $(data.roles).each(function (index) {
+            if (isCloud && data.roles[index].startsWith("devicemgt")) {
+                count++;
                 objects.push(
                     {
                         name: htmlspecialchars(data.roles[index]),
                         DT_RowId: "role-" + htmlspecialchars(data.roles[index])
                     }
                 )
+            } else if (!isCloud) {
+                objects.push(
+                    {
+                        name: htmlspecialchars(data.roles[index]),
+                        DT_RowId: "role-" + htmlspecialchars(data.roles[index])
+                    }
+                )
+            }
         });
 
-        var json = {
+        var json = {};
+        if (isCloud) {
+            json = {
+                "recordsTotal": count,
+                "recordsFiltered": count,
+                "data": objects
+            };
+        } else {
+            json = {
                 "recordsTotal": data.count,
                 "recordsFiltered": data.count,
                 "data": objects
             };
+        }
 
         return JSON.stringify(json);
     };
@@ -143,7 +164,7 @@ function loadRoles() {
             data: null,
             render: function (data, type, row, meta) {
                 var isCloud = false;
-                if ($('#is-cloud').length > 0){
+                if ($('#is-cloud').length > 0) {
                     isCloud = true;
                 }
 

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.roles/roles.hbs

@@ -53,22 +53,23 @@
     <div id="loading-content" class="col-centered">
         {{#unless isCloud}}
             {{#if removePermitted}}
-            <input type="hidden" id="can-remove" value="true" />
+                <input type="hidden" id="can-remove" value="true"/>
             {{/if}}
             {{#if editPermitted}}
-            <input type="hidden" id="can-edit" value="true" />
+                <input type="hidden" id="can-edit" value="true"/>
             {{/if}}
         {{/unless}}
         {{#if isCloud}}
-            <input type="hidden" id="is-cloud" value="true" />
+            <input type="hidden" id="is-cloud" value="true"/>
         {{/if}}
         <i class="fw fw-settings fw-spin fw-2x"></i>
         Loading roles . . .
         <br>
     </div>
 
-    <div id="role-table" data-role={{adminRole}}>
+    <div id="role-table" data-cloud={{isCloud}} data-role={{adminRole}}>
-        <table class="table table-striped table-hover list-table display responsive nowrap data-table grid-view" id="role-grid">
+        <table class="table table-striped table-hover list-table display responsive nowrap data-table grid-view"
+               id="role-grid">
             <thead>
             <tr class="sort-row">
                 <th>By Role Name</th>