Feature Request: Pause between slide transitions

[jhull]

It would be great if we could easily adjust the delay time between each slide transition. I can adjust the speed, but when I slow it down to the speed I would like, the transitions are stacked on top of each other.

A simple :delay prop in milliseconds would probably do it.

[quinnlangille]

Hey @narrative1st, missed this issue notification! I'll flag this as a feature request, seems like it should be pretty simple :~)

[christopherkade]

I'd love to tackle this as my first issue!
Although can you please clarify if I understood the issue correctly?

After setting the speed to 5000ms I get the following result:

Where transitions are interrupted before they get to finish by any type of navigation on the carousel.

This delay feature would simply delay the execution of a transition by the value defined by the user?

[quinnlangille]

Hey @christopherkade, thanks so much for tackling this one! The way I initially understood the request was to have a full pause between transitions. But now that I've seen your example (which I really thank you for including!) I think I was mistaken.

Maybe @narrative1st would want to weigh in, but to me, this seems like we want to delay the next transition from starting to respect a really slow speed, rather than stacking events like was previously mentioned.

I'd consider the acceptance criteria for this feature to be exactly what you mentioned: This delay feature would simply delay the execution of a transition by the value defined by the user?

Otherwise, since this feature hasn't really been explored or added to the product roadmap - feel free to add any functionality you think is cool!

Let me know if you have any questions or want a hand with anything :~)

[christopherkade]

Would that feature truly be useful? Why would a user prefer to delay the next transition by Xms instead of delaying it until any previous animations are completely done?

Wouldn't a delay boolean prop doing the latter be of better use?

[quinnlangille]

Yeah I probably could have written that better - I'm suggesting we add a delay following all animations, i.e:

if user clicks on slide with delay set to 1000ms, animation begins but lasts 2000ms. The current functionality makes the delay useless, since it has already finished before the animation ends.

Ideally, we'd let the animation finish and then trigger the delay. Did you have something else in mind? Again, since it's not in the roadmap I'm pretty open to anything here. Since this area hasn't really been explored I feel like there is a ton we can do, so feel free to send your thoughts!

[jhull]

Thanks for looking into this. What I was looking for was to be able to set a length of time in-between each transition. I was looking for slower transitions from one group of slides to the next. With the current implementation, the slower speed looks great - but then it just starts the next animation with no ability to give the viewer time to see the new set of slides.

Let me know if this makes sense.

[normann]

OMG, finally find the feature is discussed here. Yes, I am using it to show a series of alert messages in a carousel way, the problem from my client's eyes is the message showing there and stay still between animation end and animation start is too short. This is not related to transit speed, it is a simple issue for how long that one slide could stay still, I've been playing and changing the speed prop value, but it doesn't solve my issue, cos the speed prop is not designed for that purpose.

[christopherkade]

Okay, this is more clear.

Here's an example scenario of my understanding:
The carousel is on autoplay mode with a speed of 1000ms and a delay of 1000ms. It would animate the transition in 1000ms then wait 1000ms and then start the next transition. This only makes sense in autoplay mode (let me know if I'm mistaking).

This makes much more sense, I'll look into how I could implement it, but if you have any recommendations as to how I should operate in order to deliver something clean and in line with the current code base, please let me know.

Thank you for your precisions !

[normann]

It will be really helpful if this feature could be added, since it is also referred from #265 , could one of the developers try to tackle it down? Otherwise, cos the default time that a set of slides viewable to the viewer is just too short and make the library less selected for Carousel/Slides feature.

[jorgeuos]

I think I solved it with:

<carousel
  :autoplay=true
  :autoplayTimeout=6000
>

At least it works for me.

[dave-carner]

The autoplayTimeout property @jorgeuos referenced worked for me too. Would be helpful to have this property documented.

[koresar]

@dave-carner it is documented. See https://ssense.github.io/vue-carousel/api/

However, the README in this project is quite misleading. You could help by supplying a PR which would remove the docs from the README and point to the website above.

[dave-carner]

@koresar Ah, my bad. I was looking at the props table on the REAMDE. Thanks for pointing the way!

[christopherkade]

Since the autoplayTimeout prop seems to work, would you like me to update the README in order to mention it?
It also seems like mulitple props are missing from this file, I could update it fully by adding every single prop mentioned here.