diff --git a/web/src/lib/components/ToolPage.svelte b/web/src/lib/components/ToolPage.svelte index 3b9daaf..0f73902 100644 --- a/web/src/lib/components/ToolPage.svelte +++ b/web/src/lib/components/ToolPage.svelte @@ -21,6 +21,10 @@ const isInfo = $derived(tool.resultType === 'info'); const sanitized = $derived(sanitizeParams(tool, values)); + let runToken = 0; + let lastRunSource: PixelImage | null = null; + let lastRunValuesJson = ''; + async function handleFile(file: File) { errorText = ''; status = 'processing'; @@ -41,20 +45,27 @@ async function runTool() { if (!source || isInfo) return; + const token = ++runToken; + lastRunSource = source; + lastRunValuesJson = JSON.stringify(sanitized); try { - result = await tool.run(source, sanitized); + const next = await tool.run(source, sanitized); + if (token !== runToken) return; + result = next; status = 'loaded'; } catch (e) { + if (token !== runToken) return; showError(e); } } - function apply() { - if (!source || isInfo || status === 'processing') return; - errorText = ''; - status = 'processing'; - runTool(); - } + $effect(() => { + const valuesJson = JSON.stringify(sanitized); + if (source === lastRunSource && valuesJson === lastRunValuesJson) return; + if (!source || isInfo) return; + const timer = setTimeout(() => void runTool(), 300); + return () => clearTimeout(timer); + }); function showError(e: unknown) { status = source ? 'loaded' : 'idle'; @@ -123,7 +134,7 @@ {#if source && !isInfo} - + {/if} diff --git a/web/src/lib/components/tool/ParamsCard.svelte b/web/src/lib/components/tool/ParamsCard.svelte index 63ef5d3..2fb6e7a 100644 --- a/web/src/lib/components/tool/ParamsCard.svelte +++ b/web/src/lib/components/tool/ParamsCard.svelte @@ -1,23 +1,19 @@

Параметры

{#if params.length > 0} - {:else}

У этого инструмента нет параметров — результат уже готов. diff --git a/web/src/lib/components/tool/ResultCard.svelte b/web/src/lib/components/tool/ResultCard.svelte index 613ffb1..e091271 100644 --- a/web/src/lib/components/tool/ResultCard.svelte +++ b/web/src/lib/components/tool/ResultCard.svelte @@ -57,6 +57,9 @@ {:else}

+ {#if status === 'processing'} + Пересчёт… + {/if}