[whatwg] Fixing undo on the Web - UndoManager and Transaction

[Ryosuke Niwa]

On Tue, Aug 2, 2011 at 1:51 PM, Eric U <ericu at google.com> wrote:
>
> I think the manual transaction is what I'd want to make undo/redo in
> the edit menu work with jV
> [https://addons.mozilla.org/en-US/firefox/addon/jv/]*.


That's great to hear!  I've spent so much time reconciling the way managed
transactions and manual transactions interact so it's good to know my work
wasn't put into vain.

It looks like using manual transactions would be the straightforward
> way to make this work...I assume it could also be made to work with
> managed transactions, but I'm having trouble picturing how that would
> look from this early spec.  Perhaps you could add a little sample code
> of an app making a number of small changes and merging them into a
> single undo record after each?
>

Sure. The following example will add two transactions each inserting "hello"
and <br> before the selection anchor and groups them into one transaction
group:

myEditor.undoManager.transact(
  new ManualTransaction(
    function () {
      this.text = document.createTextNode('hello');
      this.nodeBefore = window.getSelection().anchorNode;
      this.nodeBefore.parentNode.insertBefore(this.text, this.nodeBefore);
    },
    function () { this.text.parentNode.removeChild(this.text); },
    function () { this.nodeBefore.parentNode.insertBefore(this.text,
this.nodeBefore); })
  );

myEditor.undoManager.transact(
  new ManualTransaction(
    function () {
      this.br = document.createElement('br');
      this.nodeBefore = window.getSelection().anchorNode;
      this.nodeBefore.parentNode.insertBefore(this.br, this.nodeBefore);
    },
    function () { this.br.parentNode.removeChild(this.br); },
    function () { this.nodeBefore.parentNode.insertBefore(this.br,
this.nodeBefore); }
  ), true);

- Ryosuke