|
|
<!doctype html> |
|
|
<html> |
|
|
<head> |
|
|
<meta charset="utf-8" /> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> |
|
|
<title>SQL Console Demos</title> |
|
|
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@400;600&display=swap" rel="stylesheet" /> |
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/duckdb/0.10.1/duckdb.min.js"></script> |
|
|
<style> |
|
|
body { |
|
|
font-family: 'Source Sans Pro', system-ui, -apple-system, sans-serif; |
|
|
margin: 0; |
|
|
padding: 20px; |
|
|
background: #f5f5f5; |
|
|
min-height: 100vh; |
|
|
} |
|
|
|
|
|
.container { |
|
|
max-width: 1200px; |
|
|
margin: 0 auto; |
|
|
} |
|
|
|
|
|
.header { |
|
|
text-align: center; |
|
|
margin-bottom: 2rem; |
|
|
color: #111827; |
|
|
} |
|
|
|
|
|
.summary { |
|
|
text-align: center; |
|
|
margin-bottom: 2rem; |
|
|
padding: 1rem; |
|
|
background: white; |
|
|
border-radius: 12px; |
|
|
box-shadow: 0 1px 3px rgba(0,0,0,0.1); |
|
|
border: 1px solid #e5e7eb; |
|
|
} |
|
|
|
|
|
.summary p { |
|
|
font-size: 1.1rem; |
|
|
color: #374151; |
|
|
margin: 0; |
|
|
} |
|
|
|
|
|
.grid { |
|
|
display: flex; |
|
|
flex-direction: column; |
|
|
gap: 2rem; |
|
|
} |
|
|
|
|
|
.card { |
|
|
background: white; |
|
|
border-radius: 12px; |
|
|
box-shadow: 0 1px 3px rgba(0,0,0,0.1); |
|
|
padding: 1.5rem; |
|
|
border: 1px solid #e5e7eb; |
|
|
} |
|
|
|
|
|
.card-title { |
|
|
font-size: 1.25rem; |
|
|
font-weight: 600; |
|
|
margin-bottom: 1rem; |
|
|
color: #111827; |
|
|
} |
|
|
|
|
|
.iframe-container { |
|
|
border-radius: 8px; |
|
|
overflow: hidden; |
|
|
background: #fff; |
|
|
} |
|
|
|
|
|
iframe { |
|
|
border: none; |
|
|
width: 100%; |
|
|
display: block; |
|
|
} |
|
|
|
|
|
@media (max-width: 768px) { |
|
|
body { |
|
|
padding: 1rem; |
|
|
} |
|
|
|
|
|
.card { |
|
|
padding: 1rem; |
|
|
} |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
<div class="container"> |
|
|
<header class="header"> |
|
|
<h1>Leaderboards</h1> |
|
|
</header> |
|
|
|
|
|
<div class="summary" id="total-annotations"> |
|
|
<p>Loading total annotations...</p> |
|
|
</div> |
|
|
|
|
|
<div class="grid"> |
|
|
<div class="card"> |
|
|
<div class="card-title">User Leaderboard</div> |
|
|
<div class="iframe-container"> |
|
|
<iframe |
|
|
src="https://huggingface.co/datasets/davanstrien/progress/embed/sql-console/NbscKj4" |
|
|
frameborder="0" |
|
|
height="560px"> |
|
|
</iframe> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="card"> |
|
|
<div class="card-title">Language Leaderboard</div> |
|
|
<div class="iframe-container"> |
|
|
<iframe |
|
|
src="https://huggingface.co/datasets/davanstrien/progress/embed/sql-console/5Bhx9Ck" |
|
|
frameborder="0" |
|
|
height="560px"> |
|
|
</iframe> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<script> |
|
|
async function initDuckDB() { |
|
|
const JSDELIVR_BUNDLES = "https://cdn.jsdelivr.net/npm/@duckdb/duckdb-wasm/dist"; |
|
|
const DUCKDB_BUNDLES = { |
|
|
mvp: { |
|
|
mainModule: JSDELIVR_BUNDLES + "/duckdb-mvp.wasm", |
|
|
mainWorker: JSDELIVR_BUNDLES + "/duckdb-browser-mvp.worker.js", |
|
|
}, |
|
|
}; |
|
|
|
|
|
const db = await duckdb.createWorker(DUCKDB_BUNDLES); |
|
|
|
|
|
try { |
|
|
const result = await db.query(` |
|
|
SELECT SUM(submitted) as total_annotations |
|
|
FROM 'hf://datasets/davanstrien/progress@~parquet/train/*.parquet' |
|
|
`); |
|
|
|
|
|
const totalAnnotations = result[0].total_annotations; |
|
|
document.getElementById('total-annotations').innerHTML = |
|
|
`<p>Total annotations submitted: <strong>${totalAnnotations.toLocaleString()}</strong></p>`; |
|
|
|
|
|
} catch (error) { |
|
|
console.error('Error:', error); |
|
|
document.getElementById('total-annotations').innerHTML = |
|
|
'<p>Error loading total annotations</p>'; |
|
|
} |
|
|
} |
|
|
|
|
|
initDuckDB(); |
|
|
</script> |
|
|
</body> |
|
|
</html> |
