/**
 * 视频处理组件
 * 处理视频播放、旁白、提示框的展示逻辑
 */
import { Video, Narration } from "@/components";
import Alert from "@/components/layout/alert/title-alert";
import type { FileType } from "./types";
import { YINYUAN_VIDEO_CONFIG } from "../constants/yinyuan";
import { MIMIAN_VIDEO_CONFIG } from "../constants/mimian";

export interface VideoHandlerProps {
  /** 当前播放的视频类型 */
  playingVideo: FileType | null;
  /** 旁白文本 */
  narrationText: string;
  /** 是否显示旁白 */
  showNarration: boolean;
  /** 是否显示提示框 */
  showAlert: boolean;
  /** 提示框配置 */
  alertConfig: { title: string; subtitle: string };
  /** 视频结束回调 */
  onVideoEnd: () => void;
  /** 旁白关闭回调 */
  onNarrationClose: () => void;
  /** 提示框关闭回调 */
  onAlertClose: () => void;
}

/**
 * 视频处理组件
 * 根据 playingVideo 显示对应的视频，处理视频结束后的旁白和提示框
 */
export const VideoHandler = ({
  playingVideo,
  narrationText,
  showNarration,
  showAlert,
  alertConfig,
  onVideoEnd,
  onNarrationClose,
  onAlertClose,
}: VideoHandlerProps) => {
  // 获取当前视频配置
  const getVideoConfig = () => {
    if (playingVideo === "yinyuan") return YINYUAN_VIDEO_CONFIG;
    if (playingVideo === "mimian") return MIMIAN_VIDEO_CONFIG;
    return null;
  };

  const videoConfig = getVideoConfig();

  return (
    <>
      {/* 视频播放层 */}
      {playingVideo && videoConfig && (
        <div className="absolute inset-0 z-40">
          <Video
            src={videoConfig.src}
            autoPlay
            showSkipButton
            onEnded={onVideoEnd}
            className="w-full h-full"
          />
        </div>
      )}

      {/* 旁白层（仅用于视频后的旁白，不再包含欢迎语） */}
      <Narration
        text={narrationText}
        visible={showNarration}
        onClose={onNarrationClose}
        enableAnimation={playingVideo === "yinyuan"}
      />

      {/* 提示框 */}
      {showAlert && (
        <Alert
          visible={showAlert}
          title={alertConfig.title}
          subtitle={alertConfig.subtitle}
          onClose={onAlertClose}
        />
      )}
    </>
  );
};