@maestro_io/maestro-web-sdk 5.0.0 → 5.1.1

package/dist/src/development/TimeSeek.js

@@ -0,0 +1,218 @@
+import React from 'react';
+import SDK from '..';
+export default class TimeCodeSeek extends React.Component {
+    constructor(props) {
+        super(props);
+        Object.defineProperty(this, "addMinutesFromTimestamp", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (timestamp, minutes) => {
+                const date = new Date(timestamp);
+                date.setMinutes(date.getMinutes() + minutes);
+                return date.getTime();
+            }
+        });
+        // format timestamp to 2025-05-11T20:40:26Z format
+        Object.defineProperty(this, "formatTimestampToWallClock", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (timestamp) => {
+                const date = new Date(timestamp);
+                return date.toISOString().replace(/\.000Z$/, 'Z');
+            }
+        });
+        // format 2025-05-11T20:40:26Z to timestamp
+        Object.defineProperty(this, "formatWallClockToTimestamp", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (timestamp) => {
+                const date = new Date(timestamp);
+                return date.getTime();
+            }
+        });
+        Object.defineProperty(this, "retreat", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: async (minutes) => {
+                const newCurrentTimeCode = this.addMinutesFromTimestamp(this.timeCode, minutes * -1);
+                this.setState({ currentTimeCode: newCurrentTimeCode });
+                SDK.getMaestroEventViewModel().updatePlayerTimeCode(newCurrentTimeCode);
+            }
+        });
+        Object.defineProperty(this, "advance", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: async (minutes) => {
+                const newCurrentTimeCode = this.addMinutesFromTimestamp(this.timeCode, minutes);
+                this.setState({ currentTimeCode: newCurrentTimeCode });
+                SDK.getMaestroEventViewModel().updatePlayerTimeCode(newCurrentTimeCode);
+            }
+        });
+        Object.defineProperty(this, "setToNow", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: () => {
+                const now = Date.now();
+                this.setState({ currentTimeCode: now });
+                SDK.getMaestroEventViewModel().updatePlayerTimeCode(now);
+            }
+        });
+        Object.defineProperty(this, "resetToGameStart", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: () => {
+                if (this.state.gameStartTimeCode) {
+                    this.setState({ currentTimeCode: this.state.gameStartTimeCode });
+                    SDK.getMaestroEventViewModel().updatePlayerTimeCode(this.state.gameStartTimeCode);
+                }
+            }
+        });
+        this.state = {
+            currentTimeCode: null,
+            gameStartTimeCode: null,
+        };
+    }
+    componentDidMount() {
+        // Try to fetch initial stats from the local API server on port 8080
+        fetch(`http://localhost:8080/espn-api/v4/events/${this.props.eventId}/stats`)
+            .then((result) => {
+            if (!result.ok) {
+                throw new Error(`HTTP ${result.status}: ${result.statusText}`);
+            }
+            return result.json();
+        })
+            .then((data) => {
+            // Use the game's firstPlayWallClock as the initial timecode (game start time)
+            let initialTimecode;
+            if (data.meta?.firstPlayWallClock) {
+                initialTimecode = this.formatWallClockToTimestamp(data.meta.firstPlayWallClock);
+            }
+            else if (data.meta?.lastPlayWallClock) {
+                // Fallback to lastPlayWallClock if firstPlayWallClock not available
+                initialTimecode = this.formatWallClockToTimestamp(data.meta.lastPlayWallClock);
+            }
+            else {
+                // Fallback to current time if no game timecode available
+                initialTimecode = Date.now();
+            }
+            this.setState({
+                currentTimeCode: initialTimecode,
+                gameStartTimeCode: initialTimecode,
+            });
+            SDK.getMaestroEventViewModel().updatePlayerTimeCode(initialTimecode);
+        })
+            .catch((error) => {
+            console.error('Error fetching initial stats from local API:', error);
+            // Fallback to current time if local API fails
+            const fallbackTimestamp = Date.now();
+            this.setState({
+                currentTimeCode: fallbackTimestamp,
+                gameStartTimeCode: fallbackTimestamp,
+            });
+            SDK.getMaestroEventViewModel().updatePlayerTimeCode(fallbackTimestamp);
+        });
+    }
+    get timeCode() {
+        const timeCode = this.state.currentTimeCode;
+        if (!timeCode) {
+            throw new Error('timecode not set');
+        }
+        return timeCode;
+    }
+    render() {
+        return (React.createElement("div", null,
+            React.createElement("div", { style: {
+                    position: 'fixed',
+                    zIndex: 100,
+                    bottom: 10,
+                    width: '100%',
+                    backgroundColor: 'rgba(0, 0, 0, 0.9)',
+                    color: 'white',
+                    padding: '10px',
+                    display: 'flex',
+                    justifyContent: 'center',
+                    gap: '10px',
+                    flexWrap: 'wrap',
+                    borderTop: '2px solid #333',
+                } },
+                React.createElement("div", { style: {
+                        display: 'flex',
+                        alignItems: 'center',
+                        marginRight: '20px',
+                        fontSize: '14px',
+                    } },
+                    React.createElement("strong", null, "Current TimeCode:"),
+                    ' ',
+                    this.state.currentTimeCode
+                        ? this.formatTimestampToWallClock(this.state.currentTimeCode)
+                        : 'Not set'),
+                React.createElement("div", { style: { display: 'flex', gap: '10px', flexWrap: 'wrap' } },
+                    React.createElement("button", { style: {
+                            height: '40px',
+                            width: '80px',
+                            backgroundColor: '#dc3545',
+                            color: 'white',
+                            border: 'none',
+                            borderRadius: '5px',
+                            cursor: 'pointer',
+                            fontSize: '12px',
+                        }, onClick: () => this.retreat(20) }, "-20m"),
+                    React.createElement("button", { style: {
+                            height: '40px',
+                            width: '80px',
+                            backgroundColor: '#dc3545',
+                            color: 'white',
+                            border: 'none',
+                            borderRadius: '5px',
+                            cursor: 'pointer',
+                            fontSize: '12px',
+                        }, onClick: () => this.retreat(5) }, "-5m"),
+                    React.createElement("button", { style: {
+                            height: '40px',
+                            width: '80px',
+                            backgroundColor: '#28a745',
+                            color: 'white',
+                            border: 'none',
+                            borderRadius: '5px',
+                            cursor: 'pointer',
+                            fontSize: '12px',
+                        }, onClick: () => this.advance(5) }, "+5m"),
+                    React.createElement("button", { style: {
+                            height: '40px',
+                            width: '80px',
+                            backgroundColor: '#28a745',
+                            color: 'white',
+                            border: 'none',
+                            borderRadius: '5px',
+                            cursor: 'pointer',
+                            fontSize: '12px',
+                        }, onClick: () => this.advance(20) }, "+20m"),
+                    React.createElement("button", { style: {
+                            height: '40px',
+                            width: '80px',
+                            backgroundColor: '#007bff',
+                            color: 'white',
+                            border: 'none',
+                            borderRadius: '5px',
+                            cursor: 'pointer',
+                            fontSize: '12px',
+                        }, onClick: this.setToNow }, "NOW"),
+                    React.createElement("button", { style: {
+                            height: '40px',
+                            width: '80px',
+                            backgroundColor: '#6f42c1',
+                            color: 'white',
+                            border: 'none',
+                            borderRadius: '5px',
+                            cursor: 'pointer',
+                            fontSize: '12px',
+                        }, onClick: this.resetToGameStart }, "START")))));
+    }
+}

package/dist/src/development/development.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/src/development/development.js

@@ -0,0 +1,39 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import SDK from '..';
+import MaestroEventDelegate from './MaestroEventDelegate';
+import TimeCodeSeek from './TimeSeek';
+const eventDelegate = new MaestroEventDelegate();
+SDK.configure({
+    siteID: '664b9c57d59a7a431542d814',
+});
+// Get eventId from metadata instead of hardcoding
+const EVENT_ID = '401790363'; // fallback
+/**
+ * SDK Development Setup
+ *
+ * This development setup initializes the Maestro Web SDK with:
+ * - User authentication configuration
+ * - Event watching setup
+ * - Key plays data integration
+ * - Focus management initialization
+ */
+const init = async () => {
+    const keyplays = await (await fetch(`https://site.api.espn.com/apis/site/v2/sports/keyplays/${EVENT_ID}`)).json();
+    await SDK.userDidStartWatchingEvent({
+        eventId: EVENT_ID,
+        delegate: eventDelegate,
+    });
+    SDK.getMaestroEventViewModel().startFocusManagement();
+    await SDK.getMaestroEventViewModel().updateKeyPlaysData(keyplays);
+    setTimeout(async () => {
+        await SDK.renderPanel('panel-manager');
+    }, 0);
+    const rootElement = document.getElementById('root');
+    if (rootElement) {
+        ReactDOM.render((React.createElement("div", null,
+            React.createElement("div", { id: "panel-manager" }),
+            React.createElement(TimeCodeSeek, { eventId: EVENT_ID }))), rootElement);
+    }
+};
+init();

package/dist/src/external/AxiosNetworkClient.d.ts

@@ -0,0 +1,28 @@
+import { AxiosInstance } from 'axios';
+import { INetworkClient } from './ports/networkClient';
+declare class AxiosNetworkClient implements INetworkClient {
+    private client;
+    private retries;
+    private delay;
+    private backoff;
+    constructor({ baseURL, retries, delay, backoff, axiosInstance, }: {
+        baseURL: string;
+        retries: number;
+        delay: number;
+        backoff: number;
+        axiosInstance?: AxiosInstance;
+    });
+    private retry;
+    get<TResponseData = any>(endpoint: string, params?: Record<string, any>, headers?: Record<string, string>): Promise<TResponseData>;
+    getWithHeaders<TResponseData = any>(endpoint: string, params?: Record<string, any>, headers?: Record<string, string>): Promise<{
+        data: TResponseData;
+        headers: Record<string, string>;
+    }>;
+    post<TRequestData = any, TResponseData = any>(endpoint: string, data: TRequestData, params?: Record<string, any>, headers?: Record<string, string>): Promise<TResponseData>;
+    postWithHeaders<TRequestData = any, TResponseData = any>(endpoint: string, data: TRequestData, params?: Record<string, any>, headers?: Record<string, string>): Promise<{
+        data: TResponseData;
+        headers: Record<string, string>;
+    }>;
+    setAuthentication(token: string | null, apiKey: string | null): void;
+}
+export default AxiosNetworkClient;

package/dist/src/external/AxiosNetworkClient.js

@@ -0,0 +1,110 @@
+import axios from 'axios';
+const REQUEST_TIMEOUT = 5000;
+class AxiosNetworkClient {
+    constructor({ baseURL, retries, delay, backoff, axiosInstance, }) {
+        Object.defineProperty(this, "client", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "retries", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "delay", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "backoff", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        this.retries = retries;
+        this.delay = delay;
+        this.backoff = backoff;
+        this.client =
+            axiosInstance ||
+                axios.create({
+                    baseURL,
+                    headers: {
+                        'Content-Type': 'application/json',
+                    },
+                    timeout: REQUEST_TIMEOUT,
+                });
+    }
+    async retry(operation, attempt = 0) {
+        try {
+            return await operation();
+        }
+        catch (error) {
+            const axiosError = error;
+            // Check if we should retry
+            const shouldRetry = attempt < this.retries &&
+                ((axiosError.response && axiosError.response.status === 429) ||
+                    axiosError.code === 'ECONNABORTED');
+            if (shouldRetry) {
+                const delayTime = this.delay * Math.pow(this.backoff, attempt);
+                console.log(`Retrying request in ${delayTime}ms due to: ${axiosError.message}`);
+                await new Promise((resolve) => setTimeout(resolve, delayTime));
+                return this.retry(operation, attempt + 1);
+            }
+            throw error;
+        }
+    }
+    async get(endpoint, params, headers) {
+        return this.retry(async () => {
+            const response = await this.client.get(endpoint, {
+                params,
+                headers,
+            });
+            return response.data;
+        });
+    }
+    async getWithHeaders(endpoint, params, headers) {
+        return this.retry(async () => {
+            const response = await this.client.get(endpoint, {
+                params,
+                headers,
+            });
+            return {
+                data: response.data,
+                headers: response.headers,
+            };
+        });
+    }
+    async post(endpoint, data, params, headers) {
+        return this.retry(async () => {
+            const response = await this.client.post(endpoint, data, {
+                params,
+                headers,
+            });
+            return response.data;
+        });
+    }
+    async postWithHeaders(endpoint, data, params, headers) {
+        return this.retry(async () => {
+            const response = await this.client.post(endpoint, data, {
+                params,
+                headers,
+            });
+            return {
+                data: response.data,
+                headers: response.headers,
+            };
+        });
+    }
+    setAuthentication(token, apiKey) {
+        this.client.defaults.headers.common['Authorization'] = token
+            ? `Bearer ${token}`
+            : '';
+        this.client.defaults.headers.common['x-maestro-api-key'] = apiKey || '';
+    }
+}
+export default AxiosNetworkClient;

package/dist/src/external/LocalStorageCacheManager.d.ts

@@ -0,0 +1,65 @@
+import { ICacheManager } from './ports/cacheManager';
+/**
+ * Manages caching using localStorage with support for TTL, size limits, and versioning.
+ * This class implements the ICacheManager interface and provides methods for setting, getting,
+ * and clearing cache entries.
+ */
+export default class LocalStorageCacheManager implements ICacheManager {
+    private readonly prefix;
+    private readonly cacheDuration;
+    private readonly maxSize;
+    private readonly version;
+    private readonly accessLog;
+    /**
+     * Creates a new LocalStorageCacheManager instance.
+     * @param cacheDuration - The time-to-live (TTL) for cache entries in milliseconds.
+     * @param maxSize - The maximum size of the cache in bytes.
+     * @param version - The version of the cache. Used to invalidate cache entries when the version changes.
+     */
+    constructor(cacheDuration?: number, maxSize?: number, version?: string);
+    /**
+     * Produces a cache key by combining the prefix, version, and the provided key.
+     * @param key - The key to be used in the cache.
+     * @returns The generated cache key.
+     */
+    produceCacheKey(key: string): string;
+    /**
+     * Calculates the current size of the cache in bytes.
+     * @returns The total size of the cache in bytes.
+     */
+    private getCurrentSize;
+    /**
+     * Cleans up old cache entries based on their TTL.
+     */
+    private cleanupOldEntries;
+    /**
+     * Cleans up least recently used cache entries when the cache is full.
+     */
+    private cleanupLRUEntries;
+    /**
+     * Sets a value in the cache with the specified key.
+     * @param key - The key to store the value under.
+     * @param data - The value to be stored in the cache.
+     */
+    setCache(key: string, data: any): void;
+    /**
+     * Retrieves a value from the cache by its key.
+     * @param key - The key to retrieve the value for.
+     * @returns The cached value, or null if the key is not found or the entry has expired.
+     */
+    getCache(key: string): any;
+    /**
+     * Clears a specific cache entry by its key.
+     * @param key - The key of the cache entry to clear.
+     */
+    clearCache(key: string): void;
+    /**
+     * Clears all cache entries that match the specified pattern.
+     * @param pattern - The pattern to match against cache keys.
+     */
+    clearCacheByPattern(pattern: string): void;
+    /**
+     * Clears all cache entries.
+     */
+    clearAllCache(): void;
+}

package/dist/src/external/LocalStorageCacheManager.js

@@ -0,0 +1,213 @@
+/**
+ * Manages caching using localStorage with support for TTL, size limits, and versioning.
+ * This class implements the ICacheManager interface and provides methods for setting, getting,
+ * and clearing cache entries.
+ */
+export default class LocalStorageCacheManager {
+    /**
+     * Creates a new LocalStorageCacheManager instance.
+     * @param cacheDuration - The time-to-live (TTL) for cache entries in milliseconds.
+     * @param maxSize - The maximum size of the cache in bytes.
+     * @param version - The version of the cache. Used to invalidate cache entries when the version changes.
+     */
+    constructor(cacheDuration = 3600000, maxSize = 5 * 1024 * 1024, version = '1.0') {
+        Object.defineProperty(this, "prefix", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: 'maestro-cache-'
+        });
+        Object.defineProperty(this, "cacheDuration", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "maxSize", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "version", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "accessLog", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        this.cacheDuration = cacheDuration;
+        this.maxSize = maxSize;
+        this.version = version;
+        this.accessLog = new Map();
+    }
+    /**
+     * Produces a cache key by combining the prefix, version, and the provided key.
+     * @param key - The key to be used in the cache.
+     * @returns The generated cache key.
+     */
+    produceCacheKey(key) {
+        return `${this.prefix}${this.version}:${key}`;
+    }
+    /**
+     * Calculates the current size of the cache in bytes.
+     * @returns The total size of the cache in bytes.
+     */
+    getCurrentSize() {
+        let totalSize = 0;
+        for (let i = 0; i < localStorage.length; i++) {
+            const key = localStorage.key(i);
+            if (key?.startsWith(this.prefix)) {
+                const value = localStorage.getItem(key);
+                if (value) {
+                    totalSize += key.length + value.length;
+                }
+            }
+        }
+        return totalSize;
+    }
+    /**
+     * Cleans up old cache entries based on their TTL.
+     */
+    cleanupOldEntries() {
+        const now = Date.now();
+        // Collect keys to remove first
+        const keysToRemove = [];
+        for (let i = 0; i < localStorage.length; i++) {
+            const key = localStorage.key(i);
+            if (key?.startsWith(this.prefix)) {
+                const value = localStorage.getItem(key);
+                if (value) {
+                    try {
+                        const { timestamp } = JSON.parse(value);
+                        if (now - timestamp > this.cacheDuration) {
+                            keysToRemove.push(key);
+                        }
+                    }
+                    catch (err) {
+                        keysToRemove.push(key);
+                    }
+                }
+            }
+        }
+        keysToRemove.forEach((key) => {
+            localStorage.removeItem(key);
+            // Remove from accessLog
+            const logicalKey = key.replace(this.prefix + this.version + ':', '');
+            this.accessLog.delete(logicalKey);
+        });
+    }
+    /**
+     * Cleans up least recently used cache entries when the cache is full.
+     */
+    cleanupLRUEntries(newItemSize) {
+        // Remove oldest entries until we're under the size limit
+        const entries = Array.from(this.accessLog.entries()).sort(([, a], [, b]) => a - b);
+        while (this.getCurrentSize() + newItemSize > this.maxSize &&
+            entries.length > 0) {
+            const [key] = entries.shift();
+            localStorage.removeItem(this.produceCacheKey(key));
+            this.accessLog.delete(key);
+        }
+    }
+    /**
+     * Sets a value in the cache with the specified key.
+     * @param key - The key to store the value under.
+     * @param data - The value to be stored in the cache.
+     */
+    setCache(key, data) {
+        this.cleanupOldEntries();
+        const cacheKey = this.produceCacheKey(key);
+        const cacheData = {
+            data,
+            timestamp: Date.now(),
+        };
+        const newItemSize = cacheKey.length + JSON.stringify(cacheData).length;
+        this.cleanupLRUEntries(newItemSize);
+        // After cleanup, check if it fits
+        if (this.getCurrentSize() + newItemSize > this.maxSize) {
+            // Still doesn't fit, don't add
+            return;
+        }
+        localStorage.setItem(cacheKey, JSON.stringify(cacheData));
+        this.accessLog.set(key, Date.now());
+    }
+    /**
+     * Retrieves a value from the cache by its key.
+     * @param key - The key to retrieve the value for.
+     * @returns The cached value, or null if the key is not found or the entry has expired.
+     */
+    getCache(key) {
+        this.cleanupOldEntries();
+        const cacheKey = this.produceCacheKey(key);
+        const cachedData = localStorage.getItem(cacheKey);
+        if (!cachedData) {
+            return null;
+        }
+        try {
+            const { data, timestamp } = JSON.parse(cachedData);
+            const now = Date.now();
+            if (now - timestamp > this.cacheDuration) {
+                localStorage.removeItem(cacheKey);
+                this.accessLog.delete(key);
+                return null;
+            }
+            // Update last access time
+            this.accessLog.set(key, now);
+            return data;
+        }
+        catch (err) {
+            localStorage.removeItem(cacheKey);
+            this.accessLog.delete(key);
+            return null;
+        }
+    }
+    /**
+     * Clears a specific cache entry by its key.
+     * @param key - The key of the cache entry to clear.
+     */
+    clearCache(key) {
+        const cacheKey = this.produceCacheKey(key);
+        localStorage.removeItem(cacheKey);
+        this.accessLog.delete(key);
+    }
+    /**
+     * Clears all cache entries that match the specified pattern.
+     * @param pattern - The pattern to match against cache keys.
+     */
+    clearCacheByPattern(pattern) {
+        // Collect all matching keys first
+        const keysToRemove = [];
+        for (let i = 0; i < localStorage.length; i++) {
+            const key = localStorage.key(i);
+            if (key?.startsWith(this.prefix) && key.includes(pattern)) {
+                keysToRemove.push(key);
+            }
+        }
+        keysToRemove.forEach((key) => {
+            localStorage.removeItem(key);
+            // Remove from accessLog
+            const logicalKey = key.replace(this.prefix + this.version + ':', '');
+            this.accessLog.delete(logicalKey);
+        });
+    }
+    /**
+     * Clears all cache entries.
+     */
+    clearAllCache() {
+        const keysToRemove = [];
+        for (let i = 0; i < localStorage.length; i++) {
+            const key = localStorage.key(i);
+            if (key?.startsWith(this.prefix)) {
+                keysToRemove.push(key);
+            }
+        }
+        keysToRemove.forEach((key) => localStorage.removeItem(key));
+        this.accessLog.clear();
+    }
+}