import { _decorator, Component, instantiate, Node, Vec3 } from "cc";
import { DemoManager } from "./DemoManager";
import { DialogBubble } from "./DialogBubble";
import { Dialog } from "./DemoData";
const { ccclass, property } = _decorator;

const BUTTOM_Y = -346.354;

@ccclass("ChatContentsLayout")
export class ChatContentsLayout extends Component {
  @property(DemoManager)
  manager: DemoManager = null;

  @property(DialogBubble)
  lBubble: DialogBubble = null;
  @property(DialogBubble)
  rBubble: DialogBubble = null;

  bubbles: DialogBubble[] = [];

  protected start(): void {
    this.lBubble.node.active = false;
    this.rBubble.node.active = false;
    this.manager.layoutout = this;
  }

  UpdateDialog(dialogs: Dialog[]) {
    //if (!this.bubbles) this.bubbles = [];
    for (let i = this.bubbles.length - 1; i >= 0; i--) {
      if (this.bubbles[i].node) {
        this.bubbles[i].node.destroy();
      }
    }
    this.bubbles = [];
    let initPosY: number = BUTTOM_Y;
    for (let i = dialogs.length - 1; i >= 0; i--) {
      const dialog = dialogs[i]; //倒序

      let newBubbleNode = dialog.isPlayer
        ? instantiate(this.rBubble.node)
        : instantiate(this.lBubble.node);
      let newBubble = newBubbleNode.getComponent(DialogBubble);

      newBubbleNode.setParent(this.node);
      newBubble.node.active = true;
      let pos = newBubble.node.position;
      newBubble.node.position = new Vec3(pos.x, initPosY, pos.z);

      let offset = newBubble.updateBubbleContent(dialog.content);
      initPosY += offset + 40;
      this.bubbles.push(newBubble);
    }
  }
}