git: reset

app/src/scripts/ws/base.ts

@@ -0,0 +1,62 @@
+import { makeEventListener } from "@solid-primitives/event-listener";
+
+import { createRWS } from "/src/solid/rws";
+
+export const createResourceWS = <T>(
+  creator: (callback: (value: T) => void) => WebSocket,
+) => {
+  let ws: WebSocket | null = null;
+
+  const live = createRWS(false);
+  const latest = createRWS<T | null>(null);
+
+  let clearFocusListener: VoidFunction | undefined;
+
+  let clearOnlineListener: VoidFunction | undefined;
+
+  const resource: WebsocketResource<T> = {
+    live,
+    latest,
+    open() {
+      ws = creator((value) => latest.set(() => value));
+
+      ws.addEventListener("open", () => {
+        console.log("ws: open");
+        live.set(true);
+      });
+
+      ws.addEventListener("close", () => {
+        console.log("ws: close");
+        live.set(false);
+      });
+
+      const reinitWebSocket = () => {
+        if (!ws || ws.readyState === ws.CLOSED) {
+          console.log("ws: reinit");
+          resource.open();
+        }
+      };
+
+      clearFocusListener = makeEventListener(
+        document,
+        "visibilitychange",
+        () => !document.hidden && reinitWebSocket(),
+      );
+
+      clearOnlineListener = makeEventListener(
+        window,
+        "online",
+        reinitWebSocket,
+      );
+    },
+    close() {
+      ws?.close();
+      clearFocusListener = clearFocusListener?.() || undefined;
+      clearOnlineListener = clearOnlineListener?.() || undefined;
+      live.set(false);
+      ws = null;
+    },
+  };
+
+  return resource;
+};

app/src/scripts/ws/index.ts

@@ -0,0 +1,10 @@
+import { createResourceWS } from "./base";
+import { krakenAPI } from "./kraken";
+
+export const webSockets = {
+  liveKrakenCandle: createResourceWS(krakenAPI.createLiveCandleWebsocket),
+  openAll() {
+    this.liveKrakenCandle.open();
+    onCleanup(this.liveKrakenCandle.close);
+  },
+};

app/src/scripts/ws/kraken.ts

@@ -0,0 +1,49 @@
+import { dateToString } from "../utils/date";
+import { ONE_DAY_IN_MS } from "../utils/time";
+
+export const krakenAPI = {
+  createLiveCandleWebsocket(
+    callback: (candle: DatasetCandlestickData) => void,
+  ) {
+    const ws = new WebSocket("wss://ws.kraken.com");
+
+    ws.addEventListener("open", () => {
+      ws.send(
+        JSON.stringify({
+          event: "subscribe",
+          pair: ["XBT/USD"],
+          subscription: {
+            name: "ohlc",
+            interval: 1440,
+          },
+        }),
+      );
+    });
+
+    ws.addEventListener("message", (message) => {
+      const result = JSON.parse(message.data);
+
+      if (!Array.isArray(result)) return;
+
+      const [timestamp, _, open, high, low, close, __, volume] = result[1];
+
+      const dateStr = dateToString(new Date(Number(timestamp) * 1000));
+
+      const candle: DatasetCandlestickData = {
+        // date: dateStr,
+        number: new Date(dateStr).valueOf() / ONE_DAY_IN_MS,
+        time: dateStr,
+        open: Number(open),
+        high: Number(high),
+        low: Number(low),
+        close: Number(close),
+        value: Number(close),
+        // volume: Number(volume),
+      };
+
+      candle && callback({ ...candle });
+    });
+
+    return ws;
+  },
+};

app/src/scripts/ws/types.d.ts

@@ -0,0 +1,6 @@
+interface WebsocketResource<T> {
+  live: Accessor<boolean>;
+  latest: Accessor<T | null>;
+  open: VoidFunction;
+  close: VoidFunction;
+}