Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

this.oldElement doesn't have intermediate transition values #62

Open
samselikoff opened this issue Nov 7, 2018 · 0 comments
Open

this.oldElement doesn't have intermediate transition values #62

samselikoff opened this issue Nov 7, 2018 · 0 comments

Comments

@samselikoff
Copy link

Just curious if you've seen this before. I'm trying out this simple inline transition

this.transition(
  this.hasClass('hello-world'),
  this.use(function() {
    debugger;
    let duration = 5000;
    if (this.oldElement) {
      stop(this.oldElement);
      duration = timeSpent(this.oldElement, 'fade-in');
    }

    if (this.oldElement) {
      return animate(this.oldElement, { opacity: 0 }, { duration });
    } else {
      return animate(this.newElement, { opacity: 1 }, { duration }, 'fade-in');
    }
  })
)

with a simple toggle

{{#if showHello}}
  {{#liquid-wormhole class="hello-world"}}
    Hello, World!
  {{/liquid-wormhole}}
{{/if}}

The transition is being matched & run, but I'm noticing that if I click the button then click it again, there is a this.oldElement, but I don't get it with its transitioning values. In other words, if the opacity is at 0.33 when I click the button the second time, in normal Liquid Fire situations I would be able to see that (and thus smoothly transition from the intermediate state back to the initial state). But here I think something is being re-rendered, because this.oldElement doesn't have any of those intermediate values.

Any idea why, or is that re-rendering behavior an expected part of the implementation?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant