saltfish/dist/managers/TranscriptManager.d.ts

An interactive video-guided tour system for web applications

import type { Transcript } from '../types';
import type { VideoManager } from './VideoManager';
/**
 * Manager for handling transcript display and synchronization with video playback
 */
export declare class TranscriptManager {
    private transcriptContainer;
    private transcriptContent;
    private ccButton;
    private isVisible;
    private currentTranscript;
    private chunks;
    private videoElement;
    private timeUpdateListener;
    private videoManager;
    private static userCaptionPreference;
    private firstWordForceDisplayUntil;
    private isNewVideo;
    private lastDisplayedChunkIndex;
    private animationFrameId;
    private isAnimationLoopActive;
    private currentWindowStartIndex;
    private currentWindowEndIndex;
    constructor();
    /**
     * Setup the transcript manager with a video element and CC button
     */
    setup(videoElement: HTMLVideoElement, ccButton: HTMLElement, videoManager: VideoManager): void;
    /**
     * Update the video element reference (used when VideoManager switches between dual videos)
     */
    updateVideoElement(newVideoElement: HTMLVideoElement): void;
    /**
     * Load transcript data for the current step
     */
    loadTranscript(transcript: Transcript | null, initiallyVisible?: boolean): void;
    /**
     * Show or hide the transcript display
     */
    toggleVisibility(): void;
    /**
     * Handle CC button click
     */
    private handleCCButtonClick;
    /**
     * Handle video time updates for transcript synchronization
     */
    private handleTimeUpdate;
    /**
     * High-frequency animation loop for smooth caption updates
     * Uses requestAnimationFrame to catch short-duration words
     */
    private startAnimationLoop;
    /**
     * Stop the animation loop
     */
    private stopAnimationLoop;
    /**
     * Find the active chunk index based on current video time
     */
    private findActiveChunkIndex;
    /**
     * Handle state changes to show/hide transcript based on player state
     */
    handleStateChange(currentState: string): void;
    /**
     * Update word display with karaoke-style highlighting
     * Shows 1-4 words in a static window, only moving the highlight
     */
    private updateIntelligentWordDisplay;
    /**
     * Update which word is highlighted within the existing window (no DOM rebuild)
     * Progressive reveal - shows words up to current index
     */
    private updateHighlightInWindow;
    /**
     * Create a new window of 1-4 words (rebuilds DOM)
     * Words are created hidden and will progressively reveal
     * Uses fade transition to prevent jittery movement during window changes
     */
    private createNewWindow;
    /**
     * Calculate the word window (start and end indices) for display
     * Shows 1-4 words based on text length to prevent overflow and line breaks
     * Always splits at sentence boundaries (. ! and ?)
     */
    private calculateWordWindow;
    /**
     * Create the transcript UI container
     */
    private createTranscriptUI;
    /**
     * Setup word-by-word display containers (now uses dynamic approach)
     */
    private setupWordDisplay;
    /**
     * Show the transcript
     */
    private showTranscript;
    /**
     * Hide the transcript
     */
    private hideTranscript;
    /**
     * Update CC button state
     */
    private updateCCButtonState;
    /**
     * Clean up resources
     */
    /**
     * Reset the TranscriptManager to a clean state for new playlist
     * Clears transcript data and UI state without destroying DOM elements
     */
    reset(): void;
    /**
     * Reset user caption preference (called when player is destroyed)
     */
    static resetUserPreference(): void;
    destroy(): Promise<void>;
}
//# sourceMappingURL=TranscriptManager.d.ts.map