// Imports
import * as Auth from "/services/auth/auth.js";
import * as RoundsCard from "/components/management/rounds-card.js";
import * as RoundDesks from "/components/management/round-desks.js";
import * as CandidateList from "/components/management/candidate-lists.js";

// DOM elements

export async function mount(where) {
  const roundComponent = new Round();
  await roundComponent.mount(where);
}

class Round {
  constructor() {}

  async mount(where) {
    const mountpoint = where;
    document.getElementById(mountpoint).innerHTML = /* HTML */ `
      <div class="columns">
        <div class="column is-full">
          <div id="rounds-list" class="card">
            Liste des tours
          </div>
        </div>
        <div class="column" style="padding-right:40px;">
          <div id="round-desks" class="card card-list">
            Liste des bureaux d'un tour
          </div>
          <div id="candidate-lists" class="card card-list" ">
            Liste des listes de candidats d'un tour
          </div>
        </div>
      </div>

      <div class="modal" id="round-modal"></div>
      <div class="modal" id="capturers-modal"></div>
      <div class="modal" id="candidateList-modal"></div>
    `;
    this.roundsHandler = await RoundsCard.mount("rounds-list", this)
    this.deskRoundsHandler = await RoundDesks.mount("round-desks", this)
    this.candidateListHandler = await CandidateList.mount("candidate-lists", this)
  }
}