GUACAMOLE-1509: Add contextual CSS classes to containers/elements that are otherwise ambiguous.

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

@@ -1,4 +1,4 @@
-<div class="connection">
+<div class="connection-select-menu-connection connection">
     <input type="checkbox"
            ng-model="context.attachedClients[item.getClientIdentifier()]"
            ng-change="context.updateAttachedClients(item.getClientIdentifier())">

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

@@ -1,4 +1,4 @@
-<div class="connection-group">
+<div class="connection-select-menu-connection-group connection-group">
     <input type="checkbox"
            ng-show="item.balancing"
            ng-model="context.attachedClients[item.getClientIdentifier()]"

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

@@ -1,4 +1,4 @@
-<div class="list-item">
+<div class="file-browser-file list-item">
 
     <!-- Filename and icon -->
     <div class="caption">

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

@@ -1,4 +1,4 @@
-<div class="main"
+<div class="client-main main"
      ng-class="{ 'drop-pending': dropPending }"
      guac-resize="mainElementResized"
      guac-touch-drag="clientDrag"

guacamole/src/main/frontend/src/app/form/services/formService.js

@@ -91,7 +91,7 @@ angular.module('form').provider('formService', function formServiceProvider() {
          * @type FieldType
          */
         'USERNAME' : {
-            templateUrl : 'app/form/templates/textField.html'
+            templateUrl : 'app/form/templates/usernameField.html'
         },
 
         /**

guacamole/src/main/frontend/src/app/form/templates/checkboxField.html

@@ -1,8 +1,10 @@
-<input type="checkbox"
-       ng-attr-id="{{ fieldId }}"
-       ng-attr-name="{{ field.name }}"
-       ng-disabled="disabled"
-       ng-model="typedValue"
-       guac-focus="focused"
-       autocorrect="off"
-       autocapitalize="off">
+<div class="checkbox-field">
+    <input type="checkbox"
+           ng-attr-id="{{ fieldId }}"
+           ng-attr-name="{{ field.name }}"
+           ng-disabled="disabled"
+           ng-model="typedValue"
+           guac-focus="focused"
+           autocorrect="off"
+           autocapitalize="off">
+</div>

guacamole/src/main/frontend/src/app/form/templates/languageField.html

@@ -1,5 +1,7 @@
-<select guac-focus="focused"
-        ng-attr-id="{{ fieldId }}"
-        ng-attr-name="{{ field.name }}"
-        ng-model="model"
-        ng-options="language.key as language.value for language in languages | toArray | orderBy: key"></select>
+<div class="language-field">
+    <select guac-focus="focused"
+            ng-attr-id="{{ fieldId }}"
+            ng-attr-name="{{ field.name }}"
+            ng-model="model"
+            ng-options="language.key as language.value for language in languages | toArray | orderBy: key"></select>
+</div>

guacamole/src/main/frontend/src/app/form/templates/numberField.html

@@ -1,8 +1,10 @@
-<input type="number"
-       ng-disabled="disabled"
-       ng-attr-id="{{ fieldId }}"
-       ng-attr-name="{{ field.name }}"
-       ng-model="typedValue"
-       guac-focus="focused"
-       autocorrect="off"
-       autocapitalize="off">
+<div class="number-field">
+    <input type="number"
+           ng-disabled="disabled"
+           ng-attr-id="{{ fieldId }}"
+           ng-attr-name="{{ field.name }}"
+           ng-model="typedValue"
+           guac-focus="focused"
+           autocorrect="off"
+           autocapitalize="off">
+</div>

guacamole/src/main/frontend/src/app/form/templates/selectField.html

@@ -1,6 +1,8 @@
-<select ng-attr-id="{{ fieldId }}"
-        ng-attr-name="{{ field.name }}"
-        ng-disabled="disabled"
-        guac-focus="focused"
-        ng-model="model"
-        ng-options="option as getFieldOption(option) | translate for option in field.options | orderBy: value"></select>
+<div class="select-field">
+    <select ng-attr-id="{{ fieldId }}"
+            ng-attr-name="{{ field.name }}"
+            ng-disabled="disabled"
+            guac-focus="focused"
+            ng-model="model"
+            ng-options="option as getFieldOption(option) | translate for option in field.options | orderBy: value"></select>
+</div>

guacamole/src/main/frontend/src/app/form/templates/textAreaField.html

@@ -1,7 +1,9 @@
-<textarea ng-attr-id="{{ fieldId }}"
-          ng-attr-name="{{ field.name }}"
-          ng-model="model"
-          ng-disabled="disabled"
-          guac-focus="focused"
-          autocorrect="off"
-          autocapitalize="off"></textarea>
+<div class="text-area-field">
+    <textarea ng-attr-id="{{ fieldId }}"
+              ng-attr-name="{{ field.name }}"
+              ng-model="model"
+              ng-disabled="disabled"
+              guac-focus="focused"
+              autocorrect="off"
+              autocapitalize="off"></textarea>
+</div>

guacamole/src/main/frontend/src/app/form/templates/usernameField.html

@@ -0,0 +1,10 @@
+<div class="username-field">
+    <input type="text"
+           ng-attr-id="{{ fieldId }}"
+           ng-attr-name="{{ field.name }}"
+           ng-model="model"
+           ng-disabled="disabled"
+           guac-focus="focused"
+           autocorrect="off"
+           autocapitalize="off">
+</div>

guacamole/src/main/frontend/src/app/home/templates/guacRecentConnections.html

@@ -1,4 +1,4 @@
-<div>
+<div class="recent-connections">
 
     <!-- Text displayed if no recent connections exist -->
     <p class="placeholder" ng-hide="hasRecentConnections()">{{'HOME.INFO_NO_RECENT_CONNECTIONS' | translate}}</p>

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

@@ -1,5 +1,4 @@
-
-<div class="view" ng-class="{loading: !isLoaded()}">
+<div class="home-view view" ng-class="{loading: !isLoaded()}">
 
     <div class="connection-list-ui">
 
@@ -8,9 +7,7 @@
             <h2>{{'HOME.SECTION_HEADER_RECENT_CONNECTIONS' | translate}}</h2>
             <guac-user-menu></guac-user-menu>
         </div>
-        <div class="recent-connections">
-            <guac-recent-connections root-groups="rootConnectionGroups"></guac-recent-connections>
-        </div>
+        <guac-recent-connections root-groups="rootConnectionGroups"></guac-recent-connections>
 
         <!-- All connections for this user -->
         <div class="header">

guacamole/src/main/frontend/src/app/manage/templates/connectionGroupPermission.html

@@ -1,4 +1,4 @@
-<div class="choice">
+<div class="connection-group-permission choice">
 
     <!-- Connection group icon -->
     <div class="icon type"></div>

guacamole/src/main/frontend/src/app/manage/templates/connectionPermission.html

@@ -1,4 +1,4 @@
-<div class="choice">
+<div class="connection-permission choice">
 
     <!-- Connection icon -->
     <div class="icon type" ng-class="item.protocol"></div>

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

@@ -1,4 +1,4 @@
-<span class="name" ng-click="context.chooseGroup(item.wrappedItem)">
-
+<span class="location-chooser-connection-group name"
+      ng-click="context.chooseGroup(item.wrappedItem)">
     {{item.name}}
 </span>

guacamole/src/main/frontend/src/app/manage/templates/manageConnection.html

@@ -1,5 +1,5 @@
 
-<div class="view" ng-class="{loading: !isLoaded()}">
+<div class="manage-connection view" ng-class="{loading: !isLoaded()}">
 
     <!-- Main property editor -->
     <div class="header">

guacamole/src/main/frontend/src/app/manage/templates/manageConnectionGroup.html

@@ -1,5 +1,5 @@
 
-<div class="view" ng-class="{loading: !isLoaded()}">
+<div class="manage-connection-group view" ng-class="{loading: !isLoaded()}">
 
     <!-- Main property editor -->
     <div class="header">

guacamole/src/main/frontend/src/app/manage/templates/manageSharingProfile.html

@@ -1,4 +1,4 @@
-<div class="view" ng-class="{loading: !isLoaded()}">
+<div class="manage-sharing-profile view" ng-class="{loading: !isLoaded()}">
 
     <!-- Main property editor -->
     <div class="header">

guacamole/src/main/frontend/src/app/manage/templates/managementButtons.html

@@ -1,6 +1,6 @@
 <div class="action-buttons">
-    <button ng-show="permissions.canSaveObject" ng-click="saveObject()">{{namespace + '.ACTION_SAVE' | translate}}</button>
-    <button ng-show="permissions.canCloneObject" ng-click="cloneObject()">{{namespace + '.ACTION_CLONE' | translate}}</button>
-    <button ng-click="cancel()">{{namespace + '.ACTION_CANCEL' | translate}}</button>
-    <button ng-show="permissions.canDeleteObject" ng-click="deleteObject()" class="danger">{{namespace + '.ACTION_DELETE' | translate}}</button>
+    <button ng-show="permissions.canSaveObject" ng-click="saveObject()" class="save">{{namespace + '.ACTION_SAVE' | translate}}</button>
+    <button ng-show="permissions.canCloneObject" ng-click="cloneObject()" class="clone">{{namespace + '.ACTION_CLONE' | translate}}</button>
+    <button ng-click="cancel()" class="cancel">{{namespace + '.ACTION_CANCEL' | translate}}</button>
+    <button ng-show="permissions.canDeleteObject" ng-click="deleteObject()" class="danger delete">{{namespace + '.ACTION_DELETE' | translate}}</button>
 </div>

guacamole/src/main/frontend/src/app/manage/templates/sharingProfilePermission.html

@@ -1,4 +1,4 @@
-<div class="choice">
+<div class="sharing-profile-permission choice">
 
     <!-- Sharing profile icon -->
     <div class="icon type"></div>

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

@@ -1,5 +1,6 @@
 <a ng-href="#/manage/{{item.dataSource}}/connections/{{item.identifier}}"
-   ng-class="{active: item.getActiveConnections()}">
+   ng-class="{active: item.getActiveConnections()}"
+   class="settings-connection">
 
     <!-- Connection icon -->
     <div class="icon type" ng-class="item.protocol"></div>

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

@@ -1,4 +1,5 @@
-<a ng-href="#/manage/{{item.dataSource}}/connectionGroups/{{item.identifier}}">
+<a ng-href="#/manage/{{item.dataSource}}/connectionGroups/{{item.identifier}}"
+   class="settings-connection-group">
 
     <!-- Connection group icon -->
     <div class="icon type"></div>

guacamole/src/main/frontend/src/app/settings/templates/newConnection.html

@@ -1,3 +1,4 @@
-<a ng-href="#/manage/{{item.dataSource}}/connections/?parent={{item.wrappedItem.identifier}}">
+<a ng-href="#/manage/{{item.dataSource}}/connections/?parent={{item.wrappedItem.identifier}}"
+   class="new-connection">
     <span class="name">{{'SETTINGS_CONNECTIONS.ACTION_NEW_CONNECTION' | translate}}</span>
 </a>

guacamole/src/main/frontend/src/app/settings/templates/newConnectionGroup.html

@@ -1,3 +1,4 @@
-<a ng-href="#/manage/{{item.dataSource}}/connectionGroups/?parent={{item.wrappedItem.identifier}}">
+<a ng-href="#/manage/{{item.dataSource}}/connectionGroups/?parent={{item.wrappedItem.identifier}}"
+   class="new-connection-group">
     <span class="name">{{'SETTINGS_CONNECTIONS.ACTION_NEW_CONNECTION_GROUP' | translate}}</span>
 </a>

guacamole/src/main/frontend/src/app/settings/templates/newSharingProfile.html

@@ -1,3 +1,4 @@
-<a ng-href="#/manage/{{item.dataSource}}/sharingProfiles/?parent={{item.wrappedItem.identifier}}">
+<a ng-href="#/manage/{{item.dataSource}}/sharingProfiles/?parent={{item.wrappedItem.identifier}}"
+   class="new-sharing-profile">
     <span class="name">{{'SETTINGS_CONNECTIONS.ACTION_NEW_SHARING_PROFILE' | translate}}</span>
 </a>

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

@@ -1,5 +1,4 @@
-
-<div class="view">
+<div class="settings-view view">
 
     <div class="header tabbed">
         <h2>{{'SETTINGS.SECTION_HEADER_SETTINGS' | translate}}</h2>

guacamole/src/main/frontend/src/app/settings/templates/sharingProfile.html

@@ -1,4 +1,5 @@
-<a ng-href="#/manage/{{item.dataSource}}/sharingProfiles/{{item.identifier}}">
+<a ng-href="#/manage/{{item.dataSource}}/sharingProfiles/{{item.identifier}}"
+   class="settings-sharing-profile">
 
     <!-- Sharing profile icon -->
     <div class="icon type"></div>