1580158
/
sd-webui-infinite-image-browsing
mirror of https://github.com/zanllp/sd-webui-infinite-image-browsing.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat: stackview进入推出后自动回顶部，发送时先确认图片信息生成完成

pull/3/head
zanllp 2023-03-26 07:47:33 +08:00
parent be9afea82f
commit 4f50f570fa
9 changed files with 249 additions and 224 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
javascript/index.js
View File

@ -6,8 +6,8 @@
<link rel="icon" href="/favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vite App</title>
<script type="module" crossorigin src="/baidu_netdisk/fe-static/assets/index-390bfde0.js"></script>
<link rel="stylesheet" href="/baidu_netdisk/fe-static/assets/index-f245e7cd.css">
<script type="module" crossorigin src="/baidu_netdisk/fe-static/assets/index-542652c2.js"></script>
<link rel="stylesheet" href="/baidu_netdisk/fe-static/assets/index-9e7c5731.css">
</head>
<body>
<div id="zanllp_dev_gradio_fe"></div>

5
scripts/api.py
View File

@ -320,5 +320,8 @@ def baidu_netdisk_api(_: Any, app: FastAPI):
@app.post(pre+"/send_img_path")
async def api_set_send_img_path(path: str):
global send_img_path
send_img_path["value"] = path
# 检查图片信息是否生成完成
@app.get(pre+"/gen_info_completed")
async def api_set_send_img_path():
return send_img_path["value"] == ''

29
scripts/setup.py
View File

@ -1,5 +1,5 @@
from scripts.api import baidu_netdisk_api, send_img_path
from modules import script_callbacks, generation_parameters_copypaste as send
from modules import script_callbacks, generation_parameters_copypaste as send, extras
from scripts.bin import (
bin_file_name,
get_matched_summary,
@ -7,6 +7,8 @@ from scripts.bin import (
download_bin_file,
)
from scripts.tool import cwd
from PIL import Image
"""
api函数声明和启动分离方便另外一边被外部调用
@ -32,6 +34,13 @@ def on_ui_tabs():
if not exists:
print(f"\033[31m{not_exists_msg}\033[0m")
with gr.Blocks(analytics_enabled=False) as baidu_netdisk:
gr.Textbox(not_exists_msg, visible=not exists)
with gr.Row(visible=bool(exists)):
with gr.Column():
gr.HTML(
"如果你看到这个那说明此项那说明出现了问题", elem_id="baidu_netdisk_container_wrapper"
)
img = gr.Image(
type="pil",
elem_id="bd_hidden_img",
@ -40,10 +49,13 @@ def on_ui_tabs():
img_update_trigger = gr.Button("button", elem_id="bd_hidden_img_update_trigger")
def img_update_func():
return send_img_path.get("value")
img_update_trigger.click(img_update_func, outputs=img)
path = send_img_path.get("value")
geninfo,_ = extras.images.read_info_from_image(Image.open(path))
send_img_path["value"] = ''
return path, geninfo
img_file_info = gr.Textbox(elem_id="bd_hidden_img_file_info")
img_update_trigger.click(img_update_func, outputs=[img, img_file_info])
for tab in ["txt2img", "img2img", "inpaint", "extras"]:
btn = gr.Button(f"Send to {tab}", elem_id=f"bd_hidden_tab_{tab}")
send.register_paste_params_button(
@ -51,17 +63,10 @@ def on_ui_tabs():
paste_button=btn,
tabname=tab,
source_image_component=img,
source_text_component=img_file_info,
source_text_component=img_file_info
)
)
gr.Textbox(not_exists_msg, visible=not exists)
with gr.Row(visible=bool(exists)):
with gr.Column():
gr.HTML(
"如果你看到这个那说明此项那说明出现了问题", elem_id="baidu_netdisk_container_wrapper"
)
return ((baidu_netdisk, "百度云", "baiduyun"),)

199
vue/dist/assets/index-390bfde0.js vendored
View File

File diff suppressed because one or more lines are too long

199
vue/dist/assets/index-542652c2.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

2
vue/dist/assets/index-f245e7cd.css → vue/dist/assets/index-9e7c5731.css vendored
View File

File diff suppressed because one or more lines are too long

4
vue/dist/index.html vendored
View File

@ -5,8 +5,8 @@
<link rel="icon" href="/favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vite App</title>
<script type="module" crossorigin src="/baidu_netdisk/fe-static/assets/index-390bfde0.js"></script>
<link rel="stylesheet" href="/baidu_netdisk/fe-static/assets/index-f245e7cd.css">
<script type="module" crossorigin src="/baidu_netdisk/fe-static/assets/index-542652c2.js"></script>
<link rel="stylesheet" href="/baidu_netdisk/fe-static/assets/index-9e7c5731.css">
</head>
<body>
<div id="zanllp_dev_gradio_fe"></div>

4
vue/src/api/index.ts
View File

@ -159,4 +159,8 @@ export const removeTask = async (id: string) => {
export const setImgPath = async (path: string) => {
return axiosInst.post(`/send_img_path?path=${encodeURIComponent(path)}`)
}
export const genInfoCompleted = async () => {
return (await axiosInst.get(`/gen_info_completed`)).data as boolean
}

27
vue/src/fileTransfer/stackView.vue
View File

@ -1,13 +1,13 @@
<script setup lang="ts">
import { getTargetFolderFiles, type FileNodeInfo } from '@/api/files'
import { setImgPath } from '@/api'
import { cloneDeep, last, range, uniq } from 'lodash'
import { setImgPath, genInfoCompleted } from '@/api'
import { cloneDeep, debounce, last, range, uniq } from 'lodash'
import { ref, computed, onMounted, watch, h } from 'vue'
import { FileOutlined, FolderOpenOutlined, DownOutlined } from '@/icon'
import { sortMethodMap, sortFiles, SortMethod } from './fileSort'
import path from 'path-browserify'
import { useGlobalStore } from '@/store/useGlobalStore'
import { copy2clipboard, ok, type SearchSelectConv, SearchSelect, useWatchDocument, fallbackImage, delay } from 'vue3-ts-util'
import { copy2clipboard, ok, type SearchSelectConv, SearchSelect, useWatchDocument, fallbackImage, delay, Task } from 'vue3-ts-util'
// @ts-ignore
import NProgress from 'multi-nprogress'
import 'multi-nprogress/nprogress.css'
@ -34,7 +34,7 @@ interface FileNodeInfoR extends FileNodeInfo {
}
type ViewMode = 'line' | 'grid' | 'large-size-grid'
const global = useGlobalStore()
const { currLocation, currPage, refresh, copyLocation, back, openNext, stack, to } = useLocation()
const { currLocation, currPage, refresh, copyLocation, back, openNext, stack, to, scroller } = useLocation()
const { gridItems, sortMethodConv, moreActionsDropdownShow, sortedFiles, sortMethod, viewMode, gridSize, viewModeMap, largeGridSize } = useFilesDisplay()
const { onDrop, onFileDragStart, multiSelectedIdxs } = useFileTransfer()
const { onFileItemClick, onContextMenuClick } = useFileItemActions()
@ -79,11 +79,18 @@ function useFilesDisplay () {
function useLocation () {
const scroller = ref<any>()
const np = ref<Progress.NProgress>()
const currPage = computed(() => last(stack.value))
const stack = ref<Page[]>([])
const currLocation = computed(() => path.join(...getBasePath()))
watch(() => stack.value.length, debounce((v,lv) => {
if (v !== lv) {
scroller.value.scrollToItem(0)
}
}, 300))
onMounted(async () => {
const resp = await getTargetFolderFiles(props.target, '/')
stack.value.push({
@ -180,7 +187,8 @@ function useLocation () {
currPage,
currLocation,
to,
stack
stack,
scroller
}
}
@ -276,6 +284,11 @@ function useFileItemActions () {
await setImgPath(file.fullpath) // 设置图像路径
const btn = gradioApp().querySelector('#bd_hidden_img_update_trigger')! as HTMLButtonElement
btn.click() // 触发图像组件更新
await Task.run({
pollInterval: 1000,
action: genInfoCompleted,
validator: v => v
}).completedTask // 等待消息生成完成
await delay(500) // 如果直接点好像会还是设置之前的图片，workaround
const tabBtn = gradioApp().querySelector(`#bd_hidden_tab_${tab}`) as HTMLButtonElement
tabBtn.click() // 触发粘贴
@ -357,7 +370,7 @@ function useFileItemActions () {
</div>
</div>
<div v-if="currPage" class="view">
<RecycleScroller class="file-list" :items="sortedFiles" :prerender="10"
<RecycleScroller class="file-list" :items="sortedFiles" :prerender="10" ref="scroller"
:item-size="viewMode === 'line' ? 80 : (viewMode === 'grid' ? gridSize : largeGridSize)" key-field="fullpath"
:gridItems="gridItems">
<template v-slot="{ item: file, index: idx }">