admin/infinite-canvas
1
0
Fork 0
mirror of https://github.com/basketikun/infinite-canvas.git synced 2026-08-04 00:01:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(image-settings): add transparent background toggle for image generation

Browse Source
This commit is contained in:
HouYunFei
2026-07-16 15:45:02 +08:00
parent 2f9776bee3
commit 2959b5d340
8 changed files with 39 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/services/api/image.ts
+15 -2
View File
@@ -122,6 +122,11 @@ function normalizeQuality(quality: string) {
return QUALITY_BASE[normalized] ? normalized : undefined;
}
/** Only "transparent" is forwarded; any other value (incl. empty) means keep the default opaque background. */
function normalizeBackground(background: string | undefined) {
return background?.trim().toLowerCase() === "transparent" ? "transparent" : undefined;
}
/** Map "quality + ratio" to an explicit pixel dimension like "3840x2160". */
function resolveSize(quality: string | undefined, ratio: string): string {
const parsedRatio = parseImageRatio(ratio);
@@ -661,6 +666,7 @@ export async function requestGeneration(config: AiConfig, prompt: string, option
if (script) {
const quality = normalizeQuality(config.quality);
const requestSize = resolveRequestSize(quality, config.size);
const background = normalizeBackground(config.background);
try {
const result = await runModelPlugin({
capability: "image",
@@ -668,7 +674,7 @@ export async function requestGeneration(config: AiConfig, prompt: string, option
config: requestConfig,
prompt: withSystemPrompt(requestConfig, prompt),
images: [],
params: { size: requestSize, quality, count: n },
params: { size: requestSize, quality, count: n, ...(background ? { background } : {}) },
signal: options?.signal,
});
return normalizePluginImages(result).map((dataUrl) => ({ id: nanoid(), dataUrl }));
@@ -685,6 +691,7 @@ export async function requestGeneration(config: AiConfig, prompt: string, option
}
const quality = normalizeQuality(config.quality);
const requestSize = resolveRequestSize(quality, config.size);
const background = normalizeBackground(config.background);
try {
const response = await axios.post<ImageApiResponse>(
aiApiUrl(requestConfig, "/images/generations"),
@@ -694,6 +701,7 @@ export async function requestGeneration(config: AiConfig, prompt: string, option
n,
...(quality ? { quality } : {}),
...(requestSize ? { size: requestSize } : {}),
...(background ? { background } : {}),
response_format: "b64_json",
output_format: IMAGE_OUTPUT_FORMAT,
},
@@ -717,6 +725,7 @@ export async function requestEdit(config: AiConfig, prompt: string, references:
if (script) {
const quality = normalizeQuality(config.quality);
const requestSize = resolveRequestSize(quality, config.size);
const background = normalizeBackground(config.background);
const refs = await Promise.all(references.map((image) => imageToDataUrl(image)));
try {
const result = await runModelPlugin({
@@ -725,7 +734,7 @@ export async function requestEdit(config: AiConfig, prompt: string, references:
config: requestConfig,
prompt: withSystemPrompt(requestConfig, requestPrompt),
images: refs,
params: { size: requestSize, quality, count: n },
params: { size: requestSize, quality, count: n, ...(background ? { background } : {}) },
signal: options?.signal,
});
return normalizePluginImages(result).map((dataUrl) => ({ id: nanoid(), dataUrl }));
@@ -743,6 +752,7 @@ export async function requestEdit(config: AiConfig, prompt: string, references:
}
const quality = normalizeQuality(config.quality);
const requestSize = resolveRequestSize(quality, config.size);
const background = normalizeBackground(config.background);
const formData = new FormData();
formData.set("model", requestConfig.model);
formData.set("prompt", withSystemPrompt(requestConfig, requestPrompt));
@@ -755,6 +765,9 @@ export async function requestEdit(config: AiConfig, prompt: string, references:
if (requestSize) {
formData.set("size", requestSize);
}
if (background) {
formData.set("background", background);
}
const files = await Promise.all(references.map(async (image) => dataUrlToFile({ ...image, dataUrl: await imageToDataUrl(image) })));
files.forEach((file) => formData.append("image", file));
if (mask) formData.set("mask", dataUrlToFile(mask));