About the right click "send to txt2img" function

[rayadaschn]

Hello, this project is great, but there is some confusion about the project.
How is the right click "send to txt2img" function to synchronize to SD-webui implemented?
I see that there is a websockt polling. So the underlying mechanism is websockt synchronization?
Also, if I open more than one SD-webui, I find that the "send to txt2img" is synchronized across multiple pages.
I'm curious to see how this piece of functionality is implemented. Any help you can provide would be greatly appreciated.

[zanllp]

BroadcastChannel + Click the hidden button

sd-webui-infinite-image-browsing/javascript/index.js

Lines 97 to 138 in 345709b

	const imgTransferBus = new BroadcastChannel('iib-image-transfer-bus')
	imgTransferBus.addEventListener('message', async (ev) => {
	const data = JSON.parse(ev.data)
	if (typeof data !== 'object') {
	return
	}
	console.log(`iib-message:`, data)
	const appDoc = gradioApp()
	switch (data.event) {
	case 'click_hidden_button': {
	const btn = gradioApp().querySelector(`#${data.btnEleId}`)
	btn.click()
	break
	}
	case 'send_to_control_net': {
	data.type === 'img2img' ? window.switch_to_img2img() : window.switch_to_txt2img()
	await delay(100)
	const cn = appDoc.querySelector(`#${data.type}_controlnet`)
	const wrap = cn.querySelector('.label-wrap')
	if (!wrap.className.includes('open')) {
	wrap.click()
	await delay(100)
	}
	wrap.scrollIntoView()
	wrap.dispatchEvent(await createPasteEvent(data.url))
	break
	}
	case 'send_to_outpaint': {
	switch2targetTab(getTabIdxById('openOutpaint'))
	await delay(100)
	const iframe = appDoc.querySelector('#openoutpaint-iframe')
	openoutpaint_send_image(await imgUrl2DataUrl(data.url))
	iframe.contentWindow.postMessage({
	key: appDoc.querySelector('#openoutpaint-key').value,
	type: 'openoutpaint/set-prompt',
	prompt: data.prompt,
	negPrompt: data.negPrompt
	})
	break
	}
	}

sd-webui-infinite-image-browsing/scripts/iib_setup.py

Lines 19 to 64 in 345709b

	with gr.Row():
	with gr.Column():
	gr.HTML("", elem_id="iib_top")
	gr.HTML("error", elem_id="infinite_image_browsing_container_wrapper")
	# 以下是使用2个组件模拟粘贴过程
	img = gr.Image(
	type="pil",
	elem_id="iib_hidden_img",
	)
	def on_img_change():
	send_img_path["value"] = "" # 真正收到图片改变才允许放行
	img.change(on_img_change)
	img_update_trigger = gr.Button(
	"button", elem_id="iib_hidden_img_update_trigger"
	)
	# 修改文本和图像，等待修改完成后前端触发粘贴按钮
	# 有时在触发后收不到回调，可能是在解析params。txt时除了问题删除掉就行了
	def img_update_func():
	try:
	path = send_img_path.get("value")
	logger.info("img_update_func %s", path)
	img = Image.open(path)
	info = read_sd_webui_gen_info_from_image(img, path)
	return img, info
	except Exception as e:
	logger.error("img_update_func err %s",e)
	img_file_info = gr.Textbox(elem_id="iib_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"iib_hidden_tab_{tab}")
	# 注册粘贴
	send.register_paste_params_button(
	send.ParamBinding(
	paste_button=btn,
	tabname=tab,
	source_image_component=img,
	source_text_component=img_file_info,
	)
	)
	return (