Skip to content

Add fullscreen image overlay for voting images - #68

Closed
IvoLeist wants to merge 1 commit into
mainfrom
codex/add-fullscreen-overlay-for-images
Closed

Add fullscreen image overlay for voting images#68
IvoLeist wants to merge 1 commit into
mainfrom
codex/add-fullscreen-overlay-for-images

Conversation

@IvoLeist

Copy link
Copy Markdown
Contributor

Motivation

  • Provide a way to view voting images fullscreen to inspect details without leaving the voting workflow.
  • Support quick access via a small toggle button, double-click on the image, and Escape or overlay controls to close the fullscreen view.

Description

  • Added image-overlay.js to the JS includes in votingUI so the overlay behaviour is loaded (panzoom.min.js, init-panzoom.js, hotkeys.js, image-overlay.js).
  • Injected a small overlay toggle button, overlay container, and overlay image into the voting image UI in output$voting_image_div with namespaced IDs (voting_image_overlay, voting_image_overlay_image) and ARIA attributes.
  • Implemented overlay styling and layout in inst/shiny-app/www/voting-styles.css including .image-overlay, .image-overlay-toggle, .image-overlay-close, and body.overlay-open to lock scrolling while open.
  • Implemented inst/shiny-app/www/js/image-overlay.js to open the overlay (syncing the displayed image src), close it via the close button, backdrop click, Escape key, and via double-click on the image.

Testing

  • Performed a local static preview test by writing tmp_overlay_preview.html, serving it with python -m http.server 8001, and running a Playwright script that opened the page, clicked the overlay toggle, waited, and saved a screenshot to artifacts/image-overlay.png, which completed successfully.
  • Verified the overlay markup renders in renderUI and the CSS/JS files are present under inst/shiny-app/www during the test run.

Codex Task

@IvoLeist

Copy link
Copy Markdown
Contributor Author

decided to use the Github Copilot implementation since this it is working now.
Never tested this suggestion by Codex

@IvoLeist IvoLeist closed this Jan 19, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant