feat: add Overlays to navigate collapsed subprocesses

This introduces a new css file to bpmn-js. To upgrade, please include
`dist/assets/bpmn-js.css` in your application.

closes #1483
This commit is contained in:
Martin Stamm 2021-10-18 10:28:36 +02:00 committed by Nico Rehwaldt
parent 4a04719869
commit 495997607c
13 changed files with 1072 additions and 24 deletions

51
assets/bpmn-js.css Normal file
View File

@ -0,0 +1,51 @@
.bjs-container {
--bjs-font-family: Arial, sans-serif;
}
.bjs-breadcrumbs {
position: absolute;
top: 10px;
left: 100px;
font-family: var(--bjs-font-family);
}
.bjs-breadcrumbs li {
display: inline-block;
color: var(--blue-base-65);
cursor: pointer;
}
.bjs-breadcrumbs li:last-of-type {
color: inherit;
cursor: default;
}
.bjs-breadcrumbs li:not(:first-child)::before {
content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 24 24"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" /><path d="M0 0h24v24H0z" fill="none" /></svg>');
padding: 0 8px;
color: black;
}
.bjs-breadcrumbs .bpmnjs-crumb {
display: inline-block;
max-width: 200px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.bjs-drilldown {
width: 20px;
height: 20px;
padding: 0px;
margin-left: -20px;
cursor: pointer;
border: none;
border-radius: 2px;
outline: none;
fill: white;
background-color: var(--blue-base-65);
}

View File

@ -4,6 +4,7 @@ import CoreModule from './core';
import TranslateModule from 'diagram-js/lib/i18n/translate';
import SelectionModule from 'diagram-js/lib/features/selection';
import OverlaysModule from 'diagram-js/lib/features/overlays';
import SubprocessNavigationModule from './features/subprocess-navigation';
import BaseViewer from './BaseViewer';
@ -66,7 +67,8 @@ Viewer.prototype._modules = [
CoreModule,
TranslateModule,
SelectionModule,
OverlaysModule
OverlaysModule,
SubprocessNavigationModule
];
// default moddle extensions the viewer is composed of

View File

@ -0,0 +1,35 @@
export default function SubprocessCentering(eventBus, canvas) {
var currentPlane = 'base';
var positionMap = {};
eventBus.on('plane.set', function(event) {
var currentViewbox = canvas.viewbox();
positionMap[currentPlane] = {
x: currentViewbox.x,
y: currentViewbox.y,
zoom: currentViewbox.scale
};
var planeId = event.plane.name;
var storedViewbox = positionMap[planeId] || { x: 0, y: 0, zoom: 1 };
var dx = (currentViewbox.x - storedViewbox.x) * currentViewbox.scale,
dy = (currentViewbox.y - storedViewbox.y) * currentViewbox.scale;
if (dx !== 0 || dy !== 0) {
canvas.scroll({
dx: dx,
dy: dy
});
}
if (storedViewbox.zoom !== currentViewbox.scale) {
canvas.zoom(storedViewbox.zoom, { x: 0, y: 0 });
}
currentPlane = planeId;
});
}
SubprocessCentering.$inject = [ 'eventBus', 'canvas' ];

View File

@ -0,0 +1,135 @@
import { selfAndAllChildren } from 'diagram-js/lib/util/Elements';
import { isExpanded } from '../../util/DiUtil';
import { getBusinessObject, getDi, is } from '../../util/ModelUtil';
export default function SubprocessCompatibility(eventBus, elementRegistry, canvas, moddle, elementFactory, bpmnjs) {
this._eventBus = eventBus;
this._elementRegistry = elementRegistry;
this._canvas = canvas;
this._bpmnjs = bpmnjs;
this._moddle = moddle;
this._elementFactory = elementFactory;
var self = this;
eventBus.on('import.done', 1500, function() {
self._handleImport();
});
}
SubprocessCompatibility.prototype._handleImport = function() {
var elementRegistry = this._elementRegistry;
var canvas = this._canvas;
var elementFactory = this._elementFactory;
var self = this;
var legacyProcesses = elementRegistry.filter(function(element) {
return is(element, 'bpmn:SubProcess') && !isExpanded(element) && element.children && element.children.length;
});
legacyProcesses.forEach(function(oldParent) {
var bo = getBusinessObject(oldParent);
var newDiagram = self.createDiagram(bo);
var newParent = elementFactory.createRoot(
{
id: bo.id,
type: bo.$type,
businessObject: bo,
di: newDiagram.plane
}
);
newParent.id = newParent.id + '_plane';
canvas.createPlane(bo.id, newParent);
var elementsToChange = selfAndAllChildren(oldParent).filter(function(el) {
return el !== oldParent;
});
self.moveElementsToRoot(elementsToChange);
elementsToChange.forEach(function(el) {
if (el.parent === oldParent) {
el.parent = newParent;
}
el.hidden = el.parent && (el.parent.hidden || el.parent.collapsed);
self.moveToDiPlane(el, newDiagram.plane);
self._eventBus.fire('elements.changed', { elements: [el] });
});
});
};
SubprocessCompatibility.prototype.moveToDiPlane = function(element, newPlane) {
var di = getDi(element);
var containingDiagram = findRootDiagram(di);
// Remove DI from old Plane and add it to the new one
var parentPlaneElement = containingDiagram.plane.get('planeElement');
parentPlaneElement.splice(parentPlaneElement.indexOf(di), 1);
newPlane.get('planeElement').push(di);
};
SubprocessCompatibility.prototype.moveElementsToRoot = function(elements) {
var defaultPosition = { x: 180, y: 160 },
minX = Infinity,
minY = Infinity;
elements.forEach(function(el) {
minX = Math.min(minX, el.x || Infinity);
minY = Math.min(minY, el.y || Infinity);
});
var xOffset = defaultPosition.x - minX;
var yOffset = defaultPosition.y - minY;
elements.forEach(function(el) {
if (el.waypoints) {
el.waypoints.forEach(function(waypoint) {
waypoint.x = waypoint.x + xOffset;
waypoint.y = waypoint.y + yOffset;
});
} else {
el.x = el.x + xOffset;
el.y = el.y + yOffset;
}
});
};
SubprocessCompatibility.prototype.getDefinitions = function() {
return this._bpmnjs._definitions || [];
};
SubprocessCompatibility.prototype.getDiagrams = function() {
return this.getDefinitions().diagrams || [];
};
SubprocessCompatibility.prototype.createDiagram = function(bo) {
var plane = this._moddle.create('bpmndi:BPMNPlane', { bpmnElement: bo });
var diagram = this._moddle.create('bpmndi:BPMNDiagram', {
plane: plane
});
plane.$parent = diagram;
plane.bpmnElement = bo;
diagram.$parent = this.getDefinitions();
this.getDiagrams().push(diagram);
return diagram;
};
SubprocessCompatibility.$inject = [ 'eventBus', 'elementRegistry', 'canvas', 'moddle', 'elementFactory', 'bpmnjs' ];
// Util
var findRootDiagram = function(element) {
if (is(element, 'bpmndi:BPMNDiagram')) {
return element;
} else {
return findRootDiagram(element.$parent);
}
};

View File

@ -0,0 +1,100 @@
import { domify } from 'min-dom';
import { escapeHTML } from 'diagram-js/lib/util/EscapeUtil';
import { getBusinessObject, is } from '../../util/ModelUtil';
var ARROW_DOWN_SVG = '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M4.81801948,3.50735931 L10.4996894,9.1896894 L10.5,4 L12,4 L12,12 L4,12 L4,10.5 L9.6896894,10.4996894 L3.75735931,4.56801948 C3.46446609,4.27512627 3.46446609,3.80025253 3.75735931,3.50735931 C4.05025253,3.21446609 4.52512627,3.21446609 4.81801948,3.50735931 Z"/></svg>';
export default function SubprocessOverlays(eventBus, elementRegistry, overlays, canvas) {
var breadcrumbs = domify('<ul class="bjs-breadcrumbs djs-element-hidden"></ul>');
var container = canvas.getContainer();
container.appendChild(breadcrumbs);
function updateBreadcrumbs(plane) {
var subProcess = elementRegistry.get(plane.name);
var parents = getParentChain(subProcess);
var path = parents.map(function(el) {
var title = escapeHTML(el.name) || el.id;
var link = domify('<li><span class="bpmnjs-crumb"><a title="' + title + '">' + title + '</a></span></li>');
link.addEventListener('click', function() {
if (canvas.getPlane(el.id)) {
canvas.setActivePlane(el.id);
} else {
var plane = canvas.findPlane(el.id);
canvas.setActivePlane(plane);
}
});
return link;
});
breadcrumbs.innerHTML = '';
if (path.length > 1) {
breadcrumbs.classList.remove('djs-element-hidden');
} else {
breadcrumbs.classList.add('djs-element-hidden');
}
path.forEach(function(el) {
breadcrumbs.appendChild(el);
});
}
eventBus.on('plane.set', function(event) {
var plane = event.plane;
updateBreadcrumbs(plane);
});
var createOverlay = function(element) {
var html = domify('<button class="bjs-drilldown">' + ARROW_DOWN_SVG + '</button>');
html.addEventListener('click', function() {
canvas.setActivePlane(element.id);
});
overlays.add(element, {
position: {
bottom: -7,
right: -8
},
html: html
});
};
var addOverlays = function(elements) {
elements.forEach(function(element) {
if (is(element, 'bpmn:SubProcess')
&& element.collapsed
&& canvas.getPlane(element.id)) {
createOverlay(element);
}
});
};
eventBus.on('import.done', function() {
addOverlays(elementRegistry.filter(function(el) {
return is(el, 'bpmn:SubProcess');
}));
});
}
SubprocessOverlays.$inject = [ 'eventBus', 'elementRegistry', 'overlays', 'canvas' ];
var getParentChain = function(child) {
var bo = getBusinessObject(child);
var parents = [];
for (var element = bo; element; element = element.$parent) {
if (is(element, 'bpmn:SubProcess') || is(element, 'bpmn:Process')) {
parents.push(element);
}
}
return parents.reverse();
};

View File

@ -0,0 +1,14 @@
import OverlaysModule from 'diagram-js/lib/features/overlays';
import ChangeSupportModule from 'diagram-js/lib/features/change-support';
import SubprocessCentering from './SubprocessCentering';
import SubprocessCompatibility from './SubprocessCompatibility';
import SubprocessOverlays from './SubprocessOverlays';
export default {
__depends__: [ OverlaysModule, ChangeSupportModule ],
__init__: [ 'subprocessOverlays', 'subprocessCompatibility', 'subprocessCentering' ],
subprocessOverlays: [ 'type', SubprocessOverlays ],
subprocessCompatibility: [ 'type', SubprocessCompatibility ],
subprocessCentering: [ 'type', SubprocessCentering ]
};

View File

@ -28,6 +28,9 @@ cp(resolve('bpmn-font', '/dist/{font,css}/**'), dest + '/assets/bpmn-font');
console.log('copy diagram-js.css to ' + dest);
cp(resolve('diagram-js', '/assets/**'), dest + '/assets');
console.log('copy bpmn-js.css to ' + dest);
cp('./assets/bpmn-js.css', dest + '/assets');
console.log('building pre-packaged distributions');
var NODE_ENV = process.env.NODE_ENV;

View File

@ -4,6 +4,8 @@ import {
insertCSS
} from './helper';
insertCSS('bpmn-js.css', require('../assets/bpmn-js.css'));
insertCSS('diagram-js.css', require('diagram-js/assets/diagram-js.css'));
insertCSS('bpmn-embedded.css', require('bpmn-font/dist/css/bpmn-embedded.css'));

View File

@ -0,0 +1,210 @@
import {
inject
} from 'test/TestHelper';
import coreModule from 'lib/core';
import subprocessNavigationModule from 'lib/features/subprocess-navigation';
import { bootstrapViewer } from '../../../helper';
describe('features - subprocess-navigation', function() {
var testModules = [
coreModule,
subprocessNavigationModule
];
var multiLayerXML = require('./nested-subprocesses.bpmn');
var legacyXML = require('./legacy-subprocesses.bpmn');
beforeEach(bootstrapViewer(multiLayerXML, { modules: testModules }));
describe('Overlays', function() {
it('should show overlay on Subprocess with content', inject(function(elementRegistry, overlays) {
// given
var collapsedProcess = elementRegistry.get('collapsedProcess');
var overlay = overlays.get({ element: collapsedProcess });
// then
expect(overlay).to.exist;
}));
it('should not show overlay on Subprocess without content', inject(function(elementRegistry, overlays) {
// given
var collapsedProcess = elementRegistry.get('collapsedProcess_withoutContent');
var overlay = overlays.get({ element: collapsedProcess });
// then
expect(overlay).to.not.exist;
}));
it('should switch plane on click', inject(function(elementRegistry, overlays, canvas) {
// given
var collapsedProcess = elementRegistry.get('collapsedProcess');
var overlay = overlays.get({ element: collapsedProcess })[0];
// when
overlay.html.click();
// then
var plane = canvas.getActivePlane();
expect(plane.name).to.eql('collapsedProcess');
}));
});
describe('Breadcrumbs', function() {
it('should not show breadcrumbs in root view', inject(function(canvas) {
// given
var breadcrumbs = canvas.getContainer().querySelector('.bjs-breadcrumbs');
// then
expect(breadcrumbs.classList.contains('djs-element-hidden')).to.be.true;
}));
it('should show breadcrumbs in subprocess view', inject(function(canvas) {
// given
var breadcrumbs = canvas.getContainer().querySelector('.bjs-breadcrumbs');
// when
canvas.setActivePlane('collapsedProcess');
// then
expect(breadcrumbs.classList.contains('djs-element-hidden')).to.be.false;
}));
it('should show execution tree', inject(function(canvas) {
// given
var breadcrumbs = canvas.getContainer().querySelector('.bjs-breadcrumbs');
// when
canvas.setActivePlane('collapsedProcess_2');
// then
expectBreadcrumbs(breadcrumbs, ['Root', 'Collapsed Process', 'Expanded Process', 'Collapsed Process 2']);
}));
it('should switch to process plane on click', inject(function(canvas) {
// given
var breadcrumbs = canvas.getContainer().querySelector('.bjs-breadcrumbs');
canvas.setActivePlane('collapsedProcess_2');
// when
breadcrumbs.children[1].click();
// then
expectBreadcrumbs(breadcrumbs, ['Root', 'Collapsed Process']);
}));
it('should switch to containing process plane on embedded click', inject(function(canvas) {
// given
var breadcrumbs = canvas.getContainer().querySelector('.bjs-breadcrumbs');
canvas.setActivePlane('collapsedProcess_2');
// when
breadcrumbs.children[2].click();
// then
expectBreadcrumbs(breadcrumbs, ['Root', 'Collapsed Process']);
}));
});
describe('Navigation', function() {
it('should reset scroll and zoom', inject(function(canvas) {
// given
canvas.scroll({ dx: 500, dy: 500 });
canvas.zoom(0.5);
// when
canvas.setActivePlane('collapsedProcess');
// then
var viewbox = canvas.viewbox();
expect(viewbox.x).to.eql(0);
expect(viewbox.y).to.eql(0);
expect(viewbox.scale).to.eql(1);
}));
it('should remember scroll and zoom', inject(function(canvas) {
// given
canvas.scroll({ dx: 500, dy: 500 });
canvas.zoom(0.5);
var zoomedAndScrolledViewbox = canvas.viewbox();
// when
canvas.setActivePlane('collapsedProcess');
canvas.setActivePlane('rootProcess');
// then
var newViewbox = canvas.viewbox();
expect(newViewbox.x).to.eql(zoomedAndScrolledViewbox.x);
expect(newViewbox.y).to.eql(zoomedAndScrolledViewbox.y);
expect(newViewbox.scale).to.eql(zoomedAndScrolledViewbox.scale);
}));
});
describe('Legacy Processes', function() {
beforeEach(bootstrapViewer(legacyXML, { modules: testModules }));
it('should import collapsed subprocess', inject(function(canvas) {
// when
var inlineProcess1 = canvas.getPlane('inlineSubprocess');
var inlineProcess2 = canvas.getPlane('inlineSubprocess_2');
// then
expect(inlineProcess1).to.exist;
expect(inlineProcess2).to.exist;
}));
it('should move inlined elements to sensible position', inject(function(elementRegistry) {
// when
var startEvent = elementRegistry.get('subprocess_startEvent');
// then
expect(startEvent).to.exist;
expect(startEvent.x).to.equal(180);
expect(startEvent.y).to.equal(160);
}));
});
});
// helpers
function expectBreadcrumbs(breadcrumbs, expected) {
var crumbs = Array.from(breadcrumbs.children).map(function(element) {
return element.innerText;
});
expect(crumbs).to.eql(expected);
}

View File

@ -0,0 +1,51 @@
<?xml version="1.0" encoding="UTF-8"?>
<bpmn:definitions xmlns:bpmn="http://www.omg.org/spec/BPMN/20100524/MODEL" xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" xmlns:dc="http://www.omg.org/spec/DD/20100524/DC" xmlns:di="http://www.omg.org/spec/DD/20100524/DI" xmlns:modeler="http://camunda.org/schema/modeler/1.0" id="Definitions_0763oqv" targetNamespace="http://bpmn.io/schema/bpmn" exporter="Camunda Modeler" exporterVersion="4.8.0" modeler:executionPlatform="Camunda Platform" modeler:executionPlatformVersion="7.15.0">
<bpmn:process id="Process_0vkcvif" isExecutable="true">
<bpmn:startEvent id="StartEvent_1" />
<bpmn:subProcess id="inlineSubprocess">
<bpmn:startEvent id="Event_0lrpy3a">
<bpmn:outgoing>Flow_0obnxbt</bpmn:outgoing>
</bpmn:startEvent>
<bpmn:sequenceFlow id="Flow_0obnxbt" sourceRef="Event_0lrpy3a" targetRef="inlineSubprocess_2" />
<bpmn:endEvent id="Event_1ic2bhx">
<bpmn:incoming>Flow_1d6ajf7</bpmn:incoming>
</bpmn:endEvent>
<bpmn:subProcess id="inlineSubprocess_2">
<bpmn:incoming>Flow_0obnxbt</bpmn:incoming>
<bpmn:outgoing>Flow_1d6ajf7</bpmn:outgoing>
<bpmn:startEvent id="subprocess_startEvent" />
</bpmn:subProcess>
<bpmn:sequenceFlow id="Flow_1d6ajf7" sourceRef="inlineSubprocess_2" targetRef="Event_1ic2bhx" />
</bpmn:subProcess>
</bpmn:process>
<bpmndi:BPMNDiagram id="BPMNDiagram_1">
<bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="Process_0vkcvif">
<bpmndi:BPMNShape id="_BPMNShape_StartEvent_2" bpmnElement="StartEvent_1">
<dc:Bounds x="179" y="159" width="36" height="36" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="inlineSubprocess_di" bpmnElement="inlineSubprocess">
<dc:Bounds x="220" y="50" width="720" height="380" />
</bpmndi:BPMNShape>
<bpmndi:BPMNEdge id="Flow_1d6ajf7_di" bpmnElement="Flow_1d6ajf7">
<di:waypoint x="740" y="240" />
<di:waypoint x="782" y="240" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="Flow_0obnxbt_di" bpmnElement="Flow_0obnxbt">
<di:waypoint x="308" y="240" />
<di:waypoint x="350" y="240" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNShape id="Event_0lrpy3a_di" bpmnElement="Event_0lrpy3a">
<dc:Bounds x="272" y="222" width="36" height="36" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="inlineSubprocess_2_di" bpmnElement="inlineSubprocess_2">
<dc:Bounds x="350" y="120" width="390" height="240" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="subprocess_startEvent_di" bpmnElement="subprocess_startEvent">
<dc:Bounds x="410" y="222" width="36" height="36" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="Event_1ic2bhx_di" bpmnElement="Event_1ic2bhx">
<dc:Bounds x="782" y="222" width="36" height="36" />
</bpmndi:BPMNShape>
</bpmndi:BPMNPlane>
</bpmndi:BPMNDiagram>
</bpmn:definitions>

View File

@ -0,0 +1,418 @@
<?xml version="1.0" encoding="UTF-8"?>
<definitions xmlns="http://www.omg.org/spec/BPMN/20100524/MODEL" xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" xmlns:omgdc="http://www.omg.org/spec/DD/20100524/DC" xmlns:omgdi="http://www.omg.org/spec/DD/20100524/DI" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:signavio="http://www.signavio.com" id="sid-edcb32b0-ba3c-4331-9874-58685c514c55" targetNamespace="http://www.signavio.com" expressionLanguage="http://www.w3.org/TR/XPath" exporter="Signavio Process Editor, http://www.signavio.com" exporterVersion="15.4.0" xsi:schemaLocation="http://www.omg.org/spec/BPMN/20100524/MODEL http://www.omg.org/spec/BPMN/2.0/20100501/BPMN20.xsd">
<error id="sid-c4218475-d7d4-4ee6-ae73-5d44c49114b8" />
<process id="rootProcess" name="Root" processType="None" isClosed="false" isExecutable="false">
<startEvent id="sid-6687E2F4-B03D-4E57-A62B-68FA642BE19C">
<outgoing>sid-89A3F9F2-CCC8-46C7-816B-DD8AC8A98300</outgoing>
</startEvent>
<parallelGateway id="parallelGateway" gatewayDirection="Diverging">
<incoming>sid-89A3F9F2-CCC8-46C7-816B-DD8AC8A98300</incoming>
<outgoing>sid-F06605E1-AEC1-4B39-8843-4AD3F547B557</outgoing>
<outgoing>sid-FC2ECAF5-771E-4ED3-BEF6-EFAB45E79500</outgoing>
</parallelGateway>
<subProcess id="collapsedProcess" name="Collapsed Process">
<incoming>sid-F06605E1-AEC1-4B39-8843-4AD3F547B557</incoming>
<outgoing>sid-31F6EC44-E44C-4121-B4FE-BD69AF208C05</outgoing>
<startEvent id="sid-AB14D824-C8B9-4211-B224-C5AF8CED8BBD">
<outgoing>sid-EB275CF2-5EF1-44FA-B41B-71EB37CC2657</outgoing>
</startEvent>
<task id="sid-9E3BA75C-29DD-4DAC-8283-8FDE4E9A6724" name="Check Items">
<incoming>sid-EB275CF2-5EF1-44FA-B41B-71EB37CC2657</incoming>
<outgoing>sid-FB543319-8DFB-4445-AAA3-720137FB230B</outgoing>
</task>
<subProcess id="expandedProcess" name="Expanded Process">
<extensionElements>
<signavio:signavioMetaData metaKey="bgcolor" metaValue="#ffffff" />
<signavio:signavioMetaData metaKey="bordercolor" metaValue="#000000" />
</extensionElements>
<incoming>sid-FB543319-8DFB-4445-AAA3-720137FB230B</incoming>
<outgoing>sid-B99D259B-1BD5-45FF-BD57-FB99C360BAC0</outgoing>
<startEvent id="sid-3B0273A0-FE3B-4525-9E1F-FBAE2F53C2E7">
<outgoing>sid-472B540C-A0CD-46F4-9640-DF692EC1BFFC</outgoing>
</startEvent>
<subProcess id="collapsedProcess_2" name="Collapsed Process 2">
<incoming>sid-472B540C-A0CD-46F4-9640-DF692EC1BFFC</incoming>
<outgoing>sid-910420B0-D11B-4F9D-B285-703D8AC0BA90</outgoing>
<startEvent id="sid-C67DBACD-2E96-4A69-97F0-9B04CCB255EC">
<outgoing>sid-A7460113-CB75-491D-817B-5E1A8C606B8C</outgoing>
</startEvent>
<task id="sid-3459D5A6-4E18-4133-8362-0418AC9CE830" name="Call External Supplier">
<incoming>sid-A7460113-CB75-491D-817B-5E1A8C606B8C</incoming>
<outgoing>sid-01982395-64E8-43EF-A6D3-CDD276C312AA</outgoing>
</task>
<endEvent id="sid-987C40F8-82D3-4637-ABCE-A85A5E2AB8A9">
<incoming>sid-01982395-64E8-43EF-A6D3-CDD276C312AA</incoming>
</endEvent>
<sequenceFlow id="sid-A7460113-CB75-491D-817B-5E1A8C606B8C" sourceRef="sid-C67DBACD-2E96-4A69-97F0-9B04CCB255EC" targetRef="sid-3459D5A6-4E18-4133-8362-0418AC9CE830">
</sequenceFlow>
<sequenceFlow id="sid-01982395-64E8-43EF-A6D3-CDD276C312AA" sourceRef="sid-3459D5A6-4E18-4133-8362-0418AC9CE830" targetRef="sid-987C40F8-82D3-4637-ABCE-A85A5E2AB8A9">
</sequenceFlow>
</subProcess>
<endEvent id="sid-17C71FEB-D00D-46D0-ACBE-BB424A3EE5A5">
<incoming>sid-910420B0-D11B-4F9D-B285-703D8AC0BA90</incoming>
</endEvent>
<sequenceFlow id="sid-472B540C-A0CD-46F4-9640-DF692EC1BFFC" sourceRef="sid-3B0273A0-FE3B-4525-9E1F-FBAE2F53C2E7" targetRef="collapsedProcess_2">
</sequenceFlow>
<sequenceFlow id="sid-910420B0-D11B-4F9D-B285-703D8AC0BA90" sourceRef="collapsedProcess_2" targetRef="sid-17C71FEB-D00D-46D0-ACBE-BB424A3EE5A5">
</sequenceFlow>
</subProcess>
<endEvent id="sid-EE9F103D-15EA-4FBB-A4DB-8B94E5F04390">
<incoming>sid-B99D259B-1BD5-45FF-BD57-FB99C360BAC0</incoming>
</endEvent>
<sequenceFlow id="sid-EB275CF2-5EF1-44FA-B41B-71EB37CC2657" sourceRef="sid-AB14D824-C8B9-4211-B224-C5AF8CED8BBD" targetRef="sid-9E3BA75C-29DD-4DAC-8283-8FDE4E9A6724">
</sequenceFlow>
<sequenceFlow id="sid-FB543319-8DFB-4445-AAA3-720137FB230B" sourceRef="sid-9E3BA75C-29DD-4DAC-8283-8FDE4E9A6724" targetRef="expandedProcess">
</sequenceFlow>
<sequenceFlow id="sid-B99D259B-1BD5-45FF-BD57-FB99C360BAC0" sourceRef="expandedProcess" targetRef="sid-EE9F103D-15EA-4FBB-A4DB-8B94E5F04390">
</sequenceFlow>
</subProcess>
<subProcess id="sid-D0CDA908-DDCE-4E82-88D0-F1A919B8AE8B" name="Procure Payment">
<incoming>sid-FC2ECAF5-771E-4ED3-BEF6-EFAB45E79500</incoming>
<outgoing>sid-5B23450F-AF5E-4519-B134-32107776BD44</outgoing>
<startEvent id="sid-A13CFBB9-5471-4439-96FA-B65862CA7B21">
<outgoing>sid-E71F5783-AFE7-44ED-8A9C-378C95087448</outgoing>
</startEvent>
<subProcess id="sid-ECEB5194-0BF8-4913-A76F-963DC1FD1D7F" name="Charge Card">
<incoming>sid-E71F5783-AFE7-44ED-8A9C-378C95087448</incoming>
<outgoing>sid-6B9741CD-D94B-41C7-A2EA-63A4C9445E16</outgoing>
<startEvent id="sid-F2CCFED7-AD11-4A21-80EE-71D9C96549C8">
<outgoing>sid-3BB6D6CA-BF45-4D15-A1AB-64686C41DB32</outgoing>
</startEvent>
<task id="sid-29B8F97B-1A0D-4280-A62D-5093316C484B" name="Charge Card">
<incoming>sid-3BB6D6CA-BF45-4D15-A1AB-64686C41DB32</incoming>
<outgoing>sid-4E25B80E-EF68-4EE5-BB08-C1F54F1A7C39</outgoing>
</task>
<endEvent id="sid-F5AE4FCD-976F-4426-B1FF-7FCAA4CE2393">
<incoming>sid-4E25B80E-EF68-4EE5-BB08-C1F54F1A7C39</incoming>
</endEvent>
<sequenceFlow id="sid-3BB6D6CA-BF45-4D15-A1AB-64686C41DB32" sourceRef="sid-F2CCFED7-AD11-4A21-80EE-71D9C96549C8" targetRef="sid-29B8F97B-1A0D-4280-A62D-5093316C484B">
</sequenceFlow>
<sequenceFlow id="sid-4E25B80E-EF68-4EE5-BB08-C1F54F1A7C39" sourceRef="sid-29B8F97B-1A0D-4280-A62D-5093316C484B" targetRef="sid-F5AE4FCD-976F-4426-B1FF-7FCAA4CE2393">
</sequenceFlow>
</subProcess>
<subProcess id="sid-5DCDF44C-56B4-47A2-9085-00004E76F3A8" name="Accounting Stuff, I don&#39;t know">
<incoming>sid-6B9741CD-D94B-41C7-A2EA-63A4C9445E16</incoming>
<outgoing>sid-1A9DABC6-6079-4BF2-9D49-C4DC9569C519</outgoing>
<startEvent id="sid-2098A7EE-D7D8-405E-AF61-95BA48E891B6">
<outgoing>sid-E5404926-738D-4447-87FE-FC6DD1E8BEFC</outgoing>
</startEvent>
<task id="sid-E21C867A-7A56-46DD-9A1E-94C02FDB18FB" name="Accounting Stuff, I don&#39;t know">
<incoming>sid-E5404926-738D-4447-87FE-FC6DD1E8BEFC</incoming>
<outgoing>sid-FED62A8F-6C3A-4BB2-8DE9-18FB0B35B50E</outgoing>
</task>
<endEvent id="sid-DAFD7764-8FA5-417B-BB33-55E483687A7D">
<incoming>sid-FED62A8F-6C3A-4BB2-8DE9-18FB0B35B50E</incoming>
</endEvent>
<sequenceFlow id="sid-E5404926-738D-4447-87FE-FC6DD1E8BEFC" sourceRef="sid-2098A7EE-D7D8-405E-AF61-95BA48E891B6" targetRef="sid-E21C867A-7A56-46DD-9A1E-94C02FDB18FB">
</sequenceFlow>
<sequenceFlow id="sid-FED62A8F-6C3A-4BB2-8DE9-18FB0B35B50E" sourceRef="sid-E21C867A-7A56-46DD-9A1E-94C02FDB18FB" targetRef="sid-DAFD7764-8FA5-417B-BB33-55E483687A7D">
</sequenceFlow>
</subProcess>
<endEvent id="sid-345BB5A6-CE3B-4711-972A-81E47BA4B667">
<incoming>sid-1A9DABC6-6079-4BF2-9D49-C4DC9569C519</incoming>
</endEvent>
<sequenceFlow id="sid-E71F5783-AFE7-44ED-8A9C-378C95087448" sourceRef="sid-A13CFBB9-5471-4439-96FA-B65862CA7B21" targetRef="sid-ECEB5194-0BF8-4913-A76F-963DC1FD1D7F">
<extensionElements>
<signavio:signavioMetaData metaKey="bordercolor" metaValue="#000000" />
</extensionElements>
</sequenceFlow>
<sequenceFlow id="sid-6B9741CD-D94B-41C7-A2EA-63A4C9445E16" sourceRef="sid-ECEB5194-0BF8-4913-A76F-963DC1FD1D7F" targetRef="sid-5DCDF44C-56B4-47A2-9085-00004E76F3A8">
<extensionElements>
<signavio:signavioMetaData metaKey="bordercolor" metaValue="#000000" />
</extensionElements>
</sequenceFlow>
<sequenceFlow id="sid-1A9DABC6-6079-4BF2-9D49-C4DC9569C519" sourceRef="sid-5DCDF44C-56B4-47A2-9085-00004E76F3A8" targetRef="sid-345BB5A6-CE3B-4711-972A-81E47BA4B667">
</sequenceFlow>
</subProcess>
<parallelGateway id="sid-7412307A-1A0F-43BA-933B-6E84157B4E5B" gatewayDirection="Converging">
<incoming>sid-5B23450F-AF5E-4519-B134-32107776BD44</incoming>
<incoming>sid-31F6EC44-E44C-4121-B4FE-BD69AF208C05</incoming>
<outgoing>sid-F7DA1903-6A1A-4858-AF4B-286A968C957F</outgoing>
</parallelGateway>
<boundaryEvent id="sid-C586DCF2-0B1B-4878-8042-F9869023F21B" attachedToRef="sid-D0CDA908-DDCE-4E82-88D0-F1A919B8AE8B">
<outgoing>sid-DCB98638-BEBD-4548-B501-F0E29AC71ED4</outgoing>
<errorEventDefinition id="sid-804c8ce9-8013-49e6-a6f5-bf97d24f6cf0" errorRef="sid-c4218475-d7d4-4ee6-ae73-5d44c49114b8" />
</boundaryEvent>
<endEvent id="sid-A53C38A9-456B-4AC9-9D4A-6EC9663BA77C">
<incoming>sid-DCB98638-BEBD-4548-B501-F0E29AC71ED4</incoming>
</endEvent>
<subProcess id="parallelGateway_withoutContent" name="Ship Items (todo)">
<incoming>sid-F7DA1903-6A1A-4858-AF4B-286A968C957F</incoming>
<outgoing>sid-3FAE72F2-4037-4CBA-8B89-01D7FC7FF3E3</outgoing>
</subProcess>
<endEvent id="sid-DA90DE99-58B0-4371-B71D-87A718ACB64D">
<incoming>sid-3FAE72F2-4037-4CBA-8B89-01D7FC7FF3E3</incoming>
</endEvent>
<sequenceFlow id="sid-89A3F9F2-CCC8-46C7-816B-DD8AC8A98300" sourceRef="sid-6687E2F4-B03D-4E57-A62B-68FA642BE19C" targetRef="parallelGateway">
</sequenceFlow>
<sequenceFlow id="sid-F06605E1-AEC1-4B39-8843-4AD3F547B557" sourceRef="parallelGateway" targetRef="collapsedProcess">
</sequenceFlow>
<sequenceFlow id="sid-FC2ECAF5-771E-4ED3-BEF6-EFAB45E79500" sourceRef="parallelGateway" targetRef="sid-D0CDA908-DDCE-4E82-88D0-F1A919B8AE8B">
</sequenceFlow>
<sequenceFlow id="sid-5B23450F-AF5E-4519-B134-32107776BD44" sourceRef="sid-D0CDA908-DDCE-4E82-88D0-F1A919B8AE8B" targetRef="sid-7412307A-1A0F-43BA-933B-6E84157B4E5B">
</sequenceFlow>
<sequenceFlow id="sid-31F6EC44-E44C-4121-B4FE-BD69AF208C05" sourceRef="collapsedProcess" targetRef="sid-7412307A-1A0F-43BA-933B-6E84157B4E5B">
</sequenceFlow>
<sequenceFlow id="sid-DCB98638-BEBD-4548-B501-F0E29AC71ED4" sourceRef="sid-C586DCF2-0B1B-4878-8042-F9869023F21B" targetRef="sid-A53C38A9-456B-4AC9-9D4A-6EC9663BA77C">
</sequenceFlow>
<sequenceFlow id="sid-F7DA1903-6A1A-4858-AF4B-286A968C957F" sourceRef="sid-7412307A-1A0F-43BA-933B-6E84157B4E5B" targetRef="parallelGateway_withoutContent">
</sequenceFlow>
<sequenceFlow id="sid-3FAE72F2-4037-4CBA-8B89-01D7FC7FF3E3" sourceRef="parallelGateway_withoutContent" targetRef="sid-DA90DE99-58B0-4371-B71D-87A718ACB64D">
</sequenceFlow>
</process>
<bpmndi:BPMNDiagram id="sid-cbeafa41-c891-415c-ab0d-3eb4a233f9ed">
<bpmndi:BPMNPlane id="sid-5fb4720f-4b99-4727-8770-dd4166bcd5e4" bpmnElement="rootProcess">
<bpmndi:BPMNEdge id="sid-3FAE72F2-4037-4CBA-8B89-01D7FC7FF3E3_gui" bpmnElement="sid-3FAE72F2-4037-4CBA-8B89-01D7FC7FF3E3">
<omgdi:waypoint x="675" y="215" />
<omgdi:waypoint x="720" y="215" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="sid-F7DA1903-6A1A-4858-AF4B-286A968C957F_gui" bpmnElement="sid-F7DA1903-6A1A-4858-AF4B-286A968C957F">
<omgdi:waypoint x="530" y="215.41484716157206" />
<omgdi:waypoint x="575" y="215.2183406113537" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="sid-DCB98638-BEBD-4548-B501-F0E29AC71ED4_gui" bpmnElement="sid-DCB98638-BEBD-4548-B501-F0E29AC71ED4">
<omgdi:waypoint x="420" y="370" />
<omgdi:waypoint x="420" y="427.89053746720595" />
<omgdi:waypoint x="515" y="428" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="sid-31F6EC44-E44C-4121-B4FE-BD69AF208C05_gui" bpmnElement="sid-31F6EC44-E44C-4121-B4FE-BD69AF208C05">
<omgdi:waypoint x="445" y="110" />
<omgdi:waypoint x="510.5" y="110" />
<omgdi:waypoint x="510.5" y="195" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="sid-5B23450F-AF5E-4519-B134-32107776BD44_gui" bpmnElement="sid-5B23450F-AF5E-4519-B134-32107776BD44">
<omgdi:waypoint x="445" y="315" />
<omgdi:waypoint x="510.5" y="315" />
<omgdi:waypoint x="510.5" y="235" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="sid-FC2ECAF5-771E-4ED3-BEF6-EFAB45E79500_gui" bpmnElement="sid-FC2ECAF5-771E-4ED3-BEF6-EFAB45E79500">
<omgdi:waypoint x="255.5" y="235" />
<omgdi:waypoint x="255.5" y="315" />
<omgdi:waypoint x="345" y="315" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="sid-F06605E1-AEC1-4B39-8843-4AD3F547B557_gui" bpmnElement="sid-F06605E1-AEC1-4B39-8843-4AD3F547B557">
<omgdi:waypoint x="255.5" y="195" />
<omgdi:waypoint x="255.5" y="110" />
<omgdi:waypoint x="345" y="110" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="sid-89A3F9F2-CCC8-46C7-816B-DD8AC8A98300_gui" bpmnElement="sid-89A3F9F2-CCC8-46C7-816B-DD8AC8A98300">
<omgdi:waypoint x="190" y="215.09316770186336" />
<omgdi:waypoint x="235" y="215.37267080745343" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNShape id="sid-6687E2F4-B03D-4E57-A62B-68FA642BE19C_gui" bpmnElement="sid-6687E2F4-B03D-4E57-A62B-68FA642BE19C">
<omgdc:Bounds x="160" y="200" width="30" height="30" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="parallelGateway_gui" bpmnElement="parallelGateway">
<omgdc:Bounds x="235" y="195" width="40" height="40" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="collapsedProcess_gui" bpmnElement="collapsedProcess" isExpanded="false">
<omgdc:Bounds x="345" y="70" width="100" height="80" />
<bpmndi:BPMNLabel labelStyle="sid-c53530f5-9da8-4535-ae6d-c94859ea5b93">
<omgdc:Bounds x="352.99214363098145" y="102" width="84.08571243286133" height="12" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-D0CDA908-DDCE-4E82-88D0-F1A919B8AE8B_gui" bpmnElement="sid-D0CDA908-DDCE-4E82-88D0-F1A919B8AE8B" isExpanded="false">
<omgdc:Bounds x="345" y="275" width="100" height="80" />
<bpmndi:BPMNLabel labelStyle="sid-c53530f5-9da8-4535-ae6d-c94859ea5b93">
<omgdc:Bounds x="349.520715713501" y="307" width="91.02856826782227" height="12" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-7412307A-1A0F-43BA-933B-6E84157B4E5B_gui" bpmnElement="sid-7412307A-1A0F-43BA-933B-6E84157B4E5B">
<omgdc:Bounds x="490" y="195" width="40" height="40" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-A53C38A9-456B-4AC9-9D4A-6EC9663BA77C_gui" bpmnElement="sid-A53C38A9-456B-4AC9-9D4A-6EC9663BA77C">
<omgdc:Bounds x="515" y="413.89053746720595" width="28" height="28" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="parallelGateway_withoutContent_gui" bpmnElement="parallelGateway_withoutContent" isExpanded="false">
<omgdc:Bounds x="575" y="175" width="100" height="80" />
<bpmndi:BPMNLabel labelStyle="sid-c53530f5-9da8-4535-ae6d-c94859ea5b93">
<omgdc:Bounds x="595.7207126617432" y="201" width="58.62857437133789" height="24" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-DA90DE99-58B0-4371-B71D-87A718ACB64D_gui" bpmnElement="sid-DA90DE99-58B0-4371-B71D-87A718ACB64D">
<omgdc:Bounds x="720" y="201" width="28" height="28" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-C586DCF2-0B1B-4878-8042-F9869023F21B_gui" bpmnElement="sid-C586DCF2-0B1B-4878-8042-F9869023F21B">
<omgdc:Bounds x="405" y="340" width="30" height="30" />
</bpmndi:BPMNShape>
</bpmndi:BPMNPlane>
<bpmndi:BPMNLabelStyle id="sid-c53530f5-9da8-4535-ae6d-c94859ea5b93">
<omgdc:Font name="Arial" size="12" isBold="false" isItalic="false" isUnderline="false" isStrikeThrough="false" />
</bpmndi:BPMNLabelStyle>
</bpmndi:BPMNDiagram>
<bpmndi:BPMNDiagram id="sid-99a6a759-9161-4f4a-a83d-9ad6b9fbdc7e">
<bpmndi:BPMNPlane id="sid-62501c88-ba6c-44ea-90f1-3ccf6a7cea2f" bpmnElement="collapsedProcess">
<bpmndi:BPMNShape id="sid-AB14D824-C8B9-4211-B224-C5AF8CED8BBD_gui" bpmnElement="sid-AB14D824-C8B9-4211-B224-C5AF8CED8BBD">
<omgdc:Bounds x="150" y="140" width="30" height="30" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-9E3BA75C-29DD-4DAC-8283-8FDE4E9A6724_gui" bpmnElement="sid-9E3BA75C-29DD-4DAC-8283-8FDE4E9A6724">
<omgdc:Bounds x="225" y="115" width="100" height="80" />
<bpmndi:BPMNLabel labelStyle="sid-592ddc98-48fc-42b3-b7f9-1df8b6d368c5">
<omgdc:Bounds x="241.44285583496094" y="147" width="67.11428833007812" height="12" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-3B0273A0-FE3B-4525-9E1F-FBAE2F53C2E7_gui" bpmnElement="sid-3B0273A0-FE3B-4525-9E1F-FBAE2F53C2E7">
<omgdc:Bounds x="390" y="140" width="30" height="30" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="collapsedProcess_2_gui" bpmnElement="collapsedProcess_2" isExpanded="false">
<omgdc:Bounds x="465" y="115" width="100" height="80" />
<bpmndi:BPMNLabel labelStyle="sid-592ddc98-48fc-42b3-b7f9-1df8b6d368c5">
<omgdc:Bounds x="481.4778537750244" y="141" width="67.11429214477539" height="24" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-17C71FEB-D00D-46D0-ACBE-BB424A3EE5A5_gui" bpmnElement="sid-17C71FEB-D00D-46D0-ACBE-BB424A3EE5A5">
<omgdc:Bounds x="610" y="141" width="28" height="28" />
</bpmndi:BPMNShape>
<bpmndi:BPMNEdge id="sid-472B540C-A0CD-46F4-9640-DF692EC1BFFC_gui" bpmnElement="sid-472B540C-A0CD-46F4-9640-DF692EC1BFFC">
<omgdi:waypoint x="420" y="155" />
<omgdi:waypoint x="465" y="155" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="sid-910420B0-D11B-4F9D-B285-703D8AC0BA90_gui" bpmnElement="sid-910420B0-D11B-4F9D-B285-703D8AC0BA90">
<omgdi:waypoint x="565" y="155" />
<omgdi:waypoint x="610" y="155" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNShape id="expandedProcess_gui" bpmnElement="expandedProcess" isExpanded="true">
<omgdc:Bounds x="370" y="79" width="288" height="151" />
<bpmndi:BPMNLabel labelStyle="sid-592ddc98-48fc-42b3-b7f9-1df8b6d368c5">
<omgdc:Bounds x="378" y="89" width="65.57142639160156" height="12" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-EE9F103D-15EA-4FBB-A4DB-8B94E5F04390_gui" bpmnElement="sid-EE9F103D-15EA-4FBB-A4DB-8B94E5F04390">
<omgdc:Bounds x="703" y="141" width="28" height="28" />
</bpmndi:BPMNShape>
<bpmndi:BPMNEdge id="sid-EB275CF2-5EF1-44FA-B41B-71EB37CC2657_gui" bpmnElement="sid-EB275CF2-5EF1-44FA-B41B-71EB37CC2657">
<omgdi:waypoint x="180" y="155" />
<omgdi:waypoint x="225" y="155" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="sid-FB543319-8DFB-4445-AAA3-720137FB230B_gui" bpmnElement="sid-FB543319-8DFB-4445-AAA3-720137FB230B">
<omgdi:waypoint x="325" y="154.89539748953976" />
<omgdi:waypoint x="370" y="154.80125523012552" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="sid-B99D259B-1BD5-45FF-BD57-FB99C360BAC0_gui" bpmnElement="sid-B99D259B-1BD5-45FF-BD57-FB99C360BAC0">
<omgdi:waypoint x="658" y="154.85467980295567" />
<omgdi:waypoint x="703" y="154.9655172413793" />
</bpmndi:BPMNEdge>
</bpmndi:BPMNPlane>
<bpmndi:BPMNLabelStyle id="sid-592ddc98-48fc-42b3-b7f9-1df8b6d368c5">
<omgdc:Font name="Arial" size="12" isBold="false" isItalic="false" isUnderline="false" isStrikeThrough="false" />
</bpmndi:BPMNLabelStyle>
</bpmndi:BPMNDiagram>
<bpmndi:BPMNDiagram id="sid-0bbc44a9-8a6a-44a1-8b61-0cf870c26fe4">
<bpmndi:BPMNPlane id="sid-275fa3fd-9114-4005-b305-71f6c1411c24" bpmnElement="collapsedProcess_2">
<bpmndi:BPMNShape id="sid-C67DBACD-2E96-4A69-97F0-9B04CCB255EC_gui" bpmnElement="sid-C67DBACD-2E96-4A69-97F0-9B04CCB255EC">
<omgdc:Bounds x="230" y="130" width="30" height="30" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-3459D5A6-4E18-4133-8362-0418AC9CE830_gui" bpmnElement="sid-3459D5A6-4E18-4133-8362-0418AC9CE830">
<omgdc:Bounds x="305" y="105" width="100" height="80" />
<bpmndi:BPMNLabel labelStyle="sid-efc2a4e3-a5c6-411d-80d4-64f3a53bc4a4">
<omgdc:Bounds x="321.44285583496094" y="131" width="67.11428833007812" height="24" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-987C40F8-82D3-4637-ABCE-A85A5E2AB8A9_gui" bpmnElement="sid-987C40F8-82D3-4637-ABCE-A85A5E2AB8A9">
<omgdc:Bounds x="450" y="131" width="28" height="28" />
</bpmndi:BPMNShape>
<bpmndi:BPMNEdge id="sid-A7460113-CB75-491D-817B-5E1A8C606B8C_gui" bpmnElement="sid-A7460113-CB75-491D-817B-5E1A8C606B8C">
<omgdi:waypoint x="260" y="145" />
<omgdi:waypoint x="305" y="145" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="sid-01982395-64E8-43EF-A6D3-CDD276C312AA_gui" bpmnElement="sid-01982395-64E8-43EF-A6D3-CDD276C312AA">
<omgdi:waypoint x="405" y="145" />
<omgdi:waypoint x="450" y="145" />
</bpmndi:BPMNEdge>
</bpmndi:BPMNPlane>
<bpmndi:BPMNLabelStyle id="sid-efc2a4e3-a5c6-411d-80d4-64f3a53bc4a4">
<omgdc:Font name="Arial" size="12" isBold="false" isItalic="false" isUnderline="false" isStrikeThrough="false" />
</bpmndi:BPMNLabelStyle>
</bpmndi:BPMNDiagram>
<bpmndi:BPMNDiagram id="sid-19b0e874-234e-4bee-b83c-068fe088c591">
<bpmndi:BPMNPlane id="sid-89d69f37-848f-4da3-bb9a-df3a9889286d" bpmnElement="sid-D0CDA908-DDCE-4E82-88D0-F1A919B8AE8B">
<bpmndi:BPMNShape id="sid-A13CFBB9-5471-4439-96FA-B65862CA7B21_gui" bpmnElement="sid-A13CFBB9-5471-4439-96FA-B65862CA7B21">
<omgdc:Bounds x="190" y="170" width="30" height="30" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-ECEB5194-0BF8-4913-A76F-963DC1FD1D7F_gui" bpmnElement="sid-ECEB5194-0BF8-4913-A76F-963DC1FD1D7F" isExpanded="false">
<omgdc:Bounds x="265" y="145" width="100" height="80" />
<bpmndi:BPMNLabel labelStyle="sid-3bb65e49-bd30-45eb-a52f-e94a5e93edbc">
<omgdc:Bounds x="281.09214210510254" y="177" width="67.88571548461914" height="12" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-5DCDF44C-56B4-47A2-9085-00004E76F3A8_gui" bpmnElement="sid-5DCDF44C-56B4-47A2-9085-00004E76F3A8" isExpanded="false">
<omgdc:Bounds x="410" y="145" width="100" height="80" />
<bpmndi:BPMNLabel labelStyle="sid-3bb65e49-bd30-45eb-a52f-e94a5e93edbc">
<omgdc:Bounds x="424.5492877960205" y="165" width="70.9714241027832" height="36" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-345BB5A6-CE3B-4711-972A-81E47BA4B667_gui" bpmnElement="sid-345BB5A6-CE3B-4711-972A-81E47BA4B667">
<omgdc:Bounds x="555" y="171" width="28" height="28" />
</bpmndi:BPMNShape>
<bpmndi:BPMNEdge id="sid-E71F5783-AFE7-44ED-8A9C-378C95087448_gui" bpmnElement="sid-E71F5783-AFE7-44ED-8A9C-378C95087448">
<omgdi:waypoint x="220" y="185" />
<omgdi:waypoint x="265" y="185" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="sid-6B9741CD-D94B-41C7-A2EA-63A4C9445E16_gui" bpmnElement="sid-6B9741CD-D94B-41C7-A2EA-63A4C9445E16">
<omgdi:waypoint x="365" y="185" />
<omgdi:waypoint x="410" y="185" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="sid-1A9DABC6-6079-4BF2-9D49-C4DC9569C519_gui" bpmnElement="sid-1A9DABC6-6079-4BF2-9D49-C4DC9569C519">
<omgdi:waypoint x="510" y="185" />
<omgdi:waypoint x="555" y="185" />
</bpmndi:BPMNEdge>
</bpmndi:BPMNPlane>
<bpmndi:BPMNLabelStyle id="sid-3bb65e49-bd30-45eb-a52f-e94a5e93edbc">
<omgdc:Font name="Arial" size="12" isBold="false" isItalic="false" isUnderline="false" isStrikeThrough="false" />
</bpmndi:BPMNLabelStyle>
</bpmndi:BPMNDiagram>
<bpmndi:BPMNDiagram id="sid-5e1db01c-46b0-40b0-bb83-67add2799cae">
<bpmndi:BPMNPlane id="sid-ecd0155e-80cf-40cd-85a9-edf72b8d2a6c" bpmnElement="sid-ECEB5194-0BF8-4913-A76F-963DC1FD1D7F">
<bpmndi:BPMNShape id="sid-F2CCFED7-AD11-4A21-80EE-71D9C96549C8_gui" bpmnElement="sid-F2CCFED7-AD11-4A21-80EE-71D9C96549C8">
<omgdc:Bounds x="310" y="160" width="30" height="30" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-29B8F97B-1A0D-4280-A62D-5093316C484B_gui" bpmnElement="sid-29B8F97B-1A0D-4280-A62D-5093316C484B">
<omgdc:Bounds x="385" y="135" width="100" height="80" />
<bpmndi:BPMNLabel labelStyle="sid-2e7107aa-4946-4b44-a3c0-a137c1775d39">
<omgdc:Bounds x="401.05714416503906" y="167" width="67.88571166992188" height="12" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-F5AE4FCD-976F-4426-B1FF-7FCAA4CE2393_gui" bpmnElement="sid-F5AE4FCD-976F-4426-B1FF-7FCAA4CE2393">
<omgdc:Bounds x="530" y="161" width="28" height="28" />
</bpmndi:BPMNShape>
<bpmndi:BPMNEdge id="sid-3BB6D6CA-BF45-4D15-A1AB-64686C41DB32_gui" bpmnElement="sid-3BB6D6CA-BF45-4D15-A1AB-64686C41DB32">
<omgdi:waypoint x="340" y="175" />
<omgdi:waypoint x="385" y="175" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="sid-4E25B80E-EF68-4EE5-BB08-C1F54F1A7C39_gui" bpmnElement="sid-4E25B80E-EF68-4EE5-BB08-C1F54F1A7C39">
<omgdi:waypoint x="485" y="175" />
<omgdi:waypoint x="530" y="175" />
</bpmndi:BPMNEdge>
</bpmndi:BPMNPlane>
<bpmndi:BPMNLabelStyle id="sid-2e7107aa-4946-4b44-a3c0-a137c1775d39">
<omgdc:Font name="Arial" size="12" isBold="false" isItalic="false" isUnderline="false" isStrikeThrough="false" />
</bpmndi:BPMNLabelStyle>
</bpmndi:BPMNDiagram>
<bpmndi:BPMNDiagram id="sid-63fc7b22-cc85-458f-aaab-e165a0e36240">
<bpmndi:BPMNPlane id="sid-3f3c0ecd-73e0-4a0a-b05c-0b6bd60eeeb1" bpmnElement="sid-5DCDF44C-56B4-47A2-9085-00004E76F3A8">
<bpmndi:BPMNShape id="sid-2098A7EE-D7D8-405E-AF61-95BA48E891B6_gui" bpmnElement="sid-2098A7EE-D7D8-405E-AF61-95BA48E891B6">
<omgdc:Bounds x="240" y="250" width="30" height="30" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-E21C867A-7A56-46DD-9A1E-94C02FDB18FB_gui" bpmnElement="sid-E21C867A-7A56-46DD-9A1E-94C02FDB18FB">
<omgdc:Bounds x="315" y="225" width="100" height="80" />
<bpmndi:BPMNLabel labelStyle="sid-d93ac8fb-7a66-4ace-93a6-71582a8ab1a1">
<omgdc:Bounds x="329.51428604125977" y="245" width="70.97142791748047" height="36" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="sid-DAFD7764-8FA5-417B-BB33-55E483687A7D_gui" bpmnElement="sid-DAFD7764-8FA5-417B-BB33-55E483687A7D">
<omgdc:Bounds x="460" y="251" width="28" height="28" />
</bpmndi:BPMNShape>
<bpmndi:BPMNEdge id="sid-E5404926-738D-4447-87FE-FC6DD1E8BEFC_gui" bpmnElement="sid-E5404926-738D-4447-87FE-FC6DD1E8BEFC">
<omgdi:waypoint x="270" y="265" />
<omgdi:waypoint x="315" y="265" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="sid-FED62A8F-6C3A-4BB2-8DE9-18FB0B35B50E_gui" bpmnElement="sid-FED62A8F-6C3A-4BB2-8DE9-18FB0B35B50E">
<omgdi:waypoint x="415" y="265" />
<omgdi:waypoint x="460" y="265" />
</bpmndi:BPMNEdge>
</bpmndi:BPMNPlane>
<bpmndi:BPMNLabelStyle id="sid-d93ac8fb-7a66-4ace-93a6-71582a8ab1a1">
<omgdc:Font name="Arial" size="12" isBold="false" isItalic="false" isUnderline="false" isStrikeThrough="false" />
</bpmndi:BPMNLabelStyle>
</bpmndi:BPMNDiagram>
</definitions>

View File

@ -7,7 +7,7 @@ import {
importBpmnDiagram
} from 'lib/import/Importer';
import Viewer from 'lib/Viewer';
import CoreModule from 'lib/core';
import {
matches as domMatches
@ -36,7 +36,7 @@ describe('import - Importer', function() {
var diagram;
beforeEach(function() {
diagram = createDiagram(TestContainer.get(this), Viewer.prototype._modules);
diagram = createDiagram(TestContainer.get(this), [CoreModule]);
});

View File

@ -13,59 +13,76 @@ describe('import - collapsed container', function() {
beforeEach(bootstrapViewer(diagramXML));
it('should import collapsed subProcess', inject(function(elementRegistry) {
it('should import collapsed subProcess', inject(function(elementRegistry, canvas) {
var collapsedShape = elementRegistry.get('SubProcess_1');
var collapsedPlane = canvas.findPlane(collapsedShape);
var childShape = elementRegistry.get('IntermediateCatchEvent_1');
var childPlane = canvas.findPlane(childShape);
expect(collapsedShape.collapsed).to.be.true;
expect(childShape.hidden).to.be.true;
expect(collapsedPlane).to.not.eql(childPlane);
}));
it('should import collapsed transaction', inject(function(elementRegistry) {
it('should import collapsed transaction', inject(function(elementRegistry, canvas) {
var collapsedShape = elementRegistry.get('Transaction_1');
var collapsedPlane = canvas.findPlane(collapsedShape);
var childShape = elementRegistry.get('UserTask_1');
var childPlane = canvas.findPlane(childShape);
expect(collapsedShape.collapsed).to.be.true;
expect(childShape.hidden).to.be.true;
expect(collapsedPlane).to.not.eql(childPlane);
}));
it('should import collapsed adhocSubProcess', inject(function(elementRegistry) {
it('should import collapsed adhocSubProcess', inject(function(elementRegistry, canvas) {
var collapsedShape = elementRegistry.get('AdHocSubProcess_1');
var collapsedPlane = canvas.findPlane(collapsedShape);
var childShape = elementRegistry.get('StartEvent_1');
var childPlane = canvas.findPlane(childShape);
expect(collapsedShape.collapsed).to.be.true;
expect(childShape.hidden).to.be.true;
expect(collapsedPlane).to.not.eql(childPlane);
}));
it('should import collapsed with nested elements', inject(function(elementRegistry) {
it('should import collapsed with nested elements', inject(function(elementRegistry, canvas) {
var collapsedShape = elementRegistry.get('SubProcess_4');
var collapsedPlane = canvas.findPlane(collapsedShape);
var childShape = elementRegistry.get('SubProcess_5');
var childPlane = canvas.findPlane(childShape);
var nestedChildShape = elementRegistry.get('Task_3');
var nestedChildPlane = canvas.findPlane(nestedChildShape);
expect(collapsedShape.collapsed).to.be.true;
expect(childShape.hidden).to.be.true;
expect(nestedChildShape.hidden).to.be.true;
expect(childPlane).to.not.eql(collapsedPlane);
expect(nestedChildPlane).to.not.eql(collapsedPlane);
}));
it('should import collapsed with nested hidden labels', inject(function(elementRegistry) {
it('should import collapsed with nested hidden labels', inject(function(elementRegistry, canvas) {
var collapsedShape = elementRegistry.get('SubProcess_2');
var collapsedPlane = canvas.findPlane(collapsedShape);
var hiddenEventShape = elementRegistry.get('StartEvent_2');
expect(hiddenEventShape.label.hidden).to.be.true;
var hiddenEventPlane = canvas.findPlane(hiddenEventShape);
expect(hiddenEventPlane).to.not.eql(collapsedPlane);
var hiddenDataShape = elementRegistry.get('DataObjectReference_1');
expect(hiddenDataShape.label.hidden).to.be.true;
var hiddenDataPlane = canvas.findPlane(hiddenDataShape);
expect(hiddenDataPlane).to.not.eql(collapsedPlane);
}));
it('should import expanded subProcess', inject(function(elementRegistry) {
it('should import expanded subProcess', inject(function(elementRegistry, canvas) {
var expandedShape = elementRegistry.get('SubProcess_3');
var expandedPlane = canvas.findPlane(expandedShape);
var childShape = elementRegistry.get('Task_2');
var childPlane = canvas.findPlane(childShape);
expect(expandedShape.collapsed).to.be.false;
expect(childShape.hidden).to.be.false;
expect(expandedPlane).to.eql(childPlane);
}));
});
@ -78,39 +95,49 @@ describe('import - collapsed container', function() {
beforeEach(bootstrapViewer(diagramXML));
it('should import collapsed subProcess in pool', inject(function(elementRegistry) {
var expandedShape = elementRegistry.get('SubProcess_1');
it('should import collapsed subProcess in pool', inject(function(elementRegistry, canvas) {
var collapsedShape = elementRegistry.get('SubProcess_1');
var collapsedPlane = canvas.findPlane(collapsedShape);
var childShape = elementRegistry.get('Task_1');
var childPlane = canvas.findPlane(childShape);
expect(expandedShape.collapsed).to.be.true;
expect(childShape.hidden).to.be.true;
expect(collapsedShape.collapsed).to.be.true;
expect(collapsedPlane).to.not.eql(childPlane);
}));
it('should import expanded subProcess in pool', inject(function(elementRegistry) {
it('should import expanded subProcess in pool', inject(function(elementRegistry, canvas) {
var expandedShape = elementRegistry.get('SubProcess_2');
var expandedPlane = canvas.findPlane(expandedShape);
var childShape = elementRegistry.get('StartEvent_1');
var childPlane = canvas.findPlane(childShape);
expect(expandedShape.collapsed).to.be.false;
expect(childShape.hidden).to.be.false;
expect(expandedPlane).to.eql(childPlane);
}));
it('should import collapsed subProcess in lane', inject(function(elementRegistry) {
it('should import collapsed subProcess in lane', inject(function(elementRegistry, canvas) {
var expandedShape = elementRegistry.get('SubProcess_4');
var collapsedPlane = canvas.findPlane(expandedShape);
var childShape = elementRegistry.get('Task_2');
var childPlane = canvas.findPlane(childShape);
expect(expandedShape.collapsed).to.be.true;
expect(childShape.hidden).to.be.true;
expect(collapsedPlane).to.not.eql(childPlane);
}));
it('should import expanded subProcess in lane', inject(function(elementRegistry) {
it('should import expanded subProcess in lane', inject(function(elementRegistry, canvas) {
var expandedShape = elementRegistry.get('SubProcess_3');
var expandedPlane = canvas.findPlane(expandedShape);
var childShape = elementRegistry.get('StartEvent_2');
var childPlane = canvas.findPlane(childShape);
expect(expandedShape.collapsed).to.be.false;
expect(childShape.hidden).to.be.false;
expect(expandedPlane).to.eql(childPlane);
}));
});