Single direction field (combo or optional input); unique list IDs per node instance
This commit is contained in:
@@ -84,9 +84,14 @@ app.registerExtension({
|
||||
const inputEl = filterWidget?.inputEl;
|
||||
if (!inputEl) return;
|
||||
|
||||
const listId = `compass_dir_list_${Date.now()}_${Math.random().toString(36).slice(2, 7)}`;
|
||||
const listEl = document.createElement("ul");
|
||||
listEl.id = listId;
|
||||
listEl.style.display = "none";
|
||||
listEl.style.position = "absolute";
|
||||
listEl.style.zIndex = "9999";
|
||||
document.body.appendChild(listEl);
|
||||
inputEl._listId = listId;
|
||||
|
||||
inputEl._currentPrefix = directoryWidget.value || "";
|
||||
|
||||
@@ -147,8 +152,9 @@ app.registerExtension({
|
||||
|
||||
inputEl.addEventListener("blur", () => {
|
||||
setTimeout(() => {
|
||||
if (!listEl.contains(document.activeElement)) {
|
||||
hideDropdown(listEl);
|
||||
const list = document.getElementById(inputEl._listId);
|
||||
if (list && !list.contains(document.activeElement)) {
|
||||
hideDropdown(list);
|
||||
}
|
||||
}, 150);
|
||||
});
|
||||
@@ -171,7 +177,9 @@ app.registerExtension({
|
||||
}
|
||||
});
|
||||
|
||||
const origSetValue = directoryWidget.callback ? directoryWidget.callback.bind(directoryWidget) : () => {};
|
||||
const origSetValue = directoryWidget.callback
|
||||
? directoryWidget.callback.bind(directoryWidget)
|
||||
: () => {};
|
||||
directoryWidget.callback = (value) => {
|
||||
origSetValue(value);
|
||||
inputEl._currentPrefix = value || "";
|
||||
@@ -181,32 +189,9 @@ app.registerExtension({
|
||||
const origOnRemoved = this.onRemoved ? this.onRemoved.bind(this) : () => {};
|
||||
this.onRemoved = () => {
|
||||
origOnRemoved();
|
||||
listEl.remove();
|
||||
const list = document.getElementById(listId);
|
||||
if (list) list.remove();
|
||||
};
|
||||
|
||||
const imageWidget = this.widgets?.find((w) => w.name === "image");
|
||||
if (imageWidget) {
|
||||
const origCallback = imageWidget.callback ? imageWidget.callback.bind(imageWidget) : () => {};
|
||||
imageWidget.callback = (value) => {
|
||||
origCallback(value);
|
||||
if (imageWidget.element) {
|
||||
imageWidget.element.style.opacity = "1";
|
||||
}
|
||||
};
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
async loadedGraphNode(node) {
|
||||
if (node.type !== "CompassImageLoader") return;
|
||||
|
||||
const directoryWidget = node.widgets?.find((w) => w.name === "directory");
|
||||
const filterWidget = node.widgets?.find((w) => w.name === "directory_filter");
|
||||
const inputEl = filterWidget?.inputEl;
|
||||
const listEl = document.getElementById("compass_dir_list");
|
||||
|
||||
if (inputEl && listEl) {
|
||||
inputEl._currentPrefix = directoryWidget?.value || "";
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user