@clockworkdog/cogs-client 2.0.0 → 2.1.1

package/dist/AudioPlayer.d.ts

@@ -6,6 +6,7 @@ type EventTypes = {
     audioClipState: MediaClipStateMessage;
 };
 export default class AudioPlayer {
+    private cogsConnection;
     private eventTarget;
     private globalVolume;
     private audioClipPlayers;

package/dist/AudioPlayer.js

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const howler_1 = require("howler");
-const urls_1 = require("./helpers/urls");
 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 {
     constructor(cogsConnection) {
+        this.cogsConnection = cogsConnection;
         this.eventTarget = new EventTarget();
         this.globalVolume = 1;
         this.audioClipPlayers = {};
@@ -407,7 +407,7 @@ class AudioPlayer {
     }
     createPlayer(path, config) {
         const player = new howler_1.Howl({
-            src: (0, urls_1.assetUrl)(path),
+            src: this.cogsConnection.getAssetUrl(path),
             autoplay: false,
             loop: false,
             volume: 1,

package/dist/CogsConnection.d.ts

@@ -17,6 +17,18 @@ export default class CogsConnection<Manifest extends CogsPluginManifest> {
     get showPhase(): ShowPhase;
     private _timerState;
     get timerState(): TimerState | null;
+    /**
+     * Track the support for HTTP/2 assets on the client and server side
+     * Client side is dictated by the environment we're connecting from (and the media cogs-av-box version)
+     * Server side is dictated by the COGS version which added the HTTP/2 assets server itself
+     */
+    private clientSupportsHttp2Assets;
+    private serverSupportsHttp2Assets;
+    get supportsHttp2Assets(): boolean;
+    /**
+     * Return asset URLs using the information about the client and server support for HTTP/2
+     */
+    getAssetUrl(path: string): string;
     /**
      * Cached audio outputs use to look up the device/sink ID when a different device label is requested
      */

package/dist/CogsConnection.js

@@ -4,6 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CogsIncomingEvent = exports.CogsStateChangedEvent = exports.CogsConfigChangedEvent = exports.CogsMessageEvent = exports.CogsConnectionCloseEvent = exports.CogsConnectionOpenEvent = void 0;
+const compare_versions_1 = require("compare-versions");
 const ShowPhase_1 = __importDefault(require("./types/ShowPhase"));
 const reconnecting_websocket_1 = __importDefault(require("reconnecting-websocket"));
 const urls_1 = require("./helpers/urls");
@@ -20,6 +21,15 @@ class CogsConnection {
     get timerState() {
         return this._timerState ? { ...this._timerState } : null;
     }
+    get supportsHttp2Assets() {
+        return this.clientSupportsHttp2Assets && this.serverSupportsHttp2Assets;
+    }
+    /**
+     * Return asset URLs using the information about the client and server support for HTTP/2
+     */
+    getAssetUrl(path) {
+        return (0, urls_1.assetUrl)(path, this.supportsHttp2Assets);
+    }
     get selectedAudioOutput() {
         return this._selectedAudioOutput;
     }
@@ -31,18 +41,29 @@ class CogsConnection {
         this.currentState = {}; // Received on open connection - TODO: set initial state from manifest?
         this._showPhase = ShowPhase_1.default.Setup;
         this._timerState = null;
+        /**
+         * Track the support for HTTP/2 assets on the client and server side
+         * Client side is dictated by the environment we're connecting from (and the media cogs-av-box version)
+         * Server side is dictated by the COGS version which added the HTTP/2 assets server itself
+         */
+        this.clientSupportsHttp2Assets = false;
+        this.serverSupportsHttp2Assets = false;
         /**
          * Cached audio outputs use to look up the device/sink ID when a different device label is requested
          */
         this.audioOutputs = undefined;
         this._selectedAudioOutput = '';
         this.currentState = { ...initialClientState };
-        const { useReconnectingWebsocket, path, pathParams } = websocketParametersFromUrl(document.location.href);
+        const { useReconnectingWebsocket, path, pathParams, supportsHttp2Assets } = websocketParametersFromUrl(document.location.href);
         const socketUrl = `ws://${hostname}:${port}${path}${pathParams ? '?' + pathParams : ''}`;
         this.websocket = useReconnectingWebsocket ? new reconnecting_websocket_1.default(socketUrl) : new WebSocket(socketUrl);
+        this.clientSupportsHttp2Assets = !!supportsHttp2Assets;
         this.websocket.onopen = () => {
             this.currentConfig = {}; // Received on open connection
             this.currentState = {}; // Received on open connection
+            // Reset this flag as we might have just connected to an old COGS version which doesn't support HTTP/2
+            // The flag will be set when COGS sends a "cogs_environment" message
+            this.serverSupportsHttp2Assets = false;
             this.dispatchEvent(new CogsConnectionOpenEvent());
             this.setState(this.currentState); // TODO: Remove this because you should set it manually...??
         };
@@ -77,6 +98,9 @@ class CogsConnection {
                             case 'show_phase':
                                 this._showPhase = message.phase;
                                 break;
+                            case 'cogs_environment':
+                                this.serverSupportsHttp2Assets = message.http2AssetsServer;
+                                break;
                         }
                         this.dispatchEvent(new CogsMessageEvent(message));
                     }
@@ -168,41 +192,67 @@ class CogsConnection {
 }
 exports.default = CogsConnection;
 function websocketParametersFromUrl(url) {
-    var _a, _b, _c, _d, _e;
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     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 pluginId = parsedUrl.pathname.startsWith('/plugin/') ? decodeURIComponent(parsedUrl.pathname.split('/')[2]) : undefined;
+    // Allow explicitly disabling HTTP/2 assets. This is useful in situations where we know the self-signed certificate cannot be
+    // supported such as the native mobile app
+    const disableHttp2Assets = ((_b = pathParams.get('http2Assets')) !== null && _b !== void 0 ? _b : '') === 'false';
     if (localClientId) {
-        const type = (_b = pathParams.get('t')) !== null && _b !== void 0 ? _b : '';
+        const type = (_c = pathParams.get('t')) !== null && _c !== void 0 ? _c : '';
         pathParams.delete('local_id');
         return {
             path: `/local/${encodeURIComponent(localClientId)}`,
             pathParams: new URLSearchParams({ t: type }),
             useReconnectingWebsocket: true,
+            supportsHttp2Assets: !disableHttp2Assets,
         };
     }
     else if (isSimulator) {
-        const name = (_c = pathParams.get('name')) !== null && _c !== void 0 ? _c : '';
+        const supportsHttp2Assets = ((_d = pathParams.get('http2Assets')) !== null && _d !== void 0 ? _d : '') === 'true';
+        pathParams.delete('http2Assets');
+        const name = (_e = pathParams.get('name')) !== null && _e !== void 0 ? _e : '';
         pathParams.delete('simulator');
         pathParams.delete('name');
-        return { path: `/simulator/${encodeURIComponent(name)}`, pathParams, useReconnectingWebsocket: true };
+        return {
+            path: `/simulator/${encodeURIComponent(name)}`,
+            pathParams,
+            useReconnectingWebsocket: true,
+            supportsHttp2Assets: !disableHttp2Assets && supportsHttp2Assets,
+        };
     }
     else if (display) {
-        const displayIdIndex = (_d = pathParams.get('displayIdIndex')) !== null && _d !== void 0 ? _d : '';
+        const displayIdIndex = (_f = pathParams.get('displayIdIndex')) !== null && _f !== void 0 ? _f : '';
         pathParams.delete('display');
         pathParams.delete('displayIdIndex');
-        return { path: `/display/${encodeURIComponent(display)}/${encodeURIComponent(displayIdIndex)}` };
+        return {
+            path: `/display/${encodeURIComponent(display)}/${encodeURIComponent(displayIdIndex)}`,
+            supportsHttp2Assets: !disableHttp2Assets,
+        };
     }
     else if (pluginId) {
-        return { path: `/plugin/${encodeURIComponent(pluginId)}`, useReconnectingWebsocket: true };
+        return {
+            path: `/plugin/${encodeURIComponent(pluginId)}`,
+            useReconnectingWebsocket: true,
+            supportsHttp2Assets: !disableHttp2Assets,
+        };
     }
     else {
-        const serial = (_e = pathParams.get('serial')) !== null && _e !== void 0 ? _e : '';
+        const serial = (_g = pathParams.get('serial')) !== null && _g !== void 0 ? _g : '';
         pathParams.delete('serial');
-        return { path: `/client/${encodeURIComponent(serial)}`, pathParams };
+        // Check if cogs-box-av is a version which added support for ignoring HTTP/2 self-signed certificates
+        const firmwareVersion = ((_h = pathParams.get('f')) !== null && _h !== void 0 ? _h : '').replace(/^v/, '');
+        const isCogsBoxAvDevBuild = firmwareVersion === '0.0.0'; // We assume dev firmware builds have HTTP/2 assets support - Added in 2024-03
+        const supportsHttp2Assets = isCogsBoxAvDevBuild || ((0, compare_versions_1.validate)(firmwareVersion) && (0, compare_versions_1.satisfies)(firmwareVersion, '>=4.9.0'));
+        return {
+            path: `/client/${encodeURIComponent(serial)}`,
+            pathParams,
+            supportsHttp2Assets: !disableHttp2Assets && supportsHttp2Assets,
+        };
     }
 }
 class CogsConnectionOpenEvent extends Event {

package/dist/VideoPlayer.d.ts

@@ -7,6 +7,7 @@ type EventTypes = {
     videoClipState: MediaClipStateMessage;
 };
 export default class VideoPlayer {
+    private cogsConnection;
     private eventTarget;
     private globalVolume;
     private videoClipPlayers;

package/dist/VideoPlayer.js

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const urls_1 = require("./helpers/urls");
 const VideoState_1 = require("./types/VideoState");
 const DEFAULT_PARENT_ELEMENT = document.body;
 class VideoPlayer {
     constructor(cogsConnection, parentElement = DEFAULT_PARENT_ELEMENT) {
+        this.cogsConnection = cogsConnection;
         this.eventTarget = new EventTarget();
         this.globalVolume = 1;
         this.videoClipPlayers = {};
@@ -284,7 +284,7 @@ class VideoPlayer {
     createVideoElement(path, config, { volume }) {
         const videoElement = document.createElement('video');
         videoElement.playsInline = true; // Required for iOS
-        videoElement.src = (0, urls_1.assetUrl)(path);
+        videoElement.src = this.cogsConnection.getAssetUrl(path);
         videoElement.autoplay = false;
         videoElement.loop = false;
         setVideoElementVolume(videoElement, volume * this.globalVolume);