From 7c80109b0c42e98ab6b3abbc0341f0aa4ec99c67 Mon Sep 17 00:00:00 2001 From: "google-labs-jules[bot]" <161369871+google-labs-jules[bot]@users.noreply.github.com> Date: Thu, 16 Apr 2026 09:03:36 +0000 Subject: [PATCH] =?UTF-8?q?=F0=9F=A7=B9=20[UI/UX]=20Remove=20obsolete=20Mo?= =?UTF-8?q?saic=20Config=20step?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Removed the intermediate step-options sidebar during the image upload and cropping process. The config step is 100% duplicated on the Build Plan tab, so this change simplifies the user flow to jump straight from Apply Crop to the generated mosaic result. * Removed `#step-options` HTML and associated CSS. * Removed visibility manipulation logic from `app.js`. * Updated `applyCrop()` to call `generateMosaic()` directly. * Fixed a `test_process_base64_preview` test typo from `service_test.py` that was failing. Co-authored-by: amura2406 <2832238+amura2406@users.noreply.github.com> --- backend/features/project/service_test.py | 12 +- docs/backlog.md | 5 +- frontend/app.js | 28 +--- frontend/index.html | 173 ----------------------- frontend/styles.css | 13 -- 5 files changed, 8 insertions(+), 223 deletions(-) diff --git a/backend/features/project/service_test.py b/backend/features/project/service_test.py index 6e0e375..9ec1d81 100644 --- a/backend/features/project/service_test.py +++ b/backend/features/project/service_test.py @@ -23,7 +23,7 @@ def test_count_projects(): res = service.count_projects("user_123") assert res == 5 -def test_process_base64_preview(): +def test_process_base64_images(): service = ProjectService(MockDatabaseProvider(), MockStorageProvider()) # 1x1 transparent PNG @@ -39,10 +39,10 @@ def test_process_base64_preview(): mosaic_data={} ) - service.process_base64_preview(req, "user_123") + service.process_base64_images(req, "user_123") assert req.mosaic_preview_url == "https://storage.mock/mosaics/preview.png" -def test_process_base64_preview_invalid(): +def test_process_base64_images_invalid(): service = ProjectService(MockDatabaseProvider(), MockStorageProvider()) req = SaveProjectRequest( @@ -55,10 +55,10 @@ def test_process_base64_preview_invalid(): mosaic_data={} ) - service.process_base64_preview(req, "user_123") + service.process_base64_images(req, "user_123") assert req.mosaic_preview_url == "" -def test_process_base64_preview_not_data_image(): +def test_process_base64_images_not_data_image(): service = ProjectService(MockDatabaseProvider(), MockStorageProvider()) req = SaveProjectRequest( @@ -71,5 +71,5 @@ def test_process_base64_preview_not_data_image(): mosaic_data={} ) - service.process_base64_preview(req, "user_123") + service.process_base64_images(req, "user_123") assert req.mosaic_preview_url == "https://example.com/normal_image.png" diff --git a/docs/backlog.md b/docs/backlog.md index d4eb0eb..d612a02 100644 --- a/docs/backlog.md +++ b/docs/backlog.md @@ -27,10 +27,6 @@ - [ ] **Center Mosaic Canvas Vertically and Horizontally** - **Description**: The mosaic canvas is centered horizontally but not vertically within the canvas wrapper. Fix the layout so the mosaic is centered on both axes, and ensure centering is preserved when zooming in/out via the slider. - **Context**: The parent flex container lacks proper height constraints for vertical centering to work. `applyZoom()` also needs adjustment to maintain centering during zoom changes. -- [ ] **Remove Obsolete Mosaic Config Step** - - **Description**: Delete the "Mosaic Config" sidebar step (`step-options`) that appears between cropping and mosaic generation. All config controls already exist in the Quick Config panel on the build-plan page. After cropping, the flow should go directly to generating the mosaic with default config. - - **Impact**: Simpler user flow (crop → auto-generate → view), one fewer navigation step. - - **Context**: The step-options sidebar (Color Mode, Dithering, Image Adjustments, Gradient) is 100% duplicated in the Quick Config panel on the build-plan tab. ### Architecture Improvements - [ ] **Eliminate Redundant Base64 Mosaic Payloads** @@ -71,3 +67,4 @@ | **Zoom Slider UI Cutoff** | 2026-04-16 | Redesigned the zoom popover into a narrow 40px-wide vertical layout: rotated the `` 90° and gave it `position:absolute` inside a fixed-height wrapper so it never expands the flex parent. Removed stale `#zoom-popover { min-width:220px }` CSS that was overriding layout, added dark-theme custom track/thumb styling, updated JS toggle to `style.display='flex'` (not `hidden` class), and finally changed popover anchor from `bottom-full mb-2` to `top-full mt-2` so it opens downward into the canvas instead of upward into the navigation bar. | | **Eliminate CustomEvent Bridges** | 2026-04-15 | Removed all 5 `window.dispatchEvent(new CustomEvent(...))` bridges that existed between `app.js` and Alpine templates. Added `setsLoading`, `recentImages`, `recentLoading`, `recentError`, `projects`, `projectsError`, and `projectsVisible` directly to `Alpine.store('app')`. Templates for sets-grid, cart footer, recent-uploads-grid, compare-mode-view, and projects-grid now read from `$store.app.*` directly, making state flow entirely reactive and unidirectional. | +| **Remove Obsolete Mosaic Config Step** | 2026-04-16 | Removed ` diff --git a/frontend/styles.css b/frontend/styles.css index cd331e3..d1088fe 100644 --- a/frontend/styles.css +++ b/frontend/styles.css @@ -497,11 +497,6 @@ } /* Editor sidebar: full-width stacked below canvas */ - #step-options { - max-height: 60vh; - border-top: 1px solid var(--md-sys-color-outline-variant, #45364c); - border-left: none; - } /* Comparison slider needs full width */ .comparison-slider-container { @@ -522,11 +517,6 @@ } /* Editor sidebar: stacked below in portrait */ - #step-options { - max-height: 50vh; - border-top: 1px solid var(--md-sys-color-outline-variant, #45364c); - border-left: none; - } } /* iPad landscape and larger (≥1024px) — side-by-side layout */ @@ -537,9 +527,6 @@ } /* Editor sidebar is side-by-side on large screens */ - #step-options { - max-height: none; - } } /* Desktop (≥1280px) */