export class DialogSelect extends Dialog {
  static extractIdNameImg(it) { return { id: it.id, name: it.name, img: it.img } }

  static async select(selectionData, onSelectChoice) {
    const html = await renderTemplate("systems/foundryvtt-reve-de-dragon/templates/dialog-select.html", selectionData)

    const dialogData = {
      title: selectionData.title ?? selectionData.label,
      content: html,
      buttons: {}
    }

    const dialogOptions = {
      classes: ["rdd-dialog-select"],
      width: 'fit-content',
      height: 'fit-content',
      'max-height': 600,
      'z-index': 99999
    }
    new DialogSelect(dialogData, dialogOptions, selectionData, onSelectChoice).render(true)
  }

  constructor(dialogData, dialogOptions, selectionData, onSelectChoice) {
    super(dialogData, dialogOptions)
    this.selectionData = selectionData
    this.onSelectChoice = onSelectChoice
  }

  activateListeners(html) {
    super.activateListeners(html)
    this.html = html
    this.html.find("li.select-choice").click(event =>
      this.choiceSelected(this.html.find(event.currentTarget)?.data("id"))
    )
  }

  choiceSelected(selectedId) {
    const selected = this.selectionData.list.find(it => it.id == selectedId)
    this.close()
    if (selected) {
      this.onSelectChoice(selected)
    }
  }
}