diff --git a/ui/media/js/main.js b/ui/media/js/main.js index 7634f288..101a88e7 100644 --- a/ui/media/js/main.js +++ b/ui/media/js/main.js @@ -868,6 +868,7 @@ useAsThumbSaveBtn.addEventListener("click", (e) => { }) .then(() => { useAsThumbDialog.close() + document.dispatchEvent(new CustomEvent("saveThumb", { detail: useAsThumbSelect.selectedOptions })) }) .catch((error) => { console.error(error) diff --git a/ui/plugins/ui/merge.plugin.js b/ui/plugins/ui/model-tools.plugin.js similarity index 95% rename from ui/plugins/ui/merge.plugin.js rename to ui/plugins/ui/model-tools.plugin.js index 8e74cf61..09fd6499 100644 --- a/ui/plugins/ui/merge.plugin.js +++ b/ui/plugins/ui/model-tools.plugin.js @@ -285,8 +285,9 @@
- - + + +
@@ -625,15 +626,47 @@ LoraUI.civitaiAnchor = document.querySelector("#civitai-model-page") LoraUI.image = document.querySelector("#lora-manager-image") LoraUI.imagePlaceholder = document.querySelector("#lora-manager-image-placeholder") + LoraUI.uploadBtn = document.querySelector("#lora-manager-upload-button") + LoraUI.uploadInput = document.querySelector("#lora-manager-upload-input") LoraUI.modelField.addEventListener("change", LoraUI.updateFields) LoraUI.keywordsField.addEventListener("focusout", LoraUI.saveInfos) LoraUI.notesField.addEventListener("focusout", LoraUI.saveInfos) LoraUI.civitaiImportBtn.addEventListener("click", LoraUI.importFromCivitai) + LoraUI.uploadBtn.addEventListener("click", (e) => LoraUI.uploadInput.click()) + LoraUI.uploadInput.addEventListener("change", LoraUI.uploadLoraThumb) + + document.addEventListener("saveThumb", LoraUI.updateFields) + LoraUI.updateFields() }, + uploadLoraThumb(e) { + console.log(e) + if (LoraUI.uploadInput.files.length === 0) { + return + } + + let reader = new FileReader() + let file = LoraUI.uploadInput.files[0] + + reader.addEventListener("load", (event) => { + let img = document.createElement("img") + img.src = reader.result + onUseAsThumbnailClick( + { + use_lora_model: LoraUI.modelField.value, + }, + img + ) + }) + + if (file) { + reader.readAsDataURL(file) + } + }, + updateFields() { document.getElementById("civitai-section").classList.add("displayNone") Bucket.retrieve(`modelinfo/lora/${LoraUI.modelField.value}`)