From ed64b5edff15e702493df21aa3230b81593e6133 Mon Sep 17 00:00:00 2001 From: Michael Lando Date: Fri, 9 Jun 2017 03:19:04 +0300 Subject: [SDC-29] catalog 1707 rebase commit. Change-Id: I43c3dc5cf44abf5da817649bc738938a3e8388c1 Signed-off-by: Michael Lando --- .../clicked-outside/clicked-outside-directive.ts | 110 +++++++++++++++++++++ 1 file changed, 110 insertions(+) create mode 100644 catalog-ui/src/app/directives/clicked-outside/clicked-outside-directive.ts (limited to 'catalog-ui/src/app/directives/clicked-outside/clicked-outside-directive.ts') diff --git a/catalog-ui/src/app/directives/clicked-outside/clicked-outside-directive.ts b/catalog-ui/src/app/directives/clicked-outside/clicked-outside-directive.ts new file mode 100644 index 0000000000..009e104740 --- /dev/null +++ b/catalog-ui/src/app/directives/clicked-outside/clicked-outside-directive.ts @@ -0,0 +1,110 @@ +class ClickedOutsideModel { + + private clickedOutsideContainerSelector:string; + private onClickedOutsideGetter:Function; + private clickedOutsideEnableGetter:Function; + + constructor(clickedOutsideData:any) { + this.clickedOutsideContainerSelector = clickedOutsideData.clickedOutsideContainerSelector; + this.onClickedOutsideGetter = clickedOutsideData.onClickedOutsideGetter; + this.clickedOutsideEnableGetter = clickedOutsideData.clickedOutsideEnableGetter; + } + + public getClickedOutsideContainerSelector = ():string => { + return this.clickedOutsideContainerSelector; + } + + public getOnClickedOutsideGetter = ():Function => { + return this.onClickedOutsideGetter; + } + + public getClickedOutsideEnableGetter = ():Function => { + return this.clickedOutsideEnableGetter; + } +} + +export interface IClickedOutsideDirectiveScope extends ng.IScope { +} + +export class ClickedOutsideDirective implements ng.IDirective { + + constructor(private $document:JQuery, private $parse:ng.IParseService) { + } + + restrict = 'A'; + + link = (scope:IClickedOutsideDirectiveScope, element:JQuery, attrs) => { + + let container:HTMLElement; + let attrsAfterEval = scope.$eval(attrs.clickedOutside); + attrsAfterEval.onClickedOutsideGetter = this.$parse(attrsAfterEval.onClickedOutside); + attrsAfterEval.clickedOutsideEnableGetter = this.$parse(attrsAfterEval.clickedOutsideEnable); + + let clickedOutsideModel:ClickedOutsideModel = new ClickedOutsideModel(attrsAfterEval); + + + let getContainer:Function = ():HTMLElement => { + if (!container) { + let clickedOutsideContainerSelector:string = clickedOutsideModel.getClickedOutsideContainerSelector(); + if (!angular.isUndefined(clickedOutsideContainerSelector) && clickedOutsideContainerSelector !== '') { + container = element.parents(clickedOutsideContainerSelector + ':first')[0]; + if (!container) { + container = element[0]; + } + } else { + container = element[0]; + } + } + return container; + }; + + + let onClickedOutside = (event:JQueryEventObject) => { + let containerDomElement:HTMLElement = getContainer(); + let targetDomElementJq:JQuery = angular.element(event.target); + if (targetDomElementJq.hasClass('tooltip') || targetDomElementJq.parents('.tooltip:first').length) { + return; + } + let targetDomElement:HTMLElement = targetDomElementJq[0]; + if (!containerDomElement.contains(targetDomElement)) { + scope.$apply(() => { + let onClickedOutsideGetter:Function = clickedOutsideModel.getOnClickedOutsideGetter(); + onClickedOutsideGetter(scope); + }); + } + }; + + let attachDomEvents:Function = () => { + this.$document.on('mousedown', onClickedOutside); + }; + + let detachDomEvents:Function = () => { + this.$document.off('mousedown', onClickedOutside); + }; + + // + scope.$on('$destroy', () => { + detachDomEvents(); + }); + + + scope.$watch(() => { + let clickedOutsideEnableGetter:Function = clickedOutsideModel.getClickedOutsideEnableGetter(); + return clickedOutsideEnableGetter(scope); + }, (newValue:boolean) => { + if (newValue) { + attachDomEvents(); + return; + } + detachDomEvents(); + }); + + + } + + public static factory = ($document:JQuery, $parse:ng.IParseService) => { + return new ClickedOutsideDirective($document, $parse); + } +} + +ClickedOutsideDirective.factory.$inject = ['$document', '$parse']; -- cgit 1.2.3-korg