2021-11-03 09:29:54 +00:00
|
|
|
/**
|
2021-12-09 23:31:00 +00:00
|
|
|
* Move collapsed subprocesses into view when drilling down.
|
|
|
|
*
|
|
|
|
* Zoom and scroll are saved in a session.
|
2021-11-03 09:29:54 +00:00
|
|
|
*
|
|
|
|
* @param {eventBus} eventBus
|
|
|
|
* @param {canvas} canvas
|
|
|
|
*/
|
|
|
|
export default function DrilldownCentering(eventBus, canvas) {
|
2021-10-18 08:28:36 +00:00
|
|
|
|
2021-12-09 23:31:00 +00:00
|
|
|
var currentRoot = null;
|
|
|
|
var positionMap = new Map();
|
|
|
|
|
|
|
|
eventBus.on('root.set', function(event) {
|
2021-10-18 08:28:36 +00:00
|
|
|
var currentViewbox = canvas.viewbox();
|
2021-12-09 23:31:00 +00:00
|
|
|
|
|
|
|
positionMap.set(currentRoot, {
|
2021-10-18 08:28:36 +00:00
|
|
|
x: currentViewbox.x,
|
|
|
|
y: currentViewbox.y,
|
|
|
|
zoom: currentViewbox.scale
|
2021-12-09 23:31:00 +00:00
|
|
|
});
|
2021-10-18 08:28:36 +00:00
|
|
|
|
2021-12-09 23:31:00 +00:00
|
|
|
var newRoot = event.element;
|
|
|
|
var storedViewbox = positionMap.get(newRoot) || { x: 0, y: 0, zoom: 1 };
|
2021-10-18 08:28:36 +00:00
|
|
|
|
|
|
|
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 });
|
|
|
|
}
|
|
|
|
|
2021-12-09 23:31:00 +00:00
|
|
|
currentRoot = newRoot;
|
|
|
|
});
|
|
|
|
|
|
|
|
eventBus.on('root.remove', function(event) {
|
|
|
|
positionMap.remove(event.element);
|
2021-10-18 08:28:36 +00:00
|
|
|
});
|
2021-12-09 23:31:00 +00:00
|
|
|
|
|
|
|
eventBus.on('diagram.clear', function() {
|
|
|
|
positionMap.clear();
|
|
|
|
currentRoot = null;
|
|
|
|
});
|
|
|
|
|
2021-10-18 08:28:36 +00:00
|
|
|
}
|
|
|
|
|
2021-11-03 09:29:54 +00:00
|
|
|
DrilldownCentering.$inject = [ 'eventBus', 'canvas' ];
|
2021-12-09 23:31:00 +00:00
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
* ES5 Map implementation. Works.
|
|
|
|
*/
|
|
|
|
function Map() {
|
|
|
|
|
|
|
|
this._entries = [];
|
|
|
|
|
|
|
|
this.set = function(key, value) {
|
|
|
|
|
|
|
|
var found = false;
|
|
|
|
|
|
|
|
for (var k in this._entries) {
|
|
|
|
if (this._entries[k][0] === key) {
|
|
|
|
this._entries[k][1] = value;
|
|
|
|
|
|
|
|
found = true;
|
|
|
|
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
if (!found) {
|
|
|
|
this._entries.push([ key, value ]);
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
this.get = function(key) {
|
|
|
|
|
|
|
|
for (var k in this._entries) {
|
|
|
|
if (this._entries[k][0] === key) {
|
|
|
|
return this._entries[k][1];
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
return null;
|
|
|
|
};
|
|
|
|
|
|
|
|
this.clear = function() {
|
|
|
|
this._entries.length = 0;
|
|
|
|
};
|
|
|
|
|
|
|
|
this.remove = function(key) {
|
|
|
|
|
|
|
|
var idx = -1;
|
|
|
|
|
|
|
|
for (var k in this._entries) {
|
|
|
|
if (this._entries[k][0] === key) {
|
|
|
|
idx = k;
|
|
|
|
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
if (idx !== -1) {
|
|
|
|
this._entries.splice(idx, 1);
|
|
|
|
}
|
|
|
|
};
|
|
|
|
}
|