How to dynamically display different types of cards based on a pattern
Let's say you have an array of cards inside which you want add more items.
Example: [card, card, card, itemOne, card, card, itemTwo, ...]
For this we will create another empty array that we will work with:
let posts = [];
const itemsTemplate = [itemOne, itemTwo];
let items = [itemOne, itemTwo];
for (let i = 0; i < cards.length; i++) {
posts.push(cards[i]);
if (i !== 0) {
//next index is multiple of 3
if ((i + 1) % 5 === 3) {
if (items.length === 0) {
items = itemsTemplate;
}
posts.push(items.pop());
}
//next index is multiple of 5
if ((i + 1) % 5 === 0) {
if (items.length === 0) {
items = itemsTemplate;
}
posts.push(items.pop());
}
}
}