diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/client/views/nodes/generativeFill/GenerativeFill.tsx | 40 | ||||
| -rw-r--r-- | src/client/views/nodes/generativeFill/GenerativeFillButtons.tsx | 2 |
2 files changed, 25 insertions, 17 deletions
diff --git a/src/client/views/nodes/generativeFill/GenerativeFill.tsx b/src/client/views/nodes/generativeFill/GenerativeFill.tsx index 5e7b4fdca..0ebf370c0 100644 --- a/src/client/views/nodes/generativeFill/GenerativeFill.tsx +++ b/src/client/views/nodes/generativeFill/GenerativeFill.tsx @@ -77,6 +77,9 @@ const GenerativeFill = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addD // early stage properly, likely will get rid of const freeformPosition = useRef<number[]>([0, 0]); + // which urls were already saved to canvas + const savedSrcs = useRef<string[]>([]); + // references to keep track of tree structure const newCollectionRef = useRef<Doc | null>(null); const parentDoc = useRef<Doc | null>(null); @@ -243,16 +246,18 @@ const GenerativeFill = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addD const ctx = ImageUtility.getCanvasContext(canvasRef); if (!ctx) return; setLoading(true); + // need to adjust later try { const maskBlob = await ImageUtility.canvasToBlob(canvas); const imgBlob = await ImageUtility.canvasToBlob(ImageUtility.getCanvasImg(img)); - const res = await ImageUtility.getEdit(imgBlob, maskBlob, input !== '' ? input + ' in the same style' : 'Fill in the image in the same style', 2); // const res = await ImageUtility.mockGetEdit(img.src); + parentDoc.current = childrenDocs.current[childrenDocs.current.length - 1]; + childrenDocs.current = []; + originalImg.current = currImg.current; const { urls } = res as APISuccess; const image = new Image(); image.src = urls[0]; - setLoading(false); setEdits(urls); ImageUtility.drawImgToCanvas(image, canvasRef); currImg.current = image; @@ -261,6 +266,7 @@ const GenerativeFill = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addD } catch (err) { console.log(err); } + setLoading(false); }; // adjusts all the img positions to be aligned @@ -301,31 +307,34 @@ const GenerativeFill = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addD }); childrenDocs.current.push(newImg); - adjustImgPositions(); + if (!firstDoc) { + DocUtils.MakeLink(parentDoc.current, newImg, { link_relationship: 'Image Edit', link_displayLine: true }); + adjustImgPositions(); + } Doc.AddDocToList(newCollectionRef.current, undefined, newImg); - DocUtils.MakeLink(parentDoc.current, newImg, { link_relationship: 'Image Edit' }); return newImg; }; + // need to maybe call on every img click, not just when the save btn is clicked const onSave = async () => { + setLoading(true); if (!currImg.current || !originalImg.current || !imageRootDoc) return; try { if (!newCollectionRef.current) { // create new collection and add it to the view newCollectionRef.current = Docs.Create.FreeformDocument([], { x: NumCast(imageRootDoc.x) + NumCast(imageRootDoc._width) + 20, y: NumCast(imageRootDoc.y), _width: 1000, _height: 1000 }); addDoc?.(newCollectionRef.current); - const originalSrc = originalImg.current.src; await createNewImgDoc(originalImg.current, true); } - CollectionDockingView.AddSplit(Doc.MakeCopy(DocCast(Doc.UserDoc().emptyPane)), OpenWhereMod.right); + await createNewImgDoc(currImg.current, false); + // CollectionDockingView.AddSplit(Doc.MakeCopy(DocCast(Doc.UserDoc().emptyPane)), OpenWhereMod.right); // CollectionDockingView.AddSplit(newCollection,OpenWhere.inParent) - // mindmapping + // mind mapping // this.props.addDocTab(); - - // Create link between prompt and image } catch (err) { console.log(err); } + setLoading(false); }; return ( @@ -336,6 +345,9 @@ const GenerativeFill = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addD <Buttons canvasRef={canvasRef} currImg={currImg} getEdit={getEdit} loading={loading} onSave={onSave} onReset={handleReset} /> <IconButton onClick={() => { + if (newCollectionRef.current) { + CollectionDockingView.AddSplit(newCollectionRef.current, OpenWhereMod.right); + } MainView.Instance.setImageEditorOpen(false); MainView.Instance.setImageEditorSource(''); setEdits([]); @@ -381,12 +393,6 @@ const GenerativeFill = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addD }}> <BsBrush color={brushStyle === BrushStyle.ADD ? activeColor : 'inherit'} /> </IconButton> - {/* <IconButton - onClick={() => { - setBrushStyle(BrushStyle.SUBTRACT); - }}> - <BsEraser color={brushStyle === BrushStyle.SUBTRACT ? activeColor : 'inherit'} /> - </IconButton> */} {/* Undo and Redo */} <IconButton onPointerDown={e => { @@ -409,7 +415,7 @@ const GenerativeFill = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addD <CiRedo /> </IconButton> </div> - {/* Edits box */} + {/* Edits thumbnails*/} <div className="editsBox"> {edits.map((edit, i) => ( <img @@ -422,9 +428,11 @@ const GenerativeFill = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addD img.src = edit; ImageUtility.drawImgToCanvas(img, canvasRef); currImg.current = img; + onSave(); }} /> ))} + {/* Original img thumbnail */} {edits.length > 0 && ( <div style={{ position: 'relative' }}> <label diff --git a/src/client/views/nodes/generativeFill/GenerativeFillButtons.tsx b/src/client/views/nodes/generativeFill/GenerativeFillButtons.tsx index e8cb61ab5..53c6cec84 100644 --- a/src/client/views/nodes/generativeFill/GenerativeFillButtons.tsx +++ b/src/client/views/nodes/generativeFill/GenerativeFillButtons.tsx @@ -23,7 +23,7 @@ const Buttons = ({ canvasRef, currImg, loading, getEdit, onSave, onReset }: Butt return ( <div className="generativeFillBtnContainer"> <Button onClick={onReset}>Reset</Button> - <Button onClick={handleSave}>Save</Button> + {/* <Button onClick={handleSave}>Save</Button> */} {/* <Button onClick={() => { if (!canvasRef.current) return; |