diff options
Diffstat (limited to 'javascript/images_history.js')
-rw-r--r-- | javascript/images_history.js | 170 |
1 files changed, 114 insertions, 56 deletions
diff --git a/javascript/images_history.js b/javascript/images_history.js index 93d2b89a..9a3e00a0 100644 --- a/javascript/images_history.js +++ b/javascript/images_history.js @@ -1,66 +1,124 @@ -function init_images_history(){ - if (gradioApp().getElementById('txt2img_images_history_first_page') == null) { - setTimeout(init_images_history, 1000) - } else { - tab_list = ["txt2img", "img2img"] - for (i in tab_list){ - tab = tab_list[i] - gradioApp().getElementById(tab + "_images_history_first_page").click() - $(gradioApp().getElementById(tab + '_images_history')).addClass("images_history_gallery") - item = $(gradioApp().getElementById(tab + '_images_history_set_index')) - item.addClass("images_history_set_index") - item.hide() - } - } - +images_history_tab_list = ["txt2img", "img2img", "extras"] +function images_history_init(){ + if (gradioApp().getElementById('txt2img_images_history_first_page') == null) { + setTimeout(images_history_init, 500) + } else { + for (i in images_history_tab_list ){ + tab = images_history_tab_list[i] + gradioApp().getElementById(tab + '_images_history').classList.add("images_history_gallery") + gradioApp().getElementById(tab + '_images_history_set_index').classList.add("images_history_set_index") + + } + gradioApp().getElementById("txt2img_images_history_first_page").click() + } +} +setTimeout(images_history_init, 500) +var images_history_button_actions = function(){ + if (!this.classList.contains("transform")){ + gallery = this.parentElement + while(!gallery.classList.contains("images_history_gallery")){gallery = gallery.parentElement} + buttons = gallery.querySelectorAll(".gallery-item") + i = 0 + hidden_list = [] + buttons.forEach(function(e){ + if (e.style.display == "none"){ + hidden_list.push(i) + } + i += 1 + }) + if (hidden_list.length > 0){ + setTimeout(images_history_hide_buttons, 10, hidden_list, gallery) + } + + } + images_history_set_image_info(this) + } -setTimeout(init_images_history, 1000) onUiUpdate(function(){ - fullImg_preview = gradioApp().querySelectorAll('#txt2img_images_history img.w-full') - if(fullImg_preview.length > 0){ - fullImg_preview.forEach(set_history_index_from_img); - } - fullImg_preview = gradioApp().querySelectorAll('#img2img_images_history img.w-full') - if(fullImg_preview.length > 0){ - fullImg_preview.forEach(set_history_index_from_img); + for (i in images_history_tab_list ){ + tab = images_history_tab_list[i] + buttons = gradioApp().querySelectorAll('#' + tab + '_images_history .gallery-item') + buttons.forEach(function(bnt){ + bnt.addEventListener('click', images_history_button_actions, true) + }); } }) +function images_history_hide_buttons(hidden_list, gallery){ + buttons = gallery.querySelectorAll(".gallery-item") + num = 0 + buttons.forEach(function(e){ + if (e.style.display == "none"){ + num += 1 + } + }) + if (num == hidden_list.length){ + setTimeout(images_history_hide_buttons, 10, hidden_list, gallery) + } + for( i in hidden_list){ + buttons[hidden_list[i]].style.display = "none" + } +} -function set_history_gallery_index(item){ - buttons = item.find(".gallery-item") - // alert(item.attr("id") + " " + buttons.length) - index = -1 - i = 0 - buttons.each(function(){ - if($(this).hasClass("!ring-2")){ index = i } - i += 1 - }) - if (index == -1){ - setTimeout(set_history_gallery_index, 10, item) - } else { - item = item.find(".images_history_set_index").first() - item.attr("img_index", index) - item.click() - } +function images_history_set_image_info(button){ + item = button.parentElement + while(item.tagName != "DIV"){item = item.parentElement} + buttons = item.querySelectorAll(".gallery-item") + index = -1 + i = 0 + buttons.forEach(function(e){ + if(e==button){index = i} + if(e.style.display != "none"){ + i += 1 + } + }) + gallery = button.parentElement + while(!gallery.classList.contains("images_history_gallery")){gallery = gallery.parentElement} + set_btn = gallery.querySelector(".images_history_set_index") + set_btn.setAttribute("img_index", index) + set_btn.click() } -function set_history_index_from_img(e){ - if(e && e.parentElement.tagName == 'BUTTON'){ - bnt = $(e).parent() - if (bnt.hasClass("transform")){ - bnt.off("click").on("click",function(){ - set_history_gallery_index($(this).parents(".images_history_gallery").first()) - }) - } else { - bnt.off("mousedown").on("mousedown", function(){ - set_history_gallery_index($(this).parents(".images_history_gallery").first()) - }) - } - } +function images_history_get_current_img(tabname, image_path, files){ + s = gradioApp().getElementById(tabname + '_images_history_set_index').getAttribute("img_index") + return [s, image_path, files] } -function images_history_get_current_img(is_image2image, image_path, files){ - head = is_image2image?"img2img":"txt2img" - s = $(gradioApp().getElementById(head + '_images_history_set_index')).attr("img_index") - return [s, image_path, files] + +function images_history_delete(tabname, img_path, img_file_name, page_index, filenames, image_index){ + image_index = parseInt(image_index) + tab = gradioApp().getElementById(tabname + '_images_history') + set_btn = tab.querySelector(".images_history_set_index") + buttons = [] + tab.querySelectorAll(".gallery-item").forEach(function(e){ + if (e.style.display != 'none'){ + buttons.push(e) + } + }) + + + img_num = buttons.length / 2 + if (img_num == 1){ + setTimeout(function(tabname){ + gradioApp().getElementById(tabname + '_images_history_renew_page').click() + }, 30, tabname) + } else { + buttons[image_index].style.display = 'none' + buttons[image_index + img_num].style.display = 'none' + if (image_index >= img_num - 1){ + console.log(buttons.length, img_num) + btn = buttons[img_num - 2] + } else { + btn = buttons[image_index + 1] + } + setTimeout(function(btn){btn.click()}, 30, btn) + } + + return [tabname, img_path, img_file_name, page_index, filenames, image_index] } +function images_history_turnpage(img_path, page_index, image_index, tabname){ + buttons = gradioApp().getElementById(tabname + '_images_history').querySelectorAll(".gallery-item") + buttons.forEach(function(elem) { + elem.style.display = 'block' + }) + return [img_path, page_index, image_index, tabname] +} |