load example images from civitai to use as thumbnail

This commit is contained in:
rbertus2000 2023-09-19 00:38:45 +02:00 committed by GitHub
parent b71b7804fc
commit b442d893ee
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -117,7 +117,8 @@
grid-template-rows: auto 1fr; grid-template-rows: auto 1fr;
grid-template-areas: grid-template-areas:
"selector selector selector" "selector selector selector"
"thumbnail keywords notes"; "thumbnail keywords notes"
"civimg civimg civimg";
} }
} }
@ -132,7 +133,8 @@
grid-template-areas: grid-template-areas:
"selector selector" "selector selector"
"thumbnail keywords" "thumbnail keywords"
"thumbnail notes"; "thumbnail notes"
"civimg civimg";
} }
} }
@ -149,7 +151,8 @@
"selector" "selector"
"keywords" "keywords"
"thumbnail" "thumbnail"
"notes"; "notes"
"civimg";
} }
} }
@ -172,6 +175,10 @@
grid-area: notes; grid-area: notes;
} }
.lora-manager-grid-civimg {
grid-area: civimg;
}
.lora-manager-grid p { .lora-manager-grid p {
margin-bottom: 2px; margin-bottom: 2px;
} }
@ -307,6 +314,8 @@
<a id="civitai-model-page" target="_blank"></a> <a id="civitai-model-page" target="_blank"></a>
</p> </p>
</div> </div>
<div class="lora-manager-grid-civimg">
</div>
</div>` </div>`
let tabHTML=` let tabHTML=`
@ -675,6 +684,7 @@
LoraUI.keywordsField.value = "" LoraUI.keywordsField.value = ""
LoraUI.notesField.value = "" LoraUI.notesField.value = ""
LoraUI.hideCivitaiLink() LoraUI.hideCivitaiLink()
document.querySelector(".lora-manager-grid-civimg").innerHTML = ""
} else { } else {
LoraUI.keywordsField.value = info.keywords.join("\n") LoraUI.keywordsField.value = info.keywords.join("\n")
LoraUI.notesField.value = info.notes LoraUI.notesField.value = info.notes
@ -683,6 +693,7 @@
} else { } else {
LoraUI.hideCivitaiLink() LoraUI.hideCivitaiLink()
} }
document.querySelector(".lora-manager-grid-civimg").innerHTML = ""
} }
}) })
Bucket.getImageAsDataURL(`${profileNameField.value}/lora/${LoraUI.modelField.value}.png`) Bucket.getImageAsDataURL(`${profileNameField.value}/lora/${LoraUI.modelField.value}.png`)
@ -724,6 +735,35 @@
} else { } else {
showToast("No keyword info found.") showToast("No keyword info found.")
} }
if ("images" in json) {
json.images.forEach(element => {
if (blockNSFWField.checked) {
if (element.nsfw != "None") {
return
}
}
let civitimg = document.createElement("img")
fetch(element.url)
.then(result => result.blob())
.then(blob => {
civitimg.src = URL.createObjectURL(blob);
})
civitimg.style["max-width"] = "256px"
civitimg.style["max-height"] = "256px"
civitimg.alt = "Civitai image (nsfw: " + element.nsfw + ")"
document.querySelector(".lora-manager-grid-civimg").appendChild(civitimg)
civitimg.addEventListener("click", (e) => onUseAsThumbnailClick(
{
use_lora_model: LoraUI.modelField.value,
},
civitimg
))
});
} else {
showToast("No images found.")
}
if ("modelId" in json) { if ("modelId" in json) {
LoraUI.showCivitaiLink("https://civitai.com/models/" + json.modelId) LoraUI.showCivitaiLink("https://civitai.com/models/" + json.modelId)
} else { } else {