git.r.bdr.sh - rbdr/canvas/blob - src/lib/stores/widgets.js

   1 import { derived, readable, writable } from 'svelte/store';
   2 import { createClient } from '@supabase/supabase-js';
   3 import { supabase } from '$lib/config';
   4 import { maxSize } from '$lib/config';
   5
   6 const boxParser = /\(([0-9]+),([0-9]+)\),\(([0-9]+),([0-9]+)\)/;
   7 const client = createClient(supabase.url, supabase.key);
   8
   9 export const sensor = writable({ left: 0, top: 0, right: 0, bottom: 0 });
  10
  11 const getBoxes = function getBoxes({ left, top, right, bottom }) {
  12         const results = [
  13                 `box.ov."((${left},${top}),(${right},${bottom}))"`,
  14                 `box.ov."((${left + maxSize},${top + maxSize}),(${right + maxSize},${bottom + maxSize}))"`,
  15                 `box.ov."((${left + maxSize},${top}),(${right + maxSize},${bottom}))"`,
  16                 `box.ov."((${left},${top + maxSize}),(${right},${bottom + maxSize}))"`,
  17                 `box.ov."((${left - maxSize},${top - maxSize}),(${right - maxSize},${bottom - maxSize}))"`,
  18                 `box.ov."((${left - maxSize},${top}),(${right - maxSize},${bottom}))"`,
  19                 `box.ov."((${left},${top - maxSize}),(${right},${bottom - maxSize}))"`
  20         ];
  21
  22         return results;
  23 };
  24
  25 const serialize = function serialize(widget) {
  26         const boxComponents = widget.box.match(boxParser).slice(1, 5).map(Number);
  27         const box = {
  28                 left: Math.min(boxComponents[0], boxComponents[2]),
  29                 right: Math.max(boxComponents[0], boxComponents[2]),
  30                 top: Math.min(boxComponents[1], boxComponents[3]),
  31                 bottom: Math.max(boxComponents[1], boxComponents[3])
  32         };
  33
  34         return { ...widget, box };
  35 };
  36
  37 let ac = null;
  38 export const widgets = derived(sensor, async function ($sensor, set) {
  39         const boxes = getBoxes($sensor);
  40         ac && ac.abort();
  41         ac = new AbortController();
  42         const { data } = await client.from('widgets').select().or(boxes.join(',')).abortSignal(ac.signal);
  43         if (data) {
  44                 return set(data.map(serialize));
  45         }
  46 });
  47
  48 export const countElements = function countElements(left, top, right, bottom) {
  49         let countAc = null;
  50         return readable(0, (set) => {
  51                 (async function () {
  52                         countAc && countAc.abort();
  53                         countAc = new AbortController();
  54                         const { data } = await client
  55                                 .from('widgets')
  56                                 .select('*', { head: true, count: 'estimated' })
  57                                 .or(`box.ov."((${left},${top}),(${right},${bottom}))"`)
  58                                 .abortSignal(countAc.signal);
  59                         if (data) {
  60                                 return set(data);
  61                         }
  62                 })();
  63         });
  64 };