added gameboard

gameboard-service/src/lib/actions/keybind.ts

@@ -0,0 +1,26 @@
+import Mousestrap from "mousetrap";
+
+type Options = {
+  keys: string[];
+  f: () => void;
+};
+
+export function keybind(node: HTMLElement, options: Options) {
+  console.debug("[keybind] binding:", options.keys);
+
+  const mousetrap = new Mousestrap(document.documentElement);
+  mousetrap.bind(options.keys, () => {
+    console.debug("[keybind] handling:", options.keys);
+    options.f();
+
+    // Always prevent default behavior
+    return false;
+  });
+
+  return {
+    destroy() {
+      console.debug("[keybind] destorying:", options.keys);
+      mousetrap.reset();
+    }
+  };
+}

gameboard-service/src/lib/actions/resize.ts

@@ -0,0 +1,20 @@
+type Options = {
+  f: (width: number, height: number) => void;
+};
+
+export function resize(node: HTMLElement, options: Options) {
+  const resizeObserver = new ResizeObserver((entries) => {
+    for (const entry of entries) {
+      const w = entry.contentBoxSize[0].inlineSize;
+      const h = entry.contentBoxSize[0].blockSize;
+      options.f(w, h);
+    }
+  });
+  resizeObserver.observe(node);
+
+  return {
+    destroy() {
+      resizeObserver.unobserve(node);
+    }
+  };
+}

gameboard-service/src/lib/actions/tooltip.ts

@@ -0,0 +1,20 @@
+import tippy from "tippy.js";
+
+type Options = {
+  templateId: string;
+  tippyProps: object;
+};
+
+export function tooltip(node: HTMLElement, options: Options) {
+  const props = {
+    ...options.tippyProps,
+    allowHTML: true,
+    content: document.getElementById(options.templateId)?.innerHTML.slice()
+  };
+
+  const tip = tippy(node, props);
+
+  return {
+    destroy: () => tip.destroy()
+  };
+}