10 changed files with 87 additions and 10 deletions
@ -0,0 +1,40 @@ |
|||||||
|
<script> |
||||||
|
import { useTinyRouter } from 'svelte-tiny-router'; |
||||||
|
import { onMount } from 'svelte'; |
||||||
|
import { api } from '../../urls.svelte'; |
||||||
|
import { error, yikes } from '../../warn.svelte'; |
||||||
|
import { t } from '../../translations.svelte'; |
||||||
|
|
||||||
|
let router = useTinyRouter(); |
||||||
|
let tags = $state(null); |
||||||
|
|
||||||
|
function onclick(e){ |
||||||
|
e.preventDefault(); |
||||||
|
var target = e.target; |
||||||
|
while (target && !target.href) target=target.parentNode; |
||||||
|
let href = target.getAttribute('href'); |
||||||
|
if (href) router.navigate(href); |
||||||
|
return false; |
||||||
|
} |
||||||
|
|
||||||
|
async function loadTags(){ |
||||||
|
const url = api('tags'); |
||||||
|
const res = await fetch(url,{credentials:'include'}); |
||||||
|
if (res.ok){ |
||||||
|
yikes(); |
||||||
|
tags = await res.json(); |
||||||
|
} else error(res); |
||||||
|
} |
||||||
|
|
||||||
|
onMount(loadTags) |
||||||
|
</script> |
||||||
|
|
||||||
|
<h1>{t('tags')}</h1> |
||||||
|
|
||||||
|
<div class="cloud"> |
||||||
|
{#if tags} |
||||||
|
{#each tags as entry} |
||||||
|
<a href="/tags/use/{encodeURIComponent(entry.tag)}" class="tag" style="font-size: {40 - 28/entry.count}px" title={t('count_of_occurrences',entry)} {onclick} >{entry.tag}</a> |
||||||
|
{/each} |
||||||
|
{/if} |
||||||
|
</div> |
||||||
Loading…
Reference in new issue