xinyun/ComfyUI-KJNodes
1
0
Fork 0
mirror of https://git.datalinker.icu/kijai/ComfyUI-KJNodes.git synced 2025-12-10 05:15:05 +08:00
Code Issues Packages Projects Releases Wiki Activity

spline editor updates

Browse Source
This commit is contained in:
kijai 2024-04-20 18:20:02 +03:00
parent cb1e98abf1
commit 1aef2b8e43
2 changed files with 87 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
nodes.py
View File

@ -4567,7 +4567,8 @@ class SplineEditor:
def INPUT_TYPES(cls):
return {
"required": {
"coordinates": ("STRING", {"multiline": True}),
"points_store": ("STRING", {"multiline": False}),
"coordinates": ("STRING", {"multiline": False}),
"mask_width": ("INT", {"default": 512, "min": 8, "max": MAX_RESOLUTION, "step": 8}),
"mask_height": ("INT", {"default": 512, "min": 8, "max": MAX_RESOLUTION, "step": 18}),
"points_to_sample": ("INT", {"default": 4, "min": 2, "max": 1000, "step": 1}),
@ -4591,7 +4592,7 @@ class SplineEditor:
CATEGORY = "KJNodes/experimental"
def splinedata(self, mask_width, mask_height, coordinates, interpolation, points_to_sample):
def splinedata(self, mask_width, mask_height, coordinates, interpolation, points_to_sample, points_store):
print(coordinates)
coordinates = json.loads(coordinates)
print(coordinates)

80
web/js/spline_editor.js
View File

@ -118,7 +118,7 @@ app.registerExtension({
hideOnZoom: false,
});
this.setSize([620, 760])
this.setSize([600, 780])
splineEditor.parentEl = document.createElement("div");
splineEditor.parentEl.className = "spline-editor";
splineEditor.parentEl.id = `spline-editor-${this.uuid}`
@ -126,44 +126,34 @@ app.registerExtension({
splineEditor.parentEl.style['height'] = "544px"
element.appendChild(splineEditor.parentEl);
var coordWidget = this.widgets.find(w => w.name === "coordinates");
var interpolationWidget = this.widgets.find(w => w.name === "interpolation");
var pointsWidget = this.widgets.find(w => w.name === "points_to_sample");
var pointsStoreWidget = this.widgets.find(w => w.name === "points_store");
console.log("svgElement: ", Object.keys(node.widgets[6]))
const coordWidget = this.widgets.find(w => w.name === "coordinates");
const interpolationWidget = this.widgets.find(w => w.name === "interpolation");
const pointsWidget = this.widgets.find(w => w.name === "points_to_sample");
const pointsStoreWidget = this.widgets.find(w => w.name === "points_store");
chainCallback(this, "onConfigure", function(info) {
info.widgets_values = {};
if (!this.widgets) {
console.log("object has no widgets, there is nothing to store")
return;
//disable context menu on right click
document.addEventListener('contextmenu', function(e) {
if (e.button === 2) { // Right mouse button
e.preventDefault();
e.stopPropagation();
}
})
chainCallback(this, "onGraphConfigured", function() {
console.log("onGraphConfigured")
console.log("pointsStoreWidget ", pointsStoreWidget)
if (pointsStoreWidget.value != "") {
console.log(pointsStoreWidget.value)
points = JSON.parse(pointsStoreWidget.value)
}
if (info != null){
console.log(info)
info.points = pointsStoreWidget.value
//pointsStoreWidget.value = JSON.stringify(points)
}
});
//addElement(nodeData, nodeType, this)
var w = 512
var h = 512
var i = 3
var segmented = false
if (info == null){
var info = {}
}
// console.log("Node: ",node)
// console.log("node properties ", node.properties.points)
console.log("info points", info["points"])
// console.log("node keys ", Object.keys(node))
if (pointsStoreWidget.value != "") {
console.log("stored points: ", pointsStoreWidget.value)
var points = JSON.parse(pointsStoreWidget.value)
}
if (points == null) {
console.log("Creating random points")
var points = pv.range(1, 5).map(i => ({
@ -171,7 +161,8 @@ app.registerExtension({
y: 50 + Math.random() * (h - 100)
}));
}
let vis = new pv.Panel()
var vis = new pv.Panel()
.width(w)
.height(h)
.fillStyle("var(--comfy-menu-bg)")
@ -181,6 +172,7 @@ app.registerExtension({
.margin(10)
.event("mousedown", function() {
if (pv.event.shiftKey) { // Use pv.event to access the event object
console.log(this.mouse())
i = points.push(this.mouse()) - 1;
return this;
}
@ -242,26 +234,20 @@ app.registerExtension({
return `${normalizedY.toFixed(2)}`;
})
.textStyle("orange")
vis.render();
var svgElement = vis.canvas();
svgElement.style['zIndex'] = "2"
svgElement.style['position'] = "fixed"
//vis.id = `spline-editor-vis-${this.uuid}`
svgElement.style['position'] = "relative"
splineEditor.element.appendChild(svgElement);
//svgElement.id = `spline-editor-svg-${this.uuid}`
var pathElements = svgElement.getElementsByTagName('path'); // Get all path elements
});
}
//disable context menu on right click
document.addEventListener('contextmenu', function(e) {
if (e.button === 2) { // Right mouse button
e.preventDefault();
e.stopPropagation();
}
})
}
})
var pathElements = svgElement.getElementsByTagName('path'); // Get all path elements
});
}); // onAfterGraphConfigured
}//node created
} //before register
})//register
function samplePoints(svgPathElement, numSamples) {
var pathLength = svgPathElement.getTotalLength();