feat: 楼层贴图 & fix: 背景前景改变

public/libs/maps.js

@@ -3629,6 +3629,15 @@ maps.prototype.setBgFgBlock = function (name, number, x, y, floorId) {
         if (name.startsWith('bg')) core.drawBg(floorId);
         else core.drawFg(floorId);
     }
+
+    Mota.require('var', 'hook').emit(
+        'setBgFgBlock',
+        name,
+        number,
+        x,
+        y,
+        floorId
+    );
 };
 
 ////// 重置地图 //////

src/core/render/preset/floor.ts

@@ -39,6 +39,21 @@ hook.on('changingFloor', floor => {
         if (v.bindThisFloor) v.updateBindData();
     });
 });
+hook.on('setBgFgBlock', (name, number, x, y, floor) => {
+    const isNow = floor === core.status.floorId;
+    LayerGroupFloorBinder.activedBinder.forEach(v => {
+        if (floor === v.floor || (isNow && v.bindThisFloor)) {
+            v.setBlock(name, number, x, y);
+        }
+    });
+    LayerFloorBinder.listenedBinder.forEach(v => {
+        if (v.layer.layer === name) {
+            if (v.floor === floor || (isNow && v.bindThisFloor)) {
+                v.setBlock(number, x, y);
+            }
+        }
+    });
+});
 
 interface LayerGroupBinderEvent {
     update: [floor: FloorIds];
@@ -254,6 +269,7 @@ export class LayerFloorBinder implements ILayerRenderExtends {
         core.extractBlocks(floor);
         const map = core.status.maps[floor];
         this.layer.setMapSize(map.width, map.height);
+        const image = core.status.maps[this.getFloor()].images;
         if (this.layer.layer === 'event') {
             const m = map.map;
             this.layer.putRenderData(m.flat(), map.width, 0, 0);
@@ -265,6 +281,8 @@ export class LayerFloorBinder implements ILayerRenderExtends {
             // 别忘了背景图块
             this.layer.setBackground(texture.idNumberMap[map.defaultGround]);
         }
+        const toDraw = image?.filter(v => v.canvas === this.layer.layer);
+        this.layer.setFloorImage(toDraw ?? []);
     }
 
     awake(layer: Layer) {

src/core/render/preset/layer.ts

@@ -551,6 +551,8 @@ export class Layer extends Container {
     background: AllNumbers = 0;
     /** 背景图块画布 */
     backImage: HTMLCanvasElement[] = [];
+    /** 背景贴图 */
+    floorImage: FloorAnimate[] = [];
 
     /** 分块信息 */
     block: BlockCacher<LayerCacheItem> = new BlockCacher(0, 0, core._WIDTH_, 4);
@@ -676,6 +678,14 @@ export class Layer extends Container {
         );
     }
 
+    /**
+     * 设置楼层贴图
+     */
+    setFloorImage(image: FloorAnimate[]) {
+        this.floorImage = image;
+        this.update();
+    }
+
     /**
      * 设置背景图块
      * @param background 背景图块
@@ -1076,6 +1086,16 @@ export class Layer extends Container {
                 );
             });
         }
+
+        if (this.floorImage.length > 0) {
+            const images = core.material.images.images;
+            this.floorImage.forEach(v => {
+                if (v.disable) return;
+                const { x, y } = v;
+                ctx.fillRect(0, 0, 480, 480);
+                ctx.drawImage(images[v.name], x, y);
+            });
+        }
     }
 
     /**
@@ -1088,8 +1108,6 @@ export class Layer extends Container {
         const blockSize = this.block.blockSize;
         const { ctx } = this.staticMap;
 
-        ctx.save();
-
         const [a, b, , c, d, , e, f] = transform.mat;
         ctx.setTransform(a, b, c, d, e, f);
 
@@ -1167,8 +1185,6 @@ export class Layer extends Container {
                 symbol: temp.symbol
             });
         });
-
-        ctx.restore();
     }
 
     /**
@@ -1180,7 +1196,6 @@ export class Layer extends Container {
         const halfCell = cell / 2;
         const { ctx } = this.movingMap;
 
-        ctx.save();
         const mat = transform.mat;
         const [a, b, , c, d, , e, f] = mat;
         ctx.setTransform(a, b, c, d, e, f);
@@ -1209,8 +1224,6 @@ export class Layer extends Container {
 
             ctx.drawImage(image, sx, sy, w, h, px, py, w, h);
         });
-
-        ctx.restore();
     }
 
     /**

src/game/game.ts

@@ -93,6 +93,14 @@ export interface GameEvent {
     enemyExtract: [col: EnemyCollection];
     /** Emitted in lib/events.js restart */
     restart: [];
+    /** Emitted in lib/maps.js setBgFgBlock */
+    setBgFgBlock: [
+        name: 'bg' | 'fg' | 'bg2' | 'fg2',
+        number: AllNumbers,
+        x: number,
+        y: number,
+        floorId: FloorIds
+    ];
 }
 
 export const hook = new EventEmitter<GameEvent>();

src/types/map.d.ts

@@ -125,7 +125,7 @@ interface FloorBase<T extends FloorIds = FloorIds> {
     /**
      * 楼层贴图
      */
-    image: FloorAnimate[];
+    images: FloorAnimate[];
 
     /**
      * 楼层名称