@wiredsnippets/wsproom 0.0.0-stage → 2.0.0

package/dist-esm/objects/room/Pathfinding.js

@@ -0,0 +1,204 @@
+import { Avatar } from "../../";
+import * as EasyStar from "easystarjs";
+export class Pathfinding {
+    constructor(room, tilemap, furnitureData) {
+        this.grid = [];
+        this.furniGrid = [];
+        this.room = room;
+        this.furnitureData = furnitureData;
+        this.baseGrid = tilemap.map((row) => row.map((type) => (type !== "x" ? Number(type) : -1)));
+        this.calculateFurnisFilledSpace();
+        this.locateDoor();
+    }
+    locateDoor() {
+        this.baseGrid.forEach((row, i) => {
+            if (row[3] === 0) {
+                this.door = {
+                    roomX: 3,
+                    roomY: i,
+                    roomZ: 0
+                };
+            }
+        });
+    }
+    calculateFurnisFilledSpace() {
+        let grid = this.clone(this.baseGrid);
+        let furniGrid = this.resetFurniGrid();
+        const sub = async (roomObject) => {
+            if (roomObject instanceof Avatar) {
+                return;
+            }
+            // ignore wall placements
+            if (roomObject.placementType === 'wall') {
+                return;
+            }
+            const info = await this.furnitureData.getInfoForFurniture(roomObject);
+            // !info.canlayon && !info.cansiton && 
+            if (info && !info.canstandon) {
+                this.calculateFilledSpace(roomObject, info, grid, furniGrid);
+            }
+        };
+        // update navmesh at the end, so meanwhile the existing one can be used/its never empty
+        return Promise.all(Array.from(this.room.roomObjects.values()).map(sub)).then(() => {
+            this.grid = grid;
+            this.furniGrid = furniGrid;
+        });
+    }
+    calculateFilledSpace(roomObject, info, grid, furniGrid) {
+        let dimensions = {
+            x: 0,
+            y: 0,
+        };
+        switch (info.defaultdir) {
+            case 0: // up
+            case 4: // down
+                dimensions.x = info.xdim;
+                dimensions.y = info.ydim;
+                break;
+            default:
+                dimensions.x = info.ydim;
+                dimensions.y = info.xdim;
+                break;
+        }
+        switch (roomObject.direction) {
+            case 0: // up
+            case 4: // down
+                for (let y = 0; y < dimensions.y; y++) {
+                    for (let x = 0; x < dimensions.x; x++) {
+                        this.addToGrid(roomObject.roomX + x, roomObject.roomY + y, roomObject, info, grid, furniGrid);
+                    }
+                }
+                break;
+            default:
+                for (let y = 0; y < dimensions.x; y++) {
+                    for (let x = 0; x < dimensions.y; x++) {
+                        this.addToGrid(roomObject.roomX + x, roomObject.roomY + y, roomObject, info, grid, furniGrid);
+                    }
+                }
+                break;
+        }
+    }
+    resetFurniGrid() {
+        let furniGrid = [];
+        this.baseGrid.forEach((entries, y) => {
+            furniGrid[y] = [];
+            entries.forEach((useless, x) => {
+                furniGrid[y][x] = [];
+            });
+        });
+        return furniGrid;
+    }
+    addToGrid(x, y, roomObject, info, grid, furniGrid) {
+        grid[y][x] = this.determineNegativeMesh(info);
+        furniGrid[y][x].push({
+            roomObject,
+            info
+        });
+    }
+    determineNegativeMesh(info) {
+        if (info.canlayon) {
+            return -2;
+        }
+        if (info.cansiton) {
+            return -3;
+        }
+        if (info.canstandon) {
+            return -4;
+        }
+        return -1;
+    }
+    getFurnisOnTile(position) {
+        return this.furniGrid[position.roomY][position.roomX];
+    }
+    findPath(origin, target) {
+        return new Promise((resolve) => {
+            const easystar = new EasyStar.js();
+            let grid = this.grid;
+            // if the target position is a sofa or a bed
+            // set it as navigable so a path can be traced
+            if (this.grid[target.roomY][target.roomX] < -1) {
+                grid = this.clone(this.grid);
+                grid[target.roomY][target.roomX] = 0;
+            }
+            easystar.setGrid(grid);
+            easystar.setAcceptableTiles([1, 0]);
+            //easystar.enableDiagonals();
+            easystar.findPath(origin.roomX, origin.roomY, target.roomX, target.roomY, (result) => {
+                let currentPosition = {
+                    x: origin.roomX,
+                    y: origin.roomY,
+                };
+                const path = [];
+                if (!result) {
+                    resolve(path);
+                    return;
+                }
+                result.forEach((position, index) => {
+                    if (index === 0)
+                        return;
+                    const direction = this.getAvatarDirectionFromDiff(position.x - currentPosition.x, position.y - currentPosition.y);
+                    const tile = this.room.getTileAtPosition(position.x, position.y);
+                    if (tile != null) {
+                        const getHeight = () => {
+                            if (tile.type === "tile")
+                                return tile.z;
+                            if (tile.type === "stairs")
+                                return tile.z + 0.5;
+                            return 0;
+                        };
+                        path.push({
+                            roomX: position.x,
+                            roomY: position.y,
+                            roomZ: getHeight(),
+                            direction,
+                        });
+                        currentPosition = {
+                            x: position.x,
+                            y: position.y,
+                        };
+                    }
+                });
+                resolve(path);
+            });
+            easystar.calculate();
+        });
+    }
+    clone(grid) {
+        return JSON.parse(JSON.stringify(grid));
+    }
+    getAvatarDirectionFromDiff(diffX, diffY) {
+        const signX = Math.sign(diffX);
+        const signY = Math.sign(diffY);
+        switch (signX) {
+            case -1:
+                switch (signY) {
+                    case -1:
+                        return 7;
+                    case 0:
+                        return 6;
+                    case 1:
+                        return 5;
+                }
+                break;
+            case 0:
+                switch (signY) {
+                    case -1:
+                        return 0;
+                    case 1:
+                        return 4;
+                }
+                break;
+            case 1:
+                switch (signY) {
+                    case -1:
+                        return 1;
+                    case 0:
+                        return 2;
+                    case 1:
+                        return 3;
+                }
+                break;
+        }
+        throw "Invalid direction set " + [diffX, diffY].join(",");
+    }
+}

package/dist-esm/objects/room/Room.js

@@ -0,0 +1,357 @@
+import * as PIXI from "pixi.js";
+import { parseTileMapString } from "../../util/parseTileMapString";
+import { RoomObjectContainer } from "./RoomObjectContainer";
+import { RoomModelVisualization } from "./RoomModelVisualization";
+import { ParsedTileMap } from "./ParsedTileMap";
+import { getTileColors, getWallColors } from "./util/getTileColors";
+import { EventManager } from "../events/EventManager";
+import { Subject } from "rxjs";
+export class Room extends PIXI.Container {
+    get onActiveTileChange() {
+        return this._activeTileSubject.asObservable();
+    }
+    get onActiveWallChange() {
+        return this._activeWallSubject.asObservable();
+    }
+    constructor({ animationTicker, avatarLoader, furnitureLoader, tilemap, configuration, application, }) {
+        super();
+        this._activeTileSubject = new Subject();
+        this._activeWallSubject = new Subject();
+        const normalizedTileMap = typeof tilemap === "string" ? parseTileMapString(tilemap) : tilemap;
+        this._application = application;
+        this._animationTicker = animationTicker;
+        this._furnitureLoader = furnitureLoader;
+        this._avatarLoader = avatarLoader;
+        this._eventManager = new EventManager();
+        this._configuration = configuration;
+        this.application = application;
+        this._visualization = new RoomModelVisualization(this._eventManager, this.application, new ParsedTileMap(normalizedTileMap));
+        this._roomObjectContainer = new RoomObjectContainer();
+        this._roomObjectContainer.context = {
+            geometry: this,
+            visualization: this._visualization,
+            animationTicker: this._animationTicker,
+            furnitureLoader: this._furnitureLoader,
+            roomObjectContainer: this,
+            avatarLoader: this._avatarLoader,
+            eventManager: this._eventManager,
+            configuration: this._configuration,
+            tilemap: this,
+            landscapeContainer: this._visualization,
+            application: this._application,
+            room: this,
+        };
+        this.addChild(this._visualization);
+        this._resubscribeVisualization();
+    }
+    /**
+     * The room exposes its own subjects, so a visualization swap (changeTileMap)
+     * stays invisible to whoever subscribed to the room.
+     */
+    _resubscribeVisualization() {
+        var _a, _b, _c;
+        (_a = this._activeTileSubscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
+        this._activeTileSubscription = this._visualization.onActiveTileChange.subscribe((pos) => this._activeTileSubject.next(pos));
+        (_b = this._activeWallSubscription) === null || _b === void 0 ? void 0 : _b.unsubscribe();
+        this._activeWallSubscription = this._visualization.onActiveWallChange.subscribe((spot) => this._activeWallSubject.next(spot));
+        (_c = this._tileClickSubscription) === null || _c === void 0 ? void 0 : _c.unsubscribe();
+        this._tileClickSubscription = this._visualization.onTileClick.subscribe((value) => this.onTileClick && this.onTileClick(value.position, value.event));
+    }
+    /**
+     * Creates a new room.
+     * @param wsproom A wsproom instance
+     * @param options Room creation options
+     */
+    static create(wsproom, { tilemap }) {
+        return new Room({ ...wsproom.dependencies, tilemap });
+    }
+    /**
+     * Room objects which are attached to the room.
+     */
+    get roomObjects() {
+        return this._roomObjectContainer.roomObjects;
+    }
+    /**
+     * When set to true, hides the walls
+     */
+    get hideWalls() {
+        return this._visualization.hideWalls;
+    }
+    set hideWalls(value) {
+        this._visualization.hideWalls = value;
+    }
+    /**
+     * When set to true, hide the floor. This will also hide the walls.
+     */
+    get hideFloor() {
+        return this._visualization.hideFloor;
+    }
+    set hideFloor(value) {
+        this._visualization.hideFloor = value;
+    }
+    get hideTileCursor() {
+        return this._visualization.hideTileCursor;
+    }
+    set hideTileCursor(value) {
+        this._visualization.hideTileCursor = value;
+    }
+    /**
+     * Height of the walls in the room.
+     */
+    get wallHeight() {
+        return this._visualization.wallHeight;
+    }
+    set wallHeight(value) {
+        this._visualization.wallHeight = value;
+    }
+    /**
+     * Height of the tile
+     */
+    get tileHeight() {
+        return this._visualization.tileHeight;
+    }
+    set tileHeight(value) {
+        this._visualization.tileHeight = value;
+    }
+    /**
+     * Depth of the wall
+     */
+    get wallDepth() {
+        return this._visualization.wallDepth;
+    }
+    set wallDepth(value) {
+        this._visualization.wallDepth = value;
+    }
+    /**
+     * A callback which is called with the tile position when a tile is clicked.
+     */
+    get onTileClick() {
+        return this._onTileClick;
+    }
+    set onTileClick(value) {
+        this._onTileClick = value;
+    }
+    /**
+     * Texture of the wall.
+     */
+    get wallTexture() {
+        return this._wallTexture;
+    }
+    set wallTexture(value) {
+        this._wallTexture = value;
+        this._loadWallTextures();
+    }
+    /**
+     * Texture of the floor.
+     */
+    get floorTexture() {
+        return this._floorTexture;
+    }
+    set floorTexture(value) {
+        this._floorTexture = value;
+        this._loadFloorTextures();
+    }
+    /**
+     * Color of the wall.
+     */
+    get wallColor() {
+        return this._wallColor;
+    }
+    set wallColor(value) {
+        this._wallColor = value;
+        this._updateWallColor();
+    }
+    /**
+     * Color of the floor.
+     */
+    get floorColor() {
+        return this._floorColor;
+    }
+    set floorColor(value) {
+        this._floorColor = value;
+        this._updateTileColor();
+    }
+    /**
+     * Height of the room.
+     */
+    get roomHeight() {
+        return this._visualization.rectangle.height;
+    }
+    /**
+     * Width of the room.
+     */
+    get roomWidth() {
+        return this._visualization.rectangle.width;
+    }
+    get visualization() {
+        return this._visualization;
+    }
+    get eventManager() {
+        return this._eventManager;
+    }
+    changeTileMap(tileMap) {
+        const currentObjects = [...this._roomObjectContainer.roomObjects];
+        const newVisualization = new RoomModelVisualization(this._eventManager, this.application, new ParsedTileMap(tileMap));
+        [
+            "hideWalls",
+            "hideFloor",
+            "hideTileCursor",
+            "wallDepth",
+            "tileHeight",
+            "wallHeight",
+            "wallTexture",
+            "floorTexture",
+            "wallLeftColor",
+            "wallRightColor",
+            "wallTopColor",
+            "tileLeftColor",
+            "tileRightColor",
+            "tileTopColor"
+        ].forEach(property => {
+            // @ts-ignore
+            newVisualization[property] = this._visualization[property];
+        });
+        this._eventManager.reset();
+        this.removeChildAt(0);
+        this._visualization.destroy();
+        this._visualization = newVisualization;
+        this.addChild(this._visualization);
+        this._resubscribeVisualization();
+        if (this._roomObjectContainer.context) {
+            this._roomObjectContainer.context.visualization = this._visualization;
+            this._roomObjectContainer.context.landscapeContainer = this._visualization;
+        }
+        currentObjects.forEach(object => {
+            this._roomObjectContainer.removeRoomObject(object);
+            this.addRoomObject(object);
+        });
+    }
+    getParsedTileTypes() {
+        return this._visualization.parsedTileMap.parsedTileTypes;
+    }
+    getTileMap() {
+        return this._visualization.parsedTileMap.getRawTileMap();
+    }
+    getWallOffsets() {
+        return this._visualization.parsedTileMap.wallOffsets;
+    }
+    setTileAt(x, y, type) {
+        const current = this.getTileMap();
+        if (y < 0 || y >= current.length)
+            return;
+        if (x < 0 || x >= current[y].length)
+            return;
+        current[y][x] = type;
+        this.changeTileMap(current);
+    }
+    resizeTileMap(cols, rows) {
+        var _a;
+        const current = this.getTileMap();
+        const currentRows = current.length;
+        const currentCols = currentRows > 0 ? current[0].length : 0;
+        const resized = [];
+        for (let y = 0; y < rows; y++) {
+            const newRow = [];
+            for (let x = 0; x < cols; x++) {
+                if (y < currentRows && x < currentCols) {
+                    newRow.push(current[y][x]);
+                }
+                else {
+                    // Preserve wall structure: first row and first col are walls
+                    const isWallRow = y === 0;
+                    const isWallCol = x === 0 && y > 0 && (currentRows === 0 || ((_a = current[y < currentRows ? y : 0]) === null || _a === void 0 ? void 0 : _a[0]) === "x");
+                    newRow.push(isWallRow || isWallCol ? "x" : "0");
+                }
+            }
+            resized.push(newRow);
+        }
+        this.changeTileMap(resized);
+    }
+    getTileMapString() {
+        return this.getTileMap().map((row) => row.join("")).join("\n");
+    }
+    /**
+     * Adds and registers a room object to a room.
+     * @param object The room object to attach
+     */
+    addRoomObject(object) {
+        this._roomObjectContainer.addRoomObject(object);
+    }
+    /**
+     * Removes and destroys a room object from the room.
+     * @param object The room object to remove
+     */
+    removeRoomObject(object) {
+        this._roomObjectContainer.removeRoomObject(object);
+    }
+    getPosition(roomX, roomY, roomZ) {
+        return this._visualization.getScreenPosition(roomX, roomY, roomZ);
+    }
+    getTileAtPosition(roomX, roomY) {
+        const { x, y } = this._getObjectPositionWithOffset(roomX, roomY);
+        const row = this._visualization.parsedTileMap.parsedTileTypes[y];
+        if (row == null)
+            return;
+        if (row[x] == null)
+            return;
+        return row[x];
+    }
+    destroy() {
+        var _a, _b, _c;
+        super.destroy();
+        this.roomObjects.forEach((object) => this.removeRoomObject(object));
+        (_a = this._activeTileSubscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
+        (_b = this._activeWallSubscription) === null || _b === void 0 ? void 0 : _b.unsubscribe();
+        (_c = this._tileClickSubscription) === null || _c === void 0 ? void 0 : _c.unsubscribe();
+        this._visualization.destroy();
+    }
+    set onBackgroundClick(value) {
+        this._eventManager.onBackgroundClick = value;
+    }
+    _getObjectPositionWithOffset(roomX, roomY) {
+        return {
+            x: roomX,
+            y: roomY,
+        };
+    }
+    _loadWallTextures() {
+        Promise.resolve(this.wallTexture).then((texture) => {
+            this._currentWallTexture = texture;
+            this._visualization.wallTexture = texture;
+        });
+    }
+    _loadFloorTextures() {
+        Promise.resolve(this.floorTexture).then((texture) => {
+            this._visualization.floorTexture = texture;
+        });
+    }
+    _updateWallColor() {
+        const wallColors = getWallColors(this._getWallColor());
+        this._visualization.wallLeftColor = wallColors.rightTint;
+        this._visualization.wallRightColor = wallColors.leftTint;
+        this._visualization.wallTopColor = wallColors.topTint;
+    }
+    _updateTileColor() {
+        if (this._floorColor != null) {
+            const tileColors = getTileColors(this._floorColor);
+            this._visualization.tileTopColor = tileColors.tileTint;
+            this._visualization.tileLeftColor = tileColors.borderRightTint;
+            this._visualization.tileRightColor = tileColors.borderLeftTint;
+        }
+        else {
+            this._visualization.tileTopColor = undefined;
+            this._visualization.tileLeftColor = undefined;
+            this._visualization.tileRightColor = undefined;
+        }
+    }
+    _getWallColor() {
+        var _a;
+        if (this.wallColor == null && this._currentWallTexture != null) {
+            return "#ffffff";
+        }
+        if (this.wallColor == null && this._currentWallTexture == null) {
+            return "#b6b8c7";
+        }
+        return (_a = this.wallColor) !== null && _a !== void 0 ? _a : "#ffffff";
+    }
+}