egli/Example-Automerge-App
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Renamed drawing function to make clear that it deals with updates, rather than all shapes

Browse Source
This commit is contained in:
Stephan Egli 2025-01-10 18:16:57 +01:00
parent 209cff1cfb
commit ab409780d6
2 changed files with 4 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/canvasManager.js
View File

@ -11,7 +11,7 @@ const SVG_NS = "http://www.w3.org/2000/svg";
* @param {Array} shapesArray * @param {Array} shapesArray
* @param {Array} patches * @param {Array} patches
*/ */
export function drawAllShapesOnCanvas(container, shapesArray, patches = []) { export function createOrUpdateShapes(container, shapesArray, patches = []) {
if (!container || !(container instanceof SVGElement)) { if (!container || !(container instanceof SVGElement)) {
return; return;
} }

8
src/main.js
View File

@ -1,6 +1,6 @@
// main.js // main.js
import { initRepo, addCircle, addTriangle, moveShape } from "./docManager.js" import { initRepo, addCircle, addTriangle, moveShape } from "./docManager.js"
import { drawAllShapesOnCanvas } from "./canvasManager.js" import { createOrUpdateShapes } from "./canvasManager.js"
let isDragging = false; let isDragging = false;
let selectedShapeId = null; let selectedShapeId = null;
@ -26,13 +26,11 @@ const handle = initRepo()
await handle.whenReady() await handle.whenReady()
// draw current state // draw current state
drawAllShapesOnCanvas(container, handle.docSync().shapes) createOrUpdateShapes(container, handle.docSync().shapes)
// 2. Subscribe so we can re-render whenever doc changes // 2. Subscribe so we can re-render whenever doc changes
handle.on("change", (change) => { handle.on("change", (change) => {
// Only redraw if we're not currently dragging createOrUpdateShapes(container, change.doc.shapes, change.patches);
// TODO if (!isDragging) {
drawAllShapesOnCanvas(container, change.doc.shapes, change.patches);
}); });
// 3. Buttons holen // 3. Buttons holen