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

   1 import { derived, 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   ];
  18
  19   if (right > maxSize  || bottom > maxSize) {
  20     return [...results,
  21       `box.ov."((${left-maxSize},${top-maxSize}),(${right-maxSize},${bottom-maxSize}))"`,
  22       `box.ov."((${left-maxSize},${top}),(${right-maxSize},${bottom}))"`,
  23       `box.ov."((${left},${top-maxSize}),(${right},${bottom-maxSize}))"`
  24     ];
  25   }
  26
  27   return results
  28 };
  29
  30 const serialize = function serialize(widget) {
  31
  32   const boxComponents = widget.box
  33     .match(boxParser)
  34     .slice(1,5)
  35     .map(Number);
  36   const box = {
  37     left: Math.min(boxComponents[0], boxComponents[2]),
  38     right: Math.max(boxComponents[0], boxComponents[2]),
  39     top: Math.min(boxComponents[1], boxComponents[3]),
  40     bottom: Math.max(boxComponents[1], boxComponents[3])
  41   };
  42
  43   return {...widget, box }
  44 };
  45
  46 let ac = null;
  47 export const widgets = derived(sensor, async function ($sensor, set) {
  48
  49   const boxes = getBoxes($sensor);
  50   ac && ac.abort()
  51   ac = new AbortController();
  52   const { data } = await client
  53     .from('widgets')
  54     .select()
  55     .or(boxes.join(','))
  56     .abortSignal(ac.signal)
  57   if (data) {
  58     return set(data.map(serialize));
  59   }
  60 });