Partially migrate to GuacUI.Dialog for user editing (via new GuacAdmin.UserEditor). Modify styles to support GuacUI.Dialog.

This commit is contained in:
Michael Jumper
2013-08-13 12:30:03 -07:00
parent 53a00ca39d
commit 0c94ba2907
2 changed files with 359 additions and 332 deletions

View File

@@ -26,7 +26,6 @@ var GuacAdmin = {
"connection_list" : document.getElementById("connection-list"),
"user_list" : document.getElementById("user-list"),
"user_list_buttons" : document.getElementById("user-list-buttons"),
"connection_list_buttons" : document.getElementById("connection-list-buttons")
},
"buttons" : {
@@ -43,7 +42,7 @@ var GuacAdmin = {
"cached_permissions" : null,
"cached_protocols" : null,
"cached_connections" : null,
"cached_root_group" : null,
"selected_user" : null,
"selected_connection" : null
@@ -362,6 +361,30 @@ GuacAdmin.addUser = function(name, parameters) {
if (GuacAdmin.selected_user) return;
else GuacAdmin.selected_user = name;
// Open user editor
var user_dialog = new GuacAdmin.UserEditor(name, parameters);
document.body.appendChild(user_dialog.getElement());
};
};
/**
* User edit dialog which allows editing of the user's password and connection
* access level.
*
* @param {String} name The name of the user to edit.
* @param {String} parameters Any parameters to add to service requests for sake
* of authentication.
*/
GuacAdmin.UserEditor = function(name, parameters) {
/**
* Dialog containing the user editor.
*/
var dialog = new GuacUI.Dialog();
// Get user permissions
var user_perms = GuacamoleService.Permissions.list(name, parameters);
@@ -370,8 +393,8 @@ GuacAdmin.addUser = function(name, parameters) {
var removed_perms = new GuacamoleService.PermissionSet();
// Create form base elements
var form_element = GuacUI.createElement("div", "form");
var user_header = GuacUI.createChildElement(form_element, "h2");
var user_header = GuacUI.createChildElement(dialog.getHeader(), "h2");
var form_element = GuacUI.createChildElement(dialog.getBody(), "div", "form");
var sections = GuacUI.createChildElement(
GuacUI.createChildElement(form_element, "div", "settings section"),
"dl");
@@ -384,21 +407,6 @@ GuacAdmin.addUser = function(name, parameters) {
user_header.textContent = name;
field_header.textContent = "Properties:";
// Deselect
function deselect() {
GuacUI.removeClass(GuacAdmin.containers.user_list, "disabled");
GuacUI.removeClass(item_element, "selected");
item_element.removeChild(form_element);
GuacAdmin.selected_user = null;
}
// Select
function select() {
GuacUI.addClass(GuacAdmin.containers.user_list, "disabled");
GuacUI.addClass(item_element, "selected");
item_element.appendChild(form_element);
}
// Add password field
var password_field = GuacUI.createChildElement(
GuacUI.createTabulatedContainer(field_table, "Password:"),
@@ -493,6 +501,11 @@ GuacAdmin.addUser = function(name, parameters) {
var connections_section = GuacUI.createChildElement(sections, "dd");
// FIXME - only list connections with admin permission
var group_view = new GuacUI.GroupView(GuacAdmin.cached_root_group, true);
connections_section.appendChild(group_view.getElement());
/*
// Actual paged connections list
var connections = GuacUI.createChildElement(
connections_section, "div", "list");
@@ -556,14 +569,12 @@ GuacAdmin.addUser = function(name, parameters) {
// Start at page 0
connections_pager.setPage(0);
*/
}
// Add buttons
var button_div = GuacUI.createChildElement(form_element, "div", "object-buttons");
// Add save button
var save_button = GuacUI.createChildElement(button_div, "button");
var save_button = GuacUI.createChildElement(dialog.getFooter(), "button");
save_button.textContent = "Save";
save_button.onclick = function(e) {
@@ -591,7 +602,7 @@ GuacAdmin.addUser = function(name, parameters) {
// Save user
GuacamoleService.Users.update(GuacAdmin.selected_user, password, added_perms, removed_perms, parameters);
deselect();
// FIXME: Hide dialog
GuacAdmin.reset();
}
@@ -602,11 +613,11 @@ GuacAdmin.addUser = function(name, parameters) {
};
// Add cancel button
var cancel_button = GuacUI.createChildElement(button_div, "button");
var cancel_button = GuacUI.createChildElement(dialog.getFooter(), "button");
cancel_button.textContent = "Cancel";
cancel_button.onclick = function(e) {
e.stopPropagation();
deselect();
// FIXME: Hide dialog
};
// Add delete button if permission available
@@ -614,7 +625,7 @@ GuacAdmin.addUser = function(name, parameters) {
name in GuacAdmin.cached_permissions.remove_user) {
// Create button
var delete_button = GuacUI.createChildElement(button_div, "button", "danger");
var delete_button = GuacUI.createChildElement(dialog.getFooter(), "button", "danger");
delete_button.textContent = "Delete";
// Remove selected user when clicked
@@ -629,7 +640,7 @@ GuacAdmin.addUser = function(name, parameters) {
// Attempt to delete user
try {
GuacamoleService.Users.remove(GuacAdmin.selected_user, parameters);
deselect();
// FIXME: Hide dialog
GuacAdmin.reset();
}
@@ -644,18 +655,12 @@ GuacAdmin.addUser = function(name, parameters) {
}
// Select item
select();
this.getElement = function() {
return dialog.getElement();
};
};
/**
* Currently-defined pager for connections, if any.
*/
GuacAdmin.connectionPager = null;
/**
* Adds the given connection to the displayed connection list.
*/
@@ -970,10 +975,7 @@ GuacAdmin.reset = function() {
// Query service for permissions, protocols, and connections
GuacAdmin.cached_permissions = GuacamoleService.Permissions.list(null, parameters);
GuacAdmin.cached_protocols = GuacamoleService.Protocols.list(parameters);
GuacAdmin.cached_connections = GuacamoleService.Connections.list(parameters);
// Sort connections by ID
GuacAdmin.cached_connections.sort(GuacamoleService.Connections.comparator);
GuacAdmin.cached_root_group = GuacamoleService.Connections.list(parameters);
// Connection management
if (GuacAdmin.cached_permissions.administer
@@ -1079,32 +1081,10 @@ GuacAdmin.reset = function() {
* Add readable connections.
*/
// Get previous page, if any
var connection_previous_page = 0;
if (GuacAdmin.connectionPager)
connection_previous_page = GuacAdmin.connectionPager.current_page;
// Add new pager
// Add new group view
GuacAdmin.containers.connection_list.innerHTML = "";
GuacAdmin.connectionPager = new GuacUI.Pager(GuacAdmin.containers.connection_list);
// Add connections to pager
for (i=0; i<GuacAdmin.cached_connections.length; i++) {
var connection = GuacAdmin.cached_connections[i];
if (GuacAdmin.cached_permissions.administer
|| connection.id in GuacAdmin.cached_permissions.update_connection)
GuacAdmin.addConnection(connection, parameters);
}
// If more than one page, add navigation buttons
GuacAdmin.containers.connection_list_buttons.innerHTML = "";
if (GuacAdmin.connectionPager.last_page != 0)
GuacAdmin.containers.connection_list_buttons.appendChild(
GuacAdmin.connectionPager.getElement());
// Set starting page
GuacAdmin.connectionPager.setPage(Math.min(GuacAdmin.connectionPager.last_page,
connection_previous_page));
var group_view = new GuacUI.GroupView(GuacAdmin.cached_root_group, false);
GuacAdmin.containers.connection_list.appendChild(group_view.getElement());
};

View File

@@ -118,21 +118,6 @@ div#version-dialog {
padding: 0.5em;
}
h2 {
padding: 0.5em;
margin: 0;
font-size: 1.5em;
font-weight: lighter;
text-shadow: 1px 1px white;
border-top: 1px solid #AAA;
border-bottom: 1px solid #AAA;
background: rgba(0, 0, 0, 0.07);
}
h1 {
margin: 0;
@@ -149,6 +134,66 @@ div.section {
padding: 1em;
}
/*
* Dialogs
*/
.dialog-container {
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.5);
padding: 1em;
}
.dialog {
max-width: 100%;
width: 8in;
margin-left: auto;
margin-right: auto;
max-height: 100%;
overflow: auto;
border: 1px solid rgba(0, 0, 0, 0.5);
background: #E7E7E7;
-moz-border-radius: 0.2em;
-webkit-border-radius: 0.2em;
-khtml-border-radius: 0.2em;
border-radius: 0.2em;
box-shadow: 0.1em 0.1em 0.2em rgba(0, 0, 0, 0.6);
}
.dialog > * {
margin: 1em;
}
.dialog .header {
margin: 0;
border-top: 1px solid #AAA;
border-bottom: 1px solid #AAA;
background: rgba(0, 0, 0, 0.07);
}
.dialog .header h2 {
padding: 0.5em;
margin: 0;
font-size: 1.5em;
font-weight: lighter;
text-shadow: 1px 1px white;
}
/*
* List elements
*/
@@ -220,6 +265,7 @@ div.section {
* List element fields (editing)
*/
/*
.form {
position: absolute;
@@ -240,6 +286,7 @@ div.section {
box-shadow: 0.1em 0.1em 0.2em rgba(0, 0, 0, 0.6);
}
*/
.form .fields th,
.form .permissions th {