Hi again guys, still not really figuring out how to do this.
I have followed Bamuu’s instructions (I hope) and my current updated code is seen below.
I’m absolutely no expert in Velo (or any code for that matter) so if you have any suggestion on how to make my repeater items lock in place and not be randomized away, I appreciate it if you could explain it to me like I’m a novice.
The problem is still that when I press the “lockButton”, the question isn’t locked. Looking the the console the “get” function seems to work, but I can’t see that the item is pushed to the lockedItems array. This might not be possible to see, I don’t know. But either way, the item still get’s randomized away at the next “generateButton” onClick event.
import wixData from 'wix-data';
let lockedItems = []; // Initialize an empty array to store locked items
//Populate the repeater
$w.onReady(async function () {
$w('#mainRepeater').onItemReady(($item, $itemData, index) => {
$item("#questionText").text = $itemData.title;
$item("#answerText").text = $itemData.answer;
$item("#spotifyLink").link = $itemData.songLink;
// Add a click event handler to the lock button
$item('#lockButton').onClick(async () => {
// Get the current item from the Questions collection
let item = await wixData.get("Questions", $itemData._id);
await wixData.update("Questions", item);
// Add the current item to the lockedItems array
lockedItems.push(item);
console.log(item)
});
});
const { items: Questions } = await wixData.query('Questions')
.limit(10)
.find()
$w('#mainRepeater').data = Questions
})
//Randomzie button onClick event
export async function generateButton_click(event) {
$w("#mainRepeater").onItemReady(($item, itemData, index) => {
$item("#questionText").text = itemData.title;
$item("#answerText").text = itemData.answer;
$item("#spotifyLink").link = itemData.songLink;
});
// Query the Questions collection to get all items
let results = await wixData.query("Questions").find();
let allItems = results.items;
// Use the array.filter method to remove the items in lockedItems from allItems
let availableItems = allItems.filter(item => !lockedItems.includes(item));
// Shuffle the available items
let shuffled = shuffleArray(availableItems);
// Set the data for the repeater to the first 10 items in the shuffled array
$w('#mainRepeater').data = shuffled.slice(0, 3);
}
function shuffleArray(array) {
for (let last = array.length - 1; last > 0; last--) {
const next = Math.floor(Math.random() * (last + 1));
[array[last], array[next]] = [array[next], array[last]];
}
return array;
}