safebox/guacamole-client
4
0
Fork 0
mirror of https://github.com/gyurix1968/guacamole-client.git synced 2025-09-07 05:31:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

GUAC-932: Fully-working connection editor. Initial migration of users and connection groups to own edit pages. Add support for CSS classes on notification actions.

Browse Source
This commit is contained in:
Michael Jumper
2014-12-22 03:19:24 -08:00
parent 07a2a2da54
commit 8b53797b30
18 changed files with 477 additions and 473 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
guacamole/src/main/webapp/app/index/config/indexRouteConfig.js
View File

@@ -44,10 +44,22 @@ angular.module('index').config(['$routeProvider', '$locationProvider',
})
.when('/manage/connections/:id?', {
title: 'application.title',
bodyClassName: 'manage-connection',
bodyClassName: 'manage',
templateUrl: 'app/manage/templates/manageConnection.html',
controller: 'manageConnectionController'
})
.when('/manage/connectionGroups/:id?', {
title: 'application.title',
bodyClassName: 'manage',
templateUrl: 'app/manage/templates/manageConnectionGroup.html',
controller: 'manageConnectionGroupController'
})
.when('/manage/users/:id', {
title: 'application.title',
bodyClassName: 'manage',
templateUrl: 'app/manage/templates/manageUser.html',
controller: 'manageUserController'
})
.when('/login/', {
title: 'application.title',
bodyClassName: 'login',

8
guacamole/src/main/webapp/app/home/styles/connection.css → guacamole/src/main/webapp/app/index/styles/lists.css
View File

@@ -20,33 +20,33 @@
* THE SOFTWARE.
*/
.user,
.group,
.connection {
cursor: pointer;
}
.user a,
.connection a,
.group a {
text-decoration:none;
color: black;
}
.user a:hover,
.connection a:hover,
.group a:hover {
text-decoration:none;
color: black;
}
.user a:visited,
.connection a:visited,
.group a:visited {
text-decoration:none;
color: black;
}
.group .connection .bears {
display: none;
}
.connection:hover {
background: #CDA;
}

198
guacamole/src/main/webapp/app/manage/controllers/manageConnectionController.js
View File

@@ -26,115 +26,181 @@
angular.module('manage').controller('manageConnectionController', ['$scope', '$injector',
function manageConnectionController($scope, $injector) {
var $routeParams = $injector.get('$routeParams');
var connectionService = $injector.get('connectionService');
var connectionGroupService = $injector.get('connectionGroupService');
var protocolService = $injector.get('protocolService');
var Connection = $injector.get('Connection');
var ConnectionGroup = $injector.get('ConnectionGroup');
var PermissionSet = $injector.get('PermissionSet');
var HistoryEntryWrapper = $injector.get('HistoryEntryWrapper');
// Required types
var Connection = $injector.get('Connection');
var ConnectionGroup = $injector.get('ConnectionGroup');
var HistoryEntryWrapper = $injector.get('HistoryEntryWrapper');
var PermissionSet = $injector.get('PermissionSet');
// Required services
var $location = $injector.get('$location');
var $routeParams = $injector.get('$routeParams');
var connectionService = $injector.get('connectionService');
var connectionGroupService = $injector.get('connectionGroupService');
var protocolService = $injector.get('protocolService');
/**
* An action to be provided along with the object sent to showStatus which
* closes the currently-shown status dialog.
*/
var ACKNOWLEDGE_ACTION = {
name : "manage.error.action.acknowledge",
// Handle action
callback : function acknowledgeCallback() {
$scope.showStatus(false);
}
};
/**
* The identifier of the connection being edited. If a new connection is
* being created, this will not be defined.
*
* @type String
*/
var identifier = $routeParams.id;
// Make a copy of the old connection so that we can copy over the changes when done
var oldConnection = $scope.connection;
// Pull connection group hierarchy
connectionGroupService.getConnectionGroupTree(ConnectionGroup.ROOT_IDENTIFIER, PermissionSet.ObjectPermissionType.UPDATE)
.success(function connectionGroupReceived(rootGroup) {
$scope.rootGroup = rootGroup;
$scope.loadingConnections = false;
});
// Get the protocol information from the server and copy it into the scope
protocolService.getProtocols().success(function fetchProtocols(protocols) {
// Get protocol metadata
protocolService.getProtocols().success(function protocolsReceived(protocols) {
$scope.protocols = protocols;
});
// Wrap all the history entries
// If we are editing an existing connection, pull its data
if (identifier) {
// Copy data into a new conection object in case the user doesn't want to save
// Pull data from existing connection
connectionService.getConnection(identifier).success(function connectionRetrieved(connection) {
$scope.connection = connection;
});
connectionService.getConnectionHistory(identifier).success(function wrapHistoryEntries(historyEntries) {
// Pull connection history
connectionService.getConnectionHistory(identifier).success(function historyReceived(historyEntries) {
// Wrap all history entries for sake of display
$scope.historyEntryWrappers = [];
historyEntries.forEach(function wrapHistoryEntry(historyEntry) {
$scope.historyEntryWrappers.push(new HistoryEntryWrapper(historyEntry));
});
});
connectionService.getConnectionParameters(identifier).success(function setParameters(parameters) {
// Pull connection parameters
connectionService.getConnectionParameters(identifier).success(function parametersReceived(parameters) {
$scope.parameters = parameters;
});
}
// If we are creating a new connection, populate skeleton connection data
else {
$scope.connection = new Connection({ protocol: 'vnc' });
$scope.historyEntryWrappers = [];
$scope.parameters = {};
}
/**
* Close the modal.
* Cancels all pending edits, returning to the management page.
*/
$scope.close = function close() {
//connectionEditModal.deactivate();
$scope.cancel = function cancel() {
$location.path('/manage/');
};
/**
* Save the connection and close the modal.
* Saves the connection, creating a new connection or updating the existing
* connection.
*/
$scope.save = function save() {
connectionService.saveConnection($scope.connection).success(function successfullyUpdatedConnection() {
var oldParentID = oldConnection.parentIdentifier;
var newParentID = $scope.connection.parentIdentifier;
// Copy the data back to the original model
angular.extend(oldConnection, $scope.connection);
// We have to move this connection
if(oldParentID !== newParentID)
// New connections are created by default in root - don't try to move it if it's already there.
if(newConnection && newParentID === $scope.rootGroup.identifier) {
$scope.moveItem($scope.connection, oldParentID, newParentID);
} else {
connectionService.moveConnection($scope.connection).then(function moveConnection() {
$scope.moveItem($scope.connection, oldParentID, newParentID);
});
}
// Close the modal
//connectionEditModal.deactivate();
$scope.saveConnection = function saveConnection() {
$scope.connection.parameters = $scope.parameters;
// Save the connection
connectionService.saveConnection($scope.connection)
.success(function savedConnection() {
$location.path('/manage/');
})
// Notify of any errors
.error(function connectionSaveFailed(error) {
$scope.showStatus({
'className' : 'error',
'title' : 'manage.error.title',
'text' : error.message,
'actions' : [ ACKNOWLEDGE_ACTION ]
});
});
};
/**
* Delete the connection and close the modal.
* An action to be provided along with the object sent to showStatus which
* closes the currently-shown status dialog.
*/
$scope['delete'] = function deleteConnection() {
// Nothing to delete if the connection is new
var newConnection = !$scope.connection.identifier;
if(newConnection) {
// Close the modal
//connectionEditModal.deactivate();
return;
var DELETE_ACTION = {
name : "manage.edit.connection.delete",
className : "danger",
// Handle action
callback : function deleteCallback() {
deleteConnectionImmediately();
$scope.showStatus(false);
}
connectionService.deleteConnection($scope.connection).success(function successfullyDeletedConnection() {
var oldParentID = oldConnection.parentIdentifier;
// We have to remove this connection from the heirarchy
$scope.moveItem($scope.connection, oldParentID);
// Close the modal
//connectionEditModal.deactivate();
};
/**
* An action to be provided along with the object sent to showStatus which
* closes the currently-shown status dialog.
*/
var CANCEL_ACTION = {
name : "manage.edit.connection.cancel",
// Handle action
callback : function cancelCallback() {
$scope.showStatus(false);
}
};
/**
* Immediately deletes the current connection, without prompting the user
* for confirmation.
*/
var deleteConnectionImmediately = function deleteConnectionImmediately() {
// Delete the connection
connectionService.deleteConnection($scope.connection)
.success(function deletedConnection() {
$location.path('/manage/');
})
// Notify of any errors
.error(function connectionDeletionFailed(error) {
$scope.showStatus({
'className' : 'error',
'title' : 'manage.error.title',
'text' : error.message,
'actions' : [ ACKNOWLEDGE_ACTION ]
});
});
};
/**
* Deletes the connection, prompting the user first to confirm that
* deletion is desired.
*/
$scope.deleteConnection = function deleteConnection() {
// Confirm deletion request
$scope.showStatus({
'title' : 'manage.edit.connection.confirmDelete.title',
'text' : 'manage.edit.connection.confirmDelete.text',
'actions' : [ DELETE_ACTION, CANCEL_ACTION]
});
};
}]);

48
guacamole/src/main/webapp/app/manage/controllers/connectionGroupEditModalController.js → guacamole/src/main/webapp/app/manage/controllers/manageConnectionGroupController.js
View File

@@ -23,35 +23,47 @@
/**
* The controller for the connection group edit modal.
*/
angular.module('manage').controller('connectionGroupEditModalController', ['$scope', '$injector',
function connectionEditModalController($scope, $injector) {
angular.module('manage').controller('manageConnectionGroupController', ['$scope', '$injector',
function manageConnectionGroupController($scope, $injector) {
var connectionGroupEditModal = $injector.get('connectionGroupEditModal');
var connectionGroupService = $injector.get('connectionGroupService');
// Make a copy of the old connection group so that we can copy over the changes when done
var oldConnectionGroup = $scope.connectionGroup;
// Required types
var ConnectionGroup = $injector.get('ConnectionGroup');
var PermissionSet = $injector.get('PermissionSet');
// Required services
var connectionGroupService = $injector.get('connectionGroupService');
var $routeParams = $injector.get('$routeParams');
// Copy data into a new conection group object in case the user doesn't want to save
$scope.connectionGroup = angular.copy($scope.connectionGroup);
var newConnectionGroup = !$scope.connectionGroup.identifier;
var identifier = $routeParams.id;
// Pull connection group data
if (identifier) {
connectionGroupService.getConnectionGroup(identifier).success(function connectionGroupReceived(connectionGroup) {
$scope.connectionGroup = connectionGroup;
});
}
else
$scope.connectionGroup = new ConnectionGroup();
connectionGroupService.getConnectionGroupTree(ConnectionGroup.ROOT_IDENTIFIER, PermissionSet.ObjectPermissionType.UPDATE)
.success(function connectionGroupReceived(rootGroup) {
$scope.rootGroup = rootGroup;
$scope.loadingConnections = false;
});
$scope.types = [
{
label: "organizational",
value: "ORGANIZATIONAL"
value: ConnectionGroup.Type.ORGANIZATIONAL
},
{
label: "balancing",
value: "BALANCING"
label : "balancing",
value : ConnectionGroup.Type.BALANCING
}
];
// Set it to organizational by default
if(!$scope.connectionGroup.type)
$scope.connectionGroup.type = $scope.types[0].value;
/**
* Close the modal.
*/

184
guacamole/src/main/webapp/app/manage/controllers/manageController.js
View File

@@ -27,146 +27,78 @@ angular.module('manage').controller('manageController', ['$scope', '$injector',
function manageController($scope, $injector) {
// Required types
var PermissionSet = $injector.get('PermissionSet');
var ConnectionGroup = $injector.get('ConnectionGroup');
var PermissionSet = $injector.get('PermissionSet');
var User = $injector.get('User');
// Required services
var connectionGroupService = $injector.get('connectionGroupService');
var connectionGroupEditModal = $injector.get('connectionGroupEditModal');
var userEditModal = $injector.get('userEditModal');
var protocolService = $injector.get('protocolService');
var userService = $injector.get('userService');
// Set status to loading until we have all the connections, groups, and users have loaded
$scope.loadingUsers = true;
$scope.loadingConnections = true;
$scope.basicPermissionsLoaded.then(function basicPermissionsHaveBeenLoaded() {
var connectionGroupService = $injector.get('connectionGroupService');
var userService = $injector.get('userService');
// Retrieve all users for whom we have UPDATE permission
connectionGroupService.getConnectionGroupTree(ConnectionGroup.ROOT_IDENTIFIER, PermissionSet.ObjectPermissionType.UPDATE)
.success(function connectionGroupReceived(rootGroup) {
$scope.rootGroup = rootGroup;
$scope.loadingConnections = false;
});
// Retrieve all users for whom we have UPDATE permission
userService.getUsers(PermissionSet.ObjectPermissionType.UPDATE)
.success(function usersReceived(users) {
$scope.users = users;
$scope.loadingUsers = false;
});
});
$scope.protocols = {};
// Get the protocol information from the server and copy it into the scope
protocolService.getProtocols().success(function fetchProtocols(protocols) {
$scope.protocols = protocols;
});
// Expose object edit functions to group list template
$scope.groupListContext = {
/**
* Open a modal to edit the given connection.
*
* @param {Connection} connection
* The connection to edit.
*/
editConnection : function editConnection(connection) {
connectionEditModal.activate({
connection : connection,
protocols : $scope.protocols,
rootGroup : $scope.rootGroup
});
},
/**
* Open a modal to edit the given connection group.
*
* @param {ConnectionGroup} connectionGroup
* The connection group to edit.
*/
editConnectionGroup : function editConnectionGroup(connectionGroup) {
connectionGroupEditModal.activate({
connectionGroup : connectionGroup,
rootGroup : $scope.rootGroup
});
/**
* An action to be provided along with the object sent to showStatus which
* closes the currently-shown status dialog.
*/
var ACKNOWLEDGE_ACTION = {
name : "manage.error.action.acknowledge",
// Handle action
callback : function acknowledgeCallback() {
$scope.showStatus(false);
}
};
};
/**
* Open a modal to create a new connection.
* The name of the new user to create, if any, when user creation is
* requested via newUser().
*
* @type String
*/
$scope.newConnection = function newConnection() {
connectionEditModal.activate(
{
connection : {},
protocols : $scope.protocols,
rootGroup : $scope.rootGroup
});
};
/**
* Open a modal to create a new connection group.
*/
$scope.newConnectionGroup = function newConnectionGroup() {
connectionGroupEditModal.activate(
{
connectionGroup : {},
rootGroup : $scope.rootGroup
});
};
// Remove the user from the current list of users
function removeUser(user) {
for(var i = 0; i < $scope.users.length; i++) {
if($scope.users[i].username === user.username) {
$scope.users.splice(i, 1);
break;
}
}
}
/**
* Open a modal to edit the user.
*
* @param {object} user The user to edit.
*/
$scope.editUser = function editUser(user) {
userEditModal.activate(
{
user : user,
rootGroup : $scope.rootGroup,
removeUser : removeUser
});
};
$scope.newUsername = "";
// Retrieve all users for whom we have UPDATE permission
connectionGroupService.getConnectionGroupTree(ConnectionGroup.ROOT_IDENTIFIER, PermissionSet.ObjectPermissionType.UPDATE)
.success(function connectionGroupReceived(rootGroup) {
$scope.rootGroup = rootGroup;
});
// Retrieve all users for whom we have UPDATE permission
userService.getUsers(PermissionSet.ObjectPermissionType.UPDATE)
.success(function usersReceived(users) {
$scope.users = users;
});
/**
* Open a modal to edit the user.
*
* @param {object} user The user to edit.
* Creates a new user having the username specified in the user creation
* interface.
*/
$scope.newUser = function newUser() {
if($scope.newUsername) {
var newUser = {
username: $scope.newUsername
};
userService.createUser(newUser).success(function addUserToList() {
$scope.users.push(newUser);
// Create user skeleton
var user = new User({
username: $scope.newUsername || ''
});
// Create specified user
userService.createUser(user)
// Add user to visible list upon success
.success(function userCreated() {
$scope.users.push(user);
})
// Notify of any errors
.error(function userCreationFailed(error) {
$scope.showStatus({
'className' : 'error',
'title' : 'manage.error.title',
'text' : error.message,
'actions' : [ ACKNOWLEDGE_ACTION ]
});
$scope.newUsername = "";
}
});
// Reset username
$scope.newUsername = "";
};
}]);

30
guacamole/src/main/webapp/app/manage/controllers/userEditModalController.js → guacamole/src/main/webapp/app/manage/controllers/manageUserController.js
View File

@@ -23,18 +23,20 @@
/**
* The controller for the connection edit modal.
*/
angular.module('manage').controller('userEditModalController', ['$scope', '$injector',
function userEditModalController($scope, $injector) {
angular.module('manage').controller('manageUserController', ['$scope', '$injector',
function manageUserController($scope, $injector) {
var userEditModal = $injector.get('userEditModal');
// Required services
var $routeParams = $injector.get('$routeParams');
var userService = $injector.get('userService');
var permissionService = $injector.get('permissionService');
// Make a copy of the old user so that we can copy over the changes when done
var oldUser = $scope.user;
// Copy data into a new conection object in case the user doesn't want to save
$scope.user = angular.copy($scope.user);
var identifier = $routeParams.id;
// Pull user data
userService.getUser(identifier).success(function userReceived(user) {
$scope.user = user;
});
/**
* Close the modal.
@@ -205,7 +207,7 @@ angular.module('manage').controller('userEditModalController', ['$scope', '$inje
originalSystemPermissions;
// Get the permissions for the user we are editing
permissionService.getPermissions($scope.user.username).success(function gotPermissions(permissions) {
permissionService.getPermissions(identifier).success(function gotPermissions(permissions) {
$scope.permissions = permissions;
// Figure out if the user has any system level permissions
@@ -247,16 +249,8 @@ angular.module('manage').controller('userEditModalController', ['$scope', '$inje
// Close the modal
userEditModal.deactivate();
});
}
/**
* Toggle the open/closed status of the connectionGroup.
*
* @param {object} connectionGroup The connection group to toggle.
*/
$scope.toggleExpanded = function toggleExpanded(connectionGroup) {
connectionGroup.expanded = !connectionGroup.expanded;
};
}]);

2
guacamole/src/main/webapp/app/manage/styles/buttons.css
View File

@@ -42,7 +42,7 @@ a.button.add-connection {
}
button.add-connection-group {
a.button.add-connection-group {
background-image: url('images/action-icons/guac-group-add.png');
background-repeat: no-repeat;

8
guacamole/src/main/webapp/app/manage/styles/manageConnection.css → guacamole/src/main/webapp/app/manage/styles/forms.css
View File

@@ -20,19 +20,17 @@
* THE SOFTWARE.
*/
.manage-connection .info table,
.manage-connection .parameters table {
.manage .properties table {
margin: 1em;
}
.manage-connection .info table th,
.manage-connection .parameters table th {
.manage .properties table th {
text-align: left;
font-weight: normal;
padding-right: 1em;
}
.manage-connection .action-buttons {
.manage .action-buttons {
text-align: center;
margin-bottom: 1em;
}

4
guacamole/src/main/webapp/app/manage/templates/connectionGroup.html
View File

@@ -1,4 +1,4 @@
<span class="name" ng-click="context.editConnectionGroup(item.wrappedItem)">
<a ng-href="#/manage/connectionGroups/{{item.identifier}}">
<!--
Copyright (C) 2014 Glyptodon LLC
@@ -22,4 +22,4 @@
-->
{{item.name}}
</span>
</a>

79
guacamole/src/main/webapp/app/manage/templates/editableConnectionGroup.html
View File

@@ -1,79 +0,0 @@
<!--
Copyright 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.
-->
<!-- Dialog container for the modal -->
<div class="dialog-container">
<div class="dialog edit">
<!-- Connection group name -->
<div class="header">
<h2>{{connectionGroup.name}}</h2>
</div>
<!-- Main connection group edit section -->
<div class="body">
<div class="form">
<div class="settings section">
<dl>
<dd>
<table class="fields section">
<!-- Edit connection group name -->
<tr>
<th>{{'manage.edit.connectionGroup.name' | translate}}</th>
<td><input type="text" ng-model="connectionGroup.name"/></td>
</tr>
<!-- Edit connection group location -->
<tr>
<th>{{'manage.edit.connectionGroup.location' | translate}}</th>
<td>
<location-chooser value="connectionGroup.parentIdentifier" root-group="rootGroup"/>
</td>
</tr>
<!-- Edit connection group type -->
<tr>
<th>{{'manage.edit.connectionGroup.type.label' | translate}}</th>
<td>
<select ng-model="connectionGroup.type" ng-options="type.value as 'manage.edit.connectionGroup.type.' + type.label | translate for type in types | orderBy: name"></select>
</td>
</tr>
</table>
</dd>
</dl>
</div>
</div>
</div>
<!-- Control buttons -->
<div class="footer">
<button ng-click="save()">{{'manage.edit.connectionGroup.save' | translate}}</button>
<button ng-click="close()">{{'manage.edit.connectionGroup.cancel' | translate}}</button>
<button ng-click="delete()" class="danger">{{'manage.edit.connectionGroup.delete' | translate}}</button>
</div>
</div>
</div>

141
guacamole/src/main/webapp/app/manage/templates/editableUser.html
View File

@@ -1,141 +0,0 @@
<!--
Copyright 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.
-->
<!-- Hierarchical connection and connection group permission selector -->
<script type="text/ng-template" id="nestedUserPermissionEditGroup.html">
<!-- Connection -->
<div class="choice" ng-show="item.isConnection">
<input type="checkbox" ng-model="connectionPermissions[item.identifier]" ng-change="markConnectionPermissionModified(item.identifier)"/>
<div class="connection list-item">
<div class="caption">
<div class="protocol">
<div class="icon" ng-class="item.protocol"></div>
</div><span class="name">{{item.name}}</span>
</div>
</div>
</div>
<!-- Connection group -->
<div class="choice" ng-show="!item.isConnection">
<input type="checkbox" ng-model="connectionGroupPermissions[item.identifier]" ng-change="markConnectionGroupPermissionModified(item.identifier)"/>
<div class="group empty list-item balancer">
<div class="caption">
<div class="icon group" ng-click="toggleExpanded(item)" ng-class="{expanded: item.expanded, empty: !item.children.length, balancer: item.balancer && !item.children.length}"></div>
<span class="name">{{item.name}}</span>
</div>
<!-- Connection group children -->
<div class="children" ng-show="item.expanded">
<div ng-repeat="item in item.children | orderBy : 'name'" ng-include="'nestedUserPermissionEditGroup.html'">
</div>
</div>
</div>
</script>
<!-- User edit modal -->
<div class="dialog-container">
<div class="dialog edit">
<div class="header">
<h2>{{user.username}}</h2>
</div>
<div class="body">
<div class="form">
<div class="settings section">
<dl>
<!-- User properties section -->
<dt>{{'manage.edit.user.properties' | translate}}</dt>
<dd>
<table class="fields section">
<tr>
<th>{{'manage.edit.user.password' | translate}}</th>
<td><input ng-model="user.password" type="password" /></td>
</tr>
<tr>
<th>{{'manage.edit.user.passwordMatch' | translate}}</th>
<td><input ng-model="passwordMatch" type="password" /></td>
</tr>
</table>
</dd>
<!-- System permissions section -->
<dt>{{'manage.edit.user.permissions' | translate}}</dt>
<dd>
<table class="permissions section">
<tr>
<th>{{'manage.edit.user.administerSystem' | translate}}</th>
<td><input type="checkbox" ng-model="systemPermissions.ADMINISTER" ng-change="markSystemPermissionModified('ADMINISTER')" /></td>
</tr>
<tr>
<th>{{'manage.edit.user.createUser' | translate}}</th>
<td><input type="checkbox" ng-model="systemPermissions.CREATE_USER" ng-change="markSystemPermissionModified('CREATE_USER')" /></td>
</tr>
<tr>
<th>{{'manage.edit.user.createConnection' | translate}}</th>
<td><input type="checkbox" ng-model="systemPermissions.CREATE_CONNECTION" ng-change="markSystemPermissionModified('CREATE_CONNECTION')" /></td>
</tr>
<tr>
<th>{{'manage.edit.user.createConnectionGroup' | translate}}</th>
<td><input type="checkbox" ng-model="systemPermissions.CREATE_CONNECTION_GROUP" ng-change="markSystemPermissionModified('CREATE_CONNECTION_GROUP')" /></td>
</tr>
</table>
</dd>
<!-- Connection and connection group permission section -->
<dt>{{'manage.edit.user.connections' | translate}}</dt>
<dd>
<div class="group-view">
<div class="list">
<div ng-repeat="item in rootGroup.children | orderBy : 'name'" ng-include="'nestedUserPermissionEditGroup.html'"></div>
</div>
</div>
</dd>
</dl>
</div>
</div>
</div>
<!-- Form controls -->
<div class="footer">
<button ng-click="save()">{{'manage.edit.user.save' | translate}}</button>
<button ng-click="close()">{{'manage.edit.user.cancel' | translate}}</button>
<button ng-click="delete()" class="danger">{{'manage.edit.user.delete' | translate}}</button>
</div>
</div>
</div>

10
guacamole/src/main/webapp/app/manage/templates/manage.html
View File

@@ -40,11 +40,11 @@ THE SOFTWARE.
</div>
<!-- List of users this user has access to -->
<div class="user-list" ng-class="{loading: loadingUsers}">
<div ng-click="editUser(user)" ng-repeat="user in users | orderBy : 'username'" class="list-item">
<div class="user-list" ng-class="{loading: !users}">
<div ng-repeat="user in users | orderBy : 'username'" class="user list-item">
<div class="caption">
<div class="icon user"></div>
<span class="name">{{user.username}}</span>
<a class="name" ng-href="#/manage/users/{{user.username}}">{{user.username}}</a>
</div>
</div>
</div>
@@ -58,11 +58,11 @@ THE SOFTWARE.
<!-- Control to create a new connection or group -->
<div class="connection-add-form">
<a class="add-connection button" href="#/manage/connections/">{{'manage.newConnection' | translate}}</a>
<button ng-click="newConnectionGroup()" class="add-connection-group">{{'manage.newGroup' | translate}}</button>
<a class="add-connection-group button" href="#/manage/connectionGroups/">{{'manage.newGroup' | translate}}</a>
</div>
<!-- List of connections and groups this user has access to -->
<div class="connection-list" ng-class="{loading: loadingConnections}">
<div class="connection-list" ng-class="{loading: !rootGroup}">
<guac-group-list
context="groupListContext"
connection-group="rootGroup"

10
guacamole/src/main/webapp/app/manage/templates/manageConnection.html
View File

@@ -29,7 +29,7 @@ THE SOFTWARE.
<h2>{{'manage.edit.connection.title' | translate}}</h2>
<!-- Main connection edit section -->
<div class="info">
<div class="properties">
<table>
<!-- Edit connection name -->
@@ -62,7 +62,7 @@ THE SOFTWARE.
<!-- Connection parameters -->
<h2>{{'manage.edit.connection.parameters' | translate}}</h2>
<div class="parameters" ng-class="{loading: !parameters}">
<div class="properties" ng-class="{loading: !parameters}">
<table class="fields">
<!-- All the different possible editable field types -->
@@ -77,9 +77,9 @@ THE SOFTWARE.
<!-- Form action buttons -->
<div class="action-buttons">
<button ng-click="save()">{{'manage.edit.connection.save' | translate}}</button>
<button ng-click="close()">{{'manage.edit.connection.cancel' | translate}}</button>
<button ng-click="delete()" class="danger">{{'manage.edit.connection.delete' | translate}}</button>
<button ng-click="saveConnection()">{{'manage.edit.connection.save' | translate}}</button>
<button ng-click="cancel()">{{'manage.edit.connection.cancel' | translate}}</button>
<button ng-click="deleteConnection()" class="danger">{{'manage.edit.connection.delete' | translate}}</button>
</div>
<!-- History connection area -->

65
guacamole/src/main/webapp/app/manage/templates/manageConnectionGroup.html Normal file
View File

@@ -0,0 +1,65 @@
<!--
Copyright 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.
-->
<div class="logout-panel">
<a class="back button" href="#/manage/">{{'manage.back' | translate}}</a>
<a class="logout button" ng-click="logout()">{{'home.logout' | translate}}</a>
</div>
<!-- Connection group name -->
<h2>{{connectionGroup.name}}</h2>
<div class="properties">
<table>
<!-- Edit connection group name -->
<tr>
<th>{{'manage.edit.connectionGroup.name' | translate}}</th>
<td><input type="text" ng-model="connectionGroup.name"/></td>
</tr>
<!-- Edit connection group location -->
<tr>
<th>{{'manage.edit.connectionGroup.location' | translate}}</th>
<td>
<location-chooser value="connectionGroup.parentIdentifier" root-group="rootGroup"/>
</td>
</tr>
<!-- Edit connection group type -->
<tr>
<th>{{'manage.edit.connectionGroup.type.label' | translate}}</th>
<td>
<select ng-model="connectionGroup.type" ng-options="type.value as 'manage.edit.connectionGroup.type.' + type.label | translate for type in types | orderBy: name"></select>
</td>
</tr>
</table>
</div>
<!-- Control buttons -->
<div class="action-buttons">
<button ng-click="save()">{{'manage.edit.connectionGroup.save' | translate}}</button>
<button ng-click="close()">{{'manage.edit.connectionGroup.cancel' | translate}}</button>
<button ng-click="delete()" class="danger">{{'manage.edit.connectionGroup.delete' | translate}}</button>
</div>

125
guacamole/src/main/webapp/app/manage/templates/manageUser.html Normal file
View File

@@ -0,0 +1,125 @@
<!--
Copyright 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.
-->
<!-- Hierarchical connection and connection group permission selector -->
<script type="text/ng-template" id="nestedUserPermissionEditGroup.html">
<!-- Connection -->
<div class="choice" ng-show="item.isConnection">
<input type="checkbox" ng-model="connectionPermissions[item.identifier]" ng-change="markConnectionPermissionModified(item.identifier)"/>
<div class="connection list-item">
<div class="caption">
<div class="protocol">
<div class="icon" ng-class="item.protocol"></div>
</div><span class="name">{{item.name}}</span>
</div>
</div>
</div>
<!-- Connection group -->
<div class="choice" ng-show="!item.isConnection">
<input type="checkbox" ng-model="connectionGroupPermissions[item.identifier]" ng-change="markConnectionGroupPermissionModified(item.identifier)"/>
<div class="group empty list-item balancer">
<div class="caption">
<div class="icon group" ng-click="toggleExpanded(item)" ng-class="{expanded: item.expanded, empty: !item.children.length, balancer: item.balancer && !item.children.length}"></div>
<span class="name">{{item.name}}</span>
</div>
<!-- Connection group children -->
<div class="children" ng-show="item.expanded">
<div ng-repeat="item in item.children | orderBy : 'name'" ng-include="'nestedUserPermissionEditGroup.html'">
</div>
</div>
</div>
</script>
<div class="logout-panel">
<a class="back button" href="#/manage/">{{'manage.back' | translate}}</a>
<a class="logout button" ng-click="logout()">{{'home.logout' | translate}}</a>
</div>
<!-- User edit modal -->
<h2>{{user.username}}</h2>
<div class="properties">
<table>
<tr>
<th>{{'manage.edit.user.password' | translate}}</th>
<td><input ng-model="user.password" type="password" /></td>
</tr>
<tr>
<th>{{'manage.edit.user.passwordMatch' | translate}}</th>
<td><input ng-model="passwordMatch" type="password" /></td>
</tr>
</table>
</div>
<!-- System permissions section -->
<h2>{{'manage.edit.user.permissions' | translate}}</h2>
<div class="properties">
<table>
<tr>
<th>{{'manage.edit.user.administerSystem' | translate}}</th>
<td><input type="checkbox" ng-model="systemPermissions.ADMINISTER" ng-change="markSystemPermissionModified('ADMINISTER')" /></td>
</tr>
<tr>
<th>{{'manage.edit.user.createUser' | translate}}</th>
<td><input type="checkbox" ng-model="systemPermissions.CREATE_USER" ng-change="markSystemPermissionModified('CREATE_USER')" /></td>
</tr>
<tr>
<th>{{'manage.edit.user.createConnection' | translate}}</th>
<td><input type="checkbox" ng-model="systemPermissions.CREATE_CONNECTION" ng-change="markSystemPermissionModified('CREATE_CONNECTION')" /></td>
</tr>
<tr>
<th>{{'manage.edit.user.createConnectionGroup' | translate}}</th>
<td><input type="checkbox" ng-model="systemPermissions.CREATE_CONNECTION_GROUP" ng-change="markSystemPermissionModified('CREATE_CONNECTION_GROUP')" /></td>
</tr>
</table>
</div>
<!-- Connection and connection group permission section -->
<h2>{{'manage.edit.user.connections' | translate}}</h2>
<div>
<div class="group-view">
<div class="list">
<div ng-repeat="item in rootGroup.children | orderBy : 'name'" ng-include="'nestedUserPermissionEditGroup.html'"></div>
</div>
</div>
</div>
<!-- Form controls -->
<div class="action-buttons">
<button ng-click="save()">{{'manage.edit.user.save' | translate}}</button>
<button ng-click="close()">{{'manage.edit.user.cancel' | translate}}</button>
<button ng-click="delete()" class="danger">{{'manage.edit.user.delete' | translate}}</button>
</div>

2
guacamole/src/main/webapp/app/notification/templates/guacNotification.html
View File

@@ -41,7 +41,7 @@
<!-- Buttons -->
<div ng-show="notification.actions.length" class="buttons">
<button ng-repeat="action in notification.actions" ng-click="action.callback()">{{action.name | translate}}</button>
<button ng-repeat="action in notification.actions" ng-click="action.callback()" ng-class="action.className">{{action.name | translate}}</button>
</div>
</div>

12
guacamole/src/main/webapp/app/notification/types/NotificationAction.js
View File

@@ -35,8 +35,11 @@ angular.module('notification').factory('NotificationAction', [function defineNot
*
* @param {Function} callback
* The callback to call when the user elects to perform this action.
*
* @param {String} className
* The CSS class to associate with this action, if any.
*/
var NotificationAction = function NotificationAction(name, callback) {
var NotificationAction = function NotificationAction(name, callback, className) {
/**
* Reference to this NotificationAction.
@@ -45,6 +48,13 @@ angular.module('notification').factory('NotificationAction', [function defineNot
*/
var action = this;
/**
* The CSS class associated with this action.
*
* @type String
*/
this.className = className;
/**
* The name of this action.
*

10
guacamole/src/main/webapp/translations/en_US.json
View File

@@ -43,6 +43,10 @@
"cancel" : "Cancel",
"save" : "Save",
"delete" : "Delete",
"confirmDelete" : {
"title" : "Delete Connection",
"text" : "Connections cannot be restored after they have been deleted. Are you sure you want to delete this connection?"
},
"protocol" : "Protocol:",
"root" : "ROOT",
"location" : "Location:",
@@ -87,6 +91,12 @@
"createConnectionGroup" : "Create new connection groups:",
"connections" : "Connections:"
}
},
"error": {
"title" : "Error",
"action": {
"acknowledge" : "OK"
}
}
},
"protocol": {