extern/easydiffusion
1
0
Fork 1
mirror of https://github.com/easydiffusion/easydiffusion.git synced 2025-06-20 18:08:00 +02:00
Code Issues Packages Projects Releases Wiki Activity

type ahead search

Browse Source 
- use search prompt also for canary request
- name prev/next button so that they can be directly accessed
- search prompt, not path
This commit is contained in:
JeLuF 2023-08-14 21:27:22 +02:00
parent 76604d22de
commit 786a96ecd9
3 changed files with 35 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ui/easydiffusion/bucket_manager.py
View File

@ -104,7 +104,7 @@ def init():
from easydiffusion.easydb.mappings import GalleryImage
images = db.query(GalleryImage).order_by(GalleryImage.time_created.desc())
if prompt != "":
images = images.filter(GalleryImage.path.like("%"+prompt+"%"))
images = images.filter(GalleryImage.prompt.like("%"+prompt+"%"))
if model != "":
images = images.filter(GalleryImage.use_stable_diffusion_model.like("%"+model+"%"))
images = images.offset(page*images_per_page).limit(images_per_page)

8
ui/index.html
View File

@ -519,14 +519,14 @@
</div>
<div id="tab-content-gallery" class="tab-content">
<div id="gallery-search">
<button class="primaryButton" onclick="decrementGalleryPage()"><i class="fa-solid fa-arrow-left"></i></button>
<input id="gallery-prompt-search" type="text" onkeydown="gallery_keyDown_handler(event)" placeholder="Search for a prompt..."></input>
<input id="gallery-model-search" type="text" onkeydown="gallery_keyDown_handler(event)" placeholder="Search for a model..."></input>
<button id="gallery-prev" class="primaryButton"><i class="fa-solid fa-arrow-left"></i></button>
<input id="gallery-prompt-search" type="search" placeholder="Search for a prompt..."></input>
<input id="gallery-model-search" type="search" placeholder="Search for a model..."></input>
<label for="gallery-page">Page:</label>
<input id="gallery-page" name="Page" value="0" size="1" onkeypress="gallery_keyDown_handler(event)">
<input id="gallery-thumbnail-size" name="gallery-thumbnail-size" class="editor-slider" type="range" value="5.5" min="3" max="20" step="0.05">
<button class="primaryButton" id="gallery-refresh" onclick="refreshGallery(true)">Load</button>
<button class="primaryButton" onclick="incrementGalleryPage()"><i class="fa-solid fa-arrow-right"></i></button>
<button id="gallery-next" class="primaryButton"><i class="fa-solid fa-arrow-right"></i></button>
</div>
<div class="gallery">
<div class="gallery-container" id="imagecontainer"></div>

43
ui/media/js/main.js
View File

@ -145,6 +145,12 @@ let embeddingsCardSizeSelector = document.querySelector("#embedding-card-size-se
let galleryImginfoDialog = document.querySelector("#gallery-imginfo")
let galleryThumbnailSize = document.querySelector("#gallery-thumbnail-size")
let galleryImginfoDialogContent = document.querySelector("#gallery-imginfo-content")
let galleryPageField = document.querySelector("#gallery-page")
let galleryPrevBtn = document.querySelector("#gallery-prev")
let galleryNextBtn = document.querySelector("#gallery-next")
let galleryPromptSearchField = document.querySelector("#gallery-prompt-search")
let galleryModelSearchField = document.querySelector("#gallery-model-search")
let positiveEmbeddingText = document.querySelector("#positive-embedding-text")
let negativeEmbeddingText = document.querySelector("#negative-embedding-text")
@ -3256,23 +3262,25 @@ function layoutGallery() {
})
}
galleryModelSearchField.addEventListener("keyup", debounce(e => refreshGallery(true), 500))
galleryPromptSearchField.addEventListener("keyup", debounce(e => refreshGallery(true), 500))
function refreshGallery(newsearch = false) {
let buttons = document.querySelectorAll("#gallery-search button")
if (newsearch) {
document.getElementById("gallery-page").value = 0
galleryPageField.value = 0
}
let container = document.getElementById("imagecontainer")
container.innerHTML = ""
let params = new URLSearchParams({
prompt: document.getElementById("gallery-prompt-search").value,
model: document.getElementById("gallery-model-search").value,
page: document.getElementById("gallery-page").value
page: galleryPageField.value
})
fetch('/all_images?' + params)
.then(response => response.json())
.then(json => {
if (document.getElementById("gallery-page").value > 0 && json.length == 0) {
if (galleryPageField.value > 0 && json.length == 0) {
decrementGalleryPage()
alert("No more images")
return
@ -3295,23 +3303,32 @@ function refreshGallery(newsearch = false) {
layoutGallery()
})
})
fetch('/all_images?images_per_page=1&page=' + (parseInt(document.getElementById("gallery-page").value) + 1) * 50) // 50 has to be replaced if custom images per page is implemented
params.set("images_per_page", 1)
// 50 has to be replaced if custom images per page is implemented
params.set("page", (parseInt(galleryPageField.value) + 1) * 50)
fetch("/all_images?" + params)
.then(response => response.json())
.then(json => {
if (json.length == 0) {
buttons[2].disabled = true
galleryNextBtn.disabled = true
} else {
buttons[2].disabled = false
galleryNextBtn.disabled = false
}
})
if (document.getElementById("gallery-page").value == 0) {
buttons[0].disabled = true
if (galleryPageField.value == 0) {
galleryPrevBtn.disabled = true
} else {
buttons[0].disabled = false
galleryPrevBtn.disabled = false
}
document.getElementById("gallery-refresh").innerText = "Refresh"
}
galleryPrevBtn.addEventListener("click", decrementGalleryPage)
galleryNextBtn.addEventListener("click", incrementGalleryPage)
document.addEventListener("tabClick", (e) => {
if (e.detail.name == 'gallery') {
refreshGallery()
@ -3320,13 +3337,13 @@ document.addEventListener("tabClick", (e) => {
function decrementGalleryPage() {
let page = Math.max(document.getElementById("gallery-page").value - 1, 0)
document.getElementById("gallery-page").value = page
let page = Math.max(galleryPageField.value - 1, 0)
galleryPageField.value = page
refreshGallery(false)
}
function incrementGalleryPage() {
document.getElementById("gallery-page").value++
galleryPageField.value++
refreshGallery(false)
}