SRSoftware/Umbrella
1
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

first working version. need to improve styling (right align for number cells)

Browse Source 
Signed-off-by: Stephan Richter <s.richter@srsoftware.de>
This commit is contained in:
Stephan Richter
2026-03-21 00:41:26 +01:00
parent 87b81756cd
commit 30ebe3f4e7
2 changed files with 26 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
frontend/src/Components/MarkdownDisplay.svelte
View File

@@ -1,6 +1,6 @@
<script> <script>
import { onMount } from 'svelte'; import { onMount, onDestroy } from 'svelte';
let { classes='markdown', markdown, onclick = null, oncontextmenu = null, title='', wrapper = 'div' } = $props(); let { classes='markdown', markdown=$bindable({source:'',rendered:''}), onclick = null, oncontextmenu = null, title='', wrapper = 'div' } = $props();
let jspreadsheet = null; let jspreadsheet = null;
const regex = /@startsheet[\s\S]*?@endsheet/g; const regex = /@startsheet[\s\S]*?@endsheet/g;
@@ -15,11 +15,10 @@
console.warn(`cannot replace block ${n}: only ${blocks.length} blocks found!`); console.warn(`cannot replace block ${n}: only ${blocks.length} blocks found!`);
return text; return text;
} }
let count = 0;
return text.replace(regex, (match, index) => index === n ? `@startsheet\n${newContent}\n@endsheet` : match); return text.replace(regex, (match) => count++ === n ? `@startsheet\n${newContent}\n@endsheet` : match);
} }
async function transform(){ async function transform(){
if (!markdown.rendered) return; if (!markdown.rendered) return;
let sheets = document.getElementsByClassName('spreadsheet'); let sheets = document.getElementsByClassName('spreadsheet');
@@ -36,16 +35,31 @@
// Use parseCSV from the helpers // Use parseCSV from the helpers
const parsed = jspreadsheet.helpers.parseCSV(raw, '|'); const parsed = jspreadsheet.helpers.parseCSV(raw, '|');
let columns = {};
jspreadsheet(document.getElementById(sheet.id), { for (let row of parsed){
worksheets : [{data:parsed}], for (let col in row){
let data = ""+row[col];
let len = data.length;
columns[col] = Math.max(columns[col]??0,len);
}
}
columns = Object.values(columns).map((len) => {return {
align: 'left',
width:`${len}0px`
}});
let config = {
worksheets : [{
data:parsed,
columns
}],
onchange : (instance, cell, x, y, value) => update(instance, i) onchange : (instance, cell, x, y, value) => update(instance, i)
}); };
let wb = jspreadsheet(document.getElementById(sheet.id), config);
} }
} }
// TODO: use target from urls.svelte to replace internal URLs onMount(() => { setTimeout(transform,200)});
onMount(transform);
</script> </script>
@@ -53,4 +67,4 @@
<svelte:element this={wrapper} class={classes} {onclick} {oncontextmenu} {title}> <svelte:element this={wrapper} class={classes} {onclick} {oncontextmenu} {title}>
{@html markdown.rendered} {@html markdown.rendered}
</svelte:element> </svelte:element>
{/if} {/if}

2
frontend/src/Components/MarkdownEditor.svelte
View File

@@ -138,7 +138,7 @@
<span id="restore_markdown" onclick={restore} class="hint">{t('unsaved_content')}</span> <span id="restore_markdown" onclick={restore} class="hint">{t('unsaved_content')}</span>
{/if} {/if}
<textarea bind:value={editValue.source} onkeyup={typed} autofocus={!simple}></textarea> <textarea bind:value={editValue.source} onkeyup={typed} autofocus={!simple}></textarea>
<Display classes="preview" markdown={editValue} /> <Display classes="preview" bind:markdown={editValue} />
{#if !simple} {#if !simple}
<div class="buttons"> <div class="buttons">
<button class="cancel" onclick={e => editing = false}>{t('cancel')}</button> <button class="cancel" onclick={e => editing = false}>{t('cancel')}</button>