Allow to pass a boolean parameter (jump) to autoplay plugin

[th-km]

It'd be convenient to have the option in the autoplay plugin to do instant previous/next slide navigation. I had to roll my own solution for this on multiple occasions because I can't access embla.scrollNext() method and pass true as a parameter.

[davidjerleke]

Hi @th-km,

Thanks for the idea. I think your suggestion makes sense. Do you have any suggestion where it should go? For example, should it be an option or should it go into the play method?

Best,
David

[th-km]

Great question, I think it's more convenient to have it as an option versus doing embla.on('init') to access the play method.

Best,
Thomas

[davidjerleke]

Thanks for the response @th-km. Just to be clear: Adding an option for this is a one way ticket in the sense that you need to reInit and reset Embla if you want autoplay to start animating instead of jumping:

const options = { loop: true }
const embla = EmblaCarousel(emblaNode, options, Autoplay({ jump: true }))

// if you want autoplay to animate instead of jumping you have to do this:

embla.reInit(null, Autoplay({ jump: false }))

Adding it as a parameter to the autoplay.play(jump: boolean) doesn't require a reInit, but it does require you to wait for Embla to initialise:

embla.plugins().autoplay.play(true) // <-- jump (don't animate)

embla.plugins().autoplay.stop()

embla.plugins().autoplay.play(false) // <-- animate (don't jump)

A third alternative is to add both these features:

const embla = EmblaCarousel(emblaNode, options, Autoplay({ defaultJump: true, playOnInit: true })) // autoplay will jump when it starts here

embla.plugins().autoplay.stop()

embla.plugins().autoplay.play(false) // <-- override defaultJump and start animating

Let me know what you think.

PS. Which Embla package are you using?

Best,
David

[th-km]

Thanks for the clarification @davidjerleke. I think the third one is probably my favorite API.

Re: I'm using the React package, but I'm planning to use the new Svelte package soon ;)
Thank you for making this one so quickly!

[davidjerleke]

Thanks @th-km,

So just to confirm: You prefer the third one where you can pass a default jump parameter and override it with the autoplay plugin API?

I'm using the React package, but I'm planning to use the new Svelte package soon ;)

Cool! About the library wrappers including Svelte: You might find this upcoming feature interesting. Feel free to join the conversation and share your opinion if you want.

Best,
David

[davidjerleke]

Hi @th-km,
I just created an issue for this:

• Autoplay jump parameter #357

Thanks for the idea 👍. I've moved my comment to this thread instead. Would you mind trying to mark this response as answer instead (if possible)? Because this might help other devs looking to achieve this.

[th-km]

@davidjerleke That is correct, I think the third option with the default jump parameter is nicer, but I'm of course open to whatever makes more sense to you.

Re: About the library wrappers. I haven't run into any issues mentioned in the conversation, but it's great to have more options as always ;)

[davidjerleke]

Hi @th-km,
I just created an issue for this:

• Autoplay jump parameter #357

Thanks for the idea 👍.

[th-km]

Perfect, thanks @davidjerleke 👍

[davidjerleke]

@th-km please mark my response as the answer to this question if you think it solves your problem. Thanks in advance 🙂!

[th-km]

@davidjerleke It looks like I can't mark the comment as an answer because it's a threaded comment.