Mirrored_Repos/InvokeAI
1
0
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI synced 2024-08-30 20:32:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(ui): use pubsub for isTransforming on manager

Browse Source
This commit is contained in:
psychedelicious 2024-08-05 17:56:45 +10:00
parent b530eb49d4
commit f7b2516109
3 changed files with 16 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
invokeai/frontend/web/src/features/controlLayers/components/TransformToolButton.tsx
View File

@ -19,10 +19,7 @@ export const TransformToolButton = memo(() => {
if (!canvasManager) { if (!canvasManager) {
return; return;
} }
canvasManager.onTransform = setIsTransforming; return canvasManager.isTransforming.subscribe(setIsTransforming);
return () => {
canvasManager.onTransform = null;
};
}, [canvasManager]); }, [canvasManager]);
const onTransform = useCallback(() => { const onTransform = useCallback(() => {

28
invokeai/frontend/web/src/features/controlLayers/konva/CanvasManager.ts
View File

@ -124,7 +124,7 @@ export class CanvasManager {
_isDebugging: boolean; _isDebugging: boolean;
onTransform: ((isTransforming: boolean) => void) | null; isTransforming: PubSub<boolean>;
_store: Store<RootState>; _store: Store<RootState>;
_isFirstRender: boolean; _isFirstRender: boolean;
@ -212,16 +212,16 @@ export class CanvasManager {
this._worker.onmessageerror = () => { this._worker.onmessageerror = () => {
this.log.error('Worker message error'); this.log.error('Worker message error');
}; };
this.onTransform = null;
this._isDebugging = false; this._isDebugging = false;
this.toolState = new PubSub<CanvasV2State['tool']>(this.stateApi.getToolState()); this.isTransforming = new PubSub(false);
this.currentFill = new PubSub<RgbaColor>(this.getCurrentFill()); this.toolState = new PubSub(this.stateApi.getToolState());
this.selectedEntityIdentifier = new PubSub<CanvasEntityIdentifier | null>( this.currentFill = new PubSub(this.getCurrentFill());
this.selectedEntityIdentifier = new PubSub(
this.stateApi.getState().selectedEntityIdentifier, this.stateApi.getState().selectedEntityIdentifier,
(a, b) => a?.id === b?.id (a, b) => a?.id === b?.id
); );
this.selectedEntity = new PubSub<EntityStateAndAdapter | null>( this.selectedEntity = new PubSub(
this.getSelectedEntity(), this.getSelectedEntity(),
(a, b) => a?.state === b?.state && a?.adapter === b?.adapter (a, b) => a?.state === b?.state && a?.adapter === b?.adapter
); );
@ -399,7 +399,7 @@ export class CanvasManager {
// TODO(psyche): Support other entity types // TODO(psyche): Support other entity types
assert(layer?.adapter instanceof CanvasLayer, 'No selected layer'); assert(layer?.adapter instanceof CanvasLayer, 'No selected layer');
layer.adapter.transformer.startTransform(); layer.adapter.transformer.startTransform();
this.onTransform?.(true); this.isTransforming.publish(true);
} }
async applyTransform() { async applyTransform() {
@ -407,7 +407,7 @@ export class CanvasManager {
if (layer) { if (layer) {
await layer.transformer.applyTransform(); await layer.transformer.applyTransform();
} }
this.onTransform?.(false); this.isTransforming.publish(false);
} }
cancelTransform() { cancelTransform() {
@ -415,7 +415,7 @@ export class CanvasManager {
if (layer) { if (layer) {
layer.transformer.stopTransform(); layer.transformer.stopTransform();
} }
this.onTransform?.(false); this.isTransforming.publish(false);
} }
render = async () => { render = async () => {
@ -451,11 +451,6 @@ export class CanvasManager {
} }
} }
this.toolState.publish(state.tool);
this.selectedEntityIdentifier.publish(state.selectedEntityIdentifier);
this.selectedEntity.publish(this.getSelectedEntity());
this.currentFill.publish(this.getCurrentFill());
if ( if (
this._isFirstRender || this._isFirstRender ||
state.initialImage !== this._prevState.initialImage || state.initialImage !== this._prevState.initialImage ||
@ -499,6 +494,11 @@ export class CanvasManager {
await this.renderControlAdapters(); await this.renderControlAdapters();
} }
this.toolState.publish(state.tool);
this.selectedEntityIdentifier.publish(state.selectedEntityIdentifier);
this.selectedEntity.publish(this.getSelectedEntity());
this.currentFill.publish(this.getCurrentFill());
if ( if (
this._isFirstRender || this._isFirstRender ||
state.bbox !== this._prevState.bbox || state.bbox !== this._prevState.bbox ||

2
invokeai/frontend/web/src/features/controlLayers/konva/CanvasTool.ts
View File

@ -161,7 +161,7 @@ export class CanvasTool {
} else if (!isDrawableEntity) { } else if (!isDrawableEntity) {
// Non-drawable layers don't have tools // Non-drawable layers don't have tools
stage.container().style.cursor = 'not-allowed'; stage.container().style.cursor = 'not-allowed';
} else if (tool === 'move' || toolState.isTransforming) { } else if (tool === 'move' || this.manager.isTransforming.getValue()) {
// Move tool gets a pointer // Move tool gets a pointer
stage.container().style.cursor = 'default'; stage.container().style.cursor = 'default';
} else if (tool === 'rect') { } else if (tool === 'rect') {