@clockworkdog/cogs-client 3.0.0-alpha.4 → 3.0.0-alpha.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -5,13 +5,14 @@ const DEBUG = false;
5
5
  // Check an iOS-only property (See https://developer.mozilla.org/en-US/docs/Web/API/Navigator#non-standard_properties)
6
6
  const IS_IOS = typeof navigator !== 'undefined' && typeof navigator.standalone !== 'undefined';
7
7
  export default class AudioPlayer {
8
+ cogsConnection;
9
+ eventTarget = new EventTarget();
10
+ globalVolume = 1;
11
+ audioClipPlayers = {};
12
+ sinkId = '';
8
13
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
9
14
  constructor(cogsConnection) {
10
15
  this.cogsConnection = cogsConnection;
11
- this.eventTarget = new EventTarget();
12
- this.globalVolume = 1;
13
- this.audioClipPlayers = {};
14
- this.sinkId = '';
15
16
  // Send the current status of each clip to COGS
16
17
  this.addEventListener('audioClipState', ({ detail }) => {
17
18
  cogsConnection.sendMediaClipState(detail);
@@ -4,18 +4,26 @@ import { COGS_SERVER_PORT, assetUrl } from './utils/urls';
4
4
  import DataStore from './DataStore';
5
5
  import { createTimeSyncClient } from '@clockworkdog/timesync';
6
6
  export default class CogsConnection {
7
+ manifest;
8
+ websocket;
9
+ eventTarget = new EventTarget();
10
+ currentConfig = {}; // Received on open connection
7
11
  get config() {
8
12
  return { ...this.currentConfig };
9
13
  }
14
+ currentState = {}; // Received on open connection - TODO: set initial state from manifest?
10
15
  get state() {
11
16
  return { ...this.currentState };
12
17
  }
18
+ _showPhase = ShowPhase.Setup;
13
19
  get showPhase() {
14
20
  return this._showPhase;
15
21
  }
22
+ _timerState = null;
16
23
  get timerState() {
17
24
  return this._timerState ? { ...this._timerState } : null;
18
25
  }
26
+ _mediaConfig = null;
19
27
  get mediaConfig() {
20
28
  return this._mediaConfig ? { ...this._mediaConfig } : null;
21
29
  }
@@ -25,22 +33,24 @@ export default class CogsConnection {
25
33
  getAssetUrl(path) {
26
34
  return `${assetUrl(path)}?${this.urlParams?.toString() ?? ''}`;
27
35
  }
36
+ /**
37
+ * Cached audio outputs use to look up the device/sink ID when a different device label is requested
38
+ */
39
+ audioOutputs = undefined;
40
+ _selectedAudioOutput = '';
28
41
  get selectedAudioOutput() {
29
42
  return this._selectedAudioOutput;
30
43
  }
44
+ /**
45
+ * Stores data in COGS
46
+ */
47
+ store;
48
+ /**
49
+ * URL parameters use for the websocket connection and asset URLs
50
+ */
51
+ urlParams;
31
52
  constructor(manifest, { hostname = document.location.hostname, port = COGS_SERVER_PORT } = {}, initialClientState, initialDataStoreData) {
32
53
  this.manifest = manifest;
33
- this.eventTarget = new EventTarget();
34
- this.currentConfig = {}; // Received on open connection
35
- this.currentState = {}; // Received on open connection - TODO: set initial state from manifest?
36
- this._showPhase = ShowPhase.Setup;
37
- this._timerState = null;
38
- this._mediaConfig = null;
39
- /**
40
- * Cached audio outputs use to look up the device/sink ID when a different device label is requested
41
- */
42
- this.audioOutputs = undefined;
43
- this._selectedAudioOutput = '';
44
54
  this.currentState = { ...initialClientState };
45
55
  this.store = new DataStore(initialDataStoreData ?? {});
46
56
  const { useReconnectingWebsocket, path, pathParams } = websocketParametersFromUrl(document.location.href);
@@ -62,7 +72,7 @@ export default class CogsConnection {
62
72
  this.dispatchEvent(new CogsConnectionOpenEvent());
63
73
  this.setState(this.currentState); // TODO: Remove this because you should set it manually...??
64
74
  timeSyncClient = createTimeSyncClient({
65
- interval: 60000,
75
+ interval: 60_000,
66
76
  send: (data) => {
67
77
  this.websocket.send(JSON.stringify(data));
68
78
  },
@@ -276,57 +286,64 @@ function websocketParametersFromUrl(url) {
276
286
  }
277
287
  }
278
288
  export class CogsConnectionOpenEvent extends Event {
289
+ _cogsConnectionEventType = 'open';
279
290
  constructor() {
280
291
  super('open');
281
- this._cogsConnectionEventType = 'open';
282
292
  }
283
293
  }
284
294
  export class CogsConnectionCloseEvent extends Event {
295
+ _cogsConnectionEventType = 'close';
285
296
  constructor() {
286
297
  super('close');
287
- this._cogsConnectionEventType = 'close';
288
298
  }
289
299
  }
290
300
  export class CogsMessageEvent extends Event {
301
+ message;
302
+ _cogsConnectionEventType = 'message';
291
303
  constructor(message) {
292
304
  super('message');
293
305
  this.message = message;
294
- this._cogsConnectionEventType = 'message';
295
306
  }
296
307
  }
297
308
  export class CogsConfigChangedEvent extends Event {
309
+ config;
310
+ _cogsConnectionEventType = 'config';
298
311
  constructor(config) {
299
312
  super('config');
300
313
  this.config = config;
301
- this._cogsConnectionEventType = 'config';
302
314
  }
303
315
  }
304
316
  export class CogsStateChangedEvent extends Event {
317
+ state;
318
+ _cogsConnectionEventType = 'state';
305
319
  constructor(state) {
306
320
  super('state');
307
321
  this.state = state;
308
- this._cogsConnectionEventType = 'state';
309
322
  }
310
323
  }
311
324
  export class CogsIncomingEvent extends Event {
325
+ name;
326
+ value;
327
+ _cogsConnectionEventType = 'event';
312
328
  constructor(name, value) {
313
329
  super('event');
314
330
  this.name = name;
315
331
  this.value = value;
316
- this._cogsConnectionEventType = 'event';
317
332
  }
318
333
  }
319
334
  export class CogsMediaConfigChangedEvent extends Event {
335
+ mediaConfig;
336
+ _cogsConnectionEventType = 'mediaConfig';
320
337
  constructor(mediaConfig) {
321
338
  super('mediaConfig');
322
339
  this.mediaConfig = mediaConfig;
323
- this._cogsConnectionEventType = 'mediaConfig';
324
340
  }
325
341
  }
326
342
  export class CogsShowPhaseChangedEvent extends Event {
343
+ showPhase;
344
+ _cogsConnectionEventType = 'showPhase';
327
345
  constructor(showPhase) {
328
346
  super('showPhase');
329
347
  this.showPhase = showPhase;
330
- this._cogsConnectionEventType = 'showPhase';
331
348
  }
332
349
  }
package/dist/DataStore.js CHANGED
@@ -1,17 +1,12 @@
1
- var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
2
- if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
3
- if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
4
- return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
5
- };
6
- var _DataStore_eventTarget;
7
1
  /**
8
2
  * A simple key-value store for storing data in COGS
9
3
  *
10
4
  * When reconnected the data will be restored.
11
5
  */
12
- class DataStore {
6
+ export default class DataStore {
7
+ _items;
8
+ #eventTarget = new EventTarget();
13
9
  constructor(defaultItems) {
14
- _DataStore_eventTarget.set(this, new EventTarget());
15
10
  this._items = { ...defaultItems };
16
11
  }
17
12
  handleDataStoreItemsMessage(message) {
@@ -37,29 +32,30 @@ class DataStore {
37
32
  }
38
33
  // Type-safe listeners
39
34
  addEventListener(type, listener, options) {
40
- __classPrivateFieldGet(this, _DataStore_eventTarget, "f").addEventListener(type, listener, options);
35
+ this.#eventTarget.addEventListener(type, listener, options);
41
36
  }
42
37
  removeEventListener(type, listener, options) {
43
- __classPrivateFieldGet(this, _DataStore_eventTarget, "f").removeEventListener(type, listener, options);
38
+ this.#eventTarget.removeEventListener(type, listener, options);
44
39
  }
45
40
  dispatchEvent(event) {
46
- __classPrivateFieldGet(this, _DataStore_eventTarget, "f").dispatchEvent(event);
41
+ this.#eventTarget.dispatchEvent(event);
47
42
  }
48
43
  }
49
- _DataStore_eventTarget = new WeakMap();
50
- export default DataStore;
51
44
  export class DataStoreItemEvent extends Event {
45
+ key;
46
+ value;
47
+ _cogsConnectionEventType = 'item';
52
48
  constructor(key, value) {
53
49
  super('item');
54
50
  this.key = key;
55
51
  this.value = value;
56
- this._cogsConnectionEventType = 'item';
57
52
  }
58
53
  }
59
54
  export class DataStoreItemsEvent extends Event {
55
+ items;
56
+ _cogsConnectionEventType = 'item';
60
57
  constructor(items) {
61
58
  super('items');
62
59
  this.items = items;
63
- this._cogsConnectionEventType = 'item';
64
60
  }
65
61
  }
@@ -1,13 +1,17 @@
1
1
  import { ActiveVideoClipState } from './types/VideoState';
2
2
  export default class VideoPlayer {
3
+ cogsConnection;
4
+ eventTarget = new EventTarget();
5
+ globalVolume = 1;
6
+ videoClipPlayers = {};
7
+ activeClip;
8
+ pendingClip;
9
+ parentElement;
10
+ sinkId = '';
3
11
  constructor(
4
12
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
5
13
  cogsConnection, parentElement = document.body) {
6
14
  this.cogsConnection = cogsConnection;
7
- this.eventTarget = new EventTarget();
8
- this.globalVolume = 1;
9
- this.videoClipPlayers = {};
10
- this.sinkId = '';
11
15
  this.parentElement = parentElement;
12
16
  // Send the current status of each clip to COGS
13
17
  this.addEventListener('videoClipState', ({ detail }) => {