diff --git a/gui/src/components/input/MaskCanvas.tsx b/gui/src/components/input/MaskCanvas.tsx
index b74e7fad..0a3d12b7 100644
--- a/gui/src/components/input/MaskCanvas.tsx
+++ b/gui/src/components/input/MaskCanvas.tsx
@@ -94,6 +94,7 @@ export function MaskCanvas(props: MaskCanvasProps) {
const { canvas, ctx } = getClearContext(bufferRef);
ctx.globalAlpha = FULL_OPACITY;
ctx.drawImage(image, 0, 0, canvas.width, canvas.height);
+
URL.revokeObjectURL(src);
drawBuffer();
@@ -166,6 +167,12 @@ export function MaskCanvas(props: MaskCanvasProps) {
}
setBackground(URL.createObjectURL(source));
+
+ // initialize the mask if it does not exist
+ if (doesExist(mask) === false) {
+ getClearContext(bufferRef);
+ maskState.current = MASK_STATE.dirty;
+ }
}
}, [source]);
diff --git a/gui/src/components/tab/Img2Img.tsx b/gui/src/components/tab/Img2Img.tsx
index 0ac2dc2e..43a7d325 100644
--- a/gui/src/components/tab/Img2Img.tsx
+++ b/gui/src/components/tab/Img2Img.tsx
@@ -1,4 +1,4 @@
-import { mustExist } from '@apextoaster/js-utils';
+import { doesExist, mustExist } from '@apextoaster/js-utils';
import { Box, Button, Stack } from '@mui/material';
import * as React from 'react';
import { useMutation, useQueryClient } from 'react-query';
@@ -63,7 +63,11 @@ export function Img2Img() {
}}
/>
-
+
;
}
diff --git a/gui/src/components/tab/Inpaint.tsx b/gui/src/components/tab/Inpaint.tsx
index 1328a7f8..fb0893c6 100644
--- a/gui/src/components/tab/Inpaint.tsx
+++ b/gui/src/components/tab/Inpaint.tsx
@@ -1,4 +1,4 @@
-import { mustExist } from '@apextoaster/js-utils';
+import { doesExist, mustExist } from '@apextoaster/js-utils';
import { Box, Button, Stack } from '@mui/material';
import * as React from 'react';
import { useMutation, useQuery, useQueryClient } from 'react-query';
@@ -161,7 +161,11 @@ export function Inpaint() {
-
+
;
}
diff --git a/gui/src/components/tab/Txt2Img.tsx b/gui/src/components/tab/Txt2Img.tsx
index 4eb9b454..8eb70058 100644
--- a/gui/src/components/tab/Txt2Img.tsx
+++ b/gui/src/components/tab/Txt2Img.tsx
@@ -65,7 +65,10 @@ export function Txt2Img() {
/>
-
+
;
}
diff --git a/gui/src/components/tab/Upscale.tsx b/gui/src/components/tab/Upscale.tsx
index 5754c81a..8e9bef4e 100644
--- a/gui/src/components/tab/Upscale.tsx
+++ b/gui/src/components/tab/Upscale.tsx
@@ -1,4 +1,4 @@
-import { mustExist } from '@apextoaster/js-utils';
+import { doesExist, mustExist } from '@apextoaster/js-utils';
import { Box, Button, Stack } from '@mui/material';
import * as React from 'react';
import { useMutation, useQueryClient } from 'react-query';
@@ -12,8 +12,6 @@ import { UpscaleControl } from '../control/UpscaleControl.js';
const { useContext } = React;
export function Upscale() {
- const config = mustExist(useContext(ConfigContext));
-
async function uploadSource() {
const { model, upscale } = state.getState();
@@ -46,7 +44,11 @@ export function Upscale() {
});
}} />
-
+
;
}