GUAC-1406: Add user filtering on settings tab.

2025-09-06 21:27:40 +00:00 · 2015-12-02 22:29:35 -08:00
parent 87925d9dc6
commit 400afcba64
14 changed files with 147 additions and 47 deletions
--- a/guacamole/src/main/webapp/app/index/config/indexRouteConfig.js
+++ b/guacamole/src/main/webapp/app/index/config/indexRouteConfig.js
@@ -150,7 +150,7 @@ angular.module('index').config(['$routeProvider', '$locationProvider',
        })

        // User editor
-        .when('/manage/:dataSource/users/:id', {
+        .when('/manage/:dataSource/users/:id?', {
            title         : 'APP.NAME',
            bodyClassName : 'manage',
            templateUrl   : 'app/manage/templates/manageUser.html',
--- a/guacamole/src/main/webapp/app/manage/controllers/manageUserController.js
+++ b/guacamole/src/main/webapp/app/manage/controllers/manageUserController.js
@@ -82,7 +82,8 @@ angular.module('manage').controller('manageUserController', ['$scope', '$injecto
    var selectedDataSource = $routeParams.dataSource;

    /**
-     * The username of the user being edited.
+     * The username of the user being edited. If a new user is
+     * being created, this will not be defined.
     *
     * @type String
     */
@@ -289,6 +290,22 @@ angular.module('manage').controller('manageUserController', ['$scope', '$injecto

    };

+    /**
+     * Returns whether the current user can edit the username of the user being
+     * edited within the given data source.
+     *
+     * @param {String} [dataSource]
+     *     The identifier of the data source to check. If omitted, this will
+     *     default to the currently-selected data source.
+     *
+     * @returns {Boolean}
+     *     true if the current user can edit the username of the user being
+     *     edited, false otherwise.
+     */
+    $scope.canEditUsername = function canEditUsername(dataSource) {
+        return !username;
+    };
+
    /**
     * Returns whether the current user can save the user being edited within
     * the given data source. Saving will create or update that user depending
@@ -423,31 +440,47 @@ angular.module('manage').controller('manageUserController', ['$scope', '$injecto
        $scope.attributes = attributes;
    });

-    // Pull user data
-    dataSourceService.apply(userService.getUser, dataSources, username)
-    .then(function usersReceived(users) {
+    // Pull user data and permissions if we are editing an existing user
+    if (username) {

-        // Get user for currently-selected data source
-        $scope.users = users;
-        $scope.user  = users[selectedDataSource];
+        // Pull user data
+        dataSourceService.apply(userService.getUser, dataSources, username)
+        .then(function usersReceived(users) {

-        // Create skeleton user if user does not exist
-        if (!$scope.user)
-            $scope.user = new User({
-                'username' : username
-            });
+            // Get user for currently-selected data source
+            $scope.users = users;
+            $scope.user  = users[selectedDataSource];

-    });
+            // Create skeleton user if user does not exist
+            if (!$scope.user)
+                $scope.user = new User({
+                    'username' : username
+                });

-    // Pull user permissions
-    permissionService.getPermissions(selectedDataSource, username).success(function gotPermissions(permissions) {
-        $scope.permissionFlags = PermissionFlagSet.fromPermissionSet(permissions);
-    })
+        });

-    // If permissions cannot be retrieved, use empty permissions
-    .error(function permissionRetrievalFailed() {
+        // Pull user permissions
+        permissionService.getPermissions(selectedDataSource, username).success(function gotPermissions(permissions) {
+            $scope.permissionFlags = PermissionFlagSet.fromPermissionSet(permissions);
+        })
+
+        // If permissions cannot be retrieved, use empty permissions
+        .error(function permissionRetrievalFailed() {
+            $scope.permissionFlags = new PermissionFlagSet();
+        });
+    }
+
+    // Use skeleton data if we are creating a new user
+    else {
+
+        // No users exist regardless of data source if there is no username
+        $scope.users = {};
+
+        // Use skeleton user object with no associated permissions
+        $scope.user = new User();
        $scope.permissionFlags = new PermissionFlagSet();
-    });
+
+    }

    // Retrieve all connections for which we have ADMINISTER permission
    dataSourceService.apply(
--- a/guacamole/src/main/webapp/app/manage/styles/manage-user.css
+++ b/guacamole/src/main/webapp/app/manage/styles/manage-user.css
@@ -24,10 +24,6 @@
    margin-bottom: 0;
 }

-.manage-user .username.header h2 {
-    text-transform: none;
-}
-
 .manage-user .page-tabs .page-list li.read-only a[href],
 .manage-user .page-tabs .page-list li.unlinked  a[href],
 .manage-user .page-tabs .page-list li.linked    a[href] {
--- a/guacamole/src/main/webapp/app/manage/templates/manageUser.html
+++ b/guacamole/src/main/webapp/app/manage/templates/manageUser.html
@@ -24,7 +24,7 @@ THE SOFTWARE.

    <!-- User header and data source tabs -->
    <div class="username header">
-        <h2>{{user.username}}</h2>
+        <h2>{{'MANAGE_USER.SECTION_HEADER_EDIT_USER' | translate}}</h2>
        <guac-user-menu></guac-user-menu>
    </div>
    <div class="page-tabs">
@@ -42,6 +42,13 @@ THE SOFTWARE.
        <!-- User password section -->
        <div class="section">
            <table class="properties">
+                <tr>
+                    <th>{{'MANAGE_USER.FIELD_HEADER_USERNAME' | translate}}</th>
+                    <td>
+                        <input ng-show="canEditUsername()" ng-model="user.username" type="text"/>
+                        <span  ng-hide="canEditUsername()">{{user.username}}</span>
+                    </td>
+                </tr>
                <tr>
                    <th>{{'MANAGE_USER.FIELD_HEADER_PASSWORD' | translate}}</th>
                    <td><input ng-model="user.password" type="password" /></td>
--- a/guacamole/src/main/webapp/app/settings/directives/guacSettingsUsers.js
+++ b/guacamole/src/main/webapp/app/settings/directives/guacSettingsUsers.js
@@ -95,6 +95,15 @@ angular.module('settings').directive('guacSettingsUsers', [function guacSettings
             */
            $scope.permissions = null;

+            /**
+             * Array of all user properties that are filterable.
+             *
+             * @type String[]
+             */
+            $scope.filteredUserProperties = [
+                'user.username'
+            ];
+
            /**
             * Returns whether critical data has completed being loaded.
             *
@@ -118,7 +127,7 @@ angular.module('settings').directive('guacSettingsUsers', [function guacSettings
             *     default when creating a new user, or null if user creation
             *     is not allowed.
             */
-            var getDefaultDataSource = function getDefaultDataSource() {
+            $scope.getDefaultDataSource = function getDefaultDataSource() {

                // Abort if permissions have not yet loaded
                if (!$scope.permissions)
@@ -151,7 +160,7 @@ angular.module('settings').directive('guacSettingsUsers', [function guacSettings
             *     least one data source, false otherwise.
             */
            $scope.canCreateUsers = function canCreateUsers() {
-                return getDefaultDataSource() !== null;
+                return $scope.getDefaultDataSource() !== null;
            };

            /**
@@ -238,7 +247,7 @@ angular.module('settings').directive('guacSettingsUsers', [function guacSettings
                            if (!PermissionSet.hasSystemPermission(permissions[dataSource], PermissionSet.ObjectPermissionType.ADMINISTER)
                             && !PermissionSet.hasUserPermission(permissions[dataSource], PermissionSet.ObjectPermissionType.UPDATE, user.username)
                             && !PermissionSet.hasUserPermission(permissions[dataSource], PermissionSet.ObjectPermissionType.DELETE, user.username))
-                                dataSource = getDefaultDataSource();
+                                dataSource = $scope.getDefaultDataSource();

                            // Add user to overall list
                            addedUsers[user.username] = user;
@@ -254,16 +263,6 @@ angular.module('settings').directive('guacSettingsUsers', [function guacSettings

            });
            
-            /**
-             * Navigates to an interface for creating a new user having the
-             * username specified.
-             */
-            $scope.newUser = function newUser() {
-                var username = $scope.newUsername.trim();
-                if (username)
-                    $location.url('/manage/' + encodeURIComponent(getDefaultDataSource()) + '/users/' + encodeURIComponent(username));
-            };
-            
        }]
    };
    
--- a/guacamole/src/main/webapp/app/settings/styles/buttons.css
+++ b/guacamole/src/main/webapp/app/settings/styles/buttons.css
@@ -20,7 +20,7 @@
 * THE SOFTWARE.
 */

-button.add-user,
+a.button.add-user,
 a.button.add-connection,
 a.button.add-connection-group {
    font-size: 0.8em;
@@ -28,7 +28,7 @@ a.button.add-connection-group {
    position: relative;
 }

-button.add-user::before,
+a.button.add-user::before,
 a.button.add-connection::before,
 a.button.add-connection-group::before {

@@ -45,7 +45,7 @@ a.button.add-connection-group::before {

 }

-button.add-user::before {
+a.button.add-user::before {
    background-image: url('images/action-icons/guac-user-add.png');
 }

--- a/guacamole/src/main/webapp/app/settings/styles/settings.css
+++ b/guacamole/src/main/webapp/app/settings/styles/settings.css
@@ -34,3 +34,45 @@
    text-align: center;
    margin: 1em 0;
 }
+
+.settings .toolbar {
+
+    /* IE10 */
+    display: -ms-flexbox;
+    -ms-flex-align: center;
+    -ms-flex-direction: row;
+
+    /* Ancient Mozilla */
+    display: -moz-box;
+    -moz-box-align: center;
+    -moz-box-orient: horizontal;
+
+    /* Ancient WebKit */
+    display: -webkit-box;
+    -webkit-box-align: center;
+    -webkit-box-orient: horizontal;
+
+    /* Old WebKit */
+    display: -webkit-flex;
+    -webkit-align-items: center;
+    -webkit-flex-direction: row;
+
+    /* W3C */
+    display: flex;
+    align-items: center;
+    flex-direction: row;
+
+}
+
+.settings .toolbar .action-buttons {
+    margin-right: 0.25em;
+}
+
+.settings .toolbar .filter {
+    -ms-flex: 1 1 auto;
+    -moz-box-flex: 1;
+    -webkit-box-flex: 1;
+    -webkit-flex: 1 1 auto;
+    flex: 1 1 auto;
+}
+
--- a/guacamole/src/main/webapp/app/settings/templates/settingsUsers.html
+++ b/guacamole/src/main/webapp/app/settings/templates/settingsUsers.html
@@ -24,10 +24,21 @@
    <!-- User management -->
    <p>{{'SETTINGS_USERS.HELP_USERS' | translate}}</p>

-    <!-- Form action buttons -->
-    <div class="action-buttons" ng-show="canCreateUsers()">
-        <input type="text" ng-model="newUsername" class="name username" autocorrect="off" autocapitalize="off"/>
-        <button class="add-user" ng-click="newUser()">{{'SETTINGS_USERS.ACTION_NEW_USER' | translate}}</button>
+
+    <!-- User management toolbar -->
+    <div class="toolbar">
+
+        <!-- Form action buttons -->
+        <div class="action-buttons">
+            <a class="add-user button" ng-show="canCreateUsers()"
+               href="#/manage/{{getDefaultDataSource()}}/users/">{{'SETTINGS_USERS.ACTION_NEW_USER' | translate}}</a>
+        </div>
+
+        <!-- User filter -->
+        <guac-filter filtered-items="filteredManageableUsers" items="manageableUsers"
+                     placeholder="'SETTINGS_USERS.FIELD_PLACEHOLDER_FILTER' | translate"
+                     properties="filteredUserProperties"></guac-filter>
+
    </div>

    <!-- List of users this user has access to -->
@@ -44,6 +55,6 @@

    <!-- Pager controls for user list -->
    <guac-pager page="manageableUserPage" page-size="25"
-                items="manageableUsers | orderBy : 'user.username'"></guac-pager>
+                items="filteredManageableUsers | orderBy : 'user.username'"></guac-pager>

 </div>
--- a/guacamole/src/main/webapp/translations/de.json
+++ b/guacamole/src/main/webapp/translations/de.json
@@ -567,6 +567,8 @@

        "DIALOG_HEADER_ERROR" : "@:APP.DIALOG_HEADER_ERROR",

+        "FIELD_PLACEHOLDER_FILTER" : "@:APP.FIELD_PLACEHOLDER_FILTER",
+
        "HELP_USERS" : "Klicke oder Tippe auf einen Benutzer um diesen zu verwalten. Abhänig von Ihrer Zugriffsebene können Benutzer hinzugefügt, gelöscht bzw. dessen Passwort geändert werden.",

        "SECTION_HEADER_USERS"       : "Benutzer"
--- a/guacamole/src/main/webapp/translations/en.json
+++ b/guacamole/src/main/webapp/translations/en.json
@@ -570,6 +570,8 @@

        "DIALOG_HEADER_ERROR" : "@:APP.DIALOG_HEADER_ERROR",

+        "FIELD_PLACEHOLDER_FILTER" : "@:APP.FIELD_PLACEHOLDER_FILTER",
+
        "HELP_USERS" : "Click or tap on a user below to manage that user. Depending on your access level, users can be added and deleted, and their passwords can be changed.",

        "SECTION_HEADER_USERS"       : "Users"
--- a/guacamole/src/main/webapp/translations/fr.json
+++ b/guacamole/src/main/webapp/translations/fr.json
@@ -525,6 +525,8 @@

        "DIALOG_HEADER_ERROR"           : "Erreur",

+        "FIELD_PLACEHOLDER_FILTER" : "@:APP.FIELD_PLACEHOLDER_FILTER",
+
        "HELP_USERS" : "Cliquer ou appuyer sur un utilisateur en dessous pour le gérer. Selon vos permissions, les utilisateurs peuvent être ajoutés, supprimés, leur mot de passe changé.",

        "SECTION_HEADER_USERS"       : "Utilisateur"
--- a/guacamole/src/main/webapp/translations/it.json
+++ b/guacamole/src/main/webapp/translations/it.json
@@ -520,6 +520,8 @@

        "DIALOG_HEADER_ERROR" : "@:APP.DIALOG_HEADER_ERROR",

+        "FIELD_PLACEHOLDER_FILTER" : "@:APP.FIELD_PLACEHOLDER_FILTER",
+
        "HELP_USERS" : "Click or tap on a user below to manage that user. Depending on your access level, users can be added and deleted, and their passwords can be changed.",

        "SECTION_HEADER_USERS"       : "Utenti"
--- a/guacamole/src/main/webapp/translations/nl.json
+++ b/guacamole/src/main/webapp/translations/nl.json
@@ -567,6 +567,8 @@

        "DIALOG_HEADER_ERROR" : "@:APP.DIALOG_HEADER_ERROR",

+        "FIELD_PLACEHOLDER_FILTER" : "@:APP.FIELD_PLACEHOLDER_FILTER",
+
        "HELP_USERS" : "Klik of tik op een van de onderstaande gebruikers om die te beheren. Afhankelijk van uw toegangsniveau kunnen gebruikers worden toegevoegd, verwijderd en hun wachtwoorden gewijzigd.",

        "SECTION_HEADER_USERS"       : "Gebruikers"
--- a/guacamole/src/main/webapp/translations/ru.json
+++ b/guacamole/src/main/webapp/translations/ru.json
@@ -493,6 +493,8 @@

        "DIALOG_HEADER_ERROR" : "@:APP.DIALOG_HEADER_ERROR",

+        "FIELD_PLACEHOLDER_FILTER" : "@:APP.FIELD_PLACEHOLDER_FILTER",
+
        "HELP_USERS" : "Нажмите на пользователя, чтобы управлять им. В зависимости от прав доступа возможно добавление и удаление пользователей, а также изменение паролей.",

        "SECTION_HEADER_USERS"       : "Пользователи"