.d-flex.flex-column style="height: calc(100vh - 180px)"
  .d-flex.flex-row.justify-content-center.mb-5
    - @contest.puzzles.each do |puzzle|
      = image_tag(puzzle.image, class: "img-fluid ms-3 me-3", style: "max-height: 220px") if puzzle.image.attached?
  
  javascript:
    function refresh() {
      const el = document.querySelector('input[type="checkbox"]');
      if (el.checked) location.replace("/public/#{@contest.friendly_id}?refresh=1")
      setTimeout(refresh, 5000);
    }

    / const params = new URL(document.location.toString()).searchParams;
    / if (params.get("refresh") == "1") {
    /   const el = document.querySelector('input[type="checkbox"]');
    /   el.checked = true;
    / }

    / setTimeout(refresh, 5000);

  .mb-3 style="display: inline-flex"
    a.btn.btn-primary href="/public/#{@contest.friendly_id}"
      = t("helpers.buttons.refresh")

  / = form_with model: Contest do |form|
  /   .row.mb-3
  /     .col
  /       .form-check.form-switch
  /         = form.check_box :refresh, class: "form-check-input"
  /         = form.label t("contests.scoreboard.refresh")

  .d-flex.flex-column style="overflow-y: auto"
    table.table.table-striped.table-hover
      thead
        tr
          th scope="col"
            = t("helpers.rank")
          th scope="col"
            = t("activerecord.attributes.contestant.name")
          - if @contest.puzzles.size > 1
            th scope="col"
              = t("activerecord.attributes.contestant.completions")
          th scope="col"
            = t("activerecord.attributes.contestant.display_time")
      tbody
        - @contestants.each_with_index do |contestant, index|
          tr scope="row"
            td
              = index + 1
            td
              = contestant.name
            - if @contest.puzzles.size > 1
              td
                = contestant.completions.length
            td
              = contestant.display_time