lmu/uni2work.workflows.visualiser
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

highlight automatic actions in appropriate context

Browse Source
This commit is contained in:
David Mosbach 2023-05-23 15:20:42 +02:00
parent f4748f7d9e
commit 82276d1a02
1 changed files with 20 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
editor.js
View File

@ -45,8 +45,21 @@ actors.forEach(actor => {
selectedActor.add(option);
});
//source & target nodes of all currently highlighted actions
var highlightedSources = [];
var highlightedTargets = [];
function selectActor() {
console.log(selectedActor.value);
highlightedSources = [];
highlightedTargets = [];
workflow.actions.forEach(act => {
if (act.actionData.mode != 'automatic' && act.actionData.actorNames.includes(selectedActor.value)) {
highlightedSources.push(act.source.id);
highlightedTargets.push(act.target.id);
}
});
}
@ -223,8 +236,12 @@ function getNodeColour(node) {
}
}
function isHighlightedEdge(edge) {
return (edge.actionData.mode != 'automatic' && edge.actionData.actorNames.includes(selectedActor.value)) || (edge.actionData.mode === 'automatic' && highlightedTargets.includes(edge.source.id));
}
function getEdgeColour(edge) {
if (edge.actionData.mode != 'automatic' && edge.actionData.actorNames.includes(selectedActor.value)) {
if (isHighlightedEdge(edge)) {
return selection === edge ? edgeColourHighlightSelected : edgeColourHighlightDefault;
} else if (selectedActor.value !== 'All Actors') {
return selection === edge ? edgeColourSubtleSelected : edgeColourSubtleDefault;
@ -322,10 +339,10 @@ const Graph = ForceGraph()
context.restore();
})
.linkLineDash(edge => edge.actionData.mode == 'automatic' && [2, 3]) //[dash, gap]
.linkWidth(edge => (edge.actionData.mode != 'automatic' && edge.actionData.actorNames.includes(selectedActor.value)) ? 3 : 1)
.linkWidth(edge => (isHighlightedEdge(edge)) ? 3 : 1)
.linkDirectionalParticles(2)
.linkDirectionalParticleColor(() => '#00000055')
.linkDirectionalParticleWidth(edge => (edge.actionData.mode != 'automatic' && edge.actionData.actorNames.includes(selectedActor.value)) ? 3 : 0)
.linkDirectionalParticleWidth(edge => (isHighlightedEdge(edge)) ? 3 : 0)
.nodeCanvasObject((node, ctx) => {
ctx.fillStyle = getNodeColour(node);
ctx.beginPath();