Add refresh button for the scoreboard

app/views/contests/scoreboard.html.slim

@@ -1,7 +1,33 @@
 .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 m-3", style: "max-height: 256px") if puzzle.image.attached?
+      = 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

config/locales/en.yml

@@ -135,6 +135,7 @@ en:
       notice: Contest added
       title: New jigsaw puzzle contest
     scoreboard:
+      refresh: Activate auto-refresh (every 5s)
       title: "%{name}"
     show:
       title: "%{name}"
@@ -187,6 +188,7 @@ en:
       edit: "Edit"
       import: CSV Import
       open: Open
+      refresh: Refresh
       sign_in: Sign in
       save: Save
     field: Field

config/locales/fr.yml

@@ -106,6 +106,7 @@ fr:
       notice: Concours ajouté
       title: Nouveau concours
     scoreboard:
+      refresh: Activer le rafraichissement automatique de la page (toutes les 5s)
       title: "%{name}"
     show:
       title: "%{name}"
@@ -158,6 +159,7 @@ fr:
       edit: "Modifier"
       import: Importer un CSV
       open: Détails
+      refresh: Rafraîchir
       sign_in: Se connecter
       save: Modifier
     field: Champ