feat(direct-editing): rework editing

This commit updates the default direct editing behavior.

It activates on non-touch environments only and only on embedded
labels, too.

This provides a way smoother modeling experience.
This commit is contained in:
Nico Rehwaldt 2014-12-23 16:49:28 +01:00
parent 355059c30a
commit 2909847ac8
2 changed files with 24 additions and 21 deletions

View File

@ -26,37 +26,40 @@ function LabelEditingProvider(eventBus, canvas, directEditing, commandStack, inj
directEditing.activate(event.element); directEditing.activate(event.element);
}); });
// intercept direct canvas clicks to deselect all selected shapes // complete on followup canvas operation
eventBus.on('element.click', function(event) { eventBus.on([ 'element.mousedown', 'drag.activate', 'canvas.viewbox.changed' ], function(event) {
directEditing.complete(); directEditing.complete();
}); });
eventBus.on('canvas.viewbox.changed', function(event) { // cancel on command stack changes
directEditing.complete(); eventBus.on([ 'commandStack.changed' ], function() {
directEditing.cancel();
}); });
// remove and restore selection during direct editing
(function() { // activate direct editing for activities and text annotations
try {
var selection = injector.get('selection');
var localSelection; if ('ontouchstart' in document.documentElement) {
// we deactivate automatic label editing on mobile devices
// as it breaks the user interaction workflow
eventBus.on('directEditing.activate', function() { // TODO(nre): we should temporarily focus the edited element here
localSelection = selection.get(); // and release the focused viewport after the direct edit operation is finished
selection.select(null); } else {
}); eventBus.on('create.end', 500, function(e) {
eventBus.on('directEditing.deactivate', function() { var element = e.shape,
selection.select(localSelection); businessObject = element.businessObject;
localSelection = null;
});
} catch (e) { }
})(); if (businessObject.$instanceOf('bpmn:Task') ||
businessObject.$instanceOf('bpmn:TextAnnotation') ||
(businessObject.$instanceOf('bpmn:SubProcess') && !businessObject.di.isExpanded)) {
directEditing.activate(element);
}
});
}
this._canvas = canvas; this._canvas = canvas;
this._commandStack = commandStack; this._commandStack = commandStack;

View File

@ -84,9 +84,9 @@ describe('features - label-editing', function() {
var textarea = directEditing._textbox.textarea; var textarea = directEditing._textbox.textarea;
// when // when
// change + <canvas.click> // change + <element.mousedown>
textarea.val(newName); textarea.val(newName);
eventBus.fire('element.click', { element: canvas.getRootElement() }); eventBus.fire('element.mousedown', { element: canvas.getRootElement() });
// then // then
expect(directEditing.isActive()).toBe(false); expect(directEditing.isActive()).toBe(false);