From ee05bf74b553fa70b46c877c8ae2ceeb4eae616f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mateusz=20Gruszczy=C5=84ski?= Date: Fri, 26 Sep 2025 23:25:13 +0200 Subject: [PATCH] sitche_form --- static/js/przelaczniki_zabezpieczenie.js | 79 ++++++++++++------------ templates/admin/formularz_zbiorek.html | 8 +-- 2 files changed, 44 insertions(+), 43 deletions(-) diff --git a/static/js/przelaczniki_zabezpieczenie.js b/static/js/przelaczniki_zabezpieczenie.js index a085735..182b99a 100644 --- a/static/js/przelaczniki_zabezpieczenie.js +++ b/static/js/przelaczniki_zabezpieczenie.js @@ -1,71 +1,74 @@ -// static/js/postepy_guard.js +// static/js/przelaczniki_zabezpieczenie.js (function () { 'use strict'; - function ready(fn) { + function onReady(cb) { if (document.readyState === 'loading') { - document.addEventListener('DOMContentLoaded', fn); + document.addEventListener('DOMContentLoaded', cb); } else { - fn(); + cb(); } } - ready(function () { + onReady(function () { var boxes = Array.prototype.slice.call( document.querySelectorAll('input.form-check-input[type="checkbox"][data-group="postepy"]') ); - if (!boxes.length) return; - var warning = document.getElementById('postepyWarning'); - function atLeastOneChecked() { - return boxes.some(function (b) { return b.checked; }); + if (!boxes.length || !warning) { + // Nic do zrobienia, brak elementów + return; } - function updateWarning() { - var show = !atLeastOneChecked(); - if (warning) { - warning.classList.toggle('d-none', !show); - if (show) { - // delikatny highlight - warning.classList.add('animate__animated', 'animate__headShake'); - setTimeout(function () { - warning.classList.remove('animate__animated', 'animate__headShake'); - }, 700); - } + function atLeastOneChecked() { + return boxes.some(function (b) { return !!b.checked; }); + } + + function showWarning(show) { + warning.classList.toggle('d-none', !show); + if (show) { + // dyskretny highlight + warning.classList.add('border', 'border-warning'); + warning.style.transition = 'box-shadow 0.2s ease'; + warning.style.boxShadow = '0 0 0.25rem rgba(255,193,7,.6)'; + setTimeout(function () { + warning.style.boxShadow = ''; + }, 300); } } - // Blokuj odznaczenie ostatniego i pokaż ostrzeżenie + function enforceAtLeastOne(e) { + // Jeżeli po zmianie byłaby 0/3, przywróć zaznaczenie klikniętego i pokaż ostrzeżenie + if (!atLeastOneChecked()) { + e.target.checked = true; + showWarning(true); + e.target.classList.add('is-invalid'); + setTimeout(function () { e.target.classList.remove('is-invalid'); }, 400); + return; + } + // Jeśli >=1, ostrzeżenie ukryj + showWarning(false); + } + + // Podpinka zdarzeń boxes.forEach(function (box) { - box.addEventListener('change', function () { - if (!atLeastOneChecked()) { - // przywróć zaznaczenie i pokaż ostrzeżenie - box.checked = true; - updateWarning(); - // krótka wizualna informacja na samym przycisku - box.classList.add('is-invalid'); - setTimeout(function(){ box.classList.remove('is-invalid'); }, 500); - return; - } - updateWarning(); - }); + box.addEventListener('change', enforceAtLeastOne); }); - // Walidacja przy submit — pokaż blok zamiast alertu + // Walidacja przy submit (na wszelki wypadek) var form = boxes[0].closest('form'); if (form) { form.addEventListener('submit', function (e) { if (!atLeastOneChecked()) { e.preventDefault(); - updateWarning(); - // focus na pierwszy przełącznik + showWarning(true); boxes[0].focus(); } }); } - // Inicjalny stan - updateWarning(); + // Inicjalny stan (np. po rerenderze z błędem) + showWarning(!atLeastOneChecked()); }); })(); diff --git a/templates/admin/formularz_zbiorek.html b/templates/admin/formularz_zbiorek.html index 5a126f2..ac20f0b 100644 --- a/templates/admin/formularz_zbiorek.html +++ b/templates/admin/formularz_zbiorek.html @@ -297,10 +297,6 @@
- -
- +