Carousel Gallery Autoplay issue

[Carlos Alvarado]

Hello, when using the new carousel autoplay feature it doesn't work as expected. It starts playing at the same moment the page is loaded and only does one rotation.

So for example, I have 3 image rotation, it starts on asset #2, but once the page is loaded it jumps immediately to asset #3, not giving any "natural" time to see asset #2. Is there a workaround for this?

 In the old GWD I used to add something like the following code...

  var index = 2; // Gallery starts at index 1
  var count = 0;
  var limit = 3; // number of times gallery must scroll without user interaction
  var intervalId = setInterval(function() {
    if (index > 4) {
      // scroll back to the first image
      index = 0;
      count++;
    }
    gallery3d_2.goToFrame(index++, true);
    if (count > limit-1) {
      // The gallery has already scrolled 2 times (limit) without user interaction.
      window.clearInterval(intervalId);
    }
  }, 1100);
  // Clear the timer if the user interacts with the gallery.
  gallery3d_2.getElement().addEventListener('touchstart', function() {
    window.clearInterval(intervalId);
  });
  gallery3d_2.getElement().addEventListener('click', function() {
    window.clearInterval(intervalId);
  });

Thanks!

[Jaz]

Hi Carlos,

I've assigned a QA to this post, but I also wanted to give you the link to a new video tutorial we've created to explain the functionality and options of the components (and the Carousel Gallery is used in the video): Components Overview

The Help Center article on Carousel is also helpful, as it highlights adding an event to the gallery to trigger other actions.

thx!
jaz

Jasmine Rogers
Program Manager, GWD

[Sukhbir Kaur]

Hi Carlos ,

 You can use a timeline event to create the delay animation   so that it does not jump to frame 3 right away, then  Add an event   rotateOnce to start rotation

Note : If you need to rotate the gallery 3 times then add 3 events  with RotateOnce as below (event-1… event-3)

1. Page1>event-1>RotateOnce>gwd-carouselGallery_1
   
2. Set Rotation time and Direction 
   
3. Save
   

See an attached sample file for reference .

I hope this helps !

Thanks

Sukhbir

(GWD Team)

[Carlos Alvarado]

Thank you guys!