From 175cbb91bf451ad2fe2c5c13aad370530e51f11f Mon Sep 17 00:00:00 2001 From: Dillard Blom Date: Sat, 11 Jul 2026 02:09:58 +0200 Subject: [PATCH] Fase 3 feedback round 2: live color preview, bigger top icon, dashboard links - Style preview now updates immediately when picking a color via the colorpicker widget. It sets the input value through jQuery's synthetic trigger(), which a native addEventListener('change', ...) never sees - bound the listener through jQuery instead so both native and colorpicker-driven changes refresh the preview. - Icon-above-QR max height raised from 25% to 62.5% of QR height (~2.5x bigger per feedback); the existing 60%-width cap now becomes the practical limit for most icons. Verified generated QR still decodes. - Dashboard's "Dynamic Qr codes" and "Static QR codes" info-boxes now link to their list pages. "Total qr codes"/"Total Scans" left as-is - no combined-list or scan-report page exists yet to link them to. - Random-style button now has a "Randomize" label to match its row-mates (Load preset/Save as preset/Style preview), instead of an empty spacer. Co-Authored-By: Claude Sonnet 5 Claude-Session: https://claude.ai/code/session_01Fo3DiRRpmz2DXjD7Uzhc8u --- src/dist/js/qrcode-style-tools.js | 15 ++++++++++++--- src/forms/qrcode_options.php | 2 +- src/index.php | 32 +++++++++++++++++-------------- src/lib/Qrcode/Qrcode-intchil.php | 2 +- src/lib/Qrcode/Qrcode.php | 2 +- 5 files changed, 33 insertions(+), 20 deletions(-) diff --git a/src/dist/js/qrcode-style-tools.js b/src/dist/js/qrcode-style-tools.js index 7efc934..39abe1f 100644 --- a/src/dist/js/qrcode-style-tools.js +++ b/src/dist/js/qrcode-style-tools.js @@ -95,9 +95,18 @@ }); document.querySelectorAll('#foreground, #background').forEach(function (input) { - input.addEventListener('change', function () { - updateStylePreview(scopeOf(input)); - }); + // bootstrap-colorpicker sets the value and fires 'change' via jQuery's + // synthetic .trigger(), which a native addEventListener never sees - so the + // preview only updates via jQuery's event binding, not the native one below. + if (window.jQuery) { + jQuery(input).on('change', function () { + updateStylePreview(scopeOf(input)); + }); + } else { + input.addEventListener('change', function () { + updateStylePreview(scopeOf(input)); + }); + } }); document.querySelectorAll('select[name="level"]').forEach(function (select) { diff --git a/src/forms/qrcode_options.php b/src/forms/qrcode_options.php index 7f1507e..7c69790 100644 --- a/src/forms/qrcode_options.php +++ b/src/forms/qrcode_options.php @@ -58,7 +58,7 @@ if (QRCODE_GENERATOR === "internal-chillerlan.qrcode") {
- + diff --git a/src/index.php b/src/index.php index 50dcbe9..da61637 100644 --- a/src/index.php +++ b/src/index.php @@ -120,29 +120,33 @@ foreach ($createdQrcode_static as $row) {
-
- + +
+ -
- Dynamic Qr codes - -
-
+
+ Dynamic Qr codes + +
+
+
-
- + +
+ -
- Static QR codes - -
+
+ Static QR codes + +
-
+
+
diff --git a/src/lib/Qrcode/Qrcode-intchil.php b/src/lib/Qrcode/Qrcode-intchil.php index dfd942a..9b0d62b 100644 --- a/src/lib/Qrcode/Qrcode-intchil.php +++ b/src/lib/Qrcode/Qrcode-intchil.php @@ -174,7 +174,7 @@ class Qrcode { $iconWidth = imagesx($icon); $iconHeight = imagesy($icon); - $maxIconHeight = (int) ($height * 0.25); + $maxIconHeight = (int) ($height * 0.625); $scale = min($maxIconHeight / $iconHeight, ($width * 0.6) / $iconWidth, 1); $targetWidth = max(1, (int) ($iconWidth * $scale)); $targetHeight = max(1, (int) ($iconHeight * $scale)); diff --git a/src/lib/Qrcode/Qrcode.php b/src/lib/Qrcode/Qrcode.php index b338414..d49e447 100644 --- a/src/lib/Qrcode/Qrcode.php +++ b/src/lib/Qrcode/Qrcode.php @@ -159,7 +159,7 @@ class Qrcode { $iconWidth = imagesx($icon); $iconHeight = imagesy($icon); - $maxIconHeight = (int) ($height * 0.25); + $maxIconHeight = (int) ($height * 0.625); $scale = min($maxIconHeight / $iconHeight, ($width * 0.6) / $iconWidth, 1); $targetWidth = max(1, (int) ($iconWidth * $scale)); $targetHeight = max(1, (int) ($iconHeight * $scale));