GUAC-932: Migrate internals of locationChooser to guacGroupList.

guacamole/src/main/webapp/app/manage/controllers/manageController.js

@@ -105,7 +105,6 @@ angular.module('manage').controller('manageController', ['$scope', '$injector',
         {
             connection : {}, 
             protocols  : $scope.protocols,
-            moveItem   : $scope.moveItem,
             rootGroup  : $scope.rootGroup
         });
     };
@@ -117,7 +116,6 @@ angular.module('manage').controller('manageController', ['$scope', '$injector',
         connectionGroupEditModal.activate(
         {
             connectionGroup : {}, 
-            moveItem        : $scope.moveItem,
             rootGroup       : $scope.rootGroup
         });
     };

guacamole/src/main/webapp/app/manage/directives/locationChooser.js

@@ -30,63 +30,101 @@ angular.module('manage').directive('locationChooser', [function locationChooser(
         // Element only
         restrict: 'E',
         replace: true,
+
         scope: {
-            item: '=item',
+
-            root: '=root',
+            /**
+             * The root connection group of the connection group hierarchy to
+             * display.
+             *
+             * @type ConnectionGroup
+             */
+            rootGroup : '=',
+
+            /**
+             * The unique identifier of the currently-selected connection
+             * group. If not specified, the root group will be used.
+             *
+             * @type String
+             */
+            value : '='
+
         },
+
         templateUrl: 'app/manage/templates/locationChooser.html',
-        controller: ['$scope', '$injector', function locationChooserController($scope, $injector) {
+        controller: ['$scope', function locationChooserController($scope) {
-            // The dropdown should start closed
-            $scope.showDropDown = false;
-            
-            // Map of ID to name for all connection groups
-            $scope.connectionGroupNameMap = {};
-            
-            // Set up the group for display and search
-            mapConnectionGroupNames($scope.root);
-            $scope.connectionGroups = [$scope.root];
 
-            // Should be in the root group by default
+            /**
-            if(!$scope.item.parentIdentifier)
+             * Map of unique identifiers to their corresponding connection
-                $scope.item.parentIdentifier = $scope.root.parentIdentifier;
+             * groups.
+             *
+             * @type Object.<String, GroupListItem>
+             */
+            var connectionGroups = {};
+
+            var mapConnectionGroups = function mapConnectionGroups(group) {
+
+                // Map given group
+                connectionGroups[group.identifier] = group;
+
+                // Map all child groups
+                group.childConnectionGroups.forEach(mapConnectionGroups);
+
+            };
+
+            // Map all known groups
+            mapConnectionGroups($scope.rootGroup);
+
+            // If no value is specified, default to the root identifier
+            if (!$scope.value || !($scope.value in connectionGroups))
+                $scope.value = $scope.rootGroup.identifier;
+
+            /**
+             * Whether the group list menu is currently open.
+             * 
+             * @type Boolean
+             */
+            $scope.menuOpen = false;
+            
+            /**
+             * The human-readable name of the currently-chosen connection
+             * group.
+             * 
+             * @type String
+             */
+            $scope.chosenConnectionGroupName = connectionGroups[$scope.value].name; 
+            
+            /**
+             * Toggle the current state of the menu listing connection groups.
+             * If the menu is currently open, it will be closed. If currently
+             * closed, it will be opened.
+             */
+            $scope.toggleMenu = function toggleMenu() {
+                $scope.menuOpen = !$scope.menuOpen;
+            };
+
+            // Expose selection function to group list template
+            $scope.groupListContext = {
+                
+                /**
+                 * Selects the given group item.
+                 *
+                 * @param {GroupListItem} item
+                 *     The chosen item.
+                 */
+                chooseGroup : function chooseGroup(item) {
+
+                    // Record new parent
+                    $scope.value = item.identifier;
+                    $scope.chosenConnectionGroupName = item.name;
+
+                    // Close menu
+                    $scope.menuOpen = false;
 
-            setCurrentParentName();
-    
-            // Add the name of all connection groups under group to the group name map
-            function mapConnectionGroupNames(group) {
-                $scope.connectionGroupNameMap[group.identifier] = group.name;
-                for(var i = 0; i < group.children.length; i++) {
-                    var child = group.children[i];
-                    if(!child.isConnection)
-                        mapConnectionGroupNames(child);
                 }
-            }
+
-    
+            };
-            //Set the current connection group name to the name of the connection group with the currently chosen ID
+
-            function setCurrentParentName() {
-                $scope.currentConnectionGroupName = $scope.connectionGroupNameMap[$scope.item.parentIdentifier];
-            }
-            
-            // Watch for changes to the parentID, and update the current name as needed
-            $scope.currentConnectionGroupName = "";
-            $scope.$watch('item.parentIdentifier', function watchParentID() {
-                setCurrentParentName();
-            });
-            
-            /**
-             * Toggle the drop down - open or closed.
-             */
-            $scope.toggleDropDown = function toggleDropDown() {
-                $scope.showDropDown = !$scope.showDropDown;
-            }
-            
-            /**
-             * Choose a new parent ID for the item.
-             * @param {type} parentID The new parentID.
-             */
-            $scope.chooseParentID = function chooseParentID(parentID) {
-                $scope.item.parentIdentifier = parentID;
-            }
         }]
     };
     

guacamole/src/main/webapp/app/manage/templates/editableConnection.html

@@ -50,7 +50,7 @@ THE SOFTWARE.
                   <th>{{'manage.edit.connection.location' | translate}}</th>
 
                   <td>
-                    <location-chooser item="connection" root="rootGroup"/>
+                    <location-chooser value="connection.parentIdentifier" root-group="rootGroup"/>
                   </td>
                 </tr>
 

guacamole/src/main/webapp/app/manage/templates/editableConnectionGroup.html

@@ -50,7 +50,7 @@ THE SOFTWARE.
                   <th>{{'manage.edit.connectionGroup.location' | translate}}</th>
 
                   <td>
-                    <location-chooser item="connectionGroup" root="rootGroup"/>
+                    <location-chooser value="connectionGroup.parentIdentifier" root-group="rootGroup"/>
                   </td>
                 </tr>
 

guacamole/src/main/webapp/app/manage/templates/locationChooser.html

@@ -21,26 +21,15 @@
     THE SOFTWARE.
     -->
 
-    <script type="text/ng-template" id="nestedGroupSelect.html">
-        <div class="group" ng-show="!item.isConnection">
-            <div class="caption">
-                <div class="icon group type" ng-click="item.expanded = !item.expanded" ng-class="{expanded: item.expanded, empty: !item.children.length, balancer: item.balancer && !item.children.length}"></div>
-                <span class="name" ng-click="chooseParentID(item.identifier); toggleDropDown()">{{item.name}}</span>
-            </div>
-            <div class="children" ng-show="item.expanded">
-                <div class="list-item" ng-repeat="item in item.children | orderBy : 'name'" ng-include="'nestedGroupSelect.html'">
-            </div>
-        </div>
-    </script>
-
     <!-- Open the dropdown -->
-    <div ng-click="toggleDropDown()" class="location">{{currentConnectionGroupName}}</div>
+    <div ng-click="toggleMenu()" class="location">{{chosenConnectionGroupName}}</div>
 
-    <div ng-show="showDropDown" class="dropdown">
+    
-      <div class="group-view">
+    <div ng-show="menuOpen" class="dropdown">
-        <div class="list">
+        <guac-group-list
-            <div class="list-item" ng-repeat="item in connectionGroups | orderBy : 'name'" ng-include="'nestedGroupSelect.html'"></div>
+            context="groupListContext"
-        </div>
+            show-root-group="true"
-      </div>
+            connection-group="rootGroup"
+            connection-group-template="'app/manage/templates/locationChooserConnectionGroup.html'"/>
     </div>
 </div>

guacamole/src/main/webapp/app/manage/templates/locationChooserConnectionGroup.html

@@ -0,0 +1,25 @@
+<span class="name" ng-click="context.chooseGroup(item.wrappedItem)">
+    <!--
+       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.
+    -->
+
+    {{item.name}}
+</span>