GUAC-1140: Set different CSS classes depending on primary sort column and direction.

guacamole/src/main/webapp/app/manage/controllers/manageSessionsController.js

@@ -201,6 +201,50 @@ angular.module('manage').controller('manageSessionsController', ['$scope', '$inj
 
     };
 
+    /**
+     * Returns whether the wrapped session list is sorted by username.
+     *
+     * @returns {Boolean}
+     *     true if the wrapped session list is sorted by username, false
+     *     otherwise.
+     */
+    $scope.sortedByUsername = function sortedByUsername() {
+        return $scope.wrapperOrder.primary === 'activeConnection.username';
+    };
+
+    /**
+     * Returns whether the wrapped session list is sorted by start date.
+     *
+     * @returns {Boolean}
+     *     true if the wrapped session list is sorted by start date, false
+     *     otherwise.
+     */
+    $scope.sortedByStartDate = function sortedByStartDate() {
+        return $scope.wrapperOrder.primary === 'activeConnection.startDate';
+    };
+
+    /**
+     * Returns whether the wrapped session list is sorted by remote host.
+     *
+     * @returns {Boolean}
+     *     true if the wrapped session list is sorted by remote host, false
+     *     otherwise.
+     */
+    $scope.sortedByRemoteHost = function sortedByRemoteHost() {
+        return $scope.wrapperOrder.primary === 'activeConnection.remoteHost';
+    };
+
+    /**
+     * Returns whether the wrapped session list is sorted by connection name.
+     *
+     * @returns {Boolean}
+     *     true if the wrapped session list is sorted by connection name, false
+     *     otherwise.
+     */
+    $scope.sortedByConnectionName = function sortedByConnectionName() {
+        return $scope.wrapperOrder.primary === 'name';
+    };
+
     /**
      * An action to be provided along with the object sent to showStatus which
      * closes the currently-shown status dialog.

guacamole/src/main/webapp/app/manage/styles/sessions.css

@@ -43,3 +43,15 @@
     min-width: 2em;
     text-align: center;
 }
+
+.manage table.session-list th.sort-primary {
+    text-decoration: underline;
+}
+
+.manage table.session-list th.sort-primary:after {
+    content: ' \25be';
+}
+
+.manage table.session-list th.sort-primary.sort-descending:after {
+    content: ' \25b2';
+}

guacamole/src/main/webapp/app/manage/templates/manageSessions.html

@@ -41,10 +41,18 @@ THE SOFTWARE.
             <thead>
                 <tr>
                     <th class="select-session"></th>
-                    <th>{{'MANAGE_SESSION.TABLE_HEADER_SESSION_USERNAME' | translate}}</th>
-                    <th>{{'MANAGE_SESSION.TABLE_HEADER_SESSION_STARTDATE' | translate}}</th>
-                    <th>{{'MANAGE_SESSION.TABLE_HEADER_SESSION_REMOTEHOST' | translate}}</th>
-                    <th>{{'MANAGE_SESSION.TABLE_HEADER_SESSION_CONNECTION_NAME' | translate}}</th>
+                    <th ng-class="{'sort-primary': sortedByUsername(), 'sort-descending': wrapperOrder.descending}">
+                        {{'MANAGE_SESSION.TABLE_HEADER_SESSION_USERNAME' | translate}}
+                    </th>
+                    <th ng-class="{'sort-primary': sortedByStartDate(), 'sort-descending': wrapperOrder.descending}">
+                        {{'MANAGE_SESSION.TABLE_HEADER_SESSION_STARTDATE' | translate}}
+                    </th>
+                    <th ng-class="{'sort-primary': sortedByRemoteHost(), 'sort-descending': wrapperOrder.descending}">
+                        {{'MANAGE_SESSION.TABLE_HEADER_SESSION_REMOTEHOST' | translate}}
+                    </th>
+                    <th ng-class="{'sort-primary': sortedByConnectionName(), 'sort-descending': wrapperOrder.descending}">
+                        {{'MANAGE_SESSION.TABLE_HEADER_SESSION_CONNECTION_NAME' | translate}}
+                    </th>
                 </tr>
             </thead>
             <tbody>