Skip to content

Map Plus/Minus to Intuitive Zoom Controls #3

@rsthornton

Description

@rsthornton

Description

The keyboard zoom mapping in the Leptos key handler is inverted. Update the mapping so plus/equal zooms in and minus/underscore zooms out. Ensure the Controls menu text matches.

File Pointers

  • Key handler: bert/bert/src/leptos_app/mod.rs (container around the Bevy canvas; id="bevy-container", tabindex="0")
  • Controls menu text: bert/bert/src/leptos_app/components/controls_menu.rs

Tasks

  • Update keydown handler mapping:
    • - or _ → send ZoomOut
    • = or + → send ZoomIn
  • Also handle numpad keys: NumpadSubtractZoomOut, NumpadAddZoomIn
  • Keep ev.prevent_default() so browser page zoom doesn’t trigger when the canvas is focused
  • Update labels in controls_menu.rs to reflect the same mapping
  • Verify no regressions to mouse wheel zoom or theme toggle

Acceptance Criteria

  • Pressing -/_ zooms OUT; pressing =/+ zooms IN (including numpad +/-)
  • Controls menu labels: Zoom Out = - key; Zoom In = = key
  • Behavior validated on Chrome, Firefox, and Safari
  • No changes to existing mouse wheel zoom logic or Ctrl/Option+B theme toggle
  • When the canvas container is focused, browser page zoom is prevented for these keys

Manual Test Checklist

  • Click on the canvas area to focus (container must have tabindex="0")
  • Press - repeatedly: the view zooms out smoothly
  • Press = repeatedly: the view zooms in smoothly
  • Press numpad - and +: behavior matches above
  • Open Controls menu and verify labels match behavior
  • Use mouse wheel + modifier and confirm unchanged behavior
  • With canvas focused, verify the browser does not page‑zoom when using =/+ or -/_

Metadata

Metadata

Assignees

No one assigned

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions