Welcome, Guest

Author Topic: Undo and redo handling  (Read 2971 times)

cperthuis

  • Posts: 5
    • View Profile
Undo and redo handling
« on: November 10, 2015, 12:59:07 AM »
Hi,

Sorry in advance, if I am posting in the wrong forum category.

Cef handles undo and redo in most html widgets for you without leaving you an option to capture, cancel or interact in any way with the operation.
I was wondering if Coherent UI and GT had any specific behavior about undo and redo.
What happens if someone types some text in an <input> field and then press CTRL+Z?

Ideally I want to be in control of the undo and redo stack.

Thanks.


« Last Edit: November 10, 2015, 01:27:58 AM by cperthuis »

Mike

  • Administrator
  • *****
  • Posts: 144
    • View Profile
Re: Undo and redo handling
« Reply #1 on: November 10, 2015, 03:00:50 AM »
Hey cperthuis,

Currently Coherent UI automatically handles undo and redo in all the types of input fields whereas in Coherent GT this functionality is not yet implemented.

There is no client API that provides control over the undo/redo stack in the current versions of both Coherent UI and Coherent GT.

Could you give us some more detailed information on how exactly do you want to control the undo/redo stack and how do you imagine such functionality would look like?

Regards,
Mike

cperthuis

  • Posts: 5
    • View Profile
Re: Undo and redo handling
« Reply #2 on: November 10, 2015, 10:10:56 AM »
Ok, first let me give some context.

When making tools, undo/redo is one of most important features. Take maya, UE4 editor, Unity editor any of those tools have one or several viewport windows and some tools windows, most of them are property lists implemented with sliders, checkboxes, drop list boxes, text boxes, file pickers, color pickers. In such an editor typical operations are object placement and editing of object properties:
- click in the viewport window to give it the input focus
- select the object in the world
- move it [operation 1]
- click in the detail panel to focus it
- move a slider to change a property on the object [operation 2]
- click again in the viewport
- move the object again [operation 3]
2 scenarios at this point

A)
- CTRL+Z, CTRL+Z, CTRL+Z

B)
- click on the detail panel to give it input focus
- CTRL+Z, CTRL+Z, CTRL+Z

In both cases, you expect the object back in its original state.

You have 2 choices for the inputs, always forward the inputs both to cef/coherent UI and to your viewport, or only forward the input to whoever is in focus.
- If you only forward the input to whoever is in focus, 3 CTRL+Z in cef/coherent UI will undo 3 UI operations, first the property edit I mentioned and the 2 previous operations, but our app won't have the opportunity to undo the object move operations.
- If you forward the input to both cef/coherent UI and to the viewport, the viewport can either undo the 3 operations or just the 2 operations done in the viewport, since we control the code to do that, but cef/coherent UI will still try to undo 3 UI operations.

What I would ideally want:

Have a way to separate the undo/redo done when an input widget is in focus from the ones when no input widget is in focus, and keep the undo/redo stack local to the currently selected widget.

ex: the text box is in focus, 3 CTRL+Z should only undo 3 operations in that text box, not in any other text box. The global app wouldn't see this as UNDO, it would simply record 3 new modify operations on the data associated with the text box.

ex: no input widget is in focus, just an html div, 3 CTRL+Z should undo 3 global operations whatever they are, for example in our case, it should bring the object back in its original case, the GUI would be refreshed because it's monitoring the data change.

What this mean for the API:
- we need a C++ or javascript callback for when an undo/redo is requested and no input widget is currently in focus
- we need the undo/redo to only operate on the widget currently selected
- in that mode, I think it's acceptable to only keep track of the undo queue of the currently selected widget. if I switch from widget A and B, I kind of expect to not be able to undo A anymore if I go back to A. Ideally, you would want an history per widget, but that's probably too much things to keep track of.

Thanks,
Cedric.

cperthuis

  • Posts: 5
    • View Profile
Re: Undo and redo handling
« Reply #3 on: November 10, 2015, 10:18:36 AM »
Sorry if my question is obvious, I haven't requested for an evaluation yet, so I haven't tested the lib.
Does your answer means that coherent GT doesn't support undo/redo in <input> text fields? Does coherent GT implements <input> text field, check boxes and all the common html widgets?
« Last Edit: November 10, 2015, 11:34:01 AM by cperthuis »

Mike

  • Administrator
  • *****
  • Posts: 144
    • View Profile
Re: Undo and redo handling
« Reply #4 on: November 11, 2015, 07:17:45 AM »
Hey Cedric,

Thank you very much for the suggestion and the detailed description. We highly appreciate it.

Coherent GT does implement all the common html widgets but at the moment it does not support the undo/redo operation. How key exactly is that for you? Coherent UI does support it and it behaves in a way similar to a browser.

Providing the user control of the undo/redo stack with a all the information needed requires exposing a lot of internal objects that would feel inadequate in the public API. Your suggestion will definitely be considered by our dev team for a solution that keeps the API clean while still giving you the required control but I cannot give you any estimations.

There is also a possible workaround for what you are trying to achieve. You could create different views to separate the widgets. This way when you hit Ctrl + Z the undo will occur only in the widgets local to the specific view and not the rest.

Regards,
Mike
« Last Edit: November 11, 2015, 07:48:12 AM by Mike »

cperthuis

  • Posts: 5
    • View Profile
Re: Undo and redo handling
« Reply #5 on: November 11, 2015, 09:35:53 AM »
Ok thanks for the info. I think this is fundamental to make good editors. It's something that cef can't do either, I think it would a great addition to Coherent UI.

Yes, I don't think you want to expose any internal object to the user, a simple configuration switch to use this mode would go a long way, I think it would enable a lot of new applications. I think it can be done with GT by reimplementing the undo/redo stack for the basic controls in javascript, it's probably not too difficult, I'll probably explore that route.

So please, don't implement undo/redo in GT unless you also provide a way to disable it :)

Thanks,
Cedric

dimitar

  • Administrator
  • *****
  • Posts: 39
    • View Profile
Re: Undo and redo handling
« Reply #6 on: November 12, 2015, 10:03:16 AM »
Hi Cedric,

You can implement separate Undo/Redo stack for each input widget in JavaScript.
In the attached example I have used the TextStack library from https://github.com/azaslavsky/TextStack


The idea is to listen globally for CTRL-Z and CTRL-Y, but apply the operation on the currently focused widget.
If there is no focused widget, there won't be any undo/redo operations applied. This way you can always forward the input to Coherent GT and it will work as you want.

Here is a the gist of the sample:
Code: [Select]
<body>
<label>Textarea:
<textarea class="undo-redo" id="simple" style="width: 80%; height: 40%; min-height: 240px;"></textarea>
</label>
<br/>
<label>Input:
<input class="undo-redo" type="text" />
</label>
<br/>
<label>Input:
<input class="undo-redo" type="number" />
</label>
<script>
var inputs = document.getElementsByClassName('undo-redo'),
n = inputs.length,
undos = [],
// prevent TextStack from doing undo/redo
keys = { redoKeys: [1], undoKeys: [2] };

for (var i = 0; i < n; ++i)
{
inputs[i].undo = new TextStack(inputs[i], keys);
}
document.addEventListener('keydown', function (e){
if (!(e.ctrlKey && e.target.undo)) {
return;
}
if (e.keyCode == 90 || e.keyCode == 122)
{
e.target.undo.undo();
e.preventDefault();

} else if (e.keyCode == 89 || e.keycode == 121) {
e.target.undo.redo();
e.preventDefault();
}
});
</script>
</body>

I suggest you try Coherent GT, which will fit your needs perfectly - we have implemented an HTML UI editor powered by Coherent GT :)

You can find the Coherent Editor in the Coherent GT package, so you can take a look at it.

Best,
 Dimitar
« Last Edit: November 12, 2015, 10:13:59 AM by dimitar »

cperthuis

  • Posts: 5
    • View Profile
Re: Undo and redo handling
« Reply #7 on: November 12, 2015, 10:26:03 AM »
Great, that's exactly what I was looking for!
Thanks.

Cedric

Tags: Undo