safebox/guacamole-client
4
0
Fork 0
mirror of https://github.com/gyurix1968/guacamole-client.git synced 2025-09-06 13:17:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

GUACAMOLE-723: Automatically close menus upon click unless explicitly marked as interactive.

Browse Source
This commit is contained in:
Michael Jumper
2019-06-22 18:31:09 -07:00
parent 8ec139098a
commit 93dbf85a14
2 changed files with 19 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
guacamole/src/main/webapp/app/client/templates/client.html
View File

@@ -54,7 +54,7 @@
<div class="header"> <div class="header">
<h2 ng-hide="rootConnectionGroups">{{client.name}}</h2> <h2 ng-hide="rootConnectionGroups">{{client.name}}</h2>
<h2 class="connection-select-menu" ng-show="rootConnectionGroups"> <h2 class="connection-select-menu" ng-show="rootConnectionGroups">
<guac-menu menu-title="client.name"> <guac-menu menu-title="client.name" interactive="true">
<div class="all-connections"> <div class="all-connections">
<guac-group-list-filter connection-groups="rootConnectionGroups" <guac-group-list-filter connection-groups="rootConnectionGroups"
filtered-connection-groups="filteredRootConnectionGroups" filtered-connection-groups="filteredRootConnectionGroups"

29
guacamole/src/main/webapp/app/navigation/directives/guacMenu.js
View File

@@ -34,7 +34,16 @@ angular.module('navigation').directive('guacMenu', [function guacMenu() {
* *
* @type String * @type String
*/ */
menuTitle : '=' menuTitle : '=',
/**
* Whether the menu should remain open while the user interacts
* with the contents of the menu. By default, the menu will close
* if the user clicks within the menu contents.
*
* @type Boolean
*/
interactive : '='
}, },
@@ -81,21 +90,19 @@ angular.module('navigation').directive('guacMenu', [function guacMenu() {
$scope.menuShown = !$scope.menuShown; $scope.menuShown = !$scope.menuShown;
}; };
// Close menu when use clicks anywhere else // Close menu when user clicks anywhere outside this specific menu
document.body.addEventListener('click', function clickOutsideMenu() { document.body.addEventListener('click', function clickOutsideMenu(e) {
$scope.$apply(function closeMenu() { $scope.$apply(function closeMenu() {
$scope.menuShown = false; if (e.target !== element && !element.contains(e.target))
$scope.menuShown = false;
}); });
}, false); }, false);
// Prevent click within menu from triggering the outside-menu handler // Prevent clicks within menu contents from toggling menu visibility
element.addEventListener('click', function clickInsideMenu(e) { // if the menu contents are intended to be interactive
e.stopPropagation();
}, false);
// Prevent click within menu contents from toggling menu visibility
contents.addEventListener('click', function clickInsideMenuContents(e) { contents.addEventListener('click', function clickInsideMenuContents(e) {
e.stopPropagation(); if ($scope.interactive)
e.stopPropagation();
}, false); }, false);
}] // end controller }] // end controller