From a852acbfce14ec1be8b101ddb16445913223f068 Mon Sep 17 00:00:00 2001 From: Henrik Fehlauer Date: Thu, 4 Jun 2020 18:00:00 +0000 Subject: [PATCH] Add shortcut to create no-go areas Press 'N' to initiate drawing a no-go area. 'Escape' will cancel, similar to how drawing a route works. --- js/plugin/NogoAreas.js | 51 +++++++++++++++++++++++++++++++++--------- locales/en.json | 4 ++-- 2 files changed, 42 insertions(+), 13 deletions(-) diff --git a/js/plugin/NogoAreas.js b/js/plugin/NogoAreas.js index 012de7d..6cff5ec 100644 --- a/js/plugin/NogoAreas.js +++ b/js/plugin/NogoAreas.js @@ -1,4 +1,13 @@ BR.NogoAreas = L.Control.extend({ + options: { + shortcut: { + draw: { + enable: 78, // char code for 'n' + disable: 27 // char code for 'ESC' + } + } + }, + statics: { MSG_BUTTON: 'Draw no-go area (circle)', MSG_BUTTON_CANCEL: 'Cancel drawing no-go area', @@ -48,28 +57,32 @@ BR.NogoAreas = L.Control.extend({ featuresLayer: this.drawnItems })); + this.startDrawing = function(control) { + // initial radius of 0 to detect click, see DeletableCircleEditor.onDrawingMouseUp + var opts = L.extend({ radius: 0 }, self.style); + editTools.startCircle(null, opts); + + control.state('cancel-no-go-create'); + }; + + this.stopDrawing = function(control) { + editTools.stopDrawing(); + control.state('no-go-create'); + }; + this.button = L.easyButton({ states: [ { stateName: BR.NogoAreas.STATE_CREATE, icon: 'fa-ban', title: BR.NogoAreas.MSG_BUTTON, - onClick: function(control) { - // initial radius of 0 to detect click, see DeletableCircleEditor.onDrawingMouseUp - var opts = L.extend({ radius: 0 }, self.style); - editTools.startCircle(null, opts); - - control.state('cancel-no-go-create'); - } + onClick: this.startDrawing }, { stateName: BR.NogoAreas.STATE_CANCEL, icon: 'fa-ban active', title: BR.NogoAreas.MSG_BUTTON_CANCEL, - onClick: function(control) { - editTools.stopDrawing(); - control.state('no-go-create'); - } + onClick: this.stopDrawing } ] }); @@ -78,6 +91,8 @@ BR.NogoAreas = L.Control.extend({ // events firing in Chrome mobile while L.Map.Tap enabled for circle drawing L.DomEvent.addListener(this.button.button, 'pointerdown', L.DomEvent.stop); + L.DomEvent.addListener(document, 'keydown', this._keydownListener, this); + this.editTools.on( 'editable:drawing:end', function(e) { @@ -124,6 +139,20 @@ BR.NogoAreas = L.Control.extend({ return L.DomUtil.create('div'); }, + _keydownListener: function(e) { + if (!BR.Util.keyboardShortcutsAllowed(e)) { + return; + } + if (e.keyCode === this.options.shortcut.draw.disable && this.button.state() === BR.NogoAreas.STATE_CANCEL) { + this.stopDrawing(this.button); + } else if ( + e.keyCode === this.options.shortcut.draw.enable && + this.button.state() === BR.NogoAreas.STATE_CREATE + ) { + this.startDrawing(this.button); + } + }, + displayUploadError: function(message) { $('#nogoError').text(message ? message : ''); $('#nogoError').css('display', message ? 'block' : 'none'); diff --git a/locales/en.json b/locales/en.json index 3814eeb..6b3db7b 100644 --- a/locales/en.json +++ b/locales/en.json @@ -114,9 +114,9 @@ "loading": "Loading…", "locate-me": "Show me where I am (L key)", "nogo": { - "cancel": "Cancel drawing no-go area", + "cancel": "Cancel drawing no-go area (ESC key)", "click-drag": "Click and drag to draw circle", - "draw": "Draw no-go area (circle)", + "draw": "Draw circular no-go area (N key)", "edit": "Click to edit", "help": "□ = move / resize, = delete,
click circle to quit editing" },