mirror of
https://github.com/gyurix1968/guacamole-client.git
synced 2025-09-10 15:11:22 +00:00
GUAC-1193: Implement front end for connection history.
This commit is contained in:
@@ -0,0 +1,142 @@
|
||||
/*
|
||||
* Copyright (C) 2015 Glyptodon LLC
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
* of this software and associated documentation files (the "Software"), to deal
|
||||
* in the Software without restriction, including without limitation the rights
|
||||
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
* copies of the Software, and to permit persons to whom the Software is
|
||||
* furnished to do so, subject to the following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be included in
|
||||
* all copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||||
* THE SOFTWARE.
|
||||
*/
|
||||
|
||||
/**
|
||||
* A directive for viewing connection history records.
|
||||
*/
|
||||
angular.module('settings').directive('guacSettingsConnectionHistory', [function guacSettingsConnectionHistory() {
|
||||
|
||||
return {
|
||||
// Element only
|
||||
restrict: 'E',
|
||||
replace: true,
|
||||
|
||||
scope: {
|
||||
},
|
||||
|
||||
templateUrl: 'app/settings/templates/settingsConnectionHistory.html',
|
||||
controller: ['$scope', '$injector', function settingsConnectionHistoryController($scope, $injector) {
|
||||
|
||||
// Get required types
|
||||
var SortOrder = $injector.get('SortOrder');
|
||||
|
||||
// Get required services
|
||||
var $routeParams = $injector.get('$routeParams');
|
||||
var $translate = $injector.get('$translate');
|
||||
var historyService = $injector.get('historyService');
|
||||
|
||||
/**
|
||||
* The identifier of the currently-selected data source.
|
||||
*
|
||||
* @type String
|
||||
*/
|
||||
$scope.dataSource = $routeParams.dataSource;
|
||||
|
||||
/**
|
||||
* The identifier of the currently-selected data source.
|
||||
*
|
||||
* @type String
|
||||
*/
|
||||
$scope.historyRecords = null;
|
||||
|
||||
/**
|
||||
* The search terms to use when filtering the history records.
|
||||
*
|
||||
* @type String
|
||||
*/
|
||||
$scope.searchString = '';
|
||||
|
||||
/**
|
||||
* The date format for use for start/end dates.
|
||||
*
|
||||
* @type String
|
||||
*/
|
||||
$scope.dateFormat = null;
|
||||
|
||||
/**
|
||||
* SortOrder instance which stores the sort order of the history
|
||||
* records.
|
||||
*
|
||||
* @type SortOrder
|
||||
*/
|
||||
$scope.order = new SortOrder([
|
||||
'username',
|
||||
'startDate',
|
||||
'endDate',
|
||||
'connectionName'
|
||||
]);
|
||||
|
||||
// Get session date format
|
||||
$translate('SETTINGS_CONNECTION_HISTORY.FORMAT_DATE')
|
||||
.then(function dateFormatReceived(retrievedDateFormat) {
|
||||
|
||||
// Store received date format
|
||||
$scope.dateFormat = retrievedDateFormat;
|
||||
|
||||
});
|
||||
|
||||
/**
|
||||
* Returns true if the connection history records have been loaded,
|
||||
* indicating that information needed to render the page is fully
|
||||
* loaded.
|
||||
*
|
||||
* @returns {Boolean}
|
||||
* true if the history records have been loaded, false
|
||||
* otherwise.
|
||||
*
|
||||
*/
|
||||
$scope.isLoaded = function isLoaded() {
|
||||
return $scope.historyRecords !== null
|
||||
&& $scope.dateFormat !== null;
|
||||
};
|
||||
|
||||
/**
|
||||
* Query the API for the connection record history, filtered by
|
||||
* searchString, and ordered by order.
|
||||
*/
|
||||
$scope.search = function search() {
|
||||
|
||||
// Clear current results
|
||||
$scope.historyRecords = null;
|
||||
|
||||
// Fetch history records
|
||||
historyService.getConnectionHistory(
|
||||
$scope.dataSource,
|
||||
$scope.searchString.split(/\s+/),
|
||||
$scope.order.predicate
|
||||
)
|
||||
.success(function historyRetrieved(historyRecords) {
|
||||
|
||||
// Store retrieved permissions
|
||||
$scope.historyRecords = historyRecords;
|
||||
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
// Initialize search results
|
||||
$scope.search();
|
||||
|
||||
}]
|
||||
};
|
||||
|
||||
}]);
|
59
guacamole/src/main/webapp/app/settings/styles/history.css
Normal file
59
guacamole/src/main/webapp/app/settings/styles/history.css
Normal file
@@ -0,0 +1,59 @@
|
||||
/*
|
||||
* Copyright (C) 2014 Glyptodon LLC
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
* of this software and associated documentation files (the "Software"), to deal
|
||||
* in the Software without restriction, including without limitation the rights
|
||||
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
* copies of the Software, and to permit persons to whom the Software is
|
||||
* furnished to do so, subject to the following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be included in
|
||||
* all copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||||
* THE SOFTWARE.
|
||||
*/
|
||||
|
||||
.settings.connectionHistory .filter {
|
||||
|
||||
/* IE10 */
|
||||
display: -ms-flexbox;
|
||||
-ms-flex-align: stretch;
|
||||
-ms-flex-direction: row;
|
||||
|
||||
/* Ancient Mozilla */
|
||||
display: -moz-box;
|
||||
-moz-box-align: stretch;
|
||||
-moz-box-orient: horizontal;
|
||||
|
||||
/* Ancient WebKit */
|
||||
display: -webkit-box;
|
||||
-webkit-box-align: stretch;
|
||||
-webkit-box-orient: horizontal;
|
||||
|
||||
/* Old WebKit */
|
||||
display: -webkit-flex;
|
||||
-webkit-align-items: stretch;
|
||||
-webkit-flex-direction: row;
|
||||
|
||||
/* W3C */
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
flex-direction: row;
|
||||
|
||||
}
|
||||
|
||||
.settings.connectionHistory .filter .search-button {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.settings.connectionHistory .history-list {
|
||||
width: 100%;
|
||||
}
|
@@ -33,9 +33,10 @@ THE SOFTWARE.
|
||||
</div>
|
||||
|
||||
<!-- Selected tab -->
|
||||
<guac-settings-users ng-if="activeTab === 'users'"></guac-settings-users>
|
||||
<guac-settings-connections ng-if="activeTab === 'connections'"></guac-settings-connections>
|
||||
<guac-settings-sessions ng-if="activeTab === 'sessions'"></guac-settings-sessions>
|
||||
<guac-settings-preferences ng-if="activeTab === 'preferences'"></guac-settings-preferences>
|
||||
<guac-settings-users ng-if="activeTab === 'users'"></guac-settings-users>
|
||||
<guac-settings-connections ng-if="activeTab === 'connections'"></guac-settings-connections>
|
||||
<guac-settings-connection-history ng-if="activeTab === 'history'"></guac-settings-connection-history>
|
||||
<guac-settings-sessions ng-if="activeTab === 'sessions'"></guac-settings-sessions>
|
||||
<guac-settings-preferences ng-if="activeTab === 'preferences'"></guac-settings-preferences>
|
||||
|
||||
</div>
|
||||
|
@@ -0,0 +1,74 @@
|
||||
<div class="settings section connectionHistory">
|
||||
<!--
|
||||
Copyright 2015 Glyptodon LLC.
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in
|
||||
all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||||
THE SOFTWARE.
|
||||
-->
|
||||
|
||||
<!-- Connection history -->
|
||||
<p>{{'SETTINGS_CONNECTION_HISTORY.HELP_CONNECTION_HISTORY' | translate}}</p>
|
||||
|
||||
<!-- Search controls -->
|
||||
<div class="filter">
|
||||
<input class="search-string" type="text" ng-model="searchString" />
|
||||
<button class="search-button" ng-click="search()">{{'SETTINGS_CONNECTION_HISTORY.ACTION_SEARCH' | translate}}</button>
|
||||
</div>
|
||||
|
||||
<!-- Search results -->
|
||||
<div class="results" ng-class="{loading: !isLoaded()}">
|
||||
|
||||
<!-- List of current user sessions -->
|
||||
<table class="sorted history-list">
|
||||
<thead>
|
||||
<tr>
|
||||
<th guac-sort-order="order" guac-sort-property="'username'">
|
||||
{{'SETTINGS_CONNECTION_HISTORY.TABLE_HEADER_SESSION_USERNAME' | translate}}
|
||||
</th>
|
||||
<th guac-sort-order="order" guac-sort-property="'startDate'">
|
||||
{{'SETTINGS_CONNECTION_HISTORY.TABLE_HEADER_SESSION_STARTDATE' | translate}}
|
||||
</th>
|
||||
<th guac-sort-order="order" guac-sort-property="'endDate'">
|
||||
{{'SETTINGS_CONNECTION_HISTORY.TABLE_HEADER_SESSION_ENDDATE' | translate}}
|
||||
</th>
|
||||
<th guac-sort-order="order" guac-sort-property="'connectionName'">
|
||||
{{'SETTINGS_CONNECTION_HISTORY.TABLE_HEADER_SESSION_CONNECTION_NAME' | translate}}
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr ng-repeat="historyRecord in historyRecordPage" class="history">
|
||||
<td>{{historyRecord.username}}</td>
|
||||
<td>{{historyRecord.startDate | date : dateFormat}}</td>
|
||||
<td>{{historyRecord.endDate | date : dateFormat}}</td>
|
||||
<td>{{historyRecord.connectionName}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<!-- Text displayed if no history exists -->
|
||||
<p class="placeholder" ng-hide="historyRecordPage.length">
|
||||
{{'SETTINGS_CONNECTION_HISTORY.INFO_NO_HISTORY' | translate}}
|
||||
</p>
|
||||
|
||||
<!-- Pager for history list -->
|
||||
<guac-pager page="historyRecordPage" page-size="25"
|
||||
items="historyRecords | orderBy : order.predicate"></guac-pager>
|
||||
</div>
|
||||
|
||||
</div>
|
Reference in New Issue
Block a user