@clockworkdog/cogs-client 2.5.0 → 2.8.0

package/README.md

@@ -1,8 +1,8 @@
-# COGS Client library
+# COGS SDK - Javascript
 
 Create content for your COGS Media Master
 
-## [Documentation](https://clockwork-dog.github.io/cogs-client-lib/)
+## [Documentation](https://clockwork-dog.github.io/cogs-sdk/javascript/)
 
 ## Add to your project
 
@@ -32,7 +32,7 @@ yarn add @clockworkdog/cogs-client
 
 ### Create a `cogs-plugin-manifest.js` file
 
-See [PluginManifestJson](https://clockwork-dog.github.io/cogs-client-lib/interfaces/PluginManifestJson.html) for details of what to include.
+See [CogsPluginManifestJson](https://clockwork-dog.github.io/cogs-sdk/javascript/interfaces/CogsPluginManifestJson.html) for details of what to include.
 
 If using Typescript set `"allowJs": true` in your `tsconfig.json`.
 
@@ -107,7 +107,7 @@ import { CogsConnection, CogsAudioPlayer } from '@clockworkdog/cogs-client';
 
 ### Connect to COGS
 
-Initialize a [CogsConnection](https://clockwork-dog.github.io/cogs-client-lib/interfaces/CogsConnection.html) with the manifest you created above.
+Initialize a [CogsConnection](https://clockwork-dog.github.io/cogs-sdk/javascript/classes/CogsConnection.html) with the manifest you created above.
 
 ```ts
 let connected = false;
@@ -152,14 +152,14 @@ You can save arbitrary data to COGS which will be restored when reconnecting wit
 ```ts
 const cogsConnection = new CogsConnection(manifest, {
   // Initial items in the store
-  'my-key': { foo: 0, bar: '' }
+  'my-key': { foo: 0, bar: '' },
 });
 
 // Update the store
 cogsConnection.store.setItems({ 'my-key': { foo: 1, bar: 'two' } });
 
 // Get item from data store
-cogsConnection.store.items.getItem('my-key')
+cogsConnection.store.items.getItem('my-key');
 
 // Listen for data changes
 cogsConnection.store.addEventListener('item', ({ key, value }) => {
@@ -182,7 +182,7 @@ Add `audio` to `cogs-plugin-manifest.js`:
 }
 ```
 
-Add [CogsAudioPlayer](https://clockwork-dog.github.io/cogs-client-lib/classes/CogsAudioPlayer.html) to your page:
+Add [CogsAudioPlayer](https://clockwork-dog.github.io/cogs-sdk/javascript/classes/CogsAudioPlayer.html) to your page:
 
 ```ts
 const audioPlayer = new CogsAudioPlayer(cogsConnection);

package/dist/AudioPlayer.js

@@ -5,6 +5,7 @@ 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 {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     constructor(cogsConnection) {
         this.cogsConnection = cogsConnection;
         this.eventTarget = new EventTarget();
@@ -467,6 +468,7 @@ function setPlayerSinkId(player, sinkId) {
  * This doesn't work on iOS (volume is read-only) so at least mute it if the volume is zero
  */
 function setAudioPlayerVolume(howl, volume, soundId) {
+    log('Setting volume', volume, soundId);
     howl.volume(volume, soundId);
     howl.mute(volume === 0, soundId);
 }

package/dist/CogsConnection.d.ts

@@ -1,5 +1,5 @@
 import ShowPhase from './types/ShowPhase';
-import CogsClientMessage from './types/CogsClientMessage';
+import CogsClientMessage, { MediaClientConfig } from './types/CogsClientMessage';
 import MediaClipStateMessage from './types/MediaClipStateMessage';
 import AllMediaClipStatesMessage from './types/AllMediaClipStatesMessage';
 import { CogsPluginManifest, PluginManifestEventJson } from './types/CogsPluginManifest';
@@ -20,6 +20,8 @@ export default class CogsConnection<Manifest extends CogsPluginManifest, DataT e
     get showPhase(): ShowPhase;
     private _timerState;
     get timerState(): TimerState | null;
+    private _mediaConfig;
+    get mediaConfig(): MediaClientConfig | null;
     /**
      * Return asset URLs using the information about the client and server support for HTTP/2
      */
@@ -103,8 +105,18 @@ export declare class CogsIncomingEvent<CogsEvent extends DeepReadonly<PluginMani
     readonly _cogsConnectionEventType = "event";
     constructor(name: CogsEvent['name'], value: ManifestTypes.TypeFromCogsValueType<CogsEvent['value']>);
 }
+export declare class CogsMediaConfigChangedEvent extends Event {
+    readonly mediaConfig: MediaClientConfig;
+    readonly _cogsConnectionEventType = "mediaConfig";
+    constructor(mediaConfig: MediaClientConfig);
+}
+export declare class CogsShowPhaseChangedEvent extends Event {
+    readonly showPhase: ShowPhase;
+    readonly _cogsConnectionEventType = "showPhase";
+    constructor(showPhase: ShowPhase);
+}
 /**
  * Allows CogsIncomingEvent of each supported value type
  */
 export type CogsIncomingEventTypes<CogsEvent extends DeepReadonly<PluginManifestEventJson> | PluginManifestEventJson> = CogsEvent extends unknown ? CogsIncomingEvent<CogsEvent> : never;
-export type CogsConnectionEvent<Manifest extends CogsPluginManifest> = CogsConnectionOpenEvent | CogsConnectionCloseEvent | CogsMessageEvent | CogsConfigChangedEvent<ManifestTypes.ConfigAsObject<Manifest>> | CogsStateChangedEvent<Partial<ManifestTypes.StateAsObject<Manifest>>> | CogsIncomingEventTypes<ManifestTypes.EventFromCogs<Manifest>>;
+export type CogsConnectionEvent<Manifest extends CogsPluginManifest> = CogsConnectionOpenEvent | CogsConnectionCloseEvent | CogsMessageEvent | CogsConfigChangedEvent<ManifestTypes.ConfigAsObject<Manifest>> | CogsStateChangedEvent<Partial<ManifestTypes.StateAsObject<Manifest>>> | CogsIncomingEventTypes<ManifestTypes.EventFromCogs<Manifest>> | CogsMediaConfigChangedEvent | CogsShowPhaseChangedEvent;

package/dist/CogsConnection.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.CogsIncomingEvent = exports.CogsStateChangedEvent = exports.CogsConfigChangedEvent = exports.CogsMessageEvent = exports.CogsConnectionCloseEvent = exports.CogsConnectionOpenEvent = void 0;
+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("./helpers/urls");
@@ -21,6 +21,9 @@ class CogsConnection {
     get timerState() {
         return this._timerState ? { ...this._timerState } : null;
     }
+    get mediaConfig() {
+        return this._mediaConfig ? { ...this._mediaConfig } : null;
+    }
     /**
      * Return asset URLs using the information about the client and server support for HTTP/2
      */
@@ -39,6 +42,7 @@ class CogsConnection {
         this.currentState = {}; // Received on open connection - TODO: set initial state from manifest?
         this._showPhase = ShowPhase_1.default.Setup;
         this._timerState = null;
+        this._mediaConfig = null;
         /**
          * Cached audio outputs use to look up the device/sink ID when a different device label is requested
          */
@@ -94,8 +98,10 @@ class CogsConnection {
                                 break;
                             case 'show_phase':
                                 this._showPhase = message.phase;
+                                this.dispatchEvent(new CogsShowPhaseChangedEvent(message.phase));
                                 break;
                             case 'media_config_update':
+                                this._mediaConfig = message;
                                 for (const optionName of ['preferOptimizedAudio', 'preferOptimizedVideo', 'preferOptimizedImages']) {
                                     const optionEnabled = message[optionName];
                                     if (optionEnabled) {
@@ -105,6 +111,7 @@ class CogsConnection {
                                         this.urlParams.delete(optionName);
                                     }
                                 }
+                                this.dispatchEvent(new CogsMediaConfigChangedEvent(message));
                                 break;
                             case 'data_store_items':
                                 this.store.handleDataStoreItemsMessage(message);
@@ -305,3 +312,19 @@ class CogsIncomingEvent extends Event {
     }
 }
 exports.CogsIncomingEvent = CogsIncomingEvent;
+class CogsMediaConfigChangedEvent extends Event {
+    constructor(mediaConfig) {
+        super('mediaConfig');
+        this.mediaConfig = mediaConfig;
+        this._cogsConnectionEventType = 'mediaConfig';
+    }
+}
+exports.CogsMediaConfigChangedEvent = CogsMediaConfigChangedEvent;
+class CogsShowPhaseChangedEvent extends Event {
+    constructor(showPhase) {
+        super('showPhase');
+        this.showPhase = showPhase;
+        this._cogsConnectionEventType = 'showPhase';
+    }
+}
+exports.CogsShowPhaseChangedEvent = CogsShowPhaseChangedEvent;

package/dist/VideoPlayer.d.ts

@@ -1,7 +1,7 @@
+import { MediaObjectFit } from '.';
 import CogsConnection from './CogsConnection';
-import { VideoState } from './types/VideoState';
 import MediaClipStateMessage from './types/MediaClipStateMessage';
-import { MediaObjectFit } from '.';
+import { VideoState } from './types/VideoState';
 type EventTypes = {
     state: VideoState;
     videoClipState: MediaClipStateMessage;

package/dist/VideoPlayer.js

@@ -3,7 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const VideoState_1 = require("./types/VideoState");
 const DEFAULT_PARENT_ELEMENT = document.body;
 class VideoPlayer {
-    constructor(cogsConnection, parentElement = DEFAULT_PARENT_ELEMENT) {
+    constructor(
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    cogsConnection, parentElement = DEFAULT_PARENT_ELEMENT) {
         this.cogsConnection = cogsConnection;
         this.eventTarget = new EventTarget();
         this.globalVolume = 1;
@@ -262,7 +264,7 @@ class VideoPlayer {
                     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)
                         ? 0
-                        : (_g = (_f = this.videoClipPlayers[this.activeClip.path].videoElement) === null || _f === void 0 ? void 0 : _f.volume) !== null && _g !== void 0 ? _g : 0,
+                        : ((_g = (_f = this.videoClipPlayers[this.activeClip.path].videoElement) === null || _f === void 0 ? void 0 : _f.volume) !== null && _g !== void 0 ? _g : 0),
                 }
                 : undefined,
         };