External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-03-04 10:11:05 -03:30
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #2653 from jlmitch5/clickToCloseSearch

Browse Source 
get click to close working for search bars
This commit is contained in:
jlmitch5
2016-06-27 11:44:07 -04:00
committed by GitHub
parent 78e10241da 2229d60c4e
commit 51a798d47d
3 changed files with 32 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
awx/ui/client/src/search/tagSearch.block.less
View File

@@ -5,6 +5,15 @@
min-height: 45px; min-height: 45px;
} }
.TagSearch-clickToClose {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1040;
}
.TagSearch-bar { .TagSearch-bar {
display: flex; display: flex;
padding: 0; padding: 0;

22
awx/ui/client/src/search/tagSearch.controller.js
View File

@@ -17,6 +17,15 @@ export default ['$scope', 'Refresh', 'tagSearchService',
$scope.toggleTypeDropdown = function() { $scope.toggleTypeDropdown = function() {
if ($scope.searchTypes.length > 1) { if ($scope.searchTypes.length > 1) {
$scope.showTypeDropdown = !$scope.showTypeDropdown; $scope.showTypeDropdown = !$scope.showTypeDropdown;
if ($scope.showTypeDropdown) {
$("body").append("<div class='TagSearch-clickToClose'></div>");
$(".TagSearch-clickToClose").on("click", function() {
$scope.$apply(function() {
$scope.showTypeDropdown = false;
});
$(".TagSearch-clickToClose").remove();
});
}
} }
}; };
@@ -24,6 +33,7 @@ export default ['$scope', 'Refresh', 'tagSearchService',
$scope.setSearchType = function($event, type) { $scope.setSearchType = function($event, type) {
$scope.currentSearchType = type; $scope.currentSearchType = type;
$scope.showTypeDropdown = false; $scope.showTypeDropdown = false;
$(".TagSearch-clickToClose").remove();
$event.stopPropagation(); $event.stopPropagation();
}; };
@@ -33,7 +43,16 @@ export default ['$scope', 'Refresh', 'tagSearchService',
$scope $scope
.showCurrentSearchDropdown = !$scope .showCurrentSearchDropdown = !$scope
.showCurrentSearchDropdown; .showCurrentSearchDropdown;
}; if ($scope.showCurrentSearchDropdown) {
$("body").append("<div class='TagSearch-clickToClose'></div>");
$(".TagSearch-clickToClose").on("click", function() {
$scope.$apply(function() {
$scope.showCurrentSearchDropdown = false;
});
$(".TagSearch-clickToClose").remove();
});
}
};
$scope.updateSearch = function(tags) { $scope.updateSearch = function(tags) {
var iterator = $scope.iterator; var iterator = $scope.iterator;
@@ -106,5 +125,6 @@ export default ['$scope', 'Refresh', 'tagSearchService',
$scope.newSearchTag = null; $scope.newSearchTag = null;
$scope.showTypeDropdown = false; $scope.showTypeDropdown = false;
$scope.showCurrentSearchDropdown = false; $scope.showCurrentSearchDropdown = false;
$(".TagSearch-clickToClose").remove();
}; };
}]; }];

5
awx/ui/client/src/search/tagSearch.partial.html
View File

@@ -10,7 +10,7 @@
</span> </span>
<i class="TagSearch-selectDownIcon fa fa-angle-down" <i class="TagSearch-selectDownIcon fa fa-angle-down"
ng-hide="searchTypes.length === 1"></i> ng-hide="searchTypes.length === 1"></i>
<div aw-click-off="showTypeDropdown" class="TagSearch-dropdownContainer <div class="TagSearch-dropdownContainer
TagSearch-dropdownContainer--searchTypes" TagSearch-dropdownContainer--searchTypes"
ng-show="showTypeDropdown"> ng-show="showTypeDropdown">
<div class="TagSearch-dropdownItem" <div class="TagSearch-dropdownItem"
@@ -43,8 +43,7 @@
<i class="TagSearch-selectDownIcon <i class="TagSearch-selectDownIcon
fa fa-angle-down"> fa fa-angle-down">
</i> </i>
<div aw-click-off="showCurrentSearchDropdown" <div class="TagSearch-dropdownContainer
class="TagSearch-dropdownContainer
TagSearch-dropdownContainer--typeOptions" TagSearch-dropdownContainer--typeOptions"
ng-show="showCurrentSearchDropdown && ng-show="showCurrentSearchDropdown &&
currentSearchType.type === 'select'"> currentSearchType.type === 'select'">