mapbox / mapbox/mapbox-gl-draw

Key events should be delivered when control.[trash|line|etc] are false

Open
#1,028 1 comment 3 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug events
Dominant language
JavaScript
Stars
1.1k
Forks
612
Avg merge
8d 9h
Merged PRs (30d)
5

Description

I am trying to make my own draw control modes/behaviors and it seems as though events.js consumes the delete/backspace/ keys if control.trash is set to false. If trash is false, I cannot get the key event to do my own thing with it. Unfortunately, when trash is true, a trash can button is placed on the map - which i don't want.

It does this for the the controls for line, point, and polygon too. If the controls are false, the event should be delivered for handling by the mode

In at least the keydown, it seems like
```
else if (isKeyModeValid(event.keyCode)) {
currentMode.keydown(event);
}
```
should be removed and
```
else { currentMode.keydown(event);}
```
should be added at the end. Full code attached below

```
// 8 - Backspace
// 46 - Delete
events.keydown = function(event) {
if ((event.srcElement || event.target).classList[0] !== 'mapboxgl-canvas') return; // we only handle events on the map

if ((event.keyCode === 8 || event.keyCode === 46) && ctx.options.controls.trash) {
event.preventDefault();
currentMode.trash();
} else if (isKeyModeValid(event.keyCode)) {
currentMode.keydown(event);
} else if (event.keyCode === 49 && ctx.options.controls.point) {
changeMode(Constants.modes.DRAW_POINT);
} else if (event.keyCode === 50 && ctx.options.controls.line_string) {
changeMode(Constants.modes.DRAW_LINE_STRING);
} else if (event.keyCode === 51 && ctx.options.controls.polygon) {
changeMode(Constants.modes.DRAW_POLYGON);
}
};

events.keyup = function(event) {
if (isKeyModeValid(event.keyCode)) {
currentMode.keyup(event);
}
};
```

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start in events.js, especially keydown and keyup handling for trash, line_string, point, and polygon controls. Verify how disabled controls affect delivery to currentMode, then confirm that delete, backspace, and other mode keys reach the mode when the corresponding control is false, without adding its map button.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.