The 2-steps-to-edit process
vwRtx uses a 2-click activation UX. Why - because having it go into full edit mode every time it is dragged is frustrating. Put another way, although vwRtx is all about editing, it is better UX to allow the user to select an instance without being forced into edit mode too soon.
To avoid this frustratiion vwRtx uses a click counter and a 2-step activation process.
Click #1
This is counted as putting focus onto the vwRtx instance. When focused the vwRtx instance will put itself into the transformer so it can be sized and dragged, but it won't switch on the caret for typing yet. Only one vwRtx instance on the canvas may be focused at any time.
The process of dragging the instance is counted as one click, meaning that we can drag and drop repeatedly without flipping into edit mode. But the click is measured at mouseup and if the activity was a drag then we reset to one click. So we can click and drag the shape as many times as we need to until we finally get it to where we needs it to be located, where another click will make the instance activated and editable.
Click #2
The second click is makes the instance activated. In this state the caret is flashing and the instance is listening for mouse and keyboard input.
Related events
The following events are triggered in relation to this process.
| Name | When triggered |
|---|---|
| focused | Triggered on the first click of an inactive vwRtx instance. Only one instance may be focused at any time. |
| defocused | Triggered when the user clicks away from the currently focused instance. |
| activated | Triggered on a further click of an vwRtx instance that is focused. Only one instance may be activated at any time. |
| de-activated | Triggered when the user clicks away from the currently activated instance. |
Modes
Internally vwRtx uses a mode value to know how to respond in specific circumstances. The current mode is available in the object returned from rtx.info and the direct accessor rtx.mode. It has the following values:
| Value | Meaning |
|---|---|
| activated | The instance is fully activated. It has a transformer and is showing the editing caret. It cannot |
| focused | The instance has received focus. It has a transformer but it not showing the editing caret, It can be dragged and transformed. |
| sleeping | The user has clicked the stage or another stage object and the instance has lost focus / activation. In this state the instance is not listening for any vwRtx-specific API or keyboard events. |
When is the API listening?
The API is listening for messages when the vwRtx instance mode is focused or is activated.