JaredTherriault
5a6623c7b3
-Change some names for clarity and capitalization linter -Add SettingsManager to handle Config Settings -Move some Utilities to SettingsManager -Added images and videos are observed when they are added to the image list and unobserved when removed -Add video support in feed and other image lists -Optimized local image/video loading (for input and output folders and the like) -Restore last subfolder selection on refresh of folder explorer context if possible -Add batching code path for image loading (unused for now, needs tuning) -Add option to drag and drop loras into graph to create lora node automatically -Images now load in on demand (lazy loading) rather than all at once -Try/Catch reading of image metadata -Disable drag/drop for image href, fix issue where dragging image makes redundant toolbar button -Add UiSettings script to handle adding UI Settings
66 lines
1.8 KiB
JavaScript
66 lines
1.8 KiB
JavaScript
|
|
export function createModal(modalContent, newFocus) {
|
|
if (!modalContent) { return; }
|
|
// Create a modal container
|
|
const modalContainer = document.createElement("div");
|
|
modalContainer.style.display = "none";
|
|
modalContainer.style.position = "fixed";
|
|
modalContainer.style.zIndex = "10000";
|
|
modalContainer.style.left = "0";
|
|
modalContainer.style.top = "0";
|
|
modalContainer.style.width = "100%";
|
|
modalContainer.style.height = "100%";
|
|
modalContainer.style.overflow = "auto";
|
|
modalContainer.style.backgroundColor = "rgba(0,0,0,0.7)";
|
|
|
|
// Create close button
|
|
const closeButton = document.createElement("span");
|
|
modalContainer.style.zIndex = "10001";
|
|
closeButton.innerHTML = "×";
|
|
closeButton.style.color = "#aaa";
|
|
closeButton.style.float = "right";
|
|
closeButton.style.fontSize = "28px";
|
|
closeButton.style.fontWeight = "bold";
|
|
closeButton.style.cursor = "pointer";
|
|
|
|
// Append modal content to modal container
|
|
modalContainer.appendChild(modalContent);
|
|
|
|
// Append close button to modal container
|
|
modalContainer.appendChild(closeButton);
|
|
|
|
// Append modal container to the document body
|
|
document.body.appendChild(modalContainer);
|
|
|
|
// Function to open the modal
|
|
function openModal() {
|
|
modalContainer.style.display = "block";
|
|
}
|
|
|
|
// Function to close the modal
|
|
function closeModal() {
|
|
modalContainer.parentNode.removeChild(modalContainer);
|
|
}
|
|
|
|
openModal();
|
|
|
|
// Event listener for closing the modal
|
|
closeButton.addEventListener("click", closeModal);
|
|
modalContainer.addEventListener("click", closeModal);
|
|
|
|
// Add event listener to close modal on "Escape" key press
|
|
modalContainer.addEventListener("keydown", function(event) {
|
|
if (event.key === "Escape") {
|
|
closeModal();
|
|
}
|
|
});
|
|
|
|
if (newFocus) {
|
|
newFocus.focus();
|
|
} else {
|
|
// Remove focus from the currently focused element
|
|
document.activeElement.blur();
|
|
}
|
|
|
|
return modalContainer;
|
|
} |