import { BaseKonvaComponent, ComponentConfig, ConfigWithOptionalStyle } from '../layout/konva-component'; import Konva from 'konva'; import { OnMeasurementsChange, Position } from '../common'; import { Timeline } from './timeline'; import { Subject } from 'rxjs'; import { MediaElementPlaybackState, VideoControllerApi } from '../video'; import { PlayheadMoveEvent } from '../types'; export interface PlayheadState { dragging: boolean; dragmove: boolean; seeking: boolean; positionBeforeDrag: Position | undefined; } export interface PlayheadStyle { visible: boolean; fill: string; draggingFill: string; lineWidth: number; symbolHeight: number; symbolYOffset: number; textFontSize: number; textFill: string; textYOffset: number; scrubberHeight: number; backgroundFill: string; backgroundOpacity: number; playProgressFill: string; playProgressOpacity: number; bufferedFill: string; bufferedOpacity: number; } export interface PlayheadConfig extends ComponentConfig { minScrollSpeedPx: number; maxScrollSpeedPx: number; /** * After this number of pixels we're using constant max scrolling speed */ dragScrollMaxSpeedAfterPx: number; } export declare class Playhead extends BaseKonvaComponent implements OnMeasurementsChange { readonly onMove$: Subject; readonly onStateChange$: Subject; protected _timeline: Timeline; protected _videoController: VideoControllerApi; protected _playbackState?: MediaElementPlaybackState; protected _state: PlayheadState; protected _dragBreaker$: Subject; protected _group: Konva.Group; protected _bgRect: Konva.Rect; protected _playProgressBgRect: Konva.Rect; protected _playheadGroup: Konva.Group; protected _playheadLine: Konva.Line; protected _playheadSymbol: Konva.Line; protected _timecodeLabel: Konva.Label; protected _timecodeText: Konva.Text; protected _bufferedGroup: Konva.Group; protected readonly _animationFrameCallback$: Subject; protected _requestAnimationFrameId?: number; constructor(config: Partial>, timeline: Timeline, videoController: VideoControllerApi); dragStart(): void; dragMove(position: number): void; dragEnd(): void; private startAnimationFrameLoop; private stopAnimationFrameLoop; private requestAnimationFrameExecutor; private scrollToRevealPlayhead; private playheadMoveRelativePointer; private resolvetimelineScrollSpeed; /** * Repositions playhead on drag, or on drag with timeline scroll * * @param position * @private */ private repositionPlayhead; private updateState; protected provideKonvaNode(): Konva.Group; onMeasurementsChange(): void; getPlayheadPosition(): number; protected settleLayout(): void; private doPlayProgress; private settleTimecode; private doBufferingProgress; private createBuffers; private createSymbol; destroy(): void; }