diff --git a/CHANGELOG.md b/CHANGELOG.md index 05767d917..e3f5d3a3d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -12,7 +12,8 @@ - **LTX** support for *audio* generation - custom **VAE** loader for all pipelines *note*: vae still needs to be compatible with the model - - add prompt enhance info to image metadata + - **Prompt enhance** add info to image metadata + - **Ernie-Image** initial LoRA support - **UI** - add button to manually reorient input/output panels - all ui panels can be minimized/maximized by clicking on their header diff --git a/TODO.md b/TODO.md index 3e58efbe8..c35a96aaf 100644 --- a/TODO.md +++ b/TODO.md @@ -4,12 +4,10 @@ ### Assigned -- Gallery: thumb-size, quick delete/download/info @vladmandic +- Gallery: quick delete/download/info @vladmandic - Chat-based interface, @vladmandic -- Multi-image inputs, @vladmandic - Control tab verify overrides handling, @vladmandic - Reimplement `llama` remover for Kanvas, @vladmandic -- Integrate [Depth3D](https://github.com/vladmandic/sd-extension-depth3d), @vladmandic - Cloud providers, @CalamitousFelicitousness - Video processing add full API support, @CalamitousFelicitousness diff --git a/installer.py b/installer.py index 54931531c..f5fe01bca 100644 --- a/installer.py +++ b/installer.py @@ -494,7 +494,7 @@ def check_diffusers(): t_start = time.time() if args.skip_all: return - target_commit = "0f1abc4ae8b0eb2a3b40e82a310507281144c423" # diffusers commit hash == 0.37.1.dev-0427 + target_commit = "c8eba433adf1f90d7fcc70092562ea50789ee8fb" # diffusers commit hash == 0.37.1.dev-0427 # if args.use_rocm or args.use_zluda or args.use_directml: # sha = '043ab2520f6a19fce78e6e060a68dbc947edb9f9' # lock diffusers versions for now pkg = package_spec('diffusers') diff --git a/javascript/gallery.js b/javascript/gallery.js index c901442f7..9d6a7f526 100644 --- a/javascript/gallery.js +++ b/javascript/gallery.js @@ -20,6 +20,7 @@ const el = { search: undefined, status: undefined, btnSend: undefined, + overlay: undefined, clearCacheFolder: undefined, size: undefined, }; @@ -132,7 +133,7 @@ async function awaitForGallery(expectedSize, signal) { function updateGalleryStyles() { if (opts.theme_type?.toLowerCase() === 'modern') { - folderStylesheet.replaceSync(` + folderStylesheet.replace(` .gallery-folder { cursor: pointer; padding: 8px 6px 8px 6px; @@ -165,7 +166,7 @@ function updateGalleryStyles() { } `); } else { - folderStylesheet.replaceSync(` + folderStylesheet.replace(` .gallery-folder { cursor: pointer; padding: 8px 6px 8px 6px; @@ -183,7 +184,7 @@ function updateGalleryStyles() { `); } const size = el.size ? el.size.value : opts.extra_networks_card_size; - fileStylesheet.replaceSync(` + fileStylesheet.replace(` .gallery-file { object-fit: contain; cursor: pointer; @@ -193,6 +194,14 @@ function updateGalleryStyles() { .gallery-file:hover { filter: grayscale(100%); } + .gallery-overlay { + position: absolute; + width: ${size}px; + height: 32px; + background-color: rgba(0,0,0,0.5); + display: block; + margin-top: calc(${size}px - 32px); + } :host(.gallery-file-selected) .gallery-file { box-shadow: 0 0 0 2px var(--sd-button-selected-color); } @@ -413,9 +422,7 @@ class GalleryFolder extends HTMLElement { this.div.classList.add('gallery-folder-selected'); GalleryFolder.#active = this; for (const folder of GalleryFolder.folders) { - if (folder !== this) { - folder.div.classList.remove('gallery-folder-selected'); - } + if (folder !== this) folder.div.classList.remove('gallery-folder-selected'); } } } @@ -460,7 +467,6 @@ class GalleryFile extends HTMLElement { this.height = 0; this.shadow = this.attachShadow({ mode: 'open' }); this.shadow.adoptedStyleSheets = [fileStylesheet]; - this.firstRun = true; } @@ -473,9 +479,7 @@ class GalleryFile extends HTMLElement { if (dir && dir[1]) { const dirPath = dir[1]; const isOpen = separatorStates.get(dirPath); - if (isOpen === false) { - this.style.display = 'none'; - } + if (isOpen === false) this.style.display = 'none'; } this.hash = await getHash(`${this.src}/${this.size}/${this.mtime}`) @@ -518,7 +522,7 @@ class GalleryFile extends HTMLElement { this.size = json.size; this.mtime = new Date(json.mtime); if (opts.browser_cache && this.hash) { - await idbAdd({ + idbAdd({ hash: this.hash, folder: this.fullFolder, file: this.name, @@ -538,23 +542,27 @@ class GalleryFile extends HTMLElement { img.src = `file=${this.src}`; } } - if (this.#signal.aborted) { // Do not change the operations order from here... - return; - } + if (this.#signal.aborted) return; galleryHashes.add(this.hash); - if (!ok) { - return; - } // ... to here unless modifications are also being made to maintenance functionality and the usage of AbortController/AbortSignal + if (!ok) return; + img.onclick = () => { setGallerySelectionByElement(this, { send: true }); }; + img.onpointerenter = () => { + el.overlay.display = 'block'; + this.shadow.appendChild(el.overlay); + }; + img.onpointerleave = () => { + el.overlay.display = 'none'; + }; img.title = `Folder: ${this.folder}\nFile: ${this.name}\nSize: ${this.size.toLocaleString()} bytes\nModified: ${this.mtime.toLocaleString()}`; this.title = img.title; // Final visibility check based on search term. const shouldDisplayBasedOnSearch = this.title.toLowerCase().includes(el.search.value.toLowerCase()); if (this.style.display !== 'none') { // Only proceed if not already hidden by a closed separator - this.style.display = shouldDisplayBasedOnSearch ? 'unset' : 'none'; + this.style.display = shouldDisplayBasedOnSearch ? 'flex' : 'none'; } this.shadow.appendChild(img); @@ -1318,6 +1326,13 @@ async function initGalleryAutoRefresh() { galleryVisObserver.observe(galleryTab, { attributeFilter: ['class', 'style'], attributeOldValue: true }); } +async function createOverlay() { + if (el.overlay) return; + el.overlay = document.createElement('div'); + el.overlay.className = 'gallery-overlay'; + // const btnDownload = document.createElement('span'); +} + async function blockQueueUntilReady() { // Add block to maintenanceQueue until cache is ready maintenanceQueue.enqueue({ @@ -1351,6 +1366,7 @@ async function initGallery() { // triggered on gradio change to monitor when ui el.size.addEventListener('input', updateGalleryStyles); } blockQueueUntilReady(); // Run first + createOverlay(); updateGalleryStyles(); injectGalleryStatusCSS(); setOverlayAnimation();