show images

This commit is contained in:
JeLuF 2023-07-30 12:59:40 +02:00
parent 5f736368c8
commit ab37dbf98f
2 changed files with 40 additions and 13 deletions

BIN
ui/media/images/noimg.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@ -508,6 +508,7 @@ function showImages(reqBody, res, outputContainer, livePreview) {
{ text: "Upscale", on_click: onUpscaleClick, filter: (req, img) => !req.use_upscale }, { text: "Upscale", on_click: onUpscaleClick, filter: (req, img) => !req.use_upscale },
{ text: "Fix Faces", on_click: onFixFacesClick, filter: (req, img) => !req.use_face_correction }, { text: "Fix Faces", on_click: onFixFacesClick, filter: (req, img) => !req.use_face_correction },
], ],
{ text: "Use as Thumbnail", on_click: onUseAsThumbnailClick },
] ]
// include the plugins // include the plugins
@ -632,6 +633,20 @@ function onMakeSimilarClick(req, img) {
createTask(newTaskRequest) createTask(newTaskRequest)
} }
function onUseAsThumbnailClick(req, img) {
console.log(req)
console.log(img)
let embedding = prompt("Embedding name")
fetch(img.src)
.then(response => response.blob())
.then(async function(blob) {
const formData = new FormData()
formData.append("file", blob)
const response = await fetch(`bucket/embeddings/${embedding}.jpg`, { method: 'POST', body: formData });
console.log(response)
})
}
function enqueueImageVariationTask(req, img, reqDiff) { function enqueueImageVariationTask(req, img, reqDiff) {
const imageSeed = img.getAttribute("data-seed") const imageSeed = img.getAttribute("data-seed")
@ -2157,19 +2172,27 @@ document.getElementById("toggle-cloudflare-tunnel").addEventListener("click", as
/* Embeddings */ /* Embeddings */
let icl = []
function updateEmbeddingsList(filter = "") { function updateEmbeddingsList(filter = "") {
function html(model, prefix = "", filter = "") { function html(model, iconlist = [], prefix = "", filter = "") {
filter = filter.toLowerCase() filter = filter.toLowerCase()
let toplevel = "" let toplevel = ""
let folders = "" let folders = ""
console.log(iconlist)
let embIcon = Object.assign({}, ...iconlist.map( x=> ({[x.toLowerCase().split('.').slice(0,-1).join('.')]:x})))
model?.forEach((m) => { model?.forEach((m) => {
if (typeof m == "string") { if (typeof m == "string") {
if (m.toLowerCase().search(filter) != -1) { let token=m.toLowerCase()
toplevel += `<button data-embedding="${m}">${m}</button> ` if (token.search(filter) != -1) {
let img = '/media/images/noimg.png'
if (token in embIcon) {
img = `/bucket/embeddings/${embIcon[token]}`
}
toplevel += `<button data-embedding="${m}"><img src="${img}" height="128" width="128"><br>${m}</button> `
} }
} else { } else {
let subdir = html(m[1], prefix + m[0] + "/", filter) let subdir = html(m[1], iconlist, prefix + m[0] + "/", filter)
if (subdir != "") { if (subdir != "") {
folders += `<div class="embedding-category"><h4 class="collapsible">${prefix}${m[0]}</h4><div class="collapsible-content">` + subdir + '</div></div>' folders += `<div class="embedding-category"><h4 class="collapsible">${prefix}${m[0]}</h4><div class="collapsible-content">` + subdir + '</div></div>'
} }
@ -2179,7 +2202,7 @@ function updateEmbeddingsList(filter = "") {
} }
function onButtonClick(e) { function onButtonClick(e) {
let text = e.target.dataset["embedding"] let text = e.target.closest("button").dataset["embedding"]
const insertIntoNegative = e.shiftKey || positiveEmbeddingText.classList.contains("displayNone") const insertIntoNegative = e.shiftKey || positiveEmbeddingText.classList.contains("displayNone")
if (embeddingsModeField.value == "insert") { if (embeddingsModeField.value == "insert") {
@ -2214,14 +2237,18 @@ function updateEmbeddingsList(filter = "") {
} }
// END of remove block // END of remove block
embeddingsList.innerHTML = warning + html(modelsOptions.embeddings, "", filter) fetch("/bucket/embeddings/")
embeddingsList.querySelectorAll("button").forEach((b) => { .then(response => response.json())
b.addEventListener("click", onButtonClick) .then(iconlist => {
}) embeddingsList.innerHTML = warning + html(modelsOptions.embeddings, iconlist, "", filter)
createCollapsibles(embeddingsList) embeddingsList.querySelectorAll("button").forEach((b) => {
if (filter != "") { b.addEventListener("click", onButtonClick)
embeddingsExpandAll() })
} createCollapsibles(embeddingsList)
if (filter != "") {
embeddingsExpandAll()
}
})
} }
function showEmbeddingDialog() { function showEmbeddingDialog() {