mirror of
https://github.com/easydiffusion/easydiffusion.git
synced 2025-01-01 11:59:24 +01:00
Controlnet thumb in taskConfig (#1502)
This commit is contained in:
parent
23a0a48b81
commit
285792f692
@ -1419,6 +1419,10 @@ div.task-fs-initimage {
|
||||
display: none;
|
||||
position: absolute;
|
||||
}
|
||||
div.task-fs-initimage img {
|
||||
max-height: 70vH;
|
||||
max-width: 70vW;
|
||||
}
|
||||
div.task-initimg:hover div.task-fs-initimage {
|
||||
display: block;
|
||||
position: absolute;
|
||||
@ -1434,9 +1438,13 @@ div.top-right {
|
||||
right: 8px;
|
||||
}
|
||||
|
||||
button.useForControlnetBtn {
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
#small_image_warning {
|
||||
font-size: smaller;
|
||||
color: var(--status-orange);
|
||||
font-size: smaller;
|
||||
color: var(--status-orange);
|
||||
}
|
||||
|
||||
button#save-system-settings-btn {
|
||||
|
@ -1217,6 +1217,27 @@ async function onTaskStart(task) {
|
||||
|
||||
/* Hover effect for the init image in the task list */
|
||||
function createInitImageHover(taskEntry) {
|
||||
taskEntry.querySelectorAll(".task-initimg").forEach( thumb => {
|
||||
let thumbimg = thumb.querySelector("img")
|
||||
let img = createElement("img", {src: thumbimg.src})
|
||||
thumb.querySelector(".task-fs-initimage").appendChild(img)
|
||||
let div = createElement("div", undefined, ["top-right"])
|
||||
div.innerHTML = `
|
||||
<button class="useAsInputBtn">Use as Input</button>
|
||||
<br>
|
||||
<button class="useForControlnetBtn">Use for Controlnet</button>`
|
||||
div.querySelector(".useAsInputBtn").addEventListener("click", e => {
|
||||
e.preventDefault()
|
||||
onUseAsInputClick(null, img)
|
||||
})
|
||||
div.querySelector(".useForControlnetBtn").addEventListener("click", e => {
|
||||
e.preventDefault()
|
||||
controlImagePreview.src = img.src
|
||||
})
|
||||
thumb.querySelector(".task-fs-initimage").appendChild(div)
|
||||
})
|
||||
return
|
||||
|
||||
var $tooltip = $(taskEntry.querySelector(".task-fs-initimage"))
|
||||
var img = document.createElement("img")
|
||||
img.src = taskEntry.querySelector("div.task-initimg > img").src
|
||||
@ -1281,6 +1302,11 @@ function createTask(task) {
|
||||
let w = ((task.reqBody.width * h) / task.reqBody.height) >> 0
|
||||
taskConfig += `<div class="task-initimg" style="float:left;"><img style="width:${w}px;height:${h}px;" src="${task.reqBody.init_image}"><div class="task-fs-initimage"></div></div>`
|
||||
}
|
||||
if (task.reqBody.control_image !== undefined) {
|
||||
let h = 80
|
||||
let w = ((task.reqBody.width * h) / task.reqBody.height) >> 0
|
||||
taskConfig += `<div class="task-initimg" style="float:left;"><img style="width:${w}px;height:${h}px;" src="${task.reqBody.control_image}"><div class="task-fs-initimage"></div></div>`
|
||||
}
|
||||
|
||||
taskConfig += `<div class="taskConfigData">${createTaskConfig(task)}</span></div></div>`
|
||||
|
||||
@ -1331,7 +1357,7 @@ function createTask(task) {
|
||||
startY = e.target.closest(".imageTaskContainer").offsetTop
|
||||
})
|
||||
|
||||
if (task.reqBody.init_image !== undefined) {
|
||||
if (task.reqBody.init_image !== undefined || task.reqBody.control_image !== undefined) {
|
||||
createInitImageHover(taskEntry)
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user