{!embed && (
PREDICTION SCORECARD
{rec.title || rec.name || 'Untitled'}
{rec.isrc &&
{rec.isrc}}
{onClose &&
}
)}
{/* Hero score row */}
PROJECTED 90-DAY STREAMS
{fmt(card.sales.projected)}
0 ? '#0a8754' : '#a32a18' }}>
{fmtPct(card.sales.deltaPct, true)}
vs {fmt(card.sales.currentTotal)} current · conf {Math.round(card.sales.conf*100)}%
TOP RECOMMENDATION
{card.sales.recs[0]?.title}
{/* Tabs */}
{TABS.map(t => (
))}
{tab==='overview' && }
{tab==='sales' && }
{tab==='playlist' && }
{tab==='sync' && }
{tab==='comps' && }
EDITORIAL PLAYLIST LIKELIHOOD
{r.map((p, i) => (
{p.dsp}
{p.name}
0.55?'#0a8754':p.likelihood>0.32?'#d4881f':'var(--ink-3)' }}/>
{Math.round(p.likelihood*100)}%
0.55?'#0a8754':'var(--ink-3)'} style={{ textAlign:'right' }}>{p.verdict.toUpperCase()}
))}
);
}
function CardSync({ card }) {
const r = card.sync.ranked;
return (
SYNC PLACEMENT FIT
{r.map((a, i) => (
{a.tag}
Brand fit: {a.brands.slice(0,3).join(' · ')}
{fmtUsd(a.feeRange[0])}–{fmtUsd(a.feeRange[1])}
{Math.round(a.fit*100)}%
))}
);
}
function CardComps({ card }) {
return (
NEAREST-NEIGHBOR COMPS · BY AUDIO FEATURES
{card.comps.map((c, i) => (
#{i+1}
{c.rec.title || c.rec.name || c.rec.id}
sim {(c.sim*100).toFixed(0)}%
success {c.success}
{fmtK(c.feat.velocity.d30)} 30d
))}
);
}
// ─── MAIN PREDICTIONS SCREEN
function ScreenPredictions({ go, payload, embed }) {
const [tab, setTab] = _S(payload?.tab || 'success');
const [active, setActive] = _S(null);
const allRecs = (window.RECORDINGS || []).slice(0, 240);
const TABS = [
{ k:'success', l:'Song Success' },
{ k:'sales', l:'Sales Optimization' },
{ k:'playlist', l:'Playlist Placement' },
{ k:'mining', l:'Catalog Mining' },
{ k:'sync', l:'Sync Placement' },
{ k:'timing', l:'Release Timing' },
];
return (
{!embed && (
)}
{TABS.map(t => (
))}
{tab==='success' && setActive(r)} go={go}/>}
{tab==='sales' && setActive(r)}/>}
{tab==='playlist' && setActive(r)}/>}
{tab==='mining' && setActive(r)} go={go}/>}
{tab==='sync' && setActive(r)}/>}
{tab==='timing' && window.PredictTimingTab && setActive(r)}/>}
{active && (
{ if (e.target === e.currentTarget) setActive(null); }}>
)}
);
}
// ─── Tab: SUCCESS — ranked list of all recordings by predicted score
function TabSuccess({ allRecs, onPick }) {
const ranked = _M(() => allRecs.map(r => {
const f = E.getFeatures(r);
const s = E.songSuccess(f);
return { rec: r, feat: f, success: s };
}).sort((a,b)=>b.success.score - a.success.score), [allRecs.length]);
return (
TOP 50 BY HIT POTENTIAL · ENSEMBLE SCORE
RANK
TITLE
SCORE
30D
30D Δ
BUCKET
{ranked.slice(0, 50).map((row, i) => (
onPick(row.rec)} style={{ display:'grid', gridTemplateColumns:'40px 1fr 60px 90px 90px 80px', gap: 14, alignItems:'center', padding:'10px 0', borderBottom:'1px solid var(--rule-soft)', cursor:'pointer' }}>
{i+1}
{row.rec.title || row.rec.name || row.rec.id}
60?'#0a8754':'var(--ink)' }}>{row.success.score}
{fmtK(row.feat.velocity.d30)}
0?'#0a8754':'#a32a18' }}>{fmtPct(row.feat.velocity.growth30,true)}
{row.success.bucket.toUpperCase()}
))}
);
}
// ─── Tab: SALES — pick a track, see territory/DSP optimization
function TabSales({ allRecs, onPick }) {
const top = _M(() => allRecs.slice(0, 24).map(r => {
const f = E.getFeatures(r);
const s = E.salesProjection(f);
return { rec: r, feat: f, sales: s };
}).sort((a,b)=>b.sales.delta-a.sales.delta), [allRecs.length]);
return (
TOP TRACKS BY 90D PROJECTED LIFT
{top.map((row, i) => (
onPick(row.rec)} style={{ display:'grid', gridTemplateColumns:'1fr 100px 100px 80px 1.2fr', gap: 14, alignItems:'center', padding:'12px 0', borderBottom:'1px solid var(--rule-soft)', cursor:'pointer' }}>
{row.rec.title || row.rec.name || row.rec.id}
{fmtK(row.sales.currentTotal)} now
{fmtK(row.sales.projected)}
0?'#0a8754':'#a32a18' }}>{fmtPct(row.sales.deltaPct, true)}
{row.sales.recs[0]?.title || '—'}
))}
);
}
// ─── Tab: PLAYLIST — by playlist, show top candidate tracks
function TabPlaylist({ allRecs, onPick }) {
const [pl, setPl] = _S(E.PLAYLISTS[0].name);
const playlist = E.PLAYLISTS.find(p => p.name === pl);
const candidates = _M(() => allRecs.map(r => {
const f = E.getFeatures(r);
const m = E.playlistMatch(f, playlist);
return { rec: r, feat: f, match: m, lik: Math.max(0.02, Math.min(0.92, m * 0.78 + (f.catalog.writerScore - 0.4) * 0.18)) };
}).sort((a,b)=>b.lik-a.lik).slice(0,30), [pl, allRecs.length]);
return (
{E.PLAYLISTS.map(p => (
))}
TOP 30 CANDIDATES FOR {playlist.name.toUpperCase()} ({fmtK(playlist.followers)} FOLLOWERS)
{candidates.map((c, i) => (
onPick(c.rec)} style={{ display:'grid', gridTemplateColumns:'40px 1fr 100px 90px 80px', gap: 14, alignItems:'center', padding:'9px 0', borderBottom:'1px solid var(--rule-soft)', cursor:'pointer' }}>
{i+1}
{c.rec.title || c.rec.name || c.rec.id}
0.55?'#0a8754':c.lik>0.32?'#d4881f':'var(--ink-3)' }}/>
{Math.round(c.lik*100)}% lik
0.55?'#0a8754':'var(--ink-3)'} style={{ textAlign:'right' }}>{c.lik>0.55?'STRONG':c.lik>0.32?'PLAUSIBLE':'LONG-SHOT'}
))}
);
}
// ─── Tab: MINING — top upside catalog
function TabMining({ allRecs, onPick }) {
const ranked = _M(() => E.catalogMining(allRecs, { limit: 50 }), [allRecs.length]);
return (
TOP 50 UNDERPERFORMING WITH UPSIDE · HIGH SCORE × LOW RECENT VELOCITY
RANK
TITLE
UPSIDE
SCORE
30D
SUGGESTED ACTION
{ranked.map((row, i) => {
const action = row.feat.audio.bpm < 100 ? 'Lo-fi/study playlist push' :
row.feat.external.tiktok > 100_000 ? 'TikTok creator pack' :
row.feat.catalog.age >= 3 ? 'Anniversary repush' : 'Sync library submit';
return (
onPick(row.rec)} style={{ display:'grid', gridTemplateColumns:'40px 1fr 80px 90px 90px 1.2fr', gap: 14, alignItems:'center', padding:'10px 0', borderBottom:'1px solid var(--rule-soft)', cursor:'pointer' }}>
{i+1}
{row.rec.title || row.rec.name || row.rec.id}
60?'#0a8754':'var(--ink)' }}>{row.upside}
{row.success.score}
{fmtK(row.feat.velocity.d30)}
{action}
);
})}
);
}
// ─── Tab: SYNC — by archetype, show top fits
function TabSync({ allRecs, onPick }) {
const [tag, setTag] = _S(E.SYNC_ARCHETYPES[0].tag);
const arch = E.SYNC_ARCHETYPES.find(a => a.tag === tag);
const candidates = _M(() => allRecs.map(r => {
const f = E.getFeatures(r);
const fit = E.syncFit(f).ranked.find(a => a.tag === tag);
return { rec: r, feat: f, fit: fit?.fit || 0, fee: fit?.feeRange };
}).sort((a,b)=>b.fit-a.fit).slice(0,24), [tag, allRecs.length]);
return (
{E.SYNC_ARCHETYPES.map(a => (
))}
TOP FITS · {tag.toUpperCase()} · TARGET BRANDS: {arch.brands.slice(0,3).join(' · ')}
{candidates.map((c, i) => (
onPick(c.rec)} style={{ display:'grid', gridTemplateColumns:'40px 1fr 90px 130px 60px', gap: 14, alignItems:'center', padding:'9px 0', borderBottom:'1px solid var(--rule-soft)', cursor:'pointer' }}>
{i+1}
{c.rec.title || c.rec.name || c.rec.id}
{Math.round(c.fit*100)}% fit
{c.fee?fmtUsd(c.fee[0])+'–'+fmtUsd(c.fee[1]):'—'}
0.7?'#0a8754':c.fit>0.55?'#d4881f':'var(--ink-3)'} style={{ textAlign:'right' }}>{c.fit>0.7?'STRONG':c.fit>0.55?'VIABLE':'WEAK'}
))}
);
}
window.PredictScorecard = PredictScorecard;
window.ScreenPredictions = ScreenPredictions;
})();