Merge branch 'gallery' of github.com:ManInDark/easydiffusion into gallery

This commit is contained in:
JeLuF 2023-08-14 23:54:32 +02:00
commit fa9ff7f957

View File

@ -150,6 +150,7 @@ let galleryPrevBtn = document.querySelector("#gallery-prev")
let galleryNextBtn = document.querySelector("#gallery-next") let galleryNextBtn = document.querySelector("#gallery-next")
let galleryPromptSearchField = document.querySelector("#gallery-prompt-search") let galleryPromptSearchField = document.querySelector("#gallery-prompt-search")
let galleryModelSearchField = document.querySelector("#gallery-model-search") let galleryModelSearchField = document.querySelector("#gallery-model-search")
let galleryImageContainer = document.querySelector("#imagecontainer")
let positiveEmbeddingText = document.querySelector("#positive-embedding-text") let positiveEmbeddingText = document.querySelector("#positive-embedding-text")
@ -3165,13 +3166,13 @@ function galleryImage(reqData) {
img.addEventListener("click", function() { img.addEventListener("click", function() {
function previousImage(img) { function previousImage(img) {
const allImages = Array.from(document.getElementById("imagecontainer").querySelectorAll(".gallery-image img")) const allImages = Array.from(galleryImageContainer.querySelectorAll(".gallery-image img"))
const index = allImages.indexOf(img) const index = allImages.indexOf(img)
return allImages.slice(0, index).reverse()[0] return allImages.slice(0, index).reverse()[0]
} }
function nextImage(img) { function nextImage(img) {
const allImages = Array.from(document.getElementById("imagecontainer").querySelectorAll(".gallery-image img")) const allImages = Array.from(galleryImageContainer.querySelectorAll(".gallery-image img"))
const index = allImages.indexOf(img) const index = allImages.indexOf(img)
return allImages.slice(index + 1)[0] return allImages.slice(index + 1)[0]
} }
@ -3257,12 +3258,11 @@ window.addEventListener("resize", layoutGallery)
function layoutGallery() { function layoutGallery() {
let container = document.getElementById("imagecontainer")
let thumbSize = parseFloat(galleryThumbnailSize.value) let thumbSize = parseFloat(galleryThumbnailSize.value)
thumbSize = (10*thumbSize*thumbSize)>>>0 thumbSize = (10*thumbSize*thumbSize)>>>0
let root = document.querySelector(':root') let root = document.querySelector(':root')
root.style.setProperty('--gallery-width', thumbSize + "px") root.style.setProperty('--gallery-width', thumbSize + "px")
let msnry = new Masonry( container, { let msnry = new Masonry(galleryImageContainer, {
gutter: 10, gutter: 10,
itemSelector: '.gallery-image', itemSelector: '.gallery-image',
columnWidth: thumbSize, columnWidth: thumbSize,
@ -3279,11 +3279,10 @@ function refreshGallery(newsearch = false) {
if (newsearch) { if (newsearch) {
galleryPageField.value = 0 galleryPageField.value = 0
} }
let container = document.getElementById("imagecontainer") galleryImageContainer.innerHTML = ""
container.innerHTML = ""
let params = new URLSearchParams({ let params = new URLSearchParams({
prompt: document.getElementById("gallery-prompt-search").value, prompt: galleryPromptSearchField.value,
model: document.getElementById("gallery-model-search").value, model: galleryModelSearchField.value,
page: galleryPageField.value page: galleryPageField.value
}) })