vote-page.js

// Imports
import * as DeskRound from "/components/vote/desk-round.js";
import * as Vote from "/components/vote/votes.js";

// DOM elements

export async function mount(where) {
  const votePage = new VotePage();
  await votePage.mount(where);
}

class VotePage {
  constructor() {}

  async mount(where) {
    const mountpoint = where;
    document.getElementById(mountpoint).innerHTML = /* HTML */ `
      <section style="margin-bottom: 230px;">
        <div class="container"><div id="vote-section" class="card-no-hover"></div></div>
      </section>
    `;
    this.deskRoundHandler = await DeskRound.mount("vote-section", this);
    this.voteHandler = await Vote.mount(this);
    this.handleDom();
  }

  handleDom() {
    let deskRoundHandler = this.deskRoundHandler
    document.addEventListener(
      "input",
      function (event) {
        if (event.target.id === "election-select") {
          deskRoundHandler.ElectionID = event.target.value;
          deskRoundHandler.clearRounds();
          deskRoundHandler.clearAreas();
          deskRoundHandler.clearSections();
          deskRoundHandler.loadRounds();
        }
        if (event.target.id === "round-select") {
          deskRoundHandler.RoundID = event.target.value;
          deskRoundHandler.clearAreas();
          deskRoundHandler.clearSections();
          deskRoundHandler.loadAreas();
        }
        if (event.target.id === "area-select") {
          deskRoundHandler.AreaID = event.target.value;
          deskRoundHandler.clearSections();
          deskRoundHandler.loadSections();
        }
        if (event.target.id === "section-select") {
          deskRoundHandler.SectionID = event.target.value;
        }
        deskRoundHandler.loadDesks();
      },
      false
    );
  }

  async refreshVotes() {
    this.voteHandler = await Vote.mount(this);
  }
}