Implement GuacAdmin.ConnectionEditor.

guacamole/src/main/webapp/scripts/admin-ui.js

@@ -42,9 +42,7 @@ var GuacAdmin = {
 
     "cached_permissions" : null,
     "cached_protocols"   : null,
-    "cached_root_group"  : null,
-
-    "selected_connection" : null
+    "cached_root_group"  : null
 
 };
 
@@ -658,25 +656,24 @@ GuacAdmin.UserEditor = function(name, parameters) {
 };
 
 /**
- * Adds the given connection to the displayed connection list.
+ * Connection edit dialog which allows editing of the connection parameters.
+ * 
+ * @param {GuacamoleService.Connection} connection The connection to edit.
+ * @param {String} parameters Any parameters to add to service requests for sake
+ *                            of authentication.
  */
-GuacAdmin.addConnection = function(connection, parameters) {
+GuacAdmin.ConnectionEditor = function(connection, parameters) {
 
-    var item = new GuacAdmin.ListItem("connection", connection.name);
-    var item_element = item.getElement();
-    GuacAdmin.connectionPager.addElement(item_element);
-
-    item_element.onclick = function() {
-
-        // Ignore clicks if any item is selected
-        if (GuacAdmin.selected_connection) return;
-        else GuacAdmin.selected_connection = connection.id;
+    /**
+     * Dialog containing the user editor.
+     */
+    var dialog = new GuacUI.Dialog();
 
     var i;
 
     // Create form base elements
-        var form_element = GuacUI.createElement("div", "form");
-        var connection_header = GuacUI.createChildElement(form_element, "h2");
+    var connection_header = GuacUI.createChildElement(dialog.getHeader(), "h2");
+    var form_element = GuacUI.createChildElement(dialog.getBody(), "div", "form");
     connection_header.textContent = connection.name;
 
     var sections = GuacUI.createChildElement(
@@ -684,7 +681,7 @@ GuacAdmin.addConnection = function(connection, parameters) {
         "dl");
 
     // Parameter header
-        var protocol_header = GuacUI.createChildElement(sections, "dt")
+    var protocol_header = GuacUI.createChildElement(sections, "dt");
     protocol_header.textContent = "Protocol:";
     
     var protocol_field = GuacUI.createChildElement(protocol_header, "select");
@@ -715,7 +712,7 @@ GuacAdmin.addConnection = function(connection, parameters) {
         "table", "fields section");
 
     // History header
-        var history_header = GuacUI.createChildElement(sections, "dt")
+    var history_header = GuacUI.createChildElement(sections, "dt");
     history_header.textContent = "Usage History:";
 
     // If history present, display as table
@@ -759,7 +756,7 @@ GuacAdmin.addConnection = function(connection, parameters) {
             // Display record
             user.textContent = record.username;
             start.textContent = GuacAdmin.formatDate(record.start);
-                if (record.duration != null)
+            if (record.duration !== null)
                 duration.textContent = GuacAdmin.formatSeconds(record.duration);
             else
                 duration.textContent = "Active now";
@@ -773,7 +770,7 @@ GuacAdmin.addConnection = function(connection, parameters) {
         history_pager.setPage(0);
 
         // Add pager if more than one page
-            if (history_pager.last_page != 0)
+        if (history_pager.last_page !== 0)
             history_buttons.appendChild(history_pager.getElement());
 
     }
@@ -782,21 +779,6 @@ GuacAdmin.addConnection = function(connection, parameters) {
             GuacUI.createChildElement(sections, "dd"), "p").textContent =
                 "This connection has not yet been used.";
 
-        // Deselect
-        function deselect() {
-            GuacUI.removeClass(GuacAdmin.containers.connection_list, "disabled");
-            GuacUI.removeClass(item_element, "selected");
-            item_element.removeChild(form_element);
-            GuacAdmin.selected_connection = null;
-        }
-
-        // Select
-        function select() {
-            GuacUI.addClass(GuacAdmin.containers.connection_list, "disabled");
-            GuacUI.addClass(item_element, "selected");
-            item_element.appendChild(form_element);
-        }
-
     // Display fields for the given protocol name 
     function setFields(protocol_name) {
 
@@ -871,11 +853,8 @@ GuacAdmin.addConnection = function(connection, parameters) {
         setFields(this.value);
     };
 
-        // 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) {
 
@@ -899,7 +878,7 @@ GuacAdmin.addConnection = function(connection, parameters) {
 
             // Update connection
             GuacamoleService.Connections.update(updated_connection, parameters);
-                deselect();
+            dialog.getElement().parentNode.removeChild(dialog.getElement());
             GuacAdmin.reset();
 
         }
@@ -910,11 +889,11 @@ GuacAdmin.addConnection = function(connection, 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();
+        dialog.getElement().parentNode.removeChild(dialog.getElement());
     };
 
     // Add delete button if permission available
@@ -922,7 +901,7 @@ GuacAdmin.addConnection = function(connection, parameters) {
         connection.id in GuacAdmin.cached_permissions.remove_connection) {
         
         // 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 connection when clicked
@@ -936,8 +915,8 @@ GuacAdmin.addConnection = function(connection, parameters) {
 
                 // Attempt to delete connection
                 try {
-                        GuacamoleService.Connections.remove(GuacAdmin.selected_connection, parameters);
-                        deselect();
+                    GuacamoleService.Connections.remove(connection.id, parameters);
+                    dialog.getElement().parentNode.removeChild(dialog.getElement());
                     GuacAdmin.reset();
                 }
 
@@ -952,9 +931,8 @@ GuacAdmin.addConnection = function(connection, parameters) {
 
     }
 
-        // Select item
-        select();
-
+    this.getElement = function() {
+        return dialog.getElement();
     };
 
 };
@@ -1082,6 +1060,12 @@ GuacAdmin.reset = function() {
     var group_view = new GuacUI.GroupView(GuacAdmin.cached_root_group, false);
     GuacAdmin.containers.connection_list.appendChild(group_view.getElement());
 
+    // Show connection editor when connections are clicked
+    group_view.onconnectionclick = function(connection) {
+        var connection_dialog = new GuacAdmin.ConnectionEditor(connection, parameters);
+        document.body.appendChild(connection_dialog.getElement());
+    };
+
 };
 
 // Initial load