import { _decorator, Button, Component, Node, NodeEventType, Sprite } from "cc";
const { ccclass, property } = _decorator;

@ccclass("SimpleToggle")
export class SimpleToggle extends Component {
  @property(Sprite)
  selectedSprite: Sprite = null;
  @property(Sprite)
  unSelectedSprite: Sprite = null;

  callback: () => {};

  toggleGroupCallBack: Function;

  btn: Button;
  protected onLoad(): void {
    this.node.on(NodeEventType.TOUCH_START, this.onClickThis, this);
    this.btn = this.getComponent(Button);
  }

  init(isSelected: boolean, callBack: () => {}) {
    this.selectedSprite.node.active = isSelected;
    this.unSelectedSprite.node.active = !isSelected;
    if (this.callback) {
      this.onDestroy();
    }
    this.callback = callBack;

    this.node.on(NodeEventType.TOUCH_START, this.onClickThis, this);
  }

  refresh(isSelected: boolean) {
    this.selectedSprite.node.active = isSelected;
    this.unSelectedSprite.node.active = !isSelected;
  }

  onClickThis() {
    if (this.callback) {
      this.callback();
    }
    if (this.toggleGroupCallBack) {
      this.toggleGroupCallBack(this.node);
    }
    this.btn.interactable = false;
  }

  protected onDestroy(): void {
    this.node.off(NodeEventType.TOUCH_START, this.onClickThis, this);

    this.callback = null;
  }
}