GUACAMOLE-724: Expose checkboxes within Guacamole menu for adding/removing connections from current view.

guacamole/src/main/frontend/src/app/client/controllers/clientController.js

@@ -33,6 +33,7 @@ angular.module('client').controller('clientController', ['$scope', '$routeParams
     var ScrollState        = $injector.get('ScrollState');
 
     // Required services
+    var $location              = $injector.get('$location');
     var authenticationService  = $injector.get('authenticationService');
     var connectionGroupService = $injector.get('connectionGroupService');
     var clipboardService       = $injector.get('clipboardService');
@@ -188,6 +189,49 @@ angular.module('client').controller('clientController', ['$scope', '$routeParams
      */
     $scope.getTitle = ManagedClientGroup.getTitle;
 
+    /**
+     * Arbitrary context that should be exposed to the guacGroupList directive
+     * displaying the dropdown list of available connections within the
+     * Guacamole menu.
+     */
+    $scope.connectionListContext = {
+
+        /**
+         * The set of clients desired within the current view. For each client
+         * that should be present within the current view, that client's ID
+         * will map to "true" here.
+         *
+         * @type {Object.<string, boolean>}
+         */
+        attachedClients : {},
+
+        /**
+         * Notifies that the client with the given ID has been added or
+         * removed from the set of clients desired within the current view,
+         * and the current view should be updated accordingly.
+         *
+         * @param {string} id
+         *     The ID of the client that was added or removed from the current
+         *     view.
+         */
+        updateAttachedClients : function updateAttachedClients(id) {
+
+            // Deconstruct current path into corresponding client IDs
+            var ids = ManagedClientGroup.getClientIdentifiers($routeParams.id);
+
+            // Add/remove ID as requested
+            if ($scope.connectionListContext.attachedClients[id])
+                ids.push(id);
+            else
+                _.pull(ids, id);
+
+            // Reconstruct path, updating attached clients via change in route
+            $location.path('/client/' + encodeURIComponent(ManagedClientGroup.getIdentifier(ids)));
+
+        }
+
+    };
+
     /**
      * Reloads the contents of $scope.clientGroup to reflect the client IDs
      * currently listed in the URL.
@@ -200,6 +244,13 @@ angular.module('client').controller('clientController', ['$scope', '$routeParams
         $scope.clientGroup = guacClientManager.getManagedClientGroup($routeParams.id);
         $scope.clientGroup.attached = true;
 
+        // Store current set of attached clients for later use within the
+        // Guacamole menu
+        $scope.connectionListContext.attachedClients = {};
+        $scope.clientGroup.clients.forEach((client) => {
+            $scope.connectionListContext.attachedClients[client.id] = true;
+        });
+
         // Ensure menu is closed if updated view is not a modification of the
         // current view (has no clients in common). The menu should remain open
         // only while the current view is being modified, not when navigating

guacamole/src/main/frontend/src/app/client/styles/connection-select-menu.css

@@ -55,3 +55,8 @@
     overflow: hidden;
     text-overflow: ellipsis;
 }
+
+.connection-select-menu .menu-dropdown .menu-contents .caption .connection,
+.connection-select-menu .menu-dropdown .menu-contents .caption .connection-group {
+    display: inline-block;
+}

guacamole/src/main/frontend/src/app/client/templates/client.html

@@ -58,6 +58,7 @@
                                 connection-group-properties="filteredConnectionGroupProperties"></guac-group-list-filter>
                             <guac-group-list
                                 connection-groups="filteredRootConnectionGroups"
+                                context="connectionListContext"
                                 templates="{
                                     'connection'       : 'app/client/templates/connection.html',
                                     'connection-group' : 'app/client/templates/connectionGroup.html'

guacamole/src/main/frontend/src/app/client/templates/connection.html

@@ -1,5 +1,9 @@
-<a class="connection" ng-href="{{ item.getClientURL() }}">
+<div class="connection">
-    <div class="icon type" ng-class="item.protocol"></div>
+    <input type="checkbox"
-    <input type="checkbox">
+           ng-model="context.attachedClients[item.getClientIdentifier()]"
-    <span class="name">{{item.name}}</span>
+           ng-change="context.updateAttachedClients(item.getClientIdentifier())">
-</a>
+    <a ng-href="{{ item.getClientURL() }}">
+        <div class="icon type" ng-class="item.protocol"></div>
+        <span class="name">{{item.name}}</span>
+    </a>
+</div>

guacamole/src/main/frontend/src/app/client/templates/connectionGroup.html

@@ -1,5 +1,10 @@
-<a class="connection-group" ng-href="{{ item.getClientURL() }}">
+<div class="connection-group">
-    <div ng-show="item.balancing" class="icon type balancer"></div>
+    <input type="checkbox"
-    <input type="checkbox">
+           ng-show="item.balancing"
-    <span class="name">{{item.name}}</span>
+           ng-model="context.attachedClients[item.getClientIdentifier()]"
-</a>
+           ng-change="context.updateAttachedClients(item.getClientIdentifier())">
+    <a ng-href="{{ item.getClientURL() }}">
+        <div ng-show="item.balancing" class="icon type balancer"></div>
+        <span class="name">{{item.name}}</span>
+    </a>
+</div>

guacamole/src/main/frontend/src/app/client/types/ManagedClientGroup.js

@@ -97,18 +97,26 @@ angular.module('client').factory('ManagedClientGroup', ['$injector', function de
     };
 
     /**
-     * Returns the unique ID representing the given ManagedClientGroup. The ID
+     * Returns the unique ID representing the given ManagedClientGroup or set
-     * of each ManagedClientGroup consists simply of the IDs of all its
+     * of client IDs. The ID of a ManagedClientGroup consists simply of the
-     * ManagedClients, separated by periods.
+     * IDs of all its ManagedClients, separated by periods.
      *
-     * @param {ManagedClientGroup} group
+     * @param {ManagedClientGroup|string[]} group
-     *     The ManagedClientGroup to determine the ID of.
+     *     The ManagedClientGroup or array of client IDs to determine the
+     *     ManagedClientGroup ID of.
      *
      * @returns {string}
-     *     The unique ID representing the given ManagedClientGroup.
+     *     The unique ID representing the given ManagedClientGroup, or the
+     *     unique ID that would represent a ManagedClientGroup containing the
+     *     clients with the given IDs.
      */
     ManagedClientGroup.getIdentifier = function getIdentifier(group) {
-        return _.map(group.clients, client => client.id).join('.');
+
+        if (!_.isArray(group))
+            group = _.map(group.clients, client => client.id);
+
+        return group.join('.');
+
     };
 
     /**