rmp icon indicating copy to clipboard operation
rmp copied to clipboard

Add line style selection dropdown to tools panel for drawing new lines

Open Copilot opened this issue 6 months ago • 0 comments

Previously, users could only draw new lines using the single-color style, which was hardcoded in the line creation logic. This PR adds the ability to select from all available line styles when drawing new lines.

Changes Made

UI Enhancement:

  • Added a "Line style" dropdown in the tools panel above the line path buttons
  • Dropdown shows localized line style names using the existing localization system
  • Only appears when the tools panel is expanded to maintain clean UI

State Management:

  • Added selectedLineStyle field to RuntimeState with default value LineStyleType.SingleColor
  • Added setSelectedLineStyle action to update the selected line style
  • Selected line style persists until user changes it

Line Creation Logic:

  • Modified svg-canvas-graph.tsx to use the selected line style instead of hardcoded SingleColor
  • Special handling for SingleColor to preserve existing theme functionality
  • Other line styles use their proper default attributes

Line Style Component Updates:

  • Updated multiple line style components to handle the newLine prop correctly
  • When newLine is true, components set pointer-events: none so elementsFromPoint returns the underlying station instead of the line during creation
  • Updated components: single-color, dual-color, river, shmetro-virtual-int, china-railway, bjsubway-single-color, bjsubway-dotted

Internationalization:

  • Added translations for "Line style" in English, Chinese Simplified, and Chinese Traditional

Usage

  1. Expand the tools panel
  2. Select desired line style from the "Line style" dropdown
  3. Choose a line path type (diagonal, perpendicular, etc.)
  4. Draw lines as usual - they will now use the selected line style

The selected line style remains active until changed, allowing users to draw multiple lines with the same style efficiently.

Fixes #1141.

[!WARNING]

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

  • registry.npmmirror.com
    • Triggering command: npm install (dns block)

If you need me to access, download, or install something from one of these locations, you can either:


✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

Copilot avatar Sep 05 '25 11:09 Copilot