feat(toast): proper toast queing behavior

Calling a toast while another is showing will start animating out the
existing toast and show a new one as soon as its been removed

closes #1144

src/components/progressLinear/demoBasicUsage/index.html

@@ -7,6 +7,4 @@
 
   <md-progress-linear class="md-accent" md-mode="{{mode}}" value="{{determinateValue}}"></md-progress-linear>
 
-  <md-progress-linear md-theme="custom" md-mode="determinate" ng-value="determinateValue" ></md-progress-linear>
-
 </div>

src/components/toast/demoBasicUsage/index.html

@@ -26,7 +26,7 @@
       <md-button class="md-primary md-fab md-fab-bottom-right">
         FAB
       </md-button>
-      <md-button class="md-primary md-fab md-fab-top-right" md-theme="green">
+      <md-button class="md-accent md-fab md-fab-top-right">
         FAB
       </md-button>
     </div>

src/components/toast/demoBasicUsage/script.js

@@ -30,7 +30,7 @@ angular.module('toastDemo1', ['ngMaterial'])
       $mdToast.simple()
         .content('Simple Toast!')
         .position($scope.getToastPosition())
-        .hideDelay(0)
+        .hideDelay(3000)
     );
   };
 

src/components/toast/toast.js

@@ -146,6 +146,8 @@ function MdToastDirective() {
  *
  * @param {*=} response An argument for the resolved promise.
  *
+ * @returns {promise} a promise that is called when the existing element is removed from the DOM
+ *
  */
 
 /**
@@ -158,6 +160,8 @@ function MdToastDirective() {
  *
  * @param {*=} response An argument for the rejected promise.
  *
+ * @returns {promise} a promise that is called when the existing element is removed from the DOM
+ *
  */
 
 function MdToastProvider($$interimElementProvider) {

src/core/services/interimElement/interimElement.js

@@ -259,15 +259,16 @@ function InterimElementProvider() {
        */
       function show(options) {
         if (stack.length) {
-          service.cancel();
+          return service.cancel().then(function() {
+            return show(options);
+          });
+        } else {
+          var interimElement = new InterimElement(options);
+          stack.push(interimElement);
+          return interimElement.show().then(function() {
+            return interimElement.deferred.promise;
+          });
         }
-
-        var interimElement = new InterimElement(options);
-
-        stack.push(interimElement);
-        return interimElement.show().then(function() {
-          return interimElement.deferred.promise;
-        });
       }
 
       /*
@@ -284,11 +285,9 @@ function InterimElementProvider() {
        */
       function hide(response) {
         var interimElement = stack.shift();
-        interimElement && interimElement.remove().then(function() {
+        return interimElement && interimElement.remove().then(function() {
           interimElement.deferred.resolve(response);
         });
-
-        return interimElement ? interimElement.deferred.promise : $q.when(response);
       }
 
       /*
@@ -300,16 +299,14 @@ function InterimElementProvider() {
        * Removes the `$interimElement` from the DOM and rejects the promise returned from `show`
        *
        * @param {*} reason Data to reject the promise with
-       * @returns Promise that will be rejected after the element has been removed.
+       * @returns Promise that will be resolved after the element has been removed.
        *
        */
       function cancel(reason) {
         var interimElement = stack.shift();
-        interimElement && interimElement.remove().then(function() {
+        return interimElement && interimElement.remove().then(function() {
           interimElement.deferred.reject(reason);
         });
-
-        return interimElement ? interimElement.deferred.promise : $q.reject(reason);
       }
 
 

src/core/services/interimElement/interimElement.spec.js

@@ -19,7 +19,7 @@ describe('$$interimElement service', function() {
           link: el,
           locals: {}
         });
-        $rootScope.$apply();
+        !$rootScope.$$phase && $rootScope.$apply();
         return deferred.promise;
       });
     });
@@ -203,18 +203,20 @@ describe('$$interimElement service', function() {
           },
           methods: ['key2']
         });
-      inject(function(interimTest, $rootScope) {
+      inject(function(interimTest, $rootScope, $animate) {
         interimTest.show();
         expect($compilerSpy.mostRecentCall.args[0].key).toBe('defaultValue');
-
         $compilerSpy.reset();
+
         interimTest.show({
           key: 'newValue'
         });
+        $animate.triggerCallbacks();
         expect($compilerSpy.mostRecentCall.args[0].key).toBe('newValue');
-
         $compilerSpy.reset();
+
         interimTest.show(interimTest.preset());
+        $animate.triggerCallbacks();
         expect($compilerSpy.mostRecentCall.args[0].key).toBe('defaultValue');
         expect($compilerSpy.mostRecentCall.args[0].key2).toBe('defaultValue2');
 
@@ -225,15 +227,18 @@ describe('$$interimElement service', function() {
             key2: 'newValue2'
           })
         );
+        $animate.triggerCallbacks();
         expect($compilerSpy.mostRecentCall.args[0].key).toBe('newValue');
         expect($compilerSpy.mostRecentCall.args[0].key2).toBe('newValue2');
 
         $compilerSpy.reset();
+        $animate.triggerCallbacks();
         interimTest.show(
           interimTest.preset({
             key2: 'newValue2'
           }).key2('superNewValue2')
         );
+        $animate.triggerCallbacks();
         expect($compilerSpy.mostRecentCall.args[0].key).toBe('defaultValue');
         expect($compilerSpy.mostRecentCall.args[0].key2).toBe('superNewValue2');
       });