InvokeAI/frontend
damian0815 96b34c0f85 Final WebUI build for Release 2.1
- squashed commit of 52 commits from PR #1327

don't log base64 progress images

Fresh Build For WebUI

[WebUI] Loopback Default False

Fixes bugs/styling

- Fixes missing web app state on new version:
Adds stateReconciler to redux-persist.

When we add more values to the state and then release the update app, they will be automatically merged in.

Reseting web UI will be needed far less.
7159ec

- Fixes console z-index
- Moves reset web UI button to visible area

Decreases gallery width on inpainting

Increases workarea split padding to 1rem

Adds missing tooltips to site header

Changes inpainting controls settings to hover

Fixes hotkeys and settings buttons not working

Improves bounding box interactions

- Bounding box can now be moved by dragging any of its edges
- Bounding box does not affect drawing if already drawing a stroke
- Can lock bounding box to draw directly on the bounding box edges
- Removes spacebar-hold behaviour due to technical issues

Fixes silent crash when init image too large

To send the mask to the server, the UI rendered the mask onto the init image and sent the whole image. The mask was then cropped by the server.

If the image was too large, the app silently failed. Maybe it exceeds the websocket size limit.

Fixed by cropping the mask in the UI layer, sending only bounding-box-sized mask image data.

Disabled bounding box settings when locked

Styles image uploader

Builds fresh bundle

Improves bounding box interaction

Added spacebar-hold-to-transform back.

Address bounding box feedback

- Adds back toggle to hide bounding box
- Box quick toggle = q, normal toggle = shift + q
- Styles canvas alert icons

Adds hints when unable to invoke

- Popover on Invoke button indicates why exactly it is disabled, e.g. prompt is empty, something else is processing, etc.
- There may be more than one reason; all are displayed.

Fix Inpainting Alerts Styling

Preventing unnecessary re-renders across the app

Code Split Inpaint Options

Isolate features to their own components so they dont re-render the other stuff each time.

[TESTING] Remove  global isReady checking

I dont believe this is need at all because the isready state is constantly updated when needed and tracked real time in the Redux store. This causes massive re-renders. @psychedelicious If this is absolutely essential for a reason that I do not see, please hit me up on Discord.

Fresh Bundle

Fix Bounding Box Settings re-rendering on brush stroke

[Code Splitting] Bounding Box Options

Isolated all bounding box components to trigger unnecessary re-renders. Still need to fix  bounding box  triggering re-renders on the control panel inside the canvas itself. But the options panel should be a good to go with this change.

Inpainting Controls Code Spitting and Performance

Codesplit the entirety of the inpainting controls. Created new selectors for each and every component to ensure there are no unnecessary re-renders. App feels a lot smoother.

Fixes rerenders on ClearBrushHistory

Fixes crash when requesting post-generation upscale/face restoration

- Moves the inpainting paste to before the postprocessing.

Removes unused isReady state

Changes Report Bug icon to a bug

Restores shift+q bounding box shortcut

Adds alert for bounding box size to status icons

Adds asCheckbox to IAIIconButton

Rough draft of this. Not happy with the styling but it's clearer than having them look just like buttons.

Fixes crash related to old value of progress_latents in state

Styling changes and settings modal minor refactor

Fixes: uploaded JPG images not loading

Reworks CurrentImageButtons.tsx

- Change all icons to FA iconset for consistency
- Refactors IAIIconButton, IAIButton, IAIPopover to handle ref forwarding
- Redesigns buttons into group

Only generate 1 iteration when seed fixed & variations disabled

Fixes progress images select

Fixes edge case: upload over gets stuck while alt tabbing

- Press esc to close it now

Fixes display progress images select typing

Fixes current image button rerenders

Adds min width to ImageUploader

Makes fast-latents in progress default

Update Icon Button Checkbox Style Styling

Fixes next/prev image buttons

Refactor canvas buttons + more

Add Save Intermediates Step Count

For accurate mode only.

Co-Authored-By: Richard Macarthy <richardmacarthy@protonmail.com>

Restores "initial image" text

Address feedback

- moves mask clear button
- fixes intermediates
- shrinks inpainting icons by 10%

Fix Loopback Styling

Adds escape hotkey to close floating panels

Readd Hotkey for Dual Display

Updated Current Image Button Styling
2022-11-02 16:46:18 -04:00
..
dist Final WebUI build for Release 2.1 2022-11-02 16:46:18 -04:00
src Final WebUI build for Release 2.1 2022-11-02 16:46:18 -04:00
.eslintrc.cjs React web UI with flask-socketio API (#429) 2022-09-16 13:18:15 -04:00
.gitignore Fix WebUI Not Working 2022-10-07 08:09:55 +13:00
favicon.ico Add New WebUI and Desktop Mode 2022-10-03 23:28:53 -04:00
index.d.ts React web UI with flask-socketio API (#429) 2022-09-16 13:18:15 -04:00
index.html Add New WebUI and Desktop Mode 2022-10-03 23:28:53 -04:00
package-lock.json update frontend 2022-11-01 17:39:08 -04:00
package.json Merges development 2022-10-29 04:25:26 +11:00
README.md Updates frontend README 2022-10-04 20:55:34 -04:00
tsconfig.json React web UI with flask-socketio API (#429) 2022-09-16 13:18:15 -04:00
tsconfig.node.json React web UI with flask-socketio API (#429) 2022-09-16 13:18:15 -04:00
vite.config.ts Changes vite dist asset paths to relative 2022-10-20 20:17:34 +08:00
yarn.lock Final WebUI build for Release 2.1 2022-11-02 16:46:18 -04:00

Stable Diffusion Web UI

Run

Evironment

Install node (includes npm) and optionally yarn.

From frontend/ run npm install / yarn install to install the frontend packages.

Dev

  1. From frontend/, run npm dev / yarn dev to start the dev server.
  2. Run python scripts/dream.py --web.
  3. Navigate to the dev server address e.g. http://localhost:5173/.

To build for dev: npm build-dev / yarn build-dev

To build for production: npm build / yarn build

TODO

  • Search repo for "TODO"