From 2668ba09ea6e6856b7fc3f2b3cad97b9f2f13375 Mon Sep 17 00:00:00 2001 From: Thomas Burleson Date: Tue, 14 Jul 2015 12:05:36 -0500 Subject: [PATCH] update(toolbar, fabSpeedDial, toast): batching nextTick() instead of $timeout --- src/components/fabSpeedDial/fabSpeedDial.js | 6 ++-- src/components/toast/toast.js | 4 +-- src/components/toolbar/toolbar.js | 32 ++++++++++----------- 3 files changed, 20 insertions(+), 22 deletions(-) diff --git a/src/components/fabSpeedDial/fabSpeedDial.js b/src/components/fabSpeedDial/fabSpeedDial.js index 0f7f1b8305e..fb9d8769026 100644 --- a/src/components/fabSpeedDial/fabSpeedDial.js +++ b/src/components/fabSpeedDial/fabSpeedDial.js @@ -82,7 +82,7 @@ element.prepend('
'); } - function FabSpeedDialController($scope, $element, $animate, $timeout) { + function FabSpeedDialController($scope, $element, $animate, $mdUtil) { var vm = this; // Define our open/close functions @@ -113,9 +113,9 @@ setupWatchers(); // Fire the animations once in a separate digest loop to initialize them - $timeout(function() { + $mdUtil.nextTick(function() { $animate.addClass($element, 'md-noop'); - }, 0); + }); // Set our default variables function setupDefaults() { diff --git a/src/components/toast/toast.js b/src/components/toast/toast.js index ef1abad16b8..127eb70e253 100644 --- a/src/components/toast/toast.js +++ b/src/components/toast/toast.js @@ -209,7 +209,7 @@ function MdToastProvider($$interimElementProvider) { return $mdToast; /* @ngInject */ - function toastDefaultOptions($timeout, $animate, $mdToast, $mdUtil) { + function toastDefaultOptions($animate, $mdToast, $mdUtil) { return { onShow: onShow, onRemove: onRemove, @@ -231,7 +231,7 @@ function MdToastProvider($$interimElementProvider) { options.onSwipe = function(ev, gesture) { //Add swipeleft/swiperight class to element so it can animate correctly element.addClass('md-' + ev.type.replace('$md.','')); - $timeout($mdToast.cancel); + $mdUtil.nextTick($mdToast.cancel); }; element.on('$md.swipeleft $md.swiperight', options.onSwipe); return $animate.enter(element, options.parent); diff --git a/src/components/toolbar/toolbar.js b/src/components/toolbar/toolbar.js index c7edd3e08d1..b01acae126a 100644 --- a/src/components/toolbar/toolbar.js +++ b/src/components/toolbar/toolbar.js @@ -55,12 +55,15 @@ angular.module('material.components.toolbar', [ * shrinking by. For example, if 0.25 is given then the toolbar will shrink * at one fourth the rate at which the user scrolls down. Default 0.5. */ -function mdToolbarDirective($$rAF, $mdConstant, $mdUtil, $mdTheming, $animate, $timeout) { + +function mdToolbarDirective($$rAF, $mdConstant, $mdUtil, $mdTheming, $animate ) { + var translateY = angular.bind(null, $mdUtil.supplant, 'translate3d(0,{0}px,0)' ); return { restrict: 'E', controller: angular.noop, link: function(scope, element, attr) { + $mdTheming(element); if (angular.isDefined(attr.mdScrollShrink)) { @@ -127,26 +130,21 @@ function mdToolbarDirective($$rAF, $mdConstant, $mdUtil, $mdTheming, $animate, $ Math.max(0, y + scrollTop - prevScrollTop) ); - element.css( - $mdConstant.CSS.TRANSFORM, - 'translate3d(0,' + (-y * shrinkSpeedFactor) + 'px,0)' - ); - contentElement.css( - $mdConstant.CSS.TRANSFORM, - 'translate3d(0,' + ((toolbarHeight - y) * shrinkSpeedFactor) + 'px,0)' - ); + element.css( $mdConstant.CSS.TRANSFORM, translateY([-y * shrinkSpeedFactor]) ); + contentElement.css( $mdConstant.CSS.TRANSFORM, translateY([(toolbarHeight - y) * shrinkSpeedFactor]) ); prevScrollTop = scrollTop; - if (element.hasClass('md-whiteframe-z1')) { - if (!y) { - $timeout(function () { $animate.removeClass(element, 'md-whiteframe-z1'); }); - } - } else { - if (y) { - $timeout(function () { $animate.addClass(element, 'md-whiteframe-z1'); }); - } + $mdUtil.nextTick(function () { + var hasWhiteFrame = element.hasClass('md-whiteframe-z1'); + + if ( hasWhiteFrame && !y) { + $animate.removeClass(element, 'md-whiteframe-z1'); + } else if ( !hasWhiteFrame && y ) { + $animate.addClass(element, 'md-whiteframe-z1'); } + }); + } }