hunkim98 / dotting

Dotting is a pixel art editor component library for react
https://hunkim98.github.io/dotting/
MIT License
43 stars 12 forks source link

Remove dependency on panzoom when grid size is changed #31

Closed hunkim98 closed 1 year ago

hunkim98 commented 1 year ago

Currently if you see the grid size change part, you can see that setPanZoom is called every time.

https://github.com/hunkim98/dotting/blob/6c38fbd7c103467679a139d6ea4246b77340a3a8/src/components/Canvas/Editor.tsx#L523C5-L579

  private extendInteractionGrid(direction: ButtonDirection) {
    const interactionLayer = this.interactionLayer;
    interactionLayer.extendCapturedData(direction);
    // this.renderInteractionLayer();
    const interactionCapturedData = interactionLayer.getCapturedData()!;
    const baseRowCount = getRowCountFromData(interactionCapturedData);
    const baseColumnCount = getColumnCountFromData(interactionCapturedData);
    if (direction === ButtonDirection.TOP) {
      // ⬇️ From here
      this.setPanZoom({
        offset: {
          x: this.panZoom.offset.x,
          y:
            this.panZoom.offset.y -
            (this.gridSquareLength / 2) * this.panZoom.scale,
        },
        baseRowCount,
        baseColumnCount,
      });
     // ⬆️ To here
      this.extensionPoint.lastMousePos.y -= this.gridSquareLength / 2;
   //..
  }
}

Setting panzoom everytime causes all canvases to render because all canvases rely on the panzoom.

However changing panzoom when user changes the grid size seems quite unnecessary. Why do we need to change the panZoom when we change the grid size?

The reason such nuisance occurred is because I poorly designed the grid extension mechanism. I believe I designed it this way because I have considered users extending the grid even when their mouse has left the canvas.

Maybe a deeper analysis on this issue is necessary. Maybe we could eliminate setPanZoom method for grid size changes?

hunkim98 commented 1 year ago

After working on grid size change enhancement #4 , I realized that it is impossible to remove the dependencey on panzoom when grid size changes. This is because when grid size change occurs, the panzoom should be modified to let the grid extension point follow the mouse cursor. I will close this issue.