GUAC-1406: Add filtering to connection admin UI.

guacamole/src/main/webapp/app/settings/directives/guacSettingsConnections.js

@@ -90,6 +90,25 @@ angular.module('settings').directive('guacSettingsConnections', [function guacSe
              */
             $scope.permissions = null;
 
+            /**
+             * Array of all connection properties that are filterable.
+             *
+             * @type String[]
+             */
+            $scope.filteredConnectionProperties = [
+                'name',
+                'protocol'
+            ];
+
+            /**
+             * Array of all connection group properties that are filterable.
+             *
+             * @type String[]
+             */
+            $scope.filteredConnectionGroupProperties = [
+                'name'
+            ];
+
             /**
              * Returns whether critical data has completed being loaded.
              *

guacamole/src/main/webapp/app/settings/templates/settingsConnections.html

@@ -24,16 +24,28 @@
     <!-- Connection management -->
     <p>{{'SETTINGS_CONNECTIONS.HELP_CONNECTIONS' | translate}}</p>
 
-    <!-- Form action buttons -->
-    <div class="action-buttons">
+    <!-- Connection management toolbar -->
+    <div class="toolbar">
 
-        <a class="add-connection button"
-           ng-show="canCreateConnections()"
-           href="#/manage/{{dataSource}}/connections/">{{'SETTINGS_CONNECTIONS.ACTION_NEW_CONNECTION' | translate}}</a>
+        <!-- Form action buttons -->
+        <div class="action-buttons">
 
-        <a class="add-connection-group button"
-           ng-show="canCreateConnectionGroups()"
-           href="#/manage/{{dataSource}}/connectionGroups/">{{'SETTINGS_CONNECTIONS.ACTION_NEW_CONNECTION_GROUP' | translate}}</a>
+            <a class="add-connection button"
+               ng-show="canCreateConnections()"
+               href="#/manage/{{dataSource}}/connections/">{{'SETTINGS_CONNECTIONS.ACTION_NEW_CONNECTION' | translate}}</a>
+
+            <a class="add-connection-group button"
+               ng-show="canCreateConnectionGroups()"
+               href="#/manage/{{dataSource}}/connectionGroups/">{{'SETTINGS_CONNECTIONS.ACTION_NEW_CONNECTION_GROUP' | translate}}</a>
+
+        </div>
+
+        <!-- Connection filter -->
+        <guac-group-list-filter connection-groups="rootGroups"
+            filtered-connection-groups="filteredRootGroups"
+            placeholder="'SETTINGS_CONNECTIONS.FIELD_PLACEHOLDER_FILTER' | translate"
+            connection-properties="filteredConnectionProperties"
+            connection-group-properties="filteredConnectionGroupProperties"></guac-group-list-filter>
 
     </div>
 
@@ -41,7 +53,7 @@
     <div class="connection-list">
         <guac-group-list
             page-size="25"
-            connection-groups="rootGroups"
+            connection-groups="filteredRootGroups"
             connection-template="'app/settings/templates/connection.html'"
             connection-group-template="'app/settings/templates/connectionGroup.html'"/>
     </div>

guacamole/src/main/webapp/translations/de.json

@@ -490,6 +490,8 @@
 
         "DIALOG_HEADER_ERROR" : "@:APP.DIALOG_HEADER_ERROR",
 
+        "FIELD_PLACEHOLDER_FILTER" : "@:APP.FIELD_PLACEHOLDER_FILTER",
+
         "HELP_CONNECTIONS"   : "Klicke oder Tippe auf eine Verbindung um diese zu verwalten. Abhänig von Ihrer Zugriffsebene können Verbindungen hinzugefügt, gelöscht oder Parameter (Protokol, Hostname, Port, etc.) geändert werden.",
         
         "INFO_ACTIVE_USER_COUNT" : "@:APP.INFO_ACTIVE_USER_COUNT",

guacamole/src/main/webapp/translations/en.json

@@ -515,6 +515,8 @@
 
         "DIALOG_HEADER_ERROR" : "@:APP.DIALOG_HEADER_ERROR",
 
+        "FIELD_PLACEHOLDER_FILTER" : "@:APP.FIELD_PLACEHOLDER_FILTER",
+
         "HELP_CONNECTIONS"   : "Click or tap on a connection below to manage that connection. Depending on your access level, connections can be added and deleted, and their properties (protocol, hostname, port, etc.) can be changed.",
         
         "INFO_ACTIVE_USER_COUNT" : "@:APP.INFO_ACTIVE_USER_COUNT",

guacamole/src/main/webapp/translations/fr.json

@@ -453,6 +453,8 @@
 
         "DIALOG_HEADER_ERROR"          : "Erreur",
 
+        "FIELD_PLACEHOLDER_FILTER" : "@:APP.FIELD_PLACEHOLDER_FILTER",
+
         "HELP_CONNECTIONS"   : "Cliquer ou appuyer sur une connexion en dessous pour la gérer. Selon vos permissions, les connexions peuvent être ajoutées, supprimées, leur propriétés (protocole, nom d'hôte, port, etc) changées.",
         
         "INFO_ACTIVE_USER_COUNT" : "@:APP.INFO_ACTIVE_USER_COUNT",

guacamole/src/main/webapp/translations/it.json

@@ -450,6 +450,8 @@
 
         "DIALOG_HEADER_ERROR" : "@:APP.DIALOG_HEADER_ERROR",
 
+        "FIELD_PLACEHOLDER_FILTER" : "@:APP.FIELD_PLACEHOLDER_FILTER",
+
         "HELP_CONNECTIONS"   : "Fai click o tap sulla connessione qui sotto per gestire quella connessione. In base al tuo livello di accesso, le connessioni possono essere craete, eliminate, e le relative proprietà (protocol, hostname, port, etc.) possono essere cambiate.",
         
         "INFO_ACTIVE_USER_COUNT" : "@:APP.INFO_ACTIVE_USER_COUNT",

guacamole/src/main/webapp/translations/nl.json

@@ -512,6 +512,8 @@
 
         "DIALOG_HEADER_ERROR" : "@:APP.DIALOG_HEADER_ERROR",
 
+        "FIELD_PLACEHOLDER_FILTER" : "@:APP.FIELD_PLACEHOLDER_FILTER",
+
         "HELP_CONNECTIONS"   : "Klik of tik op een verbinding hieronder om die verbinding te beheren. Afhankelijk van uw toegangsniveau kunnen verbindingen worden toegevoegd en verwijderd en hun eigenschappen (protocol, hostname, port, etc.) worden gewijzigd. ",
 
         "INFO_ACTIVE_USER_COUNT" : "@:APP.INFO_ACTIVE_USER_COUNT",

guacamole/src/main/webapp/translations/ru.json

@@ -421,6 +421,8 @@
 
         "DIALOG_HEADER_ERROR" : "@:APP.DIALOG_HEADER_ERROR",
 
+        "FIELD_PLACEHOLDER_FILTER" : "@:APP.FIELD_PLACEHOLDER_FILTER",
+
         "HELP_CONNECTIONS"   : "Нажмите на подключение, чтобы управлять им. В зависимости от прав доступа возможно добавление и удаление подключений, а также изменение их свойств (протокол, название сервера, порт и пр.).",
 
         "INFO_ACTIVE_USER_COUNT" : "@:APP.INFO_ACTIVE_USER_COUNT",