Make sure this page JS code is connected to the page where this element is displayed:
 

import wixData from 'wix-data';

 

$w.onReady(async function () {

// 1. Initial attempt to load data

sendDataToWidget();

 

// 2. Listen for the iframe telling us it's ready

$w("#timeline").onMessage((event) => {

if (event.data === "widgetReady") {

sendDataToWidget();

}

});

});

 

async function sendDataToWidget() {

try {

// Query CMS and sort ascending by 'year' (e.g., 2005, 2012, 2013, 2018, 2023, 2026)

// Note: Change "year" to "order" below if you want custom non-year ordering

const results = await wixData.query("StadiumTimeline")

.ascending("year")

.find();

 

if (results.items.length > 0) {

// Guarantee chronological sorting in JS array as a failsafe

const sortedItems = results.items.sort((a, b) => Number(a.year) - Number(b.year));

 

const slides = sortedItems.map(item => ({

year: String(item.year || ''),

heading: String(item.heading || item.year || ''),

text: String(item.text || ''),

image: item.image ? getWixImageUrl(item.image) : ''

}));

 

$w("#timeline").postMessage(slides);

}

} catch (err) {

console.error("Timeline Query Error:", err);

}

}

 

function getWixImageUrl(wixMediaUrl) {

if (!wixMediaUrl) return '';

if (wixMediaUrl.startsWith('http')) return wixMediaUrl;

const match = wixMediaUrl.match(/wix:image:\/\/v1\/([^\/]+)\//);

return match && match[1] ? `https://static.wixstatic.com/media/${match[1]}` : wixMediaUrl;

}

Contact Blue Dot Creative for help with this element.