From 766027e5685f10c066df0dbcb2b427021d284f3e Mon Sep 17 00:00:00 2001 From: Paul Gschwendtner Date: Sun, 26 Feb 2017 23:13:18 +0100 Subject: [PATCH] Move fadeOutAll logic into renderer --- src/lib/core/ripple/ripple-renderer.ts | 22 ++++++++++++++++------ src/lib/core/ripple/ripple.ts | 7 +------ 2 files changed, 17 insertions(+), 12 deletions(-) diff --git a/src/lib/core/ripple/ripple-renderer.ts b/src/lib/core/ripple/ripple-renderer.ts index be2e8a46df18..e79d5b98690e 100644 --- a/src/lib/core/ripple/ripple-renderer.ts +++ b/src/lib/core/ripple/ripple-renderer.ts @@ -37,8 +37,8 @@ export class RippleRenderer { /** Events to be registered on the trigger element. */ private _triggerEvents = new Map(); - /** Currently active ripples. */ - activeRipples: RippleRef[] = []; + /** Currently active ripple references. */ + private _activeRipples: RippleRef[] = []; /** Ripple config for all ripples created by events. */ rippleConfig: RippleConfig = {}; @@ -105,7 +105,7 @@ export class RippleRenderer { // Once it's faded in, the ripple can be hidden immediately if the mouse is released. this.runTimeoutOutsideZone(() => { if (config.persistent || this._isMousedown) { - this.activeRipples.push(rippleRef); + this._activeRipples.push(rippleRef); } else { rippleRef.fadeOut(); } @@ -117,11 +117,11 @@ export class RippleRenderer { /** Fades out a ripple reference. */ fadeOutRipple(ripple: RippleRef) { let rippleEl = ripple.element; - let rippleIndex = this.activeRipples.indexOf(ripple); + let rippleIndex = this._activeRipples.indexOf(ripple); // Remove the ripple reference if added to the list of active ripples. if (rippleIndex !== -1) { - this.activeRipples.splice(rippleIndex, 1); + this._activeRipples.splice(rippleIndex, 1); } rippleEl.style.transitionDuration = `${RIPPLE_FADE_OUT_DURATION}ms`; @@ -133,6 +133,16 @@ export class RippleRenderer { }, RIPPLE_FADE_OUT_DURATION); } + /** Fades out all currently active ripples. */ + fadeOutAll() { + // Iterate in reverse, to avoid issues with the `fadeOut` method that will immediately remove + // items from the array. + let i = this._activeRipples.length; + while (i--) { + this._activeRipples[i].fadeOut(); + } + } + /** Sets the trigger element and registers the mouse events. */ setTriggerElement(element: HTMLElement) { // Remove all previously register event listeners from the trigger element. @@ -163,7 +173,7 @@ export class RippleRenderer { this._isMousedown = false; // On mouseup, fade-out all ripples that are active and not persistent. - this.activeRipples + this._activeRipples .filter(ripple => !ripple.config.persistent) .forEach(ripple => ripple.fadeOut()); } diff --git a/src/lib/core/ripple/ripple.ts b/src/lib/core/ripple/ripple.ts index 83f67ee34e7e..5218e7e75e94 100644 --- a/src/lib/core/ripple/ripple.ts +++ b/src/lib/core/ripple/ripple.ts @@ -90,12 +90,7 @@ export class MdRipple implements OnChanges, OnDestroy { /** Fades out all currently showing ripple elements. */ fadeOutAll() { - // Iterate in reverse, to avoid issues with the `fadeOut` method that will immediately remove - // items from the array. - let i = this._rippleRenderer.activeRipples.length; - while (i--) { - this._rippleRenderer.activeRipples[i].fadeOut(); - } + this._rippleRenderer.fadeOutAll(); } /** Ripple configuration from the directive's input values. */