feat(modeling): allow append TextAnnotation

Closes #90

lib/draw/BpmnRenderer.js

@@ -1199,6 +1199,11 @@ function BpmnRenderer(events, styles, pathMap) {
       return renderExternalLabel(p, element, '');
     },
     'bpmn:TextAnnotation': function(p, element) {
+      var style = {
+        'fill': 'none',
+        'stroke': 'none'
+      };
+      var textElement = drawRect(p, element.width, element.width, 0, 0, style);
       var textPathData = pathMap.getScaledPath('TEXT_ANNOTATION', {
         xScaleFactor: 1,
         yScaleFactor: 1,
@@ -1212,9 +1217,9 @@ function BpmnRenderer(events, styles, pathMap) {
       drawPath(p, textPathData);
 
       var text = getSemantic(element).text || '';
-      var label = renderLabel(p, text, { box: element, align: 'left-middle' });
+      renderLabel(p, text, { box: element, align: 'left-middle' });
 
-      return label;
+      return textElement;
     },
     'ParticipantMultiplicityMarker': function(p, element) {
       var subProcessPath = pathMap.getScaledPath('MARKER_PARALLEL', {

lib/features/context-pad/ContextPadProvider.js

@@ -6,10 +6,11 @@ var _ = require('lodash');
 /* jshint -W101 */
 
 var images = {
-  EVENT: 'iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAANNJREFUeNq0VIsNwiAQpV3AbuAIOAobMBsTwAZ0AxyhTgBOcN5TmlSsWiy+5CXA3Xs5PkdHROKf0EzPpII+x56AYrpi7ch0zJPWWiilxDAM90BKSTjnhDEG0zNTMS+zUWkSpZQUQqB3QAw5yM2aF6OAhBgjfQNyslkojbDvj5WsVZbPTS+NPJ8J1QIaaJdGZK2tNoLmsTMSPQ8OcJpvpwZLTb+2+AtgdMVgmqZqMd5WWdGIx1aLrBnLlmhy/c0e5O4W2dS0IC5ja9Pu+0ZafWw3AQYAuebLigXf9OoAAAAASUVORK5CYII=',
+  EVENT_END: 'iVBORw0KGgoAAAANSUhEUgAAABMAAAAUCAYAAABvVQZ0AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAGdSURBVDiNrZTPitNQGMV/NxAYlJCm+gzicqZU6K4IggZduO6iM88kBtqhHbLIO+g7WMJMuxAlSLsRBlRmGQjkuLCXNmmntmUOfHDv4vy4f77vGEnUZYx5AoTAi2U9A74BX5b1SdKfDaOkSgHvgFtAtowxqu1/Aq83vGuQR8DAGsIwVBRFStNUeZ4rTVNFUaQwDC20BD4AJ9tgV4A8z1Mcx9qlOI7leZ6Fjiow4BWgIAiUZdlOkFWWZWo0GuUS+NK+/WPgB6DRaLQXyGowGNjTfQdOAC4Adbvdg0CSVJalOp2OBZ47wBlAr9fb+On/yRhDv9+325YDnAK0Wq2DYQDtdtsuTwHuXNdVnucHX1OS8jyX67oC7pyjjnOPHOCmKApms9lRgOl0SlEUADcOcA2QpulRsMlkYpfX8ICtAWtNOx6PD4INh8Nq02ptnJrNphaLxV6g+XyuIAiq46TaoPu+XyZJshOUJIl837eg6qBrFUGX7B9BAj6yLYLWoO+BX3B/OPIvPN/WvUbbY/sp8IZVbD8HvrKK7c+Sftd9fwFj56oBfolA4gAAAABJRU5ErkJggg==',
   GATEWAY: 'iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAG1JREFUeNqs1MsJACEMBFC1gfR/sqSUlEXZFVEzcWEG5vrAT5LNLFFyAdW32AigKiLWirAI6oiq9iIMQQP5gjAP2pAIO0EugrAVChEPm6Fr5IQ1oyRW2EejXjb1+akfkjoi1KH9tUYya7E9AgwA8H6jTs2UBDgAAAAASUVORK5CYII=',
   TASK: 'iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAALBJREFUeNpi/P//PwM1ABMDlQALiGBkZARR/ECcAMQCROr9AMQLgPgjyFeMYAJi0Hl+fn4DICDKlAsXLjB8/PjxApBpCA4eaBjFA/H/8+fP/ycWgNSC9ID0IhtUb29v/59UANID0gsyAx7YDg4OJAcwsh6qxdqoQSQYBEpgpIIDBw6AKAUwh1oJEiOLgNIGoWzy4MEDhg0bNqBkEWSDYJk2gAhfPQCFBkamHVSxBhBgAH1c5Gm2siu5AAAAAElFTkSuQmCC',
   INTER_THROW_EVENT: 'iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAIaSURBVDiNtZUxayJBGIbfmULW2bBgM43FQKrDWhckV6UQjsXfcKCVx/WLveAP8LjO4n6BhRxWKwgnwjA/IKRIt82tEDGoa5P3ijPBHCSRI3mrKb734Ru+d74RJPGahBACAHhCsXiuRggRFYvFT57nXWw2mw8A4Pv+VZ7n891uNyH58ySgEEIHQfCjVCp9bLfbfhiGolqtAgCcc7DWcjgcbm5vb3+t1+vPJH8f++U/sIZS6rrT6Vw6586klGIwGKBSqaBSqWAwGEBKKZxzZ51O51IpdS2EaDzpiCQOXWql1Go2mzFJEhpj2Gq1OBqNmKYp0zTlaDRiq9WiMYZJknA2m1EptQKgHzkPhyAIJnEc75MkYblc5nQ65XOaTqcsl8tMkoRxHO+DIJg8AQKIjDF3WZbRGPMi7BhqjOHBcwcgIvl3KEqpb91u94uUUtzc3GA4HL6WDgBAu93G+fk57u/v2e/3v2+3268SADzPuwjDUCwWCzSbzZNgANBsNrFYLBCGofA87+JxuIVCYbdcLqm1Zpqmr173QWmaUmvN5XLJQqGwAyDkCw38lyRJ+r5/5ZxDrVaDtfZks7UWtVoNzjn4vn9FkhIA8jyfW2tZr9cxHo9PBo7HY9TrdVhrmef5HMDbx+Z9gs33eHoHaEMptYrjeJ9lGXu9HqMootaaWmtGUcRer8csyxjH8f4Aaxwz3nx9vf+CfQZ+8hfwB0gOaoHM8UT6AAAAAElFTkSuQmCC',
+  TEXT_ANNOTATION: 'iVBORw0KGgoAAAANSUhEUgAAABAAAAAPCAYAAADtc08vAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAC9SURBVCiR3dMxSoNREATgbyQWIoJpRPAQprITbD2BlXgBDyF4FMEDeAFzCwstLSwsvICOVdBfYkxSOvCKnd2Zt/Pgpa1lkWSKA7zPuNHS6i8ct32ZFRtrGAzwDwyWesQkm5isZZBkD2NczusvjJBkhBuM2l6stEGSMxzhtO3Hr7e0HRxs4Q672PnRm2L/OzfYIMk5nnDV9m1RvEGEJGOc4BmvbR+XEcNGkgm2cdj2fhUxBLe4bvvw5/Cc3/gJD3ZM3d0apsIAAAAASUVORK5CYII=',
   TRASH: 'iVBORw0KGgoAAAANSUhEUgAAABIAAAATCAYAAACdkl3yAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAQtJREFUeNqsVNENgyAQBeM/3aCM4AZlBDagG3QFR3AENygbYCeoTlBG0AksR8QgAbGNl7xEAu+9O84Dz/OMTgkQSogJ2I7gGuUHQnDoZvAw+CSEnosJnCMxIZIg7uHt+KWX5cWg/veKsCsLY+xK44toLrSBNPwJFmWweSeE1FVV7SqM44iGYYBPZvCKdU0YoTkXSil3Ryu/CNOdJpsp4pwjKeVms2kai1gUqfShvL7vty5a27KOCI2OEAsQZoyhruvsck9o8IVS7r5ptjRwDkvbEy5S7Y0FtNwz0DmhDg5SSlH4PwkhfCN9qDQQClvdtu1Pz4g6OLAPnx/Omps3emDW4KKmlX/WC/kVYACiNOUTeEjwagAAAABJRU5ErkJggg=='
 };
 
@@ -48,7 +49,14 @@ ContextPadProvider.prototype.getContextPadEntries = function(element) {
   var bpmnElement = element.businessObject;
 
   function append(element, type) {
-    var target = modeling.appendFlowNode(element, type);
+
+    var target;
+
+    if(type === 'bpmn:TextAnnotation') {
+      target = modeling.appendTextAnnotation(element, type);
+    } else {
+      target = modeling.appendFlowNode(element, type);
+    }
 
     selection.select(target);
     directEditing.activate(target);
@@ -59,7 +67,7 @@ ContextPadProvider.prototype.getContextPadEntries = function(element) {
 
     _.extend(actions, {
       'action.model-event': {
-        imageUrl: 'data:image/png;base64,' + images.EVENT,
+        imageUrl: 'data:image/png;base64,' + images.EVENT_END,
         action: function() {
           append(element, 'bpmn:EndEvent');
         }
@@ -81,6 +89,12 @@ ContextPadProvider.prototype.getContextPadEntries = function(element) {
         action: function() {
           append(element, 'bpmn:IntermediateThrowEvent');
         }
+      },
+      'action.model-text-Annotation': {
+        imageUrl: 'data:image/png;base64,' + images.TEXT_ANNOTATION,
+        action: function() {
+          append(element, 'bpmn:TextAnnotation');
+        }
       }
     });
 

lib/features/modeling/BpmnUpdater.js

@@ -173,6 +173,11 @@ BpmnUpdater.prototype.updateConnection = function(connection) {
       newSource = connection.source && connection.source.businessObject,
       newTarget = connection.target && connection.target.businessObject;
 
+  // don't set incoming / outgoing for associations
+  if(businessObject.$instanceOf('bpmn:Association')) {
+    return;
+  }
+
   if (businessObject.sourceRef !== newSource) {
     Collections.remove(businessObject.sourceRef && businessObject.sourceRef.get('outgoing'), businessObject);
 
@@ -182,7 +187,6 @@ BpmnUpdater.prototype.updateConnection = function(connection) {
 
     businessObject.sourceRef = newSource;
   }
-
   if (businessObject.targetRef !== newTarget) {
     Collections.remove(businessObject.targetRef && businessObject.targetRef.get('incoming'), businessObject);
 

lib/features/modeling/Modeling.js

@@ -63,5 +63,15 @@ Modeling.prototype.appendFlowNode = function(source, type, position) {
     y: source.y + source.height / 2
   };
 
-  return this.appendShape(source, { type: type }, position);
+  return this.appendShape(source, { type: type }, position, { type: 'bpmn:SequenceFlow'});
+};
+
+Modeling.prototype.appendTextAnnotation = function(source, type, position) {
+
+  position = position || {
+    x: source.x + source.width / 2 + 75,
+    y: source.y - (source.height / 2) - 100
+  };
+
+  return this.appendShape(source, { type: type }, position, { type: 'bpmn:Association'});
 };

lib/features/modeling/cmd/AppendShapeHandler.js

@@ -22,7 +22,12 @@ AppendShapeHandler.$inject = [ 'modeling' ];
 
 
 AppendShapeHandler.prototype.postExecute = function(context) {
-  this._modeling.createConnection(context.source, context.shape, {
+
-    type: 'bpmn:SequenceFlow',
+  this._modeling.createConnection(
-  }, context.source.parent);
+    context.source,
+    context.shape,
+    {
+      type: context.connection.type
+    },
+    context.source.parent);
 };

resources/images/context-pad/event-end.svg

@@ -0,0 +1,69 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="20"
+   height="20"
+   id="svg3795"
+   version="1.1"
+   inkscape:version="0.48.2 r9819"
+   sodipodi:docname="event-end.svg"
+   inkscape:export-xdpi="90"
+   inkscape:export-ydpi="90">
+  <defs
+     id="defs3" />
+  <sodipodi:namedview
+     inkscape:document-units="mm"
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="26.214075"
+     inkscape:cx="1.66375"
+     inkscape:cy="10.158739"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     inkscape:window-width="1323"
+     inkscape:window-height="859"
+     inkscape:window-x="62"
+     inkscape:window-y="42"
+     inkscape:window-maximized="0" />
+  <metadata
+     id="metadata4">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-1032.3622)">
+    <path
+       sodipodi:type="arc"
+       style="fill:#ffffff;stroke:#000000;stroke-width:2;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0;fill-opacity:1"
+       id="path4313"
+       sodipodi:cx="10.089999"
+       sodipodi:cy="9.9862957"
+       sodipodi:rx="9.0981655"
+       sodipodi:ry="9.0981655"
+       d="m 19.188165,9.9862957 c 0,5.0247783 -4.073388,9.0981653 -9.098166,9.0981653 -5.0247779,0 -9.09816531,-4.073387 -9.09816531,-9.0981653 0,-5.0247781 4.07338741,-9.09816551 9.09816531,-9.09816551 5.024778,0 9.098166,4.07338741 9.098166,9.09816551 z"
+       transform="matrix(0.96493709,0,0,0.96493709,0.26378553,1032.7261)" />
+  </g>
+</svg>

resources/images/context-pad/text-annotation.svg

@@ -0,0 +1,76 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="20"
+   height="20"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.48.2 r9819"
+   inkscape:export-xdpi="90"
+   inkscape:export-ydpi="90"
+   sodipodi:docname="text-annotation.svg">
+  <defs
+     id="defs4" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="31.1"
+     inkscape:cx="9.0096599"
+     inkscape:cy="10"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     showguides="true"
+     inkscape:guide-bbox="true"
+     inkscape:window-width="1452"
+     inkscape:window-height="977"
+     inkscape:window-x="42"
+     inkscape:window-y="22"
+     inkscape:window-maximized="0">
+    <sodipodi:guide
+       orientation="0,1"
+       position="2.3472669,3.2797428"
+       id="guide3774" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata7">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-1032.3622)">
+    <path
+       style="fill:none;stroke:#000000;stroke-width:0.85462976;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
+       d="m 16.806851,1034.5508 -3.9101,0 0,7.0913 0,7.0914 3.9101,0"
+       inkscape:connector-curvature="0"
+       id="rect2985"
+       sodipodi:nodetypes="ccccc" />
+    <path
+       style="fill:none;stroke:#000000;stroke-width:0.99204856;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:0.99204856, 0.99204856;stroke-dashoffset:0"
+       d="m 1.5470475,1048.7118 11.0921995,-8.1566"
+       id="path3762"
+       inkscape:connector-curvature="0" />
+  </g>
+</svg>