Show message on empty undo/redo stack

This commit is contained in:
Chen-I Lim 2020-10-24 11:41:23 -07:00
parent 39680fe6d4
commit e1d2040058
3 changed files with 38 additions and 19 deletions

View file

@ -4,11 +4,14 @@ class FlashMessage {
//
// Show a temporary status message
//
static show(text: string, delay = 800): void {
static show(text: string, delay = 800, style?: string): void {
const flashPanel = document.createElement('div')
flashPanel.innerText = text
flashPanel.classList.add('flashPanel')
flashPanel.classList.add('flashIn')
if (style) {
flashPanel.style.cssText = style
}
document.body.appendChild(flashPanel)

View file

@ -406,21 +406,29 @@ class Mutator {
return block
}
get canUndo(): boolean {
return undoManager.canUndo
}
get canRedo(): boolean {
return undoManager.canRedo
}
get undoDescription(): string | undefined {
return undoManager.undoDescription
}
get redoDescription(): string | undefined {
return undoManager.redoDescription
}
async undo() {
await undoManager.undo()
}
undoDescription(): string | undefined {
return undoManager.undoDescription
}
async redo() {
await undoManager.redo()
}
redoDescription(): string | undefined {
return undoManager.redoDescription
}
}
const mutator = new Mutator()

View file

@ -74,21 +74,29 @@ export default class BoardPage extends React.Component<Props, State> {
if (e.keyCode === 90 && !e.shiftKey && (e.ctrlKey || e.metaKey) && !e.altKey) { // Cmd+Z
Utils.log('Undo')
const description = mutator.undoDescription()
await mutator.undo()
if (description) {
FlashMessage.show(`Undo ${description}`)
if (mutator.canUndo) {
const description = mutator.undoDescription
await mutator.undo()
if (description) {
FlashMessage.show(`Undo ${description}`)
} else {
FlashMessage.show('Undo')
}
} else {
FlashMessage.show('Undo')
FlashMessage.show('Nothing to Undo', 800, 'background-color: #909050;')
}
} else if (e.keyCode === 90 && e.shiftKey && (e.ctrlKey || e.metaKey) && !e.altKey) { // Shift+Cmd+Z
Utils.log('Redo')
const description = mutator.redoDescription()
await mutator.redo()
if (description) {
FlashMessage.show(`Redo ${description}`)
if (mutator.canRedo) {
const description = mutator.redoDescription
await mutator.redo()
if (description) {
FlashMessage.show(`Redo ${description}`)
} else {
FlashMessage.show('Redo')
}
} else {
FlashMessage.show('Redo')
FlashMessage.show('Nothing to Redo', 800, 'background-color: #909050;')
}
}
}