github/InvokeAI
1
1
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI.git synced 2026-02-10 20:25:12 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): cursor sometimes hidden during staging

Browse Source 
Need a to track a few more things to ensure we update the cursor correctly in all situations.
This commit is contained in:
psychedelicious
2024-09-14 11:32:29 +10:00
parent b1cf0306bf
commit ae7440b721
3 changed files with 24 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -73,7 +73,7 @@ export class CanvasManager extends CanvasModuleBase {
_isDebugging: boolean = false;
/**
* Whether the canvas is currently busy with a transformation or filtering operation.
* Whether the canvas is currently busy with a transformation, filter, rasterization, staging or compositing operation.
*/
$isBusy: Atom<boolean>;
@@ -104,25 +104,7 @@ export class CanvasManager extends CanvasModuleBase {
this.entityRenderer = new CanvasEntityRendererModule(this);
this.compositor = new CanvasCompositorModule(this);
this.background = new CanvasBackgroundModule(this);
this.stage.addLayer(this.background.konva.layer);
this.konva = {
previewLayer: new Konva.Layer({ listening: false, imageSmoothingEnabled: false }),
};
this.stage.addLayer(this.konva.previewLayer);
this.tool = new CanvasToolModule(this);
this.stagingArea = new CanvasStagingAreaModule(this);
this.progressImage = new CanvasProgressImageModule(this);
this.bbox = new CanvasBboxModule(this);
// Must add in this order for correct z-index
this.konva.previewLayer.add(this.stagingArea.konva.group);
this.konva.previewLayer.add(this.progressImage.konva.group);
this.konva.previewLayer.add(this.bbox.konva.group);
this.konva.previewLayer.add(this.tool.konva.group);
this.$isBusy = computed(
[
@@ -136,6 +118,24 @@ export class CanvasManager extends CanvasModuleBase {
return isFiltering || isTransforming || isRasterizing || isStaging || isCompositing;
}
);
this.background = new CanvasBackgroundModule(this);
this.stage.addLayer(this.background.konva.layer);
this.konva = {
previewLayer: new Konva.Layer({ listening: false, imageSmoothingEnabled: false }),
};
this.stage.addLayer(this.konva.previewLayer);
this.tool = new CanvasToolModule(this);
this.progressImage = new CanvasProgressImageModule(this);
this.bbox = new CanvasBboxModule(this);
// Must add in this order for correct z-index
this.konva.previewLayer.add(this.stagingArea.konva.group);
this.konva.previewLayer.add(this.progressImage.konva.group);
this.konva.previewLayer.add(this.bbox.konva.group);
this.konva.previewLayer.add(this.tool.konva.group);
}
getAdapter = <T extends CanvasEntityType = CanvasEntityType>(

3
invokeai/frontend/web/src/features/controlLayers/konva/CanvasStageModule.ts
View File

@@ -366,6 +366,9 @@ export class CanvasStageModule extends CanvasModuleBase {
};
setCursor = (cursor: Property.Cursor) => {
if (this.container.style.cursor === cursor) {
return;
}
this.container.style.cursor = cursor;
};

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

@@ -106,10 +106,9 @@ export class CanvasToolModule extends CanvasModuleBase {
this.konva.group.add(this.colorPickerToolPreview.konva.group);
this.subscriptions.add(this.manager.stage.$stageAttrs.listen(this.render));
this.subscriptions.add(this.manager.stateApi.$isTransforming.listen(this.render));
this.subscriptions.add(this.manager.stateApi.$isFiltering.listen(this.render));
this.subscriptions.add(this.manager.$isBusy.listen(this.render));
this.subscriptions.add(this.manager.stateApi.createStoreSubscription(selectCanvasSettingsSlice, this.render));
this.subscriptions.add(this.manager.stateApi.createStoreSubscription(selectCanvasSlice, this.syncCursorStyle));
this.subscriptions.add(this.manager.stateApi.createStoreSubscription(selectCanvasSlice, this.render));
this.subscriptions.add(
this.$tool.listen(() => {
// On tool switch, reset mouse state