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

This commit is contained in:
Michael Jumper
2015-03-23 13:54:31 -07:00
parent 6135883643
commit 4d81272d42
3 changed files with 68 additions and 4 deletions

View File

@@ -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 * An action to be provided along with the object sent to showStatus which
* closes the currently-shown status dialog. * closes the currently-shown status dialog.

View File

@@ -43,3 +43,15 @@
min-width: 2em; min-width: 2em;
text-align: center; 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';
}

View File

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