diff --git a/frontend/realtime/src/KonvaApp/Engine.ts b/frontend/realtime/src/KonvaApp/Engine.ts index 0e6c3f271b..0e37a8f7d9 100644 --- a/frontend/realtime/src/KonvaApp/Engine.ts +++ b/frontend/realtime/src/KonvaApp/Engine.ts @@ -466,12 +466,12 @@ export class Engine { uiEvents.promptEvents.onPromptStrengthChanged(async (strength) => { this.realTimeDrawEngine.currentStrength = strength / 100.0; - this.realTimeDrawEngine.render(); + // this.realTimeDrawEngine.render(); }); uiEvents.promptEvents.onPromptTextChanged(async (prompt) => { this.realTimeDrawEngine.currentPrompt = prompt; - this.realTimeDrawEngine.render(); + // this.realTimeDrawEngine.render(); }); uiEvents.onAddShapeToEngine((shapeData) => { @@ -681,7 +681,7 @@ export class Engine { await this.realTimeDrawEngine.render(); }, }); - imageNode.kNode.zIndex(1); + this.commandManager.createNode(imageNode); } public addPaintNode( diff --git a/frontend/realtime/src/KonvaApp/RenderingPrimitives/RealTimeDrawEngine.ts b/frontend/realtime/src/KonvaApp/RenderingPrimitives/RealTimeDrawEngine.ts index 83e2c31c4f..3b919dd70c 100644 --- a/frontend/realtime/src/KonvaApp/RenderingPrimitives/RealTimeDrawEngine.ts +++ b/frontend/realtime/src/KonvaApp/RenderingPrimitives/RealTimeDrawEngine.ts @@ -138,6 +138,7 @@ export class RealTimeDrawEngine { this.drawingsLayer = new Konva.Layer({ clearBeforeDraw: true, // Ensures transparent background }); + this.mediaLayerRef.getStage()?.add(this.drawingsLayer); // to od pass in stage // Set background layer to red and media layer to green for visibility @@ -270,7 +271,7 @@ export class RealTimeDrawEngine { y: this.captureCanvas.y(), draggable: false, }); - + this.drawingsLayer.moveToTop(); this.drawingsLayer.add(currentLine); // Add to drawingsLayer isDrawing = true; }; @@ -407,6 +408,7 @@ export class RealTimeDrawEngine { this.enableDragging(); if (this.cleanupFunction) { this.cleanupFunction(); + this.cleanupFunction = null; } }