GUACAMOLE-78: Render the usernames of anonymous users differently.

This commit is contained in:
Michael Jumper
2016-08-12 20:05:33 -07:00
parent 42cd4dca5d
commit 21f184f42e
8 changed files with 131 additions and 4 deletions

View File

@@ -0,0 +1,92 @@
/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied. See the License for the
* specific language governing permissions and limitations
* under the License.
*/
/**
* A directive which graphically represents an individual user.
*/
angular.module('list').directive('guacUserItem', [function guacUserItem() {
return {
restrict: 'E',
replace: true,
scope: {
/**
* The username of the user represented by this guacUserItem.
*
* @type String
*/
username : '='
},
templateUrl: 'app/list/templates/guacUserItem.html',
controller: ['$scope', '$injector',
function guacUserItemController($scope, $injector) {
// Required types
var AuthenticationResult = $injector.get('AuthenticationResult');
// Required services
var $translate = $injector.get('$translate');
/**
* The string to display when listing the user having the provided
* username. Generally, this will be the username itself, but can
* also be an arbitrary human-readable representation of the user,
* or null if the display name is not yet determined.
*
* @type String
*/
$scope.displayName = null;
/**
* Returns whether the username provided to this directive denotes
* a user that authenticated anonymously.
*
* @returns {Boolean}
* true if the username provided represents an anonymous user,
* false otherwise.
*/
$scope.isAnonymous = function isAnonymous() {
return $scope.username === AuthenticationResult.ANONYMOUS_USERNAME;
};
// Update display name whenever provided username changes
$scope.$watch('username', function updateDisplayName(username) {
// If the user is anonymous, pull the display name for anonymous
// users from the translation service
if ($scope.isAnonymous()) {
$translate('LIST.TEXT_ANONYMOUS_USER')
.then(function retrieveAnonymousDisplayName(anonymousDisplayName) {
$scope.displayName = anonymousDisplayName;
});
}
// For all other users, use the username verbatim
else
$scope.displayName = username;
});
}] // end controller
};
}]);

View File

@@ -21,4 +21,6 @@
* Module for displaying, sorting, and filtering the contents of a list, split
* into multiple pages.
*/
angular.module('list', []);
angular.module('list', [
'auth'
]);

View File

@@ -0,0 +1,23 @@
/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied. See the License for the
* specific language governing permissions and limitations
* under the License.
*/
.user-item.anonymous {
font-style: italic;
opacity: 0.5;
}

View File

@@ -0,0 +1,3 @@
<div class="user-item" ng-class="{'anonymous' : isAnonymous() }">
<span class="username">{{displayName}}</span>
</div>

View File

@@ -75,7 +75,7 @@
</thead>
<tbody>
<tr ng-repeat="wrapper in wrapperPage">
<td class="username">{{wrapper.entry.username}}</td>
<td class="username"><guac-user-item username="wrapper.entry.username"></guac-user-item></td>
<td class="start">{{wrapper.entry.startDate | date:historyDateFormat}}</td>
<td class="duration"
translate="{{wrapper.durationText}}"

View File

@@ -32,7 +32,7 @@
</thead>
<tbody ng-class="{loading: !isLoaded()}">
<tr ng-repeat="historyEntryWrapper in historyEntryWrapperPage" class="history">
<td>{{historyEntryWrapper.username}}</td>
<td><guac-user-item username="historyEntryWrapper.username"></guac-user-item></td>
<td>{{historyEntryWrapper.startDate | date : dateFormat}}</td>
<td translate="{{historyEntryWrapper.readableDurationText}}"
translate-values="{VALUE: historyEntryWrapper.readableDuration.value, UNIT: historyEntryWrapper.readableDuration.unit}"></td>

View File

@@ -37,7 +37,7 @@
<td class="select-session">
<input ng-change="wrapperSelectionChange(wrapper)" type="checkbox" ng-model="wrapper.checked" />
</td>
<td>{{wrapper.activeConnection.username}}</td>
<td><guac-user-item username="wrapper.activeConnection.username"></guac-user-item></td>
<td>{{wrapper.startDate}}</td>
<td>{{wrapper.activeConnection.remoteHost}}</td>
<td>{{wrapper.name}}</td>

View File

@@ -42,6 +42,7 @@
"INFO_ACTIVE_USER_COUNT" : "Currently in use by {USERS} {USERS, plural, one{user} other{users}}.",
"TEXT_ANONYMOUS_USER" : "Anonymous",
"TEXT_HISTORY_DURATION" : "{VALUE} {UNIT, select, second{{VALUE, plural, one{second} other{seconds}}} minute{{VALUE, plural, one{minute} other{minutes}}} hour{{VALUE, plural, one{hour} other{hours}}} day{{VALUE, plural, one{day} other{days}}} other{}}"
},
@@ -166,6 +167,12 @@
},
"LIST" : {
"TEXT_ANONYMOUS_USER" : "Anonymous"
},
"LOGIN": {
"ACTION_ACKNOWLEDGE" : "@:APP.ACTION_ACKNOWLEDGE",