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:
parent
355059c30a
commit
2909847ac8
|
@ -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;
|
||||||
|
|
|
@ -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);
|
||||||
|
|
Loading…
Reference in New Issue