diff --git a/example/src/index.ts b/example/src/index.ts
index f7062bcd..374930b3 100644
--- a/example/src/index.ts
+++ b/example/src/index.ts
@@ -32,14 +32,15 @@ PIXI.settings.SCALE_MODE = PIXI.SCALE_MODES.NEAREST;
 const shroom = Shroom.create({ application, resourcePath: "./resources" });
 const room = Room.create(shroom, {
   tilemap: `
-    000000000
-    000000000
-    000000000
-    000000000
-    000000000
-    000000000
-    000000000
-    000000000
+    xxx1111111
+    xxx1111111
+    xxx1111111
+    xxx1111111
+    xxx0000000
+    0000000000
+    0000000000
+    0000000000
+    0000000000
   `,
 });
 
@@ -59,85 +60,30 @@ room.floorTexture = loadRoomTexture("./images/tile.png");
 room.wallColor = "#dbbe6e";
 room.floorColor = "#eeeeee";
 
-const furniture1 = new FloorFurniture({
-  roomX: 0,
-  roomY: 0,
-  roomZ: 0,
-  direction: 2,
-  type: "exe_table",
-});
-
-const furniture2 = new FloorFurniture({
-  roomX: 2,
-  roomY: 0,
-  roomZ: 0,
-  direction: 2,
-  type: "exe_table",
-});
-
-const furniture3 = new FloorFurniture({
-  roomX: 4,
-  roomY: 0,
-  roomZ: 0,
-  direction: 2,
-  type: "exe_table",
-});
-
 const wallFurniture1 = new WallFurniture({
   roomX: 0,
-  roomY: 1,
+  roomY: 5,
   roomZ: 0,
   direction: 2,
-  type: "window_hole",
+  type: "window_skyscraper",
 });
 
 const wallFurniture2 = new WallFurniture({
   roomX: 0,
-  roomY: 3,
-  roomZ: 0,
+  roomY: 5,
+  roomZ: 2,
   direction: 2,
-  type: "window_70s_wide",
-});
-
-const wallFurniture3 = new WallFurniture({
-  roomX: 0,
-  roomY: 5.5,
-  roomZ: 0,
-  direction: 2,
-  type: "window_grunge",
-});
-
-const wallFurniture4 = new WallFurniture({
-  roomX: 1,
-  roomY: 0,
-  roomZ: 0,
-  direction: 4,
-  type: "window_diner",
-});
-
-const wallFurniture5 = new WallFurniture({
-  roomX: 5,
-  roomY: 0,
-  roomZ: 0,
-  direction: 4,
-  type: "sf_window",
-  animation: "1",
+  type: "window_skyscraper",
 });
 
 room.addRoomObject(avatar);
-room.addRoomObject(furniture1);
 room.addRoomObject(wallFurniture1);
 room.addRoomObject(wallFurniture2);
-room.addRoomObject(wallFurniture3);
-room.addRoomObject(wallFurniture4);
-room.addRoomObject(wallFurniture5);
-room.addRoomObject(furniture2);
-room.addRoomObject(furniture3);
-
 application.stage.addChild(room);
 
 const landscape = new Landscape();
 landscape.leftTexture = loadRoomTexture("./images/a1.png");
 landscape.rightTexture = loadRoomTexture("./images/a2.png");
+landscape.color = "#cccccc";
 
 room.addRoomObject(landscape);
diff --git a/package-lock.json b/package-lock.json
index f5dbc6ec..d41cbeeb 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -5166,6 +5166,14 @@
       "integrity": "sha512-nfMOlASu9OnRJo1mbEk2cz0D56a1MBNrJ7orjRZQG10XDyuvwksKbuXNp6qa+kbn839HwjwhBzhFmdsaEAfauA==",
       "dev": true
     },
+    "rxjs": {
+      "version": "6.6.3",
+      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.3.tgz",
+      "integrity": "sha512-trsQc+xYYXZ3urjOiJOuCOa5N3jAZ3eiSpQB5hIT8zGlL2QfnHLJ2r7GMkBGuIausdJN1OneaI6gQlsqNHHmZQ==",
+      "requires": {
+        "tslib": "^1.9.0"
+      }
+    },
     "safe-buffer": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
@@ -6026,6 +6034,11 @@
         "yn": "3.1.1"
       }
     },
+    "tslib": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+    },
     "tunnel-agent": {
       "version": "0.6.0",
       "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
diff --git a/package.json b/package.json
index ab836704..adaae571 100644
--- a/package.json
+++ b/package.json
@@ -28,6 +28,7 @@
     "ink": "^3.0.8",
     "node-fetch": "^2.6.1",
     "react": "^16.14.0",
+    "rxjs": "^6.6.3",
     "stream": "0.0.2",
     "timers": "^0.1.1",
     "timers-browserify": "^2.0.11",
diff --git a/src/interfaces/IRoomGeometry.ts b/src/interfaces/IRoomGeometry.ts
index d0941934..ffbf1c6d 100644
--- a/src/interfaces/IRoomGeometry.ts
+++ b/src/interfaces/IRoomGeometry.ts
@@ -5,6 +5,4 @@ export interface IRoomGeometry {
     roomZ: number,
     type: "plane" | "object" | "none"
   ): { x: number; y: number };
-
-  getMaskLevel(roomX: number, roomY: number): { roomX: number; roomY: number };
 }
diff --git a/src/interfaces/IRoomVisualization.ts b/src/interfaces/IRoomVisualization.ts
index b7189d6e..a1e74e06 100644
--- a/src/interfaces/IRoomVisualization.ts
+++ b/src/interfaces/IRoomVisualization.ts
@@ -1,3 +1,5 @@
+import { RoomLandscapeMaskSprite } from "../objects/room/RoomLandscapeMaskSprite";
+
 export interface IRoomVisualization {
   addFloorChild(element: PIXI.DisplayObject): void;
   addWallChild(element: PIXI.DisplayObject): void;
@@ -9,12 +11,20 @@ export interface IRoomVisualization {
   removeContainerChild(element: PIXI.DisplayObject): void;
 
   addCursorChild(element: PIXI.DisplayObject): void;
-  addXLevelMask(level: number, element: PIXI.Sprite): MaskNode;
-  addYLevelMask(level: number, element: PIXI.Sprite): MaskNode;
-
   addLandscape(element: PIXI.DisplayObject): void;
+
+  addMask(id: string, element: PIXI.Sprite): MaskNode;
+  subscribeRoomMeta(
+    listener: (value: RoomVisualizationMeta) => void
+  ): { unsubscribe: () => void };
 }
 
 export type MaskNode = {
   remove: () => void;
 };
+
+export type RoomVisualizationMeta = {
+  masks: Map<string, RoomLandscapeMaskSprite>;
+  wallHeight: number;
+  wallHeightWithZ: number;
+};
diff --git a/src/objects/furniture/BaseFurniture.tsx b/src/objects/furniture/BaseFurniture.tsx
index c6059cfd..1edaebc9 100644
--- a/src/objects/furniture/BaseFurniture.tsx
+++ b/src/objects/furniture/BaseFurniture.tsx
@@ -11,6 +11,8 @@ import { Asset } from "./util/parseAssets";
 import { Layer } from "./util/visualization/parseLayers";
 import { MaskNode } from "../../interfaces/IRoomVisualization";
 
+type MaskIdGetter = (direction: number) => string | undefined;
+
 export class BaseFurniture
   extends RoomObject
   implements IFurnitureEventHandlers {
@@ -93,36 +95,36 @@ export class BaseFurniture
     this.updateFurniture();
   }
 
-  public get maskLevel() {
-    return this._maskLevel;
-  }
-
-  public set maskLevel(value) {
-    this._maskLevel = value;
-    this.updateFurniture();
-  }
-
   private animatedSprites: {
     sprites: Map<string, PIXI.Sprite>;
     frames: string[];
   }[] = [];
 
-  private _maskLevel: { roomX: number; roomY: number } | undefined;
   private _maskNodes: MaskNode[] = [];
 
   private cancelTicker: (() => void) | undefined = undefined;
 
+  private _getMaskId: MaskIdGetter;
+
+  public get maskId() {
+    return this._getMaskId;
+  }
+
+  public set maskId(value) {
+    this._getMaskId = value;
+  }
+
   constructor(
     type: string,
     direction: number,
     animation: string = "0",
-    maskLevel?: { roomX: number; roomY: number }
+    getMaskId: MaskIdGetter = () => undefined
   ) {
     super();
     this._direction = direction;
     this._animation = animation;
     this._type = type;
-    this._maskLevel = maskLevel;
+    this._getMaskId = getMaskId;
   }
 
   updateFurniture() {
@@ -183,21 +185,11 @@ export class BaseFurniture
       if (sprite.kind === "simple" || sprite.kind === "mask") {
         this.sprites.push(sprite.sprite);
 
-        if (sprite.kind === "mask" && this._maskLevel != null) {
-          if (this.direction === 4) {
-            const maskNode = this.visualization.addYLevelMask(
-              this._maskLevel.roomY,
-              sprite.sprite
-            );
-
-            this._maskNodes.push(maskNode);
-          } else if (this.direction === 2) {
-            const maskNode = this.visualization.addXLevelMask(
-              this._maskLevel.roomX,
-              sprite.sprite
-            );
-
-            this._maskNodes.push(maskNode);
+        if (sprite.kind === "mask") {
+          const maskId = this.maskId(this.direction);
+
+          if (maskId != null) {
+            this.visualization.addMask(maskId, sprite.sprite);
           }
         } else {
           this.visualization.addContainerChild(sprite.sprite);
diff --git a/src/objects/furniture/WallFurniture.tsx b/src/objects/furniture/WallFurniture.tsx
index a5f1b045..52d63be5 100644
--- a/src/objects/furniture/WallFurniture.tsx
+++ b/src/objects/furniture/WallFurniture.tsx
@@ -5,9 +5,10 @@ import { getZOrder } from "../../util/getZOrder";
 import { BaseFurniture } from "./BaseFurniture";
 import { IFurniture, IFurnitureBehavior } from "./IFurniture";
 import { HitEvent } from "../../interfaces/IHitDetection";
+import { getMaskId } from "../room/util/getMaskId";
 
 export class WallFurniture extends RoomObject implements IFurniture {
-  private baseFurniture: BaseFurniture;
+  private _baseFurniture: BaseFurniture;
   private _type: string;
   private _roomX: number;
   private _roomY: number;
@@ -34,11 +35,11 @@ export class WallFurniture extends RoomObject implements IFurniture {
     this._animation = options.animation;
     this._direction = options.direction;
 
-    this.baseFurniture = new BaseFurniture(
+    this._baseFurniture = new BaseFurniture(
       options.type,
       options.direction,
       options.animation,
-      { roomX: this.roomX, roomY: this.roomY }
+      (direction) => getMaskId(direction, this.roomX, this.roomY)
     );
 
     options.behaviors?.forEach((behavior) => behavior.setParent(this));
@@ -94,27 +95,27 @@ export class WallFurniture extends RoomObject implements IFurniture {
   }
 
   public get onClick() {
-    return this.baseFurniture.onClick;
+    return this._baseFurniture.onClick;
   }
 
   public set onClick(value) {
-    this.baseFurniture.onClick = value;
+    this._baseFurniture.onClick = value;
   }
 
   public get onDoubleClick() {
-    return this.baseFurniture.onDoubleClick;
+    return this._baseFurniture.onDoubleClick;
   }
 
   public set onDoubleClick(value) {
-    this.baseFurniture.onDoubleClick = value;
+    this._baseFurniture.onDoubleClick = value;
   }
 
   private updateAnimation() {
-    this.baseFurniture.animation = this.animation;
+    this._baseFurniture.animation = this.animation;
   }
 
   private updateDirection() {
-    this.baseFurniture.direction = this.direction;
+    this._baseFurniture.direction = this.direction;
   }
 
   private getOffsets(direction: number) {
@@ -125,7 +126,7 @@ export class WallFurniture extends RoomObject implements IFurniture {
   }
 
   destroy(): void {
-    this.baseFurniture.destroy();
+    this._baseFurniture.destroy();
   }
 
   private updatePosition() {
@@ -139,19 +140,17 @@ export class WallFurniture extends RoomObject implements IFurniture {
       "object"
     );
 
-    this.baseFurniture.x = base.x + offsets.x;
-    this.baseFurniture.y = base.y + offsets.y;
-    this.baseFurniture.maskLevel = this.geometry.getMaskLevel(
-      this.roomX,
-      this.roomY
-    );
+    this._baseFurniture.x = base.x + offsets.x;
+    this._baseFurniture.y = base.y + offsets.y;
+    this._baseFurniture.maskId = (direction) =>
+      getMaskId(direction, this.roomX, this.roomY);
 
-    this.baseFurniture.zIndex =
+    this._baseFurniture.zIndex =
       getZOrder(this.roomX, this.roomZ, this.roomY) - 1;
   }
 
   registered(): void {
     this.updatePosition();
-    this.roomObjectContainer.addRoomObject(this.baseFurniture);
+    this.roomObjectContainer.addRoomObject(this._baseFurniture);
   }
 }
diff --git a/src/objects/room/ILandscape.ts b/src/objects/room/ILandscape.ts
index 41ecb5cf..e74a66d5 100644
--- a/src/objects/room/ILandscape.ts
+++ b/src/objects/room/ILandscape.ts
@@ -1,7 +1,4 @@
 import { IRoomObject } from "../../interfaces/IRoomObject";
 import { RoomLandscapeMaskSprite } from "./RoomLandscapeMaskSprite";
 
-export interface ILandscape extends IRoomObject {
-  setYLevelMasks(level: number, mask: PIXI.Sprite): void;
-  setXLevelMasks(level: number, mask: PIXI.Sprite): void;
-}
+export interface ILandscape extends IRoomObject {}
diff --git a/src/objects/room/ILandscapeContainer.ts b/src/objects/room/ILandscapeContainer.ts
index cdae0f2e..e282236a 100644
--- a/src/objects/room/ILandscapeContainer.ts
+++ b/src/objects/room/ILandscapeContainer.ts
@@ -1,6 +1,3 @@
-import { ILandscape } from "./ILandscape";
-
 export interface ILandscapeContainer {
-  setLandscape(landscape: ILandscape): void;
-  unsetLandscapeIfEquals(landscape: ILandscape): void;
+  getMaskLevel(roomX: number, roomY: number): { roomX: number; roomY: number };
 }
diff --git a/src/objects/room/Landscape.ts b/src/objects/room/Landscape.ts
index 7176130a..7d6f9230 100644
--- a/src/objects/room/Landscape.ts
+++ b/src/objects/room/Landscape.ts
@@ -2,6 +2,7 @@ import * as PIXI from "pixi.js";
 import { ParsedTileType } from "../../util/parseTileMap";
 import { RoomObject } from "../RoomObject";
 import { ILandscape } from "./ILandscape";
+import { getMaskId } from "./util/getMaskId";
 
 interface WallCollectionMeta {
   type: "rowWall" | "colWall";
@@ -14,9 +15,8 @@ export class Landscape extends RoomObject implements ILandscape {
   private _container: PIXI.Container | undefined;
   private _leftTexture: PIXI.Texture | undefined;
   private _rightTexture: PIXI.Texture | undefined;
-
-  private _xLevelMasks = new Map<number, PIXI.Sprite>();
-  private _yLevelMasks = new Map<number, PIXI.Sprite>();
+  private _wallHeight: number = 0;
+  private _wallHeightWithZ: number = 0;
 
   private _leftTexturePromise: PIXI.Texture | Promise<PIXI.Texture> | undefined;
   private _rightTexturePromise:
@@ -24,6 +24,19 @@ export class Landscape extends RoomObject implements ILandscape {
     | Promise<PIXI.Texture>
     | undefined;
 
+  private _masks: Map<string, PIXI.Sprite> = new Map();
+  private _color: string | undefined;
+
+  private _unsubscribe = () => {};
+
+  public get color() {
+    return this._color;
+  }
+
+  public set color(value) {
+    this._color = value;
+  }
+
   public get leftTexture() {
     return this._leftTexturePromise;
   }
@@ -52,18 +65,20 @@ export class Landscape extends RoomObject implements ILandscape {
     super();
   }
 
-  setYLevelMasks(level: number, mask: PIXI.Sprite): void {
-    this._yLevelMasks.set(level, mask);
-    this._initLandscapeImages();
+  private _createDefaultMask() {
+    return new PIXI.Graphics();
   }
 
-  setXLevelMasks(level: number, mask: PIXI.Sprite): void {
-    this._xLevelMasks.set(level, mask);
-    this._initLandscapeImages();
-  }
+  private _getMask(direction: number, roomX: number, roomY: number) {
+    const maskId = getMaskId(direction, roomX, roomY);
 
-  private _createDefaultMask() {
-    return new PIXI.Graphics();
+    if (maskId != null) {
+      const mask = this._masks.get(maskId);
+
+      if (mask != null) return mask;
+    }
+
+    return this._createDefaultMask();
   }
 
   private _initLandscapeImages() {
@@ -81,6 +96,22 @@ export class Landscape extends RoomObject implements ILandscape {
 
       const wall = new PIXI.Container();
 
+      const colored = new PIXI.TilingSprite(
+        PIXI.Texture.WHITE,
+        width,
+        this._wallHeightWithZ
+      );
+
+      if (this.color != null) {
+        colored.tint = parseInt(this.color.slice(1), 16);
+      } else {
+        colored.tint = 0xffffff;
+      }
+
+      colored.y = -this._wallHeightWithZ;
+
+      wall.addChild(colored);
+
       if (meta.type === "rowWall" && this._leftTexture != null) {
         const graphics = new PIXI.TilingSprite(
           this._leftTexture,
@@ -88,11 +119,10 @@ export class Landscape extends RoomObject implements ILandscape {
           this._leftTexture.height
         );
 
-        const mask =
-          this._xLevelMasks.get(meta.level) ?? this._createDefaultMask();
-        if (mask != null) {
-          wall.mask = mask;
-        }
+        const maskLevel = this.landscapeContainer.getMaskLevel(meta.level, 0);
+        const mask = this._getMask(2, maskLevel.roomX, 0);
+
+        wall.mask = mask;
 
         const position = this.geometry.getPosition(
           meta.level + 1,
@@ -108,7 +138,10 @@ export class Landscape extends RoomObject implements ILandscape {
         graphics.tilePosition = new PIXI.Point(offsetRow, 0);
 
         wall.x = position.x;
-        wall.y = position.y + 16 - this._leftTexture.height;
+        wall.y = position.y + 16;
+
+        graphics.x = 0;
+        graphics.y = -this._leftTexture.height;
 
         offsetRow += width;
 
@@ -120,11 +153,9 @@ export class Landscape extends RoomObject implements ILandscape {
           this._rightTexture.height
         );
 
-        const mask =
-          this._yLevelMasks.get(meta.level) ?? this._createDefaultMask();
-        if (mask != null) {
-          wall.mask = mask;
-        }
+        const maskLevel = this.landscapeContainer.getMaskLevel(0, meta.level);
+        const mask = this._getMask(4, 0, maskLevel.roomY);
+        wall.mask = mask;
 
         const position = this.geometry.getPosition(
           meta.start + 1,
@@ -140,7 +171,10 @@ export class Landscape extends RoomObject implements ILandscape {
         graphics.tilePosition = new PIXI.Point(offsetCol, 0);
 
         wall.x = position.x + 32;
-        wall.y = position.y - this._rightTexture.height;
+        wall.y = position.y;
+
+        graphics.x = 0;
+        graphics.y = -this._rightTexture.height;
 
         offsetCol += width;
 
@@ -156,11 +190,20 @@ export class Landscape extends RoomObject implements ILandscape {
   }
 
   destroy(): void {
-    this.landscapeContainer.unsetLandscapeIfEquals(this);
+    this._unsubscribe();
+    this._container?.destroy();
   }
 
   registered(): void {
-    this.landscapeContainer.setLandscape(this);
+    this._unsubscribe = this.visualization.subscribeRoomMeta(
+      ({ masks, wallHeightWithZ, wallHeight }) => {
+        this._masks = masks;
+        this._wallHeight = wallHeight;
+        this._wallHeightWithZ = wallHeightWithZ;
+        this._initLandscapeImages();
+      }
+    ).unsubscribe;
+
     this._initLandscapeImages();
   }
 }
diff --git a/src/objects/room/Room.ts b/src/objects/room/Room.ts
index 249bbcae..4ca56bd2 100644
--- a/src/objects/room/Room.ts
+++ b/src/objects/room/Room.ts
@@ -100,13 +100,11 @@ export class Room
   private _largestDiff: number;
 
   private _landscapeContainer: ILandscapeContainer = {
-    setLandscape: (value) => {
-      this._updateLandscape(value);
-    },
-    unsetLandscapeIfEquals: (value) => {
-      if (this._landscape === value) {
-        this._updateLandscape(undefined);
-      }
+    getMaskLevel: (roomX, roomY) => {
+      return {
+        roomX: roomX + this._maskOffsets.x,
+        roomY: roomY + this._maskOffsets.y,
+      };
     },
   };
 
@@ -138,7 +136,7 @@ export class Room
   }
 
   public get wallHeight() {
-    return this._wallHeight + this._largestDiff * 32;
+    return this._wallHeight;
   }
 
   public set wallHeight(value) {
@@ -146,8 +144,8 @@ export class Room
     this._updateWallHeight();
   }
 
-  private get wallHeightWithZ() {
-    return this._wallHeight + this._largestDiff * 32;
+  public get wallHeightWithZ() {
+    return this.wallHeight + this._largestDiff * 32;
   }
 
   public get tileHeight() {
@@ -180,7 +178,7 @@ export class Room
     this.visualization.updateRoom(this);
     this.visualization.disableCache();
     this._walls.forEach((wall) => {
-      wall.wallHeight = this.wallHeight;
+      wall.wallHeight = this.wallHeightWithZ;
     });
     this.visualization.enableCache();
   }
@@ -313,6 +311,13 @@ export class Room
       this._application.renderer
     );
 
+    console.log(
+      "ABC",
+      this.wallHeight,
+      this.wallHeightWithZ,
+      this._largestDiff
+    );
+
     this.updateTiles();
     this.addChild(this.visualization);
   }
@@ -321,13 +326,6 @@ export class Room
     return this.parsedTileMap;
   }
 
-  getMaskLevel(roomX: number, roomY: number): { roomX: number; roomY: number } {
-    return {
-      roomX: roomX + this._maskOffsets.x,
-      roomY: roomY + this._maskOffsets.y,
-    };
-  }
-
   static create(shroom: Shroom, { tilemap }: { tilemap: TileMap }) {
     return new Room({ ...shroom.dependencies, tilemap });
   }
diff --git a/src/objects/room/RoomVisualization.ts b/src/objects/room/RoomVisualization.ts
index 7bfcc876..14376583 100644
--- a/src/objects/room/RoomVisualization.ts
+++ b/src/objects/room/RoomVisualization.ts
@@ -2,9 +2,11 @@ import * as PIXI from "pixi.js";
 import {
   IRoomVisualization,
   MaskNode,
+  RoomVisualizationMeta,
 } from "../../interfaces/IRoomVisualization";
 import { RoomLandscapeMaskSprite } from "./RoomLandscapeMaskSprite";
 import { Room } from "./Room";
+import { BehaviorSubject } from "rxjs";
 
 export class RoomVisualization
   extends PIXI.Container
@@ -20,11 +22,35 @@ export class RoomVisualization
   private _landscapeContainer: PIXI.Container = new PIXI.Container();
 
   private _masksContainer = new PIXI.Container();
-  private _xLevelMask = new Map<number, RoomLandscapeMaskSprite>();
-  private _yLevelMask = new Map<number, RoomLandscapeMaskSprite>();
+
+  private _roomVisualizationMetaSubject: BehaviorSubject<RoomVisualizationMeta>;
+
+  public get masks() {
+    return this._roomVisualizationMetaSubject.value.masks;
+  }
+
+  subscribeRoomMeta(
+    listener: (value: RoomVisualizationMeta) => void
+  ): { unsubscribe: () => void } {
+    const subscription = this._roomVisualizationMetaSubject.subscribe((value) =>
+      listener(value)
+    );
+
+    return {
+      unsubscribe: () => subscription.unsubscribe(),
+    };
+  }
 
   constructor(private room: Room, private renderer: PIXI.Renderer) {
     super();
+    this._roomVisualizationMetaSubject = new BehaviorSubject({
+      masks: new Map(),
+      wallHeight: room.wallHeight,
+      wallHeightWithZ: room.wallHeightWithZ,
+    });
+
+    console.log("WHWZ", room.wallHeightWithZ, room.wallHeightWithZ);
+
     this._container.sortableChildren = true;
     this._behindWallPlane.sortableChildren = true;
 
@@ -34,8 +60,6 @@ export class RoomVisualization
     this._plane.sortableChildren = true;
     this._plane.cacheAsBitmap = true;
 
-    //this._landscape.mask = this._masksSprites;
-
     this.addChild(this._behindWallPlane);
     this.addChild(this._plane);
     this.addChild(this._masksContainer);
@@ -45,30 +69,19 @@ export class RoomVisualization
     this.addChild(this._cursorLayer);
   }
 
-  addXLevelMask(level: number, element: PIXI.Sprite): MaskNode {
-    const current =
-      this._xLevelMask.get(level) ??
-      new RoomLandscapeMaskSprite({
-        renderer: this.renderer,
-        width: this.room.roomWidth,
-        height: this.room.roomHeight,
-        wallHeight: this.room.wallHeight,
-      });
-
-    current.addSprite(element);
-    this._masksContainer.addChild(current);
-
-    this._xLevelMask.set(level, current);
-    this.updateRoom(this.room);
-
-    return {
-      remove: () => current.removeSprite(element),
-    };
+  private _updateRoomVisualizationMeta(meta: Partial<RoomVisualizationMeta>) {
+    this._roomVisualizationMetaSubject.next({
+      masks: this.masks,
+      wallHeight: this.room.wallHeight,
+      wallHeightWithZ: this.room.wallHeightWithZ,
+      ...meta,
+    });
   }
 
-  addYLevelMask(level: number, element: PIXI.Sprite): MaskNode {
+  addMask(id: string, element: PIXI.Sprite): MaskNode {
+    const existing = this.masks.get(id);
     const current =
-      this._yLevelMask.get(level) ??
+      this.masks.get(id) ??
       new RoomLandscapeMaskSprite({
         renderer: this.renderer,
         width: this.room.roomWidth,
@@ -79,8 +92,10 @@ export class RoomVisualization
     current.addSprite(element);
     this._masksContainer.addChild(current);
 
-    this._yLevelMask.set(level, current);
-    this.updateRoom(this.room);
+    if (existing == null) {
+      this.masks.set(id, current);
+      this._updateRoomVisualizationMeta({ masks: this.masks });
+    }
 
     return {
       remove: () => current.removeSprite(element),
@@ -92,13 +107,12 @@ export class RoomVisualization
   }
 
   updateRoom(room: Room) {
-    this._yLevelMask.forEach((mask, level) => {
-      mask.updateRoom(room);
-      room.landscape?.setYLevelMasks(level, mask);
-    });
-    this._xLevelMask.forEach((mask, level) => {
-      mask.updateRoom(room);
-      room.landscape?.setXLevelMasks(level, mask);
+    this.room = room;
+    this.masks.forEach((mask) => mask.updateRoom(room));
+    this._updateRoomVisualizationMeta({
+      masks: this.masks,
+      wallHeight: this.room.wallHeight,
+      wallHeightWithZ: this.room.wallHeightWithZ,
     });
   }
 
diff --git a/src/objects/room/util/getMaskId.ts b/src/objects/room/util/getMaskId.ts
new file mode 100644
index 00000000..4dfdaa82
--- /dev/null
+++ b/src/objects/room/util/getMaskId.ts
@@ -0,0 +1,11 @@
+export function getMaskId(direction: number, roomX: number, roomY: number) {
+  switch (direction) {
+    case 2:
+    case 6:
+      return `x_${roomX}`;
+
+    case 0:
+    case 4:
+      return `y_${roomY}`;
+  }
+}