javascript - Implementing undo

Question

I'm creating a map editing webapp where we can create and edit polylines, polygons etc. I've some trouble finding informations on undo implementation on the web, I find whining about "we need undo" and "here is my Command pattern using closures" but I think between that and a full undo/redo interface there is quite some road.

So, here are my questions (good candidate for wiki I think):

• Should I manage the stack, or is there a way to send my commands to the browser's stack ? (and how do I handle native commands, like text edits in textifields in this case)
• how do I handle "command compression" (command grouping) when some commands are browser native
• How do I detect the undo (ctrl+z) keystroke?
• If I register a keyup event, how do I decide if I prevent default or not?
• If not, can I register some undoevent handler somewhere ?
• Users are not used to undo on the web, how can I "train" them to explore/undo on my application ?

Answer 1

You need to have functions for object creation and deletion. Then pass those functions to the undo manager. See the demo file of my javascript undo manager: https://github.com/ArthurClemens/Javascript-Undo-Manager

The demo code shows canvas, but the code is agnostic.

It doesn't contain key bindings, but may help you with the first steps.

Myself I have used this in a web application with buttons for undo and redo, next to save.