Commit Graph

3818 Commits

Author SHA1 Message Date
psychedelicious
6b98dba71d chore(ui): lint 2024-05-06 08:55:32 -04:00
psychedelicious
c0065a65a0 feat(ui): floating viewer always shows progress, never shows metadata 2024-05-06 08:55:32 -04:00
psychedelicious
cce3144c74 feat(ui): add floating image viewer 2024-05-06 08:55:32 -04:00
psychedelicious
aab152a7e9 fix(ui): track mouse out flags correctly 2024-05-06 08:55:32 -04:00
psychedelicious
c5b948bc3f feat(ui): fade layer selection color 2024-05-06 08:55:32 -04:00
psychedelicious
44ecddae2e feat(ui): style Settings/Control Layers tabs like tabs 2024-05-06 08:55:32 -04:00
psychedelicious
26847895b9 fix(ui): update hotkeys for viewer 2024-05-06 08:55:32 -04:00
psychedelicious
e4a640f0a7 feat(ui): optimized rendering of selected layer
Instead of caching on every stroke, we can use a compositing rect when the layer is being drawn to improve performance.
2024-05-04 12:03:28 -04:00
psychedelicious
b5b6a96d94 feat(ui): dynamic brush spacing
Scaled to 10% of brush size, clamped between 5px and 15px. This makes drawing feel a bit smoother, but maintains reasonable performance.
2024-05-04 12:03:28 -04:00
psychedelicious
806a8f69c5 perf(ui): rerender of opacity sliders 2024-05-04 12:03:28 -04:00
psychedelicious
ac0b9ba290 tidy(ui): $cursorPosition -> $lastCursorPos 2024-05-04 12:03:28 -04:00
psychedelicious
7ca613d41c feat(ui): snap cursor pos when drawing rects
- Rects snap to stage edge when within a threshold (10 screen pixels)
- When mouse leaves stage, set last mousedown pos to null, preventing nonfunctional rect outlines

Partially addresses #6306.

There's a technical challenge to fully address the issue - mouse event are not fired when the mouse is outside the stage. While we could draw the rect even if the mouse leaves, we cannot update the rect's dimensions on mouse move, or complete the drawing on mouse up.

To fully address the issue, we'd need to a way to forward window events back to the stage, or at least handle window events. We can explore this later.
2024-05-04 12:03:28 -04:00
psychedelicious
5cb1ff8679 fix(ui): open viewer on image click, not select 2024-05-04 12:03:28 -04:00
psychedelicious
8794b99d51 fix(ui): save upscaled images to gallery on canvas tab 2024-05-03 23:15:10 -04:00
psychedelicious
6bdded85da fix(ui): do not auto-hide next/prev image buttons 2024-05-03 23:15:10 -04:00
psychedelicious
26613f10c7 feat(ui): close viewer when user switches tabs 2024-05-03 23:15:10 -04:00
psychedelicious
6d2fe3b691 tidy(ui): clean up layer reset logic 2024-05-03 23:15:10 -04:00
psychedelicious
2888845f7c fix(ui): invalidate mask cache when moving layer 2024-05-03 23:15:10 -04:00
psychedelicious
4beccea6e7 fix(ui): do not run HRO if using an initial image 2024-05-03 23:15:10 -04:00
psychedelicious
68d1458c83 fix(ui): address feedback 2024-05-04 08:40:12 +10:00
blessedcoolant
f4dde883ca feat: improve the switch states of the control layers / viewer area 2024-05-04 08:40:12 +10:00
psychedelicious
be7eeb576b fix(ui): fix viewer getting stuck when spamming toggle 2024-05-03 20:57:18 +10:00
psychedelicious
af9f0e0963 feat(ui): cache control layer mask images
When invoking with control layers, we were creating and uploading the mask images on every enqueue, even when the mask didn't change. The mask image can be cached to greatly reduce the number of uploads.

With this change, we are a bit smarter about the mask images:
- Check if there is an uploaded mask image name
- If so, attempt to retrieve its DTO. Typically it will be in the RTKQ cache, so there is no network request, but it will make a network request if not cached to confirm the image actually exists on the server.
- If we don't have an uploaded mask image name, or the request fails, we go ahead and upload the generated blob
- Update the layer's state with a reference to this uploaded image for next time
- Continue as before

Any time we modify the mask (drawing/erasing, resetting the layer), we invalidate that cached image name (set it to null).

We now only upload images when we need to and generation starts faster.
2024-05-03 20:57:18 +10:00
psychedelicious
579d436934 fix(ui): floating param/gallery buttons 2024-05-02 23:09:26 -04:00
psychedelicious
36f01988e8 chore(ui): lint 2024-05-02 23:09:26 -04:00
psychedelicious
d9b92d19f9 feat(ui): clearer viewer/editor context switching 2024-05-02 23:09:26 -04:00
psychedelicious
fdfc379a84 fix(ui): layer counts 2024-05-02 23:09:26 -04:00
psychedelicious
2062cfe84a fix(ui): cursor when no renderable layers added 2024-05-02 23:09:26 -04:00
psychedelicious
eb36e834b2 feat(ui): add fallback when no layers exist 2024-05-02 23:09:26 -04:00
psychedelicious
2baa33730a fix(ui): fix control layer list layout 2024-05-02 23:09:26 -04:00
psychedelicious
c30df7ce79 feat(ui): style settings/control layers tabs 2024-05-02 23:09:26 -04:00
psychedelicious
f05ac5a7a5 chore(ui): bump @invoke-ai/ui-library 2024-05-02 23:09:26 -04:00
psychedelicious
85dd78b8df fix(ui): handle deleting images in use in generation tab 2024-05-02 23:09:26 -04:00
psychedelicious
4c7be03702 tidy(ui): rename generation tab graph builders 2024-05-02 23:09:26 -04:00
psychedelicious
e354fee4f4 fix(ui): add img2img metadata to graphs 2024-05-02 23:09:26 -04:00
psychedelicious
20e628297c fix(ui): smoother animations in current image preview 2024-05-02 23:09:26 -04:00
psychedelicious
98664fc46f fix(ui): gallery prev/next buttons animations 2024-05-02 23:09:26 -04:00
psychedelicious
33617fc06a feat(ui): rework image viewer
- Rework styling
- Replace "CurrentImageDisplay" entirely
- Add a super short fade to reduce jarring transition
- Make the viewer a singleton component, overlaid on everything else - reduces change when switching tabs
2024-05-02 23:09:26 -04:00
psychedelicious
c05e52ebae fix(ui): do not delete all layers when using image as initial image 2024-05-02 23:09:26 -04:00
psychedelicious
5734a97c55 fix(ui): do not attempt drawing when invalid layer type selected 2024-05-02 23:09:26 -04:00
psychedelicious
94a73d5377 feat(ui): update mm-related translations 2024-05-02 23:09:26 -04:00
psychedelicious
0f7fdabe9b feat(ui): rename tab identifiers
- "txt2img" -> "generation"
- "unifiedCanvas" -> "canvas"
- "modelManager" -> "models"
- "nodes" -> "workflows"
- Add UI slice migration setting the active tab to "generation"
2024-05-02 23:09:26 -04:00
psychedelicious
7c1f1076b4 feat(ui): rename tabs
- "Text to Image" -> "Generation"
- "Unified Canvas" -> "Canvas"
- "Model Manager" -> "Models"
2024-05-02 23:09:26 -04:00
psychedelicious
a6ac184211 tidy(ui): excise img2img tab 2024-05-02 23:09:26 -04:00
psychedelicious
7d58908e32 fix(ui): fix img2img graphs w/ control layers 2024-05-02 23:09:26 -04:00
psychedelicious
26d3ec3fce fix(ui): destroy initial image layer after deleting 2024-05-02 23:09:26 -04:00
psychedelicious
dc81357152 feat(ui): add img2img via control layers to graph builders 2024-05-02 23:09:26 -04:00
psychedelicious
c9886796f6 feat(ui): add image viewer overlay
- Works on txt2img, canvas and workflows tabs, img2img has its own side-by-side view
- In workflow editor, the is closeable only if you are in edit mode, else it's always there
- Press `i` to open
- Press `esc` to close
- Selecting an image or changing image selection opens the viewer
- When generating, if auto-switch to new image is enabled, the viewer opens when an image comes in

To support this change, I organized and restructured some tab stuff.
2024-05-02 23:09:26 -04:00
psychedelicious
209ddc2037 fix(ui): do not toggle layers on double click of opacity popover 2024-05-02 23:09:26 -04:00
psychedelicious
8b6a283eab feat(ui): add opacity to initial image layer 2024-05-02 23:09:26 -04:00
psychedelicious
75be6814bb feat(ui): add renderer for initial image 2024-05-02 23:09:26 -04:00
psychedelicious
1d213067e8 feat(ui): add initial image layer to CL 2024-05-02 23:09:26 -04:00
psychedelicious
d67480d92c feat(ui): add layerwrapper component 2024-05-02 23:09:26 -04:00
psychedelicious
d55ea318ec tidy(ui): remove unused gallery hotkeys 2024-05-02 23:09:26 -04:00
psychedelicious
474eab6f8a fix(ui): clamp incoming w/h to ensure always a multiple of 8
When recalling metadata and/or using control image dimensions, it was possible to set a width or height that was not a multiple of 8, resulting in generation failures.

Added a `clamp` option to the w/h actions to fix this. The option is used for all untrusted sources - everything except for the w/h number inputs, which clamp the values themselves.
2024-05-02 23:09:26 -04:00
psychedelicious
1b13fee256 fix(ui): firefox drawing lag
Firefox v125.0.3 and below has a bug where `mouseenter` events are fired continually during mouse moves. The issue isn't present on FF v126.0b6 Developer Edition. It's not clear if the issue is present on FF nightly, and we're not sure if it will actually be fixed in the stable v126 release.

The control layers drawing logic relied on on `mouseenter` events to create new lines, and `mousemove` to extend existing lines. On the affected version of FF, all line extensions are turned into new lines, resulting in very poor performance, noncontiguous lines, and way-too-big internal state.

To resolve this, the drawing handling was updated to not use `mouseenter` at all. As a bonus, resolving this issue has resulted in simpler logic for drawing on the canvas.
2024-05-02 23:09:26 -04:00
psychedelicious
6363095b29 feat(ui): control adapter recall for control layers
- Add set of metadata handlers for the control layers CAs
- Use these conditionally depending on the active tab - when recalling on txt2img, the CAs go to control layers, else they go to the old CA area.
2024-05-02 23:09:26 -04:00
psychedelicious
4cd78b9478 feat(ui): add getImageDTO imperative RTKQ helper 2024-05-02 23:09:26 -04:00
psychedelicious
2cde8a643e tidy(ui): suffix a control adapter types/objects with V2
Prevent mixing the old and new implementations up
2024-05-02 23:09:26 -04:00
psychedelicious
f9555f03f5 tidy(ui): "CONTROLNET_PROCESSORS" -> "CA_PROCESSOR_DATA" 2024-05-02 23:09:26 -04:00
psychedelicious
b1d8f3a3f9 tidy(ui): revert changes to old CA implementation
These changes were left over from the previous attempt to handle control adapters in control layers with the same logic. Control Layers are now handled totally separately, so these changes may be reverted.
2024-05-02 23:09:26 -04:00
psychedelicious
c35625eb44 feat(ui): processor layout changes 2024-05-01 21:48:47 -04:00
psychedelicious
6f572e1cce fix(ui): convert t2i to cnet and vice-versa when model changes 2024-05-01 21:48:47 -04:00
psychedelicious
54acd3f2b1 ci(ui): restore error status for circular deps 2024-05-01 21:48:47 -04:00
psychedelicious
6e966909ab chore(ui): lint 2024-05-01 21:48:47 -04:00
psychedelicious
311ba8c04b fix(ui): ensure canvas size is correctly updated when model changed
Closes #6293
2024-05-01 21:48:47 -04:00
psychedelicious
1b617768cf fix(ui): canvas infinite loop when setting bbox dims
When typing in a number into the w/h number inputs, if the number is less than the step, it appears the value of 0 is used. This is unexpected; it means Chakra isn't clamping the value correctly (or maybe our wrapper isn't clamping it).

Add checks to never bail if the width or height value from the number input component is 0.
2024-05-01 21:48:47 -04:00
psychedelicious
8ceb94497e fix(ui): fix canvas rendering of control images 2024-05-01 21:48:47 -04:00
psychedelicious
efb571401c feat(ui): tweak control adapter layout 2024-05-01 21:48:47 -04:00
psychedelicious
ffba4871d0 tidy(ui): "scribble" -> "Scribble" 2024-05-01 21:48:47 -04:00
psychedelicious
9437d701b2 fix(ui): disable clear processor when no processor selected 2024-05-01 21:48:47 -04:00
psychedelicious
6effa19626 fix(ui): edge cases in auto-process 2024-05-01 21:48:47 -04:00
psychedelicious
45c2ac41d5 feat(ui): processor layout/styling 2024-05-01 21:48:47 -04:00
psychedelicious
ca1c3c0873 fix(ui): do not re-process if processor config hasn't changed 2024-05-01 21:48:47 -04:00
psychedelicious
47ee08db91 fix(ui): processor select styling 2024-05-01 21:48:47 -04:00
psychedelicious
c96b98fc9e feat(ui): auto-process for control layer CAs 2024-05-01 21:48:47 -04:00
psychedelicious
905baf2787 refactor(ui): continue wiring up CA logic across (wip)
It works!
2024-05-01 21:48:47 -04:00
psychedelicious
0e55488ff6 refactor(ui): wire up CA logic across (wip) 2024-05-01 21:48:47 -04:00
psychedelicious
424a27eeda refactor(ui): add CA processor config components (wip) 2024-05-01 21:48:47 -04:00
psychedelicious
6007218a51 refactor(ui): add CA config components (wip) 2024-05-01 21:48:47 -04:00
psychedelicious
811e8a5a8b refactor(ui): rename & export actions from CL slice 2024-05-01 21:48:47 -04:00
psychedelicious
121918352a refactor(ui): add control layers separate control adapter implementation (wip)
- Revise control adapter config types
- Recreate all control adapter mutations in control layers slice
- Bit of renaming along the way - typing 'RegionalGuidanceLayer' over and over again was getting tedious
2024-05-01 21:48:47 -04:00
psychedelicious
3717321480 tidy(ui): organize layer components 2024-05-01 21:48:47 -04:00
blessedcoolant
38880cde5c chore: update schema 2024-05-01 01:20:22 +05:30
blessedcoolant
39ab4dd83e Merge branch 'main' into pr/6086 2024-05-01 00:37:06 +05:30
psychedelicious
631878b212 feat(ui): border radius on canvas 2024-04-30 08:10:59 -04:00
psychedelicious
7a5399e83c feat(ui): display message when no layers are added 2024-04-30 08:10:59 -04:00
psychedelicious
e90775731d fix(ui): layer layout orientation 2024-04-30 08:10:59 -04:00
psychedelicious
3f26880493 fix(ui): "Global Settings" -> "Settings" 2024-04-30 08:10:59 -04:00
psychedelicious
21cf1004db fix(ui): layers default to expanded 2024-04-30 08:10:59 -04:00
psychedelicious
d74cd12aa6 feat(ui): collapsible layers 2024-04-30 08:10:59 -04:00
psychedelicious
cf1883585d chore(ui): lint 2024-04-30 08:10:59 -04:00
psychedelicious
8a791d4f16 feat(ui): make control image opacity filter toggleable 2024-04-30 08:10:59 -04:00
psychedelicious
1212698059 tidy(ui): more renaming of components 2024-04-30 08:10:59 -04:00
psychedelicious
ba6db33b39 tidy(ui): more renaming of components 2024-04-30 08:10:59 -04:00
psychedelicious
b3dbfdaa02 tidy(ui): more renaming of components 2024-04-30 08:10:59 -04:00
psychedelicious
3441187c23 tidy(ui): "regional prompts" -> "control layers" 2024-04-30 08:10:59 -04:00
psychedelicious
8de56fd77c tidy(ui): move regionalPrompts files to controlLayers 2024-04-30 08:10:59 -04:00
psychedelicious
22bd33b7c6 chore(ui): lint 2024-04-30 08:10:59 -04:00
psychedelicious
2af5c4be9f fix(ui): ip adapter layers are not selectable 2024-04-30 08:10:59 -04:00