import { fabric } from 'fabric';
import cameraActiveImg from '@/assets/camera/camera-active.png';
import cameraImg from '@/assets/camera/camera.png';
import favoritesImg from '@/assets/camera/favorites.png';
import { getRandomPosition } from './utils';
import { CameraImage } from './types';

class CameraGroup extends fabric.Group {
  g: fabric.Group | null = null;
  cameraImg: CameraImage | null = null;
  favImg: CameraImage | null = null;
  cameraId = '';

  constructor() {
    super();
    fabric.Image.fromURL(cameraActiveImg, (cImg) => {
      cImg.set({
        left: 0,
        top: 0,
      });
      this.cameraImg = cImg;
      fabric.Image.fromURL(favoritesImg, (favImg) => {
        favImg.set({
          left: 50,
          top: 0,
        });
        this.favImg = favImg as CameraImage;
        this.g = new fabric.Group([cImg, favImg]);
      });
    });
  }

  init() {}

  /** 提供copy功能，每次新建的时候执行copy就行了 */
  clone(): Promise<CameraGroup> {
    console.log('clone');
    return new Promise((resolve) => {
      this.g?.clone((e) => {
        console.log('clone', e);
        resolve(e as CameraGroup);
      });
    });
  }

  setSelected() {
    this.cameraImg?.setSrc(cameraActiveImg);
  }

  setUnSelected() {
    this.cameraImg?.setSrc(cameraImg);
  }
  /** 设为默认摄像头 */
  setDefault() {
    this.favImg?.set('visible', true);
  }
  /** 取消默认摄像头 */
  cancelDefault() {
    this.favImg?.set('visible', false);
  }

  setAttr(attr: { cameraId: string; left: number; top: number }) {
    if (attr.cameraId) {
      this.cameraId = attr.cameraId;
    }
    this.g?.set(attr);
    return this.g;
  }
}

export default CameraGroup;