File size: 3,265 Bytes
b5ba7a5 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 |
async function openoutpaint_get_image_from_history() {
return new Promise(function (resolve, reject) {
var buttons = gradioApp().querySelectorAll(
'#tab_images_history [style="display: block;"].tabitem div[id$=_gallery] .gallery-item'
);
var button = gradioApp().querySelector(
'#tab_images_history [style="display: block;"].tabitem div[id$=_gallery] .gallery-item.\\!ring-2'
);
if (!button) button = buttons[0];
if (!button)
reject(new Error("[openoutpaint] No image available in the gallery"));
const canvas = document.createElement("canvas");
const image = document.createElement("img");
image.onload = () => {
canvas.width = image.width;
canvas.height = image.height;
canvas.getContext("2d").drawImage(image, 0, 0);
resolve(canvas.toDataURL());
};
image.src = button.querySelector("img").src;
});
}
function openoutpaint_send_history_gallery(
name = "Image Browser Resource",
tab
) {
openoutpaint_get_image_from_history()
.then((dataURL) => {
// Send to openOutpaint
openoutpaint.frame.contentWindow.postMessage({
key: openoutpaint.key,
type: "openoutpaint/add-resource",
image: {
dataURL,
resourceName: name,
},
});
// Send prompt to openOutpaint
const tab = get_uiCurrentTabContent().id;
const prompt =
tab === "tab_txt2img"
? gradioApp().querySelector("#txt2img_prompt textarea").value
: gradioApp().querySelector("#img2img_prompt textarea").value;
const negPrompt =
tab === "tab_txt2img"
? gradioApp().querySelector("#txt2img_neg_prompt textarea").value
: gradioApp().querySelector("#img2img_neg_prompt textarea").value;
openoutpaint.frame.contentWindow.postMessage({
key: openoutpaint.key,
type: "openoutpaint/set-prompt",
prompt,
negPrompt,
});
// Change Tab
Array.from(
gradioApp().querySelectorAll("#tabs > div:first-child button")
).forEach((button) => {
if (button.textContent.trim() === "openOutpaint") {
button.click();
}
});
})
.catch((error) => {
console.warn("[openoutpaint] No image selected to send to openOutpaint");
});
}
document.addEventListener("DOMContentLoaded", () => {
let tries = 3;
const onload = () => {
const element = gradioApp().getElementById("tab_images_history");
const tabsEl = gradioApp().getElementById("images_history_tab");
if (element) {
console.debug(`[oo-ext] Detected image history extension`);
// Gets tab buttons
const tabs = Array.from(tabsEl.firstChild.querySelectorAll("button")).map(
(button) => button.textContent.trim()
);
tabs.forEach((tab) => {
const buttonPanel = gradioApp().getElementById(
`${tab}_images_history_button_panel`
);
if (!buttonPanel) return;
const button = document.createElement("button");
button.textContent = "Send to openOutpaint";
button.classList.add(
"gr-button",
"gr-button-lg",
"gr-button-secondary"
);
button.addEventListener("click", () => {
openoutpaint_send_history_gallery(`Image Browser (${tab}) Resource`);
});
buttonPanel.appendChild(button);
});
} else if (tries-- > 0) {
// Tries n times every 1 second before giving up
setTimeout(onload, 1000);
}
};
onload();
});
|