need help with looping

Hey Guys, I am not a programer at all but i came across a code that helped me to create a slider.

that is the code

$w . onReady ( function () {
setTimeout ( loadSlider , 6000 )
});

function loadSlider ( ){

**if** ( $w ( "#dataset1" ). getCurrentItemIndex ()=== 5 ){ 
    $w ( "#dataset1" ). loadPage ( 1 )          
} **else** { 
    $w ( "#dataset1" ). nextPage () 
} 
setTimeout ( loadSlider , 6000 )  

}

everything is workin fine but when it comes to the last data form my dataset it’s brakes and stop.
how can i loop it?

I am confused by this code. The reason why it is not working though is because when you reach the end of the dataset there is no other items left to call nextPage on. You should be able to just chain the else in another if statement like so:

functionloadSlider(){
    if($w("#dataset1").getCurrentItemIndex()===5){
    $w("#dataset1").loadPage(1)
    }else{
        if($w("#dataset1").nextPage()) {
            $w("#dataset1").nextPage()
        }
    }
    setTimeout(loadSlider,6000)
}

I don’t think that this is necessarily the best solution but given the context this is the best I can think of.

I might be able to come up with a better solution with more information

Thank you - that was helpful

Hi there,

Can someone help with this code please, the code works fine as it is. I have 2 images in CMS gallery field and I have image element in the repeater which is populated by the first image from CMS gallery field.

I would like to change this code so the image element in the repeater is updated with the 2nd image form cms gallery field after 2 second and continously loops.

In this case my dataset = dataset 1
repeater = repeaterDesigns
CMS media gallery = mediagallery
image element in repeater = ThumbnailFromGallery

Thank you
Ravinder

$w(‘#dataset1’).onReady(() => {
//use the onItemready function for the repeater
$w(‘#repeaterDesigns’).onItemReady(($Item, ItemData) => {
//Get the media gallery field (an array of images)
const mediagallery = ItemData.mediagallery;

        //Check if the mediaGallery field is populated and is an array
        if (Array.isArray(mediagallery) && mediagallery.length > 0) {
            //Get the first image from the gallery
            const firstImage = mediagallery[0].src;
            //const next = mediagallery[1].src;

            $Item('#ThumbnailFromGallery').src = firstImage;

        } else {
            //Handle cases where the media gallery is empty or invalid
            console.warn('Media gallery is empty or not an array for item:', ItemData)
        }

    });
});

Hi, @ravinderjassar !!

For now, how about trying an implementation like this?
Since it was a simple change, I had AI help me out a bit. I think it should work. :innocent:

$w('#dataset1').onReady(() => {

  $w('#repeaterDesigns').onItemReady(($item, itemData) => {

    const mediaGallery = itemData.mediagallery;

    if (Array.isArray(mediaGallery) && mediaGallery.length > 0) {

      const imageElement = $item('#ThumbnailFromGallery');
      let currentIndex = 0;

      const loopImages = () => {
        imageElement.src = mediaGallery[currentIndex].src;
        currentIndex = (currentIndex + 1) % mediaGallery.length;
        setTimeout(loopImages, 2000);
      };

      loopImages();

    } else {
      console.warn('Media gallery is empty or not an array for item:', itemData);
    }

  });

});

1 Like

Thank you very much, that works perfectly. Exactly the way I needed it.

1 Like