LabelEditingPreview.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
  1. import {
  2. append as svgAppend,
  3. attr as svgAttr,
  4. create as svgCreate,
  5. remove as svgRemove
  6. } from 'tiny-svg';
  7. import {
  8. getBusinessObject,
  9. is
  10. } from '../../util/ModelUtil';
  11. import {
  12. translate
  13. } from 'diagram-js/lib/util/SvgTransformUtil';
  14. var MARKER_HIDDEN = 'djs-element-hidden',
  15. MARKER_LABEL_HIDDEN = 'djs-label-hidden';
  16. export default function LabelEditingPreview(
  17. eventBus, canvas, elementRegistry,
  18. pathMap) {
  19. var self = this;
  20. var defaultLayer = canvas.getDefaultLayer();
  21. var element, absoluteElementBBox, gfx;
  22. eventBus.on('directEditing.activate', function(context) {
  23. var activeProvider = context.active;
  24. element = activeProvider.element.label || activeProvider.element;
  25. // text annotation
  26. if (is(element, 'bpmn:TextAnnotation')) {
  27. absoluteElementBBox = canvas.getAbsoluteBBox(element);
  28. gfx = svgCreate('g');
  29. var textPathData = pathMap.getScaledPath('TEXT_ANNOTATION', {
  30. xScaleFactor: 1,
  31. yScaleFactor: 1,
  32. containerWidth: element.width,
  33. containerHeight: element.height,
  34. position: {
  35. mx: 0.0,
  36. my: 0.0
  37. }
  38. });
  39. var path = self.path = svgCreate('path');
  40. svgAttr(path, {
  41. d: textPathData,
  42. strokeWidth: 2,
  43. stroke: getStrokeColor(element)
  44. });
  45. svgAppend(gfx, path);
  46. svgAppend(defaultLayer, gfx);
  47. translate(gfx, element.x, element.y);
  48. }
  49. if (is(element, 'bpmn:TextAnnotation') ||
  50. element.labelTarget) {
  51. canvas.addMarker(element, MARKER_HIDDEN);
  52. } else if (is(element, 'bpmn:Task') ||
  53. is(element, 'bpmn:CallActivity') ||
  54. is(element, 'bpmn:SubProcess') ||
  55. is(element, 'bpmn:Participant')) {
  56. canvas.addMarker(element, MARKER_LABEL_HIDDEN);
  57. }
  58. });
  59. eventBus.on('directEditing.resize', function(context) {
  60. // text annotation
  61. if (is(element, 'bpmn:TextAnnotation')) {
  62. var height = context.height,
  63. dy = context.dy;
  64. var newElementHeight = Math.max(element.height / absoluteElementBBox.height * (height + dy), 0);
  65. var textPathData = pathMap.getScaledPath('TEXT_ANNOTATION', {
  66. xScaleFactor: 1,
  67. yScaleFactor: 1,
  68. containerWidth: element.width,
  69. containerHeight: newElementHeight,
  70. position: {
  71. mx: 0.0,
  72. my: 0.0
  73. }
  74. });
  75. svgAttr(self.path, {
  76. d: textPathData
  77. });
  78. }
  79. });
  80. eventBus.on([ 'directEditing.complete', 'directEditing.cancel' ], function(context) {
  81. var activeProvider = context.active;
  82. if (activeProvider) {
  83. canvas.removeMarker(activeProvider.element.label || activeProvider.element, MARKER_HIDDEN);
  84. canvas.removeMarker(element, MARKER_LABEL_HIDDEN);
  85. }
  86. element = undefined;
  87. absoluteElementBBox = undefined;
  88. if (gfx) {
  89. svgRemove(gfx);
  90. gfx = undefined;
  91. }
  92. });
  93. }
  94. LabelEditingPreview.$inject = [
  95. 'eventBus',
  96. 'canvas',
  97. 'elementRegistry',
  98. 'pathMap'
  99. ];
  100. // helpers ///////////////////
  101. function getStrokeColor(element, defaultColor) {
  102. var bo = getBusinessObject(element);
  103. return bo.di.get('stroke') || defaultColor || 'black';
  104. }