feat(gui): add selector for mask filter
This commit is contained in:
parent
f5ed77a349
commit
2a30a04e46
|
@ -44,7 +44,7 @@ export interface InpaintParams extends BaseImgParams {
|
|||
mask: Blob;
|
||||
source: Blob;
|
||||
|
||||
blend: string;
|
||||
filter: string;
|
||||
noise: string;
|
||||
}
|
||||
|
||||
|
@ -78,7 +78,7 @@ export interface ApiReady {
|
|||
}
|
||||
|
||||
export interface ApiClient {
|
||||
blends(): Promise<Array<string>>;
|
||||
masks(): Promise<Array<string>>;
|
||||
models(): Promise<Array<string>>;
|
||||
noises(): Promise<Array<string>>;
|
||||
params(): Promise<ConfigParams>;
|
||||
|
@ -161,8 +161,8 @@ export function makeClient(root: string, f = fetch): ApiClient {
|
|||
}
|
||||
|
||||
return {
|
||||
async blends(): Promise<Array<string>> {
|
||||
const path = makeApiUrl(root, 'settings', 'blends');
|
||||
async masks(): Promise<Array<string>> {
|
||||
const path = makeApiUrl(root, 'settings', 'masks');
|
||||
const res = await f(path);
|
||||
return await res.json() as Array<string>;
|
||||
},
|
||||
|
@ -238,8 +238,8 @@ export function makeClient(root: string, f = fetch): ApiClient {
|
|||
}
|
||||
|
||||
const url = makeImageURL(root, 'inpaint', params);
|
||||
url.searchParams.append('filter', params.filter);
|
||||
url.searchParams.append('noise', params.noise);
|
||||
url.searchParams.append('blend', params.blend);
|
||||
|
||||
const body = new FormData();
|
||||
body.append('mask', params.mask, 'mask');
|
||||
|
@ -259,8 +259,8 @@ export function makeClient(root: string, f = fetch): ApiClient {
|
|||
}
|
||||
|
||||
const url = makeImageURL(root, 'inpaint', params);
|
||||
url.searchParams.append('filter', params.filter);
|
||||
url.searchParams.append('noise', params.noise);
|
||||
url.searchParams.append('blend', params.blend);
|
||||
|
||||
if (doesExist(params.left)) {
|
||||
url.searchParams.append('left', params.left.toFixed(0));
|
||||
|
|
|
@ -6,7 +6,7 @@ import { useStore } from 'zustand';
|
|||
|
||||
import { ConfigParams, IMAGE_FILTER, STALE_TIME } from '../config.js';
|
||||
import { ClientContext, StateContext } from '../state.js';
|
||||
import { BLEND_LABELS, NOISE_LABELS } from '../strings.js';
|
||||
import { MASK_LABELS, NOISE_LABELS } from '../strings.js';
|
||||
import { ImageControl } from './ImageControl.js';
|
||||
import { ImageInput } from './ImageInput.js';
|
||||
import { MaskCanvas } from './MaskCanvas.js';
|
||||
|
@ -25,7 +25,7 @@ export interface InpaintProps {
|
|||
export function Inpaint(props: InpaintProps) {
|
||||
const { config, model, platform } = props;
|
||||
const client = mustExist(useContext(ClientContext));
|
||||
const blends = useQuery('blends', async () => client.blends(), {
|
||||
const masks = useQuery('masks', async () => client.masks(), {
|
||||
staleTime: STALE_TIME,
|
||||
});
|
||||
const noises = useQuery('noises', async () => client.noises(), {
|
||||
|
@ -114,14 +114,14 @@ export function Inpaint(props: InpaintProps) {
|
|||
/>
|
||||
<Stack direction='row' spacing={2}>
|
||||
<QueryList
|
||||
id='blends'
|
||||
labels={BLEND_LABELS}
|
||||
name='Blend Mode'
|
||||
result={blends}
|
||||
value={params.blend}
|
||||
onChange={(blend) => {
|
||||
id='masks'
|
||||
labels={MASK_LABELS}
|
||||
name='Mask Filter'
|
||||
result={masks}
|
||||
value={params.filter}
|
||||
onChange={(filter) => {
|
||||
setInpaint({
|
||||
blend,
|
||||
filter,
|
||||
});
|
||||
}}
|
||||
/>
|
||||
|
|
|
@ -126,10 +126,10 @@ export function createStateSlices(base: ConfigParams) {
|
|||
const createInpaintSlice: StateCreator<OnnxState, [], [], InpaintSlice> = (set) => ({
|
||||
inpaint: {
|
||||
...defaults,
|
||||
filter: '',
|
||||
mask: null,
|
||||
source: null,
|
||||
noise: '',
|
||||
blend: '',
|
||||
source: null,
|
||||
},
|
||||
setInpaint(params) {
|
||||
set((prev) => ({
|
||||
|
@ -143,10 +143,10 @@ export function createStateSlices(base: ConfigParams) {
|
|||
set({
|
||||
inpaint: {
|
||||
...defaults,
|
||||
filter: '',
|
||||
mask: null,
|
||||
source: null,
|
||||
noise: '',
|
||||
blend: '',
|
||||
},
|
||||
});
|
||||
},
|
||||
|
|
|
@ -35,7 +35,7 @@ export const NOISE_LABELS: Record<string, string> = {
|
|||
uniform: 'Uniform Noise',
|
||||
};
|
||||
|
||||
export const BLEND_LABELS: Record<string, string> = {
|
||||
'mask-source': 'Noise -> Source',
|
||||
'source-mask': 'Source -> Noise',
|
||||
export const MASK_LABELS: Record<string, string> = {
|
||||
gaussian: 'Gaussian Blur',
|
||||
none: 'None',
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue