chore(bpmn-snapping): move participant fitting to participant behavior

Related to #1290

lib/features/modeling/behavior/CreateParticipantBehavior.js

@@ -4,23 +4,60 @@ import CommandInterceptor from 'diagram-js/lib/command/CommandInterceptor';
 
 import { is } from '../../../util/ModelUtil';
 
+import { isLabel } from '../../../util/LabelUtil';
+
+import { getBBox } from 'diagram-js/lib/util/Elements';
+
+var HORIZONTAL_PARTICIPANT_PADDING = 20,
+    VERTICAL_PARTICIPANT_PADDING = 20,
+    PARTICIPANT_BORDER_WIDTH = 30;
+
+var HIGH_PRIORITY = 2000;
+
 
 /**
- * BPMN specific create participant behavior
+ * BPMN-specific behavior for creating participants.
  */
-export default function CreateParticipantBehavior(
-    eventBus, modeling, elementFactory,
-    bpmnFactory, canvas) {
-
+export default function CreateParticipantBehavior(canvas, eventBus, modeling) {
   CommandInterceptor.call(this, eventBus);
 
-  /**
-   * morph process into collaboration before adding
-   * participant onto collaboration
-   */
+  // fit participant
+  eventBus.on([
+    'create.start',
+    'shape.move.start'
+  ], HIGH_PRIORITY, function(event) {
+    var context = event.context,
+        shape = context.shape,
+        rootElement = canvas.getRootElement();
 
-  this.preExecute('shape.create', function(context) {
+    if (is(shape, 'bpmn:Participant') && is(rootElement, 'bpmn:Process')) {
+      context.createConstraints = fitParticpant(shape, rootElement.children);
+    }
+  });
 
+  // force hovering process when creating first participant
+  eventBus.on('create.start', HIGH_PRIORITY, function(event) {
+    var context = event.context,
+        shape = context.shape,
+        rootElement = canvas.getRootElement(),
+        rootElementGfx = canvas.getGraphics(rootElement);
+
+    function ensureHoveringProcess(event) {
+      event.element = rootElement;
+      event.gfx = rootElementGfx;
+    }
+
+    if (is(shape, 'bpmn:Participant') && is(rootElement, 'bpmn:Process')) {
+      eventBus.on('element.hover', HIGH_PRIORITY, ensureHoveringProcess);
+
+      eventBus.once('create.cleanup', function() {
+        eventBus.off('element.hover', ensureHoveringProcess);
+      });
+    }
+  });
+
+  // turn process into collaboration before adding participant
+  this.preExecute('shape.create', function(context) {
     var parent = context.parent,
         shape = context.shape,
         position = context.position;
@@ -48,9 +85,7 @@ export default function CreateParticipantBehavior(
     }
   }, true);
 
-
   this.execute('shape.create', function(context) {
-
     var processRoot = context.processRoot,
         shape = context.shape;
 
@@ -62,39 +97,69 @@ export default function CreateParticipantBehavior(
     }
   }, true);
 
-
   this.revert('shape.create', function(context) {
     var processRoot = context.processRoot,
         shape = context.shape;
 
     if (processRoot) {
+
       // assign the participant processRef
       shape.businessObject.processRef = context.oldProcessRef;
     }
   }, true);
 
-
   this.postExecute('shape.create', function(context) {
-
     var processRoot = context.processRoot,
         shape = context.shape;
 
     if (processRoot) {
+
       // process root is already detached at this point
       var processChildren = processRoot.children.slice();
+
       modeling.moveElements(processChildren, { x: 0, y: 0 }, shape);
     }
 
   }, true);
-
 }
 
 CreateParticipantBehavior.$inject = [
+  'canvas',
   'eventBus',
-  'modeling',
-  'elementFactory',
-  'bpmnFactory',
-  'canvas'
+  'modeling'
 ];
 
-inherits(CreateParticipantBehavior, CommandInterceptor);
+inherits(CreateParticipantBehavior, CommandInterceptor);
+
+// helpers //////////
+
+function fitParticpant(shape, elements) {
+  if (!elements.length) {
+    return;
+  }
+
+  var bbox = getBBox(elements.filter(function(element) {
+    return !isLabel(element) && !isConnection(element);
+  }));
+
+  var bboxWidthPadding = {
+    x: bbox.x - HORIZONTAL_PARTICIPANT_PADDING - PARTICIPANT_BORDER_WIDTH,
+    y: bbox.y - VERTICAL_PARTICIPANT_PADDING,
+    width: bbox.width + HORIZONTAL_PARTICIPANT_PADDING * 2 + PARTICIPANT_BORDER_WIDTH,
+    height: bbox.height + VERTICAL_PARTICIPANT_PADDING * 2
+  };
+
+  shape.width = Math.max(shape.width, bboxWidthPadding.width);
+  shape.height = Math.max(shape.height, bboxWidthPadding.height);
+
+  return {
+    bottom: bbox.y + shape.height / 2 - VERTICAL_PARTICIPANT_PADDING,
+    left: bbox.x + bbox.width - shape.width / 2 + HORIZONTAL_PARTICIPANT_PADDING,
+    top: bbox.y + bbox.height - shape.height / 2 + VERTICAL_PARTICIPANT_PADDING,
+    right: bbox.x + shape.width / 2 - HORIZONTAL_PARTICIPANT_PADDING - PARTICIPANT_BORDER_WIDTH
+  };
+}
+
+function isConnection(element) {
+  return !!element.waypoints;
+}