@clockworkdog/cogs-client 2.11.1 → 3.0.0-alpha.0

package/dist/AudioPlayer.js

@@ -1,12 +1,10 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
 // eslint-disable-next-line @typescript-eslint/triple-slash-reference
 /// <reference path="./types/howler.d.ts" />
-const howler_core_min_js_1 = require("howler/dist/howler.core.min.js");
+import { Howl, Howler } from 'howler/dist/howler.core.min.js';
 const DEBUG = false;
 // Check an iOS-only property (See https://developer.mozilla.org/en-US/docs/Web/API/Navigator#non-standard_properties)
 const IS_IOS = typeof navigator.standalone !== 'undefined';
-class AudioPlayer {
+export default class AudioPlayer {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     constructor(cogsConnection) {
         this.cogsConnection = cogsConnection;
@@ -27,7 +25,7 @@ class AudioPlayer {
                     }
                     if (message.audioOutput !== undefined) {
                         const sinkId = cogsConnection.getAudioSinkId(message.audioOutput);
-                        this.setAudioSink(sinkId !== null && sinkId !== void 0 ? sinkId : '');
+                        this.setAudioSink(sinkId ?? '');
                     }
                     this.updateConfig(message.files);
                     break;
@@ -79,7 +77,7 @@ class AudioPlayer {
     }
     setGlobalVolume(volume) {
         this.globalVolume = volume;
-        howler_core_min_js_1.Howler.volume(volume);
+        Howler.volume(volume);
         this.notifyStateListeners();
     }
     playAudioClip(path, { playId, volume, fade, loop }) {
@@ -142,8 +140,7 @@ class AudioPlayer {
                 clipPlayer.player.once('stop', () => this.handleStoppedClip(path, playId, soundId), soundId);
                 // Looping clips fire the 'end' callback on every loop
                 clipPlayer.player.on('end', () => {
-                    var _a;
-                    if (!((_a = clipPlayer.activeClips[soundId]) === null || _a === void 0 ? void 0 : _a.loop)) {
+                    if (!clipPlayer.activeClips[soundId]?.loop) {
                         this.handleStoppedClip(path, playId, soundId);
                     }
                 }, soundId);
@@ -157,13 +154,12 @@ class AudioPlayer {
                 // Once clip starts, check if it should actually be paused or stopped
                 // If not, then update state to 'playing'
                 clipPlayer.player.once('play', () => {
-                    var _a;
-                    const clipState = (_a = clipPlayer.activeClips[soundId]) === null || _a === void 0 ? void 0 : _a.state;
-                    if ((clipState === null || clipState === void 0 ? void 0 : clipState.type) === 'pause_requested') {
+                    const clipState = clipPlayer.activeClips[soundId]?.state;
+                    if (clipState?.type === 'pause_requested') {
                         log('Clip started playing but should be paused', { path, soundId });
                         this.pauseAudioClip(path, { fade: clipState.fade }, soundId, true);
                     }
-                    else if ((clipState === null || clipState === void 0 ? void 0 : clipState.type) === 'stop_requested') {
+                    else if (clipState?.type === 'stop_requested') {
                         log('Clip started playing but should be stopped', { path, soundId });
                         this.stopAudioClip(path, { fade: clipState.fade }, soundId, true);
                     }
@@ -192,9 +188,8 @@ class AudioPlayer {
         this.notifyClipStateListeners(playId, path, 'playing');
     }
     pauseAudioClip(path, { fade }, onlySoundId, allowIfPauseRequested) {
-        var _a, _b;
         // No active clips to pause
-        if (Object.keys((_b = (_a = this.audioClipPlayers[path]) === null || _a === void 0 ? void 0 : _a.activeClips) !== null && _b !== void 0 ? _b : {}).length === 0) {
+        if (Object.keys(this.audioClipPlayers[path]?.activeClips ?? {}).length === 0) {
             return;
         }
         this.updateAudioClipPlayer(path, (clipPlayer) => {
@@ -235,10 +230,9 @@ class AudioPlayer {
         });
     }
     stopAudioClip(path, { fade }, onlySoundId, allowIfStopRequested) {
-        var _a, _b, _c;
-        log('Stop audio clip', { activeClips: (_a = this.audioClipPlayers[path]) === null || _a === void 0 ? void 0 : _a.activeClips });
+        log('Stop audio clip', { activeClips: this.audioClipPlayers[path]?.activeClips });
         // No active clips to stop
-        if (Object.keys((_c = (_b = this.audioClipPlayers[path]) === null || _b === void 0 ? void 0 : _b.activeClips) !== null && _c !== void 0 ? _c : {}).length === 0) {
+        if (Object.keys(this.audioClipPlayers[path]?.activeClips ?? {}).length === 0) {
             return;
         }
         this.updateAudioClipPlayer(path, (clipPlayer) => {
@@ -290,13 +284,12 @@ class AudioPlayer {
         });
     }
     setAudioClipVolume(path, { volume, fade }) {
-        var _a, _b;
         if (!(volume >= 0 && volume <= 1)) {
             console.warn('Invalid volume', volume);
             return;
         }
         // No active clips to set volume for
-        if (Object.keys((_b = (_a = this.audioClipPlayers[path]) === null || _a === void 0 ? void 0 : _a.activeClips) !== null && _b !== void 0 ? _b : {}).length === 0) {
+        if (Object.keys(this.audioClipPlayers[path]?.activeClips ?? {}).length === 0) {
             return;
         }
         this.updateAudioClipPlayer(path, (clipPlayer) => {
@@ -332,13 +325,12 @@ class AudioPlayer {
             : clipPlayer);
     }
     updateAudioClipPlayer(path, update) {
-        var _a;
         if (path in this.audioClipPlayers) {
             this.audioClipPlayers = { ...this.audioClipPlayers, [path]: update(this.audioClipPlayers[path]) };
         }
         // Once last instance of an ephemeral clip is removed, cleanup and remove the player
         const clipPlayer = this.audioClipPlayers[path];
-        if (clipPlayer && Object.keys((_a = clipPlayer.activeClips) !== null && _a !== void 0 ? _a : {}).length === 0 && clipPlayer.config.ephemeral) {
+        if (clipPlayer && Object.keys(clipPlayer.activeClips ?? {}).length === 0 && clipPlayer.config.ephemeral) {
             clipPlayer.player.unload();
             delete this.audioClipPlayers[path];
         }
@@ -409,7 +401,7 @@ class AudioPlayer {
         this.eventTarget.dispatchEvent(new CustomEvent(type, { detail }));
     }
     createPlayer(path, config) {
-        const player = new howler_core_min_js_1.Howl({
+        const player = new Howl({
             src: this.cogsConnection.getAssetUrl(path),
             autoplay: false,
             loop: false,
@@ -436,7 +428,6 @@ class AudioPlayer {
         return clip;
     }
 }
-exports.default = AudioPlayer;
 function log(...data) {
     if (DEBUG) {
         console.log(...data);
@@ -449,14 +440,12 @@ function isFadeValid(fade) {
     return !IS_IOS && typeof fade === 'number' && !isNaN(fade) && fade > 0;
 }
 function setPlayerSinkId(player, sinkId) {
-    var _a;
     if (sinkId === undefined) {
         return;
     }
     if (player._html5) {
-        (_a = player._sounds) === null || _a === void 0 ? void 0 : _a.forEach((sound) => {
-            var _a, _b;
-            (_b = (_a = sound._node) === null || _a === void 0 ? void 0 : _a.setSinkId) === null || _b === void 0 ? void 0 : _b.call(_a, sinkId);
+        player._sounds?.forEach((sound) => {
+            sound._node?.setSinkId?.(sinkId);
         });
     }
     else {

package/dist/CogsConnection.js

@@ -1,15 +1,9 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CogsShowPhaseChangedEvent = exports.CogsMediaConfigChangedEvent = exports.CogsIncomingEvent = exports.CogsStateChangedEvent = exports.CogsConfigChangedEvent = exports.CogsMessageEvent = exports.CogsConnectionCloseEvent = exports.CogsConnectionOpenEvent = void 0;
-const ShowPhase_1 = __importDefault(require("./types/ShowPhase"));
-const reconnecting_websocket_1 = __importDefault(require("reconnecting-websocket"));
-const urls_1 = require("./utils/urls");
-const DataStore_1 = __importDefault(require("./DataStore"));
-const timesync_1 = require("@clockworkdog/timesync");
-class CogsConnection {
+import ShowPhase from './types/ShowPhase';
+import ReconnectingWebSocket from 'reconnecting-websocket';
+import { COGS_SERVER_PORT, assetUrl } from './utils/urls';
+import DataStore from './DataStore';
+import { createTimeSyncClient } from '@clockworkdog/timesync';
+export default class CogsConnection {
     get config() {
         return { ...this.currentConfig };
     }
@@ -29,19 +23,17 @@ class CogsConnection {
      * Return asset URLs using the information about the client and server support for HTTP/2
      */
     getAssetUrl(path) {
-        var _a, _b;
-        return `${(0, urls_1.assetUrl)(path)}?${(_b = (_a = this.urlParams) === null || _a === void 0 ? void 0 : _a.toString()) !== null && _b !== void 0 ? _b : ''}`;
+        return `${assetUrl(path)}?${this.urlParams?.toString() ?? ''}`;
     }
     get selectedAudioOutput() {
         return this._selectedAudioOutput;
     }
-    constructor(manifest, { hostname = document.location.hostname, port = urls_1.COGS_SERVER_PORT } = {}, initialClientState, initialDataStoreData) {
-        var _a;
+    constructor(manifest, { hostname = document.location.hostname, port = COGS_SERVER_PORT } = {}, initialClientState, initialDataStoreData) {
         this.manifest = manifest;
         this.eventTarget = new EventTarget();
         this.currentConfig = {}; // Received on open connection
         this.currentState = {}; // Received on open connection - TODO: set initial state from manifest?
-        this._showPhase = ShowPhase_1.default.Setup;
+        this._showPhase = ShowPhase.Setup;
         this._timerState = null;
         this._mediaConfig = null;
         /**
@@ -50,7 +42,7 @@ class CogsConnection {
         this.audioOutputs = undefined;
         this._selectedAudioOutput = '';
         this.currentState = { ...initialClientState };
-        this.store = new DataStore_1.default(initialDataStoreData !== null && initialDataStoreData !== void 0 ? initialDataStoreData : {});
+        this.store = new DataStore(initialDataStoreData ?? {});
         const { useReconnectingWebsocket, path, pathParams } = websocketParametersFromUrl(document.location.href);
         // Store the URL parameters for use in asset URLs
         // and add screen dimensions which COGS can use to determine the best asset quality to serve
@@ -62,25 +54,26 @@ class CogsConnection {
         this.urlParams.set('screenHeight', window.screen.height.toString());
         this.urlParams.set('screenPixelRatio', window.devicePixelRatio.toString());
         const socketUrl = `ws://${hostname}:${port}${path}?${this.urlParams}`;
-        this.websocket = useReconnectingWebsocket ? new reconnecting_websocket_1.default(socketUrl) : new WebSocket(socketUrl);
+        this.websocket = useReconnectingWebsocket ? new ReconnectingWebSocket(socketUrl) : new WebSocket(socketUrl);
+        let timeSyncClient;
         this.websocket.onopen = () => {
             this.currentConfig = {}; // Received on open connection
             this.currentState = {}; // Received on open connection
             this.dispatchEvent(new CogsConnectionOpenEvent());
             this.setState(this.currentState); // TODO: Remove this because you should set it manually...??
+            timeSyncClient = createTimeSyncClient({
+                interval: 60000,
+                send: (data) => {
+                    this.websocket.send(JSON.stringify(data));
+                },
+            });
         };
-        const timeSyncClient = (0, timesync_1.createTimeSyncClient)({
-            interval: 60000,
-            send: (data) => {
-                this.websocket.send(JSON.stringify(data));
-            },
-        });
         this.websocket.addEventListener('message', ({ data }) => {
             try {
                 const response = JSON.parse(data);
                 if (typeof response === 'object' && response !== null && 'timesync' in response) {
                     const parsed = response;
-                    timeSyncClient.receive(parsed);
+                    timeSyncClient?.receive(parsed);
                 }
             }
             catch (e) {
@@ -88,7 +81,7 @@ class CogsConnection {
             }
         });
         this.websocket.onclose = () => {
-            timeSyncClient.destroy();
+            timeSyncClient?.destroy();
             this.dispatchEvent(new CogsConnectionCloseEvent());
         };
         this.websocket.addEventListener('message', ({ data }) => {
@@ -163,7 +156,7 @@ class CogsConnection {
                 }
             };
             this.eventTarget.addEventListener('open', refreshAudioOutputs);
-            (_a = navigator.mediaDevices) === null || _a === void 0 ? void 0 : _a.addEventListener('devicechange', refreshAudioOutputs);
+            navigator.mediaDevices?.addEventListener('devicechange', refreshAudioOutputs);
             refreshAudioOutputs();
         }
     }
@@ -190,8 +183,7 @@ class CogsConnection {
         }
     }
     getAudioSinkId(audioOutput) {
-        var _a, _b;
-        return audioOutput ? (_b = (_a = this.audioOutputs) === null || _a === void 0 ? void 0 : _a.find(({ label }) => label === audioOutput)) === null || _b === void 0 ? void 0 : _b.deviceId : '';
+        return audioOutput ? this.audioOutputs?.find(({ label }) => label === audioOutput)?.deviceId : '';
     }
     sendInitialMediaClipStates(allMediaClipStates) {
         if (this.isConnected) {
@@ -234,17 +226,15 @@ class CogsConnection {
         this.eventTarget.dispatchEvent(event);
     }
 }
-exports.default = CogsConnection;
 function websocketParametersFromUrl(url) {
-    var _a, _b, _c, _d, _e;
     const parsedUrl = new URL(url);
     const pathParams = new URLSearchParams(parsedUrl.searchParams);
     const localClientId = pathParams.get('local_id');
     const isSimulator = pathParams.get('simulator') === 'true';
-    const display = (_a = pathParams.get('display')) !== null && _a !== void 0 ? _a : '';
+    const display = pathParams.get('display') ?? '';
     const pluginId = parsedUrl.pathname.startsWith('/plugin/') ? decodeURIComponent(parsedUrl.pathname.split('/')[2]) : undefined;
     if (localClientId) {
-        const type = (_b = pathParams.get('t')) !== null && _b !== void 0 ? _b : '';
+        const type = pathParams.get('t') ?? '';
         pathParams.delete('local_id');
         return {
             path: `/local/${encodeURIComponent(localClientId)}`,
@@ -253,7 +243,7 @@ function websocketParametersFromUrl(url) {
         };
     }
     else if (isSimulator) {
-        const name = (_c = pathParams.get('name')) !== null && _c !== void 0 ? _c : '';
+        const name = pathParams.get('name') ?? '';
         pathParams.delete('simulator');
         pathParams.delete('name');
         return {
@@ -263,7 +253,7 @@ function websocketParametersFromUrl(url) {
         };
     }
     else if (display) {
-        const displayIdIndex = (_d = pathParams.get('displayIdIndex')) !== null && _d !== void 0 ? _d : '';
+        const displayIdIndex = pathParams.get('displayIdIndex') ?? '';
         pathParams.delete('display');
         pathParams.delete('displayIdIndex');
         return {
@@ -277,7 +267,7 @@ function websocketParametersFromUrl(url) {
         };
     }
     else {
-        const serial = (_e = pathParams.get('serial')) !== null && _e !== void 0 ? _e : '';
+        const serial = pathParams.get('serial') ?? '';
         pathParams.delete('serial');
         return {
             path: `/client/${encodeURIComponent(serial)}`,
@@ -285,45 +275,40 @@ function websocketParametersFromUrl(url) {
         };
     }
 }
-class CogsConnectionOpenEvent extends Event {
+export class CogsConnectionOpenEvent extends Event {
     constructor() {
         super('open');
         this._cogsConnectionEventType = 'open';
     }
 }
-exports.CogsConnectionOpenEvent = CogsConnectionOpenEvent;
-class CogsConnectionCloseEvent extends Event {
+export class CogsConnectionCloseEvent extends Event {
     constructor() {
         super('close');
         this._cogsConnectionEventType = 'close';
     }
 }
-exports.CogsConnectionCloseEvent = CogsConnectionCloseEvent;
-class CogsMessageEvent extends Event {
+export class CogsMessageEvent extends Event {
     constructor(message) {
         super('message');
         this.message = message;
         this._cogsConnectionEventType = 'message';
     }
 }
-exports.CogsMessageEvent = CogsMessageEvent;
-class CogsConfigChangedEvent extends Event {
+export class CogsConfigChangedEvent extends Event {
     constructor(config) {
         super('config');
         this.config = config;
         this._cogsConnectionEventType = 'config';
     }
 }
-exports.CogsConfigChangedEvent = CogsConfigChangedEvent;
-class CogsStateChangedEvent extends Event {
+export class CogsStateChangedEvent extends Event {
     constructor(state) {
         super('state');
         this.state = state;
         this._cogsConnectionEventType = 'state';
     }
 }
-exports.CogsStateChangedEvent = CogsStateChangedEvent;
-class CogsIncomingEvent extends Event {
+export class CogsIncomingEvent extends Event {
     constructor(name, value) {
         super('event');
         this.name = name;
@@ -331,20 +316,17 @@ class CogsIncomingEvent extends Event {
         this._cogsConnectionEventType = 'event';
     }
 }
-exports.CogsIncomingEvent = CogsIncomingEvent;
-class CogsMediaConfigChangedEvent extends Event {
+export class CogsMediaConfigChangedEvent extends Event {
     constructor(mediaConfig) {
         super('mediaConfig');
         this.mediaConfig = mediaConfig;
         this._cogsConnectionEventType = 'mediaConfig';
     }
 }
-exports.CogsMediaConfigChangedEvent = CogsMediaConfigChangedEvent;
-class CogsShowPhaseChangedEvent extends Event {
+export class CogsShowPhaseChangedEvent extends Event {
     constructor(showPhase) {
         super('showPhase');
         this.showPhase = showPhase;
         this._cogsConnectionEventType = 'showPhase';
     }
 }
-exports.CogsShowPhaseChangedEvent = CogsShowPhaseChangedEvent;

package/dist/DataStore.js

@@ -1,12 +1,9 @@
-"use strict";
 var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
     if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
     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");
     return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
 };
 var _DataStore_eventTarget;
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DataStoreItemsEvent = exports.DataStoreItemEvent = void 0;
 /**
  * A simple key-value store for storing data in COGS
  *
@@ -50,8 +47,8 @@ class DataStore {
     }
 }
 _DataStore_eventTarget = new WeakMap();
-exports.default = DataStore;
-class DataStoreItemEvent extends Event {
+export default DataStore;
+export class DataStoreItemEvent extends Event {
     constructor(key, value) {
         super('item');
         this.key = key;
@@ -59,12 +56,10 @@ class DataStoreItemEvent extends Event {
         this._cogsConnectionEventType = 'item';
     }
 }
-exports.DataStoreItemEvent = DataStoreItemEvent;
-class DataStoreItemsEvent extends Event {
+export class DataStoreItemsEvent extends Event {
     constructor(items) {
         super('items');
         this.items = items;
         this._cogsConnectionEventType = 'item';
     }
 }
-exports.DataStoreItemsEvent = DataStoreItemsEvent;

package/dist/VideoPlayer.js

@@ -1,8 +1,6 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const VideoState_1 = require("./types/VideoState");
+import { ActiveVideoClipState } from './types/VideoState';
 const DEFAULT_PARENT_ELEMENT = document.body;
-class VideoPlayer {
+export default class VideoPlayer {
     constructor(
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     cogsConnection, parentElement = DEFAULT_PARENT_ELEMENT) {
@@ -23,7 +21,7 @@ class VideoPlayer {
                     this.setGlobalVolume(message.globalVolume);
                     if (message.audioOutput !== undefined) {
                         const sinkId = cogsConnection.getAudioSinkId(message.audioOutput);
-                        this.setAudioSink(sinkId !== null && sinkId !== void 0 ? sinkId : '');
+                        this.setAudioSink(sinkId ?? '');
                     }
                     this.updateConfig(message.files);
                     break;
@@ -82,7 +80,6 @@ class VideoPlayer {
         this.notifyStateListeners();
     }
     playVideoClip(path, { playId, volume, loop, fit }) {
-        var _a;
         if (!this.videoClipPlayers[path]) {
             this.videoClipPlayers[path] = this.createClipPlayer(path, { preload: 'none', ephemeral: true, fit });
         }
@@ -94,7 +91,7 @@ class VideoPlayer {
             });
         }
         // New pending clip is video being requested
-        if (((_a = this.activeClip) === null || _a === void 0 ? void 0 : _a.path) !== path) {
+        if (this.activeClip?.path !== path) {
             this.pendingClip = { path, playId, actionOncePlaying: 'play' };
         }
         // Setup and play the pending clip's player
@@ -123,8 +120,7 @@ class VideoPlayer {
         if (this.activeClip) {
             const { playId, path } = this.activeClip;
             this.updateVideoClipPlayer(path, (clipPlayer) => {
-                var _a;
-                (_a = clipPlayer.videoElement) === null || _a === void 0 ? void 0 : _a.pause();
+                clipPlayer.videoElement?.pause();
                 return clipPlayer;
             });
             this.notifyClipStateListeners(playId, path, 'paused');
@@ -141,9 +137,8 @@ class VideoPlayer {
         }
     }
     setVideoClipVolume({ volume }) {
-        var _a, _b;
         // If there is a pending clip, this is latest to have been played so update its volume
-        const clipToUpdate = (_b = (_a = this.pendingClip) !== null && _a !== void 0 ? _a : this.activeClip) !== null && _b !== void 0 ? _b : undefined;
+        const clipToUpdate = this.pendingClip ?? this.activeClip ?? undefined;
         if (!clipToUpdate) {
             return;
         }
@@ -160,9 +155,8 @@ class VideoPlayer {
         });
     }
     setVideoClipFit({ fit }) {
-        var _a, _b;
         // If there is a pending clip, this is latest to have been played so update its fit
-        const clipToUpdate = (_b = (_a = this.pendingClip) !== null && _a !== void 0 ? _a : this.activeClip) !== null && _b !== void 0 ? _b : undefined;
+        const clipToUpdate = this.pendingClip ?? this.activeClip ?? undefined;
         if (!clipToUpdate) {
             return;
         }
@@ -174,13 +168,12 @@ class VideoPlayer {
         });
     }
     handleStoppedClip(path) {
-        var _a;
         if (!this.activeClip || this.activeClip.path !== path) {
             return;
         }
         const playId = this.activeClip.playId;
         // Once an ephemeral clip stops, cleanup and remove the player
-        if ((_a = this.videoClipPlayers[this.activeClip.path]) === null || _a === void 0 ? void 0 : _a.config.ephemeral) {
+        if (this.videoClipPlayers[this.activeClip.path]?.config.ephemeral) {
             this.unloadClip(path);
         }
         this.activeClip = undefined;
@@ -217,8 +210,7 @@ class VideoPlayer {
             const clipPlayers = { ...previousClipPlayers };
             const removedClips = Object.keys(previousClipPlayers).filter((previousPath) => !(previousPath in newVideoPaths));
             removedClips.forEach((path) => {
-                var _a, _b;
-                if (((_a = this.activeClip) === null || _a === void 0 ? void 0 : _a.path) === path && ((_b = previousClipPlayers[path]) === null || _b === void 0 ? void 0 : _b.config.ephemeral) === false) {
+                if (this.activeClip?.path === path && previousClipPlayers[path]?.config.ephemeral === false) {
                     this.updateVideoClipPlayer(path, (player) => {
                         player.config = { ...player.config, ephemeral: true };
                         return player;
@@ -252,19 +244,18 @@ class VideoPlayer {
         this.notifyStateListeners();
     }
     notifyStateListeners() {
-        var _a, _b, _c, _d, _e, _f, _g;
         const VideoState = {
             globalVolume: this.globalVolume,
-            isPlaying: this.activeClip ? !((_a = this.videoClipPlayers[this.activeClip.path].videoElement) === null || _a === void 0 ? void 0 : _a.paused) : false,
+            isPlaying: this.activeClip ? !this.videoClipPlayers[this.activeClip.path].videoElement?.paused : false,
             clips: { ...this.videoClipPlayers },
             activeClip: this.activeClip
                 ? {
                     path: this.activeClip.path,
-                    state: !((_b = this.videoClipPlayers[this.activeClip.path].videoElement) === null || _b === void 0 ? void 0 : _b.paused) ? VideoState_1.ActiveVideoClipState.Playing : VideoState_1.ActiveVideoClipState.Paused,
-                    loop: (_d = (_c = this.videoClipPlayers[this.activeClip.path].videoElement) === null || _c === void 0 ? void 0 : _c.loop) !== null && _d !== void 0 ? _d : false,
-                    volume: ((_e = this.videoClipPlayers[this.activeClip.path].videoElement) === null || _e === void 0 ? void 0 : _e.muted)
+                    state: !this.videoClipPlayers[this.activeClip.path].videoElement?.paused ? ActiveVideoClipState.Playing : ActiveVideoClipState.Paused,
+                    loop: this.videoClipPlayers[this.activeClip.path].videoElement?.loop ?? false,
+                    volume: this.videoClipPlayers[this.activeClip.path].videoElement?.muted
                         ? 0
-                        : ((_g = (_f = this.videoClipPlayers[this.activeClip.path].videoElement) === null || _f === void 0 ? void 0 : _f.volume) !== null && _g !== void 0 ? _g : 0),
+                        : (this.videoClipPlayers[this.activeClip.path].videoElement?.volume ?? 0),
                 }
                 : undefined,
         };
@@ -292,9 +283,8 @@ class VideoPlayer {
         setVideoElementVolume(videoElement, volume * this.globalVolume);
         videoElement.preload = config.preload;
         videoElement.addEventListener('playing', () => {
-            var _a, _b;
             // If the clip is still the pending one when it actually start playing, then ensure it is in the correct state
-            if (((_a = this.pendingClip) === null || _a === void 0 ? void 0 : _a.path) === path) {
+            if (this.pendingClip?.path === path) {
                 switch (this.pendingClip.actionOncePlaying) {
                     case 'play': {
                         // Continue playing, show the video element, and notify listeners
@@ -323,7 +313,7 @@ class VideoPlayer {
                 this.activeClip = this.pendingClip;
                 this.pendingClip = undefined;
             }
-            else if (((_b = this.activeClip) === null || _b === void 0 ? void 0 : _b.path) === path) {
+            else if (this.activeClip?.path === path) {
                 // If we were the active clip then just notify listeners that we are now playing
                 this.notifyClipStateListeners(this.activeClip.playId, path, 'playing');
             }
@@ -361,17 +351,15 @@ class VideoPlayer {
         return player;
     }
     unloadClip(path) {
-        var _a, _b;
-        if (((_a = this.activeClip) === null || _a === void 0 ? void 0 : _a.path) === path) {
+        if (this.activeClip?.path === path) {
             const playId = this.activeClip.playId;
             this.activeClip = undefined;
             this.notifyClipStateListeners(playId, path, 'stopped');
         }
-        (_b = this.videoClipPlayers[path]) === null || _b === void 0 ? void 0 : _b.videoElement.remove();
+        this.videoClipPlayers[path]?.videoElement.remove();
         this.updateVideoClipPlayer(path, () => null);
     }
 }
-exports.default = VideoPlayer;
 function preloadString(preload) {
     return typeof preload === 'string' ? preload : preload ? 'auto' : 'none';
 }