From c34b9654c86ad6315d8c5ed32e8e7451c6ad69e6 Mon Sep 17 00:00:00 2001
From: sto <puz.github.sto.happiness841@passmail.net>
Date: Wed, 25 Jun 2025 08:00:49 +0200
Subject: [PATCH] Client side puzzle image size validation

---
 app/views/puzzles/_form.html.slim | 18 +++++++++++++++++-
 config/locales/en.yml             |  1 +
 config/locales/fr.yml             |  1 +
 3 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/app/views/puzzles/_form.html.slim b/app/views/puzzles/_form.html.slim
index 5b7defb..70de990 100644
--- a/app/views/puzzles/_form.html.slim
+++ b/app/views/puzzles/_form.html.slim
@@ -20,8 +20,24 @@
       .form-text.mb-1
         = t("puzzles.image_select")
       = form.file_field :image, accept: "image/*", class: "form-control"
+      .form-text.error-message style="display: none;" id="image-error-message"
+        = t("puzzles.form.file_too_big")
+      javascript:
+        function setMaxUploadSize() {
+          const el = document.querySelector('input[type="file"]');
+          el.onchange = function() {
+            if(this.files[0].size > 2 * 1024 * 1024) {
+              document.getElementById('image-error-message').style.display = 'block';
+              this.value = "";
+            } else {
+              document.getElementById('image-error-message').style.display = 'none';
+            }
+          };
+        }
+
+        setMaxUploadSize();
   .row.mt-4
     .col
       - if method == :patch
-        = link_to "Delete", contest_puzzle_path(contest, puzzle), data: { turbo_method: :delete }, class: "btn btn-danger me-2"
+        = link_to t("helpers.buttons.delete"), contest_puzzle_path(contest, puzzle), data: { turbo_method: :delete }, class: "btn btn-danger me-2"
       = form.submit submit_text, class: "btn btn-primary"
\ No newline at end of file
diff --git a/config/locales/en.yml b/config/locales/en.yml
index e9820b3..3fc63ed 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -211,6 +211,7 @@ en:
       title: Edit contest puzzle
     form:
       fake_data_recommendation: It is recommended to first enter a fake name and image, and to use the real ones only once the contest starts.
+      file_too_big: File too big! Maximum allowed size is 2M
     image_select: Select an image
     new:
       notice: Puzzle added
diff --git a/config/locales/fr.yml b/config/locales/fr.yml
index 6566895..2f4a3c2 100644
--- a/config/locales/fr.yml
+++ b/config/locales/fr.yml
@@ -182,6 +182,7 @@ fr:
       title: Modifier le puzzle
     form:
       fake_data_recommendation: Il est recommendé d'entrer de faux noms et images, et de mettre les vrais uniquement quand le concours démarre.
+      file_too_big: La taille de l'image dépasse la taille maximum autorisée de 2M
     image_select: Choisis une image
     new:
       notice: Puzzle ajouté