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

tidy(ui): remove unused naming objects/utils

Browse Source 
The canvas manager means we don't need to worry about konva node names as we never directly select konva nodes.
This commit is contained in:
psychedelicious 2024-07-08 17:17:38 +10:00
parent e4376e21dd
commit bdc428cdd8
6 changed files with 17 additions and 116 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
invokeai/frontend/web/src/features/controlLayers/konva/CanvasBbox.ts
View File

@ -1,10 +1,5 @@
import { roundToMultiple, roundToMultipleMin } from 'common/util/roundDownToMultiple';
import type { CanvasManager } from 'features/controlLayers/konva/CanvasManager';
import {
PREVIEW_GENERATION_BBOX_DUMMY_RECT,
PREVIEW_GENERATION_BBOX_GROUP,
PREVIEW_GENERATION_BBOX_TRANSFORMER,
} from 'features/controlLayers/konva/naming';
import Konva from 'konva';
import type { IRect } from 'konva/lib/types';
import { atom } from 'nanostores';
@ -38,9 +33,8 @@ export class CanvasBbox {
// Use a transformer for the generation bbox. Transformers need some shape to transform, we will use a fully
// transparent rect for this purpose.
this.group = new Konva.Group({ id: PREVIEW_GENERATION_BBOX_GROUP, listening: false });
this.group = new Konva.Group({ id: 'bbox_group', listening: false });
this.rect = new Konva.Rect({
id: PREVIEW_GENERATION_BBOX_DUMMY_RECT,
listening: false,
strokeEnabled: false,
draggable: true,
@ -61,7 +55,6 @@ export class CanvasBbox {
});
this.transformer = new Konva.Transformer({
id: PREVIEW_GENERATION_BBOX_TRANSFORMER,
borderDash: [5, 5],
borderStroke: 'rgba(212,216,234,1)',
borderEnabled: true,

6
invokeai/frontend/web/src/features/controlLayers/konva/CanvasInpaintMask.ts
View File

@ -4,7 +4,7 @@ import { CanvasEraserLine } from 'features/controlLayers/konva/CanvasEraserLine'
import type { CanvasManager } from 'features/controlLayers/konva/CanvasManager';
import { CanvasRect } from 'features/controlLayers/konva/CanvasRect';
import { getNodeBboxFast } from 'features/controlLayers/konva/entityBbox';
import { getObjectGroupId, INPAINT_MASK_LAYER_ID } from 'features/controlLayers/konva/naming';
import { getObjectGroupId } from 'features/controlLayers/konva/naming';
import { mapId } from 'features/controlLayers/konva/util';
import type { BrushLine, EraserLine, InpaintMaskEntity, RectShape } from 'features/controlLayers/store/types';
import { isDrawingTool, RGBA_RED } from 'features/controlLayers/store/types';
@ -25,9 +25,9 @@ export class CanvasInpaintMask {
private inpaintMaskState: InpaintMaskEntity;
constructor(entity: InpaintMaskEntity, manager: CanvasManager) {
this.id = INPAINT_MASK_LAYER_ID;
this.id = 'inpaint_mask';
this.manager = manager;
this.layer = new Konva.Layer({ id: INPAINT_MASK_LAYER_ID });
this.layer = new Konva.Layer({ id: this.id });
this.group = new Konva.Group({
id: getObjectGroupId(this.layer.id(), uuidv4()),

19
invokeai/frontend/web/src/features/controlLayers/konva/entityBbox.ts
View File

@ -1,11 +1,5 @@
import openBase64ImageInTab from 'common/util/openBase64ImageInTab';
import {
CA_LAYER_IMAGE_NAME,
getLayerBboxId,
LAYER_BBOX_NAME,
RASTER_LAYER_OBJECT_GROUP_NAME,
RG_LAYER_OBJECT_GROUP_NAME,
} from 'features/controlLayers/konva/naming';
import { getLayerBboxId } from 'features/controlLayers/konva/naming';
import { imageDataToDataURL } from 'features/controlLayers/konva/util';
import type {
BboxChangedArg,
@ -26,7 +20,7 @@ import { assert } from 'tsafe';
export const createBboxRect = (entity: CanvasEntity, konvaLayer: Konva.Layer): Konva.Rect => {
const rect = new Konva.Rect({
id: getLayerBboxId(entity.id),
name: LAYER_BBOX_NAME,
name: 'bbox',
strokeWidth: 1,
visible: false,
});
@ -191,9 +185,10 @@ export const getNodeBboxFast = (node: Konva.Node): IRect => {
return bbox;
};
const filterRGChildren = (node: Konva.Node): boolean => node.name() === RG_LAYER_OBJECT_GROUP_NAME;
const filterLayerChildren = (node: Konva.Node): boolean => node.name() === RASTER_LAYER_OBJECT_GROUP_NAME;
const filterCAChildren = (node: Konva.Node): boolean => node.name() === CA_LAYER_IMAGE_NAME;
// TODO(psyche): fix this
const filterRGChildren = (node: Konva.Node): boolean => true;
const filterLayerChildren = (node: Konva.Node): boolean => true;
const filterCAChildren = (node: Konva.Node): boolean => true;
/**
* Calculates the bbox of each regional guidance layer. Only calculates if the mask has changed.
@ -213,7 +208,7 @@ export const updateBboxes = (
assert(konvaLayer, `Layer ${entityState.id} not found in stage`);
// We only need to recalculate the bbox if the layer has changed
if (entityState.bboxNeedsUpdate) {
const bboxRect = konvaLayer.findOne<Konva.Rect>(`.${LAYER_BBOX_NAME}`) ?? createBboxRect(entityState, konvaLayer);
const bboxRect = konvaLayer.findOne<Konva.Rect>('.bbox') ?? createBboxRect(entityState, konvaLayer);
// Hide the bbox while we calculate the new bbox, else the bbox will be included in the calculation
const visible = bboxRect.visible();

51
invokeai/frontend/web/src/features/controlLayers/konva/naming.ts
View File

@ -2,59 +2,14 @@
* This file contains IDs, names, and ID getters for konva layers and objects.
*/
// IDs for singleton Konva layers and objects
export const PREVIEW_LAYER_ID = 'preview_layer';
export const PREVIEW_TOOL_GROUP_ID = `${PREVIEW_LAYER_ID}.tool_group`;
export const PREVIEW_BRUSH_GROUP_ID = `${PREVIEW_LAYER_ID}.brush_group`;
export const PREVIEW_BRUSH_FILL_ID = `${PREVIEW_LAYER_ID}.brush_fill`;
export const PREVIEW_BRUSH_BORDER_INNER_ID = `${PREVIEW_LAYER_ID}.brush_border_inner`;
export const PREVIEW_BRUSH_BORDER_OUTER_ID = `${PREVIEW_LAYER_ID}.brush_border_outer`;
export const PREVIEW_RECT_ID = `${PREVIEW_LAYER_ID}.rect`;
export const PREVIEW_GENERATION_BBOX_GROUP = `${PREVIEW_LAYER_ID}.gen_bbox_group`;
export const PREVIEW_GENERATION_BBOX_TRANSFORMER = `${PREVIEW_LAYER_ID}.gen_bbox_transformer`;
export const PREVIEW_GENERATION_BBOX_DUMMY_RECT = `${PREVIEW_LAYER_ID}.gen_bbox_dummy_rect`;
export const PREVIEW_DOCUMENT_SIZE_GROUP = `${PREVIEW_LAYER_ID}.doc_size_group`;
export const PREVIEW_DOCUMENT_SIZE_STAGE_RECT = `${PREVIEW_LAYER_ID}.doc_size_stage_rect`;
export const PREVIEW_DOCUMENT_SIZE_DOCUMENT_RECT = `${PREVIEW_LAYER_ID}.doc_size_doc_rect`;
// Names for Konva layers and objects (comparable to CSS classes)
export const LAYER_BBOX_NAME = 'layer_bbox';
export const COMPOSITING_RECT_NAME = 'compositing_rect';
export const IMAGE_PLACEHOLDER_NAME = 'image_placeholder';
export const CA_LAYER_NAME = 'control_adapter';
export const CA_LAYER_OBJECT_GROUP_NAME = `${CA_LAYER_NAME}.object_group`;
export const CA_LAYER_IMAGE_NAME = `${CA_LAYER_NAME}.image`;
export const RG_LAYER_NAME = 'regional_guidance_layer';
export const RG_LAYER_OBJECT_GROUP_NAME = `${RG_LAYER_NAME}.object_group`;
export const RG_LAYER_BRUSH_LINE_NAME = `${RG_LAYER_NAME}.brush_line`;
export const RG_LAYER_ERASER_LINE_NAME = `${RG_LAYER_NAME}.eraser_line`;
export const RG_LAYER_RECT_SHAPE_NAME = `${RG_LAYER_NAME}.rect_shape`;
export const RASTER_LAYER_NAME = 'raster_layer';
export const RASTER_LAYER_OBJECT_GROUP_NAME = `${RASTER_LAYER_NAME}.object_group`;
export const RASTER_LAYER_BRUSH_LINE_NAME = `${RASTER_LAYER_NAME}.brush_line`;
export const RASTER_LAYER_ERASER_LINE_NAME = `${RASTER_LAYER_NAME}.eraser_line`;
export const RASTER_LAYER_RECT_SHAPE_NAME = `${RASTER_LAYER_NAME}.rect_shape`;
export const RASTER_LAYER_IMAGE_NAME = `${RASTER_LAYER_NAME}.image`;
export const INPAINT_MASK_LAYER_ID = 'inpaint_mask_layer';
export const INPAINT_MASK_LAYER_OBJECT_GROUP_NAME = `${INPAINT_MASK_LAYER_ID}.object_group`;
export const INPAINT_MASK_LAYER_BRUSH_LINE_NAME = `${INPAINT_MASK_LAYER_ID}.brush_line`;
export const INPAINT_MASK_LAYER_ERASER_LINE_NAME = `${INPAINT_MASK_LAYER_ID}.eraser_line`;
export const INPAINT_MASK_LAYER_RECT_SHAPE_NAME = `${INPAINT_MASK_LAYER_ID}.rect_shape`;
export const BACKGROUND_LAYER_ID = 'background_layer';
// Getters for non-singleton layer and object IDs
export const getRGId = (entityId: string) => `${RG_LAYER_NAME}_${entityId}`;
export const getLayerId = (entityId: string) => `${RASTER_LAYER_NAME}_${entityId}`;
export const getRGId = (entityId: string) => `region_${entityId}`;
export const getLayerId = (entityId: string) => `layer_${entityId}`;
export const getBrushLineId = (entityId: string, lineId: string) => `${entityId}.brush_line_${lineId}`;
export const getEraserLineId = (entityId: string, lineId: string) => `${entityId}.eraser_line_${lineId}`;
export const getRectShapeId = (entityId: string, rectId: string) => `${entityId}.rect_${rectId}`;
export const getImageObjectId = (entityId: string, imageId: string) => `${entityId}.image_${imageId}`;
export const getObjectGroupId = (entityId: string, groupId: string) => `${entityId}.objectGroup_${groupId}`;
export const getLayerBboxId = (entityId: string) => `${entityId}.bbox`;
export const getCAId = (entityId: string) => `${CA_LAYER_NAME}_${entityId}`;
export const getCAId = (entityId: string) => `control_adapter_${entityId}`;
export const getIPAId = (entityId: string) => `ip_adapter_${entityId}`;

42
invokeai/frontend/web/src/features/controlLayers/konva/util.ts
View File

@ -1,18 +1,5 @@
import { getImageDataTransparency } from 'common/util/arrayBuffer';
import type { CanvasManager } from 'features/controlLayers/konva/CanvasManager';
import {
CA_LAYER_NAME,
INPAINT_MASK_LAYER_ID,
RASTER_LAYER_BRUSH_LINE_NAME,
RASTER_LAYER_ERASER_LINE_NAME,
RASTER_LAYER_IMAGE_NAME,
RASTER_LAYER_NAME,
RASTER_LAYER_RECT_SHAPE_NAME,
RG_LAYER_BRUSH_LINE_NAME,
RG_LAYER_ERASER_LINE_NAME,
RG_LAYER_NAME,
RG_LAYER_RECT_SHAPE_NAME,
} from 'features/controlLayers/konva/naming';
import type { GenerationMode, Rect, RgbaColor } from 'features/controlLayers/store/types';
import { isValidLayer } from 'features/nodes/util/graph/generation/addLayers';
import Konva from 'konva';
@ -120,35 +107,6 @@ export const getIsFocused = (stage: Konva.Stage): boolean => stage.container().c
*/
export const mapId = (object: { id: string }): string => object.id;
/**
* Konva selection callback to select all renderable layers. This includes RG, CA II and Raster layers.
* This can be provided to the `find` or `findOne` konva node methods.
*/
export const selectRenderableLayers = (node: Konva.Node): boolean =>
node.name() === RG_LAYER_NAME ||
node.name() === CA_LAYER_NAME ||
node.name() === RASTER_LAYER_NAME ||
node.name() === INPAINT_MASK_LAYER_ID;
/**
* Konva selection callback to select RG mask objects. This includes lines and rects.
* This can be provided to the `find` or `findOne` konva node methods.
*/
export const selectVectorMaskObjects = (node: Konva.Node): boolean =>
node.name() === RG_LAYER_BRUSH_LINE_NAME ||
node.name() === RG_LAYER_ERASER_LINE_NAME ||
node.name() === RG_LAYER_RECT_SHAPE_NAME;
/**
* Konva selection callback to select raster layer objects. This includes lines and rects.
* This can be provided to the `find` or `findOne` konva node methods.
*/
export const selectRasterObjects = (node: Konva.Node): boolean =>
node.name() === RASTER_LAYER_BRUSH_LINE_NAME ||
node.name() === RASTER_LAYER_ERASER_LINE_NAME ||
node.name() === RASTER_LAYER_RECT_SHAPE_NAME ||
node.name() === RASTER_LAYER_IMAGE_NAME;
/**
* Convert a Blob to a data URL.
*/

6
invokeai/frontend/web/src/features/controlLayers/store/canvasV2Slice.ts
View File

@ -3,7 +3,6 @@ import { createSlice } from '@reduxjs/toolkit';
import type { PersistConfig, RootState } from 'app/store/store';
import { deepClone } from 'common/util/deepClone';
import { roundDownToMultiple } from 'common/util/roundDownToMultiple';
import { INPAINT_MASK_LAYER_ID } from 'features/controlLayers/konva/naming';
import { bboxReducers } from 'features/controlLayers/store/bboxReducers';
import { compositingReducers } from 'features/controlLayers/store/compositingReducers';
import { controlAdaptersReducers } from 'features/controlLayers/store/controlAdaptersReducers';
@ -26,14 +25,14 @@ import { RGBA_RED } from './types';
const initialState: CanvasV2State = {
_version: 3,
selectedEntityIdentifier: { type: 'inpaint_mask', id: INPAINT_MASK_LAYER_ID },
selectedEntityIdentifier: { type: 'inpaint_mask', id: 'inpaint_mask' },
layers: { entities: [], imageCache: null },
controlAdapters: { entities: [] },
ipAdapters: { entities: [] },
regions: { entities: [] },
loras: [],
inpaintMask: {
id: INPAINT_MASK_LAYER_ID,
id: 'inpaint_mask',
type: 'inpaint_mask',
bbox: null,
bboxNeedsUpdate: false,
@ -187,6 +186,7 @@ export const canvasV2Slice = createSlice({
state.selectedEntityIdentifier = deepClone(initialState.selectedEntityIdentifier);
state.session = deepClone(initialState.session);
state.tool = deepClone(initialState.tool);
state.inpaintMask = deepClone(initialState.inpaintMask);
},
},
});