Partially render the boxes

1 files changed, 24 insertions, 0 deletions

diff --git a/src/lib/stores/canvas.js b/src/lib/stores/canvas.js
new file mode 100644
index 0000000..e0cc115
--- /dev/null
+++ b/src/lib/stores/canvas.js
@@ -0,0 +1,24 @@
+import { browser } from '$app/env';
+import { derived, writable } from 'svelte/store';
+
+export const canvas = writable({x: 0, y: 0});
+
+export const topLeft = derived(canvas, ($canvas) => {
+  if (browser) {
+    return {
+      x: $canvas.x - window.screen.width/2,
+      y: $canvas.y - window.screen.height/2
+    };
+  }
+  return {x: 0, y: 0}
+});
+
+export const bottomRight = derived(canvas, ($canvas) => {
+  if (browser) {
+    return {
+      x: $canvas.x + window.screen.width/2,
+      y: $canvas.y + window.screen.height/2
+    };
+  }
+  return {x: 0, y: 0}
+});