import { StateRoot } from "queenjs/framework";

export type ShowItem = {
  id: string;
  name: string;
  url: string;
  x: number;
  y: number;
  z: number;
  w: number;
  h: number;
  opacity: number;

  currX: number;
  currY: number;

  offsetX: number;
  offsetY: number;
  offsetZ: number;
  padding: number;

  show: boolean;
  timer: any;
  img: any;
};

export type Dialog = {
  id: number;
  width: number;
  height: number;
  x: number;
  y: number;
  show: boolean;
  dataId: string;
  itemIndex: number;
};

export default class extends StateRoot {
  items: ShowItem[] = [];
  scrollOffset = 0; //屏幕滚动值
  scrollType = "horizontal"; // 滚动方式 vertical horizontal
  // paddingH = 30; //上下的行距
  // paddingW = 10; //左右的行距
  totalRow = 8; //行数或列数
  dialogs: Dialog[] = [];
  parentWidth = 0;
  parentHeight = 0;
  itemTotalSize = 0;
  disperseX = 0;
  disperseY = 0;

  rowCount = this.computed((state) => {
    return state.items.length / this.totalRow;
  });

  repeatWidth = this.computed((state) => {
    return state.itemTotalSize - state.parentHeight;
  });
}
