/// import '@/index.scss'; export declare enum RtspImageFormat { PNG = "png", JPEG = "jpeg" } export declare enum PlayType { LIVE = "live", BACK = "back" } export interface PlayerTheme { primaryColor?: string; fontColor?: string; borderColor?: string; backgroundColor?: string; } export interface RtspOptions { target: HTMLElement | string; wnd: RtspWindowEnum; serverUrl?: string; frameRate?: number; wndSplitLineColor?: string; backgroundColor?: number[]; theme?: PlayerTheme; timeOut?: number; imageStreamFormat?: RtspImageFormat; quality?: number; wndInfo?: string | HTMLElement; snapshotPath?: string; videoPath?: string; downloadPath?: string; onError?: (err: ErrorMessage) => void; onEvents?: (data: PlayerEvents) => void; onWindowActiveEvent?: (data: any) => void; } export interface PlayerEvents { type: string; data: any; } export declare enum RtspWindowEnum { ONE = 1, FOUR = 4, SIX = 6, NINE = 9, TWELVE = 12, SIXTEEN = 16 } export interface PlayOptions { cameraName: string; rtspUrl?: string; wnd?: number; } export interface SnapshotOptions { wnd?: number; isDownload?: boolean; } export declare enum PlayerEventDirectives { RESISE = "resize", INIT = "init", LIVE = "live", CHANGE = "change", BACK = "back", CLOSE = "close", CLEAR = "clear", MANUAL_VIDEO_RECORDING = "ManualVideoRecording", LOCAL_SNAPSHOT = "LocalSnapshot", PLAYER_FULL = "playerFull", ADAPTIVE = "Adaptive", CANCEL = "cancel" } export interface DirectiveMessage { type: PlayerEventDirectives; message: { [key: string]: any; }; } export interface DirectiveMessageResponse { type: string; wnd?: number; code: number; message?: string; data?: any; } export interface SwpDirectiveMap { resolve: (value: any) => void; reject: (value: any) => void; timer: any; loadingEl?: HTMLElement; } export declare enum ERROR_TYPE { CONNECTION = "CONNECTION", DIRECTIVE = "DIRECTIVE" } export interface ErrorMessage { type: ERROR_TYPE; code?: number; message?: string; } export interface PlayRecord { wnd: number; wndEl: string; type: PlayType; cameraCode?: string; cameraName: string; startTime?: string; endTime?: string; speed?: number; status?: boolean; } export interface RecRecord { timer: NodeJS.Timer; startTime: number; } /** * 核心类 * @author leiyangc */ export default class RtspPlayer { ws: WebSocket | undefined; conf: RtspOptions; directiveMap: Map; $PLAYER_DOM: HTMLImageElement | null; windowsArray: HTMLDivElement[]; _cls: string; wndParentDom: HTMLDivElement | null; width: number; height: number; activeWindow: number; totalWindow: RtspWindowEnum; _root: HTMLElement; playRecord: Map; timer: any; _player: HTMLElement; recData: Map; isInit: boolean; max_wnd_num: number; constructor(configure: RtspOptions); /** * gzip多进程解包 * @param blobData */ onWorderMessageHandle(e: any): void; initTheme(): void; /** * 初始化播放器 */ init(): void; /** * 创建播放器元素 * @param target */ createPlayer(): void; /** * 计算播放器容器大小 */ computedRectSize(): void; /** * 动态创建窗口元素 */ createWindowElement(): void; /** * 创建窗口信息 */ initWindowInfo(wnd: number): HTMLElement; /** * 获取空闲窗口 * @returns */ getPlayerFreeWindow(): number; /** * 关闭指定窗口 * @param wnd */ closePlayerWindow(wnd: number): void; /** * 清除窗口内容并重置为空闲窗口 * @param wnd */ delPlayerWindowInfo(wnd: number): void; /** * 创建空闲窗口内容 * @param wnd * @returns */ createFreeWindowInfo(wnd: number): HTMLElement; /** * 容器大小改变 */ resizeChange(): void; /** * 监听播放器容器大小更改 */ onResize(): void; /** * 创建加载动画 * @param loadingText * @returns */ createLoading(loadingText: string): HTMLElement; createErrorInWnd(opt: DirectiveMessageResponse): void; getErrorMessage(code: number): string; /** * 注册事件 * @param options */ addPlayerLisenClickEvent(): void; dblClickEventHandler(e: MouseEvent): void; /** * 播放器点击事件 * @param e * @returns */ clickEventHandler(e: MouseEvent): void; /** * 点击处理事件 * @param _directive * @param wnd * @returns */ handleDirective(_directive: string, wnd: number, target: HTMLElement): void; startRec(wnd: number): void; stopRec(wnd: number): void; /** * base64转blob * @param content * @returns */ base64ToBlob(content: string): Blob; /** * 文件下载 * @param content * @param fileName */ downloadImage(content: string, fileName: string): void; /** * 子节点向上查找父节点窗口信息,直到找到窗体信息为止 * @param target * @returns */ queryParent(target: HTMLElement): string | undefined; /** * 窗口选中激活 * @param id * @returns */ windowaAtivation(id: string): void; /** * 切换窗口 * @param wnd * @returns */ switchWindow(wnd: RtspWindowEnum): void; registerEvent(dom: HTMLElement, type: keyof HTMLElementEventMap, handler: (e: any) => void): void; /** * 清空窗口信息 */ clearPlayer(): void; restoreWindowInfo(wnd: number): void; /** * 窗口的title bar * @param wnd * @returns */ insertTitleBar(wnd: number, el?: HTMLElement | null): void; /** * 实况的控制条 * @param wnd */ insertLiveControlBar(wnd: number, el?: HTMLElement | null): void; insertRecControl(wnd: number, el?: HTMLElement | null): void; /** * 录像控制条 */ insertBackControlBar(wnd: number, el?: HTMLElement | null): void; onOpen(): void; /** * 消息接受 * @param event * @returns */ onMessage(event: MessageEvent): void; /** * 消息处理 * @param message */ messageEventHandle(message: DirectiveMessageResponse): void; /** * 播放响应处理 * @param message * @returns */ playHandleMessage(message: DirectiveMessageResponse): void; batchPlay(opt: PlayOptions[], callback: (res: any) => void): void; /** * 实况或录像回放 * @param opt * @returns */ play(opt: PlayOptions): Promise; /** * 连接异常 * @param err */ onError(err: Event): void; /** * 连接断开 */ onClose(): void; /** * 播放指令融合处理 * @param options * @param el * @returns */ sendPlayDirective(options: DirectiveMessage, el: HTMLElement): Promise; /** * 发送客户端指令 * @param options * @returns */ sendDirective(options: DirectiveMessage): Promise; localSnapshot(option: SnapshotOptions): Promise; reportError(err: ErrorMessage): void; /** * 销毁 */ destroy(): void; }