ycj-el commited on
Commit
14260de
·
verified ·
1 Parent(s): 459d20c

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +1 -1
index.html CHANGED
@@ -4,7 +4,7 @@
4
  :root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;color:#18243b;background:#f5f7fc}*{box-sizing:border-box}body{margin:0}.wrap{max-width:1120px;margin:0 auto;padding:46px 22px 72px}.eyebrow{font-size:12px;font-weight:750;letter-spacing:.13em;color:#5277b9;text-transform:uppercase}.hero h1{font-size:clamp(32px,4.8vw,54px);letter-spacing:-.045em;margin:12px 0}.hero p{font-size:16px;color:#66758f;line-height:1.65;max-width:720px}.links{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 30px}.links a{padding:10px 16px;border:1px solid #dce3f1;border-radius:11px;text-decoration:none;color:#244781;background:white;font-weight:650;font-size:13px}.panel{background:white;border-radius:18px;padding:24px;border:1px solid #e4e9f3;box-shadow:0 7px 24px rgba(40,60,100,.04)}.panel h2{margin:0;font-size:22px}.sub{color:#73819a;font-size:13px;margin:7px 0 20px}.controls{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:20px}input,select,button{border:1px solid #dce3f0;border-radius:10px;padding:11px 13px;background:white;color:#253656;font:inherit;font-size:13px}input{flex:1;min-width:200px}button{cursor:pointer;background:#255aa6;color:white;font-weight:700}.scroll{overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:690px}th{font-size:12px;text-align:left;color:#61718b;cursor:pointer;padding:15px 13px;background:#f6f8fd}td{padding:17px 13px;border-bottom:1px solid #ecf0f7;font-size:14px}td.num{text-align:right;font-variant-numeric:tabular-nums}th.num{text-align:right}tr:last-child td{border-bottom:0}td.model{font-weight:650}td.rank{font-weight:700;color:#5c6c84}tr:first-child td.rank{color:#b27818}.tag{display:inline-block;padding:4px 8px;background:#eef5ff;color:#3267ae;border-radius:6px;font-size:11px}.note{margin-top:18px;color:#66758f;font-size:12px;line-height:1.65}.foot{font-size:12px;color:#8490a4;margin-top:20px}.status{display:inline-block;font-size:12px;color:#596b86;margin-left:auto}.mini{font-size:12px;color:#6b7a92;margin-top:12px}@media(max-width:600px){.wrap{padding:24px 14px}.panel{padding:16px}.controls{gap:8px}}
5
  </style></head><body><main class="wrap"><header class="hero"><div class="eyebrow">AudioCC Lab · Text-to-Audio Evaluation</div><h1>PhyAudioBench <span style="color:#3473bd">Leaderboard</span></h1><p>Evaluating whether generated sounds are physically consistent—not just semantically plausible. Explore model performance across signal/semantic fidelity (L1), event structure (L2), and physical consistency (L3).</p><div class="links"><a href="https://github.com/AudioCC-Lab/PhyAudioBench" target="_blank" rel="noopener">↗ Code repository</a><a href="https://huggingface.co/datasets/AudioCC-Lab/PhyAudioBench" target="_blank" rel="noopener">↗ Dataset</a><a href="https://audiocc-lab.github.io/PhyAudioBench-project/" target="_blank" rel="noopener">↗ Project page</a></div></header><section class="panel"><h2>Model Rankings</h2><p class="sub">Higher is better · Click a column heading to change the ranking metric</p><div class="controls"><input id="search" placeholder="Search models…" aria-label="Search models"/><select id="metric" aria-label="Ranking metric"><option value="overall">Rank by Overall</option><option value="l1">Rank by L1</option><option value="l2">Rank by L2</option><option value="l3">Rank by L3</option></select><button id="refresh">Refresh results</button><span id="status" class="status" role="status">Loading…</span></div><div class="scroll"><table><thead><tr><th>Rank</th><th data-metric="model">Model</th><th class="num" data-metric="l1">L1 ↕</th><th class="num" data-metric="l2">L2 ↕</th><th class="num" data-metric="l3">L3 ↕</th><th class="num" data-metric="overall">Overall ↕</th></tr></thead><tbody id="rows"></tbody></table></div><div class="note">Example results from the existing PhyAudioBench evaluation. Scores are shown as proportions (0–1). Public submissions are not yet enabled; a separate evaluation runner is needed to compute and validate new entries.</div><div class="mini" id="count"></div></section><div class="foot">PhyAudioBench · AudioCC-Lab. To publish updated scores, maintain leaderboard.json in the public results Dataset.</div></main>
6
  <script>
7
- const sample=[{model:'TangoFlux',l1:.8878,l2:.7183,l3:.3361,overall:.6474},{model:'Tango2',l1:.9028,l2:.6178,l3:.2694,overall:.5966},{model:'Auffusion',l1:.8346,l2:.6474,l3:.2740,overall:.5853},{model:'Make-An-Audio 2',l1:.8836,l2:.5930,l3:.2636,overall:.5801}];
8
  const DATA_URL='https://huggingface.co/datasets/AudioCC-Lab/PhyAudioBench-results/resolve/main/leaderboard.json';let data=sample;const $=id=>document.getElementById(id);const val=x=>Number.isFinite(Number(x))?Number(x).toFixed(4):'—';
9
  function render(){let key=$('metric').value,q=$('search').value.trim().toLowerCase();let records=data.filter(x=>String(x.model).toLowerCase().includes(q)).sort((a,b)=>Number(b[key])-Number(a[key]));$('rows').replaceChildren();records.forEach((r,i)=>{let tr=document.createElement('tr');let vals=[String(i+1),r.model,val(r.l1),val(r.l2),val(r.l3),val(r.overall)];vals.forEach((v,j)=>{let td=document.createElement('td');td.textContent=v;td.className=j===0?'rank':j===1?'model':'num';tr.appendChild(td)});$('rows').appendChild(tr)});$('count').textContent=`Showing ${records.length} of ${data.length} model(s)`;}
10
  async function load(){ $('status').textContent='Checking results…';try{let resp=await fetch(DATA_URL+'?t='+Date.now(),{cache:'no-store'});if(!resp.ok)throw new Error('HTTP '+resp.status);let json=await resp.json();if(!Array.isArray(json)||!json.every(r=>r.model&&['l1','l2','l3','overall'].every(k=>Number.isFinite(Number(r[k])))))throw new Error('Invalid leaderboard JSON');data=json;$('status').textContent='Live dataset results';}catch(e){data=sample;$('status').textContent='Demo results (dataset unavailable)';}render()}
 
4
  :root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;color:#18243b;background:#f5f7fc}*{box-sizing:border-box}body{margin:0}.wrap{max-width:1120px;margin:0 auto;padding:46px 22px 72px}.eyebrow{font-size:12px;font-weight:750;letter-spacing:.13em;color:#5277b9;text-transform:uppercase}.hero h1{font-size:clamp(32px,4.8vw,54px);letter-spacing:-.045em;margin:12px 0}.hero p{font-size:16px;color:#66758f;line-height:1.65;max-width:720px}.links{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 30px}.links a{padding:10px 16px;border:1px solid #dce3f1;border-radius:11px;text-decoration:none;color:#244781;background:white;font-weight:650;font-size:13px}.panel{background:white;border-radius:18px;padding:24px;border:1px solid #e4e9f3;box-shadow:0 7px 24px rgba(40,60,100,.04)}.panel h2{margin:0;font-size:22px}.sub{color:#73819a;font-size:13px;margin:7px 0 20px}.controls{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:20px}input,select,button{border:1px solid #dce3f0;border-radius:10px;padding:11px 13px;background:white;color:#253656;font:inherit;font-size:13px}input{flex:1;min-width:200px}button{cursor:pointer;background:#255aa6;color:white;font-weight:700}.scroll{overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:690px}th{font-size:12px;text-align:left;color:#61718b;cursor:pointer;padding:15px 13px;background:#f6f8fd}td{padding:17px 13px;border-bottom:1px solid #ecf0f7;font-size:14px}td.num{text-align:right;font-variant-numeric:tabular-nums}th.num{text-align:right}tr:last-child td{border-bottom:0}td.model{font-weight:650}td.rank{font-weight:700;color:#5c6c84}tr:first-child td.rank{color:#b27818}.tag{display:inline-block;padding:4px 8px;background:#eef5ff;color:#3267ae;border-radius:6px;font-size:11px}.note{margin-top:18px;color:#66758f;font-size:12px;line-height:1.65}.foot{font-size:12px;color:#8490a4;margin-top:20px}.status{display:inline-block;font-size:12px;color:#596b86;margin-left:auto}.mini{font-size:12px;color:#6b7a92;margin-top:12px}@media(max-width:600px){.wrap{padding:24px 14px}.panel{padding:16px}.controls{gap:8px}}
5
  </style></head><body><main class="wrap"><header class="hero"><div class="eyebrow">AudioCC Lab · Text-to-Audio Evaluation</div><h1>PhyAudioBench <span style="color:#3473bd">Leaderboard</span></h1><p>Evaluating whether generated sounds are physically consistent—not just semantically plausible. Explore model performance across signal/semantic fidelity (L1), event structure (L2), and physical consistency (L3).</p><div class="links"><a href="https://github.com/AudioCC-Lab/PhyAudioBench" target="_blank" rel="noopener">↗ Code repository</a><a href="https://huggingface.co/datasets/AudioCC-Lab/PhyAudioBench" target="_blank" rel="noopener">↗ Dataset</a><a href="https://audiocc-lab.github.io/PhyAudioBench-project/" target="_blank" rel="noopener">↗ Project page</a></div></header><section class="panel"><h2>Model Rankings</h2><p class="sub">Higher is better · Click a column heading to change the ranking metric</p><div class="controls"><input id="search" placeholder="Search models…" aria-label="Search models"/><select id="metric" aria-label="Ranking metric"><option value="overall">Rank by Overall</option><option value="l1">Rank by L1</option><option value="l2">Rank by L2</option><option value="l3">Rank by L3</option></select><button id="refresh">Refresh results</button><span id="status" class="status" role="status">Loading…</span></div><div class="scroll"><table><thead><tr><th>Rank</th><th data-metric="model">Model</th><th class="num" data-metric="l1">L1 ↕</th><th class="num" data-metric="l2">L2 ↕</th><th class="num" data-metric="l3">L3 ↕</th><th class="num" data-metric="overall">Overall ↕</th></tr></thead><tbody id="rows"></tbody></table></div><div class="note">Example results from the existing PhyAudioBench evaluation. Scores are shown as proportions (0–1). Public submissions are not yet enabled; a separate evaluation runner is needed to compute and validate new entries.</div><div class="mini" id="count"></div></section><div class="foot">PhyAudioBench · AudioCC-Lab. To publish updated scores, maintain leaderboard.json in the public results Dataset.</div></main>
6
  <script>
7
+ const sample=[{model:'TangoFlux',l1:,l2:,l3:,overall:},{model:'Tango2',l1:,l2:,l3:,overall:},{model:'Auffusion',l1:,l2:,l3:,overall:},{model:'Make-An-Audio 2',l1:,l2:,l3:,overall:}];
8
  const DATA_URL='https://huggingface.co/datasets/AudioCC-Lab/PhyAudioBench-results/resolve/main/leaderboard.json';let data=sample;const $=id=>document.getElementById(id);const val=x=>Number.isFinite(Number(x))?Number(x).toFixed(4):'—';
9
  function render(){let key=$('metric').value,q=$('search').value.trim().toLowerCase();let records=data.filter(x=>String(x.model).toLowerCase().includes(q)).sort((a,b)=>Number(b[key])-Number(a[key]));$('rows').replaceChildren();records.forEach((r,i)=>{let tr=document.createElement('tr');let vals=[String(i+1),r.model,val(r.l1),val(r.l2),val(r.l3),val(r.overall)];vals.forEach((v,j)=>{let td=document.createElement('td');td.textContent=v;td.className=j===0?'rank':j===1?'model':'num';tr.appendChild(td)});$('rows').appendChild(tr)});$('count').textContent=`Showing ${records.length} of ${data.length} model(s)`;}
10
  async function load(){ $('status').textContent='Checking results…';try{let resp=await fetch(DATA_URL+'?t='+Date.now(),{cache:'no-store'});if(!resp.ok)throw new Error('HTTP '+resp.status);let json=await resp.json();if(!Array.isArray(json)||!json.every(r=>r.model&&['l1','l2','l3','overall'].every(k=>Number.isFinite(Number(r[k])))))throw new Error('Invalid leaderboard JSON');data=json;$('status').textContent='Live dataset results';}catch(e){data=sample;$('status').textContent='Demo results (dataset unavailable)';}render()}