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