X-Git-Url: https://git.r.bdr.sh/rbdr/canvas/blobdiff_plain/e4e4b5202bf0039127f591941fddc1ff5ca09897..587d8fe65d61b8f7217b4e8850b44e43159c16fb:/src/lib/stores/widgets.js?ds=inline

diff --git a/src/lib/stores/widgets.js b/src/lib/stores/widgets.js
index 9bdb649..372cad1 100644
--- a/src/lib/stores/widgets.js
+++ b/src/lib/stores/widgets.js
@@ -1,55 +1,64 @@
-import { derived, writable } from 'svelte/store';
+import { derived, readable, writable } from 'svelte/store';
 import { createClient } from '@supabase/supabase-js';
 import { supabase } from '$lib/config';
 import { maxSize } from '$lib/config';
 
-const boxParser = /\(([0-9]+),([0-9]+)\),\(([0-9]+),([0-9]+)\)/
+const boxParser = /\(([0-9]+),([0-9]+)\),\(([0-9]+),([0-9]+)\)/;
 const client = createClient(supabase.url, supabase.key);
 
-export const sensor = writable({left: 0, top: 0, right: 0, bottom: 0});
+export const sensor = writable({ left: 0, top: 0, right: 0, bottom: 0 });
 
-const getBoxes = function getBoxes ({left, top, right, bottom}) {
-  const results = [
-    `box.ov."((${left},${top}),(${right},${bottom}))"`,
-    `box.ov."((${left+maxSize},${top+maxSize}),(${right+maxSize},${bottom+maxSize}))"`,
-    `box.ov."((${left+maxSize},${top}),(${right+maxSize},${bottom}))"`,
-    `box.ov."((${left},${top+maxSize}),(${right},${bottom+maxSize}))"`,
-    `box.ov."((${left-maxSize},${top-maxSize}),(${right-maxSize},${bottom-maxSize}))"`,
-    `box.ov."((${left-maxSize},${top}),(${right-maxSize},${bottom}))"`,
-    `box.ov."((${left},${top-maxSize}),(${right},${bottom-maxSize}))"`
-  ];
+const getBoxes = function getBoxes({ left, top, right, bottom }) {
+	const results = [
+		`box.ov."((${left},${top}),(${right},${bottom}))"`,
+		`box.ov."((${left + maxSize},${top + maxSize}),(${right + maxSize},${bottom + maxSize}))"`,
+		`box.ov."((${left + maxSize},${top}),(${right + maxSize},${bottom}))"`,
+		`box.ov."((${left},${top + maxSize}),(${right},${bottom + maxSize}))"`,
+		`box.ov."((${left - maxSize},${top - maxSize}),(${right - maxSize},${bottom - maxSize}))"`,
+		`box.ov."((${left - maxSize},${top}),(${right - maxSize},${bottom}))"`,
+		`box.ov."((${left},${top - maxSize}),(${right},${bottom - maxSize}))"`
+	];
 
-  return results
+	return results;
 };
 
 const serialize = function serialize(widget) {
+	const boxComponents = widget.box.match(boxParser).slice(1, 5).map(Number);
+	const box = {
+		left: Math.min(boxComponents[0], boxComponents[2]),
+		right: Math.max(boxComponents[0], boxComponents[2]),
+		top: Math.min(boxComponents[1], boxComponents[3]),
+		bottom: Math.max(boxComponents[1], boxComponents[3])
+	};
 
-  const boxComponents = widget.box
-    .match(boxParser)
-    .slice(1,5)
-    .map(Number);
-  const box = {
-    left: Math.min(boxComponents[0], boxComponents[2]),
-    right: Math.max(boxComponents[0], boxComponents[2]),
-    top: Math.min(boxComponents[1], boxComponents[3]),
-    bottom: Math.max(boxComponents[1], boxComponents[3])
-  };
-
-  return {...widget, box }
+	return { ...widget, box };
 };
 
 let ac = null;
 export const widgets = derived(sensor, async function ($sensor, set) {
-
-  const boxes = getBoxes($sensor);
-  ac && ac.abort()
-  ac = new AbortController();
-  const { data } = await client
-    .from('widgets')
-    .select()
-    .or(boxes.join(','))
-    .abortSignal(ac.signal)
-  if (data) {
-    return set(data.map(serialize));
-  }
+	const boxes = getBoxes($sensor);
+	ac && ac.abort();
+	ac = new AbortController();
+	const { data } = await client.from('widgets').select().or(boxes.join(',')).abortSignal(ac.signal);
+	if (data) {
+		return set(data.map(serialize));
+	}
 });
+
+export const countElements = function countElements(left, top, right, bottom) {
+	let countAc = null;
+	return readable(0, (set) => {
+		(async function () {
+			countAc && countAc.abort();
+			countAc = new AbortController();
+			const { data } = await client
+				.from('widgets')
+				.select('*', { head: true, count: 'estimated' })
+				.or(`box.ov."((${left},${top}),(${right},${bottom}))"`)
+				.abortSignal(countAc.signal);
+			if (data) {
+				return set(data);
+			}
+		})();
+	});
+};