add basiv webview for font results
This commit is contained in:
parent
fae5f783f3
commit
eea4fad2bd
3 changed files with 107 additions and 4 deletions
37
client/src/components/glyphview.svelte
Normal file
37
client/src/components/glyphview.svelte
Normal file
|
@ -0,0 +1,37 @@
|
|||
<script lang="ts">
|
||||
let glyphSVG = $state("");
|
||||
|
||||
let { selectedChar = "", loading = $bindable() } = $props();
|
||||
|
||||
$effect(() => {
|
||||
if (selectedChar === "") {
|
||||
return;
|
||||
}
|
||||
|
||||
loading = true;
|
||||
const response = fetch(`http://localhost:8000/glyph/${selectedChar}`)
|
||||
.then((data) => {
|
||||
data.text().then((result) => { glyphSVG = result });
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
})
|
||||
.finally(() => {
|
||||
loading = false;
|
||||
});
|
||||
});
|
||||
|
||||
export { selectedChar }
|
||||
export { loading }
|
||||
</script>
|
||||
|
||||
<div class="glyph">
|
||||
{@html glyphSVG }
|
||||
</div>
|
||||
|
||||
<style>
|
||||
:global(.glyph > svg) {
|
||||
max-height: 50vh;
|
||||
max-width: 50vw;
|
||||
}
|
||||
</style>
|
Loading…
Add table
Add a link
Reference in a new issue