From 8ad9e8661a46f58affc968efd6011a8b445ad1f8 Mon Sep 17 00:00:00 2001 From: Daniel <150448993+sombrek@users.noreply.github.com> Date: Sun, 12 Nov 2023 16:40:38 +0100 Subject: [PATCH 1/5] feat(bpmn-renderer): render vertical pools and lanes --- lib/draw/BpmnRenderer.js | 44 +++++++++++++--- .../modeling/behavior/IsHorizontalFix.js | 9 +++- lib/util/DiUtil.js | 20 +++++++ test/fixtures/bpmn/draw/vertical-pools.bpmn | 52 +++++++++++++++++++ test/spec/draw/BpmnRendererSpec.js | 9 ++++ 5 files changed, 124 insertions(+), 10 deletions(-) create mode 100644 test/fixtures/bpmn/draw/vertical-pools.bpmn diff --git a/lib/draw/BpmnRenderer.js b/lib/draw/BpmnRenderer.js index a344b1528a..757a854799 100644 --- a/lib/draw/BpmnRenderer.js +++ b/lib/draw/BpmnRenderer.js @@ -10,6 +10,7 @@ import BaseRenderer from 'diagram-js/lib/draw/BaseRenderer'; import { isExpanded, + isHorizontal, isEventSubProcess } from '../util/DiUtil'; @@ -1063,10 +1064,12 @@ export default function BpmnRenderer( } function renderLaneLabel(parentGfx, text, element, attrs = {}) { + var isHorizontalLane = isHorizontal(element); + var textBox = renderLabel(parentGfx, text, { box: { height: 30, - width: getHeight(element, attrs), + width: isHorizontalLane ? getHeight(element, attrs) : getWidth(element, attrs), }, align: 'center-middle', style: { @@ -1074,9 +1077,10 @@ export default function BpmnRenderer( } }); - var top = -1 * getHeight(element, attrs); - - transform(textBox, 0, -top, 270); + if (isHorizontalLane) { + var top = -1 * getHeight(element, attrs); + transform(textBox, 0, -top, 270); + } } function renderActivity(parentGfx, element, attrs = {}) { @@ -1794,12 +1798,13 @@ export default function BpmnRenderer( var participant = renderLane(parentGfx, element, attrs); var expandedParticipant = isExpanded(element); + var horizontalParticipant = isHorizontal(element); var semantic = getSemantic(element), name = semantic.get('name'); if (expandedParticipant) { - drawLine(parentGfx, [ + var waypoints = horizontalParticipant ? [ { x: 30, y: 0 @@ -1808,20 +1813,43 @@ export default function BpmnRenderer( x: 30, y: getHeight(element, attrs) } - ], { + ] : [ + { + x: 0, + y: 30 + }, + { + x: getWidth(element, attrs), + y: 30 + } + ]; + + drawLine(parentGfx, waypoints, { stroke: getStrokeColor(element, defaultStrokeColor, attrs.stroke), strokeWidth: PARTICIPANT_STROKE_WIDTH }); renderLaneLabel(parentGfx, name, element, attrs); } else { - renderLabel(parentGfx, name, { - box: getBounds(element, attrs), + var bounds = getBounds(element, attrs); + + if (!horizontalParticipant) { + bounds.height = getWidth(element, attrs); + bounds.width = getHeight(element, attrs); + } + + var textBox = renderLabel(parentGfx, name, { + box: bounds, align: 'center-middle', style: { fill: getLabelColor(element, defaultLabelColor, defaultStrokeColor, attrs.stroke) } }); + + if (!horizontalParticipant) { + var top = -1 * getHeight(element, attrs); + transform(textBox, 0, -top, 270); + } } if (semantic.get('participantMultiplicity')) { diff --git a/lib/features/modeling/behavior/IsHorizontalFix.js b/lib/features/modeling/behavior/IsHorizontalFix.js index 68fb5e6b15..d76c036bb5 100644 --- a/lib/features/modeling/behavior/IsHorizontalFix.js +++ b/lib/features/modeling/behavior/IsHorizontalFix.js @@ -35,10 +35,15 @@ export default function IsHorizontalFix(eventBus) { bo = getBusinessObject(shape), di = getDi(shape); - if (isAny(bo, elementTypesToUpdate) && !di.get('isHorizontal')) { + if (isAny(bo, elementTypesToUpdate)) { + var isHorizontal = di.get('isHorizontal'); + + if (isHorizontal === undefined) { + isHorizontal = true; + } // set attribute directly to avoid modeling#updateProperty side effects - di.set('isHorizontal', true); + di.set('isHorizontal', isHorizontal); } }); diff --git a/lib/util/DiUtil.js b/lib/util/DiUtil.js index 775b847034..c2731ea518 100644 --- a/lib/util/DiUtil.js +++ b/lib/util/DiUtil.js @@ -42,6 +42,26 @@ export function isExpanded(element, di) { return true; } +/** + * @param {Element} element + * + * @return {boolean} + */ +export function isHorizontal(element) { + + if (!is(element, 'bpmn:Participant') && !is(element, 'bpmn:Lane')) { + return undefined; + } + + var isHorizontal = getDi(element).isHorizontal; + + if (isHorizontal === undefined) { + return true; + } + + return isHorizontal; +} + /** * @param {Element} element * diff --git a/test/fixtures/bpmn/draw/vertical-pools.bpmn b/test/fixtures/bpmn/draw/vertical-pools.bpmn new file mode 100644 index 0000000000..f5b4d69882 --- /dev/null +++ b/test/fixtures/bpmn/draw/vertical-pools.bpmn @@ -0,0 +1,52 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/test/spec/draw/BpmnRendererSpec.js b/test/spec/draw/BpmnRendererSpec.js index d2e555dbee..ba82f7f123 100644 --- a/test/spec/draw/BpmnRendererSpec.js +++ b/test/spec/draw/BpmnRendererSpec.js @@ -214,6 +214,15 @@ describe('draw - bpmn renderer', function() { }); + it('should render vertical pools', function() { + var xml = require('../../fixtures/bpmn/draw/vertical-pools.bpmn'); + return bootstrapViewer(xml).call(this).then(function(result) { + + checkErrors(result.error, result.warnings); + }); + }); + + it('should render pool collection marker', function() { var xml = require('../../fixtures/bpmn/draw/pools-with-collection-marker.bpmn'); return bootstrapViewer(xml).call(this).then(function(result) { From bada2a895e96876601f031c95b26569e9639deb1 Mon Sep 17 00:00:00 2001 From: Daniel <150448993+sombrek@users.noreply.github.com> Date: Sun, 12 Nov 2023 16:40:38 +0100 Subject: [PATCH 2/5] feat(bpmn-renderer): render vertical pools and lanes --- lib/draw/BpmnRenderer.js | 44 +++++++++++++--- .../modeling/behavior/IsHorizontalFix.js | 9 +++- lib/util/DiUtil.js | 20 +++++++ test/fixtures/bpmn/draw/vertical-pools.bpmn | 52 +++++++++++++++++++ test/spec/draw/BpmnRendererSpec.js | 9 ++++ 5 files changed, 124 insertions(+), 10 deletions(-) create mode 100644 test/fixtures/bpmn/draw/vertical-pools.bpmn diff --git a/lib/draw/BpmnRenderer.js b/lib/draw/BpmnRenderer.js index a344b1528a..757a854799 100644 --- a/lib/draw/BpmnRenderer.js +++ b/lib/draw/BpmnRenderer.js @@ -10,6 +10,7 @@ import BaseRenderer from 'diagram-js/lib/draw/BaseRenderer'; import { isExpanded, + isHorizontal, isEventSubProcess } from '../util/DiUtil'; @@ -1063,10 +1064,12 @@ export default function BpmnRenderer( } function renderLaneLabel(parentGfx, text, element, attrs = {}) { + var isHorizontalLane = isHorizontal(element); + var textBox = renderLabel(parentGfx, text, { box: { height: 30, - width: getHeight(element, attrs), + width: isHorizontalLane ? getHeight(element, attrs) : getWidth(element, attrs), }, align: 'center-middle', style: { @@ -1074,9 +1077,10 @@ export default function BpmnRenderer( } }); - var top = -1 * getHeight(element, attrs); - - transform(textBox, 0, -top, 270); + if (isHorizontalLane) { + var top = -1 * getHeight(element, attrs); + transform(textBox, 0, -top, 270); + } } function renderActivity(parentGfx, element, attrs = {}) { @@ -1794,12 +1798,13 @@ export default function BpmnRenderer( var participant = renderLane(parentGfx, element, attrs); var expandedParticipant = isExpanded(element); + var horizontalParticipant = isHorizontal(element); var semantic = getSemantic(element), name = semantic.get('name'); if (expandedParticipant) { - drawLine(parentGfx, [ + var waypoints = horizontalParticipant ? [ { x: 30, y: 0 @@ -1808,20 +1813,43 @@ export default function BpmnRenderer( x: 30, y: getHeight(element, attrs) } - ], { + ] : [ + { + x: 0, + y: 30 + }, + { + x: getWidth(element, attrs), + y: 30 + } + ]; + + drawLine(parentGfx, waypoints, { stroke: getStrokeColor(element, defaultStrokeColor, attrs.stroke), strokeWidth: PARTICIPANT_STROKE_WIDTH }); renderLaneLabel(parentGfx, name, element, attrs); } else { - renderLabel(parentGfx, name, { - box: getBounds(element, attrs), + var bounds = getBounds(element, attrs); + + if (!horizontalParticipant) { + bounds.height = getWidth(element, attrs); + bounds.width = getHeight(element, attrs); + } + + var textBox = renderLabel(parentGfx, name, { + box: bounds, align: 'center-middle', style: { fill: getLabelColor(element, defaultLabelColor, defaultStrokeColor, attrs.stroke) } }); + + if (!horizontalParticipant) { + var top = -1 * getHeight(element, attrs); + transform(textBox, 0, -top, 270); + } } if (semantic.get('participantMultiplicity')) { diff --git a/lib/features/modeling/behavior/IsHorizontalFix.js b/lib/features/modeling/behavior/IsHorizontalFix.js index 68fb5e6b15..d76c036bb5 100644 --- a/lib/features/modeling/behavior/IsHorizontalFix.js +++ b/lib/features/modeling/behavior/IsHorizontalFix.js @@ -35,10 +35,15 @@ export default function IsHorizontalFix(eventBus) { bo = getBusinessObject(shape), di = getDi(shape); - if (isAny(bo, elementTypesToUpdate) && !di.get('isHorizontal')) { + if (isAny(bo, elementTypesToUpdate)) { + var isHorizontal = di.get('isHorizontal'); + + if (isHorizontal === undefined) { + isHorizontal = true; + } // set attribute directly to avoid modeling#updateProperty side effects - di.set('isHorizontal', true); + di.set('isHorizontal', isHorizontal); } }); diff --git a/lib/util/DiUtil.js b/lib/util/DiUtil.js index 775b847034..c2731ea518 100644 --- a/lib/util/DiUtil.js +++ b/lib/util/DiUtil.js @@ -42,6 +42,26 @@ export function isExpanded(element, di) { return true; } +/** + * @param {Element} element + * + * @return {boolean} + */ +export function isHorizontal(element) { + + if (!is(element, 'bpmn:Participant') && !is(element, 'bpmn:Lane')) { + return undefined; + } + + var isHorizontal = getDi(element).isHorizontal; + + if (isHorizontal === undefined) { + return true; + } + + return isHorizontal; +} + /** * @param {Element} element * diff --git a/test/fixtures/bpmn/draw/vertical-pools.bpmn b/test/fixtures/bpmn/draw/vertical-pools.bpmn new file mode 100644 index 0000000000..f5b4d69882 --- /dev/null +++ b/test/fixtures/bpmn/draw/vertical-pools.bpmn @@ -0,0 +1,52 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/test/spec/draw/BpmnRendererSpec.js b/test/spec/draw/BpmnRendererSpec.js index d2e555dbee..ba82f7f123 100644 --- a/test/spec/draw/BpmnRendererSpec.js +++ b/test/spec/draw/BpmnRendererSpec.js @@ -214,6 +214,15 @@ describe('draw - bpmn renderer', function() { }); + it('should render vertical pools', function() { + var xml = require('../../fixtures/bpmn/draw/vertical-pools.bpmn'); + return bootstrapViewer(xml).call(this).then(function(result) { + + checkErrors(result.error, result.warnings); + }); + }); + + it('should render pool collection marker', function() { var xml = require('../../fixtures/bpmn/draw/pools-with-collection-marker.bpmn'); return bootstrapViewer(xml).call(this).then(function(result) { From c4656d1e3125ae8848081703e6df182887822b17 Mon Sep 17 00:00:00 2001 From: Daniel <150448993+sombrek@users.noreply.github.com> Date: Sun, 12 Nov 2023 16:40:38 +0100 Subject: [PATCH 3/5] feat(bpmn-renderer): render vertical pools and lanes --- lib/draw/BpmnRenderer.js | 44 +++++++++++++--- .../modeling/behavior/IsHorizontalFix.js | 9 +++- lib/util/DiUtil.js | 20 +++++++ test/fixtures/bpmn/draw/vertical-pools.bpmn | 52 +++++++++++++++++++ test/spec/draw/BpmnRendererSpec.js | 9 ++++ 5 files changed, 124 insertions(+), 10 deletions(-) create mode 100644 test/fixtures/bpmn/draw/vertical-pools.bpmn diff --git a/lib/draw/BpmnRenderer.js b/lib/draw/BpmnRenderer.js index a344b1528a..757a854799 100644 --- a/lib/draw/BpmnRenderer.js +++ b/lib/draw/BpmnRenderer.js @@ -10,6 +10,7 @@ import BaseRenderer from 'diagram-js/lib/draw/BaseRenderer'; import { isExpanded, + isHorizontal, isEventSubProcess } from '../util/DiUtil'; @@ -1063,10 +1064,12 @@ export default function BpmnRenderer( } function renderLaneLabel(parentGfx, text, element, attrs = {}) { + var isHorizontalLane = isHorizontal(element); + var textBox = renderLabel(parentGfx, text, { box: { height: 30, - width: getHeight(element, attrs), + width: isHorizontalLane ? getHeight(element, attrs) : getWidth(element, attrs), }, align: 'center-middle', style: { @@ -1074,9 +1077,10 @@ export default function BpmnRenderer( } }); - var top = -1 * getHeight(element, attrs); - - transform(textBox, 0, -top, 270); + if (isHorizontalLane) { + var top = -1 * getHeight(element, attrs); + transform(textBox, 0, -top, 270); + } } function renderActivity(parentGfx, element, attrs = {}) { @@ -1794,12 +1798,13 @@ export default function BpmnRenderer( var participant = renderLane(parentGfx, element, attrs); var expandedParticipant = isExpanded(element); + var horizontalParticipant = isHorizontal(element); var semantic = getSemantic(element), name = semantic.get('name'); if (expandedParticipant) { - drawLine(parentGfx, [ + var waypoints = horizontalParticipant ? [ { x: 30, y: 0 @@ -1808,20 +1813,43 @@ export default function BpmnRenderer( x: 30, y: getHeight(element, attrs) } - ], { + ] : [ + { + x: 0, + y: 30 + }, + { + x: getWidth(element, attrs), + y: 30 + } + ]; + + drawLine(parentGfx, waypoints, { stroke: getStrokeColor(element, defaultStrokeColor, attrs.stroke), strokeWidth: PARTICIPANT_STROKE_WIDTH }); renderLaneLabel(parentGfx, name, element, attrs); } else { - renderLabel(parentGfx, name, { - box: getBounds(element, attrs), + var bounds = getBounds(element, attrs); + + if (!horizontalParticipant) { + bounds.height = getWidth(element, attrs); + bounds.width = getHeight(element, attrs); + } + + var textBox = renderLabel(parentGfx, name, { + box: bounds, align: 'center-middle', style: { fill: getLabelColor(element, defaultLabelColor, defaultStrokeColor, attrs.stroke) } }); + + if (!horizontalParticipant) { + var top = -1 * getHeight(element, attrs); + transform(textBox, 0, -top, 270); + } } if (semantic.get('participantMultiplicity')) { diff --git a/lib/features/modeling/behavior/IsHorizontalFix.js b/lib/features/modeling/behavior/IsHorizontalFix.js index 68fb5e6b15..d76c036bb5 100644 --- a/lib/features/modeling/behavior/IsHorizontalFix.js +++ b/lib/features/modeling/behavior/IsHorizontalFix.js @@ -35,10 +35,15 @@ export default function IsHorizontalFix(eventBus) { bo = getBusinessObject(shape), di = getDi(shape); - if (isAny(bo, elementTypesToUpdate) && !di.get('isHorizontal')) { + if (isAny(bo, elementTypesToUpdate)) { + var isHorizontal = di.get('isHorizontal'); + + if (isHorizontal === undefined) { + isHorizontal = true; + } // set attribute directly to avoid modeling#updateProperty side effects - di.set('isHorizontal', true); + di.set('isHorizontal', isHorizontal); } }); diff --git a/lib/util/DiUtil.js b/lib/util/DiUtil.js index 775b847034..c2731ea518 100644 --- a/lib/util/DiUtil.js +++ b/lib/util/DiUtil.js @@ -42,6 +42,26 @@ export function isExpanded(element, di) { return true; } +/** + * @param {Element} element + * + * @return {boolean} + */ +export function isHorizontal(element) { + + if (!is(element, 'bpmn:Participant') && !is(element, 'bpmn:Lane')) { + return undefined; + } + + var isHorizontal = getDi(element).isHorizontal; + + if (isHorizontal === undefined) { + return true; + } + + return isHorizontal; +} + /** * @param {Element} element * diff --git a/test/fixtures/bpmn/draw/vertical-pools.bpmn b/test/fixtures/bpmn/draw/vertical-pools.bpmn new file mode 100644 index 0000000000..f5b4d69882 --- /dev/null +++ b/test/fixtures/bpmn/draw/vertical-pools.bpmn @@ -0,0 +1,52 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/test/spec/draw/BpmnRendererSpec.js b/test/spec/draw/BpmnRendererSpec.js index d2e555dbee..ba82f7f123 100644 --- a/test/spec/draw/BpmnRendererSpec.js +++ b/test/spec/draw/BpmnRendererSpec.js @@ -214,6 +214,15 @@ describe('draw - bpmn renderer', function() { }); + it('should render vertical pools', function() { + var xml = require('../../fixtures/bpmn/draw/vertical-pools.bpmn'); + return bootstrapViewer(xml).call(this).then(function(result) { + + checkErrors(result.error, result.warnings); + }); + }); + + it('should render pool collection marker', function() { var xml = require('../../fixtures/bpmn/draw/pools-with-collection-marker.bpmn'); return bootstrapViewer(xml).call(this).then(function(result) { From a5e2ac2773db5676f17f01bb409891fcaa7ba8f5 Mon Sep 17 00:00:00 2001 From: Daniel <150448993+sombrek@users.noreply.github.com> Date: Thu, 30 Nov 2023 20:31:43 +0100 Subject: [PATCH 4/5] test: check isHorizontal after movement --- .../modeling/behavior/IsHorizontalFix.bpmn | 54 +++++++++++++-- .../modeling/behavior/IsHorizontalFixSpec.js | 68 +++++++++++++++++++ 2 files changed, 117 insertions(+), 5 deletions(-) diff --git a/test/spec/features/modeling/behavior/IsHorizontalFix.bpmn b/test/spec/features/modeling/behavior/IsHorizontalFix.bpmn index d3da434f91..909974e678 100644 --- a/test/spec/features/modeling/behavior/IsHorizontalFix.bpmn +++ b/test/spec/features/modeling/behavior/IsHorizontalFix.bpmn @@ -2,8 +2,10 @@ + + - + StartEvent_1 @@ -21,19 +23,61 @@ + + + + + Event_01335ir + + + + + + + + Event_02alkvt + + + + + - - + + - - + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/test/spec/features/modeling/behavior/IsHorizontalFixSpec.js b/test/spec/features/modeling/behavior/IsHorizontalFixSpec.js index 8619421918..109463b19e 100644 --- a/test/spec/features/modeling/behavior/IsHorizontalFixSpec.js +++ b/test/spec/features/modeling/behavior/IsHorizontalFixSpec.js @@ -94,6 +94,40 @@ describe('features/modeling/behavior - IsHorizontalFix', function() { ); + it('should keep isHorizontal=true when participant is moved', + inject(function(elementRegistry, modeling) { + + // given + var participant = elementRegistry.get('Horizontal_Participant'); + + // when + modeling.moveElements([ participant ], { x: 0, y: 0 }); + + // then + var isHorizontal = getDi(participant).get('isHorizontal'); + + expect(isHorizontal).to.be.true; + }) + ); + + + it('should keep isHorizontal=false when participant is moved', + inject(function(elementRegistry, modeling) { + + // given + var participant = elementRegistry.get('Vertical_Participant'); + + // when + modeling.moveElements([ participant ], { x: 0, y: 0 }); + + // then + var isHorizontal = getDi(participant).get('isHorizontal'); + + expect(isHorizontal).to.be.false; + }) + ); + + it('should set isHorizontal=true when lane is moved', inject(function(elementRegistry, modeling) { @@ -111,6 +145,40 @@ describe('features/modeling/behavior - IsHorizontalFix', function() { ); + it('should keep isHorizontal=true when lane is moved', + inject(function(elementRegistry, modeling) { + + // given + var lane = elementRegistry.get('Horizontal_Lane'); + + // when + modeling.moveElements([ lane ], { x: 0, y: 0 }); + + // then + var isHorizontal = getDi(lane).get('isHorizontal'); + + expect(isHorizontal).to.be.true; + }) + ); + + + it('should keep isHorizontal=false when lane is moved', + inject(function(elementRegistry, modeling) { + + // given + var lane = elementRegistry.get('Vertical_Lane'); + + // when + modeling.moveElements([ lane ], { x: 0, y: 0 }); + + // then + var isHorizontal = getDi(lane).get('isHorizontal'); + + expect(isHorizontal).to.be.false; + }) + ); + + it('should set isHorizontal=true when participant is resized', inject(function(elementRegistry, modeling) { From b811b4c8bc437fa355e4393b0e41e630f5bd122c Mon Sep 17 00:00:00 2001 From: Daniel <150448993+sombrek@users.noreply.github.com> Date: Sat, 2 Dec 2023 17:26:21 +0100 Subject: [PATCH 5/5] feat: edit vertical pool/lane labels --- .../label-editing/LabelEditingProvider.js | 49 ++++- .../features/label-editing/LabelEditing.bpmn | 23 +++ .../label-editing/LabelEditingProviderSpec.js | 180 ++++++++++++++++++ 3 files changed, 246 insertions(+), 6 deletions(-) diff --git a/lib/features/label-editing/LabelEditingProvider.js b/lib/features/label-editing/LabelEditingProvider.js index 464cb67b11..1a09456377 100644 --- a/lib/features/label-editing/LabelEditingProvider.js +++ b/lib/features/label-editing/LabelEditingProvider.js @@ -11,7 +11,11 @@ import { } from '../../util/ModelUtil'; import { isAny } from '../modeling/util/ModelingUtil'; -import { isExpanded } from '../../util/DiUtil'; + +import { + isExpanded, + isHorizontal +} from '../../util/DiUtil'; import { getExternalLabelMid, @@ -277,13 +281,47 @@ LabelEditingProvider.prototype.getEditingBBox = function(element) { // adjust for expanded pools AND lanes if (is(element, 'bpmn:Lane') || isExpandedPool(element)) { + var isHorizontalLane = isHorizontal(element); - assign(bounds, { + var laneBounds = isHorizontalLane ? { width: bbox.height, height: 30 * zoom, x: bbox.x - bbox.height / 2 + (15 * zoom), y: mid.y - (30 * zoom) / 2 + } : { + width: bbox.width, + height: 30 * zoom + }; + + assign(bounds, laneBounds); + + assign(style, { + fontSize: defaultFontSize + 'px', + lineHeight: defaultLineHeight, + paddingTop: (7 * zoom) + 'px', + paddingBottom: (7 * zoom) + 'px', + paddingLeft: (5 * zoom) + 'px', + paddingRight: (5 * zoom) + 'px', + transform: isHorizontalLane ? 'rotate(-90deg)' : null }); + } + + + // internal labels for collapsed participants + if (isCollapsedPool(element)) { + var isHorizontalPool = isHorizontal(element); + + var poolBounds = isHorizontalPool ? { + width: bbox.width, + height: bbox.height + } : { + width: bbox.height, + height: bbox.width, + x: mid.x - bbox.height / 2, + y: mid.y - bbox.width / 2 + }; + + assign(bounds, poolBounds); assign(style, { fontSize: defaultFontSize + 'px', @@ -292,15 +330,14 @@ LabelEditingProvider.prototype.getEditingBBox = function(element) { paddingBottom: (7 * zoom) + 'px', paddingLeft: (5 * zoom) + 'px', paddingRight: (5 * zoom) + 'px', - transform: 'rotate(-90deg)' + transform: isHorizontalPool ? null : 'rotate(-90deg)' }); } - // internal labels for tasks and collapsed call activities, - // sub processes and participants + // internal labels for tasks and collapsed call activities + // and sub processes if (isAny(element, [ 'bpmn:Task', 'bpmn:CallActivity' ]) || - isCollapsedPool(element) || isCollapsedSubProcess(element)) { assign(bounds, { diff --git a/test/spec/features/label-editing/LabelEditing.bpmn b/test/spec/features/label-editing/LabelEditing.bpmn index 2abd9877be..5c68c87479 100644 --- a/test/spec/features/label-editing/LabelEditing.bpmn +++ b/test/spec/features/label-editing/LabelEditing.bpmn @@ -3,6 +3,8 @@ + + FOO @@ -75,6 +77,12 @@ + + + + + + @@ -193,6 +201,21 @@ + + + + + + + + + + + + + + + diff --git a/test/spec/features/label-editing/LabelEditingProviderSpec.js b/test/spec/features/label-editing/LabelEditingProviderSpec.js index 8cd42dec33..5dd6e3449b 100644 --- a/test/spec/features/label-editing/LabelEditingProviderSpec.js +++ b/test/spec/features/label-editing/LabelEditingProviderSpec.js @@ -500,6 +500,10 @@ describe('features - label-editing', function() { it('pool, collapsed', directEdit('Participant_2')); + it('vertical pool', directEdit('Participant_3')); + + it('vertical pool, collapsed', directEdit('Participant_4')); + it('lane with label', directEdit('Lane_1')); @@ -932,6 +936,182 @@ describe('features - label-editing', function() { }); + + describe('collapsed pools', function() { + + it('[zoom 1] should have width/height of element', inject( + function(canvas, directEditing, elementRegistry) { + + // given + var zoom = 1; + + canvas.zoom(zoom); + + var pool = elementRegistry.get('Participant_2'); + + var bounds = canvas.getAbsoluteBBox(pool); + + // when + directEditing.activate(pool); + + // then + expectBounds(directEditing._textbox.parent, { + x: bounds.x, + y: bounds.y, + width: bounds.width, + height: bounds.height + }); + } + )); + + + it('[zoom 1.5] should have width/height of element', inject( + function(canvas, directEditing, elementRegistry) { + + // given + var zoom = 1.5; + + canvas.zoom(zoom); + + var pool = elementRegistry.get('Participant_2'); + + var bounds = canvas.getAbsoluteBBox(pool); + + // when + directEditing.activate(pool); + + // then + expectBounds(directEditing._textbox.parent, { + x: bounds.x, + y: bounds.y, + width: bounds.width, + height: bounds.height + }); + } + )); + + }); + + + describe('vertical pools/lanes', function() { + + it('[zoom 1] should have width of element width, height of 30', inject( + function(canvas, directEditing, elementRegistry) { + + // given + var zoom = 1; + + canvas.zoom(zoom); + + var pool = elementRegistry.get('Participant_3'); + + var bounds = canvas.getAbsoluteBBox(pool); + + // when + directEditing.activate(pool); + + // then + expectBounds(directEditing._textbox.parent, { + x: bounds.x, + y: bounds.y, + width: bounds.width, + height: 30 * zoom + }); + } + )); + + + it('[zoom 1.5] should have width of element width, height of 30', inject( + function(canvas, directEditing, elementRegistry) { + + // given + var zoom = 1.5; + + canvas.zoom(zoom); + + var pool = elementRegistry.get('Participant_3'); + + var bounds = canvas.getAbsoluteBBox(pool); + + // when + directEditing.activate(pool); + + // then + expectBounds(directEditing._textbox.parent, { + x: bounds.x, + y: bounds.y, + width: bounds.width, + height: 30 * zoom + }); + } + )); + + }); + + + describe('vertical collapsed pools', function() { + + it('[zoom 1] should have width/height of element', inject( + function(canvas, directEditing, elementRegistry) { + + // given + var zoom = 1; + + canvas.zoom(zoom); + + var pool = elementRegistry.get('Participant_4'); + + var bounds = canvas.getAbsoluteBBox(pool); + var mid = { + x: bounds.x + bounds.width / 2, + y: bounds.y + bounds.height / 2 + }; + + // when + directEditing.activate(pool); + + // then + expectBounds(directEditing._textbox.parent, { + x: mid.x - bounds.height / 2, + y: mid.y - bounds.width / 2, + width: bounds.height, + height: bounds.width + }); + } + )); + + + it('[zoom 1.5] should have width/height of element', inject( + function(canvas, directEditing, elementRegistry) { + + // given + var zoom = 1.5; + + canvas.zoom(zoom); + + var pool = elementRegistry.get('Participant_4'); + + var bounds = canvas.getAbsoluteBBox(pool); + var mid = { + x: bounds.x + bounds.width / 2, + y: bounds.y + bounds.height / 2 + }; + + // when + directEditing.activate(pool); + + // then + expectBounds(directEditing._textbox.parent, { + x: mid.x - bounds.height / 2, + y: mid.y - bounds.width / 2, + width: bounds.height, + height: bounds.width + }); + } + )); + + }); + }); });