feat: add keyboard shortcut for redo (ctrl+shift+z)

This commit is contained in:
Yohan Boniface 2025-04-04 10:21:04 +02:00
parent 32b9217bd2
commit 563aee81e1
4 changed files with 94 additions and 82 deletions

View file

@ -36,9 +36,13 @@ const SHORTCUTS = {
shortcut: 'Modifier+F',
label: translate('Search location'),
},
CANCEL: {
UNDO: {
shortcut: 'Modifier+Z',
label: translate('Cancel edits'),
label: translate('Cancel last edit'),
},
REDO: {
shortcut: 'Modifier+Shift+Z',
label: translate('Redo last edit'),
},
PREVIEW: {
shortcut: 'Modifier+E',

View file

@ -126,13 +126,22 @@ export class TopBar extends WithTemplate {
this.elements.undo.addEventListener('click', () => this._umap.undo())
this.elements.undo.addEventListener('mouseover', () => {
this._umap.tooltip.open({
content: this._umap.help.displayLabel('CANCEL'),
content: this._umap.help.displayLabel('UNDO'),
anchor: this.elements.undo,
position: 'bottom',
delay: 500,
duration: 5000,
})
})
this.elements.redo.addEventListener('mouseover', () => {
this._umap.tooltip.open({
content: this._umap.help.displayLabel('REDO'),
anchor: this.elements.redo,
position: 'bottom',
delay: 500,
duration: 5000,
})
})
this.elements.view.addEventListener('click', () => this._umap.disableEdit())
this.elements.view.addEventListener('mouseover', () => {
this._umap.tooltip.open({

View file

@ -499,8 +499,9 @@ export default class Umap {
}
initShortcuts() {
const globalShortcuts = (event) => {
if (event.key === 'Escape') {
const shortcuts = {
Escape: {
do: () => {
if (this.importer.dialog.visible) {
this.importer.dialog.close()
} else if (this.editEnabled && this._leafletMap.editTools.drawing()) {
@ -514,75 +515,72 @@ export default class Umap {
} else if (this.panel.isOpen()) {
this.panel.close()
}
}
// From now on, only ctrl/meta shortcut
if (!(event.ctrlKey || event.metaKey) || event.shiftKey) return
if (event.key === 'f') {
event.stopPropagation()
event.preventDefault()
},
},
'Ctrl+f': {
do: () => {
this.search()
},
},
'Ctrl+e': {
if: () => this.hasEditMode(),
do: () => {
console.log('doing')
if (!this.editEnabled) this.enableEdit()
else if (!this.isDirty) this.disableEdit()
},
},
'Ctrl+s': {
if: () => this.editEnabled && this.isDirty,
do: () => this.saveAll(),
},
'Ctrl+z': {
if: () => this.editEnabled && !Utils.isWritable(event.target),
do: () => this.sync._undoManager.undo(),
},
'Ctrl+Shift+Z': {
if: () => this.editEnabled && !Utils.isWritable(event.target),
do: () => this.sync._undoManager.redo(),
},
'Ctrl+m': {
if: () => this.editEnabled,
do: () => this._leafletMap.editTools.startMarker(),
},
'Ctrl+p': {
if: () => this.editEnabled,
do: () => this._leafletMap.editTools.startPolygon(),
},
'Ctrl+l': {
if: () => this.editEnabled,
do: () => this._leafletMap.editTools.startPolyline(),
},
'Ctrl+i': {
if: () => this.editEnabled,
do: () => this.importer.open(),
},
'Ctrl+o': {
if: () => this.editEnabled,
do: () => this.importer.openFiles(),
},
'Ctrl+h': {
if: () => this.editEnabled,
do: () => this.help.showGetStarted(),
},
}
const onKeyDown = (event) => {
const shiftKey = event.shiftKey ? 'Shift+' : ''
const altKey = event.altKey ? 'Alt+' : ''
const ctrlKey = event.ctrlKey || event.metaKey ? 'Ctrl+' : ''
const combination = `${ctrlKey}${shiftKey}${altKey}${event.key}`
/* Edit mode only shortcuts */
if (!this.hasEditMode()) return
// Edit mode Off
if (!this.editEnabled) {
switch (event.key) {
case 'e':
event.stopPropagation()
event.preventDefault()
this.enableEdit()
break
}
return
}
// Edit mode on
let used = true
switch (event.key) {
case 'e':
if (!this.isDirty) this.disableEdit()
break
case 's':
if (this.isDirty) this.saveAll()
break
case 'z':
if (Utils.isWritable(event.target)) {
used = false
break
}
this.sync._undoManager.undo()
break
case 'm':
this._leafletMap.editTools.startMarker()
break
case 'p':
this._leafletMap.editTools.startPolygon()
break
case 'l':
this._leafletMap.editTools.startPolyline()
break
case 'i':
this.importer.open()
break
case 'o':
this.importer.openFiles()
break
case 'h':
this.help.showGetStarted()
break
default:
used = false
}
if (used) {
const shortcut = shortcuts[combination]
if (shortcut && (!shortcut.if || shortcut.if())) {
shortcut.do()
event.stopPropagation()
event.preventDefault()
}
}
document.addEventListener('keydown', globalShortcuts)
document.addEventListener('keydown', onKeyDown)
}
async initDataLayers(datalayers) {

View file

@ -117,6 +117,7 @@ export function escapeHTML(s) {
'dd',
'b',
'i',
'kbd',
],
ADD_ATTR: [
'target',