feat(sidenav): added onClose callback

Added onClose callback to handle close, backdrop click or escape key pressed

fixes #3179

Closes #5974

Author: EladBezalel

src/components/sidenav/sidenav.js

@@ -61,6 +61,11 @@ angular
  * // Sync check to whether given sidenav is locked open
  * // If this is true, the sidenav will be open regardless of close()
  * $mdSidenav(componentId).isLockedOpen();
+ * // On close callback to handle close, backdrop click or escape key pressed
+ * // Callback happens BEFORE the close action occurs.
+ * $mdSidenav(componentId).onClose(function () {
+ *   $log.debug('closing');
+ * });
  * </hljs>
  */
 function SidenavService($mdComponentRegistry, $mdUtil, $q, $log) {
@@ -103,6 +108,7 @@ function SidenavService($mdComponentRegistry, $mdUtil, $q, $log) {
         toggle       : rejectFn,
         open         : rejectFn,
         close        : rejectFn,
+        onClose      : angular.noop,
         then : function(callback) {
           return waitForInstance(handle)
             .then(callback || angular.noop);
@@ -422,6 +428,8 @@ function SidenavDirective($mdMedia, $mdUtil, $mdConstant, $mdTheming, $animate,
         return $q.when(true);
 
       } else {
+        if (scope.isOpen && sidenavCtrl.onCloseCb) sidenavCtrl.onCloseCb();
+
         return $q(function(resolve){
           // Toggle value to force an async `updateIsOpen()` to run
           scope.isOpen = isOpen;
@@ -485,6 +493,12 @@ function SidenavController($scope, $element, $attrs, $mdComponentRegistry, $q) {
   self.isOpen = function() { return !!$scope.isOpen; };
   self.isLockedOpen = function() { return !!$scope.isLockedOpen; };
 
+  // Synchronous setters
+  self.onClose = function (callback) {
+    self.onCloseCb = callback;
+    return self;
+  };
+
   // Async actions
   self.open   = function() { return self.$toggleOpen( true );  };
   self.close  = function() { return self.$toggleOpen( false ); };

src/components/sidenav/sidenav.spec.js

@@ -439,6 +439,63 @@ describe('mdSidenav', function() {
       expect(instance).toBeDefined();
       expect(instance.isOpen()).toBeFalsy();
     }));
+
+    describe('onClose', function () {
+      it('should call callback on escape', inject(function($mdSidenav, $rootScope, $material, $mdConstant, $timeout) {
+        var el = setup('md-component-id="left" md-is-open="show"');
+        var callback = jasmine.createSpy("callback spy");
+
+        $mdSidenav('left')
+          .onClose(callback);
+
+        $rootScope.$apply('show = true');
+
+        $material.flushOutstandingAnimations();
+        el.parent().triggerHandler({
+          type: 'keydown',
+          keyCode: $mdConstant.KEY_CODE.ESCAPE
+        });
+        $timeout.flush();
+        expect($rootScope.show).toBe(false);
+        expect(callback).toHaveBeenCalled();
+      }));
+
+      it('should call callback on backdrop click', inject(function($mdSidenav, $rootScope, $material, $timeout) {
+        var el = setup('md-component-id="left" md-is-open="show"');
+        var callback = jasmine.createSpy("callback spy");
+
+        $mdSidenav('left')
+          .onClose(callback);
+
+        $rootScope.$apply('show = true');
+
+        $material.flushOutstandingAnimations();
+        el.parent().find('md-backdrop').triggerHandler('click');
+        $timeout.flush();
+        expect($rootScope.show).toBe(false);
+        expect(callback).toHaveBeenCalled();
+      }));
+
+      it('should call callback on close', inject(function($mdSidenav, $rootScope, $material, $timeout) {
+        var el = setup('md-component-id="left"');
+        var callback = jasmine.createSpy("callback spy");
+
+        $mdSidenav('left')
+          .onClose(callback)
+          .open();
+
+        $timeout.flush();
+
+        expect(el.hasClass('md-closed')).toBe(false);
+
+        $mdSidenav('left')
+          .close();
+
+        $timeout.flush();
+
+        expect(callback).toHaveBeenCalled();
+      }));
+    });
   });