fix(bpmnrenderer): conditional flow marker

Sequence flows are rendered as a <path> instead as <polyline> so that the start and end markers have the correct orientation in Gecko based browsers.
This commit is contained in:
jdotzki 2014-05-25 12:32:24 +02:00
parent 4b135fd9e7
commit 1342c1aca0
1 changed files with 14 additions and 19 deletions

View File

@ -53,8 +53,8 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
.marker(0, 0, 10, 10, 10, 5) .marker(0, 0, 10, 10, 10, 5)
.attr({ .attr({
markerUnits: 'strokeWidth', markerUnits: 'strokeWidth',
markerWidth: 10, markerWidth: 11,
markerHeight: 6, markerHeight: 11,
orient: 'auto', orient: 'auto',
overflow: 'visible' overflow: 'visible'
})); }));
@ -136,8 +136,8 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
.marker(0, 0, 15, 15, 0, 0) .marker(0, 0, 15, 15, 0, 0)
.attr({ .attr({
markerUnits: 'strokeWidth', markerUnits: 'strokeWidth',
markerWidth: 14.296, markerWidth: 12,
markerHeight: 7.238, markerHeight: 12,
orient: 'auto', orient: 'auto',
overflow: 'visible', overflow: 'visible',
'stroke-width': 1, 'stroke-width': 1,
@ -156,8 +156,8 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
.marker(0, 0, 15, 15, 0, 0) .marker(0, 0, 15, 15, 0, 0)
.attr({ .attr({
markerUnits: 'strokeWidth', markerUnits: 'strokeWidth',
markerWidth: 14.296, markerWidth: 14,
markerHeight: 7.238, markerHeight: 13,
orient: 'auto', orient: 'auto',
overflow: 'visible', overflow: 'visible',
'stroke-width': 1, 'stroke-width': 1,
@ -333,9 +333,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
var handlers = { var handlers = {
'bpmn:Event': function(p, data) { 'bpmn:Event': function(p, data) {
var circle = drawCircle(p, data.width, data.height); return drawCircle(p, data.width, data.height);
return circle;
}, },
'bpmn:StartEvent': function(p, data) { 'bpmn:StartEvent': function(p, data) {
var circle = renderer('bpmn:Event')(p, data); var circle = renderer('bpmn:Event')(p, data);
@ -637,9 +635,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
'bpmn:IntermediateThrowEvent': as('bpmn:IntermediateEvent'), 'bpmn:IntermediateThrowEvent': as('bpmn:IntermediateEvent'),
'bpmn:Activity': function(p, data) { 'bpmn:Activity': function(p, data) {
var rect = drawRect(p, data.width, data.height, TASK_BORDER_RADIUS); return drawRect(p, data.width, data.height, TASK_BORDER_RADIUS);
return rect;
}, },
'bpmn:Task': function(p, data) { 'bpmn:Task': function(p, data) {
@ -889,9 +885,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
return rect; return rect;
}, },
'bpmn:AdHocSubProcess': function(p, data) { 'bpmn:AdHocSubProcess': function(p, data) {
var process = renderer('bpmn:SubProcess')(p, data); return renderer('bpmn:SubProcess')(p, data);
return process;
}, },
'bpmn:Transaction': function(p, data) { 'bpmn:Transaction': function(p, data) {
var outer = renderer('bpmn:SubProcess')(p, data); var outer = renderer('bpmn:SubProcess')(p, data);
@ -1098,13 +1092,14 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
return diamond; return diamond;
}, },
'bpmn:SequenceFlow': function(p, data) { 'bpmn:SequenceFlow': function(p, data) {
var polyline = drawLine(p, data.waypoints); var linePathData = createPathFromWaypoints(data.waypoints);
var flowPath = drawPath(p, linePathData);
var sequence = bpmnRegistry.getSemantic(data.id); var sequence = bpmnRegistry.getSemantic(data.id);
// Conditional Flow Marker // Conditional Flow Marker
if(!!sequence.conditionExpression) { if(!!sequence.conditionExpression) {
polyline.attr({ flowPath.attr({
'marker-start': marker('conditional-flow-marker') 'marker-start': marker('conditional-flow-marker')
}); });
} }
@ -1120,14 +1115,14 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
if(!!source.default && if(!!source.default &&
source.default.$type === 'bpmn:SequenceFlow' && source.default.$type === 'bpmn:SequenceFlow' &&
source.default.id === data.id) { source.default.id === data.id) {
polyline.attr({ flowPath.attr({
'marker-start': marker('conditional-default-flow-marker') 'marker-start': marker('conditional-default-flow-marker')
}); });
} }
} }
} }
return polyline.attr({ return flowPath.attr({
'marker-end': marker('sequenceflow-end') 'marker-end': marker('sequenceflow-end')
}); });
}, },