properly display chart in editing
This commit is contained in:
parent
f878978e06
commit
a10bb8b974
|
@ -4,9 +4,40 @@
|
||||||
import IoMdAlert from 'svelte-icons/io/IoMdAlert.svelte'
|
import IoMdAlert from 'svelte-icons/io/IoMdAlert.svelte'
|
||||||
import { writeText } from 'clipboard-polyfill';
|
import { writeText } from 'clipboard-polyfill';
|
||||||
import { Button, TextField, Loading } from 'attractions';
|
import { Button, TextField, Loading } from 'attractions';
|
||||||
|
import Chart from './Chart.svelte';
|
||||||
|
import { onMount } from 'svelte';
|
||||||
|
import { currentChartID } from './stores';
|
||||||
|
|
||||||
let isLoaded = false;
|
let isLoaded = false;
|
||||||
let error = null;
|
let error = null;
|
||||||
|
|
||||||
|
let name = '';
|
||||||
|
let top = '';
|
||||||
|
let left = '';
|
||||||
|
let right = '';
|
||||||
|
let bot = '';
|
||||||
|
|
||||||
|
let images = [];
|
||||||
|
|
||||||
|
onMount(() => {
|
||||||
|
let s = new WebSocket('ws://localhost:5252/connect?id=' + $currentChartID);
|
||||||
|
s.addEventListener('message', (e) => {
|
||||||
|
let data = JSON.parse(e.data);
|
||||||
|
if (!isLoaded) {
|
||||||
|
name = data.name || '';
|
||||||
|
top = data.topText || '';
|
||||||
|
left = data.leftText || '';
|
||||||
|
right = data.rightText || '';
|
||||||
|
bot = data.bottomText || '';
|
||||||
|
isLoaded = true;
|
||||||
|
} else {
|
||||||
|
images.push(...data);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
s.addEventListener('error', (e) => {
|
||||||
|
error = e;
|
||||||
|
});
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
@ -49,8 +80,13 @@
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
{#if !isLoaded}
|
{#if !isLoaded && !error}
|
||||||
<br><br><br>
|
<br><br><br>
|
||||||
<Loading/>
|
<Loading/>
|
||||||
|
{:else if isLoaded}
|
||||||
|
{#key name + top + left + right + bot}
|
||||||
|
{name}
|
||||||
|
<Chart topText={top} leftText={left} rightText={right} bottomText={bot} fontSize=14/>
|
||||||
|
{/key}
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
Loading…
Reference in New Issue