import {
  _decorator,
  Label,
  Node,
  Sprite,
  VideoPlayer,
  UITransform,
  Size,
  Vec3,
  tween,
  view,
  screen,
  Button,
} from "cc";
import li_BaseView from "db://assets/Scripts/Main/Common/li_BaseView";
import ResManager from "db://assets/Scripts/Main/Manager/ResManager";
import { DetailImageItem } from "../../uiitems/DetailImageItem";
import {
  NavigationManager,
  PageTransitionType,
  PanelType,
} from "../../manager/NavigationManager";
import { DetailImageItemPool } from "../../manager/DetailImageItemPool";
import LanguageUtils from "../../../Main/Common/LanguageUtils";
import Utils from "../../../Main/Common/Utils";
import { InnerMsgCode } from "../../../Main/Config/InnerMsgCode";
import { SimpleToggle } from "../components/SimpleToggle";
import { DataManager, DataId } from "../../data/DataManager";
import { GirlData } from "../../data/GirlData";
import { GirlService } from "db://assets/Scripts/chat18x/network/services/GirlService";
import proto from "db://assets/Scripts/proto/proto.pb.js";
import { SceneBgVideoLayer } from "../../../Sub/UI/SceneBgVideoLayer";
import { logger } from "db://assets/Scripts/Main/Common/Logger";
import { GButton } from "../../../Main/Common/GButton";

const { ccclass, property } = _decorator;

@ccclass("GirlDetailPanel")
export class GirlDetailPanel extends li_BaseView {
  @property(UITransform)
  videoArea: UITransform;
  // 移除直接的 VideoPlayer 引用，改用 SceneBgVideoLayer 单例
  // @property(VideoPlayer)
  // avatarVideo: VideoPlayer;
  @property(Label)
  girlName: Label;

  /** 获取 SceneBgVideoLayer 单例实例 */
  private get videoLayer(): SceneBgVideoLayer | null {
    return SceneBgVideoLayer.handle;
  }

  @property(SimpleToggle)
  imgToggle: SimpleToggle = null;
  @property(SimpleToggle)
  videoToggle: SimpleToggle = null;

  @property(Node)
  starParent: Node;

  @property(Label)
  tags: Label;

  @property(Label)
  descAge: Label;
  @property(Label)
  desc: Label;

  @property(Node)
  chatBtn: Node;

  @property(Node)
  descContent: Node;
  id = 0;

  @property(DetailImageItem)
  imgItemInst: DetailImageItem;

  @property(Node)
  imgsLayout: Node;

  //videoAreaPos: Vec3;

  @property(Node)
  sendMsgText: Node;

  private _nodeTab: any = {};

  ImgVidSelect: Node;
  ImgVidFakePos: Node;

  AddFavoriteBtn: Node;

  // 跟随控制相关属性
  private isFollowing: boolean = true; // 当前是否处于跟随状态
  private lastFakePosPosition: Vec3 = new Vec3(); // 记录上次的位置

  // 收藏请求状态标记，防止重复点击
  private isRequestingBookmark: boolean = false;

  protected onEnable(): void {
    this.refresh();
  }

  onLoadCT() {
    super.onLoadCT();
    Utils.parseNode(this.node, this._nodeTab);

    this.ImgVidSelect = this._nodeTab.ImgVidSelect;
    this.ImgVidFakePos = this._nodeTab.ImgVidFakePos;
    this.AddFavoriteBtn = this._nodeTab.AddFavoriteBtn;

    // 初始化位置跟随
    if (this.ImgVidFakePos) {
      this.lastFakePosPosition = this.ImgVidFakePos.position.clone();
    }

    DetailImageItemPool.Instance.setTemplate(this.imgItemInst.node);

    Utils.addInnerEL(InnerMsgCode.LanguageChange, this, () => {
      this.girlName.string = LanguageUtils.getText(this.nameKey);
      const tags = LanguageUtils.getText(this.tagKey);
      this.tags.string = tags;
      this.desc.string = LanguageUtils.getText(this.descKey);
    });

    this.imgToggle.callback = this.bindImgToggle.bind(this);
    this.videoToggle.callback = this.bindVideoToggle.bind(this);

    GButton.BandClick(this.AddFavoriteBtn, this.OnClickAddFavoriteBtn, this);
  }

  setVideEnable(enable: boolean) {
    if (!this.videoLayer) {
      logger.error("GirlDetailPanel: SceneBgVideoLayer 不可用");
      return;
    }

    if (enable) {
      // 恢复播放
      this.videoLayer.resume();
      logger.log("GirlDetailPanel: 开启视频播放");
    } else {
      // 暂停播放
      this.videoLayer.pause();
      logger.log("GirlDetailPanel: 暂停视频播放");
    }
  }

  /**
   * 获取目标视频尺寸
   * 从 videoArea 获取实际需要填充的区域尺寸
   */
  private getTargetVideoSize(): Size | null {
    // 从 videoArea 获取目标尺寸
    if (this.videoArea) {
      return new Size(this.videoArea.width, this.videoArea.height);
    }

    // 如果没有 videoArea，使用默认尺寸
    logger.warn("GirlDetailPanel: videoArea 未设置，使用默认尺寸");
    return new Size(600, 800);
  }

  nameKey: string;
  tagKey: string;
  descKey: string;
  category: number;
  async refresh() {
    this.id = NavigationManager.Instance.getSelectedGirlId();
    this.category = NavigationManager.Instance.getSelectedCategoryId();
    this.imgItemInst.node.active = false;
    //this.videoAreaPos = new Vec3(540, 1384 - 60);

    const pos = new Vec3(
      this.descContent.position.x,
      this.descContent.position.y,
      this.descContent.position.z
    );
    this.descContent.position = new Vec3(pos.x, pos.y - 1000, pos.z);
    //this.node.scale = Vec3.ZERO;
    tween(this.descContent)
      .to(0.3, { position: pos }, { easing: "quadOut" })
      .start();

    // 检查 SceneBgVideoLayer 是否可用
    if (!this.videoLayer) {
      logger.error("GirlDetailPanel: SceneBgVideoLayer.handle 未初始化");
    } else {
      logger.log("GirlDetailPanel: 成功获取 SceneBgVideoLayer 实例");
      // 初始化视频显示位置
      //this.initVideoPosition();
    }

    const girlData = DataManager.I.getDataById<GirlData>(DataId.Girl);

    this.sendMsgText.active = true;

    // 请求详细数据
    const reqData = {
      id: this.id,
    };
    let res = await GirlService.I.reqGetGirlDetail(reqData);
    if (res && res.code === proto.cs.EnmRetCode.SUCCESS) {
      // 保存数据
      girlData.setGirlDetailData(this.category.toString(), res.data);
      // 根据数据，刷新界面
      this.nameKey = girlData.getGrilName(this.category.toString(), this.id);
      this.girlName.string = LanguageUtils.getText(this.nameKey);
      this.descKey = girlData.getGrilDesc(this.category.toString(), this.id);
      this.desc.string = LanguageUtils.getText(this.descKey);

      this.tagKey = girlData.getGrilTagKey(this.category.toString(), this.id);

      this.tags.string = LanguageUtils.getText(this.tagKey);
      const star = girlData.getStar(this.category.toString(), this.id);
      const stars = this.starParent.getComponentsInChildren(Sprite);
      logger.log("好感度:" + star);
      for (let i = 0; i < stars.length; i++) {
        const element = stars[i];
        if (star > i) {
          ResManager.I.changeResourceSpriteFrame(
            element,
            "ui/common/heart/heart"
          );
        } else {
          ResManager.I.changeResourceSpriteFrame(
            element,
            "ui/common/heart/heart_empty"
          );
        }
      }

      let age = girlData.getGrilAge(this.category.toString(), this.id);
      this.descAge.string = age.toString();

      const firstPath = girlData.getFirstGrilVideoPath(
        this.category.toString(),
        this.id
      );

      // 使用 SceneBgVideoLayer 加载并播放视频
      if (this.videoLayer && firstPath) {
        logger.log(`GirlDetailPanel: 加载视频 ${firstPath}`);

        // 获取 videoArea 的尺寸和位置
        const targetSize = this.videoArea
          ? new Size(this.videoArea.width, this.videoArea.height)
          : new Size(600, 800);

        // 获取 videoArea 的中心位置，确保使用正确的世界坐标

        // 使用新的统一 playVideo 方法
        this.videoLayer.playVideo(firstPath, {
          loop: true,
          size: targetSize,
          position: new Vec3(0, 67.71, 0),
        });
      }

      let resIds = girlData.getAllDisplayGrilPhotoId(
        this.category.toString(),
        this.id
      );
      this.refreshImgs(
        proto.cs.EnmResType.ERT_Image,
        this.category,
        this.id,
        resIds
      );

      // 刷新收藏按钮状态
      this.refreshAddFavoriteBtn();
    }
  }

  /**
   * 刷新收藏按钮状态
   */
  refreshAddFavoriteBtn() {
    if (!this.AddFavoriteBtn) {
      return;
    }

    const girlData = DataManager.I.getDataById<GirlData>(DataId.Girl);
    const isBookmarked = girlData.isBookmarkGirl(
      this.category.toString(),
      this.id
    );

    // 查找收藏按钮的状态节点（通常命名为 "selected" 或 "checked"）
    // 如果有这样的子节点，根据收藏状态显示/隐藏
    const selectedNode = this.AddFavoriteBtn.getChildByName("selected");
    if (selectedNode) {
      selectedNode.active = isBookmarked;
    }

    // 如果有未选中状态的节点
    const unselectedNode = this.AddFavoriteBtn.getChildByName("unselected");
    if (unselectedNode) {
      unselectedNode.active = !isBookmarked;
    }

    logger.log(
      `[GirlDetailPanel] 收藏按钮状态已刷新: girlId=${this.id}, isBookmarked=${isBookmarked}`
    );
  }

  bindImgToggle() {
    const girlData = DataManager.I.getDataById<GirlData>(DataId.Girl);
    let resIds = girlData.getAllDisplayGrilPhotoId(
      this.category.toString(),
      this.id
    );
    this.refreshImgs(
      proto.cs.EnmResType.ERT_Image,
      this.category,
      this.id,
      resIds
    );
  }

  bindVideoToggle() {
    const girlData = DataManager.I.getDataById<GirlData>(DataId.Girl);
    let resIds = girlData.getAllDisplayGrilVideoId(
      this.category.toString(),
      this.id
    );
    this.refreshImgs(
      proto.cs.EnmResType.ERT_Video,
      this.category,
      this.id,
      resIds
    );
  }

  refreshImgs(
    type: proto.cs.EnmResType,
    category: number,
    id: number,
    resIds: number[]
  ) {
    for (let i = this.imgsLayout.children.length - 1; i >= 0; i--) {
      DetailImageItemPool.Instance.put(this.imgsLayout.children[i]);
    }

    let count = resIds.length;
    for (let i = 0; i < count; i++) {
      let newNode = DetailImageItemPool.Instance.get();
      if (newNode) {
        let item = newNode.getComponent(DetailImageItem);
        let resId = resIds[i];
        item.refresh(this, type, category, id, resId);
        newNode.active = true;
        this.imgsLayout.addChild(newNode);
      }
    }
  }

  OnClickChatBtn() {
    const girlData = DataManager.I.getDataById<GirlData>(DataId.Girl);

    //if (isRelease || isFree) {
    // 直接在当前页面打开ChatPanel作为子页面
    const currentPanel = NavigationManager.Instance.getCurrentActivePanelNode();
    if (currentPanel) {
      const chatData = { girlId: this.id, base: currentPanel };
      NavigationManager.Instance.openSubPanel(
        "ChatPanel",
        currentPanel,
        chatData,
        {
          openAnimation: PageTransitionType.NONE,
          closeAnimation: PageTransitionType.NONE,
          hideBasePanel: true,
        }
      );
    } else {
      logger.warn("[GirlDetailPanel] 无法获取当前激活的主页面");
    }
    // } else {
    //   //未解锁
    //   NavigationManager.Instance.openPopupPanel("GirlListPopupPanel", {
    //     base: this,
    //     category: this.category,
    //     id: this.id,
    //   });
    // }
  }

  /**
   * 点击收藏按钮
   */
  async OnClickAddFavoriteBtn() {
    // 防止重复点击
    if (this.isRequestingBookmark) {
      logger.warn("[GirlDetailPanel] 收藏请求进行中，请稍候");
      return;
    }

    const girlData = DataManager.I.getDataById<GirlData>(DataId.Girl);
    const isBookmarked = girlData.isBookmarkGirl(
      this.category.toString(),
      this.id
    );

    logger.log(
      `[GirlDetailPanel] 点击收藏按钮: girlId=${this.id}, 当前状态=${
        isBookmarked ? "已收藏" : "未收藏"
      }`
    );

    try {
      this.isRequestingBookmark = true;

      // 调用收藏接口
      const reqData = {
        girlId: this.id,
        cancel: isBookmarked, // true=取消收藏, false=添加收藏
      };
      const res = await GirlService.I.reqBookmarkGirl(reqData);

      if (res && res.code === proto.cs.EnmRetCode.SUCCESS) {
        // 更新本地收藏时间
        if (isBookmarked) {
          // 取消收藏：设置为0
          girlData.setBookmarkTime(this.category.toString(), this.id, 0);
          logger.log(`[GirlDetailPanel] 取消收藏成功: girlId=${this.id}`);
        } else {
          // 添加收藏：设置为当前时间戳（秒）
          const currentTimestamp = Math.floor(Date.now() / 1000);
          girlData.setBookmarkTime(
            this.category.toString(),
            this.id,
            currentTimestamp
          );
          logger.log(
            `[GirlDetailPanel] 添加收藏成功: girlId=${this.id}, timestamp=${currentTimestamp}`
          );
        }

        // 刷新按钮状态
        this.refreshAddFavoriteBtn();

        // TODO: 可以在这里添加UI提示，比如显示Toast
        // Utils.showToast(isBookmarked ? "已取消收藏" : "收藏成功");
      } else {
        logger.warn(
          `[GirlDetailPanel] 收藏操作失败: girlId=${this.id}, code=${res?.code}`
        );
        // TODO: 显示错误提示
        // Utils.showToast("操作失败，请稍后重试");
      }
    } catch (error) {
      logger.error(`[GirlDetailPanel] 收藏操作异常: girlId=${this.id}`, error);
      // TODO: 显示错误提示
      // Utils.showToast("网络错误，请稍后重试");
    } finally {
      this.isRequestingBookmark = false;
    }
  }

  returnBtn() {
    // GirlDetailPanel现在是subpanel，关闭自己即可
    NavigationManager.Instance.closeSubPanel(this);
  }

  /**
   * 面板关闭时的清理工作
   */
  onClose() {
    // 停止视频播放，释放资源
    if (this.videoLayer) {
      this.videoLayer.stop();
      logger.log("GirlDetailPanel: 停止视频播放");
    }

    super.onClose();
  }

  /**
   * 检测节点是否在屏幕可见区域内
   * @param node 要检测的节点
   * @returns 是否在屏幕内
   */
  private isNodeInScreen(node: Node): boolean {
    if (!node) return false;

    const uiTransform = node.getComponent(UITransform);
    if (!uiTransform) return false;

    // 获取屏幕尺寸
    const screenSize = screen.windowSize;
    const designResolution = view.getDesignResolutionSize();

    // 获取节点的世界坐标
    const worldPos = uiTransform.convertToWorldSpaceAR(Vec3.ZERO);

    // 获取节点的尺寸
    const nodeSize = uiTransform.contentSize;

    // 计算节点的边界
    const left = worldPos.x - nodeSize.width * uiTransform.anchorX;
    const right = worldPos.x + nodeSize.width * (1 - uiTransform.anchorX);
    const bottom = worldPos.y - nodeSize.height * uiTransform.anchorY;
    const top = worldPos.y + nodeSize.height * (1 - uiTransform.anchorY);

    // 检测是否完全在屏幕内
    const isInScreen =
      left >= 0 &&
      right <= designResolution.width &&
      bottom >= 0 &&
      top <= designResolution.height - 160;

    return isInScreen;
  }

  /**
   * 实时更新ImgVidSelect跟随ImgVidFakePos的逻辑
   */
  lateUpdate(dt: number) {
    if (!this.ImgVidSelect || !this.ImgVidFakePos) {
      return;
    }

    // 检测ImgVidFakePos是否在屏幕内
    const isInScreen = this.isNodeInScreen(this.ImgVidFakePos);

    if (isInScreen) {
      // 在屏幕内，开始或继续跟随
      if (!this.isFollowing) {
        this.isFollowing = true;
        logger.log("ImgVidSelect开始跟随ImgVidFakePos");
      }

      // 更新ImgVidSelect的位置到ImgVidFakePos的位置
      this.ImgVidSelect.worldPosition =
        this.ImgVidFakePos.worldPosition.clone();
      this.lastFakePosPosition = this.ImgVidFakePos.worldPosition.clone();
    } else {
      // 超出屏幕，停止跟随
      if (this.isFollowing) {
        this.isFollowing = false;
        logger.log("ImgVidSelect停止跟随ImgVidFakePos（超出屏幕）");
        // ImgVidSelect保持在最后的跟随位置
      }
    }
  }

  /**
   * 面板销毁时的清理工作
   */
  onDestroy() {
    // 确保视频资源被释放
    if (this.videoLayer) {
      this.videoLayer.stop();
      logger.log("GirlDetailPanel: 销毁时停止视频播放");
    }

    // 回收所有使用中的节点到对象池
    // for (let i = this.imgsLayout.children.length - 1; i >= 0; i--) {
    //   DetailImageItemPool.Instance.put(this.imgsLayout.children[i]);
    // }

    super.onDestroy();
  }
}