Slice() to set maximum number of images in repeater (using "randomising" code)

Ask the community
,
1

I was having issues with the max number of items in a repeater when using “randomising” code. The code works fine, but the max number in the dataset settings seems to be bypassed by the code. I have a client that manages 70 clients and I only want to see 16 on the home page.

I was told to use a slice() method on the returned array to set the maximum, but I don’t know where to include the SLICE() method in my code.

Can someone help me out please ? Thanks !

Here is my code (clearly I can’t add a code snippet, sorry)
import wixData from ‘wix-data’ ;

$w . onReady ( function () {
$w ( “#dataset1” ). onReady (() => {
wixData . query ( “Team” )
. find ()
. then (( result ) => {
const shuffledArray = shuffleArray ( result . items );
$w ( ‘#repeater1’ ). data = shuffledArray ;
})
. catch (( err ) => {
let errorMsg = err ;
});
});
});

function getRandomIndex ( min , max ) {
return Math . round ( Math . random () * ( max - min ) + min );
}

function shuffleArray ( dataArray ) {

**for**  ( **let**  i  =  dataArray . length  -  1 ;  i  >  0 ;  i --) { 
    **let**  index  =  getRandomIndex ( 0 ,  i ); 
    **const**  temp  =  dataArray [ i ]; 
    dataArray [ i ] =  dataArray [ index ]; 
    dataArray [ index ] =  temp ; 
} 

**return**  dataArray ;

}

2

First of all, if you wish to retrieve the 70 clients, you have to add limit to the query (otherwise it’’ only bring the first 50).

wixData.query("Team")
.limit(70)
 .find()

Second, it’s not clear why you run a direct query if you have all the clients in dataset1 ?(which I guess represent the Team collection). It’ll affect the performance.
If I’m right, set dataset1 to have at least 70 items (via the UI editor), get rid of the direct query and instead do:

$w.onReady(function () {
    $w("#dataset1").onReady(() => {
	$w("#dataset1").getItems(0,100)//or 70 whatever
	.then(result => {
		let shuffledItems = shuffleArray(result.items);
		shuffledItems.length = 16;
		$w('#repeater1').data = shuffledItems;
		})
	})
})
//and continue

(in red it the way to cut the array to the first 16 items.

3

Thanks for the reply J.D.

The initial code was taken from another post that just wanted to shuffle the images. I am looking to shuffle images in a repeater, but only for 16 images at a time.

Your code seems simpler and limits the images at 16, but actually doesn’t shuffle the images. I only included your code and took out the previous one. Something I am doing wrong ?

4

In the last row of my code I wrote: ‘//continue’ which means continue with your original code (after the onReady closure).

5

@jonatandor35 OK, thank you. I know so very little about coding… Should I include exactly the previous code I had ?

6

@hurtubisecarl put this one after my code:

function shuffleArray(array) {
    for (let i = array.length - 1; i > 0; i--) {
        const j = Math.floor(Math.random() * (i + 1));
        [array[i], array[j]] = [array[j], array[i]];
    }
return array;
}

after my code, and that’s all (shorter code than your shuffling function).

7

@jonatandor35 THIS IS AWESOME !! And works perfectly. Thank you so much !!!