<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
body { margin: 0; font-family: sans-serif; background: transparent; overflow: hidden; }
#cloud { display: flex; flex-wrap: wrap; gap: 8px; padding: 10px; }
.tag {
text-decoration: none; color: #475569; background: #f1f5f9;
padding: 5px 12px; border-radius: 20px; border: 1px solid #e2e8f0;
font-size: 13px; transition: 0.2s;
}
.tag:hover { background: #3b82f6; color: white; }
</style>
</head>
<body>
<div id="cloud">Chargement...</div>
<script>
(async () => {
const HOST = "lepoudreux.hashnode.dev";
const query = `query{publication(host:"${HOST}"){posts(first:50){edges{node{tags{name,slug}}}}}}`;
try {
const response = await fetch('https://gql.hashnode.com', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ query })
});
const res = await response.json();
const tagsMap = {};
res.data.publication.posts.edges.forEach(e => e.node.tags.forEach(t => {
tagsMap[t.name] = { s: t.slug, c: (tagsMap[t.name]?.c || 0) + 1 };
}));
document.getElementById('cloud').innerHTML = Object.entries(tagsMap)
.sort((a, b) => b[1].c - a[1].c)
.map(([n, v]) => `<a href="https://${HOST}/tag/${v.s}" target="_top" class="tag">${n}</a>`).join('');
} catch (e) { document.getElementById('cloud').innerText = "Erreur."; }
})();
</script>
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire