aboutsummaryrefslogtreecommitdiff
path: root/src/routes/index.svelte
diff options
context:
space:
mode:
authorRuben Beltran del Rio <ruben@unlimited.pizza>2023-01-24 13:07:20 +0100
committerRuben Beltran del Rio <ruben@unlimited.pizza>2023-01-24 13:07:50 +0100
commite4e4b5202bf0039127f591941fddc1ff5ca09897 (patch)
tree0c6ad5b8784002ab2d05a14ece3d0b56fee1383f /src/routes/index.svelte
parentc55cffecda48be785d89721dc8c8f04c99270b2d (diff)
Update project, improve sensor/render logic
Diffstat (limited to 'src/routes/index.svelte')
-rw-r--r--src/routes/index.svelte86
1 files changed, 0 insertions, 86 deletions
diff --git a/src/routes/index.svelte b/src/routes/index.svelte
deleted file mode 100644
index 411b81f..0000000
--- a/src/routes/index.svelte
+++ /dev/null
@@ -1,86 +0,0 @@
-<script>
- import Sensor from '$lib/components/sensor.svelte';
- import Background from '$lib/components/background.svelte';
- import Palette from '$lib/components/palette.svelte';
- import Hud from '$lib/components/hud.svelte';
- import Widget from '$lib/components/widget.svelte';
- import { modulo } from '$lib/math';
- import { widgets } from '$lib/stores/widgets';
- import { canvas } from '$lib/stores/canvas';
-
- import { coordinateLength, maxSize } from '$lib/config';
-
- $: shouldShowPalette = false;
-
- let dragging = false;
-
- const moveCanvas = function moveCanvas(event) {
-
- if (dragging) {
- let deltaX = event.x - dragging.x;
- let deltaY = event.y - dragging.y;
- let x = modulo($canvas.x - deltaX, maxSize);
- let y = modulo($canvas.y - deltaY, maxSize);
- dragging.x = event.x;
- dragging.y = event.y;
- canvas.set({ x, y })
- }
- }
-
- const startDragging = function startDragging(event) {
- dragging = {
- x: event.x,
- y: event.y
- };
- }
-
- const stopDragging = function startDragging() {
- dragging = null;
- }
-
- const showPalette = function showPalette(event) {
- event.preventDefault();
- dragging = null;
- document.documentElement.style.setProperty('--palette-x', event.clientX + 'px');
- document.documentElement.style.setProperty('--palette-y', event.clientY + 'px');
- shouldShowPalette = true;
- }
-
- const hidePalette = function hidePalette() {
- event.preventDefault();
- shouldShowPalette = false;
- }
-</script>
-
-<div
- class="canvas"
- on:click={hidePalette}
- on:contextmenu={showPalette}
- on:mousedown={startDragging}
- on:mouseup={stopDragging}
- on:mousemove={moveCanvas}
->
- <Sensor />
- <Background />
- <Hud />
-
- {#if shouldShowPalette }
- <Palette/>
- {/if}
-
- {#if $widgets}
- {#each $widgets as widget}
- <Widget widget={widget}/>
- {/each}
- {/if}
-</div>
-
-<style>
- .canvas {
- user-select: none;
- padding: 0;
- margin: 0;
- width: 100vw;
- height: 100vh;
- }
-</style>