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): organise files and classes

Browse Source
This commit is contained in:
psychedelicious 2024-08-22 15:06:39 +10:00
parent f442d206be
commit b02948d49a
10 changed files with 56 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
invokeai/frontend/web/src/features/controlLayers/konva/CanvasBackground.ts → invokeai/frontend/web/src/features/controlLayers/konva/CanvasBackgroundModule.ts
View File

@ -3,7 +3,7 @@ import type { CanvasManager } from 'features/controlLayers/konva/CanvasManager';
import { getPrefixedId } from 'features/controlLayers/konva/util'; import { getPrefixedId } from 'features/controlLayers/konva/util';
import Konva from 'konva'; import Konva from 'konva';
export class CanvasBackground { export class CanvasBackgroundModule {
readonly type = 'background_grid'; readonly type = 'background_grid';
static GRID_LINE_COLOR_COARSE = getArbitraryBaseColor(27); static GRID_LINE_COLOR_COARSE = getArbitraryBaseColor(27);
@ -44,12 +44,10 @@ export class CanvasBackground {
this.konva.layer.visible(true); this.konva.layer.visible(true);
this.konva.layer.zIndex(0); this.konva.layer.zIndex(0);
const scale = this.manager.stage.scaleX(); const scale = this.manager.stage.getScale();
const gridSpacing = CanvasBackground.getGridSpacing(scale); const { x, y } = this.manager.stage.getPosition();
const x = this.manager.stage.x(); const { width, height } = this.manager.stage.getSize();
const y = this.manager.stage.y(); const gridSpacing = this.getGridSpacing(scale);
const width = this.manager.stage.width();
const height = this.manager.stage.height();
const stageRect = { const stageRect = {
x1: 0, x1: 0,
y1: 0, y1: 0,
@ -96,7 +94,7 @@ export class CanvasBackground {
x: _x, x: _x,
y: gridFullRect.y1, y: gridFullRect.y1,
points: [0, 0, 0, ySize], points: [0, 0, 0, ySize],
stroke: _x % 64 ? CanvasBackground.GRID_LINE_COLOR_FINE : CanvasBackground.GRID_LINE_COLOR_COARSE, stroke: _x % 64 ? CanvasBackgroundModule.GRID_LINE_COLOR_FINE : CanvasBackgroundModule.GRID_LINE_COLOR_COARSE,
strokeWidth, strokeWidth,
listening: false, listening: false,
}) })
@ -109,7 +107,7 @@ export class CanvasBackground {
x: gridFullRect.x1, x: gridFullRect.x1,
y: _y, y: _y,
points: [0, 0, xSize, 0], points: [0, 0, xSize, 0],
stroke: _y % 64 ? CanvasBackground.GRID_LINE_COLOR_FINE : CanvasBackground.GRID_LINE_COLOR_COARSE, stroke: _y % 64 ? CanvasBackgroundModule.GRID_LINE_COLOR_FINE : CanvasBackgroundModule.GRID_LINE_COLOR_COARSE,
strokeWidth, strokeWidth,
listening: false, listening: false,
}) })
@ -129,7 +127,7 @@ export class CanvasBackground {
* @param scale The stage scale * @param scale The stage scale
* @returns The grid spacing based on the stage scale * @returns The grid spacing based on the stage scale
*/ */
static getGridSpacing = (scale: number): number => { getGridSpacing = (scale: number): number => {
if (scale >= 2) { if (scale >= 2) {
return 8; return 8;
} }

8
invokeai/frontend/web/src/features/controlLayers/konva/CanvasBbox.ts → invokeai/frontend/web/src/features/controlLayers/konva/CanvasBboxModule.ts
View File

@ -1,7 +1,7 @@
import type { JSONObject } from 'common/types'; import type { JSONObject } from 'common/types';
import { roundToMultiple, roundToMultipleMin } from 'common/util/roundDownToMultiple'; import { roundToMultiple, roundToMultipleMin } from 'common/util/roundDownToMultiple';
import type { CanvasManager } from 'features/controlLayers/konva/CanvasManager'; import type { CanvasManager } from 'features/controlLayers/konva/CanvasManager';
import type { CanvasPreview } from 'features/controlLayers/konva/CanvasPreview'; import type { CanvasPreviewModule } from 'features/controlLayers/konva/CanvasPreviewModule';
import { getPrefixedId } from 'features/controlLayers/konva/util'; import { getPrefixedId } from 'features/controlLayers/konva/util';
import type { Rect } from 'features/controlLayers/store/types'; import type { Rect } from 'features/controlLayers/store/types';
import Konva from 'konva'; import Konva from 'konva';
@ -22,12 +22,12 @@ const ALL_ANCHORS: string[] = [
const CORNER_ANCHORS: string[] = ['top-left', 'top-right', 'bottom-left', 'bottom-right']; const CORNER_ANCHORS: string[] = ['top-left', 'top-right', 'bottom-left', 'bottom-right'];
const NO_ANCHORS: string[] = []; const NO_ANCHORS: string[] = [];
export class CanvasBbox { export class CanvasBboxModule {
readonly type = 'generation_bbox'; readonly type = 'generation_bbox';
id: string; id: string;
path: string[]; path: string[];
parent: CanvasPreview; parent: CanvasPreviewModule;
manager: CanvasManager; manager: CanvasManager;
log: Logger; log: Logger;
@ -37,7 +37,7 @@ export class CanvasBbox {
transformer: Konva.Transformer; transformer: Konva.Transformer;
}; };
constructor(parent: CanvasPreview) { constructor(parent: CanvasPreviewModule) {
this.id = getPrefixedId(this.type); this.id = getPrefixedId(this.type);
this.parent = parent; this.parent = parent;
this.manager = this.parent.manager; this.manager = this.parent.manager;

2
invokeai/frontend/web/src/features/controlLayers/konva/CanvasFilter.ts → invokeai/frontend/web/src/features/controlLayers/konva/CanvasFilterModule.ts
View File

@ -13,7 +13,7 @@ import { assert } from 'tsafe';
const TYPE = 'entity_filter_preview'; const TYPE = 'entity_filter_preview';
export class CanvasFilter { export class CanvasFilterModule {
readonly type = TYPE; readonly type = TYPE;
id: string; id: string;

8
invokeai/frontend/web/src/features/controlLayers/konva/CanvasImage.ts
View File

@ -1,10 +1,10 @@
import { Mutex } from 'async-mutex'; import { Mutex } from 'async-mutex';
import type { JSONObject } from 'common/types'; import type { JSONObject } from 'common/types';
import { deepClone } from 'common/util/deepClone'; import { deepClone } from 'common/util/deepClone';
import type { CanvasFilter } from 'features/controlLayers/konva/CanvasFilter'; import type { CanvasFilterModule } from 'features/controlLayers/konva/CanvasFilterModule';
import type { CanvasManager } from 'features/controlLayers/konva/CanvasManager'; import type { CanvasManager } from 'features/controlLayers/konva/CanvasManager';
import type { CanvasObjectRenderer } from 'features/controlLayers/konva/CanvasObjectRenderer'; import type { CanvasObjectRenderer } from 'features/controlLayers/konva/CanvasObjectRenderer';
import type { CanvasStagingArea } from 'features/controlLayers/konva/CanvasStagingArea'; import type { CanvasStagingAreaModule } from 'features/controlLayers/konva/CanvasStagingAreaModule';
import { loadImage } from 'features/controlLayers/konva/util'; import { loadImage } from 'features/controlLayers/konva/util';
import type { CanvasImageState } from 'features/controlLayers/store/types'; import type { CanvasImageState } from 'features/controlLayers/store/types';
import { t } from 'i18next'; import { t } from 'i18next';
@ -17,7 +17,7 @@ export class CanvasImageRenderer {
id: string; id: string;
path: string[]; path: string[];
parent: CanvasObjectRenderer | CanvasStagingArea | CanvasFilter; parent: CanvasObjectRenderer | CanvasStagingAreaModule | CanvasFilterModule;
manager: CanvasManager; manager: CanvasManager;
log: Logger; log: Logger;
@ -32,7 +32,7 @@ export class CanvasImageRenderer {
isError: boolean = false; isError: boolean = false;
mutex = new Mutex(); mutex = new Mutex();
constructor(state: CanvasImageState, parent: CanvasObjectRenderer | CanvasStagingArea | CanvasFilter) { constructor(state: CanvasImageState, parent: CanvasObjectRenderer | CanvasStagingAreaModule | CanvasFilterModule) {
const { id, image } = state; const { id, image } = state;
const { width, height } = image; const { width, height } = image;
this.id = id; this.id = id;

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

@ -4,7 +4,7 @@ import type { AppStore } from 'app/store/store';
import type { SerializableObject } from 'common/types'; import type { SerializableObject } from 'common/types';
import { CanvasCacheModule } from 'features/controlLayers/konva/CanvasCacheModule'; import { CanvasCacheModule } from 'features/controlLayers/konva/CanvasCacheModule';
import { CanvasCompositorModule } from 'features/controlLayers/konva/CanvasCompositorModule'; import { CanvasCompositorModule } from 'features/controlLayers/konva/CanvasCompositorModule';
import { CanvasFilter } from 'features/controlLayers/konva/CanvasFilter'; import { CanvasFilterModule } from 'features/controlLayers/konva/CanvasFilterModule';
import { CanvasRenderingModule } from 'features/controlLayers/konva/CanvasRenderingModule'; import { CanvasRenderingModule } from 'features/controlLayers/konva/CanvasRenderingModule';
import { CanvasStageModule } from 'features/controlLayers/konva/CanvasStageModule'; import { CanvasStageModule } from 'features/controlLayers/konva/CanvasStageModule';
import { CanvasWorkerModule } from 'features/controlLayers/konva/CanvasWorkerModule.js'; import { CanvasWorkerModule } from 'features/controlLayers/konva/CanvasWorkerModule.js';
@ -13,11 +13,11 @@ import type Konva from 'konva';
import { atom } from 'nanostores'; import { atom } from 'nanostores';
import type { Logger } from 'roarr'; import type { Logger } from 'roarr';
import { CanvasBackground } from './CanvasBackground'; import { CanvasBackgroundModule } from './CanvasBackgroundModule';
import type { CanvasLayerAdapter } from './CanvasLayerAdapter'; import type { CanvasLayerAdapter } from './CanvasLayerAdapter';
import type { CanvasMaskAdapter } from './CanvasMaskAdapter'; import type { CanvasMaskAdapter } from './CanvasMaskAdapter';
import { CanvasPreview } from './CanvasPreview'; import { CanvasPreviewModule } from './CanvasPreviewModule';
import { CanvasStateApi } from './CanvasStateApi'; import { CanvasStateApiModule } from './CanvasStateApiModule';
import { setStageEventHandlers } from './events'; import { setStageEventHandlers } from './events';
export const $canvasManager = atom<CanvasManager | null>(null); export const $canvasManager = atom<CanvasManager | null>(null);
@ -37,10 +37,10 @@ export class CanvasManager {
regionalGuidanceAdapters: Map<string, CanvasMaskAdapter> = new Map(); regionalGuidanceAdapters: Map<string, CanvasMaskAdapter> = new Map();
inpaintMaskAdapters: Map<string, CanvasMaskAdapter> = new Map(); inpaintMaskAdapters: Map<string, CanvasMaskAdapter> = new Map();
stateApi: CanvasStateApi; stateApi: CanvasStateApiModule;
preview: CanvasPreview; preview: CanvasPreviewModule;
background: CanvasBackground; background: CanvasBackgroundModule;
filter: CanvasFilter; filter: CanvasFilterModule;
stage: CanvasStageModule; stage: CanvasStageModule;
worker: CanvasWorkerModule; worker: CanvasWorkerModule;
cache: CanvasCacheModule; cache: CanvasCacheModule;
@ -54,20 +54,20 @@ export class CanvasManager {
this.path = [this.id]; this.path = [this.id];
this.store = store; this.store = store;
this.socket = socket; this.socket = socket;
this.stateApi = new CanvasStateApi(this.store, this);
this.stateApi = new CanvasStateApiModule(this.store, this);
this.stage = new CanvasStageModule(stage, container, this); this.stage = new CanvasStageModule(stage, container, this);
this.worker = new CanvasWorkerModule(this); this.worker = new CanvasWorkerModule(this);
this.cache = new CanvasCacheModule(this); this.cache = new CanvasCacheModule(this);
this.renderer = new CanvasRenderingModule(this); this.renderer = new CanvasRenderingModule(this);
this.preview = new CanvasPreview(this); this.preview = new CanvasPreviewModule(this);
this.filter = new CanvasFilterModule(this);
this.compositor = new CanvasCompositorModule(this); this.compositor = new CanvasCompositorModule(this);
this.stage.addLayer(this.preview.getLayer()); this.stage.addLayer(this.preview.getLayer());
this.background = new CanvasBackground(this); this.background = new CanvasBackgroundModule(this);
this.stage.addLayer(this.background.konva.layer); this.stage.addLayer(this.background.konva.layer);
this.filter = new CanvasFilter(this);
} }
log = logger('canvas').child((message) => { log = logger('canvas').child((message) => {

26
invokeai/frontend/web/src/features/controlLayers/konva/CanvasPreview.ts → invokeai/frontend/web/src/features/controlLayers/konva/CanvasPreviewModule.ts
View File

@ -1,22 +1,22 @@
import type { CanvasManager } from 'features/controlLayers/konva/CanvasManager'; import type { CanvasManager } from 'features/controlLayers/konva/CanvasManager';
import { CanvasProgressImage } from 'features/controlLayers/konva/CanvasProgressImage'; import { CanvasProgressImageModule } from 'features/controlLayers/konva/CanvasProgressImageModule';
import Konva from 'konva'; import Konva from 'konva';
import { CanvasBbox } from './CanvasBbox'; import { CanvasBboxModule } from './CanvasBboxModule';
import { CanvasStagingArea } from './CanvasStagingArea'; import { CanvasStagingAreaModule } from './CanvasStagingAreaModule';
import { CanvasTool } from './CanvasTool'; import { CanvasToolModule } from './CanvasToolModule';
export class CanvasPreview { export class CanvasPreviewModule {
manager: CanvasManager; manager: CanvasManager;
konva: { konva: {
layer: Konva.Layer; layer: Konva.Layer;
}; };
tool: CanvasTool; tool: CanvasToolModule;
bbox: CanvasBbox; bbox: CanvasBboxModule;
stagingArea: CanvasStagingArea; stagingArea: CanvasStagingAreaModule;
progressImage: CanvasProgressImage; progressImage: CanvasProgressImageModule;
constructor(manager: CanvasManager) { constructor(manager: CanvasManager) {
this.manager = manager; this.manager = manager;
@ -24,16 +24,16 @@ export class CanvasPreview {
layer: new Konva.Layer({ listening: false, imageSmoothingEnabled: false }), layer: new Konva.Layer({ listening: false, imageSmoothingEnabled: false }),
}; };
this.stagingArea = new CanvasStagingArea(this); this.stagingArea = new CanvasStagingAreaModule(this);
this.konva.layer.add(...this.stagingArea.getNodes()); this.konva.layer.add(...this.stagingArea.getNodes());
this.progressImage = new CanvasProgressImage(this); this.progressImage = new CanvasProgressImageModule(this);
this.konva.layer.add(...this.progressImage.getNodes()); this.konva.layer.add(...this.progressImage.getNodes());
this.bbox = new CanvasBbox(this); this.bbox = new CanvasBboxModule(this);
this.konva.layer.add(this.bbox.konva.group); this.konva.layer.add(this.bbox.konva.group);
this.tool = new CanvasTool(this); this.tool = new CanvasToolModule(this);
this.konva.layer.add(this.tool.konva.group); this.konva.layer.add(this.tool.konva.group);
} }

8
invokeai/frontend/web/src/features/controlLayers/konva/CanvasProgressImage.ts → invokeai/frontend/web/src/features/controlLayers/konva/CanvasProgressImageModule.ts
View File

@ -1,18 +1,18 @@
import { Mutex } from 'async-mutex'; import { Mutex } from 'async-mutex';
import type { JSONObject } from 'common/types'; import type { JSONObject } from 'common/types';
import type { CanvasManager } from 'features/controlLayers/konva/CanvasManager'; import type { CanvasManager } from 'features/controlLayers/konva/CanvasManager';
import type { CanvasPreview } from 'features/controlLayers/konva/CanvasPreview'; import type { CanvasPreviewModule } from 'features/controlLayers/konva/CanvasPreviewModule';
import { getPrefixedId, loadImage } from 'features/controlLayers/konva/util'; import { getPrefixedId, loadImage } from 'features/controlLayers/konva/util';
import Konva from 'konva'; import Konva from 'konva';
import type { Logger } from 'roarr'; import type { Logger } from 'roarr';
import type { InvocationDenoiseProgressEvent } from 'services/events/types'; import type { InvocationDenoiseProgressEvent } from 'services/events/types';
export class CanvasProgressImage { export class CanvasProgressImageModule {
readonly type = 'progress_image'; readonly type = 'progress_image';
id: string; id: string;
path: string[]; path: string[];
parent: CanvasPreview; parent: CanvasPreviewModule;
manager: CanvasManager; manager: CanvasManager;
log: Logger; log: Logger;
@ -34,7 +34,7 @@ export class CanvasProgressImage {
mutex: Mutex = new Mutex(); mutex: Mutex = new Mutex();
constructor(parent: CanvasPreview) { constructor(parent: CanvasPreviewModule) {
this.id = getPrefixedId(this.type); this.id = getPrefixedId(this.type);
this.parent = parent; this.parent = parent;
this.manager = parent.manager; this.manager = parent.manager;

8
invokeai/frontend/web/src/features/controlLayers/konva/CanvasStagingArea.ts → invokeai/frontend/web/src/features/controlLayers/konva/CanvasStagingAreaModule.ts
View File

@ -1,18 +1,18 @@
import type { JSONObject } from 'common/types'; import type { JSONObject } from 'common/types';
import { CanvasImageRenderer } from 'features/controlLayers/konva/CanvasImage'; import { CanvasImageRenderer } from 'features/controlLayers/konva/CanvasImage';
import type { CanvasManager } from 'features/controlLayers/konva/CanvasManager'; import type { CanvasManager } from 'features/controlLayers/konva/CanvasManager';
import type { CanvasPreview } from 'features/controlLayers/konva/CanvasPreview'; import type { CanvasPreviewModule } from 'features/controlLayers/konva/CanvasPreviewModule';
import { getPrefixedId } from 'features/controlLayers/konva/util'; import { getPrefixedId } from 'features/controlLayers/konva/util';
import { imageDTOToImageWithDims, type StagingAreaImage } from 'features/controlLayers/store/types'; import { imageDTOToImageWithDims, type StagingAreaImage } from 'features/controlLayers/store/types';
import Konva from 'konva'; import Konva from 'konva';
import type { Logger } from 'roarr'; import type { Logger } from 'roarr';
export class CanvasStagingArea { export class CanvasStagingAreaModule {
readonly type = 'staging_area'; readonly type = 'staging_area';
id: string; id: string;
path: string[]; path: string[];
parent: CanvasPreview; parent: CanvasPreviewModule;
manager: CanvasManager; manager: CanvasManager;
log: Logger; log: Logger;
@ -26,7 +26,7 @@ export class CanvasStagingArea {
*/ */
subscriptions: Set<() => void> = new Set(); subscriptions: Set<() => void> = new Set();
constructor(parent: CanvasPreview) { constructor(parent: CanvasPreviewModule) {
this.id = getPrefixedId(this.type); this.id = getPrefixedId(this.type);
this.parent = parent; this.parent = parent;
this.manager = this.parent.manager; this.manager = this.parent.manager;

2
invokeai/frontend/web/src/features/controlLayers/konva/CanvasStateApi.ts → invokeai/frontend/web/src/features/controlLayers/konva/CanvasStateApiModule.ts
View File

@ -77,7 +77,7 @@ type EntityStateAndAdapter =
adapter: CanvasMaskAdapter; adapter: CanvasMaskAdapter;
}; };
export class CanvasStateApi { export class CanvasStateApiModule {
store: AppStore; store: AppStore;
manager: CanvasManager; manager: CanvasManager;

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

@ -1,7 +1,7 @@
import type { JSONObject } from 'common/types'; import type { JSONObject } from 'common/types';
import { rgbaColorToString } from 'common/util/colorCodeTransformers'; import { rgbaColorToString } from 'common/util/colorCodeTransformers';
import type { CanvasManager } from 'features/controlLayers/konva/CanvasManager'; import type { CanvasManager } from 'features/controlLayers/konva/CanvasManager';
import type { CanvasPreview } from 'features/controlLayers/konva/CanvasPreview'; import type { CanvasPreviewModule } from 'features/controlLayers/konva/CanvasPreviewModule';
import { import {
BRUSH_BORDER_INNER_COLOR, BRUSH_BORDER_INNER_COLOR,
BRUSH_BORDER_OUTER_COLOR, BRUSH_BORDER_OUTER_COLOR,
@ -13,12 +13,12 @@ import { isDrawableEntity } from 'features/controlLayers/store/types';
import Konva from 'konva'; import Konva from 'konva';
import type { Logger } from 'roarr'; import type { Logger } from 'roarr';
export class CanvasTool { export class CanvasToolModule {
readonly type = 'tool_preview'; readonly type = 'tool_preview';
id: string; id: string;
path: string[]; path: string[];
parent: CanvasPreview; parent: CanvasPreviewModule;
manager: CanvasManager; manager: CanvasManager;
log: Logger; log: Logger;
@ -48,7 +48,7 @@ export class CanvasTool {
*/ */
subscriptions: Set<() => void> = new Set(); subscriptions: Set<() => void> = new Set();
constructor(parent: CanvasPreview) { constructor(parent: CanvasPreviewModule) {
this.id = getPrefixedId(this.type); this.id = getPrefixedId(this.type);
this.parent = parent; this.parent = parent;
this.manager = this.parent.manager; this.manager = this.parent.manager;