GUAC-1126: Add client-specific disconnect action to menu. Style with danger.

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

@@ -544,6 +544,19 @@ angular.module('client').controller('clientController', ['$scope', '$routeParams
 
     };
 
+    /**
+     * Action which immediately disconnects the currently-connected client, if
+     * any.
+     */
+    var DISCONNECT_MENU_ACTION = {
+        name      : 'CLIENT.ACTION_DISCONNECT',
+        className : 'danger disconnect',
+        callback  : $scope.disconnect
+    };
+
+    // Set client-specific menu actions
+    $scope.clientMenuActions = [ DISCONNECT_MENU_ACTION ];
+
     // Clean up when view destroyed
     $scope.$on('$destroy', function clientViewDestroyed() {
 

guacamole/src/main/webapp/app/client/styles/client.css

@@ -117,4 +117,12 @@ body.client {
     width: auto;
     height: auto;
 
-}
+}
+
+.client .user-menu .options li a.disconnect {
+    background-repeat: no-repeat;
+    background-size: 1em;
+    background-position: 0.75em center;
+    padding-left: 2.5em;
+    background-image: url('images/x.png');
+}

guacamole/src/main/webapp/app/client/styles/menu.css

@@ -81,37 +81,6 @@
     
 }
 
-.menu-content .header button.close {
-
-    margin: 0 0.75em;
-    padding: 0;
-    width: 1.5em;
-    height: 1.5em;
-    min-width: 0;
-    
-    box-shadow: none;
-    -moz-border-radius: 1.5em;
-    -webkit-border-radius: 1.5em;
-    -khtml-border-radius: 1.5em;
-    border-radius: 1.5em;
-
-    -moz-background-size: 0.75em;
-    -webkit-background-size: 0.75em;
-    -khtml-background-size: 0.75em;
-    background-size: 0.75em;
-
-    background-image: url('images/x-shadow.png');
-    background-repeat: no-repeat;
-    background-position: center;
-
-    vertical-align: middle;
-    -ms-flex-align-self: center;
-    -moz-align-self: center;
-    -webkit-align-self: center;
-    align-self: center;
-    
-}
-
 .menu-body {
 
     -ms-flex: 1 1 auto;

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

@@ -59,8 +59,7 @@
             <!-- Stationary header -->
             <div class="header">
                 <h2>{{client.name}}</h2>
-                <button class="close danger" ng-click="disconnect()" title="{{'CLIENT.ACTION_DISCONNECT' | translate}}"></button>
-                <guac-user-menu></guac-user-menu>
+                <guac-user-menu local-actions="clientMenuActions"></guac-user-menu>
             </div>
 
             <!-- Scrollable body -->

guacamole/src/main/webapp/app/navigation/directives/guacUserMenu.js

@@ -30,6 +30,16 @@ angular.module('navigation').directive('guacUserMenu', [function guacUserMenu()
         restrict: 'E',
         replace: true,
         scope: {
+
+            /**
+             * Optional array of actions which are specific to this particular
+             * location, as these actions may not be appropriate for other
+             * locations which contain the user menu.
+             *
+             * @type MenuAction[]
+             */
+            localActions : '='
+
         },
 
         templateUrl: 'app/navigation/templates/guacUserMenu.html',

guacamole/src/main/webapp/app/navigation/styles/user-menu.css

@@ -215,6 +215,16 @@
     background-image: url('images/action-icons/guac-logout-dark.png');
 }
 
+.user-menu .options li a.danger {
+    color: white;
+    font-weight: bold;
+    background-color: #A43;
+}
+
+.user-menu .options li a.danger:hover {
+    background-color: #C54;
+}
+
 .user-menu .password-dialog {
     visibility: hidden;
     opacity: 0;

guacamole/src/main/webapp/app/navigation/templates/guacUserMenu.html

@@ -28,6 +28,13 @@
         <!-- Menu options -->
         <ul class="options">
             
+            <!-- Local actions -->
+            <li ng-repeat="action in localActions">
+                <a ng-class="action.className" ng-click="action.callback()">
+                    {{action.name | translate}}
+                </a>
+            </li>
+
             <!-- Navigation links -->
             <li ng-repeat="page in pages">
                 <a class="home" ng-click="navigateToPage(page)"