Skip to content
Compare
Choose a tag to compare
@willybrauner willybrauner released this 09 May 12:05
· 23 commits to main since this release
3977ca6

Minor Changes

  • 288c914: Fix: seek multiple times on the same progress

    Goal is to test if the onUpdate callback is called when we seek to the same progress value multiple times in a row.

    Use case example :

    Practical example is when we have to playIn a wall and seek it without transition duration to a specific value when the browser is resized. This situation can now be resolve with this dummy code:

    const itp = new Interpol({
      immediateRender: true,
      paused: true,
      el: wall,
      props: {
        x: {
          from: () => -innerWidth * 0.9,
          to: 0,
          unit: "px",
        },
      },
    });
    
    let isVisible = false;
    button?.addEventListener("click", () => {
      isVisible = !isVisible;
      isVisible ? itp.play() : itp.reverse();
    });
    
    window.addEventListener("resize", () => {
      // the position depends on innerWidth, so we have to re computed this prop value
      itp.refreshComputedValues();
      // seek to progress `0`
      itp.seek(0);
      isVisible = false;
    });

    Enregistrement.de.l.ecran.2024-05-09.a.12.19.05.mov

    timeline refreshComputedValues

    Add refreshComputedValues() method on Timeline instance. It will refresh computed values of each adds.

    const tl = new Timeline();
    tl.refreshComputedValues();