From c27ab133a98e8f0c1692c35eebbfb5b7f7d0e4cc Mon Sep 17 00:00:00 2001
From: cha0s <git@cha0s.io>
Date: Tue, 23 Jul 2024 17:03:12 -0500
Subject: [PATCH] fix: ECS size change

---
 app/react/components/pixi/tile-layer.jsx | 107 +++++++++++++----------
 1 file changed, 59 insertions(+), 48 deletions(-)

diff --git a/app/react/components/pixi/tile-layer.jsx b/app/react/components/pixi/tile-layer.jsx
index ac6aefe..68b4834 100644
--- a/app/react/components/pixi/tile-layer.jsx
+++ b/app/react/components/pixi/tile-layer.jsx
@@ -12,55 +12,8 @@ import {CHUNK_SIZE, RESOLUTION} from '@/util/constants.js';
 import {deferredLighting} from './lights.js';
 
 const TileLayerInternal = PixiComponent('TileLayer', {
-  create: ({group, tileLayer}) => {
+  create: () => {
     const container = new Container();
-    const {area, tileSize} = tileLayer;
-    const g = new Graphics();
-    g.beginFill(group === deferredLighting.diffuseGroup ? 0x000000 : 0x7777ff);
-    // outer frame
-    g.drawRect(
-      -RESOLUTION.x / 2,
-      -RESOLUTION.y / 2,
-      area.x * tileSize.x + RESOLUTION.x,
-      RESOLUTION.y / 2,
-    );
-    g.drawRect(
-      -RESOLUTION.x / 2,
-      -RESOLUTION.y / 2,
-      RESOLUTION.x / 2,
-      area.y * tileSize.y + RESOLUTION.y,
-    );
-    g.drawRect(
-      area.x * tileSize.x,
-      0,
-      RESOLUTION.x / 2,
-      area.y * tileSize.y,
-    );
-    g.drawRect(
-      0,
-      area.y * tileSize.y,
-      area.x * tileSize.x,
-      RESOLUTION.y / 2,
-    );
-    g.parentGroup = group;
-    container.addChild(g);
-    const cy = Math.ceil(area.y / CHUNK_SIZE);
-    const cx = Math.ceil(area.x / CHUNK_SIZE);
-    for (let iy = 0; iy < cy; ++iy) {
-      for (let ix = 0; ix < cx; ++ix) {
-        const tilemap = new CompositeTilemap();
-        const renderTexture = RenderTexture.create({
-          width: tileSize.x * CHUNK_SIZE,
-          height: tileSize.y * CHUNK_SIZE,
-        });
-        const sprite = new Sprite(renderTexture);
-        sprite.x = tileSize.x * CHUNK_SIZE * ix;
-        sprite.y = tileSize.y * CHUNK_SIZE * iy;
-        sprite.parentGroup = group;
-        sprite.tilemap = tilemap;
-        container.addChild(sprite);
-      }
-    }
     return container;
   },
   applyProps: (container, {tileLayer: oldTileLayer}, props) => {
@@ -70,6 +23,64 @@ const TileLayerInternal = PixiComponent('TileLayer', {
     if (tileLayer === oldTileLayer) {
       return;
     }
+    if (
+      !oldTileLayer
+      || (
+        oldTileLayer.area.x !== tileLayer.area.x
+        || oldTileLayer.area.y !== tileLayer.area.y
+        || oldTileLayer.tileSize.x !== tileLayer.tileSize.x
+        || oldTileLayer.tileSize.y !== tileLayer.tileSize.y
+      )
+    ) {
+      container.removeChildren();
+      const {area, tileSize} = tileLayer;
+      const g = new Graphics();
+      g.beginFill(group === deferredLighting.diffuseGroup ? 0x000000 : 0x7777ff);
+      // outer frame
+      g.drawRect(
+        -RESOLUTION.x / 2,
+        -RESOLUTION.y / 2,
+        area.x * tileSize.x + RESOLUTION.x,
+        RESOLUTION.y / 2,
+      );
+      g.drawRect(
+        -RESOLUTION.x / 2,
+        -RESOLUTION.y / 2,
+        RESOLUTION.x / 2,
+        area.y * tileSize.y + RESOLUTION.y,
+      );
+      g.drawRect(
+        area.x * tileSize.x,
+        0,
+        RESOLUTION.x / 2,
+        area.y * tileSize.y,
+      );
+      g.drawRect(
+        0,
+        area.y * tileSize.y,
+        area.x * tileSize.x,
+        RESOLUTION.y / 2,
+      );
+      g.parentGroup = group;
+      container.addChild(g);
+      const cy = Math.ceil(area.y / CHUNK_SIZE);
+      const cx = Math.ceil(area.x / CHUNK_SIZE);
+      for (let iy = 0; iy < cy; ++iy) {
+        for (let ix = 0; ix < cx; ++ix) {
+          const tilemap = new CompositeTilemap();
+          const renderTexture = RenderTexture.create({
+            width: tileSize.x * CHUNK_SIZE,
+            height: tileSize.y * CHUNK_SIZE,
+          });
+          const sprite = new Sprite(renderTexture);
+          sprite.x = tileSize.x * CHUNK_SIZE * ix;
+          sprite.y = tileSize.y * CHUNK_SIZE * iy;
+          sprite.parentGroup = group;
+          sprite.tilemap = tilemap;
+          container.addChild(sprite);
+        }
+      }
+    }
     for (const i in tileLayer.$$chunks) {
       if (!oldTileLayer || oldTileLayer.$$chunks[i] !== tileLayer.$$chunks[i]) {
         const {texture, tilemap} = container.children[parseInt(i) + 1];