If the GSAP timeline is not finished, when I load the next/previous post with Barba, it breaks. This is the problematic transition. Can anyone spot what's wrong here? Thank you
{
name:"next",
leave({ current, next, trigger }) {
return new Promise(resolve => {
const timeline = gsap.timeline({
onComplete() {
current.container.remove()
resolve()
}
})
const image = current.container.querySelectorAll(".photo")
timeline
.to(image, { opacity: 0 }, 0)
})
},
beforeEnter({ current, next, trigger }) {
return new Promise(resolve => {
const timeline = gsap.timeline({
onComplete() {
resolve()
}
})
const image = next.container.querySelector(".photo img")
timeline
.to(image, {opacity: 1}, 0)
})
},
enter({ current, next, trigger }) {
return new Promise(resolve => {
const timeline = gsap.timeline({
onComplete() {
resolve()
}
})
const charge = next.container.querySelector("#charge")
const years = next.container.querySelector(".years")
timeline
.set(charge, {opacity: 0, x: "-100%"})
.set(years, {scale: 0})
.to(charge, {opacity: 1, x: 0}, 0)
.to(years, {scale: 1}, 1)
})
}
}