@clockworkdog/cogs-client 0.3.1

package/README.md

@@ -0,0 +1,100 @@
+# COGS Client library
+
+Create content for your COGS Media Master
+
+## [Documentation](https://clockwork-dog.github.io/cogs-client-lib/)
+
+## Add to your project
+
+### Browser
+
+```html
+<script src="https://unpkg.com/@clockworkdog/cogs-client@1"></script>
+```
+
+### NPM
+
+```shell
+npm install --save @clockworkdog/cogs-client
+```
+
+### Yarn
+
+```shell
+yarn add @clockworkdog/cogs-client
+```
+
+## Usage
+
+### Import the library
+
+#### Browser
+
+```js
+const { CogsConnection, CogsAudioPlayer } = COGS;
+```
+
+#### Javascript
+
+```js
+const { CogsConnection, CogsAudioPlayer } = require('@clockworkdog/cogs-client');
+```
+
+#### Typesript / ES6
+
+```ts
+import { CogsConnection, CogsAudioPlayer } from '@clockworkdog/cogs-client';
+```
+
+### Connect to COGS
+
+```ts
+let connected = false;
+
+const cogsConnection = new CogsConnection();
+cogsConnection.addEventListener('open', () => {
+  connected = true;
+});
+cogsConnection.addEventListener('close', () => {
+  connected = false;
+});
+cogsConnection.addEventListener('config', (event) => {
+  const config = event.detail;
+  // Handle new config.
+  // `config` is of type `{ [configKey: string]: number | string | boolean }`
+});
+cogsConnection.addEventListener('updates', (event) => {
+  const updates = event.detail;
+  // Handle input port updates.
+  // `updates` is of type `{ [portName: string]: number | string | boolean }`
+});
+cogsConnection.addEventListener('event', (event) => {
+  const { key, value } = event.detail;
+  // Handle event. See 'types/Callback.ts`
+  // `key` is the event name.
+  // `value` is the type defined in COGS, one of `number | string | boolean | undefined`
+});
+cogsConnection.addEventListener('message', (event) => {
+  const message = event.detail;
+  // Handle message. See `types/CogsClientMessage.ts`
+});
+
+function sendEventToCogs() {
+  cogsConnection.sendEvent('Hello');
+}
+
+function sendPortUpdateToCogs() {
+  cogsConnection.setOutputPortValues({ port1: 100 });
+}
+
+const audioPlayer = new CogsAudioPlayer(cogsConnection);
+audioPlayer.addEventListener('state', (audioState) => {
+  // Handle audio state. See `types/AudioState.ts`
+});
+```
+
+### Local development
+
+When developing locally you should connect to COGS in "simulator" mode by appending `?simulator=true&t=media_master&name=MEDIA_MASTER_NAME` to the URL. Replace `MEDIA_MASTER_NAME` with the name of the Media Master you set in COGS.
+
+For example, with your custom content hosted on port 3000, http://localhost:3000?simulator=true&t=media_master&name=Timer+screen will connect as the simulator for `Timer screen`.

package/dist/AudioPlayer.d.ts

@@ -0,0 +1,48 @@
+import CogsConnection from './CogsConnection';
+import { AudioState } from './types/AudioState';
+import MediaClipStateMessage from './types/MediaClipStateMessage';
+declare type EventTypes = {
+    state: AudioState;
+    audioClipState: MediaClipStateMessage;
+};
+export default class AudioPlayer {
+    private eventTarget;
+    private globalVolume;
+    private audioClipPlayers;
+    private sinkId;
+    constructor(cogsConnection: CogsConnection);
+    setGlobalVolume(volume: number): void;
+    playAudioClip(path: string, { playId, volume, fade, loop }: {
+        playId: string;
+        volume: number;
+        fade?: number;
+        loop: boolean;
+    }): void;
+    pauseAudioClip(path: string, { fade }: {
+        fade?: number;
+    }, onlySoundId?: number, allowIfPauseRequested?: boolean): void;
+    stopAudioClip(path: string, { fade }: {
+        fade?: number;
+    }, onlySoundId?: number, allowIfStopRequested?: boolean): void;
+    stopAllAudioClips(options: {
+        fade?: number;
+    }): void;
+    setAudioClipVolume(path: string, { volume, fade }: {
+        volume: number;
+        fade?: number;
+    }): void;
+    private handleStoppedClip;
+    private updateActiveAudioClip;
+    private updateAudioClipPlayer;
+    setAudioSink(sinkId: string): void;
+    private updateConfig;
+    private notifyStateListeners;
+    private notifyClipStateListeners;
+    addEventListener<EventName extends keyof EventTypes>(type: EventName, listener: (ev: CustomEvent<EventTypes[EventName]>) => void, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<EventName extends keyof EventTypes>(type: EventName, listener: (ev: CustomEvent<EventTypes[EventName]>) => void, options?: boolean | EventListenerOptions): void;
+    private dispatchEvent;
+    private createPlayer;
+    private createClip;
+    private updatedClip;
+}
+export {};

package/dist/AudioPlayer.js

@@ -0,0 +1,420 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const howler_1 = require("howler");
+const urls_1 = require("./helpers/urls");
+const DEBUG = true;
+class AudioPlayer {
+    constructor(cogsConnection) {
+        this.eventTarget = new EventTarget();
+        this.globalVolume = 1;
+        this.audioClipPlayers = {};
+        this.sinkId = '';
+        // Send the current status of each clip to COGS
+        this.addEventListener('audioClipState', ({ detail }) => {
+            cogsConnection.sendMediaClipState(detail);
+        });
+        // Listen for audio control messages
+        cogsConnection.addEventListener('message', (event) => {
+            const message = event.detail;
+            switch (message.type) {
+                case 'media_config_update':
+                    if (this.globalVolume !== message.globalVolume) {
+                        this.setGlobalVolume(message.globalVolume);
+                    }
+                    if (message.audioOutput !== undefined) {
+                        const sinkId = cogsConnection.getAudioSinkId(message.audioOutput);
+                        this.setAudioSink(sinkId !== null && sinkId !== void 0 ? sinkId : '');
+                    }
+                    this.updateConfig(message.files);
+                    break;
+                case 'audio_play':
+                    this.playAudioClip(message.file, {
+                        playId: message.playId,
+                        volume: message.volume,
+                        loop: Boolean(message.loop),
+                        fade: message.fade,
+                    });
+                    break;
+                case 'audio_pause':
+                    this.pauseAudioClip(message.file, { fade: message.fade });
+                    break;
+                case 'audio_stop':
+                    if (message.file) {
+                        this.stopAudioClip(message.file, { fade: message.fade });
+                    }
+                    else {
+                        this.stopAllAudioClips({ fade: message.fade });
+                    }
+                    break;
+                case 'audio_set_clip_volume':
+                    this.setAudioClipVolume(message.file, { volume: message.volume, fade: message.fade });
+                    break;
+            }
+        });
+        // On connection, send the current playing state of all clips
+        // (Usually empty unless websocket is reconnecting)
+        const sendInitialClipStates = () => {
+            const files = Object.entries(this.audioClipPlayers).map(([file, player]) => {
+                const activeClips = Object.values(player.activeClips);
+                const status = activeClips.some(({ state }) => state.type === 'playing' ||
+                    state.type === 'pausing' ||
+                    state.type === 'stopping' ||
+                    state.type === 'play_requested' ||
+                    state.type === 'pause_requested' ||
+                    state.type === 'stop_requested')
+                    ? 'playing'
+                    : activeClips.some(({ state }) => state.type === 'paused')
+                        ? 'paused'
+                        : 'stopped';
+                return [file, status];
+            });
+            cogsConnection.sendInitialMediaClipStates({ mediaType: 'audio', files });
+        };
+        cogsConnection.addEventListener('open', sendInitialClipStates);
+        sendInitialClipStates();
+    }
+    setGlobalVolume(volume) {
+        this.globalVolume = volume;
+        howler_1.Howler.volume(volume);
+        this.notifyStateListeners();
+    }
+    playAudioClip(path, { playId, volume, fade, loop }) {
+        log('Playing clip', { path });
+        if (!(path in this.audioClipPlayers)) {
+            log('Creating ephemeral clip', { path });
+            this.audioClipPlayers[path] = this.createClip(path, { preload: false, ephemeral: true });
+        }
+        this.updateAudioClipPlayer(path, (clipPlayer) => {
+            // Paused clips need to be played again
+            const pausedSoundIds = Object.entries(clipPlayer.activeClips)
+                .filter(([, { state }]) => state.type === 'paused' || state.type === 'pausing')
+                .map(([id]) => parseInt(id));
+            pausedSoundIds.forEach((soundId) => {
+                log('Resuming paused clip', { soundId });
+                clipPlayer.player.play(soundId);
+            });
+            // Clips with pause requested no longer need to pause, they can continue playing now
+            const pauseRequestedSoundIds = Object.entries(clipPlayer.activeClips)
+                .filter(([, { state }]) => state.type === 'pause_requested')
+                .map(([id]) => parseInt(id));
+            // If no currently paused/pausing/pause_requested clips, play a new clip
+            const newSoundIds = pausedSoundIds.length > 0 || pauseRequestedSoundIds.length > 0 ? [] : [clipPlayer.player.play()];
+            // paused and pause_requested clips treated the same, they should have their properties
+            // updated with the latest play action's properties
+            [...pausedSoundIds, ...pauseRequestedSoundIds, ...newSoundIds].forEach((soundId) => {
+                clipPlayer.player.loop(loop, soundId);
+                // Cleanup any old callbacks first
+                clipPlayer.player.off('play', undefined, soundId);
+                clipPlayer.player.off('pause', undefined, soundId);
+                clipPlayer.player.off('fade', undefined, soundId);
+                clipPlayer.player.off('end', undefined, soundId);
+                clipPlayer.player.off('stop', undefined, soundId);
+                // Non-preloaded clips don't yet have an HTML audio node
+                // so we need to set the audio output when it's playing
+                clipPlayer.player.once('play', () => {
+                    setPlayerSinkId(clipPlayer.player, this.sinkId);
+                });
+                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)) {
+                        this.handleStoppedClip(path, playId, soundId);
+                    }
+                }, soundId);
+                const activeClip = {
+                    playId,
+                    state: { type: 'play_requested' },
+                    loop,
+                    volume,
+                };
+                // Once clip starts, check if it should actually be paused or stopped
+                // If not, then update state to 'playing'
+                clipPlayer.player.once('play', () => {
+                    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.type === 'stop_requested') {
+                        log('Clip started playing but should be stopped', { path, soundId });
+                        this.stopAudioClip(path, { fade: clipState.fade }, soundId, true);
+                    }
+                    else {
+                        this.updateActiveAudioClip(path, soundId, (clip) => ({ ...clip, state: { type: 'playing' } }));
+                    }
+                }, soundId);
+                // To fade or to no fade?
+                if (isFadeValid(fade)) {
+                    // Start fade when clip starts
+                    clipPlayer.player.volume(0, soundId);
+                    clipPlayer.player.once('play', () => {
+                        clipPlayer.player.fade(0, volume, fade * 1000, soundId);
+                    }, soundId);
+                }
+                else {
+                    clipPlayer.player.volume(volume, soundId);
+                }
+                // Track new/updated active clip
+                clipPlayer.activeClips = { ...clipPlayer.activeClips, [soundId]: activeClip };
+            });
+            return clipPlayer;
+        });
+        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) {
+            return;
+        }
+        this.updateAudioClipPlayer(path, (clipPlayer) => {
+            clipPlayer.activeClips = Object.fromEntries(Object.entries(clipPlayer.activeClips).map(([soundIdStr, clip]) => {
+                const soundId = parseInt(soundIdStr);
+                // If onlySoundId specified, only update that clip
+                if (onlySoundId === undefined || onlySoundId === soundId) {
+                    if ((allowIfPauseRequested && clip.state.type === 'pause_requested') || clip.state.type === 'playing' || clip.state.type === 'pausing') {
+                        if (isFadeValid(fade)) {
+                            // Fade then pause
+                            clipPlayer.player.once('fade', (soundId) => {
+                                clipPlayer.player.pause(soundId);
+                                this.updateActiveAudioClip(path, soundId, (clip) => ({ ...clip, state: { type: 'paused' } }));
+                                this.notifyClipStateListeners(clip.playId, path, 'paused');
+                            }, soundId);
+                            clipPlayer.player.fade(clipPlayer.player.volume(soundId), 0, fade * 1000, soundId);
+                            clip.state = { type: 'pausing' };
+                        }
+                        else {
+                            // Pause now
+                            clipPlayer.player.pause(soundId);
+                            clip.state = { type: 'paused' };
+                            this.notifyClipStateListeners(clip.playId, path, 'paused');
+                        }
+                    }
+                    // Clip hasn't started playing yet, or has already had pause_requested (but fade may have changed so update here)
+                    else if (clip.state.type === 'play_requested' || clip.state.type === 'pause_requested') {
+                        clip.state = { type: 'pause_requested', fade };
+                    }
+                }
+                return [soundIdStr, clip];
+            }));
+            return clipPlayer;
+        });
+    }
+    stopAudioClip(path, { fade }, onlySoundId, allowIfStopRequested) {
+        var _a, _b;
+        // No active clips to stop
+        if (Object.keys((_b = (_a = this.audioClipPlayers[path]) === null || _a === void 0 ? void 0 : _a.activeClips) !== null && _b !== void 0 ? _b : {}).length === 0) {
+            return;
+        }
+        this.updateAudioClipPlayer(path, (clipPlayer) => {
+            clipPlayer.activeClips = Object.fromEntries(Object.entries(clipPlayer.activeClips).map(([soundIdStr, clip]) => {
+                const soundId = parseInt(soundIdStr);
+                // If onlySoundId specified, only update that clip
+                if (onlySoundId === undefined || onlySoundId === soundId) {
+                    if ((allowIfStopRequested && clip.state.type === 'stop_requested') ||
+                        clip.state.type === 'playing' ||
+                        clip.state.type === 'pausing' ||
+                        clip.state.type === 'paused' ||
+                        clip.state.type === 'stopping') {
+                        if (isFadeValid(fade) && clip.state.type !== 'paused') {
+                            // Cleanup any old fade callbacks first
+                            // TODO: Remove cast once https://github.com/DefinitelyTyped/DefinitelyTyped/pull/59411 is merged
+                            clipPlayer.player.off('fade', soundId);
+                            clipPlayer.player.fade(clipPlayer.player.volume(soundId), 0, fade * 1000, soundId);
+                            // Set callback after starting new fade, otherwise it will fire straight away as the previous fade is cancelled
+                            clipPlayer.player.once('fade', (soundId) => clipPlayer.player.stop(soundId), soundId);
+                            clip.state = { type: 'stopping' };
+                        }
+                        else {
+                            clipPlayer.player.stop(soundId);
+                        }
+                    }
+                    // Clip hasn't started playing yet, or has already had stop_requested (but fade may have changed so update here)
+                    // or has pause_requested, but stop takes precedence
+                    else if (clip.state.type === 'play_requested' || clip.state.type === 'pause_requested' || clip.state.type === 'stop_requested') {
+                        log("Trying to stop clip which hasn't started playing yet", { path, soundId });
+                        clip.state = { type: 'stop_requested', fade };
+                    }
+                }
+                return [soundIdStr, clip];
+            }));
+            return clipPlayer;
+        });
+    }
+    stopAllAudioClips(options) {
+        log('Stopping all clips');
+        Object.keys(this.audioClipPlayers).forEach((path) => {
+            this.stopAudioClip(path, options);
+        });
+    }
+    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) {
+            return;
+        }
+        this.updateAudioClipPlayer(path, (clipPlayer) => {
+            clipPlayer.activeClips = Object.fromEntries(Object.entries(clipPlayer.activeClips).map(([soundIdStr, clip]) => {
+                // Ignored for pausing/stopping instances
+                if (clip.state.type !== 'pausing' && clip.state.type !== 'stopping') {
+                    const soundId = parseInt(soundIdStr);
+                    if (isFadeValid(fade)) {
+                        clipPlayer.player.fade(clipPlayer.player.volume(soundId), volume, fade * 1000);
+                    }
+                    else {
+                        clipPlayer.player.volume(volume);
+                    }
+                    return [soundIdStr, { ...clip, volume }];
+                }
+                else {
+                    return [soundIdStr, clip];
+                }
+            }));
+            return clipPlayer;
+        });
+    }
+    handleStoppedClip(path, playId, soundId) {
+        this.updateAudioClipPlayer(path, (clipPlayer) => {
+            delete clipPlayer.activeClips[soundId];
+            return clipPlayer;
+        });
+        this.notifyClipStateListeners(playId, path, 'stopped');
+    }
+    updateActiveAudioClip(path, soundId, update) {
+        this.updateAudioClipPlayer(path, (clipPlayer) => soundId in clipPlayer.activeClips
+            ? { ...clipPlayer, activeClips: { ...clipPlayer.activeClips, [soundId]: update(clipPlayer.activeClips[soundId]) } }
+            : 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) {
+            clipPlayer.player.unload();
+            delete this.audioClipPlayers[path];
+        }
+        this.notifyStateListeners();
+    }
+    setAudioSink(sinkId) {
+        log(`Setting sink ID for all clips:`, sinkId);
+        for (const clipPlayer of Object.values(this.audioClipPlayers)) {
+            setPlayerSinkId(clipPlayer.player, sinkId);
+        }
+        this.sinkId = sinkId;
+    }
+    updateConfig(newFiles) {
+        const newAudioFiles = Object.fromEntries(Object.entries(newFiles).filter((file) => {
+            const type = file[1].type;
+            // COGS 4.6 did not send a `type` but only reported audio files
+            // so we assume audio if no `type` is given
+            return type === 'audio' || !type;
+        }));
+        const previousClipPlayers = this.audioClipPlayers;
+        this.audioClipPlayers = (() => {
+            const clipPlayers = { ...previousClipPlayers };
+            const removedClips = Object.keys(previousClipPlayers).filter((previousFile) => !(previousFile in newAudioFiles) && !previousClipPlayers[previousFile].config.ephemeral);
+            removedClips.forEach((file) => {
+                const player = previousClipPlayers[file].player;
+                player.unload();
+                delete clipPlayers[file];
+            });
+            const addedClips = Object.entries(newAudioFiles).filter(([newfile]) => !previousClipPlayers[newfile]);
+            addedClips.forEach(([path, config]) => {
+                clipPlayers[path] = this.createClip(path, { ...config, ephemeral: false });
+            });
+            const updatedClips = Object.keys(previousClipPlayers).filter((previousFile) => previousFile in newAudioFiles);
+            updatedClips.forEach((path) => {
+                clipPlayers[path] = this.updatedClip(path, clipPlayers[path], { ...newAudioFiles[path], ephemeral: false });
+            });
+            return clipPlayers;
+        })();
+        this.notifyStateListeners();
+    }
+    notifyStateListeners() {
+        const clips = Object.entries(this.audioClipPlayers).reduce((clips, [path, clipPlayer]) => {
+            clips[path] = {
+                config: { preload: clipPlayer.config.preload, ephemeral: clipPlayer.config.ephemeral },
+                activeClips: clipPlayer.activeClips,
+            };
+            return clips;
+        }, {});
+        const isPlaying = Object.values(this.audioClipPlayers).some(({ activeClips }) => Object.values(activeClips).some((clip) => clip.state.type === 'playing' || clip.state.type === 'pausing' || clip.state.type === 'stopping'));
+        const audioState = {
+            globalVolume: this.globalVolume,
+            isPlaying,
+            clips,
+        };
+        this.dispatchEvent('state', audioState);
+    }
+    notifyClipStateListeners(playId, file, status) {
+        this.dispatchEvent('audioClipState', { mediaType: 'audio', playId, file, status });
+    }
+    // Type-safe wrapper around EventTarget
+    addEventListener(type, listener, options) {
+        this.eventTarget.addEventListener(type, listener, options);
+    }
+    removeEventListener(type, listener, options) {
+        this.eventTarget.removeEventListener(type, listener, options);
+    }
+    dispatchEvent(type, detail) {
+        this.eventTarget.dispatchEvent(new CustomEvent(type, { detail }));
+    }
+    createPlayer(path, config) {
+        const player = new howler_1.Howl({
+            src: urls_1.assetUrl(path),
+            autoplay: false,
+            loop: false,
+            volume: 1,
+            html5: true,
+            preload: config.preload,
+        });
+        setPlayerSinkId(player, this.sinkId);
+        return player;
+    }
+    createClip(file, config) {
+        return {
+            config,
+            player: this.createPlayer(file, config),
+            activeClips: {},
+        };
+    }
+    updatedClip(clipPath, previousClip, newConfig) {
+        const clip = { ...previousClip, config: newConfig };
+        if (previousClip.config.preload !== newConfig.preload) {
+            clip.player.unload();
+            clip.player = this.createPlayer(clipPath, newConfig);
+        }
+        return clip;
+    }
+}
+exports.default = AudioPlayer;
+function log(...data) {
+    if (DEBUG) {
+        console.log(...data);
+    }
+}
+function isFadeValid(fade) {
+    return typeof fade === 'number' && !isNaN(fade) && fade > 0;
+}
+function setPlayerSinkId(player, sinkId) {
+    if (sinkId === undefined) {
+        return;
+    }
+    if (player._html5) {
+        player._sounds.forEach((sound) => {
+            sound._node.setSinkId(sinkId);
+        });
+    }
+    else {
+        // TODO: handle web audio
+        console.warn('Cannot set sink ID: web audio not supported', player);
+    }
+}

package/dist/CogsConnection.d.ts

@@ -0,0 +1,81 @@
+import { ConfigValue, EventKeyValue, EventValue, PortValue, ShowPhase } from './types/valueTypes';
+import CogsClientMessage from './types/CogsClientMessage';
+import MediaClipStateMessage from './types/MediaClipStateMessage';
+import AllMediaClipStatesMessage from './types/AllMediaClipStatesMessage';
+interface ConnectionEventListeners<CustomTypes extends {
+    config?: {
+        [configKey: string]: ConfigValue;
+    };
+    inputPorts?: {
+        [port: string]: PortValue;
+    };
+    inputEvents?: {
+        [key: string]: EventValue | null;
+    };
+}> {
+    open: undefined;
+    close: undefined;
+    message: CogsClientMessage;
+    config: CustomTypes['config'];
+    updates: Partial<CustomTypes['inputPorts']>;
+    event: CustomTypes['inputEvents'] extends {
+        [key: string]: EventValue | null;
+    } ? EventKeyValue<CustomTypes['inputEvents']> : Record<string, never>;
+}
+export declare type TimerState = Omit<Extract<CogsClientMessage, {
+    type: 'adjustable_timer_update';
+}>, 'type'> & {
+    startedAt: number;
+};
+export default class CogsConnection<CustomTypes extends {
+    config?: {
+        [configKey: string]: ConfigValue;
+    };
+    inputPorts?: {
+        [port: string]: PortValue;
+    };
+    outputPorts?: {
+        [port: string]: PortValue;
+    };
+    inputEvents?: {
+        [key: string]: EventValue | null;
+    };
+    outputEvents?: {
+        [key: string]: EventValue | null;
+    };
+} = Record<never, never>> {
+    private websocket;
+    private eventTarget;
+    private currentConfig;
+    get config(): CustomTypes['config'];
+    private currentInputPortValues;
+    get inputPortValues(): CustomTypes['inputPorts'];
+    private currentOutputPortValues;
+    get outputPortValues(): CustomTypes['outputPorts'];
+    private _showPhase;
+    get showPhase(): ShowPhase;
+    private _timerState;
+    get timerState(): TimerState | null;
+    /**
+     * Cached audio outputs use to look up the device/sink ID when a different device label is requested
+     */
+    private audioOutputs;
+    private _selectedAudioOutput;
+    get selectedAudioOutput(): string;
+    constructor({ hostname, port }?: {
+        hostname?: string;
+        port?: number;
+    }, outputPortValues?: CustomTypes['outputPorts']);
+    get isConnected(): boolean;
+    close(): void;
+    sendEvent<EventName extends keyof CustomTypes['outputEvents']>(eventName: EventName, ...[eventValue]: CustomTypes['outputEvents'][EventName] extends null ? [] : [CustomTypes['outputEvents'][EventName]]): void;
+    setOutputPortValues(values: Partial<CustomTypes['outputPorts']>): void;
+    getAudioSinkId(audioOutput: string): string | undefined;
+    sendInitialMediaClipStates(allMediaClipStates: AllMediaClipStatesMessage): void;
+    sendMediaClipState(mediaClipState: MediaClipStateMessage): void;
+    sendAudioOutputs(audioOutputs: MediaDeviceInfo[]): void;
+    addEventListener<EventName extends keyof ConnectionEventListeners<CustomTypes>, EventValue extends ConnectionEventListeners<CustomTypes>[EventName]>(type: EventName, listener: (ev: CustomEvent<EventValue>) => void, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<EventName extends keyof ConnectionEventListeners<CustomTypes>, EventValue extends ConnectionEventListeners<CustomTypes>[EventName]>(type: EventName, listener: (ev: CustomEvent<EventValue>) => void, options?: boolean | EventListenerOptions): void;
+    private dispatchEvent;
+}
+export {};