forked from enviPath/enviPy
adjusted migration
Initial bayer app Show Pack Classification Adjusted docker compose to bayer specifics Adjusted Dockerfile for Bayer Adding secret flags to group, add secret pools to packages Adjusted View for Package creation Prep configs, added Package Create Modal wip More on PES wip wip Wip minor PW interactions API PES wip Make Select Widget reflect required make required generallay available Update UI if pathway mode is set to build Added ais circle adjustments Initial Zoom, fix AD Creation wip
This commit is contained in:
@ -59,6 +59,9 @@ document.addEventListener("alpine:init", () => {
|
||||
get isEditMode() {
|
||||
return this.mode === "edit";
|
||||
},
|
||||
get isRequired() {
|
||||
return (this.schema.required || []).indexOf(this.fieldName) > -1
|
||||
}
|
||||
});
|
||||
|
||||
// Text widget
|
||||
|
||||
@ -22,7 +22,7 @@ function predictFromNode(url) {
|
||||
// data = {{ pathway.d3_json | safe }};
|
||||
// elem = 'vizdiv'
|
||||
function draw(pathway, elem) {
|
||||
|
||||
const initialzoom = 2.5
|
||||
const nodeRadius = 20;
|
||||
const linkDistance = 100;
|
||||
const chargeStrength = -200;
|
||||
@ -63,7 +63,7 @@ function draw(pathway, elem) {
|
||||
node.fx = width / 2 + depthMap.get(node.depth) * horizontalSpacing - ((nodesInLevel - 1) * horizontalSpacing) / 2;
|
||||
}
|
||||
|
||||
node.fy = node.depth * levelSpacing + 50;
|
||||
node.fy = (node.depth + initialzoom + 0.5) * levelSpacing + 50;
|
||||
depthMap.set(node.depth, depthMap.get(node.depth) + 1);
|
||||
});
|
||||
}
|
||||
@ -572,11 +572,12 @@ function draw(pathway, elem) {
|
||||
.scaleExtent([0.5, 5])
|
||||
.on("zoom", (event) => {
|
||||
zoomable.attr("transform", event.transform);
|
||||
});
|
||||
})
|
||||
|
||||
|
||||
// Apply zoom to the SVG element - this enables wheel zoom
|
||||
svg.call(zoom);
|
||||
|
||||
svg.call(zoom.scaleBy, initialzoom);
|
||||
// Also apply zoom to container to catch events that might not reach SVG
|
||||
// This ensures drag-to-pan works even when clicking on empty space
|
||||
container.call(zoom);
|
||||
@ -624,6 +625,36 @@ function draw(pathway, elem) {
|
||||
return d.multi_step ? 'url(#doublearrow)' : 'url(#arrow)';
|
||||
})
|
||||
.attr("fill", "none")
|
||||
.on("click", function(event, d) {
|
||||
const wasHighlighted = d3.select(this).classed("highlighted");
|
||||
|
||||
d3.selectAll("path").classed("highlighted", false);
|
||||
|
||||
if (!wasHighlighted) {
|
||||
const toHighlight = [];
|
||||
toHighlight.push(d.el);
|
||||
|
||||
if (d.source.pseudo || d.target.pseudo) {
|
||||
if (d.target.pseudo) {
|
||||
d3.selectAll("path").each(e => {
|
||||
if (e !== undefined && e.source.id === d.target.id) {
|
||||
toHighlight.push(e.el);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
d3.selectAll("path").each(e => {
|
||||
if (e !== undefined && (e.target.id === d.source.id || e.source.id === d.source.id)) {
|
||||
toHighlight.push(e.el);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
for (const e of toHighlight) {
|
||||
d3.select(e).classed("highlighted", true);
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
// add element to links array
|
||||
link.each(function (d) {
|
||||
@ -642,7 +673,13 @@ function draw(pathway, elem) {
|
||||
.on("drag", dragged)
|
||||
.on("end", dragended))
|
||||
.on("click", function (event, d) {
|
||||
d3.select(this).select("circle").classed("highlighted", !d3.select(this).select("circle").classed("highlighted"));
|
||||
const wasHighlighted = d3.select(this).select("circle").classed("highlighted");
|
||||
|
||||
d3.selectAll('circle.highlighted').classed('highlighted', false);
|
||||
|
||||
if (!wasHighlighted) {
|
||||
d3.select(this).select("circle").classed("highlighted", !d3.select(this).select("circle").classed("highlighted"));
|
||||
}
|
||||
})
|
||||
|
||||
// Kreise für die Knoten hinzufügen
|
||||
|
||||
Reference in New Issue
Block a user