forked from
tokono.ma/diffuse
A music player that connects to your cloud/distributed storage.
1import { defineElement, DiffuseElement } from "~/common/element.js";
2import { signal } from "~/common/signal.js";
3import { listen } from "~/common/worker.js";
4
5/**
6 * @import {ProxiedActions} from "~/common/worker.d.ts";
7 * @import {Actions, Item, State} from "./types.d.ts"
8 */
9
10////////////////////////////////////////////
11// ELEMENT
12////////////////////////////////////////////
13
14/**
15 * @implements {ProxiedActions<Actions>}
16 */
17class QueueEngine extends DiffuseElement {
18 static NAME = "diffuse/engine/queue";
19 static WORKER_URL = "components/engine/queue/worker.js";
20
21 constructor() {
22 super();
23
24 /** @type {ProxiedActions<Actions & State>} */
25 this.proxy = this.workerProxy();
26
27 this.add = this.proxy.add;
28 this.clear = this.proxy.clear;
29 this.fill = this.proxy.fill;
30 this.move = this.proxy.move;
31 this.shift = this.proxy.shift;
32 this.supply = this.proxy.supply;
33 this.unshift = this.proxy.unshift;
34 }
35
36 // SIGNALS
37
38 #future = signal(/** @type {Array<Item>} */ ([]));
39 #now = signal(/** @type {Item | null} */ (null));
40 #past = signal(/** @type {Array<Item>} */ ([]));
41 #supplyFingerprint = signal(/** @type {string | undefined} */ (undefined));
42
43 // STATE
44
45 future = this.#future.get;
46 now = this.#now.get;
47 past = this.#past.get;
48 supplyFingerprint = this.#supplyFingerprint.get;
49
50 // LIFECYCLE
51
52 /**
53 * @override
54 */
55 connectedCallback() {
56 super.connectedCallback();
57
58 // Sync data with worker
59 const link = this.workerLink();
60
61 // Listen for remote data changes
62 listen("future", this.#future.set, link);
63 listen("now", this.#now.set, link);
64 listen("past", this.#past.set, link);
65 listen("supplyFingerprint", this.#supplyFingerprint.set, link);
66
67 // Fetch current data state
68 this.proxy.future().then(this.#future.set);
69 this.proxy.now().then(this.#now.set);
70 this.proxy.past().then(this.#past.set);
71 this.proxy.supplyFingerprint().then(this.#supplyFingerprint.set);
72 }
73}
74
75export default QueueEngine;
76
77////////////////////////////////////////////
78// REGISTER
79////////////////////////////////////////////
80
81export const CLASS = QueueEngine;
82export const NAME = "de-queue";
83
84defineElement(NAME, QueueEngine);