Add Alt + Wheel Zoom Shortcut & Fix Localization for Panning & Update zh-CN locale #1067

Qscy · 2025-09-11T01:49:23Z

✅ Pull Request: Add Alt + Wheel Zoom Shortcut & Fix Localization for Panning & Update zh-CN locale

📌 Summary

This PR introduces a new user-friendly zoom shortcut — Alt + Mouse Wheel — for zooming in/out on the canvas. Additionally, it:

Updates the zh-CN (Simplified Chinese) locale strings.
Fixes a localization-related bug in the panning extension that prevented proper locale loading.

✨ Features & Fixes

➕ New Feature:
Added support for Alt + Mouse Wheel to zoom in/out — improves UX for users familiar with design tools like Photoshop or Figma.
🌐 Localization Update:
Updated zh-CN locale strings to ensure accurate and natural translations.
🐞 Bug Fix:
Resolved an issue in the ext-panning module where locale strings failed to load correctly, causing display or functionality issues in non-English environments.

🧪 Testing

✅ Tested Alt + Wheel zoom on Windows/macOS — smooth and responsive.
✅ Verified zh-CN translations display correctly.
✅ Confirmed panning extension now respects current locale.

✅ Ready for review & merge.

Summary by Sourcery

Add an Alt+Mouse Wheel shortcut for canvas zooming and overhaul localization support across the editor, including panning extension fixes, zh-CN translation updates, and new layer view locale.

New Features:

Support zoom in/out via Alt + Mouse Wheel on the canvas

Bug Fixes:

Fix panning extension so it correctly loads and applies locale strings

Enhancements:

Revise zh-CN locale file for consistent formatting and improved translations
Add key hint labels and dynamic title generation to panning extension locales
Update zoom tool button shortcut to include Alt + Wheel in the UI
Add zh-CN locale for layer view extension and refine ext-polystar zh-CN title

sourcery-ai · 2025-09-11T01:49:29Z

Reviewer's Guide

This PR enhances zoom functionality by introducing an Alt + Mouse Wheel shortcut, corrects and extends localization support (especially for the panning extension and Simplified Chinese), and adds/refines locale entries for new extensions.

Sequence diagram for Alt + Mouse Wheel zoom event handling

sequenceDiagram
    actor User
    participant Workarea
    participant EditorStartup
    participant SvgCanvas
    participant UI
    User->>Workarea: wheel event (Alt key pressed)
    Workarea->>EditorStartup: wheel event handler
    EditorStartup->>SvgCanvas: setZoom(newZoom, true)
    EditorStartup->>UI: updateCanvas(true)
    EditorStartup->>UI: update zoom input value

Class diagram for EditorStartup zoom shortcut addition

classDiagram
    class EditorStartup {
      +workarea
      +svgCanvas
      +updateCanvas(force)
      +constructor()
      +wheel event handler (Alt + wheel)
    }
    EditorStartup --> SvgCanvas: uses
    EditorStartup --> UI: updates

File-Level Changes

Change	Details	Files
Add Alt + Mouse Wheel zoom shortcut	Hook wheel event on workarea to detect Alt key and adjust zoom level Prevent default scroll behavior and update zoom input value Update LeftPanel zoom button shortcut to include 'Alt + wheels'	`src/editor/EditorStartup.js` `src/editor/panels/LeftPanel.html`
Fix panning extension localization and dynamic title	Add 'key' hint entries to all ext-panning locale files Compute button title by concatenating localized title and key instead of hardcoded text	`src/editor/extensions/ext-panning/locale/en.js` `src/editor/extensions/ext-panning/locale/sv.js` `src/editor/extensions/ext-panning/locale/tr.js` `src/editor/extensions/ext-panning/locale/uk.js` `src/editor/extensions/ext-panning/locale/zh-CN.js` `src/editor/extensions/ext-panning/ext-panning.js`
Update Simplified Chinese locale strings	Switch all quotes to double quotes and standardize formatting Refine and correct translations across common, ui, properties, tools, config, notification sections	`src/editor/locale/lang.zh-CN.js`
Add locale for layer view extension	Introduce a new zh-CN locale file defining name and key for ext-layer_view	`src/editor/extensions/ext-layer_view/locale/zh-CN.js`
Refine Polystar extension Chinese title	Update ext-polystar zh-CN title from 'Polygone/Star Tool' to '多边形/星形工具'	`src/editor/extensions/ext-polystar/locale/zh-CN.js`

Tips and commands

Interacting with Sourcery

Trigger a new review: Comment @sourcery-ai review on the pull request.
Continue discussions: Reply directly to Sourcery's review comments.
Generate a GitHub issue from a review comment: Ask Sourcery to create an
issue from a review comment by replying to it. You can also reply to a
review comment with @sourcery-ai issue to create an issue from it.
Generate a pull request title: Write @sourcery-ai anywhere in the pull
request title to generate a title at any time. You can also comment
@sourcery-ai title on the pull request to (re-)generate the title at any time.
Generate a pull request summary: Write @sourcery-ai summary anywhere in
the pull request body to generate a PR summary at any time exactly where you
want it. You can also comment @sourcery-ai summary on the pull request to
(re-)generate the summary at any time.
Generate reviewer's guide: Comment @sourcery-ai guide on the pull
request to (re-)generate the reviewer's guide at any time.
Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
pull request to resolve all Sourcery comments. Useful if you've already
addressed all the comments and don't want to see them anymore.
Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
request to dismiss all existing Sourcery reviews. Especially useful if you
want to start fresh with a new review - don't forget to comment
@sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

Enable or disable review features such as the Sourcery-generated pull request
summary, the reviewer's guide, and others.
Change the review language.
Add, remove or edit custom review instructions.
Adjust other review settings.

Getting Help

Contact our support team for questions or feedback.
Visit our documentation for detailed guides and information.
Keep in touch with the Sourcery team by following us on X/Twitter, LinkedIn or GitHub.

sourcery-ai

Hey there - I've reviewed your changes and they look great!

Prompt for AI Agents

Please address the comments from this code review:
## Individual Comments

### Comment 1
<location> `src/editor/panels/LeftPanel.html:3` </location>
<code_context>
 <div id="tools_left">
     <se-button id="tool_select" title="tools.mode_select" src="select.svg"></se-button>
-    <se-button id="tool_zoom" title="tools.mode_zoom" src="zoom.svg" shortcut="Z"></se-button>
+    <se-button id="tool_zoom" title="tools.mode_zoom" src="zoom.svg" shortcut="Z / Alt + wheels"></se-button>
     <se-button id="tool_fhpath" title="tools.mode_fhpath" src="pencil.svg" shortcut="Q"></se-button>
     <se-button id="tool_line" title="tools.mode_line" src="pen.svg" shortcut="L"></se-button>
</code_context>

<issue_to_address>
Consider clarifying shortcut syntax for better user understanding.

Use a clearer shortcut label, such as 'Z or Alt + Mouse Wheel', to avoid confusion.
</issue_to_address>

<suggested_fix>
<<<<<<< SEARCH
    <se-button id="tool_zoom" title="tools.mode_zoom" src="zoom.svg" shortcut="Z / Alt + wheels"></se-button>
=======
    <se-button id="tool_zoom" title="tools.mode_zoom" src="zoom.svg" shortcut="Z or Alt + Mouse Wheel"></se-button>
>>>>>>> REPLACE

</suggested_fix>

Sourcery is free for open source - if you like our reviews please consider sharing them ✨

_{Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.}

sourcery-ai · 2025-09-11T01:50:10Z

src/editor/panels/LeftPanel.html

@@ -1,6 +1,6 @@
 <div id="tools_left">
    <se-button id="tool_select" title="tools.mode_select" src="select.svg"></se-button>
-    <se-button id="tool_zoom" title="tools.mode_zoom" src="zoom.svg" shortcut="Z"></se-button>


suggestion: Consider clarifying shortcut syntax for better user understanding.

Use a clearer shortcut label, such as 'Z or Alt + Mouse Wheel', to avoid confusion.

Suggested change

<se-button id="tool_zoom" title="tools.mode_zoom" src="zoom.svg" shortcut="Z"></se-button>

<se-button id="tool_zoom" title="tools.mode_zoom" src="zoom.svg" shortcut="Z or Alt + Mouse Wheel"></se-button>

need to pass linter

jfhenon · 2025-09-11T12:32:10Z

Please make sure your code pass the linter.

jfhenon

plz make sure the linter passes

Qscy · 2025-09-11T13:51:08Z

plz make sure the linter passes

Style issues fixed and linter passed — thanks for pointing them out.

jfhenon · 2025-09-11T17:48:08Z

Great addition - thanks

Qscy added 3 commits September 11, 2025 09:29

Add a new shortcut( Alt + wheels ) for zoom in/out

52c6541

update zh-CN locale

a95641c

Fix a ext-panning problem cound not fit locale

e503e58

sourcery-ai bot reviewed Sep 11, 2025

View reviewed changes

jfhenon previously approved these changes Sep 11, 2025

View reviewed changes

jfhenon self-requested a review September 11, 2025 12:32

jfhenon requested changes Sep 11, 2025

View reviewed changes

Style for passing linter

cf9eb67

Qscy requested a review from jfhenon September 11, 2025 14:26

jfhenon approved these changes Sep 11, 2025

View reviewed changes

jfhenon merged commit 0335548 into SVG-Edit:master Sep 11, 2025
6 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

Add Alt + Wheel Zoom Shortcut & Fix Localization for Panning & Update zh-CN locale #1067

Add Alt + Wheel Zoom Shortcut & Fix Localization for Panning & Update zh-CN locale #1067

Uh oh!

Qscy commented Sep 11, 2025 •

edited by sourcery-ai bot

Loading

Uh oh!

sourcery-ai bot commented Sep 11, 2025 •

edited

Loading

Interacting with Sourcery

Customizing Your Experience

Getting Help

Uh oh!

sourcery-ai bot left a comment

Uh oh!

sourcery-ai bot Sep 11, 2025

Uh oh!

jfhenon commented Sep 11, 2025

Uh oh!

jfhenon left a comment

Uh oh!

Qscy commented Sep 11, 2025 •

edited

Loading

Uh oh!

jfhenon commented Sep 11, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

	<se-button id="tool_zoom" title="tools.mode_zoom" src="zoom.svg" shortcut="Z"></se-button>
	<se-button id="tool_zoom" title="tools.mode_zoom" src="zoom.svg" shortcut="Z or Alt + Mouse Wheel"></se-button>

Uh oh!

Add Alt + Wheel Zoom Shortcut & Fix Localization for Panning & Update zh-CN locale #1067

Add Alt + Wheel Zoom Shortcut & Fix Localization for Panning & Update zh-CN locale #1067

Uh oh!

Conversation

Qscy commented Sep 11, 2025 • edited by sourcery-ai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Pull Request: Add Alt + Wheel Zoom Shortcut & Fix Localization for Panning & Update zh-CN locale

📌 Summary

✨ Features & Fixes

🧪 Testing

Summary by Sourcery

Uh oh!

sourcery-ai bot commented Sep 11, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Reviewer's Guide

Sequence diagram for Alt + Mouse Wheel zoom event handling

Class diagram for EditorStartup zoom shortcut addition

File-Level Changes

Interacting with Sourcery

Customizing Your Experience

Getting Help

Uh oh!

sourcery-ai bot left a comment

Choose a reason for hiding this comment

Uh oh!

sourcery-ai bot Sep 11, 2025

Choose a reason for hiding this comment

Uh oh!

jfhenon commented Sep 11, 2025

Uh oh!

jfhenon left a comment

Choose a reason for hiding this comment

Uh oh!

Qscy commented Sep 11, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

jfhenon commented Sep 11, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Qscy commented Sep 11, 2025 •

edited by sourcery-ai bot

Loading

sourcery-ai bot commented Sep 11, 2025 •

edited

Loading

Qscy commented Sep 11, 2025 •

edited

Loading