External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-05-07 17:37:37 -02:30
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #566 from ansible/click-to-close

Browse Source 
Add close logic to clicking outside of the bounds of a lookup modal
This commit is contained in:
jlmitch5
2017-11-02 13:33:03 -04:00
committed by GitHub
parent 5e37d6ea7e 9518c38bb8
commit cb4a38d7a7
1 changed files with 29 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
awx/ui/client/src/shared/lookup/lookup-modal.directive.js
View File

@@ -19,15 +19,35 @@ export default ['templateUrl', function(templateUrl) {
element.find('.modal-body').append(clone); element.find('.modal-body').append(clone);
scope.init(); scope.init(element);
}); });
$('#form-modal').modal('show'); $('#form-modal').modal('show');
}, },
controller: ['$scope', '$state', function($scope, $state) { controller: ['$scope', '$state', 'EventService', function($scope, $state, eventService) {
let listeners, modal;
$scope.init = function() { function clickIsOutsideModal(e) {
const m = modal.getBoundingClientRect();
const cx = e.clientX;
const cy = e.clientY;
if (cx < m.left || cx > m.right || cy > m.bottom || cy < m.top) {
return true;
}
return false;
}
function clickToHide(event) {
if (clickIsOutsideModal(event)) {
$scope.cancelForm();
}
}
$scope.init = function(el) {
let list = $scope.list; let list = $scope.list;
[modal] = el.find('.modal-dialog');
if($state.params.selected) { if($state.params.selected) {
let selection = $scope[list.name].find(({id}) => id === parseInt($state.params.selected)); let selection = $scope[list.name].find(({id}) => id === parseInt($state.params.selected));
$scope.currentSelection = _.pick(selection, 'id', 'name'); $scope.currentSelection = _.pick(selection, 'id', 'name');
@@ -37,6 +57,10 @@ export default ['templateUrl', function(templateUrl) {
}); });
$scope.modalTitle = list.iterator.replace(/_/g, ' '); $scope.modalTitle = list.iterator.replace(/_/g, ' ');
listeners = eventService.addListeners([
[window, 'click', clickToHide]
]);
}; };
function selectRowIfPresent(){ function selectRowIfPresent(){
@@ -51,6 +75,7 @@ export default ['templateUrl', function(templateUrl) {
} }
$scope.saveForm = function() { $scope.saveForm = function() {
eventService.remove(listeners);
let list = $scope.list; let list = $scope.list;
if($scope.currentSelection.name !== null) { if($scope.currentSelection.name !== null) {
$scope.$parent[`${list.iterator}_name`] = $scope.currentSelection.name; $scope.$parent[`${list.iterator}_name`] = $scope.currentSelection.name;
@@ -60,6 +85,7 @@ export default ['templateUrl', function(templateUrl) {
}; };
$scope.cancelForm = function() { $scope.cancelForm = function() {
eventService.remove(listeners);
$state.go('^'); $state.go('^');
}; };