MediaWiki:Gadget-wix-interactive.js: Difference between revisions
Content deleted Content added
No edit summary |
No edit summary |
||
Line 21:
'insurer-engines': initInsurerEngines,
'premium-matching': initPremiumMatching,
'reserve-sensitivity': initReserveSensitivity,
'ifrs-timeline': initIfrsTimeline
};
Line 1,109 ⟶ 1,110:
// Initial render
update();
}
/* ================================================================
IFRS TIMELINE
Interactive horizontal timeline of IFRS / insurance-accounting
milestones. Events are read from a data-wix-events JSON attribute.
Each event: { year, cat ("ifrs"|"ins"), title, body }
================================================================ */
function initIfrsTimeline( container ) {
/* ── Read events from data attribute ─────────────────────── */
var raw = wix.data( container, 'wix-events', '[]' );
var events;
try {
events = JSON.parse( raw );
} catch ( e ) {
return;
}
if ( !events.length ) {
return;
}
/* ── Colors (WIX tokens + category overrides) ────────────── */
var styles = getComputedStyle( container );
var colorIfrs = styles.getPropertyValue( '--wix-accent' ).trim() || '#1a5276';
var colorIns = styles.getPropertyValue( '--wix-wrong' ).trim() || '#922b21';
/* ── State ───────────────────────────────────────────────── */
var active = 0;
/* ── Build UI ────────────────────────────────────────────── */
wix.empty( container );
var wrapper = wix.el( 'div', { className: 'wix-eng-wrapper' } );
container.appendChild( wrapper );
// Timeline track
var line = wix.el( 'div', { className: 'wix-tl-line' } );
var dotsEl = wix.el( 'div', { className: 'wix-tl-dots' } );
var track = wix.el( 'div', { className: 'wix-tl-track' }, [ line, dotsEl ] );
wrapper.appendChild( track );
// Detail card
var cardTitle = wix.el( 'div', { className: 'wix-tl-card-title' } );
var cardBody = wix.el( 'div', { className: 'wix-tl-card-body' } );
var card = wix.el( 'div', { className: 'wix-tl-card' }, [ cardTitle, cardBody ] );
wrapper.appendChild( card );
// Legend
wrapper.appendChild( wix.el( 'div', { className: 'wix-tl-legend' }, [
wix.el( 'span', { className: 'wix-tl-legend-item' }, [
wix.el( 'span', { className: 'wix-tl-legend-dot wix-tl-legend-dot--ifrs' } ),
'IFRS programme'
] ),
wix.el( 'span', { className: 'wix-tl-legend-item' }, [
wix.el( 'span', { className: 'wix-tl-legend-dot wix-tl-legend-dot--ins' } ),
'Insurance-specific'
] )
] ) );
// Navigation buttons
var btnPrev = wix.el( 'button', { className: 'wix-btn wix-btn--outline', textContent: 'Previous' } );
var btnNext = wix.el( 'button', { className: 'wix-btn wix-btn--outline', textContent: 'Next' } );
wrapper.appendChild( wix.el( 'div', { className: 'wix-tl-nav' }, [ btnPrev, btnNext ] ) );
/* ── Render ──────────────────────────────────────────────── */
function render() {
wix.empty( dotsEl );
events.forEach( function ( ev, i ) {
var dot = wix.el( 'div', { className: 'wix-tl-dot' } );
var year = wix.el( 'span', { className: 'wix-tl-year', textContent: ev.year } );
var cls = 'wix-tl-dot-wrap';
if ( ev.cat === 'ins' ) {
cls += ' wix-tl-dot-wrap--ins';
}
if ( i === active ) {
cls += ' wix-tl-dot-wrap--active';
}
var wrap = wix.el( 'div', { className: cls }, [ dot, year ] );
wrap.setAttribute( 'data-idx', String( i ) );
dotsEl.appendChild( wrap );
} );
// Card content
var ev = events[ active ];
cardTitle.textContent = ev.title;
cardBody.textContent = ev.body;
// Card accent border color
card.style.borderLeftColor = ev.cat === 'ins' ? colorIns : colorIfrs;
// Button states
btnPrev.disabled = active === 0;
btnNext.disabled = active === events.length - 1;
}
/* ── Event Wiring ────────────────────────────────────────── */
wix.on( dotsEl, 'click', '.wix-tl-dot-wrap', function ( target ) {
var idx = parseInt( target.getAttribute( 'data-idx' ), 10 );
if ( !isNaN( idx ) ) {
active = idx;
render();
}
} );
btnPrev.addEventListener( 'click', function () {
if ( active > 0 ) {
active--;
render();
}
} );
btnNext.addEventListener( 'click', function () {
if ( active < events.length - 1 ) {
active++;
render();
}
} );
// Initial render
render();
}
| |||