From f4d2b33d8c071080e33d83f2f7f408d10158685a Mon Sep 17 00:00:00 2001 From: Paul Gschwendtner Date: Fri, 6 Nov 2015 00:22:33 +0100 Subject: [PATCH 1/3] fix(sidenav): Only restore focus if user interaction was keyboard Normally the Sidenav restores every time the last active element, so the focus won't disappear from the triggered button after closing the sidenav Fixes #5563 --- src/components/sidenav/sidenav.js | 39 ++++++++++++++++++++++++++++--- 1 file changed, 36 insertions(+), 3 deletions(-) diff --git a/src/components/sidenav/sidenav.js b/src/components/sidenav/sidenav.js index 02d5300fc3..c2dc06079f 100644 --- a/src/components/sidenav/sidenav.js +++ b/src/components/sidenav/sidenav.js @@ -225,9 +225,10 @@ function SidenavDirective($mdMedia, $mdUtil, $mdConstant, $mdTheming, $animate, /** * Directive Post Link function... */ - function postLink(scope, element, attr, sidenavCtrl) { + function postLink(scope, element, attr, sidenavCtrl, $timeout) { var lastParentOverFlow; var triggeringElement = null; + var isKeyboardInteraction; var promise = $q.when(true); var isLockedOpenParsed = $parse(attr.mdIsLockedOpen); @@ -244,9 +245,41 @@ function SidenavDirective($mdMedia, $mdUtil, $mdConstant, $mdTheming, $animate, $mdTheming.inherit(backdrop, element); + // KEY CHECK + var body = angular.element(document.body); + var _mouseEvent = window.MSPointerEvent ? 'MSPointerEvent' : window.PointerEvent ? 'pointerdown' : 'mousedown'; + + body.on('keydown', onInput); + body.on(_mouseEvent, onInput); + body.on('mouseenter', onInput); + if ('ontouchstart' in document.documentElement) body.on('touchstart', onBufferInput); + + var buffer = false, timer; + + function onInput(event) { + if (buffer) return; + isKeyboardInteraction = event.type === 'keydown'; + } + + function onBufferInput(event) { + $timeout.cancel(timer); + onInput(event); + buffer = true; + timer = $timeout(function() { + buffer = false; + }, 1000); + } + // END INTERACTION CHECK + element.on('$destroy', function() { backdrop.remove(); sidenavCtrl.destroy(); + + // UNREGISTER INTERACTION EVENTS + body.off('keydown', onInput); + body.off(_eventType, onInput); + body.off('mouseenter', onInput); + if ('ontouchstart' in document.documentElement) body.off('touchstart', onBufferInput); }); scope.$on('$destroy', function(){ @@ -344,9 +377,9 @@ function SidenavDirective($mdMedia, $mdUtil, $mdConstant, $mdTheming, $animate, // When the current `updateIsOpen()` animation finishes promise.then(function(result) { - if ( !scope.isOpen ) { + if ( !scope.isOpen && triggeringElement && isKeyboardInteraction) { // reset focus to originating element (if available) upon close - triggeringElement && triggeringElement.focus(); + triggeringElement.focus(); triggeringElement = null; } From 6dcd67592905808e8542737a4d3ba07f538b04d6 Mon Sep 17 00:00:00 2001 From: Paul Gschwendtner Date: Fri, 6 Nov 2015 00:31:22 +0100 Subject: [PATCH 2/3] fix(sidenav): changed wrong named variable --- src/components/sidenav/sidenav.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/sidenav/sidenav.js b/src/components/sidenav/sidenav.js index c2dc06079f..a0820089a7 100644 --- a/src/components/sidenav/sidenav.js +++ b/src/components/sidenav/sidenav.js @@ -277,7 +277,7 @@ function SidenavDirective($mdMedia, $mdUtil, $mdConstant, $mdTheming, $animate, // UNREGISTER INTERACTION EVENTS body.off('keydown', onInput); - body.off(_eventType, onInput); + body.off(_mouseEvent, onInput); body.off('mouseenter', onInput); if ('ontouchstart' in document.documentElement) body.off('touchstart', onBufferInput); }); From dec7c7aebc3b397091c8f0e48d56ce9619c93031 Mon Sep 17 00:00:00 2001 From: Paul Gschwendtner Date: Fri, 6 Nov 2015 10:49:42 +0100 Subject: [PATCH 3/3] fix(sidenav): rename incorrect event name of MSPointerEvent to the right. --- src/components/sidenav/sidenav.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/src/components/sidenav/sidenav.js b/src/components/sidenav/sidenav.js index a0820089a7..283272e8ab 100644 --- a/src/components/sidenav/sidenav.js +++ b/src/components/sidenav/sidenav.js @@ -245,9 +245,8 @@ function SidenavDirective($mdMedia, $mdUtil, $mdConstant, $mdTheming, $animate, $mdTheming.inherit(backdrop, element); - // KEY CHECK var body = angular.element(document.body); - var _mouseEvent = window.MSPointerEvent ? 'MSPointerEvent' : window.PointerEvent ? 'pointerdown' : 'mousedown'; + var _mouseEvent = window.MSPointerEvent ? 'MSPointerDown' : window.PointerEvent ? 'pointerdown' : 'mousedown'; body.on('keydown', onInput); body.on(_mouseEvent, onInput); @@ -269,13 +268,11 @@ function SidenavDirective($mdMedia, $mdUtil, $mdConstant, $mdTheming, $animate, buffer = false; }, 1000); } - // END INTERACTION CHECK element.on('$destroy', function() { backdrop.remove(); sidenavCtrl.destroy(); - // UNREGISTER INTERACTION EVENTS body.off('keydown', onInput); body.off(_mouseEvent, onInput); body.off('mouseenter', onInput);