Added TPS UI for managing user roles.

The TPS UI has been modified to provide an interface to manage
the user roles.

The ErrorDialog was modified to handle both text and JSON error
responses.

https://fedorahosted.org/pki/ticket/2267

5 files changed, 225 insertions, 14 deletions

diff --git a/base/tps/shared/webapps/tps/js/token.js b/base/tps/shared/webapps/tps/js/token.js
index 5c7bc0ca7..fe53becca 100644
--- a/base/tps/shared/webapps/tps/js/token.js
+++ b/base/tps/shared/webapps/tps/js/token.js
@@ -198,14 +198,13 @@ var TokenPage = EntryPage.extend({
 
                     self.model.changeStatus({
                         status: dialog.entry.status,
-                        success: function(data, textStatus, jqXHR) {
+                        success: function(data, textStatus, response) {
                             self.render();
                         },
-                        error: function(jqXHR, textStatus, errorThrow) {
+                        error: function(response, textStatus, errorThrow) {
                             new ErrorDialog({
                                 el: $("#error-dialog"),
-                                title: "HTTP Error " + jqXHR.responseJSON.Code,
-                                content: jqXHR.responseJSON.Message
+                                response: response
                             }).open();
                         }
                     });
@@ -334,14 +333,13 @@ var TokenTableItem = TableItem.extend({
 
                 model.changeStatus({
                     status: dialog.entry.status,
-                    success: function(data, textStatus, jqXHR) {
+                    success: function(data, textStatus, response) {
                         self.table.render();
                     },
-                    error: function(jqXHR, textStatus, errorThrow) {
+                    error: function(response, textStatus, errorThrow) {
                         new ErrorDialog({
                             el: $("#error-dialog"),
-                            title: "HTTP Error " + jqXHR.responseJSON.Code,
-                            content: jqXHR.responseJSON.Message
+                            response: response
                         }).open();
                     }
                 });
diff --git a/base/tps/shared/webapps/tps/js/user.js b/base/tps/shared/webapps/tps/js/user.js
index f9f43c34f..49835f004 100644
--- a/base/tps/shared/webapps/tps/js/user.js
+++ b/base/tps/shared/webapps/tps/js/user.js
@@ -82,6 +82,74 @@ var UserCollection = Collection.extend({
     }
 });
 
+var UserRoleModel = Model.extend({
+    url: function() {
+        var self = this;
+
+        var userID = self.get("userID");
+        var url = "/tps/rest/admin/users/" + userID + "/memberships";
+
+        if (self.id) url = url + "/" + self.id;
+
+        return url;
+    },
+    parseResponse: function(response) {
+        return {
+            id: response.id,
+            roleID: response.id,
+            userID: response.UserID
+        };
+    },
+    createRequest: function(entry) {
+        return {
+            id: entry.roleID,
+            UserID: entry.userID
+        };
+    },
+    save: function(attributes, options) {
+        var self = this;
+        $.ajax({
+            type: "POST",
+            url: self.url(),
+            dataType: "json",
+            data: attributes.roleID,
+        }).done(function(data, textStatus, response) {
+            self.set(self.parseResponse(data));
+            if (options.success) options.success.call(self, self, response, options);
+        }).fail(function(response, textStatus, errorThrown) {
+            if (options.error) options.error.call(self, self, response, options);
+        });
+    }
+});
+
+var UserRoleCollection = Collection.extend({
+    initialize: function(models, options) {
+        var self = this;
+        UserRoleCollection.__super__.initialize.call(self, models, options);
+        options = options || {};
+        self.userID = options.userID;
+        self.urlRoot = "/tps/rest/admin/users/" + self.userID + "/memberships";
+    },
+    getEntries: function(response) {
+        return response.Membership;
+    },
+    getLinks: function(response) {
+        return response.Link;
+    },
+    model: function(attrs, options) {
+        return new UserRoleModel({
+            userID: this.userID
+        });
+    },
+    parseEntry: function(entry) {
+        return new UserRoleModel({
+            id: entry.id,
+            roleID: entry.id,
+            userID: entry.UserID
+        });
+    }
+});
+
 var UserProfilesTableItem = TableItem.extend({
     initialize: function(options) {
         var self = this;
@@ -199,10 +267,8 @@ var UserPage = EntryPage.extend({
 
         UserPage.__super__.setup.call(self);
 
-        var dialog = self.$("#user-profile-dialog");
-
-        var addDialog = new Dialog({
-            el: dialog,
+        var addProfileDialog = new Dialog({
+            el: self.$("#user-profile-dialog"),
             title: "Add Profile",
             actions: ["cancel", "add"]
         });
@@ -212,11 +278,17 @@ var UserPage = EntryPage.extend({
 
         self.profilesTable = new UserProfilesTable({
             el: self.profilesList,
-            addDialog: addDialog,
+            addDialog: addProfileDialog,
             pageSize: 10,
             parent: self
         });
 
+        self.showRolesAction = $("[name='showRoles']", self.viewMenu);
+
+        $("a", self.showRolesAction).click(function(e) {
+            e.preventDefault();
+            window.location.hash = window.location.hash + "/roles";
+        });
     },
     saveFields: function() {
         var self = this;
@@ -302,3 +374,32 @@ var UsersPage = Page.extend({
         table.render();
     }
 });
+
+var UserRolesPage = Page.extend({
+    load: function() {
+        var self = this;
+
+        if (self.collection && self.collection.options && self.collection.options.userID) {
+            $(".breadcrumb li[name='user'] a")
+                .attr("href", "#users/" + self.collection.options.userID)
+                .text("User " + self.collection.options.userID);
+            $(".pki-title").text("Roles for User " + self.collection.options.userID);
+        }
+
+        var addRoleDialog = new Dialog({
+            el: self.$("#user-role-dialog"),
+            title: "Add Role",
+            readonly: ["userID"],
+            actions: ["cancel", "add"]
+        });
+
+        var table = new ModelTable({
+            el: self.$("table[name='roles']"),
+            pageSize: 10,
+            addDialog: addRoleDialog,
+            collection: self.collection
+        });
+
+        table.render();
+    }
+});
diff --git a/base/tps/shared/webapps/tps/ui/index.html b/base/tps/shared/webapps/tps/ui/index.html
index 16867c193..9446cfbf4 100644
--- a/base/tps/shared/webapps/tps/ui/index.html
+++ b/base/tps/shared/webapps/tps/ui/index.html
@@ -314,7 +314,7 @@ $(function() {
         new CertificatesPage({
             el: content,
             url: "certs.html",
-            collection: new CertificateCollection({ tokenID: id })
+            collection: new CertificateCollection(null, { tokenID: id })
         }).open();
     });
 
@@ -346,6 +346,14 @@ $(function() {
         }).open();
     });
 
+    router.route("users/:id/roles", "user-roles", function(id) {
+        new UserRolesPage({
+            el: content,
+            url: "user-roles.html",
+            collection: new UserRoleCollection(null, { userID: id })
+        }).open();
+    });
+
     router.route("new-user", "new-user", function() {
         new UserPage({
             el: content,
diff --git a/base/tps/shared/webapps/tps/ui/user-roles.html b/base/tps/shared/webapps/tps/ui/user-roles.html
new file mode 100644
index 000000000..a9f7702b1
--- /dev/null
+++ b/base/tps/shared/webapps/tps/ui/user-roles.html
@@ -0,0 +1,103 @@
+<!-- --- BEGIN COPYRIGHT BLOCK ---
+     This program is free software; you can redistribute it and/or modify
+     it under the terms of the GNU General Public License as published by
+     the Free Software Foundation; version 2 of the License.
+
+     This program is distributed in the hope that it will be useful,
+     but WITHOUT ANY WARRANTY; without even the implied warranty of
+     MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+     GNU General Public License for more details.
+
+     You should have received a copy of the GNU General Public License along
+     with this program; if not, write to the Free Software Foundation, Inc.,
+     51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
+
+     Copyright (C) 2013 Red Hat, Inc.
+     All rights reserved.
+     --- END COPYRIGHT BLOCK --- -->
+<div class="pki-header">
+<ol class="breadcrumb">
+    <li><a href="#">Home</a></li>
+    <li><a href="#users">Users</a></li>
+    <li name="user"><a href="#users/${userID}">User ${id}</a></li>
+    <li class="active"><strong>Roles</strong></li>
+</ol>
+
+<span class="pki-title">User Roles</span>
+</div>
+
+<table name="roles">
+<thead>
+    <tr>
+         <th class="pki-table-actions" colspan="10">
+             <span name="search">
+                 <input name="search" type="text" placeholder="Search...">
+             </span>
+             <span class="pki-table-buttons">
+                 <button name="add">Add</button>
+                 <button name="remove">Remove</button>
+             </span>
+         </th>
+    </tr>
+    <tr>
+        <th class="pki-select-column"><input id="roles-selectall" type="checkbox"><label for="roles-selectall">&nbsp;</label></tdh>
+        <th>Role ID</th>
+    </tr>
+</thead>
+<tbody>
+    <tr>
+        <td class="pki-select-column"><input id="roles-select" type="checkbox"><label for="roles-select">&nbsp;</label></td>
+        <td name="id">${id}</td>
+    </tr>
+</tbody>
+<tfoot>
+    <tr>
+         <th class="pki-table-actions" colspan="10">
+             <div class="pki-table-info">
+                 Total: <span name="totalEntries">0</span> entries
+             </div>
+             <div class="pki-page-controls">
+                 <ul class="pagination">
+                     <li><a href="#" name="first"><span class="i fa fa-angle-double-left"></span></a></li>
+                     <li><a href="#" name="prev"><span class="i fa fa-angle-left"></span></a></li>
+                 </ul>
+                 <span class="pki-page-jump">
+                     <input name="page" type="text" value="1"> of <span name="totalPages">1</span>
+                 </span>
+                 <ul class="pagination">
+                     <li><a href="#" name="next"><span class="i fa fa-angle-right"></span></a></li>
+                     <li><a href="#" name="last"><span class="i fa fa-angle-double-right"></span></a></li>
+                 </ul>
+             </div>
+         </th>
+    </tr>
+</tfoot>
+</table>
+
+<div id="user-role-dialog" class="modal">
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
+                    <span class="pficon pficon-close"></span>
+                </button>
+                <h4 class="modal-title">User Role</h4>
+            </div>
+            <div class="modal-body">
+                <fieldset>
+                    <label>User ID</label>
+                    <input name="userID" readonly="readonly"><br>
+                    <label>Role ID</label>
+                    <input name="roleID" readonly="readonly"><br>
+                    <label></label>
+                    Enter an existing group name.<br>
+                </fieldset>
+            </div>
+            <div class="modal-footer">
+                <button name="add" class="btn btn-primary">Add</button>
+                <button name="close" class="btn btn-primary">Close</button>
+                <button name="cancel" class="btn btn-default" data-dismiss="modal">Cancel</button>
+            </div>
+        </div>
+    </div>
+</div>
diff --git a/base/tps/shared/webapps/tps/ui/user.html b/base/tps/shared/webapps/tps/ui/user.html
index 435349e5a..22ca2575a 100644
--- a/base/tps/shared/webapps/tps/ui/user.html
+++ b/base/tps/shared/webapps/tps/ui/user.html
@@ -28,6 +28,7 @@
 
 <ul name="view" class="pki-actions-menu">
 <li name="edit"><a href="#">Edit</a></li>
+<li name="showRoles"><a href="#">Show Roles</a></li>
 </ul>
 
 <span name="edit" class="pki-actions-menu" style="display: none;">