From 9664fe5bb19abf97c7e0c60b341fe7959c4098b8 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Thu, 25 Jul 2019 10:07:10 -0400 Subject: [PATCH] testing reverse --- core/src/utils/animation/animation.ts | 33 ++++++++++++++++++++------- core/src/utils/transition/index.ts | 13 +++++++---- 2 files changed, 34 insertions(+), 12 deletions(-) diff --git a/core/src/utils/animation/animation.ts b/core/src/utils/animation/animation.ts index ebd8e612e3..75ea97ed86 100644 --- a/core/src/utils/animation/animation.ts +++ b/core/src/utils/animation/animation.ts @@ -15,6 +15,7 @@ export interface Animation { afterStylesValue: { [property: string]: any }; animationFinish(): void; + tempReverse(): void; play(): Animation; playAsync(): Promise; @@ -670,11 +671,7 @@ export const createAnimation = (): Animation => { }; const progressStep = (step: number): Animation => { - if (step > 1) { - step = 0.99; - } else if (step < 0) { - step = 0; - } + step = Math.min(Math.max(step, 0), 1); childAnimations.forEach(animation => { animation.progressStep(step); @@ -700,6 +697,14 @@ export const createAnimation = (): Animation => { return generatePublicAPI(); }; + + const tempReverse = () => { + webAnimations.forEach(animation => { + animation.effect.updateTiming({ + direction: 'reverse' + }); + }); + } const progressStart = (forceLinearEasing = false): Animation => { childAnimations.forEach(animation => { @@ -714,12 +719,21 @@ export const createAnimation = (): Animation => { }; const progressEnd = (shouldComplete: boolean, step: number): Animation => { + console.log(shouldComplete, step); shouldForceLinearEasing = false; + + if (!shouldComplete) { + tempReverse(); + + childAnimations.forEach(animation => animation.tempReverse()); + + console.log(webAnimations) + } // temp - play(); + //play(); return generatePublicAPI(); }; @@ -767,8 +781,10 @@ export const createAnimation = (): Animation => { animation.play(); }); - initializeAnimation(); - + if (!initialized) { + initializeAnimation(); + } + if (supportsWebAnimations()) { webAnimations.forEach(animation => { animation.play(); @@ -857,6 +873,7 @@ export const createAnimation = (): Animation => { afterStylesValue, animationFinish, + tempReverse, from, to, diff --git a/core/src/utils/transition/index.ts b/core/src/utils/transition/index.ts index f4d35c875a..3189d61883 100644 --- a/core/src/utils/transition/index.ts +++ b/core/src/utils/transition/index.ts @@ -83,10 +83,11 @@ const animation = async (animationBuilder: AnimationBuilder, opts: TransitionOpt const anim = ((opts.mode === 'ios') ? (await iosTransitionAnimation()).newIosTransitionAnimation(opts.baseEl, opts) : (await mdTransitionAnimation()).newMdTransitionAnimation(opts) as any); + + trans; - console.log(trans, anim); - - await playTransition(anim, opts); + const result = await playTransition(anim, opts); + console.log('final',result); anim.hasCompleted = true; @@ -140,7 +141,11 @@ const notifyViewReady = async (viewIsReady: undefined | ((enteringEl: HTMLElemen const playTransition = async (trans: any, opts: TransitionOptions): Promise => { const progressCallback = opts.progressCallback; - const promise = new Promise(resolve => trans.onFinish(resolve)); + const promise = new Promise(resolve => { + trans.onFinish((animation: any) => { + resolve(animation); + }) + }); // cool, let's do this, start the transition if (progressCallback) {