const $ = id => document.getElementById(id); const escape = value => String(value ?? '').replace(/[&<>"']/g, c => ({'&':'&','<':'<','>':'>','"':'"',"'":'''}[c])); const fmt = (n, digits = 1) => Number.isFinite(n) ? n.toFixed(digits) : '—'; const selected = new Set(MODELS.filter(m => m.recommended).map(m => m.id)); const isDetailPage = document.body.dataset.page === 'model'; let activeId = isDetailPage ? new URLSearchParams(location.search).get('id') : null; const logo = org => !org.logo ? `` : ``; const external = (url, label) => `${label} ↗`; function render() { const models = MODELS.filter(m => selected.has(m.id)).sort((a,b) => (indexScore(b) ?? -1) - (indexScore(a) ?? -1)); $('selection-count').textContent = `${models.length} / ${MODELS.length}`; renderParameterChart(models); $('bars').innerHTML = models.length ? models.map(m => { const org = ORGS[m.org], score = indexScore(m), info = frontierInfo(m, MODELS); return ``; }).join('') : '
No models selected.
'; $('table-view').innerHTML = models.length ? `${BENCHMARKS.map(b => ``).join('')}${models.map(m => `${BENCHMARKS.map(b => ``).join('')}`).join('')}
ModelParametersIndex${escape(b.name)}
${escape(m.paramsDisplay)}${fmt(indexScore(m))}${b.key === 'base' ? `${m.base.overall} Elo` : `${fmt(benchmarkValue(m,b.key),2)}%`}
` : '

No models selected. Use Models to choose a comparison.

'; $('empty-select')?.addEventListener('click', openPicker); document.querySelectorAll('[data-model]').forEach(button => button.addEventListener('click', () => { location.href = `model.html?id=${encodeURIComponent(button.dataset.model)}`; })); } function renderDetail() { const model = MODELS.find(m => m.id === activeId); $('model-detail').hidden = !model; if (!model) { $('model-detail').hidden = false; $('model-detail').innerHTML = '

Model not found

← Back to comparison

'; return; } document.title = `${model.name} · BananaMind Benchmarks`; const org = ORGS[model.org], score = indexScore(model), info = frontierInfo(model,MODELS); const peerCount = Math.max(0,info.peers.length-1); $('model-detail').innerHTML = `
← Back to comparison${external(model.links.card,'Hugging Face model card')}
${logo(org)}

${escape(model.name)}

${escape(org.name)} · ${escape(model.paramsDisplay)}

OVERALL${fmt(score)}/100
BENCHMARK PROFILESCORE /100
${profile(model).map(([name,value,source]) => `
${name}
${fmt(value)}
`).join('')}
${info.frontier ? ' Size-class frontier' : 'Benchmark profile'}Elo + benchmark scores
Exact benchmark results Raw measurements & index contribution
${BENCHMARKS.map(b => { const value = benchmarkValue(model,b.key); return ``; }).join('')}
BenchmarkRaw resultIndex weightContributionSource
${escape(b.name)}${escape(b.metric)}${b.key === 'base' ? `${model.base.overall} Elo${fmt(value,2)} normalized /100` : `${fmt(value,2)}%`}${fmt(b.weight*100,2)}%${fmt(Number.isFinite(value) ? value*b.weight : null,2)}${external(b.url,'Dataset')}
Overall index100%${fmt(score,2)}1–100

BananaMind Base Bench 1.1

Official overall Elo ${model.base?.overall ?? '—'} · ${escape(model.base?.provenance || 'Run metadata not provided.')}

${Object.entries({language:'Language',commonsense:'Commonsense',knowledge:'World knowledge',context:'Context tracking',quantitative:'Quantitative',logic:'Logic',code:'Code'}).map(([key,label]) => ``).join('')}
CategoryNormalized /100Category Elo
${label}${fmt(eloToScore(model.base?.elo?.[key]),2)}${model.base?.elo?.[key] ?? '—'}

Base Bench overall and category Elo use 100 / (1 + 10^((1000 − Elo) / 400)). These normalized ratings are not accuracy percentages. Commonsense = 50% normalized category Elo + 50% HellaSwag; quantitative = 90% normalized category Elo + 10% Arithmark 3.

`; } function renderPicker() { const query = $('model-search').value.toLowerCase(); const matches = MODELS.filter(m => `${m.name} ${ORGS[m.org].name}`.toLowerCase().includes(query)); $('model-options').innerHTML = matches.length ? matches.map(m => ``).join('') : '

No matching models.

'; $('model-options').querySelectorAll('input').forEach(input => input.addEventListener('change', () => { input.checked ? selected.add(input.value) : selected.delete(input.value); render(); })); } function positionPicker() { const anchor = $('select-models').getBoundingClientRect(); const picker = $('model-picker'); const width = Math.min(290, window.innerWidth - 16); picker.style.width = `${width}px`; picker.style.left = `${Math.max(8, Math.min(anchor.right - width, window.innerWidth - width - 8))}px`; const below = window.innerHeight - anchor.bottom - 16; const above = anchor.top - 16; const useBelow = below >= 320 || below >= above; const available = Math.max(140, useBelow ? below : above); picker.style.maxHeight = `${available}px`; picker.style.top = useBelow ? `${anchor.bottom + 6}px` : 'auto'; picker.style.bottom = useBelow ? 'auto' : `${window.innerHeight - anchor.top + 6}px`; } function openPicker() { renderPicker(); $('selection-status').hidden = true; positionPicker(); $('model-picker').showPopover(); $('model-search').focus(); } if (!isDetailPage) { $('parameter-select').addEventListener('click', () => { $('select-models').scrollIntoView({block:'center'}); openPicker(); }); $('select-models').setAttribute('aria-expanded','false'); $('select-models').setAttribute('aria-controls','model-picker'); $('select-models').addEventListener('click', () => { if ($('model-picker').matches(':popover-open')) $('model-picker').hidePopover(); else openPicker(); }); $('model-picker').addEventListener('toggle', event => $('select-models').setAttribute('aria-expanded',String(event.newState === 'open'))); window.addEventListener('resize',positionPicker); window.addEventListener('scroll',() => { if ($('model-picker').matches(':popover-open')) positionPicker(); },true); function selectionStatus(message) { $('selection-status').textContent = message; $('selection-status').hidden = false; } $('save-selection').addEventListener('click',() => { try { localStorage.setItem('bananamind-saved-selection',JSON.stringify([...selected])); selectionStatus('Selection saved in this browser.'); } catch { selectionStatus('This browser could not save the selection.'); } }); $('load-selection').addEventListener('click',() => { try { const raw = localStorage.getItem('bananamind-saved-selection'); if (raw === null) { selectionStatus('No saved selection yet.'); return; } const ids = JSON.parse(raw); if (!Array.isArray(ids) || !ids.every(id => typeof id === 'string')) throw new Error('Invalid selection'); selected.clear(); ids.filter(id => MODELS.some(m=>m.id===id)).forEach(id=>selected.add(id)); renderPicker(); render(); selectionStatus('Saved selection loaded.'); } catch { selectionStatus('The saved selection could not be loaded.'); } }); $('model-search').addEventListener('input',renderPicker); for (const [id,predicate] of [['recommended',m=>m.recommended],['all-models',()=>true],['clear-models',()=>false]]) { $(id).addEventListener('click',() => { selected.clear(); MODELS.filter(predicate).forEach(m=>selected.add(m.id)); renderPicker(); render(); }); } for (const mode of ['chart','table']) $(mode+'-toggle').addEventListener('click', () => { $('chart-view').hidden = mode !== 'chart'; $('table-view').hidden = mode !== 'table'; $('chart-toggle').setAttribute('aria-pressed',String(mode === 'chart')); $('table-toggle').setAttribute('aria-pressed',String(mode === 'table')); }); } function setTheme(theme) { document.documentElement.dataset.theme = theme; $('theme').innerHTML = theme === 'dark' ? '☼ Light mode' : '◐ Dark mode'; $('theme').setAttribute('aria-label', `Switch to ${theme === 'dark' ? 'light' : 'dark'} mode`); try { localStorage.setItem('bananamind-theme',theme); } catch {} } let savedTheme; try { savedTheme = localStorage.getItem('bananamind-theme'); } catch {} setTheme(savedTheme === 'light' ? 'light' : 'dark'); $('theme').addEventListener('click', () => setTheme(document.documentElement.dataset.theme === 'dark' ? 'light' : 'dark')); if (isDetailPage) renderDetail(); else { render(); renderPicker(); }