GUACAMOLE-1293: Replace message list with overall shared user count.

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

@@ -792,24 +792,6 @@ angular.module('client').controller('clientController', ['$scope', '$routeParams
 
     };
     
-    /**
-     * Determines whether the attached client group has any associated client
-     * messages to display.
-     * 
-     * @returns {Boolean}
-     *     true if there are messages to display; otherwise false.
-     */
-    $scope.hasMessages = function hasMessages() {
-        
-        // No client group means no messages
-        if (!$scope.clientGroup)
-            return false;
-        
-        // Otherwise, find messages within the clients in the group.
-        return _.findIndex($scope.clientGroup.clients, ManagedClient.hasMessages) !== -1;
-        
-    };
-
     /**
      * Determines whether the attached client group has any associated file
      * transfers, regardless of those file transfers' state.

guacamole/src/main/frontend/src/app/client/directives/guacClientMessage.js

@@ -1,87 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-/**
- * Directive which displays a message for the client.
- */
-angular.module('client').directive('guacClientMessage', [function guacClientMessage() {
-
-    return {
-        restrict: 'E',
-        replace: true,
-        scope: {
-
-            /**
-             * The message to display to the client.
-             * 
-             * @type {!ManagedClientMessage}
-             */
-            message : '='
-
-        },
-
-        templateUrl: 'app/client/templates/guacClientMessage.html',
-        
-        controller: ['$scope', '$injector', '$element',
-                function guacClientMessageController($scope, $injector, $element) {
-            
-            // Required types
-            const ManagedClientMessage = $injector.get('ManagedClientMessage');
-            
-            // Required services
-            var translationStringService = $injector.get('translationStringService');
-            
-            /**
-             * Uses the msgcode to retrieve the correct translation key for
-             * the client message.
-             * 
-             * @returns {string}
-             */
-            $scope.getMessageKey = function getMessageKey() {
-                
-                let msgString = "DEFAULT";
-                if (Object.values(Guacamole.Client.Message).includes($scope.message.msgcode))
-                    msgString = Object.keys(Guacamole.Client.Message).find(key => Guacamole.Client.Message[key] === $scope.message.msgcode);
-                
-                return "CLIENT.MESSAGE_" + translationStringService.canonicalize(msgString);
-            };
-            
-            /**
-             * Returns a set of key/value object pairs that represent the
-             * arguments provided as part of the message in the form
-             * "ARGS_0 = value". Guacamole's translation system relies on
-             * the arguments being available in this format in order to be able
-             * to handle substituting values for an arbitrary list of arguments.
-             * 
-             * @returns {Object}
-             */
-            $scope.getMessageArgs = function getMessageArgs() {
-                return $scope.message.args.reduce(
-                    function(acc, value, index) {
-                        acc[`ARGS_${index}`] = value;
-                        return acc;
-                    },
-                    {}
-                );
-            };
-                
-        }]
-
-    };
-}]);

guacamole/src/main/frontend/src/app/client/directives/guacMessageDialog.js

@@ -1,76 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-/**
- * Directive which displays all client messages.
- */
-angular.module('client').directive('guacMessageDialog', [function guacMessageDialog() {
-
-    return {
-        restrict: 'E',
-        replace: true,
-        scope: {
-
-            /**
-             * The client group whose messages should be managed by this
-             * directive.
-             * 
-             * @type ManagedClientGroup
-             */
-            clientGroup : '='
-
-        },
-
-        templateUrl: 'app/client/templates/guacMessageDialog.html',
-        controller: ['$scope', '$injector', function guacMessageDialogController($scope, $injector) {
-
-            // Required types
-            const ManagedClient            = $injector.get('ManagedClient');
-            const ManagedClientGroup       = $injector.get('ManagedClientGroup');
-
-            /**
-             * Removes all messages.
-             */
-            $scope.clearAllMessages = function clearAllMessages() {
-                
-                // Nothing to clear if no client group attached
-                if (!$scope.clientGroup)
-                    return;
-
-                // Remove each client's messages
-                $scope.clientGroup.clients.forEach(client =>  {
-                    client.messages = [];
-                });
-
-            };
-
-            /**
-             * @borrows ManagedClientGroup.hasMultipleClients
-             */
-            $scope.hasMultipleClients = ManagedClientGroup.hasMultipleClients;
-
-            /**
-             * @borrows ManagedClient.hasMessages
-             */
-            $scope.hasMessages = ManagedClient.hasMessages;
-
-        }]
-
-    };
-}]);

guacamole/src/main/frontend/src/app/client/styles/client-message.css

@@ -1,23 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-p.client-message-text {
-    margin: 5px;
-}
-

guacamole/src/main/frontend/src/app/client/styles/message-dialog.css

@@ -1,122 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-#message-dialog {
-
-    position: absolute;
-    right: 0;
-    bottom: 0;
-    z-index: 20;
-
-    font-size: 0.8em;
-
-    width: 3in;
-    max-width: 100%;
-    max-height: 3in;
-    
-    background: white;
-    opacity: 0.75;
-
-}
-
-#message-dialog .message-dialog-box {
-
-    /* IE10 */
-    display: -ms-flexbox;
-    -ms-flex-align: stretch;
-    -ms-flex-direction: column;
-
-    /* Ancient Mozilla */
-    display: -moz-box;
-    -moz-box-align: stretch;
-    -moz-box-orient: vertical;
-
-    /* Ancient WebKit */
-    display: -webkit-box;
-    -webkit-box-align: stretch;
-    -webkit-box-orient: vertical;
-
-    /* Old WebKit */
-    display: -webkit-flex;
-    -webkit-align-items: stretch;
-    -webkit-flex-direction: column;
-
-    /* W3C */
-    display: flex;
-    align-items: stretch;
-    flex-direction: column;
-
-    max-width: inherit;
-    max-height: inherit;
-
-    border: 1px solid rgba(0, 0, 0, 0.5);
-    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.25);
-
-}
-
-#message-dialog .message-dialog-box .header {
-    -ms-flex: 0 0 auto;
-    -moz-box-flex: 0;
-    -webkit-box-flex: 0;
-    -webkit-flex: 0 0 auto;
-    flex: 0 0 auto;
-    margin-bottom: 5px;
-}
-
-#message-dialog .message-dialog-box .client-message-body {
-
-    -ms-flex: 1 1 auto;
-    -moz-box-flex: 1;
-    -webkit-box-flex: 1;
-    -webkit-flex: 1 1 auto;
-    flex: 1 1 auto;
-
-    overflow: auto;
-
-}
-
-/*
- * Shrink maximum height if viewport is too small for default 3in dialog.
- */
-@media all and (max-height: 3in) {
-
-    #message-dialog {
-        max-height: 1.5in;
-    }
-
-}
-
-/*
- * If viewport is too small for even the 1.5in dialog, fit all available space.
- */
-@media all and (max-height: 1.5in) {
-
-    #message-dialog {
-        height: 100%;
-    }
-
-    #message-dialog .message-dialog-box {
-        position: absolute;
-        left:   0.5em;
-        top:    0.5em;
-        right:  0.5em;
-        bottom: 0.5em;
-    }
-
-}

guacamole/src/main/frontend/src/app/client/styles/tiled-client-grid.css

@@ -110,10 +110,15 @@
 }
 
 .tiled-client-grid .client-tile .client-tile-header .client-tile-name {
+
     -webkit-box-flex: 1;
     -webkit-flex: 1;
     -ms-flex: 1;
     flex: 1;
+
+    padding: 0 0.5em;
+    margin-bottom: -0.125em;
+
 }
 
 .tiled-client-grid .client-tile .main {
@@ -136,3 +141,58 @@
 .tiled-client-grid .shared .client-tile-shared-indicator {
     display: inline;
 }
+
+.tiled-client-grid .client-user-count {
+
+    visibility: hidden;
+
+    display: block;
+    position: absolute;
+    right: 0;
+    top: 0;
+    z-index: 1;
+
+    border-radius: 0.25em;
+    padding: 0.125em 0.75em;
+    margin: 0.5em;
+
+    background: #055;
+    color: white;
+    font-weight: bold;
+    font-size: 0.8em;
+
+}
+
+.tiled-client-grid .client-user-count::before {
+
+    content: ' ';
+    display: inline-block;
+
+    margin-bottom: -0.2em;
+    padding-right: 0.25em;
+    width: 1em;
+    height: 1em;
+
+    background: center / contain no-repeat url('images/user-icons/guac-user-white.svg');
+    background-size: contain;
+    background-position: center;
+    background-repeat: no-repeat;
+
+}
+
+.tiled-client-grid .client-tile-header .client-user-count {
+    display: inline-block;
+    position: relative;
+    white-space: nowrap;
+    background: black;
+    padding-left: 0.5em;
+    padding-right: 0.75em;
+}
+
+.tiled-client-grid .client-tile-header .client-user-count::before {
+    padding-right: 0.75em;
+}
+
+.tiled-client-grid .joined .client-user-count {
+    visibility: visible;
+}

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

@@ -45,11 +45,6 @@
         {{'CLIENT.TEXT_CLIENT_STATUS_UNSTABLE' | translate}}
     </div>
     
-    <!-- Message dialog -->
-    <div id="message-dialog" ng-show="hasMessages()">
-        <guac-message-dialog client-group="clientGroup"></guac-message-dialog>
-    </div>
-
     <!-- Menu -->
     <div class="menu" ng-class="{open: menu.shown}" id="guac-menu">
         <div class="menu-content" ng-if="menu.shown" guac-touch-drag="menuDrag">

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

@@ -1,8 +0,0 @@
-<div class="client-message" ng-click="clear()">
-
-    <!-- Message text -->
-    <p class="client-message-text"
-       translate="{{ getMessageKey() }}"
-       translate-values="{{ getMessageArgs() }}"></p>
-
-</div>

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

@@ -1,21 +0,0 @@
-<div class="message-dialog-box">
-    
-    <!-- Message dialog header -->
-    <div class="header">
-        <h2>{{'CLIENT.SECTION_HEADER_CLIENT_MESSAGES' | translate}}</h2>
-        <button ng-click="clearAllMessages()">{{'CLIENT.ACTION_CLEAR_CLIENT_MESSAGES' | translate}}</button>
-    </div>
-
-    <!-- Received messages -->
-    <div class="client-messages-body">
-        <div class="client-messages-body-section" ng-repeat="client in clientGroup.clients" ng-show="hasMessages(client)">
-            <h3 ng-show="hasMultipleClients(clientGroup)">{{ client.name }}</h3>
-            <div class="messages">
-                <guac-client-message
-                    message="message"
-                    ng-repeat="message in client.messages">
-                </guac-client-message>
-            </div>
-        </div>
-    </div>
-</div>

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

@@ -5,12 +5,14 @@
             <div class="client-tile" ng-if="client"
                 ng-class="{
                     'focused' : client.clientProperties.focused,
-                    'shared'  : isShared(client)
+                    'shared'  : isShared(client),
+                    'joined'  : client.userCount
                 }"
                 guac-click="getFocusAssignmentCallback(client)">
                 <h3 class="client-tile-header" ng-if="hasMultipleClients(clientGroup)">
                     <img class="client-tile-shared-indicator" src="images/share-white.svg">
                     <span class="client-tile-name">{{ client.title }}</span>
+                    <span class="client-user-count">{{ client.userCount }}</span>
                     <img ng-click="onClose({ '$client' : client })"
                          class="client-tile-disconnect"
                          ng-attr-alt="{{ 'CLIENT.ACTION_DISCONNECT' | translate }}"
@@ -21,6 +23,11 @@
 
                 <!-- Client-specific status/error dialog -->
                 <guac-client-notification client="client"></guac-client-notification>
+
+                <div class="client-user-count" ng-if="!hasMultipleClients(clientGroup)">
+                    {{ client.userCount }}
+                </div>
+
             </div>
 
         </div>

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

@@ -17,6 +17,8 @@
  * under the License.
  */
 
+/* global Guacamole, _ */
+
 /**
  * Provides the ManagedClient class used by the guacClientManager service.
  */
@@ -28,7 +30,6 @@ angular.module('client').factory('ManagedClient', ['$rootScope', '$injector',
     const ClientIdentifier       = $injector.get('ClientIdentifier');
     const ClipboardData          = $injector.get('ClipboardData');
     const ManagedArgument        = $injector.get('ManagedArgument');
-    const ManagedClientMessage   = $injector.get('ManagedClientMessage');
     const ManagedClientState     = $injector.get('ManagedClientState');
     const ManagedClientThumbnail = $injector.get('ManagedClientThumbnail');
     const ManagedDisplay         = $injector.get('ManagedDisplay');
@@ -174,14 +175,25 @@ angular.module('client').factory('ManagedClient', ['$rootScope', '$injector',
          * @type ManagedFilesystem[]
          */
         this.filesystems = template.filesystems || [];
-        
+
         /**
-         * All messages that have been sent to the client that should be
+         * The current number of users sharing this connection, excluding the
-         * displayed.
+         * user that originally started the connection. Duplicate connections
-         * 
+         * from the same user are included in this total.
-         * @type ManagedClientMessage[]
          */
-        this.messages = template.messages || [];
+        this.userCount = template.userCount || 0;
+
+        /**
+         * All users currently sharing this connection, excluding the user that
+         * originally started the connection. If the connection is not shared,
+         * this object will be empty. This map consists of key/value pairs
+         * where each key is the user's username and each value is an object
+         * tracking the unique connections currently used by that user (a map
+         * of Guacamole protocol user IDs to boolean values).
+         *
+         * @type Object.<string, Object.<string, boolean>>
+         */
+        this.users = template.users || {};
 
         /**
          * All available share links generated for the this ManagedClient via
@@ -498,15 +510,44 @@ angular.module('client').factory('ManagedClient', ['$rootScope', '$injector',
         
         // Handle messages received from guacd to display to the client.
         client.onmsg = function clientMessage(msgcode, args) {
-            
+            switch (msgcode) {
-            msg = new ManagedClientMessage();
+
-            msg.msgcode = msgcode;
+                // Update current users on connection when a user joins/leaves
-            msg.args = args;
+                case Guacamole.Client.Message.USER_JOINED:
-            
+                case Guacamole.Client.Message.USER_LEFT:
-            $rootScope.$apply(function updateMessages() {
+
-                managedClient.messages.push(msg);
+                    var userID = args[0];
-            });
+                    var username = args[1];
-            
+
+                    var connections = managedClient.users[username] || {};
+                    managedClient.users[username] = connections;
+
+                    $rootScope.$apply(function usersChanged() {
+
+                        // Add/remove user
+                        if (msgcode === Guacamole.Client.Message.USER_JOINED) {
+                            managedClient.userCount++;
+                            connections[userID] = true;
+                        }
+                        else {
+                            managedClient.userCount--;
+                            delete connections[userID];
+                        }
+
+                        // Delete user entry after no connections remain
+                        if (_.isEmpty(connections))
+                            delete managedClient.users[username];
+
+                    });
+
+                    break;
+
+                default:
+                    // Ignore - we only handle join/leave messages, which are
+                    // currently the only messages defined at the protocol
+                    // level.
+
+            }
         };
 
         // Automatically update the client thumbnail
@@ -915,19 +956,6 @@ angular.module('client').factory('ManagedClient', ['$rootScope', '$injector',
 
     };
     
-    /**
-     * Returns whether the given client has any associated messages to display.
-     * 
-     * @param {GuacamoleClient} client
-     *     The client for which messages should be checked.
-     *     
-     * @returns {Boolean}
-     *     true if the given client has any messages, otherwise false.
-     */
-    ManagedClient.hasMessages = function hasMessages(client) {
-        return !!(client && client.messages && client.messages.length);
-    };
-
     /**
      * Returns whether the given client has any associated file transfers,
      * regardless of those file transfers' state.

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

@@ -1,59 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-/**
- * Provides the ManagedClientMessage class used for messages displayed in
- * a ManagedClient.
- */
-angular.module('client').factory('ManagedClientMessage', [function defineManagedClientMessage() {
-
-    /**
-     * Object which represents a message to be displayed to a Guacamole client.
-     *
-     * @constructor
-     * @param {ManagedClientMessage|Object} [template={}]
-     *     The object whose properties should be copied within the new
-     *     ManagedClientMessage.
-     */
-    var ManagedClientMessage = function ManagedClientMessage(template) {
-
-        // Use empty object by default
-        template = template || {};
-
-        /**
-         * The message code sent by the server that will be used to locate the
-         * message within the Guacamole translation framework.
-         * 
-         * @type Number
-         */
-        this.msgcode = template.msgcode;
-        
-        /**
-         * Any arguments that should be passed through the translation system
-         * and displayed as part of the message.
-         * 
-         * @type String[]
-         */
-        this.args = template.args;
-        
-    };
-
-    return ManagedClientMessage;
-
-}]);

guacamole/src/main/frontend/src/images/user-icons/guac-user-white.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64"><path d="M474.341 504.195c.005 31.957-.398 24.504-.398 58.628H208.914c0-52.862-.398-8.867-.398-58.628 0-47.522 67.134-73.133 131.412-73.133 64.277 0 134.405 18.656 134.413 73.133z" style="fill:#fff;fill-opacity:1;stroke:#000;stroke-width:.09023736;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dashoffset:0" transform="translate(-33.342 -44.364) scale(.19138)"/><path d="M48.002 28.63a16.506 16.506 0 1 1-33.012 0 16.506 16.506 0 1 1 33.012 0z" style="fill:#fff;fill-rule:evenodd;stroke:none" transform="translate(.504 -8)"/></svg>