Files
CraftopiaStudio-ComfyUI-Cra…/js/smart_resize.js
T
rubz dd0c4d9b2e fix: make CraftKit's custom-drawn JS widgets render correctly under Nodes 2.0
- Add js/shared/{nodes2,canvas_widgets,preset_picker_widget}.mjs: widgets
  registered with type "button" get hijacked by ComfyUI's Vue widget
  registry (Nodes 2.0), which renders a generic button showing the raw
  internal widget name instead of calling our draw(). Dividers/status
  boxes now use type "custom" via addCustomWidget, which correctly falls
  through to the legacy-canvas bridge in both renderers. The interactive
  preset-chip picker is dual-path: canvas+hit-testing in classic mode,
  real <button> elements via addDOMWidget in Nodes 2.0 (mirrors how
  ComfyUI-Pixaroma solved the same problem for its own widgets)
- Rewire smart_batch_resize.js, smart_resize.js, smart_profile_switch.js,
  smart_prompt_controller.js to use the shared factories, removing the
  duplicated divider/status/preset-chip code that existed across them
- Fix a save/reload regression found during verification: repositioning
  the Nodes 2.0 preset-chip DOM widget into the middle of node.widgets
  after configure() has run desyncs Vue's value-to-row binding for every
  later widget (values appear shifted by one row, though the saved JSON
  itself is correct). The DOM widget is no longer repositioned under
  Nodes 2.0; classic mode is unaffected and keeps the original placement
2026-08-07 11:07:54 +02:00

45 lines
1.8 KiB
JavaScript

import { app } from "../../scripts/app.js";
import { createPresetPickerWidget } from "./shared/preset_picker_widget.mjs";
import { isVueNodes } from "./shared/nodes2.mjs";
app.registerExtension({
name: "Craftopia.SmartResize",
async nodeCreated(node) {
if (node.comfyClass !== "SmartResize") return;
const longestSideWidget = node.widgets?.find(w => w.name === "longest_side");
if (!longestSideWidget) return;
const PRESETS = [512, 768, 1024, 1536];
const presetWidget = createPresetPickerWidget(node, longestSideWidget, PRESETS);
// Override serialize to exclude the non-serializable preset widget from
// widgets_values — same drift fix as SmartBatchResize (see that file for details).
const origSerialize = node.serialize;
node.serialize = function () {
const data = origSerialize.call(this);
if (data.widgets_values) {
data.widgets_values = this.widgets
.filter(w => w.serialize !== false && w.options?.serialize !== false)
.map(w => w.value);
}
return data;
};
// Move preset row to right after longest_side — classic mode only.
// Under Nodes 2.0, splicing the DOM widget into the middle of
// node.widgets after configure() has already run desyncs Vue's
// value-to-row binding for every widget after it (see the comment in
// smart_batch_resize.js for the full explanation).
if (!isVueNodes()) {
const lsIdx = node.widgets.indexOf(longestSideWidget);
const pwIdx = node.widgets.indexOf(presetWidget);
if (pwIdx !== lsIdx + 1) {
node.widgets.splice(pwIdx, 1);
node.widgets.splice(lsIdx + 1, 0, presetWidget);
}
}
},
});