Play timeline in reverse with delay. Seems impossible?

[heim_designs]

I have a code that plays existing timelines on button click. I reuse one of the timeline in different places on website. 
The problem is popupOpen timeline with reverse plays correctly first time. And second time it ignores delay 2 seconds and plays instantly.

I tried all possible methods to solve this - wrappet it in setTimeout, setInterval etc. And nothing helps. I just don't understand why. 
 

Array.from(awrdBtn).forEach(function (btn) {

btn.onclick = function () {

popupOpen.play();

awrds.play();

};

});

 

awrdBtnClose.onclick = function () {

awrds.timeScale(2).reverse();

popupOpen.reverse().delay(2);

};

[heim_designs]

Wow I just found the solution and it was so simple. I added .delay(0) tho the initial play. Somehow it solved the problem. Hope it will help someone who encountered with the same issue


 

Array.from(awrdBtn).forEach(function (btn) {

btn.onclick = function () {

popupOpen.play().delay(0);

awrds.timeScale(1).play();

};

});

 

awrdBtnClose.onclick = function () {

awrds.timeScale(2).reverse();

popupOpen.reverse().delay(2);

};

[Rodrigo]

Hi,

 

You can use a boolean in the restart method:

https://greensock.com/docs/v3/GSAP/Timeline/restart()

 

Something like this:

const tl = gsap.timeline({
  delay: 2,
});

// Somewhere else in your code
tl.restart(true); // <- Will honor the 2 second delay

Hopefully this helps.

Happy Tweening!